@preply/ds-docs 4.0.0 → 5.0.0

package/dist/assets/{Link.stories-WQCe-o4N.js → Link.stories-DOzq9sNs.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{T as t}from"./Text-CjpUlaH0.js";import{L as r}from"./Link-DdFAEBXD.js";import{g as c}from"./getTokenVar-DU_DEzTd.js";import{c as d}from"./tokens-Xet-VKqC.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./text-centered-CznToR0o.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./useHostname-Y3PlXofY.js";import"./constants-BgBLeZzp.js";const G={title:"components/Link",component:r},n=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]})},i=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(t,{variant:"default-regular-italic",children:"(use the `unsetColors` variant)"}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"primary"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"primary",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"primary",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{style:{backgroundColor:a},children:[e.jsx(t,{variant:"large-semibold-italic",accent:"inverted",children:"inverted"}),e.jsx(t,{variant:"default-regular-italic",accent:"inverted",children:"normal"}),e.jsxs(t,{accent:"inverted",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",accent:"inverted",children:"active"}),e.jsxs(t,{accent:"inverted",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"positive"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"positive",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"positive",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"critical"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"critical",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"critical",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]})]})},l=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]}),e.jsx(t,{variant:"default-regular-italic",children:"hover"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"hover",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"hover",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"hover",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"hover",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"hover",children:"unsetColors"})]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"active",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"active",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"active",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"active",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"active",children:"unsetColors"})]})]})},o=()=>e.jsxs("p",{style:{width:"12ch"},children:["Unlock your potential;"," ",e.jsx(r,{href:"https://preply.com",variant:"unsetColors",inline:!0,children:"visit Preply"}),"."]}),s={parameters:{chromatic:{disableSnapshot:!0}},args:{children:"Click me",href:"https://preply.com",variant:"neutral",dataset:{qaid:"link"}},argTypes:{dataset:{control:"object"},inline:{control:"boolean"},noUnderline:{control:"boolean"},opensInNewTab:{control:"boolean"},nofollow:{control:"boolean"},download:{control:"boolean"},assistiveText:{control:"text"},href:{control:"text"},url:{table:{disable:!0}}}};var p,u,v;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{T as t}from"./Text-D3i9pJx6.js";import{L as r}from"./Link-D3ljGEp4.js";import{g as c}from"./getTokenVar-DU_DEzTd.js";import{c as d}from"./tokens-BoC65r7p.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./text-centered-CznToR0o.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./useHostname-Y3PlXofY.js";import"./constants-BgBLeZzp.js";const G={title:"components/Link",component:r},n=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]})},i=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(t,{variant:"default-regular-italic",children:"(use the `unsetColors` variant)"}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"primary"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"primary",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"primary",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{style:{backgroundColor:a},children:[e.jsx(t,{variant:"large-semibold-italic",accent:"inverted",children:"inverted"}),e.jsx(t,{variant:"default-regular-italic",accent:"inverted",children:"normal"}),e.jsxs(t,{accent:"inverted",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",accent:"inverted",children:"active"}),e.jsxs(t,{accent:"inverted",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"positive"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"positive",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"positive",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(t,{variant:"large-semibold-italic",children:"critical"}),e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs(t,{accent:"critical",children:["Lorem ipsum ",e.jsx(r,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs(t,{accent:"critical",children:["Lorem ipsum"," ",e.jsx(r,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]})]})},l=()=>{const a=c(d.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(t,{variant:"default-regular-italic",children:"normal"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]}),e.jsx(t,{variant:"default-regular-italic",children:"hover"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"hover",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"hover",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"hover",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"hover",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"hover",children:"unsetColors"})]}),e.jsx(t,{variant:"default-regular-italic",children:"active"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(r,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"active",children:"neutral"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"active",children:"neutralInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"active",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:a},children:e.jsx(r,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"active",children:"accentDarkInverted"})}),e.jsx(r,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"active",children:"unsetColors"})]})]})},o=()=>e.jsxs("p",{style:{width:"12ch"},children:["Unlock your potential;"," ",e.jsx(r,{href:"https://preply.com",variant:"unsetColors",inline:!0,children:"visit Preply"}),"."]}),s={parameters:{chromatic:{disableSnapshot:!0}},args:{children:"Click me",href:"https://preply.com",variant:"neutral",dataset:{qaid:"link"}},argTypes:{dataset:{control:"object"},inline:{control:"boolean"},noUnderline:{control:"boolean"},opensInNewTab:{control:"boolean"},nofollow:{control:"boolean"},download:{control:"boolean"},assistiveText:{control:"text"},href:{control:"text"},url:{table:{disable:!0}}}};var p,u,v;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
   const grey = getTokenVar(color.background.primaryInverted);
   return <div style={{
     display: 'flex',

package/dist/assets/{Loader.stories-Ceu9fTo6.js → Loader.stories-C53ODmdL.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{f as z}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{S as j}from"./Spinner-BcQ2TyFf.js";import{m as k,b as R}from"./classNames-BUL1Zq7e.js";import{w as l}from"./componentNames-NXEPEzbR.js";import{g as N}from"./index-DdzHuZ-Y.js";import{S as C}from"./consts-KAYct7Gj.js";import{g as E}from"./getTokenVar-DU_DEzTd.js";import{c as I}from"./tokens-Xet-VKqC.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./defaults-hwJNw1bK.js";import"./constants-BgBLeZzp.js";const P="Loader__Ya6Xk",V={Loader:P,"Loader--normal":"Loader--normal__41Xzt","Loader--inverted":"Loader--inverted__NULSk"},a=h.forwardRef(function({size:t,inverted:y=!1,dataset:L,...b},S){const x=k(V,l.Loader,[R("inverted","normal",y)]),_={...z(b),ref:S,className:x.join(" "),...N(L,{preplyDsComponent:l.Loader})};return e.jsx("span",{..._,children:e.jsx(j,{size:t})})});try{a.displayName="Loader",a.__docgenInfo={description:"",displayName:"Loader",props:{size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"default"'},{value:"ResponsiveProp<SpinnerSize>"}]}},inverted:{defaultValue:{value:"false"},description:"",name:"inverted",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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{}const G={title:"components/Loader",component:a,argTypes:{size:{description:C}}},o=()=>e.jsxs("div",{style:{display:"flex",alignItems:"end",gap:"8px"},children:[e.jsx(a,{size:"default"}),e.jsx(a,{size:"large"})]}),n=()=>e.jsx(a,{inverted:!0});n.decorators=[r=>{const t=E(I.background.primaryInverted);return e.jsx("div",{style:{backgroundColor:t},children:r()})}];const s={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(r,{args:t})=>e.jsx("div",{style:{backgroundColor:t.inverted?"black":void 0},children:r()})],args:{size:"default",inverted:!1,dataset:{qaid:"loader"}},argTypes:{dataset:{control:"object"},size:{control:"select"},inverted:{control:"boolean"}}};var d,i,c;o.parameters={...o.parameters,docs:{...(d=o.parameters)==null?void 0:d.docs,source:{originalSource:`() => <div style={{
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{f as z}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{S as j}from"./Spinner-BcQ2TyFf.js";import{m as k,b as R}from"./classNames-BUL1Zq7e.js";import{w as l}from"./componentNames-NXEPEzbR.js";import{g as N}from"./index-DdzHuZ-Y.js";import{S as C}from"./consts-KAYct7Gj.js";import{g as E}from"./getTokenVar-DU_DEzTd.js";import{c as I}from"./tokens-BoC65r7p.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./defaults-hwJNw1bK.js";import"./constants-BgBLeZzp.js";const P="Loader__Ya6Xk",V={Loader:P,"Loader--normal":"Loader--normal__41Xzt","Loader--inverted":"Loader--inverted__NULSk"},a=h.forwardRef(function({size:t,inverted:y=!1,dataset:L,...b},S){const x=k(V,l.Loader,[R("inverted","normal",y)]),_={...z(b),ref:S,className:x.join(" "),...N(L,{preplyDsComponent:l.Loader})};return e.jsx("span",{..._,children:e.jsx(j,{size:t})})});try{a.displayName="Loader",a.__docgenInfo={description:"",displayName:"Loader",props:{size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"default"'},{value:"ResponsiveProp<SpinnerSize>"}]}},inverted:{defaultValue:{value:"false"},description:"",name:"inverted",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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{}const G={title:"components/Loader",component:a,argTypes:{size:{description:C}}},o=()=>e.jsxs("div",{style:{display:"flex",alignItems:"end",gap:"8px"},children:[e.jsx(a,{size:"default"}),e.jsx(a,{size:"large"})]}),n=()=>e.jsx(a,{inverted:!0});n.decorators=[r=>{const t=E(I.background.primaryInverted);return e.jsx("div",{style:{backgroundColor:t},children:r()})}];const s={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(r,{args:t})=>e.jsx("div",{style:{backgroundColor:t.inverted?"black":void 0},children:r()})],args:{size:"default",inverted:!1,dataset:{qaid:"loader"}},argTypes:{dataset:{control:"object"},size:{control:"select"},inverted:{control:"boolean"}}};var d,i,c;o.parameters={...o.parameters,docs:{...(d=o.parameters)==null?void 0:d.docs,source:{originalSource:`() => <div style={{
   display: 'flex',
   alignItems: 'end',
   gap: '8px'

package/dist/assets/{MultiSelectChips-Crsz1TpK.js → MultiSelectChips-RUBRF3C_.js}

@@ -1,2 +1,2 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as C}from"./index-Cb9e4tly.js";import{c as j,C as x,a as R,b as M,u as I,d as _,D as z,e as E}from"./createRequiredContext-9__lNQrK.js";import{f as k}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as V}from"./index-DdzHuZ-Y.js";import{w as q}from"./componentNames-NXEPEzbR.js";const[T,L]=j("MultiSelectChips"),y=C.forwardRef(function({items:a,children:r,orientation:l=z,"aria-label":s,"aria-controls":o,value:c,onValueChange:m,defaultValue:d,dataset:p,...f},h){const[u,v]=I({value:c,onValueChange:m,defaultValue:d??[]}),w=(t,n)=>{v(n?u.filter(g=>g!==t):[...u,t])},S=a?a.map(({label:t,value:n,...g})=>e.jsx(b,{value:n,...g,children:t},n)):r;return e.jsx(T,{value:{values:u,onToggle:w},children:e.jsx(_,{orientation:l,children:e.jsx(E,{...k(f),ref:h,orientation:l,"aria-orientation":l,"aria-label":s,"aria-controls":o,role:"listbox","aria-multiselectable":"true",...V(p,{preplyDsComponent:q.MultiSelectChips}),children:S})})})}),b=C.forwardRef(function({value:a,children:r,icon:l,countryFlagCode:s,disabled:o,counter:c,dataset:m,dsInternalSimulation:d,...p},f){const{values:h,onToggle:u}=L(),v=h.includes(a);return e.jsx(x,{role:"presentation",children:e.jsx(R,{...k(p),ref:f,role:"option","aria-selected":v,onClick:()=>u(a,v),icon:l,countryFlagCode:s,disabled:o,dsInternalSimulation:d,...V(m,{preplyDsComponent:q.MultiSelectChipsItem}),children:e.jsx(M,{counter:c,children:r})})})});try{y.displayName="MultiSelectChips",y.__docgenInfo={description:`A chips component that allows selection of multiple options from a group.
-Users can select multiple chips, and clicking a selected chip will deselect it.`,displayName:"MultiSelectChips",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the chips group. Required for screen reader users",name:"aria-label",required:!0,type:{name:"string"}},value:{defaultValue:null,description:"Current value of the chips. When provided, the component operates in controlled mode",name:"value",required:!1,type:{name:"enum",value:[{value:"T[]"}]}},defaultValue:{defaultValue:null,description:"Default value for uncontrolled usage. Will be ignored if `value` is provided",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"T[]"}]}},"aria-controls":{defaultValue:null,description:"If the chips control other elements on the page, use `aria-controls` with the target element's ID.",name:"aria-controls",required:!1,type:{name:"enum",value:[{value:"string"}]}},onValueChange:{defaultValue:null,description:"Callback fired when the value changes. Receives the new value as an argument",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: T[]) => void"}]}},orientation:{defaultValue:{value:"'horizontal'"},description:"Layout orientation of the chips group.",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"horizontal"'},{value:'"vertical"'}]}},items:{defaultValue:null,description:"",name:"items",required:!1,type:{name:"enum",value:[{value:'(Omit<ChipsItemProps, "children" | "dsInternalSimulation" | "value"> & { value: NonNullable<T>; label: ReactNode; })[]'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"(instance: HTMLUListElement | null) => void"},{value:"RefObject<HTMLUListElement>"}]}}}}}catch{}try{b.displayName="MultiSelectChipsItem",b.__docgenInfo={description:"Individual chip item for use within MultiSelectChips.",displayName:"MultiSelectChipsItem",props:{disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ComponentClass<SVGAttributes<SVGElement>, any>"},{value:"FunctionComponent<SVGAttributes<SVGElement>>"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},countryFlagCode:{defaultValue:null,description:"",name:"countryFlagCode",required:!1,type:{name:"enum",value:[{value:'"id"'},{value:'"ai"'},{value:'"as"'},{value:'"li"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"is"'},{value:'"af"'},{value:'"ax"'},{value:'"al"'},{value:'"dz"'},{value:'"ad"'},{value:'"ao"'},{value:'"aq"'},{value:'"ag"'},{value:'"ar"'},{value:'"am"'},{value:'"aw"'},{value:'"sh-ac"'},{value:'"asean"'},{value:'"au"'},{value:'"at"'},{value:'"az"'},{value:'"bs"'},{value:'"bh"'},{value:'"bd"'},{value:'"bb"'},{value:'"es-pv"'},{value:'"by"'},{value:'"be"'},{value:'"bz"'},{value:'"bj"'},{value:'"bm"'},{value:'"bt"'},{value:'"bo"'},{value:'"bq"'},{value:'"ba"'},{value:'"bw"'},{value:'"bv"'},{value:'"br"'},{value:'"io"'},{value:'"bn"'},{value:'"bg"'},{value:'"bf"'},{value:'"bi"'},{value:'"cv"'},{value:'"kh"'},{value:'"cm"'},{value:'"ca"'},{value:'"ic"'},{value:'"es-ct"'},{value:'"ky"'},{value:'"cf"'},{value:'"cefta"'},{value:'"cl"'},{value:'"cn"'},{value:'"cx"'},{value:'"cp"'},{value:'"cc"'},{value:'"co"'},{value:'"km"'},{value:'"ck"'},{value:'"cr"'},{value:'"hr"'},{value:'"cu"'},{value:'"cw"'},{value:'"cy"'},{value:'"cz"'},{value:'"ci"'},{value:'"cd"'},{value:'"dk"'},{value:'"dg"'},{value:'"dj"'},{value:'"dm"'},{value:'"do"'},{value:'"eac"'},{value:'"ec"'},{value:'"eg"'},{value:'"sv"'},{value:'"gb-eng"'},{value:'"gq"'},{value:'"er"'},{value:'"ee"'},{value:'"sz"'},{value:'"et"'},{value:'"eu"'},{value:'"fk"'},{value:'"fo"'},{value:'"fm"'},{value:'"fj"'},{value:'"fi"'},{value:'"fr"'},{value:'"gf"'},{value:'"pf"'},{value:'"tf"'},{value:'"ga"'},{value:'"es-ga"'},{value:'"gm"'},{value:'"ge"'},{value:'"de"'},{value:'"gh"'},{value:'"gi"'},{value:'"gr"'},{value:'"gl"'},{value:'"gd"'},{value:'"gp"'},{value:'"gu"'},{value:'"gt"'},{value:'"gg"'},{value:'"gn"'},{value:'"gw"'},{value:'"gy"'},{value:'"ht"'},{value:'"hm"'},{value:'"va"'},{value:'"hn"'},{value:'"hk"'},{value:'"hu"'},{value:'"in"'},{value:'"ir"'},{value:'"iq"'},{value:'"ie"'},{value:'"im"'},{value:'"il"'},{value:'"it"'},{value:'"jm"'},{value:'"jp"'},{value:'"je"'},{value:'"jo"'},{value:'"kz"'},{value:'"ke"'},{value:'"ki"'},{value:'"xk"'},{value:'"kw"'},{value:'"kg"'},{value:'"la"'},{value:'"lv"'},{value:'"arab"'},{value:'"lb"'},{value:'"ls"'},{value:'"lr"'},{value:'"ly"'},{value:'"lt"'},{value:'"lu"'},{value:'"mo"'},{value:'"mg"'},{value:'"mw"'},{value:'"my"'},{value:'"mv"'},{value:'"ml"'},{value:'"mt"'},{value:'"mh"'},{value:'"mq"'},{value:'"mr"'},{value:'"mu"'},{value:'"yt"'},{value:'"mx"'},{value:'"md"'},{value:'"mc"'},{value:'"mn"'},{value:'"me"'},{value:'"ms"'},{value:'"ma"'},{value:'"mz"'},{value:'"mm"'},{value:'"na"'},{value:'"nr"'},{value:'"np"'},{value:'"nl"'},{value:'"nc"'},{value:'"nz"'},{value:'"ni"'},{value:'"ne"'},{value:'"ng"'},{value:'"nu"'},{value:'"nf"'},{value:'"kp"'},{value:'"mk"'},{value:'"gb-nir"'},{value:'"mp"'},{value:'"no"'},{value:'"om"'},{value:'"pc"'},{value:'"pk"'},{value:'"pw"'},{value:'"pa"'},{value:'"pg"'},{value:'"py"'},{value:'"pe"'},{value:'"ph"'},{value:'"pn"'},{value:'"pl"'},{value:'"pt"'},{value:'"pr"'},{value:'"qa"'},{value:'"cg"'},{value:'"ro"'},{value:'"ru"'},{value:'"rw"'},{value:'"re"'},{value:'"bl"'},{value:'"sh-hl"'},{value:'"sh"'},{value:'"kn"'},{value:'"lc"'},{value:'"mf"'},{value:'"pm"'},{value:'"vc"'},{value:'"ws"'},{value:'"sm"'},{value:'"st"'},{value:'"sa"'},{value:'"gb-sct"'},{value:'"sn"'},{value:'"rs"'},{value:'"sc"'},{value:'"sl"'},{value:'"sg"'},{value:'"sx"'},{value:'"sk"'},{value:'"si"'},{value:'"sb"'},{value:'"so"'},{value:'"za"'},{value:'"gs"'},{value:'"kr"'},{value:'"ss"'},{value:'"es"'},{value:'"lk"'},{value:'"ps"'},{value:'"sd"'},{value:'"sr"'},{value:'"sj"'},{value:'"se"'},{value:'"ch"'},{value:'"sy"'},{value:'"tw"'},{value:'"tj"'},{value:'"tz"'},{value:'"tl"'},{value:'"tg"'},{value:'"tk"'},{value:'"to"'},{value:'"tt"'},{value:'"sh-ta"'},{value:'"tn"'},{value:'"tm"'},{value:'"tc"'},{value:'"tv"'},{value:'"ug"'},{value:'"ua"'},{value:'"ae"'},{value:'"gb"'},{value:'"un"'},{value:'"um"'},{value:'"us"'},{value:'"uy"'},{value:'"uz"'},{value:'"vu"'},{value:'"ve"'},{value:'"vn"'},{value:'"vg"'},{value:'"vi"'},{value:'"gb-wls"'},{value:'"wf"'},{value:'"eh"'},{value:'"ye"'},{value:'"zm"'},{value:'"zw"'}]}},value:{defaultValue:null,description:"Unique identifier for this chip. Used for selection tracking",name:"value",required:!0,type:{name:"string"}},children:{defaultValue:null,description:"Content to display inside the chip",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"}]}},counter:{defaultValue:null,description:"Optional numeric counter to display alongside the chip label",name:"counter",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: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{b as M,y as a};
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as C}from"./index-Cb9e4tly.js";import{c as j,C as x,a as R,b as M,u as I,d as _,D as z,e as E}from"./createRequiredContext-DqKkrhDd.js";import{f as k}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as V}from"./index-DdzHuZ-Y.js";import{w as q}from"./componentNames-NXEPEzbR.js";const[T,L]=j("MultiSelectChips"),y=C.forwardRef(function({items:a,children:r,orientation:l=z,"aria-label":s,"aria-controls":o,value:c,onValueChange:m,defaultValue:d,dataset:p,...f},h){const[u,v]=I({value:c,onValueChange:m,defaultValue:d??[]}),w=(t,n)=>{v(n?u.filter(g=>g!==t):[...u,t])},S=a?a.map(({label:t,value:n,...g})=>e.jsx(b,{value:n,...g,children:t},n)):r;return e.jsx(T,{value:{values:u,onToggle:w},children:e.jsx(_,{orientation:l,children:e.jsx(E,{...k(f),ref:h,orientation:l,"aria-orientation":l,"aria-label":s,"aria-controls":o,role:"listbox","aria-multiselectable":"true",...V(p,{preplyDsComponent:q.MultiSelectChips}),children:S})})})}),b=C.forwardRef(function({value:a,children:r,icon:l,countryFlagCode:s,disabled:o,counter:c,dataset:m,dsInternalSimulation:d,...p},f){const{values:h,onToggle:u}=L(),v=h.includes(a);return e.jsx(x,{role:"presentation",children:e.jsx(R,{...k(p),ref:f,role:"option","aria-selected":v,onClick:()=>u(a,v),icon:l,countryFlagCode:s,disabled:o,dsInternalSimulation:d,...V(m,{preplyDsComponent:q.MultiSelectChipsItem}),children:e.jsx(M,{counter:c,children:r})})})});try{y.displayName="MultiSelectChips",y.__docgenInfo={description:`A chips component that allows selection of multiple options from a group.
+Users can select multiple chips, and clicking a selected chip will deselect it.`,displayName:"MultiSelectChips",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the chips group. Required for screen reader users",name:"aria-label",required:!0,type:{name:"string"}},defaultValue:{defaultValue:null,description:"Default value for uncontrolled usage. Will be ignored if `value` is provided",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"T[]"}]}},"aria-controls":{defaultValue:null,description:"If the chips control other elements on the page, use `aria-controls` with the target element's ID.",name:"aria-controls",required:!1,type:{name:"enum",value:[{value:"string"}]}},value:{defaultValue:null,description:"Current value of the chips. When provided, the component operates in controlled mode",name:"value",required:!1,type:{name:"enum",value:[{value:"T[]"}]}},onValueChange:{defaultValue:null,description:"Callback fired when the value changes. Receives the new value as an argument",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: T[]) => void"}]}},orientation:{defaultValue:{value:"'horizontal'"},description:"Layout orientation of the chips group.",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"horizontal"'},{value:'"vertical"'}]}},items:{defaultValue:null,description:"",name:"items",required:!1,type:{name:"enum",value:[{value:'(Omit<ChipsItemProps, "children" | "dsInternalSimulation" | "value"> & { value: NonNullable<T>; label: ReactNode; })[]'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"(instance: HTMLUListElement | null) => void"},{value:"RefObject<HTMLUListElement>"}]}}}}}catch{}try{b.displayName="MultiSelectChipsItem",b.__docgenInfo={description:"Individual chip item for use within MultiSelectChips.",displayName:"MultiSelectChipsItem",props:{disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ComponentClass<SVGAttributes<SVGElement>, any>"},{value:"FunctionComponent<SVGAttributes<SVGElement>>"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},countryFlagCode:{defaultValue:null,description:"",name:"countryFlagCode",required:!1,type:{name:"enum",value:[{value:'"ai"'},{value:'"id"'},{value:'"as"'},{value:'"li"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"br"'},{value:'"hr"'},{value:'"is"'},{value:'"at"'},{value:'"af"'},{value:'"ax"'},{value:'"al"'},{value:'"dz"'},{value:'"ad"'},{value:'"ao"'},{value:'"aq"'},{value:'"ag"'},{value:'"ar"'},{value:'"am"'},{value:'"aw"'},{value:'"sh-ac"'},{value:'"asean"'},{value:'"au"'},{value:'"az"'},{value:'"bs"'},{value:'"bh"'},{value:'"bd"'},{value:'"bb"'},{value:'"es-pv"'},{value:'"by"'},{value:'"be"'},{value:'"bz"'},{value:'"bj"'},{value:'"bm"'},{value:'"bt"'},{value:'"bo"'},{value:'"bq"'},{value:'"ba"'},{value:'"bw"'},{value:'"bv"'},{value:'"io"'},{value:'"bn"'},{value:'"bg"'},{value:'"bf"'},{value:'"bi"'},{value:'"cv"'},{value:'"kh"'},{value:'"cm"'},{value:'"ca"'},{value:'"ic"'},{value:'"es-ct"'},{value:'"ky"'},{value:'"cf"'},{value:'"cefta"'},{value:'"cl"'},{value:'"cn"'},{value:'"cx"'},{value:'"cp"'},{value:'"cc"'},{value:'"co"'},{value:'"km"'},{value:'"ck"'},{value:'"cr"'},{value:'"cu"'},{value:'"cw"'},{value:'"cy"'},{value:'"cz"'},{value:'"ci"'},{value:'"cd"'},{value:'"dk"'},{value:'"dg"'},{value:'"dj"'},{value:'"dm"'},{value:'"do"'},{value:'"eac"'},{value:'"ec"'},{value:'"eg"'},{value:'"sv"'},{value:'"gb-eng"'},{value:'"gq"'},{value:'"er"'},{value:'"ee"'},{value:'"sz"'},{value:'"et"'},{value:'"eu"'},{value:'"fk"'},{value:'"fo"'},{value:'"fm"'},{value:'"fj"'},{value:'"fi"'},{value:'"fr"'},{value:'"gf"'},{value:'"pf"'},{value:'"tf"'},{value:'"ga"'},{value:'"es-ga"'},{value:'"gm"'},{value:'"ge"'},{value:'"de"'},{value:'"gh"'},{value:'"gi"'},{value:'"gr"'},{value:'"gl"'},{value:'"gd"'},{value:'"gp"'},{value:'"gu"'},{value:'"gt"'},{value:'"gg"'},{value:'"gn"'},{value:'"gw"'},{value:'"gy"'},{value:'"ht"'},{value:'"hm"'},{value:'"va"'},{value:'"hn"'},{value:'"hk"'},{value:'"hu"'},{value:'"in"'},{value:'"ir"'},{value:'"iq"'},{value:'"ie"'},{value:'"im"'},{value:'"il"'},{value:'"it"'},{value:'"jm"'},{value:'"jp"'},{value:'"je"'},{value:'"jo"'},{value:'"kz"'},{value:'"ke"'},{value:'"ki"'},{value:'"xk"'},{value:'"kw"'},{value:'"kg"'},{value:'"la"'},{value:'"lv"'},{value:'"arab"'},{value:'"lb"'},{value:'"ls"'},{value:'"lr"'},{value:'"ly"'},{value:'"lt"'},{value:'"lu"'},{value:'"mo"'},{value:'"mg"'},{value:'"mw"'},{value:'"my"'},{value:'"mv"'},{value:'"ml"'},{value:'"mt"'},{value:'"mh"'},{value:'"mq"'},{value:'"mr"'},{value:'"mu"'},{value:'"yt"'},{value:'"mx"'},{value:'"md"'},{value:'"mc"'},{value:'"mn"'},{value:'"me"'},{value:'"ms"'},{value:'"ma"'},{value:'"mz"'},{value:'"mm"'},{value:'"na"'},{value:'"nr"'},{value:'"np"'},{value:'"nl"'},{value:'"nc"'},{value:'"nz"'},{value:'"ni"'},{value:'"ne"'},{value:'"ng"'},{value:'"nu"'},{value:'"nf"'},{value:'"kp"'},{value:'"mk"'},{value:'"gb-nir"'},{value:'"mp"'},{value:'"no"'},{value:'"om"'},{value:'"pc"'},{value:'"pk"'},{value:'"pw"'},{value:'"pa"'},{value:'"pg"'},{value:'"py"'},{value:'"pe"'},{value:'"ph"'},{value:'"pn"'},{value:'"pl"'},{value:'"pt"'},{value:'"pr"'},{value:'"qa"'},{value:'"cg"'},{value:'"ro"'},{value:'"ru"'},{value:'"rw"'},{value:'"re"'},{value:'"bl"'},{value:'"sh-hl"'},{value:'"sh"'},{value:'"kn"'},{value:'"lc"'},{value:'"mf"'},{value:'"pm"'},{value:'"vc"'},{value:'"ws"'},{value:'"sm"'},{value:'"st"'},{value:'"sa"'},{value:'"gb-sct"'},{value:'"sn"'},{value:'"rs"'},{value:'"sc"'},{value:'"sl"'},{value:'"sg"'},{value:'"sx"'},{value:'"sk"'},{value:'"si"'},{value:'"sb"'},{value:'"so"'},{value:'"za"'},{value:'"gs"'},{value:'"kr"'},{value:'"ss"'},{value:'"es"'},{value:'"lk"'},{value:'"ps"'},{value:'"sd"'},{value:'"sr"'},{value:'"sj"'},{value:'"se"'},{value:'"ch"'},{value:'"sy"'},{value:'"tw"'},{value:'"tj"'},{value:'"tz"'},{value:'"tl"'},{value:'"tg"'},{value:'"tk"'},{value:'"to"'},{value:'"tt"'},{value:'"sh-ta"'},{value:'"tn"'},{value:'"tm"'},{value:'"tc"'},{value:'"tv"'},{value:'"ug"'},{value:'"ua"'},{value:'"ae"'},{value:'"gb"'},{value:'"un"'},{value:'"um"'},{value:'"us"'},{value:'"uy"'},{value:'"uz"'},{value:'"vu"'},{value:'"ve"'},{value:'"vn"'},{value:'"vg"'},{value:'"vi"'},{value:'"gb-wls"'},{value:'"wf"'},{value:'"eh"'},{value:'"ye"'},{value:'"zm"'},{value:'"zw"'}]}},value:{defaultValue:null,description:"Unique identifier for this chip. Used for selection tracking",name:"value",required:!0,type:{name:"string"}},children:{defaultValue:null,description:"Content to display inside the chip",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"}]}},counter:{defaultValue:null,description:"Optional numeric counter to display alongside the chip label",name:"counter",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: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{b as M,y as a};

package/dist/assets/{MultiSelectChips.stories-D94TLaMf.js → MultiSelectChips.stories-DbfKSXnF.js}

@@ -1,4 +1,4 @@
-import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as Ye}from"./index-Cb9e4tly.js";import{M as p,a as h}from"./MultiSelectChips-Crsz1TpK.js";import{F as ta,a as T,b as Je,c as Qe,d as na}from"./TokyoUIEmojiFrowning-DTIcabpJ.js";import{F as ia}from"./index-DhCCT3uz.js";import{L as g}from"./LayoutFlex-JDgK8BCr.js";import{T as E}from"./Text-CjpUlaH0.js";import{L as sa}from"./Link-DdFAEBXD.js";import{d as oa}from"./styled-components.browser.esm-BgpGX317.js";import{H as la}from"./Heading-BLxyLk9f.js";import{f as ra,r as Xe,w as u,e,u as r,a as V}from"./index-Ctq3gFTp.js";import{T as B}from"./Tooltip-BbMZ4t9q.js";import{B as ca}from"./Button-DhteO3C6.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./createRequiredContext-9__lNQrK.js";import"./Icon-BkmQyVqb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./CountryFlag-BYnc9DA7.js";import"./getCountryFlagUrl-CP-PpZV_.js";import"./useMergeRefs-D_RfOOSs.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./layout-relative.module-f40KabMD.js";import"./text-centered-CznToR0o.js";import"./useHostname-Y3PlXofY.js";import"./index-Y0mVPtHg.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-CHDTbv7n.js";import"./PortalElementProvider-CxdFl3yP.js";import"./ButtonBase-B_gwKVAa.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./index-CC6DAVyL.js";const at={title:"components/Chips/MultiSelectChips",component:h,subcomponents:{MultiSelectChipsItem:p},parameters:{layout:"padded"},args:{"aria-label":"Select skills",defaultValue:["vocabulary"],onValueChange:ra(),items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},beforeEach:()=>{Xe()}},v={play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),c=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(["vocabulary","speaking"]),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(o),e(n.onValueChange).toHaveBeenCalledWith(["speaking"]),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})}};let L;const y={render:function({defaultValue:t,...n}){const[s,o]=Ye.useState(t);L=o;const l=c=>{var d;o(c),(d=n.onValueChange)==null||d.call(n,c)};return a.jsx(h,{...n,value:s,onValueChange:l})},play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),c=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(["vocabulary","speaking"]),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(o),e(n.onValueChange).toHaveBeenCalledWith(["speaking"]),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Change the value externally",async()=>{Xe(),L(["vocabulary","reading"]),await V(()=>{e(n.onValueChange).not.toHaveBeenCalled(),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","true")})})}},m={args:{items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking",disabled:!0},{value:"listening",label:"Listening",disabled:!0},{value:"reading",label:"Reading"}]},play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Speaking"}),l=s.getByRole("option",{name:"Vocabulary"});await t("Disabled chip must have disabled attribute",async()=>{e(o).toBeDisabled()}),await t("Disabled chip must not be selectable",async()=>{await r.click(o),e(n.onValueChange).not.toHaveBeenCalled(),e(l).toHaveAttribute("aria-selected","true")})}},b={args:{"aria-label":"Select availabilities",defaultValue:["morning"],items:[{value:"morning",label:"Morning",icon:a.jsx(T,{})},{value:"afternoon",label:"Afternoon",icon:a.jsx(Je,{})},{value:"evening",label:"Evening",icon:a.jsx(Qe,{})}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:"Morning"}),o=u(s).getByTestId("chip-icon");await t("Chip should render an icon when `icon` prop is passed",async()=>{e(o).toBeVisible()})}},w={args:{"aria-label":"Select languages to learn",defaultValue:["english"],items:[{value:"english",label:"English",counter:1247},{value:"spanish",label:"Spanish",counter:892},{value:"french",label:"French",counter:534},{value:"german",label:"German",counter:421},{value:"italian",label:"Italian",counter:287},{value:"portuguese",label:"Portuguese",counter:156}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:/^English/}),o=u(s).getByTestId("chip-counter");await t("Chip should render a counter when `counter` prop is passed",async()=>{e(o).toBeVisible(),e(o).toHaveTextContent("1247")})}},f={args:{"aria-label":"Select countries",defaultValue:["ua"],items:[{value:"ua",label:"Ukraine",countryFlagCode:"ua"},{value:"gb",label:"United Kingdom",countryFlagCode:"gb"},{value:"it",label:"Italy",countryFlagCode:"it"},{value:"es",label:"Spain",countryFlagCode:"es"},{value:"au",label:"Australia",countryFlagCode:"au"},{value:"br",label:"Brazil",countryFlagCode:"br"},{value:"eg",label:"Egypt",countryFlagCode:"eg"}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:"Ukraine"}),o=u(s).getByTestId("chip-country-flag");await t("Chip should render a flag when `flagCountryCode` prop is passed",async()=>{e(o).toBeVisible()})}},k={args:{"aria-label":"Fancy chips",items:[{value:"counter+icon",label:"Icon + Counter",icon:a.jsx(T,{}),counter:1247},{value:"counter+flag",label:"Flag + Counter",countryFlagCode:"ua",counter:1247},{value:"icon+flag",label:"Icon + Flag",icon:a.jsx(T,{}),countryFlagCode:"ua"}]},play:async({canvasElement:i})=>{const t=u(i),n=u(t.getByRole("option",{name:"Icon + Flag"}));e(n.getByTestId("chip-icon")).toBeVisible(),e(n.queryByTestId("chip-country-flag")).not.toBeInTheDocument()}},x=["2025-08-15T10:00Z","2025-08-16T12:00Z","2025-08-17T14:00Z"],C={args:{orientation:"vertical","aria-label":"Select time slots",defaultValue:x,items:x.map(i=>({value:i,label:a.jsx(ia,{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit",value:i}),dataset:{testid:i}}))},decorators:[i=>a.jsx("div",{style:{width:300,margin:"0 auto"},children:a.jsx(i,{})})],play:async({canvasElement:i,step:t})=>{const n=u(i),s=n.getByRole("listbox",{name:"Select time slots"}),o=n.getByTestId(x[0]),l=n.getByTestId(x[1]),c=n.getByTestId(x[2]);await t('Vertical chips should have `aria-orientation="vertical"`',async()=>{e(s).toHaveAttribute("aria-orientation","vertical")}),await t("Focus first chip",async()=>{o.focus()}),await t("Arrow down should focus second chip",async()=>{await r.keyboard("{ArrowDown}"),e(l).toHaveFocus()}),await t("Arrow down should focus third chip",async()=>{await r.keyboard("{ArrowDown}"),e(c).toHaveFocus()}),await t("Arrow down should focus first chip",async()=>{await r.keyboard("{ArrowDown}"),e(o).toHaveFocus()}),await t("Arrow up should focus third chip",async()=>{await r.keyboard("{ArrowUp}"),e(c).toHaveFocus()})}},S={render:i=>a.jsxs(g,{gap:"12",children:[a.jsx(h,{...i}),a.jsx(ca,{variant:"tertiary",size:"small",onClick:()=>alert("Show all"),children:"Show all"})]})},ea=[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"},{value:"writing",label:"Writing"},{value:"grammar",label:"Grammar"}],ua=[{value:"monday",label:"Monday"},{value:"tuesday",label:"Tuesday"},{value:"wednesday",label:"Wednesday"},{value:"thursday",label:"Thursday"},{value:"friday",label:"Friday"},{value:"saturday",label:"Saturday"},{value:"sunday",label:"Sunday"}],da=[{value:"morning",label:"Morning (6-12)",icon:a.jsx(T,{})},{value:"afternoon",label:"Afternoon (12-18)",icon:a.jsx(Je,{})},{value:"evening",label:"Evening (18-0)",icon:a.jsx(Qe,{})},{value:"night",label:"Night (0-6)",icon:a.jsx(na,{})}],I={render:function(t){return a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"64",children:[a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"What skills do you want to focus on?"}),a.jsx(h,{"aria-label":"Selected skills",items:ea})]}),a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"Which days work best for you?"}),a.jsx(h,{"aria-label":"Selected days of the week",items:ua})]}),a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"What times of day work for you?"}),a.jsx(h,{"aria-label":"Selected times of day",items:da})]})]})},play:async({canvasElement:i,step:t})=>{const n=u(i),s=u(n.getByRole("listbox",{name:"Selected skills"})),o=u(n.getByRole("listbox",{name:"Selected days of the week"})),l=s.getByRole("option",{name:"Vocabulary"}),c=s.getByRole("option",{name:"Speaking"}),d=s.getByRole("option",{name:"Grammar"}),aa=o.getByRole("option",{name:"Monday"});await t("Tab once to enter the component",async()=>{await r.tab(),e(l).toHaveFocus()}),await t("Next tab should focus second chip",async()=>{await r.tab(),e(aa).toHaveFocus()}),await t("Shift+Tab should focus first chips group again",async()=>{await r.tab({shift:!0}),e(l).toHaveFocus()}),await t("Right arrow should focus next chip in the group",async()=>{await r.keyboard("{ArrowRight}"),e(c).toHaveFocus()}),await t("Left arrow should focus previous chip in the group",async()=>{await r.keyboard("{ArrowLeft}"),e(l).toHaveFocus()}),await t("Left arrow should focus last chip if first chip is focused",async()=>{await r.keyboard("{ArrowLeft}"),e(d).toHaveFocus()}),await t("Right arrow should focus first chip if last chip is focused",async()=>{await r.keyboard("{ArrowRight}"),e(l).toHaveFocus()}),await t("Focus last chip",async()=>{await r.keyboard("{ArrowLeft}")}),await t("Tab to the next group",async()=>{await r.tab()}),await t("Shift+Tab to return to the first group, the last focused chip should be focused",async()=>{await r.tab({shift:!0}),e(d).toHaveFocus()})}},pa=oa.ul`
+import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as Ye}from"./index-Cb9e4tly.js";import{M as p,a as h}from"./MultiSelectChips-RUBRF3C_.js";import{F as ta,a as T,b as Je,c as Qe,d as na}from"./TokyoUIEmojiFrowning-DTIcabpJ.js";import{F as ia}from"./index-DWSmmBvQ.js";import{L as g}from"./LayoutFlex-DvBktCUC.js";import{T as E}from"./Text-D3i9pJx6.js";import{L as sa}from"./Link-D3ljGEp4.js";import{d as oa}from"./styled-components.browser.esm-BJAH3Qnc.js";import{H as la}from"./Heading-BKJX3nsJ.js";import{f as ra,r as Xe,w as u,e,u as r,a as V}from"./index-CY08ZUhp.js";import{T as B}from"./Tooltip--j8DCmLJ.js";import{B as ca}from"./Button-B80XIKcv.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./createRequiredContext-DqKkrhDd.js";import"./Icon-CkCFpqfD.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./CountryFlag-2OfagIL-.js";import"./getCountryFlagUrl-CP-PpZV_.js";import"./useMergeRefs-D_RfOOSs.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./layout-relative.module-f40KabMD.js";import"./text-centered-CznToR0o.js";import"./useHostname-Y3PlXofY.js";import"./index-Djnd5IhU.js";import"./index-De-a_lfy.js";import"./index-BPCsOyHr.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-B6FmGF3s.js";import"./PortalElementProvider-CxdFl3yP.js";import"./ButtonBase-BS1Kc_U5.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./index-CC6DAVyL.js";const at={title:"components/Chips/MultiSelectChips",component:h,subcomponents:{MultiSelectChipsItem:p},parameters:{layout:"padded"},args:{"aria-label":"Select skills",defaultValue:["vocabulary"],onValueChange:ra(),items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},beforeEach:()=>{Xe()}},v={play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),c=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(["vocabulary","speaking"]),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(o),e(n.onValueChange).toHaveBeenCalledWith(["speaking"]),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})}};let L;const y={render:function({defaultValue:t,...n}){const[s,o]=Ye.useState(t);L=o;const l=c=>{var d;o(c),(d=n.onValueChange)==null||d.call(n,c)};return a.jsx(h,{...n,value:s,onValueChange:l})},play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),c=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(["vocabulary","speaking"]),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(o),e(n.onValueChange).toHaveBeenCalledWith(["speaking"]),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Change the value externally",async()=>{Xe(),L(["vocabulary","reading"]),await V(()=>{e(n.onValueChange).not.toHaveBeenCalled(),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(c).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","true")})})}},m={args:{items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking",disabled:!0},{value:"listening",label:"Listening",disabled:!0},{value:"reading",label:"Reading"}]},play:async({canvasElement:i,step:t,args:n})=>{const s=u(i),o=s.getByRole("option",{name:"Speaking"}),l=s.getByRole("option",{name:"Vocabulary"});await t("Disabled chip must have disabled attribute",async()=>{e(o).toBeDisabled()}),await t("Disabled chip must not be selectable",async()=>{await r.click(o),e(n.onValueChange).not.toHaveBeenCalled(),e(l).toHaveAttribute("aria-selected","true")})}},b={args:{"aria-label":"Select availabilities",defaultValue:["morning"],items:[{value:"morning",label:"Morning",icon:a.jsx(T,{})},{value:"afternoon",label:"Afternoon",icon:a.jsx(Je,{})},{value:"evening",label:"Evening",icon:a.jsx(Qe,{})}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:"Morning"}),o=u(s).getByTestId("chip-icon");await t("Chip should render an icon when `icon` prop is passed",async()=>{e(o).toBeVisible()})}},w={args:{"aria-label":"Select languages to learn",defaultValue:["english"],items:[{value:"english",label:"English",counter:1247},{value:"spanish",label:"Spanish",counter:892},{value:"french",label:"French",counter:534},{value:"german",label:"German",counter:421},{value:"italian",label:"Italian",counter:287},{value:"portuguese",label:"Portuguese",counter:156}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:/^English/}),o=u(s).getByTestId("chip-counter");await t("Chip should render a counter when `counter` prop is passed",async()=>{e(o).toBeVisible(),e(o).toHaveTextContent("1247")})}},f={args:{"aria-label":"Select countries",defaultValue:["ua"],items:[{value:"ua",label:"Ukraine",countryFlagCode:"ua"},{value:"gb",label:"United Kingdom",countryFlagCode:"gb"},{value:"it",label:"Italy",countryFlagCode:"it"},{value:"es",label:"Spain",countryFlagCode:"es"},{value:"au",label:"Australia",countryFlagCode:"au"},{value:"br",label:"Brazil",countryFlagCode:"br"},{value:"eg",label:"Egypt",countryFlagCode:"eg"}]},play:async({canvasElement:i,step:t})=>{const s=u(i).getByRole("option",{name:"Ukraine"}),o=u(s).getByTestId("chip-country-flag");await t("Chip should render a flag when `flagCountryCode` prop is passed",async()=>{e(o).toBeVisible()})}},k={args:{"aria-label":"Fancy chips",items:[{value:"counter+icon",label:"Icon + Counter",icon:a.jsx(T,{}),counter:1247},{value:"counter+flag",label:"Flag + Counter",countryFlagCode:"ua",counter:1247},{value:"icon+flag",label:"Icon + Flag",icon:a.jsx(T,{}),countryFlagCode:"ua"}]},play:async({canvasElement:i})=>{const t=u(i),n=u(t.getByRole("option",{name:"Icon + Flag"}));e(n.getByTestId("chip-icon")).toBeVisible(),e(n.queryByTestId("chip-country-flag")).not.toBeInTheDocument()}},x=["2025-08-15T10:00Z","2025-08-16T12:00Z","2025-08-17T14:00Z"],C={args:{orientation:"vertical","aria-label":"Select time slots",defaultValue:x,items:x.map(i=>({value:i,label:a.jsx(ia,{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit",value:i}),dataset:{testid:i}}))},decorators:[i=>a.jsx("div",{style:{width:300,margin:"0 auto"},children:a.jsx(i,{})})],play:async({canvasElement:i,step:t})=>{const n=u(i),s=n.getByRole("listbox",{name:"Select time slots"}),o=n.getByTestId(x[0]),l=n.getByTestId(x[1]),c=n.getByTestId(x[2]);await t('Vertical chips should have `aria-orientation="vertical"`',async()=>{e(s).toHaveAttribute("aria-orientation","vertical")}),await t("Focus first chip",async()=>{o.focus()}),await t("Arrow down should focus second chip",async()=>{await r.keyboard("{ArrowDown}"),e(l).toHaveFocus()}),await t("Arrow down should focus third chip",async()=>{await r.keyboard("{ArrowDown}"),e(c).toHaveFocus()}),await t("Arrow down should focus first chip",async()=>{await r.keyboard("{ArrowDown}"),e(o).toHaveFocus()}),await t("Arrow up should focus third chip",async()=>{await r.keyboard("{ArrowUp}"),e(c).toHaveFocus()})}},S={render:i=>a.jsxs(g,{gap:"12",children:[a.jsx(h,{...i}),a.jsx(ca,{variant:"tertiary",size:"small",onClick:()=>alert("Show all"),children:"Show all"})]})},ea=[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"},{value:"writing",label:"Writing"},{value:"grammar",label:"Grammar"}],ua=[{value:"monday",label:"Monday"},{value:"tuesday",label:"Tuesday"},{value:"wednesday",label:"Wednesday"},{value:"thursday",label:"Thursday"},{value:"friday",label:"Friday"},{value:"saturday",label:"Saturday"},{value:"sunday",label:"Sunday"}],da=[{value:"morning",label:"Morning (6-12)",icon:a.jsx(T,{})},{value:"afternoon",label:"Afternoon (12-18)",icon:a.jsx(Je,{})},{value:"evening",label:"Evening (18-0)",icon:a.jsx(Qe,{})},{value:"night",label:"Night (0-6)",icon:a.jsx(na,{})}],I={render:function(t){return a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"64",children:[a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"What skills do you want to focus on?"}),a.jsx(h,{"aria-label":"Selected skills",items:ea})]}),a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"Which days work best for you?"}),a.jsx(h,{"aria-label":"Selected days of the week",items:ua})]}),a.jsxs(g,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(E,{variant:"large-semibold",children:"What times of day work for you?"}),a.jsx(h,{"aria-label":"Selected times of day",items:da})]})]})},play:async({canvasElement:i,step:t})=>{const n=u(i),s=u(n.getByRole("listbox",{name:"Selected skills"})),o=u(n.getByRole("listbox",{name:"Selected days of the week"})),l=s.getByRole("option",{name:"Vocabulary"}),c=s.getByRole("option",{name:"Speaking"}),d=s.getByRole("option",{name:"Grammar"}),aa=o.getByRole("option",{name:"Monday"});await t("Tab once to enter the component",async()=>{await r.tab(),e(l).toHaveFocus()}),await t("Next tab should focus second chip",async()=>{await r.tab(),e(aa).toHaveFocus()}),await t("Shift+Tab should focus first chips group again",async()=>{await r.tab({shift:!0}),e(l).toHaveFocus()}),await t("Right arrow should focus next chip in the group",async()=>{await r.keyboard("{ArrowRight}"),e(c).toHaveFocus()}),await t("Left arrow should focus previous chip in the group",async()=>{await r.keyboard("{ArrowLeft}"),e(l).toHaveFocus()}),await t("Left arrow should focus last chip if first chip is focused",async()=>{await r.keyboard("{ArrowLeft}"),e(d).toHaveFocus()}),await t("Right arrow should focus first chip if last chip is focused",async()=>{await r.keyboard("{ArrowRight}"),e(l).toHaveFocus()}),await t("Focus last chip",async()=>{await r.keyboard("{ArrowLeft}")}),await t("Tab to the next group",async()=>{await r.tab()}),await t("Shift+Tab to return to the first group, the last focused chip should be focused",async()=>{await r.tab({shift:!0}),e(d).toHaveFocus()})}},pa=oa.ul`
     all: unset;
     list-style: none;
     display: flex;

