@getflip/swirl-components 0.118.4 → 0.119.0

package/dist/collection/components/swirl-box/swirl-box.js

@@ -10,9 +10,11 @@ export class SwirlBox {
     this.borderedBlockStart = undefined;
     this.borderedInlineEnd = undefined;
     this.borderedInlineStart = undefined;
+    this.bottom = undefined;
     this.centerBlock = undefined;
     this.centerInline = undefined;
     this.cover = undefined;
+    this.left = undefined;
     this.maxWidth = undefined;
     this.overflow = "visible";
     this.padding = "0";
@@ -20,13 +22,19 @@ export class SwirlBox {
     this.paddingBlockStart = undefined;
     this.paddingInlineEnd = undefined;
     this.paddingInlineStart = undefined;
+    this.position = undefined;
+    this.right = undefined;
+    this.top = undefined;
+    this.zIndex = undefined;
   }
   render() {
     const styles = {
       alignItems: this.centerBlock ? "center" : undefined,
+      bottom: this.bottom,
       display: this.centerBlock || this.centerInline ? "flex" : undefined,
       height: this.cover ? "100%" : undefined,
       justifyContent: this.centerInline ? "center" : undefined,
+      left: this.left,
       overflow: this.overflow,
       padding: `var(--s-space-${this.padding})`,
       paddingBlockEnd: Boolean(this.paddingBlockEnd)
@@ -41,9 +49,14 @@ export class SwirlBox {
       paddingInlineStart: Boolean(this.paddingInlineStart)
         ? `var(--s-space-${this.paddingInlineStart})`
         : undefined,
-      position: Boolean(this.overflow) ? "relative" : "",
+      position: Boolean(this.overflow)
+        ? this.position || "relative"
+        : this.position,
       maxWidth: this.maxWidth,
+      right: this.right,
+      top: this.top,
       width: this.cover ? "100%" : undefined,
+      zIndex: this.zIndex,
     };
     const className = classnames("box", {
       "box--bordered": this.bordered,
@@ -154,6 +167,23 @@ export class SwirlBox {
         "attribute": "bordered-inline-start",
         "reflect": false
       },
+      "bottom": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "bottom",
+        "reflect": false
+      },
       "centerBlock": {
         "type": "boolean",
         "mutable": false,
@@ -205,6 +235,23 @@ export class SwirlBox {
         "attribute": "cover",
         "reflect": false
       },
+      "left": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "left",
+        "reflect": false
+      },
       "maxWidth": {
         "type": "string",
         "mutable": false,
@@ -355,6 +402,79 @@ export class SwirlBox {
         },
         "attribute": "padding-inline-start",
         "reflect": false
+      },
+      "position": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "SwirlBoxPosition",
+          "resolved": "\"absolute\" | \"fixed\" | \"relative\" | \"static\" | \"sticky\"",
+          "references": {
+            "SwirlBoxPosition": {
+              "location": "local",
+              "path": "/home/runner/work/swirl/swirl/packages/swirl-components/src/components/swirl-box/swirl-box.tsx"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "position",
+        "reflect": false
+      },
+      "right": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "right",
+        "reflect": false
+      },
+      "top": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "top",
+        "reflect": false
+      },
+      "zIndex": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "z-index",
+        "reflect": false
       }
     };
   }

package/dist/collection/components/swirl-shell-layout/swirl-shell-layout.css

@@ -19,6 +19,7 @@
 
 .shell-layout {
   display: grid;
+  overflow: hidden;
   width: 100%;
   min-height: 100%;
   background-color: var(--swirl-shell-background);