@preply/ds-docs 11.2.0 → 11.3.0

package/dist/assets/{PreplyLogo.stories-8kPZdvbV.js → PreplyLogo.stories-Bm6-o3h8.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{C as r,X 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"./PreplyLogo-BzNZ8wpS.js";var u,d,f,p,m,h,g,_,v,y,b;t((()=>{o(),a(),e(n(),1),c(),u=s(),d={title:`components/PreplyLogo`,component:l,tags:[`!test`],parameters:{chromatic:{disableSnapshot:!0}}},f=()=>(0,u.jsx)(l,{}),p=()=>(0,u.jsx)(l,{iconOnly:!0}),m=()=>(0,u.jsx)(l,{business:!0}),h=()=>(0,u.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`16px`},children:[(0,u.jsx)(l,{size:`xs`}),(0,u.jsx)(l,{size:`s`}),(0,u.jsx)(l,{size:`m`}),(0,u.jsx)(l,{size:`l`})]}),g=()=>(0,u.jsx)(l,{inverted:!0}),g.decorators=[e=>(0,u.jsx)(`div`,{style:{backgroundColor:r(i.color.grey[200])},children:e()})],_=({children:e=``})=>(0,u.jsx)(`code`,{style:{fontFamily:`monospace`},children:e}),v=()=>(0,u.jsxs)(`div`,{style:{padding:`8px`,display:`grid`,gridTemplateColumns:`200px 100px 150px 200px 300px`,rowGap:`8px`,alignItems:`end`,backgroundColor:r(i.color.grey[200])},children:[(0,u.jsx)(_,{}),(0,u.jsx)(_,{children:`size="xs"`}),(0,u.jsx)(_,{children:`size="s"`}),(0,u.jsx)(_,{children:`size="m"`}),(0,u.jsx)(_,{children:`size="l"`}),(0,u.jsx)(_,{}),(0,u.jsx)(l,{size:`xs`}),(0,u.jsx)(l,{size:`s`}),(0,u.jsx)(l,{size:`m`}),(0,u.jsx)(l,{size:`l`}),(0,u.jsx)(_,{children:`inverted`}),(0,u.jsx)(l,{size:`xs`,inverted:!0}),(0,u.jsx)(l,{size:`s`,inverted:!0}),(0,u.jsx)(l,{size:`m`,inverted:!0}),(0,u.jsx)(l,{size:`l`,inverted:!0}),(0,u.jsx)(_,{children:`iconOnly`}),(0,u.jsx)(l,{iconOnly:!0,size:`xs`}),(0,u.jsx)(l,{iconOnly:!0,size:`s`}),(0,u.jsx)(l,{iconOnly:!0,size:`m`}),(0,u.jsx)(l,{iconOnly:!0,size:`l`}),(0,u.jsx)(_,{children:`iconOnly inverted`}),(0,u.jsx)(l,{iconOnly:!0,size:`xs`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`s`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`m`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`l`,inverted:!0}),(0,u.jsx)(_,{children:`business`}),(0,u.jsx)(l,{business:!0,size:`xs`}),(0,u.jsx)(l,{business:!0,size:`s`}),(0,u.jsx)(l,{business:!0,size:`m`}),(0,u.jsx)(l,{business:!0,size:`l`}),(0,u.jsx)(_,{children:`business inverted`}),(0,u.jsx)(l,{business:!0,size:`xs`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`s`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`m`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`l`,inverted:!0})]}),v.tags=[`test`],v.parameters={chromatic:{disableSnapshot:!1}},y={parameters:{options:{selectedPanel:`addon-controls`}},decorators:[(e,{args:t})=>(0,u.jsx)(`div`,{style:{backgroundColor:t.inverted?`black`:void 0},children:e()})],args:{size:`m`,dataset:{qaid:`preply-logo`}},argTypes:{iconOnly:{type:`boolean`},business:{type:`boolean`},inverted:{type:`boolean`},dataset:{control:`object`}}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`() => <PreplyLogo />`,...f.parameters?.docs?.source}}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`() => <PreplyLogo iconOnly />`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`() => <PreplyLogo business />`,...m.parameters?.docs?.source}}},h.parameters={...h.parameters,docs:{...h.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,X 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"./PreplyLogo-EsNyTV4m.js";var u,d,f,p,m,h,g,_,v,y,b;t((()=>{o(),a(),e(n(),1),c(),u=s(),d={title:`components/PreplyLogo`,component:l,tags:[`!test`],parameters:{chromatic:{disableSnapshot:!0}}},f=()=>(0,u.jsx)(l,{}),p=()=>(0,u.jsx)(l,{iconOnly:!0}),m=()=>(0,u.jsx)(l,{business:!0}),h=()=>(0,u.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`16px`},children:[(0,u.jsx)(l,{size:`xxs`}),(0,u.jsx)(l,{size:`xs`}),(0,u.jsx)(l,{size:`s`}),(0,u.jsx)(l,{size:`m`}),(0,u.jsx)(l,{size:`l`})]}),g=()=>(0,u.jsx)(l,{inverted:!0}),g.decorators=[e=>(0,u.jsx)(`div`,{style:{backgroundColor:r(i.color.grey[200])},children:e()})],_=({children:e=``})=>(0,u.jsx)(`code`,{style:{fontFamily:`monospace`},children:e}),v=()=>(0,u.jsxs)(`div`,{style:{padding:`8px`,display:`grid`,gridTemplateColumns:`200px 80px 100px 150px 200px 300px`,rowGap:`8px`,alignItems:`end`,backgroundColor:r(i.color.grey[200])},children:[(0,u.jsx)(_,{}),(0,u.jsx)(_,{children:`size="xxs"`}),(0,u.jsx)(_,{children:`size="xs"`}),(0,u.jsx)(_,{children:`size="s"`}),(0,u.jsx)(_,{children:`size="m"`}),(0,u.jsx)(_,{children:`size="l"`}),(0,u.jsx)(_,{}),(0,u.jsx)(l,{size:`xxs`}),(0,u.jsx)(l,{size:`xs`}),(0,u.jsx)(l,{size:`s`}),(0,u.jsx)(l,{size:`m`}),(0,u.jsx)(l,{size:`l`}),(0,u.jsx)(_,{children:`inverted`}),(0,u.jsx)(l,{size:`xxs`,inverted:!0}),(0,u.jsx)(l,{size:`xs`,inverted:!0}),(0,u.jsx)(l,{size:`s`,inverted:!0}),(0,u.jsx)(l,{size:`m`,inverted:!0}),(0,u.jsx)(l,{size:`l`,inverted:!0}),(0,u.jsx)(_,{children:`iconOnly`}),(0,u.jsx)(l,{iconOnly:!0,size:`xxs`}),(0,u.jsx)(l,{iconOnly:!0,size:`xs`}),(0,u.jsx)(l,{iconOnly:!0,size:`s`}),(0,u.jsx)(l,{iconOnly:!0,size:`m`}),(0,u.jsx)(l,{iconOnly:!0,size:`l`}),(0,u.jsx)(_,{children:`iconOnly inverted`}),(0,u.jsx)(l,{iconOnly:!0,size:`xxs`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`xs`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`s`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`m`,inverted:!0}),(0,u.jsx)(l,{iconOnly:!0,size:`l`,inverted:!0}),(0,u.jsx)(_,{children:`business`}),(0,u.jsx)(l,{business:!0,size:`xxs`}),(0,u.jsx)(l,{business:!0,size:`xs`}),(0,u.jsx)(l,{business:!0,size:`s`}),(0,u.jsx)(l,{business:!0,size:`m`}),(0,u.jsx)(l,{business:!0,size:`l`}),(0,u.jsx)(_,{children:`business inverted`}),(0,u.jsx)(l,{business:!0,size:`xxs`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`xs`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`s`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`m`,inverted:!0}),(0,u.jsx)(l,{business:!0,size:`l`,inverted:!0})]}),v.tags=[`test`],v.parameters={chromatic:{disableSnapshot:!1}},y={parameters:{options:{selectedPanel:`addon-controls`}},decorators:[(e,{args:t})=>(0,u.jsx)(`div`,{style:{backgroundColor:t.inverted?`black`:void 0},children:e()})],args:{size:`m`,dataset:{qaid:`preply-logo`}},argTypes:{iconOnly:{type:`boolean`},business:{type:`boolean`},inverted:{type:`boolean`},dataset:{control:`object`}}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`() => <PreplyLogo />`,...f.parameters?.docs?.source}}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`() => <PreplyLogo iconOnly />`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`() => <PreplyLogo business />`,...m.parameters?.docs?.source}}},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`() => <div style={{
   display: 'flex',
   alignItems: 'center',
   gap: '16px'
 }}>
+        <PreplyLogo size="xxs" />
         <PreplyLogo size="xs" />
         <PreplyLogo size="s" />
         <PreplyLogo size="m" />
@@ -12,48 +13,55 @@ import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2
   return <div style={{
     padding: '8px',
     display: 'grid',
-    gridTemplateColumns: '200px 100px 150px 200px 300px',
+    gridTemplateColumns: '200px 80px 100px 150px 200px 300px',
     rowGap: '8px',
     alignItems: 'end',
     backgroundColor: grey
   }}>
             <CodeHeading></CodeHeading>
+            <CodeHeading>size=&quot;xxs&quot;</CodeHeading>
             <CodeHeading>size=&quot;xs&quot;</CodeHeading>
             <CodeHeading>size=&quot;s&quot;</CodeHeading>
             <CodeHeading>size=&quot;m&quot;</CodeHeading>
             <CodeHeading>size=&quot;l&quot;</CodeHeading>
 
             <CodeHeading></CodeHeading>
+            <PreplyLogo size="xxs" />
             <PreplyLogo size="xs" />
             <PreplyLogo size="s" />
             <PreplyLogo size="m" />
             <PreplyLogo size="l" />
 
             <CodeHeading>inverted</CodeHeading>
+            <PreplyLogo size="xxs" inverted />
             <PreplyLogo size="xs" inverted />
             <PreplyLogo size="s" inverted />
             <PreplyLogo size="m" inverted />
             <PreplyLogo size="l" inverted />
 
             <CodeHeading>iconOnly</CodeHeading>
+            <PreplyLogo iconOnly size="xxs" />
             <PreplyLogo iconOnly size="xs" />
             <PreplyLogo iconOnly size="s" />
             <PreplyLogo iconOnly size="m" />
             <PreplyLogo iconOnly size="l" />
 
             <CodeHeading>iconOnly inverted</CodeHeading>
+            <PreplyLogo iconOnly size="xxs" inverted />
             <PreplyLogo iconOnly size="xs" inverted />
             <PreplyLogo iconOnly size="s" inverted />
             <PreplyLogo iconOnly size="m" inverted />
             <PreplyLogo iconOnly size="l" inverted />
 
             <CodeHeading>business</CodeHeading>
+            <PreplyLogo business size="xxs" />
             <PreplyLogo business size="xs" />
             <PreplyLogo business size="s" />
             <PreplyLogo business size="m" />
             <PreplyLogo business size="l" />
 
             <CodeHeading>business inverted</CodeHeading>
+            <PreplyLogo business size="xxs" inverted />
             <PreplyLogo business size="xs" inverted />
             <PreplyLogo business size="s" inverted />
             <PreplyLogo business size="m" inverted />

package/dist/assets/{ProgressBar.stories-BD3OKmoy.js → ProgressBar.stories-DtKBuyeU.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"./IconButton-D218WESp.js";import{n as o,t as s}from"./LayoutFlex-CEr_Bd5T.js";import{n as c,t as l}from"./ProgressBar-Crf4SgkT.js";import{i as u,n as d,r as f,t as p}from"./TokyoUIMinus-D-ZU-zJ8.js";var m,h,g,_,v,y,b,x;t((()=>{m=e(n(),1),c(),i(),o(),u(),d(),h=r(),g={title:`Components/ProgressBar`,component:l,parameters:{docs:{description:{component:`A component that visually indicates progress through a range of values.`}}},decorators:[e=>(0,h.jsx)(`div`,{style:{padding:`32px`,width:`500px`},children:(0,h.jsx)(e,{})})],args:{"aria-label":`Story`}},_={tags:[`!test`],args:{value:10,min:0,max:100},render:function({value:e,...t}){let[n,r]=(0,m.useState)(e),i=()=>r(Math.min(n+10,100));return(0,h.jsxs)(s,{alignItems:`center`,gap:`12`,children:[(0,h.jsx)(a,{svg:p,assistiveText:`Subtract`,onClick:()=>r(Math.max(n-10,0))}),(0,h.jsx)(`div`,{style:{width:150},children:(0,h.jsx)(l,{...t,value:n})}),(0,h.jsx)(a,{svg:f,assistiveText:`Add`,onClick:i})]})}},v={args:{value:0,min:0,max:100}},y={args:{value:100,min:0,max:100}},b={args:{value:2,min:1,max:5}},_.parameters={..._.parameters,docs:{..._.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"./IconButton-Qo4r7KAR.js";import{n as o,t as s}from"./LayoutFlex-CpktYRVX.js";import{n as c,t as l}from"./ProgressBar-CRitEeQk.js";import{i as u,n as d,r as f,t as p}from"./TokyoUIMinus-D-ZU-zJ8.js";var m,h,g,_,v,y,b,x;t((()=>{m=e(n(),1),c(),i(),o(),u(),d(),h=r(),g={title:`Components/ProgressBar`,component:l,parameters:{docs:{description:{component:`A component that visually indicates progress through a range of values.`}}},decorators:[e=>(0,h.jsx)(`div`,{style:{padding:`32px`,width:`500px`},children:(0,h.jsx)(e,{})})],args:{"aria-label":`Story`}},_={tags:[`!test`],args:{value:10,min:0,max:100},render:function({value:e,...t}){let[n,r]=(0,m.useState)(e),i=()=>r(Math.min(n+10,100));return(0,h.jsxs)(s,{alignItems:`center`,gap:`12`,children:[(0,h.jsx)(a,{svg:p,assistiveText:`Subtract`,onClick:()=>r(Math.max(n-10,0))}),(0,h.jsx)(`div`,{style:{width:150},children:(0,h.jsx)(l,{...t,value:n})}),(0,h.jsx)(a,{svg:f,assistiveText:`Add`,onClick:i})]})}},v={args:{value:0,min:0,max:100}},y={args:{value:100,min:0,max:100}},b={args:{value:2,min:1,max:5}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
   tags: ['!test'],
   args: {
     value: 10,

package/dist/assets/{ProgressSteps.stories-Bb7wnDFB.js → ProgressSteps.stories-CCDOfqG3.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"./IconButton-D218WESp.js";import{n as o,t as s}from"./ProgressSteps-Cl7OdN1S.js";import{n as c,t as l}from"./LayoutFlex-CEr_Bd5T.js";import{i as u,n as d,r as f,t as p}from"./TokyoUIMinus-D-ZU-zJ8.js";var m,h,g,_,v,y,b;t((()=>{m=e(n(),1),o(),c(),i(),u(),d(),h=r(),g={title:`Components/ProgressSteps`,component:s,decorators:[e=>(0,h.jsx)(`div`,{style:{padding:`32px`,width:`500px`},children:(0,h.jsx)(e,{})})],args:{"aria-label":`Story`}},_={tags:[`!test`],args:{currentStep:6,totalSteps:6},render:function({currentStep:e,totalSteps:t,...n}){let[r,i]=(0,m.useState)(e),o=()=>i(Math.min(r+1,t));return(0,h.jsxs)(l,{alignItems:`center`,gap:`12`,children:[(0,h.jsx)(a,{svg:p,assistiveText:`Subtract`,onClick:()=>i(Math.max(r-1,1))}),(0,h.jsx)(s,{...n,currentStep:r,totalSteps:t}),(0,h.jsx)(a,{svg:f,assistiveText:`Add`,onClick:o})]})}},v={args:{currentStep:1,totalSteps:6}},y={args:{currentStep:6,totalSteps:6}},_.parameters={..._.parameters,docs:{..._.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"./IconButton-Qo4r7KAR.js";import{n as o,t as s}from"./ProgressSteps-B2AXEKFJ.js";import{n as c,t as l}from"./LayoutFlex-CpktYRVX.js";import{i as u,n as d,r as f,t as p}from"./TokyoUIMinus-D-ZU-zJ8.js";var m,h,g,_,v,y,b;t((()=>{m=e(n(),1),o(),c(),i(),u(),d(),h=r(),g={title:`Components/ProgressSteps`,component:s,decorators:[e=>(0,h.jsx)(`div`,{style:{padding:`32px`,width:`500px`},children:(0,h.jsx)(e,{})})],args:{"aria-label":`Story`}},_={tags:[`!test`],args:{currentStep:6,totalSteps:6},render:function({currentStep:e,totalSteps:t,...n}){let[r,i]=(0,m.useState)(e),o=()=>i(Math.min(r+1,t));return(0,h.jsxs)(l,{alignItems:`center`,gap:`12`,children:[(0,h.jsx)(a,{svg:p,assistiveText:`Subtract`,onClick:()=>i(Math.max(r-1,1))}),(0,h.jsx)(s,{...n,currentStep:r,totalSteps:t}),(0,h.jsx)(a,{svg:f,assistiveText:`Add`,onClick:o})]})}},v={args:{currentStep:1,totalSteps:6}},y={args:{currentStep:6,totalSteps:6}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
   tags: ['!test'],
   args: {
     currentStep: 6,

package/dist/assets/{PromoDialog-Bx4wrVnI.js → PromoDialog-CdaXJHkH.js}

@@ -1,3 +1,3 @@
-import{n as e}from"./chunk-BneVvdWh.js";import{t}from"./jsx-runtime-C2wGStra.js";import{l as n,o as r}from"./iframe-Ddp8AsMq.js";import{r as i}from"./react-B8jdHdWa.js";import{t as a}from"./mdx-react-shim-BUTq3l7l.js";function o(e){let t={a:`a`,code:`code`,h1:`h1`,p:`p`,...i(),...e.components};return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(r,{title:`Components/Dialog/PromoDialog`}),`
+import{n as e}from"./chunk-BneVvdWh.js";import{t}from"./jsx-runtime-C2wGStra.js";import{l as n,o as r}from"./iframe-kBDSpxRI.js";import{r as i}from"./react-B8jdHdWa.js";import{t as a}from"./mdx-react-shim-BUTq3l7l.js";function o(e){let t={a:`a`,code:`code`,h1:`h1`,p:`p`,...i(),...e.components};return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(r,{title:`Components/Dialog/PromoDialog`}),`
 `,(0,c.jsx)(t.h1,{id:`promodialog`,children:`PromoDialog`}),`
 `,(0,c.jsxs)(t.p,{children:[`PromoDialog component is temporarily located in `,(0,c.jsx)(t.code,{children:`@preply/shared`}),`, check its stories in the `,(0,c.jsx)(t.a,{href:`https://apollo-storybook.preply.org/?path=/docs/design-system-promodialog--docs`,rel:`nofollow`,children:`apollo storybook`})]})]})}function s(e={}){let{wrapper:t}={...i(),...e.components};return t?(0,c.jsx)(t,{...e,children:(0,c.jsx)(o,{...e})}):o(e)}var c;e((()=>{c=t(),a(),n()}))();export{s as default};

