@preply/ds-docs 3.1.1-beta.6979b7215f74b2e5e56e968fa2f5aaabbd31e8a8.0 → 3.2.1-beta.e1ca8d950c2259f7fe86a7ffe9395453da82683d.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{00.LayoutFlex.stories-Dx9Eo2na.js → 00.LayoutFlex.stories-Ct1A2OcS.js} +1 -1
- package/dist/assets/{00.applications-Ba4YPntv.js → 00.applications-DF2RWZUl.js} +1 -1
- package/dist/assets/{00.favicons.guide-CEbQqvPB.js → 00.favicons.guide-BYnh5GxE.js} +1 -1
- package/dist/assets/{00.token-explorer-MnmDHjjY.js → 00.token-explorer-wDtGkqes.js} +1 -1
- package/dist/assets/{00.using-responsive-props-DJ3dvefE.js → 00.using-responsive-props-CfJ_Hu29.js} +1 -1
- package/dist/assets/{01.semantic-tokens-DBqrJ-jx.js → 01.semantic-tokens-0q2PXQqY.js} +1 -1
- package/dist/assets/{01.using-shorthand-props-LQEggQSe.js → 01.using-shorthand-props-DlndLe5-.js} +1 -1
- package/dist/assets/10.Combinations.stories-CqZ-KAYR.js +144 -0
- package/dist/assets/{10.fonts.guide-C_gCE5op.js → 10.fonts.guide-DXxfQIdg.js} +1 -1
- package/dist/assets/{10.ssr-CsZenelp.js → 10.ssr-DcMxkdk_.js} +1 -1
- package/dist/assets/{11.languageFont.explorer-BCpfiOBe.js → 11.languageFont.explorer-BSpNjqbf.js} +29 -1
- package/dist/assets/{11.ssr.app-router-BJWwAZ26.js → 11.ssr.app-router-D5K1XX0o.js} +1 -1
- package/dist/assets/{20.libraries-B6VT80Rs.js → 20.libraries-ujiQiI9M.js} +1 -1
- package/dist/assets/30.icons.explorer-DsCNeZwo.js +73 -0
- package/dist/assets/{30.storybook-CHIRMUOu.js → 30.storybook-Co2X-28u.js} +1 -1
- package/dist/assets/{40.illustrations.explorer-BMJJAXhw.js → 40.illustrations.explorer-BSIzsuPL.js} +1 -1
- package/dist/assets/{90.advanced-BZBdNDoO.js → 90.advanced-BQOS_cDF.js} +1 -1
- package/dist/assets/{Accordion-DjdAaIAN.js → Accordion-DHA8vt9l.js} +3 -3
- package/dist/assets/{Accordion.stories-C-BlgFFJ.js → Accordion.stories-B8klL-Sx.js} +1 -1
- package/dist/assets/{Accordion.tests.stories-CwZAy27Z.js → Accordion.tests.stories-D_T4VFKy.js} +1 -1
- package/dist/assets/{AlertDialog.stories-D6ZXfVf9.js → AlertDialog.stories-DWU1YiOX.js} +1 -1
- package/dist/assets/{Avatar-D6BKQVaH.js → Avatar--Me1wFbM.js} +1 -1
- package/dist/assets/{Avatar-BkCAqOuF.js → Avatar-D_mKYr5W.js} +1 -1
- package/dist/assets/{Avatar.stories-DnjfAeSV.js → Avatar.stories-CGQDYNGY.js} +1 -1
- package/dist/assets/{AvatarWithStatus.stories-CocgTI5A.js → AvatarWithStatus.stories-5qjPY64Z.js} +1 -1
- package/dist/assets/{Badge.stories-DIY0Ixcn.js → Badge.stories-BwWKe78y.js} +1 -1
- package/dist/assets/{Box.stories-Tpzf5Ucy.js → Box.stories-D6l5F6RN.js} +1 -1
- package/dist/assets/{Button-klA2GCDX.js → Button-DWeSlYg5.js} +1 -1
- package/dist/assets/{Button-DUfN3a98.js → Button-iZiyzI_K.js} +1 -1
- package/dist/assets/{Button.stories-CN_LlUXT.js → Button.stories-DmUhFUlZ.js} +1 -1
- package/dist/assets/ButtonBase-CFf1N6e3.js +8 -0
- package/dist/assets/{Checkbox-4S94zrQG.js → Checkbox-DFXsEeAm.js} +3 -3
- package/dist/assets/{Checkbox.stories-LWdh97RT.js → Checkbox.stories-CSlo0rHA.js} +1 -1
- package/dist/assets/{Checkbox.tests.stories-B22nLUA0.js → Checkbox.tests.stories-D1GZnqns.js} +1 -1
- package/dist/assets/{Chips.stories-BF_eoQzy.js → Chips.stories-h1jc3y-m.js} +1 -1
- package/dist/assets/{Color-YHDXOIA2-DBEzfWUT.js → Color-YHDXOIA2-BQ6N6WB4.js} +1 -1
- package/dist/assets/{Dialog.stories-BDi5ubQi.js → Dialog.stories-Lc5K6cDs.js} +2 -2
- package/dist/assets/{DocsRenderer-CFRXHY34-DbNtKpKR.js → DocsRenderer-CFRXHY34-CJlAtJpz.js} +1 -1
- package/dist/assets/{FieldButton-xxvyfVcj.js → FieldButton-Dprr9FF4.js} +1 -1
- package/dist/assets/{FieldButton.stories-1kY40W8X.js → FieldButton.stories-BuA4NyAH.js} +1 -1
- package/dist/assets/FormControl-V3kzTeDQ.js +7 -0
- package/dist/assets/FormControl.stories-Ct6Ne2lK.js +67 -0
- package/dist/assets/{Heading-sy1TMpjs.js → Heading-BSlUFvxo.js} +1 -1
- package/dist/assets/{Heading.stories-mFaQtYkx.js → Heading.stories-CsCslhOn.js} +1 -1
- package/dist/assets/{Icon-zcBK8bUG.js → Icon-Clsj4XP8.js} +1 -1
- package/dist/assets/{Icon-C3PbN7-O.js → Icon-D-t6qc3n.js} +2 -2
- package/dist/assets/{Icon-RSC-C0ncJTUs.js → Icon-RSC-x5AbeL1b.js} +1 -1
- package/dist/assets/{Icon.stories-Dalhjiqr.js → Icon.stories-8mWdZCRL.js} +1 -1
- package/dist/assets/IconButton-Day2Q_gx.js +8 -0
- package/dist/assets/{Input-0F-H1v0g.js → Input-BZxJ9sXr.js} +8 -8
- package/dist/assets/InputContainer-Dq1Ks471.css +1 -0
- package/dist/assets/{IntegrationWithReactHookForm.stories-Xgh1APwf.js → IntegrationWithReactHookForm.stories-D1FHuitu.js} +1 -1
- package/dist/assets/{LayoutFlex-oRwI31fW.js → LayoutFlex-BxFOrEzC.js} +1 -1
- package/dist/assets/{LayoutFlex-DsiZkqdg.js → LayoutFlex-Dp29ojjO.js} +1 -1
- package/dist/assets/LayoutFlexItem-D4lQfjMe.js +1 -0
- package/dist/assets/{LayoutGrid-6cTmb1jX.js → LayoutGrid-D9R6yTYX.js} +1 -1
- package/dist/assets/LayoutGrid-mQT2ikS8.css +1 -0
- package/dist/assets/LayoutGrid.stories-Oj3NyUU9.js +88 -0
- package/dist/assets/{LayoutGridItem-CVWVBh65.js → LayoutGridItem-B1eMKElL.js} +1 -1
- package/dist/assets/{Link.stories-BUbS8oOg.js → Link.stories-SPeEvWm0.js} +2 -2
- package/dist/assets/{Loader.stories-CFBO-7A0.js → Loader.stories-C_wKZjOn.js} +1 -1
- package/dist/assets/NumberField-CsvE81sD.js +6 -0
- package/dist/assets/{NumberField.stories-DfMrC_B4.js → NumberField.stories-1xw8yRUE.js} +7 -7
- package/dist/assets/{ObserveIntersection-CvDmrhxS.js → ObserveIntersection-XIPHNpKf.js} +1 -1
- package/dist/assets/{ObserveIntersection.stories-CJbpJ7AX.js → ObserveIntersection.stories-B_5fq2at.js} +1 -1
- package/dist/assets/{OnboardingTooltip-Ga3yLAKq.js → OnboardingTooltip-DdKsKvSX.js} +1 -1
- package/dist/assets/{OnboardingTooltip.stories-CIGhxyVv.js → OnboardingTooltip.stories-DjNADlBZ.js} +1 -1
- package/dist/assets/{OnboardingTooltip.tests.stories-BvPnsOf9.js → OnboardingTooltip.tests.stories-BW_3X6lO.js} +1 -1
- package/dist/assets/{OnboardingTour-DQKAMwDc.js → OnboardingTour-DXebeIDU.js} +1 -1
- package/dist/assets/{OnboardingTour.stories-xCALGjaf.js → OnboardingTour.stories-B1qBQCoT.js} +2 -2
- package/dist/assets/{OnboardingTour.tests.stories-DWSurYty.js → OnboardingTour.tests.stories-D5sFfBoy.js} +1 -1
- package/dist/assets/PasswordField-BFqsWIfL.js +6 -0
- package/dist/assets/{PasswordField.stories-D9dJYf60.js → PasswordField.stories-Ym38la75.js} +7 -7
- package/dist/assets/{PreplyLogo.stories-fvYp72RZ.js → PreplyLogo.stories-WWHnC28y.js} +1 -1
- package/dist/assets/{ProgressBar.stories-BI9rP3Zp.js → ProgressBar.stories-DwuKojS2.js} +1 -1
- package/dist/assets/{ProgressSteps-CuGX9_Fy.js → ProgressSteps-ByDec2fC.js} +1 -1
- package/dist/assets/{ProgressSteps.stories-BU_NU70-.js → ProgressSteps.stories-C81QmlM3.js} +1 -1
- package/dist/assets/{SelectField-DO_tN6au.js → SelectField-eFXu65mo.js} +13 -11
- package/dist/assets/{SelectField.stories-C3t6Yxl3.js → SelectField.stories-D8G4fd5i.js} +8 -8
- package/dist/assets/{ShowOnIntersection.stories-B24bNVFn.js → ShowOnIntersection.stories-CewFYwQu.js} +1 -1
- package/dist/assets/{Steps-fLuKPowT.js → Steps-MniLzlHq.js} +1 -1
- package/dist/assets/{Steps.stories-DBs_xRfi.js → Steps.stories-DGO2z-va.js} +1 -1
- package/dist/assets/{Text-B2ZjNCft.js → Text-DrH34jFe.js} +1 -1
- package/dist/assets/{Text.stories-B-ZOJyPu.js → Text.stories-V04H05kK.js} +1 -1
- package/dist/assets/TextField-D2GlsmWF.css +1 -0
- package/dist/assets/TextField-sLGry01P.js +1 -0
- package/dist/assets/TextField-sd_-L-71.js +6 -0
- package/dist/assets/{TextField.stories-Ip_bkDJi.js → TextField.stories-t8AfTqkD.js} +8 -8
- package/dist/assets/{TextHighlighted-B7-aMGmA.js → TextHighlighted-CfvNH8PY.js} +1 -1
- package/dist/assets/{TextHighlighted.stories-B89Gaz6o.js → TextHighlighted.stories-BFdf3kg4.js} +1 -1
- package/dist/assets/{TextInline.stories-DIjSSfRF.js → TextInline.stories-ONslfKVR.js} +1 -1
- package/dist/assets/{TextareaField-DHX6IRnj.js → TextareaField-DZiXvoRu.js} +13 -11
- package/dist/assets/{TextareaField.stories-Ege4vMd6.js → TextareaField.stories-BU6VqRhF.js} +8 -8
- package/dist/assets/{Toast.stories-QJP8u4iK.js → Toast.stories-jpkXw21u.js} +1 -1
- package/dist/assets/TokyoUIUpload-Bi3CuQzX.js +1 -0
- package/dist/assets/{Tooltip-hS-9HVfR.js → Tooltip-DYI-etfB.js} +1 -1
- package/dist/assets/{Tooltip.stories-Cm3Jk-_z.js → Tooltip.stories-DJP6VJlB.js} +1 -1
- package/dist/assets/{Tooltip.tests.stories-B2Yi0UsK.js → Tooltip.tests.stories-B2QuXqrc.js} +1 -1
- package/dist/assets/{breakpoints-0LwK_FN1.js → breakpoints-85lK2y-I.js} +1 -1
- package/dist/assets/{breakpoints-DRwiRnv6.js → breakpoints-BEqIB9xc.js} +1 -1
- package/dist/assets/{breakpoints-C4n_KMrT.js → breakpoints-DwS8cENA.js} +1 -1
- package/dist/assets/{changelog-1NQYbIFt.js → changelog-CrXzEvv7.js} +217 -205
- package/dist/assets/componentNames-Ba2ybP0W.js +1 -0
- package/dist/assets/{entry-preview-DgGa73bN.js → entry-preview-Dzuqoehc.js} +1 -1
- package/dist/assets/{getTokenVar-D3MUAgiO.js → getTokenVar-DfKyS0UW.js} +1 -1
- package/dist/assets/{hover-BkT97PXl.js → hover-DB9eaNzq.js} +1 -1
- package/dist/assets/{hover-Dq9rs4PT.js → hover-DO3lln9i.js} +1 -1
- package/dist/assets/{hover-Bv8Xc9G4.js → hover-rB8_XalK.js} +1 -1
- package/dist/assets/{iframe-x6BLg8Ji.js → iframe-CH-2Z4nW.js} +2 -2
- package/dist/assets/{index-DcOf5IFN.js → index-B_TkxWnH.js} +3 -3
- package/dist/assets/{index-CkEIPWib.js → index-HAtd9oNV.js} +1 -1
- package/dist/assets/{intro-CmrRtjLH.js → intro-CciujqaN.js} +1 -1
- package/dist/assets/layout-relative-BpJIh3YK.js +1 -0
- package/dist/assets/{migrating-from-less-CT230F26.js → migrating-from-less-CGun5jvS.js} +1 -1
- package/dist/assets/{playground-DBdZFxjC.css → playground-CCc6VR51.css} +1 -1
- package/dist/assets/{playground.stories-BhNG8Jgk.js → playground.stories-BMZQjPeS.js} +165 -165
- package/dist/assets/{preview-B1OsNris.js → preview-BA-z4dIb.js} +1 -1
- package/dist/assets/{preview-BEN5riSB.js → preview-CHRa9X89.js} +2 -2
- package/dist/assets/{preview-bLfHbFFi.js → preview-LLpb0wxd.js} +1 -1
- package/dist/assets/{tokens-i5BvqP2o.js → tokens-BAMxrvDv.js} +1 -1
- package/dist/assets/{tokens-I3xjhSDE.js → tokens-DoHds4Ot.js} +1 -1
- package/dist/assets/{tokens-DXy5hgn5.js → tokens-ZvFzTwDp.js} +1 -1
- package/dist/assets/{tokens-DjbFHayV.js → tokens-fQ3N2FTe.js} +1 -1
- package/dist/assets/{usePortalElement-tDzOwrOb.js → usePortalElement-Da1mB7Zi.js} +1 -1
- package/dist/assets/{welcome-BWP0gVfw.js → welcome-ChAggYgg.js} +1 -1
- package/dist/assets/{zeroheight-s8Fk0iPU.js → zeroheight-BDcQqTlz.js} +1 -1
- package/dist/iframe.html +1 -1
- package/dist/index.json +1 -1
- package/dist/preview-stats.json +987 -1083
- package/dist/project.json +1 -1
- package/package.json +3 -3
- package/dist/assets/10.Combinations.stories-Wf-NooK0.js +0 -144
- package/dist/assets/30.icons.explorer-DZ1EsBtj.js +0 -73
- package/dist/assets/ButtonBase-CiON5Gq9.js +0 -8
- package/dist/assets/CountryFlag-BEP02NMP.js +0 -48
- package/dist/assets/CountryFlag-p-8M_k5M.css +0 -1
- package/dist/assets/Flag.stories-BZC_j8i9.js +0 -110
- package/dist/assets/Flag.test.stories-Dqy18PgD.js +0 -27
- package/dist/assets/FormControl-DD3JEwg1.js +0 -5
- package/dist/assets/FormControl.stories-DoVURnEB.js +0 -46
- package/dist/assets/IconButton-D0fGiRmb.js +0 -8
- package/dist/assets/InputContainer-DNEgpOcG.css +0 -1
- package/dist/assets/LayoutFlexItem-RxfNp994.js +0 -1
- package/dist/assets/LayoutGrid.stories-CAvHZzVw.js +0 -88
- package/dist/assets/LayoutGridItem-AvP_ZkC5.js +0 -1
- package/dist/assets/LayoutGridItem-Dy4Q8woN.css +0 -1
- package/dist/assets/NumberField-_XVLeKUg.js +0 -4
- package/dist/assets/PasswordField-KGypENg3.js +0 -4
- package/dist/assets/TextField-872WjatY.js +0 -1
- package/dist/assets/TextField-DdvdZqgn.css +0 -1
- package/dist/assets/TextField-DnZQU85b.js +0 -4
- package/dist/assets/align-self-BM6l9H5Z.js +0 -1
- package/dist/assets/componentNames-CVVyamkx.js +0 -1
- /package/dist/assets/{InputContainer-C1TOTxt4.js → InputContainer-Bk0tgFnW.js} +0 -0
- /package/dist/assets/{align-self-C4ATemga.css → layout-relative-C4ATemga.css} +0 -0
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as o}from"./index-B3evPFBL.js";import{O as f}from"./ObserveIntersection-
|
1
|
+
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as o}from"./index-B3evPFBL.js";import{O as f}from"./ObserveIntersection-XIPHNpKf.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./componentNames-Ba2ybP0W.js";const a=({onIntersect:e,once:u,threshold:c,tag:d,dataset:p,children:m})=>{const[l,v]=o.useState(!1),h=o.useCallback(()=>{l||v(!0),e==null||e()},[l,e]);return t.jsx(f,{onIntersect:h,once:e?u:!0,threshold:c,tag:d,dataset:p,children:l&&m})};try{a.displayName="ShowOnIntersection",a.__docgenInfo={description:"Only renders the wrapped components once it intersects with the viewport.\n\nNote that elements will not be detached from the DOM if the component is\nscrolled out of view again.\n\nYou can use `React.lazy` to lazy-load the wrapped components.\n\nAdditionally, an `onIntersect` callback can be provided. As with\n`ObserveIntersection`, this callback will be called every time the component\nintersects with the viewport, or only the first time if `once` is set to\n`true`.",displayName:"ShowOnIntersection",props:{onIntersect:{defaultValue:null,description:"",name:"onIntersect",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},once:{defaultValue:null,description:"",name:"once",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},threshold:{defaultValue:null,description:"",name:"threshold",required:!1,type:{name:"enum",value:[{value:"number"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"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{}const I={title:"components/ShowOnIntersection",component:a,parameters:{tags:["!test"],chromatic:{disableSnapshot:!0}}},n=()=>t.jsx("div",{style:{height:"200px",overflowY:"scroll",position:"relative"},children:t.jsx("div",{style:{height:"400px",display:"flex",alignItems:"end"},children:t.jsx(a,{children:t.jsx("p",{children:"Intersected"})})})});n.storyName="ShowOnIntersection";var r,s,i;n.parameters={...n.parameters,docs:{...(r=n.parameters)==null?void 0:r.docs,source:{originalSource:`() => {
|
2
2
|
return <div style={{
|
3
3
|
height: '200px',
|
4
4
|
overflowY: 'scroll',
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as i}from"./index-B3evPFBL.js";import{B as y}from"./Button-
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as i}from"./index-B3evPFBL.js";import{B as y}from"./Button-iZiyzI_K.js";import"./index-BfBdt3zW.js";import{H as C}from"./Heading-BSlUFvxo.js";import{P as I}from"./ProgressSteps-ByDec2fC.js";import{g as M}from"./index-DdzHuZ-Y.js";import{w as V}from"./componentNames-Ba2ybP0W.js";import{M as b}from"./message-BraTJ16C.js";const E="steps__6mN2m",q="content__t3rlv",A="header__hCorO",B="description__j42sQ",g={steps:E,content:q,header:A,description:B},N=i.createContext(void 0),P=()=>{const n=i.useContext(N);if(n===void 0)throw new Error("Steps navigation components must be used within a Steps component");return n||{}},O=i.forwardRef(function({onClick:t,disabled:p,variant:o="tertiary",...c},d){const{goToPreviousStep:s,currentStep:u,isNavigating:l,contentId:m}=P();return e.jsx(y,{...c,ref:d,variant:o,onClick:r=>{t==null||t(r),!r.defaultPrevented&&s()},disabled:u===1||l||p,"aria-controls":m,children:c.children||e.jsx(b,{id:"preply-ds.steps.previous",defaultMessage:"Previous",description:"Button used to navigate to the previous step"})})}),D=i.forwardRef(function({onClick:t,disabled:p,variant:o="primary",...c},d){const{goToNextStep:s,currentStep:u,totalSteps:l,isNavigating:m,contentId:r}=P();return e.jsx(y,{...c,ref:d,variant:o,onClick:S=>{t==null||t(S),!S.defaultPrevented&&s()},disabled:u===l||m||p,"aria-controls":r,children:c.children||e.jsx(b,{id:"preply-ds.steps.next",defaultMessage:"Next",description:"Button used to navigate to the next step"})})}),R=({children:n,"aria-label":t,initialStep:p=1,onStepChange:o,dataset:c})=>{const d=i.useId(),[s,u]=i.useState(p),[l,m]=i.useState(!1),r=[],S=[];n==null||n.forEach(a=>{i.isValidElement(a)&&a.type===T?r.push(a):S.push(a)});const h=r.length,w=M(c,{preplyDsComponent:V.Steps}),f=async a=>{const v=Math.min(Math.max(a,1),h);if(!o){u(v);return}m(!0);try{const _=await o(s,v);u(_??v)}finally{m(!1)}},j={goToPreviousStep:()=>f(s-1),goToNextStep:()=>f(s+1),goToStep:a=>f(a),currentStep:s,totalSteps:h,isNavigating:l,contentId:d};return e.jsxs("div",{...w,className:g.steps,id:d,"aria-live":"polite","aria-busy":l,children:[e.jsx(I,{currentStep:s,totalSteps:h,"aria-label":t}),e.jsx("div",{className:g.content,children:e.jsxs(N.Provider,{value:j,children:[r[s-1],S]})})]})},T=({title:n,description:t,children:p,hideHeader:o})=>e.jsxs(e.Fragment,{children:[!o&&e.jsxs("hgroup",{className:g.header,children:[e.jsx(C,{tag:"h3",variant:"medium",children:n}),t&&e.jsx("p",{className:g.description,children:t})]}),p]}),x=Object.assign(R,{Step:T,Previous:O,Next:D});try{x.displayName="Steps",x.__docgenInfo={description:"This component allows users to navigate through a series of steps, providing\na structured way to complete tasks or forms. It will also handle screen reader\nannouncements and progress indicators.\n\nTo create a step, wrap the content of each step in a `Steps.Step` component.\nAny non-`Steps.Step` children will be rendered outside of the steps flow,\nright after the currently active step.\n\nTo navigate between steps, use the `Steps.Previous` and `Steps.Next` components.\nAlternatively, you can use the `StepsContext` directly to call\n`goToPreviousStep`, `goToNextStep`, or `goToStep`.",displayName:"Steps",props:{"aria-label":{defaultValue:null,description:`A description of the step flow and its content for screen readers.
|
2
2
|
@example 'Onboarding Steps', 'Checkout Steps', 'Survey Steps', etc.`,name:"aria-label",required:!0,type:{name:"string"}},initialStep:{defaultValue:{value:"1"},description:"The initial step to start at (from `1` to `children.length`).",name:"initialStep",required:!1,type:{name:"enum",value:[{value:"number"}]}},onStepChange:{defaultValue:null,description:`Optional callback to control navigation between steps.
|
3
3
|
|
4
4
|
This is triggered either by using the \`Steps.Previous\` and \`Steps.Next\`
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as G}from"./index-B3evPFBL.js";import{e as r,u as a,a as o}from"./index-DDyIDR-R.js";import{S as t,u as X}from"./Steps-
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as G}from"./index-B3evPFBL.js";import{e as r,u as a,a as o}from"./index-DDyIDR-R.js";import{S as t,u as X}from"./Steps-MniLzlHq.js";import{L as h}from"./LayoutFlex-BxFOrEzC.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./Button-iZiyzI_K.js";import"./render-icon-CVTdrNe-.js";import"./ButtonBase-CFf1N6e3.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-BCTJunNM.js";import"./classNames-BUL1Zq7e.js";import"./defaults-B1rzzf6M.js";import"./useMergeRefs-CeyIhNgY.js";import"./useHostname-CH18gHFj.js";import"./index-DdzHuZ-Y.js";import"./index-CC6DAVyL.js";import"./componentNames-Ba2ybP0W.js";import"./index-BfBdt3zW.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./Heading-BSlUFvxo.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";import"./ProgressSteps-ByDec2fC.js";import"./message-BraTJ16C.js";import"./layout-relative.module-ed9bC4H4.js";const je={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})=>{r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText("Next")),await o(()=>{r(s.getByText("Step 2")).toBeVisible()}),await a.click(s.getByText("Previous")),await o(()=>{r(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.
|
2
2
|
|
3
3
|
Navigation controls are disabled during transitions, with a cursor loading indicator.`}}},render:()=>{const s=async(p,n)=>(await new Promise(g=>setTimeout(g,1e3)),n);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");r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText("Next")),r(p).toContainHTML('aria-busy="true"'),await o(()=>{r(p).toContainHTML('aria-busy="false"'),r(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,n)=>n===3?p<3?4:2:n;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})=>{r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText("Next")),await o(()=>{r(s.getByText("Step 2")).toBeVisible()}),await a.click(s.getByText("Next")),await o(()=>{r(s.getByText("Step 4")).toBeVisible()}),await a.click(s.getByText("Previous")),await o(()=>{r(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"})})]})]})},Y=()=>{const{goToPreviousStep:s,goToNextStep:p,goToStep:n,totalSteps:g,isNavigating:v}=X();return G.useEffect(()=>{const b=O=>{if(!v)switch(O.key){case"ArrowLeft":s();break;case"ArrowRight":p();break;case"1":n(1);break;case"2":n(2);break;case"3":n(3);break}};return window.addEventListener("keydown",b),()=>window.removeEventListener("keydown",b)},[s,p,n,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.
|
4
4
|
|
@@ -1 +1 @@
|
|
1
|
-
import{j as A}from"./jsx-runtime-BYouaCF_.js";import{r as z}from"./index-B3evPFBL.js";import{g as E,a as h}from"./text-accent-DZDDtpIt.js";import{g as U}from"./text-centered-CznToR0o.js";import{f as N}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{m as W,s as l,b as j}from"./classNames-BUL1Zq7e.js";import{w as r}from"./componentNames-CVVyamkx.js";import{g as C}from"./index-DdzHuZ-Y.js";import{T as G,b as F}from"./defaults-B1rzzf6M.js";const L="Text__BD7-C",k={Text:L,"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--variant-xs":"Text--variant-xs__-oA5D","Text--variant-xs-medium":"Text--variant-xs-medium__lJfcR","Text--variant-s":"Text--variant-s__xqH0U","Text--variant-s-italic":"Text--variant-s-italic__jUEl1","Text--variant-s-medium":"Text--variant-s-medium__waMrn","Text--variant-s-medium-italic":"Text--variant-s-medium-italic__sLhV3","Text--variant-s-bold":"Text--variant-s-bold__tq4bK","Text--variant-s-bold-italic":"Text--variant-s-bold-italic__GG7kG","Text--variant-m":"Text--variant-m__y2H-S","Text--variant-m-italic":"Text--variant-m-italic__Sslhm","Text--variant-m-medium":"Text--variant-m-medium__6RBW8","Text--variant-m-medium-italic":"Text--variant-m-medium-italic__dWABZ","Text--variant-m-bold":"Text--variant-m-bold__5ZSGo","Text--variant-m-bold-italic":"Text--variant-m-bold-italic__EA7SO","Text--variant-l":"Text--variant-l__kMF37","Text--variant-l-italic":"Text--variant-l-italic__O9IYe","Text--variant-l-medium":"Text--variant-l-medium__mlaL6","Text--variant-l-medium-italic":"Text--variant-l-medium-italic__c-aUW","Text--variant-xl":"Text--variant-xl__mVHo2","Text--variant-xl-italic":"Text--variant-xl-italic__E-mAM","Text--variant-xl-medium":"Text--variant-xl-medium__oom4K","Text--variant-xl-medium-italic":"Text--variant-xl-medium-italic__TE3Jt","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--narrow-l--variant-xs":"Text--narrow-l--variant-xs__4uGu2","Text--narrow-l--variant-xs-medium":"Text--narrow-l--variant-xs-medium__-CtgL","Text--narrow-l--variant-s":"Text--narrow-l--variant-s__KqYpy","Text--narrow-l--variant-s-italic":"Text--narrow-l--variant-s-italic__-gELi","Text--narrow-l--variant-s-medium":"Text--narrow-l--variant-s-medium__utaTA","Text--narrow-l--variant-s-medium-italic":"Text--narrow-l--variant-s-medium-italic__zkpxW","Text--narrow-l--variant-s-bold":"Text--narrow-l--variant-s-bold__my0rm","Text--narrow-l--variant-s-bold-italic":"Text--narrow-l--variant-s-bold-italic__-j36-","Text--narrow-l--variant-m":"Text--narrow-l--variant-m__qcvbO","Text--narrow-l--variant-m-italic":"Text--narrow-l--variant-m-italic__2guYD","Text--narrow-l--variant-m-medium":"Text--narrow-l--variant-m-medium__R0Zn5","Text--narrow-l--variant-m-medium-italic":"Text--narrow-l--variant-m-medium-italic__dbTJX","Text--narrow-l--variant-m-bold":"Text--narrow-l--variant-m-bold__qG4uf","Text--narrow-l--variant-m-bold-italic":"Text--narrow-l--variant-m-bold-italic__zQtJz","Text--narrow-l--variant-l":"Text--narrow-l--variant-l__AXq1c","Text--narrow-l--variant-l-italic":"Text--narrow-l--variant-l-italic__HGq6U","Text--narrow-l--variant-l-medium":"Text--narrow-l--variant-l-medium__YwkyG","Text--narrow-l--variant-l-medium-italic":"Text--narrow-l--variant-l-medium-italic__yFA2S","Text--narrow-l--variant-xl":"Text--narrow-l--variant-xl__oBX0z","Text--narrow-l--variant-xl-italic":"Text--narrow-l--variant-xl-italic__-zpWI","Text--narrow-l--variant-xl-medium":"Text--narrow-l--variant-xl-medium__83EfM","Text--narrow-l--variant-xl-medium-italic":"Text--narrow-l--variant-xl-medium-italic__XFZLh","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-s--variant-xs":"Text--medium-s--variant-xs__z3jXb","Text--medium-s--variant-xs-medium":"Text--medium-s--variant-xs-medium__W652v","Text--medium-s--variant-s":"Text--medium-s--variant-s__7VRn-","Text--medium-s--variant-s-italic":"Text--medium-s--variant-s-italic__BwgAM","Text--medium-s--variant-s-medium":"Text--medium-s--variant-s-medium__GvQp3","Text--medium-s--variant-s-medium-italic":"Text--medium-s--variant-s-medium-italic__FyNWz","Text--medium-s--variant-s-bold":"Text--medium-s--variant-s-bold__21d9F","Text--medium-s--variant-s-bold-italic":"Text--medium-s--variant-s-bold-italic__IGU-J","Text--medium-s--variant-m":"Text--medium-s--variant-m__Dn8L6","Text--medium-s--variant-m-italic":"Text--medium-s--variant-m-italic__W45ct","Text--medium-s--variant-m-medium":"Text--medium-s--variant-m-medium__l502U","Text--medium-s--variant-m-medium-italic":"Text--medium-s--variant-m-medium-italic__Mn2Xv","Text--medium-s--variant-m-bold":"Text--medium-s--variant-m-bold__udL4N","Text--medium-s--variant-m-bold-italic":"Text--medium-s--variant-m-bold-italic__-JwlV","Text--medium-s--variant-l":"Text--medium-s--variant-l__enEs7","Text--medium-s--variant-l-italic":"Text--medium-s--variant-l-italic__GWybE","Text--medium-s--variant-l-medium":"Text--medium-s--variant-l-medium__OiUBT","Text--medium-s--variant-l-medium-italic":"Text--medium-s--variant-l-medium-italic__E5PLY","Text--medium-s--variant-xl":"Text--medium-s--variant-xl__WhyWE","Text--medium-s--variant-xl-italic":"Text--medium-s--variant-xl-italic__quV4P","Text--medium-s--variant-xl-medium":"Text--medium-s--variant-xl-medium__5w8u0","Text--medium-s--variant-xl-medium-italic":"Text--medium-s--variant-xl-medium-italic__ZrCSq","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--medium-l--variant-xs":"Text--medium-l--variant-xs__Y6JFw","Text--medium-l--variant-xs-medium":"Text--medium-l--variant-xs-medium__El12O","Text--medium-l--variant-s":"Text--medium-l--variant-s__FlmNU","Text--medium-l--variant-s-italic":"Text--medium-l--variant-s-italic__5jiqZ","Text--medium-l--variant-s-medium":"Text--medium-l--variant-s-medium__EAkmj","Text--medium-l--variant-s-medium-italic":"Text--medium-l--variant-s-medium-italic__ucwOq","Text--medium-l--variant-s-bold":"Text--medium-l--variant-s-bold__bgLyZ","Text--medium-l--variant-s-bold-italic":"Text--medium-l--variant-s-bold-italic__1ov1K","Text--medium-l--variant-m":"Text--medium-l--variant-m__0iJWf","Text--medium-l--variant-m-italic":"Text--medium-l--variant-m-italic__3Qg3q","Text--medium-l--variant-m-medium":"Text--medium-l--variant-m-medium__KJ9Be","Text--medium-l--variant-m-medium-italic":"Text--medium-l--variant-m-medium-italic__E11Pt","Text--medium-l--variant-m-bold":"Text--medium-l--variant-m-bold__9zNb6","Text--medium-l--variant-m-bold-italic":"Text--medium-l--variant-m-bold-italic__Uhd8V","Text--medium-l--variant-l":"Text--medium-l--variant-l__sB-Yg","Text--medium-l--variant-l-italic":"Text--medium-l--variant-l-italic__VFqnw","Text--medium-l--variant-l-medium":"Text--medium-l--variant-l-medium__zrQ83","Text--medium-l--variant-l-medium-italic":"Text--medium-l--variant-l-medium-italic__sdI6v","Text--medium-l--variant-xl":"Text--medium-l--variant-xl__Y3-cI","Text--medium-l--variant-xl-italic":"Text--medium-l--variant-xl-italic__SPEru","Text--medium-l--variant-xl-medium":"Text--medium-l--variant-xl-medium__WoUQ5","Text--medium-l--variant-xl-medium-italic":"Text--medium-l--variant-xl-medium-italic__WffJn","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-s--variant-xs":"Text--wide-s--variant-xs__eeBxV","Text--wide-s--variant-xs-medium":"Text--wide-s--variant-xs-medium__AENwl","Text--wide-s--variant-s":"Text--wide-s--variant-s__ZWFJx","Text--wide-s--variant-s-italic":"Text--wide-s--variant-s-italic__IJH0P","Text--wide-s--variant-s-medium":"Text--wide-s--variant-s-medium__w9kPs","Text--wide-s--variant-s-medium-italic":"Text--wide-s--variant-s-medium-italic__mLEAh","Text--wide-s--variant-s-bold":"Text--wide-s--variant-s-bold__mvwUE","Text--wide-s--variant-s-bold-italic":"Text--wide-s--variant-s-bold-italic__X2TdA","Text--wide-s--variant-m":"Text--wide-s--variant-m__2VmLl","Text--wide-s--variant-m-italic":"Text--wide-s--variant-m-italic__-cijk","Text--wide-s--variant-m-medium":"Text--wide-s--variant-m-medium__1M-am","Text--wide-s--variant-m-medium-italic":"Text--wide-s--variant-m-medium-italic__7mmlc","Text--wide-s--variant-m-bold":"Text--wide-s--variant-m-bold__AiN1T","Text--wide-s--variant-m-bold-italic":"Text--wide-s--variant-m-bold-italic__IeqkZ","Text--wide-s--variant-l":"Text--wide-s--variant-l__3OwLa","Text--wide-s--variant-l-italic":"Text--wide-s--variant-l-italic__kOKA0","Text--wide-s--variant-l-medium":"Text--wide-s--variant-l-medium__fexUj","Text--wide-s--variant-l-medium-italic":"Text--wide-s--variant-l-medium-italic__nljBU","Text--wide-s--variant-xl":"Text--wide-s--variant-xl__U-I9z","Text--wide-s--variant-xl-italic":"Text--wide-s--variant-xl-italic__Ezp9P","Text--wide-s--variant-xl-medium":"Text--wide-s--variant-xl-medium__bm-qs","Text--wide-s--variant-xl-medium-italic":"Text--wide-s--variant-xl-medium-italic__gd-Un","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--wide-l--variant-xs":"Text--wide-l--variant-xs__jktTZ","Text--wide-l--variant-xs-medium":"Text--wide-l--variant-xs-medium__Snw-d","Text--wide-l--variant-s":"Text--wide-l--variant-s__yhpAB","Text--wide-l--variant-s-italic":"Text--wide-l--variant-s-italic__JEQga","Text--wide-l--variant-s-medium":"Text--wide-l--variant-s-medium__t2Vrb","Text--wide-l--variant-s-medium-italic":"Text--wide-l--variant-s-medium-italic__b4sif","Text--wide-l--variant-s-bold":"Text--wide-l--variant-s-bold__a2thi","Text--wide-l--variant-s-bold-italic":"Text--wide-l--variant-s-bold-italic__dKJ86","Text--wide-l--variant-m":"Text--wide-l--variant-m__kv0Xt","Text--wide-l--variant-m-italic":"Text--wide-l--variant-m-italic__drCVx","Text--wide-l--variant-m-medium":"Text--wide-l--variant-m-medium__Nklnx","Text--wide-l--variant-m-medium-italic":"Text--wide-l--variant-m-medium-italic__dyKE3","Text--wide-l--variant-m-bold":"Text--wide-l--variant-m-bold__nGadW","Text--wide-l--variant-m-bold-italic":"Text--wide-l--variant-m-bold-italic__Qyayk","Text--wide-l--variant-l":"Text--wide-l--variant-l__X0Wqt","Text--wide-l--variant-l-italic":"Text--wide-l--variant-l-italic__N9AMu","Text--wide-l--variant-l-medium":"Text--wide-l--variant-l-medium__sUOBO","Text--wide-l--variant-l-medium-italic":"Text--wide-l--variant-l-medium-italic__LYJjd","Text--wide-l--variant-xl":"Text--wide-l--variant-xl__0XyZB","Text--wide-l--variant-xl-italic":"Text--wide-l--variant-xl-italic__fIE0o","Text--wide-l--variant-xl-medium":"Text--wide-l--variant-xl-medium__P1SBX","Text--wide-l--variant-xl-medium-italic":"Text--wide-l--variant-xl-medium-italic__wNV3Q","Text--strong":"Text--strong__ig9qo","Text--size-2xs":"Text--size-2xs__YlUqj","Text--size-xs":"Text--size-xs__GSGix","Text--size-s":"Text--size-s__WrxO0","Text--size-m":"Text--size-m__p4phq","Text--size-l":"Text--size-l__GI6Vj","Text--size-xl":"Text--size-xl__es-C8"},m=z.forwardRef(function({children:d,variant:a,tag:u=G,size:e,accent:i,color:v,strong:s,centered:x,dataset:T,..._},o){const c=a||(e?void 0:F),w=a?void 0:e,g=a?void 0:s,b=W(k,r.Text,[l("variant",c),l("size",w),j("strong",void 0,g)]),t=i?void 0:v,f=E(!t,i),p=h(t),y=U(x),V=[...b,...f,...p,...y],q={...N(_),ref:o,className:V.join(" "),...C(T,{preplyDsComponent:r.Text})};return A.jsx(u,{...q,children:d})});try{m.displayName="Text",m.__docgenInfo={description:"",displayName:"Text",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{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:'"xs-medium"'},{value:'"s-italic"'},{value:'"s-medium"'},{value:'"s-medium-italic"'},{value:'"s-bold"'},{value:'"s-bold-italic"'},{value:'"m-italic"'},{value:'"m-medium"'},{value:'"m-medium-italic"'},{value:'"m-bold"'},{value:'"m-bold-italic"'},{value:'"l-italic"'},{value:'"l-medium"'},{value:'"l-medium-italic"'},{value:'"xl-italic"'},{value:'"xl-medium"'},{value:'"xl-medium-italic"'},{value:"ResponsiveProp<TextVariant>"}]}},size:{defaultValue:null,description:"@deprecated Use variant instead.",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"2xs"'}]}},accent:{defaultValue:null,description:"",name:"accent",required:!1,type:{name:"enum",value:[{value:'"accent"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"accentDark"'},{value:'"placeholder"'},{value:'"inverted"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"disabled"'},{value:'"branded"'},{value:'"selected"'},{value:'"error"'}]}},color:{defaultValue:null,description:"@deprecated Use accent instead.",name:"color",required:!1,type:{name:"enum",value:[{value:'"white"'},{value:'"gray-100"'},{value:'"gray-200"'},{value:'"gray-300"'},{value:'"gray-400"'},{value:'"gray-500"'},{value:'"gray-600"'},{value:'"teal-100"'},{value:'"teal-200"'},{value:'"teal-300"'},{value:'"teal-400"'},{value:'"teal-500"'},{value:'"green-100"'},{value:'"green-200"'},{value:'"green-300"'},{value:'"green-400"'},{value:'"green-500"'},{value:'"yellow-100"'},{value:'"yellow-200"'},{value:'"yellow-300"'},{value:'"yellow-400"'},{value:'"yellow-500"'},{value:'"red-100"'},{value:'"red-200"'},{value:'"red-300"'},{value:'"red-400"'},{value:'"red-500"'},{value:'"blue-100"'},{value:'"blue-200"'},{value:'"blue-300"'},{value:'"blue-400"'},{value:'"blue-500"'},{value:'"magenta-100"'},{value:'"magenta-200"'},{value:'"magenta-300"'},{value:'"magenta-400"'},{value:'"magenta-500"'}]}},strong:{defaultValue:null,description:"@deprecated Text automatically sets the appropriate `font-weight` per variant",name:"strong",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},centered:{defaultValue:null,description:"",name:"centered",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'}]}},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: 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{m as T};
|
1
|
+
import{j as A}from"./jsx-runtime-BYouaCF_.js";import{r as z}from"./index-B3evPFBL.js";import{g as E,a as h}from"./text-accent-DZDDtpIt.js";import{g as U}from"./text-centered-CznToR0o.js";import{f as N}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{m as W,s as l,b as j}from"./classNames-BUL1Zq7e.js";import{w as r}from"./componentNames-Ba2ybP0W.js";import{g as C}from"./index-DdzHuZ-Y.js";import{T as G,b as F}from"./defaults-B1rzzf6M.js";const L="Text__BD7-C",k={Text:L,"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--variant-xs":"Text--variant-xs__-oA5D","Text--variant-xs-medium":"Text--variant-xs-medium__lJfcR","Text--variant-s":"Text--variant-s__xqH0U","Text--variant-s-italic":"Text--variant-s-italic__jUEl1","Text--variant-s-medium":"Text--variant-s-medium__waMrn","Text--variant-s-medium-italic":"Text--variant-s-medium-italic__sLhV3","Text--variant-s-bold":"Text--variant-s-bold__tq4bK","Text--variant-s-bold-italic":"Text--variant-s-bold-italic__GG7kG","Text--variant-m":"Text--variant-m__y2H-S","Text--variant-m-italic":"Text--variant-m-italic__Sslhm","Text--variant-m-medium":"Text--variant-m-medium__6RBW8","Text--variant-m-medium-italic":"Text--variant-m-medium-italic__dWABZ","Text--variant-m-bold":"Text--variant-m-bold__5ZSGo","Text--variant-m-bold-italic":"Text--variant-m-bold-italic__EA7SO","Text--variant-l":"Text--variant-l__kMF37","Text--variant-l-italic":"Text--variant-l-italic__O9IYe","Text--variant-l-medium":"Text--variant-l-medium__mlaL6","Text--variant-l-medium-italic":"Text--variant-l-medium-italic__c-aUW","Text--variant-xl":"Text--variant-xl__mVHo2","Text--variant-xl-italic":"Text--variant-xl-italic__E-mAM","Text--variant-xl-medium":"Text--variant-xl-medium__oom4K","Text--variant-xl-medium-italic":"Text--variant-xl-medium-italic__TE3Jt","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--narrow-l--variant-xs":"Text--narrow-l--variant-xs__4uGu2","Text--narrow-l--variant-xs-medium":"Text--narrow-l--variant-xs-medium__-CtgL","Text--narrow-l--variant-s":"Text--narrow-l--variant-s__KqYpy","Text--narrow-l--variant-s-italic":"Text--narrow-l--variant-s-italic__-gELi","Text--narrow-l--variant-s-medium":"Text--narrow-l--variant-s-medium__utaTA","Text--narrow-l--variant-s-medium-italic":"Text--narrow-l--variant-s-medium-italic__zkpxW","Text--narrow-l--variant-s-bold":"Text--narrow-l--variant-s-bold__my0rm","Text--narrow-l--variant-s-bold-italic":"Text--narrow-l--variant-s-bold-italic__-j36-","Text--narrow-l--variant-m":"Text--narrow-l--variant-m__qcvbO","Text--narrow-l--variant-m-italic":"Text--narrow-l--variant-m-italic__2guYD","Text--narrow-l--variant-m-medium":"Text--narrow-l--variant-m-medium__R0Zn5","Text--narrow-l--variant-m-medium-italic":"Text--narrow-l--variant-m-medium-italic__dbTJX","Text--narrow-l--variant-m-bold":"Text--narrow-l--variant-m-bold__qG4uf","Text--narrow-l--variant-m-bold-italic":"Text--narrow-l--variant-m-bold-italic__zQtJz","Text--narrow-l--variant-l":"Text--narrow-l--variant-l__AXq1c","Text--narrow-l--variant-l-italic":"Text--narrow-l--variant-l-italic__HGq6U","Text--narrow-l--variant-l-medium":"Text--narrow-l--variant-l-medium__YwkyG","Text--narrow-l--variant-l-medium-italic":"Text--narrow-l--variant-l-medium-italic__yFA2S","Text--narrow-l--variant-xl":"Text--narrow-l--variant-xl__oBX0z","Text--narrow-l--variant-xl-italic":"Text--narrow-l--variant-xl-italic__-zpWI","Text--narrow-l--variant-xl-medium":"Text--narrow-l--variant-xl-medium__83EfM","Text--narrow-l--variant-xl-medium-italic":"Text--narrow-l--variant-xl-medium-italic__XFZLh","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-s--variant-xs":"Text--medium-s--variant-xs__z3jXb","Text--medium-s--variant-xs-medium":"Text--medium-s--variant-xs-medium__W652v","Text--medium-s--variant-s":"Text--medium-s--variant-s__7VRn-","Text--medium-s--variant-s-italic":"Text--medium-s--variant-s-italic__BwgAM","Text--medium-s--variant-s-medium":"Text--medium-s--variant-s-medium__GvQp3","Text--medium-s--variant-s-medium-italic":"Text--medium-s--variant-s-medium-italic__FyNWz","Text--medium-s--variant-s-bold":"Text--medium-s--variant-s-bold__21d9F","Text--medium-s--variant-s-bold-italic":"Text--medium-s--variant-s-bold-italic__IGU-J","Text--medium-s--variant-m":"Text--medium-s--variant-m__Dn8L6","Text--medium-s--variant-m-italic":"Text--medium-s--variant-m-italic__W45ct","Text--medium-s--variant-m-medium":"Text--medium-s--variant-m-medium__l502U","Text--medium-s--variant-m-medium-italic":"Text--medium-s--variant-m-medium-italic__Mn2Xv","Text--medium-s--variant-m-bold":"Text--medium-s--variant-m-bold__udL4N","Text--medium-s--variant-m-bold-italic":"Text--medium-s--variant-m-bold-italic__-JwlV","Text--medium-s--variant-l":"Text--medium-s--variant-l__enEs7","Text--medium-s--variant-l-italic":"Text--medium-s--variant-l-italic__GWybE","Text--medium-s--variant-l-medium":"Text--medium-s--variant-l-medium__OiUBT","Text--medium-s--variant-l-medium-italic":"Text--medium-s--variant-l-medium-italic__E5PLY","Text--medium-s--variant-xl":"Text--medium-s--variant-xl__WhyWE","Text--medium-s--variant-xl-italic":"Text--medium-s--variant-xl-italic__quV4P","Text--medium-s--variant-xl-medium":"Text--medium-s--variant-xl-medium__5w8u0","Text--medium-s--variant-xl-medium-italic":"Text--medium-s--variant-xl-medium-italic__ZrCSq","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--medium-l--variant-xs":"Text--medium-l--variant-xs__Y6JFw","Text--medium-l--variant-xs-medium":"Text--medium-l--variant-xs-medium__El12O","Text--medium-l--variant-s":"Text--medium-l--variant-s__FlmNU","Text--medium-l--variant-s-italic":"Text--medium-l--variant-s-italic__5jiqZ","Text--medium-l--variant-s-medium":"Text--medium-l--variant-s-medium__EAkmj","Text--medium-l--variant-s-medium-italic":"Text--medium-l--variant-s-medium-italic__ucwOq","Text--medium-l--variant-s-bold":"Text--medium-l--variant-s-bold__bgLyZ","Text--medium-l--variant-s-bold-italic":"Text--medium-l--variant-s-bold-italic__1ov1K","Text--medium-l--variant-m":"Text--medium-l--variant-m__0iJWf","Text--medium-l--variant-m-italic":"Text--medium-l--variant-m-italic__3Qg3q","Text--medium-l--variant-m-medium":"Text--medium-l--variant-m-medium__KJ9Be","Text--medium-l--variant-m-medium-italic":"Text--medium-l--variant-m-medium-italic__E11Pt","Text--medium-l--variant-m-bold":"Text--medium-l--variant-m-bold__9zNb6","Text--medium-l--variant-m-bold-italic":"Text--medium-l--variant-m-bold-italic__Uhd8V","Text--medium-l--variant-l":"Text--medium-l--variant-l__sB-Yg","Text--medium-l--variant-l-italic":"Text--medium-l--variant-l-italic__VFqnw","Text--medium-l--variant-l-medium":"Text--medium-l--variant-l-medium__zrQ83","Text--medium-l--variant-l-medium-italic":"Text--medium-l--variant-l-medium-italic__sdI6v","Text--medium-l--variant-xl":"Text--medium-l--variant-xl__Y3-cI","Text--medium-l--variant-xl-italic":"Text--medium-l--variant-xl-italic__SPEru","Text--medium-l--variant-xl-medium":"Text--medium-l--variant-xl-medium__WoUQ5","Text--medium-l--variant-xl-medium-italic":"Text--medium-l--variant-xl-medium-italic__WffJn","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-s--variant-xs":"Text--wide-s--variant-xs__eeBxV","Text--wide-s--variant-xs-medium":"Text--wide-s--variant-xs-medium__AENwl","Text--wide-s--variant-s":"Text--wide-s--variant-s__ZWFJx","Text--wide-s--variant-s-italic":"Text--wide-s--variant-s-italic__IJH0P","Text--wide-s--variant-s-medium":"Text--wide-s--variant-s-medium__w9kPs","Text--wide-s--variant-s-medium-italic":"Text--wide-s--variant-s-medium-italic__mLEAh","Text--wide-s--variant-s-bold":"Text--wide-s--variant-s-bold__mvwUE","Text--wide-s--variant-s-bold-italic":"Text--wide-s--variant-s-bold-italic__X2TdA","Text--wide-s--variant-m":"Text--wide-s--variant-m__2VmLl","Text--wide-s--variant-m-italic":"Text--wide-s--variant-m-italic__-cijk","Text--wide-s--variant-m-medium":"Text--wide-s--variant-m-medium__1M-am","Text--wide-s--variant-m-medium-italic":"Text--wide-s--variant-m-medium-italic__7mmlc","Text--wide-s--variant-m-bold":"Text--wide-s--variant-m-bold__AiN1T","Text--wide-s--variant-m-bold-italic":"Text--wide-s--variant-m-bold-italic__IeqkZ","Text--wide-s--variant-l":"Text--wide-s--variant-l__3OwLa","Text--wide-s--variant-l-italic":"Text--wide-s--variant-l-italic__kOKA0","Text--wide-s--variant-l-medium":"Text--wide-s--variant-l-medium__fexUj","Text--wide-s--variant-l-medium-italic":"Text--wide-s--variant-l-medium-italic__nljBU","Text--wide-s--variant-xl":"Text--wide-s--variant-xl__U-I9z","Text--wide-s--variant-xl-italic":"Text--wide-s--variant-xl-italic__Ezp9P","Text--wide-s--variant-xl-medium":"Text--wide-s--variant-xl-medium__bm-qs","Text--wide-s--variant-xl-medium-italic":"Text--wide-s--variant-xl-medium-italic__gd-Un","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--wide-l--variant-xs":"Text--wide-l--variant-xs__jktTZ","Text--wide-l--variant-xs-medium":"Text--wide-l--variant-xs-medium__Snw-d","Text--wide-l--variant-s":"Text--wide-l--variant-s__yhpAB","Text--wide-l--variant-s-italic":"Text--wide-l--variant-s-italic__JEQga","Text--wide-l--variant-s-medium":"Text--wide-l--variant-s-medium__t2Vrb","Text--wide-l--variant-s-medium-italic":"Text--wide-l--variant-s-medium-italic__b4sif","Text--wide-l--variant-s-bold":"Text--wide-l--variant-s-bold__a2thi","Text--wide-l--variant-s-bold-italic":"Text--wide-l--variant-s-bold-italic__dKJ86","Text--wide-l--variant-m":"Text--wide-l--variant-m__kv0Xt","Text--wide-l--variant-m-italic":"Text--wide-l--variant-m-italic__drCVx","Text--wide-l--variant-m-medium":"Text--wide-l--variant-m-medium__Nklnx","Text--wide-l--variant-m-medium-italic":"Text--wide-l--variant-m-medium-italic__dyKE3","Text--wide-l--variant-m-bold":"Text--wide-l--variant-m-bold__nGadW","Text--wide-l--variant-m-bold-italic":"Text--wide-l--variant-m-bold-italic__Qyayk","Text--wide-l--variant-l":"Text--wide-l--variant-l__X0Wqt","Text--wide-l--variant-l-italic":"Text--wide-l--variant-l-italic__N9AMu","Text--wide-l--variant-l-medium":"Text--wide-l--variant-l-medium__sUOBO","Text--wide-l--variant-l-medium-italic":"Text--wide-l--variant-l-medium-italic__LYJjd","Text--wide-l--variant-xl":"Text--wide-l--variant-xl__0XyZB","Text--wide-l--variant-xl-italic":"Text--wide-l--variant-xl-italic__fIE0o","Text--wide-l--variant-xl-medium":"Text--wide-l--variant-xl-medium__P1SBX","Text--wide-l--variant-xl-medium-italic":"Text--wide-l--variant-xl-medium-italic__wNV3Q","Text--strong":"Text--strong__ig9qo","Text--size-2xs":"Text--size-2xs__YlUqj","Text--size-xs":"Text--size-xs__GSGix","Text--size-s":"Text--size-s__WrxO0","Text--size-m":"Text--size-m__p4phq","Text--size-l":"Text--size-l__GI6Vj","Text--size-xl":"Text--size-xl__es-C8"},m=z.forwardRef(function({children:d,variant:a,tag:u=G,size:e,accent:i,color:v,strong:s,centered:x,dataset:T,..._},o){const c=a||(e?void 0:F),w=a?void 0:e,g=a?void 0:s,b=W(k,r.Text,[l("variant",c),l("size",w),j("strong",void 0,g)]),t=i?void 0:v,f=E(!t,i),p=h(t),y=U(x),V=[...b,...f,...p,...y],q={...N(_),ref:o,className:V.join(" "),...C(T,{preplyDsComponent:r.Text})};return A.jsx(u,{...q,children:d})});try{m.displayName="Text",m.__docgenInfo={description:"",displayName:"Text",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{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:'"xs-medium"'},{value:'"s-italic"'},{value:'"s-medium"'},{value:'"s-medium-italic"'},{value:'"s-bold"'},{value:'"s-bold-italic"'},{value:'"m-italic"'},{value:'"m-medium"'},{value:'"m-medium-italic"'},{value:'"m-bold"'},{value:'"m-bold-italic"'},{value:'"l-italic"'},{value:'"l-medium"'},{value:'"l-medium-italic"'},{value:'"xl-italic"'},{value:'"xl-medium"'},{value:'"xl-medium-italic"'},{value:"ResponsiveProp<TextVariant>"}]}},size:{defaultValue:null,description:"@deprecated Use variant instead.",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"2xs"'}]}},accent:{defaultValue:null,description:"",name:"accent",required:!1,type:{name:"enum",value:[{value:'"accent"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"accentDark"'},{value:'"placeholder"'},{value:'"inverted"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"disabled"'},{value:'"branded"'},{value:'"selected"'},{value:'"error"'}]}},color:{defaultValue:null,description:"@deprecated Use accent instead.",name:"color",required:!1,type:{name:"enum",value:[{value:'"white"'},{value:'"gray-100"'},{value:'"gray-200"'},{value:'"gray-300"'},{value:'"gray-400"'},{value:'"gray-500"'},{value:'"gray-600"'},{value:'"teal-100"'},{value:'"teal-200"'},{value:'"teal-300"'},{value:'"teal-400"'},{value:'"teal-500"'},{value:'"green-100"'},{value:'"green-200"'},{value:'"green-300"'},{value:'"green-400"'},{value:'"green-500"'},{value:'"yellow-100"'},{value:'"yellow-200"'},{value:'"yellow-300"'},{value:'"yellow-400"'},{value:'"yellow-500"'},{value:'"red-100"'},{value:'"red-200"'},{value:'"red-300"'},{value:'"red-400"'},{value:'"red-500"'},{value:'"blue-100"'},{value:'"blue-200"'},{value:'"blue-300"'},{value:'"blue-400"'},{value:'"blue-500"'},{value:'"magenta-100"'},{value:'"magenta-200"'},{value:'"magenta-300"'},{value:'"magenta-400"'},{value:'"magenta-500"'}]}},strong:{defaultValue:null,description:"@deprecated Text automatically sets the appropriate `font-weight` per variant",name:"strong",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},centered:{defaultValue:null,description:"",name:"centered",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'}]}},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: 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{m as T};
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{T as i}from"./Text-
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{T as i}from"./Text-DrH34jFe.js";import{S as c}from"./consts-KAYct7Gj.js";import{T as f}from"./options-Dn0Ts6qK.js";import{g as S}from"./getTokenVar-DU_DEzTd.js";import{c as k}from"./tokens-ZvFzTwDp.js";import"./index-B3evPFBL.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./text-centered-CznToR0o.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-Ba2ybP0W.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./constants-BgBLeZzp.js";const X={title:"components/Text",component:i,argTypes:{variant:{description:c},centered:{description:c}}},a=()=>e.jsx(i,{children:"Lorem ipsum"});a.tags=["!test"];a.parameters={chromatic:{disableSnapshot:!0}};const n=()=>{const r=S(k.background.primaryInverted);return e.jsx(e.Fragment,{children:f.map(({id:t})=>e.jsx("div",{style:{backgroundColor:["inverted","branded","selected"].includes(t)?r:void 0},children:e.jsx(i,{accent:t,children:t})},t))})},j=["caption-regular","caption-semibold","small-regular","small-regular-italic","small-semibold","small-semibold-italic","default-regular","default-regular-italic","default-semibold","default-semibold-italic","large-regular","large-regular-italic","large-semibold","large-semibold-italic"],o=()=>e.jsx(e.Fragment,{children:j.map(r=>e.jsx(i,{variant:r,children:r},r))}),s={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(r,{args:t})=>e.jsx("div",{style:{backgroundColor:t.accent==="inverted"?"black":void 0},children:r()})],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"},size:{table:{disable:!0}},strong:{table:{disable:!0}},color:{table:{disable:!0}}}};var l,d,m;a.parameters={...a.parameters,docs:{...(l=a.parameters)==null?void 0:l.docs,source:{originalSource:"() => <Text>Lorem ipsum</Text>",...(m=(d=a.parameters)==null?void 0:d.docs)==null?void 0:m.source}}};var p,u,g;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
|
2
2
|
const grey = getTokenVar(color.background.primaryInverted);
|
3
3
|
return <>
|
4
4
|
{TEXT_ACCENT_OPTIONS.map(({
|
@@ -0,0 +1 @@
|
|
1
|
+
.container__dtKps{--ds-input-scroll-margin-top: var(--d434fb);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:var(--590b8d);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.container__dtKps:has(.label__S0tQE:not([data-hidden=true])){--ds-input-scroll-margin-top: calc(var(--590b8d) + var(--360264))}.label__S0tQE{color:var(--628fb7);font-size:var(--343d89);font-weight:var(--b44390);line-height:var(--360264);letter-spacing:var(--b8c41f);white-space:nowrap}.label__S0tQE[data-hidden=true]{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.label__S0tQE .required__GVzWg{color:var(--a2f1c8)}.description__h6Gw1,.error__MGvA2{margin:var(--d434fb);font-weight:var(--c2057a);font-size:var(--d4ea3f);line-height:var(--ff8dfa);letter-spacing:var(--cdd9f4);color:var(--a2f1c8)}.error__MGvA2{color:var(--8ec9e5)}.container__B-gQ9{width:100%;position:relative}@media (hover: hover) and (pointer: fine){.container__B-gQ9:hover .input__WZN7y{border-color:var(--11d206)}}.container__B-gQ9 .icon__6Xfum{position:absolute;left:calc(var(--558c4c) - var(--d9baa3));top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:var(--cbc724);pointer-events:none}.container__B-gQ9 .trailingIcon__Bgnv4{position:absolute;right:calc(var(--558c4c) - var(--d9baa3));top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:var(--cbc724);pointer-events:none}.container__B-gQ9 .button__auAU0{position:absolute;right:var(--590b8d);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.container__B-gQ9:has(>.icon__6Xfum) .input__WZN7y{padding-left:calc((var(--558c4c) - var(--d9baa3)) + var(--1e685c) + var(--66b80b));padding-left:calc(calc(var(--558c4c) - var(--d9baa3)) + var(--1e685c) + var(--66b80b))}.container__B-gQ9:has(>.button__auAU0) .input__WZN7y{padding-right:58px}.container__B-gQ9:has(>.trailingIcon__Bgnv4) .input__WZN7y{padding-right:calc((var(--558c4c) - var(--d9baa3)) + var(--1e685c) + var(--66b80b));padding-right:calc(calc(var(--558c4c) - var(--d9baa3)) + var(--1e685c) + var(--66b80b))}.container__B-gQ9:has(>.input__WZN7y[aria-invalid=true]) .icon__6Xfum{color:var(--7b0f41)}.input__WZN7y{display:block;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;padding:calc(var(--d9baa3) + var(--66b80b)) calc(var(--558c4c) - var(--d9baa3));border:var(--d9baa3) solid var(--29cd58);border-radius:var(--fa4b1a);font-size:var(--7f027e);line-height:var(--11f5c9);font-weight:var(--59913e);letter-spacing:var(--b2e406);scroll-margin-top:var(--ds-input-scroll-margin-top)}.input__WZN7y::-webkit-input-placeholder{color:var(--d9209f)}.input__WZN7y::-moz-placeholder{color:var(--d9209f)}.input__WZN7y:-ms-input-placeholder{color:var(--d9209f)}.input__WZN7y::-ms-input-placeholder{color:var(--d9209f)}.input__WZN7y::placeholder{color:var(--d9209f)}.input__WZN7y:focus{outline:var(--398094) auto var(--d9baa3)}.input__WZN7y:disabled,.input__WZN7y:disabled:hover{border-color:transparent;background-color:var(--04daeb)}.input__WZN7y[aria-invalid=true]{border-color:var(--7b0f41);background-color:var(--95df5b);color:var(--7b0f41)}input.input__WZN7y[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input.input__WZN7y[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:var(--d434fb)}input.input__WZN7y[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:var(--d434fb)}select.input__WZN7y{-webkit-appearance:none;-moz-appearance:none;appearance:none}select.input__WZN7y[data-empty=true]{color:var(--d9209f)}
|
@@ -0,0 +1 @@
|
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{S as F}from"./index-DRKYGVyc.js";import"./index-BfBdt3zW.js";import{g as b}from"./index-DdzHuZ-Y.js";import{w as I}from"./componentNames-Ba2ybP0W.js";import{M as N}from"./message-BraTJ16C.js";const A="container__dtKps",q="label__S0tQE",C="required__GVzWg",M="description__h6Gw1",$="error__MGvA2",c={container:A,label:q,required:C,description:M,error:$};function w({id:a,error:s,description:n,hasError:r}){const t={};return r&&(t["aria-invalid"]=!0),s&&(t["aria-invalid"]=!0,t["aria-errormessage"]=`${a}-error`),n&&(t["aria-describedby"]=`${a}-description`),t}const T=({id:a,label:s,hideLabel:n,description:r,error:t,hasError:o,children:p,required:i,dataset:u,onClick:m,preplyDsComponent:d=I.FormControl,useLegacyRequiredLabel:x=!1})=>{const _=j.useId(),l=a||_,g=w({id:l,error:t,description:r,hasError:o}),h=b(u,{preplyDsComponent:d});return e.jsxs("div",{className:c.container,...h,onClick:m,children:[e.jsxs("label",{htmlFor:l,className:c.label,"data-hidden":n||!s,"data-testid":"label",children:[s,!!x&&i&&e.jsxs("span",{"aria-hidden":!0,className:c.required,children:[" • ",e.jsx(N,{id:"preply-ds.fieldLabel.required",defaultMessage:[{type:0,value:"Required"}]})]}),!x&&!i&&e.jsxs("span",{"aria-hidden":!0,className:c.required,children:[" • ",e.jsx(N,{id:"preply-ds.fieldLabel.optional",defaultMessage:[{type:0,value:"Optional"}]})]})]}),e.jsx(F,{id:l,required:i,...g,children:p}),t?e.jsx("p",{className:c.error,role:"alert",id:`${l}-error`,"data-testid":"error",children:t}):r?e.jsx("p",{className:c.description,id:`${l}-description`,"data-testid":"description",children:r}):null]})},E="container__B-gQ9",G="input__WZN7y",P="icon__6Xfum",R="trailingIcon__Bgnv4",S="button__auAU0",f={container:E,input:G,icon:P,trailingIcon:R,button:S};function z({button:a,icon:s,trailingIcon:n,children:r}){return e.jsxs("div",{className:f.container,children:[!!s&&e.jsx("span",{className:f.icon,children:s}),r,!!n&&e.jsx("span",{className:f.trailingIcon,children:n}),!!a&&e.jsx("span",{className:f.button,children:a})]})}const v=j.forwardRef(function({button:s,icon:n,dataset:r,onChange:t,onValueChange:o,...p},i){const u=b(r),m=d=>{t==null||t(d),o==null||o(d.target.value)};return e.jsx(z,{button:s,icon:n,children:e.jsx("input",{...u,...p,ref:i,onChange:m,className:f.input})})});v.__docgenInfo={description:"",methods:[],displayName:"Input"};const B=j.forwardRef(function({id:s,label:n,description:r,error:t,required:o,type:p="text",inputDataset:i,dataset:u,hideLabel:m,onClick:d,hasError:x,useLegacyRequiredLabel:_,className:l,style:g,...h},y){return e.jsx(T,{id:s,label:n,description:r,error:t,hasError:x,required:o,dataset:u,hideLabel:m,onClick:d,useLegacyRequiredLabel:_,preplyDsComponent:I.TextField,children:e.jsx(v,{...h,type:p,ref:y,dataset:i})})});B.__docgenInfo={description:"",methods:[],displayName:"TextField",props:{type:{defaultValue:{value:'"text"',computed:!1},required:!1}}};export{T as F,z as I,B as T,v as a,f as s};
|
@@ -0,0 +1,6 @@
|
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{r as h}from"./index-B3evPFBL.js";import{F as b}from"./FormControl-V3kzTeDQ.js";import{w as q}from"./componentNames-Ba2ybP0W.js";import{I as g}from"./Input-BZxJ9sXr.js";const a=h.forwardRef(function({id:n,label:u,description:t,error:r,required:i,type:d="text",inputDataset:s,dataset:o,hideLabel:m,onClick:p,hasError:v,useLegacyRequiredLabel:f,className:E,style:V,...c},y){return e.jsx(b,{id:n,label:u,description:t,error:r,hasError:v,required:i,dataset:o,hideLabel:m,onClick:p,useLegacyRequiredLabel:f,preplyDsComponent:q.TextField,children:e.jsx(g,{...c,type:d,ref:y,dataset:s})})});try{a.displayName="TextField",a.__docgenInfo={description:"",displayName:"TextField",props:{id:{defaultValue:null,description:`The id to be passed to the input element.
|
2
|
+
If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
|
3
|
+
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"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
|
4
|
+
indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
|
5
|
+
When false, adds a "Optional" indicator next to the label for the optional fields instead.
|
6
|
+
@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"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"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"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},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>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},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:'"url"'},{value:'"search"'},{value:'"text"'},{value:'"email"'},{value:'"tel"'}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"name"'},{value:'"url"'},{value:'"off"'},{value:'"on"'},{value:'"email"'},{value:'"tel"'},{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{a as T};
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPFBL.js";import{a as re}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{T as te}from"./TextField-
|
1
|
+
import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPFBL.js";import{a as re}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{T as te}from"./TextField-sd_-L-71.js";import{F as ne}from"./TokyoUIUser-CEt_udNR.js";import{F as se}from"./TokyoUIAttach-BvBvQVx_.js";import{I as ie}from"./Icon-D-t6qc3n.js";import{F as le}from"./FieldButton-Dprr9FF4.js";import{f as r,w,e as n,u as b}from"./index-DDyIDR-R.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./FormControl-V3kzTeDQ.js";import"./index-DRKYGVyc.js";import"./index-BfBdt3zW.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./index-DdzHuZ-Y.js";import"./message-BraTJ16C.js";import"./componentNames-Ba2ybP0W.js";import"./Input-BZxJ9sXr.js";import"./InputContainer-Bk0tgFnW.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-CVTdrNe-.js";import"./defaults-B1rzzf6M.js";const ke={title:"components/TextField",component:te,args:{name:"fullName",label:"Full name",defaultValue:"",placeholder:"John Doe",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onChange:r(),onValueChange:r(),onBlur:r(),onFocus:r(),onClick:r(),onCopy:r(),onKeyDown:r(),onKeyUp:r(),onPaste:r()}},l={play:async({canvasElement:a,step:e,args:t})=>{const o=w(a),i=o.getByTestId("field"),s=o.getByTestId("input");await e("it should render correct label",async()=>{const ae=w(i).getByTestId("label");n(ae).toHaveTextContent("Full name • Optional"),n(s).toHaveAccessibleName("Full name")}),await e("it should call onFocus when the input is focused",async()=>{s.focus(),n(t.onFocus).toHaveBeenCalled()}),await e("it should call callback when the value changes",async()=>{await b.type(s,"John Doe"),n(t.onValueChange).toHaveBeenCalledWith("John Doe"),n(t.onChange).toHaveBeenCalled()}),await e("it should call onBlur when the input is blurred",async()=>{await b.keyboard("{tab}"),n(t.onBlur).toHaveBeenCalled()}),await e("it should render the dataset props",async()=>{n(i).toHaveAttribute("data-testid","field"),n(i).toHaveAttribute("data-foo","bar"),n(s).toHaveAttribute("data-testid","input"),n(s).toHaveAttribute("data-foo","bar")})}},c={render:function(e){const[t,o]=oe.useState(e.value);return x.jsx(te,{...e,value:t,onChange:i=>{var s;o(i.target.value),(s=e.onChange)==null||s.call(e,i)}})},args:{label:"Controlled TextField",placeholder:"Type something...",value:"Initial value"},play:async({canvas:a,step:e})=>{await e("it should render the correct initial value",async()=>{const t=a.getByTestId("input");await n(t).toHaveValue("Initial value")}),await e("it should update the value when the user types",async()=>{const t=a.getByTestId("input");await b.type(t," - New controlled value"),n(t).toHaveValue("Initial value - New controlled value")})}},d={args:{icon:x.jsx(ie,{svg:ne,dataset:{testid:"icon"}})},play:async({canvas:a,step:e})=>{await e("it should render the icon",async()=>{const t=a.getByTestId("icon");n(t).toBeInTheDocument()})}},u={args:{description:"Enter your full legal name"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("description");await e("it should render the description",async()=>{n(t).toHaveAccessibleDescription("Enter your full legal name"),n(o).toHaveTextContent("Enter your full legal name")})}},p={args:{required:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("label");await e("it should render correct label",async()=>{n(t).toHaveAccessibleName("Full name"),n(o).toHaveTextContent("Full name")}),await e("it should render required attribute",async()=>{n(t).toHaveAttribute("required")})}},h={args:{hideLabel:!0},play:async({canvas:a,step:e})=>{await e("it should render correct a11y label",async()=>{const t=a.getByTestId("input");n(t).toHaveAccessibleName("Full name")})}},m={args:{error:"This is an error message"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("error");await e("it should render the error message",async()=>{n(t).toHaveAccessibleErrorMessage("This is an error message"),n(o).toHaveTextContent("This is an error message")})}},y={args:{disabled:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the disabled input",async()=>{n(t).toHaveAttribute("disabled")})}},g={args:{readOnly:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the read only input",async()=>{n(t).toHaveAttribute("readonly")})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Full name",placeholder:"John Doe",description:"Enter your full legal name"},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"text"},defaultValue:{control:"text"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":ne},control:"select"},button:{options:["None","With Button"],mapping:{None:void 0,"With Button":x.jsx(le,{svg:se,assistiveText:"Do the thing",onClick:re("field button clicked")})},control:"select"},readOnly:{control:"boolean"},maxLength:{control:"number"},hasError:{table:{disable:!0}}}};var T,f,B,I,H;l.parameters={...l.parameters,docs:{...(T=l.parameters)==null?void 0:T.docs,source:{originalSource:`{
|
2
2
|
play: async ({
|
3
3
|
canvasElement,
|
4
4
|
step,
|
@@ -9,7 +9,7 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
9
9
|
const input = canvas.getByTestId('input');
|
10
10
|
await step('it should render correct label', async () => {
|
11
11
|
const label = within(field).getByTestId('label');
|
12
|
-
expect(label).toHaveTextContent('Full name');
|
12
|
+
expect(label).toHaveTextContent('Full name • Optional');
|
13
13
|
expect(input).toHaveAccessibleName('Full name');
|
14
14
|
});
|
15
15
|
await step('it should call onFocus when the input is focused', async () => {
|
@@ -77,7 +77,7 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
77
77
|
expect(icon).toBeInTheDocument();
|
78
78
|
});
|
79
79
|
}
|
80
|
-
}`,...(S=(W=d.parameters)==null?void 0:W.docs)==null?void 0:S.source}}};var V,
|
80
|
+
}`,...(S=(W=d.parameters)==null?void 0:W.docs)==null?void 0:S.source}}};var V,k,j;u.parameters={...u.parameters,docs:{...(V=u.parameters)==null?void 0:V.docs,source:{originalSource:`{
|
81
81
|
args: {
|
82
82
|
description: 'Enter your full legal name'
|
83
83
|
},
|
@@ -92,7 +92,7 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
92
92
|
expect(description).toHaveTextContent('Enter your full legal name');
|
93
93
|
});
|
94
94
|
}
|
95
|
-
}`,...(
|
95
|
+
}`,...(j=(k=u.parameters)==null?void 0:k.docs)==null?void 0:j.source}}};var q,O,L;p.parameters={...p.parameters,docs:{...(q=p.parameters)==null?void 0:q.docs,source:{originalSource:`{
|
96
96
|
args: {
|
97
97
|
required: true
|
98
98
|
},
|
@@ -104,13 +104,13 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
104
104
|
const label = canvas.getByTestId('label');
|
105
105
|
await step('it should render correct label', async () => {
|
106
106
|
expect(input).toHaveAccessibleName('Full name');
|
107
|
-
expect(label).toHaveTextContent('Full name
|
107
|
+
expect(label).toHaveTextContent('Full name');
|
108
108
|
});
|
109
109
|
await step('it should render required attribute', async () => {
|
110
110
|
expect(input).toHaveAttribute('required');
|
111
111
|
});
|
112
112
|
}
|
113
|
-
}`,...(L=(
|
113
|
+
}`,...(L=(O=p.parameters)==null?void 0:O.docs)==null?void 0:L.source}}};var R,J,M;h.parameters={...h.parameters,docs:{...(R=h.parameters)==null?void 0:R.docs,source:{originalSource:`{
|
114
114
|
args: {
|
115
115
|
hideLabel: true
|
116
116
|
},
|
@@ -129,7 +129,7 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
129
129
|
expect(input).toHaveAccessibleName('Full name');
|
130
130
|
});
|
131
131
|
}
|
132
|
-
}`,...(M=(
|
132
|
+
}`,...(M=(J=h.parameters)==null?void 0:J.docs)==null?void 0:M.source}}};var P,U,K;m.parameters={...m.parameters,docs:{...(P=m.parameters)==null?void 0:P.docs,source:{originalSource:`{
|
133
133
|
args: {
|
134
134
|
error: 'This is an error message'
|
135
135
|
},
|
@@ -250,4 +250,4 @@ import{j as x}from"./jsx-runtime-BYouaCF_.js";import{r as oe}from"./index-B3evPF
|
|
250
250
|
}
|
251
251
|
}
|
252
252
|
}
|
253
|
-
}`,...(ee=(Z=v.parameters)==null?void 0:Z.docs)==null?void 0:ee.source}}};const
|
253
|
+
}`,...(ee=(Z=v.parameters)==null?void 0:Z.docs)==null?void 0:ee.source}}};const je=["Basic","Controlled","WithIcon","WithDescription","Required","WithHiddenLabel","WithErrorMessage","Disabled","ReadOnly","Playground"];export{l as Basic,c as Controlled,y as Disabled,v as Playground,g as ReadOnly,p as Required,u as WithDescription,m as WithErrorMessage,h as WithHiddenLabel,d as WithIcon,je as __namedExportsOrder,ke as default};
|
@@ -1 +1 @@
|
|
1
|
-
import{c as n,d as T}from"./constants-BgBLeZzp.js";import{r as e}from"./index-B3evPFBL.js";import{T as m}from"./useTheme-DiEoTTOi.js";import{j as x}from"./jsx-runtime-BYouaCF_.js";import{f as p}from"./filterAttributesPassedByRadixUIAtRuntime-Bye2JkZ0.js";import{m as _,s as H}from"./classNames-BUL1Zq7e.js";import{i as c,h as f}from"./defaults-B1rzzf6M.js";import{w as i}from"./componentNames-
|
1
|
+
import{c as n,d as T}from"./constants-BgBLeZzp.js";import{r as e}from"./index-B3evPFBL.js";import{T as m}from"./useTheme-DiEoTTOi.js";import{j as x}from"./jsx-runtime-BYouaCF_.js";import{f as p}from"./filterAttributesPassedByRadixUIAtRuntime-Bye2JkZ0.js";import{m as _,s as H}from"./classNames-BUL1Zq7e.js";import{i as c,h as f}from"./defaults-B1rzzf6M.js";import{w as i}from"./componentNames-Ba2ybP0W.js";import{g as u}from"./index-DdzHuZ-Y.js";const P=t=>Array.isArray(t)&&t.length===3&&n.includes(t[T]),R=()=>{const{setTheme:t}=e.useContext(m);return{setTheme:t}},E="TextHighlighted__ehLpO",y={TextHighlighted:E,"TextHighlighted--highlight-blue":"TextHighlighted--highlight-blue__a1Ymf","TextHighlighted--highlight-green":"TextHighlighted--highlight-green__QQm6L","TextHighlighted--highlight-primary":"TextHighlighted--highlight-primary__n35-d","TextHighlighted--highlight-secondary":"TextHighlighted--highlight-secondary__YEj6c","TextHighlighted--highlight-tertiary":"TextHighlighted--highlight-tertiary__uDEFk","TextHighlighted--highlight-accent":"TextHighlighted--highlight-accent__JrA2s","TextHighlighted--highlight-positive":"TextHighlighted--highlight-positive__tfVNZ","TextHighlighted--highlight-info":"TextHighlighted--highlight-info__W1sMI","TextHighlighted--highlight-warning":"TextHighlighted--highlight-warning__dzj54","TextHighlighted--highlight-critical":"TextHighlighted--highlight-critical__V3-1S"},N=e.forwardRef(function({children:h,highlight:g=c,tag:l=f,dataset:s,...r},a){const o=_(y,i.TextHighlighted,[H("highlight",g)]),d={...p(r),ref:a,className:o.join(" "),...u(s,{preplyDsComponent:i.TextHighlighted})};return x.jsx(l,{...d,children:h})});N.__docgenInfo={description:"",methods:[],displayName:"TextHighlighted",props:{highlight:{defaultValue:{value:"'green'",computed:!1},required:!1},tag:{defaultValue:{value:"'span'",computed:!1},required:!1}}};export{N as T,P as i,R as u};
|
package/dist/assets/{TextHighlighted.stories-B89Gaz6o.js → TextHighlighted.stories-BFdf3kg4.js}
RENAMED
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as i}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{f as E}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{m as L,s as w}from"./classNames-BUL1Zq7e.js";import{w as h}from"./componentNames-
|
1
|
+
import{j as i}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{f as E}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{m as L,s as w}from"./classNames-BUL1Zq7e.js";import{w as h}from"./componentNames-Ba2ybP0W.js";import{g as I}from"./index-DdzHuZ-Y.js";import{h as N,i as S}from"./defaults-B1rzzf6M.js";import{T as D}from"./Text-DrH34jFe.js";import{a as O}from"./options-Dn0Ts6qK.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";const q="TextHighlighted__ErxU-",A={TextHighlighted:q,"TextHighlighted--highlight-blue":"TextHighlighted--highlight-blue__3H-tS","TextHighlighted--highlight-green":"TextHighlighted--highlight-green__PXiKm","TextHighlighted--highlight-primary":"TextHighlighted--highlight-primary__cKWhc","TextHighlighted--highlight-secondary":"TextHighlighted--highlight-secondary__24A04","TextHighlighted--highlight-tertiary":"TextHighlighted--highlight-tertiary__gkbLj","TextHighlighted--highlight-accent":"TextHighlighted--highlight-accent__DsZKF","TextHighlighted--highlight-positive":"TextHighlighted--highlight-positive__Tag8x","TextHighlighted--highlight-info":"TextHighlighted--highlight-info__Qqv0l","TextHighlighted--highlight-warning":"TextHighlighted--highlight-warning__--U9g","TextHighlighted--highlight-critical":"TextHighlighted--highlight-critical__D9jbb"},a=j.forwardRef(function({children:T,highlight:x=S,tag:H=N,dataset:f,..._},v){const y=L(A,h.TextHighlighted,[w("highlight",x)]),b={...E(_),ref:v,className:y.join(" "),...I(f,{preplyDsComponent:h.TextHighlighted})};return i.jsx(H,{...b,children:T})});try{a.displayName="TextHighlighted",a.__docgenInfo={description:"",displayName:"TextHighlighted",props:{highlight:{defaultValue:{value:"green"},description:"",name:"highlight",required:!1,type:{name:"enum",value:[{value:'"accent"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"blue"'},{value:'"green"'}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"strong"'},{value:'"span"'},{value:'"em"'}]}},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 Q={title:"components/TextHighlighted",component:a},t=()=>i.jsx(a,{children:"Lorem ipsum"});t.tags=["!test"];t.parameters={chromatic:{disableSnapshot:!0}};const r=()=>i.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"0.25rem",width:"fit-content"},children:O.map(({id:e})=>i.jsx(a,{highlight:e,children:e},e))}),l={parameters:{chromatic:{disableSnapshot:!0}},render:e=>i.jsxs(D,{children:["Lorem ipsum ",i.jsx(a,{...e})]}),args:{children:"dolor sit amet",dataset:{qaid:"text-highlighted"}},argTypes:{dataset:{control:"object"}}};var n,g,s;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:"() => <TextHighlighted>Lorem ipsum</TextHighlighted>",...(s=(g=t.parameters)==null?void 0:g.docs)==null?void 0:s.source}}};var o,d,c;r.parameters={...r.parameters,docs:{...(o=r.parameters)==null?void 0:o.docs,source:{originalSource:`() => <div style={{
|
2
2
|
display: 'flex',
|
3
3
|
flexDirection: 'column',
|
4
4
|
gap: '0.25rem',
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{g as D,a as q}from"./text-accent-DZDDtpIt.js";import{m as p,s as A,b as L}from"./classNames-BUL1Zq7e.js";import{f as V}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as i}from"./componentNames-
|
1
|
+
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{g as D,a as q}from"./text-accent-DZDDtpIt.js";import{m as p,s as A,b as L}from"./classNames-BUL1Zq7e.js";import{f as V}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as i}from"./componentNames-Ba2ybP0W.js";import{g as R}from"./index-DdzHuZ-Y.js";import{h as k,j as M}from"./defaults-B1rzzf6M.js";import{T as S}from"./Text-DrH34jFe.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-centered-CznToR0o.js";const G="TextWeight__tMRbd",P={TextWeight:G,"TextWeight--weight-400":"TextWeight--weight-400__EopTe","TextWeight--weight-500":"TextWeight--weight-500__wlyrw","TextWeight--weight-700":"TextWeight--weight-700__sVSfY","TextWeight--weight-normal":"TextWeight--weight-normal__M5PxM","TextWeight--weight-medium":"TextWeight--weight-medium__8f3CD","TextWeight--weight-bold":"TextWeight--weight-bold__MG-yF"},H="TextWeight",U=e=>p(P,H,[A("weight",e)]),B="TextInline__fMaqi",F={TextInline:B,"TextInline--italic":"TextInline--italic__yG-Qj"},l=j.forwardRef(function({children:g,accent:r,color:h,weight:T=M,italic:x=!1,tag:f=k,dataset:y,..._},w){const b=p(F,i.TextInline,[L("italic",void 0,x)]),s=r?void 0:h,I=D(!s,r),W=q(s),N=U(T),C=[...b,...I,...W,...N],E={...V(_),ref:w,className:C.join(" "),...R(y,{preplyDsComponent:i.TextInline})};return t.jsx(f,{...E,children:g})});try{l.displayName="TextInline",l.__docgenInfo={description:"",displayName:"TextInline",props:{accent:{defaultValue:null,description:"",name:"accent",required:!1,type:{name:"enum",value:[{value:'"accent"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"accentDark"'},{value:'"placeholder"'},{value:'"inverted"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"disabled"'},{value:'"branded"'},{value:'"selected"'},{value:'"error"'}]}},color:{defaultValue:null,description:"@deprecated Use accent instead.",name:"color",required:!1,type:{name:"enum",value:[{value:'"white"'},{value:'"gray-100"'},{value:'"gray-200"'},{value:'"gray-300"'},{value:'"gray-400"'},{value:'"gray-500"'},{value:'"gray-600"'},{value:'"teal-100"'},{value:'"teal-200"'},{value:'"teal-300"'},{value:'"teal-400"'},{value:'"teal-500"'},{value:'"green-100"'},{value:'"green-200"'},{value:'"green-300"'},{value:'"green-400"'},{value:'"green-500"'},{value:'"yellow-100"'},{value:'"yellow-200"'},{value:'"yellow-300"'},{value:'"yellow-400"'},{value:'"yellow-500"'},{value:'"red-100"'},{value:'"red-200"'},{value:'"red-300"'},{value:'"red-400"'},{value:'"red-500"'},{value:'"blue-100"'},{value:'"blue-200"'},{value:'"blue-300"'},{value:'"blue-400"'},{value:'"blue-500"'},{value:'"magenta-100"'},{value:'"magenta-200"'},{value:'"magenta-300"'},{value:'"magenta-400"'},{value:'"magenta-500"'}]}},weight:{defaultValue:{value:"normal"},description:"",name:"weight",required:!1,type:{name:"enum",value:[{value:'"medium"'},{value:'"bold"'},{value:'"400"'},{value:'"500"'},{value:'"700"'},{value:'"normal"'}]}},italic:{defaultValue:{value:"false"},description:"",name:"italic",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"strong"'},{value:'"span"'},{value:'"em"'}]}},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 le={title:"components/TextInline",component:l},a=()=>t.jsxs("p",{children:["Lorem ",t.jsx(l,{children:"ipsum"})]});a.storyName="TextInline";const n={parameters:{chromatic:{disableSnapshot:!0}},render:e=>t.jsxs(S,{children:["Lorem ipsum ",t.jsx(l,{...e})]}),args:{children:"dolor sit amet",accent:"accentDark",tag:"span",dataset:{qaid:"text-inline"}},argTypes:{dataset:{control:"object"},children:{control:"text"},italic:{control:"boolean"},color:{table:{disable:!0}}}};var o,u,c;a.parameters={...a.parameters,docs:{...(o=a.parameters)==null?void 0:o.docs,source:{originalSource:`() => <p>
|
2
2
|
Lorem <TextInline>ipsum</TextInline>
|
3
3
|
</p>`,...(c=(u=a.parameters)==null?void 0:u.docs)==null?void 0:c.source}}};var m,d,v;n.parameters={...n.parameters,docs:{...(m=n.parameters)==null?void 0:m.docs,source:{originalSource:`{
|
4
4
|
parameters: {
|