@janbox/storefront-ui 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +4 -0
- package/dist/hooks/use-controllable-state.js +2 -2
- package/dist/hooks/use-countdown-timer.js +1 -1
- package/dist/hooks/use-first-mount-state/index.d.ts +2 -0
- package/dist/hooks/use-first-mount-state/index.d.ts.map +1 -0
- package/dist/hooks/use-first-mount-state/index.js +12 -0
- package/dist/hooks/use-update-effect/index.d.ts +3 -0
- package/dist/hooks/use-update-effect/index.d.ts.map +1 -0
- package/dist/hooks/use-update-effect/index.js +13 -0
- package/dist/lib/accordion/accordion/accordion.d.ts +2 -1
- package/dist/lib/accordion/accordion/accordion.d.ts.map +1 -1
- package/dist/lib/accordion/accordion/accordion.js +15 -6
- package/dist/lib/accordion/accordion/types.d.ts +2 -2
- package/dist/lib/accordion/accordion/types.d.ts.map +1 -1
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/misc/isDeepEqual.js +5 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useCustomCompareEffect.js +25 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useDeepCompareEffect.js +19 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useFirstMountState.js +12 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useUpdateEffect.js +13 -0
- package/package.json +19 -50
- package/dist/HOCs/index.cjs +0 -4
- package/dist/HOCs/with-query-fallback.cjs +0 -16
- package/dist/assets/json/countries.json.cjs +0 -1159
- package/dist/assets/svg/arrow-down.svg.cjs +0 -3
- package/dist/assets/svg/arrow-forward.svg.cjs +0 -3
- package/dist/assets/svg/arrow-left.svg.cjs +0 -3
- package/dist/assets/svg/arrow-right.svg.cjs +0 -3
- package/dist/assets/svg/calendar.svg.cjs +0 -3
- package/dist/assets/svg/check.svg.cjs +0 -3
- package/dist/assets/svg/clock-time.svg.cjs +0 -3
- package/dist/assets/svg/done-check.svg.cjs +0 -3
- package/dist/assets/svg/earth-home-world.svg.cjs +0 -3
- package/dist/assets/svg/eye-hidden.svg.cjs +0 -3
- package/dist/assets/svg/eye-show-visible.svg.cjs +0 -3
- package/dist/assets/svg/image-placeholder.svg.cjs +0 -3
- package/dist/assets/svg/loading-waiting.svg.cjs +0 -3
- package/dist/assets/svg/long-arrow-right.svg.cjs +0 -3
- package/dist/assets/svg/minus.svg.cjs +0 -3
- package/dist/assets/svg/plus.svg.cjs +0 -3
- package/dist/assets/svg/search-add-plus-middle.svg.cjs +0 -3
- package/dist/assets/svg/search-minus.svg.cjs +0 -3
- package/dist/assets/svg/times-close-delete.svg.cjs +0 -3
- package/dist/components/index.cjs +0 -8
- package/dist/components/scroll-view.cjs +0 -19
- package/dist/components/svg-loader.cjs +0 -14
- package/dist/components/virtualized-list.cjs +0 -43
- package/dist/constants/index.cjs +0 -32
- package/dist/hooks/index.cjs +0 -14
- package/dist/hooks/use-controllable-state.cjs +0 -39
- package/dist/hooks/use-countdown-timer.cjs +0 -85
- package/dist/hooks/use-hover-line-effect/index.cjs +0 -24
- package/dist/hooks/use-hover-line-effect/use-hover-line-effect.module.scss.cjs +0 -8
- package/dist/hooks/use-query-params.cjs +0 -53
- package/dist/hooks/use-ripple-effect/index.cjs +0 -69
- package/dist/hooks/use-ripple-effect/use-ripple-effect.module.scss.cjs +0 -11
- package/dist/hooks/use-window-screen/index.cjs +0 -52
- package/dist/index.cjs +0 -305
- package/dist/lib/accordion/accordion/accordion.cjs +0 -109
- package/dist/lib/accordion/accordion/helpers.cjs +0 -21
- package/dist/lib/accordion/accordion/types.cjs +0 -7
- package/dist/lib/accordion/accordion-content/accordion-content.cjs +0 -41
- package/dist/lib/accordion/accordion-content/helpers.cjs +0 -8
- package/dist/lib/accordion/accordion-group/accordion-group.cjs +0 -56
- package/dist/lib/accordion/accordion-group/helpers.cjs +0 -20
- package/dist/lib/accordion/accordion-group/types.cjs +0 -7
- package/dist/lib/accordion/accordion-summary/accordion-summary.cjs +0 -64
- package/dist/lib/accordion/accordion-summary/helpers.cjs +0 -15
- package/dist/lib/accordion/accordion-summary/types.cjs +0 -8
- package/dist/lib/badge/badge.cjs +0 -42
- package/dist/lib/badge/helpers.cjs +0 -8
- package/dist/lib/box/box.cjs +0 -55
- package/dist/lib/box/helpers.cjs +0 -8
- package/dist/lib/breadcrumbs/breadcrumb-item/breadcrumb-item.cjs +0 -28
- package/dist/lib/breadcrumbs/breadcrumbs/breadcrumbs.cjs +0 -44
- package/dist/lib/button/button.cjs +0 -235
- package/dist/lib/button/helpers.cjs +0 -74
- package/dist/lib/cascader/cascader.cjs +0 -497
- package/dist/lib/cascader/helpers.cjs +0 -28
- package/dist/lib/checkbox/checkbox.cjs +0 -52
- package/dist/lib/checkbox/checkbox.module.scss.cjs +0 -23
- package/dist/lib/chip/chip.cjs +0 -60
- package/dist/lib/chip/helpers.cjs +0 -14
- package/dist/lib/collapse/collapse.cjs +0 -50
- package/dist/lib/container/container.cjs +0 -101
- package/dist/lib/container/helpers.cjs +0 -12
- package/dist/lib/count-up/count-up.cjs +0 -38
- package/dist/lib/countdown-timer/countdown-timer.cjs +0 -9
- package/dist/lib/date-picker/date-picker.cjs +0 -168
- package/dist/lib/date-picker/helpers.cjs +0 -12
- package/dist/lib/dialog/dialog/dialog.cjs +0 -93
- package/dist/lib/dialog/dialog/helpers.cjs +0 -27
- package/dist/lib/dialog/dialog-body/dialog-body.cjs +0 -32
- package/dist/lib/dialog/dialog-close/dialog-close.cjs +0 -5
- package/dist/lib/dialog/dialog-footer/dialog-footer.cjs +0 -31
- package/dist/lib/dialog/dialog-header/dialog-header.cjs +0 -73
- package/dist/lib/drawer/drawer/drawer.cjs +0 -100
- package/dist/lib/drawer/drawer/helpers.cjs +0 -7
- package/dist/lib/drawer/drawer-close/drawer-close.cjs +0 -5
- package/dist/lib/filter-panel/checkbox-filter-panel.cjs +0 -107
- package/dist/lib/filter-panel/filter-panel.cjs +0 -37
- package/dist/lib/filter-panel/input-range-filter-panel.cjs +0 -78
- package/dist/lib/filter-panel/input-text-filter-panel.cjs +0 -57
- package/dist/lib/filter-panel/radio-filter-panel.cjs +0 -95
- package/dist/lib/flag/flag.cjs +0 -20
- package/dist/lib/flag/helpers.cjs +0 -16
- package/dist/lib/flexbox/flex-item/flex-item.cjs +0 -22
- package/dist/lib/flexbox/flex-item/helpers.cjs +0 -10
- package/dist/lib/flexbox/flexbox/flexbox.cjs +0 -46
- package/dist/lib/flexbox/flexbox/helpers.cjs +0 -16
- package/dist/lib/floating/floating/floating.cjs +0 -97
- package/dist/lib/floating/floating/helpers.cjs +0 -9
- package/dist/lib/floating/floating-close/floating-close.cjs +0 -32
- package/dist/lib/floating/floating-content/floating-content.cjs +0 -57
- package/dist/lib/floating/floating-trigger/floating-trigger.cjs +0 -35
- package/dist/lib/form-helper-text/form-helper-text.cjs +0 -35
- package/dist/lib/form-label/form-label.cjs +0 -28
- package/dist/lib/generic-element/generic-element.cjs +0 -15
- package/dist/lib/grid/cell/cell.cjs +0 -28
- package/dist/lib/grid/cell/helpers.cjs +0 -8
- package/dist/lib/grid/grid/grid.cjs +0 -53
- package/dist/lib/grid/grid/helpers.cjs +0 -12
- package/dist/lib/highlight-words/highlight-words.cjs +0 -18
- package/dist/lib/icon/helpers.cjs +0 -12
- package/dist/lib/icon/icon.cjs +0 -38
- package/dist/lib/icon-button/helpers.cjs +0 -42
- package/dist/lib/icon-button/icon-button.cjs +0 -146
- package/dist/lib/image/helpers.cjs +0 -15
- package/dist/lib/image/image.cjs +0 -36
- package/dist/lib/input/helpers.cjs +0 -38
- package/dist/lib/input/input.cjs +0 -205
- package/dist/lib/input/input.module.scss.cjs +0 -17
- package/dist/lib/input-mask/helpers.cjs +0 -12
- package/dist/lib/input-mask/input-mask.cjs +0 -120
- package/dist/lib/input-number/input-number.cjs +0 -132
- package/dist/lib/input-number/input-number.module.scss.cjs +0 -8
- package/dist/lib/input-range/helpers.cjs +0 -12
- package/dist/lib/input-range/input-range.cjs +0 -179
- package/dist/lib/input-range/input-range.module.scss.cjs +0 -8
- package/dist/lib/lightbox/lightbox.cjs +0 -199
- package/dist/lib/linear-progress/helpers.cjs +0 -13
- package/dist/lib/linear-progress/linear-progress.cjs +0 -75
- package/dist/lib/link/helpers.cjs +0 -8
- package/dist/lib/link/link.cjs +0 -63
- package/dist/lib/loading/block-skeleton/block-skeleton.cjs +0 -21
- package/dist/lib/loading/image-skeleton/image-skeleton.cjs +0 -43
- package/dist/lib/loading/loading-overlay/loading-overlay.cjs +0 -60
- package/dist/lib/loading/text-skeleton/text-skeleton.cjs +0 -16
- package/dist/lib/marquee/marquee/helpers.cjs +0 -15
- package/dist/lib/marquee/marquee/marquee.cjs +0 -99
- package/dist/lib/marquee/marquee/types.cjs +0 -7
- package/dist/lib/marquee/marquee-item/marquee-item.cjs +0 -16
- package/dist/lib/menu/menu/menu.cjs +0 -38
- package/dist/lib/menu/menu-item/helpers.cjs +0 -16
- package/dist/lib/menu/menu-item/menu-item.cjs +0 -34
- package/dist/lib/menu/menu-list/menu-list.cjs +0 -34
- package/dist/lib/menu/menu-list/types.cjs +0 -7
- package/dist/lib/menu/menu-trigger/menu-trigger.cjs +0 -8
- package/dist/lib/multiple-select/helpers.cjs +0 -12
- package/dist/lib/multiple-select/multiple-select.cjs +0 -348
- package/dist/lib/nav-link/nav-link.cjs +0 -40
- package/dist/lib/notifications/helpers.cjs +0 -39
- package/dist/lib/notifications/notifications.cjs +0 -167
- package/dist/lib/otp-input/otp-input.cjs +0 -132
- package/dist/lib/pagination/helpers.cjs +0 -57
- package/dist/lib/pagination/pagination.cjs +0 -163
- package/dist/lib/phone-input/phone-input.cjs +0 -182
- package/dist/lib/popover/popover/helpers.cjs +0 -7
- package/dist/lib/popover/popover/popover.cjs +0 -31
- package/dist/lib/popover/popover-close/popover-close.cjs +0 -5
- package/dist/lib/popover/popover-content/popover-content.cjs +0 -29
- package/dist/lib/popover/popover-trigger/popover-trigger.cjs +0 -8
- package/dist/lib/primitive/primitive.cjs +0 -30
- package/dist/lib/progress/progress.cjs +0 -50
- package/dist/lib/radio-button/helpers.cjs +0 -8
- package/dist/lib/radio-button/radio-button.cjs +0 -33
- package/dist/lib/radio-button/radio-button.module.scss.cjs +0 -17
- package/dist/lib/select/helpers.cjs +0 -12
- package/dist/lib/select/select.cjs +0 -317
- package/dist/lib/star-rating/star-rating.cjs +0 -39
- package/dist/lib/stepper/step.cjs +0 -69
- package/dist/lib/stepper/stepper.cjs +0 -86
- package/dist/lib/stepper/types.cjs +0 -8
- package/dist/lib/swiper/swiper/helpers.cjs +0 -16
- package/dist/lib/swiper/swiper/swiper.cjs +0 -113
- package/dist/lib/swiper/swiper-dots-paging/swiper-dots-paging.cjs +0 -77
- package/dist/lib/swiper/swiper-slide/swiper-slide.cjs +0 -31
- package/dist/lib/switch/switch.cjs +0 -19
- package/dist/lib/switch/switch.module.scss.cjs +0 -14
- package/dist/lib/table/table/table.cjs +0 -26
- package/dist/lib/table/table-body/table-body.cjs +0 -34
- package/dist/lib/table/table-cell/table-cell.cjs +0 -12
- package/dist/lib/table/table-footer/table-footer.cjs +0 -7
- package/dist/lib/table/table-head/table-head.cjs +0 -33
- package/dist/lib/table/table-row/table-row.cjs +0 -7
- package/dist/lib/tabs/tab/helpers.cjs +0 -9
- package/dist/lib/tabs/tab/tab.cjs +0 -26
- package/dist/lib/tabs/tab-content/tab-content.cjs +0 -22
- package/dist/lib/tabs/tab-indicator/tab-indicator.cjs +0 -92
- package/dist/lib/tabs/tab-list/helpers.cjs +0 -8
- package/dist/lib/tabs/tab-list/tab-list.cjs +0 -40
- package/dist/lib/tabs/tab-panel/helpers.cjs +0 -8
- package/dist/lib/tabs/tab-panel/tab-panel.cjs +0 -21
- package/dist/lib/tabs/tabs/helpers.cjs +0 -36
- package/dist/lib/tabs/tabs/tabs.cjs +0 -62
- package/dist/lib/text/helpers.cjs +0 -140
- package/dist/lib/text/text.cjs +0 -41
- package/dist/lib/textarea/helpers.cjs +0 -12
- package/dist/lib/textarea/textarea.cjs +0 -122
- package/dist/lib/textarea/textarea.module.scss.cjs +0 -14
- package/dist/lib/time-picker/time-picker.cjs +0 -305
- package/dist/lib/tooltip/tooltip.cjs +0 -124
- package/dist/lib/trans-html/trans-html.cjs +0 -26
- package/dist/lib/unordered-list/list-item/helpers.cjs +0 -14
- package/dist/lib/unordered-list/list-item/list-item.cjs +0 -36
- package/dist/lib/unordered-list/unordered-list/helpers.cjs +0 -14
- package/dist/lib/unordered-list/unordered-list/unordered-list.cjs +0 -27
- package/dist/lib/video/helpers.cjs +0 -10
- package/dist/lib/video/video.cjs +0 -24
- package/dist/theme/index.cjs +0 -22
- package/dist/theme/palette.cjs +0 -287
- package/dist/theme/provider.cjs +0 -303
- package/dist/theme/screens.cjs +0 -24
- package/dist/theme/typography.cjs +0 -29
- package/dist/types/index.cjs +0 -1
- package/dist/utils/common.cjs +0 -139
- package/dist/utils/emotion-helpers.cjs +0 -145
- package/dist/utils/index.cjs +0 -233
- package/dist/utils/query-params.cjs +0 -130
- package/dist/utils/stylesheet.cjs +0 -5
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const react$1 = require("@floating-ui/react");
|
|
6
|
-
const Autoplay = require("embla-carousel-autoplay");
|
|
7
|
-
const useEmblaCarousel = require("embla-carousel-react");
|
|
8
|
-
const emblaCarouselWheelGestures = require("embla-carousel-wheel-gestures");
|
|
9
|
-
const lodashEs = require("lodash-es");
|
|
10
|
-
const helpers = require("./helpers.cjs");
|
|
11
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
12
|
-
const theme_screens = require("../../../theme/screens.cjs");
|
|
13
|
-
require("../../../theme/palette.cjs");
|
|
14
|
-
const swiperDotsPaging = require("../swiper-dots-paging/swiper-dots-paging.cjs");
|
|
15
|
-
const swiperSlide = require("../swiper-slide/swiper-slide.cjs");
|
|
16
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
17
|
-
const SWIPER_SLIDE_GAP_VAR_NAME = "--slice-gap";
|
|
18
|
-
const SWIPER_SLIDE_GAP_VAR = `var(${SWIPER_SLIDE_GAP_VAR_NAME}, 0px)`;
|
|
19
|
-
const Swiper = ({ children, onApi, ref, ..._props }) => {
|
|
20
|
-
var _a, _b, _c, _d;
|
|
21
|
-
const { xs, sm, md, lg, autoplayOptions, options, className, paging, ...rest } = helpers.getSwiperProps(_props);
|
|
22
|
-
const [emblaRef, emblaApi] = useEmblaCarousel(
|
|
23
|
-
{
|
|
24
|
-
align: "start",
|
|
25
|
-
...options
|
|
26
|
-
},
|
|
27
|
-
[Autoplay(autoplayOptions), emblaCarouselWheelGestures.WheelGesturesPlugin()]
|
|
28
|
-
);
|
|
29
|
-
react.useEffect(() => {
|
|
30
|
-
emblaApi && (onApi == null ? void 0 : onApi(emblaApi));
|
|
31
|
-
}, [emblaApi]);
|
|
32
|
-
const mergedRefs = react$1.useMergeRefs([emblaRef, ref]);
|
|
33
|
-
const css = [
|
|
34
|
-
{
|
|
35
|
-
position: "relative",
|
|
36
|
-
overflow: "hidden",
|
|
37
|
-
maxHeight: "100%",
|
|
38
|
-
maxWidth: "100%"
|
|
39
|
-
},
|
|
40
|
-
(options == null ? void 0 : options.axis) === "y" && { height: "100%" },
|
|
41
|
-
createStyle(xs),
|
|
42
|
-
{
|
|
43
|
-
[theme_screens.mediaQuery("sm")]: createStyle(sm),
|
|
44
|
-
[theme_screens.mediaQuery("md")]: createStyle(md),
|
|
45
|
-
[theme_screens.mediaQuery("lg")]: createStyle(lg)
|
|
46
|
-
}
|
|
47
|
-
];
|
|
48
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
49
|
-
"div",
|
|
50
|
-
{
|
|
51
|
-
css,
|
|
52
|
-
className: stylesheet.cn(
|
|
53
|
-
swiperClasses.root,
|
|
54
|
-
className
|
|
55
|
-
),
|
|
56
|
-
...rest,
|
|
57
|
-
ref: mergedRefs,
|
|
58
|
-
children: [
|
|
59
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
60
|
-
"div",
|
|
61
|
-
{
|
|
62
|
-
css: {
|
|
63
|
-
display: "flex",
|
|
64
|
-
alignItems: "stretch",
|
|
65
|
-
height: "100%",
|
|
66
|
-
...(options == null ? void 0 : options.axis) === "y" ? { height: "100%", flexDirection: "column" } : {}
|
|
67
|
-
},
|
|
68
|
-
className: swiperClasses.list,
|
|
69
|
-
children
|
|
70
|
-
}
|
|
71
|
-
),
|
|
72
|
-
/* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { fallback: null, children: (paging == null ? void 0 : paging.type) === "dots" && /* @__PURE__ */ jsxRuntime.jsx(
|
|
73
|
-
"div",
|
|
74
|
-
{
|
|
75
|
-
css: {
|
|
76
|
-
position: "absolute",
|
|
77
|
-
left: 0,
|
|
78
|
-
right: 0,
|
|
79
|
-
display: "flex",
|
|
80
|
-
justifyContent: "center",
|
|
81
|
-
bottom: 0,
|
|
82
|
-
...(_a = paging.xs) == null ? void 0 : _a.css,
|
|
83
|
-
[theme_screens.mediaQuery("sm")]: (_b = paging.sm) == null ? void 0 : _b.css,
|
|
84
|
-
[theme_screens.mediaQuery("md")]: (_c = paging.md) == null ? void 0 : _c.css,
|
|
85
|
-
[theme_screens.mediaQuery("lg")]: (_d = paging.lg) == null ? void 0 : _d.css
|
|
86
|
-
},
|
|
87
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(swiperDotsPaging.SwiperDotsPaging, { api: emblaApi, ...paging.options })
|
|
88
|
-
}
|
|
89
|
-
) })
|
|
90
|
-
]
|
|
91
|
-
}
|
|
92
|
-
);
|
|
93
|
-
};
|
|
94
|
-
const createStyle = ({ slidesPerView, css, spaceBetween } = {}) => {
|
|
95
|
-
return [
|
|
96
|
-
{
|
|
97
|
-
[`& > .${swiperClasses.list}`]: {
|
|
98
|
-
[SWIPER_SLIDE_GAP_VAR_NAME]: lodashEs.isNumber(spaceBetween) ? `${spaceBetween}px` : void 0,
|
|
99
|
-
gap: SWIPER_SLIDE_GAP_VAR,
|
|
100
|
-
[`& > .${swiperSlide.swiperSlideClasses.root}`]: {
|
|
101
|
-
flexBasis: lodashEs.isNumber(slidesPerView) ? `calc((100% - (${SWIPER_SLIDE_GAP_VAR} * ${slidesPerView - 1})) / ${slidesPerView})` : void 0
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
},
|
|
105
|
-
css
|
|
106
|
-
];
|
|
107
|
-
};
|
|
108
|
-
const swiperClasses = {
|
|
109
|
-
root: utils_index.makeClassList("swiper"),
|
|
110
|
-
list: utils_index.makeClassList("swiper-list")
|
|
111
|
-
};
|
|
112
|
-
exports.Swiper = Swiper;
|
|
113
|
-
exports.swiperClasses = swiperClasses;
|
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const lodashEs = require("lodash-es");
|
|
6
|
-
const react$1 = require("motion/react");
|
|
7
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
8
|
-
const SwiperDotsPaging = ({
|
|
9
|
-
api,
|
|
10
|
-
size = 12,
|
|
11
|
-
spaceBetween = 4,
|
|
12
|
-
colorVariant = "primary"
|
|
13
|
-
}) => {
|
|
14
|
-
const [inViewIndexes, setInViewIndexes] = react.useState((api == null ? void 0 : api.slidesInView()) ?? []);
|
|
15
|
-
const [totalSlides, setTotalSlides] = react.useState((api == null ? void 0 : api.slideNodes().length) ?? 0);
|
|
16
|
-
const { main, light } = utils_index.getColorShadesByVariant(colorVariant);
|
|
17
|
-
react.useEffect(() => {
|
|
18
|
-
const checkSlidesInView = () => {
|
|
19
|
-
setInViewIndexes((api == null ? void 0 : api.slidesInView()) ?? []);
|
|
20
|
-
};
|
|
21
|
-
const checkTotalSlides = () => {
|
|
22
|
-
setTotalSlides((api == null ? void 0 : api.slideNodes().length) ?? 0);
|
|
23
|
-
};
|
|
24
|
-
checkSlidesInView();
|
|
25
|
-
checkTotalSlides();
|
|
26
|
-
api == null ? void 0 : api.on("slidesInView", checkSlidesInView);
|
|
27
|
-
api == null ? void 0 : api.on("resize", checkSlidesInView);
|
|
28
|
-
api == null ? void 0 : api.on("slidesChanged", checkTotalSlides);
|
|
29
|
-
return () => {
|
|
30
|
-
api == null ? void 0 : api.off("slidesInView", checkSlidesInView);
|
|
31
|
-
api == null ? void 0 : api.off("resize", checkSlidesInView);
|
|
32
|
-
api == null ? void 0 : api.off("slidesChanged", checkTotalSlides);
|
|
33
|
-
};
|
|
34
|
-
}, [api]);
|
|
35
|
-
const onDotClick = (e) => {
|
|
36
|
-
e.stopPropagation();
|
|
37
|
-
api == null ? void 0 : api.scrollTo(Number(e.currentTarget.value));
|
|
38
|
-
};
|
|
39
|
-
const firstInViewIndex = inViewIndexes.at(0) ?? 0;
|
|
40
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { css: { position: "relative", display: "flex", width: "fit-content", gap: spaceBetween, minHeight: size }, children: [
|
|
41
|
-
lodashEs.times(totalSlides).map((slideIndex) => /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: onDotClick, value: slideIndex, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
42
|
-
"div",
|
|
43
|
-
{
|
|
44
|
-
css: {
|
|
45
|
-
width: size,
|
|
46
|
-
height: size,
|
|
47
|
-
borderColor: main,
|
|
48
|
-
backgroundColor: light,
|
|
49
|
-
border: "1px solid",
|
|
50
|
-
borderRadius: 9999,
|
|
51
|
-
...inViewIndexes.includes(slideIndex) ? { visibility: "hidden" } : {}
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
) }, slideIndex)),
|
|
55
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
56
|
-
react$1.motion.div,
|
|
57
|
-
{
|
|
58
|
-
initial: {
|
|
59
|
-
width: 0,
|
|
60
|
-
left: 0
|
|
61
|
-
},
|
|
62
|
-
animate: {
|
|
63
|
-
width: inViewIndexes.length * size + (inViewIndexes.length - 1) * spaceBetween,
|
|
64
|
-
left: firstInViewIndex * size + firstInViewIndex * spaceBetween
|
|
65
|
-
},
|
|
66
|
-
css: {
|
|
67
|
-
backgroundColor: main,
|
|
68
|
-
position: "absolute",
|
|
69
|
-
top: 0,
|
|
70
|
-
bottom: 0,
|
|
71
|
-
borderRadius: 9999
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
)
|
|
75
|
-
] });
|
|
76
|
-
};
|
|
77
|
-
exports.SwiperDotsPaging = SwiperDotsPaging;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
6
|
-
const theme_screens = require("../../../theme/screens.cjs");
|
|
7
|
-
require("../../../theme/palette.cjs");
|
|
8
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
9
|
-
const SwiperSlide = react.forwardRef(
|
|
10
|
-
({ xs, sm, md, lg, className, ...props }, ref) => {
|
|
11
|
-
const css = [
|
|
12
|
-
{
|
|
13
|
-
flexShrink: 0,
|
|
14
|
-
flexGrow: 0,
|
|
15
|
-
overflow: "hidden"
|
|
16
|
-
},
|
|
17
|
-
xs == null ? void 0 : xs.css,
|
|
18
|
-
{
|
|
19
|
-
[theme_screens.mediaQuery("sm")]: sm == null ? void 0 : sm.css,
|
|
20
|
-
[theme_screens.mediaQuery("md")]: md == null ? void 0 : md.css,
|
|
21
|
-
[theme_screens.mediaQuery("lg")]: lg == null ? void 0 : lg.css
|
|
22
|
-
}
|
|
23
|
-
];
|
|
24
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, css, className: stylesheet.cn(swiperSlideClasses.root, className), ref });
|
|
25
|
-
}
|
|
26
|
-
);
|
|
27
|
-
const swiperSlideClasses = {
|
|
28
|
-
root: utils_index.makeClassList("swiper-slide")
|
|
29
|
-
};
|
|
30
|
-
exports.SwiperSlide = SwiperSlide;
|
|
31
|
-
exports.swiperSlideClasses = swiperSlideClasses;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const react$1 = require("@floating-ui/react");
|
|
6
|
-
const switch_module = require("./switch.module.scss.cjs");
|
|
7
|
-
require("clsx");
|
|
8
|
-
require("lodash-es");
|
|
9
|
-
require("../../theme/palette.cjs");
|
|
10
|
-
const stylesheet = require("../../utils/stylesheet.cjs");
|
|
11
|
-
const Switch = ({ children, className, ref, ...props }) => {
|
|
12
|
-
const inputRef = react.useRef(null);
|
|
13
|
-
const mergedRefs = react$1.useMergeRefs([ref, inputRef]);
|
|
14
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: switch_module.default.switch__container, children: [
|
|
15
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: switch_module.default.switch__main, children: /* @__PURE__ */ jsxRuntime.jsx("input", { ...props, type: "checkbox", className: stylesheet.cn(switch_module.default.switch__input, className), ref: mergedRefs }) }),
|
|
16
|
-
children
|
|
17
|
-
] });
|
|
18
|
-
};
|
|
19
|
-
exports.Switch = Switch;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
|
-
const switch__container = "_switch__container_19zrg_1";
|
|
4
|
-
const switch__input = "_switch__input_19zrg_12";
|
|
5
|
-
const switch__main = "_switch__main_19zrg_24";
|
|
6
|
-
const classes = {
|
|
7
|
-
switch__container,
|
|
8
|
-
switch__input,
|
|
9
|
-
switch__main
|
|
10
|
-
};
|
|
11
|
-
exports.default = classes;
|
|
12
|
-
exports.switch__container = switch__container;
|
|
13
|
-
exports.switch__input = switch__input;
|
|
14
|
-
exports.switch__main = switch__main;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
require("react");
|
|
5
|
-
require("clsx");
|
|
6
|
-
require("lodash-es");
|
|
7
|
-
const theme_palette = require("../../../theme/palette.cjs");
|
|
8
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
9
|
-
const Table = ({ className, children, ...props }) => {
|
|
10
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
11
|
-
"table",
|
|
12
|
-
{
|
|
13
|
-
css: {
|
|
14
|
-
width: "100%",
|
|
15
|
-
borderTopLeftRadius: "0.5rem",
|
|
16
|
-
borderTopRightRadius: "0.5rem",
|
|
17
|
-
overflow: "hidden",
|
|
18
|
-
backgroundColor: theme_palette.getColorVar("surface.default")
|
|
19
|
-
},
|
|
20
|
-
className: stylesheet.cn(className),
|
|
21
|
-
...props,
|
|
22
|
-
children
|
|
23
|
-
}
|
|
24
|
-
);
|
|
25
|
-
};
|
|
26
|
-
exports.Table = Table;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
require("lodash-es");
|
|
5
|
-
const theme_palette = require("../../../theme/palette.cjs");
|
|
6
|
-
const primitive = require("../../primitive/primitive.cjs");
|
|
7
|
-
const TableBody = ({ children, ...props }) => {
|
|
8
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
9
|
-
primitive.Primitive,
|
|
10
|
-
{
|
|
11
|
-
as: "tbody",
|
|
12
|
-
xs: {
|
|
13
|
-
css: {
|
|
14
|
-
"& > tr": {
|
|
15
|
-
position: "relative",
|
|
16
|
-
"&::after": {
|
|
17
|
-
content: '""',
|
|
18
|
-
position: "absolute",
|
|
19
|
-
bottom: 0,
|
|
20
|
-
left: 0,
|
|
21
|
-
right: 0,
|
|
22
|
-
borderBottomWidth: 1,
|
|
23
|
-
borderBottomStyle: "solid",
|
|
24
|
-
borderBottomColor: theme_palette.getColorVar("neutral.100")
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
...props,
|
|
30
|
-
children
|
|
31
|
-
}
|
|
32
|
-
);
|
|
33
|
-
};
|
|
34
|
-
exports.TableBody = TableBody;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
require("react");
|
|
5
|
-
require("clsx");
|
|
6
|
-
require("lodash-es");
|
|
7
|
-
require("../../../theme/palette.cjs");
|
|
8
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
9
|
-
const TableCell = ({ className, children, ...props }) => {
|
|
10
|
-
return /* @__PURE__ */ jsxRuntime.jsx("td", { css: { padding: "0.5rem" }, className: stylesheet.cn(className), ...props, children });
|
|
11
|
-
};
|
|
12
|
-
exports.TableCell = TableCell;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const TableFooter = ({ children, ...props }) => {
|
|
5
|
-
return /* @__PURE__ */ jsxRuntime.jsx("tfoot", { ...props, children });
|
|
6
|
-
};
|
|
7
|
-
exports.TableFooter = TableFooter;
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
require("lodash-es");
|
|
5
|
-
const theme_palette = require("../../../theme/palette.cjs");
|
|
6
|
-
const primitive = require("../../primitive/primitive.cjs");
|
|
7
|
-
const TableHead = ({ children, ...props }) => {
|
|
8
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
9
|
-
primitive.Primitive,
|
|
10
|
-
{
|
|
11
|
-
as: "thead",
|
|
12
|
-
xs: {
|
|
13
|
-
css: {
|
|
14
|
-
position: "relative",
|
|
15
|
-
fontWeight: 500,
|
|
16
|
-
"&::after": {
|
|
17
|
-
content: '""',
|
|
18
|
-
position: "absolute",
|
|
19
|
-
bottom: 0,
|
|
20
|
-
left: 0,
|
|
21
|
-
right: 0,
|
|
22
|
-
borderTopWidth: 1,
|
|
23
|
-
borderTopStyle: "solid",
|
|
24
|
-
borderTopColor: theme_palette.getColorVar("neutral.200")
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
},
|
|
28
|
-
...props,
|
|
29
|
-
children
|
|
30
|
-
}
|
|
31
|
-
);
|
|
32
|
-
};
|
|
33
|
-
exports.TableHead = TableHead;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const TableRow = ({ children, ...props }) => {
|
|
5
|
-
return /* @__PURE__ */ jsxRuntime.jsx("tr", { ...props, children });
|
|
6
|
-
};
|
|
7
|
-
exports.TableRow = TableRow;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const react = require("react");
|
|
4
|
-
const TabIndexContext = react.createContext(-1);
|
|
5
|
-
const useTabIndexContext = () => {
|
|
6
|
-
return react.useContext(TabIndexContext);
|
|
7
|
-
};
|
|
8
|
-
exports.TabIndexContext = TabIndexContext;
|
|
9
|
-
exports.useTabIndexContext = useTabIndexContext;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
5
|
-
const helpers$1 = require("./helpers.cjs");
|
|
6
|
-
const helpers = require("../tabs/helpers.cjs");
|
|
7
|
-
const button = require("../../button/button.cjs");
|
|
8
|
-
const Tab = ({ children, ref, ..._props }) => {
|
|
9
|
-
var _a;
|
|
10
|
-
const { focusTab, activeIndex, tabProps: defaultTabProps = {}, preventActiveTabChange } = helpers.useTabsContext();
|
|
11
|
-
const { color, states, ...rest } = utils_index.mergeComponentProps(defaultTabProps, _props);
|
|
12
|
-
const tabIndex = helpers$1.useTabIndexContext();
|
|
13
|
-
const isTabActive = tabIndex === activeIndex;
|
|
14
|
-
const onClick = (e) => {
|
|
15
|
-
var _a2;
|
|
16
|
-
e.preventDefault();
|
|
17
|
-
if (preventActiveTabChange) {
|
|
18
|
-
!isTabActive && focusTab(tabIndex);
|
|
19
|
-
} else {
|
|
20
|
-
focusTab(tabIndex);
|
|
21
|
-
}
|
|
22
|
-
(_a2 = rest.onClick) == null ? void 0 : _a2.call(rest, e);
|
|
23
|
-
};
|
|
24
|
-
return /* @__PURE__ */ jsxRuntime.jsx(button.Button, { ...rest, onClick, color: isTabActive ? (_a = states == null ? void 0 : states.active) == null ? void 0 : _a.color : color, ref, children });
|
|
25
|
-
};
|
|
26
|
-
exports.Tab = Tab;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
6
|
-
const helpers = require("../tabs/helpers.cjs");
|
|
7
|
-
const TabContent = react.forwardRef(({ children, ...rest }, ref) => {
|
|
8
|
-
const { activeIndex } = helpers.useTabsContext();
|
|
9
|
-
const flattenedChildren = utils_index.flattenChildren(children);
|
|
10
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
11
|
-
"div",
|
|
12
|
-
{
|
|
13
|
-
css: {
|
|
14
|
-
display: "contents"
|
|
15
|
-
},
|
|
16
|
-
...rest,
|
|
17
|
-
ref,
|
|
18
|
-
children: flattenedChildren.find((_, index) => index === activeIndex)
|
|
19
|
-
}
|
|
20
|
-
);
|
|
21
|
-
});
|
|
22
|
-
exports.TabContent = TabContent;
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const react$1 = require("motion/react");
|
|
6
|
-
const theme_screens = require("../../../theme/screens.cjs");
|
|
7
|
-
require("../../../theme/palette.cjs");
|
|
8
|
-
const helpers = require("../tabs/helpers.cjs");
|
|
9
|
-
const TabIndicator = () => {
|
|
10
|
-
const { activeIndex, tabIndicatorProps } = helpers.useTabsContext();
|
|
11
|
-
const indicatorEl = react.useRef(null);
|
|
12
|
-
const [indicatorRect, setIndicatorRect] = react.useState({
|
|
13
|
-
left: 0,
|
|
14
|
-
width: 0
|
|
15
|
-
});
|
|
16
|
-
const [activeTabElement, setActiveTabElement] = react.useState();
|
|
17
|
-
react.useEffect(() => {
|
|
18
|
-
var _a;
|
|
19
|
-
const tabListEl = (_a = indicatorEl.current) == null ? void 0 : _a.parentElement;
|
|
20
|
-
setActiveTabElement(tabListEl == null ? void 0 : tabListEl.children.item(activeIndex));
|
|
21
|
-
const mutationObserver = new MutationObserver((mutations) => {
|
|
22
|
-
var _a2;
|
|
23
|
-
const target = (_a2 = mutations.at(0)) == null ? void 0 : _a2.target;
|
|
24
|
-
if (target instanceof Element) {
|
|
25
|
-
setActiveTabElement(target.children.item(activeIndex));
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
if (tabListEl) {
|
|
29
|
-
mutationObserver.observe(tabListEl, {
|
|
30
|
-
childList: true
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
return () => {
|
|
34
|
-
mutationObserver.disconnect();
|
|
35
|
-
};
|
|
36
|
-
}, [activeIndex]);
|
|
37
|
-
react.useEffect(() => {
|
|
38
|
-
const resizeObserver = new ResizeObserver((entries) => {
|
|
39
|
-
var _a;
|
|
40
|
-
const target = (_a = entries.at(0)) == null ? void 0 : _a.target;
|
|
41
|
-
const parentElement = target == null ? void 0 : target.parentElement;
|
|
42
|
-
if (!target || !parentElement) {
|
|
43
|
-
return;
|
|
44
|
-
}
|
|
45
|
-
const targetRect = target.getBoundingClientRect();
|
|
46
|
-
const parentRect = parentElement.getBoundingClientRect();
|
|
47
|
-
setIndicatorRect({
|
|
48
|
-
left: targetRect.left - parentRect.left + parentElement.scrollLeft,
|
|
49
|
-
width: targetRect.width
|
|
50
|
-
});
|
|
51
|
-
});
|
|
52
|
-
if (activeTabElement) {
|
|
53
|
-
resizeObserver.observe(activeTabElement);
|
|
54
|
-
}
|
|
55
|
-
return () => {
|
|
56
|
-
resizeObserver.disconnect();
|
|
57
|
-
};
|
|
58
|
-
}, [activeTabElement]);
|
|
59
|
-
const css = [
|
|
60
|
-
{
|
|
61
|
-
position: "absolute",
|
|
62
|
-
bottom: 0,
|
|
63
|
-
left: 0,
|
|
64
|
-
backgroundColor: "currentcolor",
|
|
65
|
-
borderRadius: 8
|
|
66
|
-
},
|
|
67
|
-
createStyle(tabIndicatorProps == null ? void 0 : tabIndicatorProps.xs),
|
|
68
|
-
{
|
|
69
|
-
[theme_screens.mediaQuery("sm")]: createStyle(tabIndicatorProps == null ? void 0 : tabIndicatorProps.sm),
|
|
70
|
-
[theme_screens.mediaQuery("md")]: createStyle(tabIndicatorProps == null ? void 0 : tabIndicatorProps.md)
|
|
71
|
-
}
|
|
72
|
-
];
|
|
73
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
74
|
-
react$1.motion.div,
|
|
75
|
-
{
|
|
76
|
-
initial: {
|
|
77
|
-
transform: "translateX(0)",
|
|
78
|
-
width: 0
|
|
79
|
-
},
|
|
80
|
-
animate: {
|
|
81
|
-
width: indicatorRect.width,
|
|
82
|
-
transform: `translateX(${indicatorRect.left}px)`
|
|
83
|
-
},
|
|
84
|
-
ref: indicatorEl,
|
|
85
|
-
css
|
|
86
|
-
}
|
|
87
|
-
);
|
|
88
|
-
};
|
|
89
|
-
const createStyle = ({ css } = {}) => {
|
|
90
|
-
return [css];
|
|
91
|
-
};
|
|
92
|
-
exports.TabIndicator = TabIndicator;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
4
|
-
const defaultProps = {};
|
|
5
|
-
const getTabListProps = (extended) => {
|
|
6
|
-
return utils_index.mergeComponentProps(defaultProps, extended);
|
|
7
|
-
};
|
|
8
|
-
exports.getTabListProps = getTabListProps;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const helpers = require("./helpers.cjs");
|
|
6
|
-
const helpers$1 = require("../tab/helpers.cjs");
|
|
7
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
8
|
-
const theme_screens = require("../../../theme/screens.cjs");
|
|
9
|
-
require("../../../theme/palette.cjs");
|
|
10
|
-
const emotionHelpers = require("../../../utils/emotion-helpers.cjs");
|
|
11
|
-
const tabIndicator = require("../tab-indicator/tab-indicator.cjs");
|
|
12
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
13
|
-
const TabList = react.forwardRef((_props, ref) => {
|
|
14
|
-
const { xs, sm, md, lg, children, className, ...props } = helpers.getTabListProps(_props);
|
|
15
|
-
const css = [
|
|
16
|
-
{
|
|
17
|
-
display: "flex",
|
|
18
|
-
width: "fit-content",
|
|
19
|
-
maxWidth: "100%",
|
|
20
|
-
alignItems: "center",
|
|
21
|
-
gap: 16,
|
|
22
|
-
position: "relative",
|
|
23
|
-
overflow: "auto",
|
|
24
|
-
"& > *": {
|
|
25
|
-
flexShrink: 0
|
|
26
|
-
}
|
|
27
|
-
},
|
|
28
|
-
xs == null ? void 0 : xs.css,
|
|
29
|
-
{
|
|
30
|
-
[theme_screens.mediaQuery("sm")]: sm == null ? void 0 : sm.css,
|
|
31
|
-
[theme_screens.mediaQuery("md")]: md == null ? void 0 : md.css,
|
|
32
|
-
[theme_screens.mediaQuery("lg")]: lg == null ? void 0 : lg.css
|
|
33
|
-
}
|
|
34
|
-
];
|
|
35
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { css: [css, emotionHelpers.scrollbarNone], className: stylesheet.cn(className), ...props, ref, children: [
|
|
36
|
-
utils_index.flattenChildren(children).map((child, index) => /* @__PURE__ */ jsxRuntime.jsx(helpers$1.TabIndexContext.Provider, { value: index, children: child }, index)),
|
|
37
|
-
/* @__PURE__ */ jsxRuntime.jsx(tabIndicator.TabIndicator, {})
|
|
38
|
-
] });
|
|
39
|
-
});
|
|
40
|
-
exports.TabList = TabList;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
4
|
-
const defaultProps = {};
|
|
5
|
-
const getTabPanelProps = (extended) => {
|
|
6
|
-
return utils_index.mergeComponentProps(defaultProps, extended);
|
|
7
|
-
};
|
|
8
|
-
exports.getTabPanelProps = getTabPanelProps;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const theme_screens = require("../../../theme/screens.cjs");
|
|
5
|
-
require("../../../theme/palette.cjs");
|
|
6
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
7
|
-
const helpers = require("../tabs/helpers.cjs");
|
|
8
|
-
const TabPanel = ({ children, ref, ..._props }) => {
|
|
9
|
-
const { tabPanelProps: defaultTabPanelProps = {} } = helpers.useTabsContext();
|
|
10
|
-
const { xs, sm, md, lg, ...props } = utils_index.mergeComponentProps(defaultTabPanelProps, _props);
|
|
11
|
-
const css = [
|
|
12
|
-
xs == null ? void 0 : xs.css,
|
|
13
|
-
{
|
|
14
|
-
[theme_screens.mediaQuery("sm")]: sm == null ? void 0 : sm.css,
|
|
15
|
-
[theme_screens.mediaQuery("md")]: md == null ? void 0 : md.css,
|
|
16
|
-
[theme_screens.mediaQuery("lg")]: lg == null ? void 0 : lg.css
|
|
17
|
-
}
|
|
18
|
-
];
|
|
19
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, ref, css, children });
|
|
20
|
-
};
|
|
21
|
-
exports.TabPanel = TabPanel;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const react = require("react");
|
|
4
|
-
require("lodash-es");
|
|
5
|
-
const theme_palette = require("../../../theme/palette.cjs");
|
|
6
|
-
const utils_index = require("../../../utils/index.cjs");
|
|
7
|
-
const defaultProps = {
|
|
8
|
-
tabProps: {
|
|
9
|
-
color: "neutral",
|
|
10
|
-
variant: "text",
|
|
11
|
-
states: {
|
|
12
|
-
active: {
|
|
13
|
-
color: "primary",
|
|
14
|
-
variant: "text"
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
},
|
|
18
|
-
tabIndicatorProps: {
|
|
19
|
-
xs: {
|
|
20
|
-
css: {
|
|
21
|
-
height: 2,
|
|
22
|
-
backgroundColor: theme_palette.getColorVar("primary.600")
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
};
|
|
27
|
-
const getTabsProps = (extended) => {
|
|
28
|
-
return utils_index.mergeComponentProps(defaultProps, extended);
|
|
29
|
-
};
|
|
30
|
-
const TabsContext = react.createContext({});
|
|
31
|
-
const useTabsContext = () => {
|
|
32
|
-
return react.useContext(TabsContext);
|
|
33
|
-
};
|
|
34
|
-
exports.TabsContext = TabsContext;
|
|
35
|
-
exports.getTabsProps = getTabsProps;
|
|
36
|
-
exports.useTabsContext = useTabsContext;
|