@opengovsg/oui 0.0.22 → 0.0.24
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/cjs/badge/badge.cjs +4 -4
- package/dist/cjs/badge/use-badge.cjs +6 -6
- package/dist/cjs/banner/banner.cjs +3 -3
- package/dist/cjs/button/button.cjs +4 -4
- package/dist/cjs/calendar/calendar-bottom-content.cjs +3 -3
- package/dist/cjs/calendar/calendar-header.cjs +2 -2
- package/dist/cjs/calendar/calendar-month-day-selector.cjs +4 -4
- package/dist/cjs/calendar/calendar.cjs +4 -4
- package/dist/cjs/calendar/hooks/use-calendar-selectors.cjs +4 -4
- package/dist/cjs/calendar/utils.cjs +3 -3
- package/dist/cjs/checkbox/checkbox.cjs +1 -1
- package/dist/cjs/combo-box/combo-box-fuzzy.cjs +6 -6
- package/dist/cjs/combo-box/combo-box-item.cjs +2 -2
- package/dist/cjs/combo-box/combo-box.cjs +5 -5
- package/dist/cjs/date-field/date-field.cjs +4 -4
- package/dist/cjs/date-picker/date-picker.cjs +4 -4
- package/dist/cjs/date-range-picker/date-range-picker.cjs +6 -6
- package/dist/cjs/field/field.cjs +2 -2
- package/dist/cjs/file-dropzone/file-dropzone.cjs +12 -12
- package/dist/cjs/file-dropzone/file-info.cjs +3 -3
- package/dist/cjs/govt-banner/govt-banner.cjs +3 -3
- package/dist/cjs/hooks/use-callback-ref.cjs +4 -4
- package/dist/cjs/hooks/use-controllable-state.cjs +2 -2
- package/dist/cjs/index.cjs +49 -47
- package/dist/cjs/input/input.cjs +2 -2
- package/dist/cjs/menu/menu.cjs +7 -7
- package/dist/cjs/node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/Icon.cjs +4 -4
- package/dist/cjs/node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/createLucideIcon.cjs +3 -3
- package/dist/cjs/node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/plus.cjs +22 -0
- package/dist/cjs/number-field/index.cjs +8 -0
- package/dist/cjs/number-field/number-field.cjs +136 -0
- package/dist/cjs/pagination/hooks/use-pagination.cjs +7 -7
- package/dist/cjs/pagination/pagination.cjs +6 -6
- package/dist/cjs/pagination/use-pagination-item.cjs +7 -8
- package/dist/cjs/pagination/use-pagination.cjs +8 -8
- package/dist/cjs/range-calendar/range-calendar.cjs +6 -6
- package/dist/cjs/ripple/use-ripple.cjs +4 -4
- package/dist/cjs/select/select.cjs +4 -4
- package/dist/cjs/spinner/use-spinner.cjs +3 -3
- package/dist/cjs/system/react-utils/context.cjs +3 -3
- package/dist/cjs/system/react-utils/refs.cjs +3 -3
- package/dist/cjs/system/utils.cjs +3 -3
- package/dist/cjs/tabs/tabs.cjs +2 -2
- package/dist/cjs/tag-field/tag-field-item.cjs +2 -2
- package/dist/cjs/tag-field/tag-field-list.cjs +4 -4
- package/dist/cjs/tag-field/tag-field-root.cjs +14 -14
- package/dist/cjs/tag-field/tag-field-state-context.cjs +2 -2
- package/dist/cjs/tag-field/tag-field-tag-list.cjs +3 -3
- package/dist/cjs/tag-field/tag-field-trigger.cjs +2 -2
- package/dist/cjs/tag-field/tag-field.cjs +5 -5
- package/dist/cjs/tag-field/use-tag-field-state.cjs +6 -6
- package/dist/cjs/tag-field/use-tag-field.cjs +4 -4
- package/dist/cjs/text-area/text-area.cjs +2 -2
- package/dist/cjs/text-area-field/text-area-field.cjs +1 -1
- package/dist/cjs/text-field/text-field.cjs +1 -1
- package/dist/cjs/toggle/toggle.cjs +3 -3
- package/dist/esm/button/button.js +1 -1
- package/dist/esm/calendar/calendar-month-day-selector.js +2 -2
- package/dist/esm/checkbox/checkbox.js +1 -1
- package/dist/esm/combo-box/combo-box.js +2 -2
- package/dist/esm/date-field/date-field.js +1 -1
- package/dist/esm/date-picker/date-picker.js +2 -2
- package/dist/esm/date-range-picker/date-range-picker.js +3 -3
- package/dist/esm/file-dropzone/file-dropzone.js +2 -2
- package/dist/esm/index.js +18 -17
- package/dist/esm/menu/menu.js +1 -1
- package/dist/esm/node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/plus.js +17 -0
- package/dist/esm/number-field/index.js +2 -0
- package/dist/esm/number-field/number-field.js +134 -0
- package/dist/esm/pagination/use-pagination-item.js +5 -6
- package/dist/esm/select/select.js +2 -2
- package/dist/esm/tag-field/tag-field.js +3 -3
- package/dist/esm/text-area-field/text-area-field.js +1 -1
- package/dist/esm/text-field/text-field.js +1 -1
- package/dist/types/index.d.mts +1 -0
- package/dist/types/index.d.ts +1 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/menu/menu.d.ts.map +1 -1
- package/dist/types/number-field/index.d.ts +3 -0
- package/dist/types/number-field/index.d.ts.map +1 -0
- package/dist/types/number-field/number-field.d.ts +24 -0
- package/dist/types/number-field/number-field.d.ts.map +1 -0
- package/package.json +11 -8
- package/dist/cjs/node_modules/.pnpm/@react-aria_focus@3.20.5_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/focus/dist/useFocusRing.cjs +0 -45
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/context.cjs +0 -21
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/textSelection.cjs +0 -72
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocus.cjs +0 -60
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocusVisible.cjs +0 -210
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocusWithin.cjs +0 -100
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useHover.cjs +0 -152
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/usePress.cjs +0 -676
- package/dist/cjs/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/utils.cjs +0 -160
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_check_private_redeclaration.cjs +0 -9
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.cjs +0 -9
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.cjs +0 -16
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.cjs +0 -9
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_get.cjs +0 -11
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_init.cjs +0 -10
- package/dist/cjs/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_set.cjs +0 -12
- package/dist/esm/node_modules/.pnpm/@react-aria_focus@3.20.5_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/focus/dist/useFocusRing.js +0 -43
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/context.js +0 -19
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/textSelection.js +0 -69
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocus.js +0 -58
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocusVisible.js +0 -205
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useFocusWithin.js +0 -98
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/useHover.js +0 -150
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/usePress.js +0 -674
- package/dist/esm/node_modules/.pnpm/@react-aria_interactions@3.25.3_react-dom@19.0.0_react@19.0.0__react@19.0.0/node_modules/@react-aria/interactions/dist/utils.js +0 -155
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_check_private_redeclaration.js +0 -7
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.js +0 -7
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.js +0 -14
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.js +0 -7
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_get.js +0 -9
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_init.js +0 -8
- package/dist/esm/node_modules/.pnpm/@swc_helpers@0.5.17/node_modules/@swc/helpers/esm/_class_private_field_set.js +0 -10
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"use client";
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var react = require('react');
|
|
6
6
|
var scrollIntoView = require('scroll-into-view-if-needed');
|
|
7
7
|
var useDeepCompare = require('use-deep-compare');
|
|
8
8
|
var usehooksTs = require('usehooks-ts');
|
|
@@ -37,9 +37,9 @@ function usePagination(originalProps) {
|
|
|
37
37
|
} = props;
|
|
38
38
|
const Component = as || "nav";
|
|
39
39
|
const domRef = refs.useDomRef(ref);
|
|
40
|
-
const cursorRef =
|
|
41
|
-
const itemsRef =
|
|
42
|
-
const cursorTimer =
|
|
40
|
+
const cursorRef = react.useRef(null);
|
|
41
|
+
const itemsRef = react.useRef(null);
|
|
42
|
+
const cursorTimer = react.useRef(null);
|
|
43
43
|
const disableAnimation = originalProps?.disableAnimation ?? false;
|
|
44
44
|
const disableCursorAnimation = originalProps?.disableCursorAnimation ?? disableAnimation ?? false;
|
|
45
45
|
function getItemsRefMap() {
|
|
@@ -56,7 +56,7 @@ function usePagination(originalProps) {
|
|
|
56
56
|
map.delete(value);
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
|
-
const scrollTo =
|
|
59
|
+
const scrollTo = react.useCallback(
|
|
60
60
|
(value, skipAnimation) => {
|
|
61
61
|
const map = getItemsRefMap();
|
|
62
62
|
const node = map.get(value);
|
|
@@ -103,13 +103,13 @@ function usePagination(originalProps) {
|
|
|
103
103
|
onChange
|
|
104
104
|
});
|
|
105
105
|
const [setRef, isVisible] = usehooksTs.useIntersectionObserver();
|
|
106
|
-
|
|
106
|
+
react.useEffect(() => {
|
|
107
107
|
if (domRef.current) {
|
|
108
108
|
setRef(domRef.current);
|
|
109
109
|
}
|
|
110
110
|
}, [domRef, setRef]);
|
|
111
|
-
const activePageRef =
|
|
112
|
-
|
|
111
|
+
const activePageRef = react.useRef(activePage);
|
|
112
|
+
react.useEffect(() => {
|
|
113
113
|
if (activePage && !disableAnimation && isVisible) {
|
|
114
114
|
scrollTo(activePage, activePage === activePageRef.current);
|
|
115
115
|
}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var date = require('@internationalized/date');
|
|
8
8
|
var reactAriaComponents = require('react-aria-components');
|
|
9
9
|
var useDeepCompare = require('use-deep-compare');
|
|
@@ -36,7 +36,7 @@ const RangeCalendar = utils.forwardRefGeneric(function RangeCalendar2(originalPr
|
|
|
36
36
|
() => ouiTheme.calendarStyles({ ...variantProps, isRange: true }),
|
|
37
37
|
[variantProps]
|
|
38
38
|
);
|
|
39
|
-
const context =
|
|
39
|
+
const context = react.useMemo(
|
|
40
40
|
() => ({
|
|
41
41
|
slots,
|
|
42
42
|
classNames,
|
|
@@ -46,7 +46,7 @@ const RangeCalendar = utils.forwardRefGeneric(function RangeCalendar2(originalPr
|
|
|
46
46
|
[className, classNames, slots, variantProps.size]
|
|
47
47
|
);
|
|
48
48
|
const numberOfVisibleMonths = props.visibleDuration?.months ?? 1;
|
|
49
|
-
const dateToHighlight =
|
|
49
|
+
const dateToHighlight = react.useMemo(() => {
|
|
50
50
|
if (props.defaultFocusedValue !== void 0) {
|
|
51
51
|
return props.defaultFocusedValue;
|
|
52
52
|
}
|
|
@@ -140,7 +140,7 @@ const RangeCalendar = utils.forwardRefGeneric(function RangeCalendar2(originalPr
|
|
|
140
140
|
const RangeCalendarStateWrapper = ({
|
|
141
141
|
children
|
|
142
142
|
}) => {
|
|
143
|
-
const state =
|
|
143
|
+
const state = react.useContext(reactAriaComponents.RangeCalendarStateContext);
|
|
144
144
|
return /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Provider, { values: [[agnosticCalendarStateContext.AgnosticCalendarStateContext, state]], children });
|
|
145
145
|
};
|
|
146
146
|
const RangeCalendarCell = ({
|
|
@@ -150,9 +150,9 @@ const RangeCalendarCell = ({
|
|
|
150
150
|
firstDayOfWeek
|
|
151
151
|
}) => {
|
|
152
152
|
const { classNames, slots } = calendarStyleContext.useCalendarStyleContext();
|
|
153
|
-
const state =
|
|
153
|
+
const state = react.useContext(agnosticCalendarStateContext.AgnosticCalendarStateContext);
|
|
154
154
|
const { locale } = reactAriaComponents.useLocale();
|
|
155
|
-
const dataAttributes =
|
|
155
|
+
const dataAttributes = react.useMemo(() => {
|
|
156
156
|
const isDateHighlighted = dateToHighlight ? date$1.compare(dateToHighlight) === 0 : false;
|
|
157
157
|
const isSelected = state.isSelected(date$1);
|
|
158
158
|
const isDisabled = state.isCellDisabled(date$1);
|
|
@@ -2,12 +2,12 @@
|
|
|
2
2
|
"use client";
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var react = require('react');
|
|
6
6
|
var nanoid = require('nanoid');
|
|
7
7
|
|
|
8
8
|
const useRipple = () => {
|
|
9
|
-
const [ripples, setRipples] =
|
|
10
|
-
const onPress =
|
|
9
|
+
const [ripples, setRipples] = react.useState([]);
|
|
10
|
+
const onPress = react.useCallback((event) => {
|
|
11
11
|
const trigger = event.target;
|
|
12
12
|
const size = Math.max(trigger.clientWidth, trigger.clientHeight);
|
|
13
13
|
setRipples((prevRipples) => [
|
|
@@ -20,7 +20,7 @@ const useRipple = () => {
|
|
|
20
20
|
}
|
|
21
21
|
]);
|
|
22
22
|
}, []);
|
|
23
|
-
const onClear =
|
|
23
|
+
const onClear = react.useCallback((key) => {
|
|
24
24
|
setRipples((prevState) => prevState.filter((ripple) => ripple.key !== key));
|
|
25
25
|
}, []);
|
|
26
26
|
return { ripples, onPress, onClear };
|
|
@@ -3,14 +3,14 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
9
|
+
var field = require('../field/field.cjs');
|
|
10
|
+
var popover = require('../popover/popover.cjs');
|
|
9
11
|
var utils = require('../system/utils.cjs');
|
|
10
12
|
var selectVariantContext = require('./select-variant-context.cjs');
|
|
11
|
-
var field = require('../field/field.cjs');
|
|
12
13
|
var chevronDown = require('../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-down.cjs');
|
|
13
|
-
var popover = require('../popover/popover.cjs');
|
|
14
14
|
var button = require('../button/button.cjs');
|
|
15
15
|
|
|
16
16
|
const calculateEstimatedRowHeight = (size) => {
|
|
@@ -36,7 +36,7 @@ function Select({
|
|
|
36
36
|
);
|
|
37
37
|
const { items, children, listLayoutOptions, ...props } = _props;
|
|
38
38
|
const styles = ouiTheme.selectStyles(variantProps);
|
|
39
|
-
const layoutOptions =
|
|
39
|
+
const layoutOptions = react.useMemo(() => {
|
|
40
40
|
return {
|
|
41
41
|
estimatedRowHeight: calculateEstimatedRowHeight(
|
|
42
42
|
variantProps.size ?? "md"
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"use client";
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var react = require('react');
|
|
6
6
|
var useDeepCompare = require('use-deep-compare');
|
|
7
7
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
8
8
|
var utils = require('../system/utils.cjs');
|
|
@@ -18,10 +18,10 @@ const useSpinner = (originalProps) => {
|
|
|
18
18
|
[variantProps]
|
|
19
19
|
);
|
|
20
20
|
const baseStyles = ouiTheme.cn(classNames?.base, className);
|
|
21
|
-
const ariaLabel =
|
|
21
|
+
const ariaLabel = react.useMemo(() => {
|
|
22
22
|
return !otherProps["aria-label"] ? "Loading" : "";
|
|
23
23
|
}, [otherProps["aria-label"]]);
|
|
24
|
-
const getSpinnerProps =
|
|
24
|
+
const getSpinnerProps = react.useCallback(
|
|
25
25
|
() => ({
|
|
26
26
|
"aria-label": ariaLabel,
|
|
27
27
|
role: "progressbar",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
|
|
6
6
|
function createContext(options = {}) {
|
|
7
7
|
const {
|
|
@@ -10,10 +10,10 @@ function createContext(options = {}) {
|
|
|
10
10
|
name,
|
|
11
11
|
defaultValue
|
|
12
12
|
} = options;
|
|
13
|
-
const Context =
|
|
13
|
+
const Context = react.createContext(defaultValue);
|
|
14
14
|
Context.displayName = name;
|
|
15
15
|
function useContext() {
|
|
16
|
-
const context =
|
|
16
|
+
const context = react.useContext(Context);
|
|
17
17
|
if (!context && strict) {
|
|
18
18
|
const error = new Error(errorMessage);
|
|
19
19
|
error.name = "ContextError";
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
|
|
6
6
|
function useDomRef(ref) {
|
|
7
|
-
const domRef =
|
|
8
|
-
|
|
7
|
+
const domRef = react.useRef(null);
|
|
8
|
+
react.useImperativeHandle(ref, () => domRef.current);
|
|
9
9
|
return domRef;
|
|
10
10
|
}
|
|
11
11
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
|
|
6
6
|
function forwardRef(component) {
|
|
7
|
-
return
|
|
7
|
+
return react.forwardRef(component);
|
|
8
8
|
}
|
|
9
9
|
function forwardRefGeneric(render) {
|
|
10
10
|
return forwardRef(render);
|
|
@@ -38,7 +38,7 @@ function useRenderProps(props) {
|
|
|
38
38
|
defaultStyle,
|
|
39
39
|
values
|
|
40
40
|
} = props;
|
|
41
|
-
return
|
|
41
|
+
return react.useMemo(() => {
|
|
42
42
|
let computedClassName;
|
|
43
43
|
let computedStyle;
|
|
44
44
|
let computedChildren;
|
package/dist/cjs/tabs/tabs.cjs
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
9
9
|
var utils = require('../system/utils.cjs');
|
|
@@ -51,7 +51,7 @@ const TabList = utils.forwardRefGeneric(function TabList2(originalProps, ref) {
|
|
|
51
51
|
}
|
|
52
52
|
);
|
|
53
53
|
});
|
|
54
|
-
const Tab =
|
|
54
|
+
const Tab = react.forwardRef(function Tab2(originalProps, ref) {
|
|
55
55
|
[originalProps, ref] = reactAriaComponents.useContextProps(
|
|
56
56
|
originalProps,
|
|
57
57
|
ref,
|
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
8
8
|
var utils = require('../system/utils.cjs');
|
|
9
9
|
var tagFieldStateContext = require('./tag-field-state-context.cjs');
|
|
10
10
|
|
|
11
11
|
const TagFieldItemInner = ({ item, isHighlighted, classNames, ...itemProps }, ref) => {
|
|
12
|
-
const { itemToText, size } =
|
|
12
|
+
const { itemToText, size } = react.useContext(tagFieldStateContext.TagFieldStateContext);
|
|
13
13
|
const styles = ouiTheme.listBoxItemStyles({ size });
|
|
14
14
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15
15
|
"li",
|
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var utils = require('../system/utils.cjs');
|
|
9
9
|
var tagFieldItem = require('./tag-field-item.cjs');
|
|
10
10
|
var tagFieldStateContext = require('./tag-field-state-context.cjs');
|
|
11
11
|
|
|
12
|
-
const TagFieldListContext =
|
|
12
|
+
const TagFieldListContext = react.createContext(null);
|
|
13
13
|
const TagFieldListInner = (props, ref) => {
|
|
14
14
|
[props, ref] = reactAriaComponents.useContextProps(props, ref, TagFieldListContext);
|
|
15
|
-
const { items, getItemProps, highlightedIndex } =
|
|
15
|
+
const { items, getItemProps, highlightedIndex } = react.useContext(tagFieldStateContext.TagFieldStateContext);
|
|
16
16
|
const { slot, rowVirtualizer, itemClassNames, ...rest } = props;
|
|
17
17
|
return /* @__PURE__ */ jsxRuntime.jsx("ul", { slot: slot ?? void 0, ref, ...rest, children: props.children !== void 0 && typeof props.children !== "function" ? props.children : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
18
18
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -46,7 +46,7 @@ const TagFieldListInner = (props, ref) => {
|
|
|
46
46
|
if (typeof props.children === "function") {
|
|
47
47
|
return props.children({ ...childProps, itemProps });
|
|
48
48
|
}
|
|
49
|
-
return /* @__PURE__ */
|
|
49
|
+
return /* @__PURE__ */ react.createElement(
|
|
50
50
|
tagFieldItem.TagFieldItem,
|
|
51
51
|
{
|
|
52
52
|
...childProps,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var
|
|
5
|
+
var react = require('react');
|
|
6
6
|
var utils$1 = require('@react-aria/utils');
|
|
7
7
|
var lodashEs = require('lodash-es');
|
|
8
8
|
var reactAria = require('react-aria');
|
|
@@ -30,26 +30,26 @@ function TagFieldRoot({
|
|
|
30
30
|
...props
|
|
31
31
|
}) {
|
|
32
32
|
const { itemToKey: defaultItemToKey, itemToText: defaultItemToText } = props;
|
|
33
|
-
const virtualRowHeight =
|
|
33
|
+
const virtualRowHeight = react.useMemo(
|
|
34
34
|
() => _virtualRowHeight ?? calculateEstimatedRowHeight(props.size ?? "md"),
|
|
35
35
|
[_virtualRowHeight, props.size]
|
|
36
36
|
);
|
|
37
37
|
const { contains } = reactAria.useFilter({ sensitivity: "base" });
|
|
38
|
-
const itemToText =
|
|
38
|
+
const itemToText = react.useCallback(
|
|
39
39
|
(item) => {
|
|
40
40
|
if (defaultItemToText) return defaultItemToText(item);
|
|
41
41
|
return String(lodashEs.get(item, "textValue") ?? String(item));
|
|
42
42
|
},
|
|
43
43
|
[defaultItemToText]
|
|
44
44
|
);
|
|
45
|
-
const itemToKey =
|
|
45
|
+
const itemToKey = react.useCallback(
|
|
46
46
|
(item) => {
|
|
47
47
|
if (defaultItemToKey) return defaultItemToKey(item);
|
|
48
48
|
return String(lodashEs.get(item, "id") ?? String(item));
|
|
49
49
|
},
|
|
50
50
|
[defaultItemToKey]
|
|
51
51
|
);
|
|
52
|
-
const onSelectionChange =
|
|
52
|
+
const onSelectionChange = react.useCallback(
|
|
53
53
|
(nextItems) => {
|
|
54
54
|
if (props.onSelectionChange) {
|
|
55
55
|
props.onSelectionChange(new Set(nextItems.map(itemToKey)));
|
|
@@ -66,12 +66,12 @@ function TagFieldRoot({
|
|
|
66
66
|
});
|
|
67
67
|
const { validationBehavior: formValidationBehavior } = reactAriaComponents.useSlottedContext(reactAriaComponents.FormContext) || {};
|
|
68
68
|
props.validationBehavior ?? formValidationBehavior ?? "native";
|
|
69
|
-
const fieldRef =
|
|
70
|
-
const popoverRef =
|
|
71
|
-
const listBoxRef =
|
|
72
|
-
const labelRef =
|
|
73
|
-
const inputRef =
|
|
74
|
-
const buttonRef =
|
|
69
|
+
const fieldRef = react.useRef(null);
|
|
70
|
+
const popoverRef = react.useRef(null);
|
|
71
|
+
const listBoxRef = react.useRef(null);
|
|
72
|
+
const labelRef = react.useRef(null);
|
|
73
|
+
const inputRef = react.useRef(null);
|
|
74
|
+
const buttonRef = react.useRef(null);
|
|
75
75
|
const {
|
|
76
76
|
tagFieldProps,
|
|
77
77
|
buttonProps,
|
|
@@ -94,8 +94,8 @@ function TagFieldRoot({
|
|
|
94
94
|
buttonRef},
|
|
95
95
|
state
|
|
96
96
|
);
|
|
97
|
-
const [menuWidth, setMenuWidth] =
|
|
98
|
-
const onResize =
|
|
97
|
+
const [menuWidth, setMenuWidth] = react.useState(null);
|
|
98
|
+
const onResize = react.useCallback(() => {
|
|
99
99
|
if (fieldRef.current) {
|
|
100
100
|
const fieldRect = fieldRef.current.getBoundingClientRect();
|
|
101
101
|
setMenuWidth(fieldRect.right - fieldRect.left + "px");
|
|
@@ -105,7 +105,7 @@ function TagFieldRoot({
|
|
|
105
105
|
ref: fieldRef,
|
|
106
106
|
onResize
|
|
107
107
|
});
|
|
108
|
-
const renderPropsState =
|
|
108
|
+
const renderPropsState = react.useMemo(
|
|
109
109
|
() => ({
|
|
110
110
|
isOpen: tagFieldProps.isOpen,
|
|
111
111
|
isDisabled: props.isDisabled || false,
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
|
|
6
6
|
const TagFieldStateContext = (
|
|
7
7
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8
|
-
|
|
8
|
+
react.createContext(null)
|
|
9
9
|
);
|
|
10
10
|
|
|
11
11
|
exports.TagFieldStateContext = TagFieldStateContext;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var
|
|
5
|
+
var react = require('react');
|
|
6
6
|
var tagFieldStateContext = require('./tag-field-state-context.cjs');
|
|
7
7
|
var x = require('../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/x.cjs');
|
|
8
8
|
|
|
@@ -17,8 +17,8 @@ const TagFieldTagList = ({
|
|
|
17
17
|
isDisabled,
|
|
18
18
|
isReadOnly,
|
|
19
19
|
itemToText
|
|
20
|
-
} =
|
|
21
|
-
const handleRemoveSelectedItem =
|
|
20
|
+
} = react.useContext(tagFieldStateContext.TagFieldStateContext);
|
|
21
|
+
const handleRemoveSelectedItem = react.useCallback(
|
|
22
22
|
(item) => () => {
|
|
23
23
|
if (isDisabled || isReadOnly) return;
|
|
24
24
|
removeSelectedItem(item);
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var utils = require('../system/utils.cjs');
|
|
9
9
|
|
|
10
|
-
const TagFieldTriggerContext =
|
|
10
|
+
const TagFieldTriggerContext = react.createContext({});
|
|
11
11
|
const TagFieldTrigger = utils.forwardRef(
|
|
12
12
|
(props, ref) => {
|
|
13
13
|
[props, ref] = reactAriaComponents.useContextProps(props, ref, TagFieldTriggerContext);
|
|
@@ -3,18 +3,18 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
9
|
+
var field = require('../field/field.cjs');
|
|
10
|
+
var input = require('../input/input.cjs');
|
|
11
|
+
var popover = require('../popover/popover.cjs');
|
|
9
12
|
var tagFieldItem = require('./tag-field-item.cjs');
|
|
10
13
|
var tagFieldList = require('./tag-field-list.cjs');
|
|
11
14
|
var tagFieldRoot = require('./tag-field-root.cjs');
|
|
12
15
|
var tagFieldTagList = require('./tag-field-tag-list.cjs');
|
|
13
16
|
var tagFieldTrigger = require('./tag-field-trigger.cjs');
|
|
14
17
|
var chevronDown = require('../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-down.cjs');
|
|
15
|
-
var field = require('../field/field.cjs');
|
|
16
|
-
var input = require('../input/input.cjs');
|
|
17
|
-
var popover = require('../popover/popover.cjs');
|
|
18
18
|
|
|
19
19
|
function TagField({
|
|
20
20
|
classNames,
|
|
@@ -99,7 +99,7 @@ function TagField({
|
|
|
99
99
|
{
|
|
100
100
|
className: styles.list({ className: classNames?.list }),
|
|
101
101
|
itemClassNames: props.itemClassNames,
|
|
102
|
-
children: ({ key, itemProps, ...props2 }) => children ? children({ key, itemProps, ...props2 }) : /* @__PURE__ */
|
|
102
|
+
children: ({ key, itemProps, ...props2 }) => children ? children({ key, itemProps, ...props2 }) : /* @__PURE__ */ react.createElement(tagFieldItem.TagFieldItem, { ...props2, ...itemProps, key })
|
|
103
103
|
}
|
|
104
104
|
) })
|
|
105
105
|
] });
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
var form = require('@react-stately/form');
|
|
6
6
|
var utils = require('@react-stately/utils');
|
|
7
7
|
var useControllableState = require('../hooks/use-controllable-state.cjs');
|
|
8
8
|
|
|
9
9
|
function useTagFieldState(props) {
|
|
10
10
|
const { itemToText, itemToKey, defaultFilter } = props;
|
|
11
|
-
const itemsByKey =
|
|
11
|
+
const itemsByKey = react.useMemo(() => {
|
|
12
12
|
const items = props.items ?? props.defaultItems ?? [];
|
|
13
13
|
return items.reduce(
|
|
14
14
|
(acc, item) => {
|
|
@@ -18,7 +18,7 @@ function useTagFieldState(props) {
|
|
|
18
18
|
{}
|
|
19
19
|
) ?? {};
|
|
20
20
|
}, [itemToKey, props.defaultItems, props.items]);
|
|
21
|
-
const getSelectedItemsByKey =
|
|
21
|
+
const getSelectedItemsByKey = react.useCallback(
|
|
22
22
|
(keys) => {
|
|
23
23
|
if (!keys) return;
|
|
24
24
|
return [...keys].map((key) => itemsByKey[key]);
|
|
@@ -36,13 +36,13 @@ function useTagFieldState(props) {
|
|
|
36
36
|
defaultInputValue,
|
|
37
37
|
props.onInputChange
|
|
38
38
|
);
|
|
39
|
-
const controlledSelectedKeys =
|
|
39
|
+
const controlledSelectedKeys = react.useMemo(
|
|
40
40
|
() => new Set(selectedItems.map(itemToKey)),
|
|
41
41
|
[itemToKey, selectedItems]
|
|
42
42
|
);
|
|
43
43
|
const validation = form.useFormValidationState({
|
|
44
44
|
...props,
|
|
45
|
-
value:
|
|
45
|
+
value: react.useMemo(
|
|
46
46
|
() => ({
|
|
47
47
|
inputValue,
|
|
48
48
|
selectedKeys: controlledSelectedKeys
|
|
@@ -50,7 +50,7 @@ function useTagFieldState(props) {
|
|
|
50
50
|
[controlledSelectedKeys, inputValue]
|
|
51
51
|
)
|
|
52
52
|
});
|
|
53
|
-
const filteredItems =
|
|
53
|
+
const filteredItems = react.useMemo(
|
|
54
54
|
() => (
|
|
55
55
|
// No default filter if items are controlled.
|
|
56
56
|
!!props.items || !defaultFilter ? props.items ?? [] : filterItems({
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var react = require('react');
|
|
5
5
|
var utils = require('@react-aria/utils');
|
|
6
6
|
var reactVirtual = require('@tanstack/react-virtual');
|
|
7
7
|
var downshift = require('downshift');
|
|
@@ -23,7 +23,7 @@ function useTagField(props, state) {
|
|
|
23
23
|
label,
|
|
24
24
|
virtualRowHeight = 40
|
|
25
25
|
} = props;
|
|
26
|
-
const backupBtnRef =
|
|
26
|
+
const backupBtnRef = react.useRef(null);
|
|
27
27
|
buttonRef = buttonRef ?? backupBtnRef;
|
|
28
28
|
const {
|
|
29
29
|
selectedItems,
|
|
@@ -48,14 +48,14 @@ function useTagField(props, state) {
|
|
|
48
48
|
}
|
|
49
49
|
}
|
|
50
50
|
});
|
|
51
|
-
const disabledKeysSet =
|
|
51
|
+
const disabledKeysSet = react.useMemo(() => {
|
|
52
52
|
return new Set(disabledKeys);
|
|
53
53
|
}, [disabledKeys]);
|
|
54
54
|
const rowVirtualizer = reactVirtual.useVirtualizer({
|
|
55
55
|
count: items.length,
|
|
56
56
|
getScrollElement: () => listBoxRef.current,
|
|
57
57
|
estimateSize: () => virtualRowHeight,
|
|
58
|
-
getItemKey:
|
|
58
|
+
getItemKey: react.useCallback(
|
|
59
59
|
(index) => itemToKey(items[index]),
|
|
60
60
|
[itemToKey, items]
|
|
61
61
|
),
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
9
9
|
|
|
10
|
-
const TextArea =
|
|
10
|
+
const TextArea = react.forwardRef(
|
|
11
11
|
({ size, variant, isDisabled, ...props }, ref) => {
|
|
12
12
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
13
13
|
reactAriaComponents.TextArea,
|
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
var reactAriaComponents = require('react-aria-components');
|
|
7
7
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
8
|
-
var textArea = require('../text-area/text-area.cjs');
|
|
9
8
|
var field = require('../field/field.cjs');
|
|
9
|
+
var textArea = require('../text-area/text-area.cjs');
|
|
10
10
|
|
|
11
11
|
function TextAreaField({
|
|
12
12
|
label,
|
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
var reactAriaComponents = require('react-aria-components');
|
|
7
7
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
8
|
-
var input = require('../input/input.cjs');
|
|
9
8
|
var field = require('../field/field.cjs');
|
|
9
|
+
var input = require('../input/input.cjs');
|
|
10
10
|
|
|
11
11
|
function TextField({
|
|
12
12
|
label,
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
'use strict';
|
|
4
4
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
var
|
|
6
|
+
var react = require('react');
|
|
7
7
|
var reactAria = require('react-aria');
|
|
8
8
|
var reactAriaComponents = require('react-aria-components');
|
|
9
9
|
var ouiTheme = require('@opengovsg/oui-theme');
|
|
@@ -21,12 +21,12 @@ const Toggle = ({
|
|
|
21
21
|
ouiTheme.toggleStyles.variantKeys
|
|
22
22
|
);
|
|
23
23
|
const slots = ouiTheme.toggleStyles(variantProps);
|
|
24
|
-
const clonedThumbIcon =
|
|
24
|
+
const clonedThumbIcon = react.useCallback(
|
|
25
25
|
(renderProps) => {
|
|
26
26
|
const baseProps = {
|
|
27
27
|
className: slots.thumbIcon({ className: classNames?.thumbIcon })
|
|
28
28
|
};
|
|
29
|
-
return typeof thumbIcon === "function" ? thumbIcon(reactAria.mergeProps(baseProps, renderProps)) : thumbIcon &&
|
|
29
|
+
return typeof thumbIcon === "function" ? thumbIcon(reactAria.mergeProps(baseProps, renderProps)) : thumbIcon && react.cloneElement(thumbIcon, baseProps);
|
|
30
30
|
},
|
|
31
31
|
[classNames?.thumbIcon, slots, thumbIcon]
|
|
32
32
|
);
|
|
@@ -5,9 +5,9 @@ import { forwardRef, useMemo } from 'react';
|
|
|
5
5
|
import { chain } from '@react-aria/utils';
|
|
6
6
|
import { Button as Button$1, composeRenderProps } from 'react-aria-components';
|
|
7
7
|
import { buttonStyles } from '@opengovsg/oui-theme';
|
|
8
|
+
import { Ripple } from '../ripple/ripple.js';
|
|
8
9
|
import { useRipple } from '../ripple/use-ripple.js';
|
|
9
10
|
import { Spinner } from '../spinner/spinner.js';
|
|
10
|
-
import { Ripple } from '../ripple/ripple.js';
|
|
11
11
|
|
|
12
12
|
const Button = forwardRef(
|
|
13
13
|
({
|
|
@@ -4,11 +4,11 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
4
4
|
import { useContext } from 'react';
|
|
5
5
|
import { CalendarDate } from '@internationalized/date';
|
|
6
6
|
import { Group } from 'react-aria-components';
|
|
7
|
+
import { Select } from '../select/select.js';
|
|
8
|
+
import { SelectItem } from '../select/select-item.js';
|
|
7
9
|
import { AgnosticCalendarStateContext } from './agnostic-calendar-state-context.js';
|
|
8
10
|
import { useCalendarStyleContext } from './calendar-style-context.js';
|
|
9
11
|
import { useCalendarSelectors } from './hooks/use-calendar-selectors.js';
|
|
10
|
-
import { Select } from '../select/select.js';
|
|
11
|
-
import { SelectItem } from '../select/select-item.js';
|
|
12
12
|
import { useCalendarI18n } from './hooks/use-calendar-i18n.js';
|
|
13
13
|
|
|
14
14
|
const CalendarMonthDaySelector = () => {
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
4
|
import { Checkbox as Checkbox$1, composeRenderProps, Provider, CheckboxGroup as CheckboxGroup$1 } from 'react-aria-components';
|
|
5
5
|
import { checkboxStyles, checkboxGroupStyles } from '@opengovsg/oui-theme';
|
|
6
|
+
import { Label, Description, FieldError } from '../field/field.js';
|
|
6
7
|
import { mapPropsVariants } from '../system/utils.js';
|
|
7
8
|
import { useCheckboxGroupStyleContext, CheckboxGroupStyleContext } from './checkbox-group-style-context.js';
|
|
8
9
|
import Minus from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/minus.js';
|
|
9
10
|
import Check from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/check.js';
|
|
10
|
-
import { Label, Description, FieldError } from '../field/field.js';
|
|
11
11
|
|
|
12
12
|
const Checkbox = ({
|
|
13
13
|
classNames,
|