@eightshift/ui-components 5.0.9 → 5.1.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/{Collection-uTAXq9Br.js → Collection-BRJOMbOa.js} +12 -7
- package/dist/{Dialog-CmAxaSUv.js → Dialog-D6EdDPeu.js} +8 -8
- package/dist/{useFormValidation-Dy0PXJg5.js → Form-Bnyyv3Im.js} +6 -4
- package/dist/{Group-DDPhPPTQ.js → Group-LBogWgyp.js} +2 -2
- package/dist/{Input-BmDS8Juy.js → Input-DfSBLhDx.js} +1 -1
- package/dist/List-BLeHBkfx.js +590 -0
- package/dist/{ListBox-_nDFq8-H.js → ListBox-BY3gwI8c.js} +3 -3
- package/dist/Select-BebwUgKB.js +764 -0
- package/dist/Separator-CTQWg_HO.js +1111 -0
- package/dist/TextField-o2U-uBWv.js +133 -0
- package/dist/assets/style-admin.css +268 -150
- package/dist/assets/style-editor.css +268 -150
- package/dist/assets/style.css +268 -150
- package/dist/assets/wp-font-enhancements.css +1 -1
- package/dist/assets/wp-ui-enhancements.css +1 -1
- package/dist/components/breakpoint-preview/breakpoint-preview.js +3 -4
- package/dist/components/button/button.js +3 -3
- package/dist/components/checkbox/checkbox.js +1 -2
- package/dist/components/color-pickers/color-picker.js +7 -9
- package/dist/components/color-pickers/color-swatch.js +1 -1
- package/dist/components/color-pickers/gradient-editor.js +19 -25
- package/dist/components/color-pickers/solid-color-picker.js +27 -27
- package/dist/components/component-toggle/component-toggle.js +1 -1
- package/dist/components/draggable/draggable-handle.js +2 -2
- package/dist/components/draggable/draggable.js +5 -5
- package/dist/components/draggable-list/draggable-list-item.js +2 -2
- package/dist/components/draggable-list/draggable-list.js +5 -5
- package/dist/components/expandable/expandable.js +1 -1
- package/dist/components/index.js +5 -5
- package/dist/components/input-field/input-field.js +13 -129
- package/dist/components/item-collection/item-collection.js +1 -1
- package/dist/components/link-input/link-input.js +1463 -17
- package/dist/components/matrix-align/matrix-align.js +11 -14
- package/dist/components/menu/menu.js +4 -8
- package/dist/components/modal/modal.js +3 -3
- package/dist/components/number-picker/number-picker.js +9 -10
- package/dist/components/option-select/option-select.js +140 -156
- package/dist/components/placeholders/file-placeholder.js +1 -1
- package/dist/components/placeholders/image-placeholder.js +3 -3
- package/dist/components/placeholders/media-placeholder.js +2 -2
- package/dist/components/popover/popover.js +10 -5
- package/dist/components/radio/radio.js +4 -5
- package/dist/components/repeater/repeater-item.js +1 -1
- package/dist/components/repeater/repeater.js +6 -6
- package/dist/components/responsive/mini-responsive.js +45 -47
- package/dist/components/responsive/responsive-legacy.js +51 -55
- package/dist/components/responsive/responsive.js +47 -49
- package/dist/components/responsive-preview/responsive-preview.js +12 -15
- package/dist/components/select/async-multi-select.js +4 -4
- package/dist/components/select/async-single-select.js +1 -1
- package/dist/components/select/multi-select-components.js +1 -1
- package/dist/components/select/multi-select.js +4 -4
- package/dist/components/select/shared.js +2 -2
- package/dist/components/select/single-select.js +1 -1
- package/dist/components/select/styles.js +3 -3
- package/dist/components/select/v2/async-select.js +215 -158
- package/dist/components/select/v2/shared.js +29 -20
- package/dist/components/select/v2/single-select.js +202 -851
- package/dist/components/slider/column-config-slider.js +2 -2
- package/dist/components/slider/slider.js +2 -2
- package/dist/components/slider/utils.js +1 -1
- package/dist/components/tabs/tabs.js +7 -8
- package/dist/components/toggle/switch.js +4 -3
- package/dist/components/toggle-button/toggle-button.js +1 -1
- package/dist/{default-i18n-CT_oS1Fy.js → default-i18n-OFa3zAyB.js} +5 -9
- package/dist/icons/jsx-svg.js +35 -5
- package/dist/index.js +4 -4
- package/dist/{multi-select-components-Sp-JEFEX.js → multi-select-components-BcKzA24f.js} +3 -3
- package/dist/{react-jsx-parser.min-DZCiis5V.js → react-jsx-parser.min-LF707GK8.js} +312 -332
- package/dist/useAsyncList-fLtZMvJO.js +420 -0
- package/dist/useFilter-BR5z1A4Q.js +50 -0
- package/dist/{useListState-9Hq_FiRF.js → useListState-BrZ2XvDS.js} +1 -1
- package/dist/{useNumberField-D0u2bh8g.js → useNumberField-y0dLc_6m.js} +2 -2
- package/dist/{useSingleSelectListState-DqhemUIh.js → useSingleSelectListState-Bh46cRXs.js} +1 -1
- package/dist/utilities/array-helpers.js +4 -7
- package/dist/utilities/es-dash.js +21 -3
- package/dist/utilities/index.js +2 -1
- package/dist/utilities/text-helpers.js +3 -3
- package/package.json +9 -9
- package/dist/ComboBox-BANSEKnb.js +0 -1915
- package/dist/Form-Cq3fu75_.js +0 -5
- package/dist/List-CZMUbkFU.js +0 -593
- package/dist/Separator-BN3mjL6q.js +0 -332
|
@@ -1,134 +1,9 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import React__default, { forwardRef, createContext, useRef, useState, useCallback } from "react";
|
|
6
|
-
import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-C2SkI1Fn.js";
|
|
7
|
-
import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Bv0UJQl8.js";
|
|
8
|
-
import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-DHrSdE_Q.js";
|
|
9
|
-
import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
|
|
10
|
-
import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-BuJgePCv.js";
|
|
11
|
-
import { $ as $f39a9eba43920ace$export$86427a43e3e48ebb } from "../../Hidden-rE6uR-lr.js";
|
|
12
|
-
import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
|
|
2
|
+
import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-DfSBLhDx.js";
|
|
3
|
+
import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-JS_ob-kh.js";
|
|
4
|
+
import { $ as $bcdf0525bf22703d$export$2c73285ae9390cec, a as $216918bed6669f72$export$f5c9f3c2c4054eec } from "../../TextField-o2U-uBWv.js";
|
|
13
5
|
import { BaseControl } from "../base-control/base-control.js";
|
|
14
6
|
import { c as clsx } from "../../lite-DVmmD_-j.js";
|
|
15
|
-
const $216918bed6669f72$export$2dc6166a7e65358c = /* @__PURE__ */ createContext({});
|
|
16
|
-
let $216918bed6669f72$var$filterHoverProps = (props) => {
|
|
17
|
-
let { onHoverStart, onHoverChange, onHoverEnd, ...otherProps } = props;
|
|
18
|
-
return otherProps;
|
|
19
|
-
};
|
|
20
|
-
const $216918bed6669f72$export$f5c9f3c2c4054eec = /* @__PURE__ */ forwardRef(function TextArea(props, ref) {
|
|
21
|
-
[props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, ref, $216918bed6669f72$export$2dc6166a7e65358c);
|
|
22
|
-
let { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456(props);
|
|
23
|
-
let { isFocused, isFocusVisible, focusProps } = $f7dceffc5ad7768b$export$4e328f61c538687f({
|
|
24
|
-
isTextInput: true,
|
|
25
|
-
autoFocus: props.autoFocus
|
|
26
|
-
});
|
|
27
|
-
let isInvalid = !!props["aria-invalid"] && props["aria-invalid"] !== "false";
|
|
28
|
-
let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
|
|
29
|
-
...props,
|
|
30
|
-
values: {
|
|
31
|
-
isHovered,
|
|
32
|
-
isFocused,
|
|
33
|
-
isFocusVisible,
|
|
34
|
-
isDisabled: props.disabled || false,
|
|
35
|
-
isInvalid
|
|
36
|
-
},
|
|
37
|
-
defaultClassName: "react-aria-TextArea"
|
|
38
|
-
});
|
|
39
|
-
return /* @__PURE__ */ React__default.createElement("textarea", {
|
|
40
|
-
...$3ef42575df84b30b$export$9d1611c77c2fe928($216918bed6669f72$var$filterHoverProps(props), focusProps, hoverProps),
|
|
41
|
-
...renderProps,
|
|
42
|
-
ref,
|
|
43
|
-
"data-focused": isFocused || void 0,
|
|
44
|
-
"data-disabled": props.disabled || void 0,
|
|
45
|
-
"data-hovered": isHovered || void 0,
|
|
46
|
-
"data-focus-visible": isFocusVisible || void 0,
|
|
47
|
-
"data-invalid": isInvalid || void 0
|
|
48
|
-
});
|
|
49
|
-
});
|
|
50
|
-
const $bcdf0525bf22703d$export$2129e27b3ef0d483 = /* @__PURE__ */ createContext(null);
|
|
51
|
-
const $bcdf0525bf22703d$export$2c73285ae9390cec = /* @__PURE__ */ $f39a9eba43920ace$export$86427a43e3e48ebb(function TextField(props, ref) {
|
|
52
|
-
[props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, ref, $bcdf0525bf22703d$export$2129e27b3ef0d483);
|
|
53
|
-
let { validationBehavior: formValidationBehavior } = $64fa3d84918910a7$export$fabf2dc03a41866e($d3e0e05bdfcf66bd$export$c24727297075ec6a) || {};
|
|
54
|
-
var _props_validationBehavior, _ref;
|
|
55
|
-
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : "native";
|
|
56
|
-
let inputRef = useRef(null);
|
|
57
|
-
let [inputContextProps, mergedInputRef] = $64fa3d84918910a7$export$29f1550f4b0d4415({}, inputRef, $3985021b0ad6602f$export$37fb8590cf2c088c);
|
|
58
|
-
let [labelRef, label] = $64fa3d84918910a7$export$9d4c57ee4c6ffdd8(!props["aria-label"] && !props["aria-labelledby"]);
|
|
59
|
-
let [inputElementType, setInputElementType] = useState("input");
|
|
60
|
-
let { labelProps, inputProps, descriptionProps, errorMessageProps, ...validation } = $2d73ec29415bd339$export$712718f7aec83d5({
|
|
61
|
-
...$64fa3d84918910a7$export$ef03459518577ad4(props),
|
|
62
|
-
inputElementType,
|
|
63
|
-
label,
|
|
64
|
-
validationBehavior
|
|
65
|
-
}, mergedInputRef);
|
|
66
|
-
let inputOrTextAreaRef = useCallback((el) => {
|
|
67
|
-
mergedInputRef.current = el;
|
|
68
|
-
if (el) setInputElementType(el instanceof HTMLTextAreaElement ? "textarea" : "input");
|
|
69
|
-
}, [
|
|
70
|
-
mergedInputRef
|
|
71
|
-
]);
|
|
72
|
-
let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
|
|
73
|
-
...props,
|
|
74
|
-
values: {
|
|
75
|
-
isDisabled: props.isDisabled || false,
|
|
76
|
-
isInvalid: validation.isInvalid,
|
|
77
|
-
isReadOnly: props.isReadOnly || false,
|
|
78
|
-
isRequired: props.isRequired || false
|
|
79
|
-
},
|
|
80
|
-
defaultClassName: "react-aria-TextField"
|
|
81
|
-
});
|
|
82
|
-
let DOMProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props);
|
|
83
|
-
delete DOMProps.id;
|
|
84
|
-
return /* @__PURE__ */ React__default.createElement("div", {
|
|
85
|
-
...DOMProps,
|
|
86
|
-
...renderProps,
|
|
87
|
-
ref,
|
|
88
|
-
slot: props.slot || void 0,
|
|
89
|
-
"data-disabled": props.isDisabled || void 0,
|
|
90
|
-
"data-invalid": validation.isInvalid || void 0,
|
|
91
|
-
"data-readonly": props.isReadOnly || void 0,
|
|
92
|
-
"data-required": props.isRequired || void 0
|
|
93
|
-
}, /* @__PURE__ */ React__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
|
|
94
|
-
values: [
|
|
95
|
-
[
|
|
96
|
-
$01b77f81d0f07f68$export$75b6ee27786ba447,
|
|
97
|
-
{
|
|
98
|
-
...labelProps,
|
|
99
|
-
ref: labelRef
|
|
100
|
-
}
|
|
101
|
-
],
|
|
102
|
-
[
|
|
103
|
-
$3985021b0ad6602f$export$37fb8590cf2c088c,
|
|
104
|
-
{
|
|
105
|
-
...$3ef42575df84b30b$export$9d1611c77c2fe928(inputProps, inputContextProps),
|
|
106
|
-
ref: inputOrTextAreaRef
|
|
107
|
-
}
|
|
108
|
-
],
|
|
109
|
-
[
|
|
110
|
-
$216918bed6669f72$export$2dc6166a7e65358c,
|
|
111
|
-
{
|
|
112
|
-
...inputProps,
|
|
113
|
-
ref: inputOrTextAreaRef
|
|
114
|
-
}
|
|
115
|
-
],
|
|
116
|
-
[
|
|
117
|
-
$514c0188e459b4c0$export$9afb8bc826b033ea,
|
|
118
|
-
{
|
|
119
|
-
slots: {
|
|
120
|
-
description: descriptionProps,
|
|
121
|
-
errorMessage: errorMessageProps
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
],
|
|
125
|
-
[
|
|
126
|
-
$ee014567cb39d3f0$export$ff05c3ac10437e03,
|
|
127
|
-
validation
|
|
128
|
-
]
|
|
129
|
-
]
|
|
130
|
-
}, renderProps.children));
|
|
131
|
-
});
|
|
132
7
|
/**
|
|
133
8
|
* An input field.
|
|
134
9
|
*
|
|
@@ -200,9 +75,18 @@ const InputField = (props) => {
|
|
|
200
75
|
"es:focus-visible:border-accent-500",
|
|
201
76
|
"es:inset-ring es:inset-ring-secondary-100",
|
|
202
77
|
"es:disabled:shadow-none! es:disabled:border-secondary-200 es:disabled:bg-secondary-50 es:disabled:text-secondary-500 es:disabled:cursor-default es:readonly:bg-secondary-50",
|
|
78
|
+
type === "search" && "es:[&::-webkit-search-cancel-button]:hidden",
|
|
203
79
|
(monospaceFont || type === "password") && "es:font-mono",
|
|
204
80
|
className
|
|
205
|
-
)
|
|
81
|
+
),
|
|
82
|
+
onKeyUp: (e) => {
|
|
83
|
+
if (type === "search" && e.key === "Escape") {
|
|
84
|
+
onChange("");
|
|
85
|
+
}
|
|
86
|
+
if (props.onKeyUp) {
|
|
87
|
+
props.onKeyUp(e);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
206
90
|
}
|
|
207
91
|
),
|
|
208
92
|
type === "multiline" && /* @__PURE__ */ jsx(
|