@preply/ds-docs 11.2.0 → 11.4.0

package/dist/assets/{Badge-BPd-gr8r.js → Badge-DeL8OM1F.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";import{n as c,t as l}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as u,t as d}from"./Icon-DwVTLcDP.js";var f,p,m,h=t((()=>{f=`badge__ioy0w`,p=`label__lXPEF`,m={badge:f,label:p}})),g,_,v,y,b=t((()=>{s(),i(),g=e(n(),1),c(),u(),h(),_=a(),v=e=>{switch(e){case`xs`:return`small`;case`s`:return`medium`;case`m`:return`large`;default:return e}},y=(0,g.forwardRef)(function({type:e=`neutral`,size:t=`medium`,leadingSvgIcon:n,dataset:i,children:a,accent:s,inverted:c,hideLabel:u,...f},p){let h=v(t),g={...i,size:h};return s===void 0&&c===void 0?g.type=e:(g.accent=s||`unset`,g.inverted=!!c),(0,_.jsxs)(`span`,{...l(f),ref:p,className:m.badge,...r(g,{preplyDsComponent:o.Badge}),children:[!!n&&(0,_.jsx)(d,{accent:`primary`,size:t===`large`?`24`:`16`,svg:n}),(0,_.jsx)(`span`,{className:m.label,"data-hidden":u,children:a})]})});try{y.displayName=`Badge`,y.__docgenInfo={description:``,displayName:`Badge`,props:{size:{defaultValue:{value:`medium`},description:`The size of the badge.`,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"s"`},{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`"xs"`},{value:`"m"`}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";import{n as c,t as l}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as u,t as d}from"./Icon-Dqr2b6tP.js";var f,p,m,h=t((()=>{f=`badge__ioy0w`,p=`label__lXPEF`,m={badge:f,label:p}})),g,_,v,y,b=t((()=>{s(),i(),g=e(n(),1),c(),u(),h(),_=a(),v=e=>{switch(e){case`xs`:return`small`;case`s`:return`medium`;case`m`:return`large`;default:return e}},y=(0,g.forwardRef)(function({type:e=`neutral`,size:t=`medium`,leadingSvgIcon:n,dataset:i,children:a,accent:s,inverted:c,hideLabel:u,...f},p){let h=v(t),g={...i,size:h};return s===void 0&&c===void 0?g.type=e:(g.accent=s||`unset`,g.inverted=!!c),(0,_.jsxs)(`span`,{...l(f),ref:p,className:m.badge,...r(g,{preplyDsComponent:o.Badge}),children:[!!n&&(0,_.jsx)(d,{accent:`primary`,size:t===`large`?`24`:`16`,svg:n}),(0,_.jsx)(`span`,{className:m.label,"data-hidden":u,children:a})]})});try{y.displayName=`Badge`,y.__docgenInfo={description:``,displayName:`Badge`,props:{size:{defaultValue:{value:`medium`},description:`The size of the badge.`,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"s"`},{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`"xs"`},{value:`"m"`}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
 @example import TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';
 
 <Badge leadingSvgIcon={TokyoUITag}>Badge</Badge>
@@ -7,4 +7,4 @@ or
 
 Hides badge label visually, but keeps it in the accessibility tree.
 Use this prop to implement icons-only badges.
-@example <Badge leadingSvgIcon={<TokyoUITag />} hideLabel>Badge</Badge>`,name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:`@deprecated badge children should have all necessary information`,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},type:{defaultValue:{value:`neutral`},description:`The type of the badge.`,name:`type`,required:!1,type:{name:`enum`,value:[{value:`"positive"`},{value:`"info"`},{value:`"warning"`},{value:`"critical"`},{value:`"neutral"`},{value:`"ai"`}]}},accent:{defaultValue:null,description:"@deprecated Use `type` instead.",name:`accent`,required:!1,type:{name:`enum`,value:[{value:`"accent"`},{value:`"tertiary"`},{value:`"positive"`},{value:`"info"`},{value:`"warning"`},{value:`"critical"`}]}},inverted:{defaultValue:null,description:`@deprecated inverted badge is deprecated & will be removed in the future releases`,name:`inverted`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}}}}}catch{}}));export{b as n,y as t};
+@example <Badge leadingSvgIcon={<TokyoUITag />} hideLabel>Badge</Badge>`,name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:`@deprecated badge children should have all necessary information`,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},type:{defaultValue:{value:`neutral`},description:`The type of the badge.`,name:`type`,required:!1,type:{name:`enum`,value:[{value:`"neutral"`},{value:`"ai"`},{value:`"critical"`},{value:`"positive"`},{value:`"warning"`},{value:`"info"`}]}},accent:{defaultValue:null,description:"@deprecated Use `type` instead.",name:`accent`,required:!1,type:{name:`enum`,value:[{value:`"tertiary"`},{value:`"critical"`},{value:`"positive"`},{value:`"warning"`},{value:`"accent"`},{value:`"info"`}]}},inverted:{defaultValue:null,description:`@deprecated inverted badge is deprecated & will be removed in the future releases`,name:`inverted`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}}}}}catch{}}));export{b as n,y as t};

package/dist/assets/{Badge.stories-DIgYXyBb.js → Badge.stories-BemzPh97.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Badge-BPd-gr8r.js";import{n as o,t as s}from"./LayoutFlex-CEr_Bd5T.js";import{n as c,t as l}from"./TokyoUITag-BmP85Jya.js";var u,d,f,p,m,h,g,_;t((()=>{c(),e(n(),1),o(),i(),u=r(),d={title:`components/Badge`,component:a,parameters:{layout:`padded`,docs:{source:{type:`dynamic`}}}},f=()=>(0,u.jsxs)(s,{gap:`16`,children:[(0,u.jsx)(a,{type:`neutral`,children:`Neutral`}),(0,u.jsx)(a,{type:`positive`,children:`Positive`}),(0,u.jsx)(a,{type:`info`,children:`Info`}),(0,u.jsx)(a,{type:`warning`,children:`Warning`}),(0,u.jsx)(a,{type:`critical`,children:`Critical`}),(0,u.jsx)(a,{type:`ai`,children:`AI`}),(0,u.jsx)(a,{type:`neutral`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Neutral`}),(0,u.jsx)(a,{type:`positive`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Positive`}),(0,u.jsx)(a,{type:`info`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Info`}),(0,u.jsx)(a,{type:`warning`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Warning`}),(0,u.jsx)(a,{type:`critical`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Critical`}),(0,u.jsx)(a,{type:`ai`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`AI`})]}),l.displayName=`TokyoUITag`,p=()=>(0,u.jsxs)(s,{gap:`16`,alignItems:`center`,children:[(0,u.jsx)(a,{size:`small`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Small`}),(0,u.jsx)(a,{size:`medium`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Medium`}),(0,u.jsx)(a,{size:`large`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Large`})]}),m=()=>(0,u.jsx)(s,{gap:`16`,direction:`column`,children:(0,u.jsx)(a,{size:`small`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Badge`})}),m.tags=[`!autodocs`],h=()=>(0,u.jsx)(`div`,{style:{maxWidth:150,margin:`0 auto`},children:(0,u.jsx)(a,{size:`medium`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`I'm way too long to be a badge label`})}),g={parameters:{chromatic:{disableSnapshot:!0}},args:{type:`neutral`,size:`medium`,children:`Badge`,dataset:{qaid:`badge`}},argTypes:{dataset:{control:`object`},leadingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":l},control:`select`},assistiveText:{table:{disable:!0}},accent:{table:{disable:!0}},inverted:{table:{disable:!0}}}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`() => <LayoutFlex gap="16">
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Badge-DeL8OM1F.js";import{n as o,t as s}from"./LayoutFlex-BlWwmFhv.js";import{n as c,t as l}from"./TokyoUITag-C8mbO1a7.js";var u,d,f,p,m,h,g,_;t((()=>{c(),e(n(),1),o(),i(),u=r(),d={title:`components/Badge`,component:a,parameters:{layout:`padded`,docs:{source:{type:`dynamic`}}}},f=()=>(0,u.jsxs)(s,{gap:`16`,children:[(0,u.jsx)(a,{type:`neutral`,children:`Neutral`}),(0,u.jsx)(a,{type:`positive`,children:`Positive`}),(0,u.jsx)(a,{type:`info`,children:`Info`}),(0,u.jsx)(a,{type:`warning`,children:`Warning`}),(0,u.jsx)(a,{type:`critical`,children:`Critical`}),(0,u.jsx)(a,{type:`ai`,children:`AI`}),(0,u.jsx)(a,{type:`neutral`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Neutral`}),(0,u.jsx)(a,{type:`positive`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Positive`}),(0,u.jsx)(a,{type:`info`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Info`}),(0,u.jsx)(a,{type:`warning`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Warning`}),(0,u.jsx)(a,{type:`critical`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Critical`}),(0,u.jsx)(a,{type:`ai`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`AI`})]}),l.displayName=`TokyoUITag`,p=()=>(0,u.jsxs)(s,{gap:`16`,alignItems:`center`,children:[(0,u.jsx)(a,{size:`small`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Small`}),(0,u.jsx)(a,{size:`medium`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Medium`}),(0,u.jsx)(a,{size:`large`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Large`})]}),m=()=>(0,u.jsx)(s,{gap:`16`,direction:`column`,children:(0,u.jsx)(a,{size:`small`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`Badge`})}),m.tags=[`!autodocs`],h=()=>(0,u.jsx)(`div`,{style:{maxWidth:150,margin:`0 auto`},children:(0,u.jsx)(a,{size:`medium`,leadingSvgIcon:(0,u.jsx)(l,{}),children:`I'm way too long to be a badge label`})}),g={parameters:{chromatic:{disableSnapshot:!0}},args:{type:`neutral`,size:`medium`,children:`Badge`,dataset:{qaid:`badge`}},argTypes:{dataset:{control:`object`},leadingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":l},control:`select`},assistiveText:{table:{disable:!0}},accent:{table:{disable:!0}},inverted:{table:{disable:!0}}}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`() => <LayoutFlex gap="16">
         <Badge type="neutral">Neutral</Badge>
         <Badge type="positive">Positive</Badge>
         <Badge type="info">Info</Badge>

package/dist/assets/{Box-G2_C7Jeq.js → Box-CcR4H93c.js}

@@ -1,3 +1,3 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i,w as a,x as o,y as s}from"./dist-DtfJeYQK.js";import{t as c}from"./jsx-runtime-C2wGStra.js";import{n as l,t as u}from"./dist-Cc1j9Pjk.js";import{n as d,t as f}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{c as p,s as m}from"./layout-relative.module-BMQDPKP6.js";var h,g,_=t((()=>{h=`Box__T6Fyt`,g={Box:h,"Box--box-radius-0":`Box--box-radius-0__FWPBJ`,"Box--box-radius-2":`Box--box-radius-2__IXJHQ`,"Box--box-radius-4":`Box--box-radius-4__aoSlX`,"Box--box-radius-8":`Box--box-radius-8__-BuzF`,"Box--box-radius-16":`Box--box-radius-16__n3666`,"Box--box-radius-300":`Box--box-radius-300__MyFTq`,"Box--narrow-l--box-radius-0":`Box--narrow-l--box-radius-0__rbA8v`,"Box--narrow-l--box-radius-2":`Box--narrow-l--box-radius-2__Cn0nB`,"Box--narrow-l--box-radius-4":`Box--narrow-l--box-radius-4__dXX4d`,"Box--narrow-l--box-radius-8":`Box--narrow-l--box-radius-8__c2qTs`,"Box--narrow-l--box-radius-16":`Box--narrow-l--box-radius-16__7yiZ2`,"Box--narrow-l--box-radius-300":`Box--narrow-l--box-radius-300__Ic2BC`,"Box--medium-s--box-radius-0":`Box--medium-s--box-radius-0__6dX4D`,"Box--medium-s--box-radius-2":`Box--medium-s--box-radius-2__h-yhf`,"Box--medium-s--box-radius-4":`Box--medium-s--box-radius-4__YmbvG`,"Box--medium-s--box-radius-8":`Box--medium-s--box-radius-8__NOIeK`,"Box--medium-s--box-radius-16":`Box--medium-s--box-radius-16__Q-4Io`,"Box--medium-s--box-radius-300":`Box--medium-s--box-radius-300__fynf3`,"Box--medium-l--box-radius-0":`Box--medium-l--box-radius-0__-HCNC`,"Box--medium-l--box-radius-2":`Box--medium-l--box-radius-2__cWx-n`,"Box--medium-l--box-radius-4":`Box--medium-l--box-radius-4__ibcr4`,"Box--medium-l--box-radius-8":`Box--medium-l--box-radius-8__zm-dC`,"Box--medium-l--box-radius-16":`Box--medium-l--box-radius-16__o3E1Q`,"Box--medium-l--box-radius-300":`Box--medium-l--box-radius-300__Hsi3C`,"Box--wide-s--box-radius-0":`Box--wide-s--box-radius-0__H9zOa`,"Box--wide-s--box-radius-2":`Box--wide-s--box-radius-2__FnsdM`,"Box--wide-s--box-radius-4":`Box--wide-s--box-radius-4__G4jL0`,"Box--wide-s--box-radius-8":`Box--wide-s--box-radius-8__7Mz6S`,"Box--wide-s--box-radius-16":`Box--wide-s--box-radius-16__or-lk`,"Box--wide-s--box-radius-300":`Box--wide-s--box-radius-300__rPeg0`,"Box--wide-l--box-radius-0":`Box--wide-l--box-radius-0__HQ2Tn`,"Box--wide-l--box-radius-2":`Box--wide-l--box-radius-2__GYO54`,"Box--wide-l--box-radius-4":`Box--wide-l--box-radius-4__267az`,"Box--wide-l--box-radius-8":`Box--wide-l--box-radius-8__1hPOR`,"Box--wide-l--box-radius-16":`Box--wide-l--box-radius-16__gp8Ov`,"Box--wide-l--box-radius-300":`Box--wide-l--box-radius-300__NiuZR`,"Box--background-primary":`Box--background-primary__00zVu`,"Box--background-secondary":`Box--background-secondary__hY7w0`,"Box--background-tertiary":`Box--background-tertiary__cIPge`,"Box--background-overlay":`Box--background-overlay__vbs8V`,"Box--background-disabled":`Box--background-disabled__81WYT`,"Box--background-brand":`Box--background-brand__2W0VB`,"Box--background-brandB2b":`Box--background-brandB2b__KQrLm`,"Box--background-accentLight":`Box--background-accentLight__x6RrQ`,"Box--background-accentDark":`Box--background-accentDark__agpDd`,"Box--background-positiveLight":`Box--background-positiveLight__67dRq`,"Box--background-positiveDark":`Box--background-positiveDark__lYghV`,"Box--background-infoLight":`Box--background-infoLight__u-TX4`,"Box--background-infoDark":`Box--background-infoDark__ud4qs`,"Box--background-warningLight":`Box--background-warningLight__JtSuS`,"Box--background-warningDark":`Box--background-warningDark__SIgOQ`,"Box--background-criticalLight":`Box--background-criticalLight__uPTDs`,"Box--background-criticalDark":`Box--background-criticalDark__12Zft`,"Box--background-statusOnline":`Box--background-statusOnline__5PZcQ`,"Box--background-statusOffline":`Box--background-statusOffline__Vh0CO`,"Box--background-primaryInverted":`Box--background-primaryInverted__TePy2`,"Box--background-secondaryInverted":`Box--background-secondaryInverted__tMytW`,"Box--background-tertiaryInverted":`Box--background-tertiaryInverted__K2wU5`}})),v,y,b,x=t((()=>{a(),i(),v=e(n(),1),d(),p(),_(),u(),y=c(),b=(0,v.forwardRef)(function({children:e,background:t=`primary`,radius:n=`16`,padding:i=`24`,tag:a,dataset:c,...u},d){let p=s(g,l.Box,[o(`box-radius`,n),o(`background`,t)]),h=m(i),_=a??`div`,v=[...p,...h];return(0,y.jsx)(_,{...f(u),ref:d,className:v.join(` `),...r(c,{preplyDsComponent:l.Box}),children:e})});try{b.displayName=`Box`,b.__docgenInfo={description:`A styleable container.
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i,w as a,x as o,y as s}from"./dist-DtfJeYQK.js";import{t as c}from"./jsx-runtime-C2wGStra.js";import{n as l,t as u}from"./dist-Cc1j9Pjk.js";import{n as d,t as f}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{c as p,s as m}from"./layout-relative.module-C0ke0xP4.js";var h,g,_=t((()=>{h=`Box__T6Fyt`,g={Box:h,"Box--box-radius-0":`Box--box-radius-0__FWPBJ`,"Box--box-radius-2":`Box--box-radius-2__IXJHQ`,"Box--box-radius-4":`Box--box-radius-4__aoSlX`,"Box--box-radius-8":`Box--box-radius-8__-BuzF`,"Box--box-radius-16":`Box--box-radius-16__n3666`,"Box--box-radius-300":`Box--box-radius-300__MyFTq`,"Box--narrow-l--box-radius-0":`Box--narrow-l--box-radius-0__rbA8v`,"Box--narrow-l--box-radius-2":`Box--narrow-l--box-radius-2__Cn0nB`,"Box--narrow-l--box-radius-4":`Box--narrow-l--box-radius-4__dXX4d`,"Box--narrow-l--box-radius-8":`Box--narrow-l--box-radius-8__c2qTs`,"Box--narrow-l--box-radius-16":`Box--narrow-l--box-radius-16__7yiZ2`,"Box--narrow-l--box-radius-300":`Box--narrow-l--box-radius-300__Ic2BC`,"Box--medium-s--box-radius-0":`Box--medium-s--box-radius-0__6dX4D`,"Box--medium-s--box-radius-2":`Box--medium-s--box-radius-2__h-yhf`,"Box--medium-s--box-radius-4":`Box--medium-s--box-radius-4__YmbvG`,"Box--medium-s--box-radius-8":`Box--medium-s--box-radius-8__NOIeK`,"Box--medium-s--box-radius-16":`Box--medium-s--box-radius-16__Q-4Io`,"Box--medium-s--box-radius-300":`Box--medium-s--box-radius-300__fynf3`,"Box--medium-l--box-radius-0":`Box--medium-l--box-radius-0__-HCNC`,"Box--medium-l--box-radius-2":`Box--medium-l--box-radius-2__cWx-n`,"Box--medium-l--box-radius-4":`Box--medium-l--box-radius-4__ibcr4`,"Box--medium-l--box-radius-8":`Box--medium-l--box-radius-8__zm-dC`,"Box--medium-l--box-radius-16":`Box--medium-l--box-radius-16__o3E1Q`,"Box--medium-l--box-radius-300":`Box--medium-l--box-radius-300__Hsi3C`,"Box--wide-s--box-radius-0":`Box--wide-s--box-radius-0__H9zOa`,"Box--wide-s--box-radius-2":`Box--wide-s--box-radius-2__FnsdM`,"Box--wide-s--box-radius-4":`Box--wide-s--box-radius-4__G4jL0`,"Box--wide-s--box-radius-8":`Box--wide-s--box-radius-8__7Mz6S`,"Box--wide-s--box-radius-16":`Box--wide-s--box-radius-16__or-lk`,"Box--wide-s--box-radius-300":`Box--wide-s--box-radius-300__rPeg0`,"Box--wide-l--box-radius-0":`Box--wide-l--box-radius-0__HQ2Tn`,"Box--wide-l--box-radius-2":`Box--wide-l--box-radius-2__GYO54`,"Box--wide-l--box-radius-4":`Box--wide-l--box-radius-4__267az`,"Box--wide-l--box-radius-8":`Box--wide-l--box-radius-8__1hPOR`,"Box--wide-l--box-radius-16":`Box--wide-l--box-radius-16__gp8Ov`,"Box--wide-l--box-radius-300":`Box--wide-l--box-radius-300__NiuZR`,"Box--background-primary":`Box--background-primary__00zVu`,"Box--background-secondary":`Box--background-secondary__hY7w0`,"Box--background-tertiary":`Box--background-tertiary__cIPge`,"Box--background-overlay":`Box--background-overlay__vbs8V`,"Box--background-disabled":`Box--background-disabled__81WYT`,"Box--background-brand":`Box--background-brand__2W0VB`,"Box--background-brandB2b":`Box--background-brandB2b__KQrLm`,"Box--background-accentLight":`Box--background-accentLight__x6RrQ`,"Box--background-accentDark":`Box--background-accentDark__agpDd`,"Box--background-positiveLight":`Box--background-positiveLight__67dRq`,"Box--background-positiveDark":`Box--background-positiveDark__lYghV`,"Box--background-infoLight":`Box--background-infoLight__u-TX4`,"Box--background-infoDark":`Box--background-infoDark__ud4qs`,"Box--background-warningLight":`Box--background-warningLight__JtSuS`,"Box--background-warningDark":`Box--background-warningDark__SIgOQ`,"Box--background-criticalLight":`Box--background-criticalLight__uPTDs`,"Box--background-criticalDark":`Box--background-criticalDark__12Zft`,"Box--background-statusOnline":`Box--background-statusOnline__5PZcQ`,"Box--background-statusOffline":`Box--background-statusOffline__Vh0CO`,"Box--background-primaryInverted":`Box--background-primaryInverted__TePy2`,"Box--background-secondaryInverted":`Box--background-secondaryInverted__tMytW`,"Box--background-tertiaryInverted":`Box--background-tertiaryInverted__K2wU5`}})),v,y,b,x=t((()=>{a(),i(),v=e(n(),1),d(),p(),_(),u(),y=c(),b=(0,v.forwardRef)(function({children:e,background:t=`primary`,radius:n=`16`,padding:i=`24`,tag:a,dataset:c,...u},d){let p=s(g,l.Box,[o(`box-radius`,n),o(`background`,t)]),h=m(i),_=a??`div`,v=[...p,...h];return(0,y.jsx)(_,{...f(u),ref:d,className:v.join(` `),...r(c,{preplyDsComponent:l.Box}),children:e})});try{b.displayName=`Box`,b.__docgenInfo={description:`A styleable container.
 
-Use this with \`Layout*\` components to create complex content containers.`,displayName:`Box`,props:{background:{defaultValue:{value:`primary`},description:``,name:`background`,required:!1,type:{name:`enum`,value:[{value:`"disabled"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"accentDark"`},{value:`"overlay"`},{value:`"brand"`},{value:`"brandB2b"`},{value:`"accentLight"`},{value:`"positiveLight"`},{value:`"positiveDark"`},{value:`"infoLight"`},{value:`"infoDark"`},{value:`"warningLight"`},{value:`"warningDark"`},{value:`"criticalLight"`},{value:`"criticalDark"`},{value:`"statusOnline"`},{value:`"statusOffline"`},{value:`"primaryInverted"`},{value:`"secondaryInverted"`},{value:`"tertiaryInverted"`}]}},radius:{defaultValue:{value:`16`},description:``,name:`radius`,required:!1,type:{name:`enum`,value:[{value:`"0"`},{value:`"2"`},{value:`"4"`},{value:`"8"`},{value:`"16"`},{value:`"300"`},{value:`ResponsiveProp<BoxRadius>`}]}},tag:{defaultValue:null,description:``,name:`tag`,required:!1,type:{name:`enum`,value:[{value:`"tr"`},{value:`"th"`},{value:`"div"`},{value:`"table"`},{value:`"td"`},{value:`"article"`},{value:`"caption"`},{value:`"fieldset"`},{value:`"figcaption"`},{value:`"figure"`},{value:`"footer"`},{value:`"header"`},{value:`"li"`},{value:`"main"`},{value:`"ol"`},{value:`"p"`},{value:`"section"`},{value:`"span"`},{value:`"tbody"`},{value:`"tfoot"`},{value:`"thead"`},{value:`"ul"`}]}},padding:{defaultValue:{value:`24`},description:``,name:`padding`,required:!1,type:{name:`enum`,value:[{value:`"0"`},{value:`"1"`},{value:`"2"`},{value:`"4"`},{value:`"6"`},{value:`"8"`},{value:`"12"`},{value:`"16"`},{value:`"20"`},{value:`"24"`},{value:`"32"`},{value:`"48"`},{value:`"64"`},{value:`"96"`},{value:`"160"`},{value:`[BoxPadding, BoxPadding]`},{value:`[BoxPadding, BoxPadding, BoxPadding]`},{value:`[BoxPadding, BoxPadding, BoxPadding, BoxPadding]`},{value:`ResponsiveProp<ShortHand<BoxPadding>>`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLElement | null) => void`},{value:`RefObject<HTMLElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{x as n,b as t};
+Use this with \`Layout*\` components to create complex content containers.`,displayName:`Box`,props:{background:{defaultValue:{value:`primary`},description:``,name:`background`,required:!1,type:{name:`enum`,value:[{value:`"disabled"`},{value:`"accentDark"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"overlay"`},{value:`"brand"`},{value:`"brandB2b"`},{value:`"accentLight"`},{value:`"positiveLight"`},{value:`"positiveDark"`},{value:`"infoLight"`},{value:`"infoDark"`},{value:`"warningLight"`},{value:`"warningDark"`},{value:`"criticalLight"`},{value:`"criticalDark"`},{value:`"statusOnline"`},{value:`"statusOffline"`},{value:`"primaryInverted"`},{value:`"secondaryInverted"`},{value:`"tertiaryInverted"`}]}},radius:{defaultValue:{value:`16`},description:``,name:`radius`,required:!1,type:{name:`enum`,value:[{value:`"0"`},{value:`"2"`},{value:`"4"`},{value:`"8"`},{value:`"16"`},{value:`"300"`},{value:`ResponsiveProp<BoxRadius>`}]}},tag:{defaultValue:null,description:``,name:`tag`,required:!1,type:{name:`enum`,value:[{value:`"article"`},{value:`"caption"`},{value:`"div"`},{value:`"fieldset"`},{value:`"figcaption"`},{value:`"figure"`},{value:`"footer"`},{value:`"header"`},{value:`"li"`},{value:`"main"`},{value:`"ol"`},{value:`"p"`},{value:`"section"`},{value:`"span"`},{value:`"table"`},{value:`"tbody"`},{value:`"td"`},{value:`"tfoot"`},{value:`"th"`},{value:`"thead"`},{value:`"tr"`},{value:`"ul"`}]}},padding:{defaultValue:{value:`24`},description:``,name:`padding`,required:!1,type:{name:`enum`,value:[{value:`"0"`},{value:`"1"`},{value:`"2"`},{value:`"4"`},{value:`"6"`},{value:`"8"`},{value:`"12"`},{value:`"16"`},{value:`"20"`},{value:`"24"`},{value:`"32"`},{value:`"48"`},{value:`"64"`},{value:`"96"`},{value:`"160"`},{value:`[BoxPadding, BoxPadding]`},{value:`[BoxPadding, BoxPadding, BoxPadding]`},{value:`[BoxPadding, BoxPadding, BoxPadding, BoxPadding]`},{value:`ResponsiveProp<ShortHand<BoxPadding>>`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}}));export{x as n,b as t};

package/dist/assets/{Box.stories-_HS5gmLH.js → Box.stories-B4Kkg_Wz.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-B288uCKD.js";import{n as o,t as s}from"./Heading-Bmekm9VQ.js";import{n as c,t as l}from"./Box-G2_C7Jeq.js";import{n as u,t as d}from"./LayoutFlex-CEr_Bd5T.js";import{n as f,r as p,t as m}from"./storybook-utils-Dnw8-7zP.js";var h,g,_,v,y;t((()=>{e(n(),1),o(),u(),i(),c(),m(),h=r(),g={title:`components/Box`,component:l,argTypes:{radius:{description:p},padding:{description:f}}},_=()=>(0,h.jsx)(l,{background:`positiveLight`,children:(0,h.jsxs)(d,{gap:`16`,direction:`column`,children:[(0,h.jsx)(s,{tag:`h3`,variant:`medium`,children:`Heading`}),(0,h.jsx)(a,{accent:`positive`,children:`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros`})]})}),_.storyName=`Box`,v={parameters:{chromatic:{disableSnapshot:!0}},args:{background:void 0,radius:void 0,padding:void 0,children:(0,h.jsxs)(d,{gap:`16`,direction:`column`,children:[(0,h.jsx)(s,{variant:`large`,tag:`h3`,children:`Heading`}),(0,h.jsx)(a,{children:`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros`})]}),dataset:{qaid:`box`}},argTypes:{children:{control:!1},dataset:{control:`object`}}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`() => <Box background="positiveLight">
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-Cy08WP3t.js";import{n as o,t as s}from"./Heading-B3jb_-J8.js";import{n as c,t as l}from"./Box-CcR4H93c.js";import{n as u,t as d}from"./LayoutFlex-BlWwmFhv.js";import{n as f,r as p,t as m}from"./storybook-utils-BfrlMSeG.js";var h,g,_,v,y;t((()=>{e(n(),1),o(),u(),i(),c(),m(),h=r(),g={title:`components/Box`,component:l,argTypes:{radius:{description:p},padding:{description:f}}},_=()=>(0,h.jsx)(l,{background:`positiveLight`,children:(0,h.jsxs)(d,{gap:`16`,direction:`column`,children:[(0,h.jsx)(s,{tag:`h3`,variant:`medium`,children:`Heading`}),(0,h.jsx)(a,{accent:`positive`,children:`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros`})]})}),_.storyName=`Box`,v={parameters:{chromatic:{disableSnapshot:!0}},args:{background:void 0,radius:void 0,padding:void 0,children:(0,h.jsxs)(d,{gap:`16`,direction:`column`,children:[(0,h.jsx)(s,{variant:`large`,tag:`h3`,children:`Heading`}),(0,h.jsx)(a,{children:`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros`})]}),dataset:{qaid:`box`}},argTypes:{children:{control:!1},dataset:{control:`object`}}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`() => <Box background="positiveLight">
         <LayoutFlex gap="16" direction="column">
             <Heading tag="h3" variant="medium">
                 Heading

package/dist/assets/{BubbleCounter-DNO8aNBu.js → BubbleCounter-CfdjWlAV.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";import{i as c,r as l}from"./IconButton-D218WESp.js";var u,d,f=t((()=>{e(n(),1),i(),s(),c(),u=a(),d=({count:e,showEmpty:t=!1,limit:n=99,size:i=`large`,variant:a=`dark`,children:s,dataset:c})=>{if(e===void 0&&!t)return s??(0,u.jsx)(u.Fragment,{});let d=(0,u.jsx)(`span`,{className:[l.bubbleCounter,l[`size-${i}`],l[`variant-${a}`]].join(` `),...r(c,{preplyDsComponent:o.BubbleCounter}),children:typeof e==`number`&&(e>n?`${n}+`:e)});return s?(0,u.jsxs)(`div`,{className:l.childTargetOverlay,children:[d,s]}):d};try{d.displayName=`BubbleCounter`,d.__docgenInfo={description:``,displayName:`BubbleCounter`,props:{count:{defaultValue:null,description:"The counter's current value;\n\n- If `undefined`, the counter is not rendered.\n- If above `limit`, the `limit` value is rendered instead, with a `+`\n  suffix.",name:`count`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},showEmpty:{defaultValue:{value:`false`},description:"If `true`, the counter will render even if `count` is `undefined`.",name:`showEmpty`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},limit:{defaultValue:{value:`99`},description:``,name:`limit`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},size:{defaultValue:{value:`large`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`}]}},variant:{defaultValue:{value:`dark`},description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"light"`},{value:`"dark"`}]}},children:{defaultValue:null,description:`When provided, the \`BubbleCounter\` will position itself as an indicator
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";import{i as c,r as l}from"./IconButton-CQGXuX8O.js";var u,d,f=t((()=>{e(n(),1),i(),s(),c(),u=a(),d=({count:e,showEmpty:t=!1,limit:n=99,size:i=`large`,variant:a=`dark`,children:s,dataset:c})=>{if(e===void 0&&!t)return s??(0,u.jsx)(u.Fragment,{});let d=(0,u.jsx)(`span`,{className:[l.bubbleCounter,l[`size-${i}`],l[`variant-${a}`]].join(` `),...r(c,{preplyDsComponent:o.BubbleCounter}),children:typeof e==`number`&&(e>n?`${n}+`:e)});return s?(0,u.jsxs)(`div`,{className:l.childTargetOverlay,children:[d,s]}):d};try{d.displayName=`BubbleCounter`,d.__docgenInfo={description:``,displayName:`BubbleCounter`,props:{count:{defaultValue:null,description:"The counter's current value;\n\n- If `undefined`, the counter is not rendered.\n- If above `limit`, the `limit` value is rendered instead, with a `+`\n  suffix.",name:`count`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},showEmpty:{defaultValue:{value:`false`},description:"If `true`, the counter will render even if `count` is `undefined`.",name:`showEmpty`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},limit:{defaultValue:{value:`99`},description:``,name:`limit`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},size:{defaultValue:{value:`large`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`}]}},variant:{defaultValue:{value:`dark`},description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"light"`},{value:`"dark"`}]}},children:{defaultValue:null,description:`When provided, the \`BubbleCounter\` will position itself as an indicator
 overlay above the target child element.
 
 This is intended to work on just one child, but will not throw errors if

package/dist/assets/{BubbleCounter.stories-CyzNA0Bp.js → BubbleCounter.stories-DRq0-Or2.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Button-a57MCiDO.js";import{n as o,t as s}from"./Avatar-C37O_UDH.js";import{n as c,t as l}from"./IconButton-D218WESp.js";import{n as u,t as d}from"./BubbleCounter-DNO8aNBu.js";import{n as f,t as p}from"./LayoutFlex-CEr_Bd5T.js";import{n as m,t as h}from"./TokyoUIMessages-DiuUQ-OO.js";var g,_,v,y,b,x,S,C,w,T,E,D,O,k,A;t((()=>{e(n(),1),u(),c(),m(),i(),o(),f(),g=r(),_={title:`components/BubbleCounter`,component:d,decorators:[e=>(0,g.jsx)(`div`,{style:{padding:`24px`},children:(0,g.jsx)(e,{})})]},v=()=>(0,g.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,variant:`light`})})]})]})}),y=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`large`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`small`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`medium`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`large`,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`small`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`medium`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`large`,variant:`light`})})]})]})]}),b=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`large`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`small`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`medium`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`large`,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`small`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`medium`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`large`,variant:`light`})})]})]})]}),x=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`medium`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`small`,variant:`dark`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`medium`,variant:`dark`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`large`,variant:`dark`,showEmpty:!0})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`small`,variant:`light`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`medium`,variant:`light`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`large`,variant:`light`,showEmpty:!0})})]})]})]}),S=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsxs)(a,{variant:`primary`,size:`medium`,children:[`Messages `,(0,g.jsx)(d,{variant:`dark`,count:5,size:`medium`})]}),(0,g.jsxs)(a,{variant:`tertiary`,size:`medium`,children:[`Messages `,(0,g.jsx)(d,{variant:`light`,count:5,size:`medium`})]})]}),C=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsx)(d,{count:5,size:`small`,children:(0,g.jsx)(s,{size:`48`})}),(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(s,{size:`64`})}),(0,g.jsx)(d,{count:5,size:`large`,children:(0,g.jsx)(s,{size:`96`})})]}),w=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsx)(d,{count:5,size:`small`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`small`,variant:`tertiary`})}),(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`medium`,variant:`tertiary`})}),(0,g.jsx)(d,{count:5,size:`large`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`large`,variant:`tertiary`})})]}),T=()=>(0,g.jsx)(`div`,{style:{"--ds-bubblecounter-target-offset":`20%`,"--ds-bubblecounter-outline-color":`red`},children:(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(`div`,{style:{backgroundColor:`lightgray`,width:`30px`,height:`30px`,borderRadius:`50%`,padding:`8px`}})})}),T.parameters={docs:{canvas:{sourceState:`shown`}}},E=()=>(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,variant:`tertiary`,size:`large`}),D=()=>(0,g.jsx)(d,{count:void 0,children:(0,g.jsx)(E,{})}),D.parameters={docs:{canvas:{sourceState:`shown`}}},O=()=>(0,g.jsx)(d,{showEmpty:!0,children:(0,g.jsx)(E,{})}),O.parameters={docs:{canvas:{sourceState:`shown`}}},k={tags:[`!autodocs`],parameters:{chromatic:{disableSnapshot:!0}},args:{count:5,size:`large`,variant:`dark`},argTypes:{dataset:{control:`object`},count:{control:`number`},limit:{control:`number`},size:{control:`select`,options:[`small`,`medium`,`large`]},variant:{control:`select`,options:[`dark`,`light`]},children:{control:`text`,description:`Add any text here to see how the counter positions over children`}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`() => <table style={{
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Button--WTUF97E.js";import{n as o,t as s}from"./Avatar-D6oXWjq1.js";import{n as c,t as l}from"./IconButton-CQGXuX8O.js";import{n as u,t as d}from"./BubbleCounter-CfdjWlAV.js";import{n as f,t as p}from"./LayoutFlex-BlWwmFhv.js";import{n as m,t as h}from"./TokyoUIMessages-BO3EETWj.js";var g,_,v,y,b,x,S,C,w,T,E,D,O,k,A;t((()=>{e(n(),1),u(),c(),m(),i(),o(),f(),g=r(),_={title:`components/BubbleCounter`,component:d,decorators:[e=>(0,g.jsx)(`div`,{style:{padding:`24px`},children:(0,g.jsx)(e,{})})]},v=()=>(0,g.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,variant:`light`})})]})]})}),y=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`large`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`small`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`medium`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`large`,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`small`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`medium`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:5,size:`large`,variant:`light`})})]})]})]}),b=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`large`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`small`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`medium`,variant:`dark`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`large`,variant:`dark`})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`small`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`medium`,variant:`light`})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{count:500,size:`large`,variant:`light`})})]})]})]}),x=()=>(0,g.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,g.jsx)(`thead`,{children:(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`th`,{children:`Variant`}),(0,g.jsx)(`th`,{children:`small`}),(0,g.jsx)(`th`,{children:`medium`}),(0,g.jsx)(`th`,{children:`medium`})]})}),(0,g.jsxs)(`tbody`,{children:[(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`dark`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`small`,variant:`dark`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`medium`,variant:`dark`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`large`,variant:`dark`,showEmpty:!0})})]}),(0,g.jsxs)(`tr`,{children:[(0,g.jsx)(`td`,{children:`light`}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`small`,variant:`light`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`medium`,variant:`light`,showEmpty:!0})}),(0,g.jsx)(`td`,{children:(0,g.jsx)(d,{size:`large`,variant:`light`,showEmpty:!0})})]})]})]}),S=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsxs)(a,{variant:`primary`,size:`medium`,children:[`Messages `,(0,g.jsx)(d,{variant:`dark`,count:5,size:`medium`})]}),(0,g.jsxs)(a,{variant:`tertiary`,size:`medium`,children:[`Messages `,(0,g.jsx)(d,{variant:`light`,count:5,size:`medium`})]})]}),C=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsx)(d,{count:5,size:`small`,children:(0,g.jsx)(s,{size:`48`})}),(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(s,{size:`64`})}),(0,g.jsx)(d,{count:5,size:`large`,children:(0,g.jsx)(s,{size:`96`})})]}),w=()=>(0,g.jsxs)(p,{gap:`12`,children:[(0,g.jsx)(d,{count:5,size:`small`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`small`,variant:`tertiary`})}),(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`medium`,variant:`tertiary`})}),(0,g.jsx)(d,{count:5,size:`large`,children:(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,size:`large`,variant:`tertiary`})})]}),T=()=>(0,g.jsx)(`div`,{style:{"--ds-bubblecounter-target-offset":`20%`,"--ds-bubblecounter-outline-color":`red`},children:(0,g.jsx)(d,{count:5,size:`medium`,children:(0,g.jsx)(`div`,{style:{backgroundColor:`lightgray`,width:`30px`,height:`30px`,borderRadius:`50%`,padding:`8px`}})})}),T.parameters={docs:{canvas:{sourceState:`shown`}}},E=()=>(0,g.jsx)(l,{svg:h,assistiveText:`Messages`,variant:`tertiary`,size:`large`}),D=()=>(0,g.jsx)(d,{count:void 0,children:(0,g.jsx)(E,{})}),D.parameters={docs:{canvas:{sourceState:`shown`}}},O=()=>(0,g.jsx)(d,{showEmpty:!0,children:(0,g.jsx)(E,{})}),O.parameters={docs:{canvas:{sourceState:`shown`}}},k={tags:[`!autodocs`],parameters:{chromatic:{disableSnapshot:!0}},args:{count:5,size:`large`,variant:`dark`},argTypes:{dataset:{control:`object`},count:{control:`number`},limit:{control:`number`},size:{control:`select`,options:[`small`,`medium`,`large`]},variant:{control:`select`,options:[`dark`,`light`]},children:{control:`text`,description:`Add any text here to see how the counter positions over children`}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`() => <table style={{
   borderCollapse: 'separate',
   borderSpacing: '16px'
 }}>

package/dist/assets/{Button-a57MCiDO.js → Button--WTUF97E.js}

@@ -1,11 +1,12 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{at as r,it as i,t as a,w as o,x as s,y as c}from"./dist-DtfJeYQK.js";import{t as l}from"./jsx-runtime-C2wGStra.js";import{n as u,t as d}from"./dist-Cc1j9Pjk.js";import{n as f,t as p}from"./render-icon-CUp_n6rD.js";import{n as m,t as h}from"./ButtonBase-C22oeCEB.js";var g,_,v,y,b,x=t((()=>{g=`Button__zN6zT`,_=`leadingIcon__wQqJW`,v=`trailingIcon__zChSf`,y=`icon__sU6GA`,b={Button:g,leadingIcon:_,trailingIcon:v,"Button--size-s":`Button--size-s__yKEFo`,icon:y,"Button--size-m":`Button--size-m__-0jeH`,"Button--size-small":`Button--size-small__xrFvg`,"Button--size-medium":`Button--size-medium__Mc1B1`,"Button--size-l":`Button--size-l__7gew2`,"Button--size-large":`Button--size-large__LejpK`,"Button--narrow-l--size-s":`Button--narrow-l--size-s__oKIHq`,"Button--narrow-l--size-m":`Button--narrow-l--size-m__FfkOA`,"Button--narrow-l--size-small":`Button--narrow-l--size-small__y-M26`,"Button--narrow-l--size-medium":`Button--narrow-l--size-medium__so23Y`,"Button--narrow-l--size-l":`Button--narrow-l--size-l__xZOAd`,"Button--narrow-l--size-large":`Button--narrow-l--size-large__8clcn`,"Button--medium-s--size-s":`Button--medium-s--size-s__I-GoC`,"Button--medium-s--size-m":`Button--medium-s--size-m__Fk3sj`,"Button--medium-s--size-small":`Button--medium-s--size-small__N-91h`,"Button--medium-s--size-medium":`Button--medium-s--size-medium__sRSxR`,"Button--medium-s--size-l":`Button--medium-s--size-l__QXDbD`,"Button--medium-s--size-large":`Button--medium-s--size-large__Rtei-`,"Button--medium-l--size-s":`Button--medium-l--size-s__YqR0K`,"Button--medium-l--size-m":`Button--medium-l--size-m__BaJ0d`,"Button--medium-l--size-small":`Button--medium-l--size-small__iP5bS`,"Button--medium-l--size-medium":`Button--medium-l--size-medium__JanvZ`,"Button--medium-l--size-l":`Button--medium-l--size-l__ps0aM`,"Button--medium-l--size-large":`Button--medium-l--size-large__2gVOL`,"Button--wide-s--size-s":`Button--wide-s--size-s__OE3Yz`,"Button--wide-s--size-m":`Button--wide-s--size-m__H2KPf`,"Button--wide-s--size-small":`Button--wide-s--size-small__lDDYF`,"Button--wide-s--size-medium":`Button--wide-s--size-medium__CoePZ`,"Button--wide-s--size-l":`Button--wide-s--size-l__gcSoP`,"Button--wide-s--size-large":`Button--wide-s--size-large__KLj98`,"Button--wide-l--size-s":`Button--wide-l--size-s__HAZa1`,"Button--wide-l--size-m":`Button--wide-l--size-m__xB4x0`,"Button--wide-l--size-small":`Button--wide-l--size-small__WdoWT`,"Button--wide-l--size-medium":`Button--wide-l--size-medium__KgZbS`,"Button--wide-l--size-l":`Button--wide-l--size-l__rw5N1`,"Button--wide-l--size-large":`Button--wide-l--size-large__7TyOT`}})),S,C,w,T=t((()=>{o(),d(),a(),S=e(n(),1),p(),m(),x(),C=l(),w=(0,S.forwardRef)(function({variant:e=r,size:t=i,url:n,a11yLabel:a,leadingSvgIcon:o,trailingSvgIcon:l,children:d,...p},m){let g=!!o||!!l,_=c(b,u.Button,[s(`size`,t)]);return(0,C.jsxs)(h,{...p,ref:m,isIconButton:!1,variant:e,size:t,url:n,a11yLabel:a,preplyDsComponent:u.Button,className:g?_.join(` `):``,children:[!!o&&(0,C.jsx)(`span`,{className:`${b.icon} ${b.leadingIcon}`,children:f(o,{"aria-hidden":`true`,focusable:`false`})}),d,!!l&&(0,C.jsx)(`span`,{className:`${b.icon} ${b.trailingIcon}`,children:f(l,{"aria-hidden":`true`,focusable:`false`})})]})});try{w.displayName=`Button`,w.__docgenInfo={description:``,displayName:`Button`,props:{id:{defaultValue:null,description:``,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseDown:{defaultValue:null,description:``,name:`onMouseDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseEnter:{defaultValue:null,description:``,name:`onMouseEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseMove:{defaultValue:null,description:``,name:`onMouseMove`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseUp:{defaultValue:null,description:``,name:`onMouseUp`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerDown:{defaultValue:null,description:``,name:`onPointerDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerEnter:{defaultValue:null,description:``,name:`onPointerEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},as:{defaultValue:null,description:`Custom element to render the button.
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{at as r,it as i,t as a,w as o,x as s,y as c}from"./dist-DtfJeYQK.js";import{t as l}from"./jsx-runtime-C2wGStra.js";import{n as u,t as d}from"./dist-Cc1j9Pjk.js";import{n as f,t as p}from"./render-icon-CUp_n6rD.js";import{n as m,t as h}from"./ButtonBase-CMQthdSK.js";var g,_,v,y,b,x=t((()=>{g=`Button__zN6zT`,_=`leadingIcon__wQqJW`,v=`trailingIcon__zChSf`,y=`icon__sU6GA`,b={Button:g,leadingIcon:_,trailingIcon:v,"Button--size-s":`Button--size-s__yKEFo`,icon:y,"Button--size-m":`Button--size-m__-0jeH`,"Button--size-small":`Button--size-small__xrFvg`,"Button--size-medium":`Button--size-medium__Mc1B1`,"Button--size-l":`Button--size-l__7gew2`,"Button--size-large":`Button--size-large__LejpK`,"Button--narrow-l--size-s":`Button--narrow-l--size-s__oKIHq`,"Button--narrow-l--size-m":`Button--narrow-l--size-m__FfkOA`,"Button--narrow-l--size-small":`Button--narrow-l--size-small__y-M26`,"Button--narrow-l--size-medium":`Button--narrow-l--size-medium__so23Y`,"Button--narrow-l--size-l":`Button--narrow-l--size-l__xZOAd`,"Button--narrow-l--size-large":`Button--narrow-l--size-large__8clcn`,"Button--medium-s--size-s":`Button--medium-s--size-s__I-GoC`,"Button--medium-s--size-m":`Button--medium-s--size-m__Fk3sj`,"Button--medium-s--size-small":`Button--medium-s--size-small__N-91h`,"Button--medium-s--size-medium":`Button--medium-s--size-medium__sRSxR`,"Button--medium-s--size-l":`Button--medium-s--size-l__QXDbD`,"Button--medium-s--size-large":`Button--medium-s--size-large__Rtei-`,"Button--medium-l--size-s":`Button--medium-l--size-s__YqR0K`,"Button--medium-l--size-m":`Button--medium-l--size-m__BaJ0d`,"Button--medium-l--size-small":`Button--medium-l--size-small__iP5bS`,"Button--medium-l--size-medium":`Button--medium-l--size-medium__JanvZ`,"Button--medium-l--size-l":`Button--medium-l--size-l__ps0aM`,"Button--medium-l--size-large":`Button--medium-l--size-large__2gVOL`,"Button--wide-s--size-s":`Button--wide-s--size-s__OE3Yz`,"Button--wide-s--size-m":`Button--wide-s--size-m__H2KPf`,"Button--wide-s--size-small":`Button--wide-s--size-small__lDDYF`,"Button--wide-s--size-medium":`Button--wide-s--size-medium__CoePZ`,"Button--wide-s--size-l":`Button--wide-s--size-l__gcSoP`,"Button--wide-s--size-large":`Button--wide-s--size-large__KLj98`,"Button--wide-l--size-s":`Button--wide-l--size-s__HAZa1`,"Button--wide-l--size-m":`Button--wide-l--size-m__xB4x0`,"Button--wide-l--size-small":`Button--wide-l--size-small__WdoWT`,"Button--wide-l--size-medium":`Button--wide-l--size-medium__KgZbS`,"Button--wide-l--size-l":`Button--wide-l--size-l__rw5N1`,"Button--wide-l--size-large":`Button--wide-l--size-large__7TyOT`}})),S,C,w,T=t((()=>{o(),d(),a(),S=e(n(),1),p(),m(),x(),C=l(),w=(0,S.forwardRef)(function({variant:e=r,size:t=i,url:n,a11yLabel:a,leadingSvgIcon:o,trailingSvgIcon:l,children:d,...p},m){let g=!!o||!!l,_=c(b,u.Button,[s(`size`,t)]);return(0,C.jsxs)(h,{...p,ref:m,isIconButton:!1,variant:e,size:t,url:n,a11yLabel:a,preplyDsComponent:u.Button,className:g?_.join(` `):``,children:[!!o&&(0,C.jsx)(`span`,{className:`${b.icon} ${b.leadingIcon}`,children:f(o,{"aria-hidden":`true`,focusable:`false`})}),d,!!l&&(0,C.jsx)(`span`,{className:`${b.icon} ${b.trailingIcon}`,children:f(l,{"aria-hidden":`true`,focusable:`false`})})]})});try{w.displayName=`Button`,w.__docgenInfo={description:``,displayName:`Button`,props:{id:{defaultValue:null,description:``,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},href:{defaultValue:null,description:``,name:`href`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},download:{defaultValue:null,description:``,name:`download`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},variant:{defaultValue:{value:`primary`},description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"ai"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"quaternary"`},{value:`"ghost"`},{value:`"critical"`},{value:`"onColor"`},{value:`"classroom"`},{value:`"primaryB2b"`},{value:`"primaryTutor"`},{value:`"inverted"`},{value:`"newFeature"`}]}},opensInNewTab:{defaultValue:null,description:``,name:`opensInNewTab`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},nofollow:{defaultValue:null,description:``,name:`nofollow`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:``,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},as:{defaultValue:null,description:`Custom element to render the button.
 
 Allows rendering the button using a different React element or component.
 This is particularly useful for integrating with router libraries like \`react-router\` or \`next/router\`.
 @example // Render as a react router link component
 import { Link } from 'react-router-dom';
 
-<ButtonBase as={<Link to="/home" />} />`,name:`as`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},download:{defaultValue:null,description:``,name:`download`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},href:{defaultValue:null,description:``,name:`href`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},size:{defaultValue:{value:`small`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<ButtonSize>`}]}},selected:{defaultValue:null,description:`Used only for classroom and ghost variants`,name:`selected`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},wrap:{defaultValue:null,description:``,name:`wrap`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},variant:{defaultValue:{value:`primary`},description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"inverted"`},{value:`"critical"`},{value:`"ai"`},{value:`"quaternary"`},{value:`"ghost"`},{value:`"onColor"`},{value:`"classroom"`},{value:`"primaryB2b"`},{value:`"primaryTutor"`},{value:`"newFeature"`}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:`url`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},opensInNewTab:{defaultValue:null,description:``,name:`opensInNewTab`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},nofollow:{defaultValue:null,description:``,name:`nofollow`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:``,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},fullWidth:{defaultValue:null,description:``,name:`fullWidth`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},submitsForm:{defaultValue:null,description:``,name:`submitsForm`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},busy:{defaultValue:null,description:`Replaces the content with a loading indicator.`,name:`busy`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:`a11yLabel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
+<ButtonBase as={<Link to="/home" />} />`,name:`as`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:`url`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onMouseDown:{defaultValue:null,description:``,name:`onMouseDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseEnter:{defaultValue:null,description:``,name:`onMouseEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseMove:{defaultValue:null,description:``,name:`onMouseMove`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseUp:{defaultValue:null,description:``,name:`onMouseUp`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerDown:{defaultValue:null,description:``,name:`onPointerDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerEnter:{defaultValue:null,description:``,name:`onPointerEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},size:{defaultValue:{value:`small`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<ButtonSize>`}]}},fullWidth:{defaultValue:null,description:``,name:`fullWidth`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},wrap:{defaultValue:null,description:``,name:`wrap`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},submitsForm:{defaultValue:null,description:``,name:`submitsForm`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},busy:{defaultValue:null,description:`Replaces the content with a loading indicator.`,name:`busy`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},selected:{defaultValue:null,description:`Used only for classroom and ghost variants`,name:`selected`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:`a11yLabel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dsInternalSimulation:{defaultValue:null,description:`@deprecated This is meant for internal DS usage only. Do not use it in your code.
+@ignore`,name:`dsInternalSimulation`,required:!1,type:{name:`enum`,value:[{value:`"hover"`},{value:`"focus"`},{value:`"active"`}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
 @example import TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';
 
 <Button leadingSvgIcon={TokyoUITag}>Button</Button>
@@ -15,4 +16,4 @@ or
 
 <Button trailingSvgIcon={TokyoUITag}>Button</Button>
 or
-<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>`,name:`trailingSvgIcon`,required:!1,type:{name:`enum`,value:[{value:`ComponentClass<SVGAttributes<SVGElement>, any>`},{value:`FunctionComponent<SVGAttributes<SVGElement>>`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLAnchorElement | HTMLButtonElement | null) => void`},{value:`RefObject<HTMLAnchorElement | HTMLButtonElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{T as n,w as t};
+<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>`,name:`trailingSvgIcon`,required:!1,type:{name:`enum`,value:[{value:`ComponentClass<SVGAttributes<SVGElement>, any>`},{value:`FunctionComponent<SVGAttributes<SVGElement>>`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}}}}}catch{}}));export{T as n,w as t};

package/dist/assets/{Button.stories-5MZ_eXfn.js → Button.stories-B5ddris9.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{C as r,Y as i,t as a,w as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{n as c,t as l}from"./Text-B288uCKD.js";import{n as u,t as d}from"./Button-a57MCiDO.js";import{n as f,t as p}from"./IconButton-D218WESp.js";import{r as m,t as h}from"./storybook-utils-Dnw8-7zP.js";import{n as g,t as _}from"./TokyoUIFav-CdvVuNHN.js";var v,y,b,x,S,C,w,T,E,D,O,k,A,j;t((()=>{o(),g(),a(),v=e(n(),1),f(),u(),c(),h(),y=s(),b={title:`components/Button`,component:d,subcomponents:{IconButton:p},argTypes:{size:{description:m},fullWidth:{description:m}}},x=()=>(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(d,{children:`Button`}),(0,y.jsx)(d,{leadingSvgIcon:_,children:`Button`}),(0,y.jsx)(d,{trailingSvgIcon:_,children:`Button`}),(0,y.jsx)(p,{svg:_,assistiveText:`Favourite`})]}),x.tags=[`!autodocs`,`!test`],x.parameters={chromatic:{disableSnapshot:!0}},S=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(d,{variant:`primary`,children:`Primary`}),(0,y.jsx)(d,{variant:`secondary`,children:`Secondary`}),(0,y.jsx)(d,{variant:`tertiary`,children:`Tertiary`}),(0,y.jsx)(d,{variant:`ghost`,children:`Ghost`}),(0,y.jsx)(`div`,{style:{backgroundColor:e,borderRadius:`8px`},children:(0,y.jsx)(d,{variant:`inverted`,children:`Inverted`})}),(0,y.jsx)(d,{variant:`critical`,children:`Critical`}),(0,y.jsx)(d,{variant:`onColor`,children:`onColor`})]})},C=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(p,{variant:`primary`,svg:_,assistiveText:`primary`}),(0,y.jsx)(p,{variant:`secondary`,svg:_,assistiveText:`secondary`}),(0,y.jsx)(p,{variant:`tertiary`,svg:_,assistiveText:`tertiary`}),(0,y.jsx)(p,{variant:`ghost`,svg:_,assistiveText:`ghost`}),(0,y.jsx)(`div`,{style:{backgroundColor:e,borderRadius:`8px`},children:(0,y.jsx)(p,{variant:`inverted`,svg:_,assistiveText:`inverted`})}),(0,y.jsx)(p,{variant:`critical`,svg:_,assistiveText:`critical`}),(0,y.jsx)(p,{variant:`onColor`,svg:_,assistiveText:`onColor`})]})},C.storyName=`Variants (IconButton)`,w=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`8px`},children:[(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{variant:`ai`,children:`AI`}),(0,y.jsx)(p,{variant:`ai`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`,backgroundColor:e},children:[(0,y.jsx)(d,{variant:`classroom`,children:`Classroom`}),(0,y.jsx)(p,{variant:`classroom`,svg:_,assistiveText:`Fav`}),(0,y.jsx)(p,{variant:`classroom`,svg:_,assistiveText:`Fav`,selected:!0})]})]})},T=()=>(0,y.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`},children:[(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`small`,children:`Small`}),(0,y.jsx)(p,{size:`small`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`medium`,children:`Medium`}),(0,y.jsx)(p,{size:`medium`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`large`,children:`Large`}),(0,y.jsx)(p,{size:`large`,svg:_,assistiveText:`Fav`})]})]}),E=()=>(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(d,{wrap:!0,size:`small`,children:`Do the really quite unusually long thing`}),(0,y.jsx)(d,{wrap:!0,size:`medium`,children:`Do the really quite unusually long thing`}),(0,y.jsx)(d,{wrap:!0,size:`large`,children:`Do the really quite unusually long thing`})]}),E.tags=[`!autodocs`],E.decorators=[e=>(0,y.jsx)(`div`,{style:{width:`200px`},children:e()})],D=()=>(0,y.jsx)(d,{size:{_:`small`,"medium-l":`medium`,"wide-s":`large`},leadingSvgIcon:_,children:`Change the viewport size`}),D.parameters={chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-l":{viewport:`medium-l`},"wide-s":{viewport:`wide-s`}}}},O=()=>{let e=r(i.background.primaryInverted);return(0,y.jsx)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[`small`,`medium`,`large`].map(t=>[`primary`,`secondary`,`tertiary`,`ghost`,`inverted`,`critical`,`ai`,`onColor`,`classroom`].map(n=>(0,y.jsxs)(v.Fragment,{children:[(0,y.jsxs)(l,{variant:`default-regular-italic`,children:[n,` - `,t]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,backgroundColor:n===`inverted`||n===`classroom`?e:void 0},children:[(0,y.jsx)(d,{size:t,variant:n,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,leadingSvgIcon:_,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,trailingSvgIcon:_,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,busy:!0,assistiveText:`Fav`,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,disabled:!0,children:`disabled`}),(0,y.jsx)(d,{size:t,variant:n,dsInternalSimulation:`hover`,children:`hover`}),(0,y.jsx)(d,{size:t,variant:n,dsInternalSimulation:`active`,children:`active`}),(0,y.jsx)(d,{size:t,variant:n,dsInternalSimulation:`focus`,children:`focus`})]},`${t}-${n}`)]},`${t}-${n}`)))})},O.tags=[`!autodocs`],k=()=>{let e=r(i.background.primaryInverted);return(0,y.jsx)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[`small`,`medium`,`large`].map(t=>[`primary`,`secondary`,`tertiary`,`ghost`,`inverted`,`critical`,`ai`,`onColor`,`classroom`].map(n=>(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(l,{variant:`default-regular-italic`,children:[n,` - `,t]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,backgroundColor:n===`inverted`||n===`classroom`?e:void 0},children:[(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,busy:!0}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,disabled:!0}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dsInternalSimulation:`hover`}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dsInternalSimulation:`active`}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dsInternalSimulation:`focus`})]},`${t}-${n}`)]})))})},k.storyName=`Combinations (IconButton)`,k.tags=[`!autodocs`],A={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(e,{args:t})=>(0,y.jsx)(`div`,{style:{backgroundColor:t.variant===`inverted`?`black`:void 0},children:e()})],args:{children:`Button`,dataset:{qaid:`button`}},argTypes:{children:{control:`text`},dataset:{control:`object`},assistiveText:{control:`text`},disabled:{control:`boolean`},fullWidth:{control:`boolean`},wrap:{control:`boolean`},href:{control:`text`},download:{control:`boolean`},opensInNewTab:{control:`boolean`},nofollow:{control:`boolean`},submitsForm:{control:`boolean`},busy:{control:`boolean`},leadingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":_},control:`select`},trailingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":_},control:`select`},url:{table:{disable:!0}},a11yLabel:{table:{disable:!0}}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`() => <div style={{
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{C as r,Y as i,t as a,w as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{n as c,t as l}from"./Text-Cy08WP3t.js";import{n as u,t as d}from"./Button--WTUF97E.js";import{n as f,t as p}from"./IconButton-CQGXuX8O.js";import{r as m,t as h}from"./storybook-utils-BfrlMSeG.js";import{n as g,t as _}from"./TokyoUIFav-B1g1wYYK.js";var v,y,b,x,S,C,w,T,E,D,O,k,A,j;t((()=>{o(),g(),a(),v=e(n(),1),f(),u(),c(),h(),y=s(),b={title:`components/Button`,component:d,subcomponents:{IconButton:p},argTypes:{size:{description:m},fullWidth:{description:m}}},x=()=>(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(d,{children:`Button`}),(0,y.jsx)(d,{leadingSvgIcon:_,children:`Button`}),(0,y.jsx)(d,{trailingSvgIcon:_,children:`Button`}),(0,y.jsx)(p,{svg:_,assistiveText:`Favourite`})]}),x.tags=[`!autodocs`,`!test`],x.parameters={chromatic:{disableSnapshot:!0}},S=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(d,{variant:`primary`,children:`Primary`}),(0,y.jsx)(d,{variant:`secondary`,children:`Secondary`}),(0,y.jsx)(d,{variant:`tertiary`,children:`Tertiary`}),(0,y.jsx)(d,{variant:`ghost`,children:`Ghost`}),(0,y.jsx)(`div`,{style:{backgroundColor:e,borderRadius:`8px`},children:(0,y.jsx)(d,{variant:`inverted`,children:`Inverted`})}),(0,y.jsx)(d,{variant:`critical`,children:`Critical`}),(0,y.jsx)(d,{variant:`onColor`,children:`onColor`})]})},C=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`1rem`},children:[(0,y.jsx)(p,{variant:`primary`,svg:_,assistiveText:`primary`}),(0,y.jsx)(p,{variant:`secondary`,svg:_,assistiveText:`secondary`}),(0,y.jsx)(p,{variant:`tertiary`,svg:_,assistiveText:`tertiary`}),(0,y.jsx)(p,{variant:`ghost`,svg:_,assistiveText:`ghost`}),(0,y.jsx)(`div`,{style:{backgroundColor:e,borderRadius:`8px`},children:(0,y.jsx)(p,{variant:`inverted`,svg:_,assistiveText:`inverted`})}),(0,y.jsx)(p,{variant:`critical`,svg:_,assistiveText:`critical`}),(0,y.jsx)(p,{variant:`onColor`,svg:_,assistiveText:`onColor`})]})},C.storyName=`Variants (IconButton)`,w=()=>{let e=r(i.background.primaryInverted);return(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`8px`},children:[(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{variant:`ai`,children:`AI`}),(0,y.jsx)(p,{variant:`ai`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`,backgroundColor:e},children:[(0,y.jsx)(d,{variant:`classroom`,children:`Classroom`}),(0,y.jsx)(p,{variant:`classroom`,svg:_,assistiveText:`Fav`}),(0,y.jsx)(p,{variant:`classroom`,svg:_,assistiveText:`Fav`,selected:!0})]})]})},T=()=>(0,y.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`},children:[(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`small`,children:`Small`}),(0,y.jsx)(p,{size:`small`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`medium`,children:`Medium`}),(0,y.jsx)(p,{size:`medium`,svg:_,assistiveText:`Fav`})]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`4px`},children:[(0,y.jsx)(d,{size:`large`,children:`Large`}),(0,y.jsx)(p,{size:`large`,svg:_,assistiveText:`Fav`})]})]}),E=()=>(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(d,{wrap:!0,size:`small`,children:`Do the really quite unusually long thing`}),(0,y.jsx)(d,{wrap:!0,size:`medium`,children:`Do the really quite unusually long thing`}),(0,y.jsx)(d,{wrap:!0,size:`large`,children:`Do the really quite unusually long thing`})]}),E.tags=[`!autodocs`],E.decorators=[e=>(0,y.jsx)(`div`,{style:{width:`200px`},children:e()})],D=()=>(0,y.jsx)(d,{size:{_:`small`,"medium-l":`medium`,"wide-s":`large`},leadingSvgIcon:_,children:`Change the viewport size`}),D.parameters={chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-l":{viewport:`medium-l`},"wide-s":{viewport:`wide-s`}}}},O=()=>{let e=r(i.background.primaryInverted);return(0,y.jsx)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[`small`,`medium`,`large`].map(t=>[`primary`,`secondary`,`tertiary`,`ghost`,`inverted`,`critical`,`ai`,`onColor`,`classroom`].map(n=>(0,y.jsxs)(v.Fragment,{children:[(0,y.jsxs)(l,{variant:`default-regular-italic`,children:[n,` - `,t]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,backgroundColor:n===`inverted`||n===`classroom`?e:void 0},children:[(0,y.jsx)(d,{size:t,variant:n,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,leadingSvgIcon:_,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,trailingSvgIcon:_,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,busy:!0,assistiveText:`Fav`,children:`button`}),(0,y.jsx)(d,{size:t,variant:n,disabled:!0,children:`disabled`}),(0,y.jsx)(d,{size:t,variant:n,dataset:{hover:!0},children:`hover`}),(0,y.jsx)(d,{size:t,variant:n,dataset:{active:!0},children:`active`}),(0,y.jsx)(d,{size:t,variant:n,dataset:{focus:!0},children:`focus`})]},`${t}-${n}`)]},`${t}-${n}`)))})},O.parameters={pseudo:{hover:`[data-hover="true"]`,active:`[data-active="true"]`,focusVisible:`[data-focus="true"]`}},O.tags=[`!autodocs`],k=()=>{let e=r(i.background.primaryInverted);return(0,y.jsx)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[`small`,`medium`,`large`].map(t=>[`primary`,`secondary`,`tertiary`,`ghost`,`inverted`,`critical`,`ai`,`onColor`,`classroom`].map(n=>(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(l,{variant:`default-regular-italic`,children:[n,` - `,t]}),(0,y.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,backgroundColor:n===`inverted`||n===`classroom`?e:void 0},children:[(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,busy:!0}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,disabled:!0}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dataset:{hover:!0}}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dataset:{active:!0}}),(0,y.jsx)(p,{svg:_,assistiveText:`fav`,size:t,variant:n,dataset:{focus:!0}})]},`${t}-${n}`)]})))})},k.parameters={pseudo:{hover:`[data-hover="true"]`,active:`[data-active="true"]`,focusVisible:`[data-focus="true"]`}},k.storyName=`Combinations (IconButton)`,k.tags=[`!autodocs`],A={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(e,{args:t})=>(0,y.jsx)(`div`,{style:{backgroundColor:t.variant===`inverted`?`black`:void 0},children:e()})],args:{children:`Button`,dataset:{qaid:`button`}},argTypes:{children:{control:`text`},dataset:{control:`object`},assistiveText:{control:`text`},disabled:{control:`boolean`},fullWidth:{control:`boolean`},wrap:{control:`boolean`},href:{control:`text`},download:{control:`boolean`},opensInNewTab:{control:`boolean`},nofollow:{control:`boolean`},submitsForm:{control:`boolean`},busy:{control:`boolean`},leadingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":_},control:`select`},trailingSvgIcon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":_},control:`select`},url:{table:{disable:!0}},a11yLabel:{table:{disable:!0}}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`() => <div style={{
   display: 'flex',
   gap: '1rem'
 }}>
