@tmorrow/cre8-wc 2.0.5 → 2.0.7

package/dist/assets/{tabs.stories-CsbG6PFQ.js → tabs.stories-Cpc3OHJx.js}

@@ -1,4 +1,4 @@
-import{i as w,b as x}from"./iframe-CdWmiVXf.js";import{s as S}from"./spread-BOaHI3Dl.js";import{o as R}from"./unsafe-html-BLUBm7l3.js";import{s as C}from"./story-helpers-BJLZYDac.js";import{C as z,n as s}from"./cre8-element-gkCuLp-W.js";import{e as v}from"./query-BpjciUlk.js";import{r as T}from"./state-BQD-SkUn.js";import{o as A}from"./query-assigned-elements-43hYArgI.js";import{n as L}from"./index.browser-BY9c7rfI.js";import"./f-po-CZL6lsXP.js";import"./preload-helper-PPVm8Dsz.js";import"./directive-b18f_ppQ.js";import"./_commonjsHelpers-DaWZu8wl.js";import"./base-DVmwUFg0.js";import"./if-defined-sxEueMHN.js";const P=w`.cre8-u-content-knockout-brand {
+import{a as w,b as x,o as R}from"./iframe-dHvya7sk.js";import{s as S}from"./spread-BPiNgQQF.js";import{s as C}from"./story-helpers-BFn_kBYw.js";import{C as z,n as s}from"./cre8-element-DfmMtHJO.js";import{e as v}from"./query-BpjciUlk.js";import{r as T}from"./state-CfuknrX8.js";import{o as A}from"./query-assigned-elements-43hYArgI.js";import{n as L}from"./index.browser-BY9c7rfI.js";import"./f-po-C2WpbOFJ.js";import"./preload-helper-PPVm8Dsz.js";import"./_commonjsHelpers-DaWZu8wl.js";import"./base-DVmwUFg0.js";import"./if-defined-HKKhGupN.js";const P=w`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -612,7 +620,7 @@ span.ripple {
 .cre8-c-tab-panel.cre8-is-active {
   visibility: visible;
   display: block;
-}`;var V=Object.defineProperty,y=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,p;r>=0;r--)(p=o[r])&&(a=p(e,t,a)||a);return a&&V(e,t,a),a};const k=class k extends z{firstUpdated(){this.skipFocusOnPanel||this._Cre8TabPanel.setAttribute("tabindex","0")}render(){const e=this.componentClassNames("cre8-c-tab-panel",{"cre8-is-active":this.isActive});return x`
+}`;var V=Object.defineProperty,y=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,c;r>=0;r--)(c=o[r])&&(a=c(e,t,a)||a);return a&&V(e,t,a),a};const k=class k extends z{firstUpdated(){this.skipFocusOnPanel||this._Cre8TabPanel.setAttribute("tabindex","0")}render(){const e=this.componentClassNames("cre8-c-tab-panel",{"cre8-is-active":this.isActive});return x`
       <div role="tabpanel" class="${e}">
         <slot></slot>
       </div>
@@ -990,6 +998,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1162,6 +1174,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1295,7 +1311,7 @@ span.ripple {
 .cre8-c-tab.cre8-c-tab--small.cre8-is-active:not(:focus-visible) {
   padding-block-end: calc(0.25rem - var(--cre8-border-width-tab-selected));
   /* 1 */
-}`;var B=Object.defineProperty,h=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,p;r>=0;r--)(p=o[r])&&(a=p(e,t,a)||a);return a&&B(e,t,a),a};const I=class I extends z{updated(e){e.has("ariaLabelledBy")&&this._Cre8Tab.setAttribute("id",this.ariaLabelledBy),e.has("isActive")&&(this._Cre8Tab.setAttribute("tabindex",this.isActive?"0":"-1"),this._Cre8Tab.setAttribute("aria-selected",`${this.isActive}`))}_handleTabSelected(){const e=new CustomEvent("tabSelected",{detail:{index:this.index},bubbles:!0,composed:!0});this.dispatchEvent(e)}render(){const e=this.componentClassNames("cre8-c-tab",{"cre8-is-active":this.isActive,"cre8-c-tab--small":this.size==="sm"});return x`
+}`;var B=Object.defineProperty,h=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,c;r>=0;r--)(c=o[r])&&(a=c(e,t,a)||a);return a&&B(e,t,a),a};const I=class I extends z{updated(e){e.has("ariaLabelledBy")&&this._Cre8Tab.setAttribute("id",this.ariaLabelledBy),e.has("isActive")&&(this._Cre8Tab.setAttribute("tabindex",this.isActive?"0":"-1"),this._Cre8Tab.setAttribute("aria-selected",`${this.isActive}`))}_handleTabSelected(){const e=new CustomEvent("tabSelected",{detail:{index:this.index},bubbles:!0,composed:!0});this.dispatchEvent(e)}render(){const e=this.componentClassNames("cre8-c-tab",{"cre8-is-active":this.isActive,"cre8-c-tab--small":this.size==="sm"});return x`
       <button
         role="tab"
         tabindex="-1"
