@codefast/ui 0.3.9 → 0.3.10
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/CHANGELOG.md +11 -0
- package/dist/components/accordion.cjs +97 -1
- package/dist/components/accordion.d.ts +4 -4
- package/dist/components/accordion.js +51 -1
- package/dist/components/alert-dialog.cjs +155 -1
- package/dist/components/alert-dialog.d.ts +11 -11
- package/dist/components/alert-dialog.js +94 -1
- package/dist/components/alert.cjs +84 -1
- package/dist/components/alert.d.ts +5 -5
- package/dist/components/alert.js +41 -1
- package/dist/components/aspect-ratio.cjs +43 -1
- package/dist/components/aspect-ratio.d.ts +2 -2
- package/dist/components/aspect-ratio.js +9 -1
- package/dist/components/avatar.cjs +65 -1
- package/dist/components/avatar.d.ts +2 -2
- package/dist/components/avatar.js +25 -1
- package/dist/components/badge.cjs +66 -1
- package/dist/components/badge.d.ts +3 -3
- package/dist/components/badge.js +29 -1
- package/dist/components/breadcrumb.cjs +126 -1
- package/dist/components/breadcrumb.d.ts +8 -8
- package/dist/components/breadcrumb.js +74 -1
- package/dist/components/button-group.cjs +86 -1
- package/dist/components/button-group.d.ts +5 -5
- package/dist/components/button-group.js +43 -1
- package/dist/components/button.cjs +92 -1
- package/dist/components/button.d.ts +6 -6
- package/dist/components/button.js +55 -1
- package/dist/components/calendar.cjs +150 -1
- package/dist/components/calendar.d.ts +12 -19
- package/dist/components/calendar.js +113 -1
- package/dist/components/card.cjs +105 -1
- package/dist/components/card.d.ts +8 -8
- package/dist/components/card.js +53 -1
- package/dist/components/carousel.cjs +210 -1
- package/dist/components/carousel.d.ts +10 -10
- package/dist/components/carousel.js +151 -1
- package/dist/components/chart.cjs +250 -3
- package/dist/components/chart.d.ts +9 -9
- package/dist/components/chart.js +198 -3
- package/dist/components/checkbox-cards.cjs +69 -1
- package/dist/components/checkbox-cards.d.ts +2 -2
- package/dist/components/checkbox-cards.js +32 -1
- package/dist/components/checkbox-group.cjs +63 -1
- package/dist/components/checkbox-group.d.ts +2 -2
- package/dist/components/checkbox-group.js +26 -1
- package/dist/components/checkbox.cjs +53 -1
- package/dist/components/checkbox.d.ts +2 -2
- package/dist/components/checkbox.js +19 -1
- package/dist/components/collapsible.cjs +61 -1
- package/dist/components/collapsible.d.ts +2 -2
- package/dist/components/collapsible.js +21 -1
- package/dist/components/command.cjs +167 -1
- package/dist/components/command.d.ts +4 -4
- package/dist/components/command.js +106 -1
- package/dist/components/context-menu.cjs +218 -1
- package/dist/components/context-menu.d.ts +4 -4
- package/dist/components/context-menu.js +142 -1
- package/dist/components/dialog.cjs +164 -1
- package/dist/components/dialog.d.ts +10 -10
- package/dist/components/dialog.js +106 -1
- package/dist/components/drawer.cjs +143 -1
- package/dist/components/drawer.d.ts +9 -9
- package/dist/components/drawer.js +85 -1
- package/dist/components/dropdown-menu.cjs +221 -1
- package/dist/components/dropdown-menu.d.ts +4 -4
- package/dist/components/dropdown-menu.js +145 -1
- package/dist/components/empty.cjs +113 -1
- package/dist/components/empty.d.ts +9 -9
- package/dist/components/empty.js +61 -1
- package/dist/components/field.cjs +193 -1
- package/dist/components/field.d.ts +14 -14
- package/dist/components/field.js +129 -1
- package/dist/components/form.cjs +151 -1
- package/dist/components/form.d.ts +10 -10
- package/dist/components/form.js +96 -1
- package/dist/components/hover-card.cjs +77 -1
- package/dist/components/hover-card.d.ts +2 -2
- package/dist/components/hover-card.js +34 -1
- package/dist/components/input-group.cjs +155 -1
- package/dist/components/input-group.d.ts +15 -15
- package/dist/components/input-group.js +97 -1
- package/dist/components/input-number.cjs +98 -1
- package/dist/components/input-number.d.ts +2 -2
- package/dist/components/input-number.js +64 -1
- package/dist/components/input-otp.cjs +101 -1
- package/dist/components/input-otp.d.ts +6 -6
- package/dist/components/input-otp.js +49 -1
- package/dist/components/input-password.cjs +71 -1
- package/dist/components/input-password.d.ts +3 -3
- package/dist/components/input-password.js +37 -1
- package/dist/components/input-search.cjs +80 -1
- package/dist/components/input-search.d.ts +3 -3
- package/dist/components/input-search.js +46 -1
- package/dist/components/input.cjs +45 -1
- package/dist/components/input.d.ts +2 -2
- package/dist/components/input.js +11 -1
- package/dist/components/item.cjs +186 -1
- package/dist/components/item.d.ts +12 -12
- package/dist/components/item.js +119 -1
- package/dist/components/kbd.cjs +54 -1
- package/dist/components/kbd.d.ts +3 -3
- package/dist/components/kbd.js +17 -1
- package/dist/components/label.cjs +45 -1
- package/dist/components/label.d.ts +2 -2
- package/dist/components/label.js +11 -1
- package/dist/components/menubar.cjs +232 -1
- package/dist/components/menubar.d.ts +4 -4
- package/dist/components/menubar.js +153 -1
- package/dist/components/native-select.cjs +75 -1
- package/dist/components/native-select.d.ts +4 -4
- package/dist/components/native-select.js +35 -1
- package/dist/components/navigation-menu.cjs +146 -2
- package/dist/components/navigation-menu.d.ts +2 -2
- package/dist/components/navigation-menu.js +94 -2
- package/dist/components/pagination.cjs +138 -1
- package/dist/components/pagination.d.ts +10 -10
- package/dist/components/pagination.js +86 -1
- package/dist/components/popover.cjs +86 -1
- package/dist/components/popover.d.ts +3 -3
- package/dist/components/popover.js +40 -1
- package/dist/components/progress-circle.cjs +184 -1
- package/dist/components/progress-circle.d.ts +5 -5
- package/dist/components/progress-circle.js +147 -1
- package/dist/components/progress.cjs +52 -1
- package/dist/components/progress.d.ts +2 -2
- package/dist/components/progress.js +18 -1
- package/dist/components/radio-cards.cjs +66 -1
- package/dist/components/radio-cards.d.ts +2 -2
- package/dist/components/radio-cards.js +29 -1
- package/dist/components/radio-group.cjs +59 -1
- package/dist/components/radio-group.d.ts +2 -2
- package/dist/components/radio-group.js +22 -1
- package/dist/components/radio.cjs +47 -1
- package/dist/components/radio.d.ts +2 -2
- package/dist/components/radio.js +13 -1
- package/dist/components/resizable.cjs +71 -1
- package/dist/components/resizable.d.ts +8 -8
- package/dist/components/resizable.js +31 -1
- package/dist/components/scroll-area.cjs +140 -1
- package/dist/components/scroll-area.d.ts +5 -5
- package/dist/components/scroll-area.js +100 -1
- package/dist/components/select.cjs +180 -1
- package/dist/components/select.d.ts +5 -5
- package/dist/components/select.js +119 -1
- package/dist/components/separator.cjs +82 -1
- package/dist/components/separator.d.ts +5 -5
- package/dist/components/separator.js +42 -1
- package/dist/components/sheet.cjs +184 -1
- package/dist/components/sheet.d.ts +9 -9
- package/dist/components/sheet.js +123 -1
- package/dist/components/sidebar.cjs +506 -1
- package/dist/components/sidebar.d.ts +31 -31
- package/dist/components/sidebar.js +400 -1
- package/dist/components/skeleton.cjs +44 -1
- package/dist/components/skeleton.d.ts +2 -2
- package/dist/components/skeleton.js +10 -1
- package/dist/components/slider.cjs +79 -1
- package/dist/components/slider.d.ts +2 -2
- package/dist/components/slider.js +45 -1
- package/dist/components/sonner.cjs +57 -1
- package/dist/components/sonner.d.ts +3 -3
- package/dist/components/sonner.js +17 -1
- package/dist/components/spinner.cjs +75 -1
- package/dist/components/spinner.d.ts +2 -2
- package/dist/components/spinner.js +41 -1
- package/dist/components/switch.cjs +49 -1
- package/dist/components/switch.d.ts +2 -2
- package/dist/components/switch.js +15 -1
- package/dist/components/table.cjs +118 -1
- package/dist/components/table.d.ts +9 -9
- package/dist/components/table.js +63 -1
- package/dist/components/tabs.cjs +75 -1
- package/dist/components/tabs.d.ts +3 -3
- package/dist/components/tabs.js +32 -1
- package/dist/components/textarea.cjs +44 -1
- package/dist/components/textarea.d.ts +2 -2
- package/dist/components/textarea.js +10 -1
- package/dist/components/toggle-group.cjs +90 -1
- package/dist/components/toggle-group.d.ts +10 -12
- package/dist/components/toggle-group.js +53 -1
- package/dist/components/toggle.cjs +71 -1
- package/dist/components/toggle.d.ts +10 -12
- package/dist/components/toggle.js +34 -1
- package/dist/components/tooltip.cjs +90 -1
- package/dist/components/tooltip.d.ts +3 -3
- package/dist/components/tooltip.js +44 -1
- package/dist/css/amber.css +95 -1
- package/dist/css/blue.css +95 -1
- package/dist/css/cyan.css +95 -1
- package/dist/css/emerald.css +95 -1
- package/dist/css/fuchsia.css +95 -1
- package/dist/css/gray.css +95 -1
- package/dist/css/green.css +95 -1
- package/dist/css/indigo.css +95 -1
- package/dist/css/lime.css +95 -1
- package/dist/css/neutral.css +95 -1
- package/dist/css/orange.css +95 -1
- package/dist/css/pink.css +95 -1
- package/dist/css/preset.css +118 -1
- package/dist/css/purple.css +95 -1
- package/dist/css/red.css +95 -1
- package/dist/css/rose.css +95 -1
- package/dist/css/sky.css +95 -1
- package/dist/css/slate.css +95 -1
- package/dist/css/stone.css +95 -1
- package/dist/css/style.css +3 -1
- package/dist/css/teal.css +95 -1
- package/dist/css/violet.css +95 -1
- package/dist/css/yellow.css +95 -1
- package/dist/css/zinc.css +95 -1
- package/dist/hooks/use-animated-value.cjs +74 -1
- package/dist/hooks/use-animated-value.d.ts +9 -10
- package/dist/hooks/use-animated-value.js +40 -1
- package/dist/hooks/use-copy-to-clipboard.cjs +57 -1
- package/dist/hooks/use-copy-to-clipboard.d.ts +18 -1
- package/dist/hooks/use-copy-to-clipboard.js +23 -1
- package/dist/hooks/use-is-mobile.cjs +39 -1
- package/dist/hooks/use-is-mobile.d.ts +15 -6
- package/dist/hooks/use-is-mobile.js +5 -1
- package/dist/hooks/use-media-query.cjs +56 -1
- package/dist/hooks/use-media-query.d.ts +11 -3
- package/dist/hooks/use-media-query.js +22 -1
- package/dist/hooks/use-mutation-observer.cjs +56 -1
- package/dist/hooks/use-mutation-observer.d.ts +8 -12
- package/dist/hooks/use-mutation-observer.js +22 -1
- package/dist/hooks/use-pagination.cjs +92 -1
- package/dist/hooks/use-pagination.d.ts +12 -10
- package/dist/hooks/use-pagination.js +55 -1
- package/dist/index.cjs +1081 -1
- package/dist/index.d.ts +130 -131
- package/dist/index.js +69 -1
- package/dist/primitives/checkbox-group.cjs +151 -1
- package/dist/primitives/checkbox-group.d.ts +11 -11
- package/dist/primitives/checkbox-group.js +99 -1
- package/dist/primitives/input-number.cjs +439 -1
- package/dist/primitives/input-number.d.ts +8 -8
- package/dist/primitives/input-number.js +381 -1
- package/dist/primitives/input.cjs +99 -1
- package/dist/primitives/input.d.ts +4 -4
- package/dist/primitives/input.js +53 -1
- package/dist/primitives/progress-circle.cjs +198 -1
- package/dist/primitives/progress-circle.d.ts +7 -7
- package/dist/primitives/progress-circle.js +128 -1
- package/package.json +385 -38
|
@@ -1 +1,439 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";
|
|
2
|
+
var __webpack_require__ = {};
|
|
3
|
+
(()=>{
|
|
4
|
+
__webpack_require__.d = (exports1, definition)=>{
|
|
5
|
+
for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: definition[key]
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
})();
|
|
11
|
+
(()=>{
|
|
12
|
+
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
|
|
13
|
+
})();
|
|
14
|
+
(()=>{
|
|
15
|
+
__webpack_require__.r = (exports1)=>{
|
|
16
|
+
if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
|
|
17
|
+
value: 'Module'
|
|
18
|
+
});
|
|
19
|
+
Object.defineProperty(exports1, '__esModule', {
|
|
20
|
+
value: true
|
|
21
|
+
});
|
|
22
|
+
};
|
|
23
|
+
})();
|
|
24
|
+
var __webpack_exports__ = {};
|
|
25
|
+
__webpack_require__.r(__webpack_exports__);
|
|
26
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
27
|
+
DecrementButton: ()=>InputNumberDecrementButton,
|
|
28
|
+
InputNumberField: ()=>InputNumberField,
|
|
29
|
+
InputNumberDecrementButton: ()=>InputNumberDecrementButton,
|
|
30
|
+
IncrementButton: ()=>InputNumberIncrementButton,
|
|
31
|
+
Root: ()=>InputNumber,
|
|
32
|
+
InputNumber: ()=>InputNumber,
|
|
33
|
+
Field: ()=>InputNumberField,
|
|
34
|
+
InputNumberIncrementButton: ()=>InputNumberIncrementButton,
|
|
35
|
+
createInputNumberScope: ()=>createInputNumberScope
|
|
36
|
+
});
|
|
37
|
+
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
38
|
+
const primitive_namespaceObject = require("@radix-ui/primitive");
|
|
39
|
+
const react_context_namespaceObject = require("@radix-ui/react-context");
|
|
40
|
+
const react_use_controllable_state_namespaceObject = require("@radix-ui/react-use-controllable-state");
|
|
41
|
+
const external_react_namespaceObject = require("react");
|
|
42
|
+
const external_input_cjs_namespaceObject = require("./input.cjs");
|
|
43
|
+
const NUMBER_INPUT_NAME = 'InputNumber';
|
|
44
|
+
const [createInputNumberContext, createInputNumberScope] = (0, react_context_namespaceObject.createContextScope)(NUMBER_INPUT_NAME, [
|
|
45
|
+
external_input_cjs_namespaceObject.createInputScope
|
|
46
|
+
]);
|
|
47
|
+
const useInputScope = (0, external_input_cjs_namespaceObject.createInputScope)();
|
|
48
|
+
const [InputNumberContextProvider, useInputNumberContext] = createInputNumberContext(NUMBER_INPUT_NAME);
|
|
49
|
+
function InputNumber(numberInputProps) {
|
|
50
|
+
const { __scopeInputNumber, ariaDecrementLabel, ariaIncrementLabel, defaultValue, formatOptions = {
|
|
51
|
+
minimumFractionDigits: 0,
|
|
52
|
+
style: 'decimal'
|
|
53
|
+
}, id, locale, max, min, onChange, step = 1, value: valueProperty, ...props } = numberInputProps;
|
|
54
|
+
const inputScope = useInputScope(__scopeInputNumber);
|
|
55
|
+
const inputRef = (0, external_react_namespaceObject.useRef)(null);
|
|
56
|
+
const [value, setValue] = (0, react_use_controllable_state_namespaceObject.useControllableState)({
|
|
57
|
+
defaultProp: defaultValue,
|
|
58
|
+
onChange,
|
|
59
|
+
prop: valueProperty
|
|
60
|
+
});
|
|
61
|
+
const { decimalSeparator, thousandSeparator } = (0, external_react_namespaceObject.useMemo)(()=>getNumberFormatSeparators(locale), [
|
|
62
|
+
locale
|
|
63
|
+
]);
|
|
64
|
+
const formatValue = (0, external_react_namespaceObject.useCallback)((inputValue)=>{
|
|
65
|
+
if (void 0 === inputValue || Number.isNaN(inputValue)) return '';
|
|
66
|
+
return new Intl.NumberFormat(locale, formatOptions).format(inputValue);
|
|
67
|
+
}, [
|
|
68
|
+
formatOptions,
|
|
69
|
+
locale
|
|
70
|
+
]);
|
|
71
|
+
const parseValue = (0, external_react_namespaceObject.useCallback)((inputValue)=>{
|
|
72
|
+
if ('number' == typeof inputValue) return clamp(inputValue, min, max);
|
|
73
|
+
if ('string' != typeof inputValue) return NaN;
|
|
74
|
+
const cleanedValue = inputValue.trim().replaceAll(/[^\d.,\-()]/g, '');
|
|
75
|
+
if ('' === cleanedValue) return NaN;
|
|
76
|
+
const normalizedValue = normalizeInputValue(cleanedValue, thousandSeparator, decimalSeparator);
|
|
77
|
+
let parsedValue = Number.parseFloat(normalizedValue);
|
|
78
|
+
if ('percent' === formatOptions.style) parsedValue /= 100;
|
|
79
|
+
return Number.isNaN(parsedValue) ? 0 : clamp(parsedValue, min, max);
|
|
80
|
+
}, [
|
|
81
|
+
decimalSeparator,
|
|
82
|
+
formatOptions.style,
|
|
83
|
+
max,
|
|
84
|
+
min,
|
|
85
|
+
thousandSeparator
|
|
86
|
+
]);
|
|
87
|
+
const changeNumberValue = (0, external_react_namespaceObject.useCallback)((operation)=>{
|
|
88
|
+
const inputElement = inputRef.current;
|
|
89
|
+
if (!inputElement || props.disabled || props.readOnly) return;
|
|
90
|
+
const currentValue = parseValue(inputElement.value) || 0;
|
|
91
|
+
const newValue = clamp(operation(currentValue), min, max);
|
|
92
|
+
inputElement.value = formatValue(newValue);
|
|
93
|
+
setValue(newValue);
|
|
94
|
+
}, [
|
|
95
|
+
props.disabled,
|
|
96
|
+
formatValue,
|
|
97
|
+
max,
|
|
98
|
+
min,
|
|
99
|
+
parseValue,
|
|
100
|
+
props.readOnly,
|
|
101
|
+
setValue
|
|
102
|
+
]);
|
|
103
|
+
const handleIncrement = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
104
|
+
changeNumberValue((number)=>number + step);
|
|
105
|
+
}, [
|
|
106
|
+
changeNumberValue,
|
|
107
|
+
step
|
|
108
|
+
]);
|
|
109
|
+
const handleDecrement = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
110
|
+
changeNumberValue((number)=>number - step);
|
|
111
|
+
}, [
|
|
112
|
+
changeNumberValue,
|
|
113
|
+
step
|
|
114
|
+
]);
|
|
115
|
+
const handleIncrementToMax = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
116
|
+
changeNumberValue((number)=>max ?? number + step);
|
|
117
|
+
}, [
|
|
118
|
+
changeNumberValue,
|
|
119
|
+
max,
|
|
120
|
+
step
|
|
121
|
+
]);
|
|
122
|
+
const handleDecrementToMin = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
123
|
+
changeNumberValue((number)=>min ?? number - step);
|
|
124
|
+
}, [
|
|
125
|
+
changeNumberValue,
|
|
126
|
+
min,
|
|
127
|
+
step
|
|
128
|
+
]);
|
|
129
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(InputNumberContextProvider, {
|
|
130
|
+
ariaDecrementLabel: ariaDecrementLabel,
|
|
131
|
+
ariaIncrementLabel: ariaIncrementLabel,
|
|
132
|
+
defaultValue: defaultValue,
|
|
133
|
+
disabled: props.disabled,
|
|
134
|
+
formatOptions: formatOptions,
|
|
135
|
+
formatValue: formatValue,
|
|
136
|
+
id: id,
|
|
137
|
+
inputRef: inputRef,
|
|
138
|
+
max: max,
|
|
139
|
+
min: min,
|
|
140
|
+
parseValue: parseValue,
|
|
141
|
+
readOnly: props.readOnly,
|
|
142
|
+
scope: __scopeInputNumber,
|
|
143
|
+
value: value,
|
|
144
|
+
onChange: setValue,
|
|
145
|
+
onDecrement: handleDecrement,
|
|
146
|
+
onDecrementToMin: handleDecrementToMin,
|
|
147
|
+
onIncrement: handleIncrement,
|
|
148
|
+
onIncrementToMax: handleIncrementToMax,
|
|
149
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_input_cjs_namespaceObject.Root, {
|
|
150
|
+
...inputScope,
|
|
151
|
+
...props
|
|
152
|
+
})
|
|
153
|
+
});
|
|
154
|
+
}
|
|
155
|
+
const NUMBER_INPUT_FIELD_NAME = 'InputNumberField';
|
|
156
|
+
function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
|
|
157
|
+
const inputScope = useInputScope(__scopeInputNumber);
|
|
158
|
+
const { defaultValue, disabled, formatValue, id, inputRef, max, min, onChange, onDecrement, onDecrementToMin, onIncrement, onIncrementToMax, parseValue, readOnly, step, value } = useInputNumberContext(NUMBER_INPUT_FIELD_NAME, __scopeInputNumber);
|
|
159
|
+
const handleBlur = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
160
|
+
const numericValue = parseValue(event.target.value);
|
|
161
|
+
const formattedValue = formatValue(numericValue);
|
|
162
|
+
if (formattedValue !== event.target.value) event.target.value = formattedValue;
|
|
163
|
+
onChange(numericValue);
|
|
164
|
+
}, [
|
|
165
|
+
formatValue,
|
|
166
|
+
onChange,
|
|
167
|
+
parseValue
|
|
168
|
+
]);
|
|
169
|
+
const handleKeyDown = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
170
|
+
switch(event.key){
|
|
171
|
+
case 'ArrowUp':
|
|
172
|
+
onIncrement();
|
|
173
|
+
event.preventDefault();
|
|
174
|
+
break;
|
|
175
|
+
case 'PageUp':
|
|
176
|
+
onIncrementToMax();
|
|
177
|
+
event.preventDefault();
|
|
178
|
+
break;
|
|
179
|
+
case 'ArrowDown':
|
|
180
|
+
onDecrement();
|
|
181
|
+
event.preventDefault();
|
|
182
|
+
break;
|
|
183
|
+
case 'PageDown':
|
|
184
|
+
onDecrementToMin();
|
|
185
|
+
event.preventDefault();
|
|
186
|
+
break;
|
|
187
|
+
default:
|
|
188
|
+
break;
|
|
189
|
+
}
|
|
190
|
+
}, [
|
|
191
|
+
onIncrement,
|
|
192
|
+
onIncrementToMax,
|
|
193
|
+
onDecrement,
|
|
194
|
+
onDecrementToMin
|
|
195
|
+
]);
|
|
196
|
+
const handleKeyDownPrevent = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
197
|
+
switch(event.key){
|
|
198
|
+
case 'ArrowUp':
|
|
199
|
+
case 'ArrowDown':
|
|
200
|
+
case 'ArrowLeft':
|
|
201
|
+
case 'ArrowRight':
|
|
202
|
+
case 'PageUp':
|
|
203
|
+
case 'PageDown':
|
|
204
|
+
case 'Tab':
|
|
205
|
+
case 'Escape':
|
|
206
|
+
case 'Enter':
|
|
207
|
+
case 'Backspace':
|
|
208
|
+
case 'Delete':
|
|
209
|
+
case 'Home':
|
|
210
|
+
case 'End':
|
|
211
|
+
case '.':
|
|
212
|
+
case ',':
|
|
213
|
+
case '-':
|
|
214
|
+
case '%':
|
|
215
|
+
return;
|
|
216
|
+
default:
|
|
217
|
+
if (isNumberKey(event.key) || isModifierKey(event) || isFunctionKey(event.key)) return;
|
|
218
|
+
event.preventDefault();
|
|
219
|
+
}
|
|
220
|
+
}, []);
|
|
221
|
+
const handleKeyDownEnter = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
222
|
+
const inputElement = inputRef.current;
|
|
223
|
+
if ('Enter' !== event.key || !inputElement) return;
|
|
224
|
+
const numericValue = parseValue(inputElement.value);
|
|
225
|
+
const formattedValue = formatValue(numericValue);
|
|
226
|
+
if (formattedValue !== inputElement.value) inputElement.value = formattedValue;
|
|
227
|
+
onChange(numericValue);
|
|
228
|
+
}, [
|
|
229
|
+
formatValue,
|
|
230
|
+
inputRef,
|
|
231
|
+
onChange,
|
|
232
|
+
parseValue
|
|
233
|
+
]);
|
|
234
|
+
const combinedKeyDownHandler = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
235
|
+
(0, primitive_namespaceObject.composeEventHandlers)(onKeyDown, chain(handleKeyDownPrevent, handleKeyDown, handleKeyDownEnter))(event);
|
|
236
|
+
}, [
|
|
237
|
+
onKeyDown,
|
|
238
|
+
handleKeyDown,
|
|
239
|
+
handleKeyDownEnter,
|
|
240
|
+
handleKeyDownPrevent
|
|
241
|
+
]);
|
|
242
|
+
(0, external_react_namespaceObject.useEffect)(()=>{
|
|
243
|
+
const handleWheel = (event)=>{
|
|
244
|
+
const inputElement = inputRef.current;
|
|
245
|
+
if (!inputElement || disabled || readOnly || document.activeElement !== inputElement) return;
|
|
246
|
+
event.preventDefault();
|
|
247
|
+
if (event.deltaY > 0) onIncrement();
|
|
248
|
+
else onDecrement();
|
|
249
|
+
};
|
|
250
|
+
const inputElement = inputRef.current;
|
|
251
|
+
inputElement?.addEventListener('wheel', handleWheel);
|
|
252
|
+
return ()=>{
|
|
253
|
+
inputElement?.removeEventListener('wheel', handleWheel);
|
|
254
|
+
};
|
|
255
|
+
}, [
|
|
256
|
+
onIncrement,
|
|
257
|
+
onDecrement,
|
|
258
|
+
inputRef,
|
|
259
|
+
disabled,
|
|
260
|
+
readOnly
|
|
261
|
+
]);
|
|
262
|
+
(0, external_react_namespaceObject.useEffect)(()=>{
|
|
263
|
+
const inputElement = inputRef.current;
|
|
264
|
+
if (inputElement && inputElement !== document.activeElement) inputElement.value = formatValue(value);
|
|
265
|
+
}, [
|
|
266
|
+
formatValue,
|
|
267
|
+
inputRef,
|
|
268
|
+
value
|
|
269
|
+
]);
|
|
270
|
+
(0, external_react_namespaceObject.useEffect)(()=>{
|
|
271
|
+
const inputElement = inputRef.current;
|
|
272
|
+
if (!inputElement) return;
|
|
273
|
+
const handleReset = ()=>{
|
|
274
|
+
onChange(parseValue(defaultValue));
|
|
275
|
+
};
|
|
276
|
+
const form = inputElement.form;
|
|
277
|
+
form?.addEventListener('reset', handleReset);
|
|
278
|
+
return ()=>{
|
|
279
|
+
form?.removeEventListener('reset', handleReset);
|
|
280
|
+
};
|
|
281
|
+
}, [
|
|
282
|
+
defaultValue,
|
|
283
|
+
inputRef,
|
|
284
|
+
onChange,
|
|
285
|
+
parseValue
|
|
286
|
+
]);
|
|
287
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_input_cjs_namespaceObject.Field, {
|
|
288
|
+
ref: inputRef,
|
|
289
|
+
defaultValue: formatValue(value),
|
|
290
|
+
disabled: disabled,
|
|
291
|
+
id: id,
|
|
292
|
+
inputMode: "decimal",
|
|
293
|
+
max: max,
|
|
294
|
+
min: min,
|
|
295
|
+
readOnly: readOnly,
|
|
296
|
+
step: step,
|
|
297
|
+
onBlur: (0, primitive_namespaceObject.composeEventHandlers)(onBlur, handleBlur),
|
|
298
|
+
onKeyDown: combinedKeyDownHandler,
|
|
299
|
+
...inputScope,
|
|
300
|
+
...props
|
|
301
|
+
});
|
|
302
|
+
}
|
|
303
|
+
const NUMBER_STEPPER_BUTTON_NAME = 'NumberStepperButton';
|
|
304
|
+
function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
|
|
305
|
+
const { ariaDecrementLabel, ariaIncrementLabel, disabled, id, max, min, onDecrement, onIncrement, value } = useInputNumberContext(NUMBER_STEPPER_BUTTON_NAME, __scopeInputNumber);
|
|
306
|
+
const isDisabled = (0, external_react_namespaceObject.useMemo)(()=>{
|
|
307
|
+
const atMin = void 0 !== min && void 0 !== value && value <= min;
|
|
308
|
+
const atMax = void 0 !== max && void 0 !== value && value >= max;
|
|
309
|
+
return (disabled ?? atMin) || atMax;
|
|
310
|
+
}, [
|
|
311
|
+
min,
|
|
312
|
+
max,
|
|
313
|
+
value,
|
|
314
|
+
disabled
|
|
315
|
+
]);
|
|
316
|
+
const timeoutIdRef = (0, external_react_namespaceObject.useRef)(null);
|
|
317
|
+
const startActionInterval = (0, external_react_namespaceObject.useCallback)((callback)=>{
|
|
318
|
+
const interval = 100;
|
|
319
|
+
const repeatAction = ()=>{
|
|
320
|
+
callback();
|
|
321
|
+
timeoutIdRef.current = setTimeout(repeatAction, interval);
|
|
322
|
+
};
|
|
323
|
+
callback();
|
|
324
|
+
timeoutIdRef.current = setTimeout(repeatAction, 2 * interval);
|
|
325
|
+
}, []);
|
|
326
|
+
const clearActionInterval = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
327
|
+
if (timeoutIdRef.current) {
|
|
328
|
+
clearTimeout(timeoutIdRef.current);
|
|
329
|
+
timeoutIdRef.current = null;
|
|
330
|
+
}
|
|
331
|
+
}, []);
|
|
332
|
+
const handlePointerDown = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
333
|
+
const action = 'increment' === operation ? onIncrement : onDecrement;
|
|
334
|
+
startActionInterval(action);
|
|
335
|
+
}, [
|
|
336
|
+
onDecrement,
|
|
337
|
+
onIncrement,
|
|
338
|
+
operation,
|
|
339
|
+
startActionInterval
|
|
340
|
+
]);
|
|
341
|
+
const handleContextMenu = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
342
|
+
event.preventDefault();
|
|
343
|
+
}, []);
|
|
344
|
+
const handleKeyDown = (0, external_react_namespaceObject.useCallback)((event)=>{
|
|
345
|
+
if ('Enter' === event.key || ' ' === event.key) {
|
|
346
|
+
event.preventDefault();
|
|
347
|
+
const action = 'increment' === operation ? onIncrement : onDecrement;
|
|
348
|
+
action();
|
|
349
|
+
}
|
|
350
|
+
}, [
|
|
351
|
+
onDecrement,
|
|
352
|
+
onIncrement,
|
|
353
|
+
operation
|
|
354
|
+
]);
|
|
355
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
356
|
+
"aria-controls": id,
|
|
357
|
+
"aria-label": 'increment' === operation ? ariaIncrementLabel : ariaDecrementLabel,
|
|
358
|
+
"aria-live": "polite",
|
|
359
|
+
disabled: isDisabled,
|
|
360
|
+
type: "button",
|
|
361
|
+
onContextMenu: handleContextMenu,
|
|
362
|
+
onKeyDown: handleKeyDown,
|
|
363
|
+
onPointerCancel: clearActionInterval,
|
|
364
|
+
onPointerDown: handlePointerDown,
|
|
365
|
+
onPointerLeave: clearActionInterval,
|
|
366
|
+
onPointerUp: clearActionInterval,
|
|
367
|
+
...props
|
|
368
|
+
});
|
|
369
|
+
}
|
|
370
|
+
function InputNumberIncrementButton(props) {
|
|
371
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(NumberStepperButton, {
|
|
372
|
+
operation: "increment",
|
|
373
|
+
...props
|
|
374
|
+
});
|
|
375
|
+
}
|
|
376
|
+
function InputNumberDecrementButton(props) {
|
|
377
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(NumberStepperButton, {
|
|
378
|
+
operation: "decrement",
|
|
379
|
+
...props
|
|
380
|
+
});
|
|
381
|
+
}
|
|
382
|
+
function chain(...callbacks) {
|
|
383
|
+
return (...args)=>{
|
|
384
|
+
for (const callback of callbacks)callback(...args);
|
|
385
|
+
};
|
|
386
|
+
}
|
|
387
|
+
function getNumberFormatSeparators(locale) {
|
|
388
|
+
const numberFormat = new Intl.NumberFormat(locale);
|
|
389
|
+
const parts = numberFormat.formatToParts(12345.6);
|
|
390
|
+
let thousandSeparator = '';
|
|
391
|
+
let decimalSeparator = '';
|
|
392
|
+
for (const part of parts){
|
|
393
|
+
if ('group' === part.type) thousandSeparator = part.value;
|
|
394
|
+
if ('decimal' === part.type) decimalSeparator = part.value;
|
|
395
|
+
if (thousandSeparator && decimalSeparator) break;
|
|
396
|
+
}
|
|
397
|
+
return {
|
|
398
|
+
decimalSeparator,
|
|
399
|
+
thousandSeparator
|
|
400
|
+
};
|
|
401
|
+
}
|
|
402
|
+
function normalizeInputValue(value, thousandSeparator, decimalSeparator) {
|
|
403
|
+
return value.replaceAll(new RegExp(`\\${thousandSeparator}`, 'g'), '').replace(new RegExp(`\\${decimalSeparator}`), '.').replaceAll(/[()]/g, '-');
|
|
404
|
+
}
|
|
405
|
+
function isModifierKey(event) {
|
|
406
|
+
return event.ctrlKey || event.altKey || event.metaKey || event.shiftKey;
|
|
407
|
+
}
|
|
408
|
+
function isFunctionKey(key) {
|
|
409
|
+
return key.startsWith('F') && key.length > 1;
|
|
410
|
+
}
|
|
411
|
+
function isNumberKey(key) {
|
|
412
|
+
return !Number.isNaN(Number(key));
|
|
413
|
+
}
|
|
414
|
+
function clamp(value, min = -1 / 0, max = 1 / 0) {
|
|
415
|
+
return Math.min(Math.max(value, min), max);
|
|
416
|
+
}
|
|
417
|
+
exports.DecrementButton = __webpack_exports__.DecrementButton;
|
|
418
|
+
exports.Field = __webpack_exports__.Field;
|
|
419
|
+
exports.IncrementButton = __webpack_exports__.IncrementButton;
|
|
420
|
+
exports.InputNumber = __webpack_exports__.InputNumber;
|
|
421
|
+
exports.InputNumberDecrementButton = __webpack_exports__.InputNumberDecrementButton;
|
|
422
|
+
exports.InputNumberField = __webpack_exports__.InputNumberField;
|
|
423
|
+
exports.InputNumberIncrementButton = __webpack_exports__.InputNumberIncrementButton;
|
|
424
|
+
exports.Root = __webpack_exports__.Root;
|
|
425
|
+
exports.createInputNumberScope = __webpack_exports__.createInputNumberScope;
|
|
426
|
+
for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
427
|
+
"DecrementButton",
|
|
428
|
+
"Field",
|
|
429
|
+
"IncrementButton",
|
|
430
|
+
"InputNumber",
|
|
431
|
+
"InputNumberDecrementButton",
|
|
432
|
+
"InputNumberField",
|
|
433
|
+
"InputNumberIncrementButton",
|
|
434
|
+
"Root",
|
|
435
|
+
"createInputNumberScope"
|
|
436
|
+
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
|
|
437
|
+
Object.defineProperty(exports, '__esModule', {
|
|
438
|
+
value: true
|
|
439
|
+
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import type {
|
|
3
|
-
import * as InputPrimitive from
|
|
1
|
+
import type { Scope } from '@radix-ui/react-context';
|
|
2
|
+
import type { ComponentProps, JSX } from 'react';
|
|
3
|
+
import * as InputPrimitive from './input';
|
|
4
4
|
/**
|
|
5
5
|
* Props that include an optional scope for the InputNumber component.
|
|
6
6
|
*/
|
|
@@ -40,23 +40,23 @@ declare function InputNumber(numberInputProps: ScopedProps<InputNumberProps>): J
|
|
|
40
40
|
/**
|
|
41
41
|
* Defines the props for the `InputNumberField` component.
|
|
42
42
|
*/
|
|
43
|
-
type InputNumberFieldProps = Omit<ComponentProps<typeof InputPrimitive.Field>,
|
|
43
|
+
type InputNumberFieldProps = Omit<ComponentProps<typeof InputPrimitive.Field>, 'defaultValue' | 'disabled' | 'id' | 'max' | 'min' | 'onChange' | 'prefix' | 'readOnly' | 'step' | 'value'>;
|
|
44
44
|
declare function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }: ScopedProps<InputNumberFieldProps>): JSX.Element;
|
|
45
45
|
/**
|
|
46
46
|
* Props for the NumberStepperButton component.
|
|
47
47
|
*/
|
|
48
|
-
interface NumberStepperButtonProps extends ComponentProps<
|
|
48
|
+
interface NumberStepperButtonProps extends ComponentProps<'button'> {
|
|
49
49
|
/**
|
|
50
50
|
* The operation to perform when the button is pressed.
|
|
51
51
|
* - `'increment'`: Increases the value.
|
|
52
52
|
* - `'decrement'`: Decreases the value.
|
|
53
53
|
*/
|
|
54
|
-
operation:
|
|
54
|
+
operation: 'decrement' | 'increment';
|
|
55
55
|
}
|
|
56
56
|
declare function NumberStepperButton({ __scopeInputNumber, operation, ...props }: ScopedProps<NumberStepperButtonProps>): JSX.Element;
|
|
57
|
-
type InputNumberIncrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>,
|
|
57
|
+
type InputNumberIncrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, 'operation'>;
|
|
58
58
|
declare function InputNumberIncrementButton(props: InputNumberIncrementButtonProps): JSX.Element;
|
|
59
|
-
type InputNumberDecrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>,
|
|
59
|
+
type InputNumberDecrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, 'operation'>;
|
|
60
60
|
declare function InputNumberDecrementButton(props: InputNumberDecrementButtonProps): JSX.Element;
|
|
61
61
|
export { createInputNumberScope, InputNumberDecrementButton as DecrementButton, InputNumberField as Field, InputNumberIncrementButton as IncrementButton, InputNumber, InputNumberDecrementButton, InputNumberField, InputNumberIncrementButton, InputNumber as Root, };
|
|
62
62
|
export type { InputNumberDecrementButtonProps, InputNumberFieldProps, InputNumberIncrementButtonProps, InputNumberProps, };
|