@preply/ds-docs 0.98.0 → 0.99.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/config/main.ts +4 -0
- package/dist/assets/{00.applications-CHktEAeI.js → 00.applications-kGdbufkv.js} +1 -1
- package/dist/assets/00.favicons.guide-DacbYQzh.js +21 -0
- package/dist/assets/{00.token-explorer-CeMnug7t.js → 00.token-explorer-CLMvmndf.js} +4 -4
- package/dist/assets/00.using-responsive-props-S75pEacQ.js +18 -0
- package/dist/assets/{10.fonts.guide-DjgeFg_o.js → 10.fonts.guide-BgJNemfK.js} +1 -1
- package/dist/assets/{10.ssr-BEROTC6a.js → 10.ssr-DlH6UKaz.js} +3 -3
- package/dist/assets/{11.languageFont.explorer-Cyv7quON.js → 11.languageFont.explorer-DV7d1sLI.js} +4 -4
- package/dist/assets/11.ssr.app-router-CTe5FOOM.js +59 -0
- package/dist/assets/{20.libraries-6ek48Mmj.js → 20.libraries-FWrxmkF1.js} +1 -1
- package/dist/assets/{30.icons.explorer-DdwYqlxd.js → 30.icons.explorer-D_jCULmS.js} +7 -7
- package/dist/assets/{30.storybook-BQjCJcP2.js → 30.storybook-GTYR0mHT.js} +1 -1
- package/dist/assets/40.illustrations.explorer-g5CehTbi.js +21 -0
- package/dist/assets/{90.advanced-fHUJ1dLA.js → 90.advanced-CDgAmnf1.js} +1 -1
- package/dist/assets/Avatar-B5VyGTND.css +1 -0
- package/dist/assets/Avatar-CbjmdBTE.css +1 -0
- package/dist/assets/Avatar-D9lQYtcf.js +1 -0
- package/dist/assets/Avatar-NseJJH9V.js +6 -0
- package/dist/assets/Avatar.stories-DkCGZst6.js +1 -0
- package/dist/assets/AvatarWithStatus-CV5oNRX5.css +1 -0
- package/dist/assets/AvatarWithStatus.stories-0MqYK9Ln.js +6 -0
- package/dist/assets/Badge-In2DaV0l.css +1 -0
- package/dist/assets/Badge.stories-DA95Cw4c.js +102 -0
- package/dist/assets/Box-C3U0bcxr.css +1 -0
- package/dist/assets/Box.stories-Cy2ky9_k.js +12 -0
- package/dist/assets/Button-BtqA2dqE.css +1 -0
- package/dist/assets/Button-DzNsOpEs.js +1 -0
- package/dist/assets/{Button.stories-DunDHbCS.js → Button.stories-Bfaocxt-.js} +1 -1
- package/dist/assets/ButtonBase-BXe5Klfi.js +1 -0
- package/dist/assets/{ButtonBase-fly5bC3X.css → ButtonBase-Cv8V2Mw0.css} +1 -1
- package/dist/assets/Chips-CiWoXrbE.css +1 -0
- package/dist/assets/Chips.stories-DkV0AIGf.js +127 -0
- package/dist/assets/{Color-KGDBMAHA-Cu8Wwe5p.js → Color-KGDBMAHA-CksLG7gU.js} +1 -1
- package/dist/assets/DocsRenderer-PKQXORMH-EEvdRLuk.js +1 -0
- package/dist/assets/FieldAdditionalText-CUCG15oV.css +1 -0
- package/dist/assets/FieldAdditionalText-D4mNbb6z.js +1 -0
- package/dist/assets/FieldAdditionalText.stories-9YNnwjy_.js +1 -0
- package/dist/assets/FieldButton-D33qtAXG.js +1 -0
- package/dist/assets/{FieldButton-BMU-DdYa.css → FieldButton-elQlJuYV.css} +1 -1
- package/dist/assets/FieldButton.stories-DJqZfgM6.js +1 -0
- package/dist/assets/FieldLayout-C1VooNJq.js +1 -0
- package/dist/assets/FieldLayout-rHHth3R7.css +1 -0
- package/dist/assets/FieldLayout.stories-D_pNRWoT.js +6 -0
- package/dist/assets/FieldLayoutBase-CbCHHPHI.js +2 -0
- package/dist/assets/FieldLayoutBase-CfEUshAO.css +1 -0
- package/dist/assets/Heading-BAzUrxgJ.js +2 -0
- package/dist/assets/{Heading-BFCUuHoK.css → Heading-CacRL-Yy.css} +1 -1
- package/dist/assets/Heading.stories-DimTg_h8.js +13 -0
- package/dist/assets/Icon-BqBV3_9d.js +8 -0
- package/dist/assets/Icon-CIabewGL.js +1 -0
- package/dist/assets/Icon-D8qvCo6q.css +1 -0
- package/dist/assets/Icon-RSC-CPLyX6oS.js +6 -0
- package/dist/assets/Icon.stories-io4seLI_.js +1 -0
- package/dist/assets/IconButton-YFQ036PO.js +1 -0
- package/dist/assets/{IconButton.stories-B-ZU8b1Q.js → IconButton.stories-CLpn2Llf.js} +1 -1
- package/dist/assets/InputText-eRnUw64o.js +1 -0
- package/dist/assets/LayoutFlex-9QKUN_c3.js +1 -0
- package/dist/assets/LayoutFlex-B-N4VfKt.css +1 -0
- package/dist/assets/LayoutFlex-BJ7WwFQm.css +1 -0
- package/dist/assets/LayoutFlex-BMAbrgpI.css +1 -0
- package/dist/assets/LayoutFlex-DnGoKdYS.js +1 -0
- package/dist/assets/LayoutFlex.stories-BiiZ0ZuP.js +19 -0
- package/dist/assets/LayoutGrid-5ifdLdnP.js +1 -0
- package/dist/assets/LayoutGrid-BwBJMRWN.css +1 -0
- package/dist/assets/LayoutGrid-DbWWX6JL.css +1 -0
- package/dist/assets/LayoutGrid.stories-DJlsxTtF.js +32 -0
- package/dist/assets/Link-ZkCoE9V3.css +1 -0
- package/dist/assets/Link.stories-CJ62odPW.js +25 -0
- package/dist/assets/Loader-DGCXnHs-.css +1 -0
- package/dist/assets/Loader.stories-Cha1yEol.js +1 -0
- package/dist/assets/NumberField.stories-C1ZcUsyv.js +34 -0
- package/dist/assets/ObserveIntersection-CiOLkzJQ.js +8 -0
- package/dist/assets/ObserveIntersection.stories-Dya1WZ0t.js +24 -0
- package/dist/assets/PasswordField.stories-CQKhBv0_.js +16 -0
- package/dist/assets/PreplyLogo-D6nWtZ44.css +1 -0
- package/dist/assets/PreplyLogo.stories-Da_UK6y4.js +3 -0
- package/dist/assets/RootProvider-CcBxia7g.js +1 -0
- package/dist/assets/SelectField-BPSTFulv.css +1 -0
- package/dist/assets/SelectField.stories-D838yNp-.js +28 -0
- package/dist/assets/ShowOnIntersection.stories-CFaEBdh4.js +17 -0
- package/dist/assets/Spinner-CACfcO5v.js +1 -0
- package/dist/assets/Spinner-ojgTV2uj.css +1 -0
- package/dist/assets/{StoryContextDSWeb-DTO1h3ed.js → StoryContextDSWeb-Cq8y4KZ8.js} +1 -1
- package/dist/assets/{StorybookGlobalStyle-BV5LdfUr.js → StorybookGlobalStyle-A7XGldSX.js} +1 -1
- package/dist/assets/Text-CvbAgCQi.css +1 -0
- package/dist/assets/Text-D0yjn65U.js +1 -0
- package/dist/assets/{Text-OCfa2Nzw.css → Text-D82X7D7k.css} +1 -1
- package/dist/assets/Text-yZzfLkiX.js +1 -0
- package/dist/assets/Text.stories-DLrEXkkR.js +11 -0
- package/dist/assets/TextField-CkPa9_Pm.css +1 -0
- package/dist/assets/TextField-IytkCeU9.js +1 -0
- package/dist/assets/TextField.stories-CmI8SyQ2.js +20 -0
- package/dist/assets/TextHighlighted-1proIqjK.css +1 -0
- package/dist/assets/TextHighlighted-BVVlR51u.js +1 -0
- package/dist/assets/TextHighlighted.stories-BBn_8Dgn.js +12 -0
- package/dist/assets/TextInline-sVYvSTDC.css +1 -0
- package/dist/assets/TextInline.stories-BXDAjPlT.js +3 -0
- package/dist/assets/TextareaField.stories-YQBiPKmT.js +20 -0
- package/dist/assets/align-self-9-POsulS.js +1 -0
- package/dist/assets/align-self-DnJjXiAG.css +1 -0
- package/dist/assets/{breakpoints-BHFDPnnV.js → breakpoints-Dp9RX5-N.js} +1 -1
- package/dist/assets/{breakpoints-DqzZ5i9h.js → breakpoints-pL5Qn1Jt.js} +1 -1
- package/dist/assets/{breakpoints-eBnX9Hq9.js → breakpoints-vqxXbKh8.js} +1 -1
- package/dist/assets/{changelog-x8953x-_.js → changelog-MuGp6SrI.js} +129 -98
- package/dist/assets/{chunk-HLWAVYOI-nHisX9N_.js → chunk-HLWAVYOI-DTFa3RTh.js} +1 -1
- package/dist/assets/classNames-Dz8Jm24I.js +1 -0
- package/dist/assets/constants-DYYVurUY.js +1 -0
- package/dist/assets/getTokenVar-DOEYYRhS.js +1 -0
- package/dist/assets/{getTokenVar-CMyl9_nH.js → getTokenVar-DccUYCDb.js} +1 -1
- package/dist/assets/{hover-D-h7UyeM.js → hover-ClyiAdXY.js} +1 -1
- package/dist/assets/{hover-BMxurVuq.js → hover-YV4OI7Jc.js} +1 -1
- package/dist/assets/{hover-p5MucVq_.js → hover-fQE7HmGu.js} +1 -1
- package/dist/assets/iframe-C9-tEs2g.js +2 -0
- package/dist/assets/{index-CYfUfEj6.js → index-87DoZhq0.js} +1 -1
- package/dist/assets/{index-Cr0eyxS1.js → index-C0R4Uw9r.js} +1 -1
- package/dist/assets/{index-B46pI2Oc.js → index-Cs2Qo7ol.js} +5 -5
- package/dist/assets/{intro-D6aMm_sE.js → intro-B7Mz1oRY.js} +1 -1
- package/dist/assets/layout-relative-B5pEjYWG.js +1 -0
- package/dist/assets/layout-relative-BVIkmQ-r.css +1 -0
- package/dist/assets/layout-relative-BhVDEqeE.js +1 -0
- package/dist/assets/layout-relative-DoO-OA4v.css +1 -0
- package/dist/assets/{migrating-from-less-BHm8Qmhr.js → migrating-from-less-DKSAPSfW.js} +1 -1
- package/dist/assets/playground-DSUjeIER.css +1 -0
- package/dist/assets/{playground.stories-Cox9zMK4.js → playground.stories-DU_ycRK0.js} +207 -217
- package/dist/assets/{preview-Mesbtrro.js → preview-BLfZ1M1g.js} +2 -2
- package/dist/assets/preview-CnpTX-dN.js +1 -0
- package/dist/assets/{preview-B4BGIvLs.js → preview-DO6fgzdg.js} +1 -1
- package/dist/assets/render-icon-C9YZCLtv.js +9 -0
- package/dist/assets/render-icon-DsMGBPwY.js +9 -0
- package/dist/assets/styled-components.browser.esm-D7-R-tx8.js +2 -0
- package/dist/assets/text-accent-DEt6vcbd.css +1 -0
- package/dist/assets/text-accent-DdHX3rNs.js +1 -0
- package/dist/assets/text-centered-BsCucYz7.css +1 -0
- package/dist/assets/text-centered-K6plBJwT.js +1 -0
- package/dist/assets/{tokens-CfqDG7zh.js → tokens-BV526yo0.js} +1 -1
- package/dist/assets/{tokens-B-OiX2j6.js → tokens-BaxEkcoW.js} +1 -1
- package/dist/assets/{tokens-BMPX6NLZ.js → tokens-BqEjbJUF.js} +1 -1
- package/dist/assets/{tokens-DR9BzpmN.js → tokens-BuyasvEu.js} +1 -1
- package/dist/assets/useForcedRef-CC5bJQVj.js +1 -0
- package/dist/assets/useNumberField-DwLXlsqE.js +1 -0
- package/dist/assets/usePasswordField-Cn9jdtbw.js +1 -0
- package/dist/assets/useSelectField-Di_eOCLK.js +1 -0
- package/dist/assets/useTextField-IMWr4_ZB.js +1 -0
- package/dist/assets/useTextareaField-HzNfFhIk.js +1 -0
- package/dist/assets/useTheme-BjN7KXjq.js +1 -0
- package/dist/assets/{welcome-BOKsbHxb.js → welcome-BshNtZc-.js} +1 -1
- package/dist/iframe.html +2 -2
- package/dist/index.json +1 -1
- package/dist/preview-stats.json +1636 -1498
- package/dist/project.json +1 -1
- package/package.json +2 -2
- package/dist/assets/00.favicons.guide-C-FnDqNq.js +0 -22
- package/dist/assets/00.using-responsive-props-BAsA_iSR.js +0 -18
- package/dist/assets/40.illustrations.explorer-GxTP3sDO.js +0 -21
- package/dist/assets/Avatar-DmtiV1Mz.js +0 -1
- package/dist/assets/Avatar-IqZZsC_p.js +0 -1
- package/dist/assets/Avatar-oQ-Mv-ny.css +0 -1
- package/dist/assets/Avatar.stories-DSmHUd1F.js +0 -1
- package/dist/assets/AvatarWithStatus-B767Nm5D.css +0 -1
- package/dist/assets/AvatarWithStatus.stories-DthCEV28.js +0 -1
- package/dist/assets/Badge-BCIMJBZI.css +0 -1
- package/dist/assets/Badge.stories-DvUkvaU6.js +0 -97
- package/dist/assets/Box-C3nYCQ-H.css +0 -1
- package/dist/assets/Box.stories-5qSsIrLx.js +0 -12
- package/dist/assets/Button-DXCqQddo.css +0 -1
- package/dist/assets/Button-DzURzP8Y.js +0 -1
- package/dist/assets/ButtonBase-31TE-cL9.js +0 -1
- package/dist/assets/Chips-gPSDms6Z.css +0 -1
- package/dist/assets/Chips.stories-BhvAG0l8.js +0 -110
- package/dist/assets/DocsRenderer-PKQXORMH-DNeFM8EF.js +0 -1
- package/dist/assets/FieldAdditionalText-BqebVoaG.js +0 -1
- package/dist/assets/FieldAdditionalText-mFw0END4.css +0 -1
- package/dist/assets/FieldAdditionalText.stories-B5nLJpO4.js +0 -1
- package/dist/assets/FieldButton-pvE8OgyE.js +0 -1
- package/dist/assets/FieldButton.stories-BKsQ8Mbo.js +0 -1
- package/dist/assets/FieldLayout-C-8giLY8.css +0 -1
- package/dist/assets/FieldLayout-Den-dQFM.js +0 -1
- package/dist/assets/FieldLayout.stories-CJutwldm.js +0 -6
- package/dist/assets/FieldLayoutBase-8B8zAX_x.js +0 -1
- package/dist/assets/FieldLayoutBase-CPvYp6S9.css +0 -1
- package/dist/assets/Heading-DsvaXDny.js +0 -1
- package/dist/assets/Heading.stories-DJpPDRJk.js +0 -13
- package/dist/assets/Icon-BArjqZXD.js +0 -1
- package/dist/assets/Icon-B_6myo6d.css +0 -1
- package/dist/assets/Icon-veq5wQcc.js +0 -1
- package/dist/assets/Icon.stories-q3-3NfEp.js +0 -1
- package/dist/assets/IconButton-GEKP0nKB.js +0 -1
- package/dist/assets/InputText-DIoMFmKH.js +0 -1
- package/dist/assets/LayoutFlex-CkYnYaGT.js +0 -1
- package/dist/assets/LayoutFlex-DQa3zhCk.css +0 -1
- package/dist/assets/LayoutFlex-hYl5dE5q.js +0 -1
- package/dist/assets/LayoutFlex.stories-Chx7q7hC.js +0 -19
- package/dist/assets/LayoutGrid-CMRHY4jq.js +0 -1
- package/dist/assets/LayoutGrid-D-_lLr0n.css +0 -1
- package/dist/assets/LayoutGrid.stories-Cr-JtL0o.js +0 -32
- package/dist/assets/Link-D3k2VXkr.css +0 -1
- package/dist/assets/Link.stories-B_0Pwfmv.js +0 -19
- package/dist/assets/Loader-8ofSk-Uc.css +0 -1
- package/dist/assets/Loader.stories-ljnjYC8d.js +0 -1
- package/dist/assets/NumberField.stories-BinCLLYb.js +0 -34
- package/dist/assets/ObserveIntersection-CNUiVPCa.js +0 -1
- package/dist/assets/ObserveIntersection.stories-Yg_aNGx7.js +0 -24
- package/dist/assets/PasswordField.stories-nasUhlPV.js +0 -16
- package/dist/assets/PreplyLogo-Dq_ntc_L.css +0 -1
- package/dist/assets/PreplyLogo.stories-BJ95rkUt.js +0 -1
- package/dist/assets/RootProvider-LL-zBc44.js +0 -1
- package/dist/assets/SelectField-2cK5P085.css +0 -1
- package/dist/assets/SelectField.stories-AtK5G3gF.js +0 -28
- package/dist/assets/ShowOnIntersection.stories-CyXaird_.js +0 -17
- package/dist/assets/Spinner-BSnwpFf5.css +0 -1
- package/dist/assets/Spinner-CGBHcGTQ.js +0 -1
- package/dist/assets/Text-0CCfcAV6.js +0 -1
- package/dist/assets/Text-BJKNNA5M.js +0 -1
- package/dist/assets/Text.stories-BLUDrBi0.js +0 -11
- package/dist/assets/TextField-gphlYwu9.js +0 -1
- package/dist/assets/TextField.stories-CeokV-It.js +0 -20
- package/dist/assets/TextHighlighted-Bc02JqSa.js +0 -1
- package/dist/assets/TextHighlighted-vB3l281x.css +0 -1
- package/dist/assets/TextHighlighted.stories-BoJtO06J.js +0 -12
- package/dist/assets/TextInline-BAOzTiF8.css +0 -1
- package/dist/assets/TextInline.stories-D9uMiS22.js +0 -3
- package/dist/assets/TextareaField.stories-BvmtsiLg.js +0 -20
- package/dist/assets/classNames-C1v60lt_.js +0 -1
- package/dist/assets/getTokenVar-OtHJL4yA.js +0 -1
- package/dist/assets/iframe-lho9TVh-.js +0 -2
- package/dist/assets/preview-b4qEAdY0.js +0 -1
- package/dist/assets/style-inject.es-BI9ztQJ7.js +0 -1
- package/dist/assets/styled-components.browser.esm-DAuq3cw0.js +0 -2
- package/dist/assets/useAlignSelfClassNames-D4Zkdh7M.js +0 -1
- package/dist/assets/useColorScheme-B0seqviK.js +0 -1
- package/dist/assets/useForcedRef-BsHr-Tlv.js +0 -1
- package/dist/assets/useLayoutFlexClassNames-QaJAkt8L.js +0 -1
- package/dist/assets/useLayoutGridResponsiveColumns-KLCFx5pG.js +0 -1
- package/dist/assets/useLayoutRelativeClassnames-CgeMCRER.js +0 -1
- package/dist/assets/useNumberField-MlftdM3y.js +0 -1
- package/dist/assets/usePasswordField--UmZ3Rnv.js +0 -1
- package/dist/assets/useSelectField-CY5L0Juf.js +0 -1
- package/dist/assets/useTextAccentClassnames-Z590DgFQ.js +0 -1
- package/dist/assets/useTextCenteredClassnames-B21nS5IY.js +0 -1
- package/dist/assets/useTextField-D4Wp_okt.js +0 -1
- package/dist/assets/useTextWeightClassNames-ynGjsVaG.js +0 -1
- package/dist/assets/useTextareaField-_TyL8HkR.js +0 -1
- package/dist/assets/useTheme-UwDh1RCY.js +0 -1
- package/dist/assets/withColorScheme-B1f4bRhE.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
._button-width--width-full_le6x9_5{width:100%}._button-width--width-auto_le6x9_8{width:auto}@media (min-width: 400px){._button-width--narrow-l--width-full_le6x9_12{width:100%}._button-width--narrow-l--width-auto_le6x9_15{width:auto}}@media (min-width: 700px){._button-width--medium-s--width-full_le6x9_20{width:100%}._button-width--medium-s--width-auto_le6x9_23{width:auto}}@media (min-width: 880px){._button-width--medium-l--width-full_le6x9_28{width:100%}._button-width--medium-l--width-auto_le6x9_31{width:auto}}@media (min-width: 1200px){._button-width--wide-s--width-full_le6x9_36{width:100%}._button-width--wide-s--width-auto_le6x9_39{width:auto}}@media (min-width: 1900px){._button-width--wide-l--width-full_le6x9_44{width:100%}._button-width--wide-l--width-auto_le6x9_47{width:auto}}._ButtonBase_le6x9_51{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:var(--8d63e4);line-height:var(--d4313c);color:var(--aface6);position:relative;display:inline-flex;align-items:center;justify-content:center;font-weight:var(--d61910);text-align:center;text-decoration:none;background-color:transparent;border-radius:var(--8d5131);border-width:var(--0b1b71);border-style:solid;border-color:transparent;-webkit-user-select:none;user-select:none;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none;-ms-touch-action:manipulation;touch-action:manipulation}._ButtonBase--content_le6x9_76{display:inline-flex;align-items:center;gap:var(--0aee7b);justify-content:center;vertical-align:baseline}._ButtonBase--is-icon-button_le6x9_83 ._ButtonBase--content_le6x9_76 svg{width:var(--f02c4e);height:var(--f02c4e)}._ButtonBase--is-icon-button_le6x9_83 ._ButtonBase--content_le6x9_76 svg path{fill:currentColor}._ButtonBase--busy_le6x9_90{position:absolute;top:0;left:0;width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center}._ButtonBase_le6x9_51[disabled],._ButtonBase_le6x9_51[disabled]:hover{cursor:not-allowed;color:var(--a8b89c);background-color:var(--04daeb);border-color:var(--e05289)}._ButtonBase_le6x9_51:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}._ButtonBase--is-busy_le6x9_113{cursor:default;pointer-events:none}._ButtonBase--is-busy_le6x9_113 ._ButtonBase--content_le6x9_76{visibility:hidden}._ButtonBase--width-full_le6x9_120{width:100%}._ButtonBase--width-auto_le6x9_123{width:auto}@media (min-width: 400px){._ButtonBase--narrow-l--width-full_le6x9_127{width:100%}._ButtonBase--narrow-l--width-auto_le6x9_130{width:auto}}@media (min-width: 700px){._ButtonBase--medium-s--width-full_le6x9_135{width:100%}._ButtonBase--medium-s--width-auto_le6x9_138{width:auto}}@media (min-width: 880px){._ButtonBase--medium-l--width-full_le6x9_143{width:100%}._ButtonBase--medium-l--width-auto_le6x9_146{width:auto}}@media (min-width: 1200px){._ButtonBase--wide-s--width-full_le6x9_151{width:100%}._ButtonBase--wide-s--width-auto_le6x9_154{width:auto}}@media (min-width: 1900px){._ButtonBase--wide-l--width-full_le6x9_159{width:100%}._ButtonBase--wide-l--width-auto_le6x9_162{width:auto}}._ButtonBase--size-xs_le6x9_166{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--is-icon-button-size-xs_le6x9_175{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--size-s_le6x9_180{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--is-icon-button-size-s_le6x9_189{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--size-m_le6x9_194{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--is-icon-button-size-m_le6x9_203{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--size-l_le6x9_208{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--is-icon-button-size-l_le6x9_217{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--size-xl_le6x9_222{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--is-icon-button-size-xl_le6x9_231{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--size-large_le6x9_236{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--is-icon-button-size-large_le6x9_245{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--size-medium_le6x9_250{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--is-icon-button-size-medium_le6x9_259{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--size-small_le6x9_264{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--is-icon-button-size-small_le6x9_273{width:var(--5eca09);height:var(--5eca09);padding:0}@media (min-width: 400px){._ButtonBase--narrow-l--size-xs_le6x9_279{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--narrow-l--is-icon-button-size-xs_le6x9_288{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--narrow-l--size-s_le6x9_293{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--narrow-l--is-icon-button-size-s_le6x9_302{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--narrow-l--size-m_le6x9_307{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--narrow-l--is-icon-button-size-m_le6x9_316{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--narrow-l--size-l_le6x9_321{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--narrow-l--is-icon-button-size-l_le6x9_330{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--narrow-l--size-xl_le6x9_335{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--narrow-l--is-icon-button-size-xl_le6x9_344{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--narrow-l--size-large_le6x9_349{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--narrow-l--is-icon-button-size-large_le6x9_358{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--narrow-l--size-medium_le6x9_363{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--narrow-l--is-icon-button-size-medium_le6x9_372{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--narrow-l--size-small_le6x9_377{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--narrow-l--is-icon-button-size-small_le6x9_386{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 700px){._ButtonBase--medium-s--size-xs_le6x9_393{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--medium-s--is-icon-button-size-xs_le6x9_402{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--medium-s--size-s_le6x9_407{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--medium-s--is-icon-button-size-s_le6x9_416{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--medium-s--size-m_le6x9_421{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--medium-s--is-icon-button-size-m_le6x9_430{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--medium-s--size-l_le6x9_435{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--medium-s--is-icon-button-size-l_le6x9_444{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--medium-s--size-xl_le6x9_449{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--medium-s--is-icon-button-size-xl_le6x9_458{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--medium-s--size-large_le6x9_463{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--medium-s--is-icon-button-size-large_le6x9_472{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--medium-s--size-medium_le6x9_477{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--medium-s--is-icon-button-size-medium_le6x9_486{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--medium-s--size-small_le6x9_491{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--medium-s--is-icon-button-size-small_le6x9_500{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 880px){._ButtonBase--medium-l--size-xs_le6x9_507{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--medium-l--is-icon-button-size-xs_le6x9_516{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--medium-l--size-s_le6x9_521{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--medium-l--is-icon-button-size-s_le6x9_530{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--medium-l--size-m_le6x9_535{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--medium-l--is-icon-button-size-m_le6x9_544{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--medium-l--size-l_le6x9_549{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--medium-l--is-icon-button-size-l_le6x9_558{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--medium-l--size-xl_le6x9_563{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--medium-l--is-icon-button-size-xl_le6x9_572{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--medium-l--size-large_le6x9_577{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--medium-l--is-icon-button-size-large_le6x9_586{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--medium-l--size-medium_le6x9_591{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--medium-l--is-icon-button-size-medium_le6x9_600{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--medium-l--size-small_le6x9_605{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--medium-l--is-icon-button-size-small_le6x9_614{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 1200px){._ButtonBase--wide-s--size-xs_le6x9_621{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--wide-s--is-icon-button-size-xs_le6x9_630{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--wide-s--size-s_le6x9_635{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--wide-s--is-icon-button-size-s_le6x9_644{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--wide-s--size-m_le6x9_649{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--wide-s--is-icon-button-size-m_le6x9_658{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--wide-s--size-l_le6x9_663{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--wide-s--is-icon-button-size-l_le6x9_672{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--wide-s--size-xl_le6x9_677{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--wide-s--is-icon-button-size-xl_le6x9_686{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--wide-s--size-large_le6x9_691{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--wide-s--is-icon-button-size-large_le6x9_700{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--wide-s--size-medium_le6x9_705{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--wide-s--is-icon-button-size-medium_le6x9_714{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--wide-s--size-small_le6x9_719{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--wide-s--is-icon-button-size-small_le6x9_728{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 1900px){._ButtonBase--wide-l--size-xs_le6x9_735{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--wide-l--is-icon-button-size-xs_le6x9_744{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--wide-l--size-s_le6x9_749{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--wide-l--is-icon-button-size-s_le6x9_758{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--wide-l--size-m_le6x9_763{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--wide-l--is-icon-button-size-m_le6x9_772{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--wide-l--size-l_le6x9_777{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--wide-l--is-icon-button-size-l_le6x9_786{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--wide-l--size-xl_le6x9_791{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--wide-l--is-icon-button-size-xl_le6x9_800{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--wide-l--size-large_le6x9_805{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--wide-l--is-icon-button-size-large_le6x9_814{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--wide-l--size-medium_le6x9_819{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--wide-l--is-icon-button-size-medium_le6x9_828{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--wide-l--size-small_le6x9_833{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--wide-l--is-icon-button-size-small_le6x9_842{width:var(--5eca09);height:var(--5eca09);padding:0}}._ButtonBase--variant-primary_le6x9_848{color:var(--d2baa6);background-color:var(--508b34);border-color:var(--44bfe9);text-decoration:var(--74cfa2)}._ButtonBase--variant-primary--dsInternalSimulation-hover_le6x9_854{color:var(--df6151);background-color:var(--902b50)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primary_le6x9_848:hover{color:var(--df6151);background-color:var(--902b50)}}._ButtonBase--variant-primary_le6x9_848[disabled],._ButtonBase--variant-primary_le6x9_848[disabled]:hover{border-color:var(--f0720e)}._ButtonBase--variant-primary_le6x9_848:active,._ButtonBase--variant-primary--dsInternalSimulation-active_le6x9_869{color:var(--15cee1);background-color:var(--c1c1ca)}._ButtonBase--variant-secondary_le6x9_873{color:var(--1614c9);background-color:var(--e56164);border-color:var(--ab736c);text-decoration:var(--c6c73d)}._ButtonBase--variant-secondary--dsInternalSimulation-hover_le6x9_879{color:var(--0d6ae2);background-color:var(--0d124d)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-secondary_le6x9_873:hover{color:var(--0d6ae2);background-color:var(--0d124d)}}._ButtonBase--variant-secondary_le6x9_873[disabled],._ButtonBase--variant-secondary_le6x9_873[disabled]:hover{border-color:var(--3f0f51)}._ButtonBase--variant-secondary_le6x9_873:active,._ButtonBase--variant-secondary--dsInternalSimulation-active_le6x9_894{color:var(--22cb4c);background-color:var(--33b439)}._ButtonBase--variant-tertiary_le6x9_898{color:var(--937543);background-color:var(--28f3c1);border-color:var(--10556e);text-decoration:var(--ce0e6a)}._ButtonBase--variant-tertiary--dsInternalSimulation-hover_le6x9_904{color:var(--175a77);background-color:var(--ec17be)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-tertiary_le6x9_898:hover{color:var(--175a77);background-color:var(--ec17be)}}._ButtonBase--variant-tertiary_le6x9_898[disabled],._ButtonBase--variant-tertiary_le6x9_898[disabled]:hover{border-color:var(--fd08b7)}._ButtonBase--variant-tertiary_le6x9_898:active,._ButtonBase--variant-tertiary--dsInternalSimulation-active_le6x9_919{color:var(--8274ee);background-color:var(--b0bf50)}._ButtonBase--variant-quaternary_le6x9_923{color:var(--9cf6ec);background-color:var(--e46449);border-color:var(--0e9e01);text-decoration:var(--5c0a2f)}._ButtonBase--variant-quaternary--dsInternalSimulation-hover_le6x9_929{color:var(--6609c6);background-color:var(--afc176)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-quaternary_le6x9_923:hover{color:var(--6609c6);background-color:var(--afc176)}}._ButtonBase--variant-quaternary_le6x9_923[disabled],._ButtonBase--variant-quaternary_le6x9_923[disabled]:hover{border-color:var(--3e2684)}._ButtonBase--variant-quaternary_le6x9_923:active,._ButtonBase--variant-quaternary--dsInternalSimulation-active_le6x9_944{color:var(--e9f226);background-color:var(--2ee553)}._ButtonBase--variant-ghost_le6x9_948{color:var(--255ddc);background-color:var(--64bffa);border-color:var(--39e128);text-decoration:var(--31d455)}._ButtonBase--variant-ghost--dsInternalSimulation-hover_le6x9_954{color:var(--e69072);background-color:var(--3b749f)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-ghost_le6x9_948:hover{color:var(--e69072);background-color:var(--3b749f)}}._ButtonBase--variant-ghost_le6x9_948[disabled],._ButtonBase--variant-ghost_le6x9_948[disabled]:hover{border-color:var(--af2d26)}._ButtonBase--variant-ghost_le6x9_948:active,._ButtonBase--variant-ghost--dsInternalSimulation-active_le6x9_969{color:var(--ddf285);background-color:var(--6beb48)}._ButtonBase--variant-ghost--is-selected_le6x9_973{color:var(--5f5238);background-color:var(--a5cfbe)}._ButtonBase--variant-plain_le6x9_977{color:var(--122a99);background-color:var(--bbb356);border-color:var(--0cad84);text-decoration:var(--d2d32f)}._ButtonBase--variant-plain--dsInternalSimulation-hover_le6x9_983{color:var(--1265db);background-color:var(--df2aca)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-plain_le6x9_977:hover{color:var(--1265db);background-color:var(--df2aca)}}._ButtonBase--variant-plain_le6x9_977[disabled],._ButtonBase--variant-plain_le6x9_977[disabled]:hover{border-color:var(--c6b607)}._ButtonBase--variant-plain_le6x9_977:active,._ButtonBase--variant-plain--dsInternalSimulation-active_le6x9_998{color:var(--a41624);background-color:var(--435fa5)}._ButtonBase--variant-dangerous_le6x9_1002{color:var(--efde5b);background-color:var(--118bda);border-color:var(--ab5970);text-decoration:var(--0bf14c)}._ButtonBase--variant-dangerous--dsInternalSimulation-hover_le6x9_1008{color:var(--6f5d5d);background-color:var(--e0b0f4)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-dangerous_le6x9_1002:hover{color:var(--6f5d5d);background-color:var(--e0b0f4)}}._ButtonBase--variant-dangerous_le6x9_1002[disabled],._ButtonBase--variant-dangerous_le6x9_1002[disabled]:hover{border-color:var(--7deffa)}._ButtonBase--variant-dangerous_le6x9_1002:active,._ButtonBase--variant-dangerous--dsInternalSimulation-active_le6x9_1023{color:var(--6b4e92);background-color:var(--a5eaa1)}._ButtonBase--variant-critical_le6x9_1027{color:var(--f68030);background-color:var(--faae28);border-color:var(--b357d0);text-decoration:var(--91f4fa)}._ButtonBase--variant-critical--dsInternalSimulation-hover_le6x9_1033{color:var(--c3136e);background-color:var(--064c43)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-critical_le6x9_1027:hover{color:var(--c3136e);background-color:var(--064c43)}}._ButtonBase--variant-critical_le6x9_1027[disabled],._ButtonBase--variant-critical_le6x9_1027[disabled]:hover{border-color:var(--e117c7)}._ButtonBase--variant-critical_le6x9_1027:active,._ButtonBase--variant-critical--dsInternalSimulation-active_le6x9_1048{color:var(--f9fba8);background-color:var(--152a7a)}._ButtonBase--variant-onColor_le6x9_1052{color:var(--96343f);background-color:var(--d64a99);border-color:var(--d2723c);text-decoration:var(--af7137)}._ButtonBase--variant-onColor--dsInternalSimulation-hover_le6x9_1058{color:var(--145384);background-color:var(--549e56)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-onColor_le6x9_1052:hover{color:var(--145384);background-color:var(--549e56)}}._ButtonBase--variant-onColor_le6x9_1052[disabled],._ButtonBase--variant-onColor_le6x9_1052[disabled]:hover{border-color:var(--e1a214)}._ButtonBase--variant-onColor_le6x9_1052:active,._ButtonBase--variant-onColor--dsInternalSimulation-active_le6x9_1073{color:var(--f772e8);background-color:var(--936fce)}._ButtonBase--variant-classroom_le6x9_1077{color:var(--8d482c);background-color:var(--7a038f);border-color:var(--38faba);text-decoration:var(--4d5ea8)}._ButtonBase--variant-classroom--dsInternalSimulation-hover_le6x9_1083{color:var(--55bfda);background-color:var(--077a93)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-classroom_le6x9_1077:hover{color:var(--55bfda);background-color:var(--077a93)}}._ButtonBase--variant-classroom_le6x9_1077[disabled],._ButtonBase--variant-classroom_le6x9_1077[disabled]:hover{border-color:var(--659377)}._ButtonBase--variant-classroom_le6x9_1077:active,._ButtonBase--variant-classroom--dsInternalSimulation-active_le6x9_1098{color:var(--b62751);background-color:var(--45d93a)}._ButtonBase--variant-classroom--is-selected_le6x9_1102{color:var(--a0b42b);background-color:var(--16a985)}._ButtonBase--variant-primaryB2b_le6x9_1106{color:var(--4a94de);background-color:var(--6c36b5);border-color:var(--4a9eb5);text-decoration:var(--6c9741)}._ButtonBase--variant-primaryB2b--dsInternalSimulation-hover_le6x9_1112{color:var(--3e45d7);background-color:var(--dcdb32)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primaryB2b_le6x9_1106:hover{color:var(--3e45d7);background-color:var(--dcdb32)}}._ButtonBase--variant-primaryB2b_le6x9_1106[disabled],._ButtonBase--variant-primaryB2b_le6x9_1106[disabled]:hover{border-color:var(--e7f949)}._ButtonBase--variant-primaryB2b_le6x9_1106:active,._ButtonBase--variant-primaryB2b--dsInternalSimulation-active_le6x9_1127{color:var(--cb03bc);background-color:var(--fc3d8b)}._ButtonBase--variant-primaryTutor_le6x9_1131{color:var(--c93681);background-color:var(--4aa1b1);border-color:var(--f103e9);text-decoration:var(--6e7352)}._ButtonBase--variant-primaryTutor--dsInternalSimulation-hover_le6x9_1137{color:var(--e91696);background-color:var(--46a009)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primaryTutor_le6x9_1131:hover{color:var(--e91696);background-color:var(--46a009)}}._ButtonBase--variant-primaryTutor_le6x9_1131[disabled],._ButtonBase--variant-primaryTutor_le6x9_1131[disabled]:hover{border-color:var(--f6a20e)}._ButtonBase--variant-primaryTutor_le6x9_1131:active,._ButtonBase--variant-primaryTutor--dsInternalSimulation-active_le6x9_1152{color:var(--58d992);background-color:var(--dd5a43)}._ButtonBase--variant-inverted_le6x9_1156{color:var(--81b7df);background-color:var(--c54155);border-color:var(--fe1378);text-decoration:var(--fb8624)}._ButtonBase--variant-inverted--dsInternalSimulation-hover_le6x9_1162{color:var(--79a09e);background-color:var(--8a16b5)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-inverted_le6x9_1156:hover{color:var(--79a09e);background-color:var(--8a16b5)}}._ButtonBase--variant-inverted_le6x9_1156[disabled],._ButtonBase--variant-inverted_le6x9_1156[disabled]:hover{border-color:var(--e797f1)}._ButtonBase--variant-inverted_le6x9_1156:active,._ButtonBase--variant-inverted--dsInternalSimulation-active_le6x9_1177{color:var(--77e945);background-color:var(--de59a1)}._ButtonBase--variant-newFeature_le6x9_1181{color:var(--ad44c3);background-color:var(--7dbfce);border-color:var(--a7eddc);text-decoration:var(--fd7ece)}._ButtonBase--variant-newFeature--dsInternalSimulation-hover_le6x9_1187{color:var(--ddcea1);background-color:var(--dd2815)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-newFeature_le6x9_1181:hover{color:var(--ddcea1);background-color:var(--dd2815)}}._ButtonBase--variant-newFeature_le6x9_1181[disabled],._ButtonBase--variant-newFeature_le6x9_1181[disabled]:hover{border-color:var(--7d2338)}._ButtonBase--variant-newFeature_le6x9_1181:active,._ButtonBase--variant-newFeature--dsInternalSimulation-active_le6x9_1202{color:var(--d4762b);background-color:var(--b3e453)}._ButtonBase--variant-ai_le6x9_1206{color:var(--aa08fb);background-color:var(--1bdcc0);border-color:var(--8e8894);text-decoration:var(--c82204)}._ButtonBase--variant-ai--dsInternalSimulation-hover_le6x9_1212{color:var(--59b757);background-color:var(--f043dc)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-ai_le6x9_1206:hover{color:var(--59b757);background-color:var(--f043dc)}}._ButtonBase--variant-ai_le6x9_1206[disabled],._ButtonBase--variant-ai_le6x9_1206[disabled]:hover{border-color:var(--6ac212)}._ButtonBase--variant-ai_le6x9_1206:active,._ButtonBase--variant-ai--dsInternalSimulation-active_le6x9_1227{color:var(--349ae3);background-color:var(--5bba7d)}._ButtonBase--variant-ai_le6x9_1206{border-image:var(--0b0037)}._ButtonBase--variant-ai_le6x9_1206[disabled],._ButtonBase--variant-ai_le6x9_1206[disabled]:hover{border-image:initial;border-color:var(--6ac212)}._ButtonBase--no-wrap_le6x9_1239{min-width:max-content}
|
|
1
|
+
._button-width--width-full_1lq7z_5{width:100%}._button-width--width-auto_1lq7z_8{width:auto}@media (min-width: 400px){._button-width--narrow-l--width-full_1lq7z_12{width:100%}._button-width--narrow-l--width-auto_1lq7z_15{width:auto}}@media (min-width: 700px){._button-width--medium-s--width-full_1lq7z_20{width:100%}._button-width--medium-s--width-auto_1lq7z_23{width:auto}}@media (min-width: 880px){._button-width--medium-l--width-full_1lq7z_28{width:100%}._button-width--medium-l--width-auto_1lq7z_31{width:auto}}@media (min-width: 1200px){._button-width--wide-s--width-full_1lq7z_36{width:100%}._button-width--wide-s--width-auto_1lq7z_39{width:auto}}@media (min-width: 1900px){._button-width--wide-l--width-full_1lq7z_44{width:100%}._button-width--wide-l--width-auto_1lq7z_47{width:auto}}._ButtonBase_1lq7z_51{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:var(--8d63e4);line-height:var(--d4313c);color:var(--aface6);position:relative;display:inline-flex;align-items:center;justify-content:center;font-weight:var(--d61910);text-align:center;text-decoration:none;background-color:transparent;border-radius:var(--8d5131);border-width:var(--0b1b71);border-style:solid;border-color:transparent;-webkit-user-select:none;user-select:none;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none;-ms-touch-action:manipulation;touch-action:manipulation}._ButtonBase--content_1lq7z_76{display:inline-flex;align-items:center;gap:var(--0aee7b);justify-content:center;vertical-align:baseline}._ButtonBase--is-icon-button_1lq7z_83 ._ButtonBase--content_1lq7z_76 svg{width:var(--f02c4e);height:var(--f02c4e)}._ButtonBase--is-icon-button_1lq7z_83 ._ButtonBase--content_1lq7z_76 svg path{fill:currentColor}._ButtonBase--busy_1lq7z_90{position:absolute;top:0;left:0;width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center}._ButtonBase_1lq7z_51[disabled],._ButtonBase_1lq7z_51[disabled]:hover{cursor:not-allowed;color:var(--a8b89c);background-color:var(--04daeb);border-color:var(--e05289)}._ButtonBase_1lq7z_51:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}._ButtonBase--is-busy_1lq7z_113{cursor:default;pointer-events:none}._ButtonBase--is-busy_1lq7z_113 ._ButtonBase--content_1lq7z_76{visibility:hidden}._ButtonBase--width-full_1lq7z_120{width:100%}._ButtonBase--width-auto_1lq7z_123{width:auto}@media (min-width: 400px){._ButtonBase--narrow-l--width-full_1lq7z_127{width:100%}._ButtonBase--narrow-l--width-auto_1lq7z_130{width:auto}}@media (min-width: 700px){._ButtonBase--medium-s--width-full_1lq7z_135{width:100%}._ButtonBase--medium-s--width-auto_1lq7z_138{width:auto}}@media (min-width: 880px){._ButtonBase--medium-l--width-full_1lq7z_143{width:100%}._ButtonBase--medium-l--width-auto_1lq7z_146{width:auto}}@media (min-width: 1200px){._ButtonBase--wide-s--width-full_1lq7z_151{width:100%}._ButtonBase--wide-s--width-auto_1lq7z_154{width:auto}}@media (min-width: 1900px){._ButtonBase--wide-l--width-full_1lq7z_159{width:100%}._ButtonBase--wide-l--width-auto_1lq7z_162{width:auto}}._ButtonBase--size-xs_1lq7z_166{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--is-icon-button-size-xs_1lq7z_175{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--size-s_1lq7z_180{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--is-icon-button-size-s_1lq7z_189{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--size-m_1lq7z_194{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--is-icon-button-size-m_1lq7z_203{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--size-l_1lq7z_208{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--is-icon-button-size-l_1lq7z_217{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--size-xl_1lq7z_222{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--is-icon-button-size-xl_1lq7z_231{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--size-large_1lq7z_236{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--is-icon-button-size-large_1lq7z_245{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--size-medium_1lq7z_250{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--is-icon-button-size-medium_1lq7z_259{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--size-small_1lq7z_264{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--is-icon-button-size-small_1lq7z_273{width:var(--5eca09);height:var(--5eca09);padding:0}@media (min-width: 400px){._ButtonBase--narrow-l--size-xs_1lq7z_279{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--narrow-l--is-icon-button-size-xs_1lq7z_288{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--narrow-l--size-s_1lq7z_293{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--narrow-l--is-icon-button-size-s_1lq7z_302{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--narrow-l--size-m_1lq7z_307{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--narrow-l--is-icon-button-size-m_1lq7z_316{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--narrow-l--size-l_1lq7z_321{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--narrow-l--is-icon-button-size-l_1lq7z_330{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--narrow-l--size-xl_1lq7z_335{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--narrow-l--is-icon-button-size-xl_1lq7z_344{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--narrow-l--size-large_1lq7z_349{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--narrow-l--is-icon-button-size-large_1lq7z_358{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--narrow-l--size-medium_1lq7z_363{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--narrow-l--is-icon-button-size-medium_1lq7z_372{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--narrow-l--size-small_1lq7z_377{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--narrow-l--is-icon-button-size-small_1lq7z_386{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 700px){._ButtonBase--medium-s--size-xs_1lq7z_393{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--medium-s--is-icon-button-size-xs_1lq7z_402{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--medium-s--size-s_1lq7z_407{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--medium-s--is-icon-button-size-s_1lq7z_416{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--medium-s--size-m_1lq7z_421{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--medium-s--is-icon-button-size-m_1lq7z_430{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--medium-s--size-l_1lq7z_435{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--medium-s--is-icon-button-size-l_1lq7z_444{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--medium-s--size-xl_1lq7z_449{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--medium-s--is-icon-button-size-xl_1lq7z_458{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--medium-s--size-large_1lq7z_463{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--medium-s--is-icon-button-size-large_1lq7z_472{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--medium-s--size-medium_1lq7z_477{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--medium-s--is-icon-button-size-medium_1lq7z_486{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--medium-s--size-small_1lq7z_491{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--medium-s--is-icon-button-size-small_1lq7z_500{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 880px){._ButtonBase--medium-l--size-xs_1lq7z_507{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--medium-l--is-icon-button-size-xs_1lq7z_516{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--medium-l--size-s_1lq7z_521{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--medium-l--is-icon-button-size-s_1lq7z_530{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--medium-l--size-m_1lq7z_535{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--medium-l--is-icon-button-size-m_1lq7z_544{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--medium-l--size-l_1lq7z_549{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--medium-l--is-icon-button-size-l_1lq7z_558{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--medium-l--size-xl_1lq7z_563{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--medium-l--is-icon-button-size-xl_1lq7z_572{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--medium-l--size-large_1lq7z_577{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--medium-l--is-icon-button-size-large_1lq7z_586{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--medium-l--size-medium_1lq7z_591{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--medium-l--is-icon-button-size-medium_1lq7z_600{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--medium-l--size-small_1lq7z_605{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--medium-l--is-icon-button-size-small_1lq7z_614{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 1200px){._ButtonBase--wide-s--size-xs_1lq7z_621{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--wide-s--is-icon-button-size-xs_1lq7z_630{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--wide-s--size-s_1lq7z_635{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--wide-s--is-icon-button-size-s_1lq7z_644{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--wide-s--size-m_1lq7z_649{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--wide-s--is-icon-button-size-m_1lq7z_658{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--wide-s--size-l_1lq7z_663{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--wide-s--is-icon-button-size-l_1lq7z_672{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--wide-s--size-xl_1lq7z_677{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--wide-s--is-icon-button-size-xl_1lq7z_686{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--wide-s--size-large_1lq7z_691{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--wide-s--is-icon-button-size-large_1lq7z_700{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--wide-s--size-medium_1lq7z_705{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--wide-s--is-icon-button-size-medium_1lq7z_714{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--wide-s--size-small_1lq7z_719{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--wide-s--is-icon-button-size-small_1lq7z_728{width:var(--5eca09);height:var(--5eca09);padding:0}}@media (min-width: 1900px){._ButtonBase--wide-l--size-xs_1lq7z_735{min-height:var(--50cc65);padding-top:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-bottom:calc((var(--50cc65) - var(--d4313c) * var(--357dd0)) / 2 - var(--0b1b71));padding-left:var(--29b033);padding-right:var(--29b033);font-size:var(--357dd0);letter-spacing:var(--027f88)}._ButtonBase--wide-l--is-icon-button-size-xs_1lq7z_744{width:var(--50cc65);height:var(--50cc65);padding:0}._ButtonBase--wide-l--size-s_1lq7z_749{min-height:var(--2f2e00);padding-top:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-bottom:calc((var(--2f2e00) - var(--d4313c) * var(--b47a67)) / 2 - var(--0b1b71));padding-left:var(--65766b);padding-right:var(--65766b);font-size:var(--b47a67);letter-spacing:var(--fc5c61)}._ButtonBase--wide-l--is-icon-button-size-s_1lq7z_758{width:var(--2f2e00);height:var(--2f2e00);padding:0}._ButtonBase--wide-l--size-m_1lq7z_763{min-height:var(--bcfcbc);padding-top:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-bottom:calc((var(--bcfcbc) - var(--d4313c) * var(--89a358)) / 2 - var(--0b1b71));padding-left:var(--0f2d7e);padding-right:var(--0f2d7e);font-size:var(--89a358);letter-spacing:var(--2e1239)}._ButtonBase--wide-l--is-icon-button-size-m_1lq7z_772{width:var(--bcfcbc);height:var(--bcfcbc);padding:0}._ButtonBase--wide-l--size-l_1lq7z_777{min-height:var(--26156f);padding-top:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-bottom:calc((var(--26156f) - var(--d4313c) * var(--a899be)) / 2 - var(--0b1b71));padding-left:var(--b1c76a);padding-right:var(--b1c76a);font-size:var(--a899be);letter-spacing:var(--c04d5d)}._ButtonBase--wide-l--is-icon-button-size-l_1lq7z_786{width:var(--26156f);height:var(--26156f);padding:0}._ButtonBase--wide-l--size-xl_1lq7z_791{min-height:var(--d6bfc9);padding-top:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-bottom:calc((var(--d6bfc9) - var(--d4313c) * var(--f7be07)) / 2 - var(--0b1b71));padding-left:var(--88eefe);padding-right:var(--88eefe);font-size:var(--f7be07);letter-spacing:var(--a34be4)}._ButtonBase--wide-l--is-icon-button-size-xl_1lq7z_800{width:var(--d6bfc9);height:var(--d6bfc9);padding:0}._ButtonBase--wide-l--size-large_1lq7z_805{min-height:var(--3d8452);padding-top:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-bottom:calc((var(--3d8452) - var(--d4313c) * var(--56d354)) / 2 - var(--0b1b71));padding-left:var(--79f043);padding-right:var(--79f043);font-size:var(--56d354);letter-spacing:var(--dc9bea)}._ButtonBase--wide-l--is-icon-button-size-large_1lq7z_814{width:var(--3d8452);height:var(--3d8452);padding:0}._ButtonBase--wide-l--size-medium_1lq7z_819{min-height:var(--c82a41);padding-top:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-bottom:calc((var(--c82a41) - var(--d4313c) * var(--c84e20)) / 2 - var(--0b1b71));padding-left:var(--aebd97);padding-right:var(--aebd97);font-size:var(--c84e20);letter-spacing:var(--ad1bd2)}._ButtonBase--wide-l--is-icon-button-size-medium_1lq7z_828{width:var(--c82a41);height:var(--c82a41);padding:0}._ButtonBase--wide-l--size-small_1lq7z_833{min-height:var(--5eca09);padding-top:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-bottom:calc((var(--5eca09) - var(--d4313c) * var(--f20194)) / 2 - var(--0b1b71));padding-left:var(--d17b90);padding-right:var(--d17b90);font-size:var(--f20194);letter-spacing:var(--9663af)}._ButtonBase--wide-l--is-icon-button-size-small_1lq7z_842{width:var(--5eca09);height:var(--5eca09);padding:0}}._ButtonBase--variant-primary_1lq7z_848{color:var(--d2baa6);background-color:var(--508b34);border-color:var(--44bfe9);text-decoration:var(--74cfa2)}._ButtonBase--variant-primary--dsInternalSimulation-hover_1lq7z_854{color:var(--df6151);background-color:var(--902b50)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primary_1lq7z_848:hover{color:var(--df6151);background-color:var(--902b50)}}._ButtonBase--variant-primary_1lq7z_848[disabled],._ButtonBase--variant-primary_1lq7z_848[disabled]:hover{border-color:var(--f0720e)}._ButtonBase--variant-primary_1lq7z_848:active,._ButtonBase--variant-primary--dsInternalSimulation-active_1lq7z_869{color:var(--15cee1);background-color:var(--c1c1ca)}._ButtonBase--variant-secondary_1lq7z_873{color:var(--1614c9);background-color:var(--e56164);border-color:var(--ab736c);text-decoration:var(--c6c73d)}._ButtonBase--variant-secondary--dsInternalSimulation-hover_1lq7z_879{color:var(--0d6ae2);background-color:var(--0d124d)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-secondary_1lq7z_873:hover{color:var(--0d6ae2);background-color:var(--0d124d)}}._ButtonBase--variant-secondary_1lq7z_873[disabled],._ButtonBase--variant-secondary_1lq7z_873[disabled]:hover{border-color:var(--3f0f51)}._ButtonBase--variant-secondary_1lq7z_873:active,._ButtonBase--variant-secondary--dsInternalSimulation-active_1lq7z_894{color:var(--22cb4c);background-color:var(--33b439)}._ButtonBase--variant-tertiary_1lq7z_898{color:var(--937543);background-color:var(--28f3c1);border-color:var(--10556e);text-decoration:var(--ce0e6a)}._ButtonBase--variant-tertiary--dsInternalSimulation-hover_1lq7z_904{color:var(--175a77);background-color:var(--ec17be)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-tertiary_1lq7z_898:hover{color:var(--175a77);background-color:var(--ec17be)}}._ButtonBase--variant-tertiary_1lq7z_898[disabled],._ButtonBase--variant-tertiary_1lq7z_898[disabled]:hover{border-color:var(--fd08b7)}._ButtonBase--variant-tertiary_1lq7z_898:active,._ButtonBase--variant-tertiary--dsInternalSimulation-active_1lq7z_919{color:var(--8274ee);background-color:var(--b0bf50)}._ButtonBase--variant-quaternary_1lq7z_923{color:var(--9cf6ec);background-color:var(--e46449);border-color:var(--0e9e01);text-decoration:var(--5c0a2f)}._ButtonBase--variant-quaternary--dsInternalSimulation-hover_1lq7z_929{color:var(--6609c6);background-color:var(--afc176)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-quaternary_1lq7z_923:hover{color:var(--6609c6);background-color:var(--afc176)}}._ButtonBase--variant-quaternary_1lq7z_923[disabled],._ButtonBase--variant-quaternary_1lq7z_923[disabled]:hover{border-color:var(--3e2684)}._ButtonBase--variant-quaternary_1lq7z_923:active,._ButtonBase--variant-quaternary--dsInternalSimulation-active_1lq7z_944{color:var(--e9f226);background-color:var(--2ee553)}._ButtonBase--variant-ghost_1lq7z_948{color:var(--255ddc);background-color:var(--64bffa);border-color:var(--39e128);text-decoration:var(--31d455)}._ButtonBase--variant-ghost--dsInternalSimulation-hover_1lq7z_954{color:var(--e69072);background-color:var(--3b749f)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-ghost_1lq7z_948:hover{color:var(--e69072);background-color:var(--3b749f)}}._ButtonBase--variant-ghost_1lq7z_948[disabled],._ButtonBase--variant-ghost_1lq7z_948[disabled]:hover{border-color:var(--af2d26)}._ButtonBase--variant-ghost_1lq7z_948:active,._ButtonBase--variant-ghost--dsInternalSimulation-active_1lq7z_969{color:var(--ddf285);background-color:var(--6beb48)}._ButtonBase--variant-ghost--is-selected_1lq7z_973{color:var(--5f5238);background-color:var(--a5cfbe)}._ButtonBase--variant-plain_1lq7z_977{color:var(--122a99);background-color:var(--bbb356);border-color:var(--0cad84);text-decoration:var(--d2d32f)}._ButtonBase--variant-plain--dsInternalSimulation-hover_1lq7z_983{color:var(--1265db);background-color:var(--df2aca)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-plain_1lq7z_977:hover{color:var(--1265db);background-color:var(--df2aca)}}._ButtonBase--variant-plain_1lq7z_977[disabled],._ButtonBase--variant-plain_1lq7z_977[disabled]:hover{border-color:var(--c6b607)}._ButtonBase--variant-plain_1lq7z_977:active,._ButtonBase--variant-plain--dsInternalSimulation-active_1lq7z_998{color:var(--a41624);background-color:var(--435fa5)}._ButtonBase--variant-dangerous_1lq7z_1002{color:var(--efde5b);background-color:var(--118bda);border-color:var(--ab5970);text-decoration:var(--0bf14c)}._ButtonBase--variant-dangerous--dsInternalSimulation-hover_1lq7z_1008{color:var(--6f5d5d);background-color:var(--e0b0f4)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-dangerous_1lq7z_1002:hover{color:var(--6f5d5d);background-color:var(--e0b0f4)}}._ButtonBase--variant-dangerous_1lq7z_1002[disabled],._ButtonBase--variant-dangerous_1lq7z_1002[disabled]:hover{border-color:var(--7deffa)}._ButtonBase--variant-dangerous_1lq7z_1002:active,._ButtonBase--variant-dangerous--dsInternalSimulation-active_1lq7z_1023{color:var(--6b4e92);background-color:var(--a5eaa1)}._ButtonBase--variant-critical_1lq7z_1027{color:var(--f68030);background-color:var(--faae28);border-color:var(--b357d0);text-decoration:var(--91f4fa)}._ButtonBase--variant-critical--dsInternalSimulation-hover_1lq7z_1033{color:var(--c3136e);background-color:var(--064c43)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-critical_1lq7z_1027:hover{color:var(--c3136e);background-color:var(--064c43)}}._ButtonBase--variant-critical_1lq7z_1027[disabled],._ButtonBase--variant-critical_1lq7z_1027[disabled]:hover{border-color:var(--e117c7)}._ButtonBase--variant-critical_1lq7z_1027:active,._ButtonBase--variant-critical--dsInternalSimulation-active_1lq7z_1048{color:var(--f9fba8);background-color:var(--152a7a)}._ButtonBase--variant-onColor_1lq7z_1052{color:var(--96343f);background-color:var(--d64a99);border-color:var(--d2723c);text-decoration:var(--af7137)}._ButtonBase--variant-onColor--dsInternalSimulation-hover_1lq7z_1058{color:var(--145384);background-color:var(--549e56)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-onColor_1lq7z_1052:hover{color:var(--145384);background-color:var(--549e56)}}._ButtonBase--variant-onColor_1lq7z_1052[disabled],._ButtonBase--variant-onColor_1lq7z_1052[disabled]:hover{border-color:var(--e1a214)}._ButtonBase--variant-onColor_1lq7z_1052:active,._ButtonBase--variant-onColor--dsInternalSimulation-active_1lq7z_1073{color:var(--f772e8);background-color:var(--936fce)}._ButtonBase--variant-classroom_1lq7z_1077{color:var(--8d482c);background-color:var(--7a038f);border-color:var(--38faba);text-decoration:var(--4d5ea8)}._ButtonBase--variant-classroom--dsInternalSimulation-hover_1lq7z_1083{color:var(--55bfda);background-color:var(--077a93)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-classroom_1lq7z_1077:hover{color:var(--55bfda);background-color:var(--077a93)}}._ButtonBase--variant-classroom_1lq7z_1077[disabled],._ButtonBase--variant-classroom_1lq7z_1077[disabled]:hover{border-color:var(--659377)}._ButtonBase--variant-classroom_1lq7z_1077:active,._ButtonBase--variant-classroom--dsInternalSimulation-active_1lq7z_1098{color:var(--b62751);background-color:var(--45d93a)}._ButtonBase--variant-classroom--is-selected_1lq7z_1102{color:var(--a0b42b);background-color:var(--16a985)}._ButtonBase--variant-primaryB2b_1lq7z_1106{color:var(--4a94de);background-color:var(--6c36b5);border-color:var(--4a9eb5);text-decoration:var(--6c9741)}._ButtonBase--variant-primaryB2b--dsInternalSimulation-hover_1lq7z_1112{color:var(--3e45d7);background-color:var(--dcdb32)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primaryB2b_1lq7z_1106:hover{color:var(--3e45d7);background-color:var(--dcdb32)}}._ButtonBase--variant-primaryB2b_1lq7z_1106[disabled],._ButtonBase--variant-primaryB2b_1lq7z_1106[disabled]:hover{border-color:var(--e7f949)}._ButtonBase--variant-primaryB2b_1lq7z_1106:active,._ButtonBase--variant-primaryB2b--dsInternalSimulation-active_1lq7z_1127{color:var(--cb03bc);background-color:var(--fc3d8b)}._ButtonBase--variant-primaryTutor_1lq7z_1131{color:var(--c93681);background-color:var(--4aa1b1);border-color:var(--f103e9);text-decoration:var(--6e7352)}._ButtonBase--variant-primaryTutor--dsInternalSimulation-hover_1lq7z_1137{color:var(--e91696);background-color:var(--46a009)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-primaryTutor_1lq7z_1131:hover{color:var(--e91696);background-color:var(--46a009)}}._ButtonBase--variant-primaryTutor_1lq7z_1131[disabled],._ButtonBase--variant-primaryTutor_1lq7z_1131[disabled]:hover{border-color:var(--f6a20e)}._ButtonBase--variant-primaryTutor_1lq7z_1131:active,._ButtonBase--variant-primaryTutor--dsInternalSimulation-active_1lq7z_1152{color:var(--58d992);background-color:var(--dd5a43)}._ButtonBase--variant-inverted_1lq7z_1156{color:var(--81b7df);background-color:var(--c54155);border-color:var(--fe1378);text-decoration:var(--fb8624)}._ButtonBase--variant-inverted--dsInternalSimulation-hover_1lq7z_1162{color:var(--79a09e);background-color:var(--8a16b5)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-inverted_1lq7z_1156:hover{color:var(--79a09e);background-color:var(--8a16b5)}}._ButtonBase--variant-inverted_1lq7z_1156[disabled],._ButtonBase--variant-inverted_1lq7z_1156[disabled]:hover{border-color:var(--e797f1)}._ButtonBase--variant-inverted_1lq7z_1156:active,._ButtonBase--variant-inverted--dsInternalSimulation-active_1lq7z_1177{color:var(--77e945);background-color:var(--de59a1)}._ButtonBase--variant-newFeature_1lq7z_1181{color:var(--ad44c3);background-color:var(--7dbfce);border-color:var(--a7eddc);text-decoration:var(--fd7ece)}._ButtonBase--variant-newFeature--dsInternalSimulation-hover_1lq7z_1187{color:var(--ddcea1);background-color:var(--dd2815)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-newFeature_1lq7z_1181:hover{color:var(--ddcea1);background-color:var(--dd2815)}}._ButtonBase--variant-newFeature_1lq7z_1181[disabled],._ButtonBase--variant-newFeature_1lq7z_1181[disabled]:hover{border-color:var(--7d2338)}._ButtonBase--variant-newFeature_1lq7z_1181:active,._ButtonBase--variant-newFeature--dsInternalSimulation-active_1lq7z_1202{color:var(--d4762b);background-color:var(--b3e453)}._ButtonBase--variant-ai_1lq7z_1206{color:var(--aa08fb);background-color:var(--1bdcc0);border-color:var(--8e8894);text-decoration:var(--c82204)}._ButtonBase--variant-ai--dsInternalSimulation-hover_1lq7z_1212{color:var(--59b757);background-color:var(--f043dc)}@media (hover: hover) and (pointer: fine){._ButtonBase--variant-ai_1lq7z_1206:hover{color:var(--59b757);background-color:var(--f043dc)}}._ButtonBase--variant-ai_1lq7z_1206[disabled],._ButtonBase--variant-ai_1lq7z_1206[disabled]:hover{border-color:var(--6ac212)}._ButtonBase--variant-ai_1lq7z_1206:active,._ButtonBase--variant-ai--dsInternalSimulation-active_1lq7z_1227{color:var(--349ae3);background-color:var(--5bba7d)}._ButtonBase--variant-ai_1lq7z_1206{border-image:var(--0b0037)}._ButtonBase--variant-ai_1lq7z_1206[disabled],._ButtonBase--variant-ai_1lq7z_1206[disabled]:hover{border-image:initial;border-color:var(--6ac212)}._ButtonBase--no-wrap_1lq7z_1239{min-width:max-content}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._chips_1lmio_3{display:flex;gap:var(--813599);flex-wrap:wrap}._chips_1lmio_3:is(ul){list-style:none;margin:0;padding:0}._chips_1lmio_3 ._chip_1lmio_3{box-sizing:border-box;cursor:pointer;height:var(--ece0fe);width:fit-content;font-size:var(--475c79);font-weight:var(--a3f251);line-height:var(--e33d9e);color:var(--628fb7);background-color:var(--3546c3);border:solid var(--26b8e3);border-radius:var(--fa4b1a);border-color:var(--c03289);display:flex;align-items:center}._chips_1lmio_3 ._chip_1lmio_3 button{all:unset}@media (hover: hover) and (pointer: fine){._chips_1lmio_3 ._chip_1lmio_3:hover{background-color:var(--302ecf)}}._chips_1lmio_3 ._chip_1lmio_3:has(._chip-toggle_1lmio_37:focus-visible){outline:solid var(--26b8e3) var(--5b4fe9);outline-offset:var(--05dd73)}._chips_1lmio_3 ._chip_1lmio_3:has(._chip-toggle_1lmio_37:active){border-color:var(--11d206);background-color:var(--a5c761)}._chips_1lmio_3 ._chip_1lmio_3:has(._chip-toggle_1lmio_37[aria-pressed=true]){border-color:var(--11d206);background-color:var(--a5c761)}._chips_1lmio_3 ._chip_1lmio_3 ._chip-toggle_1lmio_37{padding:var(--66b80b) var(--813599);display:flex;gap:var(--66b80b)}._chips_1lmio_3 ._chip_1lmio_3 ._chip-remove_1lmio_54{height:fit-content;width:fit-content;display:flex;justify-content:center;align-items:center;padding:var(--66b80b) var(--813599) var(--66b80b) 0;border-radius:inherit}._chips_1lmio_3 ._chip_1lmio_3 ._chip-remove_1lmio_54:focus-visible{outline:solid var(--26b8e3) var(--5b4fe9);outline-offset:var(--109103) var(--05dd73)}._chips_1lmio_3[data-variant=choice] ._chip_1lmio_3:has(._chip-toggle_1lmio_37[aria-pressed=true]){color:var(--c2b191);background-color:var(--4983fe)}._chips_1lmio_3[data-variant=choice] ._chip_1lmio_3 ._chip-remove_1lmio_54{display:none}._chips_1lmio_3[data-variant=filter] ._chip_1lmio_3:has(._chip-toggle_1lmio_37[aria-pressed=false]) ._chip-remove_1lmio_54{display:none}
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-CKrituN3.js";import{F as D}from"./TokyoUIFav-Dzux4Kv4.js";import{a as c}from"./chunk-454WOBUV-B7bWamdB.js";import{r as o}from"./index-CBqU2yxZ.js";import{I as C}from"./Icon-BqBV3_9d.js";import{g as E,w as O}from"./componentNames-Bs6if0Kd.js";import{S as U}from"./StoryContextDSWeb-Cq8y4KZ8.js";import"./v4-CQkTLCs1.js";import"./_commonjsHelpers-BosuxZz1.js";import"./text-accent-DdHX3rNs.js";import"./classNames-Dz8Jm24I.js";import"./render-icon-DsMGBPwY.js";import"./StorybookGlobalStyle-A7XGldSX.js";import"./styled-components.browser.esm-D7-R-tx8.js";import"./RootProvider-CcBxia7g.js";import"./useTheme-BjN7KXjq.js";const Y="_chips_1lmio_3",G="_chip_1lmio_3",b={chips:Y,chip:G,"chip-toggle":"_chip-toggle_1lmio_37","chip-remove":"_chip-remove_1lmio_54"},H=({title:s,titleId:r,...t},n)=>o.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",ref:n,"aria-labelledby":r,...t},s?o.createElement("title",{id:r},s):null,o.createElement("path",{fillRule:"evenodd",d:"M7.207 5.793a1 1 0 0 0-1.414 1.414L10.586 12l-4.793 4.793a1 1 0 1 0 1.414 1.414L12 13.414l4.793 4.793a1 1 0 0 0 1.414-1.414L13.414 12l4.793-4.793a1 1 0 0 0-1.414-1.414L12 10.586 7.207 5.793Z",clipRule:"evenodd"})),K=o.forwardRef(H),a=({variant:s="choice",children:r,"aria-label":t,dataset:n})=>{const i={...n,variant:s};return e.jsx("ul",{"aria-label":t,className:b.chips,...E(i,{preplyDsComponent:O.Chips}),children:r})};a.Item=function({label:r,leadingSvgIcon:t,pressed:n,onToggle:i,onRemove:l,"aria-controls":v,dataset:W}){const g=()=>i==null?void 0:i(!n),L=l??g;return e.jsxs("li",{className:b.chip,...E(W,{preplyDsComponent:O.Chip}),children:[e.jsxs("button",{type:"button",className:b["chip-toggle"],"aria-pressed":n,"aria-controls":v,onClick:g,onKeyUp:z=>{switch(z.key){case"Backspace":case"Delete":if(!n)return;g();break}},children:[t&&e.jsx(C,{size:"24",svg:t}),r]}),e.jsx("button",{type:"button",className:b["chip-remove"],onClick:L,"aria-label":"Remove","aria-controls":v,children:e.jsx(C,{size:"24",svg:K})})]})};try{a.displayName="Chips",a.__docgenInfo={description:"A Chips container.\n\nAdd `Chips.Item` children to render a list of Chips.",displayName:"Chips",props:{variant:{defaultValue:{value:"choice"},description:"The Chip list variant;\n- For simple checkbox-like behaviour, use `choice`.\n- For more complex filtering controls, use `filter`.",name:"variant",required:!1,type:{name:'"choice" | "filter" | undefined'}},"aria-label":{defaultValue:null,description:`Allows assistive technologies to correctly identify and announce
|
|
2
|
+
the Chip list.
|
|
3
|
+
@example <Chips aria-label="tutor filter">
|
|
4
|
+
// When the Chip below is in focus, screen readers may announce it as:
|
|
5
|
+
// "tutor filter list, option 1, Availability, press to toggle"
|
|
6
|
+
<Chips.Item label="Availability" />
|
|
7
|
+
</Chips>`,name:"aria-label",required:!0,type:{name:"string"}},children:{defaultValue:null,description:"These should be `Chips.Item`s.",name:"children",required:!0,type:{name:"ReactNode"}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}}}}}catch{}try{a.Item.displayName="Chips.Item",a.Item.__docgenInfo={description:"",displayName:"Chips.Item",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"ReactNode"}},leadingSvgIcon:{defaultValue:null,description:"",name:"leadingSvgIcon",required:!1,type:{name:"ReactSVGComponentType | undefined"}},pressed:{defaultValue:null,description:`The current state of the Chip; this needs to be controlled manually,
|
|
8
|
+
to cater for cases in which a Chip also controls a seperate filter menu.`,name:"pressed",required:!0,type:{name:"boolean"}},onToggle:{defaultValue:null,description:"Called when the Chip is pressed, and returns the resulting state udpate.\n@see `ChipItemProps.pressed` for controlling the Chip state.\n@see `ChipItemProps.onRemove` for when the user removes the Chip.",name:"onToggle",required:!1,type:{name:"((newState: boolean) => void) | undefined"}},onRemove:{defaultValue:null,description:"Called when the Chip's remove (`X`) button is clicked.\nThis is only available for `filter` Chips.",name:"onRemove",required:!1,type:{name:"(() => void) | undefined"}},"aria-controls":{defaultValue:null,description:`If the Chip toggles the presence or content of another element, set this
|
|
9
|
+
prop to the ID of that element.
|
|
10
|
+
@example <Chips variant="filter">
|
|
11
|
+
<Chips.Item
|
|
12
|
+
label="Availability"
|
|
13
|
+
pressed={filterByAvailability}
|
|
14
|
+
aria-controls="tutor-search-list"
|
|
15
|
+
/>
|
|
16
|
+
</Chips>
|
|
17
|
+
...
|
|
18
|
+
<TutorSearchList id="tutor-search-list" />`,name:"aria-controls",required:!1,type:{name:"string | undefined"}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}}}}}catch{}const de={title:"components/Chips",component:a,subcomponents:{Item:a.Item},parameters:{docs:{description:`
|
|
19
|
+
Chips streamline filtering or action selection for users.
|
|
20
|
+
|
|
21
|
+
See page on [Path](https://zeroheight.com/62fdeb7ec/v/latest/p/79810d-chip) site for design and usage info.
|
|
22
|
+
`}},decorators:[s=>e.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:e.jsx(U,{theme:"tokyo-ui",children:s()})})]},f=()=>{const[s,r]=o.useState(!1);return e.jsx(a,{"aria-label":"Chips",children:e.jsx(a.Item,{label:"Chip",pressed:s,onToggle:r})})},p=()=>{const[s,r]=o.useState({Ambition:!1,Boldness:!1,Collaboration:!0});return e.jsx(a,{variant:"choice","aria-label":"Principle choices",children:Object.entries(s).map(([t,n])=>e.jsx(a.Item,{label:t,pressed:n,onToggle:i=>{r(l=>({...l,[t]:i})),c(`Toggle ${t} ${i?"on":"off"}`)()}},t))})};p.parameters={docs:{description:{story:"`Choice` Chips are used to select from a list of suggested options."}}};const d=()=>{const[s,r]=o.useState({Ambition:!1,Boldness:!1,Collaboration:!0});return e.jsx(a,{variant:"choice","aria-label":"Principle choices",children:Object.entries(s).map(([t,n])=>e.jsx(a.Item,{label:t,leadingSvgIcon:D,pressed:n,onToggle:i=>{r(l=>({...l,[t]:i})),c(`Toggle ${t} ${i?"on":"off"}`)()}},t))})};d.parameters={docs:{description:{story:"They may also have leading icons:"}}};const m=()=>{const[s,r]=o.useState({Ambition:!1,Boldness:!1,Collaboration:!0});return e.jsx(a,{variant:"filter","aria-label":"Principle filters",children:Object.entries(s).map(([t,n])=>e.jsx(a.Item,{label:t,pressed:n,onToggle:i=>{r(l=>({...l,[t]:i})),c(`Toggle ${t} ${i?"on":"off"}`)()}},t))})};m.parameters={docs:{description:{story:"`Filter` Chips are used to add and remove filtering options from a list."}}};const u=()=>{const[s,r]=o.useState({Ambition:!1,Boldness:!1,Collaboration:!0});return e.jsx(a,{variant:"filter","aria-label":"Principle filters",children:Object.entries(s).map(([t,n])=>e.jsx(a.Item,{label:t,leadingSvgIcon:D,pressed:n,onToggle:i=>{r(l=>({...l,[t]:i})),c(`Toggle ${t} ${i?"on":"off"}`)()}},t))})};u.parameters={docs:{description:{story:"They may also have leading icons:"}}};const h=()=>{const[s,r]=o.useState(!1),[t,n]=o.useState(void 0);return e.jsxs("div",{children:[e.jsx(a,{variant:"filter","aria-label":"Principle filters",children:e.jsx(a.Item,{label:"Principles",pressed:s,onToggle:i=>{if(t!==void 0){n(void 0),c("Clear selected filter")();return}r(i),c(`Toggle filter ${i?"on":"off"}`)()},onRemove:()=>{n(void 0),r(!1),c("Remove filter")()},"aria-controls":"principle-menu"})}),e.jsx("div",{id:"principle-menu",children:s&&(t?e.jsxs(e.Fragment,{children:[e.jsx("p",{children:"Your favorite principle is:"}),e.jsx("p",{children:t})]}):e.jsxs(e.Fragment,{children:[e.jsx("p",{children:"What's your favorite principle?"}),e.jsxs("form",{onSubmit:i=>{i.preventDefault(),n(i.nativeEvent.submitter.value)},children:[e.jsx("input",{type:"submit",value:"Ambition"}),e.jsx("input",{type:"submit",value:"Boldness"}),e.jsx("input",{type:"submit",value:"Collaboration"})]})]}))})]})};h.parameters={docs:{description:{story:`
|
|
23
|
+
Here is a complex example in which a chip can toggle a sub-flow for filter
|
|
24
|
+
selection:
|
|
25
|
+
`}}};var y,x,S;f.parameters={...f.parameters,docs:{...(y=f.parameters)==null?void 0:y.docs,source:{originalSource:`() => {
|
|
26
|
+
const [pressed, setPressed] = useState(false);
|
|
27
|
+
return <Chips aria-label="Chips">
|
|
28
|
+
<Chips.Item label="Chip" pressed={pressed} onToggle={setPressed} />
|
|
29
|
+
</Chips>;
|
|
30
|
+
}`,...(S=(x=f.parameters)==null?void 0:x.docs)==null?void 0:S.source}}};var I,j,P;p.parameters={...p.parameters,docs:{...(I=p.parameters)==null?void 0:I.docs,source:{originalSource:`() => {
|
|
31
|
+
const [choices, setChoices] = useState({
|
|
32
|
+
Ambition: false,
|
|
33
|
+
Boldness: false,
|
|
34
|
+
Collaboration: true
|
|
35
|
+
});
|
|
36
|
+
return <Chips variant="choice" aria-label="Principle choices">
|
|
37
|
+
{Object.entries(choices).map(([name, pressed]) => <Chips.Item key={name} label={name} pressed={pressed} onToggle={newState => {
|
|
38
|
+
setChoices(prev => ({
|
|
39
|
+
...prev,
|
|
40
|
+
[name]: newState
|
|
41
|
+
}));
|
|
42
|
+
action(\`Toggle \${name} \${newState ? 'on' : 'off'}\`)();
|
|
43
|
+
}} />)}
|
|
44
|
+
</Chips>;
|
|
45
|
+
}`,...(P=(j=p.parameters)==null?void 0:j.docs)==null?void 0:P.source}}};var w,_,T;d.parameters={...d.parameters,docs:{...(w=d.parameters)==null?void 0:w.docs,source:{originalSource:`() => {
|
|
46
|
+
const [choices, setChoices] = useState({
|
|
47
|
+
Ambition: false,
|
|
48
|
+
Boldness: false,
|
|
49
|
+
Collaboration: true
|
|
50
|
+
});
|
|
51
|
+
return <Chips variant="choice" aria-label="Principle choices">
|
|
52
|
+
{Object.entries(choices).map(([name, pressed]) => <Chips.Item key={name} label={name} leadingSvgIcon={FavIcon} pressed={pressed} onToggle={newState => {
|
|
53
|
+
setChoices(prev => ({
|
|
54
|
+
...prev,
|
|
55
|
+
[name]: newState
|
|
56
|
+
}));
|
|
57
|
+
action(\`Toggle \${name} \${newState ? 'on' : 'off'}\`)();
|
|
58
|
+
}} />)}
|
|
59
|
+
</Chips>;
|
|
60
|
+
}`,...(T=(_=d.parameters)==null?void 0:_.docs)==null?void 0:T.source}}};var F,A,$;m.parameters={...m.parameters,docs:{...(F=m.parameters)==null?void 0:F.docs,source:{originalSource:`() => {
|
|
61
|
+
const [filters, setFilters] = useState({
|
|
62
|
+
Ambition: false,
|
|
63
|
+
Boldness: false,
|
|
64
|
+
Collaboration: true
|
|
65
|
+
});
|
|
66
|
+
return <Chips variant="filter" aria-label="Principle filters">
|
|
67
|
+
{Object.entries(filters).map(([name, pressed]) => <Chips.Item key={name} label={name} pressed={pressed} onToggle={newState => {
|
|
68
|
+
setFilters(prev => ({
|
|
69
|
+
...prev,
|
|
70
|
+
[name]: newState
|
|
71
|
+
}));
|
|
72
|
+
action(\`Toggle \${name} \${newState ? 'on' : 'off'}\`)();
|
|
73
|
+
}} />)}
|
|
74
|
+
</Chips>;
|
|
75
|
+
}`,...($=(A=m.parameters)==null?void 0:A.docs)==null?void 0:$.source}}};var R,B,k;u.parameters={...u.parameters,docs:{...(R=u.parameters)==null?void 0:R.docs,source:{originalSource:`() => {
|
|
76
|
+
const [filters, setFilters] = useState({
|
|
77
|
+
Ambition: false,
|
|
78
|
+
Boldness: false,
|
|
79
|
+
Collaboration: true
|
|
80
|
+
});
|
|
81
|
+
return <Chips variant="filter" aria-label="Principle filters">
|
|
82
|
+
{Object.entries(filters).map(([name, pressed]) => <Chips.Item key={name} label={name} leadingSvgIcon={FavIcon} pressed={pressed} onToggle={newState => {
|
|
83
|
+
setFilters(prev => ({
|
|
84
|
+
...prev,
|
|
85
|
+
[name]: newState
|
|
86
|
+
}));
|
|
87
|
+
action(\`Toggle \${name} \${newState ? 'on' : 'off'}\`)();
|
|
88
|
+
}} />)}
|
|
89
|
+
</Chips>;
|
|
90
|
+
}`,...(k=(B=u.parameters)==null?void 0:B.docs)==null?void 0:k.source}}};var V,q,N;h.parameters={...h.parameters,docs:{...(V=h.parameters)==null?void 0:V.docs,source:{originalSource:`() => {
|
|
91
|
+
const [filterPrinciple, setFilterPrinciple] = useState(false);
|
|
92
|
+
const [principle, setPrinciple] = useState<string | undefined>(undefined);
|
|
93
|
+
return <div>
|
|
94
|
+
<Chips variant="filter" aria-label="Principle filters">
|
|
95
|
+
<Chips.Item label="Principles" pressed={filterPrinciple} onToggle={newState => {
|
|
96
|
+
if (principle !== undefined) {
|
|
97
|
+
setPrinciple(undefined);
|
|
98
|
+
action('Clear selected filter')();
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
setFilterPrinciple(newState);
|
|
102
|
+
action(\`Toggle filter \${newState ? 'on' : 'off'}\`)();
|
|
103
|
+
}} onRemove={() => {
|
|
104
|
+
setPrinciple(undefined);
|
|
105
|
+
setFilterPrinciple(false);
|
|
106
|
+
action('Remove filter')();
|
|
107
|
+
}} aria-controls="principle-menu" />
|
|
108
|
+
</Chips>
|
|
109
|
+
<div id="principle-menu">
|
|
110
|
+
{filterPrinciple && (principle ? <>
|
|
111
|
+
<p>Your favorite principle is:</p>
|
|
112
|
+
<p>{principle}</p>
|
|
113
|
+
</> : <>
|
|
114
|
+
<p>What's your favorite principle?</p>
|
|
115
|
+
<form onSubmit={e => {
|
|
116
|
+
e.preventDefault();
|
|
117
|
+
// @ts-expect-error - submitter exists https://developer.mozilla.org/en-US/docs/Web/API/SubmitEvent/submitter
|
|
118
|
+
setPrinciple(e.nativeEvent.submitter.value);
|
|
119
|
+
}}>
|
|
120
|
+
<input type="submit" value="Ambition" />
|
|
121
|
+
<input type="submit" value="Boldness" />
|
|
122
|
+
<input type="submit" value="Collaboration" />
|
|
123
|
+
</form>
|
|
124
|
+
</>)}
|
|
125
|
+
</div>
|
|
126
|
+
</div>;
|
|
127
|
+
}`,...(N=(q=h.parameters)==null?void 0:q.docs)==null?void 0:N.source}}};const me=["Base","Choice","ChoiceWithIcons","Filter","FilterWithIcons","ComplexFilter"];export{f as Base,p as Choice,d as ChoiceWithIcons,h as ComplexFilter,m as Filter,u as FilterWithIcons,me as __namedExportsOrder,de as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{ak as Me,al as $,a2 as ie,a0 as Ce,w as $e,am as Oe,an as Ie}from"./index-B46pI2Oc.js";import{R as h,r as m}from"./index-CBqU2yxZ.js";import{g as ue}from"./_commonjsHelpers-BosuxZz1.js";import{_ as Ne,i as fe}from"./index-nrpnv_Jx.js";import"./iframe-lho9TVh-.js";import"../sb-preview/runtime.js";import"./index-CbwENYX-.js";import"./index-D-8MO0q_.js";import"./index-DrFu-skq.js";function I(){return(I=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function J(e,t){if(e==null)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)t.indexOf(n=a[r])>=0||(o[n]=e[n]);return o}function K(e){var t=m.useRef(e),n=m.useRef(function(r){t.current&&t.current(r)});return t.current=e,n.current}var R=function(e,t,n){return t===void 0&&(t=0),n===void 0&&(n=1),e>n?n:e<t?t:e},F=function(e){return"touches"in e},V=function(e){return e&&e.ownerDocument.defaultView||self},te=function(e,t,n){var r=e.getBoundingClientRect(),o=F(t)?function(a,s){for(var l=0;l<a.length;l++)if(a[l].identifier===s)return a[l];return a[0]}(t.touches,n):t;return{left:R((o.pageX-(r.left+V(e).pageXOffset))/r.width),top:R((o.pageY-(r.top+V(e).pageYOffset))/r.height)}},ne=function(e){!F(e)&&e.preventDefault()},Q=h.memo(function(e){var t=e.onMove,n=e.onKey,r=J(e,["onMove","onKey"]),o=m.useRef(null),a=K(t),s=K(n),l=m.useRef(null),c=m.useRef(!1),i=m.useMemo(function(){var x=function(p){ne(p),(F(p)?p.touches.length>0:p.buttons>0)&&o.current?a(te(o.current,p,l.current)):M(!1)},j=function(){return M(!1)};function M(p){var b=c.current,w=V(o.current),E=p?w.addEventListener:w.removeEventListener;E(b?"touchmove":"mousemove",x),E(b?"touchend":"mouseup",j)}return[function(p){var b=p.nativeEvent,w=o.current;if(w&&(ne(b),!function(k,O){return O&&!F(k)}(b,c.current)&&w)){if(F(b)){c.current=!0;var E=b.changedTouches||[];E.length&&(l.current=E[0].identifier)}w.focus(),a(te(w,b,l.current)),M(!0)}},function(p){var b=p.which||p.keyCode;b<37||b>40||(p.preventDefault(),s({left:b===39?.05:b===37?-.05:0,top:b===40?.05:b===38?-.05:0}))},M]},[s,a]),d=i[0],f=i[1],g=i[2];return m.useEffect(function(){return g},[g]),h.createElement("div",I({},r,{onTouchStart:d,onMouseDown:d,className:"react-colorful__interactive",ref:o,onKeyDown:f,tabIndex:0,role:"slider"}))}),T=function(e){return e.filter(Boolean).join(" ")},Z=function(e){var t=e.color,n=e.left,r=e.top,o=r===void 0?.5:r,a=T(["react-colorful__pointer",e.className]);return h.createElement("div",{className:a,style:{top:100*o+"%",left:100*n+"%"}},h.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:t}}))},y=function(e,t,n){return t===void 0&&(t=0),n===void 0&&(n=Math.pow(10,t)),Math.round(n*e)/n},Se={grad:.9,turn:360,rad:360/(2*Math.PI)},Re=function(e){return ge(A(e))},A=function(e){return e[0]==="#"&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:e.length===4?y(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:e.length===8?y(parseInt(e.substring(6,8),16)/255,2):1}},je=function(e,t){return t===void 0&&(t="deg"),Number(e)*(Se[t]||1)},ze=function(e){var t=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return t?Fe({h:je(t[1],t[2]),s:Number(t[3]),l:Number(t[4]),a:t[5]===void 0?1:Number(t[5])/(t[6]?100:1)}):{h:0,s:0,v:0,a:1}},Fe=function(e){var t=e.s,n=e.l;return{h:e.h,s:(t*=(n<50?n:100-n)/100)>0?2*t/(n+t)*100:0,v:n+t,a:e.a}},He=function(e){return Pe(de(e))},he=function(e){var t=e.s,n=e.v,r=e.a,o=(200-t)*n/100;return{h:y(e.h),s:y(o>0&&o<200?t*n/100/(o<=100?o:200-o)*100:0),l:y(o/2),a:y(r,2)}},G=function(e){var t=he(e);return"hsl("+t.h+", "+t.s+"%, "+t.l+"%)"},B=function(e){var t=he(e);return"hsla("+t.h+", "+t.s+"%, "+t.l+"%, "+t.a+")"},de=function(e){var t=e.h,n=e.s,r=e.v,o=e.a;t=t/360*6,n/=100,r/=100;var a=Math.floor(t),s=r*(1-n),l=r*(1-(t-a)*n),c=r*(1-(1-t+a)*n),i=a%6;return{r:y(255*[r,l,s,s,c,r][i]),g:y(255*[c,r,r,l,s,s][i]),b:y(255*[s,s,c,r,r,l][i]),a:y(o,2)}},Te=function(e){var t=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return t?ge({r:Number(t[1])/(t[2]?100/255:1),g:Number(t[3])/(t[4]?100/255:1),b:Number(t[5])/(t[6]?100/255:1),a:t[7]===void 0?1:Number(t[7])/(t[8]?100:1)}):{h:0,s:0,v:0,a:1}},P=function(e){var t=e.toString(16);return t.length<2?"0"+t:t},Pe=function(e){var t=e.r,n=e.g,r=e.b,o=e.a,a=o<1?P(y(255*o)):"";return"#"+P(t)+P(n)+P(r)+a},ge=function(e){var t=e.r,n=e.g,r=e.b,o=e.a,a=Math.max(t,n,r),s=a-Math.min(t,n,r),l=s?a===t?(n-r)/s:a===n?2+(r-t)/s:4+(t-n)/s:0;return{h:y(60*(l<0?l+6:l)),s:y(a?s/a*100:0),v:y(a/255*100),a:o}},me=h.memo(function(e){var t=e.hue,n=e.onChange,r=T(["react-colorful__hue",e.className]);return h.createElement("div",{className:r},h.createElement(Q,{onMove:function(o){n({h:360*o.left})},onKey:function(o){n({h:R(t+360*o.left,0,360)})},"aria-label":"Hue","aria-valuenow":y(t),"aria-valuemax":"360","aria-valuemin":"0"},h.createElement(Z,{className:"react-colorful__hue-pointer",left:t/360,color:G({h:t,s:100,v:100,a:1})})))}),be=h.memo(function(e){var t=e.hsva,n=e.onChange,r={backgroundColor:G({h:t.h,s:100,v:100,a:1})};return h.createElement("div",{className:"react-colorful__saturation",style:r},h.createElement(Q,{onMove:function(o){n({s:100*o.left,v:100-100*o.top})},onKey:function(o){n({s:R(t.s+100*o.left,0,100),v:R(t.v-100*o.top,0,100)})},"aria-label":"Color","aria-valuetext":"Saturation "+y(t.s)+"%, Brightness "+y(t.v)+"%"},h.createElement(Z,{className:"react-colorful__saturation-pointer",top:1-t.v/100,left:t.s/100,color:G(t)})))}),ve=function(e,t){if(e===t)return!0;for(var n in e)if(e[n]!==t[n])return!1;return!0},pe=function(e,t){return e.replace(/\s/g,"")===t.replace(/\s/g,"")},Le=function(e,t){return e.toLowerCase()===t.toLowerCase()||ve(A(e),A(t))};function ye(e,t,n){var r=K(n),o=m.useState(function(){return e.toHsva(t)}),a=o[0],s=o[1],l=m.useRef({color:t,hsva:a});m.useEffect(function(){if(!e.equal(t,l.current.color)){var i=e.toHsva(t);l.current={hsva:i,color:t},s(i)}},[t,e]),m.useEffect(function(){var i;ve(a,l.current.hsva)||e.equal(i=e.fromHsva(a),l.current.color)||(l.current={hsva:a,color:i},r(i))},[a,e,r]);var c=m.useCallback(function(i){s(function(d){return Object.assign({},d,i)})},[]);return[a,c]}var qe=typeof window<"u"?m.useLayoutEffect:m.useEffect,Be=function(){return typeof __webpack_nonce__<"u"?__webpack_nonce__:void 0},re=new Map,xe=function(e){qe(function(){var t=e.current?e.current.ownerDocument:document;if(t!==void 0&&!re.has(t)){var n=t.createElement("style");n.innerHTML=`.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}`,re.set(t,n);var r=Be();r&&n.setAttribute("nonce",r),t.head.appendChild(n)}},[])},Xe=function(e){var t=e.className,n=e.colorModel,r=e.color,o=r===void 0?n.defaultColor:r,a=e.onChange,s=J(e,["className","colorModel","color","onChange"]),l=m.useRef(null);xe(l);var c=ye(n,o,a),i=c[0],d=c[1],f=T(["react-colorful",t]);return h.createElement("div",I({},s,{ref:l,className:f}),h.createElement(be,{hsva:i,onChange:d}),h.createElement(me,{hue:i.h,onChange:d,className:"react-colorful__last-control"}))},De={defaultColor:"000",toHsva:Re,fromHsva:function(e){return He({h:e.h,s:e.s,v:e.v,a:1})},equal:Le},We=function(e){return h.createElement(Xe,I({},e,{colorModel:De}))},Ke=function(e){var t=e.className,n=e.hsva,r=e.onChange,o={backgroundImage:"linear-gradient(90deg, "+B(Object.assign({},n,{a:0}))+", "+B(Object.assign({},n,{a:1}))+")"},a=T(["react-colorful__alpha",t]),s=y(100*n.a);return h.createElement("div",{className:a},h.createElement("div",{className:"react-colorful__alpha-gradient",style:o}),h.createElement(Q,{onMove:function(l){r({a:l.left})},onKey:function(l){r({a:R(n.a+l.left)})},"aria-label":"Alpha","aria-valuetext":s+"%","aria-valuenow":s,"aria-valuemin":"0","aria-valuemax":"100"},h.createElement(Z,{className:"react-colorful__alpha-pointer",left:n.a,color:B(n)})))},we=function(e){var t=e.className,n=e.colorModel,r=e.color,o=r===void 0?n.defaultColor:r,a=e.onChange,s=J(e,["className","colorModel","color","onChange"]),l=m.useRef(null);xe(l);var c=ye(n,o,a),i=c[0],d=c[1],f=T(["react-colorful",t]);return h.createElement("div",I({},s,{ref:l,className:f}),h.createElement(be,{hsva:i,onChange:d}),h.createElement(me,{hue:i.h,onChange:d}),h.createElement(Ke,{hsva:i,onChange:d,className:"react-colorful__last-control"}))},Ve={defaultColor:"hsla(0, 0%, 0%, 1)",toHsva:ze,fromHsva:B,equal:pe},Ae=function(e){return h.createElement(we,I({},e,{colorModel:Ve}))},Ge={defaultColor:"rgba(0, 0, 0, 1)",toHsva:Te,fromHsva:function(e){var t=de(e);return"rgba("+t.r+", "+t.g+", "+t.b+", "+t.a+")"},equal:pe},Ue=function(e){return h.createElement(we,I({},e,{colorModel:Ge}))},Ye={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]};const H=Ye,ke={};for(const e of Object.keys(H))ke[H[e]]=e;const u={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};var _e=u;for(const e of Object.keys(u)){if(!("channels"in u[e]))throw new Error("missing channels property: "+e);if(!("labels"in u[e]))throw new Error("missing channel labels property: "+e);if(u[e].labels.length!==u[e].channels)throw new Error("channel and label counts mismatch: "+e);const{channels:t,labels:n}=u[e];delete u[e].channels,delete u[e].labels,Object.defineProperty(u[e],"channels",{value:t}),Object.defineProperty(u[e],"labels",{value:n})}u.rgb.hsl=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(t,n,r),a=Math.max(t,n,r),s=a-o;let l,c;a===o?l=0:t===a?l=(n-r)/s:n===a?l=2+(r-t)/s:r===a&&(l=4+(t-n)/s),l=Math.min(l*60,360),l<0&&(l+=360);const i=(o+a)/2;return a===o?c=0:i<=.5?c=s/(a+o):c=s/(2-a-o),[l,c*100,i*100]};u.rgb.hsv=function(e){let t,n,r,o,a;const s=e[0]/255,l=e[1]/255,c=e[2]/255,i=Math.max(s,l,c),d=i-Math.min(s,l,c),f=function(g){return(i-g)/6/d+1/2};return d===0?(o=0,a=0):(a=d/i,t=f(s),n=f(l),r=f(c),s===i?o=r-n:l===i?o=1/3+t-r:c===i&&(o=2/3+n-t),o<0?o+=1:o>1&&(o-=1)),[o*360,a*100,i*100]};u.rgb.hwb=function(e){const t=e[0],n=e[1];let r=e[2];const o=u.rgb.hsl(e)[0],a=1/255*Math.min(t,Math.min(n,r));return r=1-1/255*Math.max(t,Math.max(n,r)),[o,a*100,r*100]};u.rgb.cmyk=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(1-t,1-n,1-r),a=(1-t-o)/(1-o)||0,s=(1-n-o)/(1-o)||0,l=(1-r-o)/(1-o)||0;return[a*100,s*100,l*100,o*100]};function Je(e,t){return(e[0]-t[0])**2+(e[1]-t[1])**2+(e[2]-t[2])**2}u.rgb.keyword=function(e){const t=ke[e];if(t)return t;let n=1/0,r;for(const o of Object.keys(H)){const a=H[o],s=Je(e,a);s<n&&(n=s,r=o)}return r};u.keyword.rgb=function(e){return H[e]};u.rgb.xyz=function(e){let t=e[0]/255,n=e[1]/255,r=e[2]/255;t=t>.04045?((t+.055)/1.055)**2.4:t/12.92,n=n>.04045?((n+.055)/1.055)**2.4:n/12.92,r=r>.04045?((r+.055)/1.055)**2.4:r/12.92;const o=t*.4124+n*.3576+r*.1805,a=t*.2126+n*.7152+r*.0722,s=t*.0193+n*.1192+r*.9505;return[o*100,a*100,s*100]};u.rgb.lab=function(e){const t=u.rgb.xyz(e);let n=t[0],r=t[1],o=t[2];n/=95.047,r/=100,o/=108.883,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116,o=o>.008856?o**(1/3):7.787*o+16/116;const a=116*r-16,s=500*(n-r),l=200*(r-o);return[a,s,l]};u.hsl.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;let o,a,s;if(n===0)return s=r*255,[s,s,s];r<.5?o=r*(1+n):o=r+n-r*n;const l=2*r-o,c=[0,0,0];for(let i=0;i<3;i++)a=t+1/3*-(i-1),a<0&&a++,a>1&&a--,6*a<1?s=l+(o-l)*6*a:2*a<1?s=o:3*a<2?s=l+(o-l)*(2/3-a)*6:s=l,c[i]=s*255;return c};u.hsl.hsv=function(e){const t=e[0];let n=e[1]/100,r=e[2]/100,o=n;const a=Math.max(r,.01);r*=2,n*=r<=1?r:2-r,o*=a<=1?a:2-a;const s=(r+n)/2,l=r===0?2*o/(a+o):2*n/(r+n);return[t,l*100,s*100]};u.hsv.rgb=function(e){const t=e[0]/60,n=e[1]/100;let r=e[2]/100;const o=Math.floor(t)%6,a=t-Math.floor(t),s=255*r*(1-n),l=255*r*(1-n*a),c=255*r*(1-n*(1-a));switch(r*=255,o){case 0:return[r,c,s];case 1:return[l,r,s];case 2:return[s,r,c];case 3:return[s,l,r];case 4:return[c,s,r];case 5:return[r,s,l]}};u.hsv.hsl=function(e){const t=e[0],n=e[1]/100,r=e[2]/100,o=Math.max(r,.01);let a,s;s=(2-n)*r;const l=(2-n)*o;return a=n*o,a/=l<=1?l:2-l,a=a||0,s/=2,[t,a*100,s*100]};u.hwb.rgb=function(e){const t=e[0]/360;let n=e[1]/100,r=e[2]/100;const o=n+r;let a;o>1&&(n/=o,r/=o);const s=Math.floor(6*t),l=1-r;a=6*t-s,s&1&&(a=1-a);const c=n+a*(l-n);let i,d,f;switch(s){default:case 6:case 0:i=l,d=c,f=n;break;case 1:i=c,d=l,f=n;break;case 2:i=n,d=l,f=c;break;case 3:i=n,d=c,f=l;break;case 4:i=c,d=n,f=l;break;case 5:i=l,d=n,f=c;break}return[i*255,d*255,f*255]};u.cmyk.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100,o=e[3]/100,a=1-Math.min(1,t*(1-o)+o),s=1-Math.min(1,n*(1-o)+o),l=1-Math.min(1,r*(1-o)+o);return[a*255,s*255,l*255]};u.xyz.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100;let o,a,s;return o=t*3.2406+n*-1.5372+r*-.4986,a=t*-.9689+n*1.8758+r*.0415,s=t*.0557+n*-.204+r*1.057,o=o>.0031308?1.055*o**(1/2.4)-.055:o*12.92,a=a>.0031308?1.055*a**(1/2.4)-.055:a*12.92,s=s>.0031308?1.055*s**(1/2.4)-.055:s*12.92,o=Math.min(Math.max(0,o),1),a=Math.min(Math.max(0,a),1),s=Math.min(Math.max(0,s),1),[o*255,a*255,s*255]};u.xyz.lab=function(e){let t=e[0],n=e[1],r=e[2];t/=95.047,n/=100,r/=108.883,t=t>.008856?t**(1/3):7.787*t+16/116,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116;const o=116*n-16,a=500*(t-n),s=200*(n-r);return[o,a,s]};u.lab.xyz=function(e){const t=e[0],n=e[1],r=e[2];let o,a,s;a=(t+16)/116,o=n/500+a,s=a-r/200;const l=a**3,c=o**3,i=s**3;return a=l>.008856?l:(a-16/116)/7.787,o=c>.008856?c:(o-16/116)/7.787,s=i>.008856?i:(s-16/116)/7.787,o*=95.047,a*=100,s*=108.883,[o,a,s]};u.lab.lch=function(e){const t=e[0],n=e[1],r=e[2];let o;o=Math.atan2(r,n)*360/2/Math.PI,o<0&&(o+=360);const s=Math.sqrt(n*n+r*r);return[t,s,o]};u.lch.lab=function(e){const t=e[0],n=e[1],o=e[2]/360*2*Math.PI,a=n*Math.cos(o),s=n*Math.sin(o);return[t,a,s]};u.rgb.ansi16=function(e,t=null){const[n,r,o]=e;let a=t===null?u.rgb.hsv(e)[2]:t;if(a=Math.round(a/50),a===0)return 30;let s=30+(Math.round(o/255)<<2|Math.round(r/255)<<1|Math.round(n/255));return a===2&&(s+=60),s};u.hsv.ansi16=function(e){return u.rgb.ansi16(u.hsv.rgb(e),e[2])};u.rgb.ansi256=function(e){const t=e[0],n=e[1],r=e[2];return t===n&&n===r?t<8?16:t>248?231:Math.round((t-8)/247*24)+232:16+36*Math.round(t/255*5)+6*Math.round(n/255*5)+Math.round(r/255*5)};u.ansi16.rgb=function(e){let t=e%10;if(t===0||t===7)return e>50&&(t+=3.5),t=t/10.5*255,[t,t,t];const n=(~~(e>50)+1)*.5,r=(t&1)*n*255,o=(t>>1&1)*n*255,a=(t>>2&1)*n*255;return[r,o,a]};u.ansi256.rgb=function(e){if(e>=232){const a=(e-232)*10+8;return[a,a,a]}e-=16;let t;const n=Math.floor(e/36)/5*255,r=Math.floor((t=e%36)/6)/5*255,o=t%6/5*255;return[n,r,o]};u.rgb.hex=function(e){const n=(((Math.round(e[0])&255)<<16)+((Math.round(e[1])&255)<<8)+(Math.round(e[2])&255)).toString(16).toUpperCase();return"000000".substring(n.length)+n};u.hex.rgb=function(e){const t=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!t)return[0,0,0];let n=t[0];t[0].length===3&&(n=n.split("").map(l=>l+l).join(""));const r=parseInt(n,16),o=r>>16&255,a=r>>8&255,s=r&255;return[o,a,s]};u.rgb.hcg=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.max(Math.max(t,n),r),a=Math.min(Math.min(t,n),r),s=o-a;let l,c;return s<1?l=a/(1-s):l=0,s<=0?c=0:o===t?c=(n-r)/s%6:o===n?c=2+(r-t)/s:c=4+(t-n)/s,c/=6,c%=1,[c*360,s*100,l*100]};u.hsl.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=n<.5?2*t*n:2*t*(1-n);let o=0;return r<1&&(o=(n-.5*r)/(1-r)),[e[0],r*100,o*100]};u.hsv.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=t*n;let o=0;return r<1&&(o=(n-r)/(1-r)),[e[0],r*100,o*100]};u.hcg.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;if(n===0)return[r*255,r*255,r*255];const o=[0,0,0],a=t%1*6,s=a%1,l=1-s;let c=0;switch(Math.floor(a)){case 0:o[0]=1,o[1]=s,o[2]=0;break;case 1:o[0]=l,o[1]=1,o[2]=0;break;case 2:o[0]=0,o[1]=1,o[2]=s;break;case 3:o[0]=0,o[1]=l,o[2]=1;break;case 4:o[0]=s,o[1]=0,o[2]=1;break;default:o[0]=1,o[1]=0,o[2]=l}return c=(1-n)*r,[(n*o[0]+c)*255,(n*o[1]+c)*255,(n*o[2]+c)*255]};u.hcg.hsv=function(e){const t=e[1]/100,n=e[2]/100,r=t+n*(1-t);let o=0;return r>0&&(o=t/r),[e[0],o*100,r*100]};u.hcg.hsl=function(e){const t=e[1]/100,r=e[2]/100*(1-t)+.5*t;let o=0;return r>0&&r<.5?o=t/(2*r):r>=.5&&r<1&&(o=t/(2*(1-r))),[e[0],o*100,r*100]};u.hcg.hwb=function(e){const t=e[1]/100,n=e[2]/100,r=t+n*(1-t);return[e[0],(r-t)*100,(1-r)*100]};u.hwb.hcg=function(e){const t=e[1]/100,r=1-e[2]/100,o=r-t;let a=0;return o<1&&(a=(r-o)/(1-o)),[e[0],o*100,a*100]};u.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]};u.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]};u.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]};u.gray.hsl=function(e){return[0,0,e[0]]};u.gray.hsv=u.gray.hsl;u.gray.hwb=function(e){return[0,100,e[0]]};u.gray.cmyk=function(e){return[0,0,0,e[0]]};u.gray.lab=function(e){return[e[0],0,0]};u.gray.hex=function(e){const t=Math.round(e[0]/100*255)&255,r=((t<<16)+(t<<8)+t).toString(16).toUpperCase();return"000000".substring(r.length)+r};u.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]};const X=_e;function Qe(){const e={},t=Object.keys(X);for(let n=t.length,r=0;r<n;r++)e[t[r]]={distance:-1,parent:null};return e}function Ze(e){const t=Qe(),n=[e];for(t[e].distance=0;n.length;){const r=n.pop(),o=Object.keys(X[r]);for(let a=o.length,s=0;s<a;s++){const l=o[s],c=t[l];c.distance===-1&&(c.distance=t[r].distance+1,c.parent=r,n.unshift(l))}}return t}function et(e,t){return function(n){return t(e(n))}}function tt(e,t){const n=[t[e].parent,e];let r=X[t[e].parent][e],o=t[e].parent;for(;t[o].parent;)n.unshift(t[o].parent),r=et(X[t[o].parent][o],r),o=t[o].parent;return r.conversion=n,r}var nt=function(e){const t=Ze(e),n={},r=Object.keys(t);for(let o=r.length,a=0;a<o;a++){const s=r[a];t[s].parent!==null&&(n[s]=tt(s,t))}return n};const U=_e,rt=nt,N={},ot=Object.keys(U);function at(e){const t=function(...n){const r=n[0];return r==null?r:(r.length>1&&(n=r),e(n))};return"conversion"in e&&(t.conversion=e.conversion),t}function st(e){const t=function(...n){const r=n[0];if(r==null)return r;r.length>1&&(n=r);const o=e(n);if(typeof o=="object")for(let a=o.length,s=0;s<a;s++)o[s]=Math.round(o[s]);return o};return"conversion"in e&&(t.conversion=e.conversion),t}ot.forEach(e=>{N[e]={},Object.defineProperty(N[e],"channels",{value:U[e].channels}),Object.defineProperty(N[e],"labels",{value:U[e].labels});const t=rt(e);Object.keys(t).forEach(r=>{const o=t[r];N[e][r]=st(o),N[e][r].raw=at(o)})});var lt=N;const _=ue(lt);var ct=Ne,it=function(){return ct.Date.now()},ut=it,ft=/\s/;function ht(e){for(var t=e.length;t--&&ft.test(e.charAt(t)););return t}var dt=ht,gt=dt,mt=/^\s+/;function bt(e){return e&&e.slice(0,gt(e)+1).replace(mt,"")}var vt=bt,pt=vt,oe=fe,yt=Me,ae=NaN,xt=/^[-+]0x[0-9a-f]+$/i,wt=/^0b[01]+$/i,kt=/^0o[0-7]+$/i,_t=parseInt;function Et(e){if(typeof e=="number")return e;if(yt(e))return ae;if(oe(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=oe(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=pt(e);var n=wt.test(e);return n||kt.test(e)?_t(e.slice(2),n?2:8):xt.test(e)?ae:+e}var Mt=Et,Ct=fe,W=ut,se=Mt,$t="Expected a function",Ot=Math.max,It=Math.min;function Nt(e,t,n){var r,o,a,s,l,c,i=0,d=!1,f=!1,g=!0;if(typeof e!="function")throw new TypeError($t);t=se(t)||0,Ct(n)&&(d=!!n.leading,f="maxWait"in n,a=f?Ot(se(n.maxWait)||0,t):a,g="trailing"in n?!!n.trailing:g);function x(v){var C=r,z=o;return r=o=void 0,i=v,s=e.apply(z,C),s}function j(v){return i=v,l=setTimeout(b,t),d?x(v):s}function M(v){var C=v-c,z=v-i,ee=t-C;return f?It(ee,a-z):ee}function p(v){var C=v-c,z=v-i;return c===void 0||C>=t||C<0||f&&z>=a}function b(){var v=W();if(p(v))return w(v);l=setTimeout(b,M(v))}function w(v){return l=void 0,g&&r?x(v):(r=o=void 0,s)}function E(){l!==void 0&&clearTimeout(l),i=0,r=c=o=l=void 0}function k(){return l===void 0?s:w(W())}function O(){var v=W(),C=p(v);if(r=arguments,o=this,c=v,C){if(l===void 0)return j(c);if(f)return clearTimeout(l),l=setTimeout(b,t),x(c)}return l===void 0&&(l=setTimeout(b,t)),s}return O.cancel=E,O.flush=k,O}var St=Nt;const Rt=ue(St);var jt=$.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),zt=$(ie)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),Ft=$.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),Ht=$(Ce)(({theme:e})=>({fontFamily:e.typography.fonts.base})),Tt=$.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),Pt=$.div(({theme:e,active:t})=>({width:16,height:16,boxShadow:t?`${e.appBorderColor} 0 0 0 1px inset, ${e.textMutedColor}50 0 0 0 4px`:`${e.appBorderColor} 0 0 0 1px inset`,borderRadius:e.appBorderRadius})),Lt=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,le=({value:e,style:t,...n})=>{let r=`linear-gradient(${e}, ${e}), ${Lt}, linear-gradient(#fff, #fff)`;return h.createElement(Pt,{...n,style:{...t,backgroundImage:r}})},qt=$($e.Input)(({theme:e,readOnly:t})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:e.typography.fonts.base})),Bt=$(Oe)(({theme:e})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:e.input.color})),Ee=(e=>(e.RGB="rgb",e.HSL="hsl",e.HEX="hex",e))(Ee||{}),L=Object.values(Ee),Xt=/\(([0-9]+),\s*([0-9]+)%?,\s*([0-9]+)%?,?\s*([0-9.]+)?\)/,Dt=/^\s*rgba?\(([0-9]+),\s*([0-9]+),\s*([0-9]+),?\s*([0-9.]+)?\)\s*$/i,Wt=/^\s*hsla?\(([0-9]+),\s*([0-9]+)%,\s*([0-9]+)%,?\s*([0-9.]+)?\)\s*$/i,Y=/^\s*#?([0-9a-f]{3}|[0-9a-f]{6})\s*$/i,Kt=/^\s*#?([0-9a-f]{3})\s*$/i,Vt={hex:We,rgb:Ue,hsl:Ae},q={hex:"transparent",rgb:"rgba(0, 0, 0, 0)",hsl:"hsla(0, 0%, 0%, 0)"},ce=e=>{let t=e==null?void 0:e.match(Xt);if(!t)return[0,0,0,1];let[,n,r,o,a=1]=t;return[n,r,o,a].map(Number)},S=e=>{if(!e)return;let t=!0;if(Dt.test(e)){let[s,l,c,i]=ce(e),[d,f,g]=_.rgb.hsl([s,l,c])||[0,0,0];return{valid:t,value:e,keyword:_.rgb.keyword([s,l,c]),colorSpace:"rgb",rgb:e,hsl:`hsla(${d}, ${f}%, ${g}%, ${i})`,hex:`#${_.rgb.hex([s,l,c]).toLowerCase()}`}}if(Wt.test(e)){let[s,l,c,i]=ce(e),[d,f,g]=_.hsl.rgb([s,l,c])||[0,0,0];return{valid:t,value:e,keyword:_.hsl.keyword([s,l,c]),colorSpace:"hsl",rgb:`rgba(${d}, ${f}, ${g}, ${i})`,hsl:e,hex:`#${_.hsl.hex([s,l,c]).toLowerCase()}`}}let n=e.replace("#",""),r=_.keyword.rgb(n)||_.hex.rgb(n),o=_.rgb.hsl(r),a=e;if(/[^#a-f0-9]/i.test(e)?a=n:Y.test(e)&&(a=`#${n}`),a.startsWith("#"))t=Y.test(a);else try{_.keyword.hex(a)}catch{t=!1}return{valid:t,value:a,keyword:_.rgb.keyword(r),colorSpace:"hex",rgb:`rgba(${r[0]}, ${r[1]}, ${r[2]}, 1)`,hsl:`hsla(${o[0]}, ${o[1]}%, ${o[2]}%, 1)`,hex:a}},At=(e,t,n)=>{if(!e||!(t!=null&&t.valid))return q[n];if(n!=="hex")return(t==null?void 0:t[n])||q[n];if(!t.hex.startsWith("#"))try{return`#${_.keyword.hex(t.hex)}`}catch{return q.hex}let r=t.hex.match(Kt);if(!r)return Y.test(t.hex)?t.hex:q.hex;let[o,a,s]=r[1].split("");return`#${o}${o}${a}${a}${s}${s}`},Gt=(e,t)=>{let[n,r]=m.useState(e||""),[o,a]=m.useState(()=>S(n)),[s,l]=m.useState((o==null?void 0:o.colorSpace)||"hex");m.useEffect(()=>{let f=e||"",g=S(f);r(f),a(g),l((g==null?void 0:g.colorSpace)||"hex")},[e]);let c=m.useMemo(()=>At(n,o,s).toLowerCase(),[n,o,s]),i=m.useCallback(f=>{let g=S(f),x=(g==null?void 0:g.value)||f||"";r(x),x===""&&(a(void 0),t(void 0)),g&&(a(g),l(g.colorSpace),t(g.value))},[t]),d=m.useCallback(()=>{let f=L.indexOf(s)+1;f>=L.length&&(f=0),l(L[f]);let g=(o==null?void 0:o[L[f]])||"";r(g),t(g)},[o,s,t]);return{value:n,realValue:c,updateValue:i,color:o,colorSpace:s,cycleColorSpace:d}},D=e=>e.replace(/\s*/,"").toLowerCase(),Ut=(e,t,n)=>{let[r,o]=m.useState(t!=null&&t.valid?[t]:[]);m.useEffect(()=>{t===void 0&&o([])},[t]);let a=m.useMemo(()=>(e||[]).map(l=>typeof l=="string"?S(l):l.title?{...S(l.color),keyword:l.title}:S(l.color)).concat(r).filter(Boolean).slice(-27),[e,r]),s=m.useCallback(l=>{l!=null&&l.valid&&(a.some(c=>D(c[n])===D(l[n]))||o(c=>c.concat(l)))},[n,a]);return{presets:a,addPreset:s}},Yt=({name:e,value:t,onChange:n,onFocus:r,onBlur:o,presetColors:a,startOpen:s=!1,argType:l})=>{var E;let c=m.useCallback(Rt(n,200),[n]),{value:i,realValue:d,updateValue:f,color:g,colorSpace:x,cycleColorSpace:j}=Gt(t,c),{presets:M,addPreset:p}=Ut(a,g,x),b=Vt[x],w=!!((E=l==null?void 0:l.table)!=null&&E.readonly);return h.createElement(jt,{"aria-readonly":w},h.createElement(zt,{startOpen:s,trigger:w?[null]:void 0,closeOnOutsideClick:!0,onVisibleChange:()=>p(g),tooltip:h.createElement(Ft,null,h.createElement(b,{color:d==="transparent"?"#000000":d,onChange:f,onFocus:r,onBlur:o}),M.length>0&&h.createElement(Tt,null,M.map((k,O)=>h.createElement(ie,{key:`${k.value}-${O}`,hasChrome:!1,tooltip:h.createElement(Ht,{note:k.keyword||k.value})},h.createElement(le,{value:k[x],active:g&&D(k[x])===D(g[x]),onClick:()=>f(k.value)})))))},h.createElement(le,{value:d,style:{margin:4}})),h.createElement(qt,{id:Ie(e),value:i,onChange:k=>f(k.target.value),onFocus:k=>k.target.select(),readOnly:w,placeholder:"Choose color..."}),i?h.createElement(Bt,{onClick:j}):null)},sn=Yt;export{Yt as ColorControl,sn as default};
|
|
1
|
+
import{al as Me,am as $,a2 as ie,a0 as Ce,w as $e,an as Oe,ao as Ie}from"./index-Cs2Qo7ol.js";import{R as h,r as m}from"./index-CBqU2yxZ.js";import{g as ue}from"./_commonjsHelpers-BosuxZz1.js";import{_ as Ne,i as fe}from"./index-nrpnv_Jx.js";import"./iframe-C9-tEs2g.js";import"../sb-preview/runtime.js";import"./index-CbwENYX-.js";import"./index-D-8MO0q_.js";import"./index-DrFu-skq.js";function I(){return(I=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function J(e,t){if(e==null)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)t.indexOf(n=a[r])>=0||(o[n]=e[n]);return o}function K(e){var t=m.useRef(e),n=m.useRef(function(r){t.current&&t.current(r)});return t.current=e,n.current}var R=function(e,t,n){return t===void 0&&(t=0),n===void 0&&(n=1),e>n?n:e<t?t:e},F=function(e){return"touches"in e},V=function(e){return e&&e.ownerDocument.defaultView||self},te=function(e,t,n){var r=e.getBoundingClientRect(),o=F(t)?function(a,s){for(var l=0;l<a.length;l++)if(a[l].identifier===s)return a[l];return a[0]}(t.touches,n):t;return{left:R((o.pageX-(r.left+V(e).pageXOffset))/r.width),top:R((o.pageY-(r.top+V(e).pageYOffset))/r.height)}},ne=function(e){!F(e)&&e.preventDefault()},Q=h.memo(function(e){var t=e.onMove,n=e.onKey,r=J(e,["onMove","onKey"]),o=m.useRef(null),a=K(t),s=K(n),l=m.useRef(null),c=m.useRef(!1),i=m.useMemo(function(){var x=function(p){ne(p),(F(p)?p.touches.length>0:p.buttons>0)&&o.current?a(te(o.current,p,l.current)):M(!1)},j=function(){return M(!1)};function M(p){var b=c.current,w=V(o.current),E=p?w.addEventListener:w.removeEventListener;E(b?"touchmove":"mousemove",x),E(b?"touchend":"mouseup",j)}return[function(p){var b=p.nativeEvent,w=o.current;if(w&&(ne(b),!function(k,O){return O&&!F(k)}(b,c.current)&&w)){if(F(b)){c.current=!0;var E=b.changedTouches||[];E.length&&(l.current=E[0].identifier)}w.focus(),a(te(w,b,l.current)),M(!0)}},function(p){var b=p.which||p.keyCode;b<37||b>40||(p.preventDefault(),s({left:b===39?.05:b===37?-.05:0,top:b===40?.05:b===38?-.05:0}))},M]},[s,a]),d=i[0],f=i[1],g=i[2];return m.useEffect(function(){return g},[g]),h.createElement("div",I({},r,{onTouchStart:d,onMouseDown:d,className:"react-colorful__interactive",ref:o,onKeyDown:f,tabIndex:0,role:"slider"}))}),T=function(e){return e.filter(Boolean).join(" ")},Z=function(e){var t=e.color,n=e.left,r=e.top,o=r===void 0?.5:r,a=T(["react-colorful__pointer",e.className]);return h.createElement("div",{className:a,style:{top:100*o+"%",left:100*n+"%"}},h.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:t}}))},y=function(e,t,n){return t===void 0&&(t=0),n===void 0&&(n=Math.pow(10,t)),Math.round(n*e)/n},Se={grad:.9,turn:360,rad:360/(2*Math.PI)},Re=function(e){return ge(A(e))},A=function(e){return e[0]==="#"&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:e.length===4?y(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:e.length===8?y(parseInt(e.substring(6,8),16)/255,2):1}},je=function(e,t){return t===void 0&&(t="deg"),Number(e)*(Se[t]||1)},ze=function(e){var t=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return t?Fe({h:je(t[1],t[2]),s:Number(t[3]),l:Number(t[4]),a:t[5]===void 0?1:Number(t[5])/(t[6]?100:1)}):{h:0,s:0,v:0,a:1}},Fe=function(e){var t=e.s,n=e.l;return{h:e.h,s:(t*=(n<50?n:100-n)/100)>0?2*t/(n+t)*100:0,v:n+t,a:e.a}},He=function(e){return Pe(de(e))},he=function(e){var t=e.s,n=e.v,r=e.a,o=(200-t)*n/100;return{h:y(e.h),s:y(o>0&&o<200?t*n/100/(o<=100?o:200-o)*100:0),l:y(o/2),a:y(r,2)}},G=function(e){var t=he(e);return"hsl("+t.h+", "+t.s+"%, "+t.l+"%)"},B=function(e){var t=he(e);return"hsla("+t.h+", "+t.s+"%, "+t.l+"%, "+t.a+")"},de=function(e){var t=e.h,n=e.s,r=e.v,o=e.a;t=t/360*6,n/=100,r/=100;var a=Math.floor(t),s=r*(1-n),l=r*(1-(t-a)*n),c=r*(1-(1-t+a)*n),i=a%6;return{r:y(255*[r,l,s,s,c,r][i]),g:y(255*[c,r,r,l,s,s][i]),b:y(255*[s,s,c,r,r,l][i]),a:y(o,2)}},Te=function(e){var t=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return t?ge({r:Number(t[1])/(t[2]?100/255:1),g:Number(t[3])/(t[4]?100/255:1),b:Number(t[5])/(t[6]?100/255:1),a:t[7]===void 0?1:Number(t[7])/(t[8]?100:1)}):{h:0,s:0,v:0,a:1}},P=function(e){var t=e.toString(16);return t.length<2?"0"+t:t},Pe=function(e){var t=e.r,n=e.g,r=e.b,o=e.a,a=o<1?P(y(255*o)):"";return"#"+P(t)+P(n)+P(r)+a},ge=function(e){var t=e.r,n=e.g,r=e.b,o=e.a,a=Math.max(t,n,r),s=a-Math.min(t,n,r),l=s?a===t?(n-r)/s:a===n?2+(r-t)/s:4+(t-n)/s:0;return{h:y(60*(l<0?l+6:l)),s:y(a?s/a*100:0),v:y(a/255*100),a:o}},me=h.memo(function(e){var t=e.hue,n=e.onChange,r=T(["react-colorful__hue",e.className]);return h.createElement("div",{className:r},h.createElement(Q,{onMove:function(o){n({h:360*o.left})},onKey:function(o){n({h:R(t+360*o.left,0,360)})},"aria-label":"Hue","aria-valuenow":y(t),"aria-valuemax":"360","aria-valuemin":"0"},h.createElement(Z,{className:"react-colorful__hue-pointer",left:t/360,color:G({h:t,s:100,v:100,a:1})})))}),be=h.memo(function(e){var t=e.hsva,n=e.onChange,r={backgroundColor:G({h:t.h,s:100,v:100,a:1})};return h.createElement("div",{className:"react-colorful__saturation",style:r},h.createElement(Q,{onMove:function(o){n({s:100*o.left,v:100-100*o.top})},onKey:function(o){n({s:R(t.s+100*o.left,0,100),v:R(t.v-100*o.top,0,100)})},"aria-label":"Color","aria-valuetext":"Saturation "+y(t.s)+"%, Brightness "+y(t.v)+"%"},h.createElement(Z,{className:"react-colorful__saturation-pointer",top:1-t.v/100,left:t.s/100,color:G(t)})))}),ve=function(e,t){if(e===t)return!0;for(var n in e)if(e[n]!==t[n])return!1;return!0},pe=function(e,t){return e.replace(/\s/g,"")===t.replace(/\s/g,"")},Le=function(e,t){return e.toLowerCase()===t.toLowerCase()||ve(A(e),A(t))};function ye(e,t,n){var r=K(n),o=m.useState(function(){return e.toHsva(t)}),a=o[0],s=o[1],l=m.useRef({color:t,hsva:a});m.useEffect(function(){if(!e.equal(t,l.current.color)){var i=e.toHsva(t);l.current={hsva:i,color:t},s(i)}},[t,e]),m.useEffect(function(){var i;ve(a,l.current.hsva)||e.equal(i=e.fromHsva(a),l.current.color)||(l.current={hsva:a,color:i},r(i))},[a,e,r]);var c=m.useCallback(function(i){s(function(d){return Object.assign({},d,i)})},[]);return[a,c]}var qe=typeof window<"u"?m.useLayoutEffect:m.useEffect,Be=function(){return typeof __webpack_nonce__<"u"?__webpack_nonce__:void 0},re=new Map,xe=function(e){qe(function(){var t=e.current?e.current.ownerDocument:document;if(t!==void 0&&!re.has(t)){var n=t.createElement("style");n.innerHTML=`.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}`,re.set(t,n);var r=Be();r&&n.setAttribute("nonce",r),t.head.appendChild(n)}},[])},Xe=function(e){var t=e.className,n=e.colorModel,r=e.color,o=r===void 0?n.defaultColor:r,a=e.onChange,s=J(e,["className","colorModel","color","onChange"]),l=m.useRef(null);xe(l);var c=ye(n,o,a),i=c[0],d=c[1],f=T(["react-colorful",t]);return h.createElement("div",I({},s,{ref:l,className:f}),h.createElement(be,{hsva:i,onChange:d}),h.createElement(me,{hue:i.h,onChange:d,className:"react-colorful__last-control"}))},De={defaultColor:"000",toHsva:Re,fromHsva:function(e){return He({h:e.h,s:e.s,v:e.v,a:1})},equal:Le},We=function(e){return h.createElement(Xe,I({},e,{colorModel:De}))},Ke=function(e){var t=e.className,n=e.hsva,r=e.onChange,o={backgroundImage:"linear-gradient(90deg, "+B(Object.assign({},n,{a:0}))+", "+B(Object.assign({},n,{a:1}))+")"},a=T(["react-colorful__alpha",t]),s=y(100*n.a);return h.createElement("div",{className:a},h.createElement("div",{className:"react-colorful__alpha-gradient",style:o}),h.createElement(Q,{onMove:function(l){r({a:l.left})},onKey:function(l){r({a:R(n.a+l.left)})},"aria-label":"Alpha","aria-valuetext":s+"%","aria-valuenow":s,"aria-valuemin":"0","aria-valuemax":"100"},h.createElement(Z,{className:"react-colorful__alpha-pointer",left:n.a,color:B(n)})))},we=function(e){var t=e.className,n=e.colorModel,r=e.color,o=r===void 0?n.defaultColor:r,a=e.onChange,s=J(e,["className","colorModel","color","onChange"]),l=m.useRef(null);xe(l);var c=ye(n,o,a),i=c[0],d=c[1],f=T(["react-colorful",t]);return h.createElement("div",I({},s,{ref:l,className:f}),h.createElement(be,{hsva:i,onChange:d}),h.createElement(me,{hue:i.h,onChange:d}),h.createElement(Ke,{hsva:i,onChange:d,className:"react-colorful__last-control"}))},Ve={defaultColor:"hsla(0, 0%, 0%, 1)",toHsva:ze,fromHsva:B,equal:pe},Ae=function(e){return h.createElement(we,I({},e,{colorModel:Ve}))},Ge={defaultColor:"rgba(0, 0, 0, 1)",toHsva:Te,fromHsva:function(e){var t=de(e);return"rgba("+t.r+", "+t.g+", "+t.b+", "+t.a+")"},equal:pe},Ue=function(e){return h.createElement(we,I({},e,{colorModel:Ge}))},Ye={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]};const H=Ye,ke={};for(const e of Object.keys(H))ke[H[e]]=e;const u={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};var _e=u;for(const e of Object.keys(u)){if(!("channels"in u[e]))throw new Error("missing channels property: "+e);if(!("labels"in u[e]))throw new Error("missing channel labels property: "+e);if(u[e].labels.length!==u[e].channels)throw new Error("channel and label counts mismatch: "+e);const{channels:t,labels:n}=u[e];delete u[e].channels,delete u[e].labels,Object.defineProperty(u[e],"channels",{value:t}),Object.defineProperty(u[e],"labels",{value:n})}u.rgb.hsl=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(t,n,r),a=Math.max(t,n,r),s=a-o;let l,c;a===o?l=0:t===a?l=(n-r)/s:n===a?l=2+(r-t)/s:r===a&&(l=4+(t-n)/s),l=Math.min(l*60,360),l<0&&(l+=360);const i=(o+a)/2;return a===o?c=0:i<=.5?c=s/(a+o):c=s/(2-a-o),[l,c*100,i*100]};u.rgb.hsv=function(e){let t,n,r,o,a;const s=e[0]/255,l=e[1]/255,c=e[2]/255,i=Math.max(s,l,c),d=i-Math.min(s,l,c),f=function(g){return(i-g)/6/d+1/2};return d===0?(o=0,a=0):(a=d/i,t=f(s),n=f(l),r=f(c),s===i?o=r-n:l===i?o=1/3+t-r:c===i&&(o=2/3+n-t),o<0?o+=1:o>1&&(o-=1)),[o*360,a*100,i*100]};u.rgb.hwb=function(e){const t=e[0],n=e[1];let r=e[2];const o=u.rgb.hsl(e)[0],a=1/255*Math.min(t,Math.min(n,r));return r=1-1/255*Math.max(t,Math.max(n,r)),[o,a*100,r*100]};u.rgb.cmyk=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(1-t,1-n,1-r),a=(1-t-o)/(1-o)||0,s=(1-n-o)/(1-o)||0,l=(1-r-o)/(1-o)||0;return[a*100,s*100,l*100,o*100]};function Je(e,t){return(e[0]-t[0])**2+(e[1]-t[1])**2+(e[2]-t[2])**2}u.rgb.keyword=function(e){const t=ke[e];if(t)return t;let n=1/0,r;for(const o of Object.keys(H)){const a=H[o],s=Je(e,a);s<n&&(n=s,r=o)}return r};u.keyword.rgb=function(e){return H[e]};u.rgb.xyz=function(e){let t=e[0]/255,n=e[1]/255,r=e[2]/255;t=t>.04045?((t+.055)/1.055)**2.4:t/12.92,n=n>.04045?((n+.055)/1.055)**2.4:n/12.92,r=r>.04045?((r+.055)/1.055)**2.4:r/12.92;const o=t*.4124+n*.3576+r*.1805,a=t*.2126+n*.7152+r*.0722,s=t*.0193+n*.1192+r*.9505;return[o*100,a*100,s*100]};u.rgb.lab=function(e){const t=u.rgb.xyz(e);let n=t[0],r=t[1],o=t[2];n/=95.047,r/=100,o/=108.883,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116,o=o>.008856?o**(1/3):7.787*o+16/116;const a=116*r-16,s=500*(n-r),l=200*(r-o);return[a,s,l]};u.hsl.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;let o,a,s;if(n===0)return s=r*255,[s,s,s];r<.5?o=r*(1+n):o=r+n-r*n;const l=2*r-o,c=[0,0,0];for(let i=0;i<3;i++)a=t+1/3*-(i-1),a<0&&a++,a>1&&a--,6*a<1?s=l+(o-l)*6*a:2*a<1?s=o:3*a<2?s=l+(o-l)*(2/3-a)*6:s=l,c[i]=s*255;return c};u.hsl.hsv=function(e){const t=e[0];let n=e[1]/100,r=e[2]/100,o=n;const a=Math.max(r,.01);r*=2,n*=r<=1?r:2-r,o*=a<=1?a:2-a;const s=(r+n)/2,l=r===0?2*o/(a+o):2*n/(r+n);return[t,l*100,s*100]};u.hsv.rgb=function(e){const t=e[0]/60,n=e[1]/100;let r=e[2]/100;const o=Math.floor(t)%6,a=t-Math.floor(t),s=255*r*(1-n),l=255*r*(1-n*a),c=255*r*(1-n*(1-a));switch(r*=255,o){case 0:return[r,c,s];case 1:return[l,r,s];case 2:return[s,r,c];case 3:return[s,l,r];case 4:return[c,s,r];case 5:return[r,s,l]}};u.hsv.hsl=function(e){const t=e[0],n=e[1]/100,r=e[2]/100,o=Math.max(r,.01);let a,s;s=(2-n)*r;const l=(2-n)*o;return a=n*o,a/=l<=1?l:2-l,a=a||0,s/=2,[t,a*100,s*100]};u.hwb.rgb=function(e){const t=e[0]/360;let n=e[1]/100,r=e[2]/100;const o=n+r;let a;o>1&&(n/=o,r/=o);const s=Math.floor(6*t),l=1-r;a=6*t-s,s&1&&(a=1-a);const c=n+a*(l-n);let i,d,f;switch(s){default:case 6:case 0:i=l,d=c,f=n;break;case 1:i=c,d=l,f=n;break;case 2:i=n,d=l,f=c;break;case 3:i=n,d=c,f=l;break;case 4:i=c,d=n,f=l;break;case 5:i=l,d=n,f=c;break}return[i*255,d*255,f*255]};u.cmyk.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100,o=e[3]/100,a=1-Math.min(1,t*(1-o)+o),s=1-Math.min(1,n*(1-o)+o),l=1-Math.min(1,r*(1-o)+o);return[a*255,s*255,l*255]};u.xyz.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100;let o,a,s;return o=t*3.2406+n*-1.5372+r*-.4986,a=t*-.9689+n*1.8758+r*.0415,s=t*.0557+n*-.204+r*1.057,o=o>.0031308?1.055*o**(1/2.4)-.055:o*12.92,a=a>.0031308?1.055*a**(1/2.4)-.055:a*12.92,s=s>.0031308?1.055*s**(1/2.4)-.055:s*12.92,o=Math.min(Math.max(0,o),1),a=Math.min(Math.max(0,a),1),s=Math.min(Math.max(0,s),1),[o*255,a*255,s*255]};u.xyz.lab=function(e){let t=e[0],n=e[1],r=e[2];t/=95.047,n/=100,r/=108.883,t=t>.008856?t**(1/3):7.787*t+16/116,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116;const o=116*n-16,a=500*(t-n),s=200*(n-r);return[o,a,s]};u.lab.xyz=function(e){const t=e[0],n=e[1],r=e[2];let o,a,s;a=(t+16)/116,o=n/500+a,s=a-r/200;const l=a**3,c=o**3,i=s**3;return a=l>.008856?l:(a-16/116)/7.787,o=c>.008856?c:(o-16/116)/7.787,s=i>.008856?i:(s-16/116)/7.787,o*=95.047,a*=100,s*=108.883,[o,a,s]};u.lab.lch=function(e){const t=e[0],n=e[1],r=e[2];let o;o=Math.atan2(r,n)*360/2/Math.PI,o<0&&(o+=360);const s=Math.sqrt(n*n+r*r);return[t,s,o]};u.lch.lab=function(e){const t=e[0],n=e[1],o=e[2]/360*2*Math.PI,a=n*Math.cos(o),s=n*Math.sin(o);return[t,a,s]};u.rgb.ansi16=function(e,t=null){const[n,r,o]=e;let a=t===null?u.rgb.hsv(e)[2]:t;if(a=Math.round(a/50),a===0)return 30;let s=30+(Math.round(o/255)<<2|Math.round(r/255)<<1|Math.round(n/255));return a===2&&(s+=60),s};u.hsv.ansi16=function(e){return u.rgb.ansi16(u.hsv.rgb(e),e[2])};u.rgb.ansi256=function(e){const t=e[0],n=e[1],r=e[2];return t===n&&n===r?t<8?16:t>248?231:Math.round((t-8)/247*24)+232:16+36*Math.round(t/255*5)+6*Math.round(n/255*5)+Math.round(r/255*5)};u.ansi16.rgb=function(e){let t=e%10;if(t===0||t===7)return e>50&&(t+=3.5),t=t/10.5*255,[t,t,t];const n=(~~(e>50)+1)*.5,r=(t&1)*n*255,o=(t>>1&1)*n*255,a=(t>>2&1)*n*255;return[r,o,a]};u.ansi256.rgb=function(e){if(e>=232){const a=(e-232)*10+8;return[a,a,a]}e-=16;let t;const n=Math.floor(e/36)/5*255,r=Math.floor((t=e%36)/6)/5*255,o=t%6/5*255;return[n,r,o]};u.rgb.hex=function(e){const n=(((Math.round(e[0])&255)<<16)+((Math.round(e[1])&255)<<8)+(Math.round(e[2])&255)).toString(16).toUpperCase();return"000000".substring(n.length)+n};u.hex.rgb=function(e){const t=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!t)return[0,0,0];let n=t[0];t[0].length===3&&(n=n.split("").map(l=>l+l).join(""));const r=parseInt(n,16),o=r>>16&255,a=r>>8&255,s=r&255;return[o,a,s]};u.rgb.hcg=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.max(Math.max(t,n),r),a=Math.min(Math.min(t,n),r),s=o-a;let l,c;return s<1?l=a/(1-s):l=0,s<=0?c=0:o===t?c=(n-r)/s%6:o===n?c=2+(r-t)/s:c=4+(t-n)/s,c/=6,c%=1,[c*360,s*100,l*100]};u.hsl.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=n<.5?2*t*n:2*t*(1-n);let o=0;return r<1&&(o=(n-.5*r)/(1-r)),[e[0],r*100,o*100]};u.hsv.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=t*n;let o=0;return r<1&&(o=(n-r)/(1-r)),[e[0],r*100,o*100]};u.hcg.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;if(n===0)return[r*255,r*255,r*255];const o=[0,0,0],a=t%1*6,s=a%1,l=1-s;let c=0;switch(Math.floor(a)){case 0:o[0]=1,o[1]=s,o[2]=0;break;case 1:o[0]=l,o[1]=1,o[2]=0;break;case 2:o[0]=0,o[1]=1,o[2]=s;break;case 3:o[0]=0,o[1]=l,o[2]=1;break;case 4:o[0]=s,o[1]=0,o[2]=1;break;default:o[0]=1,o[1]=0,o[2]=l}return c=(1-n)*r,[(n*o[0]+c)*255,(n*o[1]+c)*255,(n*o[2]+c)*255]};u.hcg.hsv=function(e){const t=e[1]/100,n=e[2]/100,r=t+n*(1-t);let o=0;return r>0&&(o=t/r),[e[0],o*100,r*100]};u.hcg.hsl=function(e){const t=e[1]/100,r=e[2]/100*(1-t)+.5*t;let o=0;return r>0&&r<.5?o=t/(2*r):r>=.5&&r<1&&(o=t/(2*(1-r))),[e[0],o*100,r*100]};u.hcg.hwb=function(e){const t=e[1]/100,n=e[2]/100,r=t+n*(1-t);return[e[0],(r-t)*100,(1-r)*100]};u.hwb.hcg=function(e){const t=e[1]/100,r=1-e[2]/100,o=r-t;let a=0;return o<1&&(a=(r-o)/(1-o)),[e[0],o*100,a*100]};u.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]};u.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]};u.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]};u.gray.hsl=function(e){return[0,0,e[0]]};u.gray.hsv=u.gray.hsl;u.gray.hwb=function(e){return[0,100,e[0]]};u.gray.cmyk=function(e){return[0,0,0,e[0]]};u.gray.lab=function(e){return[e[0],0,0]};u.gray.hex=function(e){const t=Math.round(e[0]/100*255)&255,r=((t<<16)+(t<<8)+t).toString(16).toUpperCase();return"000000".substring(r.length)+r};u.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]};const X=_e;function Qe(){const e={},t=Object.keys(X);for(let n=t.length,r=0;r<n;r++)e[t[r]]={distance:-1,parent:null};return e}function Ze(e){const t=Qe(),n=[e];for(t[e].distance=0;n.length;){const r=n.pop(),o=Object.keys(X[r]);for(let a=o.length,s=0;s<a;s++){const l=o[s],c=t[l];c.distance===-1&&(c.distance=t[r].distance+1,c.parent=r,n.unshift(l))}}return t}function et(e,t){return function(n){return t(e(n))}}function tt(e,t){const n=[t[e].parent,e];let r=X[t[e].parent][e],o=t[e].parent;for(;t[o].parent;)n.unshift(t[o].parent),r=et(X[t[o].parent][o],r),o=t[o].parent;return r.conversion=n,r}var nt=function(e){const t=Ze(e),n={},r=Object.keys(t);for(let o=r.length,a=0;a<o;a++){const s=r[a];t[s].parent!==null&&(n[s]=tt(s,t))}return n};const U=_e,rt=nt,N={},ot=Object.keys(U);function at(e){const t=function(...n){const r=n[0];return r==null?r:(r.length>1&&(n=r),e(n))};return"conversion"in e&&(t.conversion=e.conversion),t}function st(e){const t=function(...n){const r=n[0];if(r==null)return r;r.length>1&&(n=r);const o=e(n);if(typeof o=="object")for(let a=o.length,s=0;s<a;s++)o[s]=Math.round(o[s]);return o};return"conversion"in e&&(t.conversion=e.conversion),t}ot.forEach(e=>{N[e]={},Object.defineProperty(N[e],"channels",{value:U[e].channels}),Object.defineProperty(N[e],"labels",{value:U[e].labels});const t=rt(e);Object.keys(t).forEach(r=>{const o=t[r];N[e][r]=st(o),N[e][r].raw=at(o)})});var lt=N;const _=ue(lt);var ct=Ne,it=function(){return ct.Date.now()},ut=it,ft=/\s/;function ht(e){for(var t=e.length;t--&&ft.test(e.charAt(t)););return t}var dt=ht,gt=dt,mt=/^\s+/;function bt(e){return e&&e.slice(0,gt(e)+1).replace(mt,"")}var vt=bt,pt=vt,oe=fe,yt=Me,ae=NaN,xt=/^[-+]0x[0-9a-f]+$/i,wt=/^0b[01]+$/i,kt=/^0o[0-7]+$/i,_t=parseInt;function Et(e){if(typeof e=="number")return e;if(yt(e))return ae;if(oe(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=oe(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=pt(e);var n=wt.test(e);return n||kt.test(e)?_t(e.slice(2),n?2:8):xt.test(e)?ae:+e}var Mt=Et,Ct=fe,W=ut,se=Mt,$t="Expected a function",Ot=Math.max,It=Math.min;function Nt(e,t,n){var r,o,a,s,l,c,i=0,d=!1,f=!1,g=!0;if(typeof e!="function")throw new TypeError($t);t=se(t)||0,Ct(n)&&(d=!!n.leading,f="maxWait"in n,a=f?Ot(se(n.maxWait)||0,t):a,g="trailing"in n?!!n.trailing:g);function x(v){var C=r,z=o;return r=o=void 0,i=v,s=e.apply(z,C),s}function j(v){return i=v,l=setTimeout(b,t),d?x(v):s}function M(v){var C=v-c,z=v-i,ee=t-C;return f?It(ee,a-z):ee}function p(v){var C=v-c,z=v-i;return c===void 0||C>=t||C<0||f&&z>=a}function b(){var v=W();if(p(v))return w(v);l=setTimeout(b,M(v))}function w(v){return l=void 0,g&&r?x(v):(r=o=void 0,s)}function E(){l!==void 0&&clearTimeout(l),i=0,r=c=o=l=void 0}function k(){return l===void 0?s:w(W())}function O(){var v=W(),C=p(v);if(r=arguments,o=this,c=v,C){if(l===void 0)return j(c);if(f)return clearTimeout(l),l=setTimeout(b,t),x(c)}return l===void 0&&(l=setTimeout(b,t)),s}return O.cancel=E,O.flush=k,O}var St=Nt;const Rt=ue(St);var jt=$.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),zt=$(ie)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),Ft=$.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),Ht=$(Ce)(({theme:e})=>({fontFamily:e.typography.fonts.base})),Tt=$.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),Pt=$.div(({theme:e,active:t})=>({width:16,height:16,boxShadow:t?`${e.appBorderColor} 0 0 0 1px inset, ${e.textMutedColor}50 0 0 0 4px`:`${e.appBorderColor} 0 0 0 1px inset`,borderRadius:e.appBorderRadius})),Lt=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,le=({value:e,style:t,...n})=>{let r=`linear-gradient(${e}, ${e}), ${Lt}, linear-gradient(#fff, #fff)`;return h.createElement(Pt,{...n,style:{...t,backgroundImage:r}})},qt=$($e.Input)(({theme:e,readOnly:t})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:e.typography.fonts.base})),Bt=$(Oe)(({theme:e})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:e.input.color})),Ee=(e=>(e.RGB="rgb",e.HSL="hsl",e.HEX="hex",e))(Ee||{}),L=Object.values(Ee),Xt=/\(([0-9]+),\s*([0-9]+)%?,\s*([0-9]+)%?,?\s*([0-9.]+)?\)/,Dt=/^\s*rgba?\(([0-9]+),\s*([0-9]+),\s*([0-9]+),?\s*([0-9.]+)?\)\s*$/i,Wt=/^\s*hsla?\(([0-9]+),\s*([0-9]+)%,\s*([0-9]+)%,?\s*([0-9.]+)?\)\s*$/i,Y=/^\s*#?([0-9a-f]{3}|[0-9a-f]{6})\s*$/i,Kt=/^\s*#?([0-9a-f]{3})\s*$/i,Vt={hex:We,rgb:Ue,hsl:Ae},q={hex:"transparent",rgb:"rgba(0, 0, 0, 0)",hsl:"hsla(0, 0%, 0%, 0)"},ce=e=>{let t=e==null?void 0:e.match(Xt);if(!t)return[0,0,0,1];let[,n,r,o,a=1]=t;return[n,r,o,a].map(Number)},S=e=>{if(!e)return;let t=!0;if(Dt.test(e)){let[s,l,c,i]=ce(e),[d,f,g]=_.rgb.hsl([s,l,c])||[0,0,0];return{valid:t,value:e,keyword:_.rgb.keyword([s,l,c]),colorSpace:"rgb",rgb:e,hsl:`hsla(${d}, ${f}%, ${g}%, ${i})`,hex:`#${_.rgb.hex([s,l,c]).toLowerCase()}`}}if(Wt.test(e)){let[s,l,c,i]=ce(e),[d,f,g]=_.hsl.rgb([s,l,c])||[0,0,0];return{valid:t,value:e,keyword:_.hsl.keyword([s,l,c]),colorSpace:"hsl",rgb:`rgba(${d}, ${f}, ${g}, ${i})`,hsl:e,hex:`#${_.hsl.hex([s,l,c]).toLowerCase()}`}}let n=e.replace("#",""),r=_.keyword.rgb(n)||_.hex.rgb(n),o=_.rgb.hsl(r),a=e;if(/[^#a-f0-9]/i.test(e)?a=n:Y.test(e)&&(a=`#${n}`),a.startsWith("#"))t=Y.test(a);else try{_.keyword.hex(a)}catch{t=!1}return{valid:t,value:a,keyword:_.rgb.keyword(r),colorSpace:"hex",rgb:`rgba(${r[0]}, ${r[1]}, ${r[2]}, 1)`,hsl:`hsla(${o[0]}, ${o[1]}%, ${o[2]}%, 1)`,hex:a}},At=(e,t,n)=>{if(!e||!(t!=null&&t.valid))return q[n];if(n!=="hex")return(t==null?void 0:t[n])||q[n];if(!t.hex.startsWith("#"))try{return`#${_.keyword.hex(t.hex)}`}catch{return q.hex}let r=t.hex.match(Kt);if(!r)return Y.test(t.hex)?t.hex:q.hex;let[o,a,s]=r[1].split("");return`#${o}${o}${a}${a}${s}${s}`},Gt=(e,t)=>{let[n,r]=m.useState(e||""),[o,a]=m.useState(()=>S(n)),[s,l]=m.useState((o==null?void 0:o.colorSpace)||"hex");m.useEffect(()=>{let f=e||"",g=S(f);r(f),a(g),l((g==null?void 0:g.colorSpace)||"hex")},[e]);let c=m.useMemo(()=>At(n,o,s).toLowerCase(),[n,o,s]),i=m.useCallback(f=>{let g=S(f),x=(g==null?void 0:g.value)||f||"";r(x),x===""&&(a(void 0),t(void 0)),g&&(a(g),l(g.colorSpace),t(g.value))},[t]),d=m.useCallback(()=>{let f=L.indexOf(s)+1;f>=L.length&&(f=0),l(L[f]);let g=(o==null?void 0:o[L[f]])||"";r(g),t(g)},[o,s,t]);return{value:n,realValue:c,updateValue:i,color:o,colorSpace:s,cycleColorSpace:d}},D=e=>e.replace(/\s*/,"").toLowerCase(),Ut=(e,t,n)=>{let[r,o]=m.useState(t!=null&&t.valid?[t]:[]);m.useEffect(()=>{t===void 0&&o([])},[t]);let a=m.useMemo(()=>(e||[]).map(l=>typeof l=="string"?S(l):l.title?{...S(l.color),keyword:l.title}:S(l.color)).concat(r).filter(Boolean).slice(-27),[e,r]),s=m.useCallback(l=>{l!=null&&l.valid&&(a.some(c=>D(c[n])===D(l[n]))||o(c=>c.concat(l)))},[n,a]);return{presets:a,addPreset:s}},Yt=({name:e,value:t,onChange:n,onFocus:r,onBlur:o,presetColors:a,startOpen:s=!1,argType:l})=>{var E;let c=m.useCallback(Rt(n,200),[n]),{value:i,realValue:d,updateValue:f,color:g,colorSpace:x,cycleColorSpace:j}=Gt(t,c),{presets:M,addPreset:p}=Ut(a,g,x),b=Vt[x],w=!!((E=l==null?void 0:l.table)!=null&&E.readonly);return h.createElement(jt,{"aria-readonly":w},h.createElement(zt,{startOpen:s,trigger:w?[null]:void 0,closeOnOutsideClick:!0,onVisibleChange:()=>p(g),tooltip:h.createElement(Ft,null,h.createElement(b,{color:d==="transparent"?"#000000":d,onChange:f,onFocus:r,onBlur:o}),M.length>0&&h.createElement(Tt,null,M.map((k,O)=>h.createElement(ie,{key:`${k.value}-${O}`,hasChrome:!1,tooltip:h.createElement(Ht,{note:k.keyword||k.value})},h.createElement(le,{value:k[x],active:g&&D(k[x])===D(g[x]),onClick:()=>f(k.value)})))))},h.createElement(le,{value:d,style:{margin:4}})),h.createElement(qt,{id:Ie(e),value:i,onChange:k=>f(k.target.value),onFocus:k=>k.target.select(),readOnly:w,placeholder:"Choose color..."}),i?h.createElement(Bt,{onClick:j}):null)},sn=Yt;export{Yt as ColorControl,sn as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{D,d as c}from"./chunk-HLWAVYOI-DTFa3RTh.js";import"./iframe-C9-tEs2g.js";import"../sb-preview/runtime.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./client-Bv7_hWzn.js";import"./index-CbwENYX-.js";import"./index-Cs2Qo7ol.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";export{D as DocsRenderer,c as defaultComponents};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._FieldAdditionalText_i1whr_4{margin:0;font-weight:var(--026ea8);font-size:var(--3f1843);line-height:var(--030292);letter-spacing:var(--c142cd)}._FieldAdditionalText--variant-normal_i1whr_11{color:var(--3d280d)}._FieldAdditionalText--variant-error_i1whr_14{color:var(--9167e9)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-CKrituN3.js";import{m as l,s as o}from"./classNames-Dz8Jm24I.js";import{w as i,g as s}from"./componentNames-Bs6if0Kd.js";import{a as m}from"./constants-DL6gdbsq.js";const p="_FieldAdditionalText_i1whr_4",_={FieldAdditionalText:p,"FieldAdditionalText--variant-normal":"_FieldAdditionalText--variant-normal_i1whr_11","FieldAdditionalText--variant-error":"_FieldAdditionalText--variant-error_i1whr_14"},a=({id:e,variant:t=m,children:d})=>{const n=l(_,i.FieldAdditionalText,[o("variant",t)]);return r.jsx("p",{id:e,className:n.join(" "),...s({preplyDsComponent:i.FieldAdditionalText}),children:d})};try{a.displayName="FieldAdditionalText",a.__docgenInfo={description:"",displayName:"FieldAdditionalText",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"FieldAdditionalTextVariant | undefined"}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string | undefined"}}}}}catch{}export{a as F};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-CKrituN3.js";import{F as t}from"./FieldAdditionalText-D4mNbb6z.js";import{S as c}from"./StoryContextDSWeb-Cq8y4KZ8.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./classNames-Dz8Jm24I.js";import"./componentNames-Bs6if0Kd.js";import"./constants-DL6gdbsq.js";import"./StorybookGlobalStyle-A7XGldSX.js";import"./styled-components.browser.esm-D7-R-tx8.js";import"./RootProvider-CcBxia7g.js";import"./useTheme-BjN7KXjq.js";const E={title:"components/FieldAdditionalText",component:t,decorators:[n=>r.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:r.jsx(c,{theme:"tokyo-ui",children:n()})})]},e=()=>r.jsx(t,{children:"Provide a telephone number so we can contact you."}),o=()=>r.jsx(t,{variant:"error",children:"Please fill out this field."});var i,a,s;e.parameters={...e.parameters,docs:{...(i=e.parameters)==null?void 0:i.docs,source:{originalSource:"() => <FieldAdditionalText>Provide a telephone number so we can contact you.</FieldAdditionalText>",...(s=(a=e.parameters)==null?void 0:a.docs)==null?void 0:s.source}}};var d,m,l;o.parameters={...o.parameters,docs:{...(d=o.parameters)==null?void 0:d.docs,source:{originalSource:'() => <FieldAdditionalText variant="error">Please fill out this field.</FieldAdditionalText>',...(l=(m=o.parameters)==null?void 0:m.docs)==null?void 0:l.source}}};const P=["Normal","Error"];export{o as Error,e as Normal,P as __namedExportsOrder,E as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as a}from"./jsx-runtime-CKrituN3.js";import{m as p}from"./classNames-Dz8Jm24I.js";import{g as m,w as n}from"./componentNames-Bs6if0Kd.js";const c="_FieldButton_zvyiy_4",y={FieldButton:c},o=({svg:t,assistiveText:r,onClick:e,dataset:i})=>{const l=p(y,n.FieldButton),d=s=>{s.stopPropagation(),e==null||e(s)},u={...m(i,{preplyDsComponent:n.FieldButton}),className:l.join(" "),title:r,onClick:d};return a.jsx("button",{...u,type:"button",children:a.jsx(t,{"aria-hidden":"true",focusable:"false"})})};try{o.displayName="FieldButton",o.__docgenInfo={description:"",displayName:"FieldButton",props:{svg:{defaultValue:null,description:"",name:"svg",required:!0,type:{name:"ReactSVGComponentType"}},assistiveText:{defaultValue:null,description:"",name:"assistiveText",required:!0,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"MouseEventHandler<Element>"}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}}}}}catch{}export{o as F};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._FieldButton_zvyiy_4{display:flex;justify-content:center;align-items:center;min-width:var(--d57208);height:var(--3caeb9);border-width:1px;border-style:solid;border-radius:var(--0191ea);border-color:var(--ea1746);background:none;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none;-ms-touch-action:manipulation;touch-action:manipulation}@media (hover: hover) and (pointer: fine){._FieldButton_zvyiy_4:hover{background-color:var(--0bbea4)}}._FieldButton_zvyiy_4:active{background-color:var(--33e933)}._FieldButton_zvyiy_4:focus-visible{outline-style:solid;outline-color:var(--603ec6);outline-width:var(--99d31f);outline-offset:var(--c0b12c)}._FieldButton_zvyiy_4 svg{width:var(--f02c4e);height:var(--f02c4e)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as t}from"./jsx-runtime-CKrituN3.js";import{F as a}from"./LibraryExplore-Doyt8zmK.js";import{F as i}from"./FieldButton-D33qtAXG.js";import{S as p}from"./StoryContextDSWeb-Cq8y4KZ8.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./classNames-Dz8Jm24I.js";import"./componentNames-Bs6if0Kd.js";import"./StorybookGlobalStyle-A7XGldSX.js";import"./styled-components.browser.esm-D7-R-tx8.js";import"./RootProvider-CcBxia7g.js";import"./useTheme-BjN7KXjq.js";const S={title:"components/FieldButton",component:i,decorators:[m=>t.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:t.jsx(p,{theme:"tokyo-ui",children:m()})})]},o=()=>t.jsx(i,{svg:a,assistiveText:"Lorem Ipsum",onClick:()=>{}});o.storyName="FieldButton";var e,r,s;o.parameters={...o.parameters,docs:{...(e=o.parameters)==null?void 0:e.docs,source:{originalSource:'() => <FieldButton svg={LibSvg} assistiveText="Lorem Ipsum" onClick={() => undefined} />',...(s=(r=o.parameters)==null?void 0:r.docs)==null?void 0:s.source}}};const g=["Base"];export{o as Base,g as __namedExportsOrder,S as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as u}from"./jsx-runtime-CKrituN3.js";import{r}from"./index-CBqU2yxZ.js";import{F as E}from"./FieldLayoutBase-CbCHHPHI.js";import{c as o,b as a}from"./classNames-Dz8Jm24I.js";import{w as t}from"./componentNames-Bs6if0Kd.js";const s={"FieldLayout--input":"_FieldLayout--input_vvcrk_5","FieldLayout--icon":"_FieldLayout--icon_vvcrk_42","FieldLayout--has-icon":"_FieldLayout--has-icon_vvcrk_55","FieldLayout--has-button":"_FieldLayout--has-button_vvcrk_58","FieldLayout--has-error":"_FieldLayout--has-error_vvcrk_61","FieldLayout--is-focused":"_FieldLayout--is-focused_vvcrk_72","FieldLayout--is-disabled":"_FieldLayout--is-disabled_vvcrk_76"},w=({id:c,className:m,input:F,icon:i,button:p,disabled:f,isFocused:y,hasError:b,inputHandle:e,onClick:d,preplyDsComponent:_,...q},V)=>{const n=r.useRef(null);r.useImperativeHandle(V,()=>({setFocus:()=>e==null?void 0:e.setFocus(),scrollIntoView:()=>{var l;return(l=n==null?void 0:n.current)==null?void 0:l.scrollIntoView()}}));const L=o(s,t.FieldLayout,[a("is-disabled",void 0,f),a("is-focused",void 0,y),a("has-error",void 0,b),a("has-icon",void 0,!!i),a("has-button",void 0,!!p)]),v=m?[m,...L]:L,N=o(s,t.FieldLayout,["input"]),g=o(s,t.FieldLayout,["icon"]),C=l=>{e==null||e.setFocus(),d==null||d(l)};return u.jsx(E,{id:c,className:v.join(" "),disabled:f,isFocused:y,hasError:b,...q,preplyDsComponent:_??t.FieldLayout,ref:n,children:u.jsxs("div",{className:N.join(" "),onClick:C,children:[i&&u.jsx("span",{className:g.join(" "),children:i}),F,p]})})},h=r.forwardRef(w);try{h.displayName="FieldLayout",h.__docgenInfo={description:"A component for building custom fields.",displayName:"FieldLayout",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}},preplyDsComponent:{defaultValue:null,description:"@see getDatasetProps",name:"preplyDsComponent",required:!1,type:{name:"string | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"ReactNode"}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},hideLabel:{defaultValue:null,description:"",name:"hideLabel",required:!1,type:{name:"boolean | undefined"}},wrapLabel:{defaultValue:null,description:"",name:"wrapLabel",required:!1,type:{name:"boolean | undefined"}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"boolean | undefined"}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"ReactNode"}},additionalText:{defaultValue:null,description:"",name:"additionalText",required:!1,type:{name:"ReactNode"}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"boolean | undefined"}},isFocused:{defaultValue:null,description:"",name:"isFocused",required:!1,type:{name:"boolean | undefined"}},isTouched:{defaultValue:null,description:"",name:"isTouched",required:!1,type:{name:"boolean | undefined"}},isChanged:{defaultValue:null,description:"",name:"isChanged",required:!1,type:{name:"boolean | undefined"}},hasValue:{defaultValue:null,description:"",name:"hasValue",required:!1,type:{name:"boolean | undefined"}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"boolean | undefined"}},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:"InputImperativeHandle | null"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined"}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"ReactElement<FieldButtonProps, string | JSXElementConstructor<any>> | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<Element> | undefined"}}}}}catch{}export{h as F};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._FieldLayout--input_vvcrk_5{border-radius:var(--c4b051);display:flex;position:relative;align-items:center;background-color:var(--302ecf);color:var(--41d493);background-color:var(--211bc0)}@media (hover: hover) and (pointer: fine){._FieldLayout--input_vvcrk_5:hover input,._FieldLayout--input_vvcrk_5:hover textarea{border-color:var(--0bd642)}}._FieldLayout--input_vvcrk_5 input,._FieldLayout--input_vvcrk_5 textarea{border-color:var(--29cd58);border-width:var(--d9baa3);border-radius:var(--c4b051);border-style:solid;background:none;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);padding:calc(var(--d9baa3) + var(--1ba55a));padding-right:calc(var(--477fda) - var(--d9baa3));padding-left:calc(var(--477fda) - var(--d9baa3))}._FieldLayout--input_vvcrk_5 input::placeholder,._FieldLayout--input_vvcrk_5 textarea::placeholder{color:var(--d9209f)}._FieldLayout--icon_vvcrk_42{position:absolute;top:0;display:flex;align-items:center;height:100%;left:calc(var(--477fda) - var(--d9baa3));font-size:0;pointer-events:none}._FieldLayout--icon_vvcrk_42 svg{color:var(--cbc724)}._FieldLayout--has-icon_vvcrk_55 ._FieldLayout--input_vvcrk_5 input{padding-left:calc(calc(var(--477fda) - var(--d9baa3)) + var(--7c1b1c) + var(--1ba55a))}._FieldLayout--has-button_vvcrk_58 ._FieldLayout--input_vvcrk_5 input{padding-right:58px}._FieldLayout--has-error_vvcrk_61 ._FieldLayout--input_vvcrk_5{background-color:var(--95df5b)}._FieldLayout--has-error_vvcrk_61 ._FieldLayout--input_vvcrk_5 input,._FieldLayout--has-error_vvcrk_61 ._FieldLayout--input_vvcrk_5 textarea{border-color:var(--eaf4a3);color:var(--7b0f41)}._FieldLayout--has-error_vvcrk_61 ._FieldLayout--icon_vvcrk_42 svg{color:var(--7b0f41)}._FieldLayout--is-focused_vvcrk_72 ._FieldLayout--input_vvcrk_5 input,._FieldLayout--is-focused_vvcrk_72 ._FieldLayout--input_vvcrk_5 textarea{border-color:var(--398094)}._FieldLayout--is-disabled_vvcrk_76 ._FieldLayout--input_vvcrk_5{background-color:var(--04daeb)}._FieldLayout--is-disabled_vvcrk_76 ._FieldLayout--input_vvcrk_5 input,._FieldLayout--is-disabled_vvcrk_76 ._FieldLayout--input_vvcrk_5 textarea{border-color:transparent}._FieldLayout--input_vvcrk_5 button{position:absolute;top:calc(var(--1ba55a) + var(--6947b0));right:var(--6947b0);margin-top:calc(-1 * var(--1ba55a));margin-bottom:calc(-1 * var(--1ba55a))}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import{j as t}from"./jsx-runtime-CKrituN3.js";import{F as s,a as m}from"./User-louGEvpx.js";import{F as p}from"./FieldButton-D33qtAXG.js";import{I as l}from"./Icon-BqBV3_9d.js";import{I as u}from"./InputText-eRnUw64o.js";import{F as a}from"./FieldLayout-C1VooNJq.js";import{S as d}from"./StoryContextDSWeb-Cq8y4KZ8.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./classNames-Dz8Jm24I.js";import"./componentNames-Bs6if0Kd.js";import"./text-accent-DdHX3rNs.js";import"./render-icon-DsMGBPwY.js";import"./FieldLayoutBase-CbCHHPHI.js";import"./getInputProps-CQF_KcrT.js";import"./FieldAdditionalText-D4mNbb6z.js";import"./constants-DL6gdbsq.js";import"./StorybookGlobalStyle-A7XGldSX.js";import"./styled-components.browser.esm-D7-R-tx8.js";import"./RootProvider-CcBxia7g.js";import"./useTheme-BjN7KXjq.js";const H={title:"components/FieldLayout",component:a,decorators:[e=>t.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:t.jsx(d,{theme:"tokyo-ui",children:e()})})]},o=()=>{const e={current:null};return t.jsx(a,{id:"foo1",input:t.jsx(u,{type:"text",id:"foo1",ref:e,defaultValue:"John Smith"}),icon:t.jsx(l,{svg:s,label:"The hat"}),button:t.jsx(p,{svg:m,assistiveText:"Do the thing",onClick:()=>{}}),label:"Full name",inputHandle:e.current})};o.storyName="FieldLayout";var r,i,n;o.parameters={...o.parameters,docs:{...(r=o.parameters)==null?void 0:r.docs,source:{originalSource:`() => {
|
|
2
|
+
const ref = {
|
|
3
|
+
current: null
|
|
4
|
+
};
|
|
5
|
+
return <FieldLayout id="foo1" input={<InputText type="text" id="foo1" ref={ref} defaultValue="John Smith" />} icon={<Icon svg={UserSvg} label="The hat" />} button={<FieldButton svg={ErrorSvg} assistiveText="Do the thing" onClick={() => undefined} />} label="Full name" inputHandle={ref.current} />;
|
|
6
|
+
}`,...(n=(i=o.parameters)==null?void 0:i.docs)==null?void 0:n.source}}};const J=["Base"];export{o as Base,J as __namedExportsOrder,H as default};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{j as l}from"./jsx-runtime-CKrituN3.js";import{r as p}from"./index-CBqU2yxZ.js";import{u as z,g as H,a as k}from"./getInputProps-CQF_KcrT.js";import{g as C}from"./componentNames-Bs6if0Kd.js";import{F as A}from"./FieldAdditionalText-D4mNbb6z.js";import{m as D,b as g,c as B}from"./classNames-Dz8Jm24I.js";const N={textarea:"textarea",select:"select"},K=()=>{},S=(e,a)=>{const{type:n,id:t,name:r,className:d,onChange:i,onFocus:u,onBlur:f,onClick:y,onKeyDown:_,onKeyUp:b,onCopy:q,onPaste:L,required:I,readOnly:m,disabled:c,dataset:V,preplyDsComponent:x}=e,s=p.useRef(null);p.useImperativeHandle(a,()=>({setFocus:()=>{var o;return(o=s.current)==null?void 0:o.focus()},scrollIntoView:()=>{var o;return(o=s.current)==null?void 0:o.scrollIntoView()}}));const R=z({disabled:c,captureChildEvents:!0,onBlur:f,onFocus:u}),v=N[n]||"input",j=v===n in N?void 0:n,P={...{ref:s,type:j,id:t,name:r,className:d,...R,onChange:i||K,onClick:y,onKeyDown:_,onKeyUp:b,onCopy:q,onPaste:L,required:I,readOnly:m,disabled:c},...H(e),...C(V,{preplyDsComponent:x}),...k(e)};return l.jsx(v,{...P,ref:s})},w=p.forwardRef(S);try{w.displayName="InputBase",w.__docgenInfo={description:"",displayName:"InputBase",props:{type:{defaultValue:null,description:"",name:"type",required:!0,type:{name:'"number" | "url" | "email" | "tel" | "text" | "search" | "password" | "date" | "time" | "textarea" | "select" | "checkbox" | "radio"'}},autoComplete:{defaultValue:null,description:"",name:"autoComplete",required:!1,type:{name:'"url" | "name" | "off" | "on" | "email" | "username" | "language" | "tel" | "new-password" | "current-password" | undefined'}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string | undefined"}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"number | undefined"}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"string | undefined"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | undefined"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"string | undefined"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"ChangeEventHandler<Element> | undefined"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"FocusEventHandler<Element> | undefined"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"FocusEventHandler<Element> | undefined"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<Element> | undefined"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"KeyboardEventHandler<Element> | undefined"}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"KeyboardEventHandler<Element> | undefined"}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"ClipboardEventHandler<Element> | undefined"}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"ClipboardEventHandler<Element> | undefined"}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"boolean | undefined"}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"boolean | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"boolean | undefined"}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},preplyDsComponent:{defaultValue:null,description:`@deprecated preplyDsComponent is meant for internal Design SYstem use only!!
|
|
2
|
+
@see getDatasetProps`,name:"preplyDsComponent",required:!1,type:{name:"string | undefined"}},rows:{defaultValue:null,description:"",name:"rows",required:!1,type:{name:"number | undefined"}},resize:{defaultValue:null,description:"",name:"resize",required:!1,type:{name:"ResizeOptions | undefined"}},min:{defaultValue:null,description:"",name:"min",required:!1,type:{name:"string | undefined"}},max:{defaultValue:null,description:"",name:"max",required:!1,type:{name:"string | undefined"}},checked:{defaultValue:null,description:"",name:"checked",required:!1,type:{name:"boolean | undefined"}}}}}catch{}function fe(e,a,n,t=[]){return p.useMemo(()=>{if(!(!a&&!n))return r=>{a==null||a(r);const d=e(r);n==null||n(d)}},[a,n,...t])}const U="_InputText_1ml94_4",G="_InputPassword_1ml94_11",O="_InputDate_1ml94_18",$="_InputTime_1ml94_25",M="_InputNumber_1ml94_32",Y="_Textarea_1ml94_39",Q="_Checkbox_1ml94_58",W="_Radio_1ml94_61",J="_Select_1ml94_64",ye={InputText:U,InputPassword:G,InputDate:O,InputTime:$,InputNumber:M,Textarea:Y,"Textarea--resize-none":"_Textarea--resize-none_1ml94_46","Textarea--resize-vertical":"_Textarea--resize-vertical_1ml94_49","Textarea--resize-horizontal":"_Textarea--resize-horizontal_1ml94_52","Textarea--resize-both":"_Textarea--resize-both_1ml94_55",Checkbox:Q,Radio:W,Select:J},X="_FieldLabel_1l6ld_4",F={FieldLabel:X,"FieldLabel--wrap":"_FieldLabel--wrap_1l6ld_19","FieldLabel--wrapGap":"_FieldLabel--wrapGap_1l6ld_22","FieldLabel--required":"_FieldLabel--required_1l6ld_26","FieldLabel--hide":"_FieldLabel--hide_1l6ld_31"},E="FieldLabel",Z="•",ee="Required",ae=({label:e=ee})=>{const a=B(F,E,["required"]);return l.jsxs("span",{className:a.join(" "),children:[l.jsx("span",{children:Z}),l.jsx("span",{children:e})]})},ne=()=>{const e=B(F,E,["wrapGap"]);return l.jsx("span",{className:e.join(" ")})},h=({id:e,label:a,hideLabel:n,wrapLabel:t=!1,required:r,requiredLabel:d})=>{const i=D(F,E,[g("hide",void 0,n),g("wrap",void 0,t)]);return l.jsxs("label",{htmlFor:e,className:i.join(" "),children:[a,t&&l.jsx(ne,{}),r&&l.jsx(ae,{label:d})]})};try{h.displayName="FieldLabel",h.__docgenInfo={description:"",displayName:"FieldLabel",props:{id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},label:{defaultValue:{value:"Required"},description:"",name:"label",required:!1,type:{name:"ReactNode"}},hideLabel:{defaultValue:null,description:"",name:"hideLabel",required:!1,type:{name:"boolean | undefined"}},wrapLabel:{defaultValue:{value:"false"},description:"",name:"wrapLabel",required:!1,type:{name:"boolean | undefined"}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"boolean | undefined"}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"ReactNode"}}}}}catch{}const le="_FieldLayoutBase_svgp8_2",te={FieldLayoutBase:le},re="FieldLayoutBase",de=({id:e,className:a,label:n,hideLabel:t,wrapLabel:r=!1,required:d,requiredLabel:i,additionalText:u,preserveSpace:f,hasError:y,dataset:_,children:b,preplyDsComponent:q},L)=>{const m=[...D(te,re)];a&&m.push(a);const c={className:m.join(" "),...C(_,{preplyDsComponent:q})},V={id:e,label:n,hideLabel:t,wrapLabel:r,required:d,requiredLabel:i},x=!u&&f?l.jsx("span",{children:" "}):void 0,s=y?"error":"normal";return l.jsxs("div",{...c,ref:L,children:[l.jsx(h,{...V}),b,u&&l.jsx(A,{id:`${e}-desc`,variant:s,children:u}),x]})},T=p.forwardRef(de);try{T.displayName="FieldLayoutBase",T.__docgenInfo={description:"",displayName:"FieldLayoutBase",props:{id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string | undefined"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"ReactNode"}},hideLabel:{defaultValue:null,description:"",name:"hideLabel",required:!1,type:{name:"boolean | undefined"}},wrapLabel:{defaultValue:{value:"false"},description:"",name:"wrapLabel",required:!1,type:{name:"boolean | undefined"}},required:{defaultValue:null,description:"",name:"required",required:!1,type:{name:"boolean | undefined"}},requiredLabel:{defaultValue:null,description:"",name:"requiredLabel",required:!1,type:{name:"ReactNode"}},additionalText:{defaultValue:null,description:"",name:"additionalText",required:!1,type:{name:"ReactNode"}},preserveSpace:{defaultValue:null,description:"",name:"preserveSpace",required:!1,type:{name:"boolean | undefined"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean | undefined"}},isFocused:{defaultValue:null,description:"",name:"isFocused",required:!1,type:{name:"boolean | undefined"}},isTouched:{defaultValue:null,description:"",name:"isTouched",required:!1,type:{name:"boolean | undefined"}},isChanged:{defaultValue:null,description:"",name:"isChanged",required:!1,type:{name:"boolean | undefined"}},hasValue:{defaultValue:null,description:"",name:"hasValue",required:!1,type:{name:"boolean | undefined"}},hasError:{defaultValue:null,description:"",name:"hasError",required:!1,type:{name:"boolean | undefined"}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"Dataset | undefined"}},preplyDsComponent:{defaultValue:null,description:"@see getDatasetProps",name:"preplyDsComponent",required:!1,type:{name:"string | undefined"}}}}}catch{}export{T as F,w as I,ye as s,fe as u};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._InputText_1ml94_4,._InputPassword_1ml94_11,._InputDate_1ml94_18,._InputTime_1ml94_25,._InputNumber_1ml94_32,._Textarea_1ml94_39{display:block;width:100%;padding:calc(var(--d9baa3) + var(--1ba55a));padding-left:calc(var(--477fda) - var(--d9baa3));padding-right:var(--d9baa3)}._Textarea--resize-none_1ml94_46{resize:none}._Textarea--resize-vertical_1ml94_49{resize:vertical}._Textarea--resize-horizontal_1ml94_52{resize:horizontal}._Textarea--resize-both_1ml94_55{resize:both}._Checkbox_1ml94_58,._Radio_1ml94_61{display:inline-block}._Select_1ml94_64{display:block;width:100%;padding:calc(var(--d9baa3) + var(--1ba55a));padding-left:calc(var(--477fda) - var(--d9baa3));padding-right:var(--d9baa3)}._FieldLabel_1l6ld_4{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:var(--8d63e4);line-height:var(--d4313c);color:var(--e41135);font-size:var(--343d89);font-weight:var(--b44390);line-height:var(--360264);letter-spacing:var(--b8c41f);font-style:var(--0ab3be);display:flex;gap:var(--6947b0);max-width:max-content}._FieldLabel--wrap_1l6ld_19{display:inline}._FieldLabel--wrapGap_1l6ld_22{width:var(--6947b0);display:inline-block}._FieldLabel--required_1l6ld_26{display:flex;gap:var(--6947b0);color:var(--3d280d)}._FieldLabel--hide_1l6ld_31{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}._FieldLayoutBase_svgp8_2{display:flex;flex-direction:column;gap:var(--6947b0)}._FieldLayoutBase_svgp8_2 input,._FieldLayoutBase_svgp8_2 textarea{display:block;width:100%}
|