@@ -1306,7 +1322,7 @@ span.ripple {
       >
         <slot></slot>
       </button>
-    `}};I.styles=[O];let c=I;h([s()],c.prototype,"size");h([s({type:Boolean,reflect:!0})],c.prototype,"isActive");h([s({type:Number})],c.prototype,"index");h([s()],c.prototype,"ariaLabelledBy");h([v(".cre8-c-tab")],c.prototype,"_Cre8Tab");customElements.get("cre8-tab")===void 0&&customElements.define("cre8-tab",c);const F=w`.cre8-u-content-knockout-brand {
+    `}};I.styles=[O];let p=I;h([s()],p.prototype,"size");h([s({type:Boolean,reflect:!0})],p.prototype,"isActive");h([s({type:Number})],p.prototype,"index");h([s()],p.prototype,"ariaLabelledBy");h([v(".cre8-c-tab")],p.prototype,"_Cre8Tab");customElements.get("cre8-tab")===void 0&&customElements.define("cre8-tab",p);const F=w`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -1680,6 +1696,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1852,6 +1872,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1983,7 +2007,7 @@ span.ripple {
 .cre8-c-tabs--full-width .cre8-c-tabs__body {
   border-top: var(--cre8-border-width-tab-selected) var(--cre8-border-style-default) var(--cre8-color-border-default);
   margin-top: calc(var(--cre8-border-width-tab-selected) * -2);
-}`;var X=Object.defineProperty,d=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,p;r>=0;r--)(p=o[r])&&(a=p(e,t,a)||a);return a&&X(e,t,a),a};let E=1;const _=class _ extends z{constructor(){super(),this.activeIndex=0,this.isStart=!0,this.isEnd=!1,this.handleScroll=this.handleScroll.bind(this),this.handleResize=this.handleResize.bind(this),this.setIsStart=this.setIsStart.bind(this),this.setIsEnd=this.setIsEnd.bind(this),this.emitEvent=this.emitEvent.bind(this),this.tabId=`cre8-tabpanel-${E}`,E+=1}get isRTL(){return document.dir==="rtl"}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.handleResize)}async firstUpdated(){this.setTabAttributes(),await this.updateComplete,this.activeTab=this._Cre8TabItems[this.activeIndex]||this._Cre8TabItems[0],this.setActiveTab(),this.setIsStart(),this.setIsEnd(),this.setTabVariant()}async updated(e){e.forEach(async(t,i)=>{i==="activeIndex"&&this.activeIndex!==t&&(await this.updateComplete,this.activeTab&&this.removePreviousActiveTab(),this.activeTab=this._Cre8TabItems[this.activeIndex],this.setActiveTab())})}handleResize(){this.setIsStart(),this.setIsEnd()}handleScroll(){this.setIsStart(),this.setIsEnd()}setIsStart(){this.isRTL?this._Cre8TabsHeaderList.scrollLeft>0?this.isStart=!0:this.isStart=!1:this._Cre8TabsHeaderList.scrollLeft>0?this.isStart=!1:this.isStart=!0}setIsEnd(){this.isInViewport()===!0?this.isEnd=!0:this.isEnd=!1}isInViewport(){const t=this._Cre8TabItems[this._Cre8TabItems.length-1].shadowRoot?.querySelector(".cre8-c-tab");if(!t)return!1;const i=t.getBoundingClientRect(),a=window.innerWidth||document.documentElement.clientWidth;return i.left>=0&&i.right<=a}setTabVariant(){this.size==="sm"&&this._Cre8TabItems.forEach(e=>{e.size="sm"})}setTabAttributes(){this._Cre8TabItems.forEach((e,t)=>{e.index=t;const a=e.ariaLabelledBy||L();e.ariaLabelledBy=a;const r=this._Cre8TabPanels[t];r.index=t})}setActiveTab(){this.activeTab.isActive=!0;const e=this._Cre8TabPanels.find(t=>t.index===this.activeTab.index);e&&(e.isActive=!0)}setActiveTabFocus(){this.activeTab.shadowRoot?.querySelector(".cre8-c-tab").focus()}handleTabSelected(e){const{target:t}=e;if(this._Cre8TabItems.includes(t)){this.activeTab&&this.removePreviousActiveTab(),this.activeTab=t;const i=this._Cre8TabItems.findIndex(a=>a===this.activeTab);this.activeIndex=i,this.setActiveTab(),this.emitEvent()}}handleKeydown(e){const{target:t}=e;if(document.activeElement.matches("cre8-tab"))switch(e.key){case"ArrowRight":e.preventDefault(),this.setSelectedToNextTab(t);break;case"ArrowLeft":e.preventDefault(),this.setSelectedToPreviousTab(t);break;case"Home":e.preventDefault(),this.setSelectedToNextTab(this._Cre8TabItems[this._Cre8TabItems.length-1]);break;case"End":e.preventDefault(),this.setSelectedToPreviousTab(this._Cre8TabItems[0]);break;case"Escape":this.activeTab.blur();break}}setSelectedToPreviousTab(e){const t=e.index;this.removePreviousActiveTab();const i=this._Cre8TabItems.length-1;if(t===0)this.activeIndex=i,this.activeTab=this._Cre8TabItems[i];else{const a=t-1;this.activeIndex=a,this.activeTab=this._Cre8TabItems[a]}this.setActiveTab(),this.setActiveTabFocus(),this.emitEvent()}setSelectedToNextTab(e){const t=e.index;this.removePreviousActiveTab();const i=this._Cre8TabItems.length-1;if(t===i)this.activeIndex=0,this.activeTab=this._Cre8TabItems[0];else{const a=t+1;this.activeIndex=a,this.activeTab=this._Cre8TabItems[a]}this.setActiveTab(),this.setActiveTabFocus(),this.emitEvent()}removePreviousActiveTab(){this.activeTab.isActive=!1;const e=this._Cre8TabPanels.find(t=>t.index===this.activeTab.index);e&&(e.isActive=!1)}emitEvent(){const e=new CustomEvent("tabChange",{detail:{value:this.activeTab,activeTabIndex:this.activeIndex},bubbles:!0,composed:!0});this.dispatchEvent(e)}render(){const e=this.componentClassNames("cre8-c-tabs",{"cre8-is-start":this.isStart===!0,"cre8-is-end":this.isEnd===!0,"cre8-c-tabs--full-width":this.fullWidth});return x`
+}`;var X=Object.defineProperty,d=(o,e,t,i)=>{for(var a=void 0,r=o.length-1,c;r>=0;r--)(c=o[r])&&(a=c(e,t,a)||a);return a&&X(e,t,a),a};let E=1;const _=class _ extends z{constructor(){super(),this.activeIndex=0,this.isStart=!0,this.isEnd=!1,this.handleScroll=this.handleScroll.bind(this),this.handleResize=this.handleResize.bind(this),this.setIsStart=this.setIsStart.bind(this),this.setIsEnd=this.setIsEnd.bind(this),this.emitEvent=this.emitEvent.bind(this),this.tabId=`cre8-tabpanel-${E}`,E+=1}get isRTL(){return document.dir==="rtl"}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.handleResize)}async firstUpdated(){this.setTabAttributes(),await this.updateComplete,this.activeTab=this._Cre8TabItems[this.activeIndex]||this._Cre8TabItems[0],this.setActiveTab(),this.setIsStart(),this.setIsEnd(),this.setTabVariant()}async updated(e){e.forEach(async(t,i)=>{i==="activeIndex"&&this.activeIndex!==t&&(await this.updateComplete,this.activeTab&&this.removePreviousActiveTab(),this.activeTab=this._Cre8TabItems[this.activeIndex],this.setActiveTab())})}handleResize(){this.setIsStart(),this.setIsEnd()}handleScroll(){this.setIsStart(),this.setIsEnd()}setIsStart(){this.isRTL?this._Cre8TabsHeaderList.scrollLeft>0?this.isStart=!0:this.isStart=!1:this._Cre8TabsHeaderList.scrollLeft>0?this.isStart=!1:this.isStart=!0}setIsEnd(){this.isInViewport()===!0?this.isEnd=!0:this.isEnd=!1}isInViewport(){const t=this._Cre8TabItems[this._Cre8TabItems.length-1].shadowRoot?.querySelector(".cre8-c-tab");if(!t)return!1;const i=t.getBoundingClientRect(),a=window.innerWidth||document.documentElement.clientWidth;return i.left>=0&&i.right<=a}setTabVariant(){this.size==="sm"&&this._Cre8TabItems.forEach(e=>{e.size="sm"})}setTabAttributes(){this._Cre8TabItems.forEach((e,t)=>{e.index=t;const a=e.ariaLabelledBy||L();e.ariaLabelledBy=a;const r=this._Cre8TabPanels[t];r.index=t})}setActiveTab(){this.activeTab.isActive=!0;const e=this._Cre8TabPanels.find(t=>t.index===this.activeTab.index);e&&(e.isActive=!0)}setActiveTabFocus(){this.activeTab.shadowRoot?.querySelector(".cre8-c-tab").focus()}handleTabSelected(e){const{target:t}=e;if(this._Cre8TabItems.includes(t)){this.activeTab&&this.removePreviousActiveTab(),this.activeTab=t;const i=this._Cre8TabItems.findIndex(a=>a===this.activeTab);this.activeIndex=i,this.setActiveTab(),this.emitEvent()}}handleKeydown(e){const{target:t}=e;if(document.activeElement.matches("cre8-tab"))switch(e.key){case"ArrowRight":e.preventDefault(),this.setSelectedToNextTab(t);break;case"ArrowLeft":e.preventDefault(),this.setSelectedToPreviousTab(t);break;case"Home":e.preventDefault(),this.setSelectedToNextTab(this._Cre8TabItems[this._Cre8TabItems.length-1]);break;case"End":e.preventDefault(),this.setSelectedToPreviousTab(this._Cre8TabItems[0]);break;case"Escape":this.activeTab.blur();break}}setSelectedToPreviousTab(e){const t=e.index;this.removePreviousActiveTab();const i=this._Cre8TabItems.length-1;if(t===0)this.activeIndex=i,this.activeTab=this._Cre8TabItems[i];else{const a=t-1;this.activeIndex=a,this.activeTab=this._Cre8TabItems[a]}this.setActiveTab(),this.setActiveTabFocus(),this.emitEvent()}setSelectedToNextTab(e){const t=e.index;this.removePreviousActiveTab();const i=this._Cre8TabItems.length-1;if(t===i)this.activeIndex=0,this.activeTab=this._Cre8TabItems[0];else{const a=t+1;this.activeIndex=a,this.activeTab=this._Cre8TabItems[a]}this.setActiveTab(),this.setActiveTabFocus(),this.emitEvent()}removePreviousActiveTab(){this.activeTab.isActive=!1;const e=this._Cre8TabPanels.find(t=>t.index===this.activeTab.index);e&&(e.isActive=!1)}emitEvent(){const e=new CustomEvent("tabChange",{detail:{value:this.activeTab,activeTabIndex:this.activeIndex},bubbles:!0,composed:!0});this.dispatchEvent(e)}render(){const e=this.componentClassNames("cre8-c-tabs",{"cre8-is-start":this.isStart===!0,"cre8-is-end":this.isEnd===!0,"cre8-c-tabs--full-width":this.fullWidth});return x`
         <div class="${e}">
             <div class="cre8-c-tabs__header">
                 <div
@@ -2001,7 +2025,7 @@ span.ripple {
                 <slot name="panel"></slot>
             </div>
         </div>
-    `}};_.styles=[F];let n=_;d([s()],n.prototype,"size");d([s({type:Boolean,reflect:!0})],n.prototype,"fullWidth");d([s({type:Number})],n.prototype,"activeIndex");d([T()],n.prototype,"activeTab");d([T()],n.prototype,"isStart");d([T()],n.prototype,"isEnd");d([A()],n.prototype,"_Cre8TabItems");d([A({slot:"panel"})],n.prototype,"_Cre8TabPanels");d([v(".cre8-c-tabs__header")],n.prototype,"_Cre8TabsHeader");d([v(".cre8-c-tabs__list")],n.prototype,"_Cre8TabsHeaderList");customElements.get("cre8-tabs")===void 0&&customElements.define("cre8-tabs",n);const ee={title:"cre8 Components/Tabs",component:"cre8-tabs",render:({default:o,panel:e,...t})=>x`
+    `}};_.styles=[F];let n=_;d([s()],n.prototype,"size");d([s({type:Boolean,reflect:!0})],n.prototype,"fullWidth");d([s({type:Number})],n.prototype,"activeIndex");d([T()],n.prototype,"activeTab");d([T()],n.prototype,"isStart");d([T()],n.prototype,"isEnd");d([A()],n.prototype,"_Cre8TabItems");d([A({slot:"panel"})],n.prototype,"_Cre8TabPanels");d([v(".cre8-c-tabs__header")],n.prototype,"_Cre8TabsHeader");d([v(".cre8-c-tabs__list")],n.prototype,"_Cre8TabsHeaderList");customElements.get("cre8-tabs")===void 0&&customElements.define("cre8-tabs",n);const Q={title:"cre8 Components/Tabs",component:"cre8-tabs",render:({default:o,panel:e,...t})=>x`
     <cre8-tabs ${S(t)}>
       ${R(C(o,"cre8-tab"))}
       ${R(C(e,"cre8-tab-panel","f-po"))}
@@ -2121,4 +2145,4 @@ span.ripple {
 }`,...g.parameters?.docs?.source},description:{story:`Navigating through Tabs via scrolling is a becoming a popular interaction pattern.
 However, it is generally only used for content heavy web sites, as opposed to table heavy software.
 Be cautious if implementing this pattern, and be sure that it is only used where content is consistent across
-all Tabs and moving from one to the next would be a natural organic experience, instead of disjointed or disconnected.`,...g.parameters?.docs?.description}}};const te=["Default","fullWidth","Small","WithActiveIndex","WithOverflow"];export{l as Default,u as Small,f as WithActiveIndex,g as WithOverflow,te as __namedExportsOrder,ee as default,b as fullWidth};
+all Tabs and moving from one to the next would be a natural organic experience, instead of disjointed or disconnected.`,...g.parameters?.docs?.description}}};const Z=["Default","fullWidth","Small","WithActiveIndex","WithOverflow"];export{l as Default,u as Small,f as WithActiveIndex,g as WithOverflow,Z as __namedExportsOrder,Q as default,b as fullWidth};

