@preply/ds-docs 1.3.0 → 1.4.0

package/dist/assets/{Link.stories-zLAuWX9B.js → Link.stories-DXbiFw9-.js}

@@ -1,7 +1,7 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{T as a}from"./Text-DYAggeGe.js";import{r as k}from"./index-Cb9e4tly.js";import{f as Y}from"./filterHTMLAttributes-DYdLqcvH.js";import{g as Z}from"./defaults-B1rzzf6M.js";import{u as ee}from"./useHostname-Y3PlXofY.js";import{m as ne,s as f,b as x}from"./classNames-BUL1Zq7e.js";import{w as y}from"./componentNames-Bwls0I02.js";import{a as ae,g as te}from"./index-DdzHuZ-Y.js";import{g as d}from"./getTokenVar-DU_DEzTd.js";import{c as u}from"./tokens-CkwKC70_.js";import"./index-ChsGqxH_.js";import"./text-accent-CvjwTDtK.js";import"./text-centered-DqK_kb5q.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./constants-BgBLeZzp.js";const re="_Link_1w8v9_4",ie={Link:re,"Link--inline":"_Link--inline_1w8v9_20","Link--noUnderline":"_Link--noUnderline_1w8v9_23","Link--variant-accentDark":"_Link--variant-accentDark_1w8v9_26","Link--variant-accentDark--dsInternalSimulation-hover":"_Link--variant-accentDark--dsInternalSimulation-hover_1w8v9_30","Link--variant-accentDark--dsInternalSimulation-active":"_Link--variant-accentDark--dsInternalSimulation-active_1w8v9_34","Link--variant-accentDarkInverted":"_Link--variant-accentDarkInverted_1w8v9_37","Link--variant-accentDarkInverted--dsInternalSimulation-hover":"_Link--variant-accentDarkInverted--dsInternalSimulation-hover_1w8v9_41","Link--variant-accentDarkInverted--dsInternalSimulation-active":"_Link--variant-accentDarkInverted--dsInternalSimulation-active_1w8v9_45","Link--variant-neutral":"_Link--variant-neutral_1w8v9_48","Link--variant-neutral--dsInternalSimulation-hover":"_Link--variant-neutral--dsInternalSimulation-hover_1w8v9_52","Link--variant-neutral--dsInternalSimulation-active":"_Link--variant-neutral--dsInternalSimulation-active_1w8v9_56","Link--variant-neutralInverted":"_Link--variant-neutralInverted_1w8v9_59","Link--variant-neutralInverted--dsInternalSimulation-hover":"_Link--variant-neutralInverted--dsInternalSimulation-hover_1w8v9_63","Link--variant-neutralInverted--dsInternalSimulation-active":"_Link--variant-neutralInverted--dsInternalSimulation-active_1w8v9_67","Link--variant-unsetColors":"_Link--variant-unsetColors_1w8v9_70","Link--variant-unsetColors--dsInternalSimulation-hover":"_Link--variant-unsetColors--dsInternalSimulation-hover_1w8v9_74","Link--variant-unsetColors--dsInternalSimulation-active":"_Link--variant-unsetColors--dsInternalSimulation-active_1w8v9_78"},n=k.forwardRef(function(E,P){const{variant:v=Z,href:A,download:R,opensInNewTab:H,nofollow:M,assistiveText:O,onClick:$,as:p,url:z,dataset:F,children:m,inline:J,dsInternalSimulation:K,noUnderline:W,...X}=E,B=ee(),G=ne(ie,y.Link,[f(`variant-${v}--dsInternalSimulation`,K),f("variant",v),x("inline",void 0,J),x("noUnderline",void 0,W)]),c=A||z,Q=c?ae(B,c,H,M):{},h={...Y(X),ref:P,href:c,download:R,"aria-label":O,onClick:$,className:G.join(" "),...te(F,{preplyDsComponent:y.Link})};return p?k.cloneElement(p,{...h},m):e.jsx("a",{...h,...Q,children:m})});try{n.displayName="Link",n.__docgenInfo={description:`This is an inline element and will inherit font-size, line-height and
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{T as a}from"./Text-CDqVYAcD.js";import{r as k}from"./index-Cb9e4tly.js";import{f as Y}from"./filterHTMLAttributes-DYdLqcvH.js";import{g as Z}from"./defaults-B1rzzf6M.js";import{u as ee}from"./useHostname-Y3PlXofY.js";import{m as ne,s as f,b as x}from"./classNames-BUL1Zq7e.js";import{w as y}from"./componentNames-Bwls0I02.js";import{a as ae,g as te}from"./index-DdzHuZ-Y.js";import{g as d}from"./getTokenVar-DU_DEzTd.js";import{c as u}from"./tokens-Di5DrZN4.js";import"./index-ChsGqxH_.js";import"./text-accent-CrnHOlvW.js";import"./text-centered-1sU8-E1D.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./constants-BgBLeZzp.js";const re="_Link_gdoqi_4",ie={Link:re,"Link--inline":"_Link--inline_gdoqi_20","Link--noUnderline":"_Link--noUnderline_gdoqi_23","Link--variant-accentDark":"_Link--variant-accentDark_gdoqi_26","Link--variant-accentDark--dsInternalSimulation-hover":"_Link--variant-accentDark--dsInternalSimulation-hover_gdoqi_30","Link--variant-accentDark--dsInternalSimulation-active":"_Link--variant-accentDark--dsInternalSimulation-active_gdoqi_34","Link--variant-accentDarkInverted":"_Link--variant-accentDarkInverted_gdoqi_37","Link--variant-accentDarkInverted--dsInternalSimulation-hover":"_Link--variant-accentDarkInverted--dsInternalSimulation-hover_gdoqi_41","Link--variant-accentDarkInverted--dsInternalSimulation-active":"_Link--variant-accentDarkInverted--dsInternalSimulation-active_gdoqi_45","Link--variant-neutral":"_Link--variant-neutral_gdoqi_48","Link--variant-neutral--dsInternalSimulation-hover":"_Link--variant-neutral--dsInternalSimulation-hover_gdoqi_52","Link--variant-neutral--dsInternalSimulation-active":"_Link--variant-neutral--dsInternalSimulation-active_gdoqi_56","Link--variant-neutralInverted":"_Link--variant-neutralInverted_gdoqi_59","Link--variant-neutralInverted--dsInternalSimulation-hover":"_Link--variant-neutralInverted--dsInternalSimulation-hover_gdoqi_63","Link--variant-neutralInverted--dsInternalSimulation-active":"_Link--variant-neutralInverted--dsInternalSimulation-active_gdoqi_67","Link--variant-unsetColors":"_Link--variant-unsetColors_gdoqi_70","Link--variant-unsetColors--dsInternalSimulation-hover":"_Link--variant-unsetColors--dsInternalSimulation-hover_gdoqi_74","Link--variant-unsetColors--dsInternalSimulation-active":"_Link--variant-unsetColors--dsInternalSimulation-active_gdoqi_78"},n=k.forwardRef(function(E,P){const{variant:p=Z,href:A,download:R,opensInNewTab:H,nofollow:M,assistiveText:O,onClick:$,as:v,url:z,dataset:F,children:m,inline:J,dsInternalSimulation:K,noUnderline:W,...X}=E,B=ee(),G=ne(ie,y.Link,[f(`variant-${p}--dsInternalSimulation`,K),f("variant",p),x("inline",void 0,J),x("noUnderline",void 0,W)]),c=A||z,Q=c?ae(B,c,H,M):{},h={...Y(X),ref:P,href:c,download:R,"aria-label":O,onClick:$,className:G.join(" "),...te(F,{preplyDsComponent:y.Link})};return v?k.cloneElement(v,{...h},m):e.jsx("a",{...h,...Q,children:m})});try{n.displayName="Link",n.__docgenInfo={description:`This is an inline element and will inherit font-size, line-height and
 font-weight from the parent context. If you need to customise any of these
 styles, all you have to do is wrap the <Link> in a Text or TextInline
-component.`,displayName:"Link",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"accentDark"'},{value:'"neutral"'},{value:'"accentDarkInverted"'},{value:'"neutralInverted"'},{value:'"unsetColors"'}]}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"enum",value:[{value:"string"}]}},download:{defaultValue:null,description:`When provided, instructs the browser to download the target (the file
+component.`,displayName:"Link",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"neutral"'},{value:'"accentDark"'},{value:'"accentDarkInverted"'},{value:'"neutralInverted"'},{value:'"unsetColors"'}]}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"enum",value:[{value:"string"}]}},download:{defaultValue:null,description:`When provided, instructs the browser to download the target (the file
 specified in the href attribute) when a user clicks on the hyperlink,
 rather than display it in the browser.`,name:"download",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},opensInNewTab:{defaultValue:null,description:"If `true`, forces internal link to open in a new tab.",name:"opensInNewTab",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},nofollow:{defaultValue:null,description:"",name:"nofollow",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},assistiveText:{defaultValue:null,description:"Provide an `aria-label` to the link.\nThis is useful if the link wraps non-textual elements, eg. an `img`.",name:"assistiveText",required:!1,type:{name:"enum",value:[{value:"string"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},as:{defaultValue:null,description:"",name:"as",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:"url",required:!1,type:{name:"enum",value:[{value:"string"}]}},dataset:{defaultValue:null,description:`Provide dataset to set data attributes on the DOM element for the purpose
 of e2e tests or integrating with external libraries.`,name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},inline:{defaultValue:null,description:"If `true`, allows the link to wrap within text.",name:"inline",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},noUnderline:{defaultValue:null,description:"",name:"noUnderline",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLAnchorElement | null) => void"},{value:"RefObject<HTMLAnchorElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ie={title:"components/Link",component:n},r=()=>{const t=d(u.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(n,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]})},i=()=>{const t=d(u.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(a,{variant:"default-regular-italic",children:"(use the `unsetColors` variant)"}),e.jsxs("div",{children:[e.jsx(a,{variant:"large-semibold-italic",children:"primary"}),e.jsx(a,{variant:"default-regular-italic",children:"normal"}),e.jsxs(a,{accent:"primary",children:["Lorem ipsum ",e.jsx(n,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(a,{variant:"default-regular-italic",children:"active"}),e.jsxs(a,{accent:"primary",children:["Lorem ipsum"," ",e.jsx(n,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{style:{backgroundColor:t},children:[e.jsx(a,{variant:"large-semibold-italic",accent:"inverted",children:"inverted"}),e.jsx(a,{variant:"default-regular-italic",accent:"inverted",children:"normal"}),e.jsxs(a,{accent:"inverted",children:["Lorem ipsum ",e.jsx(n,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(a,{variant:"default-regular-italic",accent:"inverted",children:"active"}),e.jsxs(a,{accent:"inverted",children:["Lorem ipsum"," ",e.jsx(n,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(a,{variant:"large-semibold-italic",children:"positive"}),e.jsx(a,{variant:"default-regular-italic",children:"normal"}),e.jsxs(a,{accent:"positive",children:["Lorem ipsum ",e.jsx(n,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(a,{variant:"default-regular-italic",children:"active"}),e.jsxs(a,{accent:"positive",children:["Lorem ipsum"," ",e.jsx(n,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]}),e.jsxs("div",{children:[e.jsx(a,{variant:"large-semibold-italic",children:"critical"}),e.jsx(a,{variant:"default-regular-italic",children:"normal"}),e.jsxs(a,{accent:"critical",children:["Lorem ipsum ",e.jsx(n,{variant:"unsetColors",children:"dolor sit amet"})," amet."]}),e.jsx(a,{variant:"default-regular-italic",children:"active"}),e.jsxs(a,{accent:"critical",children:["Lorem ipsum"," ",e.jsx(n,{variant:"unsetColors",dsInternalSimulation:"active",children:"dolor sit amet"})," ","amet."]})]})]})},l=()=>{const t=d(u.background.primaryInverted);return e.jsxs("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:[e.jsx(a,{variant:"default-regular-italic",children:"normal"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(n,{href:"https://preply.com",variant:"neutral",children:"neutral"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"neutralInverted",children:"neutralInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"accentDark",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"accentDarkInverted",children:"accentDarkInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"unsetColors",children:"unsetColors"})]}),e.jsx(a,{variant:"default-regular-italic",children:"hover"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(n,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"hover",children:"neutral"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"hover",children:"neutralInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"hover",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"hover",children:"accentDarkInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"hover",children:"unsetColors"})]}),e.jsx(a,{variant:"default-regular-italic",children:"active"}),e.jsxs("div",{style:{display:"flex",gap:"16px"},children:[e.jsx(n,{href:"https://preply.com",variant:"neutral",dsInternalSimulation:"active",children:"neutral"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"neutralInverted",dsInternalSimulation:"active",children:"neutralInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"accentDark",dsInternalSimulation:"active",children:"accentDark"}),e.jsx("span",{style:{backgroundColor:t},children:e.jsx(n,{href:"https://preply.com",variant:"accentDarkInverted",dsInternalSimulation:"active",children:"accentDarkInverted"})}),e.jsx(n,{href:"https://preply.com",variant:"unsetColors",dsInternalSimulation:"active",children:"unsetColors"})]})]})},o=()=>e.jsxs("p",{style:{width:"12ch"},children:["Unlock your potential;"," ",e.jsx(n,{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 g,L,I;r.parameters={...r.parameters,docs:{...(g=r.parameters)==null?void 0:g.docs,source:{originalSource:`() => {
@@ -214,7 +214,7 @@ of e2e tests or integrating with external libraries.`,name:"dataset",required:!1
                 </Link>
             </div>
         </div>;
-}`,...(S=(_=l.parameters)==null?void 0:_.docs)==null?void 0:S.source}}};var D,w,V;o.parameters={...o.parameters,docs:{...(D=o.parameters)==null?void 0:D.docs,source:{originalSource:`() => <p style={{
+}`,...(S=(_=l.parameters)==null?void 0:_.docs)==null?void 0:S.source}}};var D,w,q;o.parameters={...o.parameters,docs:{...(D=o.parameters)==null?void 0:D.docs,source:{originalSource:`() => <p style={{
   width: '12ch'
 }}>
         Unlock your potential;{' '}
@@ -222,7 +222,7 @@ of e2e tests or integrating with external libraries.`,name:"dataset",required:!1
             visit Preply
         </Link>
         .
-    </p>`,...(V=(w=o.parameters)==null?void 0:w.docs)==null?void 0:V.source}}};var q,N,U;s.parameters={...s.parameters,docs:{...(q=s.parameters)==null?void 0:q.docs,source:{originalSource:`{
+    </p>`,...(q=(w=o.parameters)==null?void 0:w.docs)==null?void 0:q.source}}};var V,N,U;s.parameters={...s.parameters,docs:{...(V=s.parameters)==null?void 0:V.docs,source:{originalSource:`{
   parameters: {
     chromatic: {
       disableSnapshot: true

package/dist/assets/Loader-DLP0PI5-.css

@@ -0,0 +1 @@
+._Loader_gqtv4_2{display:inline-flex;width:fit-content;height:fit-content}._Loader--normal_gqtv4_7{color:var(--19bcb6)}._Loader--inverted_gqtv4_10{color:var(--38413d)}

package/dist/assets/{Loader.stories-BboqpWt8.js → Loader.stories-DvgUtUpE.js}

@@ -1,11 +1,11 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{f as j}from"./filterHTMLAttributes-DYdLqcvH.js";import{S as z}from"./Spinner-DvSs1_DJ.js";import{m as k,b as q}from"./classNames-BUL1Zq7e.js";import{w as l}from"./componentNames-Bwls0I02.js";import{g as C}from"./index-DdzHuZ-Y.js";import{S as E}from"./consts-KAYct7Gj.js";import{g as N}from"./getTokenVar-DU_DEzTd.js";import{c as R}from"./tokens-CkwKC70_.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./defaults-B1rzzf6M.js";import"./constants-BgBLeZzp.js";const T="_Loader_pbqvs_2",V={Loader:T,"Loader--normal":"_Loader--normal_pbqvs_7","Loader--inverted":"_Loader--inverted_pbqvs_10"},r=h.forwardRef(function({size:t,inverted:y=!1,dataset:b,...L},_){const S=k(V,l.Loader,[q("inverted","normal",y)]),x={...j(L),ref:_,className:S.join(" "),...C(b,{preplyDsComponent:l.Loader})};return e.jsx("span",{...x,children:e.jsx(z,{size:t})})});try{r.displayName="Loader",r.__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 K={title:"components/Loader",component:r,argTypes:{size:{description:E}}},o=()=>e.jsxs("div",{style:{display:"flex",alignItems:"end",gap:"8px"},children:[e.jsx(r,{size:"default"}),e.jsx(r,{size:"large"})]}),n=()=>e.jsx(r,{inverted:!0});n.decorators=[a=>{const t=N(R.background.primaryInverted);return e.jsx("div",{style:{backgroundColor:t},children:a()})}];const s={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(a,{args:t})=>e.jsx("div",{style:{backgroundColor:t.inverted?"black":void 0},children:a()})],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 j}from"./filterHTMLAttributes-DYdLqcvH.js";import{S as z}from"./Spinner-Dsa9X0G6.js";import{m as k,b as q}from"./classNames-BUL1Zq7e.js";import{w as l}from"./componentNames-Bwls0I02.js";import{g as C}from"./index-DdzHuZ-Y.js";import{S as E}from"./consts-KAYct7Gj.js";import{g as N}from"./getTokenVar-DU_DEzTd.js";import{c as R}from"./tokens-Di5DrZN4.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./defaults-B1rzzf6M.js";import"./constants-BgBLeZzp.js";const T="_Loader_gqtv4_2",V={Loader:T,"Loader--normal":"_Loader--normal_gqtv4_7","Loader--inverted":"_Loader--inverted_gqtv4_10"},r=h.forwardRef(function({size:t,inverted:y=!1,dataset:L,..._},b){const S=k(V,l.Loader,[q("inverted","normal",y)]),x={...j(_),ref:b,className:S.join(" "),...C(L,{preplyDsComponent:l.Loader})};return e.jsx("span",{...x,children:e.jsx(z,{size:t})})});try{r.displayName="Loader",r.__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 K={title:"components/Loader",component:r,argTypes:{size:{description:E}}},o=()=>e.jsxs("div",{style:{display:"flex",alignItems:"end",gap:"8px"},children:[e.jsx(r,{size:"default"}),e.jsx(r,{size:"large"})]}),n=()=>e.jsx(r,{inverted:!0});n.decorators=[a=>{const t=N(R.background.primaryInverted);return e.jsx("div",{style:{backgroundColor:t},children:a()})}];const s={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(a,{args:t})=>e.jsx("div",{style:{backgroundColor:t.inverted?"black":void 0},children:a()})],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'
 }}>
         <Loader size="default" />
         <Loader size="large" />
-    </div>`,...(c=(i=o.parameters)==null?void 0:i.docs)==null?void 0:c.source}}};var u,p,m;n.parameters={...n.parameters,docs:{...(u=n.parameters)==null?void 0:u.docs,source:{originalSource:"() => <Loader inverted />",...(m=(p=n.parameters)==null?void 0:p.docs)==null?void 0:m.source}}};var f,v,g;s.parameters={...s.parameters,docs:{...(f=s.parameters)==null?void 0:f.docs,source:{originalSource:`{
+    </div>`,...(c=(i=o.parameters)==null?void 0:i.docs)==null?void 0:c.source}}};var u,m,p;n.parameters={...n.parameters,docs:{...(u=n.parameters)==null?void 0:u.docs,source:{originalSource:"() => <Loader inverted />",...(p=(m=n.parameters)==null?void 0:m.docs)==null?void 0:p.source}}};var f,v,g;s.parameters={...s.parameters,docs:{...(f=s.parameters)==null?void 0:f.docs,source:{originalSource:`{
   parameters: {
     chromatic: {
       disableSnapshot: true

package/dist/assets/{NumberField.stories-BpHFB9CV.js → NumberField.stories-BQIOdo90.js}

@@ -1,8 +1,8 @@
-import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as s}from"./index-Cb9e4tly.js";import{a as u}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{e as F,u as Ce,w as xe}from"./index-BVDq5o4N.js";import{F as qe}from"./TokyoUIPhone-CvuBM6jb.js";import{B as T}from"./Button-CGkNG45w.js";import{I as Ee}from"./Icon-C6rDUkYo.js";import{F as He}from"./FieldLayout-ucPtI83J.js";import{u as Fe,I as Se,s as Ne}from"./FieldLayoutBase-BmwMSdWE.js";import{m as we}from"./classNames-BUL1Zq7e.js";import{w as m}from"./componentNames-Bwls0I02.js";import{u as Re}from"./useForcedRef--iGFM41p.js";import{u as Te}from"./useNumberField-AJNQGstL.js";import{T as ke}from"./Text-DYAggeGe.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./render-icon-BT0Aq7PA.js";import"./ButtonBase-DGRySlif.js";import"./Spinner-DvSs1_DJ.js";import"./defaults-B1rzzf6M.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./useHostname-Y3PlXofY.js";import"./index-DdzHuZ-Y.js";import"./index-CC6DAVyL.js";import"./text-accent-CvjwTDtK.js";import"./FieldAdditionalText-DuEWaFeu.js";import"./constants-DL6gdbsq.js";import"./index-D1pfvbUR.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-B1DLZQ1U.js";import"./text-centered-DqK_kb5q.js";const je=({onChange:e,onValueChange:a,...n},r)=>{const i=we(Ne,m.InputNumber),d=Fe(o=>o.target.value?Number(o.target.value):void 0,e,a);return t.jsx(Se,{...n,type:"number",ref:r,className:i.join(" "),onChange:d,preplyDsComponent:m.InputNumber})},N=s.forwardRef(je);try{N.displayName="InputNumber",N.__docgenInfo={description:"",displayName:"InputNumber",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
+import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as s}from"./index-Cb9e4tly.js";import{a as u}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{e as F,u as Ce,w as xe}from"./index-BVDq5o4N.js";import{F as qe}from"./TokyoUIPhone-CvuBM6jb.js";import{B as T}from"./Button-DqwK0S70.js";import{I as Ee}from"./Icon-BwwIOKM_.js";import{F as He}from"./FieldLayout-BGkL1EMg.js";import{u as Fe,I as Se,s as Ne}from"./FieldLayoutBase-DQbxDQVA.js";import{m as we}from"./classNames-BUL1Zq7e.js";import{w as m}from"./componentNames-Bwls0I02.js";import{u as Re}from"./useForcedRef--iGFM41p.js";import{u as Te}from"./useNumberField-AJNQGstL.js";import{T as ke}from"./Text-CDqVYAcD.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./render-icon-BT0Aq7PA.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./defaults-B1rzzf6M.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./useHostname-Y3PlXofY.js";import"./index-DdzHuZ-Y.js";import"./index-CC6DAVyL.js";import"./text-accent-CrnHOlvW.js";import"./FieldAdditionalText-lW7Q1VGp.js";import"./constants-DL6gdbsq.js";import"./index-D1pfvbUR.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-B1DLZQ1U.js";import"./text-centered-1sU8-E1D.js";const je=({onChange:e,onValueChange:a,...n},r)=>{const i=we(Ne,m.InputNumber),d=Fe(o=>o.target.value?Number(o.target.value):void 0,e,a);return t.jsx(Se,{...n,type:"number",ref:r,className:i.join(" "),onChange:d,preplyDsComponent:m.InputNumber})},N=s.forwardRef(je);try{N.displayName="InputNumber",N.__docgenInfo={description:"",displayName:"InputNumber",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},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"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
 @see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-disabled":{defaultValue:null,description:`Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
 @see aria-hidden
 @see aria-readonly.`,name:"aria-disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
-@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-required":{defaultValue:null,description:"Indicates that user input is required on the element before a form may be submitted.",name:"aria-required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},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<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},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"}]}},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:"ValueChangeEventHandler<number | undefined>"}]}},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: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Be="_NumberField_kx5jx_1",Pe={NumberField:Be},Le=({id:e,...a},n)=>{const r=s.useRef(null),i=Re();s.useImperativeHandle(n,()=>({setFocus:()=>{var c;return(c=r==null?void 0:r.current)==null?void 0:c.setFocus()},scrollIntoView:()=>{var c;return(c=r==null?void 0:r.current)==null?void 0:c.scrollIntoView()}}));const d=Te({id:e,...a},m.NumberField),{layoutProps:o,inputProps:S}=d,l=we(Pe,m.NumberField),Ie=t.jsx(N,{...S,ref:i});return t.jsx(He,{...o,className:l.join(" "),input:Ie,inputHandle:i.current,ref:r,preplyDsComponent:m.NumberField})},p=s.forwardRef(Le);try{p.displayName="NumberField",p.__docgenInfo={description:"By default, this field acts as a controlled field and expects the parent\ncomponent to manage the state, by reacting to user input via the `onChange` or\n`onValueChange` props, and providing the latest state via the `value` prop.\n\nAlternatively, you can use it as an uncontrolled field using the\n`defaultValue` prop instead of the `value` prop.",displayName:"NumberField",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},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"}]}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",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"}]}},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"}]}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},additionalText:{defaultValue:null,description:"",name:"additionalText",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"}]}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},errorMessage:{defaultValue:null,description:"",name:"errorMessage",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},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"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<number | undefined>"}]}},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"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<IconProps, string | JSXElementConstructor<any>>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const ha={title:"components/NumberField",component:p,args:{label:"Number",placeholder:"Enter a number",inputDataset:{testid:"input"},onChange:u("onChange"),onBlur:u("onBlur"),onFocus:u("onFocus"),onClick:u("onClick"),onCopy:u("onCopy"),onKeyDown:u("onKeyDown"),onKeyUp:u("onKeyUp"),onPaste:u("onPaste"),onValueChange:u("onValueChange")},render:function(a){const n=s.useRef(null);return a.ref=n,t.jsx(p,{...a})}},v={parameters:{docs:{description:{story:"An empty field with a `label` and a `placeholder`."}}}},f={args:{defaultValue:100},play:async({canvas:e,step:a})=>{await a("Validate defaultValue",async()=>{const n=e.getByTestId("input");await F(n).toHaveValue(100)}),await a("Type to value",async()=>{const n=e.getByTestId("input");await Ce.type(n,",500"),await F(n).toHaveValue(100500)})}},y={args:{icon:t.jsx(Ee,{svg:qe})}},h={args:{additionalText:"This is additional text"}},b={args:{required:!0}},g={args:{required:!0,requiredLabel:t.jsx(ke,{accent:"critical",variant:"m-bold",children:"Needed"})}},V={args:{hideLabel:!0}},x={args:{hasError:!0}},q={args:{hasError:!0,errorMessage:"This is an error message"}},E={args:{disabled:!0}},w={args:{readOnly:!0}},I={decorators:[(e,{args:a})=>t.jsxs("div",{style:{padding:"8px",margin:"8px"},children:[t.jsxs("p",{children:["You can"," ",t.jsx(T,{variant:"secondary",dataset:{testid:"focus-button"},onClick:()=>{var n,r;return(r=(n=a.ref)==null?void 0:n.current)==null?void 0:r.setFocus()},children:"Focus"})," ","the input imperatively."]}),t.jsx(e,{})]})],play:async({args:e,canvas:a})=>{if(!R(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.setFocus(),await xe(()=>F(n).toHaveFocus())}},C={decorators:[(e,{args:a})=>t.jsxs("div",{style:{height:"300px",overflow:"scroll",padding:"8px",margin:"8px"},children:[t.jsxs("p",{children:["You can"," ",t.jsx(T,{variant:"secondary",dataset:{testid:"scroll-button"},onClick:()=>{if(!R(a.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");a.ref.current.scrollIntoView()},children:"Scroll"})," ","the input into view imperatively."]}),t.jsx("div",{style:{height:"1000px",display:"flex",flexDirection:"column",justifyContent:"end",border:"2px dashed lightgray",padding:"16px"},children:t.jsx(e,{})})]})],play:async({args:e,canvas:a})=>{if(!R(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.scrollIntoView(),await xe(()=>F(n).toBeVisible())}};function R(e){return typeof e=="object"&&e!==null&&"current"in e&&e.current!==null&&typeof e.current=="object"&&"setFocus"in e.current}const H={tags:["!test"],parameters:{docs:{description:{story:'\nThe following code renders a `Numberfield` with the `required` flag, a `min`\nand `max` value, an `icon`, a `placeholder`, and some `additionalText`.\n\nWhen you click the "Submit" button and the input value is empty\n- it displays feedback via the `errorMessage` prop;\n- and uses the `setFocus()` API to bring the focus back to the field.\n\nIt uses the `value` and `onValueChange` props to react to the user input.\n'}},chromatic:{disableSnapshot:!0}},render:function(){const a=s.useRef(null),[n,r]=s.useState(void 0),[i,d]=s.useState(!1),o=l=>{if(l===void 0)return"Please provide a number";if(l!==Math.round(l))return"Please provide a whole number";if(l<10)return"Please book at least 10 lessons";if(l>99)return"Please book less than 100 lessons"},S=()=>{var l;d(!0),n||(l=a==null?void 0:a.current)==null||l.setFocus()};return t.jsxs("div",{style:{maxWidth:"500px",display:"flex",flexDirection:"column"},children:[t.jsx(p,{id:"lessons",name:"lessons",label:"Number of lessons",icon:t.jsx(Ee,{svg:qe}),placeholder:"How about 3?",value:n,additionalText:"These lessons will be scheduled automatically",onValueChange:r,errorMessage:i?o(n):void 0,min:10,max:99,ref:a,required:!0}),t.jsx(T,{onClick:S,children:"Submit"})]})}};var k,j,B;v.parameters={...v.parameters,docs:{...(k=v.parameters)==null?void 0:k.docs,source:{originalSource:`{
+@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-required":{defaultValue:null,description:"Indicates that user input is required on the element before a form may be submitted.",name:"aria-required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},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<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},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"}]}},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:"ValueChangeEventHandler<number | undefined>"}]}},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: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Be="_NumberField_kx5jx_1",Pe={NumberField:Be},Le=({id:e,...a},n)=>{const r=s.useRef(null),i=Re();s.useImperativeHandle(n,()=>({setFocus:()=>{var c;return(c=r==null?void 0:r.current)==null?void 0:c.setFocus()},scrollIntoView:()=>{var c;return(c=r==null?void 0:r.current)==null?void 0:c.scrollIntoView()}}));const d=Te({id:e,...a},m.NumberField),{layoutProps:o,inputProps:S}=d,l=we(Pe,m.NumberField),Ie=t.jsx(N,{...S,ref:i});return t.jsx(He,{...o,className:l.join(" "),input:Ie,inputHandle:i.current,ref:r,preplyDsComponent:m.NumberField})},p=s.forwardRef(Le);try{p.displayName="NumberField",p.__docgenInfo={description:"By default, this field acts as a controlled field and expects the parent\ncomponent to manage the state, by reacting to user input via the `onChange` or\n`onValueChange` props, and providing the latest state via the `value` prop.\n\nAlternatively, you can use it as an uncontrolled field using the\n`defaultValue` prop instead of the `value` prop.",displayName:"NumberField",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},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"}]}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",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"}]}},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"}]}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},additionalText:{defaultValue:null,description:"",name:"additionalText",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"}]}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},errorMessage:{defaultValue:null,description:"",name:"errorMessage",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},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"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"number"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<number | undefined>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<IconProps, string | JSXElementConstructor<any>>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const ha={title:"components/NumberField",component:p,args:{label:"Number",placeholder:"Enter a number",inputDataset:{testid:"input"},onChange:u("onChange"),onBlur:u("onBlur"),onFocus:u("onFocus"),onClick:u("onClick"),onCopy:u("onCopy"),onKeyDown:u("onKeyDown"),onKeyUp:u("onKeyUp"),onPaste:u("onPaste"),onValueChange:u("onValueChange")},render:function(a){const n=s.useRef(null);return a.ref=n,t.jsx(p,{...a})}},v={parameters:{docs:{description:{story:"An empty field with a `label` and a `placeholder`."}}}},f={args:{defaultValue:100},play:async({canvas:e,step:a})=>{await a("Validate defaultValue",async()=>{const n=e.getByTestId("input");await F(n).toHaveValue(100)}),await a("Type to value",async()=>{const n=e.getByTestId("input");await Ce.type(n,",500"),await F(n).toHaveValue(100500)})}},y={args:{icon:t.jsx(Ee,{svg:qe})}},h={args:{additionalText:"This is additional text"}},b={args:{required:!0}},g={args:{required:!0,requiredLabel:t.jsx(ke,{accent:"critical",variant:"m-bold",children:"Needed"})}},V={args:{hideLabel:!0}},x={args:{hasError:!0}},q={args:{hasError:!0,errorMessage:"This is an error message"}},E={args:{disabled:!0}},w={args:{readOnly:!0}},I={decorators:[(e,{args:a})=>t.jsxs("div",{style:{padding:"8px",margin:"8px"},children:[t.jsxs("p",{children:["You can"," ",t.jsx(T,{variant:"secondary",dataset:{testid:"focus-button"},onClick:()=>{var n,r;return(r=(n=a.ref)==null?void 0:n.current)==null?void 0:r.setFocus()},children:"Focus"})," ","the input imperatively."]}),t.jsx(e,{})]})],play:async({args:e,canvas:a})=>{if(!R(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.setFocus(),await xe(()=>F(n).toHaveFocus())}},C={decorators:[(e,{args:a})=>t.jsxs("div",{style:{height:"300px",overflow:"scroll",padding:"8px",margin:"8px"},children:[t.jsxs("p",{children:["You can"," ",t.jsx(T,{variant:"secondary",dataset:{testid:"scroll-button"},onClick:()=>{if(!R(a.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");a.ref.current.scrollIntoView()},children:"Scroll"})," ","the input into view imperatively."]}),t.jsx("div",{style:{height:"1000px",display:"flex",flexDirection:"column",justifyContent:"end",border:"2px dashed lightgray",padding:"16px"},children:t.jsx(e,{})})]})],play:async({args:e,canvas:a})=>{if(!R(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.scrollIntoView(),await xe(()=>F(n).toBeVisible())}};function R(e){return typeof e=="object"&&e!==null&&"current"in e&&e.current!==null&&typeof e.current=="object"&&"setFocus"in e.current}const H={tags:["!test"],parameters:{docs:{description:{story:'\nThe following code renders a `Numberfield` with the `required` flag, a `min`\nand `max` value, an `icon`, a `placeholder`, and some `additionalText`.\n\nWhen you click the "Submit" button and the input value is empty\n- it displays feedback via the `errorMessage` prop;\n- and uses the `setFocus()` API to bring the focus back to the field.\n\nIt uses the `value` and `onValueChange` props to react to the user input.\n'}},chromatic:{disableSnapshot:!0}},render:function(){const a=s.useRef(null),[n,r]=s.useState(void 0),[i,d]=s.useState(!1),o=l=>{if(l===void 0)return"Please provide a number";if(l!==Math.round(l))return"Please provide a whole number";if(l<10)return"Please book at least 10 lessons";if(l>99)return"Please book less than 100 lessons"},S=()=>{var l;d(!0),n||(l=a==null?void 0:a.current)==null||l.setFocus()};return t.jsxs("div",{style:{maxWidth:"500px",display:"flex",flexDirection:"column"},children:[t.jsx(p,{id:"lessons",name:"lessons",label:"Number of lessons",icon:t.jsx(Ee,{svg:qe}),placeholder:"How about 3?",value:n,additionalText:"These lessons will be scheduled automatically",onValueChange:r,errorMessage:i?o(n):void 0,min:10,max:99,ref:a,required:!0}),t.jsx(T,{onClick:S,children:"Submit"})]})}};var k,j,B;v.parameters={...v.parameters,docs:{...(k=v.parameters)==null?void 0:k.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {

package/dist/assets/{ObserveIntersection-Ccn6ggRl.js → ObserveIntersection-D396wl1Z.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-CK5RwCMK.js → ObserveIntersection.stories-DIe0cEvy.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-Ccn6ggRl.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./componentNames-Bwls0I02.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-D396wl1Z.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./componentNames-Bwls0I02.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-x2DszDmR.js → OnboardingTooltip-IYSphueI.js}

@@ -1,4 +1,4 @@
-import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as n}from"./index-Cb9e4tly.js";import{R,A as V,P as k,C as q,a as x,b as O}from"./index-F5yHvirT.js";import{F as N}from"./TokyoUIClose-thK8sk63.js";import{I as E}from"./Icon-C6rDUkYo.js";import{T as P}from"./Text-DYAggeGe.js";import{B as j}from"./Button-CGkNG45w.js";import{H as T}from"./Heading-D5Sdpx6j.js";import{u as S}from"./index-D1pfvbUR.js";import{g as D}from"./shared-strings-Biv7UF3M.js";import{i as L}from"./PortalElementProvider-C0EkDknq.js";import{g as M}from"./index-DdzHuZ-Y.js";import{w as H}from"./componentNames-Bwls0I02.js";import{M as J}from"./message-B1DLZQ1U.js";const X="_content_17r1k_2",B="_header_17r1k_23",U="_close_17r1k_29",A="_footer_17r1k_43",F="_arrow_17r1k_49",o={content:X,header:B,close:U,footer:A,arrow:F},G=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:t,side:l,dataset:h,actionLabel:b=a.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(),_=L(),f=n.useId(),w=n.useId(),d=n.useId(),c=n.useRef(null);return n.useEffect(()=>{e&&c.current&&v&&G(c.current)},[v,e]),r?t:a.jsxs(R,{open:e,onOpenChange:i,children:[a.jsx(V,{ref:c,id:d,asChild:!0,children:t}),a.jsx(k,{container:_,children:a.jsxs(q,{side:l,className:o.content,"aria-labelledby":f,"aria-describedby":`${d} ${w}`,...M(h,{preplyDsComponent:H.OnboardingTooltip}),children:[a.jsxs("div",{className:o.header,children:[a.jsx(x,{className:o.close,"aria-label":I(D.close),"data-testid":"close",children:a.jsx(E,{accent:"inverted",svg:N})}),a.jsx(T,{tag:"h1",variant:"small",accent:"inverted",id:f,"aria-describedby":d,children:u})]}),a.jsx(P,{variant:"default-regular",accent:"inverted",children:s}),a.jsxs("div",{className:o.footer,children:[C,a.jsx(j,{variant:"inverted",size:"small",onClick:g,href:y,dataset:{testid:"action"},wrap:!0,children:b})]}),a.jsx(O,{"aria-hidden":!0,className:o.arrow,width:18,height:11})]})})]})},p=e=>{const[i,r]=n.useState(!0),u=t=>{var l;t||(l=e.onClose)==null||l.call(e),r(t)},s=()=>{var t,l;(t=e.actionOnClick)==null||t.call(e),r(!1),(l=e.onClose)==null||l.call(e)};return a.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 a}from"./jsx-runtime-BTJTZTIL.js";import{r as n}from"./index-Cb9e4tly.js";import{R as x,A as R,P as V,C as q,a as O,b as N}from"./index-DSa6qU7h.js";import{F as E}from"./TokyoUIClose-thK8sk63.js";import{I as k}from"./Icon-BwwIOKM_.js";import{T as P}from"./Text-CDqVYAcD.js";import{B as j}from"./Button-DqwK0S70.js";import{H as T}from"./Heading-CifnBvGj.js";import{u as S}from"./index-D1pfvbUR.js";import{g as D}from"./shared-strings-Biv7UF3M.js";import{i as L}from"./PortalElementProvider-DidBkzFe.js";import{g as M}from"./index-DdzHuZ-Y.js";import{w as H}from"./componentNames-Bwls0I02.js";import{M as J}from"./message-B1DLZQ1U.js";const X="_content_f6xah_2",B="_header_f6xah_23",U="_close_f6xah_29",A="_footer_f6xah_43",F="_arrow_f6xah_49",o={content:X,header:B,close:U,footer:A,arrow:F},G=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:t,side:l,dataset:h,actionLabel:b=a.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:f=!0})=>{const{formatMessage:I}=S(),_=L(),v=n.useId(),w=n.useId(),d=n.useId(),c=n.useRef(null);return n.useEffect(()=>{e&&c.current&&f&&G(c.current)},[f,e]),r?t:a.jsxs(x,{open:e,onOpenChange:i,children:[a.jsx(R,{ref:c,id:d,asChild:!0,children:t}),a.jsx(V,{container:_,children:a.jsxs(q,{side:l,className:o.content,"aria-labelledby":v,"aria-describedby":`${d} ${w}`,...M(h,{preplyDsComponent:H.OnboardingTooltip}),children:[a.jsxs("div",{className:o.header,children:[a.jsx(O,{className:o.close,"aria-label":I(D.close),"data-testid":"close",children:a.jsx(k,{accent:"inverted",svg:E})}),a.jsx(T,{tag:"h1",variant:"small",accent:"inverted",id:v,"aria-describedby":d,children:u})]}),a.jsx(P,{variant:"default-regular",accent:"inverted",children:s}),a.jsxs("div",{className:o.footer,children:[C,a.jsx(j,{variant:"inverted",size:"small",onClick:g,href:y,dataset:{testid:"action"},wrap:!0,children:b})]}),a.jsx(N,{"aria-hidden":!0,className:o.arrow,width:18,height:11})]})})]})},p=e=>{const[i,r]=n.useState(!0),u=t=>{var l;t||(l=e.onClose)==null||l.call(e),r(t)},s=()=>{var t,l;(t=e.actionOnClick)==null||t.call(e),r(!1),(l=e.onClose)==null||l.call(e)};return a.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-RxaiJe-3.css

@@ -0,0 +1 @@
+._content_f6xah_2{background-color:var(--79dffb);border-radius:var(--fa4b1a);padding:var(--558c4c);box-shadow:var(--df7dbb);width:304px;display:flex;flex-direction:column;gap:var(--813599);z-index:var(--preply-ds-onboarding-tooltip-z-index);animation-duration:.15s;animation-timing-function:cubic-bezier(.25,0,.5,1.3);transform-origin:var(--radix-popover-content-transform-origin);will-change:transform,opacity}._content_f6xah_2[data-state=open]{animation-name:_appear_f6xah_1}._content_f6xah_2[data-state=closed]{animation-name:_disappear_f6xah_1}._header_f6xah_23{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:flex-start}._close_f6xah_29{background:none;border:none;border-radius:var(--5e8be4);padding:0;margin:0;cursor:pointer}._close_f6xah_29:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}._footer_f6xah_43{display:flex;justify-content:flex-end;gap:var(--813599);align-items:center}._arrow_f6xah_49{fill:var(--79dffb)}@keyframes _appear_f6xah_1{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes _disappear_f6xah_1{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}

package/dist/assets/{OnboardingTooltip.stories-YGWZh7wP.js → OnboardingTooltip.stories-DnfLcLUg.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{O as u}from"./OnboardingTooltip-x2DszDmR.js";import{I as g}from"./IconButton-Bh5Ni2UR.js";import{F as x}from"./TokyoUIFav-DOVerCtW.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-F5yHvirT.js";import"./PortalElementProvider-C0EkDknq.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-CWwb_nwj.js";import"./tslib.es6-BntfKcQG.js";import"./index-Cif9ZBgo.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-C6rDUkYo.js";import"./text-accent-CvjwTDtK.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-DYAggeGe.js";import"./text-centered-DqK_kb5q.js";import"./Button-CGkNG45w.js";import"./ButtonBase-DGRySlif.js";import"./Spinner-DvSs1_DJ.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-D5Sdpx6j.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";const ee={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)"}},a11y:{config:{rules:[{id:"color-contrast",enabled:!1}]}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},f=t=>[!1,!1],h=t=>a=>{},o=()=>{const[t,a]=f(),v=h();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-IYSphueI.js";import{I as g}from"./IconButton-CI9clg4P.js";import{F as x}from"./TokyoUIFav-DOVerCtW.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DSa6qU7h.js";import"./PortalElementProvider-DidBkzFe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-B-5rsJjr.js";import"./tslib.es6-BntfKcQG.js";import"./index-B77PBZuV.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BwwIOKM_.js";import"./text-accent-CrnHOlvW.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-CDqVYAcD.js";import"./text-centered-1sU8-E1D.js";import"./Button-DqwK0S70.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-CifnBvGj.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";const ee={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)"}},a11y:{config:{rules:[{id:"color-contrast",enabled:!1}]}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},f=t=>[!1,!1],h=t=>a=>{},o=()=>{const[t,a]=f(),v=h();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-BK5MQVED.js → OnboardingTooltip.tests.stories-DobHu21P.js}

@@ -1,4 +1,4 @@
-import{j as c}from"./jsx-runtime-BTJTZTIL.js";import{O as b}from"./OnboardingTooltip-x2DszDmR.js";import{I as T}from"./IconButton-Bh5Ni2UR.js";import{F as g}from"./TokyoUIFav-DOVerCtW.js";import{a as s,w as r,e as p,u as v}from"./index-BVDq5o4N.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-F5yHvirT.js";import"./PortalElementProvider-C0EkDknq.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-CWwb_nwj.js";import"./tslib.es6-BntfKcQG.js";import"./index-Cif9ZBgo.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-C6rDUkYo.js";import"./text-accent-CvjwTDtK.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-DYAggeGe.js";import"./text-centered-DqK_kb5q.js";import"./Button-CGkNG45w.js";import"./ButtonBase-DGRySlif.js";import"./Spinner-DvSs1_DJ.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-D5Sdpx6j.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";const et={title:"Components/OnboardingTooltip/Tests",component:b,parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[e=>c.jsx("div",{style:{margin:"100px 0"},children:e()})],args:{title:"Title",text:"Body text",actionLabel:"Action label",disabled:!1,onClose:()=>{},dataset:{testid:"tooltip"},children:c.jsx(T,{svg:c.jsx(g,{}),assistiveText:"Favorite"})}},n={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 p(t).toBeVisible()})}),await o("close the tooltip",()=>{const l=s(i.getByTestId("tooltip")).getByTestId("close");return v.click(l)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return p(t).toBeNull()})})}},a={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 p(t).toBeVisible()})}),await o("close the tooltip",()=>{const l=s(i.getByTestId("tooltip")).getByTestId("action");return v.click(l)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return p(t).toBeNull()})})}};var m,d,u;n.parameters={...n.parameters,docs:{...(m=n.parameters)==null?void 0:m.docs,source:{originalSource:`{
+import{j as c}from"./jsx-runtime-BTJTZTIL.js";import{O as b}from"./OnboardingTooltip-IYSphueI.js";import{I as T}from"./IconButton-CI9clg4P.js";import{F as g}from"./TokyoUIFav-DOVerCtW.js";import{a as s,w as r,e as p,u as v}from"./index-BVDq5o4N.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DSa6qU7h.js";import"./PortalElementProvider-DidBkzFe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-B-5rsJjr.js";import"./tslib.es6-BntfKcQG.js";import"./index-B77PBZuV.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BwwIOKM_.js";import"./text-accent-CrnHOlvW.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-CDqVYAcD.js";import"./text-centered-1sU8-E1D.js";import"./Button-DqwK0S70.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-CifnBvGj.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";const et={title:"Components/OnboardingTooltip/Tests",component:b,parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[e=>c.jsx("div",{style:{margin:"100px 0"},children:e()})],args:{title:"Title",text:"Body text",actionLabel:"Action label",disabled:!1,onClose:()=>{},dataset:{testid:"tooltip"},children:c.jsx(T,{svg:c.jsx(g,{}),assistiveText:"Favorite"})}},n={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 p(t).toBeVisible()})}),await o("close the tooltip",()=>{const l=s(i.getByTestId("tooltip")).getByTestId("close");return v.click(l)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return p(t).toBeNull()})})}},a={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 p(t).toBeVisible()})}),await o("close the tooltip",()=>{const l=s(i.getByTestId("tooltip")).getByTestId("action");return v.click(l)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return p(t).toBeNull()})})}};var m,d,u;n.parameters={...n.parameters,docs:{...(m=n.parameters)==null?void 0:m.docs,source:{originalSource:`{
   play: async ({
     canvasElement,
     step

package/dist/assets/{OnboardingTour-X5M_cS7-.js → OnboardingTour-2YaW_XWj.js}

@@ -1,4 +1,4 @@
-import{j as o}from"./jsx-runtime-BTJTZTIL.js";import{r as u}from"./index-Cb9e4tly.js";import{I as T}from"./OnboardingTooltip-x2DszDmR.js";import"./index-D1pfvbUR.js";import{M as f}from"./message-B1DLZQ1U.js";const _="_counter_mc3pl_2",j={counter:_},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,l]=u.useState(!0),[d,g]=u.useState(0),c={totalSteps:n,nextActionLabel:e,completeActionLabel:a,onClose:()=>{l(!1),t==null||t()},active:!s&&b,currentStep:d,onActionClick:()=>{if(d===n-1)r==null||r(),l(!1);else{const h=d+1;g(h),i==null||i(h)}}};return o.jsx(x.Provider,{value:c,children:p})},A=({ctx:n,...e})=>{const a=u.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,l=e.step===r-1,d=e.step===t,g=l?b:x,m=()=>{var c;(c=e.actionOnClick)==null||c.call(e),i()},O=c=>{c||s==null||s()};return o.jsx(T,{...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=u.createContext(null);return{Provider:t=>o.jsx(v,{...t,ctx:n}),Step:t=>o.jsx(A,{...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 T}from"./OnboardingTooltip-IYSphueI.js";import"./index-D1pfvbUR.js";import{M as f}from"./message-B1DLZQ1U.js";const _="_counter_1uksi_2",j={counter:_},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})},A=({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(T,{...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(A,{...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-BP4h7xR5.css → OnboardingTour-Dr4ZlIUd.css}

@@ -1 +1 @@
-._counter_mc3pl_2{flex:1;min-width:max-content;color:var(--a924f9);font-size:var(--f7d879);font-weight:var(--87a7e3);line-height:var(--1cb31f)}
+._counter_1uksi_2{flex:1;min-width:max-content;color:var(--a924f9);font-size:var(--f7d879);font-weight:var(--87a7e3);line-height:var(--1cb31f)}

package/dist/assets/{OnboardingTour.stories-BXsH2xpO.js → OnboardingTour.stories-BUBpjiez.js}

@@ -1,8 +1,8 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as b}from"./index-Cb9e4tly.js";import{c as x}from"./OnboardingTour-X5M_cS7-.js";import{T as n}from"./Text-DYAggeGe.js";import{L as y}from"./LayoutFlex-gmvguImq.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-x2DszDmR.js";import"./index-F5yHvirT.js";import"./PortalElementProvider-C0EkDknq.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-CWwb_nwj.js";import"./tslib.es6-BntfKcQG.js";import"./index-Cif9ZBgo.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-C6rDUkYo.js";import"./text-accent-CvjwTDtK.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Button-CGkNG45w.js";import"./ButtonBase-DGRySlif.js";import"./Spinner-DvSs1_DJ.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-D5Sdpx6j.js";import"./text-centered-DqK_kb5q.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";import"./layout-relative.module-CictnSCd.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-2YaW_XWj.js";import{T as n}from"./Text-CDqVYAcD.js";import{L as y}from"./LayoutFlex-CaenMVBF.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-IYSphueI.js";import"./index-DSa6qU7h.js";import"./PortalElementProvider-DidBkzFe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-B-5rsJjr.js";import"./tslib.es6-BntfKcQG.js";import"./index-B77PBZuV.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BwwIOKM_.js";import"./text-accent-CrnHOlvW.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Button-DqwK0S70.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./Heading-CifnBvGj.js";import"./text-centered-1sU8-E1D.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";import"./layout-relative.module-Bf3FithH.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
-props as originals just for props parsing ¯\\_(ツ)_/¯`,displayName:"OnboardingTourProvider",props:{totalSteps:{defaultValue:null,description:"Total number of steps in the tour",name:"totalSteps",required:!0,type:{name:"number"}},nextActionLabel:{defaultValue:{value:'"Next"'},description:'Label for the "Next" action button',name:"nextActionLabel",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"}]}},completeActionLabel:{defaultValue:{value:'"Got it"'},description:'Label for the "Complete" action button',name:"completeActionLabel",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"}]}},disabled:{defaultValue:null,description:"Whether the tour is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClose:{defaultValue:null,description:"Called when the tour is closed",name:"onClose",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},onComplete:{defaultValue:null,description:"Called when the tour is completed",name:"onComplete",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},onStepChange:{defaultValue:null,description:"Called when the current step index changes",name:"onStepChange",required:!1,type:{name:"enum",value:[{value:"(step: number) => void"}]}}}}}catch{}try{s.displayName="OnboardingTourStep",s.__docgenInfo={description:"",displayName:"OnboardingTourStep",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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"}]}},actionOnClick:{defaultValue:null,description:"By default, the action button closes the tooltip.\n\nProvide `actionOnClick` to also perform other action.",name:"actionOnClick",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},side:{defaultValue:null,description:"Preferred side of the tooltip to appear from. Use if default side might block important content.",name:"side",required:!1,type:{name:"enum",value:[{value:'"top"'},{value:'"right"'},{value:'"bottom"'},{value:'"left"'}]}},autoScroll:{defaultValue:{value:"true"},description:"If true, the tooltip will automatically scroll into view when it is opened.",name:"autoScroll",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},step:{defaultValue:null,description:"Zero-based step index",name:"step",required:!0,type:{name:"number"}}}}}catch{}const o=x(),le={title:"Components/OnboardingTour",component:l,subcomponents:{OnboardingTourStep:s},parameters:{docs:{story:{inline:!1,height:250},description:{component:"Are you looking for a tooltip to highlight single element? Check out [OnboardingTooltip](/docs/components-onboardingtooltip--docs)"}},a11y:{config:{rules:[{id:"color-contrast",enabled:!1}]}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},C=t=>[!1,!1],j=t=>i=>{},r=()=>{const[t,i]=C(),T=j();return e.jsxs(o.Provider,{totalSteps:3,disabled:i||t,onComplete:()=>T(!0),children:[e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:0,title:"Step 1",text:"This is the first step of the onboarding tour.",children:e.jsx(n,{children:"Step 1"})})}),e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:1,title:"Step 2",text:"This is the second step of the onboarding tour.",children:e.jsx(n,{children:"Step 2"})})}),e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:2,title:"Step 3",text:"This is the final step of the onboarding tour.",children:e.jsx(n,{children:"Step 3"})})})]})};r.storyName="OnboardingTour";const a=()=>{const[t,i]=b.useState(!0);return e.jsx(o.Provider,{totalSteps:3,children:e.jsxs(y,{gap:"12",children:[e.jsx(o.Step,{step:0,title:"First step",text:"This is the first step of the onboarding tour.",children:e.jsx(n,{children:"Step 1"})}),e.jsx(o.Step,{step:1,title:"Second step",text:"This is the second step of the onboarding tour.",actionOnClick:()=>i(!1),children:e.jsx(n,{children:"Step 2"})}),!t&&e.jsx(o.Step,{step:2,title:"Final step",text:"This is the final step of the onboarding tour.",children:e.jsx(n,{children:"Step 3 (I was hidden)"})})]})})};var u,p,d,c,m;r.parameters={...r.parameters,docs:{...(u=r.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
+props as originals just for props parsing ¯\\_(ツ)_/¯`,displayName:"OnboardingTourProvider",props:{totalSteps:{defaultValue:null,description:"Total number of steps in the tour",name:"totalSteps",required:!0,type:{name:"number"}},nextActionLabel:{defaultValue:{value:'"Next"'},description:'Label for the "Next" action button',name:"nextActionLabel",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"}]}},completeActionLabel:{defaultValue:{value:'"Got it"'},description:'Label for the "Complete" action button',name:"completeActionLabel",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"}]}},disabled:{defaultValue:null,description:"Whether the tour is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClose:{defaultValue:null,description:"Called when the tour is closed",name:"onClose",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},onComplete:{defaultValue:null,description:"Called when the tour is completed",name:"onComplete",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},onStepChange:{defaultValue:null,description:"Called when the current step index changes",name:"onStepChange",required:!1,type:{name:"enum",value:[{value:"(step: number) => void"}]}}}}}catch{}try{s.displayName="OnboardingTourStep",s.__docgenInfo={description:"",displayName:"OnboardingTourStep",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},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"}]}},side:{defaultValue:null,description:"Preferred side of the tooltip to appear from. Use if default side might block important content.",name:"side",required:!1,type:{name:"enum",value:[{value:'"top"'},{value:'"right"'},{value:'"bottom"'},{value:'"left"'}]}},actionOnClick:{defaultValue:null,description:"By default, the action button closes the tooltip.\n\nProvide `actionOnClick` to also perform other action.",name:"actionOnClick",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},autoScroll:{defaultValue:{value:"true"},description:"If true, the tooltip will automatically scroll into view when it is opened.",name:"autoScroll",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},step:{defaultValue:null,description:"Zero-based step index",name:"step",required:!0,type:{name:"number"}}}}}catch{}const o=x(),le={title:"Components/OnboardingTour",component:l,subcomponents:{OnboardingTourStep:s},parameters:{docs:{story:{inline:!1,height:250},description:{component:"Are you looking for a tooltip to highlight single element? Check out [OnboardingTooltip](/docs/components-onboardingtooltip--docs)"}},a11y:{config:{rules:[{id:"color-contrast",enabled:!1}]}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},C=t=>[!1,!1],j=t=>i=>{},r=()=>{const[t,i]=C(),T=j();return e.jsxs(o.Provider,{totalSteps:3,disabled:i||t,onComplete:()=>T(!0),children:[e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:0,title:"Step 1",text:"This is the first step of the onboarding tour.",children:e.jsx(n,{children:"Step 1"})})}),e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:1,title:"Step 2",text:"This is the second step of the onboarding tour.",children:e.jsx(n,{children:"Step 2"})})}),e.jsx("div",{style:{height:250},children:e.jsx(o.Step,{step:2,title:"Step 3",text:"This is the final step of the onboarding tour.",children:e.jsx(n,{children:"Step 3"})})})]})};r.storyName="OnboardingTour";const a=()=>{const[t,i]=b.useState(!0);return e.jsx(o.Provider,{totalSteps:3,children:e.jsxs(y,{gap:"12",children:[e.jsx(o.Step,{step:0,title:"First step",text:"This is the first step of the onboarding tour.",children:e.jsx(n,{children:"Step 1"})}),e.jsx(o.Step,{step:1,title:"Second step",text:"This is the second step of the onboarding tour.",actionOnClick:()=>i(!1),children:e.jsx(n,{children:"Step 2"})}),!t&&e.jsx(o.Step,{step:2,title:"Final step",text:"This is the final step of the onboarding tour.",children:e.jsx(n,{children:"Step 3 (I was hidden)"})})]})})};var u,p,d,c,m;r.parameters={...r.parameters,docs:{...(u=r.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
   const [wasTourCompleted, loading] = useIsFeatureActive('my-tour');
   const setTourCompleted = useToggleFeature('my-tour');
   return <Tour.Provider totalSteps={3} disabled={loading || wasTourCompleted} onComplete={() => setTourCompleted(true)}>

package/dist/assets/{OnboardingTour.tests.stories-DPOUFVqx.js → OnboardingTour.tests.stories-Buou9m4A.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as g}from"./index-Cb9e4tly.js";import{c as h}from"./OnboardingTour-X5M_cS7-.js";import{T}from"./Text-DYAggeGe.js";import{B as S}from"./Button-CGkNG45w.js";import{f as m,a as p,w as c,e as n,u as l}from"./index-BVDq5o4N.js";import{L as V}from"./LayoutFlex-gmvguImq.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-x2DszDmR.js";import"./index-F5yHvirT.js";import"./PortalElementProvider-C0EkDknq.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-CWwb_nwj.js";import"./tslib.es6-BntfKcQG.js";import"./index-Cif9ZBgo.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-C6rDUkYo.js";import"./text-accent-CvjwTDtK.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Heading-D5Sdpx6j.js";import"./text-centered-DqK_kb5q.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";import"./ButtonBase-DGRySlif.js";import"./Spinner-DvSs1_DJ.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-CictnSCd.js";const d=h(),vt={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:m(),onClose:m(),onStepChange:m()}},y={render:({onComplete:i,onStepChange:s})=>e.jsx(d.Provider,{totalSteps:3,nextActionLabel:"Next",completeActionLabel:"Got it",onComplete:i,onStepChange:s,children:e.jsxs(V,{gap:"24",direction:"column",children:[e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(T,{children:"Step 1 Content"})}),e.jsx(d.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"step-2"},children:e.jsx(T,{children:"Step 2 Content"})}),e.jsx(d.Step,{step:2,title:"Title",text:"Text",dataset:{testid:"step-3"},children:e.jsx(T,{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 u=a.getByTestId("step-2");n(u).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 u=a.getByTestId("step-3");n(u).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 u=a.queryByTestId("step",{exact:!1});n(u).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(T,{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 u=t.queryByTestId("step",{exact:!1});n(u).toBeNull(),n(a.onClose).toHaveBeenCalled()})})}},B={render:function(){const[s,t]=g.useState(!0);return e.jsxs(V,{gap:"24",direction:"column",children:[e.jsx(S,{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(T,{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()})})}},b=h(),v=h(),w={render:function(){const[s,t]=g.useState(!1),[a,o]=g.useState(!1);return e.jsxs(b.Provider,{totalSteps:2,disabled:!s,nextActionLabel:"Next",completeActionLabel:"Got it",children:[e.jsx(b.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"outer-step-1"},children:e.jsx(S,{onClick:()=>t(!0),dataset:{testid:"start-outer-tour"},children:"Start outer tour"})}),e.jsxs(v.Provider,{totalSteps:2,disabled:!a,nextActionLabel:"Next",completeActionLabel:"Done",children:[e.jsx(b.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"outer-step-2"},children:e.jsx(T,{children:"Outer Tour Step"})}),e.jsx(v.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"inner-step-1"},children:e.jsx(S,{onClick:()=>o(!0),dataset:{testid:"start-inner-tour"},children:"Start inner tour"})}),e.jsx(v.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"inner-step-2"},children:e.jsx(T,{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()})})}};var I,C,k;y.parameters={...y.parameters,docs:{...(I=y.parameters)==null?void 0:I.docs,source:{originalSource:`{
+import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as g}from"./index-Cb9e4tly.js";import{c as h}from"./OnboardingTour-2YaW_XWj.js";import{T}from"./Text-CDqVYAcD.js";import{B as S}from"./Button-DqwK0S70.js";import{f as m,a as p,w as c,e as n,u as l}from"./index-BVDq5o4N.js";import{L as V}from"./LayoutFlex-CaenMVBF.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./OnboardingTooltip-IYSphueI.js";import"./index-DSa6qU7h.js";import"./PortalElementProvider-DidBkzFe.js";import"./index-BPrLDK9Y.js";import"./index-C7hTFOIV.js";import"./index-B-5rsJjr.js";import"./tslib.es6-BntfKcQG.js";import"./index-B77PBZuV.js";import"./TokyoUIClose-thK8sk63.js";import"./Icon-BwwIOKM_.js";import"./text-accent-CrnHOlvW.js";import"./classNames-BUL1Zq7e.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./render-icon-BT0Aq7PA.js";import"./componentNames-Bwls0I02.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Heading-CifnBvGj.js";import"./text-centered-1sU8-E1D.js";import"./index-D1pfvbUR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-Biv7UF3M.js";import"./message-B1DLZQ1U.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-Bf3FithH.js";const d=h(),vt={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:m(),onClose:m(),onStepChange:m()}},y={render:({onComplete:i,onStepChange:s})=>e.jsx(d.Provider,{totalSteps:3,nextActionLabel:"Next",completeActionLabel:"Got it",onComplete:i,onStepChange:s,children:e.jsxs(V,{gap:"24",direction:"column",children:[e.jsx(d.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"step-1"},children:e.jsx(T,{children:"Step 1 Content"})}),e.jsx(d.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"step-2"},children:e.jsx(T,{children:"Step 2 Content"})}),e.jsx(d.Step,{step:2,title:"Title",text:"Text",dataset:{testid:"step-3"},children:e.jsx(T,{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 u=a.getByTestId("step-2");n(u).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 u=a.getByTestId("step-3");n(u).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 u=a.queryByTestId("step",{exact:!1});n(u).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(T,{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 u=t.queryByTestId("step",{exact:!1});n(u).toBeNull(),n(a.onClose).toHaveBeenCalled()})})}},B={render:function(){const[s,t]=g.useState(!0);return e.jsxs(V,{gap:"24",direction:"column",children:[e.jsx(S,{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(T,{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()})})}},b=h(),v=h(),w={render:function(){const[s,t]=g.useState(!1),[a,o]=g.useState(!1);return e.jsxs(b.Provider,{totalSteps:2,disabled:!s,nextActionLabel:"Next",completeActionLabel:"Got it",children:[e.jsx(b.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"outer-step-1"},children:e.jsx(S,{onClick:()=>t(!0),dataset:{testid:"start-outer-tour"},children:"Start outer tour"})}),e.jsxs(v.Provider,{totalSteps:2,disabled:!a,nextActionLabel:"Next",completeActionLabel:"Done",children:[e.jsx(b.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"outer-step-2"},children:e.jsx(T,{children:"Outer Tour Step"})}),e.jsx(v.Step,{step:0,title:"Title",text:"Text",dataset:{testid:"inner-step-1"},children:e.jsx(S,{onClick:()=>o(!0),dataset:{testid:"start-inner-tour"},children:"Start inner tour"})}),e.jsx(v.Step,{step:1,title:"Title",text:"Text",dataset:{testid:"inner-step-2"},children:e.jsx(T,{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()})})}};var I,C,k;y.parameters={...y.parameters,docs:{...(I=y.parameters)==null?void 0:I.docs,source:{originalSource:`{
   render: ({
     onComplete,
     onStepChange