@tmorrow/cre8-wc 2.3.5 → 2.3.9

package/dist/assets/{layout.stories-R1vAqdU8.js → layout.stories-a4-Bl_nZ.js}

@@ -1,5 +1,5 @@
-import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";import{s as b}from"./spread-Cc0YLoqh.js";import{C as x,n as c}from"./cre8-element-D4jUl3yv.js";import"./preload-helper-PPVm8Dsz.js";import"./if-defined-Bh0SnORx.js";import"./_commonjsHelpers-DaWZu8wl.js";const w=f`.cre8-u-content-knockout-brand {
-  color: var(----cre8-color-content-knockout-brand);
+import{a as f,b as m}from"./iframe-DDPT8KPE.js";import"./f-po-B5bw1GSj.js";import{s as b}from"./spread-B6c5bbZ0.js";import{C as x,n as c}from"./cre8-element-D6gzFubi.js";import"./preload-helper-PPVm8Dsz.js";import"./if-defined-D9Db4BBK.js";import"./_commonjsHelpers-DaWZu8wl.js";const w=f`.cre8-u-content-knockout-brand {
+  color: var(--cre8-color-content-knockout-brand);
 }
 
 .cre8-u-is-hidden {
@@ -72,23 +72,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-margin-sm {
-  margin: size(1) !important;
+  margin: 0.5rem !important;
 }
 
 .cre8-u-margin-md {
-  margin: size(2) !important;
+  margin: 1rem !important;
 }
 
 .cre8-u-margin-lg {
-  margin: size(3) !important;
+  margin: 1.5rem !important;
 }
 
 .cre8-u-margin-xl {
-  margin: size(4) !important;
+  margin: 2rem !important;
 }
 
 .cre8-u-margin-xxl {
-  margin: size(8) !important;
+  margin: 4rem !important;
 }
 
 .cre8-u-margin-top-none {
@@ -96,23 +96,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-margin-top-sm {
-  margin-top: size(1) !important;
+  margin-top: 0.5rem !important;
 }
 
 .cre8-u-margin-top-md {
-  margin-top: size(2) !important;
+  margin-top: 1rem !important;
 }
 
 .cre8-u-margin-top-lg {
-  margin-top: size(3) !important;
+  margin-top: 1.5rem !important;
 }
 
 .cre8-u-margin-top-xl {
-  margin-top: size(4) !important;
+  margin-top: 2rem !important;
 }
 
 .cre8-u-margin-top-xxl {
-  margin-top: size(8) !important;
+  margin-top: 4rem !important;
 }
 
 .cre8-u-margin-right-none {
@@ -120,23 +120,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-margin-right-sm {
-  margin-right: size(1) !important;
+  margin-right: 0.5rem !important;
 }
 
 .cre8-u-margin-right-md {
-  margin-right: size(2) !important;
+  margin-right: 1rem !important;
 }
 
 .cre8-u-margin-right-lg {
-  margin-right: size(3) !important;
+  margin-right: 1.5rem !important;
 }
 
 .cre8-u-margin-right-xl {
-  margin-right: size(4) !important;
+  margin-right: 2rem !important;
 }
 
 .cre8-u-margin-right-xxl {
-  margin-right: size(8) !important;
+  margin-right: 4rem !important;
 }
 
 .cre8-u-margin-bottom-none {
@@ -144,32 +144,32 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-margin-bottom-sm {
-  margin-bottom: size(1) !important;
+  margin-bottom: 0.5rem !important;
 }
 
 .cre8-u-margin-bottom-md {
-  margin-bottom: size(2) !important;
+  margin-bottom: 1rem !important;
 }
 
 .cre8-u-margin-bottom-lg {
-  margin-bottom: size(3) !important;
+  margin-bottom: 1.5rem !important;
 }
 
 .cre8-u-margin-bottom-xl {
-  margin-bottom: size(4) !important;
+  margin-bottom: 2rem !important;
 }
 
 .cre8-u-margin-bottom-xxl {
-  margin-bottom: size(8) !important;
+  margin-bottom: 4rem !important;
 }
 
 .cre8-u-margin-bottom-xl-xxl {
-  margin-bottom: size(4) !important;
+  margin-bottom: 2rem !important;
 }
 
 @media all and (min-width: 768px) {
   .cre8-u-margin-bottom-xl-xxl {
-    margin-bottom: size(8) !important;
+    margin-bottom: 4rem !important;
   }
 }
 .cre8-u-margin-left-none {
@@ -177,23 +177,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-margin-left-sm {
-  margin-left: size(1) !important;
+  margin-left: 0.5rem !important;
 }
 
 .cre8-u-margin-left-md {
-  margin-left: size(2) !important;
+  margin-left: 1rem !important;
 }
 
 .cre8-u-margin-left-lg {
-  margin-left: size(3) !important;
+  margin-left: 1.5rem !important;
 }
 
 .cre8-u-margin-left-xl {
-  margin-left: size(4) !important;
+  margin-left: 2rem !important;
 }
 
 .cre8-u-margin-left-xxl {
-  margin-left: size(8) !important;
+  margin-left: 4rem !important;
 }
 
 .cre8-u-padding-none {
@@ -201,23 +201,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-padding-sm {
-  padding: size(1) !important;
+  padding: 0.5rem !important;
 }
 
 .cre8-u-padding-md {
-  padding: size(2) !important;
+  padding: 1rem !important;
 }
 
 .cre8-u-padding-lg {
-  padding: size(3) !important;
+  padding: 1.5rem !important;
 }
 
 .cre8-u-padding-xl {
-  padding: size(4) !important;
+  padding: 2rem !important;
 }
 
 .cre8-u-padding-xxl {
-  padding: size(8) !important;
+  padding: 4rem !important;
 }
 
 .cre8-u-padding-top-none {
@@ -225,23 +225,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-padding-top-sm {
-  padding-top: size(1) !important;
+  padding-top: 0.5rem !important;
 }
 
 .cre8-u-padding-top-md {
-  padding-top: size(2) !important;
+  padding-top: 1rem !important;
 }
 
 .cre8-u-padding-top-lg {
-  padding-top: size(3) !important;
+  padding-top: 1.5rem !important;
 }
 
 .cre8-u-padding-top-xl {
-  padding-top: size(4) !important;
+  padding-top: 2rem !important;
 }
 
 .cre8-u-padding-top-xxl {
-  padding-top: size(8) !important;
+  padding-top: 4rem !important;
 }
 
 .cre8-u-padding-right-none {
@@ -249,23 +249,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-padding-right-sm {
-  padding-right: size(1) !important;
+  padding-right: 0.5rem !important;
 }
 
 .cre8-u-padding-right-md {
-  padding-right: size(2) !important;
+  padding-right: 1rem !important;
 }
 
 .cre8-u-padding-right-lg {
-  padding-right: size(3) !important;
+  padding-right: 1.5rem !important;
 }
 
 .cre8-u-padding-right-xl {
-  padding-right: size(4) !important;
+  padding-right: 2rem !important;
 }
 
 .cre8-u-padding-right-xxl {
-  padding-right: size(8) !important;
+  padding-right: 4rem !important;
 }
 
 .cre8-u-padding-bottom-none {
@@ -273,23 +273,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-padding-bottom-sm {
-  padding-bottom: size(1) !important;
+  padding-bottom: 0.5rem !important;
 }
 
 .cre8-u-padding-bottom-md {
-  padding-bottom: size(2) !important;
+  padding-bottom: 1rem !important;
 }
 
 .cre8-u-padding-bottom-lg {
-  padding-bottom: size(3) !important;
+  padding-bottom: 1.5rem !important;
 }
 
 .cre8-u-padding-bottom-xl {
-  padding-bottom: size(4) !important;
+  padding-bottom: 2rem !important;
 }
 
 .cre8-u-padding-bottom-xxl {
-  padding-bottom: size(8) !important;
+  padding-bottom: 4rem !important;
 }
 
 .cre8-u-padding-left-none {
@@ -297,23 +297,23 @@ import{a as f,b as d}from"./iframe-DgoqrgRr.js";import"./f-po-CDPxLfff.js";impor
 }
 
 .cre8-u-padding-left-sm {
-  padding-left: size(1) !important;
+  padding-left: 0.5rem !important;
 }
 
 .cre8-u-padding-left-md {
-  padding-left: size(2) !important;
+  padding-left: 1rem !important;
 }
 
 .cre8-u-padding-left-lg {
-  padding-left: size(3) !important;
+  padding-left: 1.5rem !important;
 }
 
 .cre8-u-padding-left-xl {
-  padding-left: size(4) !important;
+  padding-left: 2rem !important;
 }
 
 .cre8-u-padding-left-xxl {
-  padding-left: size(8) !important;
+  padding-left: 4rem !important;
 }
 
 .cre8-u-display-flex {
@@ -329,7 +329,6 @@ body {
   font-size: var(--cre8-typography-body-default-font-size);
   font-weight: var(--cre8-typography-body-default-font-weight);
   line-height: var(--cre8-typography-body-default-line-height);
-  -webkit-text-decoration: var(--cre8-typography-body-default-text-decoration);
   text-decoration: var(--cre8-typography-body-default-text-decoration);
   text-transform: var(--cre8-typography-body-default-text-transform);
   display: flex;
@@ -337,7 +336,7 @@ body {
   padding: 0;
   margin: 0;
   color: var(--cre8-color-content-default);
-  background: var(--background-default);
+  background: var(--cre8-color-bg-default);
 }
 
 @media all and (min-width: 60rem) {
@@ -606,12 +605,12 @@ span.ripple {
  */
 .cre8-c-layout-section--full-height {
   height: 100%;
-}`;var z=Object.defineProperty,g=(i,e,n,y)=>{for(var t=void 0,a=i.length-1,o;a>=0;a--)(o=i[a])&&(t=o(e,n,t)||t);return t&&z(e,n,t),t};const u=class u extends x{constructor(){super(...arguments),this.top="1rem"}render(){const e=this.componentClassNames("cre8-c-layout-section",{"cre8-c-layout-section--sticky":this.behavior==="sticky","cre8-c-layout-section--full-height":this.fullHeight===!0});return d`
+}`;var v=Object.defineProperty,g=(r,e,n,y)=>{for(var t=void 0,i=r.length-1,o;i>=0;i--)(o=r[i])&&(t=o(e,n,t)||t);return t&&v(e,n,t),t};const u=class u extends x{constructor(){super(...arguments),this.top="1rem"}render(){const e=this.componentClassNames("cre8-c-layout-section",{"cre8-c-layout-section--sticky":this.behavior==="sticky","cre8-c-layout-section--full-height":this.fullHeight===!0});return m`
       <div class="${e}" style=${`top: ${this.top}`}>
         <slot></slot>
       </div>
-    `}};u.styles=[w];let r=u;g([c()],r.prototype,"behavior");g([c()],r.prototype,"top");g([c({type:Boolean,reflect:!0})],r.prototype,"fullHeight");customElements.get("cre8-layout-section")===void 0&&customElements.define("cre8-layout-section",r);const v=f`.cre8-u-content-knockout-brand {
-  color: var(----cre8-color-content-knockout-brand);
+    `}};u.styles=[w];let a=u;g([c()],a.prototype,"behavior");g([c()],a.prototype,"top");g([c({type:Boolean,reflect:!0})],a.prototype,"fullHeight");customElements.get("cre8-layout-section")===void 0&&customElements.define("cre8-layout-section",a);const k=f`.cre8-u-content-knockout-brand {
+  color: var(--cre8-color-content-knockout-brand);
 }
 
 .cre8-u-is-hidden {
@@ -684,23 +683,23 @@ span.ripple {
 }
 
 .cre8-u-margin-sm {
-  margin: size(1) !important;
+  margin: 0.5rem !important;
 }
 
 .cre8-u-margin-md {
-  margin: size(2) !important;
+  margin: 1rem !important;
 }
 
 .cre8-u-margin-lg {
-  margin: size(3) !important;
+  margin: 1.5rem !important;
 }
 
 .cre8-u-margin-xl {
-  margin: size(4) !important;
+  margin: 2rem !important;
 }
 
 .cre8-u-margin-xxl {
-  margin: size(8) !important;
+  margin: 4rem !important;
 }
 
 .cre8-u-margin-top-none {
@@ -708,23 +707,23 @@ span.ripple {
 }
 
 .cre8-u-margin-top-sm {
-  margin-top: size(1) !important;
+  margin-top: 0.5rem !important;
 }
 
 .cre8-u-margin-top-md {
-  margin-top: size(2) !important;
+  margin-top: 1rem !important;
 }
 
 .cre8-u-margin-top-lg {
-  margin-top: size(3) !important;
+  margin-top: 1.5rem !important;
 }
 
 .cre8-u-margin-top-xl {
-  margin-top: size(4) !important;
+  margin-top: 2rem !important;
 }
 
 .cre8-u-margin-top-xxl {
-  margin-top: size(8) !important;
+  margin-top: 4rem !important;
 }
 
 .cre8-u-margin-right-none {
@@ -732,23 +731,23 @@ span.ripple {
 }
 
 .cre8-u-margin-right-sm {
-  margin-right: size(1) !important;
+  margin-right: 0.5rem !important;
 }
 
 .cre8-u-margin-right-md {
-  margin-right: size(2) !important;
+  margin-right: 1rem !important;
 }
 
 .cre8-u-margin-right-lg {
-  margin-right: size(3) !important;
+  margin-right: 1.5rem !important;
 }
 
 .cre8-u-margin-right-xl {
-  margin-right: size(4) !important;
+  margin-right: 2rem !important;
 }
 
 .cre8-u-margin-right-xxl {
-  margin-right: size(8) !important;
+  margin-right: 4rem !important;
 }
 
 .cre8-u-margin-bottom-none {
@@ -756,32 +755,32 @@ span.ripple {
 }
 
 .cre8-u-margin-bottom-sm {
-  margin-bottom: size(1) !important;
+  margin-bottom: 0.5rem !important;
 }
 
 .cre8-u-margin-bottom-md {
-  margin-bottom: size(2) !important;
+  margin-bottom: 1rem !important;
 }
 
 .cre8-u-margin-bottom-lg {
-  margin-bottom: size(3) !important;
+  margin-bottom: 1.5rem !important;
 }
 
 .cre8-u-margin-bottom-xl {
-  margin-bottom: size(4) !important;
+  margin-bottom: 2rem !important;
 }
 
 .cre8-u-margin-bottom-xxl {
-  margin-bottom: size(8) !important;
+  margin-bottom: 4rem !important;
 }
 
 .cre8-u-margin-bottom-xl-xxl {
-  margin-bottom: size(4) !important;
+  margin-bottom: 2rem !important;
 }
 
 @media all and (min-width: 768px) {
   .cre8-u-margin-bottom-xl-xxl {
-    margin-bottom: size(8) !important;
+    margin-bottom: 4rem !important;
   }
 }
 .cre8-u-margin-left-none {
@@ -789,23 +788,23 @@ span.ripple {
 }
 
 .cre8-u-margin-left-sm {
-  margin-left: size(1) !important;
+  margin-left: 0.5rem !important;
 }
 
 .cre8-u-margin-left-md {
-  margin-left: size(2) !important;
+  margin-left: 1rem !important;
 }
 
 .cre8-u-margin-left-lg {
-  margin-left: size(3) !important;
+  margin-left: 1.5rem !important;
 }
 
 .cre8-u-margin-left-xl {
-  margin-left: size(4) !important;
+  margin-left: 2rem !important;
 }
 
 .cre8-u-margin-left-xxl {
-  margin-left: size(8) !important;
+  margin-left: 4rem !important;
 }
 
 .cre8-u-padding-none {
@@ -813,23 +812,23 @@ span.ripple {
 }
 
 .cre8-u-padding-sm {
-  padding: size(1) !important;
+  padding: 0.5rem !important;
 }
 
 .cre8-u-padding-md {
-  padding: size(2) !important;
+  padding: 1rem !important;
 }
 
 .cre8-u-padding-lg {
-  padding: size(3) !important;
+  padding: 1.5rem !important;
 }
 
 .cre8-u-padding-xl {
-  padding: size(4) !important;
+  padding: 2rem !important;
 }
 
 .cre8-u-padding-xxl {
-  padding: size(8) !important;
+  padding: 4rem !important;
 }
 
 .cre8-u-padding-top-none {
@@ -837,23 +836,23 @@ span.ripple {
 }
 
 .cre8-u-padding-top-sm {
-  padding-top: size(1) !important;
+  padding-top: 0.5rem !important;
 }
 
 .cre8-u-padding-top-md {
-  padding-top: size(2) !important;
+  padding-top: 1rem !important;
 }
 
 .cre8-u-padding-top-lg {
-  padding-top: size(3) !important;
+  padding-top: 1.5rem !important;
 }
 
 .cre8-u-padding-top-xl {
-  padding-top: size(4) !important;
+  padding-top: 2rem !important;
 }
 
 .cre8-u-padding-top-xxl {
-  padding-top: size(8) !important;
+  padding-top: 4rem !important;
 }
 
 .cre8-u-padding-right-none {
@@ -861,23 +860,23 @@ span.ripple {
 }
 
 .cre8-u-padding-right-sm {
-  padding-right: size(1) !important;
+  padding-right: 0.5rem !important;
 }
 
 .cre8-u-padding-right-md {
-  padding-right: size(2) !important;
+  padding-right: 1rem !important;
 }
 
 .cre8-u-padding-right-lg {
-  padding-right: size(3) !important;
+  padding-right: 1.5rem !important;
 }
 
 .cre8-u-padding-right-xl {
-  padding-right: size(4) !important;
+  padding-right: 2rem !important;
 }
 
 .cre8-u-padding-right-xxl {
-  padding-right: size(8) !important;
+  padding-right: 4rem !important;
 }
 
 .cre8-u-padding-bottom-none {
@@ -885,23 +884,23 @@ span.ripple {
 }
 
 .cre8-u-padding-bottom-sm {
-  padding-bottom: size(1) !important;
+  padding-bottom: 0.5rem !important;
 }
 
 .cre8-u-padding-bottom-md {
-  padding-bottom: size(2) !important;
+  padding-bottom: 1rem !important;
 }
 
 .cre8-u-padding-bottom-lg {
-  padding-bottom: size(3) !important;
+  padding-bottom: 1.5rem !important;
 }
 
 .cre8-u-padding-bottom-xl {
-  padding-bottom: size(4) !important;
+  padding-bottom: 2rem !important;
 }
 
 .cre8-u-padding-bottom-xxl {
-  padding-bottom: size(8) !important;
+  padding-bottom: 4rem !important;
 }
 
 .cre8-u-padding-left-none {
@@ -909,23 +908,23 @@ span.ripple {
 }
 
 .cre8-u-padding-left-sm {
-  padding-left: size(1) !important;
+  padding-left: 0.5rem !important;
 }
 
 .cre8-u-padding-left-md {
-  padding-left: size(2) !important;
+  padding-left: 1rem !important;
 }
 
 .cre8-u-padding-left-lg {
-  padding-left: size(3) !important;
+  padding-left: 1.5rem !important;
 }
 
 .cre8-u-padding-left-xl {
-  padding-left: size(4) !important;
+  padding-left: 2rem !important;
 }
 
 .cre8-u-padding-left-xxl {
-  padding-left: size(8) !important;
+  padding-left: 4rem !important;
 }
 
 .cre8-u-display-flex {
@@ -941,7 +940,6 @@ body {
   font-size: var(--cre8-typography-body-default-font-size);
   font-weight: var(--cre8-typography-body-default-font-weight);
   line-height: var(--cre8-typography-body-default-line-height);
-  -webkit-text-decoration: var(--cre8-typography-body-default-text-decoration);
   text-decoration: var(--cre8-typography-body-default-text-decoration);
   text-transform: var(--cre8-typography-body-default-text-transform);
   display: flex;
@@ -949,7 +947,7 @@ body {
   padding: 0;
   margin: 0;
   color: var(--cre8-color-content-default);
-  background: var(--background-default);
+  background: var(--cre8-color-bg-default);
 }
 
 @media all and (min-width: 60rem) {
@@ -1201,6 +1199,16 @@ span.ripple {
 /**
  * Visually hidden from display
  */
+/**
+ * 1) Custom elements default to \`display: inline\`, which makes the host a text
+ * box and lets its children flow like inline content. Every layout rule below
+ * lives on a wrapper inside the shadow root, so without this the host itself
+ * never takes part in block layout.
+ */
+:host {
+  display: block;
+}
+
 /**
  * 1) Layout wrapper that houses layout section Components to create a layouts like
  * sidebar layouts that are 1 row across and not a grid
@@ -1208,12 +1216,12 @@ span.ripple {
 .cre8-c-layout {
   display: grid;
   flex: 1;
-  gap: 1rem;
+  gap: var(--cre8-spacing-16);
   grid-template-columns: minmax(0, 1fr);
 }
 @media all and (min-width: 960px) {
   .cre8-c-layout {
-    gap: 2rem;
+    gap: var(--cre8-spacing-32);
     grid-template-columns: minmax(0, 1fr) calc(var(--cre8-sidebar-width, 40%) - (0.5rem));
     /* 2 */
   }
@@ -1232,50 +1240,50 @@ span.ripple {
     grid-template-columns: calc(var(--cre8-sidebar-width, 40%) - (0.5rem)) minmax(0, 1fr);
     /* 2 */
   }
-}`;var k=Object.defineProperty,R=(i,e,n,y)=>{for(var t=void 0,a=i.length-1,o;a>=0;a--)(o=i[a])&&(t=o(e,n,t)||t);return t&&k(e,n,t),t};const h=class h extends x{render(){const e=this.componentClassNames("cre8-c-layout",{"cre8-c-layout--left-sidebar":this.variant==="left-sidebar"});return d`
+}`;var R=Object.defineProperty,z=(r,e,n,y)=>{for(var t=void 0,i=r.length-1,o;i>=0;i--)(o=r[i])&&(t=o(e,n,t)||t);return t&&R(e,n,t),t};const h=class h extends x{render(){const e=this.componentClassNames("cre8-c-layout",{"cre8-c-layout--left-sidebar":this.variant==="left-sidebar"});return m`
       <div class="${e}">
         <slot></slot>
       </div>
-    `}};h.styles=[v];let p=h;R([c()],p.prototype,"variant");customElements.get("cre8-layout")===void 0&&customElements.define("cre8-layout",p);const F={title:"Cre8 Components/Layout",component:"cre8-layout",parameters:{status:{type:"notStarted"}}},m=i=>d`<cre8-layout ${b(i)}>
+    `}};h.styles=[k];let s=h;z([c()],s.prototype,"variant");customElements.get("cre8-layout")===void 0&&customElements.define("cre8-layout",s);const F={title:"Cre8 Components/Layout",component:"cre8-layout",parameters:{status:{type:"notStarted"}}},d=r=>m`<cre8-layout ${b(r)}>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
-</cre8-layout>`,s=()=>d`<cre8-layout variant="left-sidebar">
+</cre8-layout>`,l=()=>m`<cre8-layout variant="left-sidebar">
   <cre8-layout-section>
     <f-po>Layout Section Sidebar</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
-</cre8-layout>`,l=()=>d`<cre8-layout variant="right-sidebar">
+</cre8-layout>`,p=()=>m`<cre8-layout variant="right-sidebar">
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section Sidebar</f-po>
   </cre8-layout-section>
-</cre8-layout>`;m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`args => html\`<cre8-layout \${spread(args)}>
+</cre8-layout>`;d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`args => html\`<cre8-layout \${spread(args)}>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
-</cre8-layout>\``,...m.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`() => html\`<cre8-layout variant="left-sidebar">
+</cre8-layout>\``,...d.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`() => html\`<cre8-layout variant="left-sidebar">
   <cre8-layout-section>
     <f-po>Layout Section Sidebar</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
-</cre8-layout>\``,...s.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`() => html\`<cre8-layout variant="right-sidebar">
+</cre8-layout>\``,...l.parameters?.docs?.source}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`() => html\`<cre8-layout variant="right-sidebar">
   <cre8-layout-section>
     <f-po>Layout Section</f-po>
   </cre8-layout-section>
   <cre8-layout-section>
     <f-po>Layout Section Sidebar</f-po>
   </cre8-layout-section>
-</cre8-layout>\``,...l.parameters?.docs?.source}}};const T=["Default","LeftSidebar","RightSidebar"];export{m as Default,s as LeftSidebar,l as RightSidebar,T as __namedExportsOrder,F as default};
+</cre8-layout>\``,...p.parameters?.docs?.source}}};const T=["Default","LeftSidebar","RightSidebar"];export{d as Default,l as LeftSidebar,p as RightSidebar,T as __namedExportsOrder,F as default};