package/dist/assets/{tag-list.stories-FGvdHvhI.js → tag-list.stories-BmyCmrTF.js}

@@ -1,4 +1,4 @@
-import{i as h,b as d}from"./iframe-CdWmiVXf.js";import{s as p}from"./spread-BOaHI3Dl.js";import"./tag-CqRtd4HZ.js";import{C as x,n as c}from"./cre8-element-gkCuLp-W.js";import{n as f}from"./index.browser-BY9c7rfI.js";import"./preload-helper-PPVm8Dsz.js";import"./directive-b18f_ppQ.js";import"./icon-DYiIK7a4.js";import"./unsafe-html-BLUBm7l3.js";import"./Caret_Down-Bmqq8eNW.js";import"./Warning-CawqmTvB.js";import"./query-BpjciUlk.js";import"./base-DVmwUFg0.js";import"./if-defined-sxEueMHN.js";import"./cre8-form-element-DsXhvnkn.js";import"./_commonjsHelpers-DaWZu8wl.js";const b=h`.cre8-u-content-knockout-brand {
+import{a as h,b as d}from"./iframe-dHvya7sk.js";import{s as p}from"./spread-BPiNgQQF.js";import"./tag-vQFuZneb.js";import{C as x,n as c}from"./cre8-element-DfmMtHJO.js";import{n as f}from"./index.browser-BY9c7rfI.js";import"./preload-helper-PPVm8Dsz.js";import"./query-BpjciUlk.js";import"./base-DVmwUFg0.js";import"./if-defined-HKKhGupN.js";import"./cre8-form-element-bQpK8UYN.js";import"./icon-DeTLDzTS.js";import"./_commonjsHelpers-DaWZu8wl.js";const b=h`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -609,14 +617,14 @@ span.ripple {
   padding: 0;
   display: flex;
   flex-wrap: wrap;
-}`;var y=Object.defineProperty,u=(t,r,g,v)=>{for(var e=void 0,s=t.length-1,l;s>=0;s--)(l=t[s])&&(e=l(r,g,e)||e);return e&&y(r,g,e),e};const m=class m extends x{firstUpdated(){this._initializeAria()}_initializeAria(){this.fieldId=this.fieldId||f()}render(){const r=this.componentClassNames("cre8-c-tag-list",{});return d`
+}`;var y=Object.defineProperty,u=(t,r,l,v)=>{for(var e=void 0,s=t.length-1,g;s>=0;s--)(g=t[s])&&(e=g(r,l,e)||e);return e&&y(r,l,e),e};const m=class m extends x{firstUpdated(){this._initializeAria()}_initializeAria(){this.fieldId=this.fieldId||f()}render(){const r=this.componentClassNames("cre8-c-tag-list",{});return d`
       <fieldset class="${r}">
         <legend class="cre8-c-tag-list__legend">${this.label}</legend>
         <div class="cre8-c-tag-list__list" role="list">   
           <slot></slot>
         </div>
       </fieldset>