@@ -142,13 +142,19 @@ import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2
                             <Button size={size} variant={variant} disabled>
                                 disabled
                             </Button>
-                            <Button size={size} variant={variant} dsInternalSimulation="hover">
+                            <Button size={size} variant={variant} dataset={{
+          hover: true
+        }}>
                                 hover
                             </Button>
-                            <Button size={size} variant={variant} dsInternalSimulation="active">
+                            <Button size={size} variant={variant} dataset={{
+          active: true
+        }}>
                                 active
                             </Button>
-                            <Button size={size} variant={variant} dsInternalSimulation="focus">
+                            <Button size={size} variant={variant} dataset={{
+          focus: true
+        }}>
                                 focus
                             </Button>
                         </div>
@@ -176,11 +182,17 @@ import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2
 
                             <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} disabled />
 
-                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dsInternalSimulation="hover" />
+                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dataset={{
+          hover: true
+        }} />
 
-                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dsInternalSimulation="active" />
+                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dataset={{
+          active: true
+        }} />
 
-                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dsInternalSimulation="focus" />
+                            <IconButton svg={Fav} assistiveText="fav" size={size} variant={variant} dataset={{
+          focus: true
+        }} />
                         </div>
                     </>))}
         </div>;

package/dist/assets/{ButtonBase-C22oeCEB.js → ButtonBase-CMQthdSK.js}

