@preply/ds-docs 11.0.0 → 11.1.0

package/dist/assets/{Steps.stories-DqOo6fKy.js → Steps.stories-DFPBr2Yl.js}

@@ -1,8 +1,10 @@
-import{j as e,r as Y}from"./iframe-B_74HtSc.js";import{S as t,u as G}from"./Steps-DUeCVcxV.js";import{L as h}from"./LayoutFlex-DXRMJ9FH.js";import"./preload-helper-Dp1pzeXC.js";import"./Button-C0Um_QuO.js";import"./render-icon-MT6RlyNs.js";import"./ButtonBase-HkSfLFbE.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./useHostname-CbpnzdHv.js";import"./index-CC6DAVyL.js";import"./componentNames-hc9KR2nX.js";import"./index-DIqvfT2b.js";import"./Heading-Cj8Si45g.js";import"./text-accent-BQ9POoE5.js";import"./text-centered-BEaaxMgl.js";import"./ProgressSteps-Dce_SjLt.js";import"./Text-DvShrljd.js";import"./message-DJT5rp5J.js";import"./layout-relative.module-BIZVul8q.js";const{expect:a,userEvent:r,waitFor:n}=__STORYBOOK_MODULE_TEST__,me={title:"Components/Steps",component:t,decorators:[s=>e.jsx("div",{style:{padding:"32px"},children:e.jsx(s,{})})]},i=e.jsx("div",{style:{width:"100%",height:"300px",backgroundColor:"#e0e0e0",marginBottom:"16px"}}),c={parameters:{docs:{description:{story:"Basic usage with header, controls, and content per step."}}},render:()=>e.jsxs(t,{dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"This is the description for step 1.",children:i}),e.jsx(t.Step,{title:"Step 2",description:"This is the description for step 2.",children:i}),e.jsx(t.Step,{title:"Step 3",description:"This is the description for step 3.",children:i}),e.jsxs(h,{justifyContent:"space-between",children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]}),play:async({canvas:s})=>{a(s.getByText("Step 1")).toBeVisible(),await r.click(s.getByText("Next")),await n(()=>{a(s.getByText("Step 2")).toBeVisible()}),await r.click(s.getByText("Previous")),await n(()=>{a(s.getByText("Step 1")).toBeVisible()})}},d={parameters:{docs:{description:{story:"Example with hidden headers and only content per step."}}},render:()=>e.jsxs(t,{"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",hideHeader:!0,children:i}),e.jsx(t.Step,{title:"Step 2",hideHeader:!0,children:i}),e.jsx(t.Step,{title:"Step 3",hideHeader:!0,children:i}),e.jsxs(h,{justifyContent:"space-between",children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},l={parameters:{docs:{description:{story:"Example demonstrating the use of a custom `initialStep`."}}},render:()=>e.jsxs(t,{initialStep:2,"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Step 1 is skipped.",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Starting at step 2.",children:i}),e.jsx(t.Step,{title:"Step 3",description:"This is the third step.",children:i})]})},S={parameters:{docs:{description:{story:"Example with only navigation controls, no headers or content."}}},render:()=>e.jsxs(t,{"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",children:i}),e.jsx(t.Step,{title:"Step 2",children:i}),e.jsx(t.Step,{title:"Step 3",children:i}),e.jsxs(h,{justifyContent:"space-between",children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},u={parameters:{docs:{description:{story:`Example with a 1-second async delay between steps.
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,r as a,t as o}from"./Steps-Bf2x77zr.js";import{n as s,t as c}from"./LayoutFlex-DdWp4cl3.js";var l,u,d,f,p,m,h,g,_,v,y,b,x,S,C,w,T;t((()=>{l=e(n(),1),i(),s(),u=r(),{expect:d,userEvent:f,waitFor:p}=__STORYBOOK_MODULE_TEST__,m={title:`Components/Steps`,component:o,decorators:[e=>(0,u.jsx)(`div`,{style:{padding:`32px`},children:(0,u.jsx)(e,{})})]},h=(0,u.jsx)(`div`,{style:{width:`100%`,height:`300px`,backgroundColor:`#e0e0e0`,marginBottom:`16px`}}),g={parameters:{docs:{description:{story:`Basic usage with header, controls, and content per step.`}}},render:()=>(0,u.jsxs)(o,{dataset:{testid:`steps`},"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,description:`This is the description for step 1.`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,description:`This is the description for step 2.`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,description:`This is the description for step 3.`,children:h}),(0,u.jsxs)(c,{justifyContent:`space-between`,children:[(0,u.jsx)(o.Previous,{}),(0,u.jsx)(o.Next,{})]})]}),play:async({canvas:e})=>{d(e.getByText(`Step 1`)).toBeVisible(),await f.click(e.getByText(`Next`)),await p(()=>{d(e.getByText(`Step 2`)).toBeVisible()}),await f.click(e.getByText(`Previous`)),await p(()=>{d(e.getByText(`Step 1`)).toBeVisible()})}},_={parameters:{docs:{description:{story:`Example with hidden headers and only content per step.`}}},render:()=>(0,u.jsxs)(o,{"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,hideHeader:!0,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,hideHeader:!0,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,hideHeader:!0,children:h}),(0,u.jsxs)(c,{justifyContent:`space-between`,children:[(0,u.jsx)(o.Previous,{}),(0,u.jsx)(o.Next,{})]})]})},v={parameters:{docs:{description:{story:"Example demonstrating the use of a custom `initialStep`."}}},render:()=>(0,u.jsxs)(o,{initialStep:2,"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,description:`Step 1 is skipped.`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,description:`Starting at step 2.`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,description:`This is the third step.`,children:h})]})},y={parameters:{docs:{description:{story:`Example with only navigation controls, no headers or content.`}}},render:()=>(0,u.jsxs)(o,{"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,children:h}),(0,u.jsxs)(c,{justifyContent:`space-between`,children:[(0,u.jsx)(o.Previous,{}),(0,u.jsx)(o.Next,{})]})]})},b={parameters:{docs:{description:{story:`Example with a 1-second async delay between steps.
 
-Navigation controls are disabled during transitions, with a cursor loading indicator.`}}},render:()=>{const s=async(p,o)=>(await new Promise(g=>setTimeout(g,1e3)),o);return e.jsxs(t,{onStepChange:s,dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Navigation has a 1s delay",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Each navigation has async validation",children:i}),e.jsx(t.Step,{title:"Step 3",description:"Buttons are disabled during validation",children:i}),e.jsx(t.Step,{title:"Step 4",description:"Final step",children:i}),e.jsxs("div",{style:{display:"flex",justifyContent:"space-between"},children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},play:async({canvas:s})=>{const p=s.getByTestId("steps");a(s.getByText("Step 1")).toBeVisible(),await r.click(s.getByText("Next")),await n(async()=>{await a(p).toContainHTML('aria-busy="true"')}),await n(async()=>{await a(p).toContainHTML('aria-busy="false"')}),a(s.getByText("Step 2")).toBeVisible()}},y={parameters:{docs:{description:{story:"You can override the navigation flow using `onStepChange`.\n\nThe following example skips step 3 and goes directly to step 4."}}},render:()=>{const s=async(p,o)=>o===3?p<3?4:2:o;return e.jsxs(t,{onStepChange:s,dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Next goes to step 2",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Step 3 will always be skipped",children:i}),e.jsx(t.Step,{title:"Step 3",description:"This step is not accessible",children:i}),e.jsx(t.Step,{title:"Step 4",description:"Previous goes to step 2",children:i}),e.jsxs(h,{justifyContent:"space-between",children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},play:async({canvas:s})=>{a(s.getByText("Step 1")).toBeVisible(),await r.click(s.getByText("Next")),await n(()=>{a(s.getByText("Step 2")).toBeVisible()}),await r.click(s.getByText("Next")),await n(()=>{a(s.getByText("Step 4")).toBeVisible()}),await r.click(s.getByText("Previous")),await n(()=>{a(s.getByText("Step 2")).toBeVisible()})}},x={parameters:{docs:{description:{story:"Although not a great UX, you can customize the placement of the navigation buttons."}}},render:()=>e.jsxs(t,{"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Custom Buttons Location",description:"Navigation buttons can be placed anywhere",children:e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[e.jsxs("div",{style:{display:"flex",gap:"8px"},children:[e.jsx(t.Previous,{variant:"secondary"}),e.jsx(t.Next,{})]}),i]})}),e.jsxs(t.Step,{title:"Customized Navigation",description:"Buttons can have custom text and styles",children:[i,e.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"8px"},children:[e.jsx(t.Next,{variant:"secondary",children:"Continue"}),e.jsx(t.Previous,{variant:"tertiary",children:"Go Back"})]})]}),e.jsxs(t.Step,{title:"Final Step",description:"Only previous button is needed here",children:[i,e.jsx("div",{children:e.jsx(t.Previous,{children:"Return to previous step"})})]})]})},X=()=>{const{goToPreviousStep:s,goToNextStep:p,goToStep:o,totalSteps:g,isNavigating:v}=G();return Y.useEffect(()=>{const w=z=>{if(!v)switch(z.key){case"ArrowLeft":s();break;case"ArrowRight":p();break;case"1":o(1);break;case"2":o(2);break;case"3":o(3);break}};return window.addEventListener("keydown",w),()=>window.removeEventListener("keydown",w)},[s,p,o,g,v]),e.jsxs("div",{style:{padding:"16px",backgroundColor:"#f5f5f5",borderRadius:"4px"},children:[e.jsxs("p",{children:[e.jsx("strong",{children:"Keyboard Navigation:"})," Click here to focus, then use:"]}),e.jsxs("ul",{children:[e.jsxs("li",{children:[e.jsx("kbd",{children:"←"})," Previous step"]}),e.jsxs("li",{children:[e.jsx("kbd",{children:"→"})," Next step"]}),e.jsxs("li",{children:[e.jsx("kbd",{children:"1"})," - ",e.jsx("kbd",{children:"3"})," Jump to step"]})]})]})},m={parameters:{docs:{description:{story:`This example demonstrates controlled navigation using the Steps context.
+Navigation controls are disabled during transitions, with a cursor loading indicator.`}}},render:()=>(0,u.jsxs)(o,{onStepChange:async(e,t)=>(await new Promise(e=>setTimeout(e,1e3)),t),dataset:{testid:`steps`},"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,description:`Navigation has a 1s delay`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,description:`Each navigation has async validation`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,description:`Buttons are disabled during validation`,children:h}),(0,u.jsx)(o.Step,{title:`Step 4`,description:`Final step`,children:h}),(0,u.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`},children:[(0,u.jsx)(o.Previous,{}),(0,u.jsx)(o.Next,{})]})]}),play:async({canvas:e})=>{let t=e.getByTestId(`steps`);d(e.getByText(`Step 1`)).toBeVisible(),await f.click(e.getByText(`Next`)),await p(async()=>{await d(t).toContainHTML(`aria-busy="true"`)}),await p(async()=>{await d(t).toContainHTML(`aria-busy="false"`)}),d(e.getByText(`Step 2`)).toBeVisible()}},x={parameters:{docs:{description:{story:`You can override the navigation flow using \`onStepChange\`.
 
-The component listens for keyboard events and uses the context functions to navigate between steps.`}}},render:()=>e.jsxs(t,{dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Use arrow keys or number keys to navigate",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Press ← or → to navigate between steps",children:i}),e.jsx(t.Step,{title:"Step 3",description:"Press 1, 2, or 3 to jump to a specific step",children:i}),e.jsx(X,{})]}),play:async({canvas:s})=>{a(s.getByText("Step 1")).toBeVisible(),await r.click(s.getByText(/Keyboard Navigation:/)),await r.keyboard("{ArrowRight}"),await n(()=>{a(s.getByText("Step 2")).toBeVisible()}),await r.keyboard("{ArrowLeft}"),await n(()=>{a(s.getByText("Step 1")).toBeVisible()}),await r.keyboard("3"),await n(()=>{a(s.getByText("Step 3")).toBeVisible()})}};var b,j,B;c.parameters={...c.parameters,docs:{...(b=c.parameters)==null?void 0:b.docs,source:{originalSource:`{
+The following example skips step 3 and goes directly to step 4.`}}},render:()=>(0,u.jsxs)(o,{onStepChange:async(e,t)=>t===3?e<3?4:2:t,dataset:{testid:`steps`},"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,description:`Next goes to step 2`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,description:`Step 3 will always be skipped`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,description:`This step is not accessible`,children:h}),(0,u.jsx)(o.Step,{title:`Step 4`,description:`Previous goes to step 2`,children:h}),(0,u.jsxs)(c,{justifyContent:`space-between`,children:[(0,u.jsx)(o.Previous,{}),(0,u.jsx)(o.Next,{})]})]}),play:async({canvas:e})=>{d(e.getByText(`Step 1`)).toBeVisible(),await f.click(e.getByText(`Next`)),await p(()=>{d(e.getByText(`Step 2`)).toBeVisible()}),await f.click(e.getByText(`Next`)),await p(()=>{d(e.getByText(`Step 4`)).toBeVisible()}),await f.click(e.getByText(`Previous`)),await p(()=>{d(e.getByText(`Step 2`)).toBeVisible()})}},S={parameters:{docs:{description:{story:`Although not a great UX, you can customize the placement of the navigation buttons.`}}},render:()=>(0,u.jsxs)(o,{"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Custom Buttons Location`,description:`Navigation buttons can be placed anywhere`,children:(0,u.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:`16px`},children:[(0,u.jsxs)(`div`,{style:{display:`flex`,gap:`8px`},children:[(0,u.jsx)(o.Previous,{variant:`secondary`}),(0,u.jsx)(o.Next,{})]}),h]})}),(0,u.jsxs)(o.Step,{title:`Customized Navigation`,description:`Buttons can have custom text and styles`,children:[h,(0,u.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,alignItems:`center`,gap:`8px`},children:[(0,u.jsx)(o.Next,{variant:`secondary`,children:`Continue`}),(0,u.jsx)(o.Previous,{variant:`tertiary`,children:`Go Back`})]})]}),(0,u.jsxs)(o.Step,{title:`Final Step`,description:`Only previous button is needed here`,children:[h,(0,u.jsx)(`div`,{children:(0,u.jsx)(o.Previous,{children:`Return to previous step`})})]})]})},C=()=>{let{goToPreviousStep:e,goToNextStep:t,goToStep:n,totalSteps:r,isNavigating:i}=a();return(0,l.useEffect)(()=>{let r=r=>{if(!i)switch(r.key){case`ArrowLeft`:e();break;case`ArrowRight`:t();break;case`1`:n(1);break;case`2`:n(2);break;case`3`:n(3);break;default:break}};return window.addEventListener(`keydown`,r),()=>window.removeEventListener(`keydown`,r)},[e,t,n,r,i]),(0,u.jsxs)(`div`,{style:{padding:`16px`,backgroundColor:`#f5f5f5`,borderRadius:`4px`},children:[(0,u.jsxs)(`p`,{children:[(0,u.jsx)(`strong`,{children:`Keyboard Navigation:`}),` Click here to focus, then use:`]}),(0,u.jsxs)(`ul`,{children:[(0,u.jsxs)(`li`,{children:[(0,u.jsx)(`kbd`,{children:`←`}),` Previous step`]}),(0,u.jsxs)(`li`,{children:[(0,u.jsx)(`kbd`,{children:`→`}),` Next step`]}),(0,u.jsxs)(`li`,{children:[(0,u.jsx)(`kbd`,{children:`1`}),` - `,(0,u.jsx)(`kbd`,{children:`3`}),` Jump to step`]})]})]})},w={parameters:{docs:{description:{story:`This example demonstrates controlled navigation using the Steps context.
+
+The component listens for keyboard events and uses the context functions to navigate between steps.`}}},render:()=>(0,u.jsxs)(o,{dataset:{testid:`steps`},"aria-label":`Story Steps`,children:[(0,u.jsx)(o.Step,{title:`Step 1`,description:`Use arrow keys or number keys to navigate`,children:h}),(0,u.jsx)(o.Step,{title:`Step 2`,description:`Press ← or → to navigate between steps`,children:h}),(0,u.jsx)(o.Step,{title:`Step 3`,description:`Press 1, 2, or 3 to jump to a specific step`,children:h}),(0,u.jsx)(C,{})]}),play:async({canvas:e})=>{d(e.getByText(`Step 1`)).toBeVisible(),await f.click(e.getByText(/Keyboard Navigation:/)),await f.keyboard(`{ArrowRight}`),await p(()=>{d(e.getByText(`Step 2`)).toBeVisible()}),await f.keyboard(`{ArrowLeft}`),await p(()=>{d(e.getByText(`Step 1`)).toBeVisible()}),await f.keyboard(`3`),await p(()=>{d(e.getByText(`Step 3`)).toBeVisible()})}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -40,7 +42,7 @@ The component listens for keyboard events and uses the context functions to navi
       expect(canvas.getByText('Step 1')).toBeVisible();
     });
   }