-      `}};m.styles=[b];let a=m;u([c()],a.prototype,"label");u([c()],a.prototype,"fieldId");customElements.get("cre8-tag-list")===void 0&&customElements.define("cre8-tag-list",a);const E={title:"In Development/Tag List",component:"cre8-tag-list",parameters:{status:{type:"inProgress"}}},i=t=>d`
+      `}};m.styles=[b];let a=m;u([c()],a.prototype,"label");u([c()],a.prototype,"fieldId");customElements.get("cre8-tag-list")===void 0&&customElements.define("cre8-tag-list",a);const S={title:"In Development/Tag List",component:"cre8-tag-list",parameters:{status:{type:"inProgress"}}},i=t=>d`
 <cre8-tag-list label="Fruits" ${p(t)}>
   <cre8-tag type="checkbox" variant="neutral" shape="round" text="Orange"></cre8-tag>
   <cre8-tag type="checkbox" variant="neutral" shape="round" text="Apple"></cre8-tag>
@@ -658,4 +666,4 @@ span.ripple {
   <cre8-tag type="radio" variant="neutral" shape="round" text="Scared"></cre8-tag>
   <cre8-tag type="radio" variant="neutral" shape="round" text="Angry"></cre8-tag>
   <cre8-tag type="radio" variant="neutral" shape="round" text="Confused"></cre8-tag>
-</cre8-tag-list>\``,...o.parameters?.docs?.source}}};const D=["Default","CheckBox","Radio"];export{n as CheckBox,i as Default,o as Radio,D as __namedExportsOrder,E as default};
+</cre8-tag-list>\``,...o.parameters?.docs?.source}}};const V=["Default","CheckBox","Radio"];export{n as CheckBox,i as Default,o as Radio,V as __namedExportsOrder,S as default};

package/dist/assets/{tag-CqRtd4HZ.js → tag-vQFuZneb.js}

@@ -1,4 +1,4 @@
-import{b as p}from"./icon-DYiIK7a4.js";import{i as h,b as g}from"./iframe-CdWmiVXf.js";import{n as o}from"./cre8-element-gkCuLp-W.js";import{e as u}from"./query-BpjciUlk.js";import{n as f}from"./index.browser-BY9c7rfI.js";import{o as l}from"./if-defined-sxEueMHN.js";import{C as b}from"./cre8-form-element-DsXhvnkn.js";const y=h`.cre8-u-content-knockout-brand {
+import{a as p,b as g}from"./iframe-dHvya7sk.js";import{n as o}from"./cre8-element-DfmMtHJO.js";import{e as h}from"./query-BpjciUlk.js";import{n as u}from"./index.browser-BY9c7rfI.js";import{o as l}from"./if-defined-HKKhGupN.js";import{C as f}from"./cre8-form-element-bQpK8UYN.js";import"./icon-DeTLDzTS.js";const b=p`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -692,8 +700,11 @@ span.ripple {
 cre8-icon {
   display: flex;
   align-items: center;
-}`;var v=Object.defineProperty,a=(c,e,t,r)=>{for(var n=void 0,d=c.length-1,m;d>=0;d--)(m=c[d])&&(n=m(e,t,n)||n);return n&&v(e,t,n),n};const s=class s extends b{constructor(){super(...arguments),this.variant="neutral",this.shape="square"}connectedCallback(){super.connectedCallback(),this.fieldId=this.fieldId||f(),window.addEventListener("click",this._clickCheckHandler,!1),window.addEventListener("click",this._clickRadioHandler,!1),window.addEventListener("keydown",this._handleCheckKeyDown,!1),window.addEventListener("keydown",this.handleRadioKeyDown,!1)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("click",this._clickCheckHandler,!1),window.removeEventListener("click",this._clickRadioHandler,!1),window.removeEventListener("keydown",this._handleCheckKeyDown,!1),window.removeEventListener("keydown",this.handleRadioKeyDown,!1)}renderCheckboxIcon(){return this.type==="checkbox"&&this.isSelected?g`
-    <cre8-icon svg="${p}" class="cre8-tag-icon" aria-hidden="true"></cre8-icon>
+}`;var y=Object.defineProperty,a=(c,e,t,r)=>{for(var n=void 0,d=c.length-1,m;d>=0;d--)(m=c[d])&&(n=m(e,t,n)||n);return n&&y(e,t,n),n};const v=`<svg fill="currentColor" width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.8125 3.33285L5.57291 13.5724C5.51347 13.6319 5.44289 13.6791 5.3652 13.7113C5.28751 13.7435 5.20423 13.7601 5.12013 13.7601C5.03603 13.7601 4.95275 13.7435 4.87506 13.7113C4.79737 13.6791 4.72678 13.6319 4.66735 13.5724L0.187547 9.0926C0.0674628 8.97251 0 8.80964 0 8.63982C0 8.46999 0.0674628 8.30712 0.187547 8.18704C0.307632 8.06695 0.470502 7.99949 0.640327 7.99949C0.810153 7.99949 0.973022 8.06695 1.09311 8.18704L5.12013 12.2149L14.9069 2.42729C15.027 2.30721 15.1898 2.23975 15.3597 2.23975C15.5295 2.23975 15.6924 2.30721 15.8125 2.42729C15.9325 2.54738 16 2.71025 16 2.88007C16 3.0499 15.9325 3.21277 15.8125 3.33285Z"/>
+</svg>
+`,s=class s extends f{constructor(){super(...arguments),this.variant="neutral",this.shape="square"}connectedCallback(){super.connectedCallback(),this.fieldId=this.fieldId||u(),window.addEventListener("click",this._clickCheckHandler,!1),window.addEventListener("click",this._clickRadioHandler,!1),window.addEventListener("keydown",this._handleCheckKeyDown,!1),window.addEventListener("keydown",this.handleRadioKeyDown,!1)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("click",this._clickCheckHandler,!1),window.removeEventListener("click",this._clickRadioHandler,!1),window.removeEventListener("keydown",this._handleCheckKeyDown,!1),window.removeEventListener("keydown",this.handleRadioKeyDown,!1)}renderCheckboxIcon(){return this.type==="checkbox"&&this.isSelected?g`
+    <cre8-icon svg="${v}" class="cre8-tag-icon" aria-hidden="true"></cre8-icon>
      `:null}_clickCheckHandler(){this.isDisabled||(this.type==="checkbox"&&(this.isSelected=!this.isSelected),this.dispatchEvent(new CustomEvent("change",{detail:{isSelected:this.isSelected,type:this.type}})))}_handleCheckKeyDown(e){(e.key===" "||e.key==="Enter")&&(e.preventDefault(),this._clickCheckHandler())}resetField(){this._internals.setFormValue(null)}resetTabIndeces(e){e.forEach(t=>{t.shadowRoot.querySelector(".cre8-c-tag").setAttribute("tabindex","0")})}_removeChecked(){this.parentNode&&this.parentNode.querySelectorAll("cre8-tag").forEach(t=>{t.isSelected=!1,t.shadowRoot.querySelector(".cre8-c-tag").setAttribute("tabindex","-1"),t.resetField()})}formResetCallback(){this._removeChecked(),this.isSelected=this.initialSelected,this.field.checked=this.initialSelected}_clickRadioHandler(){this._removeChecked(),this.isSelected=!this.isSelected;const e=this.shadowRoot?.querySelector(".cre8-c-tag");e&&e.setAttribute("tabindex","0"),this.isSelected?this._internals.setFormValue(this.value||"on"):this._internals.setFormValue(null)}_updateSibling(e,t,r){e.preventDefault(),this._removeChecked(),r.focus(),r.setAttribute("tabindex","0"),t.setAttribute("isSelected","")}_checkPreviousTag(e){let t=this.previousElementSibling;for(;t;){const r=t?.shadowRoot?.querySelector('.cre8-c-tag:not([aria-disabled="true"])');if(r){this._updateSibling(e,t,r);return}t=t.previousElementSibling}}_checkNextTag(e){let t=this.nextElementSibling;for(;t;){const r=t?.shadowRoot?.querySelector('.cre8-c-tag:not([aria-disabled="true"])');if(r){this._updateSibling(e,t,r);return}t=t.nextElementSibling}}handleRadioKeyDown(e){if(e.code==="ArrowLeft"||e.code==="ArrowUp")this._checkPreviousTag(e);else if(e.code==="ArrowRight"||e.code==="ArrowDown")this._checkNextTag(e);else if(e.code==="Tab"&&!this.isSelected){const t=this.parentNode.querySelectorAll("cre8-tag");t.forEach(r=>{r.shadowRoot.querySelector(".cre8-c-tag").setAttribute("tabindex","-1")}),setTimeout(this.resetTabIndeces,100,t)}}_getRole(){if(this.closest("cre8-tag-list"))return"listitem"}render(){const e=this.componentClassNames("cre8-c-tag",{[`cre8-c-tag--${this.type}`]:!0,[`cre8-c-tag--${this.shape}`]:!0,[`cre8-c-tag--${this.variant}`]:!0,[`cre8-c-tag--${this.variant}-selected`]:this.isSelected,"cre8-c-tag--disabled":this.isDisabled}),t=this.isSelected===!0||this.initialSelected===!0;return g` 
         <div role="${l(this._getRole())}">
             <div role="${l(this.type)}" aria-checked="${t}" class="${e}"
