@v-miniapp/ui-react 1.0.40 → 1.0.45
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/README.md +1 -1
- package/dist/components/icon/icon-mapping.d.ts +4 -0
- package/dist/components/navigation-bar/navigation-bar.d.ts +3 -1
- package/dist/external/index.js +2009 -2012
- package/dist/external/styles.css +1 -1
- package/dist/index.js +1029 -1032
- package/dist/styles.css +1 -1
- package/dist-storybook/assets/ANIMATION-CUdn1GTK.js +99 -0
- package/dist-storybook/assets/APP_FRAMEWORK-ljbIOHYd.js +197 -0
- package/dist-storybook/assets/BOTTOM_TAB_BAR-DxCwCfBK.js +175 -0
- package/dist-storybook/assets/CUSTOM_ERROR_BOUNDARY-B4wTQNZc.js +250 -0
- package/dist-storybook/assets/Color-AVL7NMMY-1_8XTICv.js +1 -0
- package/dist-storybook/assets/DARK_MODE-CoHseCDO.js +57 -0
- package/dist-storybook/assets/DocsRenderer-PQXLIZUC-BO86igwd.js +2 -0
- package/dist-storybook/assets/GETTING_STARTED-H_vVi5cv.js +77 -0
- package/dist-storybook/assets/INFINITE_SCROLL-BtM3uoX0.js +111 -0
- package/dist-storybook/assets/KEEP_ALIVE-CL2au0al.js +126 -0
- package/dist-storybook/assets/LOCALE-XTCey55y.js +465 -0
- package/dist-storybook/assets/MIGRATION_GUIDE-2LONslE4.js +449 -0
- package/dist-storybook/assets/MOBILE_BEHAVIOURS-DZ6alKTX.js +177 -0
- package/dist-storybook/assets/PAGE_LAYOUT-BuOpN-1Y.js +192 -0
- package/dist-storybook/assets/ROUTING_NAVIGATION-BCPHXNto.js +335 -0
- package/dist-storybook/assets/TAILWIND_INTEGRATION-_T-VfvkM.js +87 -0
- package/dist-storybook/assets/_setToString-CbM921C9.js +1 -0
- package/dist-storybook/assets/alert-DLW8CoyB.js +1 -0
- package/dist-storybook/assets/alert.stories-B-vuojPh.js +110 -0
- package/dist-storybook/assets/avatar-GxcYPA1p.js +1 -0
- package/dist-storybook/assets/avatar.stories-KYFztAc8.js +136 -0
- package/dist-storybook/assets/axe-CmvD4WV5.js +20 -0
- package/dist-storybook/assets/badge-D_LzMVtw.js +1 -0
- package/dist-storybook/assets/badge.stories-Be2ItCmQ.js +262 -0
- package/dist-storybook/assets/blocks-BuaOUtiH.js +1243 -0
- package/dist-storybook/assets/bottom-tab-bar-CtcTAxuI.js +115 -0
- package/dist-storybook/assets/bottom-tab-bar.stories-CDmEve6z.js +186 -0
- package/dist-storybook/assets/button-CL7GeC23.js +1 -0
- package/dist-storybook/assets/button.stories-CaqLWQiY.js +287 -0
- package/dist-storybook/assets/calendar-dOCsjhVU.js +1 -0
- package/dist-storybook/assets/calendar.stories-DLWZldet.js +189 -0
- package/dist-storybook/assets/carousel-1Kww3hIz.js +37 -0
- package/dist-storybook/assets/carousel.stories-B8YbGOOr.js +217 -0
- package/dist-storybook/assets/checkbox-MGytNNRt.js +1 -0
- package/dist-storybook/assets/checkbox.stories-CLvfZPiw.js +201 -0
- package/dist-storybook/assets/chip-kG4p82WT.js +247 -0
- package/dist-storybook/assets/chip.stories-BbwJb5eD.js +442 -0
- package/dist-storybook/assets/classname-CUR_zgkh.js +1 -0
- package/dist-storybook/assets/colors-_6nFGM3e.js +1 -0
- package/dist-storybook/assets/date-Cg-Uk_pp.js +1 -0
- package/dist-storybook/assets/date-field.stories-Diptwqfv.js +129 -0
- package/dist-storybook/assets/date-picker-Dnq_-0Md.js +1 -0
- package/dist-storybook/assets/date-picker.stories-BuGWvzFL.js +123 -0
- package/dist-storybook/assets/default-error-BcnD8fFO.png +0 -0
- package/dist-storybook/assets/dialog.stories-DJ0WsSkA.js +212 -0
- package/dist-storybook/assets/dropdown.stories-D6JUYP73.js +200 -0
- package/dist-storybook/assets/embla-carousel-react.esm-BYjpaHZ9.js +1 -0
- package/dist-storybook/assets/en-Cs9O0XWn.js +15 -0
- package/dist-storybook/assets/icon-DdQsMyRa.js +1 -0
- package/dist-storybook/assets/icon.stories-B-ZvRzFf.js +365 -0
- package/dist-storybook/assets/iframe-CQAwSt4E.js +1071 -0
- package/dist-storybook/assets/iframe-yMKl6hJA.css +1 -0
- package/dist-storybook/assets/image-C3EsNRhz.js +9 -0
- package/dist-storybook/assets/image.stories-C4l8D3ju.js +255 -0
- package/dist-storybook/assets/index-B-Ksafg0.js +1 -0
- package/dist-storybook/assets/index-BV0AJWP6.js +1 -0
- package/dist-storybook/assets/index-CgMRTj-o.js +1 -0
- package/dist-storybook/assets/index-DHiZ-gXR.js +1 -0
- package/dist-storybook/assets/input-wrapper-BKHgnPy6.js +1 -0
- package/dist-storybook/assets/label-DV2iCDmN.js +27 -0
- package/dist-storybook/assets/label.stories-BwTIPFXX.js +138 -0
- package/dist-storybook/assets/matchers-7Z3WT2CE-Dw4MQV_s.js +14 -0
- package/dist-storybook/assets/navigation-bar-vI-FPasP.js +79 -0
- package/dist-storybook/assets/navigation-bar.stories-DYuFaJFD.js +73 -0
- package/dist-storybook/assets/number-field-CXKmnfKe.js +1 -0
- package/dist-storybook/assets/number-field.stories--fn26TJu.js +167 -0
- package/dist-storybook/assets/omit-Bsx5nTI0.js +1 -0
- package/dist-storybook/assets/option-item-LRh_OyV4.js +1 -0
- package/dist-storybook/assets/option-item.stories-snjAvgay.js +66 -0
- package/dist-storybook/assets/pagination-DZHoBs_4.js +1 -0
- package/dist-storybook/assets/pagination.stories-BoEs0jzS.js +91 -0
- package/dist-storybook/assets/pick-BhmhLmLe.js +1 -0
- package/dist-storybook/assets/preload-helper-PPVm8Dsz.js +1 -0
- package/dist-storybook/assets/radio-B5NJxG_l.js +1 -0
- package/dist-storybook/assets/radio.stories-DuN-Awi_.js +183 -0
- package/dist-storybook/assets/rating-BdXViYBv.js +1 -0
- package/dist-storybook/assets/rating.stories-BCcQjMEx.js +117 -0
- package/dist-storybook/assets/react-18-CNyWQ7je.js +9 -0
- package/dist-storybook/assets/react-hufnxGVs.js +1 -0
- package/dist-storybook/assets/search-field-CQqgFbfg.js +1 -0
- package/dist-storybook/assets/search-field.stories-DiCZbhng.js +79 -0
- package/dist-storybook/assets/section-content-DGNB4eLN.js +1 -0
- package/dist-storybook/assets/section.stories-C2I_kKhu.js +69 -0
- package/dist-storybook/assets/sheet.stories-wk1JaKU5.js +152 -0
- package/dist-storybook/assets/skeleton-C91JgehG.js +1 -0
- package/dist-storybook/assets/skeleton.stories-BCmX-VNr.js +139 -0
- package/dist-storybook/assets/store-CPumdfcU.js +1 -0
- package/dist-storybook/assets/store-D2RudmNr.js +18 -0
- package/dist-storybook/assets/switch-p-aXI-ev.js +1 -0
- package/dist-storybook/assets/switch.stories-BqPLNKB9.js +250 -0
- package/dist-storybook/assets/tab-bar-CSeCmtIZ.js +31 -0
- package/dist-storybook/assets/tab-bar.stories-Cb6v8H2w.js +136 -0
- package/dist-storybook/assets/text-area-DwSXyqOe.js +1 -0
- package/dist-storybook/assets/text-area.stories-By8bCfgc.js +87 -0
- package/dist-storybook/assets/text-field-jK6rpOo2.js +1 -0
- package/dist-storybook/assets/text-field.stories-CrWBAhvI.js +92 -0
- package/dist-storybook/assets/toast-provider-DurnMJhd.js +9 -0
- package/dist-storybook/assets/toast.stories-iWAToAZA.js +201 -0
- package/dist-storybook/assets/tooltip-QDdel5My.js +1 -0
- package/dist-storybook/assets/tooltip.stories-RC6SuPPD.js +153 -0
- package/dist-storybook/assets/typography-DEpAJl_i.js +1 -0
- package/dist-storybook/assets/typography.stories-Bu8qFugR.js +202 -0
- package/dist-storybook/assets/uploader.stories-B2wW9qVy.js +65 -0
- package/dist-storybook/assets/use-app-pause-B_tWHKJK.js +29 -0
- package/dist-storybook/assets/use-app-resume--900G-dV.js +29 -0
- package/dist-storybook/assets/use-custom-icon-event-3VExRzvC.js +29 -0
- package/dist-storybook/assets/use-did-hide-BUsL73ab.js +48 -0
- package/dist-storybook/assets/use-did-show-C1-VLDxi.js +49 -0
- package/dist-storybook/assets/use-histories-E4E2jJEY.js +50 -0
- package/dist-storybook/assets/use-history-o1im8IDj.js +67 -0
- package/dist-storybook/assets/use-location-CUEaBO4P.js +56 -0
- package/dist-storybook/assets/use-navigate-C4CTuFSZ.js +84 -0
- package/dist-storybook/assets/use-navigation-type-Dcz4hgKo.js +44 -0
- package/dist-storybook/assets/use-page-config-DSJBVQbq.js +48 -0
- package/dist-storybook/assets/use-page-scroll-dY-U1Vv4.js +69 -0
- package/dist-storybook/assets/use-page-state-CtNpwGPN.js +79 -0
- package/dist-storybook/assets/use-settings-changed-BBJwIHTE.js +29 -0
- package/dist-storybook/assets/v-mini-icon-Dn1BmJzb.woff2 +0 -0
- package/dist-storybook/assets/visibility-sensor-CwrzJO06.js +1 -0
- package/dist-storybook/iframe.html +670 -0
- package/dist-storybook/index.html +132 -0
- package/dist-storybook/index.json +1 -0
- package/dist-storybook/project.json +1 -0
- package/dist-storybook/sb-addons/a11y-2/manager-bundle.js +5 -0
- package/dist-storybook/sb-addons/docs-1/manager-bundle.js +151 -0
- package/dist-storybook/sb-addons/storybook-build-3/manager-bundle.js +3 -0
- package/dist-storybook/sb-addons/storybook-core-server-presets-0/common-manager-bundle.js +971 -0
- package/dist-storybook/sb-manager/globals-module-info.js +799 -0
- package/dist-storybook/sb-manager/globals-runtime.js +69791 -0
- package/dist-storybook/sb-manager/globals.js +34 -0
- package/dist-storybook/sb-manager/runtime.js +13198 -0
- package/dist-storybook/stories-data.json +374 -0
- package/dist-storybook/vite-inject-mocker-entry.js +2 -0
- package/package.json +1 -1
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import{j as o}from"./iframe-CQAwSt4E.js";import{T as d,S as B,M as m,P as u,a as v}from"./blocks-BuaOUtiH.js";import{N as l}from"./navigation-bar-vI-FPasP.js";import{B as p}from"./button-CL7GeC23.js";import{a as y,B as h}from"./badge-D_LzMVtw.js";import{I}from"./icon-DdQsMyRa.js";import{t}from"./store-D2RudmNr.js";import"./preload-helper-PPVm8Dsz.js";import"./index-DHiZ-gXR.js";import"./classname-CUR_zgkh.js";import"./colors-_6nFGM3e.js";import"./visibility-sensor-CwrzJO06.js";import"./index-B-Ksafg0.js";import"./store-CPumdfcU.js";import"./_setToString-CbM921C9.js";import"./react-hufnxGVs.js";import"./omit-Bsx5nTI0.js";import"./pick-BhmhLmLe.js";import"./typography-DEpAJl_i.js";const k=()=>{const g=`
|
|
2
|
+
## ${t("common.table.title")}
|
|
3
|
+
|
|
4
|
+
| ${t("common.table.name")} | ${t("common.table.type")} | ${t("common.table.required")} | ${t("common.table.description")} |
|
|
5
|
+
| :--- | :--- | :--- | :--- |
|
|
6
|
+
| \`title\` | \`string | ReactNode\` | ${t("common.table.no")} | ${t("components.navigationBar.titleDescription")} |
|
|
7
|
+
| \`backIcon\` | \`boolean | IIconProps | ReactNode\` | ${t("common.table.no")} | ${t("components.navigationBar.backIconDescription")} |
|
|
8
|
+
| \`onBackClick\` | \`() => void\` | ${t("common.table.no")} | ${t("components.navigationBar.onBackClickDescription")} |
|
|
9
|
+
| \`theme\` | \`'default' | 'inverse'\` | ${t("common.table.no")} | ${t("components.navigationBar.themeDescription")} |
|
|
10
|
+
| \`transparent\` | \`boolean | 'auto'\` | ${t("common.table.no")} | ${t("components.navigationBar.transparentDescription")} |
|
|
11
|
+
| \`leftIcon\` | \`IIconProps | ReactNode\` | ${t("common.table.no")} | ${t("components.navigationBar.leftIconDescription")} |
|
|
12
|
+
| \`onLeftIconClick\` | \`() => void\` | ${t("common.table.no")} | ${t("components.navigationBar.onLeftIconClickDescription")} |
|
|
13
|
+
| \`rightIcon\` | \`IIconProps | ReactNode\` | ${t("common.table.no")} | ${t("components.navigationBar.rightIconDescription")} |
|
|
14
|
+
| \`onRightIconClick\` | \`() => void\` | ${t("common.table.no")} | ${t("components.navigationBar.onRightIconClickDescription")} |
|
|
15
|
+
| \`className\` | \`string\` | ${t("common.table.no")} | ${t("components.navigationBar.classNameDescription")} |
|
|
16
|
+
| \`...props\` | \`ComponentPropsWithoutRef<'div'>\` | ${t("common.table.no")} | ${t("components.navigationBar.propsDescription")} |
|
|
17
|
+
`;return o.jsxs(o.Fragment,{children:[o.jsx(d,{}),o.jsx(B,{}),o.jsx(m,{children:t("components.navigationBar.description")}),o.jsx(u,{}),o.jsx(m,{children:g}),o.jsx(v,{})]})},_={title:"Components/NavigationBar",component:l,parameters:{layout:"fullscreen",docs:{page:k}},tags:["autodocs"],argTypes:{title:{control:"text",description:t("components.navigationBar.argTypes.titleDescription"),table:{type:{summary:"string | ReactNode"}}},backIcon:{control:"boolean",description:t("components.navigationBar.argTypes.backIconDescription"),table:{type:{summary:"boolean | IIconProps | ReactNode"}}},onBackClick:{action:"back-clicked",description:t("components.navigationBar.argTypes.onBackClickDescription"),table:{type:{summary:"() => void"}}},theme:{control:"select",options:["default","inverse"],description:t("components.navigationBar.argTypes.themeDescription"),table:{type:{summary:'"default" | "inverse"'},defaultValue:{summary:"default"}}},transparent:{control:"select",options:["auto","always","none"],description:t("components.navigationBar.argTypes.transparentDescription"),table:{type:{summary:'"auto" | "always" | "none"'},defaultValue:{summary:"none"}}},divider:{control:"boolean",description:t("components.navigationBar.argTypes.dividerDescription"),table:{type:{summary:"boolean"}}},leftIcon:{control:"object",description:t("components.navigationBar.argTypes.leftIconDescription"),table:{type:{summary:"IIconProps | ReactNode"}}},onLeftIconClick:{action:"left-icon-clicked",description:t("components.navigationBar.argTypes.onLeftIconClickDescription"),table:{type:{summary:"() => void"}}},rightIcon:{control:"object",description:t("components.navigationBar.argTypes.rightIconDescription"),table:{type:{summary:"IIconProps | ReactNode"}}},onRightIconClick:{action:"right-icon-clicked",description:t("components.navigationBar.argTypes.onRightIconClickDescription"),table:{type:{summary:"() => void"}}},className:{control:"text",description:t("components.navigationBar.argTypes.classNameDescription"),table:{type:{summary:"string"}}}}},n={storyName:t("components.navigationBar.stories.default.storyName"),args:{title:t("components.navigationBar.stories.default.title")}},e={storyName:t("components.navigationBar.stories.withBackIcon.storyName"),args:{title:t("components.navigationBar.stories.withBackIcon.title"),backIcon:!0,onBackClick:()=>console.log("Back clicked")}},a={storyName:t("components.navigationBar.stories.withLeftAndRightIcons.storyName"),args:{title:t("components.navigationBar.stories.withLeftAndRightIcons.title"),leftIcon:{name:"placeholder"},onLeftIconClick:()=>console.log("Menu clicked"),rightIcon:{name:"placeholder"},onRightIconClick:()=>console.log("More clicked")}},i={storyName:t("components.navigationBar.stories.withBadge.storyName"),args:{title:t("components.navigationBar.stories.withBadge.title"),rightIcon:o.jsxs(y,{children:[o.jsx(I,{name:"placeholder"}),o.jsx(h,{children:t("components.navigationBar.stories.withBadge.badgeCount")})]}),onRightIconClick:()=>console.log("Notifications clicked")}},r={storyName:t("components.navigationBar.stories.transparentAlways.storyName"),args:{title:t("components.navigationBar.stories.transparentAlways.title"),transparent:"always"}},s={storyName:t("components.navigationBar.stories.customContent.storyName"),render:()=>o.jsx(l,{left:o.jsx(p,{children:t("components.navigationBar.stories.customContent.leftButton")}),title:t("components.navigationBar.stories.customContent.title"),right:o.jsx(p,{children:t("components.navigationBar.stories.customContent.rightButton")})})},c={storyName:t("components.navigationBar.stories.interactive.storyName"),args:{title:t("components.navigationBar.stories.interactive.title"),backIcon:!0}};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
|
|
18
|
+
storyName: t('components.navigationBar.stories.default.storyName'),
|
|
19
|
+
args: {
|
|
20
|
+
title: t('components.navigationBar.stories.default.title')
|
|
21
|
+
}
|
|
22
|
+
}`,...n.parameters?.docs?.source}}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
|
|
23
|
+
storyName: t('components.navigationBar.stories.withBackIcon.storyName'),
|
|
24
|
+
args: {
|
|
25
|
+
title: t('components.navigationBar.stories.withBackIcon.title'),
|
|
26
|
+
backIcon: true,
|
|
27
|
+
onBackClick: () => console.log('Back clicked')
|
|
28
|
+
}
|
|
29
|
+
}`,...e.parameters?.docs?.source}}};a.parameters={...a.parameters,docs:{...a.parameters?.docs,source:{originalSource:`{
|
|
30
|
+
storyName: t('components.navigationBar.stories.withLeftAndRightIcons.storyName'),
|
|
31
|
+
args: {
|
|
32
|
+
title: t('components.navigationBar.stories.withLeftAndRightIcons.title'),
|
|
33
|
+
leftIcon: {
|
|
34
|
+
name: 'placeholder'
|
|
35
|
+
},
|
|
36
|
+
onLeftIconClick: () => console.log('Menu clicked'),
|
|
37
|
+
rightIcon: {
|
|
38
|
+
name: 'placeholder'
|
|
39
|
+
},
|
|
40
|
+
onRightIconClick: () => console.log('More clicked')
|
|
41
|
+
}
|
|
42
|
+
}`,...a.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
|
|
43
|
+
storyName: t('components.navigationBar.stories.withBadge.storyName'),
|
|
44
|
+
args: {
|
|
45
|
+
title: t('components.navigationBar.stories.withBadge.title'),
|
|
46
|
+
rightIcon: <BadgeContainer>
|
|
47
|
+
<Icon name="placeholder" />
|
|
48
|
+
<Badge>
|
|
49
|
+
{t('components.navigationBar.stories.withBadge.badgeCount')}
|
|
50
|
+
</Badge>
|
|
51
|
+
</BadgeContainer>,
|
|
52
|
+
onRightIconClick: () => console.log('Notifications clicked')
|
|
53
|
+
}
|
|
54
|
+
}`,...i.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
|
|
55
|
+
storyName: t('components.navigationBar.stories.transparentAlways.storyName'),
|
|
56
|
+
args: {
|
|
57
|
+
title: t('components.navigationBar.stories.transparentAlways.title'),
|
|
58
|
+
transparent: 'always'
|
|
59
|
+
}
|
|
60
|
+
}`,...r.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
|
|
61
|
+
storyName: t('components.navigationBar.stories.customContent.storyName'),
|
|
62
|
+
render: () => <NavigationBar left={<Button>
|
|
63
|
+
{t('components.navigationBar.stories.customContent.leftButton')}
|
|
64
|
+
</Button>} title={t('components.navigationBar.stories.customContent.title')} right={<Button>
|
|
65
|
+
{t('components.navigationBar.stories.customContent.rightButton')}
|
|
66
|
+
</Button>} />
|
|
67
|
+
}`,...s.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
|
|
68
|
+
storyName: t('components.navigationBar.stories.interactive.storyName'),
|
|
69
|
+
args: {
|
|
70
|
+
title: t('components.navigationBar.stories.interactive.title'),
|
|
71
|
+
backIcon: true
|
|
72
|
+
}
|
|
73
|
+
}`,...c.parameters?.docs?.source}}};const q=["Default","WithBackIcon","WithLeftAndRightIcons","WithBadge","TransparentAlways","CustomContent","Interactive"];export{s as CustomContent,n as Default,c as Interactive,r as TransparentAlways,e as WithBackIcon,i as WithBadge,a as WithLeftAndRightIcons,q as __namedExportsOrder,_ as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as l,j as s}from"./iframe-CQAwSt4E.js";import{c as h,g as V}from"./classname-CUR_zgkh.js";import{u as z}from"./index-BV0AJWP6.js";import{T as m}from"./typography-DEpAJl_i.js";import{S as x}from"./skeleton-C91JgehG.js";const e=V("number-field"),B=l.forwardRef((a,c)=>{const{length:r=6,errorMessage:o,label:t,shape:N,disabled:u,className:j,loading:n,masked:$,value:P,defaultValue:R,onChange:S,...C}=a,d=l.useRef(null),[_,f]=l.useState(!1);l.useImperativeHandle(c,()=>({focus:()=>d.current?.focus(),blur:()=>d.current?.blur()}));const[p,b]=z(a,{defaultValue:"",trigger:"onChange"}),v=l.useCallback(g=>{if(n||u)return;const i=g.target.value.replace(/\D/g,"").slice(0,r);b(i)},[n,u,r,b]),k=l.useCallback(()=>{f(!0)},[]),w=l.useCallback(()=>{f(!1)},[]),y=l.useCallback(()=>{d.current?.focus()},[]),F=(p??"").length;return s.jsxs("div",{...C,onClick:y,className:h(e,j,{[`${e}--disabled`]:u,[`${e}--error`]:!!o,[`${e}--pill`]:N==="pill",[`${e}--focused`]:_}),children:[!!t&&(n?s.jsx("div",{className:`${e}__label--loading`,children:s.jsx(x,{width:80,height:14,shape:"pill"})}):s.jsx(m,{size:"small",weight:400,color:"alias-object-primary",className:`${e}__label`,children:t})),s.jsxs("div",{className:`${e}__inputs`,children:[Array.from({length:r}).map((g,i)=>s.jsx(I,{value:(p??"")[i],masked:$,loading:n,isFocused:_&&i===F},i)),s.jsx("input",{ref:d,type:"text",inputMode:"numeric",autoComplete:"one-time-code",pattern:"\\d*",value:p??"",onChange:v,onFocus:k,onBlur:w,disabled:u||n,className:`${e}__input-actual`,maxLength:r,"aria-label":t})]}),o&&s.jsx(m,{size:"small",weight:400,color:"alias-support-negative",className:`${e}__error-message`,children:o})]})}),I=({value:a,masked:c,loading:r,isFocused:o})=>{const t=!a&&o&&!r;return s.jsxs("div",{className:h(`${e}__input`,{[`${e}__input--focused`]:o}),children:[!a&&(r?s.jsx("div",{className:`${e}__placeholder--loading`,children:s.jsx(x,{width:18,height:12,shape:"pill"})}):s.jsx(m,{size:"base",weight:400,color:"alias-object-placeholder",className:`${e}__placeholder`,children:"-"})),a&&c&&s.jsx("div",{className:`${e}__value--masked`}),a&&!c&&s.jsx(m,{component:"span",size:"base",weight:400,color:"alias-object-primary",className:`${e}__value`,children:a}),s.jsx("div",{className:h(`${e}__pointer`,{[`${e}__pointer--visible`]:t,[`${e}__pointer--hidden`]:!t})})]})};B.__docgenInfo={description:"",methods:[{name:"focus",docblock:null,modifiers:[],params:[],returns:null},{name:"blur",docblock:null,modifiers:[],params:[],returns:null}],displayName:"NumberField"};export{B as N};
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import{j as n,r as y}from"./iframe-CQAwSt4E.js";import{T as N,S as v,M as x,P as D,a as j}from"./blocks-BuaOUtiH.js";import{t as e}from"./store-D2RudmNr.js";import{N as s}from"./number-field-CXKmnfKe.js";import"./preload-helper-PPVm8Dsz.js";import"./index-DHiZ-gXR.js";import"./classname-CUR_zgkh.js";import"./index-BV0AJWP6.js";import"./index-B-Ksafg0.js";import"./typography-DEpAJl_i.js";import"./colors-_6nFGM3e.js";import"./skeleton-C91JgehG.js";const C=()=>{const t=`
|
|
2
|
+
## ${e("common.table.title")}
|
|
3
|
+
|
|
4
|
+
| ${e("common.table.name")} | ${e("common.table.type")} | ${e("common.table.required")} | ${e("common.table.description")} |
|
|
5
|
+
| :--- | :--- | :--- | :--- |
|
|
6
|
+
| \`value\` | \`string\` | ${e("common.table.no")} | ${e("components.numberField.valueDescription")} |
|
|
7
|
+
| \`defaultValue\` | \`string\` | ${e("common.table.no")} | ${e("components.numberField.defaultValueDescription")} |
|
|
8
|
+
| \`onChange\` | \`(value: string) => void\` | ${e("common.table.no")} | ${e("components.numberField.onChangeDescription")} |
|
|
9
|
+
| \`length\` | \`number\` | ${e("common.table.no")} | ${e("components.numberField.lengthDescription")} |
|
|
10
|
+
| \`masked\` | \`boolean\` | ${e("common.table.no")} | ${e("components.numberField.maskedDescription")} |
|
|
11
|
+
| \`label\` | \`string\` | ${e("common.table.no")} | ${e("components.numberField.labelDescription")} |
|
|
12
|
+
| \`errorMessage\` | \`string\` | ${e("common.table.no")} | ${e("components.numberField.errorMessageDescription")} |
|
|
13
|
+
| \`shape\` | \`'rounded' | 'pill'\` | ${e("common.table.no")} | ${e("components.numberField.shapeDescription")} |
|
|
14
|
+
| \`disabled\` | \`boolean\` | ${e("common.table.no")} | ${e("components.numberField.disabledDescription")} |
|
|
15
|
+
| \`loading\` | \`boolean\` | ${e("common.table.no")} | ${e("components.numberField.loadingDescription")} |
|
|
16
|
+
| \`className\` | \`string\` | ${e("common.table.no")} | ${e("components.numberField.classNameDescription")} |
|
|
17
|
+
| \`...props\` | \`ComponentProps<'div'>\` | ${e("common.table.no")} | ${e("components.numberField.propsDescription")} |
|
|
18
|
+
`;return n.jsxs(n.Fragment,{children:[n.jsx(N,{}),n.jsx(v,{}),n.jsx(x,{children:e("components.numberField.description")}),n.jsx(D,{}),n.jsx(x,{children:t}),n.jsx(j,{})]})},z={title:"Components/NumberField",component:s,parameters:{layout:"padded",docs:{page:C}},tags:["autodocs"],argTypes:{value:{control:"text",description:e("components.numberField.argTypes.valueDescription"),table:{type:{summary:"string"}}},defaultValue:{control:"text",description:e("components.numberField.argTypes.defaultValueDescription"),table:{type:{summary:"string"}}},onChange:{action:"changed",description:e("components.numberField.argTypes.onChangeDescription"),table:{type:{summary:"(value: string) => void"}}},length:{control:{type:"number",min:1,max:10,step:1},description:e("components.numberField.argTypes.lengthDescription"),table:{type:{summary:"number"},defaultValue:{summary:"6"}}},masked:{control:"boolean",description:e("components.numberField.argTypes.maskedDescription"),table:{type:{summary:"boolean"}}},label:{control:"text",description:e("components.numberField.argTypes.labelDescription"),table:{type:{summary:"string"}}},errorMessage:{control:"text",description:e("components.numberField.argTypes.errorMessageDescription"),table:{type:{summary:"string"}}},shape:{control:"select",options:["rounded","pill"],description:e("components.numberField.argTypes.shapeDescription"),table:{type:{summary:"INumberFieldShape"},defaultValue:{summary:"rounded"}}},disabled:{control:"boolean",description:e("components.numberField.argTypes.disabledDescription"),table:{type:{summary:"boolean"}}},loading:{control:"boolean",description:e("components.numberField.argTypes.loadingDescription"),table:{type:{summary:"boolean"}}},className:{control:"text",description:e("components.numberField.argTypes.classNameDescription"),table:{type:{summary:"string"}}}}},o={storyName:e("components.numberField.stories.default.storyName"),args:{length:6}},r={storyName:e("components.numberField.stories.differentLengths.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"24px"},children:[n.jsxs("div",{children:[n.jsx("h3",{style:{marginBottom:"12px"},children:e("components.numberField.stories.differentLengths.fourDigit")}),n.jsx(s,{length:4})]}),n.jsxs("div",{children:[n.jsx("h3",{style:{marginBottom:"12px"},children:e("components.numberField.stories.differentLengths.sixDigit")}),n.jsx(s,{length:6})]}),n.jsxs("div",{children:[n.jsx("h3",{style:{marginBottom:"12px"},children:e("components.numberField.stories.differentLengths.eightDigit")}),n.jsx(s,{length:8})]})]})},i={storyName:e("components.numberField.stories.withLabel.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{label:e("components.numberField.stories.withLabel.enterPin"),length:4}),n.jsx(s,{label:e("components.numberField.stories.withLabel.otpCode"),length:6}),n.jsx(s,{label:e("components.numberField.stories.withLabel.verificationCode"),length:8})]})},l={storyName:e("components.numberField.stories.maskedInput.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{label:e("components.numberField.stories.maskedInput.enterPin"),length:6,masked:!0}),n.jsx(s,{label:e("components.numberField.stories.maskedInput.passwordCode"),length:4,masked:!0})]})},a={storyName:e("components.numberField.stories.controlled.storyName"),render:()=>{const[t,b]=y.useState("");return n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{value:t,onChange:b,length:6,label:e("components.numberField.stories.controlled.enterCode")}),n.jsxs("p",{style:{fontSize:"14px",color:"#666"},children:[e("components.numberField.stories.controlled.currentValue"),":"," ",t||e("components.numberField.stories.controlled.empty")]})]})}},m={storyName:e("components.numberField.stories.withErrorMessage.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{label:e("components.numberField.stories.withLabel.verificationCode"),length:6,errorMessage:e("components.numberField.stories.withErrorMessage.invalidCode")}),n.jsx(s,{label:e("components.numberField.stories.withLabel.otpCode"),length:4,errorMessage:e("components.numberField.stories.withErrorMessage.codeExpired")})]})},d={storyName:e("components.numberField.stories.shapes.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{label:e("components.numberField.stories.shapes.rounded"),length:6,shape:"rounded"}),n.jsx(s,{label:e("components.numberField.stories.shapes.pill"),length:6,shape:"pill"})]})},p={storyName:e("components.numberField.stories.states.storyName"),render:()=>n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[n.jsx(s,{label:e("components.numberField.stories.states.default"),length:6}),n.jsx(s,{label:e("components.numberField.stories.states.disabled"),length:6,disabled:!0}),n.jsx(s,{label:e("components.numberField.stories.states.loading"),length:6,loading:!0})]})},c={storyName:e("components.numberField.stories.completeExample.storyName"),render:()=>{const[t,b]=y.useState(""),[F,g]=y.useState(""),f=h=>{b(h),h.length===6?g(h==="123456"?"":"Invalid code. Please try again."):g("")};return n.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"24px"},children:[n.jsx(s,{label:e("components.numberField.stories.withLabel.otpCode"),length:6,masked:!0,value:t,onChange:f,errorMessage:F}),n.jsx("p",{style:{fontSize:"14px",color:"#666"},children:e("components.numberField.stories.completeExample.instructions")})]})}},u={storyName:e("components.numberField.stories.interactive.storyName"),args:{length:6,masked:!1,disabled:!1,loading:!1,shape:"rounded"}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
|
|
19
|
+
storyName: t('components.numberField.stories.default.storyName'),
|
|
20
|
+
args: {
|
|
21
|
+
length: 6
|
|
22
|
+
}
|
|
23
|
+
}`,...o.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
|
|
24
|
+
storyName: t('components.numberField.stories.differentLengths.storyName'),
|
|
25
|
+
render: () => <div style={{
|
|
26
|
+
display: 'flex',
|
|
27
|
+
flexDirection: 'column',
|
|
28
|
+
gap: '24px'
|
|
29
|
+
}}>
|
|
30
|
+
<div>
|
|
31
|
+
<h3 style={{
|
|
32
|
+
marginBottom: '12px'
|
|
33
|
+
}}>
|
|
34
|
+
{t('components.numberField.stories.differentLengths.fourDigit')}
|
|
35
|
+
</h3>
|
|
36
|
+
<NumberField length={4} />
|
|
37
|
+
</div>
|
|
38
|
+
<div>
|
|
39
|
+
<h3 style={{
|
|
40
|
+
marginBottom: '12px'
|
|
41
|
+
}}>
|
|
42
|
+
{t('components.numberField.stories.differentLengths.sixDigit')}
|
|
43
|
+
</h3>
|
|
44
|
+
<NumberField length={6} />
|
|
45
|
+
</div>
|
|
46
|
+
<div>
|
|
47
|
+
<h3 style={{
|
|
48
|
+
marginBottom: '12px'
|
|
49
|
+
}}>
|
|
50
|
+
{t('components.numberField.stories.differentLengths.eightDigit')}
|
|
51
|
+
</h3>
|
|
52
|
+
<NumberField length={8} />
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
}`,...r.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
|
|
56
|
+
storyName: t('components.numberField.stories.withLabel.storyName'),
|
|
57
|
+
render: () => <div style={{
|
|
58
|
+
display: 'flex',
|
|
59
|
+
flexDirection: 'column',
|
|
60
|
+
gap: '16px'
|
|
61
|
+
}}>
|
|
62
|
+
<NumberField label={t('components.numberField.stories.withLabel.enterPin')} length={4} />
|
|
63
|
+
<NumberField label={t('components.numberField.stories.withLabel.otpCode')} length={6} />
|
|
64
|
+
<NumberField label={t('components.numberField.stories.withLabel.verificationCode')} length={8} />
|
|
65
|
+
</div>
|
|
66
|
+
}`,...i.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
|
|
67
|
+
storyName: t('components.numberField.stories.maskedInput.storyName'),
|
|
68
|
+
render: () => <div style={{
|
|
69
|
+
display: 'flex',
|
|
70
|
+
flexDirection: 'column',
|
|
71
|
+
gap: '16px'
|
|
72
|
+
}}>
|
|
73
|
+
<NumberField label={t('components.numberField.stories.maskedInput.enterPin')} length={6} masked />
|
|
74
|
+
<NumberField label={t('components.numberField.stories.maskedInput.passwordCode')} length={4} masked />
|
|
75
|
+
</div>
|
|
76
|
+
}`,...l.parameters?.docs?.source}}};a.parameters={...a.parameters,docs:{...a.parameters?.docs,source:{originalSource:`{
|
|
77
|
+
storyName: t('components.numberField.stories.controlled.storyName'),
|
|
78
|
+
render: () => {
|
|
79
|
+
const [code, setCode] = useState('');
|
|
80
|
+
return <div style={{
|
|
81
|
+
display: 'flex',
|
|
82
|
+
flexDirection: 'column',
|
|
83
|
+
gap: '16px'
|
|
84
|
+
}}>
|
|
85
|
+
<NumberField value={code} onChange={setCode} length={6} label={t('components.numberField.stories.controlled.enterCode')} />
|
|
86
|
+
<p style={{
|
|
87
|
+
fontSize: '14px',
|
|
88
|
+
color: '#666'
|
|
89
|
+
}}>
|
|
90
|
+
{t('components.numberField.stories.controlled.currentValue')}:{' '}
|
|
91
|
+
{code || t('components.numberField.stories.controlled.empty')}
|
|
92
|
+
</p>
|
|
93
|
+
</div>;
|
|
94
|
+
}
|
|
95
|
+
}`,...a.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
96
|
+
storyName: t('components.numberField.stories.withErrorMessage.storyName'),
|
|
97
|
+
render: () => <div style={{
|
|
98
|
+
display: 'flex',
|
|
99
|
+
flexDirection: 'column',
|
|
100
|
+
gap: '16px'
|
|
101
|
+
}}>
|
|
102
|
+
<NumberField label={t('components.numberField.stories.withLabel.verificationCode')} length={6} errorMessage={t('components.numberField.stories.withErrorMessage.invalidCode')} />
|
|
103
|
+
<NumberField label={t('components.numberField.stories.withLabel.otpCode')} length={4} errorMessage={t('components.numberField.stories.withErrorMessage.codeExpired')} />
|
|
104
|
+
</div>
|
|
105
|
+
}`,...m.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
|
|
106
|
+
storyName: t('components.numberField.stories.shapes.storyName'),
|
|
107
|
+
render: () => <div style={{
|
|
108
|
+
display: 'flex',
|
|
109
|
+
flexDirection: 'column',
|
|
110
|
+
gap: '16px'
|
|
111
|
+
}}>
|
|
112
|
+
<NumberField label={t('components.numberField.stories.shapes.rounded')} length={6} shape="rounded" />
|
|
113
|
+
<NumberField label={t('components.numberField.stories.shapes.pill')} length={6} shape="pill" />
|
|
114
|
+
</div>
|
|
115
|
+
}`,...d.parameters?.docs?.source}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
116
|
+
storyName: t('components.numberField.stories.states.storyName'),
|
|
117
|
+
render: () => <div style={{
|
|
118
|
+
display: 'flex',
|
|
119
|
+
flexDirection: 'column',
|
|
120
|
+
gap: '16px'
|
|
121
|
+
}}>
|
|
122
|
+
<NumberField label={t('components.numberField.stories.states.default')} length={6} />
|
|
123
|
+
<NumberField label={t('components.numberField.stories.states.disabled')} length={6} disabled />
|
|
124
|
+
<NumberField label={t('components.numberField.stories.states.loading')} length={6} loading />
|
|
125
|
+
</div>
|
|
126
|
+
}`,...p.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
|
|
127
|
+
storyName: t('components.numberField.stories.completeExample.storyName'),
|
|
128
|
+
render: () => {
|
|
129
|
+
const [otpCode, setOtpCode] = useState('');
|
|
130
|
+
const [error, setError] = useState('');
|
|
131
|
+
const handleChange = (value: string) => {
|
|
132
|
+
setOtpCode(value);
|
|
133
|
+
if (value.length === 6) {
|
|
134
|
+
// Simulate validation
|
|
135
|
+
if (value === '123456') {
|
|
136
|
+
setError('');
|
|
137
|
+
} else {
|
|
138
|
+
setError('Invalid code. Please try again.');
|
|
139
|
+
}
|
|
140
|
+
} else {
|
|
141
|
+
setError('');
|
|
142
|
+
}
|
|
143
|
+
};
|
|
144
|
+
return <div style={{
|
|
145
|
+
display: 'flex',
|
|
146
|
+
flexDirection: 'column',
|
|
147
|
+
gap: '24px'
|
|
148
|
+
}}>
|
|
149
|
+
<NumberField label={t('components.numberField.stories.withLabel.otpCode')} length={6} masked value={otpCode} onChange={handleChange} errorMessage={error} />
|
|
150
|
+
<p style={{
|
|
151
|
+
fontSize: '14px',
|
|
152
|
+
color: '#666'
|
|
153
|
+
}}>
|
|
154
|
+
{t('components.numberField.stories.completeExample.instructions')}
|
|
155
|
+
</p>
|
|
156
|
+
</div>;
|
|
157
|
+
}
|
|
158
|
+
}`,...c.parameters?.docs?.source}}};u.parameters={...u.parameters,docs:{...u.parameters?.docs,source:{originalSource:`{
|
|
159
|
+
storyName: t('components.numberField.stories.interactive.storyName'),
|
|
160
|
+
args: {
|
|
161
|
+
length: 6,
|
|
162
|
+
masked: false,
|
|
163
|
+
disabled: false,
|
|
164
|
+
loading: false,
|
|
165
|
+
shape: 'rounded'
|
|
166
|
+
}
|
|
167
|
+
}`,...u.parameters?.docs?.source}}};const O=["Default","DifferentLengths","WithLabel","MaskedInput","Controlled","WithErrorMessage","Shapes","States","CompleteExample","Interactive"];export{c as CompleteExample,a as Controlled,o as Default,r as DifferentLengths,u as Interactive,l as MaskedInput,d as Shapes,p as States,m as WithErrorMessage,i as WithLabel,O as __namedExportsOrder,z as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{g as Lt}from"./iframe-CQAwSt4E.js";import{y as nt,i as Vr,z as xt,A as Gt,B as Bt,h as Dt,j as F,k as zr,C as Ut,d as E,D as U,E as k,F as kt,G as Nt,H as at,I as Wr,m as Vt,J as it,K as ut,u as zt,r as Wt,l as $t,o as Xt,p as Yt,a as Zt,n as Ht,L as Jt,s as Qt,c as rn,x as en,w as tn}from"./_setToString-CbM921C9.js";var W,ie;function $r(){if(ie)return W;ie=1;var n=nt(),t=Vr(),r="[object Symbol]";function e(a){return typeof a=="symbol"||t(a)&&n(a)==r}return W=e,W}var $,ue;function st(){if(ue)return $;ue=1;function n(t,r){for(var e=-1,a=t==null?0:t.length,i=Array(a);++e<a;)i[e]=r(t[e],e,t);return i}return $=n,$}var X,se;function nn(){if(se)return X;se=1;function n(t,r){for(var e=-1,a=t==null?0:t.length;++e<a&&r(t[e],e,t)!==!1;);return t}return X=n,X}var Y,oe;function an(){if(oe)return Y;oe=1;var n=xt(),t=n(Object.keys,Object);return Y=t,Y}var Z,fe;function un(){if(fe)return Z;fe=1;var n=Gt(),t=an(),r=Object.prototype,e=r.hasOwnProperty;function a(i){if(!n(i))return t(i);var u=[];for(var s in Object(i))e.call(i,s)&&s!="constructor"&&u.push(s);return u}return Z=a,Z}var H,ce;function Xr(){if(ce)return H;ce=1;var n=Bt(),t=un(),r=Dt();function e(a){return r(a)?n(a):t(a)}return H=e,H}var J,le;function sn(){if(le)return J;le=1;var n=F(),t=Xr();function r(e,a){return e&&n(a,t(a),e)}return J=r,J}var Q,ye;function on(){if(ye)return Q;ye=1;var n=F(),t=zr();function r(e,a){return e&&n(a,t(a),e)}return Q=r,Q}var rr,ge;function fn(){if(ge)return rr;ge=1;function n(t,r){for(var e=-1,a=t==null?0:t.length,i=0,u=[];++e<a;){var s=t[e];r(s,e,t)&&(u[i++]=s)}return u}return rr=n,rr}var er,be;function ot(){if(be)return er;be=1;function n(){return[]}return er=n,er}var tr,ve;function Yr(){if(ve)return tr;ve=1;var n=fn(),t=ot(),r=Object.prototype,e=r.propertyIsEnumerable,a=Object.getOwnPropertySymbols,i=a?function(u){return u==null?[]:(u=Object(u),n(a(u),function(s){return e.call(u,s)}))}:t;return tr=i,tr}var nr,_e;function cn(){if(_e)return nr;_e=1;var n=F(),t=Yr();function r(e,a){return n(e,t(e),a)}return nr=r,nr}var ar,pe;function Zr(){if(pe)return ar;pe=1;function n(t,r){for(var e=-1,a=r.length,i=t.length;++e<a;)t[i+e]=r[e];return t}return ar=n,ar}var ir,qe;function ft(){if(qe)return ir;qe=1;var n=Zr(),t=Ut(),r=Yr(),e=ot(),a=Object.getOwnPropertySymbols,i=a?function(u){for(var s=[];u;)n(s,r(u)),u=t(u);return s}:e;return ir=i,ir}var ur,he;function ln(){if(he)return ur;he=1;var n=F(),t=ft();function r(e,a){return n(e,t(e),a)}return ur=r,ur}var sr,me;function ct(){if(me)return sr;me=1;var n=Zr(),t=E();function r(e,a,i){var u=a(e);return t(e)?u:n(u,i(e))}return sr=r,sr}var or,de;function yn(){if(de)return or;de=1;var n=ct(),t=Yr(),r=Xr();function e(a){return n(a,r,t)}return or=e,or}var fr,Se;function lt(){if(Se)return fr;Se=1;var n=ct(),t=ft(),r=zr();function e(a){return n(a,r,t)}return fr=e,fr}var cr,Ae;function gn(){if(Ae)return cr;Ae=1;var n=U(),t=k(),r=n(t,"DataView");return cr=r,cr}var lr,Te;function bn(){if(Te)return lr;Te=1;var n=U(),t=k(),r=n(t,"Promise");return lr=r,lr}var yr,Re;function vn(){if(Re)return yr;Re=1;var n=U(),t=k(),r=n(t,"Set");return yr=r,yr}var gr,Ie;function _n(){if(Ie)return gr;Ie=1;var n=U(),t=k(),r=n(t,"WeakMap");return gr=r,gr}var br,Oe;function Hr(){if(Oe)return br;Oe=1;var n=gn(),t=kt(),r=bn(),e=vn(),a=_n(),i=nt(),u=Nt(),s="[object Map]",o="[object Object]",l="[object Promise]",y="[object Set]",h="[object WeakMap]",g="[object DataView]",v=u(n),_=u(t),d=u(r),S=u(e),m=u(a),p=i;return(n&&p(new n(new ArrayBuffer(1)))!=g||t&&p(new t)!=s||r&&p(r.resolve())!=l||e&&p(new e)!=y||a&&p(new a)!=h)&&(p=function(I){var O=i(I),w=O==o?I.constructor:void 0,j=w?u(w):"";if(j)switch(j){case v:return g;case _:return s;case d:return l;case S:return y;case m:return h}return O}),br=p,br}var vr,we;function pn(){if(we)return vr;we=1;var n=Object.prototype,t=n.hasOwnProperty;function r(e){var a=e.length,i=new e.constructor(a);return a&&typeof e[0]=="string"&&t.call(e,"index")&&(i.index=e.index,i.input=e.input),i}return vr=r,vr}var _r,je;function qn(){if(je)return _r;je=1;var n=at();function t(r,e){var a=e?n(r.buffer):r.buffer;return new r.constructor(a,r.byteOffset,r.byteLength)}return _r=t,_r}var pr,Ce;function hn(){if(Ce)return pr;Ce=1;var n=/\w*$/;function t(r){var e=new r.constructor(r.source,n.exec(r));return e.lastIndex=r.lastIndex,e}return pr=t,pr}var qr,Pe;function mn(){if(Pe)return qr;Pe=1;var n=Wr(),t=n?n.prototype:void 0,r=t?t.valueOf:void 0;function e(a){return r?Object(r.call(a)):{}}return qr=e,qr}var hr,Ke;function dn(){if(Ke)return hr;Ke=1;var n=at(),t=qn(),r=hn(),e=mn(),a=Vt(),i="[object Boolean]",u="[object Date]",s="[object Map]",o="[object Number]",l="[object RegExp]",y="[object Set]",h="[object String]",g="[object Symbol]",v="[object ArrayBuffer]",_="[object DataView]",d="[object Float32Array]",S="[object Float64Array]",m="[object Int8Array]",p="[object Int16Array]",I="[object Int32Array]",O="[object Uint8Array]",w="[object Uint8ClampedArray]",j="[object Uint16Array]",N="[object Uint32Array]";function V(q,z,L){var C=q.constructor;switch(z){case v:return n(q);case i:case u:return new C(+q);case _:return t(q,L);case d:case S:case m:case p:case I:case O:case w:case j:case N:return a(q,L);case s:return new C;case o:case h:return new C(q);case l:return r(q);case y:return new C;case g:return e(q)}}return hr=V,hr}var mr,Me;function Sn(){if(Me)return mr;Me=1;var n=Hr(),t=Vr(),r="[object Map]";function e(a){return t(a)&&n(a)==r}return mr=e,mr}var dr,Ee;function An(){if(Ee)return dr;Ee=1;var n=Sn(),t=ut(),r=it(),e=r&&r.isMap,a=e?t(e):n;return dr=a,dr}var Sr,Fe;function Tn(){if(Fe)return Sr;Fe=1;var n=Hr(),t=Vr(),r="[object Set]";function e(a){return t(a)&&n(a)==r}return Sr=e,Sr}var Ar,Le;function Rn(){if(Le)return Ar;Le=1;var n=Tn(),t=ut(),r=it(),e=r&&r.isSet,a=e?t(e):n;return Ar=a,Ar}var Tr,xe;function In(){if(xe)return Tr;xe=1;var n=zt(),t=nn(),r=Wt(),e=sn(),a=on(),i=$t(),u=Ht(),s=cn(),o=ln(),l=yn(),y=lt(),h=Hr(),g=pn(),v=dn(),_=Xt(),d=E(),S=Yt(),m=An(),p=Zt(),I=Rn(),O=Xr(),w=zr(),j=1,N=2,V=4,q="[object Arguments]",z="[object Array]",L="[object Boolean]",C="[object Date]",gt="[object Error]",Qr="[object Function]",bt="[object GeneratorFunction]",vt="[object Map]",_t="[object Number]",re="[object Object]",pt="[object RegExp]",qt="[object Set]",ht="[object String]",mt="[object Symbol]",dt="[object WeakMap]",St="[object ArrayBuffer]",At="[object DataView]",Tt="[object Float32Array]",Rt="[object Float64Array]",It="[object Int8Array]",Ot="[object Int16Array]",wt="[object Int32Array]",jt="[object Uint8Array]",Ct="[object Uint8ClampedArray]",Pt="[object Uint16Array]",Kt="[object Uint32Array]",c={};c[q]=c[z]=c[St]=c[At]=c[L]=c[C]=c[Tt]=c[Rt]=c[It]=c[Ot]=c[wt]=c[vt]=c[_t]=c[re]=c[pt]=c[qt]=c[ht]=c[mt]=c[jt]=c[Ct]=c[Pt]=c[Kt]=!0,c[gt]=c[Qr]=c[dt]=!1;function x(f,P,K,Mt,G,A){var b,B=P&j,D=P&N,Et=P&V;if(K&&(b=G?K(f,Mt,G,A):K(f)),b!==void 0)return b;if(!p(f))return f;var ee=d(f);if(ee){if(b=g(f),!B)return u(f,b)}else{var M=h(f),te=M==Qr||M==bt;if(S(f))return i(f,B);if(M==re||M==q||te&&!G){if(b=D||te?{}:_(f),!B)return D?o(f,a(b,f)):s(f,e(b,f))}else{if(!c[M])return G?f:{};b=v(f,M,B)}}A||(A=new n);var ne=A.get(f);if(ne)return ne;A.set(f,b),I(f)?f.forEach(function(T){b.add(x(T,P,K,T,f,A))}):m(f)&&f.forEach(function(T,R){b.set(R,x(T,P,K,R,f,A))});var Ft=Et?D?y:l:D?w:O,ae=ee?void 0:Ft(f);return t(ae||f,function(T,R){ae&&(R=T,T=f[R]),r(b,R,x(T,P,K,R,f,A))}),b}return Tr=x,Tr}var Rr,Ge;function On(){if(Ge)return Rr;Ge=1;var n=E(),t=$r(),r=/\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,e=/^\w*$/;function a(i,u){if(n(i))return!1;var s=typeof i;return s=="number"||s=="symbol"||s=="boolean"||i==null||t(i)?!0:e.test(i)||!r.test(i)||u!=null&&i in Object(u)}return Rr=a,Rr}var Ir,Be;function wn(){if(Be)return Ir;Be=1;var n=Jt(),t="Expected a function";function r(e,a){if(typeof e!="function"||a!=null&&typeof a!="function")throw new TypeError(t);var i=function(){var u=arguments,s=a?a.apply(this,u):u[0],o=i.cache;if(o.has(s))return o.get(s);var l=e.apply(this,u);return i.cache=o.set(s,l)||o,l};return i.cache=new(r.Cache||n),i}return r.Cache=n,Ir=r,Ir}var Or,De;function jn(){if(De)return Or;De=1;var n=wn(),t=500;function r(e){var a=n(e,function(u){return i.size===t&&i.clear(),u}),i=a.cache;return a}return Or=r,Or}var wr,Ue;function Cn(){if(Ue)return wr;Ue=1;var n=jn(),t=/[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g,r=/\\(\\)?/g,e=n(function(a){var i=[];return a.charCodeAt(0)===46&&i.push(""),a.replace(t,function(u,s,o,l){i.push(o?l.replace(r,"$1"):s||u)}),i});return wr=e,wr}var jr,ke;function Pn(){if(ke)return jr;ke=1;var n=Wr(),t=st(),r=E(),e=$r(),a=n?n.prototype:void 0,i=a?a.toString:void 0;function u(s){if(typeof s=="string")return s;if(r(s))return t(s,u)+"";if(e(s))return i?i.call(s):"";var o=s+"";return o=="0"&&1/s==-1/0?"-0":o}return jr=u,jr}var Cr,Ne;function Kn(){if(Ne)return Cr;Ne=1;var n=Pn();function t(r){return r==null?"":n(r)}return Cr=t,Cr}var Pr,Ve;function Jr(){if(Ve)return Pr;Ve=1;var n=E(),t=On(),r=Cn(),e=Kn();function a(i,u){return n(i)?i:t(i,u)?[i]:r(e(i))}return Pr=a,Pr}var Kr,ze;function Mn(){if(ze)return Kr;ze=1;function n(t){var r=t==null?0:t.length;return r?t[r-1]:void 0}return Kr=n,Kr}var Mr,We;function yt(){if(We)return Mr;We=1;var n=$r();function t(r){if(typeof r=="string"||n(r))return r;var e=r+"";return e=="0"&&1/r==-1/0?"-0":e}return Mr=t,Mr}var Er,$e;function En(){if($e)return Er;$e=1;var n=Jr(),t=yt();function r(e,a){a=n(a,e);for(var i=0,u=a.length;e!=null&&i<u;)e=e[t(a[i++])];return i&&i==u?e:void 0}return Er=r,Er}var Fr,Xe;function Fn(){if(Xe)return Fr;Xe=1;function n(t,r,e){var a=-1,i=t.length;r<0&&(r=-r>i?0:i+r),e=e>i?i:e,e<0&&(e+=i),i=r>e?0:e-r>>>0,r>>>=0;for(var u=Array(i);++a<i;)u[a]=t[a+r];return u}return Fr=n,Fr}var Lr,Ye;function Ln(){if(Ye)return Lr;Ye=1;var n=En(),t=Fn();function r(e,a){return a.length<2?e:n(e,t(a,0,-1))}return Lr=r,Lr}var xr,Ze;function xn(){if(Ze)return xr;Ze=1;var n=Jr(),t=Mn(),r=Ln(),e=yt(),a=Object.prototype,i=a.hasOwnProperty;function u(s,o){o=n(o,s);var l=-1,y=o.length;if(!y)return!0;for(var h=s==null||typeof s!="object"&&typeof s!="function";++l<y;){var g=o[l];if(typeof g=="string"){if(g==="__proto__"&&!i.call(s,"__proto__"))return!1;if(g==="constructor"&&l+1<y&&typeof o[l+1]=="string"&&o[l+1]==="prototype"){if(h&&l===0)continue;return!1}}}var v=r(s,o);return v==null||delete v[e(t(o))]}return xr=u,xr}var Gr,He;function Gn(){if(He)return Gr;He=1;var n=Qt();function t(r){return n(r)?void 0:r}return Gr=t,Gr}var Br,Je;function Bn(){if(Je)return Br;Je=1;var n=Wr(),t=rn(),r=E(),e=n?n.isConcatSpreadable:void 0;function a(i){return r(i)||t(i)||!!(e&&i&&i[e])}return Br=a,Br}var Dr,Qe;function Dn(){if(Qe)return Dr;Qe=1;var n=Zr(),t=Bn();function r(e,a,i,u,s){var o=-1,l=e.length;for(i||(i=t),s||(s=[]);++o<l;){var y=e[o];a>0&&i(y)?a>1?r(y,a-1,i,u,s):n(s,y):u||(s[s.length]=y)}return s}return Dr=r,Dr}var Ur,rt;function Un(){if(rt)return Ur;rt=1;var n=Dn();function t(r){var e=r==null?0:r.length;return e?n(r,1):[]}return Ur=t,Ur}var kr,et;function kn(){if(et)return kr;et=1;var n=Un(),t=tn(),r=en();function e(a){return r(t(a,void 0,n),a+"")}return kr=e,kr}var Nr,tt;function Nn(){if(tt)return Nr;tt=1;var n=st(),t=In(),r=xn(),e=Jr(),a=F(),i=Gn(),u=kn(),s=lt(),o=1,l=2,y=4,h=u(function(g,v){var _={};if(g==null)return _;var d=!1;v=n(v,function(m){return m=e(m,g),d||(d=m.length>1),m}),a(g,s(g),_),d&&(_=t(_,o|l|y,i));for(var S=v.length;S--;)r(_,v[S]);return _});return Nr=h,Nr}var Vn=Nn();const $n=Lt(Vn);export{yt as a,En as b,kn as c,In as d,$n as o,Jr as r};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as s}from"./iframe-CQAwSt4E.js";import{c as _,g as p}from"./classname-CUR_zgkh.js";import{I as f}from"./icon-DdQsMyRa.js";import{T as u}from"./typography-DEpAJl_i.js";import{u as N}from"./index-BV0AJWP6.js";const e=p("option-item"),h=t=>{const{theme:o="brand",selected:x,defaultSelected:g,onChange:j,divider:l=!0,children:c,className:r,...i}=t,m=o||"brand",[a,n]=N(t,{valuePropName:"selected",defaultValuePropName:"defaultSelected",trigger:"onChange"});return s.jsxs("div",{...i,className:_(e,{[`${e}--${m}`]:!0,[`${e}--selected`]:a},r),onClick:d=>{t.onClick?.(d),n(!a)},children:[s.jsx("div",{className:`${e}__overlay`}),s.jsx(u,{size:"base",className:`${e}__content`,children:c}),!!a&&s.jsx(f,{name:"circle-check",size:16,type:"fill",className:`${e}__icon`}),l&&s.jsx("div",{className:`${e}__divider`})]})};h.__docgenInfo={description:"",methods:[],displayName:"OptionItem"};export{h as O};
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import{j as t}from"./iframe-CQAwSt4E.js";import{T as l,S as d,M as a,P as u,a as I}from"./blocks-BuaOUtiH.js";import{t as e}from"./store-D2RudmNr.js";import{O as o}from"./option-item-LRh_OyV4.js";import"./preload-helper-PPVm8Dsz.js";import"./index-DHiZ-gXR.js";import"./classname-CUR_zgkh.js";import"./icon-DdQsMyRa.js";import"./colors-_6nFGM3e.js";import"./typography-DEpAJl_i.js";import"./index-BV0AJWP6.js";import"./index-B-Ksafg0.js";const y=()=>{const c=`
|
|
2
|
+
## ${e("common.table.title")}
|
|
3
|
+
|
|
4
|
+
| ${e("common.table.name")} | ${e("common.table.type")} | ${e("common.table.required")} | ${e("common.table.description")} |
|
|
5
|
+
| :--- | :--- | :--- | :--- |
|
|
6
|
+
| \`theme\` | \`'brand' | 'neutral'\` | ${e("common.table.no")} | ${e("components.optionItem.themeDescription")} |
|
|
7
|
+
| \`selected\` | \`boolean\` | ${e("common.table.no")} | ${e("components.optionItem.selectedDescription")} |
|
|
8
|
+
| \`divider\` | \`boolean\` | ${e("common.table.no")} | ${e("components.optionItem.dividerDescription")} |
|
|
9
|
+
| \`className\` | \`string\` | ${e("common.table.no")} | ${e("components.optionItem.classNameDescription")} |
|
|
10
|
+
| \`...props\` | \`ComponentProps<'div'>\` | ${e("common.table.no")} | ${e("components.optionItem.propsDescription")} |
|
|
11
|
+
`;return t.jsxs(t.Fragment,{children:[t.jsx(l,{}),t.jsx(d,{}),t.jsx(a,{children:e("components.optionItem.description")}),t.jsx(u,{}),t.jsx(a,{children:c}),t.jsx(I,{})]})},T={title:"Components/OptionItem",component:o,parameters:{layout:"padded",docs:{page:y}},tags:["autodocs"],argTypes:{theme:{control:"select",options:["default","brand","neutral"],description:e("components.optionItem.argTypes.themeDescription"),table:{type:{summary:'"default" | "brand" | "neutral"'},defaultValue:{summary:"default"}}},selected:{control:"boolean",description:e("components.optionItem.argTypes.selectedDescription"),table:{type:{summary:"boolean"}}},divider:{control:"boolean",description:e("components.optionItem.argTypes.dividerDescription"),table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}},className:{control:"text",description:e("components.optionItem.argTypes.classNameDescription"),table:{type:{summary:"string"}}}}},n={storyName:e("components.optionItem.stories.default.storyName"),args:{children:e("components.optionItem.stories.default.text")}},s={storyName:e("components.optionItem.stories.selected.storyName"),args:{children:e("components.optionItem.stories.selected.text"),selected:!0}},r={storyName:e("components.optionItem.stories.themes.storyName"),render:()=>t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:[t.jsx(o,{theme:"brand",children:e("components.optionItem.stories.themes.brand")}),t.jsx(o,{theme:"neutral",children:e("components.optionItem.stories.themes.neutral")})]})},i={storyName:e("components.optionItem.stories.withoutDivider.storyName"),args:{children:e("components.optionItem.stories.withoutDivider.text"),divider:!1}},m={storyName:e("components.optionItem.stories.multipleOptions.storyName"),render:()=>t.jsxs("div",{style:{display:"flex",flexDirection:"column"},children:[t.jsx(o,{children:e("components.optionItem.stories.multipleOptions.option1")}),t.jsx(o,{defaultSelected:!0,children:e("components.optionItem.stories.multipleOptions.option2")}),t.jsx(o,{children:e("components.optionItem.stories.multipleOptions.option3")}),t.jsx(o,{children:e("components.optionItem.stories.multipleOptions.option4")})]})},p={storyName:e("components.optionItem.stories.interactive.storyName"),args:{children:e("components.optionItem.stories.interactive.text")}};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
|
|
12
|
+
storyName: t('components.optionItem.stories.default.storyName'),
|
|
13
|
+
args: {
|
|
14
|
+
children: t('components.optionItem.stories.default.text')
|
|
15
|
+
}
|
|
16
|
+
}`,...n.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
|
|
17
|
+
storyName: t('components.optionItem.stories.selected.storyName'),
|
|
18
|
+
args: {
|
|
19
|
+
children: t('components.optionItem.stories.selected.text'),
|
|
20
|
+
selected: true
|
|
21
|
+
}
|
|
22
|
+
}`,...s.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
|
|
23
|
+
storyName: t('components.optionItem.stories.themes.storyName'),
|
|
24
|
+
render: () => <div style={{
|
|
25
|
+
display: 'flex',
|
|
26
|
+
flexDirection: 'column',
|
|
27
|
+
gap: '8px'
|
|
28
|
+
}}>
|
|
29
|
+
<OptionItem theme="brand">
|
|
30
|
+
{t('components.optionItem.stories.themes.brand')}
|
|
31
|
+
</OptionItem>
|
|
32
|
+
<OptionItem theme="neutral">
|
|
33
|
+
{t('components.optionItem.stories.themes.neutral')}
|
|
34
|
+
</OptionItem>
|
|
35
|
+
</div>
|
|
36
|
+
}`,...r.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
|
|
37
|
+
storyName: t('components.optionItem.stories.withoutDivider.storyName'),
|
|
38
|
+
args: {
|
|
39
|
+
children: t('components.optionItem.stories.withoutDivider.text'),
|
|
40
|
+
divider: false
|
|
41
|
+
}
|
|
42
|
+
}`,...i.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
43
|
+
storyName: t('components.optionItem.stories.multipleOptions.storyName'),
|
|
44
|
+
render: () => <div style={{
|
|
45
|
+
display: 'flex',
|
|
46
|
+
flexDirection: 'column'
|
|
47
|
+
}}>
|
|
48
|
+
<OptionItem>
|
|
49
|
+
{t('components.optionItem.stories.multipleOptions.option1')}
|
|
50
|
+
</OptionItem>
|
|
51
|
+
<OptionItem defaultSelected>
|
|
52
|
+
{t('components.optionItem.stories.multipleOptions.option2')}
|
|
53
|
+
</OptionItem>
|
|
54
|
+
<OptionItem>
|
|
55
|
+
{t('components.optionItem.stories.multipleOptions.option3')}
|
|
56
|
+
</OptionItem>
|
|
57
|
+
<OptionItem>
|
|
58
|
+
{t('components.optionItem.stories.multipleOptions.option4')}
|
|
59
|
+
</OptionItem>
|
|
60
|
+
</div>
|
|
61
|
+
}`,...m.parameters?.docs?.source}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
62
|
+
storyName: t('components.optionItem.stories.interactive.storyName'),
|
|
63
|
+
args: {
|
|
64
|
+
children: t('components.optionItem.stories.interactive.text')
|
|
65
|
+
}
|
|
66
|
+
}`,...p.parameters?.docs?.source}}};const w=["Default","Selected","Themes","WithoutDivider","MultipleOptions","Interactive"];export{n as Default,p as Interactive,m as MultipleOptions,s as Selected,r as Themes,i as WithoutDivider,w as __namedExportsOrder,T as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as i}from"./iframe-CQAwSt4E.js";import{c as e,g as r}from"./classname-CUR_zgkh.js";const a=r("pagination"),c=({total:t,activeIndex:m,className:o,...n})=>i.jsx("div",{className:e(a,o),...n,children:new Array(t).fill(0).map((l,s)=>i.jsx("div",{className:e(`${a}__item`,{[`${a}__item--active`]:s===m})},s))});c.__docgenInfo={description:"",methods:[],displayName:"Pagination"};export{c as P};
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import{j as e,r as d}from"./iframe-CQAwSt4E.js";import{T as x,S as g,M as p,P as v,a as y}from"./blocks-BuaOUtiH.js";import{t}from"./store-D2RudmNr.js";import{P as o}from"./pagination-DZHoBs_4.js";import{B as l}from"./button-CL7GeC23.js";import"./preload-helper-PPVm8Dsz.js";import"./index-DHiZ-gXR.js";import"./classname-CUR_zgkh.js";import"./icon-DdQsMyRa.js";import"./colors-_6nFGM3e.js";import"./typography-DEpAJl_i.js";const u=()=>{const n=`
|
|
2
|
+
## ${t("common.table.title")}
|
|
3
|
+
|
|
4
|
+
| ${t("common.table.name")} | ${t("common.table.type")} | ${t("common.table.required")} | ${t("common.table.description")} |
|
|
5
|
+
| :--- | :--- | :--- | :--- |
|
|
6
|
+
| \`total\` | \`number\` | ${t("common.table.yes")} | ${t("components.pagination.totalDescription")} |
|
|
7
|
+
| \`activeIndex\` | \`number\` | ${t("common.table.yes")} | ${t("components.pagination.activeIndexDescription")} |
|
|
8
|
+
| \`className\` | \`string\` | ${t("common.table.no")} | ${t("components.pagination.classNameDescription")} |
|
|
9
|
+
| \`...props\` | \`ComponentProps<'div'>\` | ${t("common.table.no")} | ${t("components.pagination.propsDescription")} |
|
|
10
|
+
`;return e.jsxs(e.Fragment,{children:[e.jsx(x,{}),e.jsx(g,{}),e.jsx(p,{children:t("components.pagination.description")}),e.jsx(v,{}),e.jsx(p,{children:n}),e.jsx(y,{})]})},S={title:"Components/Pagination",component:o,parameters:{layout:"padded",docs:{page:u}},tags:["autodocs"],argTypes:{total:{control:{type:"number",min:1,max:10,step:1},description:t("components.pagination.argTypes.totalDescription"),table:{type:{summary:"number"}}},activeIndex:{control:{type:"number",min:0,max:9,step:1},description:t("components.pagination.argTypes.activeIndexDescription"),table:{type:{summary:"number"}}},className:{control:"text",description:t("components.pagination.argTypes.classNameDescription"),table:{type:{summary:"string"}}}}},a={storyName:t("components.pagination.stories.default.storyName"),args:{total:5,activeIndex:2}},s={storyName:t("components.pagination.stories.differentTotals.storyName"),render:()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"24px"},children:[e.jsxs("div",{children:[e.jsx("h3",{style:{marginBottom:"12px"},children:t("components.pagination.stories.differentTotals.threeItems")}),e.jsx(o,{total:3,activeIndex:1})]}),e.jsxs("div",{children:[e.jsx("h3",{style:{marginBottom:"12px"},children:t("components.pagination.stories.differentTotals.fiveItems")}),e.jsx(o,{total:5,activeIndex:2})]}),e.jsxs("div",{children:[e.jsx("h3",{style:{marginBottom:"12px"},children:t("components.pagination.stories.differentTotals.eightItems")}),e.jsx(o,{total:8,activeIndex:3})]})]})},i={storyName:t("components.pagination.stories.interactive.storyName"),render:()=>{const[n,c]=d.useState(0);return e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[e.jsx("div",{children:e.jsx(o,{total:5,activeIndex:n})}),e.jsxs("div",{style:{display:"flex",gap:"8px"},children:[e.jsx(l,{theme:"neutral",onClick:()=>c(Math.max(0,n-1)),children:t("components.pagination.stories.interactive.previous")}),e.jsx(l,{theme:"neutral",onClick:()=>c(Math.min(4,n+1)),children:t("components.pagination.stories.interactive.next")})]}),e.jsxs("p",{children:[t("components.pagination.stories.interactive.activeIndex"),":"," ",n]})]})}},r={storyName:t("components.pagination.stories.firstPage.storyName"),name:t("components.pagination.stories.firstPage.name"),args:{total:5,activeIndex:0}},m={storyName:t("components.pagination.stories.lastPage.storyName"),name:t("components.pagination.stories.lastPage.name"),args:{total:5,activeIndex:4}};a.parameters={...a.parameters,docs:{...a.parameters?.docs,source:{originalSource:`{
|
|
11
|
+
storyName: t('components.pagination.stories.default.storyName'),
|
|
12
|
+
args: {
|
|
13
|
+
total: 5,
|
|
14
|
+
activeIndex: 2
|
|
15
|
+
}
|
|
16
|
+
}`,...a.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
|
|
17
|
+
storyName: t('components.pagination.stories.differentTotals.storyName'),
|
|
18
|
+
render: () => <div style={{
|
|
19
|
+
display: 'flex',
|
|
20
|
+
flexDirection: 'column',
|
|
21
|
+
gap: '24px'
|
|
22
|
+
}}>
|
|
23
|
+
<div>
|
|
24
|
+
<h3 style={{
|
|
25
|
+
marginBottom: '12px'
|
|
26
|
+
}}>
|
|
27
|
+
{t('components.pagination.stories.differentTotals.threeItems')}
|
|
28
|
+
</h3>
|
|
29
|
+
<Pagination total={3} activeIndex={1} />
|
|
30
|
+
</div>
|
|
31
|
+
<div>
|
|
32
|
+
<h3 style={{
|
|
33
|
+
marginBottom: '12px'
|
|
34
|
+
}}>
|
|
35
|
+
{t('components.pagination.stories.differentTotals.fiveItems')}
|
|
36
|
+
</h3>
|
|
37
|
+
<Pagination total={5} activeIndex={2} />
|
|
38
|
+
</div>
|
|
39
|
+
<div>
|
|
40
|
+
<h3 style={{
|
|
41
|
+
marginBottom: '12px'
|
|
42
|
+
}}>
|
|
43
|
+
{t('components.pagination.stories.differentTotals.eightItems')}
|
|
44
|
+
</h3>
|
|
45
|
+
<Pagination total={8} activeIndex={3} />
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
}`,...s.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
|
|
49
|
+
storyName: t('components.pagination.stories.interactive.storyName'),
|
|
50
|
+
render: () => {
|
|
51
|
+
const [activeIndex, setActiveIndex] = useState(0);
|
|
52
|
+
return <div style={{
|
|
53
|
+
display: 'flex',
|
|
54
|
+
flexDirection: 'column',
|
|
55
|
+
gap: '16px'
|
|
56
|
+
}}>
|
|
57
|
+
<div>
|
|
58
|
+
<Pagination total={5} activeIndex={activeIndex} />
|
|
59
|
+
</div>
|
|
60
|
+
<div style={{
|
|
61
|
+
display: 'flex',
|
|
62
|
+
gap: '8px'
|
|
63
|
+
}}>
|
|
64
|
+
<Button theme="neutral" onClick={() => setActiveIndex(Math.max(0, activeIndex - 1))}>
|
|
65
|
+
{t('components.pagination.stories.interactive.previous')}
|
|
66
|
+
</Button>
|
|
67
|
+
<Button theme="neutral" onClick={() => setActiveIndex(Math.min(4, activeIndex + 1))}>
|
|
68
|
+
{t('components.pagination.stories.interactive.next')}
|
|
69
|
+
</Button>
|
|
70
|
+
</div>
|
|
71
|
+
<p>
|
|
72
|
+
{t('components.pagination.stories.interactive.activeIndex')}:{' '}
|
|
73
|
+
{activeIndex}
|
|
74
|
+
</p>
|
|
75
|
+
</div>;
|
|
76
|
+
}
|
|
77
|
+
}`,...i.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
|
|
78
|
+
storyName: t('components.pagination.stories.firstPage.storyName'),
|
|
79
|
+
name: t('components.pagination.stories.firstPage.name'),
|
|
80
|
+
args: {
|
|
81
|
+
total: 5,
|
|
82
|
+
activeIndex: 0
|
|
83
|
+
}
|
|
84
|
+
}`,...r.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
85
|
+
storyName: t('components.pagination.stories.lastPage.storyName'),
|
|
86
|
+
name: t('components.pagination.stories.lastPage.name'),
|
|
87
|
+
args: {
|
|
88
|
+
total: 5,
|
|
89
|
+
activeIndex: 4
|
|
90
|
+
}
|
|
91
|
+
}`,...m.parameters?.docs?.source}}};const C=["Default","DifferentTotals","Interactive","FirstPage","LastPage"];export{a as Default,s as DifferentTotals,r as FirstPage,i as Interactive,m as LastPage,C as __namedExportsOrder,S as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{g as G}from"./iframe-CQAwSt4E.js";import{r as m,a as O,b as L,c as C}from"./omit-Bsx5nTI0.js";import{r as D,a as F,b as E,c as w,d as J,e as M}from"./_setToString-CbM921C9.js";var I,H;function N(){if(H)return I;H=1;var n=D(),a=m(),i=E(),e=F(),s=O();function h(u,r,_,l){if(!e(u))return u;r=a(r,u);for(var t=-1,f=r.length,q=f-1,v=u;v!=null&&++t<f;){var c=s(r[t]),P=_;if(c==="__proto__"||c==="constructor"||c==="prototype")return u;if(t!=q){var d=v[c];P=l?l(d,c,v):void 0,P===void 0&&(P=e(d)?d:i(r[t+1])?[]:{})}n(v,c,P),v=v[c]}return u}return I=h,I}var g,B;function Q(){if(B)return g;B=1;var n=L(),a=N(),i=m();function e(s,h,u){for(var r=-1,_=h.length,l={};++r<_;){var t=h[r],f=n(s,t);u(f,t)&&a(l,i(t,s),f)}return l}return g=e,g}var o,S;function T(){if(S)return o;S=1;function n(a,i){return a!=null&&i in Object(a)}return o=n,o}var x,p;function U(){if(p)return x;p=1;var n=m(),a=w(),i=J(),e=E(),s=M(),h=O();function u(r,_,l){_=n(_,r);for(var t=-1,f=_.length,q=!1;++t<f;){var v=h(_[t]);if(!(q=r!=null&&l(r,v)))break;r=r[v]}return q||++t!=f?q:(f=r==null?0:r.length,!!f&&s(f)&&e(v,f)&&(i(r)||a(r)))}return x=u,x}var k,A;function W(){if(A)return k;A=1;var n=T(),a=U();function i(e,s){return e!=null&&a(e,s,n)}return k=i,k}var R,y;function X(){if(y)return R;y=1;var n=Q(),a=W();function i(e,s){return n(e,s,function(h,u){return a(e,u)})}return R=i,R}var b,K;function Y(){if(K)return b;K=1;var n=X(),a=C(),i=a(function(e,s){return e==null?{}:n(e,s)});return b=i,b}var Z=Y();const j=G(Z);export{j as p};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const p="modulepreload",y=function(u,i){return new URL(u,i).href},v={},w=function(i,a,f){let d=Promise.resolve();if(a&&a.length>0){let E=function(e){return Promise.all(e.map(o=>Promise.resolve(o).then(s=>({status:"fulfilled",value:s}),s=>({status:"rejected",reason:s}))))};const r=document.getElementsByTagName("link"),t=document.querySelector("meta[property=csp-nonce]"),m=t?.nonce||t?.getAttribute("nonce");d=E(a.map(e=>{if(e=y(e,f),e in v)return;v[e]=!0;const o=e.endsWith(".css"),s=o?'[rel="stylesheet"]':"";if(f)for(let c=r.length-1;c>=0;c--){const l=r[c];if(l.href===e&&(!o||l.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${e}"]${s}`))return;const n=document.createElement("link");if(n.rel=o?"stylesheet":p,o||(n.as="script"),n.crossOrigin="",n.href=e,m&&n.setAttribute("nonce",m),document.head.appendChild(n),o)return new Promise((c,l)=>{n.addEventListener("load",c),n.addEventListener("error",()=>l(new Error(`Unable to preload CSS for ${e}`)))})}))}function h(r){const t=new Event("vite:preloadError",{cancelable:!0});if(t.payload=r,window.dispatchEvent(t),!t.defaultPrevented)throw r}return d.then(r=>{for(const t of r||[])t.status==="rejected"&&h(t.reason);return i().catch(h)})};export{w as _};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as n,j as s}from"./iframe-CQAwSt4E.js";import{c as N,g as k}from"./classname-CUR_zgkh.js";import{u as C}from"./index-BV0AJWP6.js";import{T as $}from"./typography-DEpAJl_i.js";const e=k("radio"),j=n.forwardRef((o,d)=>{const{theme:m="brand",type:i="radio",className:f,style:p,onChange:y,checked:R,defaultChecked:v,disabled:c,children:h,typography:_,...b}=o,t=m||"brand",r=n.useRef(null),[g,l]=n.useState(!1),[u,x]=C(o,{trigger:"onChange",defaultValuePropName:"defaultChecked",valuePropName:"checked"});return n.useImperativeHandle(d,()=>({focus:()=>r.current?.focus?.(),blur:()=>r.current?.blur?.()})),s.jsxs("label",{className:N(e,{[`${e}--${t}`]:t,[`${e}--checked`]:u,[`${e}--focus`]:g,[`${e}--disabled`]:c},f),style:p,children:[s.jsxs("span",{className:`${e}__button`,children:[s.jsx("span",{className:`${e}__overlay`}),s.jsx("span",{className:`${e}__icon`}),s.jsx("input",{...b,type:i,checked:u,disabled:c,onChange:a=>x(a.target.checked),ref:r,className:`${e}__input`,onFocus:a=>{l(!0),o.onFocus?.(a)},onBlur:a=>{l(!1),o.onBlur?.(a)}})]}),s.jsx($,{size:"base",..._,component:"span",children:h})]})});j.__docgenInfo={description:"",methods:[{name:"focus",docblock:null,modifiers:[],params:[],returns:null},{name:"blur",docblock:null,modifiers:[],params:[],returns:null}],displayName:"Radio"};export{j as R};
|