@@ -1,8 +1,9 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{_ as r,at as i,b as a,gt as o,ht as s,it as ee,mt as c,s as l,t as u,w as d,x as f,y as p}from"./dist-DtfJeYQK.js";import{t as m}from"./jsx-runtime-C2wGStra.js";import{n as h,t as g}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as _,t as v}from"./useMergeRefs-BZP37fIn.js";import{n as y,t as b}from"./Spinner-DGdYqKak.js";var x,S,C=t((()=>{x=`ButtonBase__0qXGj`,S={"button-width--width-full":`button-width--width-full__nxjVK`,"button-width--width-auto":`button-width--width-auto__CngVf`,"button-width--narrow-l--width-full":`button-width--narrow-l--width-full__rZc8T`,"button-width--narrow-l--width-auto":`button-width--narrow-l--width-auto__Fs14X`,"button-width--medium-s--width-full":`button-width--medium-s--width-full__lb8XX`,"button-width--medium-s--width-auto":`button-width--medium-s--width-auto__gtajp`,"button-width--medium-l--width-full":`button-width--medium-l--width-full__qOGDr`,"button-width--medium-l--width-auto":`button-width--medium-l--width-auto__vFKgm`,"button-width--wide-s--width-full":`button-width--wide-s--width-full__5nhxD`,"button-width--wide-s--width-auto":`button-width--wide-s--width-auto__J4Ht3`,"button-width--wide-l--width-full":`button-width--wide-l--width-full__Rsexc`,"button-width--wide-l--width-auto":`button-width--wide-l--width-auto__k6Ctk`,ButtonBase:x,"ButtonBase--content":`ButtonBase--content__ZEhK4`,"ButtonBase--is-icon-button":`ButtonBase--is-icon-button__CDG-9`,"ButtonBase--is-icon-button-size-large":`ButtonBase--is-icon-button-size-large__bebMj`,"ButtonBase--busy":`ButtonBase--busy__M2Cgo`,"ButtonBase--dsInternalSimulation-focus":`ButtonBase--dsInternalSimulation-focus__xhIA9`,"ButtonBase--is-busy":`ButtonBase--is-busy__FT7vR`,"ButtonBase--width-full":`ButtonBase--width-full__0ENoK`,"ButtonBase--width-auto":`ButtonBase--width-auto__vwDOv`,"ButtonBase--narrow-l--width-full":`ButtonBase--narrow-l--width-full__-H9pn`,"ButtonBase--narrow-l--width-auto":`ButtonBase--narrow-l--width-auto__2i3td`,"ButtonBase--medium-s--width-full":`ButtonBase--medium-s--width-full__sNHbR`,"ButtonBase--medium-s--width-auto":`ButtonBase--medium-s--width-auto__6T6zO`,"ButtonBase--medium-l--width-full":`ButtonBase--medium-l--width-full__FTcYM`,"ButtonBase--medium-l--width-auto":`ButtonBase--medium-l--width-auto__KPNbM`,"ButtonBase--wide-s--width-full":`ButtonBase--wide-s--width-full__YgEMT`,"ButtonBase--wide-s--width-auto":`ButtonBase--wide-s--width-auto__nM-ia`,"ButtonBase--wide-l--width-full":`ButtonBase--wide-l--width-full__CFPdD`,"ButtonBase--wide-l--width-auto":`ButtonBase--wide-l--width-auto__6gGyZ`,"ButtonBase--size-large":`ButtonBase--size-large__-OxgW`,"ButtonBase--size-medium":`ButtonBase--size-medium__YgQDT`,"ButtonBase--is-icon-button-size-medium":`ButtonBase--is-icon-button-size-medium__AC6Cq`,"ButtonBase--size-small":`ButtonBase--size-small__UMBKe`,"ButtonBase--is-icon-button-size-small":`ButtonBase--is-icon-button-size-small__hZmvi`,"ButtonBase--narrow-l--size-large":`ButtonBase--narrow-l--size-large__jbaAB`,"ButtonBase--narrow-l--is-icon-button-size-large":`ButtonBase--narrow-l--is-icon-button-size-large__UIpIh`,"ButtonBase--narrow-l--size-medium":`ButtonBase--narrow-l--size-medium__62t1K`,"ButtonBase--narrow-l--is-icon-button-size-medium":`ButtonBase--narrow-l--is-icon-button-size-medium__r2nuk`,"ButtonBase--narrow-l--size-small":`ButtonBase--narrow-l--size-small__8uFFR`,"ButtonBase--narrow-l--is-icon-button-size-small":`ButtonBase--narrow-l--is-icon-button-size-small__CkKxU`,"ButtonBase--medium-s--size-large":`ButtonBase--medium-s--size-large__XpFoi`,"ButtonBase--medium-s--is-icon-button-size-large":`ButtonBase--medium-s--is-icon-button-size-large__-IvSU`,"ButtonBase--medium-s--size-medium":`ButtonBase--medium-s--size-medium__ZA4JC`,"ButtonBase--medium-s--is-icon-button-size-medium":`ButtonBase--medium-s--is-icon-button-size-medium__946RE`,"ButtonBase--medium-s--size-small":`ButtonBase--medium-s--size-small__nNIDt`,"ButtonBase--medium-s--is-icon-button-size-small":`ButtonBase--medium-s--is-icon-button-size-small__aAjgr`,"ButtonBase--medium-l--size-large":`ButtonBase--medium-l--size-large__yo-U7`,"ButtonBase--medium-l--is-icon-button-size-large":`ButtonBase--medium-l--is-icon-button-size-large__3ORQx`,"ButtonBase--medium-l--size-medium":`ButtonBase--medium-l--size-medium__N9rbz`,"ButtonBase--medium-l--is-icon-button-size-medium":`ButtonBase--medium-l--is-icon-button-size-medium__EFk6V`,"ButtonBase--medium-l--size-small":`ButtonBase--medium-l--size-small__FMlot`,"ButtonBase--medium-l--is-icon-button-size-small":`ButtonBase--medium-l--is-icon-button-size-small__Ak0TL`,"ButtonBase--wide-s--size-large":`ButtonBase--wide-s--size-large__ASjU0`,"ButtonBase--wide-s--is-icon-button-size-large":`ButtonBase--wide-s--is-icon-button-size-large__hF4qT`,"ButtonBase--wide-s--size-medium":`ButtonBase--wide-s--size-medium__glo8Q`,"ButtonBase--wide-s--is-icon-button-size-medium":`ButtonBase--wide-s--is-icon-button-size-medium__W-O0C`,"ButtonBase--wide-s--size-small":`ButtonBase--wide-s--size-small__b10zZ`,"ButtonBase--wide-s--is-icon-button-size-small":`ButtonBase--wide-s--is-icon-button-size-small__-E8EY`,"ButtonBase--wide-l--size-large":`ButtonBase--wide-l--size-large__qXddN`,"ButtonBase--wide-l--is-icon-button-size-large":`ButtonBase--wide-l--is-icon-button-size-large__ceEkB`,"ButtonBase--wide-l--size-medium":`ButtonBase--wide-l--size-medium__OPxKX`,"ButtonBase--wide-l--is-icon-button-size-medium":`ButtonBase--wide-l--is-icon-button-size-medium__dAxcc`,"ButtonBase--wide-l--size-small":`ButtonBase--wide-l--size-small__tqGj-`,"ButtonBase--wide-l--is-icon-button-size-small":`ButtonBase--wide-l--is-icon-button-size-small__cCSAh`,"ButtonBase--variant-primary":`ButtonBase--variant-primary__oSRJV`,"ButtonBase--variant-primary--dsInternalSimulation-hover":`ButtonBase--variant-primary--dsInternalSimulation-hover__D7OCC`,"ButtonBase--variant-primary--dsInternalSimulation-active":`ButtonBase--variant-primary--dsInternalSimulation-active__V0iju`,"ButtonBase--variant-secondary":`ButtonBase--variant-secondary__APosz`,"ButtonBase--variant-secondary--dsInternalSimulation-hover":`ButtonBase--variant-secondary--dsInternalSimulation-hover__5F1t-`,"ButtonBase--variant-secondary--dsInternalSimulation-active":`ButtonBase--variant-secondary--dsInternalSimulation-active__MwFWM`,"ButtonBase--variant-tertiary":`ButtonBase--variant-tertiary__oSJoa`,"ButtonBase--variant-tertiary--dsInternalSimulation-hover":`ButtonBase--variant-tertiary--dsInternalSimulation-hover__juCHk`,"ButtonBase--variant-tertiary--dsInternalSimulation-active":`ButtonBase--variant-tertiary--dsInternalSimulation-active__CZKvj`,"ButtonBase--variant-quaternary":`ButtonBase--variant-quaternary__gX2sB`,"ButtonBase--variant-quaternary--dsInternalSimulation-hover":`ButtonBase--variant-quaternary--dsInternalSimulation-hover__Hzaa5`,"ButtonBase--variant-quaternary--dsInternalSimulation-active":`ButtonBase--variant-quaternary--dsInternalSimulation-active__cKsaN`,"ButtonBase--variant-ghost":`ButtonBase--variant-ghost__pR3-X`,"ButtonBase--variant-ghost--dsInternalSimulation-hover":`ButtonBase--variant-ghost--dsInternalSimulation-hover__O2HFh`,"ButtonBase--variant-ghost--dsInternalSimulation-active":`ButtonBase--variant-ghost--dsInternalSimulation-active__CvLh8`,"ButtonBase--variant-ghost--is-selected":`ButtonBase--variant-ghost--is-selected__mS0Le`,"ButtonBase--variant-critical":`ButtonBase--variant-critical__-t4Qu`,"ButtonBase--variant-critical--dsInternalSimulation-hover":`ButtonBase--variant-critical--dsInternalSimulation-hover__iyVj2`,"ButtonBase--variant-critical--dsInternalSimulation-active":`ButtonBase--variant-critical--dsInternalSimulation-active__2RACT`,"ButtonBase--variant-onColor":`ButtonBase--variant-onColor__Hgon2`,"ButtonBase--variant-onColor--dsInternalSimulation-hover":`ButtonBase--variant-onColor--dsInternalSimulation-hover__8ca7h`,"ButtonBase--variant-onColor--dsInternalSimulation-active":`ButtonBase--variant-onColor--dsInternalSimulation-active__OxSu7`,"ButtonBase--variant-classroom":`ButtonBase--variant-classroom__ZiZjl`,"ButtonBase--variant-classroom--dsInternalSimulation-hover":`ButtonBase--variant-classroom--dsInternalSimulation-hover__Fy83L`,"ButtonBase--variant-classroom--dsInternalSimulation-active":`ButtonBase--variant-classroom--dsInternalSimulation-active__88eK7`,"ButtonBase--variant-classroom--is-selected":`ButtonBase--variant-classroom--is-selected__GHt9-`,"ButtonBase--variant-primaryB2b":`ButtonBase--variant-primaryB2b__q-vvW`,"ButtonBase--variant-primaryB2b--dsInternalSimulation-hover":`ButtonBase--variant-primaryB2b--dsInternalSimulation-hover__Nrl78`,"ButtonBase--variant-primaryB2b--dsInternalSimulation-active":`ButtonBase--variant-primaryB2b--dsInternalSimulation-active__IGZDa`,"ButtonBase--variant-primaryTutor":`ButtonBase--variant-primaryTutor__B6BAn`,"ButtonBase--variant-primaryTutor--dsInternalSimulation-hover":`ButtonBase--variant-primaryTutor--dsInternalSimulation-hover__HXGA0`,"ButtonBase--variant-primaryTutor--dsInternalSimulation-active":`ButtonBase--variant-primaryTutor--dsInternalSimulation-active__FCV-3`,"ButtonBase--variant-inverted":`ButtonBase--variant-inverted__9yknJ`,"ButtonBase--variant-inverted--dsInternalSimulation-hover":`ButtonBase--variant-inverted--dsInternalSimulation-hover__oX9GA`,"ButtonBase--variant-inverted--dsInternalSimulation-active":`ButtonBase--variant-inverted--dsInternalSimulation-active__-HnsQ`,"ButtonBase--variant-newFeature":`ButtonBase--variant-newFeature__8uk2D`,"ButtonBase--variant-newFeature--dsInternalSimulation-hover":`ButtonBase--variant-newFeature--dsInternalSimulation-hover__plXXr`,"ButtonBase--variant-newFeature--dsInternalSimulation-active":`ButtonBase--variant-newFeature--dsInternalSimulation-active__yDfE1`,"ButtonBase--variant-ai":`ButtonBase--variant-ai__iq9tW`,"ButtonBase--variant-ai--dsInternalSimulation-hover":`ButtonBase--variant-ai--dsInternalSimulation-hover__78mV7`,"ButtonBase--variant-ai--dsInternalSimulation-active":`ButtonBase--variant-ai--dsInternalSimulation-active__48Tn0`,"ButtonBase--no-wrap":`ButtonBase--no-wrap__8TMhQ`}})),w,T,E,D,O,k=t((()=>{d(),u(),w=e(n(),1),h(),C(),y(),v(),T=m(),E=`ButtonBase`,D=({children:e,busy:t})=>{let n=[...a(S,E,[`content`])],r=[...a(S,E,[`busy`])];return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(`span`,{className:n.join(` `),children:e}),t&&(0,T.jsx)(`span`,{className:r.join(` `),children:(0,T.jsx)(b,{})})]})},O=(0,w.forwardRef)(function(e,t){let{id:n,variant:a=i,size:u=ee,fullWidth:d=!1,wrap:m=!1,href:h,download:v,opensInNewTab:y,nofollow:b,submitsForm:x,assistiveText:C,onClick:O,onKeyDown:k,onKeyUp:A,onMouseDown:j,onMouseUp:te,onMouseEnter:ne,onMouseMove:M,onPointerDown:N,onPointerEnter:P,disabled:F,busy:I,selected:L,isIconButton:R,as:z,url:B,a11yLabel:V,dataset:H,children:U,dsInternalSimulation:W,preplyDsComponent:G,className:K,...q}=e,J=l(),Y=(0,w.useRef)(null),X=_(Y,t),re=e=>{(F||I)&&e.preventDefault(),O?.(e)},ie=e=>{let t=c(e.key);(t===` `||t===`Enter`)&&(e.preventDefault(),Y.current?.click())},ae=p(S,E,[W===`focus`?r(`dsInternalSimulation-focus`,void 0,!0):f(`variant-${a}--dsInternalSimulation`,W),f(`variant`,a),f(`size`,u),R?f(`is-icon-button-size`,u):[],r(void 0,`no-wrap`,m),r(`width-full`,`width-auto`,d),r(`is-busy`,void 0,I),r(`is-icon-button`,void 0,R),r(`variant-${a}--is-selected`,void 0,L)]),Z={...g(q),...s(H,{preplyDsComponent:G}),className:[...ae,K].join(` `),"aria-label":C||V,onClick:re,disabled:F,"aria-disabled":F||I?!0:void 0,ref:X,id:n,onKeyDown:k,onKeyUp:A,onMouseDown:j,onMouseUp:te,onMouseEnter:ne,onMouseMove:M,onPointerDown:N,onPointerEnter:P},Q=h||B,$={...Z,download:v,ref:X,role:`button`,tabIndex:F?-1:0,href:Q,onKeyDown:ie};return Q?(0,T.jsx)(`a`,{...$,...o(J,Q,y,b),children:D({children:U,busy:I})}):z?(0,w.cloneElement)(z,{...$},D({children:U,busy:I})):(0,T.jsx)(`button`,{...Z,type:x?`submit`:`button`,children:D({children:U,busy:I})})});try{O.displayName=`ButtonBase`,O.__docgenInfo={description:``,displayName:`ButtonBase`,props:{id:{defaultValue:null,description:``,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},variant:{defaultValue:null,description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"inverted"`},{value:`"critical"`},{value:`"ai"`},{value:`"quaternary"`},{value:`"ghost"`},{value:`"onColor"`},{value:`"classroom"`},{value:`"primaryB2b"`},{value:`"primaryTutor"`},{value:`"newFeature"`}]}},size:{defaultValue:null,description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<ButtonSize>`}]}},fullWidth:{defaultValue:null,description:``,name:`fullWidth`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},wrap:{defaultValue:null,description:``,name:`wrap`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},href:{defaultValue:null,description:``,name:`href`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},download:{defaultValue:null,description:``,name:`download`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},opensInNewTab:{defaultValue:null,description:``,name:`opensInNewTab`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},nofollow:{defaultValue:null,description:``,name:`nofollow`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},submitsForm:{defaultValue:null,description:``,name:`submitsForm`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:``,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onMouseDown:{defaultValue:null,description:``,name:`onMouseDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseUp:{defaultValue:null,description:``,name:`onMouseUp`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseEnter:{defaultValue:null,description:``,name:`onMouseEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseMove:{defaultValue:null,description:``,name:`onMouseMove`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerDown:{defaultValue:null,description:``,name:`onPointerDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerEnter:{defaultValue:null,description:``,name:`onPointerEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},busy:{defaultValue:null,description:`Replaces the content with a loading indicator.`,name:`busy`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},selected:{defaultValue:null,description:`Used only for classroom and ghost variants`,name:`selected`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},isIconButton:{defaultValue:null,description:``,name:`isIconButton`,required:!0,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},as:{defaultValue:null,description:`Custom element to render the button.
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{_ as r,at as i,b as a,gt as o,ht as s,it as ee,mt as c,s as l,t as u,w as d,x as f,y as p}from"./dist-DtfJeYQK.js";import{t as m}from"./jsx-runtime-C2wGStra.js";import{n as h,t as g}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as _,t as v}from"./useMergeRefs-BZP37fIn.js";import{n as y,t as b}from"./Spinner-B-14zfoF.js";var x,S,C=t((()=>{x=`ButtonBase__0qXGj`,S={"button-width--width-full":`button-width--width-full__nxjVK`,"button-width--width-auto":`button-width--width-auto__CngVf`,"button-width--narrow-l--width-full":`button-width--narrow-l--width-full__rZc8T`,"button-width--narrow-l--width-auto":`button-width--narrow-l--width-auto__Fs14X`,"button-width--medium-s--width-full":`button-width--medium-s--width-full__lb8XX`,"button-width--medium-s--width-auto":`button-width--medium-s--width-auto__gtajp`,"button-width--medium-l--width-full":`button-width--medium-l--width-full__qOGDr`,"button-width--medium-l--width-auto":`button-width--medium-l--width-auto__vFKgm`,"button-width--wide-s--width-full":`button-width--wide-s--width-full__5nhxD`,"button-width--wide-s--width-auto":`button-width--wide-s--width-auto__J4Ht3`,"button-width--wide-l--width-full":`button-width--wide-l--width-full__Rsexc`,"button-width--wide-l--width-auto":`button-width--wide-l--width-auto__k6Ctk`,ButtonBase:x,"ButtonBase--content":`ButtonBase--content__ZEhK4`,"ButtonBase--is-icon-button":`ButtonBase--is-icon-button__CDG-9`,"ButtonBase--is-icon-button-size-large":`ButtonBase--is-icon-button-size-large__bebMj`,"ButtonBase--busy":`ButtonBase--busy__M2Cgo`,"ButtonBase--dsInternalSimulation-focus":`ButtonBase--dsInternalSimulation-focus__xhIA9`,"ButtonBase--is-busy":`ButtonBase--is-busy__FT7vR`,"ButtonBase--width-full":`ButtonBase--width-full__0ENoK`,"ButtonBase--width-auto":`ButtonBase--width-auto__vwDOv`,"ButtonBase--narrow-l--width-full":`ButtonBase--narrow-l--width-full__-H9pn`,"ButtonBase--narrow-l--width-auto":`ButtonBase--narrow-l--width-auto__2i3td`,"ButtonBase--medium-s--width-full":`ButtonBase--medium-s--width-full__sNHbR`,"ButtonBase--medium-s--width-auto":`ButtonBase--medium-s--width-auto__6T6zO`,"ButtonBase--medium-l--width-full":`ButtonBase--medium-l--width-full__FTcYM`,"ButtonBase--medium-l--width-auto":`ButtonBase--medium-l--width-auto__KPNbM`,"ButtonBase--wide-s--width-full":`ButtonBase--wide-s--width-full__YgEMT`,"ButtonBase--wide-s--width-auto":`ButtonBase--wide-s--width-auto__nM-ia`,"ButtonBase--wide-l--width-full":`ButtonBase--wide-l--width-full__CFPdD`,"ButtonBase--wide-l--width-auto":`ButtonBase--wide-l--width-auto__6gGyZ`,"ButtonBase--size-large":`ButtonBase--size-large__-OxgW`,"ButtonBase--size-medium":`ButtonBase--size-medium__YgQDT`,"ButtonBase--is-icon-button-size-medium":`ButtonBase--is-icon-button-size-medium__AC6Cq`,"ButtonBase--size-small":`ButtonBase--size-small__UMBKe`,"ButtonBase--is-icon-button-size-small":`ButtonBase--is-icon-button-size-small__hZmvi`,"ButtonBase--narrow-l--size-large":`ButtonBase--narrow-l--size-large__jbaAB`,"ButtonBase--narrow-l--is-icon-button-size-large":`ButtonBase--narrow-l--is-icon-button-size-large__UIpIh`,"ButtonBase--narrow-l--size-medium":`ButtonBase--narrow-l--size-medium__62t1K`,"ButtonBase--narrow-l--is-icon-button-size-medium":`ButtonBase--narrow-l--is-icon-button-size-medium__r2nuk`,"ButtonBase--narrow-l--size-small":`ButtonBase--narrow-l--size-small__8uFFR`,"ButtonBase--narrow-l--is-icon-button-size-small":`ButtonBase--narrow-l--is-icon-button-size-small__CkKxU`,"ButtonBase--medium-s--size-large":`ButtonBase--medium-s--size-large__XpFoi`,"ButtonBase--medium-s--is-icon-button-size-large":`ButtonBase--medium-s--is-icon-button-size-large__-IvSU`,"ButtonBase--medium-s--size-medium":`ButtonBase--medium-s--size-medium__ZA4JC`,"ButtonBase--medium-s--is-icon-button-size-medium":`ButtonBase--medium-s--is-icon-button-size-medium__946RE`,"ButtonBase--medium-s--size-small":`ButtonBase--medium-s--size-small__nNIDt`,"ButtonBase--medium-s--is-icon-button-size-small":`ButtonBase--medium-s--is-icon-button-size-small__aAjgr`,"ButtonBase--medium-l--size-large":`ButtonBase--medium-l--size-large__yo-U7`,"ButtonBase--medium-l--is-icon-button-size-large":`ButtonBase--medium-l--is-icon-button-size-large__3ORQx`,"ButtonBase--medium-l--size-medium":`ButtonBase--medium-l--size-medium__N9rbz`,"ButtonBase--medium-l--is-icon-button-size-medium":`ButtonBase--medium-l--is-icon-button-size-medium__EFk6V`,"ButtonBase--medium-l--size-small":`ButtonBase--medium-l--size-small__FMlot`,"ButtonBase--medium-l--is-icon-button-size-small":`ButtonBase--medium-l--is-icon-button-size-small__Ak0TL`,"ButtonBase--wide-s--size-large":`ButtonBase--wide-s--size-large__ASjU0`,"ButtonBase--wide-s--is-icon-button-size-large":`ButtonBase--wide-s--is-icon-button-size-large__hF4qT`,"ButtonBase--wide-s--size-medium":`ButtonBase--wide-s--size-medium__glo8Q`,"ButtonBase--wide-s--is-icon-button-size-medium":`ButtonBase--wide-s--is-icon-button-size-medium__W-O0C`,"ButtonBase--wide-s--size-small":`ButtonBase--wide-s--size-small__b10zZ`,"ButtonBase--wide-s--is-icon-button-size-small":`ButtonBase--wide-s--is-icon-button-size-small__-E8EY`,"ButtonBase--wide-l--size-large":`ButtonBase--wide-l--size-large__qXddN`,"ButtonBase--wide-l--is-icon-button-size-large":`ButtonBase--wide-l--is-icon-button-size-large__ceEkB`,"ButtonBase--wide-l--size-medium":`ButtonBase--wide-l--size-medium__OPxKX`,"ButtonBase--wide-l--is-icon-button-size-medium":`ButtonBase--wide-l--is-icon-button-size-medium__dAxcc`,"ButtonBase--wide-l--size-small":`ButtonBase--wide-l--size-small__tqGj-`,"ButtonBase--wide-l--is-icon-button-size-small":`ButtonBase--wide-l--is-icon-button-size-small__cCSAh`,"ButtonBase--variant-primary":`ButtonBase--variant-primary__oSRJV`,"ButtonBase--variant-primary--dsInternalSimulation-hover":`ButtonBase--variant-primary--dsInternalSimulation-hover__D7OCC`,"ButtonBase--variant-primary--dsInternalSimulation-active":`ButtonBase--variant-primary--dsInternalSimulation-active__V0iju`,"ButtonBase--variant-secondary":`ButtonBase--variant-secondary__APosz`,"ButtonBase--variant-secondary--dsInternalSimulation-hover":`ButtonBase--variant-secondary--dsInternalSimulation-hover__5F1t-`,"ButtonBase--variant-secondary--dsInternalSimulation-active":`ButtonBase--variant-secondary--dsInternalSimulation-active__MwFWM`,"ButtonBase--variant-tertiary":`ButtonBase--variant-tertiary__oSJoa`,"ButtonBase--variant-tertiary--dsInternalSimulation-hover":`ButtonBase--variant-tertiary--dsInternalSimulation-hover__juCHk`,"ButtonBase--variant-tertiary--dsInternalSimulation-active":`ButtonBase--variant-tertiary--dsInternalSimulation-active__CZKvj`,"ButtonBase--variant-quaternary":`ButtonBase--variant-quaternary__gX2sB`,"ButtonBase--variant-quaternary--dsInternalSimulation-hover":`ButtonBase--variant-quaternary--dsInternalSimulation-hover__Hzaa5`,"ButtonBase--variant-quaternary--dsInternalSimulation-active":`ButtonBase--variant-quaternary--dsInternalSimulation-active__cKsaN`,"ButtonBase--variant-ghost":`ButtonBase--variant-ghost__pR3-X`,"ButtonBase--variant-ghost--dsInternalSimulation-hover":`ButtonBase--variant-ghost--dsInternalSimulation-hover__O2HFh`,"ButtonBase--variant-ghost--dsInternalSimulation-active":`ButtonBase--variant-ghost--dsInternalSimulation-active__CvLh8`,"ButtonBase--variant-ghost--is-selected":`ButtonBase--variant-ghost--is-selected__mS0Le`,"ButtonBase--variant-critical":`ButtonBase--variant-critical__-t4Qu`,"ButtonBase--variant-critical--dsInternalSimulation-hover":`ButtonBase--variant-critical--dsInternalSimulation-hover__iyVj2`,"ButtonBase--variant-critical--dsInternalSimulation-active":`ButtonBase--variant-critical--dsInternalSimulation-active__2RACT`,"ButtonBase--variant-onColor":`ButtonBase--variant-onColor__Hgon2`,"ButtonBase--variant-onColor--dsInternalSimulation-hover":`ButtonBase--variant-onColor--dsInternalSimulation-hover__8ca7h`,"ButtonBase--variant-onColor--dsInternalSimulation-active":`ButtonBase--variant-onColor--dsInternalSimulation-active__OxSu7`,"ButtonBase--variant-classroom":`ButtonBase--variant-classroom__ZiZjl`,"ButtonBase--variant-classroom--dsInternalSimulation-hover":`ButtonBase--variant-classroom--dsInternalSimulation-hover__Fy83L`,"ButtonBase--variant-classroom--dsInternalSimulation-active":`ButtonBase--variant-classroom--dsInternalSimulation-active__88eK7`,"ButtonBase--variant-classroom--is-selected":`ButtonBase--variant-classroom--is-selected__GHt9-`,"ButtonBase--variant-primaryB2b":`ButtonBase--variant-primaryB2b__q-vvW`,"ButtonBase--variant-primaryB2b--dsInternalSimulation-hover":`ButtonBase--variant-primaryB2b--dsInternalSimulation-hover__Nrl78`,"ButtonBase--variant-primaryB2b--dsInternalSimulation-active":`ButtonBase--variant-primaryB2b--dsInternalSimulation-active__IGZDa`,"ButtonBase--variant-primaryTutor":`ButtonBase--variant-primaryTutor__B6BAn`,"ButtonBase--variant-primaryTutor--dsInternalSimulation-hover":`ButtonBase--variant-primaryTutor--dsInternalSimulation-hover__HXGA0`,"ButtonBase--variant-primaryTutor--dsInternalSimulation-active":`ButtonBase--variant-primaryTutor--dsInternalSimulation-active__FCV-3`,"ButtonBase--variant-inverted":`ButtonBase--variant-inverted__9yknJ`,"ButtonBase--variant-inverted--dsInternalSimulation-hover":`ButtonBase--variant-inverted--dsInternalSimulation-hover__oX9GA`,"ButtonBase--variant-inverted--dsInternalSimulation-active":`ButtonBase--variant-inverted--dsInternalSimulation-active__-HnsQ`,"ButtonBase--variant-newFeature":`ButtonBase--variant-newFeature__8uk2D`,"ButtonBase--variant-newFeature--dsInternalSimulation-hover":`ButtonBase--variant-newFeature--dsInternalSimulation-hover__plXXr`,"ButtonBase--variant-newFeature--dsInternalSimulation-active":`ButtonBase--variant-newFeature--dsInternalSimulation-active__yDfE1`,"ButtonBase--variant-ai":`ButtonBase--variant-ai__iq9tW`,"ButtonBase--variant-ai--dsInternalSimulation-hover":`ButtonBase--variant-ai--dsInternalSimulation-hover__78mV7`,"ButtonBase--variant-ai--dsInternalSimulation-active":`ButtonBase--variant-ai--dsInternalSimulation-active__48Tn0`,"ButtonBase--no-wrap":`ButtonBase--no-wrap__8TMhQ`}})),w,T,E,D,O,k=t((()=>{d(),u(),w=e(n(),1),h(),C(),y(),v(),T=m(),E=`ButtonBase`,D=({children:e,busy:t})=>{let n=[...a(S,E,[`content`])],r=[...a(S,E,[`busy`])];return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(`span`,{className:n.join(` `),children:e}),t&&(0,T.jsx)(`span`,{className:r.join(` `),children:(0,T.jsx)(b,{})})]})},O=(0,w.forwardRef)(function(e,t){let{id:n,variant:a=i,size:u=ee,fullWidth:d=!1,wrap:m=!1,href:h,download:v,opensInNewTab:y,nofollow:b,submitsForm:x,assistiveText:C,onClick:O,onKeyDown:k,onKeyUp:A,onMouseDown:j,onMouseUp:te,onMouseEnter:ne,onMouseMove:M,onPointerDown:N,onPointerEnter:P,disabled:F,busy:I,selected:L,isIconButton:R,as:z,url:B,a11yLabel:V,dataset:H,children:U,dsInternalSimulation:W,preplyDsComponent:G,className:K,...q}=e,J=l(),Y=(0,w.useRef)(null),X=_(Y,t),re=e=>{(F||I)&&e.preventDefault(),O?.(e)},ie=e=>{let t=c(e.key);(t===` `||t===`Enter`)&&(e.preventDefault(),Y.current?.click())},ae=p(S,E,[W===`focus`?r(`dsInternalSimulation-focus`,void 0,!0):f(`variant-${a}--dsInternalSimulation`,W),f(`variant`,a),f(`size`,u),R?f(`is-icon-button-size`,u):[],r(void 0,`no-wrap`,m),r(`width-full`,`width-auto`,d),r(`is-busy`,void 0,I),r(`is-icon-button`,void 0,R),r(`variant-${a}--is-selected`,void 0,L)]),Z={...g(q),...s(H,{preplyDsComponent:G}),className:[...ae,K].join(` `),"aria-label":C||V,onClick:re,disabled:F,"aria-disabled":F||I?!0:void 0,ref:X,id:n,onKeyDown:k,onKeyUp:A,onMouseDown:j,onMouseUp:te,onMouseEnter:ne,onMouseMove:M,onPointerDown:N,onPointerEnter:P},Q=h||B,$={...Z,download:v,ref:X,role:`button`,tabIndex:F?-1:0,href:Q,onKeyDown:ie};return Q?(0,T.jsx)(`a`,{...$,...o(J,Q,y,b),children:D({children:U,busy:I})}):z?(0,w.cloneElement)(z,{...$},D({children:U,busy:I})):(0,T.jsx)(`button`,{...Z,type:x?`submit`:`button`,children:D({children:U,busy:I})})});try{O.displayName=`ButtonBase`,O.__docgenInfo={description:``,displayName:`ButtonBase`,props:{id:{defaultValue:null,description:``,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},variant:{defaultValue:null,description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"ai"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"quaternary"`},{value:`"ghost"`},{value:`"critical"`},{value:`"onColor"`},{value:`"classroom"`},{value:`"primaryB2b"`},{value:`"primaryTutor"`},{value:`"inverted"`},{value:`"newFeature"`}]}},size:{defaultValue:null,description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<ButtonSize>`}]}},fullWidth:{defaultValue:null,description:``,name:`fullWidth`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},wrap:{defaultValue:null,description:``,name:`wrap`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},href:{defaultValue:null,description:``,name:`href`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},download:{defaultValue:null,description:``,name:`download`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},opensInNewTab:{defaultValue:null,description:``,name:`opensInNewTab`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},nofollow:{defaultValue:null,description:``,name:`nofollow`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},submitsForm:{defaultValue:null,description:``,name:`submitsForm`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},assistiveText:{defaultValue:null,description:``,name:`assistiveText`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler`}]}},onMouseDown:{defaultValue:null,description:``,name:`onMouseDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseUp:{defaultValue:null,description:``,name:`onMouseUp`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseEnter:{defaultValue:null,description:``,name:`onMouseEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onMouseMove:{defaultValue:null,description:``,name:`onMouseMove`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerDown:{defaultValue:null,description:``,name:`onPointerDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},onPointerEnter:{defaultValue:null,description:``,name:`onPointerEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},busy:{defaultValue:null,description:`Replaces the content with a loading indicator.`,name:`busy`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},selected:{defaultValue:null,description:`Used only for classroom and ghost variants`,name:`selected`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},isIconButton:{defaultValue:null,description:``,name:`isIconButton`,required:!0,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},as:{defaultValue:null,description:`Custom element to render the button.
 
 Allows rendering the button using a different React element or component.
 This is particularly useful for integrating with router libraries like \`react-router\` or \`next/router\`.
 @example // Render as a react router link component
 import { Link } from 'react-router-dom';
 
-<ButtonBase as={<Link to="/home" />} />`,name:`as`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:`url`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:`a11yLabel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},preplyDsComponent:{defaultValue:null,description:`@see getDatasetProps`,name:`preplyDsComponent`,required:!0,type:{name:`string`}},className:{defaultValue:null,description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLAnchorElement | HTMLButtonElement | null) => void`},{value:`RefObject<HTMLAnchorElement | HTMLButtonElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{k as n,O as t};
+<ButtonBase as={<Link to="/home" />} />`,name:`as`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:`url`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:`a11yLabel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},dsInternalSimulation:{defaultValue:null,description:`@deprecated This is meant for internal DS usage only. Do not use it in your code.
+@ignore`,name:`dsInternalSimulation`,required:!1,type:{name:`enum`,value:[{value:`"hover"`},{value:`"focus"`},{value:`"active"`}]}},preplyDsComponent:{defaultValue:null,description:`@see getDatasetProps`,name:`preplyDsComponent`,required:!0,type:{name:`string`}},className:{defaultValue:null,description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}}}}}catch{}}));export{k as n,O as t};

package/dist/assets/{CalloutBanner.stories-RwI1z0sm.js → CalloutBanner.stories-C60JgqC0.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-B288uCKD.js";import{n as o,t as s}from"./Button-a57MCiDO.js";import{n as c,t as l}from"./Avatar-C37O_UDH.js";import{a as u,c as d,d as f,f as p,i as m,l as h,m as g,n as _,o as v,p as y,r as b,s as x,t as S,u as C}from"./CalloutBannerText-DJ3eTwo4.js";import{n as w,t as T}from"./LayoutFlex-CEr_Bd5T.js";import{n as E,t as D}from"./Link-D75aReRI.js";var O,k,A=t((()=>{O=`banner__YzvKK`,k={banner:O}})),j,M,N,P,F,I,L,R,z,B,V,H,U,W,G,K,q;t((()=>{j=e(n(),1),w(),E(),o(),c(),i(),p(),C(),d(),g(),_(),A(),M=r(),{expect:N,userEvent:P,within:F}=__STORYBOOK_MODULE_TEST__,I={title:`Components/CalloutBanner`,component:f,subcomponents:{CalloutBannerText:S,CalloutBannerDismissButton:h,CalloutBannerIcon:m,CalloutBannerInfoIcon:u,CalloutBannerWarningIcon:x,CalloutBannerCriticalIcon:b,CalloutBannerPositiveIcon:v},parameters:{layout:`padded`,docs:{source:{type:`dynamic`}}},decorators:[e=>(0,M.jsx)(`div`,{style:{width:`400px`},children:(0,M.jsx)(e,{})})]},L={args:{children:(0,M.jsx)(S,{children:`Callout banner message goes here.`})}},R={args:{variant:`info`,children:(0,M.jsxs)(M.Fragment,{children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Callout banner message with a leading icon.`})]})}},z={render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})}},B={tags:[`!autodocs`],render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed by clicking the close button.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})},play:async({canvas:e,step:t})=>{await t(`Dismiss banner`,async()=>{let t=e.getByTestId(`banner`);await P.click(F(t).getByRole(`button`,{name:`Close`})),N(t).not.toBeInTheDocument()})}},V={tags:[`!autodocs`],render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed by clicking the close button.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})},play:async({canvas:e,step:t})=>{await t(`Dismiss banner`,async()=>{let t=e.getByTestId(`banner`);await P.click(F(t).getByRole(`button`,{name:`Close`})),N(t).not.toBeInTheDocument()}),await t(`Show banner`,async()=>{let t=e.getByTestId(`show-banner`);await P.click(t),N(e.getByTestId(`banner`)).toBeInTheDocument()})}},H={args:{children:(0,M.jsxs)(S,{children:[`Callout banner message goes here.`,` `,(0,M.jsx)(D,{href:`/path`,inline:!0,children:`Inline link`}),`.`]})}},U={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsxs)(f,{variant:`neutral`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Neutral callout banner message.`})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Info callout banner message.`})]}),(0,M.jsxs)(f,{variant:`warning`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Warning callout banner message.`})]}),(0,M.jsxs)(f,{variant:`critical`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Critical callout banner message.`})]}),(0,M.jsxs)(f,{variant:`positive`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Positive callout banner message.`})]}),(0,M.jsxs)(f,{variant:`ai`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`AI callout banner message.`})]})]})},W={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsxs)(f,{size:`regular`,variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Regular size callout banner message.`})]}),(0,M.jsxs)(f,{size:`small`,variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Small size callout banner message.`})]})]})},G={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsx)(f,{variant:`info`,children:(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`})}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`}),(0,M.jsx)(h,{})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`}),(0,M.jsx)(h,{})]})]})},K={tags:[`!autodocs`],render:function(){let[e,t]=(0,j.useState)(!0);return e?(0,M.jsxs)(y,{variant:`neutral`,size:`regular`,className:k.banner,children:[(0,M.jsx)(m,{children:(0,M.jsx)(l,{size:`24`})}),(0,M.jsx)(a,{variant:`default-semibold`,children:`Custom banner built with primitives.`}),(0,M.jsx)(h,{className:k.dismissButton,children:(0,M.jsx)(s,{size:`small`,variant:`tertiary`,onClick:()=>t(!1),children:`Close`})})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>t(!0),children:`Show banner`})]})}},L.parameters={...L.parameters,docs:{...L.parameters?.docs,source:{originalSource:`{
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-Cy08WP3t.js";import{n as o,t as s}from"./Button--WTUF97E.js";import{n as c,t as l}from"./Avatar-D6oXWjq1.js";import{a as u,c as d,d as f,f as p,i as m,l as h,m as g,n as _,o as v,p as y,r as b,s as x,t as S,u as C}from"./CalloutBannerText-DDPb7LsF.js";import{n as w,t as T}from"./LayoutFlex-BlWwmFhv.js";import{n as E,t as D}from"./Link-DbeaGxmu.js";var O,k,A=t((()=>{O=`banner__YzvKK`,k={banner:O}})),j,M,N,P,F,I,L,R,z,B,V,H,U,W,G,K,q;t((()=>{j=e(n(),1),w(),E(),o(),c(),i(),p(),C(),d(),g(),_(),A(),M=r(),{expect:N,userEvent:P,within:F}=__STORYBOOK_MODULE_TEST__,I={title:`Components/CalloutBanner`,component:f,subcomponents:{CalloutBannerText:S,CalloutBannerDismissButton:h,CalloutBannerIcon:m,CalloutBannerInfoIcon:u,CalloutBannerWarningIcon:x,CalloutBannerCriticalIcon:b,CalloutBannerPositiveIcon:v},parameters:{layout:`padded`,docs:{source:{type:`dynamic`}}},decorators:[e=>(0,M.jsx)(`div`,{style:{width:`400px`},children:(0,M.jsx)(e,{})})]},L={args:{children:(0,M.jsx)(S,{children:`Callout banner message goes here.`})}},R={args:{variant:`info`,children:(0,M.jsxs)(M.Fragment,{children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Callout banner message with a leading icon.`})]})}},z={render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})}},B={tags:[`!autodocs`],render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed by clicking the close button.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})},play:async({canvas:e,step:t})=>{await t(`Dismiss banner`,async()=>{let t=e.getByTestId(`banner`);await P.click(F(t).getByRole(`button`,{name:`Close`})),N(t).not.toBeInTheDocument()})}},V={tags:[`!autodocs`],render:function(e){let[t,n]=(0,j.useState)(!0);return t?(0,M.jsxs)(f,{...e,dataset:{testid:`banner`},children:[(0,M.jsx)(S,{children:`This banner can be dismissed by clicking the close button.`}),(0,M.jsx)(h,{onClick:()=>n(!1)})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>n(!0),dataset:{testid:`show-banner`},children:`Show banner`})]})},play:async({canvas:e,step:t})=>{await t(`Dismiss banner`,async()=>{let t=e.getByTestId(`banner`);await P.click(F(t).getByRole(`button`,{name:`Close`})),N(t).not.toBeInTheDocument()}),await t(`Show banner`,async()=>{let t=e.getByTestId(`show-banner`);await P.click(t),N(e.getByTestId(`banner`)).toBeInTheDocument()})}},H={args:{children:(0,M.jsxs)(S,{children:[`Callout banner message goes here.`,` `,(0,M.jsx)(D,{href:`/path`,inline:!0,children:`Inline link`}),`.`]})}},U={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsxs)(f,{variant:`neutral`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Neutral callout banner message.`})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Info callout banner message.`})]}),(0,M.jsxs)(f,{variant:`warning`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Warning callout banner message.`})]}),(0,M.jsxs)(f,{variant:`critical`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Critical callout banner message.`})]}),(0,M.jsxs)(f,{variant:`positive`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Positive callout banner message.`})]}),(0,M.jsxs)(f,{variant:`ai`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`AI callout banner message.`})]})]})},W={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsxs)(f,{size:`regular`,variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Regular size callout banner message.`})]}),(0,M.jsxs)(f,{size:`small`,variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`Small size callout banner message.`})]})]})},G={render:()=>(0,M.jsxs)(T,{direction:`column`,gap:`16`,children:[(0,M.jsx)(f,{variant:`info`,children:(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`})}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(m,{}),(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`}),(0,M.jsx)(h,{})]}),(0,M.jsxs)(f,{variant:`info`,children:[(0,M.jsx)(S,{children:`This is a longer callout banner message that demonstrates how the component handles text wrapping and longer content.`}),(0,M.jsx)(h,{})]})]})},K={tags:[`!autodocs`],render:function(){let[e,t]=(0,j.useState)(!0);return e?(0,M.jsxs)(y,{variant:`neutral`,size:`regular`,className:k.banner,children:[(0,M.jsx)(m,{children:(0,M.jsx)(l,{size:`24`})}),(0,M.jsx)(a,{variant:`default-semibold`,children:`Custom banner built with primitives.`}),(0,M.jsx)(h,{className:k.dismissButton,children:(0,M.jsx)(s,{size:`small`,variant:`tertiary`,onClick:()=>t(!1),children:`Close`})})]}):(0,M.jsxs)(T,{gap:`16`,alignItems:`center`,children:[(0,M.jsx)(`p`,{children:`Banner has been dismissed.`}),(0,M.jsx)(s,{variant:`tertiary`,onClick:()=>t(!0),children:`Show banner`})]})}},L.parameters={...L.parameters,docs:{...L.parameters?.docs,source:{originalSource:`{
   args: {
     children: <CalloutBannerText>Callout banner message goes here.</CalloutBannerText>
   }

package/dist/assets/CalloutBannerText-DDPb7LsF.js

@@ -0,0 +1,28 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";import{n as c,t as l}from"./Icon-Dqr2b6tP.js";import{n as u,t as d}from"./Text-Cy08WP3t.js";import{n as ee,t as te}from"./TokyoUIClose-BsMsQk2w.js";import{o as ne,r as f}from"./lib-8ue2PVWI.js";import{n as p,t as m}from"./shared-strings-BFfhcoGp.js";import{n as h,t as g}from"./TokyoUICheck-BxTDosuA.js";import{i as _,n as v,r as y,t as b}from"./TokyoUIErrorWarning-BH93ehx8.js";import{n as x,t as S}from"./IconButton-CQGXuX8O.js";import{n as C,t as re}from"./TokyoUIInfo-CL0Zo7ru.js";var w,T,E,D,O=t((()=>{w=`banner__X9HSx`,T=`icon__Hc4CV`,E=`dismissButton__QqYFY`,D={banner:w,icon:T,dismissButton:E}})),k,A,j,M,N=t((()=>{k=e(n(),1),i(),s(),O(),A=a(),j=(0,k.createContext)({variant:`neutral`,size:`regular`}),M=(0,k.forwardRef)(function({variant:e=`neutral`,size:t=`regular`,children:n,dataset:i,className:a=``,...s},c){let l=[D.banner,a].join(` `);return(0,A.jsx)(j.Provider,{value:{variant:e,size:t},children:(0,A.jsx)(`div`,{ref:c,role:`note`,className:l,...r(i,{preplyDsComponent:o.CalloutBanner}),"data-variant":e,"data-size":t,...s,children:n})})});try{M.displayName=`CalloutBannerRoot`,M.__docgenInfo={description:`The root primitive for the callout banner.
+
+This component is used to create a custom callout banner; it accepts a
+\`className prop to override the default styles for the callout banner
+container. The \`variant\` prop is exposed as a data attribute on the root
+element to aid in styling.
+
+You can use the other \`CalloutBanner*\` subcomponents as you normally would
+with the \`CalloutBanner\` component.`,displayName:`CalloutBannerRoot`,props:{variant:{defaultValue:{value:`neutral`},description:`The banner variant/type`,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"neutral"`},{value:`"ai"`},{value:`"critical"`},{value:`"positive"`},{value:`"warning"`},{value:`"info"`}]}},size:{defaultValue:{value:`regular`},description:`The banner size`,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"regular"`}]}},dataset:{defaultValue:null,description:`Data attributes for testing/analytics
+@deprecated Pass data attributes as regular props instead`,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}})),P,F,I,L=t((()=>{P=e(n(),1),N(),F=a(),I=(0,P.forwardRef)(function({variant:e=`neutral`,size:t=`regular`,children:n,dataset:r},i){return(0,F.jsx)(M,{ref:i,variant:e,size:t,dataset:r,children:n})});try{I.displayName=`CalloutBanner`,I.__docgenInfo={description:`The Callout banner is used to share informational, helpful, or promotional
+messages within a product interface.
+
+It appears inline within a page or section, not at the top of the screen.
+Its goal is to draw gentle attention without overpowering surrounding content.
+
+Do not use for urgent or blocking information—use the \`<AlertBanner />\` instead.`,displayName:`CalloutBanner`,props:{variant:{defaultValue:{value:`neutral`},description:"The banner variant.\nSemantic icons are also exported for the following variants:\n- `info` -> `<CalloutBannerInfoIcon />`\n- `warning` -> `<CalloutBannerWarningIcon />`\n- `critical` -> `<CalloutBannerCriticalIcon />`\n- `positive` -> `<CalloutBannerPositiveIcon />`",name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"neutral"`},{value:`"ai"`},{value:`"critical"`},{value:`"positive"`},{value:`"warning"`},{value:`"info"`}]}},size:{defaultValue:{value:`regular`},description:`The banner text size.`,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"regular"`}]}},children:{defaultValue:null,description:`The banner message content.
+
+To build a DS compliant banner, use:
+- \`CalloutBannerIcon\` to add an icon to the banner
+- \`CalloutBannerText\` to add a text to the banner
+- \`CalloutBannerDismissButton\` to add a dismiss button to the banner
+
+Alternatively, to diverge from the DS, you're able to:
+- Add your own custom content to break away from the inner content
+  styling and structure.
+- Use the \`CalloutBannerRoot\` primitive to customize the banner
+  container (e.g. colour).`,name:`children`,required:!0,type:{name:`enum`,value:[{value:`undefined`},{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}})),R,z,B,V,H=t((()=>{R=e(n(),1),f(),ee(),x(),p(),O(),z=a(),B=(0,R.forwardRef)(function({children:e,className:t=``,...n},r){return(0,z.jsx)(`div`,{ref:r,className:[D.dismissButton,t].join(` `),children:e??(0,z.jsx)(V,{...n})})}),V=(0,R.forwardRef)(function({onClick:e,dataset:t},n){let{formatMessage:r}=ne();return(0,z.jsx)(S,{ref:n,onClick:e,svg:te,size:`small`,variant:`ghost`,assistiveText:r(m.close),dataset:t})});try{B.displayName=`CalloutBannerDismissButton`,B.__docgenInfo={description:"A dismiss button for the callout banner.\n\nNote: The root of this component is a `div` element. It renders the default\ndismiss button by default, but you can override it with the `children` prop.\nYou can also use the `className` prop to override the default styles for the\ncontainer.",displayName:`CalloutBannerDismissButton`,props:{children:{defaultValue:null,description:`If present, the component will render the children instead of the
+default dismiss button.`,name:`children`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},className:{defaultValue:{value:``},description:`A class name to apply to the dismiss button **container**.`,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`() => void`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}})),U,W,G,K,q,J,Y,X,ie=t((()=>{U=e(n(),1),C(),v(),_(),h(),c(),O(),N(),W=a(),G=()=>(0,W.jsx)(l,{svg:re,size:`24`}),K=()=>(0,W.jsx)(l,{svg:g,size:`24`}),q=()=>(0,W.jsx)(l,{svg:b,size:`24`}),J=()=>(0,W.jsx)(l,{svg:y,size:`24`}),Y={info:G,positive:K,warning:q,critical:J},X=(0,U.forwardRef)(function({svg:e,children:t,className:n=``},r){let{variant:i}=(0,U.useContext)(j),a=[D.icon,n].join(` `),o=null;return t?o=t:e?o=(0,W.jsx)(l,{svg:e,size:`24`}):i&&i in Y&&(o=Y[i]()),o?(0,W.jsx)(`div`,{ref:r,className:a,children:o}):null});try{G.displayName=`CalloutBannerInfoIcon`,G.__docgenInfo={description:`Info icon for the CalloutBanner.`,displayName:`CalloutBannerInfoIcon`,props:{}}}catch{}try{K.displayName=`CalloutBannerPositiveIcon`,K.__docgenInfo={description:`Positive icon for the CalloutBanner.`,displayName:`CalloutBannerPositiveIcon`,props:{}}}catch{}try{q.displayName=`CalloutBannerWarningIcon`,q.__docgenInfo={description:`Warning icon for the CalloutBanner.`,displayName:`CalloutBannerWarningIcon`,props:{}}}catch{}try{J.displayName=`CalloutBannerCriticalIcon`,J.__docgenInfo={description:`Critical icon for the CalloutBanner.`,displayName:`CalloutBannerCriticalIcon`,props:{}}}catch{}try{X.displayName=`CalloutBannerIcon`,X.__docgenInfo={description:"An icon for the callout banner.\n\nThis component will render the appropriate icon based on the parent\n`CalloutBanner` component's `variant` prop — these semantic icons are also\nexported for the following variants:\n- `info` -> `<CalloutBannerInfoIcon />`\n- `positive` -> `<CalloutBannerPositiveIcon />`\n- `warning` -> `<CalloutBannerWarningIcon />`\n- `critical` -> `<CalloutBannerCriticalIcon />`\n\nThe icon can be overridden by passing a custom SVG icon via the `svg` prop.\n\nIf you want to place any leading element inside of the `CalloutBanner`,\nwith the same spacing as the icon, you can pass it as a child element.\n\nNote: The root of this component is a `div` element. You can use the\n`className` prop to override the default styles for the **container**.",displayName:`CalloutBannerIcon`,props:{svg:{defaultValue:null,description:``,name:`svg`,required:!1,type:{name:`enum`,value:[{value:`ComponentClass<SVGAttributes<SVGElement>, any>`},{value:`FunctionComponent<SVGAttributes<SVGElement>>`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},className:{defaultValue:{value:``},description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}}}}}catch{}})),Z,Q,$,ae=t((()=>{Z=e(n(),1),u(),N(),Q=a(),$=(0,Z.forwardRef)(function(e,t){let{size:n}=(0,Z.useContext)(j);return(0,Q.jsx)(d,{ref:t,variant:n===`small`?`small-regular`:`default-regular`,...e})});try{$.displayName=`CalloutBannerText`,$.__docgenInfo={description:"A `Text` component alias for the callout banner that is context-aware,\nadjusting its own `variant` based on the parent `CalloutBanner`'s `size`.",displayName:`CalloutBannerText`,props:{variant:{defaultValue:null,description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"caption-regular"`},{value:`"caption-semibold"`},{value:`"small-regular"`},{value:`"small-regular-italic"`},{value:`"small-semibold"`},{value:`"small-semibold-italic"`},{value:`"default-regular"`},{value:`"default-regular-italic"`},{value:`"default-semibold"`},{value:`"default-semibold-italic"`},{value:`"large-regular"`},{value:`"large-regular-italic"`},{value:`"large-semibold"`},{value:`"large-semibold-italic"`},{value:`ResponsiveProp<TextVariant>`}]}},accent:{defaultValue:null,description:``,name:`accent`,required:!1,type:{name:`enum`,value:[{value:`"placeholder"`},{value:`"accentDark"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"critical"`},{value:`"inverted"`},{value:`"positive"`},{value:`"warning"`},{value:`"info"`}]}},strong:{defaultValue:null,description:``,name:`strong`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},centered:{defaultValue:null,description:``,name:`centered`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},tag:{defaultValue:null,description:``,name:`tag`,required:!1,type:{name:`enum`,value:[{value:`"div"`},{value:`"p"`},{value:`"span"`}]}},dataset:{defaultValue:null,description:`@deprecated Pass data attributes as regular props instead`,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},className:{defaultValue:null,description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}}}}}catch{}}));export{G as a,ie as c,I as d,L as f,X as i,B as l,N as m,ae as n,K as o,M as p,J as r,q as s,$ as t,H as u};

package/dist/assets/Checkbox-BV4Be-fH.js

@@ -0,0 +1,7 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i,y as a}from"./dist-DtfJeYQK.js";import{t as o}from"./jsx-runtime-C2wGStra.js";import{n as s,t as c}from"./dist-Cc1j9Pjk.js";import{n as l,t as u}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as d,t as f}from"./render-icon-CUp_n6rD.js";import{n as p,t as m}from"./useMergeRefs-BZP37fIn.js";var h,g,_,v,y=t((()=>{h=e(n()),g=e(n()),_=({title:e,titleId:t,...n},r)=>h.createElement(`svg`,{"data-preply-ds-component":`SvgTokyoUIIcon`,viewBox:`0 0 14 2`,xmlns:`http://www.w3.org/2000/svg`,ref:r,"aria-labelledby":t,...n},e?h.createElement(`title`,{id:t},e):null,h.createElement(`path`,{d:`M0 0h14v2H0z`})),v=(0,g.forwardRef)(_)})),b,x,S,C,w=t((()=>{b=e(n()),x=e(n()),S=({title:e,titleId:t,...n},r)=>b.createElement(`svg`,{"data-preply-ds-component":`SvgTokyoUIIcon`,viewBox:`0 0 13 11`,xmlns:`http://www.w3.org/2000/svg`,ref:r,"aria-labelledby":t,...n},e?b.createElement(`title`,{id:t},e):null,b.createElement(`path`,{fillRule:`evenodd`,clipRule:`evenodd`,d:`M3.923 10.101 0 6.18 1.179 5l2.744 2.744L11.667 0l1.178 1.179z`})),C=(0,x.forwardRef)(S)})),T,E,D,O,k=t((()=>{T=`checkbox__-j3Cu`,E=`remove__Tu7KI`,D=`checkmark__-fsuM`,O={checkbox:T,remove:E,checkmark:D}}));function A({ref:e,onChange:t,indeterminate:n,onCheckedChange:r}){let i=(0,j.useRef)(null),a=p(i,e);(0,j.useLayoutEffect)(()=>{i.current&&typeof n==`boolean`&&(i.current.indeterminate=n)},[n]);let o=(0,j.useCallback)(e=>{t?.(e),typeof n==`boolean`&&(e.target.indeterminate=n),r?.(e.target.checked)},[t,n,r]);return{mergedRef:a,ariaChecked:n?`mixed`:void 0,onChangeHandler:o}}var j,M=t((()=>{j=e(n(),1),m()})),N,P,F,I=t((()=>{N=e(n(),1),c(),i(),f(),l(),y(),w(),k(),M(),P=o(),F=(0,N.forwardRef)(function({id:e,name:t,checked:n,defaultChecked:i,indeterminate:o,onChange:c,onCheckedChange:l,hasError:f,disabled:p,required:m,"aria-label":h,"aria-labelledby":g,"aria-describedby":_,dataset:y,onBlur:b,onFocus:x,...S},w){let{mergedRef:T,onChangeHandler:E,ariaChecked:D}=A({ref:w,onChange:c,indeterminate:o,onCheckedChange:l}),k=a(O,`checkbox`);return(0,P.jsxs)(`div`,{...u(S),className:k.join(` `),"data-preply-ds-component":s.Checkbox,children:[(0,P.jsx)(`input`,{id:e,name:t,type:`checkbox`,required:m,disabled:p,checked:n,defaultChecked:i,"aria-checked":D,"aria-invalid":f===!0?!0:void 0,"aria-label":h,"aria-labelledby":g,"aria-describedby":_,onChange:E,ref:T,onBlur:b,onFocus:x,...r(y)}),d(C,{focusable:`false`,"aria-hidden":`true`,className:O.checkmark}),d(v,{focusable:`false`,"aria-hidden":`true`,className:O.remove})]})});try{F.displayName=`Checkbox`,F.__docgenInfo={description:"To make this accessible, you must label it using a `<label>` or `aria-label`:",displayName:`Checkbox`,props:{hasError:{defaultValue:null,description:'Shows the component\'s error state, and sets `aria-invalid="true"` on the input element.',name:`hasError`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},indeterminate:{defaultValue:null,description:`Makes the component look indeterminate. Please note that the indeterminate state is parallel
+to che checked/unchecked state, meaning that a checkbox can be checked and indeterminate at
+the same time. it's up to you to handle the logic of when to set this prop.
+
+If you're implementing a tri-state checkbox group, pleas refer to the
+{@link https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/ARIA Checkbox Pattern}.`,name:`indeterminate`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onCheckedChange:{defaultValue:null,description:``,name:`onCheckedChange`,required:!1,type:{name:`enum`,value:[{value:`(checked: boolean) => void`}]}},dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
+@example <Checkbox dataset={{ 'qa-id': 'accept-conditions' }} /> // will add data-qa-id="accept-conditions" to the HTML element`,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}}));export{I as n,F as t};

package/dist/assets/{Checkbox-B_qY1TUo.css → Checkbox-DIfWwwEC.css}

@@ -1 +1 @@
-.checkbox__-j3Cu{box-sizing:border-box;width:var(--76ac8f);height:var(--76ac8f);min-width:var(--76ac8f);min-height:var(--76ac8f);background-color:var(--3546c3);border:var(--26b8e3) solid var(--c03289);border-radius:var(--5e8be4);transition:background-color var(--018058), border-color var(--018058);justify-content:center;align-items:center;display:flex;position:relative}.checkbox__-j3Cu input{cursor:pointer;opacity:0;margin:0;position:absolute;inset:0}.checkbox__-j3Cu .remove__Tu7KI,.checkbox__-j3Cu .checkmark__-fsuM{fill:var(--e6a034);cursor:pointer;display:none}.checkbox__-j3Cu .remove__Tu7KI{width:15px}.checkbox__-j3Cu .checkmark__-fsuM{width:13px}.checkbox__-j3Cu:has(input:checked){background-color:var(--4983fe);border-color:var(--4983fe)}.checkbox__-j3Cu:has(input:checked) .checkmark__-fsuM{display:block}.checkbox__-j3Cu:has(input:indeterminate){background-color:var(--4983fe);border-color:var(--4983fe)}.checkbox__-j3Cu:has(input:indeterminate) .remove__Tu7KI{display:block}.checkbox__-j3Cu:has(input[aria-invalid=true]){border-color:var(--a44465)}:is(.checkbox__-j3Cu:has(input[aria-invalid=true]):has(input:checked),.checkbox__-j3Cu:has(input[aria-invalid=true]):has(input:indeterminate)){border-color:var(--a44465);background-color:var(--87fcf8)}.checkbox__-j3Cu:focus-within,.checkbox--dsInternalSimulation-focus__xJewg{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}.checkbox__-j3Cu:has(input:disabled){cursor:default;background-color:var(--302ecf);border-color:var(--c03289)}:is(.checkbox__-j3Cu:has(input:disabled) .remove__Tu7KI,.checkbox__-j3Cu:has(input:disabled) .checkmark__-fsuM){fill:var(--12f66e)}:is(.checkbox__-j3Cu:has(input:disabled):has(input:checked),.checkbox__-j3Cu:has(input:disabled):has(input:indeterminate)){background-color:var(--319b29)}
+.checkbox__-j3Cu{box-sizing:border-box;width:var(--76ac8f);height:var(--76ac8f);min-width:var(--76ac8f);min-height:var(--76ac8f);background-color:var(--3546c3);border:var(--26b8e3) solid var(--c03289);border-radius:var(--5e8be4);transition:background-color var(--018058), border-color var(--018058);justify-content:center;align-items:center;display:flex;position:relative}.checkbox__-j3Cu input{cursor:pointer;opacity:0;margin:0;position:absolute;inset:0}.checkbox__-j3Cu .remove__Tu7KI,.checkbox__-j3Cu .checkmark__-fsuM{fill:var(--e6a034);cursor:pointer;display:none}.checkbox__-j3Cu .remove__Tu7KI{width:15px}.checkbox__-j3Cu .checkmark__-fsuM{width:13px}.checkbox__-j3Cu:has(input:checked){background-color:var(--4983fe);border-color:var(--4983fe)}.checkbox__-j3Cu:has(input:checked) .checkmark__-fsuM{display:block}.checkbox__-j3Cu:has(input:indeterminate){background-color:var(--4983fe);border-color:var(--4983fe)}.checkbox__-j3Cu:has(input:indeterminate) .remove__Tu7KI{display:block}.checkbox__-j3Cu:has(input[aria-invalid=true]){border-color:var(--a44465)}:is(.checkbox__-j3Cu:has(input[aria-invalid=true]):has(input:checked),.checkbox__-j3Cu:has(input[aria-invalid=true]):has(input:indeterminate)){border-color:var(--a44465);background-color:var(--87fcf8)}.checkbox__-j3Cu:focus-within{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}.checkbox__-j3Cu:has(input:disabled){cursor:default;background-color:var(--302ecf);border-color:var(--c03289)}:is(.checkbox__-j3Cu:has(input:disabled) .remove__Tu7KI,.checkbox__-j3Cu:has(input:disabled) .checkmark__-fsuM){fill:var(--12f66e)}:is(.checkbox__-j3Cu:has(input:disabled):has(input:checked),.checkbox__-j3Cu:has(input:disabled):has(input:indeterminate)){background-color:var(--319b29)}

package/dist/assets/{Checkbox.stories-CQsCp6Jy.js → Checkbox.stories-D6wUFMNN.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-B288uCKD.js";import{n as o,t as s}from"./Checkbox-Bchk1blw.js";var c,l,u,d,f,p,m,h,g,_,v,y;t((()=>{c=e(n(),1),o(),i(),l=r(),{action:u}=__STORYBOOK_MODULE_ACTIONS__,{expect:d,userEvent:f}=__STORYBOOK_MODULE_TEST__,p={title:`components/Checkbox`,component:s,args:{onChange:u(`onChange`),onCheckedChange:u(`onCheckedChange`)}},m={render:function(){return(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[(0,l.jsx)(a,{variant:`default-regular-italic`,children:`normal`}),(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`},children:[(0,l.jsx)(s,{"aria-label":`checkbox`}),(0,l.jsx)(s,{"aria-label":`checkbox`,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0,indeterminate:!0})]}),(0,l.jsx)(a,{variant:`default-regular-italic`,children:`focus`}),(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`},children:[(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`}),(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`,checked:!0,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,dsInternalSimulation:`focus`,indeterminate:!0,hasError:!0})]})]})}},h={parameters:{chromatic:{disableSnapshot:!0}},render:function(){return(0,l.jsx)(s,{"aria-label":`checkbox`})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);d(n).not.toHaveAttribute(`aria-checked`),await t(`Initial state"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Initial state"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)})}},g={parameters:{chromatic:{disableSnapshot:!0}},render:function(){let[e,t]=(0,c.useState)(!1);return(0,l.jsx)(s,{"aria-label":`checkbox`,checked:e,onCheckedChange:t})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);await t(`Initial state"`,async()=>{d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)})}},_={parameters:{chromatic:{disableSnapshot:!0}},render:function(){let[e,t]=(0,c.useState)(!1),[n,r]=(0,c.useState)(!1);return(0,l.jsx)(s,{"aria-label":`checkbox`,checked:e,indeterminate:n,onCheckedChange:i=>{e===!1&&n===!1&&i===!0?r(!0):e===!1&&n===!0&&i===!0?(r(!1),t(!0)):e===!0&&n===!1&&i===!1&&t(!1)}})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);if(!(n instanceof HTMLInputElement))throw Error(`Expected Consent all cookies to be an HTMLInputElement`);await t(`Initial state"`,async()=>{d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).toHaveAttribute(`aria-checked`,`mixed`),d(n.indeterminate,`Indeterminate check`).toBe(!0)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{"aria-label":`checkbox`},argTypes:{id:{control:`text`},name:{control:`text`},dataset:{control:`object`},checked:{control:`boolean`},disabled:{control:`boolean`},required:{control:`boolean`},hasError:{control:`boolean`},"aria-label":{control:`text`},indeterminate:{control:`boolean`},defaultChecked:{control:`boolean`},"aria-labelledby":{control:`text`}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-Cy08WP3t.js";import{n as o,t as s}from"./Checkbox-BV4Be-fH.js";var c,l,u,d,f,p,m,h,g,_,v,y;t((()=>{c=e(n(),1),o(),i(),l=r(),{action:u}=__STORYBOOK_MODULE_ACTIONS__,{expect:d,userEvent:f}=__STORYBOOK_MODULE_TEST__,p={title:`components/Checkbox`,component:s,args:{onChange:u(`onChange`),onCheckedChange:u(`onCheckedChange`)}},m={render:function(){return(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`,flexDirection:`column`},children:[(0,l.jsx)(a,{variant:`default-regular-italic`,children:`normal`}),(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`},children:[(0,l.jsx)(s,{"aria-label":`checkbox`}),(0,l.jsx)(s,{"aria-label":`checkbox`,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,disabled:!0,indeterminate:!0})]}),(0,l.jsx)(a,{variant:`default-regular-italic`,children:`focus`}),(0,l.jsxs)(`div`,{style:{display:`flex`,gap:`16px`},"data-focus":!0,children:[(0,l.jsx)(s,{"aria-label":`checkbox`}),(0,l.jsx)(s,{"aria-label":`checkbox`,checked:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,indeterminate:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,checked:!0,hasError:!0}),(0,l.jsx)(s,{"aria-label":`checkbox`,indeterminate:!0,hasError:!0})]})]})}},m.parameters={pseudo:{focusWithin:`[data-focus="true"] > *`}},h={parameters:{chromatic:{disableSnapshot:!0}},render:function(){return(0,l.jsx)(s,{"aria-label":`checkbox`})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);d(n).not.toHaveAttribute(`aria-checked`),await t(`Initial state"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Initial state"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)})}},g={parameters:{chromatic:{disableSnapshot:!0}},render:function(){let[e,t]=(0,c.useState)(!1);return(0,l.jsx)(s,{"aria-label":`checkbox`,checked:e,onCheckedChange:t})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);await t(`Initial state"`,async()=>{d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`)})}},_={parameters:{chromatic:{disableSnapshot:!0}},render:function(){let[e,t]=(0,c.useState)(!1),[n,r]=(0,c.useState)(!1);return(0,l.jsx)(s,{"aria-label":`checkbox`,checked:e,indeterminate:n,onCheckedChange:i=>{e===!1&&n===!1&&i===!0?r(!0):e===!1&&n===!0&&i===!0?(r(!1),t(!0)):e===!0&&n===!1&&i===!1&&t(!1)}})},play:async({canvas:e,step:t})=>{let n=e.getByRole(`checkbox`);if(!(n instanceof HTMLInputElement))throw Error(`Expected Consent all cookies to be an HTMLInputElement`);await t(`Initial state"`,async()=>{d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).toHaveAttribute(`aria-checked`,`mixed`),d(n.indeterminate,`Indeterminate check`).toBe(!0)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)}),await t(`Click the checkbox"`,async()=>{await f.click(n),d(n).not.toBeChecked(),d(n).not.toHaveAttribute(`aria-checked`),d(n.indeterminate,`Indeterminate check`).toBe(!1)})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{"aria-label":`checkbox`},argTypes:{id:{control:`text`},name:{control:`text`},dataset:{control:`object`},checked:{control:`boolean`},disabled:{control:`boolean`},required:{control:`boolean`},hasError:{control:`boolean`},"aria-label":{control:`text`},indeterminate:{control:`boolean`},defaultChecked:{control:`boolean`},"aria-labelledby":{control:`text`}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
   render: function Story() {
     return <div style={{
       display: 'flex',
@@ -24,13 +24,13 @@ import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2
                 <div style={{
         display: 'flex',
         gap: '16px'
-      }}>
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" />
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" checked />
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" indeterminate />
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" hasError />
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" checked hasError />
-                    <Checkbox aria-label="checkbox" dsInternalSimulation="focus" indeterminate hasError />
+      }} data-focus>
+                    <Checkbox aria-label="checkbox" />
+                    <Checkbox aria-label="checkbox" checked />
+                    <Checkbox aria-label="checkbox" indeterminate />
+                    <Checkbox aria-label="checkbox" hasError />
+                    <Checkbox aria-label="checkbox" checked hasError />
+                    <Checkbox aria-label="checkbox" indeterminate hasError />
                 </div>
             </div>;
   }

package/dist/assets/{Checkbox.tests.stories-05uWFXz_.js → Checkbox.tests.stories-FLl_ZNDM.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Checkbox-Bchk1blw.js";import{n as o,t as s}from"./Tooltip-DGa6B2Md.js";var c,l,u,d,f,p,m,h,g,_,v,y;t((()=>{e(n(),1),o(),i(),c=r(),{userEvent:l,expect:u,within:d,waitFor:f,fireEvent:p,waitForElementToBeRemoved:m}=__STORYBOOK_MODULE_TEST__,h={title:`Components/Checkbox/Tests`,component:a,parameters:{controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:[`!autodocs`,`!a11y-test`,`test`]},g={render:function(){return(0,c.jsx)(a,{"aria-label":`checkboxLabel`,"aria-labelledby":`checkboxLabelledby`,"aria-describedby":`checkboxDescribedby`,hasError:!0})},play:async({canvasElement:e})=>{let t=d(e).getByRole(`checkbox`);u(t).toHaveAttribute(`aria-label`,`checkboxLabel`),u(t).toHaveAttribute(`aria-labelledby`,`checkboxLabelledby`),u(t).toHaveAttribute(`aria-describedby`,`checkboxDescribedby`),u(t).toHaveAttribute(`aria-invalid`,`true`)}},_={render:function(){return(0,c.jsx)(a,{dataset:{foo:1,bar:`2`,baz:!1},"aria-label":`checkbox`})},play:async({canvas:e})=>{let t=e.getByRole(`checkbox`);u(t).toHaveAttribute(`data-foo`,`1`),u(t).toHaveAttribute(`data-bar`,`2`),u(t).toHaveAttribute(`data-baz`,`false`)}},v={render:function(){return(0,c.jsx)(s,{content:`This is a tooltip`,trigger:`hover-and-touch`,dataset:{testid:`tooltip`},children:(0,c.jsx)(a,{"aria-label":`checkbox`})})},play:async({canvasElement:e,step:t})=>{let n=d(e),r=n.getByRole(`checkbox`);await t(`hover trigger element`,async()=>{await l.hover(r)}),await t(`tooltip should be shown`,async()=>{await f(()=>u(n.getByTestId(`tooltip`)).toBeInTheDocument())}),await t(`unhover trigger element`,async()=>{await l.unhover(r),p.pointerMove(document,{clientX:0,clientY:0})}),await t(`tooltip should be hidden`,async()=>{await m(()=>n.queryByTestId(`tooltip`))})}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Checkbox-BV4Be-fH.js";import{n as o,t as s}from"./Tooltip-BKkZoXDV.js";var c,l,u,d,f,p,m,h,g,_,v,y;t((()=>{e(n(),1),o(),i(),c=r(),{userEvent:l,expect:u,within:d,waitFor:f,fireEvent:p,waitForElementToBeRemoved:m}=__STORYBOOK_MODULE_TEST__,h={title:`Components/Checkbox/Tests`,component:a,parameters:{controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:[`!autodocs`,`!a11y-test`,`test`]},g={render:function(){return(0,c.jsx)(a,{"aria-label":`checkboxLabel`,"aria-labelledby":`checkboxLabelledby`,"aria-describedby":`checkboxDescribedby`,hasError:!0})},play:async({canvasElement:e})=>{let t=d(e).getByRole(`checkbox`);u(t).toHaveAttribute(`aria-label`,`checkboxLabel`),u(t).toHaveAttribute(`aria-labelledby`,`checkboxLabelledby`),u(t).toHaveAttribute(`aria-describedby`,`checkboxDescribedby`),u(t).toHaveAttribute(`aria-invalid`,`true`)}},_={render:function(){return(0,c.jsx)(a,{dataset:{foo:1,bar:`2`,baz:!1},"aria-label":`checkbox`})},play:async({canvas:e})=>{let t=e.getByRole(`checkbox`);u(t).toHaveAttribute(`data-foo`,`1`),u(t).toHaveAttribute(`data-bar`,`2`),u(t).toHaveAttribute(`data-baz`,`false`)}},v={render:function(){return(0,c.jsx)(s,{content:`This is a tooltip`,trigger:`hover-and-touch`,dataset:{testid:`tooltip`},children:(0,c.jsx)(a,{"aria-label":`checkbox`})})},play:async({canvasElement:e,step:t})=>{let n=d(e),r=n.getByRole(`checkbox`);await t(`hover trigger element`,async()=>{await l.hover(r)}),await t(`tooltip should be shown`,async()=>{await f(()=>u(n.getByTestId(`tooltip`)).toBeInTheDocument())}),await t(`unhover trigger element`,async()=>{await l.unhover(r),p.pointerMove(document,{clientX:0,clientY:0})}),await t(`tooltip should be hidden`,async()=>{await m(()=>n.queryByTestId(`tooltip`))})}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
   render: function Story() {
     return <Checkbox aria-label="checkboxLabel" aria-labelledby="checkboxLabelledby" aria-describedby="checkboxDescribedby" hasError />;
   },