@@ -718,4 +729,4 @@ cre8-icon {
                 .checked = "${t}"
             />
         </div>
-  `}};s.styles=[y];let i=s;a([o()],i.prototype,"text");a([o()],i.prototype,"type");a([o()],i.prototype,"variant");a([o()],i.prototype,"shape");a([o({type:Boolean})],i.prototype,"isDisabled");a([o({type:Boolean})],i.prototype,"isSelected");a([u("input")],i.prototype,"field");a([o()],i.prototype,"fieldId");customElements.get("cre8-tag")===void 0&&customElements.define("cre8-tag",i);
+  `}};s.styles=[b];let i=s;a([o()],i.prototype,"text");a([o()],i.prototype,"type");a([o()],i.prototype,"variant");a([o()],i.prototype,"shape");a([o({type:Boolean})],i.prototype,"isDisabled");a([o({type:Boolean})],i.prototype,"isSelected");a([h("input")],i.prototype,"field");a([o()],i.prototype,"fieldId");customElements.get("cre8-tag")===void 0&&customElements.define("cre8-tag",i);

package/dist/assets/{tag.stories-CyRYkvcm.js → tag.stories-DGzrNUbb.js}

@@ -1,4 +1,4 @@
-import{b as g}from"./iframe-CdWmiVXf.js";import{s as S}from"./spread-BOaHI3Dl.js";import"./tag-CqRtd4HZ.js";import"./preload-helper-PPVm8Dsz.js";import"./directive-b18f_ppQ.js";import"./icon-DYiIK7a4.js";import"./unsafe-html-BLUBm7l3.js";import"./cre8-element-gkCuLp-W.js";import"./_commonjsHelpers-DaWZu8wl.js";import"./Caret_Down-Bmqq8eNW.js";import"./Warning-CawqmTvB.js";import"./query-BpjciUlk.js";import"./base-DVmwUFg0.js";import"./index.browser-BY9c7rfI.js";import"./if-defined-sxEueMHN.js";import"./cre8-form-element-DsXhvnkn.js";const $={title:"In Development/Tag",component:"cre8-tag",render:y=>g`<cre8-tag ${S(y)}></cre8-tag>`,parameters:{status:{type:"inProgress"}},argTypes:{text:{control:"text"},type:{options:["checkbox","radio"],control:{type:"radio"}},variant:{options:["neutral","branded","neutral-hybrid"],control:{type:"select"}},isDisabled:{control:{type:"boolean"}},isSelected:{control:{type:"boolean"}}},args:{type:"radio",variant:"neutral"}},e={args:{text:"Default",type:"radio"}},r={args:{text:"Neutral",type:"radio"}},a={args:{isSelected:!0,text:"Neutral",type:"radio"}},t={args:{text:"Neutral Hybrid",type:"radio",variant:"neutral-hybrid"}},o={args:{isSelected:!0,text:"Neutral Hybrid",type:"radio",variant:"neutral-hybrid"}},s={args:{text:"Branded",type:"radio",variant:"branded"}},d={args:{isSelected:!0,text:"Branded",type:"radio",variant:"branded"}},n={args:{text:"Disabled",isDisabled:!0}},c={args:{text:"Default",type:"checkbox"}},i={args:{text:"Round",type:"checkbox",shape:"round"}},p={args:{isSelected:!0,text:"Neutral Selected",type:"checkbox"}},u={args:{text:"Neutral Hybrid",type:"checkbox",variant:"neutral-hybrid"}},l={args:{text:"Neutral Hybrid Selected",isSelected:!0,shape:"round",type:"checkbox",variant:"neutral-hybrid"}},m={args:{text:"Branded",type:"checkbox",variant:"branded"}},b={args:{text:"Branded Selected",isSelected:!0,type:"checkbox",variant:"branded"}},x={args:{text:"Disabled",isDisabled:!0,type:"checkbox"}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
+import{b as g}from"./iframe-dHvya7sk.js";import{s as S}from"./spread-BPiNgQQF.js";import"./tag-vQFuZneb.js";import"./preload-helper-PPVm8Dsz.js";import"./cre8-element-DfmMtHJO.js";import"./_commonjsHelpers-DaWZu8wl.js";import"./query-BpjciUlk.js";import"./base-DVmwUFg0.js";import"./index.browser-BY9c7rfI.js";import"./if-defined-HKKhGupN.js";import"./cre8-form-element-bQpK8UYN.js";import"./icon-DeTLDzTS.js";const E={title:"In Development/Tag",component:"cre8-tag",render:y=>g`<cre8-tag ${S(y)}></cre8-tag>`,parameters:{status:{type:"inProgress"}},argTypes:{text:{control:"text"},type:{options:["checkbox","radio"],control:{type:"radio"}},variant:{options:["neutral","branded","neutral-hybrid"],control:{type:"select"}},isDisabled:{control:{type:"boolean"}},isSelected:{control:{type:"boolean"}}},args:{type:"radio",variant:"neutral"}},e={args:{text:"Default",type:"radio"}},r={args:{text:"Neutral",type:"radio"}},a={args:{isSelected:!0,text:"Neutral",type:"radio"}},t={args:{text:"Neutral Hybrid",type:"radio",variant:"neutral-hybrid"}},o={args:{isSelected:!0,text:"Neutral Hybrid",type:"radio",variant:"neutral-hybrid"}},s={args:{text:"Branded",type:"radio",variant:"branded"}},d={args:{isSelected:!0,text:"Branded",type:"radio",variant:"branded"}},n={args:{text:"Disabled",isDisabled:!0}},c={args:{text:"Default",type:"checkbox"}},i={args:{text:"Round",type:"checkbox",shape:"round"}},p={args:{isSelected:!0,text:"Neutral Selected",type:"checkbox"}},u={args:{text:"Neutral Hybrid",type:"checkbox",variant:"neutral-hybrid"}},l={args:{text:"Neutral Hybrid Selected",isSelected:!0,shape:"round",type:"checkbox",variant:"neutral-hybrid"}},b={args:{text:"Branded",type:"checkbox",variant:"branded"}},m={args:{text:"Branded Selected",isSelected:!0,type:"checkbox",variant:"branded"}},x={args:{text:"Disabled",isDisabled:!0,type:"checkbox"}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
   args: {
     text: 'Default',
     type: 'radio'
@@ -76,23 +76,23 @@ import{b as g}from"./iframe-CdWmiVXf.js";import{s as S}from"./spread-BOaHI3Dl.js
     type: 'checkbox',
     variant: 'neutral-hybrid'
   }
-}`,...l.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
+}`,...l.parameters?.docs?.source}}};b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
   args: {
     text: 'Branded',
     type: 'checkbox',
     variant: 'branded'
   }