-}`,...(B=(j=c.parameters)==null?void 0:j.docs)==null?void 0:B.source}}};var C,T,f;d.parameters={...d.parameters,docs:{...(C=d.parameters)==null?void 0:C.docs,source:{originalSource:`{
+}`,...g.parameters?.docs?.source}}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -63,7 +65,7 @@ The component listens for keyboard events and uses the context functions to navi
                 <Steps.Next />
             </LayoutFlex>
         </Steps>
-}`,...(f=(T=d.parameters)==null?void 0:T.docs)==null?void 0:f.source}}};var k,N,D;l.parameters={...l.parameters,docs:{...(k=l.parameters)==null?void 0:k.docs,source:{originalSource:`{
+}`,..._.parameters?.docs?.source}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -84,7 +86,7 @@ The component listens for keyboard events and uses the context functions to navi
                 </Steps.Step>
             </Steps>;
   }
-}`,...(D=(N=l.parameters)==null?void 0:N.docs)==null?void 0:D.source}}};var P,E,V;S.parameters={...S.parameters,docs:{...(P=S.parameters)==null?void 0:P.docs,source:{originalSource:`{
+}`,...v.parameters?.docs?.source}}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -103,7 +105,7 @@ The component listens for keyboard events and uses the context functions to navi
                 </LayoutFlex>
             </Steps>;
   }
-}`,...(V=(E=S.parameters)==null?void 0:E.docs)==null?void 0:V.source}}};var F,L,H;u.parameters={...u.parameters,docs:{...(F=u.parameters)==null?void 0:F.docs,source:{originalSource:`{
+}`,...y.parameters?.docs?.source}}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -156,7 +158,7 @@ Navigation controls are disabled during transitions, with a cursor loading indic
     });
     expect(canvas.getByText('Step 2')).toBeVisible();
   }