package/dist/assets/{RangeSlider-gznGiBxe.js → RangeSlider-Eo2dw_WW.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{C as o,E as s,T as c,_ as l,w as u}from"./iframe-Ddp8AsMq.js";import{n as d,t as f}from"./dist-Cc1j9Pjk.js";import{o as p,r as m}from"./lib-8ue2PVWI.js";import{a as h,i as g,n as _,r as v}from"./Slider-cjoP1Fs6.js";var y,b,x,S=t((()=>{y=e(n(),1),l(),h(),i(),f(),m(),v(),b=a(),x=(0,y.forwardRef)(function({value:e,defaultValue:t=[0,100],onValueChange:n,onValueCommit:i,min:a=0,max:l=100,step:f=1,minStepsBetweenThumbs:m=0,dataset:h,"aria-label":v,...y},x){let{formatMessage:S}=p(),C=r(h,{preplyDsComponent:d.Slider}),w=n?e=>n([e[0],e[1]]):void 0,T=i?e=>i([e[0],e[1]]):void 0;return(0,b.jsxs)(u,{ref:x,...C,className:g.root,value:e,defaultValue:t,onValueChange:w,onValueCommit:T,min:a,max:l,step:f,minStepsBetweenThumbs:m,children:[(0,b.jsx)(s,{className:g.track,children:(0,b.jsx)(o,{className:g.range})}),(0,b.jsx)(c,{..._(y),className:g.thumb,"aria-label":S({id:`preply-ds.slider-field.accessibility-label.minimum`,defaultMessage:`Minimum {label}`,description:`A label for a slider input's minimum value.
+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{C as o,E as s,T as c,_ as l,w as u}from"./iframe-kBDSpxRI.js";import{n as d,t as f}from"./dist-Cc1j9Pjk.js";import{o as p,r as m}from"./lib-8ue2PVWI.js";import{a as h,i as g,n as _,r as v}from"./Slider-Bxzp79ts.js";var y,b,x,S=t((()=>{y=e(n(),1),l(),h(),i(),f(),m(),v(),b=a(),x=(0,y.forwardRef)(function({value:e,defaultValue:t=[0,100],onValueChange:n,onValueCommit:i,min:a=0,max:l=100,step:f=1,minStepsBetweenThumbs:m=0,dataset:h,"aria-label":v,...y},x){let{formatMessage:S}=p(),C=r(h,{preplyDsComponent:d.Slider}),w=n?e=>n([e[0],e[1]]):void 0,T=i?e=>i([e[0],e[1]]):void 0;return(0,b.jsxs)(u,{ref:x,...C,className:g.root,value:e,defaultValue:t,onValueChange:w,onValueCommit:T,min:a,max:l,step:f,minStepsBetweenThumbs:m,children:[(0,b.jsx)(s,{className:g.track,children:(0,b.jsx)(o,{className:g.range})}),(0,b.jsx)(c,{..._(y),className:g.thumb,"aria-label":S({id:`preply-ds.slider-field.accessibility-label.minimum`,defaultMessage:`Minimum {label}`,description:`A label for a slider input's minimum value.
                             For example: 'Minimum Price'.`},{label:v})}),(0,b.jsx)(c,{..._(y),className:g.thumb,"aria-label":S({id:`preply-ds.slider-field.accessibility-label.maximum`,defaultMessage:`Maximum {label}`,description:`A label for a slider input's maximum value.
                             For example: 'Maximum Price'.`},{label:v})})]})});try{x.displayName=`RangeSlider`,x.__docgenInfo={description:`A slider input that allows users to select a range between two values.`,displayName:`RangeSlider`,props:{id:{defaultValue:null,description:`The unique identifier for the range slider element.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-label":{defaultValue:null,description:`Accessible label for the range slider.`,name:`aria-label`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-labelledby":{defaultValue:null,description:`ID of the element that labels the range slider.`,name:`aria-labelledby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-describedby":{defaultValue:null,description:`ID of the element that describes the range slider.`,name:`aria-describedby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-invalid":{defaultValue:null,description:`Indicates whether the range slider value is invalid.`,name:`aria-invalid`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},"aria-errormessage":{defaultValue:null,description:`ID of the element that describes the error, if any.`,name:`aria-errormessage`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},value:{defaultValue:null,description:"The controlled value of the range slider.\nMust be used in conjunction with `onValueChange`.",name:`value`,required:!1,type:{name:`enum`,value:[{value:`RangeSliderValue`}]}},defaultValue:{defaultValue:{value:`[0, 100]`},description:`The value of the range slider when initially rendered.
-Use when you do not need to control the state of the range slider.`,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`RangeSliderValue`}]}},onValueChange:{defaultValue:null,description:`Event handler called when the value changes.`,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: RangeSliderValue) => void`}]}},onValueCommit:{defaultValue:null,description:`Event handler called when the value is committed (e.g. on pointer up or Enter key).`,name:`onValueCommit`,required:!1,type:{name:`enum`,value:[{value:`(value: RangeSliderValue) => void`}]}},name:{defaultValue:null,description:`The name of the range slider. Submitted with its owning form as part of a name/value pair.`,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},min:{defaultValue:{value:`0`},description:`The minimum value for the range slider.`,name:`min`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},max:{defaultValue:{value:`100`},description:`The maximum value for the range slider.`,name:`max`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},step:{defaultValue:{value:`1`},description:`The slider stepping interval.`,name:`step`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},minStepsBetweenThumbs:{defaultValue:{value:`0`},description:`The minimum permitted steps between thumbs.`,name:`minStepsBetweenThumbs`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},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: HTMLSpanElement | null) => void`},{value:`RefObject<HTMLSpanElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{S as n,x as t};
+Use when you do not need to control the state of the range slider.`,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`RangeSliderValue`}]}},onValueChange:{defaultValue:null,description:`Event handler called when the value changes.`,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: RangeSliderValue) => void`}]}},onValueCommit:{defaultValue:null,description:`Event handler called when the value is committed (e.g. on pointer up or Enter key).`,name:`onValueCommit`,required:!1,type:{name:`enum`,value:[{value:`(value: RangeSliderValue) => void`}]}},name:{defaultValue:null,description:`The name of the range slider. Submitted with its owning form as part of a name/value pair.`,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},min:{defaultValue:{value:`0`},description:`The minimum value for the range slider.`,name:`min`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},max:{defaultValue:{value:`100`},description:`The maximum value for the range slider.`,name:`max`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},step:{defaultValue:{value:`1`},description:`The slider stepping interval.`,name:`step`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},minStepsBetweenThumbs:{defaultValue:{value:`0`},description:`The minimum permitted steps between thumbs.`,name:`minStepsBetweenThumbs`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}}));export{S as n,x as t};

package/dist/assets/{RangeSlider.stories-Bj82Tme8.js → RangeSlider.stories-DAd-xGsP.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"./RangeSlider-gznGiBxe.js";var o,s,c,l,u,d,f,p,m,h,g,_,v,y,b;t((()=>{o=e(n(),1),i(),s=r(),{action:c}=__STORYBOOK_MODULE_ACTIONS__,{expect:l,fn:u,userEvent:d,within:f}=__STORYBOOK_MODULE_TEST__,p=u(c(`change`)),m=u(c(`commit`)),h={title:`Components/Slider/RangeSlider`,component:a,decorators:[e=>(0,s.jsx)(`div`,{style:{padding:`32px`,maxWidth:`400px`},children:(0,s.jsx)(e,{})})],args:{"aria-label":`Sample`,onValueChange:p,onValueCommit:m}},g={play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`0`),l(r).toHaveAttribute(`aria-valuenow`,`100`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`1`),l(p).toBeCalledWith([1,100]),l(m).toBeCalledWith([1,100])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`99`),l(p).toBeCalledWith([1,99]),l(m).toBeCalledWith([1,99])})}},_={args:{defaultValue:[25,75]},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`25`),l(r).toHaveAttribute(`aria-valuenow`,`75`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`26`),l(p).toBeCalledWith([26,75]),l(m).toBeCalledWith([26,75])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`74`),l(p).toBeCalledWith([26,74]),l(m).toBeCalledWith([26,74])})}},v={render:function(e){let[t,n]=(0,o.useState)([25,75]);return(0,s.jsx)(a,{...e,value:t,onValueChange:t=>{n(t),e.onValueChange?.(t)}})},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`25`),l(r).toHaveAttribute(`aria-valuenow`,`75`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`26`),l(p).toBeCalledWith([26,75]),l(m).toBeCalledWith([26,75])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`74`),l(p).toBeCalledWith([26,74]),l(m).toBeCalledWith([26,74])})}},y={args:{defaultValue:[1,4],minStepsBetweenThumbs:2,step:1},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);await l(n).not.toBeNull(),await l(r).not.toBeNull(),await t(`Initial state with minimum steps`,async()=>{await l(n).toHaveAttribute(`aria-valuenow`,`1`),await l(r).toHaveAttribute(`aria-valuenow`,`4`)}),await t(`Verify minimum steps constraint`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`.repeat(3)),await l(n).toHaveAttribute(`aria-valuenow`,`2`),r.focus(),await d.keyboard(`{ArrowLeft}`),await l(r).toHaveAttribute(`aria-valuenow`,`4`),await l(p).toHaveBeenNthCalledWith(1,[2,4])})}},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"./RangeSlider-Eo2dw_WW.js";var o,s,c,l,u,d,f,p,m,h,g,_,v,y,b;t((()=>{o=e(n(),1),i(),s=r(),{action:c}=__STORYBOOK_MODULE_ACTIONS__,{expect:l,fn:u,userEvent:d,within:f}=__STORYBOOK_MODULE_TEST__,p=u(c(`change`)),m=u(c(`commit`)),h={title:`Components/Slider/RangeSlider`,component:a,decorators:[e=>(0,s.jsx)(`div`,{style:{padding:`32px`,maxWidth:`400px`},children:(0,s.jsx)(e,{})})],args:{"aria-label":`Sample`,onValueChange:p,onValueCommit:m}},g={play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`0`),l(r).toHaveAttribute(`aria-valuenow`,`100`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`1`),l(p).toBeCalledWith([1,100]),l(m).toBeCalledWith([1,100])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`99`),l(p).toBeCalledWith([1,99]),l(m).toBeCalledWith([1,99])})}},_={args:{defaultValue:[25,75]},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`25`),l(r).toHaveAttribute(`aria-valuenow`,`75`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`26`),l(p).toBeCalledWith([26,75]),l(m).toBeCalledWith([26,75])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`74`),l(p).toBeCalledWith([26,74]),l(m).toBeCalledWith([26,74])})}},v={render:function(e){let[t,n]=(0,o.useState)([25,75]);return(0,s.jsx)(a,{...e,value:t,onValueChange:t=>{n(t),e.onValueChange?.(t)}})},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);l(n).not.toBeNull(),l(r).not.toBeNull(),await t(`Initial state`,async()=>{l(n).toHaveAttribute(`aria-valuenow`,`25`),l(r).toHaveAttribute(`aria-valuenow`,`75`)}),await t(`Move first thumb and verify value updates`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`),l(n).toHaveAttribute(`aria-valuenow`,`26`),l(p).toBeCalledWith([26,75]),l(m).toBeCalledWith([26,75])}),await t(`Move second thumb and verify value updates`,async()=>{r.focus(),await d.keyboard(`{ArrowLeft}`),l(r).toHaveAttribute(`aria-valuenow`,`74`),l(p).toBeCalledWith([26,74]),l(m).toBeCalledWith([26,74])})}},y={args:{defaultValue:[1,4],minStepsBetweenThumbs:2,step:1},play:async({canvasElement:e,step:t})=>{let[n,r]=f(e).getAllByRole(`slider`);await l(n).not.toBeNull(),await l(r).not.toBeNull(),await t(`Initial state with minimum steps`,async()=>{await l(n).toHaveAttribute(`aria-valuenow`,`1`),await l(r).toHaveAttribute(`aria-valuenow`,`4`)}),await t(`Verify minimum steps constraint`,async()=>{n.focus(),await d.keyboard(`{ArrowRight}`.repeat(3)),await l(n).toHaveAttribute(`aria-valuenow`,`2`),r.focus(),await d.keyboard(`{ArrowLeft}`),await l(r).toHaveAttribute(`aria-valuenow`,`4`),await l(p).toHaveBeenNthCalledWith(1,[2,4])})}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
   play: async ({
     canvasElement,
     step

package/dist/assets/{Rating-CDQpKKfm.js → Rating-CAaFjEvZ.js}

@@ -1,2 +1,2 @@
-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,x as a,y as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{n as c,t as l}from"./dist-Cc1j9Pjk.js";import{a as u,c as d,i as f,n as p,o as m,r as h,s as g,t as _}from"./Stars-C54j1o92.js";var v,y,b=t((()=>{e(n(),1),l(),i(),d(),u(),h(),p(),v=s(),y=function({size:e=`large`,value:t,dataset:n}){let i=m(t),{ariaValueText:s}=f(i);return(0,v.jsx)(`div`,{className:o(g,`rating`,[a(`size`,e)]).join(` `),...r(n,{preplyDsComponent:c.Rating}),role:`img`,"aria-label":s,children:(0,v.jsx)(_,{filledPerc:i/5})})};try{y.displayName=`Rating`,y.__docgenInfo={description:`A component that visualizes the current rating.`,displayName:`Rating`,props:{value:{defaultValue:null,description:`Can be half values.`,name:`value`,required:!0,type:{name:`number`}},size:{defaultValue:{value:`large`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<"small" | "large" | "medium">`}]}},dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
+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,x as a,y as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{n as c,t as l}from"./dist-Cc1j9Pjk.js";import{a as u,c as d,i as f,n as p,o as m,r as h,s as g,t as _}from"./Stars-BU2A8ygV.js";var v,y,b=t((()=>{e(n(),1),l(),i(),d(),u(),h(),p(),v=s(),y=function({size:e=`large`,value:t,dataset:n}){let i=m(t),{ariaValueText:s}=f(i);return(0,v.jsx)(`div`,{className:o(g,`rating`,[a(`size`,e)]).join(` `),...r(n,{preplyDsComponent:c.Rating}),role:`img`,"aria-label":s,children:(0,v.jsx)(_,{filledPerc:i/5})})};try{y.displayName=`Rating`,y.__docgenInfo={description:`A component that visualizes the current rating.`,displayName:`Rating`,props:{value:{defaultValue:null,description:`Can be half values.`,name:`value`,required:!0,type:{name:`number`}},size:{defaultValue:{value:`large`},description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`"small"`},{value:`"large"`},{value:`"medium"`},{value:`ResponsiveProp<"small" | "large" | "medium">`}]}},dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
 @example <Rating 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{b as n,y as t};

package/dist/assets/{Rating.stories-440yo9nU.js → Rating.stories-8F2e8UDj.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"./Rating-CDQpKKfm.js";var o,s,c,l,u,d,f,p;t((()=>{e(n(),1),i(),o=r(),{expect:s}=__STORYBOOK_MODULE_TEST__,c={title:`components/Rating`,component:a,args:{}},l={parameters:{chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-s":{viewport:`medium-s`}}}},render:function(){return(0,o.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,o.jsxs)(`tbody`,{children:[(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`small`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`small`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`medium`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`medium`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`large`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`large`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`Responsive`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:{_:`small`,"medium-s":`large`}})})]})]})})}},u={render:function(){function e({value:e}){return(0,o.jsx)(`tbody`,{children:(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:e}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:e})})]})})}return(0,o.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,o.jsx)(e,{value:0}),(0,o.jsx)(e,{value:.5}),(0,o.jsx)(e,{value:1}),(0,o.jsx)(e,{value:1.5}),(0,o.jsx)(e,{value:2}),(0,o.jsx)(e,{value:2.5}),(0,o.jsx)(e,{value:3}),(0,o.jsx)(e,{value:3.5}),(0,o.jsx)(e,{value:4}),(0,o.jsx)(e,{value:4.5}),(0,o.jsx)(e,{value:5})]})}},d={render:function(){return(0,o.jsx)(a,{value:4})},play:async({canvas:e})=>{s(await e.findByRole(`img`,{name:/4 out of 5/})).toBeVisible()}},f={parameters:{chromatic:{disableSnapshot:!0}},argTypes:{dataset:{control:`object`},value:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},size:{control:`select`,options:[`small`,`medium`,`large`]}}},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"./Rating-CAaFjEvZ.js";var o,s,c,l,u,d,f,p;t((()=>{e(n(),1),i(),o=r(),{expect:s}=__STORYBOOK_MODULE_TEST__,c={title:`components/Rating`,component:a,args:{}},l={parameters:{chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-s":{viewport:`medium-s`}}}},render:function(){return(0,o.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,o.jsxs)(`tbody`,{children:[(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`small`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`small`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`medium`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`medium`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`large`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:`large`})})]}),(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:`Responsive`}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:2.5,size:{_:`small`,"medium-s":`large`}})})]})]})})}},u={render:function(){function e({value:e}){return(0,o.jsx)(`tbody`,{children:(0,o.jsxs)(`tr`,{children:[(0,o.jsx)(`td`,{children:e}),(0,o.jsx)(`td`,{children:(0,o.jsx)(a,{value:e})})]})})}return(0,o.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,o.jsx)(e,{value:0}),(0,o.jsx)(e,{value:.5}),(0,o.jsx)(e,{value:1}),(0,o.jsx)(e,{value:1.5}),(0,o.jsx)(e,{value:2}),(0,o.jsx)(e,{value:2.5}),(0,o.jsx)(e,{value:3}),(0,o.jsx)(e,{value:3.5}),(0,o.jsx)(e,{value:4}),(0,o.jsx)(e,{value:4.5}),(0,o.jsx)(e,{value:5})]})}},d={render:function(){return(0,o.jsx)(a,{value:4})},play:async({canvas:e})=>{s(await e.findByRole(`img`,{name:/4 out of 5/})).toBeVisible()}},f={parameters:{chromatic:{disableSnapshot:!0}},argTypes:{dataset:{control:`object`},value:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},size:{control:`select`,options:[`small`,`medium`,`large`]}}},l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
   parameters: {
     chromatic: {
       modes: {

package/dist/assets/{RatingInput-S42sTjma.js → RatingInput-BNKHainW.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,x as a,y as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{n as c,t as l}from"./dist-Cc1j9Pjk.js";import{n as u,t as d}from"./useControllableState-DQx2v_AU.js";import{a as f,c as p,i as m,n as h,o as g,r as _,s as v,t as y}from"./Stars-C54j1o92.js";function b({mousePercentage:e,amountOfStars:t}){let n=e*t+.01;return Math.ceil(n)}function x({amountOfStars:e}){let t=(0,S.useRef)(null),[n,r]=(0,S.useState)(null);return(0,S.useEffect)(()=>{let n=window.matchMedia(`(hover: hover)`).matches===!0;if(!t.current||!n)return;let i=t.current;function a(t){let n=i.getBoundingClientRect();r(b({mousePercentage:(t.clientX-n.left)/n.width,amountOfStars:e}))}function o(){r(null)}return i.addEventListener(`mousemove`,a),i.addEventListener(`mouseenter`,a),i.addEventListener(`mouseleave`,o),()=>{i.removeEventListener(`mousemove`,a),i.removeEventListener(`mouseenter`,a),i.removeEventListener(`mouseleave`,o)}},[e]),{hoverValue:n,ref:t}}var S,C=t((()=>{S=e(n(),1)}));function w(e){let{defaultValue:t,value:n,onChange:r,onValueChange:i}=e,[a,o]=u({defaultValue:t,value:n,onValueChange:i});return{value:a,onChange:(0,T.useCallback)(e=>{r?.(e),!e.defaultPrevented&&o?.(e.currentTarget.valueAsNumber)},[r,o])}}var T,E=t((()=>{T=e(n(),1),d()}));function D({hasError:e,ariaInvalid:t}){return typeof t==`boolean`&&typeof e==`boolean`?(console.warn(`You provided both 'hasError' and 'aria-invalid' props. 'hasError' will take precedence. If you're using RatingInput inside FormControl, please remove 'hasError' prop.`),e):typeof e==`boolean`?e:typeof t==`boolean`?t:!1}var O=t((()=>{})),k,A,j,M,N=t((()=>{k=e(n(),1),l(),i(),p(),C(),f(),_(),E(),O(),h(),A=s(),j=5,M=(0,k.forwardRef)(function({id:e,name:t,value:n,defaultValue:i=0,onValueChange:s,onChange:l,hasError:u,required:d,"aria-label":f,"aria-labelledby":p,"aria-describedby":h,dataset:_,dsInternalSimulation:b,onBlur:S,onFocus:C,"aria-invalid":T},E){let{value:O,onChange:k}=w({onChange:l,onValueChange:s,defaultValue:i,value:n}),M=g(O),{ariaValueText:N}=m(M),P=D({hasError:u,ariaInvalid:T}),{hoverValue:F,ref:I}=x({amountOfStars:j}),L=typeof F==`number`?F:M;return(0,A.jsxs)(`div`,{className:[...o(v,`rating`),...o(v,`ratingInput`,[a(`dsInternalSimulation`,b)])].join(` `),...r(_,{preplyDsComponent:c.RatingInput}),ref:I,children:[(0,A.jsx)(y,{filledPerc:L/j}),(0,A.jsx)(`input`,{type:`range`,min:0,max:j,step:1,value:M,id:e,name:t,"aria-invalid":P===!0?!0:void 0,"aria-required":d===!0?!0:void 0,"aria-label":f,"aria-labelledby":p,"aria-describedby":h,"aria-valuetext":N,onBlur:S,onFocus:C,onChange:k,ref:E})]})});try{M.displayName=`RatingInput`,M.__docgenInfo={description:`A component that allows rating through a series of discrete values.
+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"./useControllableState-B6dCOM10.js";import{a as d,c as f,i as p,n as m,o as h,r as g,s as _,t as v}from"./Stars-BU2A8ygV.js";function y({mousePercentage:e,amountOfStars:t}){let n=e*t+.01;return Math.ceil(n)}function b({amountOfStars:e}){let t=(0,x.useRef)(null),[n,r]=(0,x.useState)(null);return(0,x.useEffect)(()=>{let n=window.matchMedia(`(hover: hover)`).matches===!0;if(!t.current||!n)return;let i=t.current;function a(t){let n=i.getBoundingClientRect();r(y({mousePercentage:(t.clientX-n.left)/n.width,amountOfStars:e}))}function o(){r(null)}return i.addEventListener(`mousemove`,a),i.addEventListener(`mouseenter`,a),i.addEventListener(`mouseleave`,o),()=>{i.removeEventListener(`mousemove`,a),i.removeEventListener(`mouseenter`,a),i.removeEventListener(`mouseleave`,o)}},[e]),{hoverValue:n,ref:t}}var x,S=t((()=>{x=e(n(),1)}));function C(e){let{defaultValue:t,value:n,onChange:r,onValueChange:i}=e,[a,o]=l({defaultValue:t,value:n,onValueChange:i});return{value:a,onChange:(0,w.useCallback)(e=>{r?.(e),!e.defaultPrevented&&o?.(e.currentTarget.valueAsNumber)},[r,o])}}var w,T=t((()=>{w=e(n(),1),u()}));function E({hasError:e,ariaInvalid:t}){return typeof t==`boolean`&&typeof e==`boolean`?(console.warn(`You provided both 'hasError' and 'aria-invalid' props. 'hasError' will take precedence. If you're using RatingInput inside FormControl, please remove 'hasError' prop.`),e):typeof e==`boolean`?e:typeof t==`boolean`?t:!1}var D=t((()=>{})),O,k,A,j,M=t((()=>{O=e(n(),1),c(),i(),f(),S(),d(),g(),T(),D(),m(),k=o(),A=5,j=(0,O.forwardRef)(function({id:e,name:t,value:n,defaultValue:i=0,onValueChange:o,onChange:c,hasError:l,required:u,"aria-label":d,"aria-labelledby":f,"aria-describedby":m,dataset:g,onBlur:y,onFocus:x,"aria-invalid":S},w){let{value:T,onChange:D}=C({onChange:c,onValueChange:o,defaultValue:i,value:n}),O=h(T),{ariaValueText:j}=p(O),M=E({hasError:l,ariaInvalid:S}),{hoverValue:N,ref:P}=b({amountOfStars:A}),F=typeof N==`number`?N:O;return(0,k.jsxs)(`div`,{className:[...a(_,`rating`),...a(_,`ratingInput`)].join(` `),...r(g,{preplyDsComponent:s.RatingInput}),ref:P,children:[(0,k.jsx)(v,{filledPerc:F/A}),(0,k.jsx)(`input`,{type:`range`,min:0,max:A,step:1,value:O,id:e,name:t,"aria-invalid":M===!0?!0:void 0,"aria-required":u===!0?!0:void 0,"aria-label":d,"aria-labelledby":f,"aria-describedby":m,"aria-valuetext":j,onBlur:y,onFocus:x,onChange:D,ref:w})]})});try{j.displayName=`RatingInput`,j.__docgenInfo={description:`A component that allows rating through a series of discrete values.
 
 If you need to visualize the current rating without the users changing it, look at Rating.`,displayName:`RatingInput`,props:{value:{defaultValue:null,description:`Half values can be shown, but the users can only set full values by interacting.
 
@@ -27,4 +27,4 @@ is of type \`range\`, which means \`required\` is ineffective.
 
 This is automatically handled by FormControl.
 @see {@link https://github.com/preply/design-system/blob/main/packages/web-lib/src/components/FormControl/FormControl.stories.tsx FormControl.stories.tsx} for complete examples.`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},defaultValue:{defaultValue:{value:`0`},description:``,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},onValueChange:{defaultValue:null,description:``,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: number) => void`}]}},dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
-@example <Rating 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`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLInputElement>`}]}},"aria-label":{defaultValue:null,description:``,name:`aria-label`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-labelledby":{defaultValue:null,description:``,name:`aria-labelledby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-describedby":{defaultValue:null,description:``,name:`aria-describedby`,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: HTMLInputElement | null) => void`},{value:`RefObject<HTMLInputElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{N as n,M as t};
+@example <Rating 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`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLInputElement>`}]}},"aria-label":{defaultValue:null,description:``,name:`aria-label`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-labelledby":{defaultValue:null,description:``,name:`aria-labelledby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-describedby":{defaultValue:null,description:``,name:`aria-describedby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}}}}}catch{}}));export{M as n,j as t};

package/dist/assets/{RatingInput.stories-BJ91kNqc.js → RatingInput.stories-0bwrwiHs.js}

@@ -1,4 +1,4 @@
-import{a as e,n as t,t as n}from"./chunk-BneVvdWh.js";import{t as r}from"./react-C7IZe2D1.js";import{t as i}from"./jsx-runtime-C2wGStra.js";import{n as a,t as o}from"./Button-a57MCiDO.js";import{n as s,t as c}from"./FormControl-N0zmQNS2.js";import{n as l,t as u}from"./RatingInput-S42sTjma.js";import{n as d,t as f}from"./Switch-CpclSBFz.js";var p=n(((e,t)=>{var n=10,r=(e=0)=>t=>`\u001B[${38+e};5;${t}m`,i=(e=0)=>(t,n,r)=>`\u001B[${38+e};2;${t};${n};${r}m`;function a(){let e=new Map,t={modifier:{reset:[0,0],bold:[1,22],dim:[2,22],italic:[3,23],underline:[4,24],overline:[53,55],inverse:[7,27],hidden:[8,28],strikethrough:[9,29]},color:{black:[30,39],red:[31,39],green:[32,39],yellow:[33,39],blue:[34,39],magenta:[35,39],cyan:[36,39],white:[37,39],blackBright:[90,39],redBright:[91,39],greenBright:[92,39],yellowBright:[93,39],blueBright:[94,39],magentaBright:[95,39],cyanBright:[96,39],whiteBright:[97,39]},bgColor:{bgBlack:[40,49],bgRed:[41,49],bgGreen:[42,49],bgYellow:[43,49],bgBlue:[44,49],bgMagenta:[45,49],bgCyan:[46,49],bgWhite:[47,49],bgBlackBright:[100,49],bgRedBright:[101,49],bgGreenBright:[102,49],bgYellowBright:[103,49],bgBlueBright:[104,49],bgMagentaBright:[105,49],bgCyanBright:[106,49],bgWhiteBright:[107,49]}};t.color.gray=t.color.blackBright,t.bgColor.bgGray=t.bgColor.bgBlackBright,t.color.grey=t.color.blackBright,t.bgColor.bgGrey=t.bgColor.bgBlackBright;for(let[n,r]of Object.entries(t)){for(let[n,i]of Object.entries(r))t[n]={open:`\u001B[${i[0]}m`,close:`\u001B[${i[1]}m`},r[n]=t[n],e.set(i[0],i[1]);Object.defineProperty(t,n,{value:r,enumerable:!1})}return Object.defineProperty(t,`codes`,{value:e,enumerable:!1}),t.color.close=`\x1B[39m`,t.bgColor.close=`\x1B[49m`,t.color.ansi256=r(),t.color.ansi16m=i(),t.bgColor.ansi256=r(n),t.bgColor.ansi16m=i(n),Object.defineProperties(t,{rgbToAnsi256:{value:(e,t,n)=>e===t&&t===n?e<8?16:e>248?231:Math.round((e-8)/247*24)+232:16+36*Math.round(e/255*5)+6*Math.round(t/255*5)+Math.round(n/255*5),enumerable:!1},hexToRgb:{value:e=>{let t=/(?<colorString>[a-f\d]{6}|[a-f\d]{3})/i.exec(e.toString(16));if(!t)return[0,0,0];let{colorString:n}=t.groups;n.length===3&&(n=n.split(``).map(e=>e+e).join(``));let r=Number.parseInt(n,16);return[r>>16&255,r>>8&255,r&255]},enumerable:!1},hexToAnsi256:{value:e=>t.rgbToAnsi256(...t.hexToRgb(e)),enumerable:!1}}),t}Object.defineProperty(t,`exports`,{enumerable:!0,get:a})})),m=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.printIteratorEntries=n,e.printIteratorValues=r,e.printListItems=i,e.printObjectProperties=a;var t=(e,t)=>{let n=Object.keys(e).sort(t);return Object.getOwnPropertySymbols&&Object.getOwnPropertySymbols(e).forEach(t=>{Object.getOwnPropertyDescriptor(e,t).enumerable&&n.push(t)}),n};function n(e,t,n,r,i,a,o=`: `){let s=``,c=e.next();if(!c.done){s+=t.spacingOuter;let l=n+t.indent;for(;!c.done;){let n=a(c.value[0],t,l,r,i),u=a(c.value[1],t,l,r,i);s+=l+n+o+u,c=e.next(),c.done?t.min||(s+=`,`):s+=`,`+t.spacingInner}s+=t.spacingOuter+n}return s}function r(e,t,n,r,i,a){let o=``,s=e.next();if(!s.done){o+=t.spacingOuter;let c=n+t.indent;for(;!s.done;)o+=c+a(s.value,t,c,r,i),s=e.next(),s.done?t.min||(o+=`,`):o+=`,`+t.spacingInner;o+=t.spacingOuter+n}return o}function i(e,t,n,r,i,a){let o=``;if(e.length){o+=t.spacingOuter;let s=n+t.indent;for(let n=0;n<e.length;n++)o+=s,n in e&&(o+=a(e[n],t,s,r,i)),n<e.length-1?o+=`,`+t.spacingInner:t.min||(o+=`,`);o+=t.spacingOuter+n}return o}function a(e,n,r,i,a,o){let s=``,c=t(e,n.compareKeys);if(c.length){s+=n.spacingOuter;let t=r+n.indent;for(let r=0;r<c.length;r++){let l=c[r],u=o(l,n,t,i,a),d=o(e[l],n,t,i,a);s+=t+u+`: `+d,r<c.length-1?s+=`,`+n.spacingInner:n.min||(s+=`,`)}s+=n.spacingOuter+r}return s}})),h=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=m(),n=(function(){return typeof globalThis<`u`?globalThis:n===void 0?typeof self<`u`?self:typeof window<`u`?window:Function(`return this`)():n})(),r=n[`jest-symbol-do-not-touch`]||n.Symbol,i=typeof r==`function`&&r.for?r.for(`jest.asymmetricMatcher`):1267621,a=` `,o=(e,n,r,i,o,s)=>{let c=e.toString();return c===`ArrayContaining`||c===`ArrayNotContaining`?++i>n.maxDepth?`[`+c+`]`:c+a+`[`+(0,t.printListItems)(e.sample,n,r,i,o,s)+`]`:c===`ObjectContaining`||c===`ObjectNotContaining`?++i>n.maxDepth?`[`+c+`]`:c+a+`{`+(0,t.printObjectProperties)(e.sample,n,r,i,o,s)+`}`:c===`StringMatching`||c===`StringNotMatching`||c===`StringContaining`||c===`StringNotContaining`?c+a+s(e.sample,n,r,i,o):e.toAsymmetricMatcher()};e.serialize=o;var s=e=>e&&e.$$typeof===i;e.test=s,e.default={serialize:o,test:s}})),g=n(((e,t)=>{t.exports=({onlyFirst:e=!1}={})=>{let t=[`[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)`,`(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))`].join(`|`);return new RegExp(t,e?void 0:`g`)}})),_=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=r(g()),n=r(p());function r(e){return e&&e.__esModule?e:{default:e}}var i=e=>e.replace((0,t.default)(),e=>{switch(e){case n.default.red.close:case n.default.green.close:case n.default.cyan.close:case n.default.gray.close:case n.default.white.close:case n.default.yellow.close:case n.default.bgRed.close:case n.default.bgGreen.close:case n.default.bgYellow.close:case n.default.inverse.close:case n.default.dim.close:case n.default.bold.close:case n.default.reset.open:case n.default.reset.close:return`</>`;case n.default.red.open:return`<red>`;case n.default.green.open:return`<green>`;case n.default.cyan.open:return`<cyan>`;case n.default.gray.open:return`<gray>`;case n.default.white.open:return`<white>`;case n.default.yellow.open:return`<yellow>`;case n.default.bgRed.open:return`<bgRed>`;case n.default.bgGreen.open:return`<bgGreen>`;case n.default.bgYellow.open:return`<bgYellow>`;case n.default.inverse.open:return`<inverse>`;case n.default.dim.open:return`<dim>`;case n.default.bold.open:return`<bold>`;default:return``}}),a=e=>typeof e==`string`&&!!e.match((0,t.default)());e.test=a;var o=(e,t,n,r,a,o)=>o(i(e),t,n,r,a);e.serialize=o,e.default={serialize:o,test:a}})),v=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=m(),n=` `,r=[`DOMStringMap`,`NamedNodeMap`],i=/^(HTML\w*Collection|NodeList)$/,a=e=>r.indexOf(e)!==-1||i.test(e),o=e=>e&&e.constructor&&!!e.constructor.name&&a(e.constructor.name);e.test=o;var s=e=>e.constructor.name===`NamedNodeMap`,c=(e,i,a,o,c,l)=>{let u=e.constructor.name;return++o>i.maxDepth?`[`+u+`]`:(i.min?``:u+n)+(r.indexOf(u)===-1?`[`+(0,t.printListItems)(Array.from(e),i,a,o,c,l)+`]`:`{`+(0,t.printObjectProperties)(s(e)?Array.from(e).reduce((e,t)=>(e[t.name]=t.value,e),{}):{...e},i,a,o,c,l)+`}`)};e.serialize=c,e.default={serialize:c,test:o}})),y=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.default=t;function t(e){return e.replace(/</g,`&lt;`).replace(/>/g,`&gt;`)}})),b=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.printText=e.printProps=e.printElementAsLeaf=e.printElement=e.printComment=e.printChildren=void 0;var t=n(y());function n(e){return e&&e.__esModule?e:{default:e}}e.printProps=(e,t,n,r,i,a,o)=>{let s=r+n.indent,c=n.colors;return e.map(e=>{let l=t[e],u=o(l,n,s,i,a);return typeof l!=`string`&&(u.indexOf(`
+import{a as e,n as t,t as n}from"./chunk-BneVvdWh.js";import{t as r}from"./react-C7IZe2D1.js";import{t as i}from"./jsx-runtime-C2wGStra.js";import{n as a,t as o}from"./Button-DagS5hxP.js";import{n as s,t as c}from"./FormControl-C_Mh5dfi.js";import{n as l,t as u}from"./RatingInput-BNKHainW.js";import{n as d,t as f}from"./Switch-DyKTsO1c.js";var p=n(((e,t)=>{var n=10,r=(e=0)=>t=>`\u001B[${38+e};5;${t}m`,i=(e=0)=>(t,n,r)=>`\u001B[${38+e};2;${t};${n};${r}m`;function a(){let e=new Map,t={modifier:{reset:[0,0],bold:[1,22],dim:[2,22],italic:[3,23],underline:[4,24],overline:[53,55],inverse:[7,27],hidden:[8,28],strikethrough:[9,29]},color:{black:[30,39],red:[31,39],green:[32,39],yellow:[33,39],blue:[34,39],magenta:[35,39],cyan:[36,39],white:[37,39],blackBright:[90,39],redBright:[91,39],greenBright:[92,39],yellowBright:[93,39],blueBright:[94,39],magentaBright:[95,39],cyanBright:[96,39],whiteBright:[97,39]},bgColor:{bgBlack:[40,49],bgRed:[41,49],bgGreen:[42,49],bgYellow:[43,49],bgBlue:[44,49],bgMagenta:[45,49],bgCyan:[46,49],bgWhite:[47,49],bgBlackBright:[100,49],bgRedBright:[101,49],bgGreenBright:[102,49],bgYellowBright:[103,49],bgBlueBright:[104,49],bgMagentaBright:[105,49],bgCyanBright:[106,49],bgWhiteBright:[107,49]}};t.color.gray=t.color.blackBright,t.bgColor.bgGray=t.bgColor.bgBlackBright,t.color.grey=t.color.blackBright,t.bgColor.bgGrey=t.bgColor.bgBlackBright;for(let[n,r]of Object.entries(t)){for(let[n,i]of Object.entries(r))t[n]={open:`\u001B[${i[0]}m`,close:`\u001B[${i[1]}m`},r[n]=t[n],e.set(i[0],i[1]);Object.defineProperty(t,n,{value:r,enumerable:!1})}return Object.defineProperty(t,`codes`,{value:e,enumerable:!1}),t.color.close=`\x1B[39m`,t.bgColor.close=`\x1B[49m`,t.color.ansi256=r(),t.color.ansi16m=i(),t.bgColor.ansi256=r(n),t.bgColor.ansi16m=i(n),Object.defineProperties(t,{rgbToAnsi256:{value:(e,t,n)=>e===t&&t===n?e<8?16:e>248?231:Math.round((e-8)/247*24)+232:16+36*Math.round(e/255*5)+6*Math.round(t/255*5)+Math.round(n/255*5),enumerable:!1},hexToRgb:{value:e=>{let t=/(?<colorString>[a-f\d]{6}|[a-f\d]{3})/i.exec(e.toString(16));if(!t)return[0,0,0];let{colorString:n}=t.groups;n.length===3&&(n=n.split(``).map(e=>e+e).join(``));let r=Number.parseInt(n,16);return[r>>16&255,r>>8&255,r&255]},enumerable:!1},hexToAnsi256:{value:e=>t.rgbToAnsi256(...t.hexToRgb(e)),enumerable:!1}}),t}Object.defineProperty(t,`exports`,{enumerable:!0,get:a})})),m=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.printIteratorEntries=n,e.printIteratorValues=r,e.printListItems=i,e.printObjectProperties=a;var t=(e,t)=>{let n=Object.keys(e).sort(t);return Object.getOwnPropertySymbols&&Object.getOwnPropertySymbols(e).forEach(t=>{Object.getOwnPropertyDescriptor(e,t).enumerable&&n.push(t)}),n};function n(e,t,n,r,i,a,o=`: `){let s=``,c=e.next();if(!c.done){s+=t.spacingOuter;let l=n+t.indent;for(;!c.done;){let n=a(c.value[0],t,l,r,i),u=a(c.value[1],t,l,r,i);s+=l+n+o+u,c=e.next(),c.done?t.min||(s+=`,`):s+=`,`+t.spacingInner}s+=t.spacingOuter+n}return s}function r(e,t,n,r,i,a){let o=``,s=e.next();if(!s.done){o+=t.spacingOuter;let c=n+t.indent;for(;!s.done;)o+=c+a(s.value,t,c,r,i),s=e.next(),s.done?t.min||(o+=`,`):o+=`,`+t.spacingInner;o+=t.spacingOuter+n}return o}function i(e,t,n,r,i,a){let o=``;if(e.length){o+=t.spacingOuter;let s=n+t.indent;for(let n=0;n<e.length;n++)o+=s,n in e&&(o+=a(e[n],t,s,r,i)),n<e.length-1?o+=`,`+t.spacingInner:t.min||(o+=`,`);o+=t.spacingOuter+n}return o}function a(e,n,r,i,a,o){let s=``,c=t(e,n.compareKeys);if(c.length){s+=n.spacingOuter;let t=r+n.indent;for(let r=0;r<c.length;r++){let l=c[r],u=o(l,n,t,i,a),d=o(e[l],n,t,i,a);s+=t+u+`: `+d,r<c.length-1?s+=`,`+n.spacingInner:n.min||(s+=`,`)}s+=n.spacingOuter+r}return s}})),h=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=m(),n=(function(){return typeof globalThis<`u`?globalThis:n===void 0?typeof self<`u`?self:typeof window<`u`?window:Function(`return this`)():n})(),r=n[`jest-symbol-do-not-touch`]||n.Symbol,i=typeof r==`function`&&r.for?r.for(`jest.asymmetricMatcher`):1267621,a=` `,o=(e,n,r,i,o,s)=>{let c=e.toString();return c===`ArrayContaining`||c===`ArrayNotContaining`?++i>n.maxDepth?`[`+c+`]`:c+a+`[`+(0,t.printListItems)(e.sample,n,r,i,o,s)+`]`:c===`ObjectContaining`||c===`ObjectNotContaining`?++i>n.maxDepth?`[`+c+`]`:c+a+`{`+(0,t.printObjectProperties)(e.sample,n,r,i,o,s)+`}`:c===`StringMatching`||c===`StringNotMatching`||c===`StringContaining`||c===`StringNotContaining`?c+a+s(e.sample,n,r,i,o):e.toAsymmetricMatcher()};e.serialize=o;var s=e=>e&&e.$$typeof===i;e.test=s,e.default={serialize:o,test:s}})),g=n(((e,t)=>{t.exports=({onlyFirst:e=!1}={})=>{let t=[`[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)`,`(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))`].join(`|`);return new RegExp(t,e?void 0:`g`)}})),_=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=r(g()),n=r(p());function r(e){return e&&e.__esModule?e:{default:e}}var i=e=>e.replace((0,t.default)(),e=>{switch(e){case n.default.red.close:case n.default.green.close:case n.default.cyan.close:case n.default.gray.close:case n.default.white.close:case n.default.yellow.close:case n.default.bgRed.close:case n.default.bgGreen.close:case n.default.bgYellow.close:case n.default.inverse.close:case n.default.dim.close:case n.default.bold.close:case n.default.reset.open:case n.default.reset.close:return`</>`;case n.default.red.open:return`<red>`;case n.default.green.open:return`<green>`;case n.default.cyan.open:return`<cyan>`;case n.default.gray.open:return`<gray>`;case n.default.white.open:return`<white>`;case n.default.yellow.open:return`<yellow>`;case n.default.bgRed.open:return`<bgRed>`;case n.default.bgGreen.open:return`<bgGreen>`;case n.default.bgYellow.open:return`<bgYellow>`;case n.default.inverse.open:return`<inverse>`;case n.default.dim.open:return`<dim>`;case n.default.bold.open:return`<bold>`;default:return``}}),a=e=>typeof e==`string`&&!!e.match((0,t.default)());e.test=a;var o=(e,t,n,r,a,o)=>o(i(e),t,n,r,a);e.serialize=o,e.default={serialize:o,test:a}})),v=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=m(),n=` `,r=[`DOMStringMap`,`NamedNodeMap`],i=/^(HTML\w*Collection|NodeList)$/,a=e=>r.indexOf(e)!==-1||i.test(e),o=e=>e&&e.constructor&&!!e.constructor.name&&a(e.constructor.name);e.test=o;var s=e=>e.constructor.name===`NamedNodeMap`,c=(e,i,a,o,c,l)=>{let u=e.constructor.name;return++o>i.maxDepth?`[`+u+`]`:(i.min?``:u+n)+(r.indexOf(u)===-1?`[`+(0,t.printListItems)(Array.from(e),i,a,o,c,l)+`]`:`{`+(0,t.printObjectProperties)(s(e)?Array.from(e).reduce((e,t)=>(e[t.name]=t.value,e),{}):{...e},i,a,o,c,l)+`}`)};e.serialize=c,e.default={serialize:c,test:o}})),y=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.default=t;function t(e){return e.replace(/</g,`&lt;`).replace(/>/g,`&gt;`)}})),b=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.printText=e.printProps=e.printElementAsLeaf=e.printElement=e.printComment=e.printChildren=void 0;var t=n(y());function n(e){return e&&e.__esModule?e:{default:e}}e.printProps=(e,t,n,r,i,a,o)=>{let s=r+n.indent,c=n.colors;return e.map(e=>{let l=t[e],u=o(l,n,s,i,a);return typeof l!=`string`&&(u.indexOf(`
 `)!==-1&&(u=n.spacingOuter+s+u+n.spacingOuter+r),u=`{`+u+`}`),n.spacingInner+r+c.prop.open+e+c.prop.close+`=`+c.value.open+u+c.value.close}).join(``)},e.printChildren=(e,t,n,i,a,o)=>e.map(e=>t.spacingOuter+n+(typeof e==`string`?r(e,t):o(e,t,n,i,a))).join(``);var r=(e,n)=>{let r=n.colors.content;return r.open+(0,t.default)(e)+r.close};e.printText=r,e.printComment=(e,n)=>{let r=n.colors.comment;return r.open+`<!--`+(0,t.default)(e)+`-->`+r.close},e.printElement=(e,t,n,r,i)=>{let a=r.colors.tag;return a.open+`<`+e+(t&&a.close+t+r.spacingOuter+i+a.open)+(n?`>`+a.close+n+r.spacingOuter+i+a.open+`</`+e:(t&&!r.min?``:` `)+`/`)+`>`+a.close},e.printElementAsLeaf=(e,t)=>{let n=t.colors.tag;return n.open+`<`+e+n.close+` …`+n.open+` />`+n.close}})),x=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=b(),n=1,r=3,i=8,a=11,o=/^((HTML|SVG)\w*)?Element$/,s=e=>{try{return typeof e.hasAttribute==`function`&&e.hasAttribute(`is`)}catch{return!1}},c=e=>{let t=e.constructor.name,{nodeType:c,tagName:l}=e,u=typeof l==`string`&&l.includes(`-`)||s(e);return c===n&&(o.test(t)||u)||c===r&&t===`Text`||c===i&&t===`Comment`||c===a&&t===`DocumentFragment`},l=e=>e?.constructor?.name&&c(e);e.test=l;function u(e){return e.nodeType===r}function d(e){return e.nodeType===i}function f(e){return e.nodeType===a}var p=(e,n,r,i,a,o)=>{if(u(e))return(0,t.printText)(e.data,n);if(d(e))return(0,t.printComment)(e.data,n);let s=f(e)?`DocumentFragment`:e.tagName.toLowerCase();return++i>n.maxDepth?(0,t.printElementAsLeaf)(s,n):(0,t.printElement)(s,(0,t.printProps)(f(e)?[]:Array.from(e.attributes).map(e=>e.name).sort(),f(e)?{}:Array.from(e.attributes).reduce((e,t)=>(e[t.name]=t.value,e),{}),n,r+n.indent,i,a,o),(0,t.printChildren)(Array.prototype.slice.call(e.childNodes||e.children),n,r+n.indent,i,a,o),n,r)};e.serialize=p,e.default={serialize:p,test:l}})),ee=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=m(),n=`@@__IMMUTABLE_ITERABLE__@@`,r=`@@__IMMUTABLE_LIST__@@`,i=`@@__IMMUTABLE_KEYED__@@`,a=`@@__IMMUTABLE_MAP__@@`,o=`@@__IMMUTABLE_ORDERED__@@`,s=`@@__IMMUTABLE_RECORD__@@`,c=`@@__IMMUTABLE_SEQ__@@`,l=`@@__IMMUTABLE_SET__@@`,u=`@@__IMMUTABLE_STACK__@@`,d=e=>`Immutable.`+e,f=e=>`[`+e+`]`,p=` `,h=`…`,g=(e,n,r,i,a,o,s)=>++i>n.maxDepth?f(d(s)):d(s)+p+`{`+(0,t.printIteratorEntries)(e.entries(),n,r,i,a,o)+`}`;function _(e){let t=0;return{next(){if(t<e._keys.length){let n=e._keys[t++];return{done:!1,value:[n,e.get(n)]}}return{done:!0,value:void 0}}}}var v=(e,n,r,i,a,o)=>{let s=d(e._name||`Record`);return++i>n.maxDepth?f(s):s+p+`{`+(0,t.printIteratorEntries)(_(e),n,r,i,a,o)+`}`},y=(e,n,r,a,o,s)=>{let c=d(`Seq`);return++a>n.maxDepth?f(c):e[i]?c+p+`{`+(e._iter||e._object?(0,t.printIteratorEntries)(e.entries(),n,r,a,o,s):h)+`}`:c+p+`[`+(e._iter||e._array||e._collection||e._iterable?(0,t.printIteratorValues)(e.values(),n,r,a,o,s):h)+`]`},b=(e,n,r,i,a,o,s)=>++i>n.maxDepth?f(d(s)):d(s)+p+`[`+(0,t.printIteratorValues)(e.values(),n,r,i,a,o)+`]`,x=(e,t,n,i,s,d)=>e[a]?g(e,t,n,i,s,d,e[o]?`OrderedMap`:`Map`):e[r]?b(e,t,n,i,s,d,`List`):e[l]?b(e,t,n,i,s,d,e[o]?`OrderedSet`:`Set`):e[u]?b(e,t,n,i,s,d,`Stack`):e[c]?y(e,t,n,i,s,d):v(e,t,n,i,s,d);e.serialize=x;var ee=e=>e&&(e[n]===!0||e[s]===!0);e.test=ee,e.default={serialize:x,test:ee}})),te=n((e=>{var t=60103,n=60106,r=60107,i=60108,a=60114,o=60109,s=60110,c=60112,l=60113,u=60120,d=60115,f=60116,p=60121,m=60122,h=60117,g=60129,_=60131;if(typeof Symbol==`function`&&Symbol.for){var v=Symbol.for;t=v(`react.element`),n=v(`react.portal`),r=v(`react.fragment`),i=v(`react.strict_mode`),a=v(`react.profiler`),o=v(`react.provider`),s=v(`react.context`),c=v(`react.forward_ref`),l=v(`react.suspense`),u=v(`react.suspense_list`),d=v(`react.memo`),f=v(`react.lazy`),p=v(`react.block`),m=v(`react.server.block`),h=v(`react.fundamental`),g=v(`react.debug_trace_mode`),_=v(`react.legacy_hidden`)}function y(e){if(typeof e==`object`&&e){var p=e.$$typeof;switch(p){case t:switch(e=e.type,e){case r:case a:case i:case l:case u:return e;default:switch(e&&=e.$$typeof,e){case s:case c:case f:case d:case o:return e;default:return p}}case n:return p}}}var b=o,x=t,ee=c,te=r,ne=f,re=d,ie=n,ae=a,S=i,oe=l;e.ContextConsumer=s,e.ContextProvider=b,e.Element=x,e.ForwardRef=ee,e.Fragment=te,e.Lazy=ne,e.Memo=re,e.Portal=ie,e.Profiler=ae,e.StrictMode=S,e.Suspense=oe,e.isAsyncMode=function(){return!1},e.isConcurrentMode=function(){return!1},e.isContextConsumer=function(e){return y(e)===s},e.isContextProvider=function(e){return y(e)===o},e.isElement=function(e){return typeof e==`object`&&!!e&&e.$$typeof===t},e.isForwardRef=function(e){return y(e)===c},e.isFragment=function(e){return y(e)===r},e.isLazy=function(e){return y(e)===f},e.isMemo=function(e){return y(e)===d},e.isPortal=function(e){return y(e)===n},e.isProfiler=function(e){return y(e)===a},e.isStrictMode=function(e){return y(e)===i},e.isSuspense=function(e){return y(e)===l},e.isValidElementType=function(e){return!!(typeof e==`string`||typeof e==`function`||e===r||e===a||e===g||e===i||e===l||e===u||e===_||typeof e==`object`&&e&&(e.$$typeof===f||e.$$typeof===d||e.$$typeof===o||e.$$typeof===s||e.$$typeof===c||e.$$typeof===h||e.$$typeof===p||e[0]===m))},e.typeOf=y})),ne=n(((e,t)=>{t.exports=te()})),re=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=i(ne()),n=b();function r(e){if(typeof WeakMap!=`function`)return null;var t=new WeakMap,n=new WeakMap;return(r=function(e){return e?n:t})(e)}function i(e,t){if(!t&&e&&e.__esModule)return e;if(e===null||typeof e!=`object`&&typeof e!=`function`)return{default:e};var n=r(t);if(n&&n.has(e))return n.get(e);var i={},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var o in e)if(o!==`default`&&Object.prototype.hasOwnProperty.call(e,o)){var s=a?Object.getOwnPropertyDescriptor(e,o):null;s&&(s.get||s.set)?Object.defineProperty(i,o,s):i[o]=e[o]}return i.default=e,n&&n.set(e,i),i}var a=(e,t=[])=>(Array.isArray(e)?e.forEach(e=>{a(e,t)}):e!=null&&e!==!1&&t.push(e),t),o=e=>{let n=e.type;if(typeof n==`string`)return n;if(typeof n==`function`)return n.displayName||n.name||`Unknown`;if(t.isFragment(e))return`React.Fragment`;if(t.isSuspense(e))return`React.Suspense`;if(typeof n==`object`&&n){if(t.isContextProvider(e))return`Context.Provider`;if(t.isContextConsumer(e))return`Context.Consumer`;if(t.isForwardRef(e)){if(n.displayName)return n.displayName;let e=n.render.displayName||n.render.name||``;return e===``?`ForwardRef`:`ForwardRef(`+e+`)`}if(t.isMemo(e)){let e=n.displayName||n.type.displayName||n.type.name||``;return e===``?`Memo`:`Memo(`+e+`)`}}return`UNDEFINED`},s=e=>{let{props:t}=e;return Object.keys(t).filter(e=>e!==`children`&&t[e]!==void 0).sort()},c=(e,t,r,i,c,l)=>++i>t.maxDepth?(0,n.printElementAsLeaf)(o(e),t):(0,n.printElement)(o(e),(0,n.printProps)(s(e),e.props,t,r+t.indent,i,c,l),(0,n.printChildren)(a(e.props.children),t,r+t.indent,i,c,l),t,r);e.serialize=c;var l=e=>e!=null&&t.isElement(e);e.test=l,e.default={serialize:c,test:l}})),ie=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.test=e.serialize=e.default=void 0;var t=b(),n=(function(){return typeof globalThis<`u`?globalThis:n===void 0?typeof self<`u`?self:typeof window<`u`?window:Function(`return this`)():n})(),r=n[`jest-symbol-do-not-touch`]||n.Symbol,i=typeof r==`function`&&r.for?r.for(`react.test.json`):245830487,a=e=>{let{props:t}=e;return t?Object.keys(t).filter(e=>t[e]!==void 0).sort():[]},o=(e,n,r,i,o,s)=>++i>n.maxDepth?(0,t.printElementAsLeaf)(e.type,n):(0,t.printElement)(e.type,e.props?(0,t.printProps)(a(e),e.props,n,r+n.indent,i,o,s):``,e.children?(0,t.printChildren)(e.children,n,r+n.indent,i,o,s):``,n,r);e.serialize=o;var s=e=>e&&e.$$typeof===i;e.test=s,e.default={serialize:o,test:s}})),ae=n((e=>{Object.defineProperty(e,`__esModule`,{value:!0}),e.default=e.DEFAULT_OPTIONS=void 0,e.format=we,e.plugins=void 0;var t=u(p()),n=m(),r=u(h()),i=u(_()),a=u(v()),o=u(x()),s=u(ee()),c=u(re()),l=u(ie());function u(e){return e&&e.__esModule?e:{default:e}}var d=Object.prototype.toString,f=Date.prototype.toISOString,g=Error.prototype.toString,y=RegExp.prototype.toString,b=e=>typeof e.constructor==`function`&&e.constructor.name||`Object`,te=e=>typeof window<`u`&&e===window,ne=/^Symbol\((.*)\)(.*)$/,ae=/\n/gi,S=class extends Error{constructor(e,t){super(e),this.stack=t,this.name=this.constructor.name}};function oe(e){return e===`[object Array]`||e===`[object ArrayBuffer]`||e===`[object DataView]`||e===`[object Float32Array]`||e===`[object Float64Array]`||e===`[object Int8Array]`||e===`[object Int16Array]`||e===`[object Int32Array]`||e===`[object Uint8Array]`||e===`[object Uint8ClampedArray]`||e===`[object Uint16Array]`||e===`[object Uint32Array]`}function se(e){return Object.is(e,-0)?`-0`:String(e)}function C(e){return String(`${e}n`)}function ce(e,t){return t?`[Function `+(e.name||`anonymous`)+`]`:`[Function]`}function le(e){return String(e).replace(ne,`Symbol($1)`)}function ue(e){return`[`+g.call(e)+`]`}function w(e,t,n,r){if(e===!0||e===!1)return``+e;if(e===void 0)return`undefined`;if(e===null)return`null`;let i=typeof e;if(i===`number`)return se(e);if(i===`bigint`)return C(e);if(i===`string`)return r?`"`+e.replace(/"|\\/g,`\\$&`)+`"`:`"`+e+`"`;if(i===`function`)return ce(e,t);if(i===`symbol`)return le(e);let a=d.call(e);return a===`[object WeakMap]`?`WeakMap {}`:a===`[object WeakSet]`?`WeakSet {}`:a===`[object Function]`||a===`[object GeneratorFunction]`?ce(e,t):a===`[object Symbol]`?le(e):a===`[object Date]`?isNaN(+e)?`Date { NaN }`:f.call(e):a===`[object Error]`?ue(e):a===`[object RegExp]`?n?y.call(e).replace(/[\\^$*+?.()|[\]{}]/g,`\\$&`):y.call(e):e instanceof Error?ue(e):null}function de(e,t,r,i,a,o){if(a.indexOf(e)!==-1)return`[Circular]`;a=a.slice(),a.push(e);let s=++i>t.maxDepth,c=t.min;if(t.callToJSON&&!s&&e.toJSON&&typeof e.toJSON==`function`&&!o)return T(e.toJSON(),t,r,i,a,!0);let l=d.call(e);return l===`[object Arguments]`?s?`[Arguments]`:(c?``:`Arguments `)+`[`+(0,n.printListItems)(e,t,r,i,a,T)+`]`:oe(l)?s?`[`+e.constructor.name+`]`:(c||!t.printBasicPrototype&&e.constructor.name===`Array`?``:e.constructor.name+` `)+`[`+(0,n.printListItems)(e,t,r,i,a,T)+`]`:l===`[object Map]`?s?`[Map]`:`Map {`+(0,n.printIteratorEntries)(e.entries(),t,r,i,a,T,` => `)+`}`:l===`[object Set]`?s?`[Set]`:`Set {`+(0,n.printIteratorValues)(e.values(),t,r,i,a,T)+`}`:s||te(e)?`[`+b(e)+`]`:(c||!t.printBasicPrototype&&b(e)===`Object`?``:b(e)+` `)+`{`+(0,n.printObjectProperties)(e,t,r,i,a,T)+`}`}function fe(e){return e.serialize!=null}function pe(e,t,n,r,i,a){let o;try{o=fe(e)?e.serialize(t,n,r,i,a,T):e.print(t,e=>T(e,n,r,i,a),e=>{let t=r+n.indent;return t+e.replace(ae,`
 `+t)},{edgeSpacing:n.spacingOuter,min:n.min,spacing:n.spacingInner},n.colors)}catch(e){throw new S(e.message,e.stack)}if(typeof o!=`string`)throw Error(`pretty-format: Plugin must return type "string" but instead returned "${typeof o}".`);return o}function me(e,t){for(let n=0;n<e.length;n++)try{if(e[n].test(t))return e[n]}catch(e){throw new S(e.message,e.stack)}return null}function T(e,t,n,r,i,a){let o=me(t.plugins,e);if(o!==null)return pe(o,e,t,n,r,i);let s=w(e,t.printFunctionName,t.escapeRegex,t.escapeString);return s===null?de(e,t,n,r,i,a):s}var he={comment:`gray`,content:`reset`,prop:`yellow`,tag:`cyan`,value:`green`},ge=Object.keys(he),E={callToJSON:!0,compareKeys:void 0,escapeRegex:!1,escapeString:!0,highlight:!1,indent:2,maxDepth:1/0,min:!1,plugins:[],printBasicPrototype:!0,printFunctionName:!0,theme:he};e.DEFAULT_OPTIONS=E;function _e(e){if(Object.keys(e).forEach(e=>{if(!E.hasOwnProperty(e))throw Error(`pretty-format: Unknown option "${e}".`)}),e.min&&e.indent!==void 0&&e.indent!==0)throw Error(`pretty-format: Options "min" and "indent" cannot be used together.`);if(e.theme!==void 0){if(e.theme===null)throw Error(`pretty-format: Option "theme" must not be null.`);if(typeof e.theme!=`object`)throw Error(`pretty-format: Option "theme" must be of type "object" but instead received "${typeof e.theme}".`)}}var D=e=>ge.reduce((n,r)=>{let i=e.theme&&e.theme[r]!==void 0?e.theme[r]:he[r],a=i&&t.default[i];if(a&&typeof a.close==`string`&&typeof a.open==`string`)n[r]=a;else throw Error(`pretty-format: Option "theme" has a key "${r}" whose value "${i}" is undefined in ansi-styles.`);return n},Object.create(null)),ve=()=>ge.reduce((e,t)=>(e[t]={close:``,open:``},e),Object.create(null)),ye=e=>e&&e.printFunctionName!==void 0?e.printFunctionName:E.printFunctionName,be=e=>e&&e.escapeRegex!==void 0?e.escapeRegex:E.escapeRegex,xe=e=>e&&e.escapeString!==void 0?e.escapeString:E.escapeString,Se=e=>({callToJSON:e&&e.callToJSON!==void 0?e.callToJSON:E.callToJSON,colors:e&&e.highlight?D(e):ve(),compareKeys:e&&typeof e.compareKeys==`function`?e.compareKeys:E.compareKeys,escapeRegex:be(e),escapeString:xe(e),indent:e&&e.min?``:Ce(e&&e.indent!==void 0?e.indent:E.indent),maxDepth:e&&e.maxDepth!==void 0?e.maxDepth:E.maxDepth,min:e&&e.min!==void 0?e.min:E.min,plugins:e&&e.plugins!==void 0?e.plugins:E.plugins,printBasicPrototype:e?.printBasicPrototype??!0,printFunctionName:ye(e),spacingInner:e&&e.min?` `:`
 `,spacingOuter:e&&e.min?``:`
@@ -55,7 +55,13 @@ Unable to find an `+(r===!1?`accessible `:``)+`element with the role "`+t+`"`+c+
 
 `+s).trim()},ts=B(Zo,Zo.name,`queryAll`),[ns,rs,is,as,os]=L(Zo,$o,es),ss=()=>M().testIdAttribute,cs=function(){var e=[...arguments];return j(e[0]),ra(ss(),...e)},ls=(e,t)=>`Found multiple elements by: [`+ss()+`="`+t+`"]`,us=(e,t)=>`Unable to find an element by: [`+ss()+`="`+t+`"]`,ds=B(cs,cs.name,`queryAll`),[fs,ps,ms,hs,gs]=L(cs,ls,us),_s=Object.freeze({__proto__:null,queryAllByLabelText:no,queryByLabelText:Xa,getAllByLabelText:eo,getByLabelText:to,findAllByLabelText:Qa,findByLabelText:$a,queryByPlaceholderText:so,queryAllByPlaceholderText:oo,getByPlaceholderText:lo,getAllByPlaceholderText:co,findAllByPlaceholderText:uo,findByPlaceholderText:fo,queryByText:_o,queryAllByText:go,getByText:yo,getAllByText:vo,findAllByText:bo,findByText:xo,queryByDisplayValue:Eo,queryAllByDisplayValue:To,getByDisplayValue:Oo,getAllByDisplayValue:Do,findAllByDisplayValue:ko,findByDisplayValue:Ao,queryByAltText:Io,queryAllByAltText:Fo,getByAltText:Ro,getAllByAltText:Lo,findAllByAltText:zo,findByAltText:Bo,queryByTitle:Ko,queryAllByTitle:Go,getByTitle:Jo,getAllByTitle:qo,findAllByTitle:Yo,findByTitle:Xo,queryByRole:ns,queryAllByRole:ts,getAllByRole:rs,getByRole:is,findAllByRole:as,findByRole:os,queryByTestId:fs,queryAllByTestId:ds,getByTestId:ms,getAllByTestId:ps,findAllByTestId:hs,findByTestId:gs}),vs={copy:{EventType:`ClipboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},cut:{EventType:`ClipboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},paste:{EventType:`ClipboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},compositionEnd:{EventType:`CompositionEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},compositionStart:{EventType:`CompositionEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},compositionUpdate:{EventType:`CompositionEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},keyDown:{EventType:`KeyboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,charCode:0,composed:!0}},keyPress:{EventType:`KeyboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,charCode:0,composed:!0}},keyUp:{EventType:`KeyboardEvent`,defaultInit:{bubbles:!0,cancelable:!0,charCode:0,composed:!0}},focus:{EventType:`FocusEvent`,defaultInit:{bubbles:!1,cancelable:!1,composed:!0}},blur:{EventType:`FocusEvent`,defaultInit:{bubbles:!1,cancelable:!1,composed:!0}},focusIn:{EventType:`FocusEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},focusOut:{EventType:`FocusEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},change:{EventType:`Event`,defaultInit:{bubbles:!0,cancelable:!1}},input:{EventType:`InputEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},invalid:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!0}},submit:{EventType:`Event`,defaultInit:{bubbles:!0,cancelable:!0}},reset:{EventType:`Event`,defaultInit:{bubbles:!0,cancelable:!0}},click:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,button:0,composed:!0}},contextMenu:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},dblClick:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},drag:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},dragEnd:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},dragEnter:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},dragExit:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},dragLeave:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},dragOver:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},dragStart:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},drop:{EventType:`DragEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},mouseDown:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},mouseEnter:{EventType:`MouseEvent`,defaultInit:{bubbles:!1,cancelable:!1,composed:!0}},mouseLeave:{EventType:`MouseEvent`,defaultInit:{bubbles:!1,cancelable:!1,composed:!0}},mouseMove:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},mouseOut:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},mouseOver:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},mouseUp:{EventType:`MouseEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},select:{EventType:`Event`,defaultInit:{bubbles:!0,cancelable:!1}},touchCancel:{EventType:`TouchEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},touchEnd:{EventType:`TouchEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},touchMove:{EventType:`TouchEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},touchStart:{EventType:`TouchEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},resize:{EventType:`UIEvent`,defaultInit:{bubbles:!1,cancelable:!1}},scroll:{EventType:`UIEvent`,defaultInit:{bubbles:!1,cancelable:!1}},wheel:{EventType:`WheelEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},abort:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},canPlay:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},canPlayThrough:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},durationChange:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},emptied:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},encrypted:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},ended:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},loadedData:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},loadedMetadata:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},loadStart:{EventType:`ProgressEvent`,defaultInit:{bubbles:!1,cancelable:!1}},pause:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},play:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},playing:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},progress:{EventType:`ProgressEvent`,defaultInit:{bubbles:!1,cancelable:!1}},rateChange:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},seeked:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},seeking:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},stalled:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},suspend:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},timeUpdate:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},volumeChange:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},waiting:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},load:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},error:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},animationStart:{EventType:`AnimationEvent`,defaultInit:{bubbles:!0,cancelable:!1}},animationEnd:{EventType:`AnimationEvent`,defaultInit:{bubbles:!0,cancelable:!1}},animationIteration:{EventType:`AnimationEvent`,defaultInit:{bubbles:!0,cancelable:!1}},transitionCancel:{EventType:`TransitionEvent`,defaultInit:{bubbles:!0,cancelable:!1}},transitionEnd:{EventType:`TransitionEvent`,defaultInit:{bubbles:!0,cancelable:!0}},transitionRun:{EventType:`TransitionEvent`,defaultInit:{bubbles:!0,cancelable:!1}},transitionStart:{EventType:`TransitionEvent`,defaultInit:{bubbles:!0,cancelable:!1}},pointerOver:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},pointerEnter:{EventType:`PointerEvent`,defaultInit:{bubbles:!1,cancelable:!1}},pointerDown:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},pointerMove:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},pointerUp:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},pointerCancel:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},pointerOut:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!0,composed:!0}},pointerLeave:{EventType:`PointerEvent`,defaultInit:{bubbles:!1,cancelable:!1}},gotPointerCapture:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},lostPointerCapture:{EventType:`PointerEvent`,defaultInit:{bubbles:!0,cancelable:!1,composed:!0}},popState:{EventType:`PopStateEvent`,defaultInit:{bubbles:!0,cancelable:!1}},offline:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},online:{EventType:`Event`,defaultInit:{bubbles:!1,cancelable:!1}},pageHide:{EventType:`PageTransitionEvent`,defaultInit:{bubbles:!0,cancelable:!0}},pageShow:{EventType:`PageTransitionEvent`,defaultInit:{bubbles:!0,cancelable:!0}}},ys={doubleClick:`dblClick`},Object.keys(vs).forEach(e=>{let{EventType:t,defaultInit:n}=vs[e],r=e.toLowerCase();pa[e]=(e,i)=>pa(r,e,i,{EventType:t,defaultInit:n}),fa[e]=(t,n)=>fa(t,pa[e](t,n))}),Object.keys(ys).forEach(e=>{let t=ys[e];fa[e]=function(){return fa[t](...arguments)}}),bs=(e,t,n)=>Array.isArray(e)?e.forEach(e=>Ha(e,t,n)):Ha(e,t,n),xs=function(e){if(e===void 0&&(e=gi().body),!e||!(`innerHTML`in e)){console.log(`The element you're providing isn't a valid DOM element.`);return}if(!e.innerHTML){console.log(`The provided element doesn't have any children.`);return}let t=_a(e.innerHTML);return console.log(`Open this URL in your browser
 
-`+t),t},Ss={debug:bs,logTestingPlaygroundURL:xs},typeof document<`u`&&document.body?da(document.body,_s,Ss):Object.keys(_s).reduce((e,t)=>(e[t]=()=>{throw TypeError(`For queries bound to document.body a global document has to be available... Learn more: https://testing-library.com/s/screen-global-error`)},e),Ss)}));async function H({value:e,rating:t}){await fa.change(t,{target:{value:e}})}var U,W,ws,G,K,Ts,Es,q,Ds,Os,J,Y,X,Z,ks,Q,$,As,js=t((()=>{U=e(r(),1),Cs(),l(),a(),s(),d(),W=i(),{action:ws}=__STORYBOOK_MODULE_ACTIONS__,{userEvent:G,expect:K,fn:Ts}=__STORYBOOK_MODULE_TEST__,Es={title:`components/Rating/RatingInput`,component:u,args:{onBlur:ws(`onCheckedChange`),onFocus:ws(`onCheckedChange`),onChange:ws(`onChange`),onValueChange:ws(`onCheckedChange`)},excludeStories:/setRating/},q={render:function(){return(0,W.jsx)(`div`,{style:{display:`flex`,gap:`16px`},children:(0,W.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,W.jsxs)(`tbody`,{children:[(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`default`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hover`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,dsInternalSimulation:`hover`})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`focus`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,dsInternalSimulation:`focus`})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError+hover`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0,dsInternalSimulation:`hover`})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError+focus`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0,dsInternalSimulation:`focus`})})]})]})})})}},Ds={args:{onValueChange:Ts()},render:function(e){return(0,W.jsx)(u,{onValueChange:e.onValueChange,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(r).toHaveValue(`0`),K(n.onValueChange).not.toBeCalled()}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:3,rating:r}),K(r).toHaveValue(`3`),K(n.onValueChange).toBeCalledWith(3)})}},Os={render:function(){let[e,t]=(0,U.useState)(0);return(0,W.jsx)(u,{value:e,onValueChange:t,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(n).toHaveValue(`0`)}),await t(`The input field has the correct value`,async()=>{await H({value:3,rating:n}),K(n).toHaveValue(`3`)})}},J={render:function(){return(0,W.jsx)(u,{"aria-label":`Lesson rating`})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{K(n).toHaveAttribute(`aria-valuetext`,`0 out of 5`)}),await t(`The aria attributes are updated`,async()=>{await H({value:3,rating:n}),K(n).toHaveAttribute(`aria-valuetext`,`3 out of 5`)})}},Y={render:function(){let[e,t]=(0,U.useState)(!1),[n,r]=(0,U.useState)(0);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(c,{label:`Lesson rating`,error:e&&`Rating is mandatory`,required:!0,children:(0,W.jsx)(u,{value:n,onValueChange:r})}),(0,W.jsx)(o,{onClick:()=>t(n===0),children:`Submit`})]})},play:async({canvas:e,step:t})=>{let n=await e.findByLabelText(`Lesson rating`),r=await e.findByRole(`button`,{name:/Submit/});await t(`Initial state`,async()=>{K(n).not.toHaveAttribute(`aria-invalid`),K(n).toHaveAttribute(`aria-required`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Rate`,async()=>{await H({rating:n,value:5}),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).not.toHaveAttribute(`aria-invalid`)})}},X={render:function(){let[e,t]=(0,U.useState)(!1),[n,r]=(0,U.useState)(0);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(u,{value:n,onValueChange:r,hasError:e,required:!0,"aria-label":`Lesson rating`}),(0,W.jsx)(o,{onClick:()=>t(n===0),children:`Submit`})]})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/}),r=await e.findByRole(`button`,{name:/Submit/});await t(`Initial state`,async()=>{K(n).not.toHaveAttribute(`aria-invalid`),K(n).toHaveAttribute(`aria-required`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Rate`,async()=>{await H({rating:n,value:5}),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).not.toHaveAttribute(`aria-invalid`)})}},Z={args:{onValueChange:Ts()},render:function(){return(0,W.jsx)(u,{value:2.5,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state (which does not include half values)`,async()=>{await K(r).toHaveValue(`3`),K(n.onValueChange).not.toBeCalled()})}},ks={args:{onValueChange:Ts()},render:function(){return(0,W.jsx)(u,{value:1,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(r).toHaveValue(`1`),K(n.onValueChange).not.toBeCalled()}),await t(`Hover the element`,async()=>{let e=r.getBoundingClientRect();await fa.mouseMove(r,{clientX:e.left+e.width/2,clientY:e.top}),K(n.onValueChange).not.toBeCalled()})}},Q={args:{onValueChange:Ts()},render:function(e){let[t,n]=(0,U.useState)(!1);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(u,{onValueChange:e.onValueChange,onChange:e=>{t&&e.preventDefault()},"aria-label":`Lesson rating`}),(0,W.jsx)(c,{label:`Toggle cancel change event`,required:!0,children:(0,W.jsx)(f,{onCheckedChange:n})})]})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`switch`,{name:/Toggle cancel change event/}),i=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(i).toHaveValue(`0`),K(n.onValueChange).not.toBeCalled()}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:3,rating:i}),K(n.onValueChange).toBeCalledWith(3),K(n.onValueChange).toBeCalledTimes(1)}),await t(`prevent change event`,async()=>{await G.click(r)}),await t(`change rating is ineffective`,async()=>{await H({value:2,rating:i}),K(i).toHaveValue(`3`),K(n.onValueChange).toBeCalledTimes(1)}),await t(`stop preventing change event`,async()=>{await G.click(r)}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:4,rating:i}),K(i).toHaveValue(`4`),K(n.onValueChange).toBeCalledWith(3),K(n.onValueChange).toBeCalledTimes(2)})}},$={parameters:{chromatic:{disableSnapshot:!0}},args:{"aria-label":`Lesson rating`},argTypes:{id:{control:`text`},name:{control:`text`},dataset:{control:`object`},value:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},defaultValue:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},hasError:{control:`boolean`},required:{control:`boolean`},"aria-label":{control:`text`},"aria-labelledby":{control:`text`},"aria-describedby":{control:`text`}}},q.parameters={...q.parameters,docs:{...q.parameters?.docs,source:{originalSource:`{
+`+t),t},Ss={debug:bs,logTestingPlaygroundURL:xs},typeof document<`u`&&document.body?da(document.body,_s,Ss):Object.keys(_s).reduce((e,t)=>(e[t]=()=>{throw TypeError(`For queries bound to document.body a global document has to be available... Learn more: https://testing-library.com/s/screen-global-error`)},e),Ss)}));async function H({value:e,rating:t}){await fa.change(t,{target:{value:e}})}var U,W,ws,G,K,Ts,Es,q,Ds,Os,J,Y,X,Z,ks,Q,$,As,js=t((()=>{U=e(r(),1),Cs(),l(),a(),s(),d(),W=i(),{action:ws}=__STORYBOOK_MODULE_ACTIONS__,{userEvent:G,expect:K,fn:Ts}=__STORYBOOK_MODULE_TEST__,Es={title:`components/Rating/RatingInput`,component:u,args:{onBlur:ws(`onCheckedChange`),onFocus:ws(`onCheckedChange`),onChange:ws(`onChange`),onValueChange:ws(`onCheckedChange`)},excludeStories:/setRating/},q={parameters:{pseudo:{hover:`[data-hover="true"]`,focusVisible:`[data-focus="true"] input`}},render:function(){return(0,W.jsx)(`div`,{style:{display:`flex`,gap:`16px`},children:(0,W.jsx)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:(0,W.jsxs)(`tbody`,{children:[(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`default`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hover`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,dataset:{hover:!0}})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`focus`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,dataset:{focus:!0}})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError+hover`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0,dataset:{hover:!0}})})]}),(0,W.jsxs)(`tr`,{children:[(0,W.jsx)(`td`,{children:`hasError+focus`}),(0,W.jsx)(`td`,{children:(0,W.jsx)(u,{"aria-label":`Lesson rating`,value:2.5,hasError:!0,dataset:{focus:!0}})})]})]})})})}},Ds={args:{onValueChange:Ts()},render:function(e){return(0,W.jsx)(u,{onValueChange:e.onValueChange,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(r).toHaveValue(`0`),K(n.onValueChange).not.toBeCalled()}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:3,rating:r}),K(r).toHaveValue(`3`),K(n.onValueChange).toBeCalledWith(3)})}},Os={render:function(){let[e,t]=(0,U.useState)(0);return(0,W.jsx)(u,{value:e,onValueChange:t,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(n).toHaveValue(`0`)}),await t(`The input field has the correct value`,async()=>{await H({value:3,rating:n}),K(n).toHaveValue(`3`)})}},J={render:function(){return(0,W.jsx)(u,{"aria-label":`Lesson rating`})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{K(n).toHaveAttribute(`aria-valuetext`,`0 out of 5`)}),await t(`The aria attributes are updated`,async()=>{await H({value:3,rating:n}),K(n).toHaveAttribute(`aria-valuetext`,`3 out of 5`)})}},Y={render:function(){let[e,t]=(0,U.useState)(!1),[n,r]=(0,U.useState)(0);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(c,{label:`Lesson rating`,error:e&&`Rating is mandatory`,required:!0,children:(0,W.jsx)(u,{value:n,onValueChange:r})}),(0,W.jsx)(o,{onClick:()=>t(n===0),children:`Submit`})]})},play:async({canvas:e,step:t})=>{let n=await e.findByLabelText(`Lesson rating`),r=await e.findByRole(`button`,{name:/Submit/});await t(`Initial state`,async()=>{K(n).not.toHaveAttribute(`aria-invalid`),K(n).toHaveAttribute(`aria-required`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Rate`,async()=>{await H({rating:n,value:5}),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).not.toHaveAttribute(`aria-invalid`)})}},X={render:function(){let[e,t]=(0,U.useState)(!1),[n,r]=(0,U.useState)(0);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(u,{value:n,onValueChange:r,hasError:e,required:!0,"aria-label":`Lesson rating`}),(0,W.jsx)(o,{onClick:()=>t(n===0),children:`Submit`})]})},play:async({canvas:e,step:t})=>{let n=await e.findByRole(`slider`,{name:/Lesson rating/}),r=await e.findByRole(`button`,{name:/Submit/});await t(`Initial state`,async()=>{K(n).not.toHaveAttribute(`aria-invalid`),K(n).toHaveAttribute(`aria-required`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Rate`,async()=>{await H({rating:n,value:5}),K(n).toHaveAttribute(`aria-invalid`,`true`)}),await t(`Submit`,async()=>{await G.click(r),K(n).not.toHaveAttribute(`aria-invalid`)})}},Z={args:{onValueChange:Ts()},render:function(){return(0,W.jsx)(u,{value:2.5,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state (which does not include half values)`,async()=>{await K(r).toHaveValue(`3`),K(n.onValueChange).not.toBeCalled()})}},ks={args:{onValueChange:Ts()},render:function(){return(0,W.jsx)(u,{value:1,"aria-label":`Lesson rating`})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(r).toHaveValue(`1`),K(n.onValueChange).not.toBeCalled()}),await t(`Hover the element`,async()=>{let e=r.getBoundingClientRect();await fa.mouseMove(r,{clientX:e.left+e.width/2,clientY:e.top}),K(n.onValueChange).not.toBeCalled()})}},Q={args:{onValueChange:Ts()},render:function(e){let[t,n]=(0,U.useState)(!1);return(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(u,{onValueChange:e.onValueChange,onChange:e=>{t&&e.preventDefault()},"aria-label":`Lesson rating`}),(0,W.jsx)(c,{label:`Toggle cancel change event`,required:!0,children:(0,W.jsx)(f,{onCheckedChange:n})})]})},play:async({canvas:e,step:t,args:n})=>{let r=await e.findByRole(`switch`,{name:/Toggle cancel change event/}),i=await e.findByRole(`slider`,{name:/Lesson rating/});await t(`Initial state`,async()=>{await K(i).toHaveValue(`0`),K(n.onValueChange).not.toBeCalled()}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:3,rating:i}),K(n.onValueChange).toBeCalledWith(3),K(n.onValueChange).toBeCalledTimes(1)}),await t(`prevent change event`,async()=>{await G.click(r)}),await t(`change rating is ineffective`,async()=>{await H({value:2,rating:i}),K(i).toHaveValue(`3`),K(n.onValueChange).toBeCalledTimes(1)}),await t(`stop preventing change event`,async()=>{await G.click(r)}),await t(`onValueChange is called with the correct value`,async()=>{await H({value:4,rating:i}),K(i).toHaveValue(`4`),K(n.onValueChange).toBeCalledWith(3),K(n.onValueChange).toBeCalledTimes(2)})}},$={parameters:{chromatic:{disableSnapshot:!0}},args:{"aria-label":`Lesson rating`},argTypes:{id:{control:`text`},name:{control:`text`},dataset:{control:`object`},value:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},defaultValue:{control:`select`,options:[0,.5,1,1.5,2,2.5,3,3.5,4,4.5,5]},hasError:{control:`boolean`},required:{control:`boolean`},"aria-label":{control:`text`},"aria-labelledby":{control:`text`},"aria-describedby":{control:`text`}}},q.parameters={...q.parameters,docs:{...q.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    pseudo: {
+      hover: '[data-hover="true"]',
+      focusVisible: '[data-focus="true"] input'
+    }
+  },
   render: function Story() {
     return <div style={{
       display: 'flex',
@@ -75,13 +81,17 @@ Unable to find an `+(r===!1?`accessible `:``)+`element with the role "`+t+`"`+c+
                         <tr>
                             <td>hover</td>
                             <td>
-                                <RatingInput aria-label={'Lesson rating'} value={2.5} dsInternalSimulation="hover" />
+                                <RatingInput aria-label={'Lesson rating'} value={2.5} dataset={{
+                hover: true
+              }} />
                             </td>
                         </tr>
                         <tr>
                             <td>focus</td>
                             <td>
-                                <RatingInput aria-label={'Lesson rating'} value={2.5} dsInternalSimulation="focus" />
+                                <RatingInput aria-label={'Lesson rating'} value={2.5} dataset={{
+                focus: true
+              }} />
                             </td>
                         </tr>
                         <tr>
@@ -93,13 +103,17 @@ Unable to find an `+(r===!1?`accessible `:``)+`element with the role "`+t+`"`+c+
                         <tr>
                             <td>hasError+hover</td>
                             <td>
-                                <RatingInput aria-label={'Lesson rating'} value={2.5} hasError dsInternalSimulation="hover" />
+                                <RatingInput aria-label={'Lesson rating'} value={2.5} hasError dataset={{
+                hover: true
+              }} />
                             </td>
                         </tr>
                         <tr>
                             <td>hasError+focus</td>
                             <td>
-                                <RatingInput aria-label={'Lesson rating'} value={2.5} hasError dsInternalSimulation="focus" />
+                                <RatingInput aria-label={'Lesson rating'} value={2.5} hasError dataset={{
+                focus: true
+              }} />
                             </td>
                         </tr>
                     </tbody>

package/dist/assets/{SelectField-C9fy_QpQ.css → SelectField-hr5YRqjg.css}

@@ -1 +1 @@
-@keyframes fade-in__Xw3bI{0%{opacity:0}to{opacity:1}}@keyframes fade-out__4u9tF{0%{opacity:1}to{opacity:0}}@keyframes mobile-content-show__1QhLc{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes mobile-content-hide__Rqzas{0%{transform:translateY(0)}to{transform:translateY(100%)}}.trigger__XRceG{all:unset;cursor:pointer;background-color:var(--3546c3);color:var(--628fb7);font-weight:var(--1bc44d);font-size:var(--9c8f04);line-height:var(--3dd5bc);--border-size:var(--26b8e3);border:var(--border-size) solid var(--c03289);border-radius:var(--fa4b1a);min-height:var(--51a539);width:100%;padding-inline:calc(var(--558c4c) - var(--border-size)) calc(var(--66b80b) - var(--border-size));align-items:center;gap:var(--66b80b);box-sizing:border-box;transition:background-color .22s cubic-bezier(.22,1,.36,1),border-color .22s cubic-bezier(.22,1,.36,1);display:flex}.trigger__XRceG>.chevron__ENwnv{margin-inline-start:auto}.trigger__XRceG:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}.trigger__XRceG[data-placeholder]{color:var(--0bad98)}.trigger__XRceG[data-state=open]{border-color:var(--5b4fe9)}.trigger__XRceG[data-state=open]>.chevron__ENwnv{rotate:180deg}.trigger__XRceG[disabled]{cursor:not-allowed;background-color:var(--319b29)}.trigger__XRceG[aria-invalid=true]{border-color:var(--7b0f41);background-color:var(--95df5b);color:var(--7b0f41)}.trigger__XRceG:hover:not([disabled]):not([aria-invalid=true]){background-color:var(--302ecf);border-color:var(--11d206)}.content__NHVeq{border-radius:var(--fa4b1a) var(--fa4b1a) 0 0;width:100%;padding:var(--813599);z-index:var(--ds-select-z-index-override,auto);background-color:var(--3546c3);box-shadow:var(--ecd97a);margin:auto;position:fixed;inset:auto 0 0}.content__NHVeq .viewport__aqXUS{gap:var(--590b8d);flex-direction:column;max-height:80vh;display:flex}@media (width>=700px){.content__NHVeq .viewport__aqXUS{max-height:min(500px, var(--radix-select-content-available-height))}}.content__NHVeq .item__7lwGu{cursor:pointer;width:100%;height:var(--51a539);color:var(--628fb7);font-weight:var(--1bc44d);font-size:var(--9c8f04);line-height:var(--3dd5bc);padding:var(--813599);border-radius:var(--5e8be4);align-items:center;gap:var(--66b80b);transition:background-color .22s cubic-bezier(.22,1,.36,1);display:flex}.content__NHVeq .item__7lwGu>.indicator__NkOzD{margin-inline-start:auto}.content__NHVeq .item__7lwGu[data-highlighted]:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c);outline-offset:-2px}.content__NHVeq .item__7lwGu[data-highlighted]:hover{background-color:var(--302ecf);outline:none}.content__NHVeq .item__7lwGu[data-state=checked]{background-color:var(--a5c761);outline:none}.content__NHVeq .group__feJjZ{gap:var(--590b8d);flex-direction:column;display:flex}.content__NHVeq .group__feJjZ .groupLabel__VdJlH{color:var(--628fb7);font-weight:var(--a3f251);font-size:var(--475c79);line-height:var(--e33d9e);padding-block:var(--813599) var(--590b8d);padding-inline:var(--813599)}.content__NHVeq .group__feJjZ:not(:first-child){border-top:var(--f3fdd6) solid var(--c03289);padding-top:var(--53860b)}@media (prefers-reduced-motion:no-preference){.content__NHVeq[data-state=open]{animation:.22s cubic-bezier(.22,1,.36,1) mobile-content-show__1QhLc}.content__NHVeq[data-state=closed]{animation:.22s cubic-bezier(.22,1,.36,1) mobile-content-hide__Rqzas}}@media (width>=700px){.content__NHVeq{min-width:var(--radix-select-trigger-width);border-radius:var(--fa4b1a);padding:var(--590b8d);margin:0;position:relative;inset:auto}.content__NHVeq[data-state=open]{animation:.22s cubic-bezier(.22,1,.36,1) forwards fade-in__Xw3bI}.content__NHVeq[data-state=closed]{animation:.22s cubic-bezier(.22,1,.36,1) forwards fade-out__4u9tF}}
+@keyframes fade-in__Xw3bI{0%{opacity:0}to{opacity:1}}@keyframes fade-out__4u9tF{0%{opacity:1}to{opacity:0}}@keyframes mobile-content-show__1QhLc{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes mobile-content-hide__Rqzas{0%{transform:translateY(0)}to{transform:translateY(100%)}}.trigger__XRceG{all:unset;cursor:pointer;background-color:var(--3546c3);color:var(--628fb7);font-weight:var(--1bc44d);font-size:var(--9c8f04);line-height:var(--3dd5bc);--border-size:var(--26b8e3);border:var(--border-size) solid var(--c03289);border-radius:var(--fa4b1a);min-height:var(--51a539);width:100%;padding-inline:calc(var(--558c4c) - var(--border-size)) calc(var(--66b80b) - var(--border-size));align-items:center;gap:var(--66b80b);box-sizing:border-box;transition:background-color .22s cubic-bezier(.22,1,.36,1),border-color .22s cubic-bezier(.22,1,.36,1);display:flex}.trigger__XRceG>.chevron__ENwnv{margin-inline-start:auto}.trigger__XRceG:focus-visible{outline:var(--5b4fe9) auto var(--d9baa3)}.trigger__XRceG[data-placeholder]{color:var(--0bad98)}.trigger__XRceG[data-state=open]{border-color:var(--5b4fe9)}.trigger__XRceG[data-state=open]>.chevron__ENwnv{rotate:180deg}.trigger__XRceG[disabled]{cursor:not-allowed;background-color:var(--319b29)}.trigger__XRceG[aria-invalid=true]{border-color:var(--7b0f41);background-color:var(--95df5b);color:var(--7b0f41)}.trigger__XRceG:hover:not([disabled]):not([aria-invalid=true]){background-color:var(--302ecf);border-color:var(--11d206)}.content__NHVeq{border-radius:var(--fa4b1a) var(--fa4b1a) 0 0;width:100%;padding:var(--813599);z-index:var(--ds-select-z-index-override,auto);background-color:var(--3546c3);box-shadow:var(--ecd97a);margin:auto;position:fixed;inset:auto 0 0}.content__NHVeq .viewport__aqXUS{gap:var(--590b8d);flex-direction:column;max-height:80vh;display:flex}@media (width>=700px){.content__NHVeq .viewport__aqXUS{max-height:min(500px, var(--radix-select-content-available-height))}}.content__NHVeq .item__7lwGu{cursor:pointer;width:100%;height:var(--51a539);color:var(--628fb7);font-weight:var(--1bc44d);font-size:var(--9c8f04);line-height:var(--3dd5bc);padding:var(--813599);border-radius:var(--5e8be4);align-items:center;gap:var(--66b80b);transition:background-color .22s cubic-bezier(.22,1,.36,1);display:flex}.content__NHVeq .item__7lwGu>.indicator__NkOzD{margin-inline-start:auto}.content__NHVeq .item__7lwGu[data-highlighted]:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c);outline-offset:-2px}.content__NHVeq .item__7lwGu[data-highlighted]:hover{background-color:var(--302ecf);outline:none}.content__NHVeq .item__7lwGu[data-state=checked]{background-color:var(--a5c761);outline:none}.content__NHVeq .group__feJjZ{gap:var(--590b8d);flex-direction:column;display:flex}.content__NHVeq .group__feJjZ .groupLabel__VdJlH{color:var(--628fb7);font-weight:var(--a3f251);font-size:var(--475c79);line-height:var(--e33d9e);padding-block:var(--813599) var(--590b8d);padding-inline:var(--813599)}.content__NHVeq .group__feJjZ:not(:first-child){border-top:var(--f3fdd6) solid var(--c03289);padding-top:var(--53860b)}@media (prefers-reduced-motion:no-preference){.content__NHVeq[data-state=open]{animation:.22s cubic-bezier(.22,1,.36,1) mobile-content-show__1QhLc}.content__NHVeq[data-state=closed]{animation:.22s cubic-bezier(.22,1,.36,1) mobile-content-hide__Rqzas}}@media (width>=700px){.content__NHVeq{min-width:var(--radix-select-trigger-width);border-radius:var(--fa4b1a);padding:var(--590b8d);margin:0;position:relative;inset:auto}.content__NHVeq[data-state=open]{animation:.22s cubic-bezier(.22,1,.36,1) forwards fade-in__Xw3bI}.content__NHVeq[data-state=closed]{animation:.22s cubic-bezier(.22,1,.36,1) forwards fade-out__4u9tF}}

package/dist/assets/SelectField-qBhGOYdK.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,pt as i,t as a,w as o}from"./dist-DtfJeYQK.js";import{t as s}from"./jsx-runtime-C2wGStra.js";import{A as c,D as l,F as u,I as d,L as f,M as p,N as m,O as h,P as g,R as _,_ as v,g as y,j as b,k as ee,m as x}from"./iframe-kBDSpxRI.js";import{n as S,t as te}from"./TokyoUIChevronDown-CS0lTt7n.js";import{n as C,t as w}from"./dist-Cc1j9Pjk.js";import{n as T,t as E}from"./Icon-C-oDFSRH.js";import{n as D,t as O}from"./FormControl-C_Mh5dfi.js";import{n as k,t as A}from"./TokyoUICheckmark-BgAaFb6V.js";var j,M,N,P,F,I,L,R,z,B=t((()=>{j=`trigger__XRceG`,M=`chevron__ENwnv`,N=`content__NHVeq`,P=`viewport__aqXUS`,F=`item__7lwGu`,I=`indicator__NkOzD`,L=`group__feJjZ`,R=`groupLabel__VdJlH`,z={trigger:j,chevron:M,content:N,viewport:P,item:F,indicator:I,group:L,groupLabel:R,"mobile-content-show":`mobile-content-show__1QhLc`,"mobile-content-hide":`mobile-content-hide__Rqzas`,"fade-in":`fade-in__Xw3bI`,"fade-out":`fade-out__4u9tF`}}));function V(e){let t=`(min-width: ${i[e]}px)`,[n,r]=(0,H.useState)(!1);return(0,H.useEffect)(()=>{let e=window.matchMedia(t);r(e.matches);let n=e=>{r(e.matches)};return e.addEventListener(`change`,n),()=>{e.removeEventListener(`change`,n)}},[t]),n}var H,U=t((()=>{o(),H=e(n(),1)}));function W({value:e,disabled:t,children:n,leadingIcon:i,dataset:a}){return(0,q.jsxs)(c,{value:e,disabled:t,className:z.item,...r(a,{preplyDsComponent:C.SelectFieldOption}),children:[i,(0,q.jsx)(p,{children:n}),(0,q.jsx)(b,{className:z.indicator,children:(0,q.jsx)(E,{svg:A})})]})}function G({children:e,label:t}){return(0,q.jsxs)(h,{className:z.group,children:[(0,q.jsx)(m,{className:z.groupLabel,children:t}),e]})}var K,q,J,ne=t((()=>{K=e(n(),1),v(),a(),x(),w(),S(),k(),T(),B(),U(),q=s(),J=(0,K.forwardRef)(function({value:e,defaultValue:t,placeholder:n,disabled:i,onValueChange:a,children:o,dataset:s,icon:c,name:p,id:m,required:h,onFocus:v,onBlur:b,onKeyDown:x,onKeyUp:S,"aria-label":w,"aria-labelledby":T,"aria-describedby":D,"aria-invalid":O,"aria-errormessage":k},A){let[j,M]=(0,K.useState)(!1),N=y(),P=r(s,{preplyDsComponent:C.Select}),F=V(`medium-s`);return(0,q.jsxs)(u,{value:e,defaultValue:t,onValueChange:e=>{a?.(e)},disabled:i,name:p,open:j,onOpenChange:M,required:h,children:[(0,q.jsxs)(d,{ref:A,id:m,className:z.trigger,onFocus:v,onBlur:b,onKeyDown:x,onKeyUp:S,"aria-label":w,"aria-labelledby":T,"aria-describedby":D,"aria-invalid":O,"aria-errormessage":k,...P,children:[c,(0,q.jsx)(f,{placeholder:n}),(0,q.jsx)(ee,{className:z.chevron,children:(0,q.jsx)(E,{svg:te})})]}),(0,q.jsx)(g,{container:N,children:(0,q.jsx)(l,{position:F?`popper`:void 0,sideOffset:F?5:void 0,className:z.content,children:(0,q.jsx)(_,{className:z.viewport,role:`group`,tabIndex:0,children:o})})})]})});try{W.displayName=`SelectOption`,W.__docgenInfo={description:``,displayName:`SelectOption`,props:{value:{defaultValue:null,description:``,name:`value`,required:!0,type:{name:`string`}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},leadingIcon:{defaultValue:null,description:``,name:`leadingIcon`,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`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}try{G.displayName=`SelectGroup`,G.__docgenInfo={description:``,displayName:`SelectGroup`,props:{label:{defaultValue:null,description:``,name:`label`,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`}]}}}}}catch{}try{J.displayName=`Select`,J.__docgenInfo={description:``,displayName:`Select`,props:{value:{defaultValue:null,description:`Controlled value of the select`,name:`value`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},defaultValue:{defaultValue:null,description:`Default value when uncontrolled`,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},placeholder:{defaultValue:null,description:`Placeholder text when no value is selected`,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:`Whether the select is disabled`,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onValueChange:{defaultValue:null,description:`Callback when value changes`,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: string) => void`}]}},children:{defaultValue:null,description:`Items to display in the select`,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:`Dataset for the trigger element`,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},icon:{defaultValue:null,description:`Icon to display on the left side`,name:`icon`,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`}]}},name:{defaultValue:null,description:`HTML name attribute`,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},required:{defaultValue:null,description:`Whether the select is required`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}}}}}catch{}})),Y,X,Z,Q,$,re=t((()=>{Y=e(n(),1),w(),D(),ne(),X=s(),Z=(0,Y.forwardRef)(function({id:e,label:t,description:n,error:r,required:i,dataset:a,hideLabel:o,hasError:s,useLegacyRequiredLabel:c,inputDataset:l,...u},d){return(0,X.jsx)(O,{id:e,label:t,description:n,error:r,hasError:s,required:i,dataset:a,hideLabel:o,useLegacyRequiredLabel:c,preplyDsComponent:C.SelectField,children:(0,X.jsx)(J,{ref:d,dataset:l,...u})})}),Q=W,$=G;try{Z.displayName=`SelectField`,Z.__docgenInfo={description:``,displayName:`SelectField`,props:{id:{defaultValue:null,description:`The id to be passed to the input element.
+If not provided, will be generated for accessibility purposes.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLDivElement>`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:`hasError`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.
+Whether the select is required`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:`label`,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`}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
+to provide more context or instructions to the user.`,name:`description`,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`}]}},error:{defaultValue:null,description:`Error message to display when the field has an invalid value.`,name:`error`,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`}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+When false, adds a "Optional" indicator next to the label for the optional fields instead.
+@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:`useLegacyRequiredLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},disabled:{defaultValue:null,description:`Whether the select is disabled`,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},children:{defaultValue:null,description:`Items to display in the select`,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`}]}},value:{defaultValue:null,description:`Controlled value of the select`,name:`value`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},name:{defaultValue:null,description:`HTML name attribute`,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},defaultValue:{defaultValue:null,description:`Default value when uncontrolled`,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onValueChange:{defaultValue:null,description:`Callback when value changes`,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: string) => void`}]}},icon:{defaultValue:null,description:`Icon to display on the left side`,name:`icon`,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`}]}},placeholder:{defaultValue:null,description:`Placeholder text when no value is selected`,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},inputDataset:{defaultValue:null,description:`Dataset for the input element`,name:`inputDataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}try{Q.displayName=`SelectFieldOption`,Q.__docgenInfo={description:``,displayName:`SelectFieldOption`,props:{value:{defaultValue:null,description:``,name:`value`,required:!0,type:{name:`string`}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},leadingIcon:{defaultValue:null,description:``,name:`leadingIcon`,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`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}try{$.displayName=`SelectFieldGroup`,$.__docgenInfo={description:``,displayName:`SelectFieldGroup`,props:{label:{defaultValue:null,description:``,name:`label`,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`}]}}}}}catch{}}));export{re as i,$ as n,Q as r,Z as t};

package/dist/assets/{SelectField.stories-CDA-sJca.js → SelectField.stories-Iz2YZ_Bs.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"./Icon-DwVTLcDP.js";import{n as o,t as s}from"./Button-a57MCiDO.js";import{n as c,t as l}from"./CountryFlag-Coh5YEUl.js";import{n as u,t as d}from"./Dialog-CGhOTWSt.js";import{i as f,n as p,r as m,t as h}from"./SelectField-u1424VWi.js";import{n as g,t as _}from"./TokyoUILanguage-DxmG-CNh.js";var v,y,b,x,S,C,w,T,E,D,O,k,A,j,M,N,P,F,I,L,R,z,B,V,H,U,W,G,K;t((()=>{v=e(n(),1),g(),i(),f(),u(),o(),c(),y=r(),{expect:b,userEvent:x,within:S,fn:C,waitFor:w}=__STORYBOOK_MODULE_TEST__,T={title:`components/SelectField`,component:h,subcomponents:{SelectFieldOption:m,SelectFieldGroup:p},parameters:{layout:`padded`},decorators:[e=>(0,y.jsx)(`div`,{style:{width:`min(300px, 100%)`,height:`300px`},children:(0,y.jsx)(e,{})})],args:{name:`language`,label:`Language`,placeholder:`Select a language`,defaultValue:``,dataset:{testid:`field`,foo:`bar`},inputDataset:{testid:`input`,foo:`bar`},onValueChange:C(),onBlur:C(),onFocus:C(),onClick:C(),onKeyDown:C(),onKeyUp:C(),children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})}},E={a11y:{config:{rules:[{id:`aria-hidden-focus`,enabled:!1}]}}},D={parameters:E,play:async({canvasElement:e,step:t,args:n})=>{let r=S(e),i=r.getByTestId(`field`),a=r.getByTestId(`input`);await t(`it should render correct label`,async()=>{b(S(i).getByTestId(`label`)).toHaveTextContent(`Language • Optional`),b(a).toHaveAccessibleName(`Language`)}),await t(`it should call onFocus when the input is focused`,async()=>{a.focus(),b(n.onFocus).toHaveBeenCalled()}),await t(`it should open the menu`,async()=>{await x.keyboard(`{Enter}`),await w(()=>{b(r.getByRole(`listbox`)).toBeInTheDocument()},{timeout:3e3})}),await t(`it should call callback when the value changes`,async()=>{await x.keyboard(`{Enter}`),b(n.onValueChange).toHaveBeenCalledWith(`english`),b(n.onBlur).toHaveBeenCalledTimes(1)}),await t(`it should call onBlur when the input is blurred`,async()=>{await x.keyboard(`{tab}`),b(n.onBlur).toHaveBeenCalledTimes(2)}),await t(`it should render the dataset props`,async()=>{b(i).toHaveAttribute(`data-testid`,`field`),b(i).toHaveAttribute(`data-foo`,`bar`),b(a).toHaveAttribute(`data-testid`,`input`),b(a).toHaveAttribute(`data-foo`,`bar`)}),await t(`it should render all options`,async()=>{a.focus(),await x.keyboard(`{Enter}`),await w(()=>{b(r.getByRole(`listbox`)).toBeInTheDocument()},{timeout:3e3});let e=r.getByRole(`option`,{name:`English`}),t=r.getByRole(`option`,{name:`Spanish`}),n=r.getByRole(`option`,{name:`French`});b(e).toBeInTheDocument(),b(t).toBeInTheDocument(),b(n).toBeInTheDocument()})}},O={render:function(e){let[t,n]=(0,v.useState)(e.value);return(0,y.jsxs)(h,{...e,value:t,onValueChange:n,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})},args:{label:`Language`,placeholder:`Select a language...`,value:`spanish`,defaultValue:void 0},play:async({canvas:e,step:t})=>{await t(`it should render the correct initial value`,async()=>{await b(e.getByTestId(`input`)).toHaveTextContent(`Spanish`)}),await t(`it should update the value when the user selects`,async()=>{let t=e.getByTestId(`input`);t.focus(),await x.keyboard(`{Enter}`),await x.keyboard(`{ArrowDown}`),await x.keyboard(`{Enter}`),b(t).toHaveTextContent(`French`)})}},k={args:{icon:(0,y.jsx)(a,{svg:_,dataset:{testid:`icon`}})},play:async({canvas:e,step:t})=>{await t(`it should render the icon`,async()=>{b(e.getByTestId(`icon`)).toBeInTheDocument()})}},A={args:{description:`We will use this to get a personalized choice of tutors`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`description`);await t(`it should render the description`,async()=>{b(n).toHaveAccessibleDescription(`We will use this to get a personalized choice of tutors`),b(r).toHaveTextContent(`We will use this to get a personalized choice of tutors`)})}},j={args:{required:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`label`);await t(`it should render correct label`,async()=>{b(n).toHaveAccessibleName(`Language`),b(r).toHaveTextContent(`Language`)}),await t(`it should render required attribute`,async()=>{b(n).toHaveAttribute(`aria-required`)})}},M={args:{hideLabel:!0},play:async({canvas:e,step:t})=>{await t(`it should render correct a11y label`,async()=>{b(e.getByTestId(`input`)).toHaveAccessibleName(`Language`)})}},N={args:{error:`This is an error message`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`error`);await t(`it should render the error message`,async()=>{b(n).toHaveAccessibleErrorMessage(`This is an error message`),b(r).toHaveTextContent(`This is an error message`)})}},P={args:{disabled:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`);await t(`it should render the disabled input`,async()=>{b(n).toHaveAttribute(`disabled`)})}},F={tags:[`!autodocs`],parameters:{...E,viewport:{defaultViewport:`narrow-l`}},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},I={parameters:{...E,viewport:{defaultViewport:`narrow-l`},chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-s":{viewport:`medium-s`},"medium-l":{viewport:`medium-l`}}}},render:function(e){let[t,n]=(0,v.useState)(!1);return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(s,{onClick:()=>n(!0),children:`Open`}),(0,y.jsx)(d,{title:`Dialog With Select`,description:void 0,open:t,onClose:()=>n(!1),children:(0,y.jsx)(h,{...e})})]})},play:async({canvas:e})=>{let t=e.getByRole(`button`,{name:`Open`});await x.click(t);let n=await e.findByRole(`combobox`);await x.click(n)}},L={parameters:E,args:{label:`Language with icons`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`French`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},R={parameters:E,args:{label:`Language with country flags`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(l,{code:`gb`,alt:`English`,size:`medium`}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(l,{code:`es`,alt:`Spanish`,size:`medium`}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(l,{code:`fr`,alt:`French`,size:`medium`}),children:`French`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},z={parameters:E,args:{label:`Languages by region`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(p,{label:`European Languages`,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`}),(0,y.jsx)(m,{value:`german`,children:`German`})]}),(0,y.jsxs)(p,{label:`Asian Languages`,children:[(0,y.jsx)(m,{value:`mandarin`,children:`Mandarin`}),(0,y.jsx)(m,{value:`japanese`,children:`Japanese`}),(0,y.jsx)(m,{value:`korean`,children:`Korean`}),(0,y.jsx)(m,{value:`hindi`,children:`Hindi`})]})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},B={parameters:E,args:{label:`Languages by region`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(p,{label:`European Languages`,children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(l,{code:`gb`,alt:`English`,size:`medium`}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(l,{code:`es`,alt:`Spanish`,size:`medium`}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(l,{code:`fr`,alt:`French`,size:`medium`}),children:`French`}),(0,y.jsx)(m,{value:`german`,leadingIcon:(0,y.jsx)(l,{code:`de`,alt:`German`,size:`medium`}),children:`German`})]}),(0,y.jsxs)(p,{label:`Asian Languages`,children:[(0,y.jsx)(m,{value:`mandarin`,leadingIcon:(0,y.jsx)(l,{code:`cn`,alt:`Mandarin`,size:`medium`}),children:`Mandarin`}),(0,y.jsx)(m,{value:`japanese`,leadingIcon:(0,y.jsx)(l,{code:`jp`,alt:`Japanese`,size:`medium`}),children:`Japanese`}),(0,y.jsx)(m,{value:`korean`,leadingIcon:(0,y.jsx)(l,{code:`kr`,alt:`Korean`,size:`medium`}),children:`Korean`}),(0,y.jsx)(m,{value:`hindi`,leadingIcon:(0,y.jsx)(l,{code:`in`,alt:`Hindi`,size:`medium`}),children:`Hindi`})]})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},V={parameters:E,args:{label:`Select from many options`,placeholder:`Choose a number...`,children:(0,y.jsx)(y.Fragment,{children:Array.from({length:100},(e,t)=>(0,y.jsxs)(m,{value:String(t+1),children:[`Option `,t+1]},t+1))})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},H={args:{label:`Select from long options`,placeholder:`Choose an option...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`one`,children:`Path unlocks frontend development`}),(0,y.jsx)(m,{value:`two`,children:`Path unlocks rapid, high-quality frontend development`}),(0,y.jsx)(m,{value:`three`,children:`Path unlocks rapid, high-quality frontend development and prototyping`})]})},play:async({canvas:e})=>{let t=e.getByRole(`combobox`);await x.click(t);let n=e.getByRole(`option`,{name:`Path unlocks rapid, high-quality frontend development and prototyping`});await x.click(n)}},U={parameters:E,decorators:[e=>(0,y.jsx)(`div`,{style:{width:`fit-content`},children:(0,y.jsx)(e,{})})],args:{label:`Options`,placeholder:`Select an option...`,defaultValue:`a`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`a`,children:`A`}),(0,y.jsx)(m,{value:`b`,children:`BCDEFGHIJKLMNOPQRSTUVWXYZ`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},W={render:function(){return(0,v.useEffect)(()=>(document.body.style.setProperty(`--ds-select-z-index-override`,`20`),()=>{document.body.style.removeProperty(`--ds-select-z-index-override`)}),[]),(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(h,{label:`Language`,placeholder:`Select a language..`,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]}),(0,y.jsx)(`div`,{style:{position:`fixed`,zIndex:10,inset:`0`,backgroundColor:`lightgray`,pointerEvents:`none`,opacity:.5}})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},G={parameters:{chromatic:{disableSnapshot:!0}},args:{label:`Language`,placeholder:`Select a subject`,description:`We will use this to get a personalized choice of tutors`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})},argTypes:{label:{control:`text`},placeholder:{control:`text`},description:{control:`text`},error:{control:`text`},value:{control:`text`},defaultValue:{control:`text`},inputDataset:{control:`object`},dataset:{control:`object`},id:{control:`text`},required:{control:`boolean`},hideLabel:{control:`boolean`},name:{control:`text`},disabled:{control:`boolean`},icon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":(0,y.jsx)(a,{svg:_,label:`Student with a hat`})},control:`select`},children:{control:!1},hasError:{table:{disable:!0}}}},D.parameters={...D.parameters,docs:{...D.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"./Icon-C-oDFSRH.js";import{n as o,t as s}from"./Button-DagS5hxP.js";import{n as c,t as l}from"./CountryFlag-DXTijnBa.js";import{n as u,t as d}from"./Dialog-a74MpEoC.js";import{i as f,n as p,r as m,t as h}from"./SelectField-qBhGOYdK.js";import{n as g,t as _}from"./TokyoUILanguage-DxmG-CNh.js";var v,y,b,x,S,C,w,T,E,D,O,k,A,j,M,N,P,F,I,L,R,z,B,V,H,U,W,G,K;t((()=>{v=e(n(),1),g(),i(),f(),u(),o(),c(),y=r(),{expect:b,userEvent:x,within:S,fn:C,waitFor:w}=__STORYBOOK_MODULE_TEST__,T={title:`components/SelectField`,component:h,subcomponents:{SelectFieldOption:m,SelectFieldGroup:p},parameters:{layout:`padded`},decorators:[e=>(0,y.jsx)(`div`,{style:{width:`min(300px, 100%)`,height:`300px`},children:(0,y.jsx)(e,{})})],args:{name:`language`,label:`Language`,placeholder:`Select a language`,defaultValue:``,dataset:{testid:`field`,foo:`bar`},inputDataset:{testid:`input`,foo:`bar`},onValueChange:C(),onBlur:C(),onFocus:C(),onClick:C(),onKeyDown:C(),onKeyUp:C(),children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})}},E={a11y:{config:{rules:[{id:`aria-hidden-focus`,enabled:!1}]}}},D={parameters:E,play:async({canvasElement:e,step:t,args:n})=>{let r=S(e),i=r.getByTestId(`field`),a=r.getByTestId(`input`);await t(`it should render correct label`,async()=>{b(S(i).getByTestId(`label`)).toHaveTextContent(`Language • Optional`),b(a).toHaveAccessibleName(`Language`)}),await t(`it should call onFocus when the input is focused`,async()=>{a.focus(),b(n.onFocus).toHaveBeenCalled()}),await t(`it should open the menu`,async()=>{await x.keyboard(`{Enter}`),await w(()=>{b(r.getByRole(`listbox`)).toBeInTheDocument()},{timeout:3e3})}),await t(`it should call callback when the value changes`,async()=>{await x.keyboard(`{Enter}`),b(n.onValueChange).toHaveBeenCalledWith(`english`),b(n.onBlur).toHaveBeenCalledTimes(1)}),await t(`it should call onBlur when the input is blurred`,async()=>{await x.keyboard(`{tab}`),b(n.onBlur).toHaveBeenCalledTimes(2)}),await t(`it should render the dataset props`,async()=>{b(i).toHaveAttribute(`data-testid`,`field`),b(i).toHaveAttribute(`data-foo`,`bar`),b(a).toHaveAttribute(`data-testid`,`input`),b(a).toHaveAttribute(`data-foo`,`bar`)}),await t(`it should render all options`,async()=>{a.focus(),await x.keyboard(`{Enter}`),await w(()=>{b(r.getByRole(`listbox`)).toBeInTheDocument()},{timeout:3e3});let e=r.getByRole(`option`,{name:`English`}),t=r.getByRole(`option`,{name:`Spanish`}),n=r.getByRole(`option`,{name:`French`});b(e).toBeInTheDocument(),b(t).toBeInTheDocument(),b(n).toBeInTheDocument()})}},O={render:function(e){let[t,n]=(0,v.useState)(e.value);return(0,y.jsxs)(h,{...e,value:t,onValueChange:n,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})},args:{label:`Language`,placeholder:`Select a language...`,value:`spanish`,defaultValue:void 0},play:async({canvas:e,step:t})=>{await t(`it should render the correct initial value`,async()=>{await b(e.getByTestId(`input`)).toHaveTextContent(`Spanish`)}),await t(`it should update the value when the user selects`,async()=>{let t=e.getByTestId(`input`);t.focus(),await x.keyboard(`{Enter}`),await x.keyboard(`{ArrowDown}`),await x.keyboard(`{Enter}`),b(t).toHaveTextContent(`French`)})}},k={args:{icon:(0,y.jsx)(a,{svg:_,dataset:{testid:`icon`}})},play:async({canvas:e,step:t})=>{await t(`it should render the icon`,async()=>{b(e.getByTestId(`icon`)).toBeInTheDocument()})}},A={args:{description:`We will use this to get a personalized choice of tutors`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`description`);await t(`it should render the description`,async()=>{b(n).toHaveAccessibleDescription(`We will use this to get a personalized choice of tutors`),b(r).toHaveTextContent(`We will use this to get a personalized choice of tutors`)})}},j={args:{required:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`label`);await t(`it should render correct label`,async()=>{b(n).toHaveAccessibleName(`Language`),b(r).toHaveTextContent(`Language`)}),await t(`it should render required attribute`,async()=>{b(n).toHaveAttribute(`aria-required`)})}},M={args:{hideLabel:!0},play:async({canvas:e,step:t})=>{await t(`it should render correct a11y label`,async()=>{b(e.getByTestId(`input`)).toHaveAccessibleName(`Language`)})}},N={args:{error:`This is an error message`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`error`);await t(`it should render the error message`,async()=>{b(n).toHaveAccessibleErrorMessage(`This is an error message`),b(r).toHaveTextContent(`This is an error message`)})}},P={args:{disabled:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`);await t(`it should render the disabled input`,async()=>{b(n).toHaveAttribute(`disabled`)})}},F={tags:[`!autodocs`],parameters:{...E,viewport:{defaultViewport:`narrow-l`}},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},I={parameters:{...E,viewport:{defaultViewport:`narrow-l`},chromatic:{modes:{"narrow-l":{viewport:`narrow-l`},"medium-s":{viewport:`medium-s`},"medium-l":{viewport:`medium-l`}}}},render:function(e){let[t,n]=(0,v.useState)(!1);return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(s,{onClick:()=>n(!0),children:`Open`}),(0,y.jsx)(d,{title:`Dialog With Select`,description:void 0,open:t,onClose:()=>n(!1),children:(0,y.jsx)(h,{...e})})]})},play:async({canvas:e})=>{let t=e.getByRole(`button`,{name:`Open`});await x.click(t);let n=await e.findByRole(`combobox`);await x.click(n)}},L={parameters:E,args:{label:`Language with icons`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(a,{svg:_}),children:`French`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},R={parameters:E,args:{label:`Language with country flags`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(l,{code:`gb`,alt:`English`,size:`medium`}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(l,{code:`es`,alt:`Spanish`,size:`medium`}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(l,{code:`fr`,alt:`French`,size:`medium`}),children:`French`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},z={parameters:E,args:{label:`Languages by region`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(p,{label:`European Languages`,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`}),(0,y.jsx)(m,{value:`german`,children:`German`})]}),(0,y.jsxs)(p,{label:`Asian Languages`,children:[(0,y.jsx)(m,{value:`mandarin`,children:`Mandarin`}),(0,y.jsx)(m,{value:`japanese`,children:`Japanese`}),(0,y.jsx)(m,{value:`korean`,children:`Korean`}),(0,y.jsx)(m,{value:`hindi`,children:`Hindi`})]})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},B={parameters:E,args:{label:`Languages by region`,placeholder:`Select a language...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(p,{label:`European Languages`,children:[(0,y.jsx)(m,{value:`english`,leadingIcon:(0,y.jsx)(l,{code:`gb`,alt:`English`,size:`medium`}),children:`English`}),(0,y.jsx)(m,{value:`spanish`,leadingIcon:(0,y.jsx)(l,{code:`es`,alt:`Spanish`,size:`medium`}),children:`Spanish`}),(0,y.jsx)(m,{value:`french`,leadingIcon:(0,y.jsx)(l,{code:`fr`,alt:`French`,size:`medium`}),children:`French`}),(0,y.jsx)(m,{value:`german`,leadingIcon:(0,y.jsx)(l,{code:`de`,alt:`German`,size:`medium`}),children:`German`})]}),(0,y.jsxs)(p,{label:`Asian Languages`,children:[(0,y.jsx)(m,{value:`mandarin`,leadingIcon:(0,y.jsx)(l,{code:`cn`,alt:`Mandarin`,size:`medium`}),children:`Mandarin`}),(0,y.jsx)(m,{value:`japanese`,leadingIcon:(0,y.jsx)(l,{code:`jp`,alt:`Japanese`,size:`medium`}),children:`Japanese`}),(0,y.jsx)(m,{value:`korean`,leadingIcon:(0,y.jsx)(l,{code:`kr`,alt:`Korean`,size:`medium`}),children:`Korean`}),(0,y.jsx)(m,{value:`hindi`,leadingIcon:(0,y.jsx)(l,{code:`in`,alt:`Hindi`,size:`medium`}),children:`Hindi`})]})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},V={parameters:E,args:{label:`Select from many options`,placeholder:`Choose a number...`,children:(0,y.jsx)(y.Fragment,{children:Array.from({length:100},(e,t)=>(0,y.jsxs)(m,{value:String(t+1),children:[`Option `,t+1]},t+1))})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},H={args:{label:`Select from long options`,placeholder:`Choose an option...`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`one`,children:`Path unlocks frontend development`}),(0,y.jsx)(m,{value:`two`,children:`Path unlocks rapid, high-quality frontend development`}),(0,y.jsx)(m,{value:`three`,children:`Path unlocks rapid, high-quality frontend development and prototyping`})]})},play:async({canvas:e})=>{let t=e.getByRole(`combobox`);await x.click(t);let n=e.getByRole(`option`,{name:`Path unlocks rapid, high-quality frontend development and prototyping`});await x.click(n)}},U={parameters:E,decorators:[e=>(0,y.jsx)(`div`,{style:{width:`fit-content`},children:(0,y.jsx)(e,{})})],args:{label:`Options`,placeholder:`Select an option...`,defaultValue:`a`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`a`,children:`A`}),(0,y.jsx)(m,{value:`b`,children:`BCDEFGHIJKLMNOPQRSTUVWXYZ`})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},W={render:function(){return(0,v.useEffect)(()=>(document.body.style.setProperty(`--ds-select-z-index-override`,`20`),()=>{document.body.style.removeProperty(`--ds-select-z-index-override`)}),[]),(0,y.jsxs)(y.Fragment,{children:[(0,y.jsxs)(h,{label:`Language`,placeholder:`Select a language..`,children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]}),(0,y.jsx)(`div`,{style:{position:`fixed`,zIndex:10,inset:`0`,backgroundColor:`lightgray`,pointerEvents:`none`,opacity:.5}})]})},play:async({canvas:e})=>{e.getByRole(`combobox`).click()}},G={parameters:{chromatic:{disableSnapshot:!0}},args:{label:`Language`,placeholder:`Select a subject`,description:`We will use this to get a personalized choice of tutors`,children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m,{value:`english`,children:`English`}),(0,y.jsx)(m,{value:`spanish`,children:`Spanish`}),(0,y.jsx)(m,{value:`french`,children:`French`})]})},argTypes:{label:{control:`text`},placeholder:{control:`text`},description:{control:`text`},error:{control:`text`},value:{control:`text`},defaultValue:{control:`text`},inputDataset:{control:`object`},dataset:{control:`object`},id:{control:`text`},required:{control:`boolean`},hideLabel:{control:`boolean`},name:{control:`text`},disabled:{control:`boolean`},icon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":(0,y.jsx)(a,{svg:_,label:`Student with a hat`})},control:`select`},children:{control:!1},hasError:{table:{disable:!0}}}},D.parameters={...D.parameters,docs:{...D.parameters?.docs,source:{originalSource:`{
   parameters: disableA11yFocus,
   play: async ({
     canvasElement,

package/dist/assets/{ShowOnIntersection-BIc8Ks2O.js → ShowOnIntersection-BMR5nazA.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"./ObserveIntersection-ClJrn-sk.js";var o,s,c,l=t((()=>{o=e(n(),1),i(),s=r(),c=({onIntersect:e,once:t,threshold:n,tag:r,dataset:i,children:c})=>{let[l,u]=(0,o.useState)(!1);return(0,s.jsx)(a,{onIntersect:(0,o.useCallback)(()=>{l||u(!0),e?.()},[l,e]),once:e?t:!0,threshold:n,tag:r,dataset:i,children:l&&c})};try{c.displayName=`ShowOnIntersection`,c.__docgenInfo={description:`Only renders the wrapped components once it intersects with the viewport.
+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"./ObserveIntersection-CR4IhuYz.js";var o,s,c,l=t((()=>{o=e(n(),1),i(),s=r(),c=({onIntersect:e,once:t,threshold:n,tag:r,dataset:i,children:c})=>{let[l,u]=(0,o.useState)(!1);return(0,s.jsx)(a,{onIntersect:(0,o.useCallback)(()=>{l||u(!0),e?.()},[l,e]),once:e?t:!0,threshold:n,tag:r,dataset:i,children:l&&c})};try{c.displayName=`ShowOnIntersection`,c.__docgenInfo={description:`Only renders the wrapped components once it intersects with the viewport.
 
 Note that elements will not be detached from the DOM if the component is
 scrolled out of view again.
@@ -8,4 +8,4 @@ You can use \`React.lazy\` to lazy-load the wrapped components.
 Additionally, an \`onIntersect\` callback can be provided. As with
 \`ObserveIntersection\`, this callback will be called every time the component
 intersects with the viewport, or only the first time if \`once\` is set to
-\`true\`.`,displayName:`ShowOnIntersection`,props:{onIntersect:{defaultValue:null,description:``,name:`onIntersect`,required:!1,type:{name:`enum`,value:[{value:`() => void`}]}},once:{defaultValue:null,description:``,name:`once`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},threshold:{defaultValue:null,description:``,name:`threshold`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},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"`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}}));export{l as n,c as t};
+\`true\`.`,displayName:`ShowOnIntersection`,props:{onIntersect:{defaultValue:null,description:``,name:`onIntersect`,required:!1,type:{name:`enum`,value:[{value:`() => void`}]}},once:{defaultValue:null,description:``,name:`once`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},threshold:{defaultValue:null,description:``,name:`threshold`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},tag:{defaultValue:null,description:``,name:`tag`,required:!1,type:{name:`enum`,value:[{value:`"div"`},{value:`"main"`},{value:`"header"`},{value:`"footer"`},{value:`"article"`},{value:`"section"`},{value:`"ul"`},{value:`"ol"`},{value:`"li"`},{value:`"p"`},{value:`"span"`},{value:`"fieldset"`},{value:`"table"`},{value:`"th"`},{value:`"tr"`},{value:`"td"`},{value:`"thead"`},{value:`"tfoot"`},{value:`"tbody"`},{value:`"caption"`},{value:`"figure"`},{value:`"figcaption"`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}}}}}catch{}}));export{l as n,c as t};

package/dist/assets/{ShowOnIntersection.stories-COT8LZNV.js → ShowOnIntersection.stories-CSSgxbfv.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"./ShowOnIntersection-BIc8Ks2O.js";var o,s,c,l;t((()=>{e(n(),1),i(),o=r(),s={title:`components/ShowOnIntersection`,component:a,parameters:{tags:[`!test`],chromatic:{disableSnapshot:!0}}},c=()=>(0,o.jsx)(`div`,{style:{height:`200px`,overflowY:`scroll`,position:`relative`},children:(0,o.jsx)(`div`,{style:{height:`400px`,display:`flex`,alignItems:`end`},children:(0,o.jsx)(a,{children:(0,o.jsx)(`p`,{children:`Intersected`})})})}),c.storyName=`ShowOnIntersection`,c.parameters={...c.parameters,docs:{...c.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"./ShowOnIntersection-BMR5nazA.js";var o,s,c,l;t((()=>{e(n(),1),i(),o=r(),s={title:`components/ShowOnIntersection`,component:a,parameters:{tags:[`!test`],chromatic:{disableSnapshot:!0}}},c=()=>(0,o.jsx)(`div`,{style:{height:`200px`,overflowY:`scroll`,position:`relative`},children:(0,o.jsx)(`div`,{style:{height:`400px`,display:`flex`,alignItems:`end`},children:(0,o.jsx)(a,{children:(0,o.jsx)(`p`,{children:`Intersected`})})})}),c.storyName=`ShowOnIntersection`,c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`() => {
   return <div style={{
     height: '200px',
     overflowY: 'scroll',