Adds @container support

.gitignore

@@ -1 +1,2 @@
 node_modules
+.DS_Store

lib/parse/index.js

@@ -489,6 +489,72 @@ module.exports = function(css, options){
     });
   }
 
+
+  /**
+   * Parse layer.
+   */
+
+  function atlayer() {
+    const pos = position()
+    const m = match(/^@layer *([^{;@]+)/)
+
+    if (!m) {
+      return
+    }
+    const layer = trim(m[1])
+
+    if (!open()) {
+      match(/^[;\s]*/)
+      return pos({
+        type: 'layer',
+        layer: layer
+      })
+    }
+
+    const style = comments().concat(rules())
+
+    if (!close()) {
+      return error("@layer missing '}'")
+    }
+
+    return pos({
+      type: 'layer',
+      layer: layer,
+      rules: style
+    })
+  }
+
+
+  /**
+   * Parse container.
+   */
+
+  function atcontainer() {
+    const pos = position()
+    const m = match(/^@container *([^{]+)/)
+
+    if (!m) {
+      return
+    }
+    const container = trim(m[1])
+
+    if (!open()) {
+      return error("@container missing '{'")
+    }
+
+    const style = comments().concat(rules())
+
+    if (!close()) {
+      return error("@container missing '}'")
+    }
+
+    return pos({
+      type: 'container',
+      container: container,
+      rules: style
+    })
+  }
+
   /**
    * Parse import
    */
@@ -541,7 +607,9 @@ module.exports = function(css, options){
       || atdocument()
       || atpage()
       || athost()
-      || atfontface();
+      || atfontface()
+      || atcontainer()
+      || atlayer();
   }
 
   /**

lib/stringify/compress.js

@@ -197,3 +197,30 @@ Compiler.prototype.declaration = function(node){
   return this.emit(node.property + ':' + node.value, node.position) + this.emit(';');
 };
 
+/**
+ * Visit container node.
+ */
+
+Compiler.prototype.container = function(node) {
+  return (
+    this.emit('@container ' + node.container, node.position) +
+    this.emit('{') +
+    this.mapVisit(node.rules) +
+    this.emit('}')
+  )
+}
+
+/**
+ * Visit layer node.
+ */
+
+Compiler.prototype.layer = function(node) {
+  return (
+    this.emit('@layer ' + node.layer, node.position) +
+    (node.rules
+      ? this.emit('{') +
+        this.mapVisit(node.rules) +
+        this.emit('}')
+      : ';')
+  );
+};

lib/stringify/identity.js

@@ -211,6 +211,19 @@ Compiler.prototype['custom-media'] = function(node){
   return this.emit('@custom-media ' + node.name + ' ' + node.media + ';', node.position);
 };
 
+/**
+ * Visit container node.
+ */
+
+Compiler.prototype.container = function(node) {
+  return (
+    this.emit(this.indent() + '@container ' + node.container, node.position) +
+    this.emit(' {\n' + this.indent(1)) +
+    this.mapVisit(node.rules, '\n\n') +
+    this.emit('\n' + this.indent(-1) + this.indent() + '}')
+  )
+}
+
 /**
  * Visit rule node.
  */
@@ -238,6 +251,21 @@ Compiler.prototype.declaration = function(node){
     + this.emit(';');
 };
 
+/**
+ * Visit layer node.
+ */
+
+Compiler.prototype.layer = function(node) {
+  return (
+    this.emit(this.indent() + '@layer ' + node.layer, node.position) +
+    (node.rules
+      ? this.emit(' {\n' + this.indent(1)) +
+        this.mapVisit(node.rules, '\n\n') +
+        this.emit('\n' + this.indent(-1) + this.indent() + '}')
+      : ';')
+  );
+};
+
 /**
  * Increase, decrease or return current indentation.
  */