-}`,...m.parameters?.docs?.source}}};b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
+}`,...b.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
   args: {
     text: 'Branded Selected',
     isSelected: true,
     type: 'checkbox',
     variant: 'branded'
   }
-}`,...b.parameters?.docs?.source}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
+}`,...m.parameters?.docs?.source}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
   args: {
     text: 'Disabled',
     isDisabled: true,
     type: 'checkbox'
   }
-}`,...x.parameters?.docs?.source}}};const j=["DefaultRadio","NeutralRadio","NeutralRadioSelected","NeutralHybridRadio","NeutralHybridRadioSelected","BrandedRadio","BrandedRadioSelected","DisabledRadio","DefaultNeutralCheckbox","ShapeRoundNeutralCheckbox","NeutralSelectedCheckbox","NeutralHybridCheckbox","NeutralHybridRoundSelectedCheckbox","BrandedCheckbox","BrandedSelectedCheckbox","DisabledCheckbox"];export{m as BrandedCheckbox,s as BrandedRadio,d as BrandedRadioSelected,b as BrandedSelectedCheckbox,c as DefaultNeutralCheckbox,e as DefaultRadio,x as DisabledCheckbox,n as DisabledRadio,u as NeutralHybridCheckbox,t as NeutralHybridRadio,o as NeutralHybridRadioSelected,l as NeutralHybridRoundSelectedCheckbox,r as NeutralRadio,a as NeutralRadioSelected,p as NeutralSelectedCheckbox,i as ShapeRoundNeutralCheckbox,j as __namedExportsOrder,$ as default};
+}`,...x.parameters?.docs?.source}}};const I=["DefaultRadio","NeutralRadio","NeutralRadioSelected","NeutralHybridRadio","NeutralHybridRadioSelected","BrandedRadio","BrandedRadioSelected","DisabledRadio","DefaultNeutralCheckbox","ShapeRoundNeutralCheckbox","NeutralSelectedCheckbox","NeutralHybridCheckbox","NeutralHybridRoundSelectedCheckbox","BrandedCheckbox","BrandedSelectedCheckbox","DisabledCheckbox"];export{b as BrandedCheckbox,s as BrandedRadio,d as BrandedRadioSelected,m as BrandedSelectedCheckbox,c as DefaultNeutralCheckbox,e as DefaultRadio,x as DisabledCheckbox,n as DisabledRadio,u as NeutralHybridCheckbox,t as NeutralHybridRadio,o as NeutralHybridRadioSelected,l as NeutralHybridRoundSelectedCheckbox,r as NeutralRadio,a as NeutralRadioSelected,p as NeutralSelectedCheckbox,i as ShapeRoundNeutralCheckbox,I as __namedExportsOrder,E as default};

package/dist/assets/{tertiary-nav.stories-DVHnc6aS.js → tertiary-nav.stories-D4q5K-am.js}

@@ -1,4 +1,4 @@
-import{i as f,b as l}from"./iframe-CdWmiVXf.js";import{s as y}from"./spread-BOaHI3Dl.js";import{C as x,n as p}from"./cre8-element-gkCuLp-W.js";import{o as h}from"./if-defined-sxEueMHN.js";import"./preload-helper-PPVm8Dsz.js";import"./directive-b18f_ppQ.js";import"./_commonjsHelpers-DaWZu8wl.js";const z=f`.cre8-u-content-knockout-brand {
+import{a as f,b as l}from"./iframe-dHvya7sk.js";import{s as y}from"./spread-BPiNgQQF.js";import{w}from"./decorator-iVSD-Llo.js";import{C as x,n as p}from"./cre8-element-DfmMtHJO.js";import{o as h}from"./if-defined-HKKhGupN.js";import"./preload-helper-PPVm8Dsz.js";import"./chunk-EUVGDK4H-rHCQfRxh.js";import"./_commonjsHelpers-DaWZu8wl.js";const z=f`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -610,13 +618,13 @@ span.ripple {
   margin: 0;
   padding: 0;
   list-style: none;
-}`;var w=Object.defineProperty,v=(r,e,a,c)=>{for(var t=void 0,i=r.length-1,n;i>=0;i--)(n=r[i])&&(t=n(e,a,t)||t);return t&&w(e,a,t),t};const g=class g extends x{constructor(){super(...arguments),this.navAriaLabel="tertiary"}render(){const e=this.componentClassNames("cre8-c-tertiary-nav",{"cre8-c-tertiary-nav--full-width":this.fullWidth});return l`
+}`;var k=Object.defineProperty,v=(r,e,a,c)=>{for(var t=void 0,i=r.length-1,n;i>=0;i--)(n=r[i])&&(t=n(e,a,t)||t);return t&&k(e,a,t),t};const g=class g extends x{constructor(){super(...arguments),this.navAriaLabel="tertiary"}render(){const e=this.componentClassNames("cre8-c-tertiary-nav",{"cre8-c-tertiary-nav--full-width":this.fullWidth});return l`
       <nav aria-label="${this.navAriaLabel}" role="navigation" class="${e}">
         <ul role="list" class="cre8-c-tertiary-nav__list">
           <slot></slot>
         </ul>
       </nav>
