@preply/ds-docs 4.0.0 → 5.0.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-I1L9KcKN.js → 00.LayoutFlex.stories-D-VczObO.js} +1 -1
- package/dist/assets/{00.applications-DVA0eR_5.js → 00.applications-CzYSGmEf.js} +1 -1
- package/dist/assets/{00.favicons.guide-BA4TBs8A.js → 00.favicons.guide-B-CARcAk.js} +1 -1
- package/dist/assets/00.token-explorer-hV-uX2Ww.js +345 -0
- package/dist/assets/{00.using-responsive-props-DvWa2hX7.js → 00.using-responsive-props-q9jDxHWy.js} +1 -1
- package/dist/assets/{01.semantic-tokens-CMnyPCuB.js → 01.semantic-tokens-phY-TgD0.js} +1 -1
- package/dist/assets/{01.using-shorthand-props-DfgZvMPF.js → 01.using-shorthand-props-CUZbQwLg.js} +1 -1
- package/dist/assets/{10.Combinations.stories-Zk1vUvHN.js → 10.Combinations.stories-BDDl05Hz.js} +1 -1
- package/dist/assets/{10.fonts.guide-4nDXerbt.js → 10.fonts.guide-hytCpjSP.js} +1 -1
- package/dist/assets/{10.ssr-BBOII78K.js → 10.ssr-CXQLuZOI.js} +1 -1
- package/dist/assets/{11.languageFont.explorer.stories-B4Vdpt9q.js → 11.languageFont.explorer.stories-Dkv9M5eT.js} +1 -1
- package/dist/assets/{11.ssr.app-router-v52x2FyK.js → 11.ssr.app-router-bEmxNK6u.js} +1 -1
- package/dist/assets/{20.libraries-BIoBeRPw.js → 20.libraries-Dz7mgu2C.js} +1 -1
- package/dist/assets/30.icons.explorer-oiyfLcQp.js +73 -0
- package/dist/assets/{30.storybook-DhzFfbyl.js → 30.storybook-BGbx9nQ-.js} +1 -1
- package/dist/assets/{40.illustrations.explorer-7gHbzv6D.js → 40.illustrations.explorer-BuiSr8c3.js} +1 -1
- package/dist/assets/{90.advanced-C_nJm0ZM.js → 90.advanced-BoZM3QR8.js} +1 -1
- package/dist/assets/{Accordion-Bi0GzCYO.js → Accordion-CxiCI4Rz.js} +3 -3
- package/dist/assets/{Accordion.stories-AuiZJ4NQ.js → Accordion.stories-D7Cw24sj.js} +1 -1
- package/dist/assets/{Accordion.tests.stories-CFXQ7lMz.js → Accordion.tests.stories-DtE9udvN.js} +1 -1
- package/dist/assets/{AlertDialog.stories-BqN0gz7W.js → AlertDialog.stories-Crl9ra0W.js} +1 -1
- package/dist/assets/Badge-BMWjsGzx.css +1 -0
- package/dist/assets/Badge.stories-CkGzqxM7.js +66 -0
- package/dist/assets/{Box.stories-CpizOdtP.js → Box.stories-Tx-88Owx.js} +1 -1
- package/dist/assets/{BubbleCounter.stories-CPQE-nOi.js → BubbleCounter.stories-DCyCDG7S.js} +1 -1
- package/dist/assets/{Button-DhteO3C6.js → Button-B80XIKcv.js} +1 -1
- package/dist/assets/{Button-DqlzCI4z.css → Button-Cd0upysu.css} +1 -1
- package/dist/assets/{Button.stories-DmzVQ1VL.js → Button.stories-BWsh38ts.js} +1 -1
- package/dist/assets/{ButtonBase-B_gwKVAa.js → ButtonBase-BS1Kc_U5.js} +1 -1
- package/dist/assets/{ButtonBase-HxlpSDVr.css → ButtonBase-Cv8JsBJE.css} +1 -1
- package/dist/assets/{Checkbox-BNGbflsm.js → Checkbox-0Rr3azkZ.js} +2 -2
- package/dist/assets/{Checkbox.stories-C_K-2uYm.js → Checkbox.stories-CklDbW2-.js} +1 -1
- package/dist/assets/{Checkbox.tests.stories-CsxFaHsD.js → Checkbox.tests.stories-dtDQPZYm.js} +1 -1
- package/dist/assets/{Chips.stories-BwZ71-HV.js → Chips.stories-CLRPrNOW.js} +1 -1
- package/dist/assets/Color-YHDXOIA2-CPoUziDM.js +1 -0
- package/dist/assets/CountryFlag-2OfagIL-.js +49 -0
- package/dist/assets/{CountryFlag.stories-UhDU5aPp.js → CountryFlag.stories-B9rUoQXw.js} +1 -1
- package/dist/assets/{CountryFlag.test.stories-kJ9jqJTG.js → CountryFlag.test.stories-C3Hz7_Cq.js} +1 -1
- package/dist/assets/Dialog-5t3Rt4HF.css +1 -0
- package/dist/assets/Dialog.stories-zkSlU40W.js +405 -0
- package/dist/assets/{DismissibleChips-jYvlTjTA.js → DismissibleChips-DbEsCC0J.js} +1 -1
- package/dist/assets/{DismissibleChips.stories-CpdIBN_g.js → DismissibleChips.stories-Bv47ROIC.js} +1 -1
- package/dist/assets/{Divider.stories-Dt8b4I0I.js → Divider.stories-BlFQRFSK.js} +1 -1
- package/dist/assets/{DocsRenderer-CFRXHY34-DHd29E9v.js → DocsRenderer-CFRXHY34-CVrIvO9U.js} +1 -1
- package/dist/assets/{FormControl-D9rxeKMc.js → FormControl-CPKPJ97_.js} +1 -1
- package/dist/assets/{FormControl.stories-Drzur_Xo.js → FormControl.stories-C6dT1HUz.js} +1 -1
- package/dist/assets/{Heading-BLxyLk9f.js → Heading-BKJX3nsJ.js} +2 -2
- package/dist/assets/{Heading.stories-DcyjKmJn.js → Heading.stories-D2N4ywNt.js} +1 -1
- package/dist/assets/{Icon-BkmQyVqb.js → Icon-CkCFpqfD.js} +1 -1
- package/dist/assets/{Icon-RSC-Cwt4AD8I.js → Icon-RSC-DeEnUUcz.js} +1 -1
- package/dist/assets/{Icon.stories-Dh3KvtM-.js → Icon.stories-CexhJHbi.js} +1 -1
- package/dist/assets/{IconButton-CqTm2jIV.js → IconButton-B-3o70a9.js} +1 -1
- package/dist/assets/{Input-UdhYxppR.js → Input-DeHbbC7g.js} +3 -3
- package/dist/assets/{IntegrationWithReactHookForm.stories-C02oiA5w.js → IntegrationWithReactHookForm.stories-DxrZ050E.js} +1 -1
- package/dist/assets/{IntlFormattedCurrency.stories-D09rXQbZ.js → IntlFormattedCurrency.stories-BLxRgJWU.js} +1 -1
- package/dist/assets/{IntlFormattedDateTime.stories-BuOwAp8C.js → IntlFormattedDateTime.stories-hYtatyHE.js} +1 -1
- package/dist/assets/{LayoutFlex-JDgK8BCr.js → LayoutFlex-DvBktCUC.js} +1 -1
- package/dist/assets/{LayoutFlexItem-bGRFvGp6.js → LayoutFlexItem-Cm3OI9f2.js} +1 -1
- package/dist/assets/{LayoutGrid-CGatrPKO.js → LayoutGrid-Dm6EcI-G.js} +1 -1
- package/dist/assets/{LayoutGrid.stories-DyBN7RV8.js → LayoutGrid.stories-CKn4Vg30.js} +1 -1
- package/dist/assets/{LayoutGridItem-BdIUwiuA.js → LayoutGridItem-DWhZMKvq.js} +1 -1
- package/dist/assets/{Link-DdFAEBXD.js → Link-D3ljGEp4.js} +1 -1
- package/dist/assets/{Link.stories-WQCe-o4N.js → Link.stories-DOzq9sNs.js} +1 -1
- package/dist/assets/{Loader.stories-Ceu9fTo6.js → Loader.stories-C53ODmdL.js} +1 -1
- package/dist/assets/{MultiSelectChips-Crsz1TpK.js → MultiSelectChips-RUBRF3C_.js} +2 -2
- package/dist/assets/{MultiSelectChips.stories-D94TLaMf.js → MultiSelectChips.stories-DbfKSXnF.js} +1 -1
- package/dist/assets/{NumberField-BClPzJbf.js → NumberField-B95TvbPY.js} +5 -5
- package/dist/assets/{NumberField.stories-Cl5bAyRn.js → NumberField.stories-CEV8efH2.js} +1 -1
- package/dist/assets/{ObserveIntersection-B2ZY3pJT.js → ObserveIntersection-Ds88YwOI.js} +1 -1
- package/dist/assets/{ObserveIntersection.stories-C8C2l5zu.js → ObserveIntersection.stories-DAfiJTnQ.js} +1 -1
- package/dist/assets/{OnboardingTooltip-Bc-Jj706.js → OnboardingTooltip-C5HCJ0E7.js} +1 -1
- package/dist/assets/{OnboardingTooltip.stories-1_99oJ2j.js → OnboardingTooltip.stories-Cn1uymI0.js} +1 -1
- package/dist/assets/{OnboardingTooltip.tests.stories-CIUh12pG.js → OnboardingTooltip.tests.stories-DLvBh09g.js} +1 -1
- package/dist/assets/{OnboardingTour-BnYumvD2.js → OnboardingTour-Cye6iUC2.js} +1 -1
- package/dist/assets/{OnboardingTour.stories-CaCYuehO.js → OnboardingTour.stories-D_A2LFco.js} +1 -1
- package/dist/assets/{OnboardingTour.tests.stories-C9M7Z4vy.js → OnboardingTour.tests.stories-D0hNfgv6.js} +1 -1
- package/dist/assets/{PasswordField-CFjBYGMS.js → PasswordField-DHlrM2-7.js} +5 -5
- package/dist/assets/{PasswordField.stories-CWrYRKg3.js → PasswordField.stories-BJWCj1u3.js} +1 -1
- package/dist/assets/{PreplyLogo.stories-DbHXRqIe.js → PreplyLogo.stories-dfSPndrY.js} +1 -1
- package/dist/assets/{ProgressBar.stories-Bj7JgZUL.js → ProgressBar.stories-BV6Y9Nyi.js} +1 -1
- package/dist/assets/{ProgressSteps-CwDoZPp7.js → ProgressSteps-DQE6Rlvo.js} +1 -1
- package/dist/assets/{ProgressSteps.stories-Eo_YRUQQ.js → ProgressSteps.stories-BKC2XSoe.js} +1 -1
- package/dist/assets/PromoDialog-BrI3UbB4.js +3 -0
- package/dist/assets/{RangeSlider-CNeCUMy9.js → RangeSlider-BXIcGg3R.js} +1 -1
- package/dist/assets/{RangeSlider.stories-DjAvKpFH.js → RangeSlider.stories-BNeMiH_1.js} +1 -1
- package/dist/assets/RootProvider-D0tv2ED1.js +1 -0
- package/dist/assets/{SelectField-B0-aTIgP.js → SelectField-DOoh2Y5k.js} +8 -8
- package/dist/assets/{SelectField.stories-YbuvDmfl.js → SelectField.stories-BiuvF5Yg.js} +1 -1
- package/dist/assets/{ShowOnIntersection.stories-q8aTxrQs.js → ShowOnIntersection.stories-C4LXhIWf.js} +1 -1
- package/dist/assets/{SingleSelectChips-CAjBrNcu.js → SingleSelectChips-BRlD7T8V.js} +2 -2
- package/dist/assets/{SingleSelectChips.stories-BL3YG_kg.js → SingleSelectChips.stories-dgLjjU24.js} +1 -1
- package/dist/assets/{Slider-CUGM3UNz.js → Slider-eGOchL2V.js} +1 -1
- package/dist/assets/{Slider.stories-B_pnnXYh.js → Slider.stories-C5BY4PbW.js} +1 -1
- package/dist/assets/Steps-hgwULI7z.js +26 -0
- package/dist/assets/Steps-nUB2CDHz.css +1 -0
- package/dist/assets/{Steps.stories-BZsILE5g.js → Steps.stories-DX7zuse4.js} +7 -5
- package/dist/assets/{StorybookGlobalStyle-CQSpwvw3.js → StorybookGlobalStyle-BBqRFe5S.js} +1 -1
- package/dist/assets/{Switch.stories-CAuFyq9X.js → Switch.stories-DU5uZxfg.js} +1 -1
- package/dist/assets/{Text-CjpUlaH0.js → Text-D3i9pJx6.js} +1 -1
- package/dist/assets/{Text.stories-C6McCecj.js → Text.stories-4sHiU0p1.js} +1 -1
- package/dist/assets/{TextField-DqiXpdlZ.js → TextField-BxOrYHxj.js} +5 -5
- package/dist/assets/{TextField-CdxeFYRX.js → TextField-DHg6sqdw.js} +1 -1
- package/dist/assets/{TextField.stories-gNIPEGLY.js → TextField.stories-BsanVpHj.js} +1 -1
- package/dist/assets/{TextHighlighted.stories-CprNxXTt.js → TextHighlighted.stories-DzvaApjE.js} +1 -1
- package/dist/assets/{TextInline.stories-DBDcLVOT.js → TextInline.stories-CcrREeIa.js} +1 -1
- package/dist/assets/{TextareaField-Bi-A9wP4.js → TextareaField-Di3uMtNN.js} +8 -8
- package/dist/assets/{TextareaField.stories-IC9YRmct.js → TextareaField.stories-DFrVVMtN.js} +1 -1
- package/dist/assets/{Toast.stories-Ce2zHmWW.js → Toast.stories-D4rvr5mq.js} +1 -1
- package/dist/assets/TokyoUILock-CUE2UpP8.js +1 -0
- package/dist/assets/{Tooltip-BbMZ4t9q.js → Tooltip--j8DCmLJ.js} +1 -1
- package/dist/assets/{Tooltip.stories-BH7-gDwn.js → Tooltip.stories-mWHRlqv8.js} +1 -1
- package/dist/assets/{Tooltip.tests.stories-YLVx7b98.js → Tooltip.tests.stories-xaUpyGEE.js} +1 -1
- package/dist/assets/axe-KozDj-05.js +30 -0
- package/dist/assets/{breakpoints-BfkEfMbw.js → breakpoints-C1DZdkak.js} +1 -1
- package/dist/assets/{breakpoints-CSOwlhiU.js → breakpoints-CKMjlF3s.js} +1 -1
- package/dist/assets/{breakpoints-2fMSmAVi.js → breakpoints-DXv9ifNm.js} +1 -1
- package/dist/assets/{changelog-D4Z9gpAU.js → changelog-DXlzZtLa.js} +164 -131
- package/dist/assets/{client-C1fTPCwG.js → client-CYxxc9KC.js} +1 -1
- package/dist/assets/{constants-2_-agSe-.js → constants-DVNhGTwE.js} +2 -2
- package/dist/assets/createRequiredContext-DqKkrhDd.js +241 -0
- package/dist/assets/entry-preview-Bj3Y8agB.js +10 -0
- package/dist/assets/{entry-preview-docs-BANZ_DRs.js → entry-preview-docs-BPlzFJFG.js} +2 -2
- package/dist/assets/{floating-ui.react-dom-CHDTbv7n.js → floating-ui.react-dom-B6FmGF3s.js} +1 -1
- package/dist/assets/{getTokenVar-BZgwkSp8.js → getTokenVar-BRt2X5rO.js} +1 -1
- package/dist/assets/{hover-hzsLb0mP.js → hover-COs8KLUI.js} +1 -1
- package/dist/assets/{hover-DNwEbkOR.js → hover-CfJVruTK.js} +1 -1
- package/dist/assets/{hover-CsTVkgV1.js → hover-Cy7Eox3Y.js} +1 -1
- package/dist/assets/{iframe-CWj9OKjo.js → iframe-CQTVRvvH.js} +18 -18
- package/dist/assets/index-BPCsOyHr.js +24 -0
- package/dist/assets/{index-DPGIb77J.js → index-Bch4g0SK.js} +1 -1
- package/dist/assets/index-C5uDgNEj.js +12 -0
- package/dist/assets/index-C6EASpUg.js +1 -0
- package/dist/assets/index-C9ZJlqdI.js +1 -0
- package/dist/assets/index-CA5R8PN9.js +8 -0
- package/dist/assets/{index-Ctq3gFTp.js → index-CY08ZUhp.js} +7 -7
- package/dist/assets/{index-DUXnyn-Y.js → index-CebKVvqm.js} +16 -16
- package/dist/assets/{index-Cxag6636.js → index-D21-dwfw.js} +1 -1
- package/dist/assets/index-DWSmmBvQ.js +12 -0
- package/dist/assets/{index-BPrLDK9Y.js → index-De-a_lfy.js} +1 -1
- package/dist/assets/{index-Y0mVPtHg.js → index-Djnd5IhU.js} +1 -1
- package/dist/assets/index-DrcC8Jul.js +7 -0
- package/dist/assets/{index-fALSPXxe.js → index-ZUOsecCC.js} +1 -1
- package/dist/assets/{intro-DgdQQN2S.js → intro-Cd9_GCdy.js} +1 -1
- package/dist/assets/{message-CToTEy-z.js → message-CSdaKtIj.js} +1 -1
- package/dist/assets/{migrating-from-less-CypRwYq3.js → migrating-from-less-B5ahFv2d.js} +1 -1
- package/dist/assets/playground-WZK9WFDf.css +1 -0
- package/dist/assets/playground.stories-LsAgjZgU.js +857 -0
- package/dist/assets/{preview-BTjEYo28.js → preview-D4qLoCiE.js} +1 -1
- package/dist/assets/preview-DA7QUfdZ.js +2 -0
- package/dist/assets/{preview-B3PTUHS7.js → preview-DPj7IDPD.js} +1 -1
- package/dist/assets/{preview-4uuOvD3n.js → preview-Rh2RpxtQ.js} +2 -2
- package/dist/assets/{preview-DnWcdrEZ.js → preview-qRpPiuhm.js} +2 -2
- package/dist/assets/{react-18-DfUnyR7e.js → react-18-vqCHxTgY.js} +1 -1
- package/dist/assets/{shared-strings-Bg7tW4tm.js → shared-strings-DFzxd8lM.js} +1 -1
- package/dist/assets/styled-components.browser.esm-BJAH3Qnc.js +2 -0
- package/dist/assets/{tokens-D0M6e07K.js → tokens-1GbBeOTN.js} +1 -1
- package/dist/assets/tokens-BoC65r7p.js +1 -0
- package/dist/assets/{tokens-D7bwo39d.js → tokens-CSYR8_6W.js} +1 -1
- package/dist/assets/{tokens-DbuzM4u9.js → tokens-DboIZ2E4.js} +1 -1
- package/dist/assets/{useIntlFormattedAggregatedDateTime-Zx_bxtfa.js → useIntlFormattedAggregatedDateTime-CTOxZyaF.js} +1 -1
- package/dist/assets/{useIntlFormattedCurrency-DbgTU34E.js → useIntlFormattedCurrency-CKTbRfXd.js} +1 -1
- package/dist/assets/{useIntlFormattedTime-ulNPTGyu.js → useIntlFormattedTime-D6quNZKT.js} +1 -1
- package/dist/assets/{usePortalElement-D8WArtaz.js → usePortalElement-BK-0FBHw.js} +1 -1
- package/dist/assets/{welcome-Cf7_knMk.js → welcome-B7wFifhG.js} +1 -1
- package/dist/assets/{zeroheight-BvaCHUX_.js → zeroheight-C2QkqLMf.js} +1 -1
- package/dist/iframe.html +1 -1
- package/dist/index.json +1 -1
- package/dist/preview-stats.json +3343 -3073
- package/dist/project.json +1 -1
- package/package.json +4 -4
- package/dist/assets/00.token-explorer-KIhVhPp7.js +0 -344
- package/dist/assets/30.icons.explorer-C3PdGI__.js +0 -73
- package/dist/assets/Badge-DXnHyVME.css +0 -1
- package/dist/assets/Badge.stories-Bk1jXWtz.js +0 -65
- package/dist/assets/Color-YHDXOIA2-BhKKyrEM.js +0 -1
- package/dist/assets/CountryFlag-BYnc9DA7.js +0 -49
- package/dist/assets/Dialog-B2G1UrP1.css +0 -1
- package/dist/assets/Dialog.stories-CI7zov84.js +0 -515
- package/dist/assets/RootProvider-CWDV9QnL.js +0 -1
- package/dist/assets/Steps-B_rpKUTa.css +0 -1
- package/dist/assets/Steps-IgJnFF2g.js +0 -26
- package/dist/assets/TokyoUILock-CENLMUf4.js +0 -1
- package/dist/assets/axe-mzYAM-sz.js +0 -30
- package/dist/assets/createRequiredContext-9__lNQrK.js +0 -241
- package/dist/assets/entry-preview-DFXqIYZm.js +0 -10
- package/dist/assets/index-BSV-0FpC.js +0 -1
- package/dist/assets/index-BnjE-6lp.js +0 -12
- package/dist/assets/index-C7hTFOIV.js +0 -24
- package/dist/assets/index-CXQShRbs.js +0 -8
- package/dist/assets/index-Cu4lwwaE.js +0 -1
- package/dist/assets/index-DhCCT3uz.js +0 -12
- package/dist/assets/index-p7qngmDT.js +0 -7
- package/dist/assets/playground-Dg8A_Ftj.css +0 -1
- package/dist/assets/playground.stories-C9cW4jxN.js +0 -857
- package/dist/assets/preview-BLkg3UNz.js +0 -2
- package/dist/assets/styled-components.browser.esm-BgpGX317.js +0 -2
- package/dist/assets/tokens-Xet-VKqC.js +0 -1
- /package/dist/assets/{Button-DwGJHj7Y.js → Button-CpB2zJ_2.js} +0 -0
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as i}from"./index-Cb9e4tly.js";import{B as y}from"./Button-B80XIKcv.js";import"./index-DWSmmBvQ.js";import{H as _}from"./Heading-BKJX3nsJ.js";import{P as I}from"./ProgressSteps-DQE6Rlvo.js";import{T as M}from"./Text-D3i9pJx6.js";import{g as V}from"./index-DdzHuZ-Y.js";import{w as E}from"./componentNames-NXEPEzbR.js";import{M as b}from"./message-CSdaKtIj.js";const q="steps__6mN2m",A="header__hCorO",v={steps:q,header:A},N=i.createContext(void 0),T=()=>{const n=i.useContext(N);if(n===void 0)throw new Error("Steps navigation components must be used within a Steps component");return n||{}},B=i.forwardRef(function({onClick:t,disabled:p,variant:a="ghost",...u},d){const{goToPreviousStep:s,currentStep:l,isNavigating:c,contentId:m}=T();return e.jsx(y,{...u,ref:d,size:"medium",variant:a,onClick:r=>{t==null||t(r),!r.defaultPrevented&&s()},disabled:l===1||c||p,"aria-controls":m,children:u.children||e.jsx(b,{id:"preply-ds.steps.previous",defaultMessage:"Previous",description:"Button used to navigate to the previous step"})})}),O=i.forwardRef(function({onClick:t,disabled:p,variant:a="primary",...u},d){const{goToNextStep:s,currentStep:l,totalSteps:c,isNavigating:m,contentId:r}=T();return e.jsx(y,{...u,ref:d,size:"medium",variant:a,onClick:S=>{t==null||t(S),!S.defaultPrevented&&s()},disabled:l===c||m||p,"aria-controls":r,children:u.children||e.jsx(b,{id:"preply-ds.steps.next",defaultMessage:"Next",description:"Button used to navigate to the next step"})})}),z=({children:n,"aria-label":t,initialStep:p=1,onStepChange:a,dataset:u})=>{const d=i.useId(),[s,l]=i.useState(p),[c,m]=i.useState(!1),r=[],S=[];n==null||n.forEach(o=>{i.isValidElement(o)&&o.type===P?r.push(o):S.push(o)});const g=r.length,w=V(u,{preplyDsComponent:E.Steps}),h=async o=>{const f=Math.min(Math.max(o,1),g);if(!a){l(f);return}m(!0);try{const C=await a(s,f);l(C??f)}finally{m(!1)}},j={goToPreviousStep:()=>h(s-1),goToNextStep:()=>h(s+1),goToStep:o=>h(o),currentStep:s,totalSteps:g,isNavigating:c,contentId:d};return e.jsxs("div",{...w,className:v.steps,id:d,"aria-live":"polite","aria-busy":c,children:[e.jsx(I,{currentStep:s,totalSteps:g,"aria-label":t}),e.jsx("div",{className:v.content,children:e.jsxs(N.Provider,{value:j,children:[r[s-1],S]})})]})},P=({title:n,description:t,children:p,hideHeader:a})=>e.jsxs(e.Fragment,{children:[e.jsxs("hgroup",{className:v.header,hidden:a,children:[e.jsx(_,{tag:"h3",variant:{_:"medium","medium-l":"large"},children:n}),t&&e.jsx(M,{variant:"default-regular",accent:"secondary",children:t})]}),p]}),x=Object.assign(z,{Step:P,Previous:B,Next:O});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
|
+
@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
|
+
|
|
4
|
+
This is triggered either by using the \`Steps.Previous\` and \`Steps.Next\`
|
|
5
|
+
components, or by calling \`goToPreviousStep\`, \`goToNextStep\`, or
|
|
6
|
+
\`goToStep\` from the \`StepsContext\`.
|
|
7
|
+
|
|
8
|
+
Can be used to:
|
|
9
|
+
- Skip/redirect steps conditionally
|
|
10
|
+
- Perform async process (e.g. validation) on step changes, marking the
|
|
11
|
+
element as busy/loading
|
|
12
|
+
@param currentStep The current step (1-based)
|
|
13
|
+
@param nextStep The next, incoming step
|
|
14
|
+
@returns Promise that resolves to:
|
|
15
|
+
- \`undefined\`: proceed with default navigation
|
|
16
|
+
- \`number\`: override the destination step
|
|
17
|
+
@example Add async validation
|
|
18
|
+
const handleStepChange = async (current, next) => {
|
|
19
|
+
await validateStep(current);
|
|
20
|
+
return next;
|
|
21
|
+
};
|
|
22
|
+
@example Skip a step
|
|
23
|
+
const handleStepChange = async (current, next) => {
|
|
24
|
+
if (next === 2) return 3; // Skip step 2
|
|
25
|
+
return next;
|
|
26
|
+
};`,name:"onStepChange",required:!1,type:{name:"enum",value:[{value:"(currentStep: number, nextStep: number) => number | Promise<number | undefined> | undefined"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}export{x as S,T as u};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.steps__6mN2m{display:flex;flex-direction:column;gap:var(--558c4c)}.steps__6mN2m[aria-busy=true]{cursor:wait}@media (min-width: 880px){.steps__6mN2m{gap:var(--b53873)}}.header__hCorO{display:flex;flex-direction:column;gap:var(--590b8d);margin-top:var(--590b8d);margin-bottom:var(--b53873)}.header__hCorO[hidden]{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}@media (min-width: 880px){.header__hCorO{gap:var(--66b80b);margin-top:var(--66b80b);margin-bottom:var(--1e685c)}}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as G}from"./index-Cb9e4tly.js";import{e as r,u as a,a as
|
|
1
|
+
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as G}from"./index-Cb9e4tly.js";import{e as r,u as a,a as n}from"./index-CY08ZUhp.js";import{S as t,u as X}from"./Steps-hgwULI7z.js";import{L as h}from"./LayoutFlex-DvBktCUC.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./Button-B80XIKcv.js";import"./render-icon-BT0Aq7PA.js";import"./ButtonBase-BS1Kc_U5.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-BcQ2TyFf.js";import"./classNames-BUL1Zq7e.js";import"./defaults-hwJNw1bK.js";import"./useMergeRefs-SFH7Mw4x.js";import"./useHostname-Y3PlXofY.js";import"./index-DdzHuZ-Y.js";import"./index-CC6DAVyL.js";import"./componentNames-NXEPEzbR.js";import"./index-DWSmmBvQ.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./Heading-BKJX3nsJ.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";import"./ProgressSteps-DQE6Rlvo.js";import"./Text-D3i9pJx6.js";import"./message-CSdaKtIj.js";import"./layout-relative.module-f40KabMD.js";const Ce={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 n(()=>{r(s.getByText("Step 2")).toBeVisible()}),await a.click(s.getByText("Previous")),await n(()=>{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
|
-
Navigation controls are disabled during transitions, with a cursor loading indicator.`}}},render:()=>{const s=async(p,
|
|
3
|
+
Navigation controls are disabled during transitions, with a cursor loading indicator.`}}},render:()=>{const s=async(p,o)=>(await new Promise(g=>setTimeout(g,1e3)),o);return e.jsxs(t,{onStepChange:s,dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Navigation has a 1s delay",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Each navigation has async validation",children:i}),e.jsx(t.Step,{title:"Step 3",description:"Buttons are disabled during validation",children:i}),e.jsx(t.Step,{title:"Step 4",description:"Final step",children:i}),e.jsxs("div",{style:{display:"flex",justifyContent:"space-between"},children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},play:async({canvas:s})=>{const p=s.getByTestId("steps");r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText("Next")),await n(async()=>{await r(p).toContainHTML('aria-busy="true"')}),await n(()=>{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,o)=>o===3?p<3?4:2:o;return e.jsxs(t,{onStepChange:s,dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Next goes to step 2",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Step 3 will always be skipped",children:i}),e.jsx(t.Step,{title:"Step 3",description:"This step is not accessible",children:i}),e.jsx(t.Step,{title:"Step 4",description:"Previous goes to step 2",children:i}),e.jsxs(h,{justifyContent:"space-between",children:[e.jsx(t.Previous,{}),e.jsx(t.Next,{})]})]})},play:async({canvas:s})=>{r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText("Next")),await n(()=>{r(s.getByText("Step 2")).toBeVisible()}),await a.click(s.getByText("Next")),await n(()=>{r(s.getByText("Step 4")).toBeVisible()}),await a.click(s.getByText("Previous")),await n(()=>{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:o,totalSteps:g,isNavigating:v}=X();return G.useEffect(()=>{const w=O=>{if(!v)switch(O.key){case"ArrowLeft":s();break;case"ArrowRight":p();break;case"1":o(1);break;case"2":o(2);break;case"3":o(3);break}};return window.addEventListener("keydown",w),()=>window.removeEventListener("keydown",w)},[s,p,o,g,v]),e.jsxs("div",{style:{padding:"16px",backgroundColor:"#f5f5f5",borderRadius:"4px"},children:[e.jsxs("p",{children:[e.jsx("strong",{children:"Keyboard Navigation:"})," Click here to focus, then use:"]}),e.jsxs("ul",{children:[e.jsxs("li",{children:[e.jsx("kbd",{children:"←"})," Previous step"]}),e.jsxs("li",{children:[e.jsx("kbd",{children:"→"})," Next step"]}),e.jsxs("li",{children:[e.jsx("kbd",{children:"1"})," - ",e.jsx("kbd",{children:"3"})," Jump to step"]})]})]})},m={parameters:{docs:{description:{story:`This example demonstrates controlled navigation using the Steps context.
|
|
4
4
|
|
|
5
|
-
The component listens for keyboard events and uses the context functions to navigate between steps.`}}},render:()=>e.jsxs(t,{dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Use arrow keys or number keys to navigate",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Press ← or → to navigate between steps",children:i}),e.jsx(t.Step,{title:"Step 3",description:"Press 1, 2, or 3 to jump to a specific step",children:i}),e.jsx(Y,{})]}),play:async({canvas:s})=>{r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText(/Keyboard Navigation:/)),await a.keyboard("{ArrowRight}"),await
|
|
5
|
+
The component listens for keyboard events and uses the context functions to navigate between steps.`}}},render:()=>e.jsxs(t,{dataset:{testid:"steps"},"aria-label":"Story Steps",children:[e.jsx(t.Step,{title:"Step 1",description:"Use arrow keys or number keys to navigate",children:i}),e.jsx(t.Step,{title:"Step 2",description:"Press ← or → to navigate between steps",children:i}),e.jsx(t.Step,{title:"Step 3",description:"Press 1, 2, or 3 to jump to a specific step",children:i}),e.jsx(Y,{})]}),play:async({canvas:s})=>{r(s.getByText("Step 1")).toBeVisible(),await a.click(s.getByText(/Keyboard Navigation:/)),await a.keyboard("{ArrowRight}"),await n(()=>{r(s.getByText("Step 2")).toBeVisible()}),await a.keyboard("{ArrowLeft}"),await n(()=>{r(s.getByText("Step 1")).toBeVisible()}),await a.keyboard("3"),await n(()=>{r(s.getByText("Step 3")).toBeVisible()})}};var b,j,B;c.parameters={...c.parameters,docs:{...(b=c.parameters)==null?void 0:b.docs,source:{originalSource:`{
|
|
6
6
|
parameters: {
|
|
7
7
|
docs: {
|
|
8
8
|
description: {
|
|
@@ -148,7 +148,9 @@ Navigation controls are disabled during transitions, with a cursor loading indic
|
|
|
148
148
|
const steps = canvas.getByTestId('steps');
|
|
149
149
|
expect(canvas.getByText('Step 1')).toBeVisible();
|
|
150
150
|
await userEvent.click(canvas.getByText('Next'));
|
|
151
|
-
|
|
151
|
+
await waitFor(async () => {
|
|
152
|
+
await expect(steps).toContainHTML('aria-busy="true"');
|
|
153
|
+
});
|
|
152
154
|
await waitFor(() => {
|
|
153
155
|
expect(steps).toContainHTML('aria-busy="false"');
|
|
154
156
|
expect(canvas.getByText('Step 2')).toBeVisible();
|
|
@@ -303,4 +305,4 @@ The component listens for keyboard events and uses the context functions to navi
|
|
|
303
305
|
expect(canvas.getByText('Step 3')).toBeVisible();
|
|
304
306
|
});
|
|
305
307
|
}
|
|
306
|
-
}`,...(_=(U=m.parameters)==null?void 0:U.docs)==null?void 0:_.source}}};const
|
|
308
|
+
}`,...(_=(U=m.parameters)==null?void 0:U.docs)==null?void 0:_.source}}};const Te=["WithHeadersAndControls","WithHiddenHeaders","WithCustomInitialStep","WithConstantControls","WithAsyncNavigation","WithNonLinearFlow","WithVaryingControls","WithCustomControls"];export{u as WithAsyncNavigation,S as WithConstantControls,m as WithCustomControls,l as WithCustomInitialStep,c as WithHeadersAndControls,d as WithHiddenHeaders,y as WithNonLinearFlow,x as WithVaryingControls,Te as __namedExportsOrder,Ce as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as c,e as v}from"./index-Cb9e4tly.js";import{f as k}from"./styled-components.browser.esm-
|
|
1
|
+
import{r as c,e as v}from"./index-Cb9e4tly.js";import{f as k}from"./styled-components.browser.esm-BJAH3Qnc.js";class b{constructor(e,t){this.features=e,this.error=t}getError(){return this.error}getFeature(e,t){if(this.features)return this.features.find(s=>s.project===e&&s.name===t)}}class f{constructor(e,t){this.icons=e,this.error=t}getError(){return this.error}searchIcons(e){if(!this.icons)return[];const t=e.terms?e.terms.toLowerCase():"";return this.icons.filter(s=>{var r;return s.name.toLowerCase().match(t)||((r=s.description)===null||r===void 0?void 0:r.toLowerCase().match(t))})}static getIconPath(e){return`${e.path}/${e.source}`}}const M="/assets",_=/(.*):(.*)/,w=n=>n.replace(/^\.\//,"");class j{constructor(e,t){this.projects=e,this.error=t}parseModule(e){const t=e.match(_),s=t&&this.getProject(t[1])||void 0,r=w(t&&t[2]||e);return{project:s,path:r}}getError(){return this.error}getProject(e,t){var s;if(this.projects)return(s=this.projects)===null||s===void 0?void 0:s.find(r=>r.name===e&&(!t||r.type===t))}getModuleUrl(e,t){const{project:s,path:r}=this.parseModule(e.module),o=s||this.getProject(t);if(o)return`${o.repo}/tree/master/${o.path}/${r}`}getAssetBasePath(e){if(!this.projects)return;const t=this.getProject(e.name);return t&&`${M}/${t.name}`}}class B{constructor(e){this.stacks=e}getStackLabel(e){const t=this.stacks.find(s=>s.key===e);return t?t.label:e}}const $=(n,e)=>n.module>e.module?1:-1;function g(n,e){const t={};return n.forEach(s=>{t[e(s)]=s}),Object.values(t)}function y(n){const e=n.reduce((t,s)=>(t[s.app]=t[s.app]||[],t[s.app].push(s),t),{});return Object.keys(e).forEach(t=>{e[t]=e[t].sort($)}),e}class x{constructor(e,t){this.usedByMap=e,this.error=t}all(){return Object.values(this.usedByMap||{}).flatMap(e=>e)}getError(){return this.error}findUses(e){return this.usedByMap?this.usedByMap[`${e.project}:${e.name}`]||[]:[]}findUsesGroupedByApp(e){const t=this.findUses(e);return y(t)}allUsesByFeature(){return this.usedByMap||{}}allUses(){return this.all()}allModules(){return g(this.all(),e=>e.module)}modulesByApp(){const e=y(this.all());return Object.keys(e).forEach(t=>{e[t]=g(e[t],s=>s.module)}),e}}class S{constructor(e,t){this.validations=e,this.error=t}all(){return[...this.validations||[]]}getError(){return this.error}allValidations(){return this.all()}getExperimentalComponentValidation(e){var t;return(t=this.validations)===null||t===void 0?void 0:t.find(s=>s.type==="component"&&s.subject[0]===e&&s.template==="experimental")}getDeprecatedComponentValidation(e){var t;return(t=this.validations)===null||t===void 0?void 0:t.find(s=>s.type==="component"&&s.subject[0]===e&&(!s.template||s.template==="deprecated"))}getDeprecatedPropValidation(e,t){var s;return(s=this.validations)===null||s===void 0?void 0:s.find(r=>r.type==="prop"&&r.subject[0]===e&&r.subject[1]===t&&(!r.template||r.template==="deprecated"))}getExperimentalPropValidation(e,t){var s;return(s=this.validations)===null||s===void 0?void 0:s.find(r=>r.type==="prop"&&r.subject[0]===e&&r.subject[1]===t&&r.template==="experimental")}getMandatoryPropValidation(e,t){var s;return(s=this.validations)===null||s===void 0?void 0:s.find(r=>r.type==="prop"&&r.subject[0]===e&&r.subject[1]===t&&r.template==="mandatory")}getExperimentalPropOptionValidation(e,t,s){var r;return(r=this.validations)===null||r===void 0?void 0:r.find(o=>o.type==="option"&&o.subject[0]===e&&o.subject[1]===t&&o.subject[2]===s&&o.template==="experimental")}getDeprecatedPropOptionValidation(e,t,s){var r;return(r=this.validations)===null||r===void 0?void 0:r.find(o=>o.type==="option"&&o.subject[0]===e&&o.subject[1]===t&&o.subject[2]===s&&(!o.template||o.template==="deprecated"))}getExperimentalTokenValidation(e){var t;return(t=this.validations)===null||t===void 0?void 0:t.find(s=>s.type==="token"&&s.subject[0]===e&&s.template==="experimental")}getDeprecatedTokenValidation(e){var t;return(t=this.validations)===null||t===void 0?void 0:t.find(s=>s.type==="token"&&s.subject[0]===e&&(!s.template||s.template==="deprecated"))}}const V=[{key:"react",label:"React"},{key:"react-sc",label:"React + Styled Components"},{key:"react-less",label:"React + CSS Modules (Less)"},{key:"react-native",label:"React + CSS Modules (Less)"}],d="global/docs/static/data",C=c.createContext({}),u=n=>fetch(n).then(e=>e.json()),I=({children:n})=>{const[e,t]=c.useState(void 0),[s,r]=c.useState(void 0),[o,p]=c.useState(void 0),[i,l]=c.useState(void 0),[E,h]=c.useState(void 0),[P,m]=c.useState(void 0);return c.useEffect(()=>{t(new B(V)),u(`${d}/projects.json`).then(a=>r(new j(a))).catch(a=>r(new j(void 0,a))),u(`${d}/features.json`).then(a=>p(new b(a))).catch(a=>p(new b(void 0,a))),u(`${d}/used-by.json`).then(a=>l(new x(a))).catch(a=>l(new x(void 0,a))),u(`${d}/validations.json`).then(a=>h(new S(a))).catch(a=>h(new S(void 0,a))),u(`${d}/icons.json`).then(a=>m(new f(a))).catch(a=>m(new f(void 0,a)))},[]),v.createElement(C.Provider,{value:{projects:s,features:o,usedBy:i,validations:E,stacks:e,icons:P}},n)};I.__docgenInfo={description:"",methods:[],displayName:"DocMetadataProvider"};const U=()=>c.useContext(C),A=c.createContext({terms:"",results:[],setSearchTerms:()=>null}),D=({children:n})=>{const{icons:e}=U(),[t,s]=c.useState(""),[r,o]=c.useState([]),p=c.useCallback(i=>s(i),[s]);return c.useEffect(()=>{if(e){const i=e.searchIcons({terms:t});o(i)}},[e,t]),v.createElement(A.Provider,{value:{terms:t,results:r,setSearchTerms:p}},n)};D.__docgenInfo={description:"",methods:[],displayName:"IconSearchProvider"};const R=k`
|
|
2
2
|
@import url('https://static.preply.com/ds/global.css');
|
|
3
3
|
|
|
4
4
|
* {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-BTJTZTIL.js";import{r as Q}from"./index-Cb9e4tly.js";import{f as V,w as m,u as s,e as t}from"./index-
|
|
1
|
+
import{j as o}from"./jsx-runtime-BTJTZTIL.js";import{r as Q}from"./index-Cb9e4tly.js";import{f as V,w as m,u as s,e as t}from"./index-CY08ZUhp.js";import{a as X}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{S as r}from"./Switch-I-qQamnV.js";import{L as w}from"./LayoutFlex-DvBktCUC.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./index-DdzHuZ-Y.js";import"./componentNames-NXEPEzbR.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./layout-relative.module-f40KabMD.js";import"./classNames-BUL1Zq7e.js";import"./defaults-hwJNw1bK.js";const pe={title:"Components/Switch",component:r,args:{onCheckedChange:V(X("checked")),"aria-label":"Switch"},parameters:{layout:"padded"}},p={async play({args:c,canvasElement:a,step:n}){const e=m(a).getByRole("switch");await n("Switch on via click",async()=>{await s.click(e),t(c.onCheckedChange).toHaveBeenNthCalledWith(1,!0),t(e).toHaveAttribute("aria-checked","true")}),await n("Switch off via click",async()=>{await s.click(e),t(c.onCheckedChange).toHaveBeenNthCalledWith(2,!1),t(e).toHaveAttribute("aria-checked","false")}),await n("Switch on via Enter key",async()=>{e.focus(),t(e).toHaveFocus(),await s.keyboard("[Enter]"),t(c.onCheckedChange).toHaveBeenNthCalledWith(3,!0),t(e).toHaveAttribute("aria-checked","true")}),await n("Switch off via Enter key",async()=>{e.focus(),t(e).toHaveFocus(),await s.keyboard("[Enter]"),t(c.onCheckedChange).toHaveBeenNthCalledWith(4,!1),t(e).toHaveAttribute("aria-checked","false")}),await n("Switch on via Space key",async()=>{e.focus(),t(e).toHaveFocus(),await s.keyboard("[Space]"),t(c.onCheckedChange).toHaveBeenNthCalledWith(5,!0),t(e).toHaveAttribute("aria-checked","true")}),await n("Switch off via Space key",async()=>{e.focus(),t(e).toHaveFocus(),await s.keyboard("[Space]"),t(c.onCheckedChange).toHaveBeenNthCalledWith(6,!1),t(e).toHaveAttribute("aria-checked","false")})}},d={render:function(a){return o.jsxs(w,{gap:"12",children:[o.jsx(r,{...a}),o.jsx(r,{...a,defaultChecked:!0}),o.jsx(r,{...a,defaultChecked:!1})]})}},u={render:function(a){const n=({checked:i,...e})=>{const[J,K]=Q.useState(i);return o.jsx(r,{...e,checked:J,onCheckedChange:K})};return o.jsxs(w,{gap:"12",children:[o.jsx(n,{...a}),o.jsx(n,{...a,checked:!0}),o.jsx(n,{...a,checked:!1})]})}},h={args:{checked:!1},async play({canvasElement:c,step:a}){const i=m(c).getByRole("switch");await a("switch does not change state",async()=>{await s.click(i),t(i).toHaveAttribute("aria-checked","false")})}},v={args:{disabled:!0},render:function(a){return o.jsxs(w,{gap:"12",children:[o.jsx(r,{...a,disabled:!0}),o.jsx(r,{...a,defaultChecked:!0,disabled:!0})]})},async play({args:c,canvasElement:a,step:n}){const e=m(a).getAllByRole("switch")[0];await n("switch cannot be focused",()=>{e.focus(),t(e).not.toHaveFocus()}),await n("switch cannot be checked",async()=>{await s.click(e),t(c.onCheckedChange).not.toHaveBeenCalled(),t(e).toHaveAttribute("aria-checked","false")})}},l={parameters:{chromatic:{modes:{TouchDevice:{hasTouch:!0}}}}},k={tags:["!autodocs"],async play({canvasElement:c}){const n=m(c).getByRole("switch");n.focus(),t(n).toHaveFocus()}};var y,b,f;p.parameters={...p.parameters,docs:{...(y=p.parameters)==null?void 0:y.docs,source:{originalSource:`{
|
|
2
2
|
async play({
|
|
3
3
|
args,
|
|
4
4
|
canvasElement,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as A}from"./jsx-runtime-BTJTZTIL.js";import{r as z}from"./index-Cb9e4tly.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-NXEPEzbR.js";import{g as C}from"./index-DdzHuZ-Y.js";import{T as G,a as F}from"./defaults-hwJNw1bK.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:'"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"'},{value:'"xs-medium"'},{value:'"s"'},{value:'"s-italic"'},{value:'"s-medium"'},{value:'"s-medium-italic"'},{value:'"s-bold"'},{value:'"s-bold-italic"'},{value:'"m"'},{value:'"m-italic"'},{value:'"m-medium"'},{value:'"m-medium-italic"'},{value:'"m-bold"'},{value:'"m-bold-italic"'},{value:'"l"'},{value:'"l-italic"'},{value:'"l-medium"'},{value:'"l-medium-italic"'},{value:'"xl"'},{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-BTJTZTIL.js";import{r as z}from"./index-Cb9e4tly.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-NXEPEzbR.js";import{g as C}from"./index-DdzHuZ-Y.js";import{T as G,a as F}from"./defaults-hwJNw1bK.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:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"critical"'},{value:'"inverted"'},{value:'"disabled"'},{value:'"selected"'},{value:'"accent"'},{value:'"accentDark"'},{value:'"placeholder"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"branded"'},{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:'"div"'},{value:'"p"'},{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-BTJTZTIL.js";import{T as i}from"./Text-
|
|
1
|
+
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{T as i}from"./Text-D3i9pJx6.js";import{S as c}from"./consts-KAYct7Gj.js";import{T as f}from"./options-DiZKU5qS.js";import{g as S}from"./getTokenVar-DU_DEzTd.js";import{c as k}from"./tokens-BoC65r7p.js";import"./index-ChsGqxH_.js";import"./index-Cb9e4tly.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./text-centered-CznToR0o.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-NXEPEzbR.js";import"./index-DdzHuZ-Y.js";import"./defaults-hwJNw1bK.js";import"./constants-BgBLeZzp.js";const D={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(({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{F as b}from"./FormControl-
|
|
2
|
-
If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>"}]}},
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as h}from"./index-Cb9e4tly.js";import{F as b}from"./FormControl-CPKPJ97_.js";import{w as q}from"./componentNames-NXEPEzbR.js";import{I as g}from"./Input-DeHbbC7g.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:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:`The id to be passed to the input element.
|
|
2
|
+
If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
|
|
3
|
+
indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
|
|
4
|
+
to provide more context or instructions to the user.`,name:"description",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
|
|
5
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"}]}},
|
|
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"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},type:{defaultValue:{value:"text"},description:"",name:"type",required:!1,type:{name:"enum",value:[{value:'"url"'},{value:'"search"'},{value:'"text"'},{value:'"tel"'},{value:'"email"'}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"url"'},{value:'"name"'},{value:'"off"'},{value:'"on"'},{value:'"tel"'},{value:'"email"'},{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 +1 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as j}from"./index-Cb9e4tly.js";import{S as F}from"./index-BlMeVLsf.js";import"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-BTJTZTIL.js";import{r as j}from"./index-Cb9e4tly.js";import{S as F}from"./index-BlMeVLsf.js";import"./index-DWSmmBvQ.js";import{g as b}from"./index-DdzHuZ-Y.js";import{w as I}from"./componentNames-NXEPEzbR.js";import{M as N}from"./message-CSdaKtIj.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};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as x}from"./jsx-runtime-BTJTZTIL.js";import{r as oe}from"./index-Cb9e4tly.js";import{a as re}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{T as te}from"./TextField-
|
|
1
|
+
import{j as x}from"./jsx-runtime-BTJTZTIL.js";import{r as oe}from"./index-Cb9e4tly.js";import{a as re}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{T as te}from"./TextField-BxOrYHxj.js";import{F as ne}from"./TokyoUIUser-Cvenl_VS.js";import{F as se}from"./TokyoUIAttach-BWl7Jkq1.js";import{I as ie}from"./Icon-CkCFpqfD.js";import{F as le}from"./FieldButton-ChB_zwFu.js";import{f as r,w,e as n,u as b}from"./index-CY08ZUhp.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./FormControl-CPKPJ97_.js";import"./index-BlMeVLsf.js";import"./index-DWSmmBvQ.js";import"./tslib.es6-C7pnyCjR.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./index-DdzHuZ-Y.js";import"./message-CSdaKtIj.js";import"./componentNames-NXEPEzbR.js";import"./Input-DeHbbC7g.js";import"./InputContainer-B1hqJyx0.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-BT0Aq7PA.js";import"./defaults-hwJNw1bK.js";const je={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")})}},m={args:{hideLabel:!0},play:async({canvas:a,step:e})=>{await e("it should render correct a11y label",async()=>{const t=a.getByTestId("input");n(t).toHaveAccessibleName("Full name")})}},h={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,
|
package/dist/assets/{TextHighlighted.stories-CprNxXTt.js → TextHighlighted.stories-DzvaApjE.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as i}from"./jsx-runtime-BTJTZTIL.js";import{r as j}from"./index-Cb9e4tly.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-NXEPEzbR.js";import{g as I}from"./index-DdzHuZ-Y.js";import{h as N,i as S}from"./defaults-hwJNw1bK.js";import{T as D}from"./Text-
|
|
1
|
+
import{j as i}from"./jsx-runtime-BTJTZTIL.js";import{r as j}from"./index-Cb9e4tly.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-NXEPEzbR.js";import{g as I}from"./index-DdzHuZ-Y.js";import{h as N,i as S}from"./defaults-hwJNw1bK.js";import{T as D}from"./Text-D3i9pJx6.js";import{a as O}from"./options-DiZKU5qS.js";import"./index-ChsGqxH_.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:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"critical"'},{value:'"accent"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"blue"'},{value:'"green"'}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"span"'},{value:'"strong"'},{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 W={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,m;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-BTJTZTIL.js";import{r as D}from"./index-Cb9e4tly.js";import{g as j,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-NXEPEzbR.js";import{g as k}from"./index-DdzHuZ-Y.js";import{h as R,k as M}from"./defaults-hwJNw1bK.js";import{T as S}from"./Text-
|
|
1
|
+
import{j as t}from"./jsx-runtime-BTJTZTIL.js";import{r as D}from"./index-Cb9e4tly.js";import{g as j,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-NXEPEzbR.js";import{g as k}from"./index-DdzHuZ-Y.js";import{h as R,k as M}from"./defaults-hwJNw1bK.js";import{T as S}from"./Text-D3i9pJx6.js";import"./index-ChsGqxH_.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=D.forwardRef(function({children:g,accent:r,color:h,weight:T=M,italic:x=!1,tag:f=R,dataset:y,..._},w){const b=p(F,i.TextInline,[L("italic",void 0,x)]),s=r?void 0:h,I=j(!s,r),W=q(s),N=U(T),C=[...b,...I,...W,...N],E={...V(_),ref:w,className:C.join(" "),...k(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:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"critical"'},{value:'"inverted"'},{value:'"disabled"'},{value:'"selected"'},{value:'"accent"'},{value:'"accentDark"'},{value:'"placeholder"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"branded"'},{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:'"span"'},{value:'"strong"'},{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 ne={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: {
|