softable-pixels-web 1.2.19 → 1.2.21
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/{Button-BPzDonEf.js → Button-BDIvDFeK.js} +2 -3
- package/dist/Button-BDIvDFeK.js.map +1 -0
- package/dist/{ColorPicker-DRm-i16g.js → ColorPicker-B5O5LXWt.js} +2 -2
- package/dist/ColorPicker-B5O5LXWt.js.map +1 -0
- package/dist/{DatePicker-C6WesC4Z.js → DatePicker-Y5IyaCoK.js} +2 -2
- package/dist/{DatePicker-C6WesC4Z.js.map → DatePicker-Y5IyaCoK.js.map} +1 -1
- package/dist/{IconButton-BZwW87Wk.js → IconButton-YJZyDEN9.js} +7 -7
- package/dist/IconButton-YJZyDEN9.js.map +1 -0
- package/dist/{Loader-I09c5F6g.js → Loader-1l1G52jQ.js} +1 -1
- package/dist/{Loader-I09c5F6g.js.map → Loader-1l1G52jQ.js.map} +1 -1
- package/dist/{Pagination-BWNhdXyr.js → Pagination-xaORAUQv.js} +34 -40
- package/dist/Pagination-xaORAUQv.js.map +1 -0
- package/dist/{Select-RG9mDJW6.js → Select-S6mWQinR.js} +4 -2
- package/dist/{Select-RG9mDJW6.js.map → Select-S6mWQinR.js.map} +1 -1
- package/dist/button.d.ts +2 -8
- package/dist/button.js +2 -2
- package/dist/color-picker.js +1 -1
- package/dist/context-menu.d.ts +1 -1
- package/dist/date-picker.js +3 -3
- package/dist/icon-button.d.ts +2 -7
- package/dist/icon-button.js +1 -1
- package/dist/{types-3y-Tdp7y.d.ts → index-B8FSkZw8.d.ts} +8 -5
- package/dist/index-BpVdXtFT.d.ts +15 -0
- package/dist/{types-CKTC5ZCk.d.ts → index-C1oJWGwe.d.ts} +6 -4
- package/dist/{index-BaPHRdOr.d.ts → index-CbXUh-UU.d.ts} +3 -3
- package/dist/{index-DfvWcRHm.d.ts → index-DqN6VEAU.d.ts} +3 -3
- package/dist/{index-DxxZyWpv.d.ts → index-pBIduDqF.d.ts} +3 -1
- package/dist/index.d.ts +6 -8
- package/dist/index.js +7 -7
- package/dist/pagination.d.ts +1 -4
- package/dist/pagination.js +4 -4
- package/dist/select.d.ts +1 -1
- package/dist/select.js +2 -2
- package/dist/text-area.d.ts +1 -1
- package/package.json +1 -1
- package/dist/Button-BPzDonEf.js.map +0 -1
- package/dist/ColorPicker-DRm-i16g.js.map +0 -1
- package/dist/IconButton-BZwW87Wk.js.map +0 -1
- package/dist/Pagination-BWNhdXyr.js.map +0 -1
- package/dist/index-BWoyVnHt.d.ts +0 -24
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { n as styled, t as useThemedStyles } from "./useThemedStyles-CUbWXrNN.js";
|
|
2
2
|
import { t as Icon } from "./Icon-DTFfAYeH.js";
|
|
3
3
|
import { t as Typography } from "./Typography-4iQDPw2N.js";
|
|
4
|
-
import { t as
|
|
5
|
-
import { t as
|
|
4
|
+
import { t as IconButton } from "./IconButton-YJZyDEN9.js";
|
|
5
|
+
import { t as Button } from "./Button-BDIvDFeK.js";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
|
|
8
8
|
//#region src/components/commons/toolkit/Pagination/components/ArrowButtons/hooks/usePagination/index.ts
|
|
@@ -29,20 +29,24 @@ function usePagination({ pageNumber, totalPages, onPageChange }) {
|
|
|
29
29
|
|
|
30
30
|
//#endregion
|
|
31
31
|
//#region src/components/commons/toolkit/Pagination/styles.ts
|
|
32
|
-
function createPaginationStyles(
|
|
32
|
+
function createPaginationStyles() {
|
|
33
33
|
return styled({
|
|
34
34
|
container: {
|
|
35
35
|
display: "flex",
|
|
36
36
|
alignItems: "center",
|
|
37
37
|
justifyContent: "center",
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
gap: "0.25rem"
|
|
39
|
+
},
|
|
40
|
+
pagesRow: {
|
|
41
|
+
display: "flex",
|
|
42
|
+
alignItems: "center",
|
|
43
|
+
gap: "0.25rem"
|
|
40
44
|
},
|
|
41
45
|
arrowButtons: {
|
|
42
46
|
display: "flex",
|
|
43
47
|
alignItems: "center",
|
|
44
48
|
justifyContent: "center",
|
|
45
|
-
gap: "0.
|
|
49
|
+
gap: "0.25rem"
|
|
46
50
|
}
|
|
47
51
|
});
|
|
48
52
|
}
|
|
@@ -50,56 +54,50 @@ function createPaginationStyles(_props) {
|
|
|
50
54
|
//#endregion
|
|
51
55
|
//#region src/components/commons/toolkit/Pagination/components/ArrowButtons/index.tsx
|
|
52
56
|
const ArrowButtons = (props) => {
|
|
53
|
-
const { pageNumber, totalPages, direction,
|
|
57
|
+
const { pageNumber, totalPages, direction, onPageChange } = props;
|
|
54
58
|
const isFirstPage = pageNumber === 1;
|
|
59
|
+
const isLastPage = pageNumber === totalPages;
|
|
55
60
|
const { handleFirstPage, handlePreviousPage, handleNextPage, handleLastPage } = usePagination({
|
|
56
61
|
pageNumber,
|
|
57
62
|
totalPages,
|
|
58
63
|
onPageChange
|
|
59
64
|
});
|
|
60
|
-
const { styles } = useThemedStyles(props, createPaginationStyles
|
|
61
|
-
applyCommonProps: true,
|
|
62
|
-
override: props.styles
|
|
63
|
-
});
|
|
65
|
+
const { styles } = useThemedStyles(props, createPaginationStyles);
|
|
64
66
|
function renderPreviousButtons() {
|
|
65
|
-
if (totalPages
|
|
67
|
+
if (totalPages === 1) return null;
|
|
66
68
|
return /* @__PURE__ */ jsxs("div", {
|
|
67
69
|
style: styles.arrowButtons,
|
|
68
70
|
children: [/* @__PURE__ */ jsx(IconButton, {
|
|
69
71
|
variant: "outlined",
|
|
70
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-double-left" }),
|
|
71
|
-
styles: stylesIconButton,
|
|
72
72
|
isDisabled: isFirstPage,
|
|
73
|
+
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-double-left" }),
|
|
73
74
|
onClick: handleFirstPage
|
|
74
75
|
}), /* @__PURE__ */ jsx(IconButton, {
|
|
75
76
|
variant: "outlined",
|
|
76
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-left" }),
|
|
77
|
-
styles: stylesIconButton,
|
|
78
77
|
isDisabled: isFirstPage,
|
|
78
|
+
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-left" }),
|
|
79
79
|
onClick: handlePreviousPage
|
|
80
80
|
})]
|
|
81
81
|
});
|
|
82
82
|
}
|
|
83
83
|
function renderNextButtons() {
|
|
84
|
-
if (totalPages
|
|
84
|
+
if (totalPages === 1) return null;
|
|
85
85
|
return /* @__PURE__ */ jsxs("div", {
|
|
86
86
|
style: styles.arrowButtons,
|
|
87
87
|
children: [/* @__PURE__ */ jsx(IconButton, {
|
|
88
88
|
variant: "outlined",
|
|
89
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-double-right" }),
|
|
90
|
-
styles: stylesIconButton,
|
|
91
89
|
isDisabled: isLastPage,
|
|
92
|
-
|
|
90
|
+
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-right" }),
|
|
91
|
+
onClick: handleNextPage
|
|
93
92
|
}), /* @__PURE__ */ jsx(IconButton, {
|
|
94
93
|
variant: "outlined",
|
|
95
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-right" }),
|
|
96
|
-
styles: stylesIconButton,
|
|
97
94
|
isDisabled: isLastPage,
|
|
98
|
-
|
|
95
|
+
icon: /* @__PURE__ */ jsx(Icon, { name: "chevrons-double-right" }),
|
|
96
|
+
onClick: handleLastPage
|
|
99
97
|
})]
|
|
100
98
|
});
|
|
101
99
|
}
|
|
102
|
-
return
|
|
100
|
+
return direction === "left" ? renderPreviousButtons() : renderNextButtons();
|
|
103
101
|
};
|
|
104
102
|
|
|
105
103
|
//#endregion
|
|
@@ -131,29 +129,29 @@ function getVisiblePages({ pageNumber, totalPages }) {
|
|
|
131
129
|
//#endregion
|
|
132
130
|
//#region src/components/commons/toolkit/Pagination/index.tsx
|
|
133
131
|
const Pagination = (props) => {
|
|
134
|
-
const { pageNumber, totalPages,
|
|
132
|
+
const { pageNumber, totalPages, onPageChange } = props;
|
|
135
133
|
const { styles } = useThemedStyles(props, createPaginationStyles, {
|
|
136
134
|
applyCommonProps: true,
|
|
137
|
-
|
|
135
|
+
commonSlot: "container"
|
|
138
136
|
});
|
|
139
137
|
function renderPagination() {
|
|
138
|
+
const pages = getVisiblePages({
|
|
139
|
+
pageNumber,
|
|
140
|
+
totalPages
|
|
141
|
+
});
|
|
140
142
|
return /* @__PURE__ */ jsx("div", {
|
|
141
|
-
|
|
142
|
-
children:
|
|
143
|
-
pageNumber,
|
|
144
|
-
totalPages
|
|
145
|
-
}).map((page, index) => page === "..." ? /* @__PURE__ */ jsx(Typography, {
|
|
143
|
+
style: styles.pagesRow,
|
|
144
|
+
children: pages.map((page, index) => page === "..." ? /* @__PURE__ */ jsx(Typography, {
|
|
146
145
|
variant: "b1",
|
|
147
146
|
color: "var(--px-btn-outlined-label)",
|
|
148
147
|
styles: { text: { paddingTop: "0.5rem" } },
|
|
149
148
|
children: "..."
|
|
150
149
|
}, `ellipsis-${index.toString()}`) : /* @__PURE__ */ jsx(Button, {
|
|
150
|
+
px: "1rem",
|
|
151
|
+
py: "0.5rem",
|
|
151
152
|
label: String(page),
|
|
152
153
|
variant: page === pageNumber ? "filled" : "outlined",
|
|
153
|
-
onClick: () => onPageChange(page)
|
|
154
|
-
px: 1,
|
|
155
|
-
py: .5,
|
|
156
|
-
styles: stylesButton
|
|
154
|
+
onClick: () => onPageChange(page)
|
|
157
155
|
}, `${page}-${index.toString()}`))
|
|
158
156
|
});
|
|
159
157
|
}
|
|
@@ -164,8 +162,6 @@ const Pagination = (props) => {
|
|
|
164
162
|
direction: "left",
|
|
165
163
|
pageNumber,
|
|
166
164
|
totalPages,
|
|
167
|
-
isLastPage,
|
|
168
|
-
stylesIconButton,
|
|
169
165
|
onPageChange
|
|
170
166
|
}),
|
|
171
167
|
renderPagination(),
|
|
@@ -173,8 +169,6 @@ const Pagination = (props) => {
|
|
|
173
169
|
direction: "right",
|
|
174
170
|
pageNumber,
|
|
175
171
|
totalPages,
|
|
176
|
-
isLastPage,
|
|
177
|
-
stylesIconButton,
|
|
178
172
|
onPageChange
|
|
179
173
|
})
|
|
180
174
|
]
|
|
@@ -183,4 +177,4 @@ const Pagination = (props) => {
|
|
|
183
177
|
|
|
184
178
|
//#endregion
|
|
185
179
|
export { Pagination as t };
|
|
186
|
-
//# sourceMappingURL=Pagination-
|
|
180
|
+
//# sourceMappingURL=Pagination-xaORAUQv.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Pagination-xaORAUQv.js","names":["ArrowButtons: React.FC<ArrowButtonProps>","Pagination: React.FC<PaginationProps>"],"sources":["../src/components/commons/toolkit/Pagination/components/ArrowButtons/hooks/usePagination/index.ts","../src/components/commons/toolkit/Pagination/styles.ts","../src/components/commons/toolkit/Pagination/components/ArrowButtons/index.tsx","../src/components/commons/toolkit/Pagination/utils/getVisiblePages/index.ts","../src/components/commons/toolkit/Pagination/index.tsx"],"sourcesContent":["import type { PaginationInfoProps } from './types'\n\nexport function usePagination({\n pageNumber,\n totalPages,\n onPageChange\n}: PaginationInfoProps) {\n // Functions\n function handleFirstPage() {\n if (pageNumber > 1) return onPageChange(1)\n }\n\n function handlePreviousPage() {\n if (pageNumber > 1) return onPageChange(pageNumber - 1)\n }\n\n function handleNextPage() {\n if (pageNumber < totalPages) return onPageChange(pageNumber + 1)\n }\n\n function handleLastPage() {\n if (pageNumber < totalPages) return onPageChange(totalPages)\n }\n\n return {\n handleFirstPage,\n handlePreviousPage,\n handleNextPage,\n handleLastPage\n }\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createPaginationStyles() {\n return styled({\n container: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n\n gap: '0.25rem'\n },\n\n pagesRow: {\n display: 'flex',\n alignItems: 'center',\n\n gap: '0.25rem'\n },\n\n arrowButtons: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n\n gap: '0.25rem'\n }\n })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { IconButton } from '@components/commons/buttons/IconButton'\n\n// Hooks\nimport { usePagination } from './hooks/usePagination'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { ArrowButtonProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from '../../styles'\n\nexport const ArrowButtons: React.FC<ArrowButtonProps> = props => {\n const { pageNumber, totalPages, direction, onPageChange } = props\n\n // Constants\n const isFirstPage = pageNumber === 1\n const isLastPage = pageNumber === totalPages\n\n // Hooks\n const {\n handleFirstPage,\n handlePreviousPage,\n handleNextPage,\n handleLastPage\n } = usePagination({ pageNumber, totalPages, onPageChange })\n const { styles } = useThemedStyles(props, createPaginationStyles)\n\n // Functions\n function renderPreviousButtons() {\n if (totalPages === 1) return null\n\n return (\n <div style={styles.arrowButtons}>\n <IconButton\n variant=\"outlined\"\n isDisabled={isFirstPage}\n icon={<Icon name={'chevrons-double-left'} />}\n onClick={handleFirstPage}\n />\n\n <IconButton\n variant=\"outlined\"\n isDisabled={isFirstPage}\n icon={<Icon name={'chevrons-left'} />}\n onClick={handlePreviousPage}\n />\n </div>\n )\n }\n\n function renderNextButtons() {\n if (totalPages === 1) return null\n\n return (\n <div style={styles.arrowButtons}>\n <IconButton\n variant=\"outlined\"\n isDisabled={isLastPage}\n icon={<Icon name={'chevrons-right'} />}\n onClick={handleNextPage}\n />\n\n <IconButton\n variant=\"outlined\"\n isDisabled={isLastPage}\n icon={<Icon name={'chevrons-double-right'} />}\n onClick={handleLastPage}\n />\n </div>\n )\n }\n\n return direction === 'left' ? renderPreviousButtons() : renderNextButtons()\n}\n","interface Props {\n pageNumber: number\n totalPages: number\n}\n\nexport function getVisiblePages({\n pageNumber,\n totalPages\n}: Props): (number | string)[] {\n if (totalPages <= 4) {\n return Array.from({ length: totalPages }, (_, i) => i + 1)\n }\n\n if (pageNumber <= 3) {\n return [1, 2, 3, '...', totalPages]\n }\n\n if (pageNumber >= totalPages - 2) {\n return [totalPages - 3, totalPages - 2, totalPages - 1, totalPages]\n }\n\n return [pageNumber - 1, pageNumber, pageNumber + 1, '...', totalPages]\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '../Typography'\nimport { ArrowButtons } from './components/ArrowButtons'\nimport { Button } from '@components/commons/buttons/Button'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Utils\nimport { getVisiblePages } from './utils/getVisiblePages'\n\n// Types\nimport type { PaginationProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from './styles'\n\nexport const Pagination: React.FC<PaginationProps> = props => {\n const { pageNumber, totalPages, onPageChange } = props\n\n // Hooks\n const { styles } = useThemedStyles(props, createPaginationStyles, {\n applyCommonProps: true,\n commonSlot: 'container'\n })\n\n // Functions\n function renderPagination() {\n const pages = getVisiblePages({ pageNumber, totalPages })\n\n return (\n <div style={styles.pagesRow}>\n {pages.map((page, index) =>\n page === '...' ? (\n <Typography\n key={`ellipsis-${index.toString()}`}\n variant=\"b1\"\n color={'var(--px-btn-outlined-label)'}\n styles={{ text: { paddingTop: '0.5rem' } }}\n >\n ...\n </Typography>\n ) : (\n <Button\n key={`${page}-${index.toString()}`}\n px=\"1rem\"\n py=\"0.5rem\"\n label={String(page)}\n variant={page === pageNumber ? 'filled' : 'outlined'}\n onClick={() => onPageChange(page as number)}\n />\n )\n )}\n </div>\n )\n }\n\n return (\n <div style={styles.container}>\n <ArrowButtons\n direction=\"left\"\n pageNumber={pageNumber}\n totalPages={totalPages}\n onPageChange={onPageChange}\n />\n\n {renderPagination()}\n\n <ArrowButtons\n direction=\"right\"\n pageNumber={pageNumber}\n totalPages={totalPages}\n onPageChange={onPageChange}\n />\n </div>\n )\n}\n"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { t as Typography } from "./Typography-4iQDPw2N.js";
|
|
|
4
4
|
import { t as BasePopover } from "./BasePopover-T1mEexwp.js";
|
|
5
5
|
import { t as Label } from "./Label-CaQSxOx8.js";
|
|
6
6
|
import { t as ErrorMessage } from "./ErrorMessage-C_XOzH00.js";
|
|
7
|
-
import { t as Loader } from "./Loader-
|
|
7
|
+
import { t as Loader } from "./Loader-1l1G52jQ.js";
|
|
8
8
|
import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
9
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
10
|
|
|
@@ -421,9 +421,11 @@ const Select = (props) => {
|
|
|
421
421
|
open,
|
|
422
422
|
portalId: props.portalId,
|
|
423
423
|
absoluteReference: props.absoluteReference,
|
|
424
|
+
maxHeight: props.maxHeightPopover,
|
|
424
425
|
floatingOptions: {
|
|
425
426
|
viewportMargin: 0,
|
|
426
427
|
strategy: props.strategy,
|
|
428
|
+
placement: props.placement,
|
|
427
429
|
scrollContainerId: props.scrollContainerId
|
|
428
430
|
},
|
|
429
431
|
trigger: renderTrigger,
|
|
@@ -442,4 +444,4 @@ const Select = (props) => {
|
|
|
442
444
|
|
|
443
445
|
//#endregion
|
|
444
446
|
export { types_exports as n, Select as t };
|
|
445
|
-
//# sourceMappingURL=Select-
|
|
447
|
+
//# sourceMappingURL=Select-S6mWQinR.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select-RG9mDJW6.js","names":["value","Select: React.FC<SelectProps>"],"sources":["../src/components/commons/inputs/Select/components/OptionItem/styles.ts","../src/components/commons/inputs/Select/components/OptionItem/index.tsx","../src/hooks/useCompositeListNavigation/index.ts","../src/components/commons/inputs/Select/hooks/useSelect/index.ts","../src/components/commons/inputs/Select/styles.ts","../src/components/commons/inputs/Select/types.ts","../src/components/commons/inputs/Select/index.tsx"],"sourcesContent":["import type { OptionItemProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createOptionsStyles(\n props: OptionItemProps & { ['data-active']?: string }\n) {\n const { isSelected } = props\n const isActive = props['data-active'] === 'true'\n const highlighted = isSelected || isActive\n\n return styled({\n container: {\n width: '100%',\n\n display: 'flex',\n alignItems: 'center',\n textAlign: 'left',\n\n borderRadius: '0.25rem',\n padding: '0.5rem 0.75rem',\n\n cursor: 'pointer',\n transition: 'background-color 0.2s ease-out',\n\n backgroundColor: highlighted\n ? 'var(--px-background-card-hover)'\n : 'transparent',\n\n __rules: {\n '&:hover': {\n backgroundColor: 'var(--px-background-card-hover) !important'\n },\n\n '&:focus': {\n outlineOffset: '-1px',\n outline: '2px solid var(--px-color-primary)'\n }\n }\n },\n\n text: {\n flex: 1,\n\n fontSize: '1rem',\n fontWeight: 500,\n lineHeight: '1.5rem',\n fontFamily: 'inherit',\n color: 'var(--px-text-primary)',\n\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis'\n }\n })\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\nimport type React from 'react'\nimport { forwardRef } from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { OptionItemProps } from './types'\n\n// Styles\nimport { createOptionsStyles } from './styles'\n\ntype NativeButtonProps = Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'onClick'\n>\n\nexport const OptionItem = forwardRef<\n HTMLButtonElement,\n OptionItemProps & NativeButtonProps\n>((props, ref) => {\n const { styles, classes } = useThemedStyles(props, createOptionsStyles)\n\n const { option, isSelected, onClick, ...rest } = props\n\n return (\n <button\n {...rest}\n ref={ref}\n type=\"button\"\n role=\"option\"\n style={styles.container}\n className={classes.container}\n aria-label={option.label}\n aria-selected={isSelected}\n onClick={() => onClick(option.value)}\n >\n <span style={styles.text}>{option.label}</span>\n </button>\n )\n})\n\nOptionItem.displayName = 'OptionItem'\n","// External Libraries\nimport { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type CompositeItemMeta = {\n disabled?: boolean\n hasChildren?: boolean\n onActivate?: () => void\n onOpenChildren?: () => void\n onCloseChildren?: () => void\n}\n\ntype Params = {\n open: boolean\n itemCount: number\n initialIndex?: number\n onCloseByTab?: () => void\n setOpen: (v: boolean) => void\n makeMeta: (index: number) => CompositeItemMeta\n}\n\nfunction findNextEnabled(\n start: number,\n dir: 1 | -1,\n count: number,\n isDisabled: (i: number) => boolean\n) {\n if (count <= 0) return 0\n let i = start\n for (let step = 0; step < count; step++) {\n i = (i + dir + count) % count\n if (!isDisabled(i)) return i\n }\n return start\n}\n\nfunction findFirstEnabled(count: number, isDisabled: (i: number) => boolean) {\n for (let i = 0; i < count; i++) if (!isDisabled(i)) return i\n return 0\n}\n\nexport function useCompositeListNavigation({\n open,\n itemCount,\n initialIndex,\n setOpen,\n makeMeta,\n onCloseByTab\n}: Params) {\n const listRef = useRef<HTMLElement | null>(null)\n const itemRefs = useRef<Array<HTMLButtonElement | null>>([])\n\n const isDisabled = useCallback(\n (i: number) => !!makeMeta(i).disabled,\n [makeMeta]\n )\n\n const [activeIndex, setActiveIndex] = useState(0)\n\n const focusItem = useCallback((i: number) => {\n const el = itemRefs.current[i]\n if (!el) return\n el.focus({ preventScroll: true })\n el.scrollIntoView({ block: 'nearest' })\n }, [])\n\n const openAndFocus = useCallback(\n (index?: number) => {\n setOpen(true)\n\n const next =\n typeof index === 'number'\n ? index\n : typeof initialIndex === 'number'\n ? initialIndex\n : findFirstEnabled(itemCount, isDisabled)\n\n setActiveIndex(next)\n requestAnimationFrame(() => focusItem(next))\n },\n [focusItem, initialIndex, isDisabled, itemCount, setOpen]\n )\n\n useEffect(() => {\n if (!open) return\n requestAnimationFrame(() => focusItem(activeIndex))\n }, [open, activeIndex, focusItem])\n\n const move = useCallback(\n (dir: 1 | -1) => {\n const next = findNextEnabled(activeIndex, dir, itemCount, isDisabled)\n setActiveIndex(next)\n requestAnimationFrame(() => focusItem(next))\n },\n [activeIndex, itemCount, isDisabled, focusItem]\n )\n\n const activate = useCallback(() => {\n const meta = makeMeta(activeIndex)\n if (meta.disabled) return\n meta.onActivate?.()\n }, [activeIndex, makeMeta])\n\n const onListKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (!open) return\n\n switch (e.key) {\n case 'Tab': {\n // ✅ fecha e deixa o browser focar o próximo\n // (e NÃO restaura foco pro trigger)\n onCloseByTab?.()\n setOpen(false)\n return\n }\n\n case 'ArrowDown':\n e.preventDefault()\n move(+1)\n return\n\n case 'ArrowUp':\n e.preventDefault()\n move(-1)\n return\n\n case 'Home': {\n e.preventDefault()\n const first = findFirstEnabled(itemCount, isDisabled)\n setActiveIndex(first)\n requestAnimationFrame(() => focusItem(first))\n return\n }\n\n case 'End': {\n e.preventDefault()\n let last = itemCount - 1\n for (let i = itemCount - 1; i >= 0; i--) {\n if (!isDisabled(i)) {\n last = i\n break\n }\n }\n setActiveIndex(last)\n requestAnimationFrame(() => focusItem(last))\n return\n }\n\n case 'Enter':\n case ' ': {\n e.preventDefault()\n activate()\n return\n }\n\n case 'Escape':\n e.preventDefault()\n setOpen(false)\n return\n\n case 'ArrowRight': {\n e.preventDefault()\n const meta = makeMeta(activeIndex)\n if (meta.hasChildren) meta.onOpenChildren?.()\n return\n }\n\n case 'ArrowLeft': {\n e.preventDefault()\n const meta = makeMeta(activeIndex)\n meta.onCloseChildren?.()\n return\n }\n }\n },\n [\n open,\n itemCount,\n activeIndex,\n move,\n setOpen,\n activate,\n makeMeta,\n focusItem,\n isDisabled,\n onCloseByTab\n ]\n )\n\n const getTriggerProps = useCallback(() => {\n return {\n onKeyDown: (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n e.preventDefault()\n if (!open) openAndFocus()\n return\n }\n\n if (e.key === 'ArrowUp') {\n e.preventDefault()\n if (!open) openAndFocus(itemCount > 0 ? itemCount - 1 : 0)\n }\n }\n }\n }, [open, openAndFocus, itemCount])\n\n const getListProps = useCallback(() => {\n return {\n ref: (el: HTMLElement | null) => {\n listRef.current = el\n },\n onKeyDown: onListKeyDown\n }\n }, [onListKeyDown])\n\n const getItemProps = useCallback(\n (index: number) => {\n const isActive = index === activeIndex\n return {\n ref: (el: HTMLButtonElement | null) => {\n itemRefs.current[index] = el\n },\n tabIndex: isActive ? 0 : -1,\n 'data-active': isActive ? 'true' : 'false'\n } as const\n },\n [activeIndex]\n )\n\n return {\n activeIndex,\n getListProps,\n getItemProps,\n openAndFocus,\n setActiveIndex,\n getTriggerProps\n }\n}\n","// External Libraries\nimport { useState } from 'react'\n\n// Types\nimport type { SelectProps } from '../../types'\nimport { useCompositeListNavigation } from '@hooks/useCompositeListNavigation'\n\nexport function useSelect({\n value,\n options,\n multiple,\n disabled,\n canClear,\n onChange\n}: SelectProps) {\n // States\n const [open, setOpen] = useState(false)\n\n // Hooks\n const nav = useCompositeListNavigation({\n open,\n itemCount: options.length,\n setOpen: changeOpen,\n makeMeta: makeMeta\n })\n\n // Functions\n function handleOptionClick(option: string) {\n const isAlreadySelected = value.includes(option)\n\n if (!multiple) {\n if (isAlreadySelected) {\n if (canClear) onChange([])\n } else onChange([option])\n\n setOpen(false)\n return\n }\n\n if (isAlreadySelected) {\n if (value.length === 1) {\n if (canClear) onChange([])\n } else onChange(value.filter(v => v !== option))\n } else onChange([...value, option])\n }\n\n function makeMeta(index: number) {\n const opt = options[index]\n return {\n onActivate: () => {\n if (opt) handleOptionClick(opt.value)\n }\n }\n }\n\n function changeOpen(value: boolean) {\n setOpen(value)\n }\n\n function togglePanel() {\n if (disabled) return\n if (!open) nav.openAndFocus()\n }\n\n function closePanel() {\n setOpen(false)\n }\n\n return {\n nav,\n open,\n makeMeta,\n changeOpen,\n togglePanel,\n closePanel,\n handleOptionClick\n }\n}\n","import { styled } from '@hooks/useThemedStyles/types'\nimport type { SelectProps } from './types'\n\nexport function createSelectStyles(props: SelectProps) {\n return styled({\n container: {\n width: '100%',\n\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n\n rowGap: '0.375rem'\n },\n\n content: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n\n borderWidth: 1,\n columnGap: '0.25rem',\n borderRadius: '0.5rem',\n padding: '0.625rem 0.875rem',\n\n opacity: props.disabled || props.isLoading ? 0.5 : 1,\n cursor: props.isLoading\n ? 'progress'\n : props.disabled\n ? 'not-allowed'\n : 'pointer',\n boxShadow: 'var(--px-shadow-default)',\n borderColor: props.errorMessage\n ? 'var(--px-color-error)'\n : 'var(--px-border-primary)',\n\n __rules: {\n '&:focus-within': {\n outlineOffset: '-1px !important',\n outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'}) !important`\n }\n }\n },\n\n text: {\n flex: 1,\n\n textAlign: 'left',\n\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n\n fontSize: '1rem',\n lineHeight: '1.5rem',\n fontFamily: 'inherit',\n fontWeight: props.value.length ? 500 : 400,\n color: props.value.length\n ? 'var(--px-text-primary)'\n : 'var(--px-text-secondary)'\n },\n\n panel: { width: '100%' }\n })\n}\n","import type {\n TextProps,\n LayoutProps,\n MarginProps,\n TypeStyles\n} from '@hooks/useThemedStyles/types'\nimport type { createSelectStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PopoverProps } from '@components/commons/toolkit/Popover/types'\n\nexport interface SelectProps extends LayoutProps, MarginProps {\n label: string\n value: string[]\n placeholder?: string\n options: SelectOption[]\n isLoading?: boolean\n\n portalId?: PopoverProps['portalId']\n strategy?: FloatingOptions['strategy']\n scrollContainerId?: FloatingOptions['scrollContainerId']\n absoluteReference?: FloatingOptions['absoluteReference']\n\n canClear?: boolean\n multiple?: boolean\n required?: boolean\n disabled?: boolean\n hideLabel?: boolean\n errorMessage?: string\n maxVisibleItems?: number\n\n startIcon?: React.ReactNode\n styles?: TypeStyles<typeof createSelectStyles>\n\n requiredColor?: string\n labelConfig?: TextProps\n\n onChange: (value: string[]) => void\n}\n\nexport interface SelectOption {\n label: string\n value: string\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// External Libraries\nimport type React from 'react'\nimport { useMemo } from 'react'\n\n// Components\nimport { OptionItem } from './components/OptionItem'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\nimport { ErrorMessage } from '../../toolkit/ErrorMessage'\nimport { Loader } from '@components/commons/toolkit/Loader'\nimport { Typography } from '@components/commons/toolkit/Typography'\nimport { BasePopover } from '@components/commons/structure/BasePopover'\n\n// Hooks\nimport { useSelect } from './hooks/useSelect'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SelectProps } from './types'\nimport type { PopoverTriggerRenderProps } from '@components/commons/toolkit/Popover/types'\n\n// Styles\nimport { createSelectStyles } from './styles'\n\nexport * as SelectTypes from './types'\n\nexport const Select: React.FC<SelectProps> = props => {\n const { nav, open, changeOpen, handleOptionClick } = useSelect(props)\n const { styles, classes } = useThemedStyles(props, createSelectStyles, {\n pick: p => [p.disabled, p.errorMessage, p.value, p.isLoading],\n override: props.styles,\n applyCommonProps: true,\n commonSlot: 'container'\n })\n\n const maxVisible = props.maxVisibleItems ?? Infinity\n const optionsMap = useMemo(\n () => new Map(props.options.map(option => [option.value, option.label])),\n [props.options]\n )\n\n // Functions\n function renderContent() {\n if (!props.value?.length) return props.placeholder\n\n const resolvedValues = props.value.map(val => optionsMap.get(val) ?? val)\n const visibleItems = resolvedValues.slice(0, maxVisible)\n const hiddenCount = resolvedValues.length - visibleItems.length\n\n let result = visibleItems.join(', ')\n if (hiddenCount > 0) result += ` +${hiddenCount}`\n return result\n }\n\n function renderTrigger({\n ref,\n ariaExpanded,\n onClick\n }: PopoverTriggerRenderProps) {\n const triggerKeyProps = nav.getTriggerProps()\n\n return (\n <button\n ref={ref as React.RefObject<HTMLButtonElement>}\n dir=\"ltr\"\n type=\"button\"\n role=\"combobox\"\n style={styles.content}\n aria-autocomplete=\"none\"\n aria-label={props.label}\n className={classes.content}\n aria-expanded={ariaExpanded}\n disabled={props.disabled || props.isLoading}\n {...triggerKeyProps}\n onClick={onClick}\n >\n {props.value.length ? props.startIcon : null}\n\n <span id=\"text-content\" style={styles.text}>\n {renderContent()}\n </span>\n\n {props.isLoading ? (\n <Loader size=\"1rem\" color=\"var(--px-color-primary)\" />\n ) : (\n <Icon size=\"sm\" name=\"chevrons-down\" />\n )}\n </button>\n )\n }\n\n function renderOptions() {\n if (props.options.length === 0) {\n return (\n <Typography variant=\"b2\" textAlign=\"center\">\n No options\n </Typography>\n )\n }\n\n return props.options.map((option, idx) => (\n <OptionItem\n key={option.value}\n option={option}\n onClick={handleOptionClick}\n isSelected={props.value.includes(option.value)}\n {...nav.getItemProps(idx)}\n />\n ))\n }\n\n return (\n <div style={styles.container}>\n {props.hideLabel ? null : (\n <Label\n label={props.label}\n required={props.required}\n requiredColor={props.requiredColor}\n {...props.labelConfig}\n />\n )}\n\n <BasePopover\n open={open}\n portalId={props.portalId}\n absoluteReference={props.absoluteReference}\n floatingOptions={{\n viewportMargin: 0,\n strategy: props.strategy,\n scrollContainerId: props.scrollContainerId\n }}\n trigger={renderTrigger}\n onOpenChange={changeOpen}\n >\n <div style={styles.panel} role=\"listbox\" {...nav.getListProps()}>\n {renderOptions()}\n </div>\n </BasePopover>\n\n {props.errorMessage ? (\n <ErrorMessage message={props.errorMessage} />\n ) : null}\n </div>\n )\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select-S6mWQinR.js","names":["value","Select: React.FC<SelectProps>"],"sources":["../src/components/commons/inputs/Select/components/OptionItem/styles.ts","../src/components/commons/inputs/Select/components/OptionItem/index.tsx","../src/hooks/useCompositeListNavigation/index.ts","../src/components/commons/inputs/Select/hooks/useSelect/index.ts","../src/components/commons/inputs/Select/styles.ts","../src/components/commons/inputs/Select/types.ts","../src/components/commons/inputs/Select/index.tsx"],"sourcesContent":["import type { OptionItemProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createOptionsStyles(\n props: OptionItemProps & { ['data-active']?: string }\n) {\n const { isSelected } = props\n const isActive = props['data-active'] === 'true'\n const highlighted = isSelected || isActive\n\n return styled({\n container: {\n width: '100%',\n\n display: 'flex',\n alignItems: 'center',\n textAlign: 'left',\n\n borderRadius: '0.25rem',\n padding: '0.5rem 0.75rem',\n\n cursor: 'pointer',\n transition: 'background-color 0.2s ease-out',\n\n backgroundColor: highlighted\n ? 'var(--px-background-card-hover)'\n : 'transparent',\n\n __rules: {\n '&:hover': {\n backgroundColor: 'var(--px-background-card-hover) !important'\n },\n\n '&:focus': {\n outlineOffset: '-1px',\n outline: '2px solid var(--px-color-primary)'\n }\n }\n },\n\n text: {\n flex: 1,\n\n fontSize: '1rem',\n fontWeight: 500,\n lineHeight: '1.5rem',\n fontFamily: 'inherit',\n color: 'var(--px-text-primary)',\n\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis'\n }\n })\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\nimport type React from 'react'\nimport { forwardRef } from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { OptionItemProps } from './types'\n\n// Styles\nimport { createOptionsStyles } from './styles'\n\ntype NativeButtonProps = Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'onClick'\n>\n\nexport const OptionItem = forwardRef<\n HTMLButtonElement,\n OptionItemProps & NativeButtonProps\n>((props, ref) => {\n const { styles, classes } = useThemedStyles(props, createOptionsStyles)\n\n const { option, isSelected, onClick, ...rest } = props\n\n return (\n <button\n {...rest}\n ref={ref}\n type=\"button\"\n role=\"option\"\n style={styles.container}\n className={classes.container}\n aria-label={option.label}\n aria-selected={isSelected}\n onClick={() => onClick(option.value)}\n >\n <span style={styles.text}>{option.label}</span>\n </button>\n )\n})\n\nOptionItem.displayName = 'OptionItem'\n","// External Libraries\nimport { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type CompositeItemMeta = {\n disabled?: boolean\n hasChildren?: boolean\n onActivate?: () => void\n onOpenChildren?: () => void\n onCloseChildren?: () => void\n}\n\ntype Params = {\n open: boolean\n itemCount: number\n initialIndex?: number\n onCloseByTab?: () => void\n setOpen: (v: boolean) => void\n makeMeta: (index: number) => CompositeItemMeta\n}\n\nfunction findNextEnabled(\n start: number,\n dir: 1 | -1,\n count: number,\n isDisabled: (i: number) => boolean\n) {\n if (count <= 0) return 0\n let i = start\n for (let step = 0; step < count; step++) {\n i = (i + dir + count) % count\n if (!isDisabled(i)) return i\n }\n return start\n}\n\nfunction findFirstEnabled(count: number, isDisabled: (i: number) => boolean) {\n for (let i = 0; i < count; i++) if (!isDisabled(i)) return i\n return 0\n}\n\nexport function useCompositeListNavigation({\n open,\n itemCount,\n initialIndex,\n setOpen,\n makeMeta,\n onCloseByTab\n}: Params) {\n const listRef = useRef<HTMLElement | null>(null)\n const itemRefs = useRef<Array<HTMLButtonElement | null>>([])\n\n const isDisabled = useCallback(\n (i: number) => !!makeMeta(i).disabled,\n [makeMeta]\n )\n\n const [activeIndex, setActiveIndex] = useState(0)\n\n const focusItem = useCallback((i: number) => {\n const el = itemRefs.current[i]\n if (!el) return\n el.focus({ preventScroll: true })\n el.scrollIntoView({ block: 'nearest' })\n }, [])\n\n const openAndFocus = useCallback(\n (index?: number) => {\n setOpen(true)\n\n const next =\n typeof index === 'number'\n ? index\n : typeof initialIndex === 'number'\n ? initialIndex\n : findFirstEnabled(itemCount, isDisabled)\n\n setActiveIndex(next)\n requestAnimationFrame(() => focusItem(next))\n },\n [focusItem, initialIndex, isDisabled, itemCount, setOpen]\n )\n\n useEffect(() => {\n if (!open) return\n requestAnimationFrame(() => focusItem(activeIndex))\n }, [open, activeIndex, focusItem])\n\n const move = useCallback(\n (dir: 1 | -1) => {\n const next = findNextEnabled(activeIndex, dir, itemCount, isDisabled)\n setActiveIndex(next)\n requestAnimationFrame(() => focusItem(next))\n },\n [activeIndex, itemCount, isDisabled, focusItem]\n )\n\n const activate = useCallback(() => {\n const meta = makeMeta(activeIndex)\n if (meta.disabled) return\n meta.onActivate?.()\n }, [activeIndex, makeMeta])\n\n const onListKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (!open) return\n\n switch (e.key) {\n case 'Tab': {\n // ✅ fecha e deixa o browser focar o próximo\n // (e NÃO restaura foco pro trigger)\n onCloseByTab?.()\n setOpen(false)\n return\n }\n\n case 'ArrowDown':\n e.preventDefault()\n move(+1)\n return\n\n case 'ArrowUp':\n e.preventDefault()\n move(-1)\n return\n\n case 'Home': {\n e.preventDefault()\n const first = findFirstEnabled(itemCount, isDisabled)\n setActiveIndex(first)\n requestAnimationFrame(() => focusItem(first))\n return\n }\n\n case 'End': {\n e.preventDefault()\n let last = itemCount - 1\n for (let i = itemCount - 1; i >= 0; i--) {\n if (!isDisabled(i)) {\n last = i\n break\n }\n }\n setActiveIndex(last)\n requestAnimationFrame(() => focusItem(last))\n return\n }\n\n case 'Enter':\n case ' ': {\n e.preventDefault()\n activate()\n return\n }\n\n case 'Escape':\n e.preventDefault()\n setOpen(false)\n return\n\n case 'ArrowRight': {\n e.preventDefault()\n const meta = makeMeta(activeIndex)\n if (meta.hasChildren) meta.onOpenChildren?.()\n return\n }\n\n case 'ArrowLeft': {\n e.preventDefault()\n const meta = makeMeta(activeIndex)\n meta.onCloseChildren?.()\n return\n }\n }\n },\n [\n open,\n itemCount,\n activeIndex,\n move,\n setOpen,\n activate,\n makeMeta,\n focusItem,\n isDisabled,\n onCloseByTab\n ]\n )\n\n const getTriggerProps = useCallback(() => {\n return {\n onKeyDown: (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n e.preventDefault()\n if (!open) openAndFocus()\n return\n }\n\n if (e.key === 'ArrowUp') {\n e.preventDefault()\n if (!open) openAndFocus(itemCount > 0 ? itemCount - 1 : 0)\n }\n }\n }\n }, [open, openAndFocus, itemCount])\n\n const getListProps = useCallback(() => {\n return {\n ref: (el: HTMLElement | null) => {\n listRef.current = el\n },\n onKeyDown: onListKeyDown\n }\n }, [onListKeyDown])\n\n const getItemProps = useCallback(\n (index: number) => {\n const isActive = index === activeIndex\n return {\n ref: (el: HTMLButtonElement | null) => {\n itemRefs.current[index] = el\n },\n tabIndex: isActive ? 0 : -1,\n 'data-active': isActive ? 'true' : 'false'\n } as const\n },\n [activeIndex]\n )\n\n return {\n activeIndex,\n getListProps,\n getItemProps,\n openAndFocus,\n setActiveIndex,\n getTriggerProps\n }\n}\n","// External Libraries\nimport { useState } from 'react'\n\n// Types\nimport type { SelectProps } from '../../types'\nimport { useCompositeListNavigation } from '@hooks/useCompositeListNavigation'\n\nexport function useSelect({\n value,\n options,\n multiple,\n disabled,\n canClear,\n onChange\n}: SelectProps) {\n // States\n const [open, setOpen] = useState(false)\n\n // Hooks\n const nav = useCompositeListNavigation({\n open,\n itemCount: options.length,\n setOpen: changeOpen,\n makeMeta: makeMeta\n })\n\n // Functions\n function handleOptionClick(option: string) {\n const isAlreadySelected = value.includes(option)\n\n if (!multiple) {\n if (isAlreadySelected) {\n if (canClear) onChange([])\n } else onChange([option])\n\n setOpen(false)\n return\n }\n\n if (isAlreadySelected) {\n if (value.length === 1) {\n if (canClear) onChange([])\n } else onChange(value.filter(v => v !== option))\n } else onChange([...value, option])\n }\n\n function makeMeta(index: number) {\n const opt = options[index]\n return {\n onActivate: () => {\n if (opt) handleOptionClick(opt.value)\n }\n }\n }\n\n function changeOpen(value: boolean) {\n setOpen(value)\n }\n\n function togglePanel() {\n if (disabled) return\n if (!open) nav.openAndFocus()\n }\n\n function closePanel() {\n setOpen(false)\n }\n\n return {\n nav,\n open,\n makeMeta,\n changeOpen,\n togglePanel,\n closePanel,\n handleOptionClick\n }\n}\n","import { styled } from '@hooks/useThemedStyles/types'\nimport type { SelectProps } from './types'\n\nexport function createSelectStyles(props: SelectProps) {\n return styled({\n container: {\n width: '100%',\n\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n\n rowGap: '0.375rem'\n },\n\n content: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n\n borderWidth: 1,\n columnGap: '0.25rem',\n borderRadius: '0.5rem',\n padding: '0.625rem 0.875rem',\n\n opacity: props.disabled || props.isLoading ? 0.5 : 1,\n cursor: props.isLoading\n ? 'progress'\n : props.disabled\n ? 'not-allowed'\n : 'pointer',\n boxShadow: 'var(--px-shadow-default)',\n borderColor: props.errorMessage\n ? 'var(--px-color-error)'\n : 'var(--px-border-primary)',\n\n __rules: {\n '&:focus-within': {\n outlineOffset: '-1px !important',\n outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'}) !important`\n }\n }\n },\n\n text: {\n flex: 1,\n\n textAlign: 'left',\n\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n\n fontSize: '1rem',\n lineHeight: '1.5rem',\n fontFamily: 'inherit',\n fontWeight: props.value.length ? 500 : 400,\n color: props.value.length\n ? 'var(--px-text-primary)'\n : 'var(--px-text-secondary)'\n },\n\n panel: { width: '100%' }\n })\n}\n","import type {\n TextProps,\n LayoutProps,\n MarginProps,\n TypeStyles\n} from '@hooks/useThemedStyles/types'\nimport type { createSelectStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PopoverProps } from '@components/commons/toolkit/Popover/types'\n\nexport interface SelectProps extends LayoutProps, MarginProps {\n label: string\n value: string[]\n placeholder?: string\n options: SelectOption[]\n isLoading?: boolean\n\n portalId?: PopoverProps['portalId']\n strategy?: FloatingOptions['strategy']\n scrollContainerId?: FloatingOptions['scrollContainerId']\n absoluteReference?: FloatingOptions['absoluteReference']\n placement?: FloatingOptions['placement']\n\n canClear?: boolean\n multiple?: boolean\n required?: boolean\n disabled?: boolean\n hideLabel?: boolean\n errorMessage?: string\n maxVisibleItems?: number\n maxHeightPopover?: string\n\n startIcon?: React.ReactNode\n styles?: TypeStyles<typeof createSelectStyles>\n\n requiredColor?: string\n labelConfig?: TextProps\n\n onChange: (value: string[]) => void\n}\n\nexport interface SelectOption {\n label: string\n value: string\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// External Libraries\nimport type React from 'react'\nimport { useMemo } from 'react'\n\n// Components\nimport { OptionItem } from './components/OptionItem'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\nimport { ErrorMessage } from '../../toolkit/ErrorMessage'\nimport { Loader } from '@components/commons/toolkit/Loader'\nimport { Typography } from '@components/commons/toolkit/Typography'\nimport { BasePopover } from '@components/commons/structure/BasePopover'\n\n// Hooks\nimport { useSelect } from './hooks/useSelect'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SelectProps } from './types'\nimport type { PopoverTriggerRenderProps } from '@components/commons/toolkit/Popover/types'\n\n// Styles\nimport { createSelectStyles } from './styles'\n\nexport * as SelectTypes from './types'\n\nexport const Select: React.FC<SelectProps> = props => {\n const { nav, open, changeOpen, handleOptionClick } = useSelect(props)\n const { styles, classes } = useThemedStyles(props, createSelectStyles, {\n pick: p => [p.disabled, p.errorMessage, p.value, p.isLoading],\n override: props.styles,\n applyCommonProps: true,\n commonSlot: 'container'\n })\n\n const maxVisible = props.maxVisibleItems ?? Infinity\n const optionsMap = useMemo(\n () => new Map(props.options.map(option => [option.value, option.label])),\n [props.options]\n )\n\n // Functions\n function renderContent() {\n if (!props.value?.length) return props.placeholder\n\n const resolvedValues = props.value.map(val => optionsMap.get(val) ?? val)\n const visibleItems = resolvedValues.slice(0, maxVisible)\n const hiddenCount = resolvedValues.length - visibleItems.length\n\n let result = visibleItems.join(', ')\n if (hiddenCount > 0) result += ` +${hiddenCount}`\n return result\n }\n\n function renderTrigger({\n ref,\n ariaExpanded,\n onClick\n }: PopoverTriggerRenderProps) {\n const triggerKeyProps = nav.getTriggerProps()\n\n return (\n <button\n ref={ref as React.RefObject<HTMLButtonElement>}\n dir=\"ltr\"\n type=\"button\"\n role=\"combobox\"\n style={styles.content}\n aria-autocomplete=\"none\"\n aria-label={props.label}\n className={classes.content}\n aria-expanded={ariaExpanded}\n disabled={props.disabled || props.isLoading}\n {...triggerKeyProps}\n onClick={onClick}\n >\n {props.value.length ? props.startIcon : null}\n\n <span id=\"text-content\" style={styles.text}>\n {renderContent()}\n </span>\n\n {props.isLoading ? (\n <Loader size=\"1rem\" color=\"var(--px-color-primary)\" />\n ) : (\n <Icon size=\"sm\" name=\"chevrons-down\" />\n )}\n </button>\n )\n }\n\n function renderOptions() {\n if (props.options.length === 0) {\n return (\n <Typography variant=\"b2\" textAlign=\"center\">\n No options\n </Typography>\n )\n }\n\n return props.options.map((option, idx) => (\n <OptionItem\n key={option.value}\n option={option}\n onClick={handleOptionClick}\n isSelected={props.value.includes(option.value)}\n {...nav.getItemProps(idx)}\n />\n ))\n }\n\n return (\n <div style={styles.container}>\n {props.hideLabel ? null : (\n <Label\n label={props.label}\n required={props.required}\n requiredColor={props.requiredColor}\n {...props.labelConfig}\n />\n )}\n\n <BasePopover\n open={open}\n portalId={props.portalId}\n absoluteReference={props.absoluteReference}\n maxHeight={props.maxHeightPopover}\n floatingOptions={{\n viewportMargin: 0,\n strategy: props.strategy,\n placement: props.placement,\n scrollContainerId: props.scrollContainerId\n }}\n trigger={renderTrigger}\n onOpenChange={changeOpen}\n >\n <div style={styles.panel} role=\"listbox\" {...nav.getListProps()}>\n {renderOptions()}\n </div>\n </BasePopover>\n\n {props.errorMessage ? (\n <ErrorMessage message={props.errorMessage} />\n ) : null}\n </div>\n )\n}\n"],"mappings":"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"}
|
package/dist/button.d.ts
CHANGED
|
@@ -1,9 +1,3 @@
|
|
|
1
1
|
import "./types-DFnFVRW-.js";
|
|
2
|
-
import { t as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
//#region src/components/commons/buttons/Button/index.d.ts
|
|
6
|
-
declare const Button: React.FC<ButtonProps>;
|
|
7
|
-
//#endregion
|
|
8
|
-
export { Button };
|
|
9
|
-
//# sourceMappingURL=button.d.ts.map
|
|
2
|
+
import { t as Button } from "./index-C1oJWGwe.js";
|
|
3
|
+
export { Button };
|
package/dist/button.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import "./useThemedStyles-CUbWXrNN.js";
|
|
2
2
|
import "./Typography-4iQDPw2N.js";
|
|
3
|
-
import "./Loader-
|
|
4
|
-
import { t as Button } from "./Button-
|
|
3
|
+
import "./Loader-1l1G52jQ.js";
|
|
4
|
+
import { t as Button } from "./Button-BDIvDFeK.js";
|
|
5
5
|
|
|
6
6
|
export { Button };
|
package/dist/color-picker.js
CHANGED
|
@@ -2,7 +2,7 @@ import "./useThemedStyles-CUbWXrNN.js";
|
|
|
2
2
|
import "./Typography-4iQDPw2N.js";
|
|
3
3
|
import "./Label-CaQSxOx8.js";
|
|
4
4
|
import "./ErrorMessage-C_XOzH00.js";
|
|
5
|
-
import { n as types_exports, t as ColorPicker } from "./ColorPicker-
|
|
5
|
+
import { n as types_exports, t as ColorPicker } from "./ColorPicker-B5O5LXWt.js";
|
|
6
6
|
import "./Skeleton-D3Rik5Rl.js";
|
|
7
7
|
|
|
8
8
|
export { ColorPicker, types_exports as ColorPickerTypes };
|
package/dist/context-menu.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as types_d_exports, t as ContextMenu } from "./index-
|
|
1
|
+
import { n as types_d_exports, t as ContextMenu } from "./index-CbXUh-UU.js";
|
|
2
2
|
export { ContextMenu, types_d_exports as ContextMenuTypes };
|
package/dist/date-picker.js
CHANGED
|
@@ -4,12 +4,12 @@ import "./useFloating-BteZz_UL.js";
|
|
|
4
4
|
import "./Popover-CuTHaY1m.js";
|
|
5
5
|
import "./Icon-DTFfAYeH.js";
|
|
6
6
|
import "./Typography-4iQDPw2N.js";
|
|
7
|
-
import { n as types_exports, t as DatePicker } from "./DatePicker-
|
|
7
|
+
import { n as types_exports, t as DatePicker } from "./DatePicker-Y5IyaCoK.js";
|
|
8
8
|
import "./BasePopover-T1mEexwp.js";
|
|
9
9
|
import "./Label-CaQSxOx8.js";
|
|
10
10
|
import "./ErrorMessage-C_XOzH00.js";
|
|
11
|
-
import "./Loader-
|
|
12
|
-
import "./Button-
|
|
11
|
+
import "./Loader-1l1G52jQ.js";
|
|
12
|
+
import "./Button-BDIvDFeK.js";
|
|
13
13
|
import "./MaskModule-ZvZ8AfTB.js";
|
|
14
14
|
|
|
15
15
|
export { DatePicker, types_exports as DatePickerTypes };
|
package/dist/icon-button.d.ts
CHANGED
|
@@ -1,7 +1,2 @@
|
|
|
1
|
-
import { t as
|
|
2
|
-
|
|
3
|
-
//#region src/components/commons/buttons/IconButton/index.d.ts
|
|
4
|
-
declare const IconButton: React.FC<IconButtonProps>;
|
|
5
|
-
//#endregion
|
|
6
|
-
export { IconButton };
|
|
7
|
-
//# sourceMappingURL=icon-button.d.ts.map
|
|
1
|
+
import { t as IconButton } from "./index-B8FSkZw8.js";
|
|
2
|
+
export { IconButton };
|
package/dist/icon-button.js
CHANGED
|
@@ -14,12 +14,12 @@ declare function createIconButtonStyles(props: IconButtonProps): {
|
|
|
14
14
|
backgroundColor: string;
|
|
15
15
|
boxShadow: "var(--px-shadow-xs)";
|
|
16
16
|
__rules: {
|
|
17
|
-
'&:hover': {
|
|
17
|
+
'&:not(:disabled):hover': {
|
|
18
18
|
opacity: "0.85 !important";
|
|
19
19
|
};
|
|
20
20
|
'&:disabled': {
|
|
21
|
-
opacity: "0.5";
|
|
22
|
-
cursor: "not-allowed";
|
|
21
|
+
opacity: "0.5 !important";
|
|
22
|
+
cursor: "not-allowed !important";
|
|
23
23
|
};
|
|
24
24
|
'&:focus': {
|
|
25
25
|
outlineOffset: string;
|
|
@@ -47,5 +47,8 @@ interface IconButtonProps {
|
|
|
47
47
|
type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg' | (string & {});
|
|
48
48
|
type IconButtonVariant = 'filled' | 'outlined' | 'ghost';
|
|
49
49
|
//#endregion
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
//#region src/components/commons/buttons/IconButton/index.d.ts
|
|
51
|
+
declare const IconButton: React.FC<IconButtonProps>;
|
|
52
|
+
//#endregion
|
|
53
|
+
export { IconButton as t };
|
|
54
|
+
//# sourceMappingURL=index-B8FSkZw8.d.ts.map
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { r as MarginProps } from "./styleProps-BD8T4IXg.js";
|
|
2
|
+
import React from "react";
|
|
3
|
+
|
|
4
|
+
//#region src/components/commons/toolkit/Pagination/types.d.ts
|
|
5
|
+
interface PaginationProps extends MarginProps {
|
|
6
|
+
pageNumber: number;
|
|
7
|
+
totalPages: number;
|
|
8
|
+
onPageChange: (page: number) => void;
|
|
9
|
+
}
|
|
10
|
+
//#endregion
|
|
11
|
+
//#region src/components/commons/toolkit/Pagination/index.d.ts
|
|
12
|
+
declare const Pagination: React.FC<PaginationProps>;
|
|
13
|
+
//#endregion
|
|
14
|
+
export { Pagination as t };
|
|
15
|
+
//# sourceMappingURL=index-BpVdXtFT.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { i as PaddingProps, n as LayoutProps } from "./styleProps-BD8T4IXg.js";
|
|
2
2
|
import { r as TypeStyles } from "./useThemedStyles-v_B4AMSW.js";
|
|
3
3
|
import { n as TypographyVariant } from "./types-DFnFVRW-.js";
|
|
4
|
-
import { MouseEvent, ReactNode } from "react";
|
|
4
|
+
import React, { MouseEvent, ReactNode } from "react";
|
|
5
5
|
|
|
6
6
|
//#region src/components/commons/buttons/Button/styles.d.ts
|
|
7
7
|
declare function createButtonStyles({
|
|
@@ -23,7 +23,6 @@ declare function createButtonStyles({
|
|
|
23
23
|
borderRadius: string;
|
|
24
24
|
cursor: "pointer";
|
|
25
25
|
overflow: "hidden";
|
|
26
|
-
transition: "background-color 0.5s";
|
|
27
26
|
border: string;
|
|
28
27
|
backgroundColor: string;
|
|
29
28
|
boxShadow: "none" | "var(--px-shadow-xs)";
|
|
@@ -119,5 +118,8 @@ interface ButtonProps extends PaddingProps, LayoutProps {
|
|
|
119
118
|
onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
120
119
|
}
|
|
121
120
|
//#endregion
|
|
122
|
-
|
|
123
|
-
|
|
121
|
+
//#region src/components/commons/buttons/Button/index.d.ts
|
|
122
|
+
declare const Button: React.FC<ButtonProps>;
|
|
123
|
+
//#endregion
|
|
124
|
+
export { Button as t };
|
|
125
|
+
//# sourceMappingURL=index-C1oJWGwe.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as TypeStyles } from "./useThemedStyles-v_B4AMSW.js";
|
|
2
2
|
import { n as Placement } from "./types-BX2F9tyU.js";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
|
-
import * as
|
|
4
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
5
|
|
|
6
6
|
//#region src/components/commons/toolkit/ContextMenu/styles.d.ts
|
|
7
7
|
declare function createContextMenuStyles<T>(_props: ContextMenuProps<T>): {
|
|
@@ -68,7 +68,7 @@ interface ContextMenuProps<T> {
|
|
|
68
68
|
}
|
|
69
69
|
//#endregion
|
|
70
70
|
//#region src/components/commons/toolkit/ContextMenu/index.d.ts
|
|
71
|
-
declare const ContextMenu: <T extends string>(props: ContextMenuProps<T>) =>
|
|
71
|
+
declare const ContextMenu: <T extends string>(props: ContextMenuProps<T>) => react_jsx_runtime0.JSX.Element;
|
|
72
72
|
//#endregion
|
|
73
73
|
export { types_d_exports as n, ContextMenu as t };
|
|
74
|
-
//# sourceMappingURL=index-
|
|
74
|
+
//# sourceMappingURL=index-CbXUh-UU.d.ts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { a as TextProps } from "./styleProps-BD8T4IXg.js";
|
|
2
2
|
import { r as TypeStyles } from "./useThemedStyles-v_B4AMSW.js";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react_jsx_runtime1 from "react/jsx-runtime";
|
|
4
4
|
|
|
5
5
|
//#region src/components/commons/inputs/TextArea/styles.d.ts
|
|
6
6
|
declare function createTextAreaStyles(props: TextAreaProps): {
|
|
@@ -67,7 +67,7 @@ interface TextAreaProps {
|
|
|
67
67
|
}
|
|
68
68
|
//#endregion
|
|
69
69
|
//#region src/components/commons/inputs/TextArea/index.d.ts
|
|
70
|
-
declare const TextArea: (props: TextAreaProps) =>
|
|
70
|
+
declare const TextArea: (props: TextAreaProps) => react_jsx_runtime1.JSX.Element;
|
|
71
71
|
//#endregion
|
|
72
72
|
export { TextArea as t };
|
|
73
|
-
//# sourceMappingURL=index-
|
|
73
|
+
//# sourceMappingURL=index-DqN6VEAU.d.ts.map
|
|
@@ -62,6 +62,7 @@ interface SelectProps extends LayoutProps, MarginProps {
|
|
|
62
62
|
strategy?: FloatingOptions['strategy'];
|
|
63
63
|
scrollContainerId?: FloatingOptions['scrollContainerId'];
|
|
64
64
|
absoluteReference?: FloatingOptions['absoluteReference'];
|
|
65
|
+
placement?: FloatingOptions['placement'];
|
|
65
66
|
canClear?: boolean;
|
|
66
67
|
multiple?: boolean;
|
|
67
68
|
required?: boolean;
|
|
@@ -69,6 +70,7 @@ interface SelectProps extends LayoutProps, MarginProps {
|
|
|
69
70
|
hideLabel?: boolean;
|
|
70
71
|
errorMessage?: string;
|
|
71
72
|
maxVisibleItems?: number;
|
|
73
|
+
maxHeightPopover?: string;
|
|
72
74
|
startIcon?: React.ReactNode;
|
|
73
75
|
styles?: TypeStyles<typeof createSelectStyles>;
|
|
74
76
|
requiredColor?: string;
|
|
@@ -84,4 +86,4 @@ interface SelectOption {
|
|
|
84
86
|
declare const Select: React$1.FC<SelectProps>;
|
|
85
87
|
//#endregion
|
|
86
88
|
export { types_d_exports as n, Select as t };
|
|
87
|
-
//# sourceMappingURL=index-
|
|
89
|
+
//# sourceMappingURL=index-pBIduDqF.d.ts.map
|
package/dist/index.d.ts
CHANGED
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
import "./types-DFnFVRW-.js";
|
|
2
|
-
import "./
|
|
3
|
-
import {
|
|
4
|
-
import "./types-3y-Tdp7y.js";
|
|
5
|
-
import { IconButton } from "./icon-button.js";
|
|
2
|
+
import { t as Button } from "./index-C1oJWGwe.js";
|
|
3
|
+
import { t as IconButton } from "./index-B8FSkZw8.js";
|
|
6
4
|
import { n as types_d_exports$1, t as ColorPicker } from "./index-Bi849Kr9.js";
|
|
7
5
|
import { n as types_d_exports$3, t as DatePicker } from "./index-fZ04gsZ4.js";
|
|
8
6
|
import { n as Locale, r as MaskType, t as MaskModule } from "./index-eJLVNRQW.js";
|
|
9
7
|
import { t as Input } from "./index-CZV5emQj.js";
|
|
10
8
|
import { t as SearchInput } from "./index-BRU_Hb91.js";
|
|
11
|
-
import { n as types_d_exports$5, t as Select } from "./index-
|
|
9
|
+
import { n as types_d_exports$5, t as Select } from "./index-pBIduDqF.js";
|
|
12
10
|
import { n as types_d_exports$4 } from "./types-OJFbnHKr.js";
|
|
13
|
-
import { t as TextArea } from "./index-
|
|
11
|
+
import { t as TextArea } from "./index-DqN6VEAU.js";
|
|
14
12
|
import { t as Popover } from "./index-eSlCuBsn.js";
|
|
15
13
|
import { t as BasePopover } from "./index-Clu2R6GI.js";
|
|
16
14
|
import { t as Breadcrumb } from "./index-BoOHjN0S.js";
|
|
@@ -20,9 +18,9 @@ import { t as Checkbox } from "./index-9s-FI1Gu.js";
|
|
|
20
18
|
import { r as types_d_exports } from "./types-DSEbupHr.js";
|
|
21
19
|
import { Chip } from "./chip.js";
|
|
22
20
|
import { t as ChipList } from "./index-DPEtE8HG.js";
|
|
23
|
-
import { n as types_d_exports$2, t as ContextMenu } from "./index-
|
|
21
|
+
import { n as types_d_exports$2, t as ContextMenu } from "./index-CbXUh-UU.js";
|
|
24
22
|
import { InfoSummary, InfoSummaryItem, InfoSummaryProps } from "./info-summary.js";
|
|
25
|
-
import { t as Pagination } from "./index-
|
|
23
|
+
import { t as Pagination } from "./index-BpVdXtFT.js";
|
|
26
24
|
import { t as Switch } from "./index-00GrQzD-.js";
|
|
27
25
|
import { n as types_d_exports$6, t as TabSwitch } from "./index-Dtq014nm.js";
|
|
28
26
|
import { Typography } from "./typography.js";
|
package/dist/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import { n as types_exports$4, t as Popover } from "./Popover-CuTHaY1m.js";
|
|
|
6
6
|
import "./Icon-DTFfAYeH.js";
|
|
7
7
|
import { t as Typography } from "./Typography-4iQDPw2N.js";
|
|
8
8
|
import { t as Checkbox } from "./Checkbox-CL4FsCMu.js";
|
|
9
|
-
import { n as types_exports$3, t as DatePicker } from "./DatePicker-
|
|
9
|
+
import { n as types_exports$3, t as DatePicker } from "./DatePicker-Y5IyaCoK.js";
|
|
10
10
|
import { n as useTheme, t as ThemeProvider } from "./ThemeContext-DxzrC3mU.js";
|
|
11
11
|
import { n as types_exports$6, t as TabSwitch } from "./TabSwitch-O8s4dJ84.js";
|
|
12
12
|
import { t as CheckItem } from "./CheckItem-6gy0IqIA.js";
|
|
@@ -17,16 +17,16 @@ import { n as types_exports, t as Chip } from "./Chip-OmaYp-Yz.js";
|
|
|
17
17
|
import "./Label-CaQSxOx8.js";
|
|
18
18
|
import "./ErrorMessage-C_XOzH00.js";
|
|
19
19
|
import { t as ChipList } from "./ChipList-D2p6LusJ.js";
|
|
20
|
-
import "./
|
|
21
|
-
import { t as
|
|
22
|
-
import
|
|
23
|
-
import { t as
|
|
20
|
+
import { t as IconButton } from "./IconButton-YJZyDEN9.js";
|
|
21
|
+
import { t as Pagination } from "./Pagination-xaORAUQv.js";
|
|
22
|
+
import "./Loader-1l1G52jQ.js";
|
|
23
|
+
import { t as Button } from "./Button-BDIvDFeK.js";
|
|
24
24
|
import { a as Locale, o as MaskType, s as MaskModule } from "./MaskModule-ZvZ8AfTB.js";
|
|
25
25
|
import { t as Input } from "./Input-DYMRwPvz.js";
|
|
26
|
-
import { n as types_exports$5, t as Select } from "./Select-
|
|
26
|
+
import { n as types_exports$5, t as Select } from "./Select-S6mWQinR.js";
|
|
27
27
|
import { t as TextArea } from "./TextArea-KH0JdqJz.js";
|
|
28
28
|
import { t as SearchInput } from "./SearchInput-Bw8FJ2h_.js";
|
|
29
|
-
import { n as types_exports$1, t as ColorPicker } from "./ColorPicker-
|
|
29
|
+
import { n as types_exports$1, t as ColorPicker } from "./ColorPicker-B5O5LXWt.js";
|
|
30
30
|
import { t as Skeleton } from "./Skeleton-D3Rik5Rl.js";
|
|
31
31
|
import { useVirtualAnchor } from "./use-virtual-anchor.js";
|
|
32
32
|
import { t as Breadcrumb } from "./Breadcrumb-D1b9-7H4.js";
|
package/dist/pagination.d.ts
CHANGED