-}`,...(H=(L=u.parameters)==null?void 0:L.docs)==null?void 0:H.source}}};var W,A,_;y.parameters={...y.parameters,docs:{...(W=y.parameters)==null?void 0:W.docs,source:{originalSource:`{
+}`,...b.parameters?.docs?.source}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -211,7 +213,7 @@ The following example skips step 3 and goes directly to step 4.\`
       expect(canvas.getByText('Step 2')).toBeVisible();
     });
   }
-}`,...(_=(A=y.parameters)==null?void 0:A.docs)==null?void 0:_.source}}};var R,K,O;x.parameters={...x.parameters,docs:{...(R=x.parameters)==null?void 0:R.docs,source:{originalSource:`{
+}`,...x.parameters?.docs?.source}}},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -255,7 +257,7 @@ The following example skips step 3 and goes directly to step 4.\`
                 </div>
             </Steps.Step>
         </Steps>
-}`,...(O=(K=x.parameters)==null?void 0:K.docs)==null?void 0:O.source}}};var I,M,U;m.parameters={...m.parameters,docs:{...(I=m.parameters)==null?void 0:I.docs,source:{originalSource:`{
+}`,...S.parameters?.docs?.source}}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
   parameters: {
     docs: {
       description: {
@@ -305,4 +307,4 @@ The component listens for keyboard events and uses the context functions to navi
       expect(canvas.getByText('Step 3')).toBeVisible();
     });
   }
-}`,...(U=(M=m.parameters)==null?void 0:M.docs)==null?void 0:U.source}}};const he=["WithHeadersAndControls","WithHiddenHeaders","WithCustomInitialStep","WithConstantControls","WithAsyncNavigation","WithNonLinearFlow","WithVaryingControls","WithCustomControls"];export{u as WithAsyncNavigation,S as WithConstantControls,m as WithCustomControls,l as WithCustomInitialStep,c as WithHeadersAndControls,d as WithHiddenHeaders,y as WithNonLinearFlow,x as WithVaryingControls,he as __namedExportsOrder,me as default};
+}`,...w.parameters?.docs?.source}}},T=[`WithHeadersAndControls`,`WithHiddenHeaders`,`WithCustomInitialStep`,`WithConstantControls`,`WithAsyncNavigation`,`WithNonLinearFlow`,`WithVaryingControls`,`WithCustomControls`]}))();export{b as WithAsyncNavigation,y as WithConstantControls,w as WithCustomControls,v as WithCustomInitialStep,g as WithHeadersAndControls,_ as WithHiddenHeaders,x as WithNonLinearFlow,S as WithVaryingControls,T as __namedExportsOrder,m as default};

package/dist/assets/Switch-ClfB15Th.css

@@ -0,0 +1 @@
+.Switch__mFYAU{all:unset;width:52px;min-width:52px;height:var(--7789ee);border-radius:var(--aa6dcb);background-color:var(--a5c761);transition:background-color var(--018058);cursor:pointer;align-items:center;display:flex}.Switch__mFYAU>.thumb__IEKpQ{width:var(--f316e1);height:var(--f316e1);border-radius:var(--aa6dcb);background-color:var(--3546c3);translate:var(--590b8d);transition:translate var(--018058);display:inline-block}.Switch__mFYAU[aria-checked=true]{background-color:var(--4983fe)}.Switch__mFYAU[aria-checked=true]>.thumb__IEKpQ{translate:var(--f316e1)}.Switch__mFYAU[disabled]{background-color:var(--04daeb);cursor:not-allowed}.Switch__mFYAU:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}@media (pointer:fine){.Switch__mFYAU{width:39px;min-width:39px;height:var(--f316e1)}.Switch__mFYAU>.thumb__IEKpQ{width:18px;height:18px;translate:3px}.Switch__mFYAU[aria-checked=true]>.thumb__IEKpQ{translate:18px}}

package/dist/assets/Switch-DPX8X1b7.js

