@jobber/components 9.4.0 → 9.5.0
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/Autocomplete/index.cjs +0 -1
- package/dist/Autocomplete/index.mjs +0 -1
- package/dist/Card/index.cjs +7 -7
- package/dist/Card/index.mjs +7 -7
- package/dist/Chip/index.cjs +0 -1
- package/dist/Chip/index.mjs +0 -1
- package/dist/Chips/InternalChipDismissible/hooks/index.cjs +0 -1
- package/dist/Chips/InternalChipDismissible/hooks/index.mjs +0 -1
- package/dist/Chips/InternalChipDismissible/index.cjs +0 -1
- package/dist/Chips/InternalChipDismissible/index.mjs +0 -1
- package/dist/Chips/index.cjs +0 -1
- package/dist/Chips/index.mjs +0 -1
- package/dist/ComboboxChipRemove-cjs.js +181 -184
- package/dist/ComboboxChipRemove-es.js +4 -7
- package/dist/ConfirmationModal/index.cjs +0 -1
- package/dist/ConfirmationModal/index.mjs +0 -1
- package/dist/DataDump/index.cjs +7 -7
- package/dist/DataDump/index.mjs +7 -7
- package/dist/DataList/components/DataListActions/index.cjs +0 -1
- package/dist/DataList/components/DataListActions/index.mjs +0 -1
- package/dist/DataList/components/DataListBulkActions/index.cjs +0 -1
- package/dist/DataList/components/DataListBulkActions/index.mjs +0 -1
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.cjs +0 -1
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.mjs +0 -1
- package/dist/DataList/components/DataListFilters/index.cjs +0 -1
- package/dist/DataList/components/DataListFilters/index.mjs +0 -1
- package/dist/DataList/components/DataListHeader/index.cjs +0 -1
- package/dist/DataList/components/DataListHeader/index.mjs +0 -1
- package/dist/DataList/components/DataListItem/index.cjs +0 -1
- package/dist/DataList/components/DataListItem/index.mjs +0 -1
- package/dist/DataList/components/DataListItemActions/index.cjs +0 -1
- package/dist/DataList/components/DataListItemActions/index.mjs +0 -1
- package/dist/DataList/components/DataListItemActionsOverflow/index.cjs +0 -1
- package/dist/DataList/components/DataListItemActionsOverflow/index.mjs +0 -1
- package/dist/DataList/components/DataListItems/index.cjs +0 -1
- package/dist/DataList/components/DataListItems/index.mjs +0 -1
- package/dist/DataList/components/DataListLayout/index.cjs +0 -1
- package/dist/DataList/components/DataListLayout/index.mjs +0 -1
- package/dist/DataList/components/DataListLayoutActions/index.cjs +0 -1
- package/dist/DataList/components/DataListLayoutActions/index.mjs +0 -1
- package/dist/DataList/index.cjs +0 -1
- package/dist/DataList/index.mjs +0 -1
- package/dist/DatePicker/index.cjs +0 -2
- package/dist/DatePicker/index.mjs +0 -2
- package/dist/DatePicker-cjs.js +19 -18
- package/dist/DatePicker-es.js +2 -1
- package/dist/Dialog/index.cjs +11 -6
- package/dist/Dialog/index.mjs +11 -6
- package/dist/DrawerDescription-cjs.js +7 -8
- package/dist/DrawerDescription-es.js +1 -2
- package/dist/DrawerTitle-cjs.js +4 -4
- package/dist/DrawerTitle-es.js +1 -1
- package/dist/FieldDescription-cjs.js +49 -49
- package/dist/FieldDescription-es.js +2 -2
- package/dist/FilterPicker/components/FilterPickerActivator/index.cjs +0 -1
- package/dist/FilterPicker/components/FilterPickerActivator/index.mjs +0 -1
- package/dist/FilterPicker/components/FilterPickerContent/index.cjs +0 -1
- package/dist/FilterPicker/components/FilterPickerContent/index.mjs +0 -1
- package/dist/FilterPicker/components/FilterPickerTrigger/index.cjs +0 -1
- package/dist/FilterPicker/components/FilterPickerTrigger/index.mjs +0 -1
- package/dist/FilterPicker/index.cjs +0 -1
- package/dist/FilterPicker/index.mjs +0 -1
- package/dist/FormatFile/index.cjs +0 -1
- package/dist/FormatFile/index.mjs +0 -1
- package/dist/Gallery/index.cjs +0 -1
- package/dist/Gallery/index.mjs +0 -1
- package/dist/HelperText-cjs.js +3 -2
- package/dist/HelperText-es.js +3 -2
- package/dist/InputDate/index.cjs +0 -2
- package/dist/InputDate/index.mjs +0 -2
- package/dist/InputNumber/InputNumber.d.ts +75 -5
- package/dist/InputNumber/index.cjs +27 -3
- package/dist/InputNumber/index.d.ts +2 -2
- package/dist/InputNumber/index.mjs +27 -3
- package/dist/{primitives/InputNumberExperimental → InputNumber}/types.d.ts +48 -35
- package/dist/InputNumber-cjs.js +267 -4986
- package/dist/InputNumber-es.js +268 -4987
- package/dist/LightBox/index.cjs +0 -1
- package/dist/LightBox/index.mjs +0 -1
- package/dist/Menu/index.cjs +7 -7
- package/dist/Menu/index.mjs +7 -7
- package/dist/Menu-cjs.js +4 -1
- package/dist/Menu-es.js +4 -1
- package/dist/MenuSubmenuTrigger-cjs.js +142 -143
- package/dist/MenuSubmenuTrigger-es.js +5 -6
- package/dist/Modal/index.cjs +0 -1
- package/dist/Modal/index.mjs +0 -1
- package/dist/NumberFieldInput-cjs.js +63 -63
- package/dist/NumberFieldInput-es.js +5 -5
- package/dist/Page/index.cjs +7 -8
- package/dist/Page/index.mjs +7 -8
- package/dist/Popover/index.cjs +0 -1
- package/dist/Popover/index.mjs +0 -1
- package/dist/ScrollAreaViewport-cjs.js +119 -121
- package/dist/ScrollAreaViewport-es.js +3 -5
- package/dist/Select/index.cjs +3 -9
- package/dist/Select/index.mjs +3 -9
- package/dist/SelectGroupLabel-cjs.js +117 -107
- package/dist/SelectGroupLabel-es.js +20 -12
- package/dist/Tooltip/index.cjs +0 -1
- package/dist/Tooltip/index.mjs +0 -1
- package/dist/dialogReturnFocus-cjs.js +4 -1
- package/dist/dialogReturnFocus-es.js +4 -1
- package/dist/docs/InputNumber/InputNumber.md +564 -56
- package/dist/docs/index.md +0 -1
- package/dist/floating-ui.react-cjs.js +34 -35
- package/dist/floating-ui.react-dom-cjs.js +64 -65
- package/dist/floating-ui.react-dom-es.js +1 -2
- package/dist/floating-ui.react-es.js +1 -2
- package/dist/floating-ui.utils-cjs.js +183 -0
- package/dist/floating-ui.utils-es.js +165 -1
- package/dist/index.cjs +10 -15
- package/dist/index.mjs +10 -15
- package/dist/primitives/BottomSheet/index.cjs +2 -5
- package/dist/primitives/BottomSheet/index.mjs +2 -5
- package/dist/primitives/ComboboxPrimitive/index.cjs +3 -7
- package/dist/primitives/ComboboxPrimitive/index.mjs +3 -7
- package/dist/primitives/HelperText/HelperText.d.ts +4 -1
- package/dist/primitives/HelperText/index.cjs +1 -1
- package/dist/primitives/HelperText/index.mjs +1 -1
- package/dist/primitives/SelectPrimitive/index.cjs +3 -9
- package/dist/primitives/SelectPrimitive/index.mjs +3 -9
- package/dist/primitives/index.cjs +2 -16
- package/dist/primitives/index.d.ts +0 -2
- package/dist/primitives/index.mjs +2 -15
- package/dist/scrollEdges-cjs.js +6 -2
- package/dist/scrollEdges-es.js +5 -2
- package/dist/styles.css +573 -902
- package/dist/unstyledPrimitives/index.cjs +105 -111
- package/dist/unstyledPrimitives/index.mjs +5 -11
- package/dist/useCompositeListItem-cjs.js +516 -90
- package/dist/useCompositeListItem-es.js +407 -6
- package/dist/useLabel-cjs.js +10 -10
- package/dist/useLabel-es.js +3 -3
- package/dist/useRenderElement-es.js +1 -1
- package/dist/useScrollLock-cjs.js +1332 -203
- package/dist/useScrollLock-es.js +1068 -5
- package/dist/utils/meta/meta.json +12 -0
- package/package.json +2 -3
- package/dist/InputNumber/InputNumber.types.d.ts +0 -20
- package/dist/InputNumberExperimental-cjs.js +0 -277
- package/dist/InputNumberExperimental-es.js +0 -275
- package/dist/clamp-cjs.js +0 -7
- package/dist/clamp-es.js +0 -5
- package/dist/clsx-cjs.js +0 -5
- package/dist/clsx-es.js +0 -3
- package/dist/docs/InputNumberExperimental/InputNumberExperimental.md +0 -578
- package/dist/floating-ui.utils.dom-cjs.js +0 -185
- package/dist/floating-ui.utils.dom-es.js +0 -165
- package/dist/isElementDisabled-cjs.js +0 -40
- package/dist/isElementDisabled-es.js +0 -18
- package/dist/primitives/InputNumberExperimental/InputNumberExperimental.d.ts +0 -77
- package/dist/primitives/InputNumberExperimental/index.cjs +0 -30
- package/dist/primitives/InputNumberExperimental/index.d.ts +0 -2
- package/dist/primitives/InputNumberExperimental/index.mjs +0 -24
- package/dist/resolveAriaLabelledBy-cjs.js +0 -200
- package/dist/resolveAriaLabelledBy-es.js +0 -166
- package/dist/useButton-cjs.js +0 -1164
- package/dist/useButton-es.js +0 -1071
- package/dist/useLabelableId-cjs.js +0 -278
- package/dist/useLabelableId-es.js +0 -247
|
@@ -130,6 +130,18 @@
|
|
|
130
130
|
"InputFileContentContext.Provider",
|
|
131
131
|
"InputGroup",
|
|
132
132
|
"InputNumber",
|
|
133
|
+
"InputNumber.Affix",
|
|
134
|
+
"InputNumber.Decrement",
|
|
135
|
+
"InputNumber.Description",
|
|
136
|
+
"InputNumber.Error",
|
|
137
|
+
"InputNumber.Footer",
|
|
138
|
+
"InputNumber.Group",
|
|
139
|
+
"InputNumber.Increment",
|
|
140
|
+
"InputNumber.Input",
|
|
141
|
+
"InputNumber.Label",
|
|
142
|
+
"InputNumber.Loading",
|
|
143
|
+
"InputNumber.Stepper",
|
|
144
|
+
"InputNumber.Wrapper",
|
|
133
145
|
"InputPhoneNumber",
|
|
134
146
|
"InputText",
|
|
135
147
|
"InputTime",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.5.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.cjs",
|
|
@@ -479,7 +479,6 @@
|
|
|
479
479
|
"filesize": "^6.1.0",
|
|
480
480
|
"framer-motion": "^11.11.12",
|
|
481
481
|
"lodash": "^4.17.21",
|
|
482
|
-
"react-aria-components": "^1.11.0",
|
|
483
482
|
"react-countdown": "^2.3.2",
|
|
484
483
|
"react-datepicker": "^8.7.0",
|
|
485
484
|
"react-dropzone": "^11.0.2",
|
|
@@ -545,5 +544,5 @@
|
|
|
545
544
|
"> 1%",
|
|
546
545
|
"IE 10"
|
|
547
546
|
],
|
|
548
|
-
"gitHead": "
|
|
547
|
+
"gitHead": "fd7066c60c4be6f04144a659ccf7a43a4e9cfb60"
|
|
549
548
|
}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type React from "react";
|
|
2
|
-
import type { FocusEvents, HTMLInputBaseProps, KeyboardEvents, MouseEvents, RebuiltInputCommonProps } from "../sharedHelpers/types";
|
|
3
|
-
export interface InputNumberProps extends HTMLInputBaseProps, FocusEvents<HTMLInputElement>, KeyboardEvents<HTMLInputElement>, MouseEvents<HTMLInputElement>, Omit<RebuiltInputCommonProps, "clearable" | "suffix" | "prefix"> {
|
|
4
|
-
readonly defaultValue?: number;
|
|
5
|
-
readonly formatOptions?: Intl.NumberFormatOptions;
|
|
6
|
-
readonly maxValue?: number;
|
|
7
|
-
readonly minValue?: number;
|
|
8
|
-
/**
|
|
9
|
-
* Callback for value changes.
|
|
10
|
-
* @param newValue - The new numeric value
|
|
11
|
-
* @param event - Optional change event
|
|
12
|
-
*/
|
|
13
|
-
readonly onChange?: (newValue: number, event?: React.ChangeEvent<HTMLInputElement>) => void;
|
|
14
|
-
readonly showMiniLabel?: boolean;
|
|
15
|
-
readonly value?: number;
|
|
16
|
-
}
|
|
17
|
-
export interface InputNumberRef {
|
|
18
|
-
focus: () => void;
|
|
19
|
-
blur: () => void;
|
|
20
|
-
}
|
|
@@ -1,277 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var tslib_es6 = require('./tslib.es6-cjs.js');
|
|
4
|
-
var React = require('react');
|
|
5
|
-
var classnames = require('classnames');
|
|
6
|
-
var ActivityIndicator = require('./ActivityIndicator-cjs.js');
|
|
7
|
-
var Button = require('./Button-cjs.js');
|
|
8
|
-
var Icon = require('./Icon-cjs.js');
|
|
9
|
-
var useRenderElement = require('./useRenderElement-cjs.js');
|
|
10
|
-
var FieldDescription = require('./FieldDescription-cjs.js');
|
|
11
|
-
var NumberFieldInput = require('./NumberFieldInput-cjs.js');
|
|
12
|
-
|
|
13
|
-
var styles = {"container":"_6HZLFIOZh4s-","inline":"_-6ndFYNKKaM-","wrapper":"c20czk-FSyY-","disabled":"_-2INirAxaU4-","small":"NsFBA5oqRAA-","large":"ExKqck-6xVs-","center":"UWiqNi57G8g-","right":"po25PZwJpe4-","inputWrapper":"k9dAO6d010o-","input":"D-PmE-l-hZU-","stepper":"t42w4ZDiDyI-","loadingIndicator":"NLptJ1t9Pj4-","label":"Ggk3aaMcIJU-","hideLabel":"C7d6qmoZiKU-","affixLabel":"_4u1JHjUYvkY-","prefix":"rEWH41rUUEE-","suffix":"_4-iNl6jdfmM-","affixIcon":"_5-Iw-2c-wXk-","compoundAffix":"tZjZRRcAShY-","affixLabelText":"mbEcqyBQoEg-","stepperButton":"zzrCzYF-8u0-","belowField":"_0mcAZAtwQ2o-","description":"xxp2uGc-B6o-","fieldError":"q-WsOi6joGo-","spinning":"d0TEiLWObKU-"};
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Default formatting used only when the consumer does not pass `format`.
|
|
17
|
-
* Base UI rounds committed values to `maximumFractionDigits`, so this cap also
|
|
18
|
-
* scrubs IEEE-754 step drift (keeps `3.14 + 1` from committing
|
|
19
|
-
* `4.140000000000001`). 12 sits below that noise floor while keeping more
|
|
20
|
-
* precision than a numeric field needs.
|
|
21
|
-
*/
|
|
22
|
-
const DEFAULT_FORMAT = {
|
|
23
|
-
useGrouping: false,
|
|
24
|
-
maximumFractionDigits: 12,
|
|
25
|
-
};
|
|
26
|
-
const InputNumberExperimentalContext = React.createContext(null);
|
|
27
|
-
function useInputNumberExperimentalContext(consumer) {
|
|
28
|
-
const context = React.useContext(InputNumberExperimentalContext);
|
|
29
|
-
if (context === null) {
|
|
30
|
-
throw new Error(`<InputNumberExperimental.${consumer}> must be used inside <InputNumberExperimental.Wrapper>.`);
|
|
31
|
-
}
|
|
32
|
-
return context;
|
|
33
|
-
}
|
|
34
|
-
function InputNumberExperimentalWrapper(_a) {
|
|
35
|
-
var { ref } = _a, props = tslib_es6.__rest(_a, ["ref"]);
|
|
36
|
-
const { align, autoComplete, children, className, disabled, format, id: idProp, inline, inputMode, invalid, loading, max, min, name, onBlur, onEnter, onFocus, onKeyDown, onKeyUp, onValueChange, onValueCommitted, readOnly, showMiniLabel = true, size = "default", step = 1, style, value, } = props;
|
|
37
|
-
const generatedId = React.useId();
|
|
38
|
-
const id = idProp !== null && idProp !== void 0 ? idProp : generatedId;
|
|
39
|
-
const innerInputRef = React.useRef(null);
|
|
40
|
-
React.useImperativeHandle(ref, () => ({
|
|
41
|
-
focus: () => { var _a; return (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
|
|
42
|
-
blur: () => { var _a; return (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.blur(); },
|
|
43
|
-
}), []);
|
|
44
|
-
const handleValueCommitted = React.useCallback((newValue) => onValueCommitted === null || onValueCommitted === void 0 ? void 0 : onValueCommitted(newValue), [onValueCommitted]);
|
|
45
|
-
const handleValueChange = React.useCallback((newValue) => onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newValue), [onValueChange]);
|
|
46
|
-
const handleKeyDown = React.useCallback((event) => {
|
|
47
|
-
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
|
|
48
|
-
if (event.key === "Enter" &&
|
|
49
|
-
!event.shiftKey &&
|
|
50
|
-
!event.ctrlKey &&
|
|
51
|
-
!event.metaKey) {
|
|
52
|
-
onEnter === null || onEnter === void 0 ? void 0 : onEnter(event);
|
|
53
|
-
// Commit on Enter. Base UI commits on blur, not Enter, so round-trip
|
|
54
|
-
// focus to fire onValueCommitted via blur and restore focus immediately.
|
|
55
|
-
const target = event.currentTarget;
|
|
56
|
-
target.blur();
|
|
57
|
-
target.focus();
|
|
58
|
-
}
|
|
59
|
-
}, [onKeyDown, onEnter]);
|
|
60
|
-
// `handleKeyDown` transitively tracks `onKeyDown`/`onEnter` via its own deps,
|
|
61
|
-
// so they are intentionally not listed separately here.
|
|
62
|
-
const contextValue = React.useMemo(() => ({
|
|
63
|
-
align,
|
|
64
|
-
autoComplete,
|
|
65
|
-
disabled,
|
|
66
|
-
format,
|
|
67
|
-
id,
|
|
68
|
-
innerInputRef,
|
|
69
|
-
inputMode,
|
|
70
|
-
loading,
|
|
71
|
-
max,
|
|
72
|
-
min,
|
|
73
|
-
onBlur,
|
|
74
|
-
onFocus,
|
|
75
|
-
onKeyDown: handleKeyDown,
|
|
76
|
-
onKeyUp,
|
|
77
|
-
onValueChange: handleValueChange,
|
|
78
|
-
onValueCommitted: handleValueCommitted,
|
|
79
|
-
readOnly,
|
|
80
|
-
showMiniLabel,
|
|
81
|
-
showStepper: !disabled && !readOnly,
|
|
82
|
-
size,
|
|
83
|
-
step,
|
|
84
|
-
value,
|
|
85
|
-
}), [
|
|
86
|
-
align,
|
|
87
|
-
autoComplete,
|
|
88
|
-
disabled,
|
|
89
|
-
format,
|
|
90
|
-
id,
|
|
91
|
-
inputMode,
|
|
92
|
-
loading,
|
|
93
|
-
max,
|
|
94
|
-
min,
|
|
95
|
-
onBlur,
|
|
96
|
-
onFocus,
|
|
97
|
-
handleKeyDown,
|
|
98
|
-
onKeyUp,
|
|
99
|
-
handleValueChange,
|
|
100
|
-
handleValueCommitted,
|
|
101
|
-
readOnly,
|
|
102
|
-
showMiniLabel,
|
|
103
|
-
size,
|
|
104
|
-
step,
|
|
105
|
-
value,
|
|
106
|
-
]);
|
|
107
|
-
const rootProps = useRenderElement.mergeProps({ className: classnames(styles.container, inline && styles.inline) }, { className, style });
|
|
108
|
-
return (React.createElement(FieldDescription.FieldRoot, Object.assign({}, rootProps, { disabled: disabled, invalid: invalid || undefined, name: name }),
|
|
109
|
-
React.createElement(InputNumberExperimentalContext.Provider, { value: contextValue }, children)));
|
|
110
|
-
}
|
|
111
|
-
function InputNumberExperimentalGroup({ children, className, style, }) {
|
|
112
|
-
var _a, _b;
|
|
113
|
-
const ctx = useInputNumberExperimentalContext("Group");
|
|
114
|
-
const groupProps = useRenderElement.mergeProps({
|
|
115
|
-
className: classnames(styles.wrapper, ctx.align && styles[ctx.align], ctx.disabled && styles.disabled, ctx.size !== "default" && styles[ctx.size]),
|
|
116
|
-
}, { className, style });
|
|
117
|
-
return (React.createElement(NumberFieldInput.NumberFieldRoot, { allowOutOfRange: true, format: (_a = ctx.format) !== null && _a !== void 0 ? _a : DEFAULT_FORMAT, id: ctx.id, max: ctx.max, min: ctx.min, onValueChange: ctx.onValueChange, onValueCommitted: ctx.onValueCommitted, readOnly: ctx.readOnly, step: ctx.step, value: (_b = ctx.value) !== null && _b !== void 0 ? _b : null },
|
|
118
|
-
React.createElement(NumberFieldInput.NumberFieldGroup, Object.assign({}, groupProps), children)));
|
|
119
|
-
}
|
|
120
|
-
function InputNumberExperimentalFooter({ children, className, style, }) {
|
|
121
|
-
useInputNumberExperimentalContext("Footer");
|
|
122
|
-
const rootProps = useRenderElement.mergeProps({ className: styles.belowField }, { className, style });
|
|
123
|
-
return React.createElement("div", Object.assign({}, rootProps), children);
|
|
124
|
-
}
|
|
125
|
-
function InputNumberExperimentalInput({ children, className, style, }) {
|
|
126
|
-
const ctx = useInputNumberExperimentalContext("Input");
|
|
127
|
-
const rootProps = useRenderElement.mergeProps({
|
|
128
|
-
className: classnames(styles.inputWrapper, !ctx.showMiniLabel && styles.hideLabel, ctx.size !== "default" && styles[ctx.size], ctx.disabled && styles.disabled),
|
|
129
|
-
}, { className, style });
|
|
130
|
-
return (React.createElement("div", Object.assign({}, rootProps),
|
|
131
|
-
React.createElement(NumberFieldInput.NumberFieldInput, { "aria-busy": ctx.loading || undefined, autoComplete: resolveAutoComplete(ctx.autoComplete), className: styles.input, inputMode: ctx.inputMode, onBlur: ctx.onBlur, onFocus: ctx.onFocus, onKeyDown: ctx.onKeyDown, onKeyUp: ctx.onKeyUp, placeholder: " ", ref: ctx.innerInputRef }),
|
|
132
|
-
children));
|
|
133
|
-
}
|
|
134
|
-
function InputNumberExperimentalLabel({ children, className, style, }) {
|
|
135
|
-
const ctx = useInputNumberExperimentalContext("Label");
|
|
136
|
-
if (!children)
|
|
137
|
-
return null;
|
|
138
|
-
return (React.createElement(FieldDescription.FieldLabel, { className: classnames(styles.label, className), htmlFor: ctx.id, style: style }, children));
|
|
139
|
-
}
|
|
140
|
-
function InputNumberExperimentalDescription({ children, className, style, }) {
|
|
141
|
-
useInputNumberExperimentalContext("Description");
|
|
142
|
-
if (!children)
|
|
143
|
-
return null;
|
|
144
|
-
return (React.createElement(FieldDescription.FieldDescription, { className: classnames(styles.description, className), style: style }, children));
|
|
145
|
-
}
|
|
146
|
-
function InputNumberExperimentalError({ children, className, style, }) {
|
|
147
|
-
useInputNumberExperimentalContext("Error");
|
|
148
|
-
if (!children)
|
|
149
|
-
return null;
|
|
150
|
-
return (React.createElement(FieldDescription.FieldError, { className: classnames(styles.fieldError, className), match: true, role: "alert", style: style }, children));
|
|
151
|
-
}
|
|
152
|
-
function InputNumberExperimentalLoading({ children, className, style, }) {
|
|
153
|
-
useInputNumberExperimentalContext("Loading");
|
|
154
|
-
const rootProps = useRenderElement.mergeProps({ className: styles.loadingIndicator }, { className, style });
|
|
155
|
-
return (React.createElement("div", Object.assign({}, rootProps), children !== null && children !== void 0 ? children : React.createElement(ActivityIndicator.ActivityIndicator, { size: "small" })));
|
|
156
|
-
}
|
|
157
|
-
function InputNumberExperimentalStepper({ children, incrementLabel, decrementLabel, className, style, }) {
|
|
158
|
-
const ctx = useInputNumberExperimentalContext("Stepper");
|
|
159
|
-
if (ctx.loading || !ctx.showStepper) {
|
|
160
|
-
return null;
|
|
161
|
-
}
|
|
162
|
-
const rootProps = useRenderElement.mergeProps({ className: styles.stepper }, { className, style });
|
|
163
|
-
return (React.createElement("div", Object.assign({}, rootProps), children !== null && children !== void 0 ? children : (React.createElement(React.Fragment, null,
|
|
164
|
-
React.createElement(InputNumberExperimentalIncrement, { ariaLabel: incrementLabel }),
|
|
165
|
-
React.createElement(InputNumberExperimentalDecrement, { ariaLabel: decrementLabel })))));
|
|
166
|
-
}
|
|
167
|
-
function InputNumberExperimentalIncrement({ children, ariaLabel, className, style, }) {
|
|
168
|
-
useInputNumberExperimentalContext("Increment");
|
|
169
|
-
const rootProps = useRenderElement.mergeProps({ className: styles.stepperButton }, { className, style });
|
|
170
|
-
return (React.createElement(NumberFieldInput.NumberFieldIncrement, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Increase value" }, rootProps), children !== null && children !== void 0 ? children : (React.createElement(Icon.Icon, { name: "arrowUp", size: "small", customColor: "currentColor" }))));
|
|
171
|
-
}
|
|
172
|
-
function InputNumberExperimentalDecrement({ children, ariaLabel, className, style, }) {
|
|
173
|
-
useInputNumberExperimentalContext("Decrement");
|
|
174
|
-
const rootProps = useRenderElement.mergeProps({ className: styles.stepperButton }, { className, style });
|
|
175
|
-
return (React.createElement(NumberFieldInput.NumberFieldDecrement, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Decrease value" }, rootProps), children !== null && children !== void 0 ? children : (React.createElement(Icon.Icon, { name: "arrowDown", size: "small", customColor: "currentColor" }))));
|
|
176
|
-
}
|
|
177
|
-
function InputNumberExperimentalAffixCompound({ variation, label, icon, onClick, ariaLabel, children, className, style, }) {
|
|
178
|
-
const ctx = useInputNumberExperimentalContext("Affix");
|
|
179
|
-
if (!icon && !label && !children) {
|
|
180
|
-
return null;
|
|
181
|
-
}
|
|
182
|
-
const rootProps = useRenderElement.mergeProps({
|
|
183
|
-
className: classnames(styles.compoundAffix, variation === "suffix" && styles.suffix),
|
|
184
|
-
}, { className, style });
|
|
185
|
-
return (React.createElement("div", Object.assign({}, rootProps),
|
|
186
|
-
icon && (React.createElement(AffixIconContent, { icon: icon, size: ctx.size, onClick: onClick, ariaLabel: ariaLabel })),
|
|
187
|
-
label && React.createElement("span", { className: styles.affixLabelText }, label),
|
|
188
|
-
children));
|
|
189
|
-
}
|
|
190
|
-
/**
|
|
191
|
-
* Renders the prop-driven `prefix`/`suffix` affixes for the sugar component.
|
|
192
|
-
* Icons sit outside the input area; labels render next to the typed value
|
|
193
|
-
* (suffix mirrors the order). The composable `.Affix` part is the alternative
|
|
194
|
-
* when composing the field directly.
|
|
195
|
-
*/
|
|
196
|
-
function renderDefaultAffix(variation, affix, size) {
|
|
197
|
-
const icon = affix.icon && (React.createElement(AffixIconSlot, { variation: variation, icon: affix.icon, size: size, ariaLabel: "ariaLabel" in affix ? affix.ariaLabel : undefined, onClick: "onClick" in affix ? affix.onClick : undefined }));
|
|
198
|
-
const affixLabel = affix.label && (React.createElement(AffixLabelSlot, { variation: variation, label: affix.label }));
|
|
199
|
-
return variation === "prefix" ? (React.createElement(React.Fragment, null,
|
|
200
|
-
icon,
|
|
201
|
-
affixLabel)) : (React.createElement(React.Fragment, null,
|
|
202
|
-
affixLabel,
|
|
203
|
-
icon));
|
|
204
|
-
}
|
|
205
|
-
function AffixIconSlot({ variation, icon, size, onClick, ariaLabel, }) {
|
|
206
|
-
return (React.createElement("div", { className: classnames(styles.affixIcon, variation === "suffix" && styles.suffix) },
|
|
207
|
-
React.createElement(AffixIconContent, { icon: icon, size: size, onClick: onClick, ariaLabel: ariaLabel })));
|
|
208
|
-
}
|
|
209
|
-
function AffixIconContent({ icon, size, onClick, ariaLabel, }) {
|
|
210
|
-
const iconSize = size === "small" ? "small" : "base";
|
|
211
|
-
if (onClick) {
|
|
212
|
-
return (React.createElement(Button.Button, { ariaLabel: ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Action", icon: icon, onClick: onClick, size: iconSize, type: "tertiary", variation: "subtle" }));
|
|
213
|
-
}
|
|
214
|
-
return React.createElement(Icon.Icon, { name: icon, size: iconSize, color: "greyBlue" });
|
|
215
|
-
}
|
|
216
|
-
function AffixLabelSlot({ variation, label }) {
|
|
217
|
-
return (React.createElement("div", { className: classnames(styles.affixLabel, variation === "prefix" && styles.prefix, variation === "suffix" && styles.suffix) }, label));
|
|
218
|
-
}
|
|
219
|
-
function resolveAutoComplete(autoComplete) {
|
|
220
|
-
if (autoComplete === false)
|
|
221
|
-
return "off";
|
|
222
|
-
if (autoComplete === true || autoComplete === undefined)
|
|
223
|
-
return undefined;
|
|
224
|
-
return autoComplete;
|
|
225
|
-
}
|
|
226
|
-
/**
|
|
227
|
-
* Sugar layer: composes the parts from props. This is the same composition a
|
|
228
|
-
* consumer would write by hand with `<InputNumberExperimental.Wrapper>` and the
|
|
229
|
-
* parts — to customize a single piece, copy this tree and swap that part.
|
|
230
|
-
*/
|
|
231
|
-
function InputNumberExperimental(_a) {
|
|
232
|
-
var _b;
|
|
233
|
-
var { ref } = _a, props = tslib_es6.__rest(_a, ["ref"]);
|
|
234
|
-
const { label, description, error, prefix, suffix } = props, config = tslib_es6.__rest(props, ["label", "description", "error", "prefix", "suffix"]);
|
|
235
|
-
const size = (_b = config.size) !== null && _b !== void 0 ? _b : "default";
|
|
236
|
-
return (React.createElement(InputNumberExperimentalWrapper, Object.assign({}, config, { invalid: config.invalid || Boolean(error), ref: ref }),
|
|
237
|
-
React.createElement(InputNumberExperimentalGroup, null,
|
|
238
|
-
prefix && renderDefaultAffix("prefix", prefix, size),
|
|
239
|
-
React.createElement(InputNumberExperimentalInput, null,
|
|
240
|
-
React.createElement(InputNumberExperimentalLabel, null, label),
|
|
241
|
-
config.loading ? (React.createElement(InputNumberExperimentalLoading, null)) : (React.createElement(InputNumberExperimentalStepper, { incrementLabel: `Increase ${label !== null && label !== void 0 ? label : "value"}`, decrementLabel: `Decrease ${label !== null && label !== void 0 ? label : "value"}` }))),
|
|
242
|
-
suffix && renderDefaultAffix("suffix", suffix, size)),
|
|
243
|
-
(description || error) && (React.createElement(InputNumberExperimentalFooter, null,
|
|
244
|
-
React.createElement(InputNumberExperimentalDescription, null, description),
|
|
245
|
-
React.createElement(InputNumberExperimentalError, null, error)))));
|
|
246
|
-
}
|
|
247
|
-
InputNumberExperimentalWrapper.displayName = "InputNumberExperimental.Wrapper";
|
|
248
|
-
InputNumberExperimental.displayName = "InputNumberExperimental";
|
|
249
|
-
InputNumberExperimentalGroup.displayName = "InputNumberExperimental.Group";
|
|
250
|
-
InputNumberExperimentalFooter.displayName = "InputNumberExperimental.Footer";
|
|
251
|
-
InputNumberExperimentalInput.displayName = "InputNumberExperimental.Input";
|
|
252
|
-
InputNumberExperimentalLabel.displayName = "InputNumberExperimental.Label";
|
|
253
|
-
InputNumberExperimentalDescription.displayName =
|
|
254
|
-
"InputNumberExperimental.Description";
|
|
255
|
-
InputNumberExperimentalError.displayName = "InputNumberExperimental.Error";
|
|
256
|
-
InputNumberExperimentalLoading.displayName = "InputNumberExperimental.Loading";
|
|
257
|
-
InputNumberExperimentalStepper.displayName = "InputNumberExperimental.Stepper";
|
|
258
|
-
InputNumberExperimentalIncrement.displayName =
|
|
259
|
-
"InputNumberExperimental.Increment";
|
|
260
|
-
InputNumberExperimentalDecrement.displayName =
|
|
261
|
-
"InputNumberExperimental.Decrement";
|
|
262
|
-
InputNumberExperimentalAffixCompound.displayName =
|
|
263
|
-
"InputNumberExperimental.Affix";
|
|
264
|
-
InputNumberExperimental.Wrapper = InputNumberExperimentalWrapper;
|
|
265
|
-
InputNumberExperimental.Group = InputNumberExperimentalGroup;
|
|
266
|
-
InputNumberExperimental.Footer = InputNumberExperimentalFooter;
|
|
267
|
-
InputNumberExperimental.Input = InputNumberExperimentalInput;
|
|
268
|
-
InputNumberExperimental.Label = InputNumberExperimentalLabel;
|
|
269
|
-
InputNumberExperimental.Description = InputNumberExperimentalDescription;
|
|
270
|
-
InputNumberExperimental.Error = InputNumberExperimentalError;
|
|
271
|
-
InputNumberExperimental.Loading = InputNumberExperimentalLoading;
|
|
272
|
-
InputNumberExperimental.Stepper = InputNumberExperimentalStepper;
|
|
273
|
-
InputNumberExperimental.Increment = InputNumberExperimentalIncrement;
|
|
274
|
-
InputNumberExperimental.Decrement = InputNumberExperimentalDecrement;
|
|
275
|
-
InputNumberExperimental.Affix = InputNumberExperimentalAffixCompound;
|
|
276
|
-
|
|
277
|
-
exports.InputNumberExperimental = InputNumberExperimental;
|
|
@@ -1,275 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-es.js';
|
|
2
|
-
import React__default, { createContext, useId, useRef, useImperativeHandle, useCallback, useMemo, useContext } from 'react';
|
|
3
|
-
import classnames from 'classnames';
|
|
4
|
-
import { A as ActivityIndicator } from './ActivityIndicator-es.js';
|
|
5
|
-
import { B as Button } from './Button-es.js';
|
|
6
|
-
import { I as Icon } from './Icon-es.js';
|
|
7
|
-
import { m as mergeProps } from './useRenderElement-es.js';
|
|
8
|
-
import { F as FieldRoot, a as FieldLabel, b as FieldDescription, c as FieldError } from './FieldDescription-es.js';
|
|
9
|
-
import { N as NumberFieldRoot, a as NumberFieldGroup, b as NumberFieldInput, c as NumberFieldIncrement, d as NumberFieldDecrement } from './NumberFieldInput-es.js';
|
|
10
|
-
|
|
11
|
-
var styles = {"container":"_6HZLFIOZh4s-","inline":"_-6ndFYNKKaM-","wrapper":"c20czk-FSyY-","disabled":"_-2INirAxaU4-","small":"NsFBA5oqRAA-","large":"ExKqck-6xVs-","center":"UWiqNi57G8g-","right":"po25PZwJpe4-","inputWrapper":"k9dAO6d010o-","input":"D-PmE-l-hZU-","stepper":"t42w4ZDiDyI-","loadingIndicator":"NLptJ1t9Pj4-","label":"Ggk3aaMcIJU-","hideLabel":"C7d6qmoZiKU-","affixLabel":"_4u1JHjUYvkY-","prefix":"rEWH41rUUEE-","suffix":"_4-iNl6jdfmM-","affixIcon":"_5-Iw-2c-wXk-","compoundAffix":"tZjZRRcAShY-","affixLabelText":"mbEcqyBQoEg-","stepperButton":"zzrCzYF-8u0-","belowField":"_0mcAZAtwQ2o-","description":"xxp2uGc-B6o-","fieldError":"q-WsOi6joGo-","spinning":"d0TEiLWObKU-"};
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Default formatting used only when the consumer does not pass `format`.
|
|
15
|
-
* Base UI rounds committed values to `maximumFractionDigits`, so this cap also
|
|
16
|
-
* scrubs IEEE-754 step drift (keeps `3.14 + 1` from committing
|
|
17
|
-
* `4.140000000000001`). 12 sits below that noise floor while keeping more
|
|
18
|
-
* precision than a numeric field needs.
|
|
19
|
-
*/
|
|
20
|
-
const DEFAULT_FORMAT = {
|
|
21
|
-
useGrouping: false,
|
|
22
|
-
maximumFractionDigits: 12,
|
|
23
|
-
};
|
|
24
|
-
const InputNumberExperimentalContext = createContext(null);
|
|
25
|
-
function useInputNumberExperimentalContext(consumer) {
|
|
26
|
-
const context = useContext(InputNumberExperimentalContext);
|
|
27
|
-
if (context === null) {
|
|
28
|
-
throw new Error(`<InputNumberExperimental.${consumer}> must be used inside <InputNumberExperimental.Wrapper>.`);
|
|
29
|
-
}
|
|
30
|
-
return context;
|
|
31
|
-
}
|
|
32
|
-
function InputNumberExperimentalWrapper(_a) {
|
|
33
|
-
var { ref } = _a, props = __rest(_a, ["ref"]);
|
|
34
|
-
const { align, autoComplete, children, className, disabled, format, id: idProp, inline, inputMode, invalid, loading, max, min, name, onBlur, onEnter, onFocus, onKeyDown, onKeyUp, onValueChange, onValueCommitted, readOnly, showMiniLabel = true, size = "default", step = 1, style, value, } = props;
|
|
35
|
-
const generatedId = useId();
|
|
36
|
-
const id = idProp !== null && idProp !== void 0 ? idProp : generatedId;
|
|
37
|
-
const innerInputRef = useRef(null);
|
|
38
|
-
useImperativeHandle(ref, () => ({
|
|
39
|
-
focus: () => { var _a; return (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
|
|
40
|
-
blur: () => { var _a; return (_a = innerInputRef.current) === null || _a === void 0 ? void 0 : _a.blur(); },
|
|
41
|
-
}), []);
|
|
42
|
-
const handleValueCommitted = useCallback((newValue) => onValueCommitted === null || onValueCommitted === void 0 ? void 0 : onValueCommitted(newValue), [onValueCommitted]);
|
|
43
|
-
const handleValueChange = useCallback((newValue) => onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newValue), [onValueChange]);
|
|
44
|
-
const handleKeyDown = useCallback((event) => {
|
|
45
|
-
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
|
|
46
|
-
if (event.key === "Enter" &&
|
|
47
|
-
!event.shiftKey &&
|
|
48
|
-
!event.ctrlKey &&
|
|
49
|
-
!event.metaKey) {
|
|
50
|
-
onEnter === null || onEnter === void 0 ? void 0 : onEnter(event);
|
|
51
|
-
// Commit on Enter. Base UI commits on blur, not Enter, so round-trip
|
|
52
|
-
// focus to fire onValueCommitted via blur and restore focus immediately.
|
|
53
|
-
const target = event.currentTarget;
|
|
54
|
-
target.blur();
|
|
55
|
-
target.focus();
|
|
56
|
-
}
|
|
57
|
-
}, [onKeyDown, onEnter]);
|
|
58
|
-
// `handleKeyDown` transitively tracks `onKeyDown`/`onEnter` via its own deps,
|
|
59
|
-
// so they are intentionally not listed separately here.
|
|
60
|
-
const contextValue = useMemo(() => ({
|
|
61
|
-
align,
|
|
62
|
-
autoComplete,
|
|
63
|
-
disabled,
|
|
64
|
-
format,
|
|
65
|
-
id,
|
|
66
|
-
innerInputRef,
|
|
67
|
-
inputMode,
|
|
68
|
-
loading,
|
|
69
|
-
max,
|
|
70
|
-
min,
|
|
71
|
-
onBlur,
|
|
72
|
-
onFocus,
|
|
73
|
-
onKeyDown: handleKeyDown,
|
|
74
|
-
onKeyUp,
|
|
75
|
-
onValueChange: handleValueChange,
|
|
76
|
-
onValueCommitted: handleValueCommitted,
|
|
77
|
-
readOnly,
|
|
78
|
-
showMiniLabel,
|
|
79
|
-
showStepper: !disabled && !readOnly,
|
|
80
|
-
size,
|
|
81
|
-
step,
|
|
82
|
-
value,
|
|
83
|
-
}), [
|
|
84
|
-
align,
|
|
85
|
-
autoComplete,
|
|
86
|
-
disabled,
|
|
87
|
-
format,
|
|
88
|
-
id,
|
|
89
|
-
inputMode,
|
|
90
|
-
loading,
|
|
91
|
-
max,
|
|
92
|
-
min,
|
|
93
|
-
onBlur,
|
|
94
|
-
onFocus,
|
|
95
|
-
handleKeyDown,
|
|
96
|
-
onKeyUp,
|
|
97
|
-
handleValueChange,
|
|
98
|
-
handleValueCommitted,
|
|
99
|
-
readOnly,
|
|
100
|
-
showMiniLabel,
|
|
101
|
-
size,
|
|
102
|
-
step,
|
|
103
|
-
value,
|
|
104
|
-
]);
|
|
105
|
-
const rootProps = mergeProps({ className: classnames(styles.container, inline && styles.inline) }, { className, style });
|
|
106
|
-
return (React__default.createElement(FieldRoot, Object.assign({}, rootProps, { disabled: disabled, invalid: invalid || undefined, name: name }),
|
|
107
|
-
React__default.createElement(InputNumberExperimentalContext.Provider, { value: contextValue }, children)));
|
|
108
|
-
}
|
|
109
|
-
function InputNumberExperimentalGroup({ children, className, style, }) {
|
|
110
|
-
var _a, _b;
|
|
111
|
-
const ctx = useInputNumberExperimentalContext("Group");
|
|
112
|
-
const groupProps = mergeProps({
|
|
113
|
-
className: classnames(styles.wrapper, ctx.align && styles[ctx.align], ctx.disabled && styles.disabled, ctx.size !== "default" && styles[ctx.size]),
|
|
114
|
-
}, { className, style });
|
|
115
|
-
return (React__default.createElement(NumberFieldRoot, { allowOutOfRange: true, format: (_a = ctx.format) !== null && _a !== void 0 ? _a : DEFAULT_FORMAT, id: ctx.id, max: ctx.max, min: ctx.min, onValueChange: ctx.onValueChange, onValueCommitted: ctx.onValueCommitted, readOnly: ctx.readOnly, step: ctx.step, value: (_b = ctx.value) !== null && _b !== void 0 ? _b : null },
|
|
116
|
-
React__default.createElement(NumberFieldGroup, Object.assign({}, groupProps), children)));
|
|
117
|
-
}
|
|
118
|
-
function InputNumberExperimentalFooter({ children, className, style, }) {
|
|
119
|
-
useInputNumberExperimentalContext("Footer");
|
|
120
|
-
const rootProps = mergeProps({ className: styles.belowField }, { className, style });
|
|
121
|
-
return React__default.createElement("div", Object.assign({}, rootProps), children);
|
|
122
|
-
}
|
|
123
|
-
function InputNumberExperimentalInput({ children, className, style, }) {
|
|
124
|
-
const ctx = useInputNumberExperimentalContext("Input");
|
|
125
|
-
const rootProps = mergeProps({
|
|
126
|
-
className: classnames(styles.inputWrapper, !ctx.showMiniLabel && styles.hideLabel, ctx.size !== "default" && styles[ctx.size], ctx.disabled && styles.disabled),
|
|
127
|
-
}, { className, style });
|
|
128
|
-
return (React__default.createElement("div", Object.assign({}, rootProps),
|
|
129
|
-
React__default.createElement(NumberFieldInput, { "aria-busy": ctx.loading || undefined, autoComplete: resolveAutoComplete(ctx.autoComplete), className: styles.input, inputMode: ctx.inputMode, onBlur: ctx.onBlur, onFocus: ctx.onFocus, onKeyDown: ctx.onKeyDown, onKeyUp: ctx.onKeyUp, placeholder: " ", ref: ctx.innerInputRef }),
|
|
130
|
-
children));
|
|
131
|
-
}
|
|
132
|
-
function InputNumberExperimentalLabel({ children, className, style, }) {
|
|
133
|
-
const ctx = useInputNumberExperimentalContext("Label");
|
|
134
|
-
if (!children)
|
|
135
|
-
return null;
|
|
136
|
-
return (React__default.createElement(FieldLabel, { className: classnames(styles.label, className), htmlFor: ctx.id, style: style }, children));
|
|
137
|
-
}
|
|
138
|
-
function InputNumberExperimentalDescription({ children, className, style, }) {
|
|
139
|
-
useInputNumberExperimentalContext("Description");
|
|
140
|
-
if (!children)
|
|
141
|
-
return null;
|
|
142
|
-
return (React__default.createElement(FieldDescription, { className: classnames(styles.description, className), style: style }, children));
|
|
143
|
-
}
|
|
144
|
-
function InputNumberExperimentalError({ children, className, style, }) {
|
|
145
|
-
useInputNumberExperimentalContext("Error");
|
|
146
|
-
if (!children)
|
|
147
|
-
return null;
|
|
148
|
-
return (React__default.createElement(FieldError, { className: classnames(styles.fieldError, className), match: true, role: "alert", style: style }, children));
|
|
149
|
-
}
|
|
150
|
-
function InputNumberExperimentalLoading({ children, className, style, }) {
|
|
151
|
-
useInputNumberExperimentalContext("Loading");
|
|
152
|
-
const rootProps = mergeProps({ className: styles.loadingIndicator }, { className, style });
|
|
153
|
-
return (React__default.createElement("div", Object.assign({}, rootProps), children !== null && children !== void 0 ? children : React__default.createElement(ActivityIndicator, { size: "small" })));
|
|
154
|
-
}
|
|
155
|
-
function InputNumberExperimentalStepper({ children, incrementLabel, decrementLabel, className, style, }) {
|
|
156
|
-
const ctx = useInputNumberExperimentalContext("Stepper");
|
|
157
|
-
if (ctx.loading || !ctx.showStepper) {
|
|
158
|
-
return null;
|
|
159
|
-
}
|
|
160
|
-
const rootProps = mergeProps({ className: styles.stepper }, { className, style });
|
|
161
|
-
return (React__default.createElement("div", Object.assign({}, rootProps), children !== null && children !== void 0 ? children : (React__default.createElement(React__default.Fragment, null,
|
|
162
|
-
React__default.createElement(InputNumberExperimentalIncrement, { ariaLabel: incrementLabel }),
|
|
163
|
-
React__default.createElement(InputNumberExperimentalDecrement, { ariaLabel: decrementLabel })))));
|
|
164
|
-
}
|
|
165
|
-
function InputNumberExperimentalIncrement({ children, ariaLabel, className, style, }) {
|
|
166
|
-
useInputNumberExperimentalContext("Increment");
|
|
167
|
-
const rootProps = mergeProps({ className: styles.stepperButton }, { className, style });
|
|
168
|
-
return (React__default.createElement(NumberFieldIncrement, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Increase value" }, rootProps), children !== null && children !== void 0 ? children : (React__default.createElement(Icon, { name: "arrowUp", size: "small", customColor: "currentColor" }))));
|
|
169
|
-
}
|
|
170
|
-
function InputNumberExperimentalDecrement({ children, ariaLabel, className, style, }) {
|
|
171
|
-
useInputNumberExperimentalContext("Decrement");
|
|
172
|
-
const rootProps = mergeProps({ className: styles.stepperButton }, { className, style });
|
|
173
|
-
return (React__default.createElement(NumberFieldDecrement, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Decrease value" }, rootProps), children !== null && children !== void 0 ? children : (React__default.createElement(Icon, { name: "arrowDown", size: "small", customColor: "currentColor" }))));
|
|
174
|
-
}
|
|
175
|
-
function InputNumberExperimentalAffixCompound({ variation, label, icon, onClick, ariaLabel, children, className, style, }) {
|
|
176
|
-
const ctx = useInputNumberExperimentalContext("Affix");
|
|
177
|
-
if (!icon && !label && !children) {
|
|
178
|
-
return null;
|
|
179
|
-
}
|
|
180
|
-
const rootProps = mergeProps({
|
|
181
|
-
className: classnames(styles.compoundAffix, variation === "suffix" && styles.suffix),
|
|
182
|
-
}, { className, style });
|
|
183
|
-
return (React__default.createElement("div", Object.assign({}, rootProps),
|
|
184
|
-
icon && (React__default.createElement(AffixIconContent, { icon: icon, size: ctx.size, onClick: onClick, ariaLabel: ariaLabel })),
|
|
185
|
-
label && React__default.createElement("span", { className: styles.affixLabelText }, label),
|
|
186
|
-
children));
|
|
187
|
-
}
|
|
188
|
-
/**
|
|
189
|
-
* Renders the prop-driven `prefix`/`suffix` affixes for the sugar component.
|
|
190
|
-
* Icons sit outside the input area; labels render next to the typed value
|
|
191
|
-
* (suffix mirrors the order). The composable `.Affix` part is the alternative
|
|
192
|
-
* when composing the field directly.
|
|
193
|
-
*/
|
|
194
|
-
function renderDefaultAffix(variation, affix, size) {
|
|
195
|
-
const icon = affix.icon && (React__default.createElement(AffixIconSlot, { variation: variation, icon: affix.icon, size: size, ariaLabel: "ariaLabel" in affix ? affix.ariaLabel : undefined, onClick: "onClick" in affix ? affix.onClick : undefined }));
|
|
196
|
-
const affixLabel = affix.label && (React__default.createElement(AffixLabelSlot, { variation: variation, label: affix.label }));
|
|
197
|
-
return variation === "prefix" ? (React__default.createElement(React__default.Fragment, null,
|
|
198
|
-
icon,
|
|
199
|
-
affixLabel)) : (React__default.createElement(React__default.Fragment, null,
|
|
200
|
-
affixLabel,
|
|
201
|
-
icon));
|
|
202
|
-
}
|
|
203
|
-
function AffixIconSlot({ variation, icon, size, onClick, ariaLabel, }) {
|
|
204
|
-
return (React__default.createElement("div", { className: classnames(styles.affixIcon, variation === "suffix" && styles.suffix) },
|
|
205
|
-
React__default.createElement(AffixIconContent, { icon: icon, size: size, onClick: onClick, ariaLabel: ariaLabel })));
|
|
206
|
-
}
|
|
207
|
-
function AffixIconContent({ icon, size, onClick, ariaLabel, }) {
|
|
208
|
-
const iconSize = size === "small" ? "small" : "base";
|
|
209
|
-
if (onClick) {
|
|
210
|
-
return (React__default.createElement(Button, { ariaLabel: ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Action", icon: icon, onClick: onClick, size: iconSize, type: "tertiary", variation: "subtle" }));
|
|
211
|
-
}
|
|
212
|
-
return React__default.createElement(Icon, { name: icon, size: iconSize, color: "greyBlue" });
|
|
213
|
-
}
|
|
214
|
-
function AffixLabelSlot({ variation, label }) {
|
|
215
|
-
return (React__default.createElement("div", { className: classnames(styles.affixLabel, variation === "prefix" && styles.prefix, variation === "suffix" && styles.suffix) }, label));
|
|
216
|
-
}
|
|
217
|
-
function resolveAutoComplete(autoComplete) {
|
|
218
|
-
if (autoComplete === false)
|
|
219
|
-
return "off";
|
|
220
|
-
if (autoComplete === true || autoComplete === undefined)
|
|
221
|
-
return undefined;
|
|
222
|
-
return autoComplete;
|
|
223
|
-
}
|
|
224
|
-
/**
|
|
225
|
-
* Sugar layer: composes the parts from props. This is the same composition a
|
|
226
|
-
* consumer would write by hand with `<InputNumberExperimental.Wrapper>` and the
|
|
227
|
-
* parts — to customize a single piece, copy this tree and swap that part.
|
|
228
|
-
*/
|
|
229
|
-
function InputNumberExperimental(_a) {
|
|
230
|
-
var _b;
|
|
231
|
-
var { ref } = _a, props = __rest(_a, ["ref"]);
|
|
232
|
-
const { label, description, error, prefix, suffix } = props, config = __rest(props, ["label", "description", "error", "prefix", "suffix"]);
|
|
233
|
-
const size = (_b = config.size) !== null && _b !== void 0 ? _b : "default";
|
|
234
|
-
return (React__default.createElement(InputNumberExperimentalWrapper, Object.assign({}, config, { invalid: config.invalid || Boolean(error), ref: ref }),
|
|
235
|
-
React__default.createElement(InputNumberExperimentalGroup, null,
|
|
236
|
-
prefix && renderDefaultAffix("prefix", prefix, size),
|
|
237
|
-
React__default.createElement(InputNumberExperimentalInput, null,
|
|
238
|
-
React__default.createElement(InputNumberExperimentalLabel, null, label),
|
|
239
|
-
config.loading ? (React__default.createElement(InputNumberExperimentalLoading, null)) : (React__default.createElement(InputNumberExperimentalStepper, { incrementLabel: `Increase ${label !== null && label !== void 0 ? label : "value"}`, decrementLabel: `Decrease ${label !== null && label !== void 0 ? label : "value"}` }))),
|
|
240
|
-
suffix && renderDefaultAffix("suffix", suffix, size)),
|
|
241
|
-
(description || error) && (React__default.createElement(InputNumberExperimentalFooter, null,
|
|
242
|
-
React__default.createElement(InputNumberExperimentalDescription, null, description),
|
|
243
|
-
React__default.createElement(InputNumberExperimentalError, null, error)))));
|
|
244
|
-
}
|
|
245
|
-
InputNumberExperimentalWrapper.displayName = "InputNumberExperimental.Wrapper";
|
|
246
|
-
InputNumberExperimental.displayName = "InputNumberExperimental";
|
|
247
|
-
InputNumberExperimentalGroup.displayName = "InputNumberExperimental.Group";
|
|
248
|
-
InputNumberExperimentalFooter.displayName = "InputNumberExperimental.Footer";
|
|
249
|
-
InputNumberExperimentalInput.displayName = "InputNumberExperimental.Input";
|
|
250
|
-
InputNumberExperimentalLabel.displayName = "InputNumberExperimental.Label";
|
|
251
|
-
InputNumberExperimentalDescription.displayName =
|
|
252
|
-
"InputNumberExperimental.Description";
|
|
253
|
-
InputNumberExperimentalError.displayName = "InputNumberExperimental.Error";
|
|
254
|
-
InputNumberExperimentalLoading.displayName = "InputNumberExperimental.Loading";
|
|
255
|
-
InputNumberExperimentalStepper.displayName = "InputNumberExperimental.Stepper";
|
|
256
|
-
InputNumberExperimentalIncrement.displayName =
|
|
257
|
-
"InputNumberExperimental.Increment";
|
|
258
|
-
InputNumberExperimentalDecrement.displayName =
|
|
259
|
-
"InputNumberExperimental.Decrement";
|
|
260
|
-
InputNumberExperimentalAffixCompound.displayName =
|
|
261
|
-
"InputNumberExperimental.Affix";
|
|
262
|
-
InputNumberExperimental.Wrapper = InputNumberExperimentalWrapper;
|
|
263
|
-
InputNumberExperimental.Group = InputNumberExperimentalGroup;
|
|
264
|
-
InputNumberExperimental.Footer = InputNumberExperimentalFooter;
|
|
265
|
-
InputNumberExperimental.Input = InputNumberExperimentalInput;
|
|
266
|
-
InputNumberExperimental.Label = InputNumberExperimentalLabel;
|
|
267
|
-
InputNumberExperimental.Description = InputNumberExperimentalDescription;
|
|
268
|
-
InputNumberExperimental.Error = InputNumberExperimentalError;
|
|
269
|
-
InputNumberExperimental.Loading = InputNumberExperimentalLoading;
|
|
270
|
-
InputNumberExperimental.Stepper = InputNumberExperimentalStepper;
|
|
271
|
-
InputNumberExperimental.Increment = InputNumberExperimentalIncrement;
|
|
272
|
-
InputNumberExperimental.Decrement = InputNumberExperimentalDecrement;
|
|
273
|
-
InputNumberExperimental.Affix = InputNumberExperimentalAffixCompound;
|
|
274
|
-
|
|
275
|
-
export { InputNumberExperimental as I };
|
package/dist/clamp-cjs.js
DELETED
package/dist/clamp-es.js
DELETED
package/dist/clsx-cjs.js
DELETED
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
4
|
-
|
|
5
|
-
exports.clsx = clsx;
|
package/dist/clsx-es.js
DELETED
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
2
|
-
|
|
3
|
-
export { clsx as c };
|