package/dist/assets/{NumberField-BClPzJbf.js → NumberField-B95TvbPY.js}

@@ -1,6 +1,6 @@
-import{j as u}from"./jsx-runtime-BTJTZTIL.js";import{r as V}from"./index-Cb9e4tly.js";import{F as g}from"./FormControl-D9rxeKMc.js";import{w as H}from"./componentNames-NXEPEzbR.js";import{I as L}from"./Input-UdhYxppR.js";const t=V.forwardRef(function({id:i,label:d,description:s,error:o,required:m,inputDataset:p,dataset:v,hideLabel:f,onClick:c,onValueChange:e,onChange:a,hasError:y,useLegacyRequiredLabel:b,className:I,style:R,...h},q){const E=l=>{a==null||a(l);const n=l.target.value;e==null||e(n?Number(n):void 0)};return u.jsx(g,{id:i,label:d,description:s,error:o,hasError:y,required:m,dataset:v,hideLabel:f,onClick:c,useLegacyRequiredLabel:b,preplyDsComponent:H.NumberField,children:u.jsx(L,{...h,type:"number",ref:q,dataset:p,onChange:E})})});try{t.displayName="NumberField",t.__docgenInfo={description:"",displayName:"NumberField",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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"}]}},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> & MouseEventHandler<HTMLInputElement>"}]}},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"}]}},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"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
-indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+import{j as u}from"./jsx-runtime-BTJTZTIL.js";import{r as V}from"./index-Cb9e4tly.js";import{F as g}from"./FormControl-CPKPJ97_.js";import{w as H}from"./componentNames-NXEPEzbR.js";import{I as L}from"./Input-DeHbbC7g.js";const t=V.forwardRef(function({id:i,label:d,description:s,error:o,required:m,inputDataset:p,dataset:v,hideLabel:f,onClick:c,onValueChange:e,onChange:a,hasError:y,useLegacyRequiredLabel:b,className:I,style:R,...h},q){const E=l=>{a==null||a(l);const n=l.target.value;e==null||e(n?Number(n):void 0)};return u.jsx(g,{id:i,label:d,description:s,error:o,hasError:y,required:m,dataset:v,hideLabel:f,onClick:c,useLegacyRequiredLabel:b,preplyDsComponent:H.NumberField,children:u.jsx(L,{...h,type:"number",ref:q,dataset:p,onChange:E})})});try{t.displayName="NumberField",t.__docgenInfo={description:"",displayName:"NumberField",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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> & MouseEventHandler<HTMLInputElement>"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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"}]}},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"}]}},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"}]}},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"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},defaultValue:{defaultValue:null,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 | undefined) => void"}]}},min:{defaultValue:null,description:"",name:"min",required:!1,type:{name:"enum",value:[{value:"number"}]}},max:{defaultValue:null,description:"",name:"max",required:!1,type:{name:"enum",value:[{value:"number"}]}},step:{defaultValue:null,description:"",name:"step",required:!1,type:{name:"enum",value:[{value:"number"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",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: 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{t as N};
+@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:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},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>"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},defaultValue:{defaultValue:null,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 | undefined) => void"}]}},min:{defaultValue:null,description:"",name:"min",required:!1,type:{name:"enum",value:[{value:"number"}]}},max:{defaultValue:null,description:"",name:"max",required:!1,type:{name:"enum",value:[{value:"number"}]}},step:{defaultValue:null,description:"",name:"step",required:!1,type:{name:"enum",value:[{value:"number"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",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: 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{t as N};

package/dist/assets/{NumberField.stories-Cl5bAyRn.js → NumberField.stories-CEV8efH2.js}

@@ -1,4 +1,4 @@
-import{j as g}from"./jsx-runtime-BTJTZTIL.js";import{r as re}from"./index-Cb9e4tly.js";import{a as se}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{f as r,w as x,e as n,u as w}from"./index-Ctq3gFTp.js";import{F as te}from"./TokyoUIPhone-CvuBM6jb.js";import{F as ie}from"./TokyoUIAttach-BWl7Jkq1.js";import{I as ne}from"./Icon-BkmQyVqb.js";import{N as ae}from"./NumberField-BClPzJbf.js";import{F as ce}from"./FieldButton-ChB_zwFu.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./FormControl-D9rxeKMc.js";import"./index-BlMeVLsf.js";import"./index-DhCCT3uz.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-CToTEy-z.js";import"./Input-UdhYxppR.js";import"./InputContainer-B1hqJyx0.js";const qe={title:"components/NumberField",component:ae,args:{name:"number",label:"Number",defaultValue:void 0,placeholder:"Enter a number",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onChange:r(),onValueChange:r(),onBlur:r(),onFocus:r(),onClick:r(),onCopy:r(),onKeyDown:r(),onKeyUp:r(),onPaste:r()}},c={play:async({canvasElement:a,step:e,args:t})=>{const o=x(a),i=o.getByTestId("field"),s=o.getByTestId("input");await e("it should render correct label",async()=>{const oe=x(i).getByTestId("label");n(oe).toHaveTextContent("Number • Optional"),n(s).toHaveAccessibleName("Number")}),await e("it should call onFocus when the input is focused",async()=>{s.focus(),n(t.onFocus).toHaveBeenCalled()}),await e("it should call callback when the value changes",async()=>{await w.type(s,"42"),n(t.onValueChange).toHaveBeenCalledWith(42),n(t.onChange).toHaveBeenCalled()}),await e("it should call onBlur when the input is blurred",async()=>{await w.keyboard("{tab}"),n(t.onBlur).toHaveBeenCalled()}),await e("it should render the dataset props",async()=>{n(i).toHaveAttribute("data-testid","field"),n(i).toHaveAttribute("data-foo","bar"),n(s).toHaveAttribute("data-testid","input"),n(s).toHaveAttribute("data-foo","bar")})}},l={render:function(e){const[t,o]=re.useState(e.value);return g.jsx(ae,{...e,value:t,onChange:i=>{var s;o(Number(i.target.value)),(s=e.onChange)==null||s.call(e,i)}})},args:{label:"Controlled NumberField",placeholder:"Enter a number...",value:42},play:async({canvas:a,step:e})=>{await e("it should render the correct initial value",async()=>{const t=a.getByTestId("input");await n(t).toHaveValue(42)}),await e("it should update the value when the user types",async()=>{const t=a.getByTestId("input");await w.clear(t),await w.type(t,"100"),n(t).toHaveValue(100)})}},u={args:{icon:g.jsx(ne,{svg:te,dataset:{testid:"icon"}})},play:async({canvas:a,step:e})=>{await e("it should render the icon",async()=>{const t=a.getByTestId("icon");n(t).toBeInTheDocument()})}},d={args:{description:"Enter a valid number"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("description");await e("it should render the description",async()=>{n(t).toHaveAccessibleDescription("Enter a valid number"),n(o).toHaveTextContent("Enter a valid number")})}},p={args:{required:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("label");await e("it should render correct label",async()=>{n(t).toHaveAccessibleName("Number"),n(o).toHaveTextContent("Number")}),await e("it should render required attribute",async()=>{n(t).toHaveAttribute("required")})}},m={args:{hideLabel:!0},play:async({canvas:a,step:e})=>{await e("it should render correct a11y label",async()=>{const t=a.getByTestId("input");n(t).toHaveAccessibleName("Number")})}},b={args:{error:"This is an error message"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("error");await e("it should render the error message",async()=>{n(t).toHaveAccessibleErrorMessage("This is an error message"),n(o).toHaveTextContent("This is an error message")})}},h={args:{disabled:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the disabled input",async()=>{n(t).toHaveAttribute("disabled")})}},y={args:{readOnly:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the read only input",async()=>{n(t).toHaveAttribute("readonly")})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Number of lessons",placeholder:"How about 3?",description:"These lessons will be scheduled automatically"},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"number"},defaultValue:{control:"number"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},readOnly:{control:"boolean"},min:{control:"number"},max:{control:"number"},step:{control:"number"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":g.jsx(ne,{svg:te})},control:"select"},button:{options:["None","With Button"],mapping:{None:void 0,"With Button":g.jsx(ce,{svg:ie,assistiveText:"Do the thing",onClick:se("field button clicked")})},control:"select"},maxLength:{control:"number"},hasError:{table:{disable:!0}}}};var B,T,H,f,I;c.parameters={...c.parameters,docs:{...(B=c.parameters)==null?void 0:B.docs,source:{originalSource:`{
+import{j as g}from"./jsx-runtime-BTJTZTIL.js";import{r as re}from"./index-Cb9e4tly.js";import{a as se}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{f as r,w as x,e as n,u as w}from"./index-CY08ZUhp.js";import{F as te}from"./TokyoUIPhone-CvuBM6jb.js";import{F as ie}from"./TokyoUIAttach-BWl7Jkq1.js";import{I as ne}from"./Icon-CkCFpqfD.js";import{N as ae}from"./NumberField-B95TvbPY.js";import{F as ce}from"./FieldButton-ChB_zwFu.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./FormControl-CPKPJ97_.js";import"./index-BlMeVLsf.js";import"./index-DWSmmBvQ.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-CSdaKtIj.js";import"./Input-DeHbbC7g.js";import"./InputContainer-B1hqJyx0.js";const qe={title:"components/NumberField",component:ae,args:{name:"number",label:"Number",defaultValue:void 0,placeholder:"Enter a number",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onChange:r(),onValueChange:r(),onBlur:r(),onFocus:r(),onClick:r(),onCopy:r(),onKeyDown:r(),onKeyUp:r(),onPaste:r()}},c={play:async({canvasElement:a,step:e,args:t})=>{const o=x(a),i=o.getByTestId("field"),s=o.getByTestId("input");await e("it should render correct label",async()=>{const oe=x(i).getByTestId("label");n(oe).toHaveTextContent("Number • Optional"),n(s).toHaveAccessibleName("Number")}),await e("it should call onFocus when the input is focused",async()=>{s.focus(),n(t.onFocus).toHaveBeenCalled()}),await e("it should call callback when the value changes",async()=>{await w.type(s,"42"),n(t.onValueChange).toHaveBeenCalledWith(42),n(t.onChange).toHaveBeenCalled()}),await e("it should call onBlur when the input is blurred",async()=>{await w.keyboard("{tab}"),n(t.onBlur).toHaveBeenCalled()}),await e("it should render the dataset props",async()=>{n(i).toHaveAttribute("data-testid","field"),n(i).toHaveAttribute("data-foo","bar"),n(s).toHaveAttribute("data-testid","input"),n(s).toHaveAttribute("data-foo","bar")})}},l={render:function(e){const[t,o]=re.useState(e.value);return g.jsx(ae,{...e,value:t,onChange:i=>{var s;o(Number(i.target.value)),(s=e.onChange)==null||s.call(e,i)}})},args:{label:"Controlled NumberField",placeholder:"Enter a number...",value:42},play:async({canvas:a,step:e})=>{await e("it should render the correct initial value",async()=>{const t=a.getByTestId("input");await n(t).toHaveValue(42)}),await e("it should update the value when the user types",async()=>{const t=a.getByTestId("input");await w.clear(t),await w.type(t,"100"),n(t).toHaveValue(100)})}},u={args:{icon:g.jsx(ne,{svg:te,dataset:{testid:"icon"}})},play:async({canvas:a,step:e})=>{await e("it should render the icon",async()=>{const t=a.getByTestId("icon");n(t).toBeInTheDocument()})}},d={args:{description:"Enter a valid number"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("description");await e("it should render the description",async()=>{n(t).toHaveAccessibleDescription("Enter a valid number"),n(o).toHaveTextContent("Enter a valid number")})}},p={args:{required:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("label");await e("it should render correct label",async()=>{n(t).toHaveAccessibleName("Number"),n(o).toHaveTextContent("Number")}),await e("it should render required attribute",async()=>{n(t).toHaveAttribute("required")})}},m={args:{hideLabel:!0},play:async({canvas:a,step:e})=>{await e("it should render correct a11y label",async()=>{const t=a.getByTestId("input");n(t).toHaveAccessibleName("Number")})}},b={args:{error:"This is an error message"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("error");await e("it should render the error message",async()=>{n(t).toHaveAccessibleErrorMessage("This is an error message"),n(o).toHaveTextContent("This is an error message")})}},h={args:{disabled:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the disabled input",async()=>{n(t).toHaveAttribute("disabled")})}},y={args:{readOnly:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the read only input",async()=>{n(t).toHaveAttribute("readonly")})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Number of lessons",placeholder:"How about 3?",description:"These lessons will be scheduled automatically"},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"number"},defaultValue:{control:"number"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},readOnly:{control:"boolean"},min:{control:"number"},max:{control:"number"},step:{control:"number"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":g.jsx(ne,{svg:te})},control:"select"},button:{options:["None","With Button"],mapping:{None:void 0,"With Button":g.jsx(ce,{svg:ie,assistiveText:"Do the thing",onClick:se("field button clicked")})},control:"select"},maxLength:{control:"number"},hasError:{table:{disable:!0}}}};var B,T,H,f,I;c.parameters={...c.parameters,docs:{...(B=c.parameters)==null?void 0:B.docs,source:{originalSource:`{
   play: async ({
     canvasElement,
     step,

package/dist/assets/{ObserveIntersection-B2ZY3pJT.js → ObserveIntersection-Ds88YwOI.js}

@@ -5,4 +5,4 @@ Triggers a callback when the wrapped component intersects with the viewport.
 This can be useful in several use cases. Examples:
 
 - Track an experiment, once a certain component scrolls into view.
-- Trigger an animation, or a feature (e.g.: onboarding instructions).`,displayName:"ObserveIntersection",props:{onIntersect:{defaultValue:null,description:"",name:"onIntersect",required:!0,type:{name:"() => 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:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{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{o as O};
+- Trigger an animation, or a feature (e.g.: onboarding instructions).`,displayName:"ObserveIntersection",props:{onIntersect:{defaultValue:null,description:"",name:"onIntersect",required:!0,type:{name:"() => 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{o as O};

package/dist/assets/{ObserveIntersection.stories-C8C2l5zu.js → ObserveIntersection.stories-DAfiJTnQ.js}

@@ -1,4 +1,4 @@
-import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as a}from"./index-Cb9e4tly.js";import{O as i}from"./ObserveIntersection-B2ZY3pJT.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./componentNames-NXEPEzbR.js";const g={title:"components/ObserveIntersection",component:i,parameters:{tags:["!test"],chromatic:{disableSnapshot:!0}}},e=()=>{const[o,c]=a.useState(!1);return t.jsxs("div",{tabIndex:0,style:{height:"200px",overflowY:"scroll",position:"relative"},children:[t.jsx("div",{style:{position:"sticky",top:"2px"},children:o?"Intersected":"Scroll down to intersect"}),t.jsx("div",{style:{height:"400px",display:"flex",alignItems:"end"},children:t.jsx(i,{onIntersect:()=>c(!0),children:"Observer"})})]})};e.storyName="ObserveIntersection";var s,n,r;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`() => {
+import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as a}from"./index-Cb9e4tly.js";import{O as i}from"./ObserveIntersection-Ds88YwOI.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./componentNames-NXEPEzbR.js";const g={title:"components/ObserveIntersection",component:i,parameters:{tags:["!test"],chromatic:{disableSnapshot:!0}}},e=()=>{const[o,c]=a.useState(!1);return t.jsxs("div",{tabIndex:0,style:{height:"200px",overflowY:"scroll",position:"relative"},children:[t.jsx("div",{style:{position:"sticky",top:"2px"},children:o?"Intersected":"Scroll down to intersect"}),t.jsx("div",{style:{height:"400px",display:"flex",alignItems:"end"},children:t.jsx(i,{onIntersect:()=>c(!0),children:"Observer"})})]})};e.storyName="ObserveIntersection";var s,n,r;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`() => {
   const [isIntersecting, setIsIntersecting] = useState(false);
   return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- This element is interactive; it's scrollable.

package/dist/assets/{OnboardingTooltip-Bc-Jj706.js → OnboardingTooltip-C5HCJ0E7.js}

@@ -1,4 +1,4 @@
-import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as n}from"./index-Cb9e4tly.js";import{R as _,A as q,P as x,C as O,a as N,b as E}from"./index-fALSPXxe.js";import{F as k}from"./TokyoUIClose-thK8sk63.js";import{I as P}from"./Icon-BkmQyVqb.js";import{T as j}from"./Text-CjpUlaH0.js";import{B as D}from"./Button-DhteO3C6.js";import{H as T}from"./Heading-BLxyLk9f.js";import{u as S}from"./index-DhCCT3uz.js";import{g as L}from"./shared-strings-Bg7tW4tm.js";import{u as M}from"./PortalElementProvider-CxdFl3yP.js";import{g as H}from"./index-DdzHuZ-Y.js";import{w as X}from"./componentNames-NXEPEzbR.js";import{M as J}from"./message-CToTEy-z.js";const B="content__KHgp9",F="header__CaLti",U="close__3s-VD",A="footer__X5qXF",G="arrow__0pg-s",o={content:B,header:F,close:U,footer:A,arrow:G},z=e=>{e.scrollIntoViewIfNeeded?e.scrollIntoViewIfNeeded(!1):e.scrollIntoView({behavior:"auto",block:"nearest",inline:"nearest"})},m=({open:e,onOpenChange:i,disabled:r,title:u,text:s,children:a,side:l,dataset:h,actionLabel:b=t.jsx(J,{id:"preply-ds.onboardingTooltip.actionLabel",defaultMessage:"Got it",description:"Default onboarding tooltip action label. Used to acknowledge and close the tooltip."}),actionOnClick:g,actionHref:y,counter:C,autoScroll:v=!0})=>{const{formatMessage:I}=S(),w=M(),f=n.useId(),V=n.useId(),d=n.useId(),c=n.useRef(null);return n.useEffect(()=>{e&&c.current&&v&&z(c.current)},[v,e]),r?a:t.jsxs(_,{open:e,onOpenChange:i,children:[t.jsx(q,{ref:c,id:d,asChild:!0,children:a}),t.jsx(x,{container:w,children:t.jsxs(O,{onInteractOutside:R=>{R.preventDefault()},side:l,className:o.content,"aria-labelledby":f,"aria-describedby":`${d} ${V}`,...H(h,{preplyDsComponent:X.OnboardingTooltip}),children:[t.jsxs("div",{className:o.header,children:[t.jsx(N,{className:o.close,"aria-label":I(L.close),"data-testid":"close",children:t.jsx(P,{accent:"inverted",svg:k})}),t.jsx(T,{tag:"h1",variant:"small",accent:"inverted",id:f,"aria-describedby":d,children:u})]}),t.jsx(j,{variant:"default-regular",accent:"inverted",children:s}),t.jsxs("div",{className:o.footer,children:[C,t.jsx(D,{variant:"inverted",size:"small",onClick:g,href:y,dataset:{testid:"action"},wrap:!0,children:b})]}),t.jsx(E,{"aria-hidden":!0,className:o.arrow,width:18,height:11})]})})]})},p=e=>{const[i,r]=n.useState(!0),u=a=>{var l;a||(l=e.onClose)==null||l.call(e),r(a)},s=()=>{var a,l;(a=e.actionOnClick)==null||a.call(e),r(!1),(l=e.onClose)==null||l.call(e)};return t.jsx(m,{...e,open:i,onOpenChange:u,actionOnClick:s})};try{m.displayName="InternalOnboardingTooltip",m.__docgenInfo={description:"",displayName:"InternalOnboardingTooltip",props:{title:{defaultValue:null,description:"",name:"title",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"}]}},text:{defaultValue:null,description:"",name:"text",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"}]}},disabled:{defaultValue:null,description:"Disables tooltip completely",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClose:{defaultValue:null,description:"Called when the tooltip is closed",name:"onClose",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},actionLabel:{defaultValue:{value:`(
+import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as n}from"./index-Cb9e4tly.js";import{R as _,A as q,P as x,C as O,a as N,b as E}from"./index-ZUOsecCC.js";import{F as k}from"./TokyoUIClose-thK8sk63.js";import{I as P}from"./Icon-CkCFpqfD.js";import{T as j}from"./Text-D3i9pJx6.js";import{B as D}from"./Button-B80XIKcv.js";import{H as T}from"./Heading-BKJX3nsJ.js";import{u as S}from"./index-DWSmmBvQ.js";import{g as L}from"./shared-strings-DFzxd8lM.js";import{u as M}from"./PortalElementProvider-CxdFl3yP.js";import{g as H}from"./index-DdzHuZ-Y.js";import{w as X}from"./componentNames-NXEPEzbR.js";import{M as J}from"./message-CSdaKtIj.js";const B="content__KHgp9",F="header__CaLti",U="close__3s-VD",A="footer__X5qXF",G="arrow__0pg-s",o={content:B,header:F,close:U,footer:A,arrow:G},z=e=>{e.scrollIntoViewIfNeeded?e.scrollIntoViewIfNeeded(!1):e.scrollIntoView({behavior:"auto",block:"nearest",inline:"nearest"})},m=({open:e,onOpenChange:i,disabled:r,title:u,text:s,children:a,side:l,dataset:h,actionLabel:b=t.jsx(J,{id:"preply-ds.onboardingTooltip.actionLabel",defaultMessage:"Got it",description:"Default onboarding tooltip action label. Used to acknowledge and close the tooltip."}),actionOnClick:g,actionHref:y,counter:C,autoScroll:v=!0})=>{const{formatMessage:I}=S(),w=M(),f=n.useId(),V=n.useId(),d=n.useId(),c=n.useRef(null);return n.useEffect(()=>{e&&c.current&&v&&z(c.current)},[v,e]),r?a:t.jsxs(_,{open:e,onOpenChange:i,children:[t.jsx(q,{ref:c,id:d,asChild:!0,children:a}),t.jsx(x,{container:w,children:t.jsxs(O,{onInteractOutside:R=>{R.preventDefault()},side:l,className:o.content,"aria-labelledby":f,"aria-describedby":`${d} ${V}`,...H(h,{preplyDsComponent:X.OnboardingTooltip}),children:[t.jsxs("div",{className:o.header,children:[t.jsx(N,{className:o.close,"aria-label":I(L.close),"data-testid":"close",children:t.jsx(P,{accent:"inverted",svg:k})}),t.jsx(T,{tag:"h1",variant:"small",accent:"inverted",id:f,"aria-describedby":d,children:u})]}),t.jsx(j,{variant:"default-regular",accent:"inverted",children:s}),t.jsxs("div",{className:o.footer,children:[C,t.jsx(D,{variant:"inverted",size:"small",onClick:g,href:y,dataset:{testid:"action"},wrap:!0,children:b})]}),t.jsx(E,{"aria-hidden":!0,className:o.arrow,width:18,height:11})]})})]})},p=e=>{const[i,r]=n.useState(!0),u=a=>{var l;a||(l=e.onClose)==null||l.call(e),r(a)},s=()=>{var a,l;(a=e.actionOnClick)==null||a.call(e),r(!1),(l=e.onClose)==null||l.call(e)};return t.jsx(m,{...e,open:i,onOpenChange:u,actionOnClick:s})};try{m.displayName="InternalOnboardingTooltip",m.__docgenInfo={description:"",displayName:"InternalOnboardingTooltip",props:{title:{defaultValue:null,description:"",name:"title",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"}]}},text:{defaultValue:null,description:"",name:"text",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"}]}},disabled:{defaultValue:null,description:"Disables tooltip completely",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClose:{defaultValue:null,description:"Called when the tooltip is closed",name:"onClose",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},actionLabel:{defaultValue:{value:`(
         <FormattedMessage
             id="preply-ds.onboardingTooltip.actionLabel"
             defaultMessage="Got it"

package/dist/assets/{OnboardingTooltip.stories-1_99oJ2j.js → OnboardingTooltip.stories-Cn1uymI0.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{O as u}from"./OnboardingTooltip-Bc-Jj706.js";import{I as g}from"./IconButton-CqTm2jIV.js";import{F as x}from"./TokyoUIFav-DOVerCtW.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-fALSPXxe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-CHDTbv7n.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BkmQyVqb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Text-CjpUlaH0.js";import"./text-centered-CznToR0o.js";import"./Button-DhteO3C6.js";import"./ButtonBase-B_gwKVAa.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-BLxyLk9f.js";import"./index-DhCCT3uz.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Bg7tW4tm.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CToTEy-z.js";const oe={title:"Components/OnboardingTooltip",component:u,parameters:{docs:{story:{inline:!1,height:250},description:{component:"Are you looking for a step-by-step tour? Check out [OnboardingTour](/docs/components-onboardingtour--docs)"}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},h=t=>[!1,!1],f=t=>a=>{},o=()=>{const[t,a]=h(),v=f();return e.jsx(u,{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:a||t,onClose:()=>v(!0),children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})})};o.storyName="OnboardingTooltip";const r={tags:["!autodocs"],args:{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:!1,onClose:()=>{},children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})},argTypes:{title:{control:"text"},text:{control:"text"},actionLabel:{control:"text"},actionOnClick:{control:!1},actionHref:{control:"text"},disabled:{control:"boolean"},dataset:{control:"object"},onClose:{control:!1},children:{control:!1}},parameters:{docs:{story:{height:450}},chromatic:{disableSnapshot:!0}},decorators:[t=>e.jsx("div",{style:{minHeight:"100vh",display:"flex"},children:e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})})]};var i,n,s,l,c;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`() => {
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{O as u}from"./OnboardingTooltip-C5HCJ0E7.js";import{I as g}from"./IconButton-B-3o70a9.js";import{F as x}from"./TokyoUIFav-DOVerCtW.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-ZUOsecCC.js";import"./index-De-a_lfy.js";import"./index-BPCsOyHr.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-B6FmGF3s.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-CkCFpqfD.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Text-D3i9pJx6.js";import"./text-centered-CznToR0o.js";import"./Button-B80XIKcv.js";import"./ButtonBase-BS1Kc_U5.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-BKJX3nsJ.js";import"./index-DWSmmBvQ.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-DFzxd8lM.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CSdaKtIj.js";const oe={title:"Components/OnboardingTooltip",component:u,parameters:{docs:{story:{inline:!1,height:250},description:{component:"Are you looking for a step-by-step tour? Check out [OnboardingTour](/docs/components-onboardingtour--docs)"}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},h=t=>[!1,!1],f=t=>a=>{},o=()=>{const[t,a]=h(),v=f();return e.jsx(u,{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:a||t,onClose:()=>v(!0),children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})})};o.storyName="OnboardingTooltip";const r={tags:["!autodocs"],args:{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:!1,onClose:()=>{},children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})},argTypes:{title:{control:"text"},text:{control:"text"},actionLabel:{control:"text"},actionOnClick:{control:!1},actionHref:{control:"text"},disabled:{control:"boolean"},dataset:{control:"object"},onClose:{control:!1},children:{control:!1}},parameters:{docs:{story:{height:450}},chromatic:{disableSnapshot:!0}},decorators:[t=>e.jsx("div",{style:{minHeight:"100vh",display:"flex"},children:e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})})]};var i,n,s,l,c;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`() => {
   const [wasTooltipSeen, loading] = useIsFeatureActive('new-feature');
   const setTooltipSeen = useToggleFeature('new-feature');
   return <OnboardingTooltip title="New Feature Available!" text="We've added an exciting new feature to enhance your experience." disabled={loading || wasTooltipSeen} onClose={() => setTooltipSeen(true)}>

package/dist/assets/{OnboardingTooltip.tests.stories-CIUh12pG.js → OnboardingTooltip.tests.stories-DLvBh09g.js}

@@ -1,4 +1,4 @@
-import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{O as x}from"./OnboardingTooltip-Bc-Jj706.js";import{I}from"./IconButton-CqTm2jIV.js";import{F as f}from"./TokyoUIFav-DOVerCtW.js";import{w as s,a as r,e as n,u as m}from"./index-Ctq3gFTp.js";import{B as k}from"./Button-DhteO3C6.js";import{L as F}from"./LayoutFlex-JDgK8BCr.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-fALSPXxe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-CHDTbv7n.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BkmQyVqb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Text-CjpUlaH0.js";import"./text-centered-CznToR0o.js";import"./Heading-BLxyLk9f.js";import"./index-DhCCT3uz.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Bg7tW4tm.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CToTEy-z.js";import"./ButtonBase-B_gwKVAa.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-f40KabMD.js";const yt={title:"Components/OnboardingTooltip/Tests",component:x,parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[e=>a.jsx("div",{style:{margin:"100px 0"},children:e()})],args:{title:"Title",text:"Body text",actionLabel:"Action label",disabled:!1,onClose:()=>{},dataset:{testid:"tooltip"},children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})}},c={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("close");return m.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}},l={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("action");return m.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}};function E(e){return new Promise(o=>setTimeout(o,e))}const p={render:e=>a.jsxs(F,{gap:"24",direction:"column",children:[a.jsx(k,{children:"Click outside the tooltip"}),a.jsx(x,{...e,children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})})]}),play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("click outside the tooltip",()=>{const t=i.getByText("Click outside the tooltip");return m.click(t)}),await o("check the tooltip remain open",async()=>{await E(1e3);const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}};var d,y,w;c.parameters={...c.parameters,docs:{...(d=c.parameters)==null?void 0:d.docs,source:{originalSource:`{
+import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{O as x}from"./OnboardingTooltip-C5HCJ0E7.js";import{I}from"./IconButton-B-3o70a9.js";import{F as f}from"./TokyoUIFav-DOVerCtW.js";import{w as s,a as r,e as n,u as m}from"./index-CY08ZUhp.js";import{B as k}from"./Button-B80XIKcv.js";import{L as F}from"./LayoutFlex-DvBktCUC.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-ZUOsecCC.js";import"./index-De-a_lfy.js";import"./index-BPCsOyHr.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-B6FmGF3s.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-CkCFpqfD.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Text-D3i9pJx6.js";import"./text-centered-CznToR0o.js";import"./Heading-BKJX3nsJ.js";import"./index-DWSmmBvQ.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-DFzxd8lM.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CSdaKtIj.js";import"./ButtonBase-BS1Kc_U5.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-f40KabMD.js";const yt={title:"Components/OnboardingTooltip/Tests",component:x,parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[e=>a.jsx("div",{style:{margin:"100px 0"},children:e()})],args:{title:"Title",text:"Body text",actionLabel:"Action label",disabled:!1,onClose:()=>{},dataset:{testid:"tooltip"},children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})}},c={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("close");return m.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}},l={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("action");return m.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}};function E(e){return new Promise(o=>setTimeout(o,e))}const p={render:e=>a.jsxs(F,{gap:"24",direction:"column",children:[a.jsx(k,{children:"Click outside the tooltip"}),a.jsx(x,{...e,children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})})]}),play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("click outside the tooltip",()=>{const t=i.getByText("Click outside the tooltip");return m.click(t)}),await o("check the tooltip remain open",async()=>{await E(1e3);const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}};var d,y,w;c.parameters={...c.parameters,docs:{...(d=c.parameters)==null?void 0:d.docs,source:{originalSource:`{
   play: async ({
     canvasElement,
     step

package/dist/assets/{OnboardingTour-BnYumvD2.js → OnboardingTour-Cye6iUC2.js}

@@ -1,4 +1,4 @@
-import{j as o}from"./jsx-runtime-BTJTZTIL.js";import{r as l}from"./index-Cb9e4tly.js";import{I as A}from"./OnboardingTooltip-Bc-Jj706.js";import"./index-DhCCT3uz.js";import{M as f}from"./message-CToTEy-z.js";const T="counter__ArBS-",j={counter:T},v=({totalSteps:n,nextActionLabel:e=o.jsx(f,{id:"preply-ds.onboardingTour.nextActionLabel",defaultMessage:"Next",description:"Onboarding tour next action label"}),completeActionLabel:a=o.jsx(f,{id:"preply-ds.onboardingTour.completeActionLabel",defaultMessage:"Got it",description:"Onboarding tour complete action label"}),onClose:t,onComplete:r,onStepChange:i,disabled:s,children:p,ctx:x})=>{const[b,u]=l.useState(!0),[d,g]=l.useState(0),c={totalSteps:n,nextActionLabel:e,completeActionLabel:a,onClose:()=>{u(!1),t==null||t()},active:!s&&b,currentStep:d,onActionClick:()=>{if(d===n-1)r==null||r(),u(!1);else{const h=d+1;g(h),i==null||i(h)}}};return o.jsx(x.Provider,{value:c,children:p})},_=({ctx:n,...e})=>{const a=l.useContext(n);if(!a)throw new Error("OnboardingTourContext not found");const{currentStep:t,totalSteps:r,onActionClick:i,onClose:s,active:p,nextActionLabel:x,completeActionLabel:b}=a,u=e.step===r-1,d=e.step===t,g=u?b:x,m=()=>{var c;(c=e.actionOnClick)==null||c.call(e),i()},O=c=>{c||s==null||s()};return o.jsx(A,{...e,counter:o.jsx("p",{className:j.counter,children:o.jsx(f,{id:"preply-ds.onboardingTour.counter",defaultMessage:"{currentStep} of {totalSteps}",description:"Onboarding tour step counter, e.g. '1 of 3'",values:{currentStep:t+1,totalSteps:r}})}),open:p&&d,onOpenChange:O,actionLabel:g,actionOnClick:m})},S=()=>{const n=l.createContext(null);return{Provider:t=>o.jsx(v,{...t,ctx:n}),Step:t=>o.jsx(_,{...t,ctx:n})}};try{S.displayName="createOnboardingTour",S.__docgenInfo={description:`Creates a new onboarding tour.
+import{j as o}from"./jsx-runtime-BTJTZTIL.js";import{r as l}from"./index-Cb9e4tly.js";import{I as A}from"./OnboardingTooltip-C5HCJ0E7.js";import"./index-DWSmmBvQ.js";import{M as f}from"./message-CSdaKtIj.js";const T="counter__ArBS-",j={counter:T},v=({totalSteps:n,nextActionLabel:e=o.jsx(f,{id:"preply-ds.onboardingTour.nextActionLabel",defaultMessage:"Next",description:"Onboarding tour next action label"}),completeActionLabel:a=o.jsx(f,{id:"preply-ds.onboardingTour.completeActionLabel",defaultMessage:"Got it",description:"Onboarding tour complete action label"}),onClose:t,onComplete:r,onStepChange:i,disabled:s,children:p,ctx:x})=>{const[b,u]=l.useState(!0),[d,g]=l.useState(0),c={totalSteps:n,nextActionLabel:e,completeActionLabel:a,onClose:()=>{u(!1),t==null||t()},active:!s&&b,currentStep:d,onActionClick:()=>{if(d===n-1)r==null||r(),u(!1);else{const h=d+1;g(h),i==null||i(h)}}};return o.jsx(x.Provider,{value:c,children:p})},_=({ctx:n,...e})=>{const a=l.useContext(n);if(!a)throw new Error("OnboardingTourContext not found");const{currentStep:t,totalSteps:r,onActionClick:i,onClose:s,active:p,nextActionLabel:x,completeActionLabel:b}=a,u=e.step===r-1,d=e.step===t,g=u?b:x,m=()=>{var c;(c=e.actionOnClick)==null||c.call(e),i()},O=c=>{c||s==null||s()};return o.jsx(A,{...e,counter:o.jsx("p",{className:j.counter,children:o.jsx(f,{id:"preply-ds.onboardingTour.counter",defaultMessage:"{currentStep} of {totalSteps}",description:"Onboarding tour step counter, e.g. '1 of 3'",values:{currentStep:t+1,totalSteps:r}})}),open:p&&d,onOpenChange:O,actionLabel:g,actionOnClick:m})},S=()=>{const n=l.createContext(null);return{Provider:t=>o.jsx(v,{...t,ctx:n}),Step:t=>o.jsx(_,{...t,ctx:n})}};try{S.displayName="createOnboardingTour",S.__docgenInfo={description:`Creates a new onboarding tour.
 
 This factory pattern allows multiple independent tours to be nested within each other
 without context conflicts, as each tour maintains its own separate context and state.`,displayName:"createOnboardingTour",props:{}}}catch{}export{S as c};

package/dist/assets/{OnboardingTour.stories-CaCYuehO.js → OnboardingTour.stories-D_A2LFco.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as b}from"./index-Cb9e4tly.js";import{c as x}from"./OnboardingTour-BnYumvD2.js";import{T as n}from"./Text-CjpUlaH0.js";import{L as y}from"./LayoutFlex-JDgK8BCr.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-Bc-Jj706.js";import"./index-fALSPXxe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-CHDTbv7n.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BkmQyVqb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Button-DhteO3C6.js";import"./ButtonBase-B_gwKVAa.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-BLxyLk9f.js";import"./text-centered-CznToR0o.js";import"./index-DhCCT3uz.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Bg7tW4tm.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CToTEy-z.js";import"./layout-relative.module-f40KabMD.js";const l=t=>null,s=t=>null;try{l.displayName="OnboardingTourProvider",l.__docgenInfo={description:`For some reason, storybook fails to render arg tables for the components
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as b}from"./index-Cb9e4tly.js";import{c as x}from"./OnboardingTour-Cye6iUC2.js";import{T as n}from"./Text-D3i9pJx6.js";import{L as y}from"./LayoutFlex-DvBktCUC.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-C5HCJ0E7.js";import"./index-ZUOsecCC.js";import"./index-De-a_lfy.js";import"./index-BPCsOyHr.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-B6FmGF3s.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-CkCFpqfD.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Button-B80XIKcv.js";import"./ButtonBase-BS1Kc_U5.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-BKJX3nsJ.js";import"./text-centered-CznToR0o.js";import"./index-DWSmmBvQ.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-DFzxd8lM.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CSdaKtIj.js";import"./layout-relative.module-f40KabMD.js";const l=t=>null,s=t=>null;try{l.displayName="OnboardingTourProvider",l.__docgenInfo={description:`For some reason, storybook fails to render arg tables for the components
 when they're created with the \`createOnboardingTour\` function.
 
 As a workaround, we're manually defining fake components with the same

package/dist/assets/{OnboardingTour.tests.stories-C9M7Z4vy.js → OnboardingTour.tests.stories-D0hNfgv6.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{c as I}from"./OnboardingTour-BnYumvD2.js";import{T as u}from"./Text-CjpUlaH0.js";import{B as b}from"./Button-DhteO3C6.js";import{f as v,w as p,a as c,e as n,u as l}from"./index-Ctq3gFTp.js";import{L as C}from"./LayoutFlex-JDgK8BCr.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-Bc-Jj706.js";import"./index-fALSPXxe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-CHDTbv7n.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BkmQyVqb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Heading-BLxyLk9f.js";import"./text-centered-CznToR0o.js";import"./index-DhCCT3uz.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Bg7tW4tm.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CToTEy-z.js";import"./ButtonBase-B_gwKVAa.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-f40KabMD.js";const d=I(),jt={title:"Components/OnboardingTour/Tests",parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[i=>e.jsx("div",{style:{margin:"100px 0"},children:i()})],args:{onComplete:v(),onClose:v(),onStepChange:v()}},y={render:({onComplete:i,onStepChange:s})=>e.jsx(d.Provider,{totalSteps:3,nextActionLabel:"Next",completeActionLabel:"Got it",onComplete:i,onStepChange:s,children:e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})}),e.jsx(d.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"step-2"},children:e.jsx(u,{children:"Step 2 Content"})}),e.jsx(d.Step,{step:2,title:"Title",text:"Text",dataset:{testid:"step-3"},children:e.jsx(u,{children:"Step 3 Content"})})]})}),play:async({canvasElement:i,step:s,args:t})=>{const a=p(i);await s("First step should be visible initially",async()=>{await c(()=>{const o=a.getByTestId("step-1");n(o).toBeVisible()})}),await s("Click Next to advance to second step",async()=>{const r=p(a.getByTestId("step-1")).getByTestId("action");await l.click(r),await c(()=>{const T=a.getByTestId("step-2");n(T).toBeVisible(),n(t.onStepChange).toHaveBeenCalledWith(1)})}),await s("Click Next to advance to final step",async()=>{const r=p(a.getByTestId("step-2")).getByTestId("action");await l.click(r),await c(()=>{const T=a.getByTestId("step-3");n(T).toBeVisible(),n(t.onStepChange).toHaveBeenCalledWith(2)})}),await s("Complete tour",async()=>{const r=p(a.getByTestId("step-3")).getByTestId("action");await l.click(r),await c(()=>{const T=a.queryByTestId("step",{exact:!1});n(T).toBeNull(),n(t.onComplete).toHaveBeenCalled()})})}},x={render:({onClose:i})=>e.jsx(d.Provider,{totalSteps:2,nextActionLabel:"Next",completeActionLabel:"Got it",onClose:i,children:e.jsx(d.Step,{step:0,title:"First step",text:"Try closing this step",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})}),play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Step should be initially visible",async()=>{await c(()=>{const a=t.getByTestId("step-1");n(a).toBeVisible()})}),await s("Click close button to close tour",async({args:a})=>{const r=p(t.getByTestId("step-1")).getByTestId("close");await l.click(r),await c(()=>{const T=t.queryByTestId("step",{exact:!1});n(T).toBeNull(),n(a.onClose).toHaveBeenCalled()})})}},B={render:function(){const[s,t]=h.useState(!0);return e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(b,{onClick:()=>t(!s),dataset:{testid:"toggle-button"},children:s?"Enable Tour":"Disable Tour"}),e.jsx(d.Provider,{totalSteps:2,nextActionLabel:"Next",completeActionLabel:"Got it",disabled:s,children:e.jsx(d.Step,{step:0,title:"First step",text:"This step should be hidden when disabled",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})})]})},play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Tour should be initially disabled",async()=>{const a=t.queryByTestId("step-1");n(a).toBeNull()}),await s("Click enable button to show tour",async()=>{const a=t.getByTestId("toggle-button");await l.click(a),await c(()=>{const o=t.getByTestId("step-1");n(o).toBeVisible()})})}},g=I(),S=I(),w={render:function(){const[s,t]=h.useState(!1),[a,o]=h.useState(!1);return e.jsxs(g.Provider,{totalSteps:2,disabled:!s,nextActionLabel:"Next",completeActionLabel:"Got it",children:[e.jsx(g.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"outer-step-1"},children:e.jsx(b,{onClick:()=>t(!0),dataset:{testid:"start-outer-tour"},children:"Start outer tour"})}),e.jsxs(S.Provider,{totalSteps:2,disabled:!a,nextActionLabel:"Next",completeActionLabel:"Done",children:[e.jsx(g.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"outer-step-2"},children:e.jsx(u,{children:"Outer Tour Step"})}),e.jsx(S.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"inner-step-1"},children:e.jsx(b,{onClick:()=>o(!0),dataset:{testid:"start-inner-tour"},children:"Start inner tour"})}),e.jsx(S.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"inner-step-2"},children:e.jsx(u,{children:"Inner Tour Step"})})]})]})},play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Start inner tour, step 1 should be visible",async()=>{const a=t.getByTestId("start-inner-tour");await l.click(a),await c(async()=>{const o=t.queryByTestId("inner-step-1");n(o).toBeVisible()})}),await s("Advance inner tour, step 2 should be visible",async()=>{const o=p(t.getByTestId("inner-step-1")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("inner-step-2");n(r).toBeVisible()})}),await s("Complete inner tour",async()=>{const o=p(t.getByTestId("inner-step-2")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("inner-step-1",{exact:!1});n(r).toBeNull()})}),await s("Start outer tour, step 1 should be visible",async()=>{const a=t.getByTestId("start-outer-tour");await l.click(a),await c(async()=>{const o=t.queryByTestId("outer-step-1");n(o).toBeVisible()})}),await s("Advance outer tour, step 2 should be visible",async()=>{const o=p(t.getByTestId("outer-step-1")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("outer-step-2");n(r).toBeVisible()})}),await s("Complete outer tour",async()=>{const o=p(t.getByTestId("outer-step-2")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("-step-",{exact:!1});n(r).toBeNull()})})}};function W(i){return new Promise(s=>setTimeout(s,i))}const m={render:()=>e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(b,{children:"Click outside the tooltip"}),e.jsx(d.Provider,{totalSteps:1,nextActionLabel:"Next",completeActionLabel:"Got it",children:e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})})]}),play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Step should be initially visible",async()=>{await c(()=>{const a=t.getByTestId("step-1");n(a).toBeVisible()})}),await s("Click outside the tooltip",()=>{const a=t.getByText("Click outside the tooltip");return l.click(a)}),await s("Wait for tooltip to be hidden",async()=>{await W(1e3);const a=t.getByTestId("step-1");n(a).toBeVisible()})}};var k,j,L;y.parameters={...y.parameters,docs:{...(k=y.parameters)==null?void 0:k.docs,source:{originalSource:`{
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{c as I}from"./OnboardingTour-Cye6iUC2.js";import{T as u}from"./Text-D3i9pJx6.js";import{B as b}from"./Button-B80XIKcv.js";import{f as v,w as p,a as c,e as n,u as l}from"./index-CY08ZUhp.js";import{L as C}from"./LayoutFlex-DvBktCUC.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-C5HCJ0E7.js";import"./index-ZUOsecCC.js";import"./index-De-a_lfy.js";import"./index-BPCsOyHr.js";import"./index-BlMeVLsf.js";import"./floating-ui.react-dom-B6FmGF3s.js";import"./Combination-IIMvWCmY.js";import"./tslib.es6-C7pnyCjR.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-CkCFpqfD.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./Heading-BKJX3nsJ.js";import"./text-centered-CznToR0o.js";import"./index-DWSmmBvQ.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-DFzxd8lM.js";import"./PortalElementProvider-CxdFl3yP.js";import"./message-CSdaKtIj.js";import"./ButtonBase-BS1Kc_U5.js";import"./Spinner-BcQ2TyFf.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-f40KabMD.js";const d=I(),jt={title:"Components/OnboardingTour/Tests",parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[i=>e.jsx("div",{style:{margin:"100px 0"},children:i()})],args:{onComplete:v(),onClose:v(),onStepChange:v()}},y={render:({onComplete:i,onStepChange:s})=>e.jsx(d.Provider,{totalSteps:3,nextActionLabel:"Next",completeActionLabel:"Got it",onComplete:i,onStepChange:s,children:e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})}),e.jsx(d.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"step-2"},children:e.jsx(u,{children:"Step 2 Content"})}),e.jsx(d.Step,{step:2,title:"Title",text:"Text",dataset:{testid:"step-3"},children:e.jsx(u,{children:"Step 3 Content"})})]})}),play:async({canvasElement:i,step:s,args:t})=>{const a=p(i);await s("First step should be visible initially",async()=>{await c(()=>{const o=a.getByTestId("step-1");n(o).toBeVisible()})}),await s("Click Next to advance to second step",async()=>{const r=p(a.getByTestId("step-1")).getByTestId("action");await l.click(r),await c(()=>{const T=a.getByTestId("step-2");n(T).toBeVisible(),n(t.onStepChange).toHaveBeenCalledWith(1)})}),await s("Click Next to advance to final step",async()=>{const r=p(a.getByTestId("step-2")).getByTestId("action");await l.click(r),await c(()=>{const T=a.getByTestId("step-3");n(T).toBeVisible(),n(t.onStepChange).toHaveBeenCalledWith(2)})}),await s("Complete tour",async()=>{const r=p(a.getByTestId("step-3")).getByTestId("action");await l.click(r),await c(()=>{const T=a.queryByTestId("step",{exact:!1});n(T).toBeNull(),n(t.onComplete).toHaveBeenCalled()})})}},x={render:({onClose:i})=>e.jsx(d.Provider,{totalSteps:2,nextActionLabel:"Next",completeActionLabel:"Got it",onClose:i,children:e.jsx(d.Step,{step:0,title:"First step",text:"Try closing this step",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})}),play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Step should be initially visible",async()=>{await c(()=>{const a=t.getByTestId("step-1");n(a).toBeVisible()})}),await s("Click close button to close tour",async({args:a})=>{const r=p(t.getByTestId("step-1")).getByTestId("close");await l.click(r),await c(()=>{const T=t.queryByTestId("step",{exact:!1});n(T).toBeNull(),n(a.onClose).toHaveBeenCalled()})})}},B={render:function(){const[s,t]=h.useState(!0);return e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(b,{onClick:()=>t(!s),dataset:{testid:"toggle-button"},children:s?"Enable Tour":"Disable Tour"}),e.jsx(d.Provider,{totalSteps:2,nextActionLabel:"Next",completeActionLabel:"Got it",disabled:s,children:e.jsx(d.Step,{step:0,title:"First step",text:"This step should be hidden when disabled",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})})]})},play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Tour should be initially disabled",async()=>{const a=t.queryByTestId("step-1");n(a).toBeNull()}),await s("Click enable button to show tour",async()=>{const a=t.getByTestId("toggle-button");await l.click(a),await c(()=>{const o=t.getByTestId("step-1");n(o).toBeVisible()})})}},g=I(),S=I(),w={render:function(){const[s,t]=h.useState(!1),[a,o]=h.useState(!1);return e.jsxs(g.Provider,{totalSteps:2,disabled:!s,nextActionLabel:"Next",completeActionLabel:"Got it",children:[e.jsx(g.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"outer-step-1"},children:e.jsx(b,{onClick:()=>t(!0),dataset:{testid:"start-outer-tour"},children:"Start outer tour"})}),e.jsxs(S.Provider,{totalSteps:2,disabled:!a,nextActionLabel:"Next",completeActionLabel:"Done",children:[e.jsx(g.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"outer-step-2"},children:e.jsx(u,{children:"Outer Tour Step"})}),e.jsx(S.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"inner-step-1"},children:e.jsx(b,{onClick:()=>o(!0),dataset:{testid:"start-inner-tour"},children:"Start inner tour"})}),e.jsx(S.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"inner-step-2"},children:e.jsx(u,{children:"Inner Tour Step"})})]})]})},play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Start inner tour, step 1 should be visible",async()=>{const a=t.getByTestId("start-inner-tour");await l.click(a),await c(async()=>{const o=t.queryByTestId("inner-step-1");n(o).toBeVisible()})}),await s("Advance inner tour, step 2 should be visible",async()=>{const o=p(t.getByTestId("inner-step-1")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("inner-step-2");n(r).toBeVisible()})}),await s("Complete inner tour",async()=>{const o=p(t.getByTestId("inner-step-2")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("inner-step-1",{exact:!1});n(r).toBeNull()})}),await s("Start outer tour, step 1 should be visible",async()=>{const a=t.getByTestId("start-outer-tour");await l.click(a),await c(async()=>{const o=t.queryByTestId("outer-step-1");n(o).toBeVisible()})}),await s("Advance outer tour, step 2 should be visible",async()=>{const o=p(t.getByTestId("outer-step-1")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("outer-step-2");n(r).toBeVisible()})}),await s("Complete outer tour",async()=>{const o=p(t.getByTestId("outer-step-2")).getByTestId("action");await l.click(o),await c(async()=>{const r=t.queryByTestId("-step-",{exact:!1});n(r).toBeNull()})})}};function W(i){return new Promise(s=>setTimeout(s,i))}const m={render:()=>e.jsxs(C,{gap:"24",direction:"column",children:[e.jsx(b,{children:"Click outside the tooltip"}),e.jsx(d.Provider,{totalSteps:1,nextActionLabel:"Next",completeActionLabel:"Got it",children:e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(u,{children:"Step 1 Content"})})})]}),play:async({canvasElement:i,step:s})=>{const t=p(i);await s("Step should be initially visible",async()=>{await c(()=>{const a=t.getByTestId("step-1");n(a).toBeVisible()})}),await s("Click outside the tooltip",()=>{const a=t.getByText("Click outside the tooltip");return l.click(a)}),await s("Wait for tooltip to be hidden",async()=>{await W(1e3);const a=t.getByTestId("step-1");n(a).toBeVisible()})}};var k,j,L;y.parameters={...y.parameters,docs:{...(k=y.parameters)==null?void 0:k.docs,source:{originalSource:`{
   render: ({
     onComplete,
     onStepChange

package/dist/assets/{PasswordField-CFjBYGMS.js → PasswordField-DHlrM2-7.js}

@@ -1,6 +1,6 @@
-import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as l}from"./index-Cb9e4tly.js";import{F as H}from"./FormControl-D9rxeKMc.js";import{F as L,a as I}from"./TokyoUIEye-CteyS9_g.js";import{F as M}from"./FieldButton-ChB_zwFu.js";import{u as x,d as T}from"./index-DhCCT3uz.js";import{u as F}from"./useMergeRefs-D_RfOOSs.js";import{w as P}from"./componentNames-NXEPEzbR.js";import{I as k}from"./Input-UdhYxppR.js";const r=T({reveal:{id:"preply-ds.password-field.reveal.button",defaultMessage:"Reveal password",description:'A11y label for the "reveal password" button. Will be announced by screen reader.'},conceal:{id:"preply-ds.password-field.conceal.button",defaultMessage:"Conceal password",description:'A11y label for the "conceal password" button. Will be announced by screen reader.'}}),s=l.forwardRef(function({id:o,label:d,description:m,error:p,required:c,inputDataset:f,dataset:v,hideLabel:y,onClick:h,hasError:b,useLegacyRequiredLabel:g,className:D,style:_,...q},E){const{formatMessage:n}=x(),[e,V]=l.useState(!1),t=l.useRef(null),w=F(t,E),C=e?"text":"password",R=()=>{var u;V(!e),(u=t.current)==null||u.focus()};return a.jsx(H,{id:o,label:d,description:m,error:p,hasError:b,required:c,dataset:v,hideLabel:y,onClick:h,useLegacyRequiredLabel:g,preplyDsComponent:P.PasswordField,children:a.jsx(k,{...q,type:C,ref:w,dataset:f,button:a.jsx(M,{onClick:R,svg:e?L:I,assistiveText:n(e?r.conceal:r.reveal),dataset:{testid:"toggle-password-button"}})})})});try{s.displayName="PasswordField",s.__docgenInfo={description:"",displayName:"PasswordField",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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"}]}},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> & MouseEventHandler<HTMLInputElement>"}]}},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"}]}},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"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
-indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as l}from"./index-Cb9e4tly.js";import{F as H}from"./FormControl-CPKPJ97_.js";import{F as L,a as I}from"./TokyoUIEye-CteyS9_g.js";import{F as M}from"./FieldButton-ChB_zwFu.js";import{u as x,d as T}from"./index-DWSmmBvQ.js";import{u as F}from"./useMergeRefs-D_RfOOSs.js";import{w as P}from"./componentNames-NXEPEzbR.js";import{I as k}from"./Input-DeHbbC7g.js";const r=T({reveal:{id:"preply-ds.password-field.reveal.button",defaultMessage:"Reveal password",description:'A11y label for the "reveal password" button. Will be announced by screen reader.'},conceal:{id:"preply-ds.password-field.conceal.button",defaultMessage:"Conceal password",description:'A11y label for the "conceal password" button. Will be announced by screen reader.'}}),s=l.forwardRef(function({id:o,label:d,description:m,error:p,required:c,inputDataset:f,dataset:v,hideLabel:y,onClick:h,hasError:b,useLegacyRequiredLabel:g,className:D,style:_,...q},E){const{formatMessage:n}=x(),[e,V]=l.useState(!1),t=l.useRef(null),w=F(t,E),C=e?"text":"password",R=()=>{var u;V(!e),(u=t.current)==null||u.focus()};return a.jsx(H,{id:o,label:d,description:m,error:p,hasError:b,required:c,dataset:v,hideLabel:y,onClick:h,useLegacyRequiredLabel:g,preplyDsComponent:P.PasswordField,children:a.jsx(k,{...q,type:C,ref:w,dataset:f,button:a.jsx(M,{onClick:R,svg:e?L:I,assistiveText:n(e?r.conceal:r.reveal),dataset:{testid:"toggle-password-button"}})})})});try{s.displayName="PasswordField",s.__docgenInfo={description:"",displayName:"PasswordField",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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> & MouseEventHandler<HTMLInputElement>"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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"}]}},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"}]}},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"}]}},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"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"off"'},{value:'"new-password"'},{value:'"current-password"'}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",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: 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{s as P};
+@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:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},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>"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"off"'},{value:'"new-password"'},{value:'"current-password"'}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",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: 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{s as P};