-    `}};g.styles=[z];let o=g;v([p({type:Boolean,reflect:!0})],o.prototype,"fullWidth");v([p()],o.prototype,"navAriaLabel");customElements.get("cre8-tertiary-nav")===void 0&&customElements.define("cre8-tertiary-nav",o);const k=f`.cre8-u-content-knockout-brand {
+    `}};g.styles=[z];let o=g;v([p({type:Boolean,reflect:!0})],o.prototype,"fullWidth");v([p()],o.prototype,"navAriaLabel");customElements.get("cre8-tertiary-nav")===void 0&&customElements.define("cre8-tertiary-nav",o);const I=f`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -990,6 +998,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1162,6 +1174,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1250,7 +1266,7 @@ span.ripple {
 .cre8-c-tertiary-nav-item__link:active, .cre8-is-current .cre8-c-tertiary-nav-item__link {
   color: var(--cre8-color-content-default);
   background-color: var(--cre8-color-bg-subtle);
-}`;var I=Object.defineProperty,b=(r,e,a,c)=>{for(var t=void 0,i=r.length-1,n;i>=0;i--)(n=r[i])&&(t=n(e,a,t)||t);return t&&I(e,a,t),t};const u=class u extends x{_handleOnClick(){this.closest("cre8-tertiary-nav").shadowRoot.querySelector("slot").assignedElements({flatten:!1}).forEach(c=>{c.isCurrent=!1}),this.isCurrent=!0}render(){const e=this.componentClassNames("cre8-c-tertiary-nav-item",{"cre8-is-current":this.isCurrent});return l`
+}`;var T=Object.defineProperty,b=(r,e,a,c)=>{for(var t=void 0,i=r.length-1,n;i>=0;i--)(n=r[i])&&(t=n(e,a,t)||t);return t&&T(e,a,t),t};const u=class u extends x{_handleOnClick(){this.closest("cre8-tertiary-nav").shadowRoot.querySelector("slot").assignedElements({flatten:!1}).forEach(c=>{c.isCurrent=!1}),this.isCurrent=!0}render(){const e=this.componentClassNames("cre8-c-tertiary-nav-item",{"cre8-is-current":this.isCurrent});return l`
       <li role="listitem" class="${e}">
         <a
           class="cre8-c-tertiary-nav-item__link"
@@ -1261,7 +1277,7 @@ span.ripple {
           <slot></slot>
         </a>
       </li>
-    `}};u.styles=[k];let d=u;b([p()],d.prototype,"href");b([p({type:Boolean,reflect:!0})],d.prototype,"isCurrent");customElements.get("cre8-tertiary-nav-item")===void 0&&customElements.define("cre8-tertiary-nav-item",d);const{withActions:_}=__STORYBOOK_MODULE_PREVIEW_API__,F={title:"Cre8 Components/Tertiary Nav",component:"cre8-tertiary-nav",parameters:{status:{type:"inProgress"},actions:{handles:["click"]}},decorators:[_]},m=r=>l`
+    `}};u.styles=[I];let d=u;b([p()],d.prototype,"href");b([p({type:Boolean,reflect:!0})],d.prototype,"isCurrent");customElements.get("cre8-tertiary-nav-item")===void 0&&customElements.define("cre8-tertiary-nav-item",d);const X={title:"Cre8 Components/Tertiary Nav",component:"cre8-tertiary-nav",parameters:{status:{type:"inProgress"},actions:{handles:["click"]}},decorators:[w]},m=r=>l`
 <cre8-tertiary-nav ${y(r)}>
   <cre8-tertiary-nav-item href="#" ?isCurrent=${!0}>Tertiary Nav Item 1</cre8-tertiary-nav-item>
   <cre8-tertiary-nav-item href="#">Tertiary Nav Item 2</cre8-tertiary-nav-item>
@@ -1289,4 +1305,4 @@ span.ripple {
   <cre8-tertiary-nav-item href="#">Tertiary Nav Item 3</cre8-tertiary-nav-item>
   <cre8-tertiary-nav-item href="#">Tertiary Nav Item 4</cre8-tertiary-nav-item>
   <cre8-tertiary-nav-item href="#">Tertiary Nav Item 5</cre8-tertiary-nav-item>
-</cre8-tertiary-nav>\``,...s.parameters?.docs?.source}}};const X=["Default","FullWidth"];export{m as Default,s as FullWidth,X as __namedExportsOrder,F as default};
+</cre8-tertiary-nav>\``,...s.parameters?.docs?.source}}};const E=["Default","FullWidth"];export{m as Default,s as FullWidth,E as __namedExportsOrder,X as default};

package/dist/assets/{text-link-Dg8E1dhI.js → text-link-4qLRIeJB.js}

@@ -1,4 +1,4 @@
-import{i as p,b as s}from"./iframe-CdWmiVXf.js";import{o as c}from"./if-defined-sxEueMHN.js";import{C as g,n as r}from"./cre8-element-gkCuLp-W.js";const h=p`.cre8-u-content-knockout-brand {
+import{a as p,b as s}from"./iframe-dHvya7sk.js";import{o as c}from"./if-defined-HKKhGupN.js";import{C as g,n as r}from"./cre8-element-DfmMtHJO.js";const h=p`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**

package/dist/assets/text-link.stories-D6BRm2I5.js