@@ -0,0 +1,12 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./dist-Cc1j9Pjk.js";var c,l,u,d=t((()=>{c=`Switch__mFYAU`,l=`thumb__IEKpQ`,u={Switch:c,thumb:l}}));function f(e){let t={};return Object.entries(e).forEach(([e,n])=>{switch(e){case`id`:case`disabled`:case`aria-label`:case`aria-labelledby`:case`aria-describedby`:case`aria-invalid`:case`aria-errormessage`:t[e]=n}}),t}var p,m,h,g=t((()=>{p=e(n(),1),i(),s(),d(),m=a(),h=(0,p.forwardRef)(function({checked:e,defaultChecked:t,onCheckedChange:n,dataset:i,...a},s){let[c,l]=(0,p.useState)(t??!1),d=e!==void 0,h=d?e:c,g=()=>{let e=!h;d||l(e),n?.(e)};return(0,m.jsx)(`button`,{...f(a),...r(i,{preplyDsComponent:o.Switch}),ref:s,role:`switch`,"aria-checked":h,className:u.Switch,onClick:g,children:(0,m.jsx)(`span`,{className:u.thumb})})});try{h.displayName=`Switch`,h.__docgenInfo={description:``,displayName:`Switch`,props:{checked:{defaultValue:null,description:`The state of the switch.
+Use this for a controlled switch.
+@example const [checked, setChecked] = useState(initialChecked);
+<Switch
+  checked={checked}
+  onCheckedChange={setChecked}
+/>`,name:`checked`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},defaultChecked:{defaultValue:null,description:`The default state of the switch.
+Use for an uncontrolled switch.
+@example <Switch
+  defaultChecked={mySetting}
+  onCheckedChange={updateMySetting}
+/>`,name:`defaultChecked`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onCheckedChange:{defaultValue:null,description:`Callback for when the switch state changes.`,name:`onCheckedChange`,required:!1,type:{name:`enum`,value:[{value:`(checked: boolean) => void`}]}},id:{defaultValue:null,description:`The unique identifier for the switch element.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:`Disables interactions with the switch.`,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},"aria-label":{defaultValue:null,description:`Accessible label for the switch.`,name:`aria-label`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-labelledby":{defaultValue:null,description:`ID of the element that labels the switch.`,name:`aria-labelledby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-describedby":{defaultValue:null,description:`ID of the element that describes the switch.`,name:`aria-describedby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-invalid":{defaultValue:null,description:`Indicates whether the switch value is invalid.`,name:`aria-invalid`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},"aria-errormessage":{defaultValue:null,description:`ID of the element that describes the error, if any.`,name:`aria-errormessage`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLButtonElement | null) => void`},{value:`RefObject<HTMLButtonElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{g as n,h as t};

package/dist/assets/Switch.stories-EIYyG0Zt.js

@@ -0,0 +1,151 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./Text-bm2vnOS2.js";import{n as o,t as s}from"./LayoutFlex-DdWp4cl3.js";import{n as c,t as l}from"./Switch-DPX8X1b7.js";var u,d,f,p,m,h,g,_,v,y,b,x,S,C,w,T;t((()=>{u=e(n(),1),c(),o(),i(),d=r(),{expect:f,fn:p,userEvent:m,within:h}=__STORYBOOK_MODULE_TEST__,g={title:`Components/Switch`,component:l,args:{onCheckedChange:p(),"aria-label":`Switch`},parameters:{layout:`padded`}},_={async play({args:e,canvasElement:t,step:n}){let r=h(t).getByRole(`switch`);await n(`Switch on via click`,async()=>{await m.click(r),f(e.onCheckedChange).toHaveBeenNthCalledWith(1,!0),f(r).toHaveAttribute(`aria-checked`,`true`)}),await n(`Switch off via click`,async()=>{await m.click(r),f(e.onCheckedChange).toHaveBeenNthCalledWith(2,!1),f(r).toHaveAttribute(`aria-checked`,`false`)}),await n(`Switch on via Enter key`,async()=>{r.focus(),f(r).toHaveFocus(),await m.keyboard(`[Enter]`),f(e.onCheckedChange).toHaveBeenNthCalledWith(3,!0),f(r).toHaveAttribute(`aria-checked`,`true`)}),await n(`Switch off via Enter key`,async()=>{r.focus(),f(r).toHaveFocus(),await m.keyboard(`[Enter]`),f(e.onCheckedChange).toHaveBeenNthCalledWith(4,!1),f(r).toHaveAttribute(`aria-checked`,`false`)}),await n(`Switch on via Space key`,async()=>{r.focus(),f(r).toHaveFocus(),await m.keyboard(`[Space]`),f(e.onCheckedChange).toHaveBeenNthCalledWith(5,!0),f(r).toHaveAttribute(`aria-checked`,`true`)}),await n(`Switch off via Space key`,async()=>{r.focus(),f(r).toHaveFocus(),await m.keyboard(`[Space]`),f(e.onCheckedChange).toHaveBeenNthCalledWith(6,!1),f(r).toHaveAttribute(`aria-checked`,`false`)})}},v={render:function(e){return(0,d.jsxs)(s,{gap:`12`,children:[(0,d.jsx)(l,{...e}),(0,d.jsx)(l,{...e,defaultChecked:!0}),(0,d.jsx)(l,{...e,defaultChecked:!1})]})}},y={render:function(e){let t=({checked:e,...t})=>{let[n,r]=(0,u.useState)(e);return(0,d.jsx)(l,{...t,checked:n,onCheckedChange:r})};return(0,d.jsxs)(s,{gap:`12`,children:[(0,d.jsx)(t,{...e}),(0,d.jsx)(t,{...e,checked:!0}),(0,d.jsx)(t,{...e,checked:!1})]})}},b={args:{checked:!1},async play({canvasElement:e,step:t}){let n=h(e).getByRole(`switch`);await t(`switch does not change state`,async()=>{await m.click(n),f(n).toHaveAttribute(`aria-checked`,`false`)})}},x={args:{disabled:!0},render:function(e){return(0,d.jsxs)(s,{gap:`12`,children:[(0,d.jsx)(l,{...e,disabled:!0}),(0,d.jsx)(l,{...e,defaultChecked:!0,disabled:!0})]})},async play({args:e,canvasElement:t,step:n}){let r=h(t).getAllByRole(`switch`)[0];await n(`switch cannot be focused`,()=>{r.focus(),f(r).not.toHaveFocus()}),await n(`switch cannot be checked`,async()=>{await m.click(r),f(e.onCheckedChange).not.toHaveBeenCalled(),f(r).toHaveAttribute(`aria-checked`,`false`)})}},S={parameters:{chromatic:{modes:{TouchDevice:{hasTouch:!0}}}}},C={tags:[`!autodocs`],async play({canvasElement:e}){let t=h(e).getByRole(`switch`);t.focus(),f(t).toHaveFocus()}},w={render:function(e){return(0,d.jsx)(`div`,{style:{width:`500px`},children:(0,d.jsxs)(s,{nowrap:!0,gap:`8`,direction:`row`,alignItems:`center`,justifyContent:`space-between`,children:[(0,d.jsx)(a,{variant:`default-regular`,children:`Allow Preply to use your answers to improve your learning experience.`}),(0,d.jsx)(l,{...e})]})})}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
+  async play({
+    args,
+    canvasElement,
+    step
+  }) {
+    const canvas = within(canvasElement);
+    const button = canvas.getByRole('switch');
+    await step('Switch on via click', async () => {
+      await userEvent.click(button);
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(1, true);
+      expect(button).toHaveAttribute('aria-checked', 'true');
+    });
+    await step('Switch off via click', async () => {
+      await userEvent.click(button);
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(2, false);
+      expect(button).toHaveAttribute('aria-checked', 'false');
+    });
+    await step('Switch on via Enter key', async () => {
+      button.focus();
+      expect(button).toHaveFocus();
+      await userEvent.keyboard('[Enter]');
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(3, true);
+      expect(button).toHaveAttribute('aria-checked', 'true');
+    });
+    await step('Switch off via Enter key', async () => {
+      button.focus();
+      expect(button).toHaveFocus();
+      await userEvent.keyboard('[Enter]');
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(4, false);
+      expect(button).toHaveAttribute('aria-checked', 'false');
+    });
+    await step('Switch on via Space key', async () => {
+      button.focus();
+      expect(button).toHaveFocus();
+      await userEvent.keyboard('[Space]');
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(5, true);
+      expect(button).toHaveAttribute('aria-checked', 'true');
+    });
+    await step('Switch off via Space key', async () => {
+      button.focus();
+      expect(button).toHaveFocus();
+      await userEvent.keyboard('[Space]');
+      expect(args.onCheckedChange).toHaveBeenNthCalledWith(6, false);
+      expect(button).toHaveAttribute('aria-checked', 'false');
+    });
+  }
+}`,..._.parameters?.docs?.source}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
+  render: function Story(props) {
+    return <LayoutFlex gap="12">
+                <Switch {...props} />
+                <Switch {...props} defaultChecked />
+                <Switch {...props} defaultChecked={false} />
+            </LayoutFlex>;
+  }
+}`,...v.parameters?.docs?.source},description:{story:"The `Switch` can be an uncontrolled input using the `defaultChecked` prop.",...v.parameters?.docs?.description}}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
+  render: function Story(props) {
+    const ControlledTemplate = ({
+      checked: initialChecked,
+      ...props
+    }: SwitchProps) => {
+      const [checked, setChecked] = useState<boolean | undefined>(initialChecked);
+      return <Switch {...props} checked={checked} onCheckedChange={setChecked} />;
+    };
+    return <LayoutFlex gap="12">
+                <ControlledTemplate {...props} />
+                <ControlledTemplate {...props} checked />
+                <ControlledTemplate {...props} checked={false} />
+            </LayoutFlex>;
+  }
+}`,...y.parameters?.docs?.source},description:{story:"The `Switch` can be a controlled input using the `checked` and\n`onCheckedChange` props with a local `useState`.",...y.parameters?.docs?.description}}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
+  args: {
+    checked: false
+  },
+  async play({
+    canvasElement,
+    step
+  }) {
+    const canvas = within(canvasElement);
+    const button = canvas.getByRole('switch');
+    await step('switch does not change state', async () => {
+      await userEvent.click(button);
+      expect(button).toHaveAttribute('aria-checked', 'false');
+    });
+  }
+}`,...b.parameters?.docs?.source},description:{story:"Since using the `checked` prop makes the `Switch` controlled, it will be\nforced to keep this value until it is manually updated, e.g. by reacting\nto `onCheckedChange`—see `Controlled` story.",...b.parameters?.docs?.description}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
+  args: {
+    disabled: true
+  },
+  render: function Story(props) {
+    return <LayoutFlex gap="12">
+                <Switch {...props} disabled />
+                <Switch {...props} defaultChecked disabled />
+            </LayoutFlex>;
+  },
+  async play({
+    args,
+    canvasElement,
+    step
+  }) {
+    const canvas = within(canvasElement);
+    const button = canvas.getAllByRole('switch')[0];
+    await step('switch cannot be focused', () => {
+      button.focus();
+      expect(button).not.toHaveFocus();
+    });
+    await step('switch cannot be checked', async () => {
+      await userEvent.click(button);
+      expect(args.onCheckedChange).not.toHaveBeenCalled();
+      expect(button).toHaveAttribute('aria-checked', 'false');
+    });
+  }
+}`,...x.parameters?.docs?.source}}},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    chromatic: {
+      modes: {
+        TouchDevice: {
+          hasTouch: true
+        }
+      }
+    }
+  }
+}`,...S.parameters?.docs?.source},description:{story:`The \`Switch\` automatically sizes up to ergonomic dimensions for touch
+devices.
+
+You can inspect this behaviour in your browser devtools by setting the
+device type to \`Mobile (touch)\`—see this
+[Chrome developer article](https://developer.chrome.com/docs/devtools/device-mode).`,...S.parameters?.docs?.description}}},C.parameters={...C.parameters,docs:{...C.parameters?.docs,source:{originalSource:`{
+  tags: ['!autodocs'],
+  async play({
+    canvasElement
+  }) {
+    const canvas = within(canvasElement);
+    const button = canvas.getByRole('switch');
+    button.focus();
+    expect(button).toHaveFocus();
+  }
+}`,...C.parameters?.docs?.source}}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
+  render: function Story(props) {
+    return <div style={{
+      width: '500px'
+    }}>
+                <LayoutFlex nowrap gap="8" direction="row" alignItems="center" justifyContent="space-between">
+                    <Text variant="default-regular">
+                        Allow Preply to use your answers to improve your learning experience.
+                    </Text>
+                    <Switch {...props} />
+                </LayoutFlex>
+            </div>;
+  }
+}`,...w.parameters?.docs?.source},description:{story:"The `Switch` can be used with Text labels in LayoutFlex.\nSwitch is always if its size and doesn't strech or shrink",...w.parameters?.docs?.description}}},T=[`Default`,`Uncontrolled`,`Controlled`,`Forced`,`Disabled`,`TouchDeviceSizing`,`Focus`,`FlexLayoutWithLabel`]}))();export{y as Controlled,_ as Default,x as Disabled,w as FlexLayoutWithLabel,C as Focus,b as Forced,S as TouchDeviceSizing,v as Uncontrolled,T as __namedExportsOrder,g as default};

package/dist/assets/Text-BTI4NIf0.css

@@ -0,0 +1 @@
+.Text__BD7-C{-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-size:var(--f7d879);line-height:var(--1cb31f);font-weight:var(--5ea101);margin:0}.Text--variant-caption-regular__-ndGs{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--variant-caption-semibold__-q81F{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--variant-small-regular__V98UM{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--variant-small-regular-italic__Ii9YT{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--variant-small-semibold__mTXWU{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--variant-small-semibold-italic__N2bGq{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--variant-default-regular__GBkvP{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--variant-default-regular-italic__h8iGC{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--variant-default-semibold__BREV0{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--variant-default-semibold-italic__0qH9S{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--variant-large-regular__IFXFs{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--variant-large-regular-italic__PBExC{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--variant-large-semibold__iyV1O{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--variant-large-semibold-italic__wKF6g{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}@media (width>=400px){.Text--narrow-l--variant-caption-regular__nznL0{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--narrow-l--variant-caption-semibold__l0VQQ{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--narrow-l--variant-small-regular__VMmD6{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--narrow-l--variant-small-regular-italic__nGADF{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--narrow-l--variant-small-semibold__BQ1W4{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--narrow-l--variant-small-semibold-italic__7UUeq{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--narrow-l--variant-default-regular__pVzcT{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--narrow-l--variant-default-regular-italic__RPEsW{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--narrow-l--variant-default-semibold__AHeOG{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--narrow-l--variant-default-semibold-italic__Dhmq4{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--narrow-l--variant-large-regular__vY6mg{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--narrow-l--variant-large-regular-italic__Jypdh{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--narrow-l--variant-large-semibold__XaN0f{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--narrow-l--variant-large-semibold-italic__5DrpP{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}}@media (width>=700px){.Text--medium-s--variant-caption-regular__QIFIm{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--medium-s--variant-caption-semibold__qA3XV{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--medium-s--variant-small-regular__Fujae{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--medium-s--variant-small-regular-italic__jaDXd{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--medium-s--variant-small-semibold__9pYQr{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--medium-s--variant-small-semibold-italic__-ac-Q{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--medium-s--variant-default-regular__jyyg6{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--medium-s--variant-default-regular-italic__FzmWH{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--medium-s--variant-default-semibold__zfein{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--medium-s--variant-default-semibold-italic__pwAKv{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--medium-s--variant-large-regular__UQstF{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--medium-s--variant-large-regular-italic__BGPjz{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--medium-s--variant-large-semibold__ZTsh3{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--medium-s--variant-large-semibold-italic__QsDHO{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}}@media (width>=880px){.Text--medium-l--variant-caption-regular__neFtF{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--medium-l--variant-caption-semibold__96Bxj{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--medium-l--variant-small-regular__q832t{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--medium-l--variant-small-regular-italic__rh-C-{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--medium-l--variant-small-semibold__NyQYA{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--medium-l--variant-small-semibold-italic__D8qtH{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--medium-l--variant-default-regular__AZhpM{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--medium-l--variant-default-regular-italic__zLCku{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--medium-l--variant-default-semibold__3FVwk{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--medium-l--variant-default-semibold-italic__dmKNV{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--medium-l--variant-large-regular__4JxNh{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--medium-l--variant-large-regular-italic__wwnsG{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--medium-l--variant-large-semibold__WR7vo{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--medium-l--variant-large-semibold-italic__lLaF0{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}}@media (width>=1200px){.Text--wide-s--variant-caption-regular__tfrra{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--wide-s--variant-caption-semibold__pcHWg{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--wide-s--variant-small-regular__qVuSz{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--wide-s--variant-small-regular-italic__paUwS{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--wide-s--variant-small-semibold__--T3V{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--wide-s--variant-small-semibold-italic__YLx3p{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--wide-s--variant-default-regular__7nbdM{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--wide-s--variant-default-regular-italic__ohsSu{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--wide-s--variant-default-semibold__-Q2Gu{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--wide-s--variant-default-semibold-italic__v6oao{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--wide-s--variant-large-regular__lrWEc{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--wide-s--variant-large-regular-italic__v55x9{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--wide-s--variant-large-semibold__FV1hE{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--wide-s--variant-large-semibold-italic__8Xjhy{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}}@media (width>=1900px){.Text--wide-l--variant-caption-regular__RmVMU{font-size:var(--d3e233);font-weight:var(--56c416);line-height:var(--bc6f38);letter-spacing:var(--be8c45);font-style:var(--ba54c4)}.Text--wide-l--variant-caption-semibold__nWA4i{font-size:var(--4df4f0);font-weight:var(--756814);line-height:var(--f8ebff);letter-spacing:var(--03e2b6);font-style:var(--782782)}.Text--wide-l--variant-small-regular__jofJW{font-size:var(--d4ea3f);font-weight:var(--c2057a);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);font-style:var(--8dee8a)}.Text--wide-l--variant-small-regular-italic__vt9vP{font-size:var(--33b293);font-weight:var(--b38b97);line-height:var(--5f3bbf);letter-spacing:var(--40ba00);font-style:var(--02d236)}.Text--wide-l--variant-small-semibold__jSimt{font-size:var(--97511e);font-weight:var(--fbec20);line-height:var(--a8f0e2);letter-spacing:var(--a566de);font-style:var(--92feb8)}.Text--wide-l--variant-small-semibold-italic__CPy01{font-size:var(--16878a);font-weight:var(--9d502c);line-height:var(--bd5dd5);letter-spacing:var(--ca673a);font-style:var(--7cc250)}.Text--wide-l--variant-default-regular__zGDH3{font-size:var(--7f027e);font-weight:var(--59913e);line-height:var(--11f5c9);letter-spacing:var(--b2e406);font-style:var(--61e1de)}.Text--wide-l--variant-default-regular-italic__pj89w{font-size:var(--58dc82);font-weight:var(--55b888);line-height:var(--d59274);letter-spacing:var(--40d520);font-style:var(--b09e9d)}.Text--wide-l--variant-default-semibold__AzL9L{font-size:var(--8098ff);font-weight:var(--a4fde7);line-height:var(--2285fa);letter-spacing:var(--95d383);font-style:var(--82c3d5)}.Text--wide-l--variant-default-semibold-italic__4AXL6{font-size:var(--4f1e3c);font-weight:var(--ea7bfd);line-height:var(--f70f04);letter-spacing:var(--f69e59);font-style:var(--dd40d0)}.Text--wide-l--variant-large-regular__iIUQK{font-size:var(--3cfa3f);font-weight:var(--f9dbd7);line-height:var(--206b00);letter-spacing:var(--2585de);font-style:var(--1952bb)}.Text--wide-l--variant-large-regular-italic__OtyLZ{font-size:var(--3b44b6);font-weight:var(--500731);line-height:var(--c18960);letter-spacing:var(--e4d866);font-style:var(--bed3e0)}.Text--wide-l--variant-large-semibold__ZTrU9{font-size:var(--63f88d);font-weight:var(--c7a8eb);line-height:var(--942b2f);letter-spacing:var(--5b62c3);font-style:var(--9c1713)}.Text--wide-l--variant-large-semibold-italic__UNwvX{font-size:var(--4afac4);font-weight:var(--333137);line-height:var(--ae63b1);letter-spacing:var(--64a0ba);font-style:var(--ec8789)}}.Text--strong__ig9qo{font-weight:var(--2734e9)}

package/dist/assets/Text-bm2vnOS2.js

@@ -0,0 +1 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{_ as r,ht as i,t as a,w as o,x as s,y as c}from"./dist-DtfJeYQK.js";import{t as l}from"./jsx-runtime-C2wGStra.js";import{n as u,t as d}from"./dist-Cc1j9Pjk.js";import{n as f,t as p}from"./text-accent-CfNKCcRq.js";import{n as m,t as h}from"./filterAttributesPassedByRadixUIAtRuntime-CGiuUnR2.js";import{n as g,t as _}from"./text-centered-ozyo-Yf9.js";var v,y,b=t((()=>{v=`Text__BD7-C`,y={Text:v,"Text--variant-caption-regular":`Text--variant-caption-regular__-ndGs`,"Text--variant-caption-semibold":`Text--variant-caption-semibold__-q81F`,"Text--variant-small-regular":`Text--variant-small-regular__V98UM`,"Text--variant-small-regular-italic":`Text--variant-small-regular-italic__Ii9YT`,"Text--variant-small-semibold":`Text--variant-small-semibold__mTXWU`,"Text--variant-small-semibold-italic":`Text--variant-small-semibold-italic__N2bGq`,"Text--variant-default-regular":`Text--variant-default-regular__GBkvP`,"Text--variant-default-regular-italic":`Text--variant-default-regular-italic__h8iGC`,"Text--variant-default-semibold":`Text--variant-default-semibold__BREV0`,"Text--variant-default-semibold-italic":`Text--variant-default-semibold-italic__0qH9S`,"Text--variant-large-regular":`Text--variant-large-regular__IFXFs`,"Text--variant-large-regular-italic":`Text--variant-large-regular-italic__PBExC`,"Text--variant-large-semibold":`Text--variant-large-semibold__iyV1O`,"Text--variant-large-semibold-italic":`Text--variant-large-semibold-italic__wKF6g`,"Text--narrow-l--variant-caption-regular":`Text--narrow-l--variant-caption-regular__nznL0`,"Text--narrow-l--variant-caption-semibold":`Text--narrow-l--variant-caption-semibold__l0VQQ`,"Text--narrow-l--variant-small-regular":`Text--narrow-l--variant-small-regular__VMmD6`,"Text--narrow-l--variant-small-regular-italic":`Text--narrow-l--variant-small-regular-italic__nGADF`,"Text--narrow-l--variant-small-semibold":`Text--narrow-l--variant-small-semibold__BQ1W4`,"Text--narrow-l--variant-small-semibold-italic":`Text--narrow-l--variant-small-semibold-italic__7UUeq`,"Text--narrow-l--variant-default-regular":`Text--narrow-l--variant-default-regular__pVzcT`,"Text--narrow-l--variant-default-regular-italic":`Text--narrow-l--variant-default-regular-italic__RPEsW`,"Text--narrow-l--variant-default-semibold":`Text--narrow-l--variant-default-semibold__AHeOG`,"Text--narrow-l--variant-default-semibold-italic":`Text--narrow-l--variant-default-semibold-italic__Dhmq4`,"Text--narrow-l--variant-large-regular":`Text--narrow-l--variant-large-regular__vY6mg`,"Text--narrow-l--variant-large-regular-italic":`Text--narrow-l--variant-large-regular-italic__Jypdh`,"Text--narrow-l--variant-large-semibold":`Text--narrow-l--variant-large-semibold__XaN0f`,"Text--narrow-l--variant-large-semibold-italic":`Text--narrow-l--variant-large-semibold-italic__5DrpP`,"Text--medium-s--variant-caption-regular":`Text--medium-s--variant-caption-regular__QIFIm`,"Text--medium-s--variant-caption-semibold":`Text--medium-s--variant-caption-semibold__qA3XV`,"Text--medium-s--variant-small-regular":`Text--medium-s--variant-small-regular__Fujae`,"Text--medium-s--variant-small-regular-italic":`Text--medium-s--variant-small-regular-italic__jaDXd`,"Text--medium-s--variant-small-semibold":`Text--medium-s--variant-small-semibold__9pYQr`,"Text--medium-s--variant-small-semibold-italic":`Text--medium-s--variant-small-semibold-italic__-ac-Q`,"Text--medium-s--variant-default-regular":`Text--medium-s--variant-default-regular__jyyg6`,"Text--medium-s--variant-default-regular-italic":`Text--medium-s--variant-default-regular-italic__FzmWH`,"Text--medium-s--variant-default-semibold":`Text--medium-s--variant-default-semibold__zfein`,"Text--medium-s--variant-default-semibold-italic":`Text--medium-s--variant-default-semibold-italic__pwAKv`,"Text--medium-s--variant-large-regular":`Text--medium-s--variant-large-regular__UQstF`,"Text--medium-s--variant-large-regular-italic":`Text--medium-s--variant-large-regular-italic__BGPjz`,"Text--medium-s--variant-large-semibold":`Text--medium-s--variant-large-semibold__ZTsh3`,"Text--medium-s--variant-large-semibold-italic":`Text--medium-s--variant-large-semibold-italic__QsDHO`,"Text--medium-l--variant-caption-regular":`Text--medium-l--variant-caption-regular__neFtF`,"Text--medium-l--variant-caption-semibold":`Text--medium-l--variant-caption-semibold__96Bxj`,"Text--medium-l--variant-small-regular":`Text--medium-l--variant-small-regular__q832t`,"Text--medium-l--variant-small-regular-italic":`Text--medium-l--variant-small-regular-italic__rh-C-`,"Text--medium-l--variant-small-semibold":`Text--medium-l--variant-small-semibold__NyQYA`,"Text--medium-l--variant-small-semibold-italic":`Text--medium-l--variant-small-semibold-italic__D8qtH`,"Text--medium-l--variant-default-regular":`Text--medium-l--variant-default-regular__AZhpM`,"Text--medium-l--variant-default-regular-italic":`Text--medium-l--variant-default-regular-italic__zLCku`,"Text--medium-l--variant-default-semibold":`Text--medium-l--variant-default-semibold__3FVwk`,"Text--medium-l--variant-default-semibold-italic":`Text--medium-l--variant-default-semibold-italic__dmKNV`,"Text--medium-l--variant-large-regular":`Text--medium-l--variant-large-regular__4JxNh`,"Text--medium-l--variant-large-regular-italic":`Text--medium-l--variant-large-regular-italic__wwnsG`,"Text--medium-l--variant-large-semibold":`Text--medium-l--variant-large-semibold__WR7vo`,"Text--medium-l--variant-large-semibold-italic":`Text--medium-l--variant-large-semibold-italic__lLaF0`,"Text--wide-s--variant-caption-regular":`Text--wide-s--variant-caption-regular__tfrra`,"Text--wide-s--variant-caption-semibold":`Text--wide-s--variant-caption-semibold__pcHWg`,"Text--wide-s--variant-small-regular":`Text--wide-s--variant-small-regular__qVuSz`,"Text--wide-s--variant-small-regular-italic":`Text--wide-s--variant-small-regular-italic__paUwS`,"Text--wide-s--variant-small-semibold":`Text--wide-s--variant-small-semibold__--T3V`,"Text--wide-s--variant-small-semibold-italic":`Text--wide-s--variant-small-semibold-italic__YLx3p`,"Text--wide-s--variant-default-regular":`Text--wide-s--variant-default-regular__7nbdM`,"Text--wide-s--variant-default-regular-italic":`Text--wide-s--variant-default-regular-italic__ohsSu`,"Text--wide-s--variant-default-semibold":`Text--wide-s--variant-default-semibold__-Q2Gu`,"Text--wide-s--variant-default-semibold-italic":`Text--wide-s--variant-default-semibold-italic__v6oao`,"Text--wide-s--variant-large-regular":`Text--wide-s--variant-large-regular__lrWEc`,"Text--wide-s--variant-large-regular-italic":`Text--wide-s--variant-large-regular-italic__v55x9`,"Text--wide-s--variant-large-semibold":`Text--wide-s--variant-large-semibold__FV1hE`,"Text--wide-s--variant-large-semibold-italic":`Text--wide-s--variant-large-semibold-italic__8Xjhy`,"Text--wide-l--variant-caption-regular":`Text--wide-l--variant-caption-regular__RmVMU`,"Text--wide-l--variant-caption-semibold":`Text--wide-l--variant-caption-semibold__nWA4i`,"Text--wide-l--variant-small-regular":`Text--wide-l--variant-small-regular__jofJW`,"Text--wide-l--variant-small-regular-italic":`Text--wide-l--variant-small-regular-italic__vt9vP`,"Text--wide-l--variant-small-semibold":`Text--wide-l--variant-small-semibold__jSimt`,"Text--wide-l--variant-small-semibold-italic":`Text--wide-l--variant-small-semibold-italic__CPy01`,"Text--wide-l--variant-default-regular":`Text--wide-l--variant-default-regular__zGDH3`,"Text--wide-l--variant-default-regular-italic":`Text--wide-l--variant-default-regular-italic__pj89w`,"Text--wide-l--variant-default-semibold":`Text--wide-l--variant-default-semibold__AzL9L`,"Text--wide-l--variant-default-semibold-italic":`Text--wide-l--variant-default-semibold-italic__4AXL6`,"Text--wide-l--variant-large-regular":`Text--wide-l--variant-large-regular__iIUQK`,"Text--wide-l--variant-large-regular-italic":`Text--wide-l--variant-large-regular-italic__OtyLZ`,"Text--wide-l--variant-large-semibold":`Text--wide-l--variant-large-semibold__ZTrU9`,"Text--wide-l--variant-large-semibold-italic":`Text--wide-l--variant-large-semibold-italic__UNwvX`,"Text--strong":`Text--strong__ig9qo`}})),x,S,C,w=t((()=>{o(),d(),a(),x=e(n(),1),f(),g(),m(),b(),S=l(),C=(0,x.forwardRef)(function({children:e,variant:t,tag:n=`p`,accent:a,strong:o,centered:l,dataset:d,className:f,...m},g){let v=t||`small-regular`,b=t?void 0:o,x=c(y,u.Text,[s(`variant`,v),r(`strong`,void 0,b)]),C=p(!a,a),w=_(l),T=[...x,...C,...w,f];return(0,S.jsx)(n,{...h(m),ref:g,className:T.join(` `),...i(d,{preplyDsComponent:u.Text}),children:e})});try{C.displayName=`Text`,C.__docgenInfo={description:``,displayName:`Text`,props:{variant:{defaultValue:null,description:``,name:`variant`,required:!1,type:{name:`enum`,value:[{value:`"caption-regular"`},{value:`"caption-semibold"`},{value:`"small-regular"`},{value:`"small-regular-italic"`},{value:`"small-semibold"`},{value:`"small-semibold-italic"`},{value:`"default-regular"`},{value:`"default-regular-italic"`},{value:`"default-semibold"`},{value:`"default-semibold-italic"`},{value:`"large-regular"`},{value:`"large-regular-italic"`},{value:`"large-semibold"`},{value:`"large-semibold-italic"`},{value:`ResponsiveProp<TextVariant>`}]}},accent:{defaultValue:null,description:``,name:`accent`,required:!1,type:{name:`enum`,value:[{value:`"placeholder"`},{value:`"primary"`},{value:`"secondary"`},{value:`"tertiary"`},{value:`"accentDark"`},{value:`"inverted"`},{value:`"positive"`},{value:`"info"`},{value:`"warning"`},{value:`"critical"`}]}},strong:{defaultValue:null,description:``,name:`strong`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},centered:{defaultValue:null,description:``,name:`centered`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`ResponsiveProp<boolean>`}]}},tag:{defaultValue:{value:`p`},description:``,name:`tag`,required:!1,type:{name:`enum`,value:[{value:`"div"`},{value:`"p"`},{value:`"span"`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},className:{defaultValue:null,description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLParagraphElement | null) => void`},{value:`RefObject<HTMLParagraphElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{w as n,C as t};

package/dist/assets/Text.stories-CmIl_fwM.js

@@ -0,0 +1,67 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{C as r,J as i,K as a,Y as o,n as s,t as c,tt as l,w as u}from"./dist-DtfJeYQK.js";import{t as d}from"./jsx-runtime-C2wGStra.js";import{n as f,t as p}from"./Text-bm2vnOS2.js";import{r as m,t as h}from"./storybook-utils-CXrHOWy7.js";function g({variant:e}){let[t,n]=e.split(`-`),r=s(l[t][n].body.fontSize);return(0,_.jsxs)(`tr`,{children:[(0,_.jsx)(`td`,{style:{paddingRight:16,whiteSpace:`nowrap`,textAlign:`right`},children:(0,_.jsx)(p,{variant:e,children:e},e)}),(0,_.jsx)(`td`,{children:r})]})}var _,v,y,b,x,S,C;t((()=>{u(),c(),e(n(),1),f(),h(),_=d(),v={title:`components/Text`,component:p,argTypes:{variant:{description:m},centered:{description:m}}},y=()=>(0,_.jsx)(p,{children:`Lorem ipsum`}),y.tags=[`!test`],y.parameters={chromatic:{disableSnapshot:!0}},b=()=>{let e=r(o.background.primaryInverted);return(0,_.jsx)(_.Fragment,{children:a.map(({id:t})=>(0,_.jsx)(`div`,{style:{backgroundColor:[`inverted`,`branded`,`selected`].includes(t)?e:void 0},children:(0,_.jsx)(p,{accent:t,children:t})},t))})},x=()=>(0,_.jsxs)(`table`,{style:{borderCollapse:`separate`,borderSpacing:`16px`},children:[(0,_.jsx)(`thead`,{children:(0,_.jsxs)(`tr`,{children:[(0,_.jsx)(`th`,{children:`Variant`}),(0,_.jsx)(`th`,{children:`font-size`})]})}),i.map(({id:e})=>(0,_.jsx)(g,{variant:e},e))]}),S={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(e,{args:t})=>(0,_.jsx)(`div`,{style:{backgroundColor:t.accent===`inverted`?`black`:void 0},children:e()})],args:{children:`Lorem ipsum dolor sit amet`,variant:`default-regular`,dataset:{qaid:`text`}},argTypes:{dataset:{control:`object`},children:{control:`text`},variant:{control:`select`},accent:{control:`select`},centered:{control:`boolean`},strong:{table:{disable:!0}}}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`() => <Text>Lorem ipsum</Text>`,...y.parameters?.docs?.source}}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`() => {
+  const grey = getTokenVar(color.background.primaryInverted);
+  return <>
+            {TEXT_ACCENT_OPTIONS.map(({
+      id
+    }) => <div key={id} style={{
+      backgroundColor: ['inverted', 'branded', 'selected'].includes(id) ? grey : undefined
+    }}>
+                    <Text accent={id}>{id}</Text>
+                </div>)}
+        </>;
+}`,...b.parameters?.docs?.source}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`() => <table style={{
+  borderCollapse: 'separate',
+  borderSpacing: '16px'
+}}>
+        <thead>
+            <tr>
+                <th>Variant</th>
+                <th>font-size</th>
+            </tr>
+        </thead>
+        {TEXT_VARIANT_OPTIONS.map(({
+    id: variant
+  }) => <VariantRow key={variant} variant={variant} />)}
+    </table>`,...x.parameters?.docs?.source}}},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    chromatic: {
+      disableSnapshot: true
+    }
+  },
+  decorators: [(story, {
+    args
+  }) => <div style={{
+    backgroundColor: args.accent === 'inverted' ? 'black' : undefined
+  }}>
+                {story()}
+            </div>],
+  args: {
+    children: 'Lorem ipsum dolor sit amet',
+    variant: 'default-regular',
+    dataset: {
+      qaid: 'text'
+    }
+  },
+  argTypes: {
+    dataset: {
+      control: 'object'
+    },
+    children: {
+      control: 'text'
+    },
+    variant: {
+      control: 'select'
+    },
+    accent: {
+      control: 'select'
+    },
+    centered: {
+      control: 'boolean'
+    },
+    strong: {
+      table: {
+        disable: true
+      }
+    }
+  }
+}`,...S.parameters?.docs?.source}}},C=[`Base`,`Accents`,`Variants`,`Playground`]}))();export{b as Accents,y as Base,S as Playground,x as Variants,C as __namedExportsOrder,v as default};

