@codefast/ui 0.3.11-canary.0 → 0.3.11-canary.1
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 +13 -0
- package/package.json +79 -153
- package/dist/components/accordion.cjs +0 -98
- package/dist/components/alert-dialog.cjs +0 -156
- package/dist/components/alert.cjs +0 -84
- package/dist/components/aspect-ratio.cjs +0 -44
- package/dist/components/avatar.cjs +0 -66
- package/dist/components/badge.cjs +0 -67
- package/dist/components/breadcrumb.cjs +0 -125
- package/dist/components/button-group.cjs +0 -87
- package/dist/components/button.cjs +0 -92
- package/dist/components/calendar.cjs +0 -151
- package/dist/components/card.cjs +0 -105
- package/dist/components/carousel.cjs +0 -211
- package/dist/components/chart.cjs +0 -251
- package/dist/components/checkbox-cards.cjs +0 -70
- package/dist/components/checkbox-group.cjs +0 -64
- package/dist/components/checkbox.cjs +0 -54
- package/dist/components/collapsible.cjs +0 -62
- package/dist/components/command.cjs +0 -168
- package/dist/components/context-menu.cjs +0 -219
- package/dist/components/dialog.cjs +0 -165
- package/dist/components/drawer.cjs +0 -144
- package/dist/components/dropdown-menu.cjs +0 -222
- package/dist/components/empty.cjs +0 -113
- package/dist/components/field.cjs +0 -194
- package/dist/components/form.cjs +0 -152
- package/dist/components/hover-card.cjs +0 -78
- package/dist/components/input-group.cjs +0 -156
- package/dist/components/input-number.cjs +0 -99
- package/dist/components/input-otp.cjs +0 -102
- package/dist/components/input-password.cjs +0 -72
- package/dist/components/input-search.cjs +0 -81
- package/dist/components/input.cjs +0 -46
- package/dist/components/item.cjs +0 -186
- package/dist/components/kbd.cjs +0 -54
- package/dist/components/label.cjs +0 -46
- package/dist/components/menubar.cjs +0 -233
- package/dist/components/native-select.cjs +0 -75
- package/dist/components/navigation-menu.cjs +0 -146
- package/dist/components/pagination.cjs +0 -138
- package/dist/components/popover.cjs +0 -87
- package/dist/components/progress-circle.cjs +0 -185
- package/dist/components/progress.cjs +0 -53
- package/dist/components/radio-cards.cjs +0 -67
- package/dist/components/radio-group.cjs +0 -60
- package/dist/components/radio.cjs +0 -48
- package/dist/components/resizable.cjs +0 -72
- package/dist/components/scroll-area.cjs +0 -141
- package/dist/components/select.cjs +0 -181
- package/dist/components/separator.cjs +0 -83
- package/dist/components/sheet.cjs +0 -185
- package/dist/components/sidebar.cjs +0 -507
- package/dist/components/skeleton.cjs +0 -44
- package/dist/components/slider.cjs +0 -80
- package/dist/components/sonner.cjs +0 -58
- package/dist/components/spinner.cjs +0 -76
- package/dist/components/switch.cjs +0 -50
- package/dist/components/table.cjs +0 -118
- package/dist/components/tabs.cjs +0 -76
- package/dist/components/textarea.cjs +0 -44
- package/dist/components/toggle-group.cjs +0 -91
- package/dist/components/toggle.cjs +0 -72
- package/dist/components/tooltip.cjs +0 -91
- package/dist/hooks/use-animated-value.cjs +0 -75
- package/dist/hooks/use-copy-to-clipboard.cjs +0 -58
- package/dist/hooks/use-is-mobile.cjs +0 -40
- package/dist/hooks/use-media-query.cjs +0 -57
- package/dist/hooks/use-mutation-observer.cjs +0 -57
- package/dist/hooks/use-pagination.cjs +0 -93
- package/dist/index.cjs +0 -1081
- package/dist/primitives/checkbox-group.cjs +0 -151
- package/dist/primitives/input-number.cjs +0 -439
- package/dist/primitives/input.cjs +0 -99
- package/dist/primitives/progress-circle.cjs +0 -199
|
@@ -1,151 +0,0 @@
|
|
|
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
|
-
createCheckboxGroupScope: ()=>createCheckboxGroupScope,
|
|
28
|
-
CheckboxGroup: ()=>CheckboxGroup,
|
|
29
|
-
CheckboxGroupItem: ()=>CheckboxGroupItem,
|
|
30
|
-
CheckboxGroupIndicator: ()=>CheckboxGroupIndicator,
|
|
31
|
-
Indicator: ()=>CheckboxGroupIndicator,
|
|
32
|
-
Item: ()=>CheckboxGroupItem,
|
|
33
|
-
Root: ()=>CheckboxGroup
|
|
34
|
-
});
|
|
35
|
-
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
36
|
-
const react_checkbox_namespaceObject = require("@radix-ui/react-checkbox");
|
|
37
|
-
const react_context_namespaceObject = require("@radix-ui/react-context");
|
|
38
|
-
const react_direction_namespaceObject = require("@radix-ui/react-direction");
|
|
39
|
-
const react_roving_focus_namespaceObject = require("@radix-ui/react-roving-focus");
|
|
40
|
-
const react_use_controllable_state_namespaceObject = require("@radix-ui/react-use-controllable-state");
|
|
41
|
-
const external_react_namespaceObject = require("react");
|
|
42
|
-
const CHECKBOX_GROUP_NAME = "CheckboxGroup";
|
|
43
|
-
const [createCheckboxGroupContext, createCheckboxGroupScope] = (0, react_context_namespaceObject.createContextScope)(CHECKBOX_GROUP_NAME, [
|
|
44
|
-
react_roving_focus_namespaceObject.createRovingFocusGroupScope,
|
|
45
|
-
react_checkbox_namespaceObject.createCheckboxScope
|
|
46
|
-
]);
|
|
47
|
-
const useRovingFocusGroupScope = (0, react_roving_focus_namespaceObject.createRovingFocusGroupScope)();
|
|
48
|
-
const useCheckboxScope = (0, react_checkbox_namespaceObject.createCheckboxScope)();
|
|
49
|
-
const [CheckboxGroupContextProvider, useCheckboxGroupContext] = createCheckboxGroupContext(CHECKBOX_GROUP_NAME);
|
|
50
|
-
function CheckboxGroup({ __scopeCheckboxGroup, defaultValue, dir, disabled = false, loop = true, name, onValueChange, orientation, required = false, value: valueProperty, ...props }) {
|
|
51
|
-
const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);
|
|
52
|
-
const direction = (0, react_direction_namespaceObject.useDirection)(dir);
|
|
53
|
-
const [value = [], setValue] = (0, react_use_controllable_state_namespaceObject.useControllableState)({
|
|
54
|
-
defaultProp: defaultValue,
|
|
55
|
-
onChange: onValueChange,
|
|
56
|
-
prop: valueProperty
|
|
57
|
-
});
|
|
58
|
-
const handleItemCheck = (0, external_react_namespaceObject.useCallback)((itemValue)=>{
|
|
59
|
-
setValue((previousValue)=>[
|
|
60
|
-
...previousValue ?? [],
|
|
61
|
-
itemValue
|
|
62
|
-
]);
|
|
63
|
-
}, [
|
|
64
|
-
setValue
|
|
65
|
-
]);
|
|
66
|
-
const handleItemUncheck = (0, external_react_namespaceObject.useCallback)((itemValue)=>{
|
|
67
|
-
setValue((previousValue)=>{
|
|
68
|
-
const currentValue = previousValue ?? [];
|
|
69
|
-
if (required && 1 === currentValue.length && currentValue[0] === itemValue) return currentValue;
|
|
70
|
-
return currentValue.filter((inputValue)=>inputValue !== itemValue);
|
|
71
|
-
});
|
|
72
|
-
}, [
|
|
73
|
-
setValue,
|
|
74
|
-
required
|
|
75
|
-
]);
|
|
76
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CheckboxGroupContextProvider, {
|
|
77
|
-
disabled: disabled,
|
|
78
|
-
name: name,
|
|
79
|
-
required: required,
|
|
80
|
-
scope: __scopeCheckboxGroup,
|
|
81
|
-
value: value,
|
|
82
|
-
onItemCheck: handleItemCheck,
|
|
83
|
-
onItemUncheck: handleItemUncheck,
|
|
84
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_roving_focus_namespaceObject.Root, {
|
|
85
|
-
asChild: true,
|
|
86
|
-
...rovingFocusGroupScope,
|
|
87
|
-
dir: direction,
|
|
88
|
-
loop: loop,
|
|
89
|
-
orientation: orientation,
|
|
90
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
91
|
-
"data-disabled": disabled ? "" : void 0,
|
|
92
|
-
dir: direction,
|
|
93
|
-
role: "group",
|
|
94
|
-
...props
|
|
95
|
-
})
|
|
96
|
-
})
|
|
97
|
-
});
|
|
98
|
-
}
|
|
99
|
-
const ITEM_NAME = "CheckboxGroupItem";
|
|
100
|
-
function CheckboxGroupItem({ __scopeCheckboxGroup, disabled, ...props }) {
|
|
101
|
-
const context = useCheckboxGroupContext(ITEM_NAME, __scopeCheckboxGroup);
|
|
102
|
-
const isDisabled = context.disabled || disabled;
|
|
103
|
-
const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);
|
|
104
|
-
const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);
|
|
105
|
-
const checked = context.value?.includes(props.value);
|
|
106
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_roving_focus_namespaceObject.Item, {
|
|
107
|
-
asChild: true,
|
|
108
|
-
...rovingFocusGroupScope,
|
|
109
|
-
active: checked,
|
|
110
|
-
focusable: !isDisabled,
|
|
111
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_checkbox_namespaceObject.Root, {
|
|
112
|
-
"aria-label": props.value,
|
|
113
|
-
checked: checked,
|
|
114
|
-
disabled: isDisabled,
|
|
115
|
-
name: context.name,
|
|
116
|
-
required: context.required,
|
|
117
|
-
...checkboxScope,
|
|
118
|
-
...props,
|
|
119
|
-
onCheckedChange: (checkedState)=>{
|
|
120
|
-
if (checkedState) context.onItemCheck(props.value);
|
|
121
|
-
else context.onItemUncheck(props.value);
|
|
122
|
-
}
|
|
123
|
-
})
|
|
124
|
-
});
|
|
125
|
-
}
|
|
126
|
-
function CheckboxGroupIndicator({ __scopeCheckboxGroup, ...props }) {
|
|
127
|
-
const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);
|
|
128
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_checkbox_namespaceObject.Indicator, {
|
|
129
|
-
...checkboxScope,
|
|
130
|
-
...props
|
|
131
|
-
});
|
|
132
|
-
}
|
|
133
|
-
exports.CheckboxGroup = __webpack_exports__.CheckboxGroup;
|
|
134
|
-
exports.CheckboxGroupIndicator = __webpack_exports__.CheckboxGroupIndicator;
|
|
135
|
-
exports.CheckboxGroupItem = __webpack_exports__.CheckboxGroupItem;
|
|
136
|
-
exports.Indicator = __webpack_exports__.Indicator;
|
|
137
|
-
exports.Item = __webpack_exports__.Item;
|
|
138
|
-
exports.Root = __webpack_exports__.Root;
|
|
139
|
-
exports.createCheckboxGroupScope = __webpack_exports__.createCheckboxGroupScope;
|
|
140
|
-
for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
141
|
-
"CheckboxGroup",
|
|
142
|
-
"CheckboxGroupIndicator",
|
|
143
|
-
"CheckboxGroupItem",
|
|
144
|
-
"Indicator",
|
|
145
|
-
"Item",
|
|
146
|
-
"Root",
|
|
147
|
-
"createCheckboxGroupScope"
|
|
148
|
-
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
|
|
149
|
-
Object.defineProperty(exports, '__esModule', {
|
|
150
|
-
value: true
|
|
151
|
-
});
|
|
@@ -1,439 +0,0 @@
|
|
|
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,99 +0,0 @@
|
|
|
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
|
-
InputField: ()=>InputField,
|
|
28
|
-
Input: ()=>Input,
|
|
29
|
-
Field: ()=>InputField,
|
|
30
|
-
createInputScope: ()=>createInputScope,
|
|
31
|
-
Root: ()=>Input
|
|
32
|
-
});
|
|
33
|
-
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
34
|
-
const react_compose_refs_namespaceObject = require("@radix-ui/react-compose-refs");
|
|
35
|
-
const react_context_namespaceObject = require("@radix-ui/react-context");
|
|
36
|
-
const external_react_namespaceObject = require("react");
|
|
37
|
-
const INPUT_NAME = "Input";
|
|
38
|
-
const [createInputContext, createInputScope] = (0, react_context_namespaceObject.createContextScope)(INPUT_NAME);
|
|
39
|
-
const [InputContextProvider, useInputContext] = createInputContext(INPUT_NAME);
|
|
40
|
-
function Input(inputProps) {
|
|
41
|
-
const { __scopeInput, children, disabled, loaderPosition = "prefix", loading, prefix, readOnly, spinner, suffix, ...props } = inputProps;
|
|
42
|
-
const inputRef = (0, external_react_namespaceObject.useRef)(null);
|
|
43
|
-
const handlePointerDown = (event)=>{
|
|
44
|
-
const target = event.target;
|
|
45
|
-
if ("input" === target.tagName.toLowerCase() || target.closest("input, a, button")) return void event.stopPropagation();
|
|
46
|
-
const inputElement = inputRef.current;
|
|
47
|
-
if (!inputElement) return;
|
|
48
|
-
if (document.activeElement === inputElement) return void event.preventDefault();
|
|
49
|
-
requestAnimationFrame(()=>{
|
|
50
|
-
if ("file" === inputElement.type) return void inputElement.click();
|
|
51
|
-
if (document.activeElement !== inputElement) inputElement.focus();
|
|
52
|
-
});
|
|
53
|
-
};
|
|
54
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(InputContextProvider, {
|
|
55
|
-
disabled: disabled,
|
|
56
|
-
inputRef: inputRef,
|
|
57
|
-
readOnly: readOnly,
|
|
58
|
-
scope: __scopeInput,
|
|
59
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
60
|
-
"data-disabled": disabled,
|
|
61
|
-
"data-readonly": readOnly,
|
|
62
|
-
role: "presentation",
|
|
63
|
-
onPointerDown: handlePointerDown,
|
|
64
|
-
...props,
|
|
65
|
-
children: [
|
|
66
|
-
loading && "prefix" === loaderPosition ? spinner : prefix,
|
|
67
|
-
children,
|
|
68
|
-
loading && "suffix" === loaderPosition ? spinner : suffix
|
|
69
|
-
]
|
|
70
|
-
})
|
|
71
|
-
});
|
|
72
|
-
}
|
|
73
|
-
const INPUT_FIELD_NAME = "InputField";
|
|
74
|
-
function InputField({ __scopeInput, ...props }) {
|
|
75
|
-
const { disabled, inputRef, readOnly } = useInputContext(INPUT_FIELD_NAME, __scopeInput);
|
|
76
|
-
const composedInputRef = (0, react_compose_refs_namespaceObject.useComposedRefs)(inputRef);
|
|
77
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
|
|
78
|
-
ref: composedInputRef,
|
|
79
|
-
disabled: disabled,
|
|
80
|
-
readOnly: readOnly,
|
|
81
|
-
type: "text",
|
|
82
|
-
...props
|
|
83
|
-
});
|
|
84
|
-
}
|
|
85
|
-
exports.Field = __webpack_exports__.Field;
|
|
86
|
-
exports.Input = __webpack_exports__.Input;
|
|
87
|
-
exports.InputField = __webpack_exports__.InputField;
|
|
88
|
-
exports.Root = __webpack_exports__.Root;
|
|
89
|
-
exports.createInputScope = __webpack_exports__.createInputScope;
|
|
90
|
-
for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
91
|
-
"Field",
|
|
92
|
-
"Input",
|
|
93
|
-
"InputField",
|
|
94
|
-
"Root",
|
|
95
|
-
"createInputScope"
|
|
96
|
-
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
|
|
97
|
-
Object.defineProperty(exports, '__esModule', {
|
|
98
|
-
value: true
|
|
99
|
-
});
|