@@ -0,0 +1 @@
+import{b as e}from"./iframe-dHvya7sk.js";import{s as c}from"./spread-BPiNgQQF.js";import"./text-link-4qLRIeJB.js";import"./preload-helper-PPVm8Dsz.js";import"./if-defined-HKKhGupN.js";import"./cre8-element-DfmMtHJO.js";import"./_commonjsHelpers-DaWZu8wl.js";const u={title:"Cre8 Components/Text Link",component:"cre8-text-link",parameters:{status:{type:"inProgress"}}},r=n=>e`<cre8-text-link ${c(n)} href="#">Text Link</cre8-text-link>`,t=()=>e`<cre8-text-link variant="secondary" href="#">Secondary Text Link</cre8-text-link>`,a=()=>e`<cre8-text-link variant="display" href="#">Display Text Link</cre8-text-link>`,s=()=>e`<div style="padding: 1rem; background:#000"><cre8-text-link ?inverted=${!0} href="#">Inverted Text Link</cre8-text-link></div>`,i=()=>e`<cre8-text-link size="sm" href="#">Small Text Link</cre8-text-link>`;r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:'args => html`<cre8-text-link ${spread(args)} href="#">Text Link</cre8-text-link>`',...r.parameters?.docs?.source}}};t.parameters={...t.parameters,docs:{...t.parameters?.docs,source:{originalSource:'() => html`<cre8-text-link variant="secondary" href="#">Secondary Text Link</cre8-text-link>`',...t.parameters?.docs?.source}}};a.parameters={...a.parameters,docs:{...a.parameters?.docs,source:{originalSource:'() => html`<cre8-text-link variant="display" href="#">Display Text Link</cre8-text-link>`',...a.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:'() => html`<div style="padding: 1rem; background:#000"><cre8-text-link ?inverted=${true} href="#">Inverted Text Link</cre8-text-link></div>`',...s.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:'() => html`<cre8-text-link size="sm" href="#">Small Text Link</cre8-text-link>`',...i.parameters?.docs?.source}}};const f=["Default","Secondary","Display","Inverted","Small"];export{r as Default,a as Display,s as Inverted,t as Secondary,i as Small,f as __namedExportsOrder,u as default};

package/dist/assets/{text-passage-Dw-BWzip.js → text-passage-DGaI5i2I.js}

@@ -1,4 +1,4 @@
-import{i as d,b as m}from"./iframe-CdWmiVXf.js";import{C as g,n as l}from"./cre8-element-gkCuLp-W.js";const c=d`.cre8-u-content-knockout-brand {
+import{a as d,b as p}from"./iframe-dHvya7sk.js";import{C as g,n as l}from"./cre8-element-DfmMtHJO.js";const c=d`.cre8-u-content-knockout-brand {
   color: var(----cre8-color-content-knockout-brand);
 }
 
@@ -372,6 +372,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -544,6 +548,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1211,6 +1219,10 @@ img {
 
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1383,6 +1395,10 @@ span.ripple {
 }
 :root {
   --size-base-unit: 0.5rem;
+  --cre8-l-max-width: 82.5rem;
+  /* 1 */
+  --cre8-l-linelength-width: 42rem;
+  /* 1 */
 }
 
 /**
@@ -1458,8 +1474,8 @@ span.ripple {
 
 ::slotted(.header) {
   margin-bottom: 0.75rem;
-}`;var f=Object.defineProperty,p=(n,a,e,u)=>{for(var t=void 0,i=n.length-1,s;i>=0;i--)(s=n[i])&&(t=s(a,e,t)||t);return t&&f(a,e,t),t};const o=class o extends g{constructor(){super(...arguments),this.size="default"}connectedCallback(){if(super.connectedCallback(),!document.head.querySelector("#cre8-text-passage-styles")){const e=document.createElement("style");e.id="cre8-text-passage-styles",e.innerHTML=c.cssText,document.head.appendChild(e)}}render(){const a=this.componentClassNames("cre8-c-text-passage",{"cre8-c-text-passage--default":this.size==="default"||void 0,"cre8-c-text-passage--inverted":this.inverted,"cre8-c-text-passage--small":this.size==="small","cre8-c-text-passage--large":this.size==="large"});return m`
+}`;var f=Object.defineProperty,m=(o,a,e,u)=>{for(var t=void 0,i=o.length-1,s;i>=0;i--)(s=o[i])&&(t=s(a,e,t)||t);return t&&f(a,e,t),t};const n=class n extends g{constructor(){super(...arguments),this.size="default"}connectedCallback(){if(super.connectedCallback(),!document.head.querySelector("#cre8-text-passage-styles")){const e=document.createElement("style");e.id="cre8-text-passage-styles",e.innerHTML=c.cssText,document.head.appendChild(e)}}render(){const a=this.componentClassNames("cre8-c-text-passage",{"cre8-c-text-passage--default":this.size==="default"||void 0,"cre8-c-text-passage--inverted":this.inverted,"cre8-c-text-passage--small":this.size==="small","cre8-c-text-passage--large":this.size==="large"});return p`
       <div class="${a}">
         <slot></slot>
       </div>
-    `}};o.styles=[h];let r=o;p([l({type:Boolean,reflect:!0})],r.prototype,"inverted");p([l()],r.prototype,"size");customElements.get("cre8-text-passage")===void 0&&customElements.define("cre8-text-passage",r);
+    `}};n.styles=[h];let r=n;m([l({type:Boolean,reflect:!0})],r.prototype,"inverted");m([l()],r.prototype,"size");customElements.get("cre8-text-passage")===void 0&&customElements.define("cre8-text-passage",r);

package/dist/assets/{text-passage.stories-CzfR1z4-.js → text-passage.stories-DkmXVUhH.js}

@@ -1,4 +1,4 @@
-import{b as l}from"./iframe-CdWmiVXf.js";import{s as a}from"./spread-BOaHI3Dl.js";import"./text-passage-Dw-BWzip.js";import"./heading-BgO3jH9M.js";import"./preload-helper-PPVm8Dsz.js";import"./directive-b18f_ppQ.js";import"./cre8-element-gkCuLp-W.js";import"./_commonjsHelpers-DaWZu8wl.js";const h={title:"cre8 Components/Text Passage",component:"cre8-text-passage",parameters:{status:{type:"inProgress"}},argTypes:{size:{options:["default","small","large"],control:{type:"select"}},inverted:{control:{type:"boolean"}}}},i={render:e=>l`<cre8-text-passage ${a(e)}>
+import{b as l}from"./iframe-dHvya7sk.js";import{s as a}from"./spread-BPiNgQQF.js";import"./text-passage-DGaI5i2I.js";import"./heading-485Jz7JZ.js";import"./preload-helper-PPVm8Dsz.js";import"./cre8-element-DfmMtHJO.js";import"./_commonjsHelpers-DaWZu8wl.js";const g={title:"cre8 Components/Text Passage",component:"cre8-text-passage",parameters:{status:{type:"inProgress"}},argTypes:{size:{options:["default","small","large"],control:{type:"select"}},inverted:{control:{type:"boolean"}}}},i={render:e=>l`<cre8-text-passage ${a(e)}>
     <p>
       A text passage contains arbitrary text that might come from a CMS. It should live within a container that caps the line length of the text to
       avoid a straining reading experience.
@@ -178,4 +178,4 @@ import{b as l}from"./iframe-CdWmiVXf.js";import{s as a}from"./spread-BOaHI3Dl.js
       </blockquote>
     </cre8-text-passage>
   </div>\`
-}`,...s.parameters?.docs?.source}}};const H=["Default","Small","Large","Inverted"];export{i as Default,s as Inverted,r as Large,t as Small,H as __namedExportsOrder,h as default};
+}`,...s.parameters?.docs?.source}}};const h=["Default","Small","Large","Inverted"];export{i as Default,s as Inverted,r as Large,t as Small,h as __namedExportsOrder,g as default};