package/dist/assets/TextField-zS8J7vJP.js

@@ -0,0 +1,6 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./dist-Cc1j9Pjk.js";import{n as o,t as s}from"./FormControl-cSvM3XwI.js";import{r as c,t as l}from"./Input-DXnvG-Wl.js";var u,d,f,p=t((()=>{u=e(n(),1),o(),l(),a(),d=r(),f=(0,u.forwardRef)(function({id:e,label:t,description:n,error:r,required:a,type:o=`text`,inputDataset:l,dataset:u,hideLabel:f,onClick:p,hasError:m,useLegacyRequiredLabel:h,className:g,style:_,...v},y){return(0,d.jsx)(s,{id:e,label:t,description:n,error:r,hasError:m,required:a,dataset:u,hideLabel:f,onClick:p,useLegacyRequiredLabel:h,preplyDsComponent:i.TextField,children:(0,d.jsx)(c,{...v,type:o,ref:y,dataset:l})})});try{f.displayName=`TextField`,f.__docgenInfo={description:``,displayName:`TextField`,props:{id:{defaultValue:null,description:`The id to be passed to the input element.
+If not provided, will be generated for accessibility purposes.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>`}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:`label`,required:!0,type:{name:`enum`,value:[{value:`undefined`},{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
+to provide more context or instructions to the user.`,name:`description`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},error:{defaultValue:null,description:`Error message to display when the field has an invalid value.`,name:`error`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:`hasError`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+When false, adds a "Optional" indicator next to the label for the optional fields instead.
+@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:`useLegacyRequiredLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onCopy:{defaultValue:null,description:``,name:`onCopy`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onCut:{defaultValue:null,description:``,name:`onCut`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onPaste:{defaultValue:null,description:``,name:`onPaste`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLInputElement>`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLInputElement>`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLInputElement>`}]}},button:{defaultValue:null,description:``,name:`button`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},name:{defaultValue:null,description:``,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},maxLength:{defaultValue:null,description:``,name:`maxLength`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},placeholder:{defaultValue:null,description:``,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},readOnly:{defaultValue:null,description:``,name:`readOnly`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},icon:{defaultValue:null,description:``,name:`icon`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},onValueChange:{defaultValue:null,description:``,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: string) => void`}]}},value:{defaultValue:null,description:``,name:`value`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},defaultValue:{defaultValue:null,description:``,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},type:{defaultValue:{value:`text`},description:``,name:`type`,required:!1,type:{name:`enum`,value:[{value:`"text"`},{value:`"search"`},{value:`"email"`},{value:`"tel"`},{value:`"url"`}]}},autoComplete:{defaultValue:null,description:``,name:`autoComplete`,required:!1,type:{name:`enum`,value:[{value:`"name"`},{value:`"email"`},{value:`"tel"`},{value:`"url"`},{value:`"off"`},{value:`"on"`},{value:`"username"`},{value:`"language"`}]}},inputDataset:{defaultValue:null,description:``,name:`inputDataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLInputElement | null) => void`},{value:`RefObject<HTMLInputElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{p as n,f as t};