@alixpartners/ui-components 2.4.0 → 2.4.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/README.md +97 -97
- package/dist/assets/Dropdown.css +1 -1
- package/dist/assets/FilePicker.css +1 -1
- package/dist/assets/main.css +1 -1
- package/dist/components/Creatable/Creatable.js +1 -1
- package/dist/components/Dropdown/Dropdown.js +31 -31
- package/dist/components/FilePicker/FilePicker.d.ts +1 -1
- package/dist/components/FilePicker/FilePicker.js +87 -86
- package/dist/components/NavBar/NavBar.js +1 -1
- package/dist/components/SplitButton/SplitButton.js +1 -1
- package/dist/components/TagsFields/TagsFields.js +1 -1
- package/dist/components/Tooltip/Tooltip.js +1 -1
- package/dist/{index-D34Qo5Qx.js → index-C-3_YVJ1.js} +473 -478
- package/dist/{index-DZ4Gof57.js → index-C4ffg1vf.js} +1 -1
- package/dist/{index-DgdVwltD.js → index-D_3jWVyV.js} +1 -1
- package/dist/web.config +8 -8
- package/package.json +87 -87
|
@@ -5,7 +5,7 @@ import B from "../Icon/Icon.js";
|
|
|
5
5
|
import he from "../Button/Button.js";
|
|
6
6
|
import "../Input/Input.js";
|
|
7
7
|
import Ie from "../Tooltip/Tooltip.js";
|
|
8
|
-
import { R as ve, A as Le, P as Ne, C as ge } from "../../index-
|
|
8
|
+
import { R as ve, A as Le, P as Ne, C as ge } from "../../index-C4ffg1vf.js";
|
|
9
9
|
import '../../assets/Creatable.css';const ye = "Creatable-module__dropdownContainer___y0ptC", De = "Creatable-module__dropdownLabel___RyuSY", ke = "Creatable-module__dropdownLabelDisabled___nhYc0", xe = "Creatable-module__required___g26DB", Oe = "Creatable-module__dropdownWrapper___wu-B3", Ae = "Creatable-module__selectedItemsCreatable___P0mME", Re = "Creatable-module__selectedItem___0LADh", Ve = "Creatable-module__selectedItemLabel___m0LSV", Ee = "Creatable-module__removeButton___tjxwh", Fe = "Creatable-module__removeIcon___KQKbD", Se = "Creatable-module__singleSelectedCreatableItem___tanxX", Me = "Creatable-module__singleSelectedCreatableItemRemoveButton___Qi9Si", Be = "Creatable-module__dropdownActions___FmHZe", Ge = "Creatable-module__dropdownArrow___SJmKg", Ke = "Creatable-module__dropdownArrowOpen___T3E0S", je = "Creatable-module__dropdownMenu___HEhC3", Ue = "Creatable-module__dropdownCreatableSearchContainer___AgXA3", We = "Creatable-module__disabled___ZIdus", $e = "Creatable-module__dropdownCreatableError___FYVla", Je = "Creatable-module__creatableInput___KaKxv", Pe = "Creatable-module__optionsList___VZgJf", Ye = "Creatable-module__categoryGroup___g8f-g", qe = "Creatable-module__categoryDivider___QUgR9", ze = "Creatable-module__categoryLabel___YhGp9", Qe = "Creatable-module__optionItem___Ys808", Ze = "Creatable-module__optionItemDisabled___jvfGz", He = "Creatable-module__optionItemFocused___OfIQd", Te = "Creatable-module__optionContent___9RCsJ", Xe = "Creatable-module__optionLabel___FJfM1", et = "Creatable-module__tickIcon___VjpDN", tt = "Creatable-module__helpers___GmPY4", lt = "Creatable-module__helpText___89mXU", ot = "Creatable-module__helpTextDisabled___shU6E", at = "Creatable-module__helpLink___IdU0g", rt = "Creatable-module__helpLinkDisabled___B8rpy", nt = "Creatable-module__errorMessage___HRKr5", t = {
|
|
10
10
|
dropdownContainer: ye,
|
|
11
11
|
dropdownLabel: De,
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsxs as s, jsx as d } from "react/jsx-runtime";
|
|
2
2
|
import { c as h } from "../../clsx-OuTLNxxd.js";
|
|
3
|
-
import { useState as b, useRef as T, useEffect as
|
|
3
|
+
import { useState as b, useRef as T, useEffect as L, useCallback as oe } from "react";
|
|
4
4
|
import B from "../Icon/Icon.js";
|
|
5
5
|
import Ce from "../Toggle/Toggle.js";
|
|
6
6
|
import ne from "../Button/Button.js";
|
|
7
7
|
import re from "../Ghost/Ghost.js";
|
|
8
8
|
import Me from "../Search/Search.js";
|
|
9
9
|
import Se from "../Tooltip/Tooltip.js";
|
|
10
|
-
import { R as Ve, T as Re, P as Ee, C as Fe } from "../../index-
|
|
11
|
-
import '../../assets/Dropdown.css';const We = "Dropdown-module__dropdownContainer___beNhQ", qe = "Dropdown-module__dropdownLabel___T9FmB", Je = "Dropdown-module__dropdownLabelDisabled___SLRmM", ze = "Dropdown-module__required___ChI1m", Ge = "Dropdown-module__dropdownWrapper___AUuWD", Be = "Dropdown-module__dropdownTrigger___Rue93", Ue = "Dropdown-module__dropdownTriggerDisabled___63wkd", je = "Dropdown-module__dropdownTriggerOpen___cbm8V", Pe = "Dropdown-module__placeholder___fWdch", Ye = "Dropdown-
|
|
10
|
+
import { R as Ve, T as Re, P as Ee, C as Fe } from "../../index-C4ffg1vf.js";
|
|
11
|
+
import '../../assets/Dropdown.css';const We = "Dropdown-module__dropdownContainer___beNhQ", qe = "Dropdown-module__dropdownLabel___T9FmB", Je = "Dropdown-module__dropdownLabelDisabled___SLRmM", ze = "Dropdown-module__required___ChI1m", Ge = "Dropdown-module__dropdownWrapper___AUuWD", Be = "Dropdown-module__dropdownTrigger___Rue93", Ue = "Dropdown-module__dropdownTriggerDisabled___63wkd", je = "Dropdown-module__dropdownTriggerOpen___cbm8V", Pe = "Dropdown-module__placeholder___fWdch", Ye = "Dropdown-module__selectedOptionLabel___7Zdh3", $e = "Dropdown-module__dropdownSelectedItems___iXnpQ", Ze = "Dropdown-module__dropdownTriggerError___Uu02x", Qe = "Dropdown-module__dropdownContent___zLMhL", Ke = "Dropdown-module__dropdownActions___d55Fa", Xe = "Dropdown-module__dropdownArrow___dLbrb", He = "Dropdown-module__dropdownArrowOpen___Z4Nh1", eo = "Dropdown-module__dropdownMenu___toYcy", oo = "Dropdown-module__dropdownMenuToolbar___gFne0", no = "Dropdown-module__searchContainer___4kUvD", ro = "Dropdown-module__search___JmgDx", to = "Dropdown-module__optionsList___rk2hi", lo = "Dropdown-module__categoryGroup___Np2bP", so = "Dropdown-module__categoryDivider___Gh6F0", io = "Dropdown-module__categoryLabel___B9IDR", co = "Dropdown-module__optionItem___7pi10", ao = "Dropdown-module__optionItemDisabled___aepUD", po = "Dropdown-module__optionItemFocused___u2781", _o = "Dropdown-module__optionContent___nf1VC", uo = "Dropdown-module__optionLabel___sJerM", mo = "Dropdown-module__tickIcon___hYdCr", wo = "Dropdown-module__noOptions___8vmhM", fo = "Dropdown-module__helpers___s4ulA", ho = "Dropdown-module__helpText___YooJE", Do = "Dropdown-module__helpTextDisabled___Ct4qq", bo = "Dropdown-module__helpLink___-Zwpq", go = "Dropdown-module__helpLinkDisabled___r-opC", No = "Dropdown-module__errorMessage___3Mopi", vo = "Dropdown-module__selectAllContainer___Dlk3J", Lo = "Dropdown-module__actionButtons___-2nvr", o = {
|
|
12
12
|
dropdownContainer: We,
|
|
13
13
|
dropdownLabel: qe,
|
|
14
14
|
"label-text": "Dropdown-module__label-text___VEqG-",
|
|
@@ -21,10 +21,10 @@ import '../../assets/Dropdown.css';const We = "Dropdown-module__dropdownContaine
|
|
|
21
21
|
dropdownTriggerDisabled: Ue,
|
|
22
22
|
dropdownTriggerOpen: je,
|
|
23
23
|
placeholder: Pe,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
24
|
+
selectedOptionLabel: Ye,
|
|
25
|
+
dropdownSelectedItems: $e,
|
|
26
|
+
dropdownTriggerError: Ze,
|
|
27
|
+
dropdownContent: Qe,
|
|
28
28
|
dropdownActions: Ke,
|
|
29
29
|
dropdownArrow: Xe,
|
|
30
30
|
dropdownArrowOpen: He,
|
|
@@ -60,11 +60,11 @@ function Vo({
|
|
|
60
60
|
options: F,
|
|
61
61
|
value: p = [],
|
|
62
62
|
placeholder: A = "Select options...",
|
|
63
|
-
disabled:
|
|
63
|
+
disabled: O = !1,
|
|
64
64
|
required: te = !1,
|
|
65
65
|
searchable: x = !1,
|
|
66
66
|
searchPlaceholder: le = "Search options...",
|
|
67
|
-
errorMessage:
|
|
67
|
+
errorMessage: I,
|
|
68
68
|
helpText: C,
|
|
69
69
|
helpLink: W,
|
|
70
70
|
helpLinkText: q,
|
|
@@ -86,23 +86,23 @@ function Vo({
|
|
|
86
86
|
caseSensitive: P = !1,
|
|
87
87
|
...me
|
|
88
88
|
}) {
|
|
89
|
-
const [i, g] = b(p), [l, f] = b(!1), [Y, _] = b(""), [
|
|
90
|
-
|
|
89
|
+
const [i, g] = b(p), [l, f] = b(!1), [Y, _] = b(""), [y, c] = b(-1), [w, u] = b([]), $ = T(null), Z = T(null), we = T(null), z = T(null), [Q, fe] = b(0), [he, De] = b(p.length > 0 ? p.join(", ") : A ?? ""), K = T(p);
|
|
90
|
+
L(() => {
|
|
91
91
|
JSON.stringify(K.current) !== JSON.stringify(p) && (g(p), K.current = p);
|
|
92
|
-
}, [p]),
|
|
92
|
+
}, [p]), L(() => {
|
|
93
93
|
var r;
|
|
94
94
|
const e = (r = Z.current) == null ? void 0 : r.getBoundingClientRect().width;
|
|
95
95
|
e && fe(e);
|
|
96
|
-
}, [l]),
|
|
96
|
+
}, [l]), L(() => {
|
|
97
97
|
l && u([...i]);
|
|
98
98
|
}, [l, i]);
|
|
99
99
|
const X = Y.trim(), a = F.filter((e) => {
|
|
100
100
|
const r = P ? e.label : e.label.toLowerCase(), n = P ? X : X.toLowerCase();
|
|
101
101
|
return r.includes(n);
|
|
102
102
|
});
|
|
103
|
-
|
|
103
|
+
L(() => {
|
|
104
104
|
De(p.length > 0 ? p.join(", ") : A ?? "");
|
|
105
|
-
}, [p, A]),
|
|
105
|
+
}, [p, A]), L(() => {
|
|
106
106
|
l && x && z.current && z.current.focus();
|
|
107
107
|
}, [l, x]);
|
|
108
108
|
const be = (e) => {
|
|
@@ -150,7 +150,7 @@ function Vo({
|
|
|
150
150
|
}, [m, t, i, S]), Oe = (e) => {
|
|
151
151
|
M == null || M(e);
|
|
152
152
|
};
|
|
153
|
-
|
|
153
|
+
L(() => {
|
|
154
154
|
const e = (r) => {
|
|
155
155
|
if (l)
|
|
156
156
|
switch (r.key) {
|
|
@@ -161,8 +161,8 @@ function Vo({
|
|
|
161
161
|
r.preventDefault(), c((n) => n > 0 ? n - 1 : a.length - 1);
|
|
162
162
|
break;
|
|
163
163
|
case "Enter":
|
|
164
|
-
if (r.preventDefault(),
|
|
165
|
-
const n = a[
|
|
164
|
+
if (r.preventDefault(), y >= 0 && y < a.length) {
|
|
165
|
+
const n = a[y];
|
|
166
166
|
G(n);
|
|
167
167
|
}
|
|
168
168
|
break;
|
|
@@ -172,27 +172,27 @@ function Vo({
|
|
|
172
172
|
}
|
|
173
173
|
};
|
|
174
174
|
return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
|
|
175
|
-
}, [l,
|
|
176
|
-
const V = l ? w : i,
|
|
175
|
+
}, [l, y, a, Le, G]);
|
|
176
|
+
const V = l ? w : i, N = F.filter((e) => V.includes(e.value)), Ie = !!I, ye = JSON.stringify(w) !== JSON.stringify(i), H = F.filter((e) => !e.disabled), ke = H.length > 0 && H.every((e) => V.includes(e.value)), Te = a.reduce((e, r) => {
|
|
177
177
|
const n = r.category || "default";
|
|
178
178
|
return e[n] || (e[n] = []), e[n].push(r), e;
|
|
179
179
|
}, {}), Ae = a, {
|
|
180
|
-
onBlur:
|
|
180
|
+
onBlur: v,
|
|
181
181
|
...ee
|
|
182
182
|
} = me;
|
|
183
183
|
return /* @__PURE__ */ s("div", { ref: $, className: h(o.root, o.dropdownContainer, se && o["dropdown-container-grouped"], m && o["dropdown-container-multi-select"], de), ...ee, children: [
|
|
184
|
-
E && /* @__PURE__ */ s("label", { className: h(o.dropdownLabel,
|
|
184
|
+
E && /* @__PURE__ */ s("label", { className: h(o.dropdownLabel, O && o.dropdownLabelDisabled), children: [
|
|
185
185
|
/* @__PURE__ */ d("span", { title: E, className: o["label-text"], children: E }),
|
|
186
186
|
te && /* @__PURE__ */ d("span", { className: o.required, children: "*" }),
|
|
187
187
|
D && /* @__PURE__ */ d(Se, { content: D.content, size: D.size, theme: D.theme, tipSide: D.tipSide, tipAlignment: D.tipAlignment, startVisible: D.startVisible, children: /* @__PURE__ */ d(B, { icon: "ap-icon-info", className: o["label-tooltip-icon"] }) })
|
|
188
188
|
] }),
|
|
189
189
|
/* @__PURE__ */ d(Ve, { open: l, onOpenChange: be, children: /* @__PURE__ */ s("div", { className: o.dropdownWrapper, children: [
|
|
190
|
-
/* @__PURE__ */ d(Re, { disabled:
|
|
191
|
-
l ||
|
|
190
|
+
/* @__PURE__ */ d(Re, { disabled: O, className: h(o["dropdown-menu-trigger"], o.dropdownTrigger, ce, l && o.dropdownTriggerOpen, O && o.dropdownTriggerDisabled, Ie && o.dropdownTriggerError), ref: Z, onBlur: (e) => {
|
|
191
|
+
l || v == null || v(e);
|
|
192
192
|
}, ...ee, children: /* @__PURE__ */ s("div", { className: o.dropdownContent, children: [
|
|
193
|
-
!pe && /* @__PURE__ */ d("div", { className: o.dropdownSelectedItems, children:
|
|
193
|
+
!pe && /* @__PURE__ */ d("div", { className: o.dropdownSelectedItems, children: N.length > 0 ? m ? ke && j ? j : N.length === 1 ? ` ${N.length} ${_e}` : ` ${N.length} ${ue}` : (
|
|
194
194
|
// For single select, show the selected option label
|
|
195
|
-
/* @__PURE__ */ d("span", { className: o.selectedOptionLabel, children:
|
|
195
|
+
/* @__PURE__ */ d("span", { className: o.selectedOptionLabel, title: N[0].label, children: N[0].label })
|
|
196
196
|
) : /* @__PURE__ */ d("span", { title: he, className: o.placeholder, children: A }) }),
|
|
197
197
|
/* @__PURE__ */ d("div", { className: o.dropdownActions, children: /* @__PURE__ */ d(B, { icon: "ap-icon-expand-more", className: h(o.dropdownArrow, l && o.dropdownArrowOpen) }) })
|
|
198
198
|
] }) }),
|
|
@@ -201,7 +201,7 @@ function Vo({
|
|
|
201
201
|
zIndex: 9999
|
|
202
202
|
}, onInteractOutside: (e) => {
|
|
203
203
|
var n;
|
|
204
|
-
e.target === z.current && e.preventDefault(), ((n = $.current) == null ? void 0 : n.contains(e.target)) ||
|
|
204
|
+
e.target === z.current && e.preventDefault(), ((n = $.current) == null ? void 0 : n.contains(e.target)) || v == null || v(e);
|
|
205
205
|
}, children: l && /* @__PURE__ */ s("div", { style: {
|
|
206
206
|
minWidth: Q
|
|
207
207
|
}, className: h(o.dropdownMenu, ae, U === "right" && o.dropdownMenuRight), children: [
|
|
@@ -223,7 +223,7 @@ function Vo({
|
|
|
223
223
|
e !== "default" && /* @__PURE__ */ d("div", { className: o.categoryDivider, children: /* @__PURE__ */ d("span", { className: o.categoryLabel, children: e }) }),
|
|
224
224
|
r.map((n) => {
|
|
225
225
|
const R = Ae.indexOf(n), k = a.find((xe) => xe.value === n.value);
|
|
226
|
-
return /* @__PURE__ */ d("button", { title: (k == null ? void 0 : k.label) || n.label, type: "button", className: h(o.optionItem, V.includes(n.value) && o.optionItemSelected, n.disabled && o.optionItemDisabled, R ===
|
|
226
|
+
return /* @__PURE__ */ d("button", { title: (k == null ? void 0 : k.label) || n.label, type: "button", className: h(o.optionItem, V.includes(n.value) && o.optionItemSelected, n.disabled && o.optionItemDisabled, R === y && o.optionItemFocused), onClick: () => G(n), disabled: n.disabled, "data-dropdown-option-item": !0, children: /* @__PURE__ */ s("div", { className: o.optionContent, children: [
|
|
227
227
|
/* @__PURE__ */ d("span", { className: o.optionLabel, children: n.label }),
|
|
228
228
|
V.includes(n.value) && /* @__PURE__ */ d(B, { icon: "ap-icon-check", className: o.tickIcon })
|
|
229
229
|
] }) }, n.value);
|
|
@@ -238,9 +238,9 @@ function Vo({
|
|
|
238
238
|
] })
|
|
239
239
|
] }) }) })
|
|
240
240
|
] }) }),
|
|
241
|
-
(
|
|
242
|
-
|
|
243
|
-
W && q && /* @__PURE__ */ d("a", { href: W, className: h(o.helpLink,
|
|
241
|
+
(I || C || W && q) && /* @__PURE__ */ s("div", { className: o.helpers, children: [
|
|
242
|
+
I ? /* @__PURE__ */ d("span", { title: I, className: o.errorMessage, children: I }) : C && /* @__PURE__ */ d("span", { title: C, className: h(o.helpText, O && o.helpTextDisabled), children: C }),
|
|
243
|
+
W && q && /* @__PURE__ */ d("a", { href: W, className: h(o.helpLink, O && o.helpLinkDisabled), target: "_blank", rel: "noopener noreferrer", children: q })
|
|
244
244
|
] })
|
|
245
245
|
] });
|
|
246
246
|
}
|
|
@@ -91,7 +91,7 @@ declare function FilePickerSingleFileRow({ children }: {
|
|
|
91
91
|
/** Renders the reserved space and delete button for single-file mode (for use in composed layout). */
|
|
92
92
|
declare function FilePickerSingleFileActions(): import("react/jsx-runtime").JSX.Element | null;
|
|
93
93
|
declare function FilePickerSingleFileDeleteButton(): import("react/jsx-runtime").JSX.Element | null;
|
|
94
|
-
declare function FilePickerHelpText(): import("react/jsx-runtime").JSX.Element;
|
|
94
|
+
declare function FilePickerHelpText(): import("react/jsx-runtime").JSX.Element | null;
|
|
95
95
|
declare function FilePickerUploadedFilesList(): import("react/jsx-runtime").JSX.Element | null;
|
|
96
96
|
declare const FilePicker: typeof FilePickerRoot & {
|
|
97
97
|
Label: typeof FilePickerLabel;
|
|
@@ -1,53 +1,54 @@
|
|
|
1
1
|
import { jsxs as a, jsx as i, Fragment as ne } from "react/jsx-runtime";
|
|
2
|
-
import { createContext as se, useId as re, useRef as oe, useState as
|
|
3
|
-
import
|
|
2
|
+
import { createContext as se, useId as re, useRef as oe, useState as M, useCallback as F, useEffect as ce, useContext as ae } from "react";
|
|
3
|
+
import ue from "../Tooltip/Tooltip.js";
|
|
4
4
|
import D from "../Icon/Icon.js";
|
|
5
5
|
import x from "../Button/Button.js";
|
|
6
6
|
import { c as C } from "../../clsx-OuTLNxxd.js";
|
|
7
|
-
import '../../assets/FilePicker.css';const
|
|
8
|
-
container:
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
import '../../assets/FilePicker.css';const pe = "FilePicker-module__container___knCCi", me = "FilePicker-module__containerMultiple___Psi5u", de = "FilePicker-module__label___al7Xe", _e = "FilePicker-module__required___41Vjd", Fe = "FilePicker-module__labelTooltipIcon___Cc1QF", Ie = "FilePicker-module__helpers___79-g5", he = "FilePicker-module__helperText___ja9Rr", Le = "FilePicker-module__errorMessage___TvHrL", ge = "FilePicker-module__singleFileHelpLinkContainer___mpjUf", ke = "FilePicker-module__singleFileHelpLinkReservedSpace___r8j2b", fe = "FilePicker-module__helpLink___uu45D", Pe = "FilePicker-module__input___cL1Hs", Ne = "FilePicker-module__singleFileContainer___OFSDt", xe = "FilePicker-module__singleFileInputContainer___MOkES", Ce = "FilePicker-module__inputFileName___sMs7R", Te = "FilePicker-module__inputFileNamePlaceholder___-mkDD", be = "FilePicker-module__inputButton___ghLlD", ye = "FilePicker-module__multipleHelpText___5tnnn", De = "FilePicker-module__multipleInputButton___WCJp9", Be = "FilePicker-module__multipleFilesList___Kim0I", Se = "FilePicker-module__multipleFilesListItem___01PDS", He = "FilePicker-module__multipleFilesListItemContent___pKbho", Me = "FilePicker-module__multipleFilesListItemContentData___5GC-C", ve = "FilePicker-module__multipleFilesListItemIconContainer___7sUL5", we = "FilePicker-module__multipleFilesListItemIcon___nfMX9", Ee = "FilePicker-module__multipleFilesListItemText___nPqrL", ze = "FilePicker-module__multipleFilesListItemName___NjHhX", Re = "FilePicker-module__multipleFilesListItemSize___wc8LJ", je = "FilePicker-module__multipleFilesListItemError___x9qkT", Ke = "FilePicker-module__multipleFilesListItemIconError___0RO46", Ve = "FilePicker-module__multipleFilesListItemIconDelete___9Z9Dl", qe = "FilePicker-module__disabled___szMiq", t = {
|
|
8
|
+
container: pe,
|
|
9
|
+
containerMultiple: me,
|
|
10
|
+
label: de,
|
|
11
|
+
required: _e,
|
|
11
12
|
labelTooltipIcon: Fe,
|
|
12
|
-
helpers:
|
|
13
|
-
helperText:
|
|
14
|
-
errorMessage:
|
|
15
|
-
singleFileHelpLinkContainer:
|
|
16
|
-
singleFileHelpLinkReservedSpace:
|
|
17
|
-
helpLink:
|
|
18
|
-
input:
|
|
19
|
-
singleFileContainer:
|
|
20
|
-
singleFileInputContainer:
|
|
21
|
-
inputFileName:
|
|
22
|
-
inputFileNamePlaceholder:
|
|
23
|
-
inputButton:
|
|
24
|
-
multipleHelpText:
|
|
25
|
-
multipleInputButton:
|
|
26
|
-
multipleFilesList:
|
|
27
|
-
multipleFilesListItem:
|
|
28
|
-
multipleFilesListItemContent:
|
|
29
|
-
multipleFilesListItemContentData:
|
|
13
|
+
helpers: Ie,
|
|
14
|
+
helperText: he,
|
|
15
|
+
errorMessage: Le,
|
|
16
|
+
singleFileHelpLinkContainer: ge,
|
|
17
|
+
singleFileHelpLinkReservedSpace: ke,
|
|
18
|
+
helpLink: fe,
|
|
19
|
+
input: Pe,
|
|
20
|
+
singleFileContainer: Ne,
|
|
21
|
+
singleFileInputContainer: xe,
|
|
22
|
+
inputFileName: Ce,
|
|
23
|
+
inputFileNamePlaceholder: Te,
|
|
24
|
+
inputButton: be,
|
|
25
|
+
multipleHelpText: ye,
|
|
26
|
+
multipleInputButton: De,
|
|
27
|
+
multipleFilesList: Be,
|
|
28
|
+
multipleFilesListItem: Se,
|
|
29
|
+
multipleFilesListItemContent: He,
|
|
30
|
+
multipleFilesListItemContentData: Me,
|
|
30
31
|
multipleFilesListItemIconContainer: ve,
|
|
31
32
|
multipleFilesListItemIcon: we,
|
|
32
|
-
multipleFilesListItemText:
|
|
33
|
-
multipleFilesListItemName:
|
|
34
|
-
multipleFilesListItemSize:
|
|
35
|
-
multipleFilesListItemError:
|
|
36
|
-
multipleFilesListItemIconError:
|
|
37
|
-
multipleFilesListItemIconDelete:
|
|
38
|
-
disabled:
|
|
39
|
-
},
|
|
40
|
-
function
|
|
41
|
-
const e = ae(
|
|
33
|
+
multipleFilesListItemText: Ee,
|
|
34
|
+
multipleFilesListItemName: ze,
|
|
35
|
+
multipleFilesListItemSize: Re,
|
|
36
|
+
multipleFilesListItemError: je,
|
|
37
|
+
multipleFilesListItemIconError: Ke,
|
|
38
|
+
multipleFilesListItemIconDelete: Ve,
|
|
39
|
+
disabled: qe
|
|
40
|
+
}, v = se(null);
|
|
41
|
+
function u() {
|
|
42
|
+
const e = ae(v);
|
|
42
43
|
if (!e)
|
|
43
44
|
throw new Error("FilePicker compound components must be used within a FilePicker.");
|
|
44
45
|
return e;
|
|
45
46
|
}
|
|
46
|
-
function
|
|
47
|
+
function $e(e) {
|
|
47
48
|
const l = e.name.toLowerCase();
|
|
48
49
|
return l.includes(".") ? l.split(".").pop() ?? "" : "";
|
|
49
50
|
}
|
|
50
|
-
function
|
|
51
|
+
function Oe({
|
|
51
52
|
type: e = "single",
|
|
52
53
|
maxFiles: l = 1,
|
|
53
54
|
fileExtensionsAllowed: s,
|
|
@@ -66,16 +67,16 @@ function $e({
|
|
|
66
67
|
multipleHelpText: O,
|
|
67
68
|
multipleButtonHelpText: A,
|
|
68
69
|
labelTooltip: X,
|
|
69
|
-
onUpload:
|
|
70
|
+
onUpload: _,
|
|
70
71
|
onRemoveFile: g,
|
|
71
72
|
children: k
|
|
72
73
|
}) {
|
|
73
|
-
const B = re(), f = oe(null), [
|
|
74
|
+
const B = re(), f = oe(null), [p, P] = M(L ? L.map((n) => ({
|
|
74
75
|
file: n
|
|
75
|
-
})) : []), [J, T] =
|
|
76
|
+
})) : []), [J, T] = M(!1), b = s.join(", "), S = s.map((n) => `.${n.replace(/^\./, "")}`).join(","), N = F((n) => {
|
|
76
77
|
const o = r ? r * 1024 * 1024 : Number.POSITIVE_INFINITY, m = new Set(s.map((d) => d.toLowerCase().replace(/^\./, "")));
|
|
77
78
|
return n.map((d) => {
|
|
78
|
-
const le = d.size <= o, ie = m.size === 0 || m.has(
|
|
79
|
+
const le = d.size <= o, ie = m.size === 0 || m.has($e(d));
|
|
79
80
|
let y;
|
|
80
81
|
const te = r ? `up to ${r}MB` : "";
|
|
81
82
|
return le || (y = `File size is too large. Must be ${te}.`), ie || (y = `The file format is incorrect. Please make sure it is one of the extensions: ${b}.`), {
|
|
@@ -83,34 +84,34 @@ function $e({
|
|
|
83
84
|
error: y
|
|
84
85
|
};
|
|
85
86
|
});
|
|
86
|
-
}, [s, b, r]), H =
|
|
87
|
-
const o =
|
|
87
|
+
}, [s, b, r]), H = F((n) => {
|
|
88
|
+
const o = p.length;
|
|
88
89
|
return T(o + n.length > l), N(n);
|
|
89
|
-
}, [l,
|
|
90
|
+
}, [l, p.length, N]);
|
|
90
91
|
ce(() => {
|
|
91
92
|
const n = N(L ?? []);
|
|
92
93
|
P(n), T(n.length > l);
|
|
93
94
|
}, [L, l, N]);
|
|
94
|
-
const Y =
|
|
95
|
+
const Y = F((n) => (n / 1024).toFixed(2) + " KB", []), G = F(() => {
|
|
95
96
|
var n;
|
|
96
97
|
c || (n = f.current) == null || n.click();
|
|
97
|
-
}, [c]), Q =
|
|
98
|
+
}, [c]), Q = F((n) => {
|
|
98
99
|
var o;
|
|
99
100
|
c || n.key === "Enter" && ((o = f.current) == null || o.click());
|
|
100
|
-
}, [c]), W =
|
|
101
|
+
}, [c]), W = F((n) => {
|
|
101
102
|
if (c) return;
|
|
102
103
|
const o = n.target.files, m = H(Array.from(o ?? []));
|
|
103
104
|
if (e === "multiple" && h) {
|
|
104
|
-
const d = [...
|
|
105
|
-
P(d),
|
|
105
|
+
const d = [...p, ...m];
|
|
106
|
+
P(d), _ == null || _(d);
|
|
106
107
|
} else
|
|
107
|
-
P(m),
|
|
108
|
+
P(m), _ == null || _(m);
|
|
108
109
|
n.target.value = "";
|
|
109
|
-
}, [c, e, h,
|
|
110
|
-
if (c || !
|
|
111
|
-
const o =
|
|
110
|
+
}, [c, e, h, p, H, _]), Z = F((n) => {
|
|
111
|
+
if (c || !p) return;
|
|
112
|
+
const o = p.filter((m) => m.file.name !== n);
|
|
112
113
|
T(o.length > l), P(o), g == null || g(n);
|
|
113
|
-
}, [c,
|
|
114
|
+
}, [c, p, l, g]), U = {
|
|
114
115
|
id: B,
|
|
115
116
|
type: e,
|
|
116
117
|
maxFiles: l,
|
|
@@ -120,7 +121,7 @@ function $e({
|
|
|
120
121
|
queueFiles: h,
|
|
121
122
|
disabled: c,
|
|
122
123
|
isUploadDisabled: E,
|
|
123
|
-
uploadedFiles:
|
|
124
|
+
uploadedFiles: p,
|
|
124
125
|
isMaxFilesExceeded: J,
|
|
125
126
|
label: z,
|
|
126
127
|
required: R,
|
|
@@ -139,13 +140,13 @@ function $e({
|
|
|
139
140
|
handleRemoveFile: Z,
|
|
140
141
|
displayFileSize: Y
|
|
141
142
|
}, ee = k != null && (Array.isArray(k) ? k.length > 0 : !0);
|
|
142
|
-
return /* @__PURE__ */ a(
|
|
143
|
+
return /* @__PURE__ */ a(v.Provider, { value: U, children: [
|
|
143
144
|
/* @__PURE__ */ i("input", { accept: S, multiple: e === "multiple", ref: f, type: "file", id: B, className: t.input, onChange: W }),
|
|
144
|
-
/* @__PURE__ */ i("div", { className: C(t.container, c && t.disabled), children: ee ? k : /* @__PURE__ */ i(
|
|
145
|
+
/* @__PURE__ */ i("div", { className: C(t.container, e === "multiple" && t.containerMultiple, c && t.disabled), children: ee ? k : /* @__PURE__ */ i(Ae, {}) })
|
|
145
146
|
] });
|
|
146
147
|
}
|
|
147
|
-
function
|
|
148
|
-
const e =
|
|
148
|
+
function Ae() {
|
|
149
|
+
const e = u();
|
|
149
150
|
return /* @__PURE__ */ a(ne, { children: [
|
|
150
151
|
/* @__PURE__ */ i(I.Label, {}),
|
|
151
152
|
e.type === "single" && /* @__PURE__ */ i(I.SingleFileRow, { children: /* @__PURE__ */ i(I.BrowseButton, {}) }),
|
|
@@ -155,53 +156,53 @@ function Oe() {
|
|
|
155
156
|
/* @__PURE__ */ i(I.UploadedFilesList, {})
|
|
156
157
|
] });
|
|
157
158
|
}
|
|
158
|
-
function
|
|
159
|
+
function Xe({
|
|
159
160
|
children: e
|
|
160
161
|
}) {
|
|
161
|
-
const l =
|
|
162
|
+
const l = u(), s = e ?? l.label;
|
|
162
163
|
return /* @__PURE__ */ a("label", { htmlFor: l.id, onClick: (r) => r.preventDefault(), className: C(t.label, l.type === "multiple" && t.labelMultiple), children: [
|
|
163
164
|
/* @__PURE__ */ i("span", { title: l.label, className: t.labelText, children: s }),
|
|
164
165
|
l.required && /* @__PURE__ */ i("span", { "aria-hidden": "true", className: t.required, children: "*" }),
|
|
165
|
-
l.labelTooltip && /* @__PURE__ */ i(
|
|
166
|
+
l.labelTooltip && /* @__PURE__ */ i(ue, { content: l.labelTooltip.content, size: l.labelTooltip.size, theme: l.labelTooltip.theme, tipSide: l.labelTooltip.tipSide, tipAlignment: l.labelTooltip.tipAlignment, startVisible: l.labelTooltip.startVisible, children: /* @__PURE__ */ i(D, { icon: "ap-icon-info", className: t.labelTooltipIcon }) }),
|
|
166
167
|
l.type === "multiple" && l.multipleHelpText && /* @__PURE__ */ i("span", { className: t.multipleHelpText, children: l.multipleHelpText })
|
|
167
168
|
] });
|
|
168
169
|
}
|
|
169
|
-
function
|
|
170
|
+
function Je({
|
|
170
171
|
children: e,
|
|
171
172
|
className: l
|
|
172
173
|
}) {
|
|
173
|
-
const s =
|
|
174
|
+
const s = u();
|
|
174
175
|
return s.type === "multiple" ? /* @__PURE__ */ i(x, { type: "secondary", variant: "default", size: "md", icon: "ap-icon-upload", className: C(t.multipleInputButton, l), onClick: s.triggerInput, onKeyDown: s.handleKeyDown, disabled: s.disabled || s.isUploadDisabled, children: /* @__PURE__ */ i("span", { children: e ?? `Browse files ${s.multipleButtonHelpText ?? ""}` }) }) : /* @__PURE__ */ i(x, { type: "tertiary", variant: "default", size: "md", icon: "ap-icon-upload", className: C(t.inputButton, l), tabIndex: -1, disabled: s.disabled || s.isUploadDisabled, onClick: (r) => {
|
|
175
176
|
r.preventDefault(), r.stopPropagation(), s.triggerInput();
|
|
176
177
|
}, children: /* @__PURE__ */ i("span", { children: e ?? "Browse file" }) });
|
|
177
178
|
}
|
|
178
|
-
function
|
|
179
|
+
function Ye({
|
|
179
180
|
children: e
|
|
180
181
|
}) {
|
|
181
|
-
return
|
|
182
|
+
return u().type !== "single" ? null : /* @__PURE__ */ i("div", { className: t.singleFileContainer, children: e });
|
|
182
183
|
}
|
|
183
|
-
function
|
|
184
|
+
function Ge({
|
|
184
185
|
children: e
|
|
185
186
|
}) {
|
|
186
|
-
const l =
|
|
187
|
+
const l = u();
|
|
187
188
|
return l.type !== "single" ? null : /* @__PURE__ */ a("div", { tabIndex: l.disabled ? -1 : 0, onClick: l.triggerInput, onKeyDown: l.handleKeyDown, className: t.singleFileInputContainer, children: [
|
|
188
189
|
/* @__PURE__ */ i("span", { className: t.inputFileName, children: l.uploadedFiles.length > 0 ? /* @__PURE__ */ i("span", { className: t.inputFileNameText, children: l.uploadedFiles[0].file.name }) : /* @__PURE__ */ i("span", { className: t.inputFileNamePlaceholder, children: l.placeholder }) }),
|
|
189
190
|
e
|
|
190
191
|
] });
|
|
191
192
|
}
|
|
192
|
-
function
|
|
193
|
-
return
|
|
193
|
+
function Qe() {
|
|
194
|
+
return u().type !== "single" ? null : /* @__PURE__ */ i("span", { className: t.singleFileHelpLinkReservedSpace, children: /* @__PURE__ */ i(w, {}) });
|
|
194
195
|
}
|
|
195
|
-
function
|
|
196
|
-
const e =
|
|
196
|
+
function w() {
|
|
197
|
+
const e = u();
|
|
197
198
|
if (e.type !== "single" || e.uploadedFiles.length === 0) return null;
|
|
198
199
|
const l = e.uploadedFiles[0].file.name;
|
|
199
200
|
return /* @__PURE__ */ i(x, { type: "tertiary", variant: "default", size: "md", icon: "ap-icon-delete", className: t.singleFileDeleteButton, onClick: () => e.handleRemoveFile(l), disabled: e.disabled });
|
|
200
201
|
}
|
|
201
|
-
function
|
|
202
|
+
function We() {
|
|
202
203
|
var r, h;
|
|
203
|
-
const e =
|
|
204
|
-
return /* @__PURE__ */ a("div", { className: t.helpers, children: [
|
|
204
|
+
const e = u(), l = e.errorMessage || e.isMaxFilesExceeded || e.type === "single" && ((r = e.uploadedFiles[0]) == null ? void 0 : r.error), s = e.type === "single" ? e.errorMessage || ((h = e.uploadedFiles[0]) == null ? void 0 : h.error) : e.errorMessage || (e.isMaxFilesExceeded ? `You can only upload up to ${e.maxFiles} files.` : "");
|
|
205
|
+
return e.type === "multiple" && !s ? null : /* @__PURE__ */ a("div", { className: t.helpers, children: [
|
|
205
206
|
l ? /* @__PURE__ */ i("span", { title: e.errorMessage, className: t.errorMessage, children: s }) : e.helpText && e.type === "single" && /* @__PURE__ */ i("span", { title: e.helpText, className: t.helperText, children: e.helpText }),
|
|
206
207
|
e.type === "single" && e.helpLink && e.helpLinkText && /* @__PURE__ */ a("span", { className: t.singleFileHelpLinkContainer, children: [
|
|
207
208
|
/* @__PURE__ */ i("a", { href: e.helpLink, className: t.helpLink, target: "_blank", rel: "noopener noreferrer", tabIndex: e.disabled ? -1 : 0, children: e.helpLinkText }),
|
|
@@ -209,8 +210,8 @@ function Qe() {
|
|
|
209
210
|
] })
|
|
210
211
|
] });
|
|
211
212
|
}
|
|
212
|
-
function
|
|
213
|
-
const e =
|
|
213
|
+
function Ze() {
|
|
214
|
+
const e = u();
|
|
214
215
|
return e.type !== "multiple" || !e.uploadedFiles.length ? null : /* @__PURE__ */ i("ul", { className: t.multipleFilesList, children: e.uploadedFiles.map((l, s) => /* @__PURE__ */ i("li", { className: t.multipleFilesListItem, children: /* @__PURE__ */ a("div", { className: t.multipleFilesListItemContent, children: [
|
|
215
216
|
/* @__PURE__ */ i("span", { className: t.multipleFilesListItemIconContainer, children: /* @__PURE__ */ i(D, { icon: "ap-icon-document", className: t.multipleFilesListItemIcon }) }),
|
|
216
217
|
/* @__PURE__ */ a("div", { className: t.multipleFilesListItemContentData, children: [
|
|
@@ -226,17 +227,17 @@ function We() {
|
|
|
226
227
|
] })
|
|
227
228
|
] }) }, s)) });
|
|
228
229
|
}
|
|
229
|
-
const I = Object.assign(
|
|
230
|
-
Label:
|
|
231
|
-
BrowseButton:
|
|
232
|
-
HelpText:
|
|
233
|
-
UploadedFilesList:
|
|
234
|
-
SingleFileContainer:
|
|
235
|
-
SingleFileRow:
|
|
236
|
-
SingleFileActions:
|
|
237
|
-
SingleFileDeleteButton:
|
|
230
|
+
const I = Object.assign(Oe, {
|
|
231
|
+
Label: Xe,
|
|
232
|
+
BrowseButton: Je,
|
|
233
|
+
HelpText: We,
|
|
234
|
+
UploadedFilesList: Ze,
|
|
235
|
+
SingleFileContainer: Ye,
|
|
236
|
+
SingleFileRow: Ge,
|
|
237
|
+
SingleFileActions: Qe,
|
|
238
|
+
SingleFileDeleteButton: w
|
|
238
239
|
});
|
|
239
240
|
export {
|
|
240
241
|
I as default,
|
|
241
|
-
|
|
242
|
+
u as useFilePickerContext
|
|
242
243
|
};
|
|
@@ -8,7 +8,7 @@ import { useState as S } from "react";
|
|
|
8
8
|
import { u as ne, R as oe, I as te, c as H, a as ie } from "../../index-DEphED6n.js";
|
|
9
9
|
import { u as ue, P as z, d as se, c as R, b as ce } from "../../index-DM51yNMI.js";
|
|
10
10
|
import { u as K } from "../../index-7CBv-Jx6.js";
|
|
11
|
-
import { R as le, A as de, P as me, C as be, I as ve, c as pe, G as _e, L as fe, a as ge, b as he, d as Me, e as Ne, S as Ce, f as Re, g as Pe, h as we } from "../../index-
|
|
11
|
+
import { R as le, A as de, P as me, C as be, I as ve, c as pe, G as _e, L as fe, a as ge, b as he, d as Me, e as Ne, S as Ce, f as Re, g as Pe, h as we } from "../../index-D_3jWVyV.js";
|
|
12
12
|
import '../../assets/NavBar.css';var x = "Menubar", [L, xe, Se] = ie(x), [Y] = ce(x, [
|
|
13
13
|
Se,
|
|
14
14
|
H
|
|
@@ -6,7 +6,7 @@ import { useRef as W, useState as N, useEffect as U } from "react";
|
|
|
6
6
|
import $ from "../Icon/Icon.js";
|
|
7
7
|
import "../Input/Input.js";
|
|
8
8
|
import { u as K, P as H, c as M, a as j, b as F } from "../../index-DM51yNMI.js";
|
|
9
|
-
import { R as V, A as X, P as q, C as J, I as Q, c as C, G as Y, L as Z, a as oo, b as eo, d as no, e as to, S as ro, f as ao, g as io, h as po } from "../../index-
|
|
9
|
+
import { R as V, A as X, P as q, C as J, I as Q, c as C, G as Y, L as Z, a as oo, b as eo, d as no, e as to, S as ro, f as ao, g as io, h as po } from "../../index-D_3jWVyV.js";
|
|
10
10
|
import { u as I } from "../../index-7CBv-Jx6.js";
|
|
11
11
|
import '../../assets/SplitButton.css';var v = "DropdownMenu", [so] = F(
|
|
12
12
|
v,
|
|
@@ -5,7 +5,7 @@ import W from "../Icon/Icon.js";
|
|
|
5
5
|
import Ie from "../Button/Button.js";
|
|
6
6
|
import "../Input/Input.js";
|
|
7
7
|
import Fe from "../Tooltip/Tooltip.js";
|
|
8
|
-
import { R as ve, A as Te, P as Ne, C as Le } from "../../index-
|
|
8
|
+
import { R as ve, A as Te, P as Ne, C as Le } from "../../index-C4ffg1vf.js";
|
|
9
9
|
import '../../assets/TagsFields.css';const De = "TagsFields-module__dropdownContainer___GIsND", Ce = "TagsFields-module__dropdownLabel___AUP9W", ye = "TagsFields-module__dropdownLabelDisabled___hilvh", Oe = "TagsFields-module__required___Ybg21", ke = "TagsFields-module__dropdownWrapper___KxTZl", Re = "TagsFields-module__selectedItemsCreatable___Pnf8l", xe = "TagsFields-module__selectedItem___Tp6lp", Ae = "TagsFields-module__selectedItemLabel___SwoJL", Se = "TagsFields-module__removeButton___od0yh", We = "TagsFields-module__removeIcon___2WRCF", Ee = "TagsFields-module__singleSelectedCreatableItem___QwENt", Me = "TagsFields-module__singleSelectedCreatableItemRemoveButton___1PeN7", Ve = "TagsFields-module__dropdownActions___USb5V", Be = "TagsFields-module__dropdownArrow___JT9d3", Pe = "TagsFields-module__dropdownArrowOpen___jPfTk", je = "TagsFields-module__dropdownMenu___gPhtC", qe = "TagsFields-module__dropdownCreatableSearchContainer___mltcH", Ge = "TagsFields-module__disabled___1OfNF", ze = "TagsFields-module__dropdownCreatableError___R6oyD", Je = "TagsFields-module__creatableInput___qz9jI", Qe = "TagsFields-module__optionsList___qyawx", Ue = "TagsFields-module__categoryGroup___In039", Ye = "TagsFields-module__categoryDivider___eROv0", Ke = "TagsFields-module__categoryLabel___Cv2h5", He = "TagsFields-module__optionItem___UujFS", Xe = "TagsFields-module__optionItemDisabled___9gB8N", Ze = "TagsFields-module__optionItemFocused___4rsDt", $e = "TagsFields-module__optionContent___QSC9G", et = "TagsFields-module__optionLabel___N-fQ7", tt = "TagsFields-module__tickIcon___3uRY-", st = "TagsFields-module__noOptions___ugYj9", lt = "TagsFields-module__helpers___ab6f-", ot = "TagsFields-module__helpText___Qzdqh", dt = "TagsFields-module__helpTextDisabled___m-oFo", nt = "TagsFields-module__helpLink___JQDmR", at = "TagsFields-module__helpLinkDisabled___Nk1BX", rt = "TagsFields-module__errorMessage___b-ugf", t = {
|
|
10
10
|
dropdownContainer: De,
|
|
11
11
|
dropdownLabel: Ce,
|
|
@@ -6,7 +6,7 @@ import ee from "../Icon/Icon.js";
|
|
|
6
6
|
import { P as G, u as te, d as F, c as C, b as oe, h as re } from "../../index-DM51yNMI.js";
|
|
7
7
|
import { P as ne, D as le } from "../../index-DrR82jOT.js";
|
|
8
8
|
import { u as ie } from "../../index-7CBv-Jx6.js";
|
|
9
|
-
import { R as se, A as ae, a as ce, c as B, C as ue } from "../../index-
|
|
9
|
+
import { R as se, A as ae, a as ce, c as B, C as ue } from "../../index-C-3_YVJ1.js";
|
|
10
10
|
import { P as K } from "../../index-BymOxiM6.js";
|
|
11
11
|
import '../../assets/Tooltip.css';var pe = Object.freeze({
|
|
12
12
|
// See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
|