@preply/ds-docs 1.4.0 → 1.4.2
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-ed2lpBeG.js → 00.LayoutFlex.stories-C6NuyaJx.js} +1 -1
- package/dist/assets/{00.applications-DLWUENDG.js → 00.applications-CzRQjSiq.js} +1 -1
- package/dist/assets/{00.favicons.guide-D5-20tQH.js → 00.favicons.guide-Cl2xkhMN.js} +1 -1
- package/dist/assets/{00.token-explorer-BIc8vy7H.js → 00.token-explorer-Bjz10JOk.js} +1 -1
- package/dist/assets/{00.using-responsive-props-CY9p8v_u.js → 00.using-responsive-props-BJUez61e.js} +1 -1
- package/dist/assets/{01.semantic-tokens-CThrY5Ts.js → 01.semantic-tokens-rGQpGJVg.js} +1 -1
- package/dist/assets/{01.using-shorthand-props-C_vbhNfL.js → 01.using-shorthand-props-C5dLPYVH.js} +1 -1
- package/dist/assets/{10.Combinations.stories-Bj20QCLY.js → 10.Combinations.stories-BCpu8o_W.js} +1 -1
- package/dist/assets/{10.fonts.guide-Dy8fgLU5.js → 10.fonts.guide-DDN5fND8.js} +1 -1
- package/dist/assets/{10.ssr-D9v_dR0o.js → 10.ssr-D-rANvZ-.js} +1 -1
- package/dist/assets/{11.languageFont.explorer-BZuqA2Qd.js → 11.languageFont.explorer-BV6Gwq5u.js} +1 -1
- package/dist/assets/{11.ssr.app-router-CU9S0P9E.js → 11.ssr.app-router-Ch1ZJjg-.js} +1 -1
- package/dist/assets/{20.libraries-CG6__ozS.js → 20.libraries-oHi972pc.js} +1 -1
- package/dist/assets/{30.icons.explorer-CK_LzlUE.js → 30.icons.explorer-CTyGJI0M.js} +1 -1
- package/dist/assets/{30.storybook-Be_FRDz_.js → 30.storybook-C0MSe3yp.js} +1 -1
- package/dist/assets/{40.illustrations.explorer-lGFuCzSa.js → 40.illustrations.explorer-1aFkROmz.js} +1 -1
- package/dist/assets/{90.advanced-C4czMsOy.js → 90.advanced-t0tp7qCO.js} +1 -1
- package/dist/assets/AlertDialog-8zNG4W6P.css +1 -0
- package/dist/assets/{AlertDialog.stories-DlRWBYYU.js → AlertDialog.stories-C5USsoA-.js} +1 -1
- package/dist/assets/Avatar-BZKmHoZm.css +1 -0
- package/dist/assets/Avatar-BkmMIq29.css +1 -0
- package/dist/assets/Avatar-D5vkZljP.js +1 -0
- package/dist/assets/Avatar-lFZ8Cfpv.js +6 -0
- package/dist/assets/{Avatar.stories-OTgx0pcM.js → Avatar.stories-CLQ3BvQW.js} +1 -1
- package/dist/assets/AvatarWithStatus-Dv8yodGu.css +1 -0
- package/dist/assets/{AvatarWithStatus.stories--mF91ETX.js → AvatarWithStatus.stories-BsgFOyBx.js} +5 -5
- package/dist/assets/Badge-kZt_FH50.css +1 -0
- package/dist/assets/{Badge.stories-D8nghiXL.js → Badge.stories-CsQItVr_.js} +2 -2
- package/dist/assets/Box-4GImUu2D.css +1 -0
- package/dist/assets/Box.stories-C3UUNdDi.js +44 -0
- package/dist/assets/Button-CawJKyho.css +1 -0
- package/dist/assets/{Button-DqwK0S70.js → Button-G5Zxq86f.js} +2 -2
- package/dist/assets/{Button-CHTJqu07.css → Button-GOFCl1lS.css} +1 -1
- package/dist/assets/Button-Oaj5OWvs.js +1 -0
- package/dist/assets/{Button.stories-oW-QBb5C.js → Button.stories-BuHavCSD.js} +1 -1
- package/dist/assets/{ButtonBase-CuGZo0xf.css → ButtonBase-CN93Hyoe.css} +1 -1
- package/dist/assets/ButtonBase-Desxs10d.js +8 -0
- package/dist/assets/Chips-DIrYdYig.css +1 -0
- package/dist/assets/{Chips.stories-DiprPB2i.js → Chips.stories-DwatZLP-.js} +1 -1
- package/dist/assets/{Color-YHDXOIA2-C2h0aGNO.js → Color-YHDXOIA2-CR40pFdp.js} +1 -1
- package/dist/assets/Dialog-B5rqi-V8.css +1 -0
- package/dist/assets/{Dialog.stories-CAPNnMI_.js → Dialog.stories-aheiL1C_.js} +13 -13
- package/dist/assets/{DocsRenderer-CFRXHY34-C35smYsV.js → DocsRenderer-CFRXHY34-C7iNFBWT.js} +1 -1
- package/dist/assets/{FieldAdditionalText-lW7Q1VGp.js → FieldAdditionalText-CK-mP7eE.js} +1 -1
- package/dist/assets/FieldAdditionalText-DmrAhCSm.css +1 -0
- package/dist/assets/{FieldAdditionalText.stories-DcGxrOlS.js → FieldAdditionalText.stories-JWcqGRDw.js} +1 -1
- package/dist/assets/{FieldButton-QHhW28uq.js → FieldButton-B9DsbnCd.js} +1 -1
- package/dist/assets/{FieldButton-k7TvuQHy.css → FieldButton-ClSNKPdl.css} +1 -1
- package/dist/assets/{FieldButton.stories-vBmg2O9Q.js → FieldButton.stories-B5JDNmNP.js} +1 -1
- package/dist/assets/FieldLayout-2zlcC5-S.js +1 -0
- package/dist/assets/FieldLayout-ayailSRB.css +1 -0
- package/dist/assets/{FieldLayout.stories-CtD6-C6l.js → FieldLayout.stories-oIX7x6Q6.js} +1 -1
- package/dist/assets/{FieldLayoutBase-DQbxDQVA.js → FieldLayoutBase-0r0SpleC.js} +3 -3
- package/dist/assets/FieldLayoutBase-DaHOfSqh.css +1 -0
- package/dist/assets/Heading-BDNRMwVu.js +2 -0
- package/dist/assets/{Heading-DeYpQLgb.css → Heading-DhbbSS03.css} +1 -1
- package/dist/assets/{Heading.stories-CROOXvlq.js → Heading.stories-BW49vEiT.js} +1 -1
- package/dist/assets/Icon-COBslmJH.css +1 -0
- package/dist/assets/Icon-DAQd7Eod.js +8 -0
- package/dist/assets/{Icon-RSC-BOyrffYC.js → Icon-RSC-DXv5b9K1.js} +1 -1
- package/dist/assets/Icon-VzZ0SATJ.css +1 -0
- package/dist/assets/Icon-qme4Scxh.js +1 -0
- package/dist/assets/{Icon.stories-BqehTDt3.js → Icon.stories-MzKcutu8.js} +1 -1
- package/dist/assets/{IconButton-CI9clg4P.js → IconButton-iyWiUe9X.js} +2 -2
- package/dist/assets/InputText-IEjR9ee0.js +5 -0
- package/dist/assets/{LayoutFlex-CaenMVBF.js → LayoutFlex-BaXqezhY.js} +1 -1
- package/dist/assets/{LayoutFlex-JnKYDcpC.js → LayoutFlex-pzKY-vUQ.js} +1 -1
- package/dist/assets/LayoutFlexItem-CzflYuZ_.js +1 -0
- package/dist/assets/LayoutFlexItem-Dci-Cv-V.css +1 -0
- package/dist/assets/LayoutGrid-C8hq1-LL.css +1 -0
- package/dist/assets/LayoutGrid-CULegRpi.css +1 -0
- package/dist/assets/LayoutGrid-ZAYmKrcj.js +1 -0
- package/dist/assets/{LayoutGrid.stories-Dv8lBJmB.js → LayoutGrid.stories-CSBUYfM6.js} +3 -3
- package/dist/assets/LayoutGridItem-DJDMWtVq.css +1 -0
- package/dist/assets/LayoutGridItem-m645Lhkq.js +1 -0
- package/dist/assets/Link-CPkXDszE.css +1 -0
- package/dist/assets/{Link.stories-DXbiFw9-.js → Link.stories-BGmSAnPH.js} +4 -4
- package/dist/assets/Loader-C5QrrxXJ.css +1 -0
- package/dist/assets/{Loader.stories-DvgUtUpE.js → Loader.stories-DaYtlzeB.js} +1 -1
- package/dist/assets/NumberField.stories-DIRO8IHc.js +203 -0
- package/dist/assets/OnboardingTooltip-BfzcF9sW.css +1 -0
- package/dist/assets/{OnboardingTooltip-IYSphueI.js → OnboardingTooltip-BqDG-2Rd.js} +1 -1
- package/dist/assets/{OnboardingTooltip.stories-DnfLcLUg.js → OnboardingTooltip.stories-Dx5F7YBG.js} +1 -1
- package/dist/assets/{OnboardingTooltip.tests.stories-DobHu21P.js → OnboardingTooltip.tests.stories-DvcLnD5j.js} +1 -1
- package/dist/assets/{OnboardingTour-2YaW_XWj.js → OnboardingTour-B_yyU1AU.js} +1 -1
- package/dist/assets/{OnboardingTour-Dr4ZlIUd.css → OnboardingTour-CnsU5p_A.css} +1 -1
- package/dist/assets/{OnboardingTour.stories-BUBpjiez.js → OnboardingTour.stories-LGCUxWl4.js} +1 -1
- package/dist/assets/{OnboardingTour.tests.stories-Buou9m4A.js → OnboardingTour.tests.stories-C9CKn7JQ.js} +1 -1
- package/dist/assets/PasswordField.stories-CvnCM5rD.js +203 -0
- package/dist/assets/PreplyLogo-Cecouk_S.css +1 -0
- package/dist/assets/{PreplyLogo.stories-BReIYVeE.js → PreplyLogo.stories-ZhZHvw_M.js} +1 -1
- package/dist/assets/{ProgressBar-D5aTIWY3.css → ProgressBar-DYzJL8gA.css} +1 -1
- package/dist/assets/{ProgressBar.stories-wrAgHPrO.js → ProgressBar.stories-XmMUjDS5.js} +1 -1
- package/dist/assets/{ProgressSteps-DWp2S1-b.js → ProgressSteps-CVWVi5_G.js} +1 -1
- package/dist/assets/ProgressSteps-Dip-BZlm.css +1 -0
- package/dist/assets/{ProgressSteps.stories-CsWQLVog.js → ProgressSteps.stories-B57q5WFr.js} +1 -1
- package/dist/assets/SelectField-CTB098t-.css +1 -0
- package/dist/assets/SelectField.stories-CqnGEFQn.js +182 -0
- package/dist/assets/Spinner-BuihcWyQ.css +1 -0
- package/dist/assets/{Spinner-Dsa9X0G6.js → Spinner-C3p2WoxW.js} +1 -1
- package/dist/assets/Steps-Bd4yQjwc.css +1 -0
- package/dist/assets/{Steps-ifU4R9DW.js → Steps-DbST4vmL.js} +1 -1
- package/dist/assets/{Steps.stories-DkI3jK5X.js → Steps.stories-gWR5Lpwz.js} +1 -1
- package/dist/assets/Text-BeAjllqh.js +1 -0
- package/dist/assets/{Text-BWNSh4D5.css → Text-CgAyAgxF.css} +1 -1
- package/dist/assets/Text-D3ATKGXs.js +1 -0
- package/dist/assets/{Text.stories-B8iegpqH.js → Text.stories-BlLgBmMi.js} +1 -1
- package/dist/assets/TextField-BiEzDuCh.js +1 -0
- package/dist/assets/TextField-C3owY_ZE.css +1 -0
- package/dist/assets/{TextField.stories-Beeq1JfY.js → TextField.stories-CPD818W_.js} +1 -1
- package/dist/assets/TextHighlighted-B_WQpKk8.css +1 -0
- package/dist/assets/TextHighlighted-DoFzmVL0.js +1 -0
- package/dist/assets/{TextHighlighted.stories-DdbLv0RQ.js → TextHighlighted.stories-DTNcmEX3.js} +3 -3
- package/dist/assets/TextInline-BqUzWrD4.css +1 -0
- package/dist/assets/{TextInline.stories-aCVFO11z.js → TextInline.stories-DqX-qocx.js} +1 -1
- package/dist/assets/TextareaField.stories-D95m8D1f.js +221 -0
- package/dist/assets/Toast-BsJOXveW.css +1 -0
- package/dist/assets/{Toast.stories-BZFlc1-_.js → Toast.stories-CGXB3Oyz.js} +9 -9
- package/dist/assets/Tooltip-9him0tBb.css +1 -0
- package/dist/assets/{Tooltip-BvCJt9jJ.js → Tooltip-kdQF0n0X.js} +1 -1
- package/dist/assets/{Tooltip.stories-Crh2sW9L.js → Tooltip.stories-ChMEb5wa.js} +1 -1
- package/dist/assets/{Tooltip.tests.stories-bmaSwgkR.js → Tooltip.tests.stories-DRKkU6_h.js} +1 -1
- package/dist/assets/{breakpoints-CIpR6Rpt.js → breakpoints-BKtvPn4z.js} +1 -1
- package/dist/assets/{breakpoints-BELcY-aB.js → breakpoints-CvGR1154.js} +1 -1
- package/dist/assets/{breakpoints-_joXL0S9.js → breakpoints-Dw3ULM7j.js} +1 -1
- package/dist/assets/{changelog-DdodvQsh.js → changelog-DXXuLjII.js} +1 -1
- package/dist/assets/{entry-preview-DNvfsvqm.js → entry-preview-DKCl8pnk.js} +1 -1
- package/dist/assets/{getTokenVar-RiIceD0Y.js → getTokenVar-BWljsLZ6.js} +1 -1
- package/dist/assets/{hover-D2OphZ3W.js → hover-BRNG4vFt.js} +1 -1
- package/dist/assets/{hover-DDVoGg-g.js → hover-BpH2YvND.js} +1 -1
- package/dist/assets/{hover-BIABQ7bm.js → hover-Cun_Hxa2.js} +1 -1
- package/dist/assets/{iframe-B08s_jqc.js → iframe-DbVfH8B5.js} +2 -2
- package/dist/assets/{index-BGAhMoqL.js → index-UAdYqHL0.js} +3 -3
- package/dist/assets/{index-DmM0DblE.js → index-lpmehhNH.js} +1 -1
- package/dist/assets/{intro-9BhCdV9M.js → intro-CQsqeQsV.js} +1 -1
- package/dist/assets/layout-relative-Cf09gtOc.css +1 -0
- package/dist/assets/layout-relative-DA7rS9QX.js +1 -0
- package/dist/assets/layout-relative-Jxb51_Sh.css +1 -0
- package/dist/assets/layout-relative-mSX9oB2N.css +1 -0
- package/dist/assets/layout-relative.module-CYNzEGVH.js +1 -0
- package/dist/assets/layout-relative.module-yZwngsDw-BiwrSIEl.js +1 -0
- package/dist/assets/{migrating-from-less-DX0PnZZJ.js → migrating-from-less-DAZke_bf.js} +1 -1
- package/dist/assets/playground-w72anE0z.css +1 -0
- package/dist/assets/{playground.stories-IM0Bn8my.js → playground.stories-Dpb3xI2s.js} +2 -2
- package/dist/assets/{preview-DSwUvj7R.js → preview-DchamjVK.js} +1 -1
- package/dist/assets/{preview-D_cPBI7P.js → preview-HuUbG8ej.js} +2 -2
- package/dist/assets/{preview-E8zsGlo4.js → preview-kCY-Nq0t.js} +1 -1
- package/dist/assets/text-accent-CuYWdzBU.js +1 -0
- package/dist/assets/text-accent-DbbdQjKI.js +1 -0
- package/dist/assets/text-accent-da8yAj-M.css +1 -0
- package/dist/assets/text-centered-6MZg9O0U.js +1 -0
- package/dist/assets/text-centered-CrBlvRDP.js +1 -0
- package/dist/assets/text-centered-DUL478eo.css +1 -0
- package/dist/assets/text-centered-RwJDmlB2.css +1 -0
- package/dist/assets/{tokens-yG_wYklp.js → tokens-BaIvp8uk.js} +1 -1
- package/dist/assets/{tokens-D2SDDihU.js → tokens-BqWh6RWP.js} +1 -1
- package/dist/assets/{tokens-DRcTh2ws.js → tokens-KVFCTIK3.js} +1 -1
- package/dist/assets/{usePortalElement-aOX_O1I5.js → usePortalElement-DBJJ4TO9.js} +1 -1
- package/dist/assets/{welcome-CGkWDS9u.js → welcome-CaHVZaZ7.js} +1 -1
- package/dist/assets/{zeroheight-CH9deXT2.js → zeroheight-DobKPt2E.js} +1 -1
- package/dist/iframe.html +1 -1
- package/dist/preview-stats.json +1350 -1350
- package/dist/project.json +1 -1
- package/package.json +3 -3
- package/dist/assets/AlertDialog-CSUTu5O6.css +0 -1
- package/dist/assets/Avatar-CmnrM37w.js +0 -6
- package/dist/assets/Avatar-JE3Hcbkv.css +0 -1
- package/dist/assets/Avatar-_W1s5JpT.css +0 -1
- package/dist/assets/Avatar-iqWOn9Tl.js +0 -1
- package/dist/assets/AvatarWithStatus-pddO2Nza.css +0 -1
- package/dist/assets/Badge-DcbG4N4-.css +0 -1
- package/dist/assets/Box-CJkXzUjZ.css +0 -1
- package/dist/assets/Box.stories-DxW6l-HA.js +0 -44
- package/dist/assets/Button-B1mdczvv.js +0 -1
- package/dist/assets/Button-C6kEKm6h.css +0 -1
- package/dist/assets/ButtonBase-D31GBWHv.js +0 -8
- package/dist/assets/Chips-Dejf8Sh_.css +0 -1
- package/dist/assets/Dialog-DwZQYtV6.css +0 -1
- package/dist/assets/FieldAdditionalText-CUu6JGoC.css +0 -1
- package/dist/assets/FieldLayout-BGkL1EMg.js +0 -1
- package/dist/assets/FieldLayout-CG9n-WOS.css +0 -1
- package/dist/assets/FieldLayoutBase-CoIn-2cd.css +0 -1
- package/dist/assets/Heading-CifnBvGj.js +0 -2
- package/dist/assets/Icon-BVvspUlo.js +0 -1
- package/dist/assets/Icon-BwwIOKM_.js +0 -8
- package/dist/assets/Icon-ByJ3-8OT.css +0 -1
- package/dist/assets/Icon-DghDQiVd.css +0 -1
- package/dist/assets/InputText-DmOW3mdD.js +0 -5
- package/dist/assets/LayoutFlexItem-BM0Abp7Y.js +0 -1
- package/dist/assets/LayoutFlexItem-Dv67D5k3.css +0 -1
- package/dist/assets/LayoutGrid-BG6JKtyy.css +0 -1
- package/dist/assets/LayoutGrid-BhioG4bL.js +0 -1
- package/dist/assets/LayoutGrid-CJQpEAmZ.css +0 -1
- package/dist/assets/LayoutGridItem-BDT0sqW-.css +0 -1
- package/dist/assets/LayoutGridItem-CdnUXNtY.js +0 -1
- package/dist/assets/Link-vYql_2wB.css +0 -1
- package/dist/assets/Loader-DLP0PI5-.css +0 -1
- package/dist/assets/NumberField.stories-BQIOdo90.js +0 -203
- package/dist/assets/OnboardingTooltip-RxaiJe-3.css +0 -1
- package/dist/assets/PasswordField.stories-BevSwKGm.js +0 -203
- package/dist/assets/PreplyLogo-CBB3sPr3.css +0 -1
- package/dist/assets/ProgressSteps-s9ACrzTy.css +0 -1
- package/dist/assets/SelectField-N7X7yUPn.css +0 -1
- package/dist/assets/SelectField.stories-9iipR200.js +0 -182
- package/dist/assets/Spinner-CVHMc-T0.css +0 -1
- package/dist/assets/Steps-CQWsOQKy.css +0 -1
- package/dist/assets/Text-CDqVYAcD.js +0 -1
- package/dist/assets/Text-CdCGNBj4.js +0 -1
- package/dist/assets/TextField-DAwVD2CM.css +0 -1
- package/dist/assets/TextField-q53ruCuh.js +0 -1
- package/dist/assets/TextHighlighted-BHCtybuo.css +0 -1
- package/dist/assets/TextHighlighted-BdF2_CZo.js +0 -1
- package/dist/assets/TextInline-CDFHfvph.css +0 -1
- package/dist/assets/TextareaField.stories-bA314Jtt.js +0 -221
- package/dist/assets/Toast-BBn7aSpe.css +0 -1
- package/dist/assets/Tooltip-Mm-tBuF2.css +0 -1
- package/dist/assets/layout-relative-0-BGcS53.css +0 -1
- package/dist/assets/layout-relative-D-nYASza.css +0 -1
- package/dist/assets/layout-relative-DZ8FL-vJ.js +0 -1
- package/dist/assets/layout-relative-DiL5t_eA.css +0 -1
- package/dist/assets/layout-relative.module-Bf3FithH.js +0 -1
- package/dist/assets/layout-relative.module-CXJ9jc4G--YD8TQc4.js +0 -1
- package/dist/assets/playground-BQGD3iU0.css +0 -1
- package/dist/assets/text-accent-0oTyB6kb.css +0 -1
- package/dist/assets/text-accent-BMcamJQk.js +0 -1
- package/dist/assets/text-accent-CrnHOlvW.js +0 -1
- package/dist/assets/text-centered-1sU8-E1D.js +0 -1
- package/dist/assets/text-centered-BSdMMoT9.js +0 -1
- package/dist/assets/text-centered-BttmHjSJ.css +0 -1
- package/dist/assets/text-centered-V2JhT89g.css +0 -1
|
@@ -1,203 +0,0 @@
|
|
|
1
|
-
import{j as l}from"./jsx-runtime-BTJTZTIL.js";import{r as t}from"./index-Cb9e4tly.js";import{a as s}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{e as i,u as B,w as Ee}from"./index-BVDq5o4N.js";import{B as F}from"./Button-DqwK0S70.js";import{F as Ze}from"./FieldButton-QHhW28uq.js";import{F as De}from"./FieldLayout-BGkL1EMg.js";import{I as _e}from"./Icon-BwwIOKM_.js";import{u as Ke,I as We,s as Oe}from"./FieldLayoutBase-DQbxDQVA.js";import{m as qe}from"./classNames-BUL1Zq7e.js";import{w as p}from"./componentNames-Bwls0I02.js";import{I as Ne}from"./InputText-DmOW3mdD.js";import{u as Ae}from"./useForcedRef--iGFM41p.js";import{u as Ue}from"./usePasswordField-D19lMeqK.js";import{a as $e}from"./useTheme-DpAUb62T.js";import{T as Je}from"./Text-CDqVYAcD.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./render-icon-BT0Aq7PA.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./defaults-B1rzzf6M.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./useHostname-Y3PlXofY.js";import"./index-DdzHuZ-Y.js";import"./index-CC6DAVyL.js";import"./text-accent-CrnHOlvW.js";import"./FieldAdditionalText-lW7Q1VGp.js";import"./constants-DL6gdbsq.js";import"./index-D1pfvbUR.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-B1DLZQ1U.js";import"./constants-BaXVdZRV.js";import"./text-centered-1sU8-E1D.js";const Xe=({onChange:e,onValueChange:a,...n},r)=>{const d=qe(Oe,p.InputPassword),o=Ke(u=>u.target.value,e,a);return l.jsx(We,{...n,ref:r,type:"password",className:d.join(" "),onChange:o,preplyDsComponent:p.InputPassword})},k=t.forwardRef(Xe);try{k.displayName="InputPassword",k.__docgenInfo={description:"",displayName:"InputPassword",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
|
|
2
|
-
@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-disabled":{defaultValue:null,description:`Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
|
|
3
|
-
@see aria-hidden
|
|
4
|
-
@see aria-readonly.`,name:"aria-disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
|
|
5
|
-
@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-required":{defaultValue:null,description:"Indicates that user input is required on the element before a form may be submitted.",name:"aria-required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"off"'},{value:'"new-password"'},{value:'"current-password"'}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<string>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ye="_PasswordField_glhh2_1",ze={PasswordField:Ye},Ge=({title:e,titleId:a,...n},r)=>t.createElement("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M7.64869 7.23448L9.38632 8.9721C10.0868 8.36709 11.0004 8 12 8C14.2091 8 16 9.79086 16 12C16 12.9996 15.6329 13.9132 15.0279 14.6137L16.8567 16.4425C18.1386 15.5694 19.145 14.4662 19.8641 13.5108C20.282 12.9555 20.5954 12.4602 20.8026 12.1069C20.8244 12.0696 20.8451 12.034 20.8646 12C20.7767 11.8466 20.6643 11.6585 20.5277 11.4446C20.1339 10.8282 19.5446 10.0077 18.7644 9.19054C17.1952 7.54692 14.9391 6 12 6C10.3258 6 8.87752 6.50002 7.64869 7.23448ZM16.2096 18.6238L17.2929 19.7071C17.6834 20.0976 18.3166 20.0976 18.7071 19.7071C19.0976 19.3166 19.0976 18.6834 18.7071 18.2929L18.292 17.8778C19.6619 16.8835 20.717 15.7034 21.462 14.7135C21.9338 14.0868 22.2889 13.5259 22.5278 13.1187C22.6473 12.9148 22.7382 12.7486 22.8004 12.631C22.8315 12.5721 22.8554 12.5253 22.8722 12.492L22.8921 12.4521L22.898 12.4401L22.8999 12.436L22.9007 12.4345L22.901 12.4339C22.9011 12.4336 22.9012 12.4334 22 12L22.9012 12.4334C23.0329 12.1595 23.0329 11.8405 22.9012 11.5666L22 12C22.9012 11.5666 22.901 11.5663 22.9009 11.5659L22.9004 11.565L22.8993 11.5626L22.8961 11.5561L22.8859 11.5355C22.8775 11.5184 22.8657 11.4949 22.8505 11.4653C22.8202 11.4062 22.7764 11.3226 22.7192 11.2183C22.6047 11.0097 22.436 10.7169 22.2131 10.3679C21.7685 9.67183 21.1016 8.7423 20.211 7.80946C18.4387 5.95308 15.6949 4 12 4C9.69667 4 7.75788 4.76129 6.19804 5.78382L5.70711 5.29289C5.31658 4.90237 4.68342 4.90237 4.29289 5.29289C3.90237 5.68342 3.90237 6.31658 4.29289 6.70711L15.7842 18.1984C15.7899 18.2095 15.796 18.2205 15.8022 18.2315C15.9012 18.4052 16.0444 18.538 16.2096 18.6238ZM13.6063 13.1921C13.8541 12.8587 14 12.4463 14 12C14 10.8954 13.1046 10 12 10C11.5537 10 11.1413 10.1458 10.8079 10.3937L13.6063 13.1921ZM4.12143 8.87815C4.55691 9.21782 4.63459 9.8462 4.29493 10.2817C3.82421 10.8852 3.47093 11.4326 3.23687 11.8263C3.20005 11.8882 3.16624 11.9463 3.13544 12C3.22333 12.1533 3.33567 12.3415 3.47232 12.5554C3.86611 13.1718 4.4554 13.9923 5.23556 14.8095C6.80475 16.4531 9.06094 18 12 18C12.5523 18 13 18.4477 13 19C13 19.5523 12.5523 20 12 20C8.3051 20 5.56129 18.0469 3.78897 16.1905C2.89837 15.2577 2.23154 14.3282 1.78687 13.6321C1.56395 13.2831 1.39528 12.9903 1.28084 12.7817C1.22359 12.6774 1.17979 12.5938 1.14947 12.5347C1.13431 12.5051 1.1225 12.4816 1.11406 12.4645L1.1039 12.4439L1.10071 12.4374L1.09959 12.435L1.09915 12.4341C1.09896 12.4337 1.09878 12.4334 2 12C1.09878 11.5666 1.09885 11.5665 1.09891 11.5664L1.09906 11.5661L1.09938 11.5654L1.10017 11.5638L1.1023 11.5594L1.10884 11.546L1.13096 11.5017C1.14973 11.4645 1.17655 11.4123 1.21143 11.3467C1.28117 11.2156 1.38328 11.0304 1.51776 10.8042C1.78631 10.3525 2.18624 9.73329 2.7179 9.05165C3.05756 8.61617 3.68595 8.53849 4.12143 8.87815ZM2 12L1.09878 12.4334C0.967073 12.1595 0.967073 11.8405 1.09878 11.5666L2 12Z",fill:"currentColor"})),Qe=t.forwardRef(Ge),ea=({title:e,titleId:a,...n},r)=>t.createElement("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3.47232 12.5554C3.33567 12.3415 3.22333 12.1533 3.13544 12C3.22333 11.8466 3.33567 11.6585 3.47232 11.4446C3.86611 10.8282 4.4554 10.0077 5.23556 9.19054C6.80475 7.54692 9.06094 6 12 6C14.9391 6 17.1952 7.54692 18.7644 9.19054C19.5446 10.0077 20.1339 10.8282 20.5277 11.4446C20.6643 11.6585 20.7767 11.8466 20.8646 12C20.7767 12.1533 20.6643 12.3415 20.5277 12.5554C20.1339 13.1718 19.5446 13.9923 18.7644 14.8095C17.1952 16.4531 14.9391 18 12 18C9.06094 18 6.80475 16.4531 5.23556 14.8095C4.4554 13.9923 3.86611 13.1718 3.47232 12.5554ZM22.9009 11.5659C22.901 11.5663 22.9012 11.5666 22 12C22.9012 12.4334 22.901 12.4337 22.9009 12.4341L22.9004 12.435L22.8993 12.4374L22.8961 12.4439L22.8859 12.4645C22.8775 12.4816 22.8657 12.5051 22.8505 12.5347C22.8202 12.5938 22.7764 12.6774 22.7192 12.7817C22.6047 12.9903 22.436 13.2831 22.2131 13.6321C21.7685 14.3282 21.1016 15.2577 20.211 16.1905C18.4387 18.0469 15.6949 20 12 20C8.3051 20 5.56129 18.0469 3.78897 16.1905C2.89837 15.2577 2.23154 14.3282 1.78687 13.6321C1.56395 13.2831 1.39528 12.9903 1.28084 12.7817C1.22359 12.6774 1.17979 12.5938 1.14947 12.5347C1.13431 12.5051 1.1225 12.4816 1.11406 12.4645L1.1039 12.4439L1.10071 12.4374L1.09959 12.435L1.09915 12.4341C1.09896 12.4337 1.09878 12.4334 2 12C1.09878 11.5666 1.09896 11.5663 1.09915 11.5659L1.09959 11.565L1.10071 11.5626L1.1039 11.5561L1.11406 11.5355C1.1225 11.5184 1.13431 11.4949 1.14947 11.4653C1.17979 11.4062 1.22359 11.3226 1.28084 11.2183C1.39528 11.0097 1.56395 10.7169 1.78687 10.3679C2.23154 9.67183 2.89837 8.7423 3.78897 7.80946C5.56129 5.95308 8.3051 4 12 4C15.6949 4 18.4387 5.95308 20.211 7.80946C21.1016 8.7423 21.7685 9.67183 22.2131 10.3679C22.436 10.7169 22.6047 11.0097 22.7192 11.2183C22.7764 11.3226 22.8202 11.4062 22.8505 11.4653C22.8657 11.4949 22.8775 11.5184 22.8859 11.5355L22.8961 11.5561L22.8993 11.5626L22.9004 11.565L22.9009 11.5659ZM22 12L22.9012 11.5666C23.0329 11.8405 23.0329 12.1595 22.9012 12.4334L22 12ZM1.09878 11.5666L2 12L1.09878 12.4334C0.967073 12.1595 0.967073 11.8405 1.09878 11.5666ZM10 12C10 10.8954 10.8954 10 12 10C13.1046 10 14 10.8954 14 12C14 13.1046 13.1046 14 12 14C10.8954 14 10 13.1046 10 12ZM12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8Z",fill:"currentColor"})),aa=t.forwardRef(ea),na=({title:e,titleId:a,...n},r)=>t.createElement("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M8 5C8 2.79086 9.79086 1 12 1C14.2091 1 16 2.79086 16 5V9.10002C18.2822 9.56329 20 11.581 20 14V18C20 20.7614 17.7614 23 15 23H9C6.23858 23 4 20.7614 4 18V14C4 11.581 5.71776 9.56329 8 9.10002V5ZM14 5V9H10V5C10 3.89543 10.8954 3 12 3C13.1046 3 14 3.89543 14 5ZM18 14C18 12.3431 16.6569 11 15 11H9C7.34315 11 6 12.3431 6 14V18C6 19.6569 7.34315 21 9 21H15C16.6569 21 18 19.6569 18 18V14ZM12 18C13.1046 18 14 17.1046 14 16C14 14.8954 13.1046 14 12 14C10.8954 14 10 14.8954 10 16C10 17.1046 10.8954 18 12 18Z",fill:"currentColor"})),Le=t.forwardRef(na),ta=({title:e,titleId:a,...n},r)=>t.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",d:"M3 5.414 4.414 4l14.85 14.85-1.415 1.413-1.936-1.935a9.695 9.695 0 0 1-3.913.806c-7 0-10-7-10-7s1.036-2.416 3.31-4.41L3 5.414Zm9.538 9.538 1.824 1.824a7.789 7.789 0 0 1-2.362.358c-2.764 0-4.77-1.364-6.16-2.86a12.39 12.39 0 0 1-1.543-2.069l-.042-.07.042-.072c.337-.566.85-1.32 1.544-2.068.271-.293.567-.58.886-.853l2.321 2.32a3 3 0 0 0 3.49 3.49Zm5.793-.868a12.455 12.455 0 0 0 1.372-1.879l.042-.07-.042-.072a12.39 12.39 0 0 0-1.544-2.068C16.77 8.5 14.764 7.135 12 7.135c-.203 0-.402.007-.597.02L9.658 5.412A9.869 9.869 0 0 1 12 5.134c7 0 10 7 10 7s-.712 1.662-2.253 3.367l-1.416-1.417ZM3.836 12.927v.002-.002Z",clipRule:"evenodd"})),ra=t.forwardRef(ta),la=({title:e,titleId:a,...n},r)=>t.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",d:"M12 19c-7 0-10-7-10-7s3-7 10-7 10 7 10 7-3 7-10 7Zm-8.164-6.207v.002-.002Zm.46-.864L4.256 12l.042.07c.337.568.85 1.322 1.544 2.07C7.23 15.635 9.236 17 12 17s4.77-1.364 6.16-2.86a12.39 12.39 0 0 0 1.543-2.07l.042-.07-.042-.07a12.39 12.39 0 0 0-1.544-2.07C16.77 8.365 14.764 7 12 7S7.23 8.364 5.84 9.86a12.386 12.386 0 0 0-1.543 2.07ZM12 9a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z",clipRule:"evenodd"})),ua=t.forwardRef(la),sa=({title:e,titleId:a,...n},r)=>t.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",ref:r,"aria-labelledby":a,...n},e?t.createElement("title",{id:a},e):null,t.createElement("path",{fillRule:"evenodd",d:"M15 11V8a3 3 0 1 0-6 0v3h6ZM7 8v3H4v10h16V11h-3V8A5 5 0 0 0 7 8Zm-1 5h12v6H6v-6Zm8 4v-2h-4v2h4Z",clipRule:"evenodd"})),Ie=t.forwardRef(sa);function P(e,a){switch(a){case"tokyo-ui-eye-hide":return e==="tokyo-ui"?ra:Qe;case"tokyo-ui-eye":return e==="tokyo-ui"?ua:aa;case"tokyo-ui-lock":return e==="tokyo-ui"?Ie:Le;default:throw new Error(`Unknown icon ${a}`)}}const oa=({showIcon:e,revealValue:a,id:n,...r},d)=>{const o=t.useRef(null),u=Ae();t.useImperativeHandle(d,()=>({setFocus:()=>{var c;return(c=u==null?void 0:u.current)==null?void 0:c.setFocus()},scrollIntoView:()=>{var c;return(c=o==null?void 0:o.current)==null?void 0:c.scrollIntoView()}}));const Re=Ue({id:n,...r},p.PasswordField),{layoutProps:He,inputProps:S}=Re,[v,Be]=t.useState(!1),ke=()=>Be(!v),{theme:H}=$e(),Te=e?l.jsx(_e,{svg:H.name==="tokyo-ui"?Ie:Le}):void 0,Fe=v||a?l.jsx(Ne,{...S,type:"text",ref:u}):l.jsx(k,{...S,ref:u}),Se=v?P(H.name,"tokyo-ui-eye-hide"):P(H.name,"tokyo-ui-eye"),Pe=v?"Conceal password":"Reveal password",Me=a?void 0:l.jsx(Ze,{onClick:ke,svg:Se,assistiveText:Pe}),je=qe(ze,p.PasswordField);return l.jsx(De,{...He,icon:Te,button:Me,className:je.join(" "),input:Fe,inputHandle:u.current,ref:o,preplyDsComponent:p.PasswordField})},m=t.forwardRef(oa);try{m.displayName="PasswordField",m.__docgenInfo={description:"By default, this field acts as a controlled field and expects the parent\ncomponent to manage the state, by reacting to user input via the `onChange` or\n`onValueChange` props, and providing the latest state via the `value` prop.\n\nAlternatively, you can use it as an uncontrolled field using the\n`defaultValue` prop instead of the `value` prop.",displayName:"PasswordField",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},additionalText:{defaultValue:null,description:"",name:"additionalText",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},errorMessage:{defaultValue:null,description:"",name:"errorMessage",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:"enum",value:[{value:'"off"'},{value:'"new-password"'},{value:'"current-password"'}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<string>"}]}},showIcon:{defaultValue:null,description:"",name:"showIcon",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},revealValue:{defaultValue:null,description:"",name:"revealValue",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ua={title:"components/PasswordField",component:m,args:{label:"Password",placeholder:"Enter a password",inputDataset:{testid:"input"},defaultValue:"",onChange:s("onChange"),onBlur:s("onBlur"),onFocus:s("onFocus"),onClick:s("onClick"),onCopy:s("onCopy"),onKeyDown:s("onKeyDown"),onKeyUp:s("onKeyUp"),onPaste:s("onPaste"),onValueChange:s("onValueChange")},render:function(a){const n=t.useRef(null);return a.ref=n,l.jsx(m,{...a})}},f={parameters:{docs:{description:{story:"An empty field with a `label` and a `placeholder`."}}}},y={args:{defaultValue:"password"},play:async({canvas:e,step:a})=>{await a("Validate value",()=>{const n=e.getByTestId("input");return i(n).toHaveValue("password")}),await a("Edit and revalidate value",async()=>{const n=e.getByTestId("input");return await B.type(n,"123"),i(n).toHaveValue("password123")}),await a("Check password is concealed",()=>{const n=e.getByTestId("input");return i(n.type).toBe("password")}),await a("Reveal password",()=>{const n=e.getByTitle("Reveal password");return B.click(n)}),await a("Check password is revealed",()=>{const n=e.getByTestId("input");return i(n.type).toBe("text")}),await a("Conceal password",()=>{const n=e.getByTitle("Conceal password");return B.click(n)}),await a("Check password is concealed",()=>{const n=e.getByTestId("input");return i(n.type).toBe("password")})}},h={args:{defaultValue:"password",revealValue:!0}},w={args:{additionalText:"This is additional text"}},g={args:{required:!0}},C={args:{required:!0,requiredLabel:l.jsx(Je,{accent:"critical",variant:"m-bold",children:"Needed"})}},V={args:{hideLabel:!0}},b={args:{hasError:!0}},x={args:{hasError:!0,errorMessage:"This is an error message"}},E={args:{disabled:!0}},q={args:{readOnly:!0}},L={decorators:[(e,{args:a})=>l.jsxs("div",{style:{padding:"8px",margin:"8px"},children:[l.jsxs("p",{children:["You can"," ",l.jsx(F,{variant:"secondary",dataset:{testid:"focus-button"},onClick:()=>{var n,r;return(r=(n=a.ref)==null?void 0:n.current)==null?void 0:r.setFocus()},children:"Focus"})," ","the input imperatively."]}),l.jsx(e,{})]})],play:async({args:e,canvas:a})=>{if(!T(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.setFocus(),await Ee(()=>i(n).toHaveFocus())}},I={decorators:[(e,{args:a})=>l.jsxs("div",{style:{height:"300px",overflow:"scroll",padding:"8px",margin:"8px"},children:[l.jsxs("p",{children:["You can"," ",l.jsx(F,{variant:"secondary",dataset:{testid:"scroll-button"},onClick:()=>{if(!T(a.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");a.ref.current.scrollIntoView()},children:"Scroll"})," ","the input into view imperatively."]}),l.jsx("div",{style:{height:"1000px",display:"flex",flexDirection:"column",justifyContent:"end",border:"2px dashed lightgray",padding:"16px"},children:l.jsx(e,{})})]})],play:async({args:e,canvas:a})=>{if(!T(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const n=a.getByTestId("input");e.ref.current.scrollIntoView(),await Ee(()=>i(n).toBeVisible())}};function T(e){return typeof e=="object"&&e!==null&&"current"in e&&e.current!==null&&typeof e.current=="object"&&"setFocus"in e.current}const R={tags:["!test"],parameters:{docs:{description:{story:'\nThe following code renders a `PasswordField` with the `required` flag,\n`placeholder` and some `additionalText`.\n\nWhen you click the "Show Password" button, the demo is now in control of the\n`revealValue` prop and the input hides the eye field button.\n'}},chromatic:{disableSnapshot:!0}},render:function(){const[a,n]=t.useState(void 0),[r,d]=t.useState(!1),o=t.useRef(null),u=()=>{d(!r)};return l.jsxs("div",{style:{maxWidth:"500px",display:"flex",flexDirection:"column"},children:[l.jsx(m,{ref:o,label:"Password",showIcon:!0,required:!0,placeholder:"e.g.: abc123%pt0!",additionalText:"Include letters, numbers and symbols",revealValue:r,value:a,onValueChange:n}),l.jsx(F,{onClick:u,children:"Show Password"})]})}};var M,j,Z;f.parameters={...f.parameters,docs:{...(M=f.parameters)==null?void 0:M.docs,source:{originalSource:`{
|
|
6
|
-
parameters: {
|
|
7
|
-
docs: {
|
|
8
|
-
description: {
|
|
9
|
-
story: \`An empty field with a \\\`label\\\` and a \\\`placeholder\\\`.\`
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
}`,...(Z=(j=f.parameters)==null?void 0:j.docs)==null?void 0:Z.source}}};var D,_,K;y.parameters={...y.parameters,docs:{...(D=y.parameters)==null?void 0:D.docs,source:{originalSource:`{
|
|
14
|
-
args: {
|
|
15
|
-
defaultValue: 'password'
|
|
16
|
-
},
|
|
17
|
-
play: async ({
|
|
18
|
-
canvas,
|
|
19
|
-
step
|
|
20
|
-
}) => {
|
|
21
|
-
await step('Validate value', () => {
|
|
22
|
-
const input = canvas.getByTestId<HTMLInputElement>('input');
|
|
23
|
-
return expect(input).toHaveValue('password');
|
|
24
|
-
});
|
|
25
|
-
await step('Edit and revalidate value', async () => {
|
|
26
|
-
const input = canvas.getByTestId<HTMLInputElement>('input');
|
|
27
|
-
await userEvent.type(input, '123');
|
|
28
|
-
return expect(input).toHaveValue('password123');
|
|
29
|
-
});
|
|
30
|
-
await step('Check password is concealed', () => {
|
|
31
|
-
const input = canvas.getByTestId<HTMLInputElement>('input');
|
|
32
|
-
return expect(input.type).toBe('password');
|
|
33
|
-
});
|
|
34
|
-
await step('Reveal password', () => {
|
|
35
|
-
const revealButton = canvas.getByTitle('Reveal password');
|
|
36
|
-
return userEvent.click(revealButton);
|
|
37
|
-
});
|
|
38
|
-
await step('Check password is revealed', () => {
|
|
39
|
-
const input = canvas.getByTestId<HTMLInputElement>('input');
|
|
40
|
-
return expect(input.type).toBe('text');
|
|
41
|
-
});
|
|
42
|
-
await step('Conceal password', () => {
|
|
43
|
-
const revealButton = canvas.getByTitle('Conceal password');
|
|
44
|
-
return userEvent.click(revealButton);
|
|
45
|
-
});
|
|
46
|
-
await step('Check password is concealed', () => {
|
|
47
|
-
const input = canvas.getByTestId<HTMLInputElement>('input');
|
|
48
|
-
return expect(input.type).toBe('password');
|
|
49
|
-
});
|
|
50
|
-
}
|
|
51
|
-
}`,...(K=(_=y.parameters)==null?void 0:_.docs)==null?void 0:K.source}}};var W,O,N;h.parameters={...h.parameters,docs:{...(W=h.parameters)==null?void 0:W.docs,source:{originalSource:`{
|
|
52
|
-
args: {
|
|
53
|
-
defaultValue: 'password',
|
|
54
|
-
revealValue: true
|
|
55
|
-
}
|
|
56
|
-
}`,...(N=(O=h.parameters)==null?void 0:O.docs)==null?void 0:N.source}}};var A,U,$;w.parameters={...w.parameters,docs:{...(A=w.parameters)==null?void 0:A.docs,source:{originalSource:`{
|
|
57
|
-
args: {
|
|
58
|
-
additionalText: 'This is additional text'
|
|
59
|
-
}
|
|
60
|
-
}`,...($=(U=w.parameters)==null?void 0:U.docs)==null?void 0:$.source}}};var J,X,Y;g.parameters={...g.parameters,docs:{...(J=g.parameters)==null?void 0:J.docs,source:{originalSource:`{
|
|
61
|
-
args: {
|
|
62
|
-
required: true
|
|
63
|
-
}
|
|
64
|
-
}`,...(Y=(X=g.parameters)==null?void 0:X.docs)==null?void 0:Y.source}}};var z,G,Q;C.parameters={...C.parameters,docs:{...(z=C.parameters)==null?void 0:z.docs,source:{originalSource:`{
|
|
65
|
-
args: {
|
|
66
|
-
required: true,
|
|
67
|
-
requiredLabel: <Text accent="critical" variant="m-bold">
|
|
68
|
-
Needed
|
|
69
|
-
</Text>
|
|
70
|
-
}
|
|
71
|
-
}`,...(Q=(G=C.parameters)==null?void 0:G.docs)==null?void 0:Q.source}}};var ee,ae,ne;V.parameters={...V.parameters,docs:{...(ee=V.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
72
|
-
args: {
|
|
73
|
-
hideLabel: true
|
|
74
|
-
}
|
|
75
|
-
}`,...(ne=(ae=V.parameters)==null?void 0:ae.docs)==null?void 0:ne.source}}};var te,re,le;b.parameters={...b.parameters,docs:{...(te=b.parameters)==null?void 0:te.docs,source:{originalSource:`{
|
|
76
|
-
args: {
|
|
77
|
-
hasError: true
|
|
78
|
-
}
|
|
79
|
-
}`,...(le=(re=b.parameters)==null?void 0:re.docs)==null?void 0:le.source}}};var ue,se,oe;x.parameters={...x.parameters,docs:{...(ue=x.parameters)==null?void 0:ue.docs,source:{originalSource:`{
|
|
80
|
-
args: {
|
|
81
|
-
hasError: true,
|
|
82
|
-
errorMessage: 'This is an error message'
|
|
83
|
-
}
|
|
84
|
-
}`,...(oe=(se=x.parameters)==null?void 0:se.docs)==null?void 0:oe.source}}};var ie,de,ce;E.parameters={...E.parameters,docs:{...(ie=E.parameters)==null?void 0:ie.docs,source:{originalSource:`{
|
|
85
|
-
args: {
|
|
86
|
-
disabled: true
|
|
87
|
-
}
|
|
88
|
-
}`,...(ce=(de=E.parameters)==null?void 0:de.docs)==null?void 0:ce.source}}};var pe,me,ve;q.parameters={...q.parameters,docs:{...(pe=q.parameters)==null?void 0:pe.docs,source:{originalSource:`{
|
|
89
|
-
args: {
|
|
90
|
-
readOnly: true
|
|
91
|
-
}
|
|
92
|
-
}`,...(ve=(me=q.parameters)==null?void 0:me.docs)==null?void 0:ve.source}}};var fe,ye,he;L.parameters={...L.parameters,docs:{...(fe=L.parameters)==null?void 0:fe.docs,source:{originalSource:`{
|
|
93
|
-
decorators: [(Story, {
|
|
94
|
-
args
|
|
95
|
-
}) => <div style={{
|
|
96
|
-
padding: '8px',
|
|
97
|
-
margin: '8px'
|
|
98
|
-
}}>
|
|
99
|
-
<p>
|
|
100
|
-
You can{' '}
|
|
101
|
-
<Button variant="secondary" dataset={{
|
|
102
|
-
testid: 'focus-button'
|
|
103
|
-
}} onClick={() =>
|
|
104
|
-
// @ts-expect-error - This will fail gracefully,
|
|
105
|
-
// and the \`play\` function will assert it properly
|
|
106
|
-
args.ref?.current?.setFocus()}>
|
|
107
|
-
Focus
|
|
108
|
-
</Button>{' '}
|
|
109
|
-
the input imperatively.
|
|
110
|
-
</p>
|
|
111
|
-
<Story />
|
|
112
|
-
</div>],
|
|
113
|
-
play: async ({
|
|
114
|
-
args,
|
|
115
|
-
canvas
|
|
116
|
-
}) => {
|
|
117
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
118
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
119
|
-
}
|
|
120
|
-
const input = canvas.getByTestId('input');
|
|
121
|
-
args.ref.current.setFocus();
|
|
122
|
-
await waitFor(() => expect(input).toHaveFocus());
|
|
123
|
-
}
|
|
124
|
-
}`,...(he=(ye=L.parameters)==null?void 0:ye.docs)==null?void 0:he.source}}};var we,ge,Ce;I.parameters={...I.parameters,docs:{...(we=I.parameters)==null?void 0:we.docs,source:{originalSource:`{
|
|
125
|
-
decorators: [(Story, {
|
|
126
|
-
args
|
|
127
|
-
}) => <div style={{
|
|
128
|
-
height: '300px',
|
|
129
|
-
overflow: 'scroll',
|
|
130
|
-
padding: '8px',
|
|
131
|
-
margin: '8px'
|
|
132
|
-
}}>
|
|
133
|
-
<p>
|
|
134
|
-
You can{' '}
|
|
135
|
-
<Button variant="secondary" dataset={{
|
|
136
|
-
testid: 'scroll-button'
|
|
137
|
-
}} onClick={() => {
|
|
138
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
139
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
140
|
-
}
|
|
141
|
-
args.ref.current.scrollIntoView();
|
|
142
|
-
}}>
|
|
143
|
-
Scroll
|
|
144
|
-
</Button>{' '}
|
|
145
|
-
the input into view imperatively.
|
|
146
|
-
</p>
|
|
147
|
-
<div style={{
|
|
148
|
-
height: '1000px',
|
|
149
|
-
display: 'flex',
|
|
150
|
-
flexDirection: 'column',
|
|
151
|
-
justifyContent: 'end',
|
|
152
|
-
border: '2px dashed lightgray',
|
|
153
|
-
padding: '16px'
|
|
154
|
-
}}>
|
|
155
|
-
<Story />
|
|
156
|
-
</div>
|
|
157
|
-
</div>],
|
|
158
|
-
play: async ({
|
|
159
|
-
args,
|
|
160
|
-
canvas
|
|
161
|
-
}) => {
|
|
162
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
163
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
164
|
-
}
|
|
165
|
-
const input = canvas.getByTestId('input');
|
|
166
|
-
args.ref.current.scrollIntoView();
|
|
167
|
-
await waitFor(() => expect(input).toBeVisible());
|
|
168
|
-
}
|
|
169
|
-
}`,...(Ce=(ge=I.parameters)==null?void 0:ge.docs)==null?void 0:Ce.source}}};var Ve,be,xe;R.parameters={...R.parameters,docs:{...(Ve=R.parameters)==null?void 0:Ve.docs,source:{originalSource:`{
|
|
170
|
-
tags: ['!test'],
|
|
171
|
-
parameters: {
|
|
172
|
-
docs: {
|
|
173
|
-
description: {
|
|
174
|
-
story: \`
|
|
175
|
-
The following code renders a \\\`PasswordField\\\` with the \\\`required\\\` flag,
|
|
176
|
-
\\\`placeholder\\\` and some \\\`additionalText\\\`.
|
|
177
|
-
|
|
178
|
-
When you click the "Show Password" button, the demo is now in control of the
|
|
179
|
-
\\\`revealValue\\\` prop and the input hides the eye field button.
|
|
180
|
-
\`
|
|
181
|
-
}
|
|
182
|
-
},
|
|
183
|
-
chromatic: {
|
|
184
|
-
disableSnapshot: true
|
|
185
|
-
}
|
|
186
|
-
},
|
|
187
|
-
render: function Story() {
|
|
188
|
-
const [value, setValue] = useState<string | undefined>(undefined);
|
|
189
|
-
const [revealValue, setRevealValue] = useState(false);
|
|
190
|
-
const fieldRef = useRef(null);
|
|
191
|
-
const handleClick = () => {
|
|
192
|
-
setRevealValue(!revealValue);
|
|
193
|
-
};
|
|
194
|
-
return <div style={{
|
|
195
|
-
maxWidth: '500px',
|
|
196
|
-
display: 'flex',
|
|
197
|
-
flexDirection: 'column'
|
|
198
|
-
}}>
|
|
199
|
-
<PasswordField ref={fieldRef} label="Password" showIcon required placeholder="e.g.: abc123%pt0!" additionalText="Include letters, numbers and symbols" revealValue={revealValue} value={value} onValueChange={setValue} />
|
|
200
|
-
<Button onClick={handleClick}>Show Password</Button>
|
|
201
|
-
</div>;
|
|
202
|
-
}
|
|
203
|
-
}`,...(xe=(be=R.parameters)==null?void 0:be.docs)==null?void 0:xe.source}}};const $a=["Basic","WithValue","ValueAlwaysRevealed","WithAdditionalText","Required","RequiredWithCustomLabel","WithHiddenLabel","HasError","HasErrorWithMessage","Disabled","ReadOnly","ImperativeSetFocus","ImperativeScrollIntoView","Example"];export{f as Basic,E as Disabled,R as Example,b as HasError,x as HasErrorWithMessage,I as ImperativeScrollIntoView,L as ImperativeSetFocus,q as ReadOnly,g as Required,C as RequiredWithCustomLabel,h as ValueAlwaysRevealed,w as WithAdditionalText,V as WithHiddenLabel,y as WithValue,$a as __namedExportsOrder,Ua as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._PreplyLogo_1iz4x_2{display:inline-block}._PreplyLogo_1iz4x_2 svg{display:block}._PreplyLogo_1iz4x_2 [data-name=preply] path,._PreplyLogo_1iz4x_2 [data-name=business] path,._PreplyLogo_1iz4x_2 [data-name=logomark]{fill:var(--95b129)}._PreplyLogo--inverted_1iz4x_13 [data-name=preply] path,._PreplyLogo--inverted_1iz4x_13 [data-name=business] path,._PreplyLogo--inverted_1iz4x_13 [data-name=logomark]{fill:var(--e6a034)}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._ProgressSteps_3zjp1_2{display:flex;gap:var(--590b8d);flex-wrap:wrap}._ProgressSteps_3zjp1_2>._step_3zjp1_7{position:relative;box-sizing:border-box;width:var(--7789ee);height:var(--c484d1);border-style:solid;border-color:var(--11d206);border-width:var(--26b8e3)}._ProgressSteps_3zjp1_2>._step_3zjp1_7:after{position:absolute;content:"";top:0;right:0;bottom:0;left:0;transform-origin:left;transform:scaleX(0);background-color:var(--11d206)}._ProgressSteps_3zjp1_2>._step_3zjp1_7[aria-current=step]:after,._ProgressSteps_3zjp1_2>._step_3zjp1_7[aria-current=step]+._step_3zjp1_7[data-active=false]:after{transition:transform .1s ease}._ProgressSteps_3zjp1_2>._step_3zjp1_7[data-active=true]:after{transform:scaleX(1)}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._SelectFieldLayout--input_q4ksr_5{position:relative;background-color:var(--302ecf);border-style:solid;color:var(--41d493);background-color:var(--211bc0);border-color:var(--29cd58);border-width:var(--d9baa3);border-radius:var(--c4b051)}@media (hover: hover) and (pointer: fine){._SelectFieldLayout--input_q4ksr_5:hover{border-color:var(--0bd642)}}._SelectFieldLayout--input_q4ksr_5 select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:none;padding:0;outline:none;font-size:var(--0c62d6);font-weight:var(--cb99be);line-height:var(--829b1e);letter-spacing:var(--035113);font-style:var(--a833d1);font-variation-settings:var(--5bcea1);color:var(--d9209f);padding:calc(var(--d9baa3) + var(--1ba55a));padding-left:calc(var(--477fda) - var(--d9baa3));padding-right:calc(var(--1ba55a) + calc(var(--7c1b1c) + var(--1ba55a)))}._SelectFieldLayout--icon_q4ksr_37{position:absolute;top:calc(var(--d9baa3) + var(--1ba55a));left:calc(var(--477fda) - var(--d9baa3));height:var(--7c1b1c);font-size:0;pointer-events:none}._SelectFieldLayout--icon_q4ksr_37 svg{color:var(--cbc724)}._SelectFieldLayout--dropdown-indicator_q4ksr_48{position:absolute;top:calc(var(--d9baa3) + var(--1ba55a));right:var(--1ba55a);height:var(--7c1b1c);font-size:0;pointer-events:none}._SelectFieldLayout--dropdown-indicator_q4ksr_48 svg{color:var(--cbc724)}._SelectFieldLayout--has-value_q4ksr_59 ._SelectFieldLayout--input_q4ksr_5 select{color:var(--41d493)}._SelectFieldLayout--has-icon_q4ksr_62 ._SelectFieldLayout--input_q4ksr_5 select{padding-left:calc(calc(var(--477fda) - var(--d9baa3)) + var(--7c1b1c) + var(--1ba55a))}._SelectFieldLayout--has-error_q4ksr_65 ._SelectFieldLayout--input_q4ksr_5{background-color:var(--95df5b);border-color:var(--eaf4a3)}._SelectFieldLayout--has-error_q4ksr_65 ._SelectFieldLayout--input_q4ksr_5 input{color:var(--7b0f41)}._SelectFieldLayout--has-error_q4ksr_65 ._SelectFieldLayout--icon_q4ksr_37 svg{color:var(--7b0f41)}._SelectFieldLayout--is-focused_q4ksr_75 ._SelectFieldLayout--input_q4ksr_5{border-color:var(--398094)}._SelectFieldLayout--is-disabled_q4ksr_78 ._SelectFieldLayout--input_q4ksr_5{background-color:var(--04daeb);border-color:transparent}._SelectField_182ji_1{display:flex}
|
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-BTJTZTIL.js";import{r as u}from"./index-Cb9e4tly.js";import{a as c}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{e as k,u as Te,w as Ie}from"./index-BVDq5o4N.js";import{F as _e}from"./TokyoUILanguage-CLpo5Vdq.js";import{B as P}from"./Button-DqwK0S70.js";import{I as W}from"./Icon-BwwIOKM_.js";import{g as Be}from"./index-DdzHuZ-Y.js";import{w as o}from"./componentNames-Bwls0I02.js";import{u as De,I as Oe,s as Pe,F as We}from"./FieldLayoutBase-DQbxDQVA.js";import{m as Re,a as b,b as f}from"./classNames-BUL1Zq7e.js";import{u as Ke}from"./useForcedRef--iGFM41p.js";import{u as Me}from"./useSelectField-Bfc5sABM.js";import{T as Je}from"./Text-CDqVYAcD.js";import"./index-ChsGqxH_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./render-icon-BT0Aq7PA.js";import"./ButtonBase-D31GBWHv.js";import"./Spinner-Dsa9X0G6.js";import"./defaults-B1rzzf6M.js";import"./filterHTMLAttributes-DYdLqcvH.js";import"./useHostname-Y3PlXofY.js";import"./index-CC6DAVyL.js";import"./text-accent-CrnHOlvW.js";import"./FieldAdditionalText-lW7Q1VGp.js";import"./constants-DL6gdbsq.js";import"./index-D1pfvbUR.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-B1DLZQ1U.js";import"./text-centered-1sU8-E1D.js";const p=({...e})=>a.jsx("option",{...e,...Be(void 0,{preplyDsComponent:o.SelectFieldOption})});try{p.displayName="SelectFieldOption",p.__docgenInfo={description:"Use this as a child of `SelectField` to render a `select` option.",displayName:"SelectFieldOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}}}}}catch{}const Xe=({onChange:e,onValueChange:n,children:t,placeholder:l,...i},m)=>{const v=Re(Pe,o.Select),r=De(T=>T.target.value,e,n),{required:d}=i,s=typeof l<"u"?a.jsx("option",{value:"",disabled:d,"aria-hidden":!0,children:l}):null,N=a.jsxs(a.Fragment,{children:[s,t]});return a.jsx(Oe,{...i,ref:m,type:"select",className:v.join(" "),onChange:r,preplyDsComponent:o.Select,children:N})},B=u.forwardRef(Xe);try{B.displayName="Select",B.__docgenInfo={description:"",displayName:"Select",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
|
|
2
|
-
@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-disabled":{defaultValue:null,description:`Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
|
|
3
|
-
@see aria-hidden
|
|
4
|
-
@see aria-readonly.`,name:"aria-disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
|
|
5
|
-
@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-required":{defaultValue:null,description:"Indicates that user input is required on the element before a form may be submitted.",name:"aria-required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<string>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const S={"SelectFieldLayout--input":"_SelectFieldLayout--input_q4ksr_5","SelectFieldLayout--icon":"_SelectFieldLayout--icon_q4ksr_37","SelectFieldLayout--dropdown-indicator":"_SelectFieldLayout--dropdown-indicator_q4ksr_48","SelectFieldLayout--has-value":"_SelectFieldLayout--has-value_q4ksr_59","SelectFieldLayout--has-icon":"_SelectFieldLayout--has-icon_q4ksr_62","SelectFieldLayout--has-error":"_SelectFieldLayout--has-error_q4ksr_65","SelectFieldLayout--is-focused":"_SelectFieldLayout--is-focused_q4ksr_75","SelectFieldLayout--is-disabled":"_SelectFieldLayout--is-disabled_q4ksr_78"},Ae=({title:e,titleId:n,...t},l)=>u.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",ref:l,"aria-labelledby":n,...t},e?u.createElement("title",{id:n},e):null,u.createElement("path",{fillRule:"evenodd",d:"m12 16-6-5.61L7.487 9 12 13.22 16.513 9 18 10.39 12 16Z",clipRule:"evenodd"})),Ue=u.forwardRef(Ae),Ye=({id:e,className:n,input:t,icon:l,disabled:i,isFocused:m,hasError:v,inputHandle:r,onClick:d,hasValue:s,...N},T)=>{const h=u.useRef(null);u.useImperativeHandle(T,()=>({setFocus:()=>r==null?void 0:r.setFocus(),scrollIntoView:()=>{var g;return(g=h==null?void 0:h.current)==null?void 0:g.scrollIntoView()}}));const K=b(S,o.SelectFieldLayout,[f("is-disabled",void 0,i),f("is-focused",void 0,m),f("has-error",void 0,v),f("has-icon",void 0,!!l),f("has-value",void 0,s)]),Le=n?[n,...K]:K,je=b(S,o.SelectFieldLayout,["input"]),He=b(S,o.SelectFieldLayout,["icon"]),ke=b(S,o.SelectFieldLayout,["dropdown-indicator"]),Ne=g=>{r==null||r.setFocus(),d==null||d(g)};return a.jsx(We,{id:e,className:Le.join(" "),disabled:i,isFocused:m,hasError:v,hasValue:s,...N,preplyDsComponent:o.SelectFieldLayout,ref:h,children:a.jsxs("div",{className:je.join(" "),onClick:Ne,children:[l&&a.jsx("span",{style:{lineHeight:"initial"},className:He.join(" "),children:l}),t,a.jsx("span",{style:{lineHeight:"initial"},className:ke.join(" "),children:a.jsx(W,{svg:Ue})})]})})},D=u.forwardRef(Ye);try{D.displayName="SelectFieldLayout",D.__docgenInfo={description:"",displayName:"SelectFieldLayout",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},preplyDsComponent:{defaultValue:null,description:"@see getDatasetProps",name:"preplyDsComponent",required:!1,type:{name:"enum",value:[{value:"string"}]}},label:{defaultValue:null,description:"",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"}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"enum",value:[{value:"string"}]}},hideLabel:{defaultValue:null,description:"",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},additionalText:{defaultValue:null,description:"",name:"additionalText",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},isFocused:{defaultValue:null,description:"",name:"isFocused",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},isTouched:{defaultValue:null,description:"",name:"isTouched",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},isChanged:{defaultValue:null,description:"",name:"isChanged",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasValue:{defaultValue:null,description:"",name:"hasValue",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},input:{defaultValue:null,description:"An `<input>` element.",name:"input",required:!0,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},inputHandle:{defaultValue:null,description:"A ref handle to the `<input>` element, used to manage focus when\nclicking on elements within the layout, such as the button and icon.",name:"inputHandle",required:!0,type:{name:"enum",value:[{value:"null"},{value:"InputImperativeHandle"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<IconProps, string | JSXElementConstructor<any>>"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<FieldButtonProps, string | JSXElementConstructor<any>>"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const $e="_SelectField_182ji_1",ze={SelectField:$e},Ze=({id:e,...n},t)=>{const l=u.useRef(null),i=Ke();u.useImperativeHandle(t,()=>({setFocus:()=>{var s;return(s=l==null?void 0:l.current)==null?void 0:s.setFocus()},scrollIntoView:()=>{var s;return(s=l==null?void 0:l.current)==null?void 0:s.scrollIntoView()}}));const{layoutProps:m,inputProps:v}=Me({id:e,...n},o.SelectField),r=Re(ze,o.SelectField),d=a.jsx(B,{...v,ref:i});return a.jsx(D,{...m,className:r.join(" "),input:d,inputHandle:i.current,ref:l})},y=u.forwardRef(Ze);try{y.displayName="SelectField",y.__docgenInfo={description:"Use this with `SelectFieldOption`s to render a `select` dropdown.\n\nBy default, this field acts as a controlled field and expects the parent\ncomponent to manage the state, by reacting to user input via the `onChange` or\n`onValueChange` props, and providing the latest state via the `value` prop.\n\nAlternatively, you can use it as an uncontrolled field using the\n`defaultValue` prop instead of the `value` prop.",displayName:"SelectField",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},additionalText:{defaultValue:null,description:"",name:"additionalText",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},errorMessage:{defaultValue:null,description:"",name:"errorMessage",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<Element>"}]}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<Element>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<Element>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<Element>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<Element>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"ValueChangeEventHandler<string>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<IconProps, string | JSXElementConstructor<any>>"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: InputImperativeHandle | null) => void"},{value:"RefObject<InputImperativeHandle>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ra={title:"components/SelectField",component:y,subcomponents:{SelectFieldOption:p},args:{label:"Language",placeholder:"Select a language",defaultValue:"",inputDataset:{testid:"input"},onChange:c("onChange"),onBlur:c("onBlur"),onFocus:c("onFocus"),onClick:c("onClick"),onCopy:c("onCopy"),onKeyDown:c("onKeyDown"),onKeyUp:c("onKeyUp"),onPaste:c("onPaste"),onValueChange:c("onValueChange")},render:function(n){const t=u.useRef(null);return n.ref=t,a.jsxs(y,{...n,children:[a.jsx(p,{value:"english",children:"English"}),a.jsx(p,{value:"spanish",children:"Spanish"}),a.jsx(p,{value:"french",children:"French"})]})}},V={parameters:{docs:{description:{story:"An empty field with a `label` and a `placeholder`."}}}},q={args:{defaultValue:"english"},play:async({canvas:e})=>{const n=e.getByTestId("input");return await k(n).toHaveValue("english"),await Te.selectOptions(n,"spanish"),k(n).toHaveValue("spanish")}},x={args:{icon:a.jsx(W,{svg:_e})}},E={args:{additionalText:"This is additional text"}},F={args:{required:!0}},w={args:{required:!0,requiredLabel:a.jsx(Je,{accent:"critical",variant:"m-bold",children:"Needed"})}},C={args:{hideLabel:!0}},I={args:{hasError:!0}},_={args:{hasError:!0,errorMessage:"This is an error message"}},R={args:{disabled:!0}},L={decorators:[(e,{args:n})=>a.jsxs("div",{style:{padding:"8px",margin:"8px"},children:[a.jsxs("p",{children:["You can"," ",a.jsx(P,{variant:"secondary",dataset:{testid:"focus-button"},onClick:()=>{var t,l;return(l=(t=n.ref)==null?void 0:t.current)==null?void 0:l.setFocus()},children:"Focus"})," ","the input imperatively."]}),a.jsx(e,{})]})],play:async({args:e,canvas:n})=>{if(!O(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const t=n.getByTestId("input");e.ref.current.setFocus(),await Ie(()=>k(t).toHaveFocus())}},j={decorators:[(e,{args:n})=>a.jsxs("div",{style:{height:"300px",overflow:"scroll",padding:"8px",margin:"8px"},children:[a.jsxs("p",{children:["You can"," ",a.jsx(P,{variant:"secondary",dataset:{testid:"scroll-button"},onClick:()=>{if(!O(n.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");n.ref.current.scrollIntoView()},children:"Scroll"})," ","the input into view imperatively."]}),a.jsx("div",{style:{height:"1000px",display:"flex",flexDirection:"column",justifyContent:"end",border:"2px dashed lightgray",padding:"16px"},children:a.jsx(e,{})})]})],play:async({args:e,canvas:n})=>{if(!O(e.ref))throw new Error("Expected ref.current to be an InputImperativeHandle");const t=n.getByTestId("input");e.ref.current.scrollIntoView(),await Ie(()=>k(t).toBeVisible())}};function O(e){return typeof e=="object"&&e!==null&&"current"in e&&e.current!==null&&typeof e.current=="object"&&"setFocus"in e.current}const H={tags:["!test"],parameters:{docs:{description:{story:'\nThe following code renders a `SelectField` with the `required` flag,\n`placeholder` and some `additionalText`.\n\nWhen you click the "Submit" button, and the input `value` is empty, it:\n\n- Displays feedback via the `errorMessage` prop;\n- Brings the focus back to the field.\n'}},chromatic:{disableSnapshot:!0}},render:function(n){const[t,l]=u.useState(void 0),[i,m]=u.useState(!1),v=i&&!t&&"Please select an option",r=u.useRef(null),d=()=>{var s;m(!0),t||(s=r==null?void 0:r.current)==null||s.setFocus()};return a.jsxs("div",{style:{maxWidth:"500px",display:"flex",flexDirection:"column"},children:[a.jsxs(y,{...n,value:t,required:!0,icon:a.jsx(W,{svg:_e,label:"Student with a hat"}),placeholder:"Select a subject",additionalText:"We will use this to get a personalized choice of tutors",onValueChange:l,errorMessage:v,ref:r,children:[a.jsx(p,{value:"english",children:"English"}),a.jsx(p,{value:"spanish",children:"Spanish"}),a.jsx(p,{value:"french",children:"French"})]}),a.jsx(P,{onClick:()=>d(),children:"Submit"})]})}};var M,J,X;V.parameters={...V.parameters,docs:{...(M=V.parameters)==null?void 0:M.docs,source:{originalSource:`{
|
|
6
|
-
parameters: {
|
|
7
|
-
docs: {
|
|
8
|
-
description: {
|
|
9
|
-
story: \`An empty field with a \\\`label\\\` and a \\\`placeholder\\\`.\`
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
}`,...(X=(J=V.parameters)==null?void 0:J.docs)==null?void 0:X.source}}};var A,U,Y;q.parameters={...q.parameters,docs:{...(A=q.parameters)==null?void 0:A.docs,source:{originalSource:`{
|
|
14
|
-
args: {
|
|
15
|
-
defaultValue: 'english'
|
|
16
|
-
},
|
|
17
|
-
play: async ({
|
|
18
|
-
canvas
|
|
19
|
-
}) => {
|
|
20
|
-
const input = canvas.getByTestId('input');
|
|
21
|
-
await expect(input).toHaveValue('english');
|
|
22
|
-
await userEvent.selectOptions(input, 'spanish');
|
|
23
|
-
return expect(input).toHaveValue('spanish');
|
|
24
|
-
}
|
|
25
|
-
}`,...(Y=(U=q.parameters)==null?void 0:U.docs)==null?void 0:Y.source}}};var $,z,Z;x.parameters={...x.parameters,docs:{...($=x.parameters)==null?void 0:$.docs,source:{originalSource:`{
|
|
26
|
-
args: {
|
|
27
|
-
icon: <Icon svg={LanguageSvg} />
|
|
28
|
-
}
|
|
29
|
-
}`,...(Z=(z=x.parameters)==null?void 0:z.docs)==null?void 0:Z.source}}};var G,Q,ee;E.parameters={...E.parameters,docs:{...(G=E.parameters)==null?void 0:G.docs,source:{originalSource:`{
|
|
30
|
-
args: {
|
|
31
|
-
additionalText: 'This is additional text'
|
|
32
|
-
}
|
|
33
|
-
}`,...(ee=(Q=E.parameters)==null?void 0:Q.docs)==null?void 0:ee.source}}};var ae,ne,le;F.parameters={...F.parameters,docs:{...(ae=F.parameters)==null?void 0:ae.docs,source:{originalSource:`{
|
|
34
|
-
args: {
|
|
35
|
-
required: true
|
|
36
|
-
}
|
|
37
|
-
}`,...(le=(ne=F.parameters)==null?void 0:ne.docs)==null?void 0:le.source}}};var te,re,ue;w.parameters={...w.parameters,docs:{...(te=w.parameters)==null?void 0:te.docs,source:{originalSource:`{
|
|
38
|
-
args: {
|
|
39
|
-
required: true,
|
|
40
|
-
requiredLabel: <Text accent="critical" variant="m-bold">
|
|
41
|
-
Needed
|
|
42
|
-
</Text>
|
|
43
|
-
}
|
|
44
|
-
}`,...(ue=(re=w.parameters)==null?void 0:re.docs)==null?void 0:ue.source}}};var se,ie,oe;C.parameters={...C.parameters,docs:{...(se=C.parameters)==null?void 0:se.docs,source:{originalSource:`{
|
|
45
|
-
args: {
|
|
46
|
-
hideLabel: true
|
|
47
|
-
}
|
|
48
|
-
}`,...(oe=(ie=C.parameters)==null?void 0:ie.docs)==null?void 0:oe.source}}};var de,ce,pe;I.parameters={...I.parameters,docs:{...(de=I.parameters)==null?void 0:de.docs,source:{originalSource:`{
|
|
49
|
-
args: {
|
|
50
|
-
hasError: true
|
|
51
|
-
}
|
|
52
|
-
}`,...(pe=(ce=I.parameters)==null?void 0:ce.docs)==null?void 0:pe.source}}};var me,ve,fe;_.parameters={..._.parameters,docs:{...(me=_.parameters)==null?void 0:me.docs,source:{originalSource:`{
|
|
53
|
-
args: {
|
|
54
|
-
hasError: true,
|
|
55
|
-
errorMessage: 'This is an error message'
|
|
56
|
-
}
|
|
57
|
-
}`,...(fe=(ve=_.parameters)==null?void 0:ve.docs)==null?void 0:fe.source}}};var ye,he,ge;R.parameters={...R.parameters,docs:{...(ye=R.parameters)==null?void 0:ye.docs,source:{originalSource:`{
|
|
58
|
-
args: {
|
|
59
|
-
disabled: true
|
|
60
|
-
}
|
|
61
|
-
}`,...(ge=(he=R.parameters)==null?void 0:he.docs)==null?void 0:ge.source}}};var be,Se,Ve;L.parameters={...L.parameters,docs:{...(be=L.parameters)==null?void 0:be.docs,source:{originalSource:`{
|
|
62
|
-
decorators: [(Story, {
|
|
63
|
-
args
|
|
64
|
-
}) => <div style={{
|
|
65
|
-
padding: '8px',
|
|
66
|
-
margin: '8px'
|
|
67
|
-
}}>
|
|
68
|
-
<p>
|
|
69
|
-
You can{' '}
|
|
70
|
-
<Button variant="secondary" dataset={{
|
|
71
|
-
testid: 'focus-button'
|
|
72
|
-
}} onClick={() =>
|
|
73
|
-
// @ts-expect-error - This will fail gracefully,
|
|
74
|
-
// and the \`play\` function will assert it properly
|
|
75
|
-
args.ref?.current?.setFocus()}>
|
|
76
|
-
Focus
|
|
77
|
-
</Button>{' '}
|
|
78
|
-
the input imperatively.
|
|
79
|
-
</p>
|
|
80
|
-
<Story />
|
|
81
|
-
</div>],
|
|
82
|
-
play: async ({
|
|
83
|
-
args,
|
|
84
|
-
canvas
|
|
85
|
-
}) => {
|
|
86
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
87
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
88
|
-
}
|
|
89
|
-
const input = canvas.getByTestId('input');
|
|
90
|
-
args.ref.current.setFocus();
|
|
91
|
-
await waitFor(() => expect(input).toHaveFocus());
|
|
92
|
-
}
|
|
93
|
-
}`,...(Ve=(Se=L.parameters)==null?void 0:Se.docs)==null?void 0:Ve.source}}};var qe,xe,Ee;j.parameters={...j.parameters,docs:{...(qe=j.parameters)==null?void 0:qe.docs,source:{originalSource:`{
|
|
94
|
-
decorators: [(Story, {
|
|
95
|
-
args
|
|
96
|
-
}) => <div style={{
|
|
97
|
-
height: '300px',
|
|
98
|
-
overflow: 'scroll',
|
|
99
|
-
padding: '8px',
|
|
100
|
-
margin: '8px'
|
|
101
|
-
}}>
|
|
102
|
-
<p>
|
|
103
|
-
You can{' '}
|
|
104
|
-
<Button variant="secondary" dataset={{
|
|
105
|
-
testid: 'scroll-button'
|
|
106
|
-
}} onClick={() => {
|
|
107
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
108
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
109
|
-
}
|
|
110
|
-
args.ref.current.scrollIntoView();
|
|
111
|
-
}}>
|
|
112
|
-
Scroll
|
|
113
|
-
</Button>{' '}
|
|
114
|
-
the input into view imperatively.
|
|
115
|
-
</p>
|
|
116
|
-
<div style={{
|
|
117
|
-
height: '1000px',
|
|
118
|
-
display: 'flex',
|
|
119
|
-
flexDirection: 'column',
|
|
120
|
-
justifyContent: 'end',
|
|
121
|
-
border: '2px dashed lightgray',
|
|
122
|
-
padding: '16px'
|
|
123
|
-
}}>
|
|
124
|
-
<Story />
|
|
125
|
-
</div>
|
|
126
|
-
</div>],
|
|
127
|
-
play: async ({
|
|
128
|
-
args,
|
|
129
|
-
canvas
|
|
130
|
-
}) => {
|
|
131
|
-
if (!isImperativeHandleRef(args.ref)) {
|
|
132
|
-
throw new Error('Expected ref.current to be an InputImperativeHandle');
|
|
133
|
-
}
|
|
134
|
-
const input = canvas.getByTestId('input');
|
|
135
|
-
args.ref.current.scrollIntoView();
|
|
136
|
-
await waitFor(() => expect(input).toBeVisible());
|
|
137
|
-
}
|
|
138
|
-
}`,...(Ee=(xe=j.parameters)==null?void 0:xe.docs)==null?void 0:Ee.source}}};var Fe,we,Ce;H.parameters={...H.parameters,docs:{...(Fe=H.parameters)==null?void 0:Fe.docs,source:{originalSource:`{
|
|
139
|
-
tags: ['!test'],
|
|
140
|
-
parameters: {
|
|
141
|
-
docs: {
|
|
142
|
-
description: {
|
|
143
|
-
story: \`
|
|
144
|
-
The following code renders a \\\`SelectField\\\` with the \\\`required\\\` flag,
|
|
145
|
-
\\\`placeholder\\\` and some \\\`additionalText\\\`.
|
|
146
|
-
|
|
147
|
-
When you click the "Submit" button, and the input \\\`value\\\` is empty, it:
|
|
148
|
-
|
|
149
|
-
- Displays feedback via the \\\`errorMessage\\\` prop;
|
|
150
|
-
- Brings the focus back to the field.
|
|
151
|
-
\`
|
|
152
|
-
}
|
|
153
|
-
},
|
|
154
|
-
chromatic: {
|
|
155
|
-
disableSnapshot: true
|
|
156
|
-
}
|
|
157
|
-
},
|
|
158
|
-
render: function Story(args) {
|
|
159
|
-
const [value, setValue] = useState<string | undefined>(undefined);
|
|
160
|
-
const [submited, setSubmitted] = useState(false);
|
|
161
|
-
const errorMessage = submited && !value && 'Please select an option';
|
|
162
|
-
const fieldRef = useRef<InputImperativeHandle>(null);
|
|
163
|
-
const handleClick = () => {
|
|
164
|
-
setSubmitted(true);
|
|
165
|
-
if (!value) {
|
|
166
|
-
fieldRef?.current?.setFocus();
|
|
167
|
-
}
|
|
168
|
-
};
|
|
169
|
-
return <div style={{
|
|
170
|
-
maxWidth: '500px',
|
|
171
|
-
display: 'flex',
|
|
172
|
-
flexDirection: 'column'
|
|
173
|
-
}}>
|
|
174
|
-
<SelectField {...args} value={value} required icon={<Icon svg={LanguageSvg} label="Student with a hat" />} placeholder="Select a subject" additionalText="We will use this to get a personalized choice of tutors" onValueChange={setValue} errorMessage={errorMessage} ref={fieldRef}>
|
|
175
|
-
<SelectFieldOption value="english">English</SelectFieldOption>
|
|
176
|
-
<SelectFieldOption value="spanish">Spanish</SelectFieldOption>
|
|
177
|
-
<SelectFieldOption value="french">French</SelectFieldOption>
|
|
178
|
-
</SelectField>
|
|
179
|
-
<Button onClick={() => handleClick()}>Submit</Button>
|
|
180
|
-
</div>;
|
|
181
|
-
}
|
|
182
|
-
}`,...(Ce=(we=H.parameters)==null?void 0:we.docs)==null?void 0:Ce.source}}};const La=["Basic","WithValue","WithIcon","WithAdditionalText","Required","RequiredWithCustomLabel","WithHiddenLabel","HasError","HasErrorWithMessage","Disabled","ImperativeSetFocus","ImperativeScrollIntoView","Example"];export{V as Basic,R as Disabled,H as Example,I as HasError,_ as HasErrorWithMessage,j as ImperativeScrollIntoView,L as ImperativeSetFocus,F as Required,w as RequiredWithCustomLabel,E as WithAdditionalText,C as WithHiddenLabel,x as WithIcon,q as WithValue,La as __namedExportsOrder,Ra as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
@keyframes _spin_8qno6_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._Spinner_8qno6_12{display:inline-flex}._Spinner--size-default_8qno6_15>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--size-large_8qno6_19>*{width:var(--77547f);height:var(--77547f)}@media (min-width: 400px){._Spinner--narrow-l--size-default_8qno6_24>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--narrow-l--size-large_8qno6_28>*{width:var(--77547f);height:var(--77547f)}}@media (min-width: 700px){._Spinner--medium-s--size-default_8qno6_34>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--medium-s--size-large_8qno6_38>*{width:var(--77547f);height:var(--77547f)}}@media (min-width: 880px){._Spinner--medium-l--size-default_8qno6_44>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--medium-l--size-large_8qno6_48>*{width:var(--77547f);height:var(--77547f)}}@media (min-width: 1200px){._Spinner--wide-s--size-default_8qno6_54>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--wide-s--size-large_8qno6_58>*{width:var(--77547f);height:var(--77547f)}}@media (min-width: 1900px){._Spinner--wide-l--size-default_8qno6_64>*{width:var(--9270b5);height:var(--9270b5)}._Spinner--wide-l--size-large_8qno6_68>*{width:var(--77547f);height:var(--77547f)}}._Spinner--static_8qno6_73{display:none}._Spinner--static_8qno6_73 svg{fill:currentColor}._Spinner--animated_8qno6_79{display:inline-flex}._Spinner--animated_8qno6_79 svg{stroke:currentColor;stroke-linecap:round;stroke-width:3px;animation:_spin_8qno6_1 1s cubic-bezier(.46,.17,.58,.87) infinite}@media (prefers-reduced-motion){._Spinner--static_8qno6_73{display:inline-flex}._Spinner--animated_8qno6_79{display:none}}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._steps_1tnqz_2[aria-busy=true]{cursor:wait}._steps_1tnqz_2>._content_1tnqz_5{margin-top:var(--558c4c)}._steps_1tnqz_2>._content_1tnqz_5>._header_1tnqz_8{display:flex;flex-direction:column;gap:var(--66b80b);margin-bottom:var(--558c4c)}._steps_1tnqz_2>._content_1tnqz_5>._header_1tnqz_8>._description_1tnqz_14{font-size:var(--9c8f04);font-weight:var(--1bc44d);line-height:var(--3dd5bc);color:var(--3d280d);margin:0}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as h}from"./jsx-runtime-BTJTZTIL.js";import{r as N}from"./index-Cb9e4tly.js";import{g as V,a as q}from"./text-accent-CrnHOlvW.js";import{g as A}from"./text-centered-1sU8-E1D.js";import{f as D}from"./filterHTMLAttributes-DYdLqcvH.js";import{m as E,s as l,b as R}from"./classNames-BUL1Zq7e.js";import{w as m}from"./componentNames-Bwls0I02.js";import{g as j}from"./index-DdzHuZ-Y.js";import{T as k,b as L}from"./defaults-B1rzzf6M.js";const P="_Text_1mpi8_4",U={Text:P,"Text--variant-caption-regular":"_Text--variant-caption-regular_1mpi8_12","Text--variant-caption-semibold":"_Text--variant-caption-semibold_1mpi8_20","Text--variant-small-regular":"_Text--variant-small-regular_1mpi8_28","Text--variant-small-regular-italic":"_Text--variant-small-regular-italic_1mpi8_36","Text--variant-small-semibold":"_Text--variant-small-semibold_1mpi8_44","Text--variant-small-semibold-italic":"_Text--variant-small-semibold-italic_1mpi8_52","Text--variant-default-regular":"_Text--variant-default-regular_1mpi8_60","Text--variant-default-regular-italic":"_Text--variant-default-regular-italic_1mpi8_68","Text--variant-default-semibold":"_Text--variant-default-semibold_1mpi8_76","Text--variant-default-semibold-italic":"_Text--variant-default-semibold-italic_1mpi8_84","Text--variant-large-regular":"_Text--variant-large-regular_1mpi8_92","Text--variant-large-regular-italic":"_Text--variant-large-regular-italic_1mpi8_100","Text--variant-large-semibold":"_Text--variant-large-semibold_1mpi8_108","Text--variant-large-semibold-italic":"_Text--variant-large-semibold-italic_1mpi8_116","Text--variant-xs":"_Text--variant-xs_1mpi8_124","Text--variant-xs-medium":"_Text--variant-xs-medium_1mpi8_132","Text--variant-s":"_Text--variant-s_1mpi8_28","Text--variant-s-italic":"_Text--variant-s-italic_1mpi8_148","Text--variant-s-medium":"_Text--variant-s-medium_1mpi8_156","Text--variant-s-medium-italic":"_Text--variant-s-medium-italic_1mpi8_164","Text--variant-s-bold":"_Text--variant-s-bold_1mpi8_172","Text--variant-s-bold-italic":"_Text--variant-s-bold-italic_1mpi8_180","Text--variant-m":"_Text--variant-m_1mpi8_188","Text--variant-m-italic":"_Text--variant-m-italic_1mpi8_196","Text--variant-m-medium":"_Text--variant-m-medium_1mpi8_204","Text--variant-m-medium-italic":"_Text--variant-m-medium-italic_1mpi8_212","Text--variant-m-bold":"_Text--variant-m-bold_1mpi8_220","Text--variant-m-bold-italic":"_Text--variant-m-bold-italic_1mpi8_228","Text--variant-l":"_Text--variant-l_1mpi8_92","Text--variant-l-italic":"_Text--variant-l-italic_1mpi8_244","Text--variant-l-medium":"_Text--variant-l-medium_1mpi8_252","Text--variant-l-medium-italic":"_Text--variant-l-medium-italic_1mpi8_260","Text--variant-xl":"_Text--variant-xl_1mpi8_268","Text--variant-xl-italic":"_Text--variant-xl-italic_1mpi8_276","Text--variant-xl-medium":"_Text--variant-xl-medium_1mpi8_284","Text--variant-xl-medium-italic":"_Text--variant-xl-medium-italic_1mpi8_292","Text--narrow-l--variant-caption-regular":"_Text--narrow-l--variant-caption-regular_1mpi8_301","Text--narrow-l--variant-caption-semibold":"_Text--narrow-l--variant-caption-semibold_1mpi8_309","Text--narrow-l--variant-small-regular":"_Text--narrow-l--variant-small-regular_1mpi8_317","Text--narrow-l--variant-small-regular-italic":"_Text--narrow-l--variant-small-regular-italic_1mpi8_325","Text--narrow-l--variant-small-semibold":"_Text--narrow-l--variant-small-semibold_1mpi8_333","Text--narrow-l--variant-small-semibold-italic":"_Text--narrow-l--variant-small-semibold-italic_1mpi8_341","Text--narrow-l--variant-default-regular":"_Text--narrow-l--variant-default-regular_1mpi8_349","Text--narrow-l--variant-default-regular-italic":"_Text--narrow-l--variant-default-regular-italic_1mpi8_357","Text--narrow-l--variant-default-semibold":"_Text--narrow-l--variant-default-semibold_1mpi8_365","Text--narrow-l--variant-default-semibold-italic":"_Text--narrow-l--variant-default-semibold-italic_1mpi8_373","Text--narrow-l--variant-large-regular":"_Text--narrow-l--variant-large-regular_1mpi8_381","Text--narrow-l--variant-large-regular-italic":"_Text--narrow-l--variant-large-regular-italic_1mpi8_389","Text--narrow-l--variant-large-semibold":"_Text--narrow-l--variant-large-semibold_1mpi8_397","Text--narrow-l--variant-large-semibold-italic":"_Text--narrow-l--variant-large-semibold-italic_1mpi8_405","Text--narrow-l--variant-xs":"_Text--narrow-l--variant-xs_1mpi8_413","Text--narrow-l--variant-xs-medium":"_Text--narrow-l--variant-xs-medium_1mpi8_421","Text--narrow-l--variant-s":"_Text--narrow-l--variant-s_1mpi8_317","Text--narrow-l--variant-s-italic":"_Text--narrow-l--variant-s-italic_1mpi8_437","Text--narrow-l--variant-s-medium":"_Text--narrow-l--variant-s-medium_1mpi8_445","Text--narrow-l--variant-s-medium-italic":"_Text--narrow-l--variant-s-medium-italic_1mpi8_453","Text--narrow-l--variant-s-bold":"_Text--narrow-l--variant-s-bold_1mpi8_461","Text--narrow-l--variant-s-bold-italic":"_Text--narrow-l--variant-s-bold-italic_1mpi8_469","Text--narrow-l--variant-m":"_Text--narrow-l--variant-m_1mpi8_477","Text--narrow-l--variant-m-italic":"_Text--narrow-l--variant-m-italic_1mpi8_485","Text--narrow-l--variant-m-medium":"_Text--narrow-l--variant-m-medium_1mpi8_493","Text--narrow-l--variant-m-medium-italic":"_Text--narrow-l--variant-m-medium-italic_1mpi8_501","Text--narrow-l--variant-m-bold":"_Text--narrow-l--variant-m-bold_1mpi8_509","Text--narrow-l--variant-m-bold-italic":"_Text--narrow-l--variant-m-bold-italic_1mpi8_517","Text--narrow-l--variant-l":"_Text--narrow-l--variant-l_1mpi8_381","Text--narrow-l--variant-l-italic":"_Text--narrow-l--variant-l-italic_1mpi8_533","Text--narrow-l--variant-l-medium":"_Text--narrow-l--variant-l-medium_1mpi8_541","Text--narrow-l--variant-l-medium-italic":"_Text--narrow-l--variant-l-medium-italic_1mpi8_549","Text--narrow-l--variant-xl":"_Text--narrow-l--variant-xl_1mpi8_557","Text--narrow-l--variant-xl-italic":"_Text--narrow-l--variant-xl-italic_1mpi8_565","Text--narrow-l--variant-xl-medium":"_Text--narrow-l--variant-xl-medium_1mpi8_573","Text--narrow-l--variant-xl-medium-italic":"_Text--narrow-l--variant-xl-medium-italic_1mpi8_581","Text--medium-s--variant-caption-regular":"_Text--medium-s--variant-caption-regular_1mpi8_591","Text--medium-s--variant-caption-semibold":"_Text--medium-s--variant-caption-semibold_1mpi8_599","Text--medium-s--variant-small-regular":"_Text--medium-s--variant-small-regular_1mpi8_607","Text--medium-s--variant-small-regular-italic":"_Text--medium-s--variant-small-regular-italic_1mpi8_615","Text--medium-s--variant-small-semibold":"_Text--medium-s--variant-small-semibold_1mpi8_623","Text--medium-s--variant-small-semibold-italic":"_Text--medium-s--variant-small-semibold-italic_1mpi8_631","Text--medium-s--variant-default-regular":"_Text--medium-s--variant-default-regular_1mpi8_639","Text--medium-s--variant-default-regular-italic":"_Text--medium-s--variant-default-regular-italic_1mpi8_647","Text--medium-s--variant-default-semibold":"_Text--medium-s--variant-default-semibold_1mpi8_655","Text--medium-s--variant-default-semibold-italic":"_Text--medium-s--variant-default-semibold-italic_1mpi8_663","Text--medium-s--variant-large-regular":"_Text--medium-s--variant-large-regular_1mpi8_671","Text--medium-s--variant-large-regular-italic":"_Text--medium-s--variant-large-regular-italic_1mpi8_679","Text--medium-s--variant-large-semibold":"_Text--medium-s--variant-large-semibold_1mpi8_687","Text--medium-s--variant-large-semibold-italic":"_Text--medium-s--variant-large-semibold-italic_1mpi8_695","Text--medium-s--variant-xs":"_Text--medium-s--variant-xs_1mpi8_703","Text--medium-s--variant-xs-medium":"_Text--medium-s--variant-xs-medium_1mpi8_711","Text--medium-s--variant-s":"_Text--medium-s--variant-s_1mpi8_607","Text--medium-s--variant-s-italic":"_Text--medium-s--variant-s-italic_1mpi8_727","Text--medium-s--variant-s-medium":"_Text--medium-s--variant-s-medium_1mpi8_735","Text--medium-s--variant-s-medium-italic":"_Text--medium-s--variant-s-medium-italic_1mpi8_743","Text--medium-s--variant-s-bold":"_Text--medium-s--variant-s-bold_1mpi8_751","Text--medium-s--variant-s-bold-italic":"_Text--medium-s--variant-s-bold-italic_1mpi8_759","Text--medium-s--variant-m":"_Text--medium-s--variant-m_1mpi8_767","Text--medium-s--variant-m-italic":"_Text--medium-s--variant-m-italic_1mpi8_775","Text--medium-s--variant-m-medium":"_Text--medium-s--variant-m-medium_1mpi8_783","Text--medium-s--variant-m-medium-italic":"_Text--medium-s--variant-m-medium-italic_1mpi8_791","Text--medium-s--variant-m-bold":"_Text--medium-s--variant-m-bold_1mpi8_799","Text--medium-s--variant-m-bold-italic":"_Text--medium-s--variant-m-bold-italic_1mpi8_807","Text--medium-s--variant-l":"_Text--medium-s--variant-l_1mpi8_671","Text--medium-s--variant-l-italic":"_Text--medium-s--variant-l-italic_1mpi8_823","Text--medium-s--variant-l-medium":"_Text--medium-s--variant-l-medium_1mpi8_831","Text--medium-s--variant-l-medium-italic":"_Text--medium-s--variant-l-medium-italic_1mpi8_839","Text--medium-s--variant-xl":"_Text--medium-s--variant-xl_1mpi8_847","Text--medium-s--variant-xl-italic":"_Text--medium-s--variant-xl-italic_1mpi8_855","Text--medium-s--variant-xl-medium":"_Text--medium-s--variant-xl-medium_1mpi8_863","Text--medium-s--variant-xl-medium-italic":"_Text--medium-s--variant-xl-medium-italic_1mpi8_871","Text--medium-l--variant-caption-regular":"_Text--medium-l--variant-caption-regular_1mpi8_881","Text--medium-l--variant-caption-semibold":"_Text--medium-l--variant-caption-semibold_1mpi8_889","Text--medium-l--variant-small-regular":"_Text--medium-l--variant-small-regular_1mpi8_897","Text--medium-l--variant-small-regular-italic":"_Text--medium-l--variant-small-regular-italic_1mpi8_905","Text--medium-l--variant-small-semibold":"_Text--medium-l--variant-small-semibold_1mpi8_913","Text--medium-l--variant-small-semibold-italic":"_Text--medium-l--variant-small-semibold-italic_1mpi8_921","Text--medium-l--variant-default-regular":"_Text--medium-l--variant-default-regular_1mpi8_929","Text--medium-l--variant-default-regular-italic":"_Text--medium-l--variant-default-regular-italic_1mpi8_937","Text--medium-l--variant-default-semibold":"_Text--medium-l--variant-default-semibold_1mpi8_945","Text--medium-l--variant-default-semibold-italic":"_Text--medium-l--variant-default-semibold-italic_1mpi8_953","Text--medium-l--variant-large-regular":"_Text--medium-l--variant-large-regular_1mpi8_961","Text--medium-l--variant-large-regular-italic":"_Text--medium-l--variant-large-regular-italic_1mpi8_969","Text--medium-l--variant-large-semibold":"_Text--medium-l--variant-large-semibold_1mpi8_977","Text--medium-l--variant-large-semibold-italic":"_Text--medium-l--variant-large-semibold-italic_1mpi8_985","Text--medium-l--variant-xs":"_Text--medium-l--variant-xs_1mpi8_993","Text--medium-l--variant-xs-medium":"_Text--medium-l--variant-xs-medium_1mpi8_1001","Text--medium-l--variant-s":"_Text--medium-l--variant-s_1mpi8_897","Text--medium-l--variant-s-italic":"_Text--medium-l--variant-s-italic_1mpi8_1017","Text--medium-l--variant-s-medium":"_Text--medium-l--variant-s-medium_1mpi8_1025","Text--medium-l--variant-s-medium-italic":"_Text--medium-l--variant-s-medium-italic_1mpi8_1033","Text--medium-l--variant-s-bold":"_Text--medium-l--variant-s-bold_1mpi8_1041","Text--medium-l--variant-s-bold-italic":"_Text--medium-l--variant-s-bold-italic_1mpi8_1049","Text--medium-l--variant-m":"_Text--medium-l--variant-m_1mpi8_1057","Text--medium-l--variant-m-italic":"_Text--medium-l--variant-m-italic_1mpi8_1065","Text--medium-l--variant-m-medium":"_Text--medium-l--variant-m-medium_1mpi8_1073","Text--medium-l--variant-m-medium-italic":"_Text--medium-l--variant-m-medium-italic_1mpi8_1081","Text--medium-l--variant-m-bold":"_Text--medium-l--variant-m-bold_1mpi8_1089","Text--medium-l--variant-m-bold-italic":"_Text--medium-l--variant-m-bold-italic_1mpi8_1097","Text--medium-l--variant-l":"_Text--medium-l--variant-l_1mpi8_961","Text--medium-l--variant-l-italic":"_Text--medium-l--variant-l-italic_1mpi8_1113","Text--medium-l--variant-l-medium":"_Text--medium-l--variant-l-medium_1mpi8_1121","Text--medium-l--variant-l-medium-italic":"_Text--medium-l--variant-l-medium-italic_1mpi8_1129","Text--medium-l--variant-xl":"_Text--medium-l--variant-xl_1mpi8_1137","Text--medium-l--variant-xl-italic":"_Text--medium-l--variant-xl-italic_1mpi8_1145","Text--medium-l--variant-xl-medium":"_Text--medium-l--variant-xl-medium_1mpi8_1153","Text--medium-l--variant-xl-medium-italic":"_Text--medium-l--variant-xl-medium-italic_1mpi8_1161","Text--wide-s--variant-caption-regular":"_Text--wide-s--variant-caption-regular_1mpi8_1171","Text--wide-s--variant-caption-semibold":"_Text--wide-s--variant-caption-semibold_1mpi8_1179","Text--wide-s--variant-small-regular":"_Text--wide-s--variant-small-regular_1mpi8_1187","Text--wide-s--variant-small-regular-italic":"_Text--wide-s--variant-small-regular-italic_1mpi8_1195","Text--wide-s--variant-small-semibold":"_Text--wide-s--variant-small-semibold_1mpi8_1203","Text--wide-s--variant-small-semibold-italic":"_Text--wide-s--variant-small-semibold-italic_1mpi8_1211","Text--wide-s--variant-default-regular":"_Text--wide-s--variant-default-regular_1mpi8_1219","Text--wide-s--variant-default-regular-italic":"_Text--wide-s--variant-default-regular-italic_1mpi8_1227","Text--wide-s--variant-default-semibold":"_Text--wide-s--variant-default-semibold_1mpi8_1235","Text--wide-s--variant-default-semibold-italic":"_Text--wide-s--variant-default-semibold-italic_1mpi8_1243","Text--wide-s--variant-large-regular":"_Text--wide-s--variant-large-regular_1mpi8_1251","Text--wide-s--variant-large-regular-italic":"_Text--wide-s--variant-large-regular-italic_1mpi8_1259","Text--wide-s--variant-large-semibold":"_Text--wide-s--variant-large-semibold_1mpi8_1267","Text--wide-s--variant-large-semibold-italic":"_Text--wide-s--variant-large-semibold-italic_1mpi8_1275","Text--wide-s--variant-xs":"_Text--wide-s--variant-xs_1mpi8_1283","Text--wide-s--variant-xs-medium":"_Text--wide-s--variant-xs-medium_1mpi8_1291","Text--wide-s--variant-s":"_Text--wide-s--variant-s_1mpi8_1187","Text--wide-s--variant-s-italic":"_Text--wide-s--variant-s-italic_1mpi8_1307","Text--wide-s--variant-s-medium":"_Text--wide-s--variant-s-medium_1mpi8_1315","Text--wide-s--variant-s-medium-italic":"_Text--wide-s--variant-s-medium-italic_1mpi8_1323","Text--wide-s--variant-s-bold":"_Text--wide-s--variant-s-bold_1mpi8_1331","Text--wide-s--variant-s-bold-italic":"_Text--wide-s--variant-s-bold-italic_1mpi8_1339","Text--wide-s--variant-m":"_Text--wide-s--variant-m_1mpi8_1347","Text--wide-s--variant-m-italic":"_Text--wide-s--variant-m-italic_1mpi8_1355","Text--wide-s--variant-m-medium":"_Text--wide-s--variant-m-medium_1mpi8_1363","Text--wide-s--variant-m-medium-italic":"_Text--wide-s--variant-m-medium-italic_1mpi8_1371","Text--wide-s--variant-m-bold":"_Text--wide-s--variant-m-bold_1mpi8_1379","Text--wide-s--variant-m-bold-italic":"_Text--wide-s--variant-m-bold-italic_1mpi8_1387","Text--wide-s--variant-l":"_Text--wide-s--variant-l_1mpi8_1251","Text--wide-s--variant-l-italic":"_Text--wide-s--variant-l-italic_1mpi8_1403","Text--wide-s--variant-l-medium":"_Text--wide-s--variant-l-medium_1mpi8_1411","Text--wide-s--variant-l-medium-italic":"_Text--wide-s--variant-l-medium-italic_1mpi8_1419","Text--wide-s--variant-xl":"_Text--wide-s--variant-xl_1mpi8_1427","Text--wide-s--variant-xl-italic":"_Text--wide-s--variant-xl-italic_1mpi8_1435","Text--wide-s--variant-xl-medium":"_Text--wide-s--variant-xl-medium_1mpi8_1443","Text--wide-s--variant-xl-medium-italic":"_Text--wide-s--variant-xl-medium-italic_1mpi8_1451","Text--wide-l--variant-caption-regular":"_Text--wide-l--variant-caption-regular_1mpi8_1461","Text--wide-l--variant-caption-semibold":"_Text--wide-l--variant-caption-semibold_1mpi8_1469","Text--wide-l--variant-small-regular":"_Text--wide-l--variant-small-regular_1mpi8_1477","Text--wide-l--variant-small-regular-italic":"_Text--wide-l--variant-small-regular-italic_1mpi8_1485","Text--wide-l--variant-small-semibold":"_Text--wide-l--variant-small-semibold_1mpi8_1493","Text--wide-l--variant-small-semibold-italic":"_Text--wide-l--variant-small-semibold-italic_1mpi8_1501","Text--wide-l--variant-default-regular":"_Text--wide-l--variant-default-regular_1mpi8_1509","Text--wide-l--variant-default-regular-italic":"_Text--wide-l--variant-default-regular-italic_1mpi8_1517","Text--wide-l--variant-default-semibold":"_Text--wide-l--variant-default-semibold_1mpi8_1525","Text--wide-l--variant-default-semibold-italic":"_Text--wide-l--variant-default-semibold-italic_1mpi8_1533","Text--wide-l--variant-large-regular":"_Text--wide-l--variant-large-regular_1mpi8_1541","Text--wide-l--variant-large-regular-italic":"_Text--wide-l--variant-large-regular-italic_1mpi8_1549","Text--wide-l--variant-large-semibold":"_Text--wide-l--variant-large-semibold_1mpi8_1557","Text--wide-l--variant-large-semibold-italic":"_Text--wide-l--variant-large-semibold-italic_1mpi8_1565","Text--wide-l--variant-xs":"_Text--wide-l--variant-xs_1mpi8_1573","Text--wide-l--variant-xs-medium":"_Text--wide-l--variant-xs-medium_1mpi8_1581","Text--wide-l--variant-s":"_Text--wide-l--variant-s_1mpi8_1477","Text--wide-l--variant-s-italic":"_Text--wide-l--variant-s-italic_1mpi8_1597","Text--wide-l--variant-s-medium":"_Text--wide-l--variant-s-medium_1mpi8_1605","Text--wide-l--variant-s-medium-italic":"_Text--wide-l--variant-s-medium-italic_1mpi8_1613","Text--wide-l--variant-s-bold":"_Text--wide-l--variant-s-bold_1mpi8_1621","Text--wide-l--variant-s-bold-italic":"_Text--wide-l--variant-s-bold-italic_1mpi8_1629","Text--wide-l--variant-m":"_Text--wide-l--variant-m_1mpi8_1637","Text--wide-l--variant-m-italic":"_Text--wide-l--variant-m-italic_1mpi8_1645","Text--wide-l--variant-m-medium":"_Text--wide-l--variant-m-medium_1mpi8_1653","Text--wide-l--variant-m-medium-italic":"_Text--wide-l--variant-m-medium-italic_1mpi8_1661","Text--wide-l--variant-m-bold":"_Text--wide-l--variant-m-bold_1mpi8_1669","Text--wide-l--variant-m-bold-italic":"_Text--wide-l--variant-m-bold-italic_1mpi8_1677","Text--wide-l--variant-l":"_Text--wide-l--variant-l_1mpi8_1541","Text--wide-l--variant-l-italic":"_Text--wide-l--variant-l-italic_1mpi8_1693","Text--wide-l--variant-l-medium":"_Text--wide-l--variant-l-medium_1mpi8_1701","Text--wide-l--variant-l-medium-italic":"_Text--wide-l--variant-l-medium-italic_1mpi8_1709","Text--wide-l--variant-xl":"_Text--wide-l--variant-xl_1mpi8_1717","Text--wide-l--variant-xl-italic":"_Text--wide-l--variant-xl-italic_1mpi8_1725","Text--wide-l--variant-xl-medium":"_Text--wide-l--variant-xl-medium_1mpi8_1733","Text--wide-l--variant-xl-medium-italic":"_Text--wide-l--variant-xl-medium-italic_1mpi8_1741","Text--strong":"_Text--strong_1mpi8_1750","Text--size-2xs":"_Text--size-2xs_1mpi8_1753","Text--size-xs":"_Text--size-xs_1mpi8_1756","Text--size-s":"_Text--size-s_1mpi8_1759","Text--size-m":"_Text--size-m_1mpi8_1762","Text--size-l":"_Text--size-l_1mpi8_1765","Text--size-xl":"_Text--size-xl_1mpi8_1768"},r=N.forwardRef(function({children:_,variant:a,tag:d=k,size:i,accent:e,color:u,strong:v,centered:s,dataset:x,...T},o){const c=a||(i?void 0:L),p=a?void 0:i,w=a?void 0:v,g=E(U,m.Text,[l("variant",c),l("size",p),R("strong",void 0,w)]),t=e?void 0:u,b=V(!t,e),f=q(t),y=A(s),C=[...g,...b,...f,...y],z={...D(T),ref:o,className:C.join(" "),...j(x,{preplyDsComponent:m.Text})};return h.jsx(d,{...z,children:_})});try{r.displayName="Text",r.__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:'"2xs"'},{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'}]}},accent:{defaultValue:null,description:"",name:"accent",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"positive"'},{value:'"warning"'},{value:'"critical"'},{value:'"accent"'},{value:'"inverted"'},{value:'"tertiary"'},{value:'"primary"'},{value:'"secondary"'},{value:'"accentDark"'},{value:'"placeholder"'},{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:'"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{r as T};
|