@takeoff-ui/react-spar 0.3.0 → 0.4.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/README.md +23 -0
- package/agents/AGENTS.template.md +69 -0
- package/dist/index.cjs +1081 -61
- package/dist/index.d.cts +462 -3
- package/dist/index.d.ts +462 -3
- package/dist/index.mjs +1081 -62
- package/package.json +5 -4
package/dist/index.cjs
CHANGED
|
@@ -6,15 +6,25 @@ var spar = require('@turkish-technology/spar');
|
|
|
6
6
|
var clsx = require('clsx');
|
|
7
7
|
var chevronBottom = require('@takeoff-icons/react/chevron-bottom');
|
|
8
8
|
var chevronTop = require('@takeoff-icons/react/chevron-top');
|
|
9
|
+
var close = require('@takeoff-icons/react/close');
|
|
9
10
|
var chevronRight = require('@takeoff-icons/react/chevron-right');
|
|
10
11
|
var check = require('@takeoff-icons/react/check');
|
|
11
|
-
var
|
|
12
|
+
var remove = require('@takeoff-icons/react/remove');
|
|
13
|
+
var info = require('@takeoff-icons/react/info');
|
|
14
|
+
var alertCircle = require('@takeoff-icons/react/alert-circle');
|
|
15
|
+
var eyeClosed = require('@takeoff-icons/react/eye-closed');
|
|
16
|
+
var eyeOpen = require('@takeoff-icons/react/eye-open');
|
|
12
17
|
var reactTable = require('@tanstack/react-table');
|
|
18
|
+
var arrowBottom = require('@takeoff-icons/react/arrow-bottom');
|
|
19
|
+
var arrowTop = require('@takeoff-icons/react/arrow-top');
|
|
13
20
|
var swap = require('@takeoff-icons/react/swap');
|
|
14
21
|
var search = require('@takeoff-icons/react/search');
|
|
15
|
-
var arrowLeft = require('@takeoff-icons/react/arrow-left');
|
|
16
|
-
var arrowRight = require('@takeoff-icons/react/arrow-right');
|
|
17
22
|
var chevronLeft = require('@takeoff-icons/react/chevron-left');
|
|
23
|
+
var doubleChevronLeft = require('@takeoff-icons/react/double-chevron-left');
|
|
24
|
+
var doubleChevronRight = require('@takeoff-icons/react/double-chevron-right');
|
|
25
|
+
var arrowDownload = require('@takeoff-icons/react/arrow-download');
|
|
26
|
+
var checkCircle = require('@takeoff-icons/react/check-circle');
|
|
27
|
+
var closeCircle = require('@takeoff-icons/react/close-circle');
|
|
18
28
|
|
|
19
29
|
// src/provider.tsx
|
|
20
30
|
|
|
@@ -246,7 +256,7 @@ function useControllableState(controlledValue, defaultValue, onChange) {
|
|
|
246
256
|
},
|
|
247
257
|
[isControlled, onChange]
|
|
248
258
|
);
|
|
249
|
-
return [value, setValue];
|
|
259
|
+
return [value, setValue, isControlled];
|
|
250
260
|
}
|
|
251
261
|
|
|
252
262
|
// src/components/accordion/context.ts
|
|
@@ -423,40 +433,6 @@ var AlertActions = (props) => {
|
|
|
423
433
|
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...actionsProps, ref, ...rootAttrs, children });
|
|
424
434
|
};
|
|
425
435
|
AlertActions.displayName = "Alert.Actions";
|
|
426
|
-
var baseSvgProps = {
|
|
427
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
428
|
-
"width": "1em",
|
|
429
|
-
"height": "1em",
|
|
430
|
-
"viewBox": "0 0 24 24",
|
|
431
|
-
"fill": "none",
|
|
432
|
-
"stroke": "currentColor",
|
|
433
|
-
"strokeWidth": 2,
|
|
434
|
-
"strokeLinecap": "round",
|
|
435
|
-
"strokeLinejoin": "round",
|
|
436
|
-
"focusable": false,
|
|
437
|
-
"aria-hidden": true
|
|
438
|
-
};
|
|
439
|
-
var filledSvgProps = {
|
|
440
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
441
|
-
"width": "1em",
|
|
442
|
-
"height": "1em",
|
|
443
|
-
"viewBox": "0 0 24 24",
|
|
444
|
-
"fill": "currentColor",
|
|
445
|
-
"focusable": false,
|
|
446
|
-
"aria-hidden": true
|
|
447
|
-
};
|
|
448
|
-
var PlaceholderChevronDown = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseSvgProps, "data-placeholder-icon": "chevron-down", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" }) });
|
|
449
|
-
var PlaceholderChevronUp = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseSvgProps, "data-placeholder-icon": "chevron-up", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m18 15-6-6-6 6" }) });
|
|
450
|
-
var PlaceholderClose = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { ...baseSvgProps, "data-placeholder-icon": "close", ...props, children: [
|
|
451
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
|
|
452
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
|
|
453
|
-
] });
|
|
454
|
-
var PlaceholderInfo = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...filledSvgProps, "data-placeholder-icon": "info", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(2 2) scale(1.714)", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5.83333 0C2.61333 0 0 2.61333 0 5.83333C0 9.05333 2.61333 11.6667 5.83333 11.6667C9.05333 11.6667 11.6667 9.05333 11.6667 5.83333C11.6667 2.61333 9.05333 0 5.83333 0ZM5.83333 8.75C5.5125 8.75 5.25 8.4875 5.25 8.16667V5.83333C5.25 5.5125 5.5125 5.25 5.83333 5.25C6.15417 5.25 6.41667 5.5125 6.41667 5.83333V8.16667C6.41667 8.4875 6.15417 8.75 5.83333 8.75ZM6.41667 4.08333H5.25V2.91667H6.41667V4.08333Z" }) }) });
|
|
455
|
-
var PlaceholderError = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...filledSvgProps, "data-placeholder-icon": "error", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(2 2) scale(1.714)", fillRule: "evenodd", clipRule: "evenodd", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5.83333 0C2.61333 0 0 2.61333 0 5.83333C0 9.05333 2.61333 11.6667 5.83333 11.6667C9.05333 11.6667 11.6667 9.05333 11.6667 5.83333C11.6667 2.61333 9.05333 0 5.83333 0ZM5.83333 2.91667C6.15417 2.91667 6.41667 3.17917 6.41667 3.5V5.83333C6.41667 6.15417 6.15417 6.41667 5.83333 6.41667C5.5125 6.41667 5.25 6.15417 5.25 5.83333V3.5C5.25 3.17917 5.5125 2.91667 5.83333 2.91667ZM5.25 7.58333H6.41667V8.75H5.25V7.58333Z" }) }) });
|
|
456
|
-
var PlaceholderCheck = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseSvgProps, "data-placeholder-icon": "check", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12l5 5L20 7" }) });
|
|
457
|
-
var PlaceholderRemove = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseSvgProps, "data-placeholder-icon": "remove", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12h14" }) });
|
|
458
|
-
var PlaceholderEye = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...filledSvgProps, "data-placeholder-icon": "eye", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(1 4.5) scale(1.2)", fillRule: "evenodd", clipRule: "evenodd", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.16667 1.66667C12.325 1.66667 15.1417 3.44167 16.5167 6.25C15.1417 9.05833 12.325 10.8333 9.16667 10.8333C6.00833 10.8333 3.19167 9.05833 1.81667 6.25C3.19167 3.44167 6.00833 1.66667 9.16667 1.66667ZM9.16667 0C5 0 1.44167 2.59167 0 6.25C1.44167 9.90833 5 12.5 9.16667 12.5C13.3333 12.5 16.8917 9.90833 18.3333 6.25C16.8917 2.59167 13.3333 0 9.16667 0ZM9.16667 4.16667C10.3167 4.16667 11.25 5.1 11.25 6.25C11.25 7.4 10.3167 8.33333 9.16667 8.33333C8.01667 8.33333 7.08333 7.4 7.08333 6.25C7.08333 5.1 8.01667 4.16667 9.16667 4.16667ZM9.16667 2.5C7.1 2.5 5.41667 4.18333 5.41667 6.25C5.41667 8.31667 7.1 10 9.16667 10C11.2333 10 12.9167 8.31667 12.9167 6.25C12.9167 4.18333 11.2333 2.5 9.16667 2.5Z" }) }) });
|
|
459
|
-
var PlaceholderEyeOff = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { ...filledSvgProps, "data-placeholder-icon": "eye-off", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(1 2.42) scale(1.2)", fillRule: "evenodd", clipRule: "evenodd", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.16667 2.95833C12.325 2.95833 15.1417 4.73333 16.5167 7.54167C16.025 8.55833 15.3333 9.43333 14.5083 10.1417L15.6833 11.3167C16.8417 10.2917 17.7583 9.00833 18.3333 7.54167C16.8917 3.88333 13.3333 1.29167 9.16667 1.29167C8.10833 1.29167 7.09167 1.45833 6.13333 1.76667L7.50833 3.14167C8.05 3.03333 8.6 2.95833 9.16667 2.95833ZM8.275 3.90833L10 5.63333C10.475 5.84167 10.8583 6.225 11.0667 6.7L12.7917 8.425C12.8583 8.14167 12.9083 7.84167 12.9083 7.53333C12.9167 5.46667 11.2333 3.79167 9.16667 3.79167C8.85833 3.79167 8.56667 3.83333 8.275 3.90833ZM0.841667 1.18333L3.075 3.41667C1.71667 4.48333 0.641667 5.9 0 7.54167C1.44167 11.2 5 13.7917 9.16667 13.7917C10.4333 13.7917 11.65 13.55 12.7667 13.1083L15.6167 15.9583L16.7917 14.7833L2.01667 0L0.841667 1.18333ZM7.09167 7.43333L9.26667 9.60833C9.23333 9.61667 9.2 9.625 9.16667 9.625C8.01667 9.625 7.08333 8.69167 7.08333 7.54167C7.08333 7.5 7.09167 7.475 7.09167 7.43333ZM4.25833 4.6L5.71667 6.05833C5.525 6.51667 5.41667 7.01667 5.41667 7.54167C5.41667 9.60833 7.1 11.2917 9.16667 11.2917C9.69167 11.2917 10.1917 11.1833 10.6417 10.9917L11.4583 11.8083C10.725 12.0083 9.95833 12.125 9.16667 12.125C6.00833 12.125 3.19167 10.35 1.81667 7.54167C2.4 6.35 3.25 5.36667 4.25833 4.6Z" }) }) });
|
|
460
436
|
var AlertClose = (props) => {
|
|
461
437
|
const theme = useComponentTheme("AlertClose");
|
|
462
438
|
const { onClose } = useAlertContext("Alert.Close");
|
|
@@ -479,7 +455,7 @@ var AlertClose = (props) => {
|
|
|
479
455
|
"aria-label": ariaLabel ?? (hasCustomChildren ? void 0 : DEFAULT_CLOSE_LABEL),
|
|
480
456
|
onClick: handleClick,
|
|
481
457
|
...closeRootAttrs,
|
|
482
|
-
children: hasCustomChildren ? children : /* @__PURE__ */ jsxRuntime.jsx(
|
|
458
|
+
children: hasCustomChildren ? children : /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {})
|
|
483
459
|
}
|
|
484
460
|
);
|
|
485
461
|
};
|
|
@@ -939,7 +915,7 @@ var CheckboxIndicator = (props) => {
|
|
|
939
915
|
instanceSlotProps: slotProps,
|
|
940
916
|
instanceClassNames: classNames
|
|
941
917
|
});
|
|
942
|
-
const resolvedChildren = typeof children === "function" ? children({ checked, indeterminate }) : children ?? /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": true, children: indeterminate ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
918
|
+
const resolvedChildren = typeof children === "function" ? children({ checked, indeterminate }) : children ?? /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": true, children: indeterminate ? /* @__PURE__ */ jsxRuntime.jsx(remove.RemoveIconOutlinedRounded, {}) : /* @__PURE__ */ jsxRuntime.jsx(check.CheckIconOutlinedRounded, {}) });
|
|
943
919
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { ...rest, ...indicatorAttrs, ref, children: resolvedChildren });
|
|
944
920
|
};
|
|
945
921
|
CheckboxIndicator.displayName = "Checkbox.Indicator";
|
|
@@ -1064,7 +1040,7 @@ var Chip = (props) => {
|
|
|
1064
1040
|
isRenderableNode(children) && /* @__PURE__ */ jsxRuntime.jsx("span", { ...labelSlotAttrs, children }),
|
|
1065
1041
|
removable && // The icon-only remove control needs an accessible name. Default it,
|
|
1066
1042
|
// but let `slotProps.remove` (spread after) override via `aria-label`.
|
|
1067
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { "aria-label": DEFAULT_REMOVE_LABEL, ...removeButtonAttrs, disabled, onClick: handleRemoveClick, type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1043
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { "aria-label": DEFAULT_REMOVE_LABEL, ...removeButtonAttrs, disabled, onClick: handleRemoveClick, type: "button", children: /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {}) })
|
|
1068
1044
|
]
|
|
1069
1045
|
}
|
|
1070
1046
|
);
|
|
@@ -1079,6 +1055,7 @@ var DEFAULT_PLACEMENT = "right";
|
|
|
1079
1055
|
var DEFAULT_HEADER_TYPE2 = "basic";
|
|
1080
1056
|
var DEFAULT_FOOTER_TYPE2 = "basic";
|
|
1081
1057
|
var DEFAULT_INTENSITY = "base";
|
|
1058
|
+
var DEFAULT_CLOSE_LABEL2 = "Close";
|
|
1082
1059
|
var Drawer = (props) => {
|
|
1083
1060
|
const theme = useComponentTheme("Drawer");
|
|
1084
1061
|
const merged = { ...theme?.defaultProps, ...props };
|
|
@@ -1224,8 +1201,9 @@ DrawerFooter.displayName = "Drawer.Footer";
|
|
|
1224
1201
|
var DrawerClose = (props) => {
|
|
1225
1202
|
const theme = useComponentTheme("DrawerClose");
|
|
1226
1203
|
const { rootAttrs, rest } = composeRootAttrs(DrawerCloseBase, props, theme);
|
|
1227
|
-
const { children, ref, ...closeProps } = rest;
|
|
1228
|
-
|
|
1204
|
+
const { children, ref, "aria-label": ariaLabel, ...closeProps } = rest;
|
|
1205
|
+
const hasCustomChildren = typeof children === "function" || isRenderableNode(children);
|
|
1206
|
+
return /* @__PURE__ */ jsxRuntime.jsx(spar.DialogClose, { ...closeProps, "aria-label": ariaLabel ?? (hasCustomChildren ? void 0 : DEFAULT_CLOSE_LABEL2), ref, ...rootAttrs, children: hasCustomChildren ? children : /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {}) });
|
|
1229
1207
|
};
|
|
1230
1208
|
DrawerClose.displayName = "Drawer.Close";
|
|
1231
1209
|
|
|
@@ -1328,6 +1306,7 @@ DialogTrigger.displayName = "Dialog.Trigger";
|
|
|
1328
1306
|
var DEFAULT_INTENSITY2 = "base";
|
|
1329
1307
|
var DEFAULT_HEADER_TYPE3 = "basic";
|
|
1330
1308
|
var DEFAULT_FOOTER_TYPE3 = "basic";
|
|
1309
|
+
var DEFAULT_CLOSE_LABEL3 = "Close";
|
|
1331
1310
|
var DialogOverlay = (props) => {
|
|
1332
1311
|
const theme = useComponentTheme("DialogOverlay");
|
|
1333
1312
|
const { rootAttrs, rest } = composeRootAttrs(DialogOverlayBase, props, theme, {
|
|
@@ -1403,8 +1382,9 @@ DialogFooter.displayName = "Dialog.Footer";
|
|
|
1403
1382
|
var DialogClose = (props) => {
|
|
1404
1383
|
const theme = useComponentTheme("DialogClose");
|
|
1405
1384
|
const { rootAttrs, rest } = composeRootAttrs(DialogCloseBase, props, theme);
|
|
1406
|
-
const { children, ref, ...sparProps } = rest;
|
|
1407
|
-
|
|
1385
|
+
const { children, ref, "aria-label": ariaLabel, ...sparProps } = rest;
|
|
1386
|
+
const hasCustomChildren = typeof children === "function" || isRenderableNode(children);
|
|
1387
|
+
return /* @__PURE__ */ jsxRuntime.jsx(spar.DialogClose, { ...sparProps, "aria-label": ariaLabel ?? (hasCustomChildren ? void 0 : DEFAULT_CLOSE_LABEL3), ...rootAttrs, ref, children: hasCustomChildren ? children : /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {}) });
|
|
1408
1388
|
};
|
|
1409
1389
|
DialogClose.displayName = "Dialog.Close";
|
|
1410
1390
|
|
|
@@ -1654,7 +1634,7 @@ var FieldDescription = (props) => {
|
|
|
1654
1634
|
});
|
|
1655
1635
|
const hasContent = children != null && children !== "";
|
|
1656
1636
|
return /* @__PURE__ */ jsxRuntime.jsxs(spar.FieldDescription, { ...spar$1, ref, ...rootAttrs, children: [
|
|
1657
|
-
hasContent && /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1637
|
+
hasContent && /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(info.InfoIconFilledRounded, {}) }),
|
|
1658
1638
|
children
|
|
1659
1639
|
] });
|
|
1660
1640
|
};
|
|
@@ -1671,7 +1651,7 @@ var FieldErrorMessage = (props) => {
|
|
|
1671
1651
|
});
|
|
1672
1652
|
const hasContent = children != null && children !== "";
|
|
1673
1653
|
return /* @__PURE__ */ jsxRuntime.jsxs(spar.FieldErrorMessage, { ...spar$1, ref, ...rootAttrs, children: [
|
|
1674
|
-
hasContent && /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1654
|
+
hasContent && /* @__PURE__ */ jsxRuntime.jsx("span", { ...iconAttrs, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(alertCircle.AlertCircleIconFilledRounded, {}) }),
|
|
1675
1655
|
children
|
|
1676
1656
|
] });
|
|
1677
1657
|
};
|
|
@@ -2000,7 +1980,7 @@ var InputClearButton = (props) => {
|
|
|
2000
1980
|
"aria-label": ariaLabel,
|
|
2001
1981
|
onClick: handleClick,
|
|
2002
1982
|
onKeyDown: handleKeyDown,
|
|
2003
|
-
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1983
|
+
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {})
|
|
2004
1984
|
}
|
|
2005
1985
|
);
|
|
2006
1986
|
};
|
|
@@ -2031,7 +2011,7 @@ var InputDecrement = (props) => {
|
|
|
2031
2011
|
disabled: disabled || readOnly,
|
|
2032
2012
|
"aria-label": ariaLabel,
|
|
2033
2013
|
onClick: handleClick,
|
|
2034
|
-
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(
|
|
2014
|
+
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(chevronBottom.ChevronBottomIconOutlinedRounded, {})
|
|
2035
2015
|
}
|
|
2036
2016
|
);
|
|
2037
2017
|
};
|
|
@@ -2109,7 +2089,7 @@ var InputIncrement = (props) => {
|
|
|
2109
2089
|
disabled: disabled || readOnly,
|
|
2110
2090
|
"aria-label": ariaLabel,
|
|
2111
2091
|
onClick: handleClick,
|
|
2112
|
-
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(
|
|
2092
|
+
startContent: children ?? /* @__PURE__ */ jsxRuntime.jsx(chevronTop.ChevronTopIconOutlinedRounded, {})
|
|
2113
2093
|
}
|
|
2114
2094
|
);
|
|
2115
2095
|
};
|
|
@@ -2168,7 +2148,7 @@ var InputRevealButton = (props) => {
|
|
|
2168
2148
|
"aria-label": "Toggle password visibility",
|
|
2169
2149
|
"aria-pressed": revealed,
|
|
2170
2150
|
onClick: handleClick,
|
|
2171
|
-
startContent: children ?? (revealed ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
2151
|
+
startContent: children ?? (revealed ? /* @__PURE__ */ jsxRuntime.jsx(eyeClosed.EyeClosedIconOutlinedRounded, {}) : /* @__PURE__ */ jsxRuntime.jsx(eyeOpen.EyeOpenIconOutlinedRounded, {}))
|
|
2172
2152
|
}
|
|
2173
2153
|
);
|
|
2174
2154
|
};
|
|
@@ -2403,6 +2383,7 @@ PopoverTrigger.displayName = "Popover.Trigger";
|
|
|
2403
2383
|
|
|
2404
2384
|
// src/components/popover/defaults.ts
|
|
2405
2385
|
var DEFAULT_VARIANT5 = "white";
|
|
2386
|
+
var DEFAULT_CLOSE_LABEL4 = "Close";
|
|
2406
2387
|
var PopoverContent = (props) => {
|
|
2407
2388
|
const theme = useComponentTheme("PopoverContent");
|
|
2408
2389
|
const { rootAttrs, rest } = composeRootAttrs(PopoverContentBase, props, theme, {
|
|
@@ -2438,8 +2419,9 @@ PopoverArrow.displayName = "Popover.Arrow";
|
|
|
2438
2419
|
var PopoverClose = (props) => {
|
|
2439
2420
|
const theme = useComponentTheme("PopoverClose");
|
|
2440
2421
|
const { rootAttrs, rest } = composeRootAttrs(PopoverCloseBase, props, theme);
|
|
2441
|
-
const { children, ref, ...sparProps } = rest;
|
|
2442
|
-
|
|
2422
|
+
const { children, ref, "aria-label": ariaLabel, ...sparProps } = rest;
|
|
2423
|
+
const hasCustomChildren = typeof children === "function" || isRenderableNode(children);
|
|
2424
|
+
return /* @__PURE__ */ jsxRuntime.jsx(spar.PopoverClose, { ...sparProps, "aria-label": ariaLabel ?? (hasCustomChildren ? void 0 : DEFAULT_CLOSE_LABEL4), ...rootAttrs, ref, children: hasCustomChildren ? children : /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, {}) });
|
|
2443
2425
|
};
|
|
2444
2426
|
PopoverClose.displayName = "Popover.Close";
|
|
2445
2427
|
|
|
@@ -3398,8 +3380,8 @@ var Slider = (props) => {
|
|
|
3398
3380
|
name && !disabled && (range ? (
|
|
3399
3381
|
// One input per handle so a 3+ thumb range submits every value; a
|
|
3400
3382
|
// two-handle range keeps the conventional `-min` / `-max` pair.
|
|
3401
|
-
values.map((entry, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3402
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
3383
|
+
values.map((entry, index) => /* @__PURE__ */ jsxRuntime.jsx(spar.InputField, { type: "hidden", name: rangeInputName(name, index, values.length), value: entry, form }, index))
|
|
3384
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(spar.InputField, { type: "hidden", name, value: values[0], form }))
|
|
3403
3385
|
] })
|
|
3404
3386
|
}
|
|
3405
3387
|
);
|
|
@@ -4338,7 +4320,7 @@ var TableHeaderCell = ({ header }) => {
|
|
|
4338
4320
|
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { ...slotAttrs("headerContent"), children: [
|
|
4339
4321
|
canSort ? /* @__PURE__ */ jsxRuntime.jsxs("button", { ...slotAttrs("sortTrigger"), type: "button", onClick: column.getToggleSortingHandler(), children: [
|
|
4340
4322
|
content,
|
|
4341
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { ...slotAttrs("sortIcon"), "data-direction": sorted || "none", "aria-hidden": "true", children: sorted === "asc" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4323
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { ...slotAttrs("sortIcon"), "data-direction": sorted || "none", "aria-hidden": "true", children: sorted === "asc" ? /* @__PURE__ */ jsxRuntime.jsx(arrowTop.ArrowTopIconOutlinedRounded, {}) : sorted === "desc" ? /* @__PURE__ */ jsxRuntime.jsx(arrowBottom.ArrowBottomIconOutlinedRounded, {}) : /* @__PURE__ */ jsxRuntime.jsx(swap.SwapIconOutlinedRounded, {}) })
|
|
4342
4324
|
] }) : content,
|
|
4343
4325
|
canFilter && /* @__PURE__ */ jsxRuntime.jsx(TableColumnFilter, { header })
|
|
4344
4326
|
] })
|
|
@@ -4392,7 +4374,7 @@ var TablePagination = () => {
|
|
|
4392
4374
|
variant: "neutral",
|
|
4393
4375
|
appearance: "text",
|
|
4394
4376
|
"aria-label": "First page",
|
|
4395
|
-
startContent: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4377
|
+
startContent: /* @__PURE__ */ jsxRuntime.jsx(doubleChevronLeft.DoubleChevronLeftIconOutlinedRounded, {}),
|
|
4396
4378
|
disabled: !table.getCanPreviousPage(),
|
|
4397
4379
|
onClick: () => table.setPageIndex(0)
|
|
4398
4380
|
}
|
|
@@ -4449,7 +4431,7 @@ var TablePagination = () => {
|
|
|
4449
4431
|
variant: "neutral",
|
|
4450
4432
|
appearance: "text",
|
|
4451
4433
|
"aria-label": "Last page",
|
|
4452
|
-
startContent: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4434
|
+
startContent: /* @__PURE__ */ jsxRuntime.jsx(doubleChevronRight.DoubleChevronRightIconOutlinedRounded, {}),
|
|
4453
4435
|
disabled: !table.getCanNextPage() || pageCount <= 0,
|
|
4454
4436
|
onClick: () => table.setPageIndex(pageCount - 1)
|
|
4455
4437
|
}
|
|
@@ -4882,7 +4864,7 @@ var ToastBase = createComponentBase({
|
|
|
4882
4864
|
|
|
4883
4865
|
// src/components/toast/defaults.ts
|
|
4884
4866
|
var DEFAULT_TOAST_APPEARANCE = "filled";
|
|
4885
|
-
var
|
|
4867
|
+
var DEFAULT_CLOSE_LABEL5 = "Dismiss notification";
|
|
4886
4868
|
|
|
4887
4869
|
// src/components/toast/utils.ts
|
|
4888
4870
|
var toastTypeToVariant = (type) => {
|
|
@@ -4903,7 +4885,7 @@ var toastTypeToVariant = (type) => {
|
|
|
4903
4885
|
var Toast = (props) => {
|
|
4904
4886
|
const theme = useComponentTheme("Toast");
|
|
4905
4887
|
const { rootAttrs, rest } = composeRootAttrs(ToastBase, props, theme);
|
|
4906
|
-
const { as, toast, toaster, appearance = DEFAULT_TOAST_APPEARANCE, closeLabel =
|
|
4888
|
+
const { as, toast, toaster, appearance = DEFAULT_TOAST_APPEARANCE, closeLabel = DEFAULT_CLOSE_LABEL5, children, ref, ...toastProps } = rest;
|
|
4907
4889
|
const Component = as ?? "div";
|
|
4908
4890
|
const variant = toastTypeToVariant(toast.type);
|
|
4909
4891
|
return /* @__PURE__ */ jsxRuntime.jsx(spar.Toast.Root, { ...toastProps, as: Component, ref, toast, toaster, ...rootAttrs, children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(Alert2, { variant, appearance, role: "presentation", children: [
|
|
@@ -4923,7 +4905,7 @@ var Toaster = (props) => {
|
|
|
4923
4905
|
"data-placement": toaster2.placement
|
|
4924
4906
|
})
|
|
4925
4907
|
});
|
|
4926
|
-
const { as, toaster, appearance = DEFAULT_TOAST_APPEARANCE, closeLabel =
|
|
4908
|
+
const { as, toaster, appearance = DEFAULT_TOAST_APPEARANCE, closeLabel = DEFAULT_CLOSE_LABEL5, overlap = false, children, ref, ...toasterProps } = rest;
|
|
4927
4909
|
const Component = as ?? "div";
|
|
4928
4910
|
return /* @__PURE__ */ jsxRuntime.jsx(spar.Toaster, { ...toasterProps, as: Component, ref, toaster, overlap, ...rootAttrs, children: (toast) => (
|
|
4929
4911
|
// Spar renders each item directly into a mapped array, so the key must
|
|
@@ -4972,6 +4954,1043 @@ var Skeleton = (props) => {
|
|
|
4972
4954
|
};
|
|
4973
4955
|
Skeleton.displayName = "Skeleton";
|
|
4974
4956
|
|
|
4957
|
+
// src/components/upload/base.ts
|
|
4958
|
+
var UploadBase = createComponentBase({
|
|
4959
|
+
name: "Upload",
|
|
4960
|
+
slots: ["root"],
|
|
4961
|
+
classes: { root: "tk-upload" }
|
|
4962
|
+
});
|
|
4963
|
+
var UploadDropzoneBase = createComponentBase({
|
|
4964
|
+
name: "UploadDropzone",
|
|
4965
|
+
slots: ["root"],
|
|
4966
|
+
classes: { root: "tk-upload-dropzone" }
|
|
4967
|
+
});
|
|
4968
|
+
var UploadActionsBase = createComponentBase({
|
|
4969
|
+
name: "UploadActions",
|
|
4970
|
+
slots: ["root"],
|
|
4971
|
+
classes: { root: "tk-upload-actions" }
|
|
4972
|
+
});
|
|
4973
|
+
var UploadTriggerBase = createComponentBase({
|
|
4974
|
+
name: "UploadTrigger",
|
|
4975
|
+
slots: ["root"],
|
|
4976
|
+
classes: { root: "tk-upload-trigger" }
|
|
4977
|
+
});
|
|
4978
|
+
var UploadSubmitBase = createComponentBase({
|
|
4979
|
+
name: "UploadSubmit",
|
|
4980
|
+
slots: ["root"],
|
|
4981
|
+
classes: { root: "tk-upload-submit" }
|
|
4982
|
+
});
|
|
4983
|
+
var UploadListBase = createComponentBase({
|
|
4984
|
+
name: "UploadList",
|
|
4985
|
+
slots: ["root"],
|
|
4986
|
+
classes: { root: "tk-upload-list" }
|
|
4987
|
+
});
|
|
4988
|
+
var UploadItemBase = createComponentBase({
|
|
4989
|
+
name: "UploadItem",
|
|
4990
|
+
slots: ["root"],
|
|
4991
|
+
classes: { root: "tk-upload-item" }
|
|
4992
|
+
});
|
|
4993
|
+
var UploadItemContentBase = createComponentBase({
|
|
4994
|
+
name: "UploadItemContent",
|
|
4995
|
+
slots: ["root", "name", "size", "status", "progress"],
|
|
4996
|
+
classes: {
|
|
4997
|
+
root: "tk-upload-item-content",
|
|
4998
|
+
name: "tk-upload-item-name",
|
|
4999
|
+
size: "tk-upload-item-size",
|
|
5000
|
+
status: "tk-upload-item-status",
|
|
5001
|
+
progress: "tk-upload-item-progress"
|
|
5002
|
+
}
|
|
5003
|
+
});
|
|
5004
|
+
var UploadItemPreviewBase = createComponentBase({
|
|
5005
|
+
name: "UploadItemPreview",
|
|
5006
|
+
slots: ["root", "image", "icon", "extension"],
|
|
5007
|
+
classes: {
|
|
5008
|
+
root: "tk-upload-item-preview",
|
|
5009
|
+
image: "tk-upload-item-preview-image",
|
|
5010
|
+
icon: "tk-upload-item-preview-icon",
|
|
5011
|
+
extension: "tk-upload-item-preview-extension"
|
|
5012
|
+
}
|
|
5013
|
+
});
|
|
5014
|
+
var UploadItemActionsBase = createComponentBase({
|
|
5015
|
+
name: "UploadItemActions",
|
|
5016
|
+
slots: ["root"],
|
|
5017
|
+
classes: { root: "tk-upload-item-actions" }
|
|
5018
|
+
});
|
|
5019
|
+
var UploadItemActionBase = createComponentBase({
|
|
5020
|
+
name: "UploadItemAction",
|
|
5021
|
+
slots: ["root"],
|
|
5022
|
+
classes: { root: "tk-upload-item-action" }
|
|
5023
|
+
});
|
|
5024
|
+
|
|
5025
|
+
// src/components/upload/context.ts
|
|
5026
|
+
var [UploadProvider, useUploadContext] = createSafeContext("UploadProvider");
|
|
5027
|
+
var [UploadItemProvider, useUploadItemContext] = createSafeContext("UploadItemProvider");
|
|
5028
|
+
|
|
5029
|
+
// src/components/upload/defaults.ts
|
|
5030
|
+
var DEFAULT_MULTIPLE = false;
|
|
5031
|
+
var DEFAULT_DIRECTORY = false;
|
|
5032
|
+
var DEFAULT_STATUS = "idle";
|
|
5033
|
+
var DEFAULT_UPLOADING_LABEL = "Uploading\u2026";
|
|
5034
|
+
var DEFAULT_PROCESSING_LABEL = "Processing\u2026";
|
|
5035
|
+
var DEFAULT_COMPLETED_LABEL2 = "Completed";
|
|
5036
|
+
var DEFAULT_ERROR_LABEL2 = "Failed";
|
|
5037
|
+
var DEFAULT_PROGRESS_LABEL = "{name} upload progress";
|
|
5038
|
+
var DEFAULT_DOWNLOAD_LABEL = "Download {name}";
|
|
5039
|
+
var DEFAULT_REMOVE_LABEL2 = "Remove {name}";
|
|
5040
|
+
|
|
5041
|
+
// src/components/upload/helpers.ts
|
|
5042
|
+
var fileKey = (file) => `${file.webkitRelativePath || file.name}:${file.size}:${file.lastModified}`;
|
|
5043
|
+
var idCounter = 0;
|
|
5044
|
+
var generateId = () => {
|
|
5045
|
+
const cryptoObj = typeof globalThis !== "undefined" ? globalThis.crypto : void 0;
|
|
5046
|
+
if (cryptoObj && typeof cryptoObj.randomUUID === "function") {
|
|
5047
|
+
try {
|
|
5048
|
+
return cryptoObj.randomUUID();
|
|
5049
|
+
} catch {
|
|
5050
|
+
}
|
|
5051
|
+
}
|
|
5052
|
+
idCounter += 1;
|
|
5053
|
+
return `tk-upload-${idCounter}-${Date.now().toString(36)}`;
|
|
5054
|
+
};
|
|
5055
|
+
var createUploadFile = (file) => ({
|
|
5056
|
+
id: generateId(),
|
|
5057
|
+
file,
|
|
5058
|
+
name: file.name,
|
|
5059
|
+
size: file.size,
|
|
5060
|
+
type: file.type,
|
|
5061
|
+
status: DEFAULT_STATUS
|
|
5062
|
+
});
|
|
5063
|
+
var fileName = (item) => item.name ?? item.file?.name ?? "";
|
|
5064
|
+
var fileSize = (item) => item.size ?? item.file?.size;
|
|
5065
|
+
var fileType = (item) => item.type ?? item.file?.type;
|
|
5066
|
+
var fileStatus = (item) => item.status ?? DEFAULT_STATUS;
|
|
5067
|
+
var formatFileLabel = (template, name) => template.split("{name}").join(name);
|
|
5068
|
+
var isConsumerVeto = (event, preventedOnEntry) => event.defaultPrevented && !preventedOnEntry;
|
|
5069
|
+
var SIZE_UNITS = ["byte", "kilobyte", "megabyte", "gigabyte", "terabyte"];
|
|
5070
|
+
var sizeFormatters = /* @__PURE__ */ new Map();
|
|
5071
|
+
var sizeFormatter = (exponent) => {
|
|
5072
|
+
let formatter = sizeFormatters.get(exponent);
|
|
5073
|
+
if (!formatter) {
|
|
5074
|
+
formatter = new Intl.NumberFormat(void 0, { style: "unit", unit: SIZE_UNITS[exponent], unitDisplay: "short" });
|
|
5075
|
+
sizeFormatters.set(exponent, formatter);
|
|
5076
|
+
}
|
|
5077
|
+
return formatter;
|
|
5078
|
+
};
|
|
5079
|
+
var roundForUnit = (value, exponent) => exponent === 0 || value >= 100 ? Math.round(value) : Math.round(value * 10) / 10;
|
|
5080
|
+
var formatFileSize = (bytes) => {
|
|
5081
|
+
if (!Number.isFinite(bytes) || bytes <= 0) return sizeFormatter(0).format(0);
|
|
5082
|
+
let exponent = Math.max(0, Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), SIZE_UNITS.length - 1));
|
|
5083
|
+
let rounded = roundForUnit(bytes / 1024 ** exponent, exponent);
|
|
5084
|
+
if (rounded >= 1024 && exponent < SIZE_UNITS.length - 1) {
|
|
5085
|
+
exponent += 1;
|
|
5086
|
+
rounded = roundForUnit(bytes / 1024 ** exponent, exponent);
|
|
5087
|
+
}
|
|
5088
|
+
return sizeFormatter(exponent).format(rounded);
|
|
5089
|
+
};
|
|
5090
|
+
var OBJECT_URL_TTL_MS = 1e3;
|
|
5091
|
+
var canSaveUploadFile = (item) => Boolean(item.file || item.url);
|
|
5092
|
+
var saveUploadFile = (item) => {
|
|
5093
|
+
const canCreate = typeof URL !== "undefined" && typeof URL.createObjectURL === "function";
|
|
5094
|
+
const objectUrl = item.file && canCreate ? URL.createObjectURL(item.file) : void 0;
|
|
5095
|
+
const href = objectUrl ?? item.url;
|
|
5096
|
+
if (!href) return;
|
|
5097
|
+
const link = document.createElement("a");
|
|
5098
|
+
link.href = href;
|
|
5099
|
+
link.download = fileName(item);
|
|
5100
|
+
document.body.append(link);
|
|
5101
|
+
link.click();
|
|
5102
|
+
link.remove();
|
|
5103
|
+
if (objectUrl) setTimeout(() => URL.revokeObjectURL(objectUrl), OBJECT_URL_TTL_MS);
|
|
5104
|
+
};
|
|
5105
|
+
var IMAGE_TYPES = /* @__PURE__ */ new Set(["image/jpeg", "image/png", "image/gif", "image/webp", "image/avif", "image/svg+xml"]);
|
|
5106
|
+
var isImageType = (type) => type !== void 0 && IMAGE_TYPES.has(type);
|
|
5107
|
+
var nameExtension = (name) => {
|
|
5108
|
+
const dot = name.lastIndexOf(".");
|
|
5109
|
+
return dot > 0 ? name.slice(dot + 1).toUpperCase() : "";
|
|
5110
|
+
};
|
|
5111
|
+
var ICON_BY_EXTENSION = {
|
|
5112
|
+
DOC: "word",
|
|
5113
|
+
DOCX: "word",
|
|
5114
|
+
JPEG: "jpg",
|
|
5115
|
+
JPG: "jpg",
|
|
5116
|
+
MP4: "mp4",
|
|
5117
|
+
PDF: "pdf",
|
|
5118
|
+
PNG: "png",
|
|
5119
|
+
PPT: "powerpoint",
|
|
5120
|
+
PPTX: "powerpoint",
|
|
5121
|
+
TXT: "text",
|
|
5122
|
+
XLS: "excel",
|
|
5123
|
+
XLSX: "excel",
|
|
5124
|
+
ZIP: "zip"
|
|
5125
|
+
};
|
|
5126
|
+
var ICON_BY_TYPE = {
|
|
5127
|
+
"application/msword": "word",
|
|
5128
|
+
"application/pdf": "pdf",
|
|
5129
|
+
"application/vnd.ms-excel": "excel",
|
|
5130
|
+
"application/vnd.ms-powerpoint": "powerpoint",
|
|
5131
|
+
"application/vnd.openxmlformats-officedocument.presentationml.presentation": "powerpoint",
|
|
5132
|
+
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "excel",
|
|
5133
|
+
"application/vnd.openxmlformats-officedocument.wordprocessingml.document": "word",
|
|
5134
|
+
"application/zip": "zip",
|
|
5135
|
+
"image/jpeg": "jpg",
|
|
5136
|
+
"image/png": "png",
|
|
5137
|
+
"text/plain": "text",
|
|
5138
|
+
"video/mp4": "mp4"
|
|
5139
|
+
};
|
|
5140
|
+
var fileIconName = (item) => {
|
|
5141
|
+
const type = fileType(item);
|
|
5142
|
+
return ICON_BY_EXTENSION[nameExtension(fileName(item))] ?? (type ? ICON_BY_TYPE[type.toLowerCase()] : void 0);
|
|
5143
|
+
};
|
|
5144
|
+
var isWildcard = (token) => token === "*" || token === "*/*";
|
|
5145
|
+
var acceptTokens = (accept) => accept ? accept.split(",").map((token) => token.trim().toLowerCase()).filter((token) => token !== "") : [];
|
|
5146
|
+
var acceptsAnything = (tokens) => tokens.length === 0 || tokens.some(isWildcard);
|
|
5147
|
+
var tokenMatchesFile = (token, file) => {
|
|
5148
|
+
if (token.startsWith(".")) return file.name.toLowerCase().endsWith(token);
|
|
5149
|
+
const type = file.type.toLowerCase();
|
|
5150
|
+
if (token.endsWith("/*")) return type.startsWith(token.slice(0, -1));
|
|
5151
|
+
return type === token;
|
|
5152
|
+
};
|
|
5153
|
+
var matchesAccept = (file, accept) => {
|
|
5154
|
+
const tokens = acceptTokens(accept);
|
|
5155
|
+
if (acceptsAnything(tokens)) return true;
|
|
5156
|
+
return tokens.some((token) => tokenMatchesFile(token, file));
|
|
5157
|
+
};
|
|
5158
|
+
var acceptMatchesType = (type, accept) => {
|
|
5159
|
+
const tokens = acceptTokens(accept);
|
|
5160
|
+
if (acceptsAnything(tokens)) return true;
|
|
5161
|
+
const t = type.toLowerCase();
|
|
5162
|
+
let unjudgeable = false;
|
|
5163
|
+
for (const token of tokens) {
|
|
5164
|
+
if (token.startsWith(".")) {
|
|
5165
|
+
unjudgeable = true;
|
|
5166
|
+
continue;
|
|
5167
|
+
}
|
|
5168
|
+
if (token.endsWith("/*") ? t.startsWith(token.slice(0, -1)) : t === token) return true;
|
|
5169
|
+
}
|
|
5170
|
+
return unjudgeable;
|
|
5171
|
+
};
|
|
5172
|
+
var validateFiles = (incoming, options) => {
|
|
5173
|
+
const { accept, maxFileSize, maxFileCount, multiple, currentCount } = options;
|
|
5174
|
+
const accepted = [];
|
|
5175
|
+
const rejected = [];
|
|
5176
|
+
const limit = multiple ? maxFileCount : 1;
|
|
5177
|
+
let slots = limit === void 0 ? Number.POSITIVE_INFINITY : Math.max(0, limit - (multiple ? currentCount : 0));
|
|
5178
|
+
for (const file of incoming) {
|
|
5179
|
+
if (!matchesAccept(file, accept)) {
|
|
5180
|
+
rejected.push({ file, code: "file-invalid-type", accept });
|
|
5181
|
+
continue;
|
|
5182
|
+
}
|
|
5183
|
+
if (maxFileSize !== void 0 && file.size > maxFileSize) {
|
|
5184
|
+
rejected.push({ file, code: "file-too-large", maxFileSize });
|
|
5185
|
+
continue;
|
|
5186
|
+
}
|
|
5187
|
+
if (slots <= 0) {
|
|
5188
|
+
rejected.push({ file, code: "too-many-files", maxFileCount: limit });
|
|
5189
|
+
continue;
|
|
5190
|
+
}
|
|
5191
|
+
accepted.push(file);
|
|
5192
|
+
slots -= 1;
|
|
5193
|
+
}
|
|
5194
|
+
return { accepted, rejected };
|
|
5195
|
+
};
|
|
5196
|
+
var Upload = (props) => {
|
|
5197
|
+
const theme = useComponentTheme("Upload");
|
|
5198
|
+
const field = spar.useOptionalFieldContext();
|
|
5199
|
+
const inputRef = react.useRef(null);
|
|
5200
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadBase, props, theme);
|
|
5201
|
+
const {
|
|
5202
|
+
value,
|
|
5203
|
+
defaultValue,
|
|
5204
|
+
onValueChange,
|
|
5205
|
+
accept,
|
|
5206
|
+
multiple: ownMultiple = DEFAULT_MULTIPLE,
|
|
5207
|
+
directory = DEFAULT_DIRECTORY,
|
|
5208
|
+
maxFileSize,
|
|
5209
|
+
maxFileCount,
|
|
5210
|
+
onFileAccept,
|
|
5211
|
+
onFilesReject,
|
|
5212
|
+
// The status four resolve here, at the destructure site: `??`, so an empty
|
|
5213
|
+
// one is honoured and the support line goes away with its glyph.
|
|
5214
|
+
uploadingLabel = DEFAULT_UPLOADING_LABEL,
|
|
5215
|
+
processingLabel = DEFAULT_PROCESSING_LABEL,
|
|
5216
|
+
completedLabel = DEFAULT_COMPLETED_LABEL2,
|
|
5217
|
+
errorLabel = DEFAULT_ERROR_LABEL2,
|
|
5218
|
+
// The accessible-name three cannot resolve here — see below.
|
|
5219
|
+
progressLabel: ownProgressLabel,
|
|
5220
|
+
downloadLabel: ownDownloadLabel,
|
|
5221
|
+
removeLabel: ownRemoveLabel,
|
|
5222
|
+
disabled: ownDisabled,
|
|
5223
|
+
readOnly: ownReadOnly,
|
|
5224
|
+
invalid: ownInvalid,
|
|
5225
|
+
as,
|
|
5226
|
+
children,
|
|
5227
|
+
ref,
|
|
5228
|
+
...nativeProps
|
|
5229
|
+
} = rest;
|
|
5230
|
+
const multiple = ownMultiple || directory;
|
|
5231
|
+
const disabled = ownDisabled ?? field?.disabled ?? false;
|
|
5232
|
+
const readOnly = ownReadOnly ?? field?.readOnly ?? false;
|
|
5233
|
+
const invalid = ownInvalid ?? field?.invalid ?? false;
|
|
5234
|
+
const [files = [], setFiles, isControlled] = useControllableState(value, defaultValue ?? [], onValueChange);
|
|
5235
|
+
const latestFiles = react.useRef(files);
|
|
5236
|
+
latestFiles.current = files;
|
|
5237
|
+
const commitFiles = react.useCallback(
|
|
5238
|
+
(next) => {
|
|
5239
|
+
if (!isControlled) latestFiles.current = next;
|
|
5240
|
+
setFiles(next);
|
|
5241
|
+
},
|
|
5242
|
+
[isControlled, setFiles]
|
|
5243
|
+
);
|
|
5244
|
+
const processFiles = react.useCallback(
|
|
5245
|
+
(incoming) => {
|
|
5246
|
+
if (disabled || readOnly) return;
|
|
5247
|
+
const list = Array.from(incoming);
|
|
5248
|
+
if (list.length === 0) return;
|
|
5249
|
+
const current = latestFiles.current;
|
|
5250
|
+
const seen = new Set(current.filter((entry) => entry.file).map((entry) => fileKey(entry.file)));
|
|
5251
|
+
const fresh = list.filter((file) => {
|
|
5252
|
+
const key = fileKey(file);
|
|
5253
|
+
if (seen.has(key)) return false;
|
|
5254
|
+
seen.add(key);
|
|
5255
|
+
return true;
|
|
5256
|
+
});
|
|
5257
|
+
const { accepted, rejected } = validateFiles(fresh, { accept, maxFileSize, maxFileCount, multiple, currentCount: current.length });
|
|
5258
|
+
const added = accepted.map(createUploadFile);
|
|
5259
|
+
if (added.length > 0) {
|
|
5260
|
+
commitFiles(multiple ? [...current, ...added] : added);
|
|
5261
|
+
onFileAccept?.(added);
|
|
5262
|
+
}
|
|
5263
|
+
if (rejected.length > 0) {
|
|
5264
|
+
onFilesReject?.(rejected);
|
|
5265
|
+
}
|
|
5266
|
+
},
|
|
5267
|
+
[disabled, readOnly, accept, maxFileSize, maxFileCount, multiple, commitFiles, onFileAccept, onFilesReject]
|
|
5268
|
+
);
|
|
5269
|
+
const openFileDialog = react.useCallback(() => {
|
|
5270
|
+
if (disabled || readOnly) return;
|
|
5271
|
+
inputRef.current?.click();
|
|
5272
|
+
}, [disabled, readOnly]);
|
|
5273
|
+
const removeFile = react.useCallback(
|
|
5274
|
+
(id) => {
|
|
5275
|
+
if (disabled || readOnly) return;
|
|
5276
|
+
commitFiles(latestFiles.current.filter((entry) => entry.id !== id));
|
|
5277
|
+
if (inputRef.current) inputRef.current.value = "";
|
|
5278
|
+
},
|
|
5279
|
+
[disabled, readOnly, commitFiles]
|
|
5280
|
+
);
|
|
5281
|
+
const handleInputChange = (event) => {
|
|
5282
|
+
processFiles(event.target.files ?? []);
|
|
5283
|
+
event.target.value = "";
|
|
5284
|
+
};
|
|
5285
|
+
const progressLabel = ownProgressLabel || DEFAULT_PROGRESS_LABEL;
|
|
5286
|
+
const downloadLabel = ownDownloadLabel || DEFAULT_DOWNLOAD_LABEL;
|
|
5287
|
+
const removeLabel = ownRemoveLabel || DEFAULT_REMOVE_LABEL2;
|
|
5288
|
+
const contextValue = react.useMemo(
|
|
5289
|
+
() => ({
|
|
5290
|
+
files,
|
|
5291
|
+
disabled,
|
|
5292
|
+
readOnly,
|
|
5293
|
+
invalid,
|
|
5294
|
+
accept,
|
|
5295
|
+
multiple,
|
|
5296
|
+
openFileDialog,
|
|
5297
|
+
removeFile,
|
|
5298
|
+
processFiles,
|
|
5299
|
+
// Keyed by the status it stands for, so a row looks one up rather than
|
|
5300
|
+
// mapping names to states. Built inside this memo rather than one of its
|
|
5301
|
+
// own: it changes exactly when the four strings do, which is when the
|
|
5302
|
+
// context is rebuilt anyway.
|
|
5303
|
+
statusLabels: { uploading: uploadingLabel, processing: processingLabel, completed: completedLabel, error: errorLabel },
|
|
5304
|
+
progressLabel,
|
|
5305
|
+
downloadLabel,
|
|
5306
|
+
removeLabel
|
|
5307
|
+
}),
|
|
5308
|
+
[
|
|
5309
|
+
files,
|
|
5310
|
+
disabled,
|
|
5311
|
+
readOnly,
|
|
5312
|
+
invalid,
|
|
5313
|
+
accept,
|
|
5314
|
+
multiple,
|
|
5315
|
+
openFileDialog,
|
|
5316
|
+
removeFile,
|
|
5317
|
+
processFiles,
|
|
5318
|
+
uploadingLabel,
|
|
5319
|
+
processingLabel,
|
|
5320
|
+
completedLabel,
|
|
5321
|
+
errorLabel,
|
|
5322
|
+
progressLabel,
|
|
5323
|
+
downloadLabel,
|
|
5324
|
+
removeLabel
|
|
5325
|
+
]
|
|
5326
|
+
);
|
|
5327
|
+
const Component = as ?? "div";
|
|
5328
|
+
const htmlProps = nativeProps;
|
|
5329
|
+
const named = htmlProps["aria-label"] !== void 0 || htmlProps["aria-labelledby"] !== void 0;
|
|
5330
|
+
const groupAttrs = {
|
|
5331
|
+
"id": htmlProps.id ?? field?.fieldId,
|
|
5332
|
+
"role": htmlProps.role ?? "group",
|
|
5333
|
+
"aria-labelledby": named ? htmlProps["aria-labelledby"] : field?.labelId,
|
|
5334
|
+
// Mirrors Spar's own controls: the error message replaces the description
|
|
5335
|
+
// while invalid, rather than both being announced.
|
|
5336
|
+
"aria-describedby": htmlProps["aria-describedby"] ?? (invalid ? field?.errorId : field?.descriptionId)
|
|
5337
|
+
};
|
|
5338
|
+
const stateAttrs = {
|
|
5339
|
+
...disabled ? { "data-disabled": "" } : null,
|
|
5340
|
+
...readOnly ? { "data-readonly": "" } : null,
|
|
5341
|
+
...invalid ? { "data-invalid": "" } : null
|
|
5342
|
+
};
|
|
5343
|
+
return /* @__PURE__ */ jsxRuntime.jsx(UploadProvider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs(Component, { ...nativeProps, ...groupAttrs, ...rootAttrs, ...stateAttrs, ref, children: [
|
|
5344
|
+
children,
|
|
5345
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5346
|
+
spar.InputField,
|
|
5347
|
+
{
|
|
5348
|
+
ref: inputRef,
|
|
5349
|
+
type: "file",
|
|
5350
|
+
accept,
|
|
5351
|
+
multiple,
|
|
5352
|
+
...directory ? { webkitdirectory: "" } : null,
|
|
5353
|
+
disabled: disabled || readOnly,
|
|
5354
|
+
onChange: handleInputChange,
|
|
5355
|
+
hidden: true,
|
|
5356
|
+
tabIndex: -1,
|
|
5357
|
+
"aria-hidden": "true"
|
|
5358
|
+
}
|
|
5359
|
+
)
|
|
5360
|
+
] }) });
|
|
5361
|
+
};
|
|
5362
|
+
Upload.displayName = "Upload";
|
|
5363
|
+
var UploadActions = (props) => {
|
|
5364
|
+
const theme = useComponentTheme("UploadActions");
|
|
5365
|
+
useUploadContext("Upload.Actions");
|
|
5366
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadActionsBase, props, theme);
|
|
5367
|
+
const { as, children, ref, ...nativeProps } = rest;
|
|
5368
|
+
const Component = as ?? "div";
|
|
5369
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...nativeProps, ...rootAttrs, ref, children });
|
|
5370
|
+
};
|
|
5371
|
+
UploadActions.displayName = "Upload.Actions";
|
|
5372
|
+
var dragStateFor = (event, accept) => {
|
|
5373
|
+
const items = event.dataTransfer?.items;
|
|
5374
|
+
if (!items || items.length === 0) return "accept";
|
|
5375
|
+
for (const item of Array.from(items)) {
|
|
5376
|
+
if (item.kind === "file" && !acceptMatchesType(item.type, accept)) return "reject";
|
|
5377
|
+
}
|
|
5378
|
+
return "accept";
|
|
5379
|
+
};
|
|
5380
|
+
var UploadDropzone = (props) => {
|
|
5381
|
+
const theme = useComponentTheme("UploadDropzone");
|
|
5382
|
+
const { disabled, readOnly, accept, processFiles } = useUploadContext("Upload.Dropzone");
|
|
5383
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadDropzoneBase, props, theme);
|
|
5384
|
+
const {
|
|
5385
|
+
onDragEnter: slotOnDragEnter,
|
|
5386
|
+
onDragOver: slotOnDragOver,
|
|
5387
|
+
onDragLeave: slotOnDragLeave,
|
|
5388
|
+
onDrop: slotOnDrop,
|
|
5389
|
+
...dropzoneRootAttrs
|
|
5390
|
+
} = rootAttrs;
|
|
5391
|
+
const { as, children, ref, onDragEnter, onDragOver, onDragLeave, onDrop, ...nativeProps } = rest;
|
|
5392
|
+
const [dragState, setDragState] = react.useState(null);
|
|
5393
|
+
const depth = react.useRef(0);
|
|
5394
|
+
const active = !disabled && !readOnly;
|
|
5395
|
+
const handleDragEnter = (event) => {
|
|
5396
|
+
onDragEnter?.(event);
|
|
5397
|
+
slotOnDragEnter?.(event);
|
|
5398
|
+
event.preventDefault();
|
|
5399
|
+
if (!active) return;
|
|
5400
|
+
depth.current += 1;
|
|
5401
|
+
setDragState(dragStateFor(event, accept));
|
|
5402
|
+
};
|
|
5403
|
+
const handleDragOver = (event) => {
|
|
5404
|
+
onDragOver?.(event);
|
|
5405
|
+
slotOnDragOver?.(event);
|
|
5406
|
+
event.preventDefault();
|
|
5407
|
+
if (!active) return;
|
|
5408
|
+
if (dragState === null) setDragState(dragStateFor(event, accept));
|
|
5409
|
+
};
|
|
5410
|
+
const handleDragLeave = (event) => {
|
|
5411
|
+
onDragLeave?.(event);
|
|
5412
|
+
slotOnDragLeave?.(event);
|
|
5413
|
+
depth.current = Math.max(0, depth.current - 1);
|
|
5414
|
+
if (depth.current === 0) setDragState(null);
|
|
5415
|
+
};
|
|
5416
|
+
const handleDrop = (event) => {
|
|
5417
|
+
onDrop?.(event);
|
|
5418
|
+
slotOnDrop?.(event);
|
|
5419
|
+
event.preventDefault();
|
|
5420
|
+
depth.current = 0;
|
|
5421
|
+
setDragState(null);
|
|
5422
|
+
if (!active) return;
|
|
5423
|
+
if (event.dataTransfer?.files?.length) processFiles(event.dataTransfer.files);
|
|
5424
|
+
};
|
|
5425
|
+
const Component = as ?? "div";
|
|
5426
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5427
|
+
Component,
|
|
5428
|
+
{
|
|
5429
|
+
...nativeProps,
|
|
5430
|
+
...dropzoneRootAttrs,
|
|
5431
|
+
"data-drag-state": dragState ?? void 0,
|
|
5432
|
+
onDragEnter: handleDragEnter,
|
|
5433
|
+
onDragOver: handleDragOver,
|
|
5434
|
+
onDragLeave: handleDragLeave,
|
|
5435
|
+
onDrop: handleDrop,
|
|
5436
|
+
ref,
|
|
5437
|
+
children
|
|
5438
|
+
}
|
|
5439
|
+
);
|
|
5440
|
+
};
|
|
5441
|
+
UploadDropzone.displayName = "Upload.Dropzone";
|
|
5442
|
+
var ACTION_ICON = {
|
|
5443
|
+
download: /* @__PURE__ */ jsxRuntime.jsx(arrowDownload.ArrowDownloadIconOutlinedRounded, { "aria-hidden": "true", focusable: "false" }),
|
|
5444
|
+
remove: /* @__PURE__ */ jsxRuntime.jsx(close.CloseIconOutlinedRounded, { "aria-hidden": "true", focusable: "false" })
|
|
5445
|
+
};
|
|
5446
|
+
var isBuiltInAction = (action) => action === "download" || action === "remove";
|
|
5447
|
+
var siblingRow = (row) => {
|
|
5448
|
+
const next = row.nextElementSibling;
|
|
5449
|
+
if (next?.matches(".tk-upload-item")) return next;
|
|
5450
|
+
const previous = row.previousElementSibling;
|
|
5451
|
+
return previous?.matches(".tk-upload-item") ? previous : null;
|
|
5452
|
+
};
|
|
5453
|
+
var moveFocusOffRow = (button) => {
|
|
5454
|
+
const row = button.closest(".tk-upload-item");
|
|
5455
|
+
const neighbour = row ? siblingRow(row) : null;
|
|
5456
|
+
const target = neighbour?.querySelector('[data-action="remove"]') ?? neighbour?.querySelector('button, [role="button"], a[href]') ?? button.closest(".tk-upload")?.querySelector(".tk-upload-trigger") ?? null;
|
|
5457
|
+
target?.focus();
|
|
5458
|
+
};
|
|
5459
|
+
var DEFAULT_ACTION_APPEARANCE = "outlined";
|
|
5460
|
+
var DEFAULT_ACTION_VARIANT = "neutral";
|
|
5461
|
+
var DEFAULT_ACTION_SIZE = "small";
|
|
5462
|
+
var UploadItemAction = (props) => {
|
|
5463
|
+
const theme = useComponentTheme("UploadItemAction");
|
|
5464
|
+
const { disabled, readOnly, removeFile, downloadLabel, removeLabel } = useUploadContext("Upload.ItemAction");
|
|
5465
|
+
const { item } = useUploadItemContext("Upload.ItemAction");
|
|
5466
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadItemActionBase, props, theme, {
|
|
5467
|
+
// Which action this is: documented for consumers styling one action out of a
|
|
5468
|
+
// row. The look itself comes from Button's variant, not from this hook.
|
|
5469
|
+
stateAttrs: (merged) => ({ "data-action": merged.action })
|
|
5470
|
+
});
|
|
5471
|
+
const { onClick: slotOnClick, ...actionRootAttrs } = rootAttrs;
|
|
5472
|
+
const {
|
|
5473
|
+
as,
|
|
5474
|
+
action,
|
|
5475
|
+
label,
|
|
5476
|
+
children,
|
|
5477
|
+
ref,
|
|
5478
|
+
href,
|
|
5479
|
+
role,
|
|
5480
|
+
onClick,
|
|
5481
|
+
"disabled": ownDisabled,
|
|
5482
|
+
"aria-label": ariaLabel,
|
|
5483
|
+
// An icon button in the row: the anatomy and the look come from Button, so
|
|
5484
|
+
// the appearance knobs live here rather than in the Upload recipe. Applied
|
|
5485
|
+
// at the destructure site (the coding-standards rule) rather than pinned
|
|
5486
|
+
// after the spread, so they layer as defaults — a theme's
|
|
5487
|
+
// `UploadItemAction.defaultProps` is already merged into `rest` by
|
|
5488
|
+
// `composeRootAttrs`, and a value pinned after the spread would silently
|
|
5489
|
+
// outrank it.
|
|
5490
|
+
"appearance": appearance = DEFAULT_ACTION_APPEARANCE,
|
|
5491
|
+
"variant": variant = DEFAULT_ACTION_VARIANT,
|
|
5492
|
+
"size": size = DEFAULT_ACTION_SIZE,
|
|
5493
|
+
...buttonProps
|
|
5494
|
+
} = rest;
|
|
5495
|
+
const isDisabled = disabled || ownDisabled === true;
|
|
5496
|
+
if (action === "remove" && readOnly) return null;
|
|
5497
|
+
const isButton = (as ?? "button") === "button";
|
|
5498
|
+
const hasHref = !isButton && href !== void 0;
|
|
5499
|
+
if (action === "download" && !canSaveUploadFile(item) && !hasHref && !onClick && !slotOnClick) return null;
|
|
5500
|
+
const nameTemplate = label || (action === "download" ? downloadLabel : action === "remove" ? removeLabel : void 0);
|
|
5501
|
+
const handleClick = (event) => {
|
|
5502
|
+
const button = event.currentTarget;
|
|
5503
|
+
const preventedOnEntry = event.defaultPrevented;
|
|
5504
|
+
onClick?.(event);
|
|
5505
|
+
slotOnClick?.(event);
|
|
5506
|
+
if (isConsumerVeto(event, preventedOnEntry)) return;
|
|
5507
|
+
if (action === "remove") {
|
|
5508
|
+
moveFocusOffRow(button);
|
|
5509
|
+
removeFile(item.id);
|
|
5510
|
+
} else if (action === "download" && !hasHref) saveUploadFile(item);
|
|
5511
|
+
};
|
|
5512
|
+
const renderedHref = isDisabled ? void 0 : href;
|
|
5513
|
+
const resolvedRole = role ?? (!isButton && as === "a" && renderedHref !== void 0 ? "link" : void 0);
|
|
5514
|
+
const roleProps = resolvedRole !== void 0 ? { role: resolvedRole } : void 0;
|
|
5515
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5516
|
+
Button,
|
|
5517
|
+
{
|
|
5518
|
+
...buttonProps,
|
|
5519
|
+
...isButton ? null : { href: renderedHref },
|
|
5520
|
+
...roleProps,
|
|
5521
|
+
...actionRootAttrs,
|
|
5522
|
+
as,
|
|
5523
|
+
appearance,
|
|
5524
|
+
variant,
|
|
5525
|
+
size,
|
|
5526
|
+
disabled: isDisabled,
|
|
5527
|
+
"aria-label": ariaLabel ?? (nameTemplate ? formatFileLabel(nameTemplate, fileName(item)) : void 0),
|
|
5528
|
+
onClick: handleClick,
|
|
5529
|
+
startContent: isRenderableNode(children) ? children : isBuiltInAction(action) ? ACTION_ICON[action] : null,
|
|
5530
|
+
ref
|
|
5531
|
+
}
|
|
5532
|
+
);
|
|
5533
|
+
};
|
|
5534
|
+
UploadItemAction.displayName = "Upload.ItemAction";
|
|
5535
|
+
var UploadItemActions = (props) => {
|
|
5536
|
+
const theme = useComponentTheme("UploadItemActions");
|
|
5537
|
+
const { readOnly } = useUploadContext("Upload.ItemActions");
|
|
5538
|
+
const { item } = useUploadItemContext("Upload.ItemActions");
|
|
5539
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadItemActionsBase, props, theme);
|
|
5540
|
+
const { as, children, ref, ...nativeProps } = rest;
|
|
5541
|
+
const Component = as ?? "div";
|
|
5542
|
+
const hasChildren = isRenderableNode(children);
|
|
5543
|
+
const showDownload = canSaveUploadFile(item);
|
|
5544
|
+
const showRemove = !readOnly;
|
|
5545
|
+
if (!hasChildren && !showDownload && !showRemove) return null;
|
|
5546
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...nativeProps, ...rootAttrs, ref, children: hasChildren ? children : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
5547
|
+
showDownload && /* @__PURE__ */ jsxRuntime.jsx(UploadItemAction, { action: "download" }),
|
|
5548
|
+
showRemove && /* @__PURE__ */ jsxRuntime.jsx(UploadItemAction, { action: "remove" })
|
|
5549
|
+
] }) });
|
|
5550
|
+
};
|
|
5551
|
+
UploadItemActions.displayName = "Upload.ItemActions";
|
|
5552
|
+
var statusLabelOf = (status, statusLabels) => status === "idle" ? null : statusLabels[status];
|
|
5553
|
+
var statusIcon = (status) => {
|
|
5554
|
+
switch (status) {
|
|
5555
|
+
case "uploading":
|
|
5556
|
+
case "processing":
|
|
5557
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: "small", appearance: "rounded", variant: "info", "aria-hidden": "true" });
|
|
5558
|
+
case "completed":
|
|
5559
|
+
return /* @__PURE__ */ jsxRuntime.jsx(checkCircle.CheckCircleIconFilledRounded, { "aria-hidden": "true", focusable: "false" });
|
|
5560
|
+
case "error":
|
|
5561
|
+
return /* @__PURE__ */ jsxRuntime.jsx(closeCircle.CloseCircleIconFilledRounded, { "aria-hidden": "true", focusable: "false" });
|
|
5562
|
+
default:
|
|
5563
|
+
return null;
|
|
5564
|
+
}
|
|
5565
|
+
};
|
|
5566
|
+
var UploadItemContent = (props) => {
|
|
5567
|
+
const theme = useComponentTheme("UploadItemContent");
|
|
5568
|
+
const { item } = useUploadItemContext("Upload.ItemContent");
|
|
5569
|
+
const { statusLabels, progressLabel } = useUploadContext("Upload.ItemContent");
|
|
5570
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadItemContentBase, props, theme);
|
|
5571
|
+
const { as, children, ref, ...nativeProps } = rest;
|
|
5572
|
+
const slotAttrs = (slot) => buildSlotAttrs(UploadItemContentBase.getSlotProps(slot), slot, {
|
|
5573
|
+
themeSlotProps: theme?.slotProps,
|
|
5574
|
+
themeClassNames: theme?.classNames,
|
|
5575
|
+
instanceSlotProps: props.slotProps,
|
|
5576
|
+
instanceClassNames: props.classNames
|
|
5577
|
+
});
|
|
5578
|
+
const Component = as ?? "div";
|
|
5579
|
+
const name = fileName(item);
|
|
5580
|
+
const size = fileSize(item);
|
|
5581
|
+
const status = fileStatus(item);
|
|
5582
|
+
const icon = statusIcon(status);
|
|
5583
|
+
const statusLabel = statusLabelOf(status, statusLabels);
|
|
5584
|
+
const statusText = status === "error" ? item.error ?? statusLabel : statusLabel;
|
|
5585
|
+
const defaultContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
5586
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { ...slotAttrs("name"), children: name }),
|
|
5587
|
+
size !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { ...slotAttrs("size"), children: formatFileSize(size) }),
|
|
5588
|
+
icon && statusText ? (
|
|
5589
|
+
// Icon plus its label, as one line: the glyph is decorative and the
|
|
5590
|
+
// text carries the meaning, so nothing here needs an aria-label of its
|
|
5591
|
+
// own. `title` keeps a long failure message reachable in full while the
|
|
5592
|
+
// line itself stays one row high.
|
|
5593
|
+
//
|
|
5594
|
+
// No text, no line — a status label emptied at the root takes the glyph
|
|
5595
|
+
// with it. The alternative is a lone `aria-hidden` icon: a mark that
|
|
5596
|
+
// says something to sighted users and nothing to anyone else, which is
|
|
5597
|
+
// the split this line exists to avoid.
|
|
5598
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { ...slotAttrs("status"), title: status === "error" ? item.error : void 0, children: [
|
|
5599
|
+
icon,
|
|
5600
|
+
statusText
|
|
5601
|
+
] })
|
|
5602
|
+
) : null,
|
|
5603
|
+
status === "uploading" && typeof item.progress === "number" && // The bar is the *determinate* face of uploading — it only appears once
|
|
5604
|
+
// there is a percentage to show. Without one, the spinner and its
|
|
5605
|
+
// "Uploading…" label above are already the indeterminate indicator, so
|
|
5606
|
+
// a second (looping) bar would say the same thing twice. `processing`
|
|
5607
|
+
// never gets one: a server-side step reports that it is running, not
|
|
5608
|
+
// how far along it is.
|
|
5609
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { ...slotAttrs("progress"), children: /* @__PURE__ */ jsxRuntime.jsx(Progress2, { value: item.progress, size: "small", "aria-label": formatFileLabel(progressLabel, name) }) })
|
|
5610
|
+
] });
|
|
5611
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...nativeProps, ...rootAttrs, ref, children: isRenderableNode(children) ? children : defaultContent });
|
|
5612
|
+
};
|
|
5613
|
+
UploadItemContent.displayName = "Upload.ItemContent";
|
|
5614
|
+
var FileExcelIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5615
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5616
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5617
|
+
"path",
|
|
5618
|
+
{
|
|
5619
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5620
|
+
stroke: "#CACFD8",
|
|
5621
|
+
strokeWidth: "1.875"
|
|
5622
|
+
}
|
|
5623
|
+
),
|
|
5624
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#136C34" }),
|
|
5625
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5626
|
+
"path",
|
|
5627
|
+
{
|
|
5628
|
+
d: "M6.76722 29L9.49122 24.692L6.91122 20.6H8.51922L10.4572 23.702L12.5272 20.6H14.0872L11.3752 24.728L14.1652 29H12.5512L10.4032 25.694L8.33322 29H6.76722ZM15.5803 29V20.6H16.9243V27.764H20.5843V29H15.5803ZM24.8436 29.18C24.2636 29.18 23.6956 29.098 23.1396 28.934C22.5876 28.766 22.1216 28.526 21.7416 28.214L22.4016 27.188C22.6016 27.36 22.8336 27.508 23.0976 27.632C23.3656 27.756 23.6496 27.852 23.9496 27.92C24.2496 27.984 24.5496 28.016 24.8496 28.016C25.3976 28.016 25.8396 27.912 26.1756 27.704C26.5156 27.496 26.6856 27.192 26.6856 26.792C26.6856 26.492 26.5696 26.238 26.3376 26.03C26.1096 25.822 25.6856 25.63 25.0656 25.454L24.2016 25.202C23.4096 24.974 22.8316 24.672 22.4676 24.296C22.1076 23.92 21.9276 23.452 21.9276 22.892C21.9276 22.52 22.0016 22.184 22.1496 21.884C22.3016 21.584 22.5136 21.324 22.7856 21.104C23.0616 20.884 23.3856 20.716 23.7576 20.6C24.1296 20.484 24.5376 20.426 24.9816 20.426C25.5456 20.426 26.0696 20.508 26.5536 20.672C27.0376 20.836 27.4376 21.056 27.7536 21.332L27.0696 22.328C26.8976 22.172 26.6956 22.038 26.4636 21.926C26.2356 21.814 25.9896 21.728 25.7256 21.668C25.4616 21.608 25.1936 21.578 24.9216 21.578C24.5856 21.578 24.2876 21.628 24.0276 21.728C23.7716 21.824 23.5716 21.964 23.4276 22.148C23.2836 22.332 23.2116 22.556 23.2116 22.82C23.2116 23.012 23.2596 23.18 23.3556 23.324C23.4516 23.468 23.6156 23.6 23.8476 23.72C24.0836 23.836 24.4076 23.954 24.8196 24.074L25.7316 24.344C26.5076 24.572 27.0756 24.87 27.4356 25.238C27.7956 25.602 27.9756 26.076 27.9756 26.66C27.9756 27.16 27.8516 27.6 27.6036 27.98C27.3596 28.356 27.0036 28.65 26.5356 28.862C26.0676 29.074 25.5036 29.18 24.8436 29.18Z",
|
|
5629
|
+
fill: "white"
|
|
5630
|
+
}
|
|
5631
|
+
)
|
|
5632
|
+
] });
|
|
5633
|
+
var FileJpgIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5634
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5635
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5636
|
+
"path",
|
|
5637
|
+
{
|
|
5638
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5639
|
+
stroke: "#CACFD8",
|
|
5640
|
+
strokeWidth: "1.875"
|
|
5641
|
+
}
|
|
5642
|
+
),
|
|
5643
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#EAB308" }),
|
|
5644
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5645
|
+
"path",
|
|
5646
|
+
{
|
|
5647
|
+
d: "M8.38769 29.18C8.01169 29.18 7.65369 29.13 7.31369 29.03C6.97769 28.934 6.66169 28.798 6.36569 28.622L6.80369 27.518C7.03969 27.654 7.27369 27.76 7.50569 27.836C7.74169 27.908 7.97969 27.944 8.21969 27.944C8.72369 27.944 9.10969 27.824 9.37769 27.584C9.64569 27.344 9.77969 26.954 9.77969 26.414V20.6H11.1237V26.636C11.1237 27.148 11.0177 27.596 10.8057 27.98C10.5937 28.36 10.2837 28.656 9.87569 28.868C9.46769 29.076 8.97169 29.18 8.38769 29.18ZM13.2951 29V20.6H16.3371C16.9331 20.6 17.4591 20.704 17.9151 20.912C18.3751 21.116 18.7351 21.412 18.9951 21.8C19.2551 22.184 19.3851 22.646 19.3851 23.186C19.3851 23.742 19.2651 24.212 19.0251 24.596C18.7851 24.976 18.4351 25.266 17.9751 25.466C17.5191 25.662 16.9631 25.76 16.3071 25.76H14.6391V29H13.2951ZM14.6391 24.608H16.3251C16.8691 24.608 17.2911 24.494 17.5911 24.266C17.8911 24.034 18.0411 23.684 18.0411 23.216C18.0411 22.752 17.8871 22.396 17.5791 22.148C17.2711 21.9 16.8571 21.776 16.3371 21.776H14.6391V24.608ZM25.0706 29.18C24.4026 29.18 23.7846 29.078 23.2166 28.874C22.6486 28.67 22.1506 28.378 21.7226 27.998C21.2986 27.614 20.9686 27.154 20.7326 26.618C20.4966 26.082 20.3786 25.48 20.3786 24.812C20.3786 24.148 20.4926 23.548 20.7206 23.012C20.9486 22.472 21.2666 22.01 21.6746 21.626C22.0866 21.238 22.5686 20.94 23.1206 20.732C23.6766 20.524 24.2826 20.42 24.9386 20.42C25.2426 20.42 25.5506 20.444 25.8626 20.492C26.1746 20.54 26.4806 20.62 26.7806 20.732C27.0846 20.84 27.3726 20.988 27.6446 21.176L27.0566 22.232C26.7526 22.04 26.4226 21.896 26.0666 21.8C25.7146 21.704 25.3506 21.656 24.9746 21.656C24.4866 21.656 24.0446 21.73 23.6486 21.878C23.2526 22.022 22.9146 22.232 22.6346 22.508C22.3546 22.78 22.1386 23.11 21.9866 23.498C21.8386 23.886 21.7646 24.322 21.7646 24.806C21.7646 25.486 21.9086 26.064 22.1966 26.54C22.4846 27.016 22.8806 27.378 23.3846 27.626C23.8926 27.87 24.4766 27.992 25.1366 27.992C25.4606 27.992 25.7526 27.962 26.0126 27.902C26.2726 27.838 26.4826 27.766 26.6426 27.686V25.658H24.7346V24.542H27.8486V28.466C27.6286 28.614 27.3526 28.742 27.0206 28.85C26.6926 28.958 26.3526 29.04 26.0006 29.096C25.6526 29.152 25.3426 29.18 25.0706 29.18Z",
|
|
5648
|
+
fill: "white"
|
|
5649
|
+
}
|
|
5650
|
+
)
|
|
5651
|
+
] });
|
|
5652
|
+
var FileMp4Icon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5653
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5654
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5655
|
+
"path",
|
|
5656
|
+
{
|
|
5657
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5658
|
+
stroke: "#CACFD8",
|
|
5659
|
+
strokeWidth: "1.875"
|
|
5660
|
+
}
|
|
5661
|
+
),
|
|
5662
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#3B82F6" }),
|
|
5663
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5664
|
+
"path",
|
|
5665
|
+
{
|
|
5666
|
+
d: "M5.70138 29V20.6H7.00338L10.4294 26.174L9.90738 26.18L13.2074 20.6H14.4854V29H13.1714L13.1894 22.388L13.4474 22.478L10.5914 27.188H9.60738L6.69738 22.478L6.91338 22.388L6.93138 29H5.70138ZM16.6701 29V20.6H19.7121C20.3081 20.6 20.8341 20.704 21.2901 20.912C21.7501 21.116 22.1101 21.412 22.3701 21.8C22.6301 22.184 22.7601 22.646 22.7601 23.186C22.7601 23.742 22.6401 24.212 22.4001 24.596C22.1601 24.976 21.8101 25.266 21.3501 25.466C20.8941 25.662 20.3381 25.76 19.6821 25.76H18.0141V29H16.6701ZM18.0141 24.608H19.7001C20.2441 24.608 20.6661 24.494 20.9661 24.266C21.2661 24.034 21.4161 23.684 21.4161 23.216C21.4161 22.752 21.2621 22.396 20.9541 22.148C20.6461 21.9 20.2321 21.776 19.7121 21.776H18.0141V24.608ZM27.5756 29V27.278H23.3936V26.264L26.4056 20.6H27.7736L24.8036 26.156H27.5756V24.29H28.7336V26.156H30.0296V27.278H28.7336V29H27.5756Z",
|
|
5667
|
+
fill: "white"
|
|
5668
|
+
}
|
|
5669
|
+
)
|
|
5670
|
+
] });
|
|
5671
|
+
var FilePdfIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5672
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5673
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5674
|
+
"path",
|
|
5675
|
+
{
|
|
5676
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5677
|
+
stroke: "#CACFD8",
|
|
5678
|
+
strokeWidth: "1.875"
|
|
5679
|
+
}
|
|
5680
|
+
),
|
|
5681
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#C90019" }),
|
|
5682
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5683
|
+
"path",
|
|
5684
|
+
{
|
|
5685
|
+
d: "M7.03145 29V20.6H10.0735C10.6695 20.6 11.1955 20.704 11.6515 20.912C12.1115 21.116 12.4715 21.412 12.7315 21.8C12.9915 22.184 13.1215 22.646 13.1215 23.186C13.1215 23.742 13.0015 24.212 12.7615 24.596C12.5215 24.976 12.1715 25.266 11.7115 25.466C11.2555 25.662 10.6995 25.76 10.0435 25.76H8.37545V29H7.03145ZM8.37545 24.608H10.0615C10.6055 24.608 11.0275 24.494 11.3275 24.266C11.6275 24.034 11.7775 23.684 11.7775 23.216C11.7775 22.752 11.6235 22.396 11.3155 22.148C11.0075 21.9 10.5935 21.776 10.0735 21.776H8.37545V24.608ZM14.6369 29V20.6H17.2649C18.1009 20.6 18.8389 20.78 19.4789 21.14C20.1189 21.496 20.6189 21.99 20.9789 22.622C21.3429 23.254 21.5249 23.982 21.5249 24.806C21.5249 25.418 21.4209 25.982 21.2129 26.498C21.0089 27.01 20.7169 27.452 20.3369 27.824C19.9569 28.196 19.5069 28.486 18.9869 28.694C18.4669 28.898 17.8929 29 17.2649 29H14.6369ZM15.9809 27.746H17.1029C17.5549 27.746 17.9649 27.68 18.3329 27.548C18.7049 27.412 19.0229 27.216 19.2869 26.96C19.5549 26.704 19.7609 26.396 19.9049 26.036C20.0489 25.672 20.1209 25.262 20.1209 24.806C20.1209 24.194 19.9949 23.668 19.7429 23.228C19.4949 22.784 19.1449 22.444 18.6929 22.208C18.2409 21.968 17.7109 21.848 17.1029 21.848H15.9809V27.746ZM23.1916 29V20.6H28.3816V21.83H24.5356V24.248H28.0216V25.448H24.5356V29H23.1916Z",
|
|
5686
|
+
fill: "white"
|
|
5687
|
+
}
|
|
5688
|
+
)
|
|
5689
|
+
] });
|
|
5690
|
+
var FilePngIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5691
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5692
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5693
|
+
"path",
|
|
5694
|
+
{
|
|
5695
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5696
|
+
stroke: "#CACFD8",
|
|
5697
|
+
strokeWidth: "1.875"
|
|
5698
|
+
}
|
|
5699
|
+
),
|
|
5700
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#A47D06" }),
|
|
5701
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5702
|
+
"path",
|
|
5703
|
+
{
|
|
5704
|
+
d: "M5.77169 29V20.6H8.81369C9.40969 20.6 9.93569 20.704 10.3917 20.912C10.8517 21.116 11.2117 21.412 11.4717 21.8C11.7317 22.184 11.8617 22.646 11.8617 23.186C11.8617 23.742 11.7417 24.212 11.5017 24.596C11.2617 24.976 10.9117 25.266 10.4517 25.466C9.99569 25.662 9.43969 25.76 8.78369 25.76H7.11569V29H5.77169ZM7.11569 24.608H8.80169C9.34569 24.608 9.76769 24.494 10.0677 24.266C10.3677 24.034 10.5177 23.684 10.5177 23.216C10.5177 22.752 10.3637 22.396 10.0557 22.148C9.74769 21.9 9.33369 21.776 8.81369 21.776H7.11569V24.608ZM13.3772 29V20.6H14.6612L18.9032 26.702V20.6H20.2112V29H18.9272L14.6912 22.826V29H13.3772ZM26.5706 29.18C25.9026 29.18 25.2846 29.078 24.7166 28.874C24.1486 28.67 23.6506 28.378 23.2226 27.998C22.7986 27.614 22.4686 27.154 22.2326 26.618C21.9966 26.082 21.8786 25.48 21.8786 24.812C21.8786 24.148 21.9926 23.548 22.2206 23.012C22.4486 22.472 22.7666 22.01 23.1746 21.626C23.5866 21.238 24.0686 20.94 24.6206 20.732C25.1766 20.524 25.7826 20.42 26.4386 20.42C26.7426 20.42 27.0506 20.444 27.3626 20.492C27.6746 20.54 27.9806 20.62 28.2806 20.732C28.5846 20.84 28.8726 20.988 29.1446 21.176L28.5566 22.232C28.2526 22.04 27.9226 21.896 27.5666 21.8C27.2146 21.704 26.8506 21.656 26.4746 21.656C25.9866 21.656 25.5446 21.73 25.1486 21.878C24.7526 22.022 24.4146 22.232 24.1346 22.508C23.8546 22.78 23.6386 23.11 23.4866 23.498C23.3386 23.886 23.2646 24.322 23.2646 24.806C23.2646 25.486 23.4086 26.064 23.6966 26.54C23.9846 27.016 24.3806 27.378 24.8846 27.626C25.3926 27.87 25.9766 27.992 26.6366 27.992C26.9606 27.992 27.2526 27.962 27.5126 27.902C27.7726 27.838 27.9826 27.766 28.1426 27.686V25.658H26.2346V24.542H29.3486V28.466C29.1286 28.614 28.8526 28.742 28.5206 28.85C28.1926 28.958 27.8526 29.04 27.5006 29.096C27.1526 29.152 26.8426 29.18 26.5706 29.18Z",
|
|
5705
|
+
fill: "white"
|
|
5706
|
+
}
|
|
5707
|
+
)
|
|
5708
|
+
] });
|
|
5709
|
+
var FilePowerpointIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5710
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5711
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5712
|
+
"path",
|
|
5713
|
+
{
|
|
5714
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5715
|
+
stroke: "#CACFD8",
|
|
5716
|
+
strokeWidth: "1.875"
|
|
5717
|
+
}
|
|
5718
|
+
),
|
|
5719
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#FF6259" }),
|
|
5720
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5721
|
+
"path",
|
|
5722
|
+
{
|
|
5723
|
+
d: "M3.60958 29V20.6H6.65158C7.24758 20.6 7.77358 20.704 8.22958 20.912C8.68958 21.116 9.04958 21.412 9.30958 21.8C9.56958 22.184 9.69958 22.646 9.69958 23.186C9.69958 23.742 9.57958 24.212 9.33958 24.596C9.09958 24.976 8.74958 25.266 8.28958 25.466C7.83358 25.662 7.27758 25.76 6.62158 25.76H4.95358V29H3.60958ZM4.95358 24.608H6.63958C7.18358 24.608 7.60558 24.494 7.90558 24.266C8.20558 24.034 8.35558 23.684 8.35558 23.216C8.35558 22.752 8.20158 22.396 7.89358 22.148C7.58558 21.9 7.17158 21.776 6.65158 21.776H4.95358V24.608ZM11.215 29V20.6H14.257C14.853 20.6 15.379 20.704 15.835 20.912C16.295 21.116 16.655 21.412 16.915 21.8C17.175 22.184 17.305 22.646 17.305 23.186C17.305 23.742 17.185 24.212 16.945 24.596C16.705 24.976 16.355 25.266 15.895 25.466C15.439 25.662 14.883 25.76 14.227 25.76H12.559V29H11.215ZM12.559 24.608H14.245C14.789 24.608 15.211 24.494 15.511 24.266C15.811 24.034 15.961 23.684 15.961 23.216C15.961 22.752 15.807 22.396 15.499 22.148C15.191 21.9 14.777 21.776 14.257 21.776H12.559V24.608ZM20.4165 29V21.83H18.0525V20.6H24.1245V21.83H21.7605V29H20.4165ZM24.7614 29L27.4854 24.692L24.9054 20.6H26.5134L28.4514 23.702L30.5214 20.6H32.0814L29.3694 24.728L32.1594 29H30.5454L28.3974 25.694L26.3274 29H24.7614Z",
|
|
5724
|
+
fill: "white"
|
|
5725
|
+
}
|
|
5726
|
+
)
|
|
5727
|
+
] });
|
|
5728
|
+
var FileTextIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5729
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5730
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5731
|
+
"path",
|
|
5732
|
+
{
|
|
5733
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5734
|
+
stroke: "#CACFD8",
|
|
5735
|
+
strokeWidth: "1.875"
|
|
5736
|
+
}
|
|
5737
|
+
),
|
|
5738
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#3B82F6" }),
|
|
5739
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5740
|
+
"path",
|
|
5741
|
+
{
|
|
5742
|
+
d: "M9.45363 29V21.83H7.08963V20.6H13.1616V21.83H10.7976V29H9.45363ZM13.7985 29L16.5225 24.692L13.9425 20.6H15.5505L17.4885 23.702L19.5585 20.6H21.1185L18.4065 24.728L21.1965 29H19.5825L17.4345 25.694L15.3645 29H13.7985ZM24.2075 29V21.83H21.8435V20.6H27.9155V21.83H25.5515V29H24.2075Z",
|
|
5743
|
+
fill: "white"
|
|
5744
|
+
}
|
|
5745
|
+
)
|
|
5746
|
+
] });
|
|
5747
|
+
var FileWordIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5748
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5749
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5750
|
+
"path",
|
|
5751
|
+
{
|
|
5752
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5753
|
+
stroke: "#CACFD8",
|
|
5754
|
+
strokeWidth: "1.875"
|
|
5755
|
+
}
|
|
5756
|
+
),
|
|
5757
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#295BAC" }),
|
|
5758
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5759
|
+
"path",
|
|
5760
|
+
{
|
|
5761
|
+
d: "M5.02755 29V20.6H7.65555C8.49155 20.6 9.22955 20.78 9.86955 21.14C10.5095 21.496 11.0095 21.99 11.3695 22.622C11.7335 23.254 11.9155 23.982 11.9155 24.806C11.9155 25.418 11.8115 25.982 11.6035 26.498C11.3995 27.01 11.1075 27.452 10.7275 27.824C10.3475 28.196 9.89755 28.486 9.37755 28.694C8.85755 28.898 8.28355 29 7.65555 29H5.02755ZM6.37155 27.746H7.49355C7.94555 27.746 8.35555 27.68 8.72355 27.548C9.09555 27.412 9.41355 27.216 9.67755 26.96C9.94555 26.704 10.1515 26.396 10.2955 26.036C10.4395 25.672 10.5115 25.262 10.5115 24.806C10.5115 24.194 10.3855 23.668 10.1335 23.228C9.88555 22.784 9.53555 22.444 9.08355 22.208C8.63155 21.968 8.10155 21.848 7.49355 21.848H6.37155V27.746ZM17.5994 29.18C16.9674 29.18 16.3814 29.07 15.8414 28.85C15.3054 28.626 14.8374 28.316 14.4374 27.92C14.0414 27.524 13.7314 27.06 13.5074 26.528C13.2874 25.996 13.1774 25.42 13.1774 24.8C13.1774 24.176 13.2874 23.598 13.5074 23.066C13.7314 22.534 14.0414 22.07 14.4374 21.674C14.8374 21.278 15.3054 20.97 15.8414 20.75C16.3814 20.53 16.9674 20.42 17.5994 20.42C18.2274 20.42 18.8094 20.532 19.3454 20.756C19.8814 20.98 20.3494 21.292 20.7494 21.692C21.1494 22.092 21.4594 22.558 21.6794 23.09C21.9034 23.618 22.0154 24.188 22.0154 24.8C22.0154 25.42 21.9034 25.996 21.6794 26.528C21.4594 27.06 21.1494 27.524 20.7494 27.92C20.3494 28.316 19.8814 28.626 19.3454 28.85C18.8094 29.07 18.2274 29.18 17.5994 29.18ZM17.5994 27.908C18.0234 27.908 18.4174 27.836 18.7814 27.692C19.1494 27.544 19.4694 27.334 19.7414 27.062C20.0134 26.786 20.2254 26.458 20.3774 26.078C20.5334 25.694 20.6114 25.268 20.6114 24.8C20.6114 24.172 20.4774 23.626 20.2094 23.162C19.9454 22.694 19.5854 22.332 19.1294 22.076C18.6734 21.82 18.1634 21.692 17.5994 21.692C17.1754 21.692 16.7794 21.766 16.4114 21.914C16.0474 22.058 15.7274 22.266 15.4514 22.538C15.1794 22.81 14.9654 23.138 14.8094 23.522C14.6574 23.902 14.5814 24.328 14.5814 24.8C14.5814 25.428 14.7154 25.976 14.9834 26.444C15.2514 26.908 15.6114 27.268 16.0634 27.524C16.5194 27.78 17.0314 27.908 17.5994 27.908ZM27.6173 29.18C26.7453 29.18 25.9833 29 25.3313 28.64C24.6793 28.28 24.1713 27.772 23.8073 27.116C23.4473 26.456 23.2673 25.686 23.2673 24.806C23.2673 24.166 23.3733 23.58 23.5853 23.048C23.8013 22.512 24.1033 22.048 24.4913 21.656C24.8833 21.264 25.3453 20.96 25.8773 20.744C26.4093 20.528 26.9933 20.42 27.6293 20.42C28.2693 20.42 28.8213 20.5 29.2853 20.66C29.7533 20.82 30.1613 21.048 30.5093 21.344L29.8133 22.442C29.5493 22.198 29.2413 22.016 28.8893 21.896C28.5373 21.776 28.1493 21.716 27.7253 21.716C27.2573 21.716 26.8353 21.788 26.4593 21.932C26.0833 22.076 25.7613 22.282 25.4933 22.55C25.2293 22.814 25.0253 23.136 24.8813 23.516C24.7413 23.892 24.6713 24.318 24.6713 24.794C24.6713 25.442 24.7973 25.996 25.0493 26.456C25.3053 26.916 25.6653 27.268 26.1293 27.512C26.5973 27.752 27.1493 27.872 27.7853 27.872C28.2093 27.872 28.6173 27.81 29.0093 27.686C29.4053 27.558 29.7753 27.352 30.1193 27.068L30.7433 28.202C30.3393 28.518 29.8773 28.76 29.3573 28.928C28.8413 29.096 28.2613 29.18 27.6173 29.18Z",
|
|
5762
|
+
fill: "white"
|
|
5763
|
+
}
|
|
5764
|
+
)
|
|
5765
|
+
] });
|
|
5766
|
+
var FileZipIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: [
|
|
5767
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.75 1.25V9.58333C28.75 10.5042 29.4958 11.25 30.4167 11.25H38.75", stroke: "#CACFD8", strokeWidth: "1.875" }),
|
|
5768
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5769
|
+
"path",
|
|
5770
|
+
{
|
|
5771
|
+
d: "M15 0.9375H26.8936C28.634 0.937541 30.3035 1.6287 31.5342 2.85938L37.1406 8.46582C38.3713 9.69649 39.0625 11.366 39.0625 13.1064V32.5C39.0625 36.1244 36.1244 39.0625 32.5 39.0625H15C11.3756 39.0625 8.4375 36.1244 8.4375 32.5V7.5C8.4375 3.87563 11.3756 0.9375 15 0.9375Z",
|
|
5772
|
+
stroke: "#CACFD8",
|
|
5773
|
+
strokeWidth: "1.875"
|
|
5774
|
+
}
|
|
5775
|
+
),
|
|
5776
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { y: "15", width: "35", height: "20", rx: "5", fill: "#79889A" }),
|
|
5777
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5778
|
+
"path",
|
|
5779
|
+
{
|
|
5780
|
+
d: "M8.97569 29V27.878L13.2777 21.83H9.11369V20.6H14.8977V21.716L10.6137 27.764H14.9337V29H8.97569ZM16.5178 29V20.6H17.8618V29H16.5178ZM20.0568 29V20.6H23.0988C23.6948 20.6 24.2208 20.704 24.6768 20.912C25.1368 21.116 25.4968 21.412 25.7568 21.8C26.0168 22.184 26.1468 22.646 26.1468 23.186C26.1468 23.742 26.0268 24.212 25.7868 24.596C25.5468 24.976 25.1968 25.266 24.7368 25.466C24.2808 25.662 23.7248 25.76 23.0688 25.76H21.4008V29H20.0568ZM21.4008 24.608H23.0868C23.6308 24.608 24.0528 24.494 24.3528 24.266C24.6528 24.034 24.8028 23.684 24.8028 23.216C24.8028 22.752 24.6488 22.396 24.3408 22.148C24.0328 21.9 23.6188 21.776 23.0988 21.776H21.4008V24.608Z",
|
|
5781
|
+
fill: "white"
|
|
5782
|
+
}
|
|
5783
|
+
)
|
|
5784
|
+
] });
|
|
5785
|
+
var FILE_ICONS = {
|
|
5786
|
+
excel: FileExcelIcon,
|
|
5787
|
+
jpg: FileJpgIcon,
|
|
5788
|
+
mp4: FileMp4Icon,
|
|
5789
|
+
pdf: FilePdfIcon,
|
|
5790
|
+
png: FilePngIcon,
|
|
5791
|
+
powerpoint: FilePowerpointIcon,
|
|
5792
|
+
text: FileTextIcon,
|
|
5793
|
+
word: FileWordIcon,
|
|
5794
|
+
zip: FileZipIcon
|
|
5795
|
+
};
|
|
5796
|
+
var NO_BROKEN_SRCS = [];
|
|
5797
|
+
var useImageObjectUrl = (file, type) => {
|
|
5798
|
+
const [objectUrl, setObjectUrl] = react.useState(null);
|
|
5799
|
+
react.useEffect(() => {
|
|
5800
|
+
const canCreate = typeof URL !== "undefined" && typeof URL.createObjectURL === "function";
|
|
5801
|
+
if (file && isImageType(type) && canCreate) {
|
|
5802
|
+
const url = URL.createObjectURL(file);
|
|
5803
|
+
setObjectUrl(url);
|
|
5804
|
+
return () => URL.revokeObjectURL(url);
|
|
5805
|
+
}
|
|
5806
|
+
setObjectUrl(null);
|
|
5807
|
+
}, [file, type]);
|
|
5808
|
+
return objectUrl;
|
|
5809
|
+
};
|
|
5810
|
+
var UploadItemPreview = (props) => {
|
|
5811
|
+
const theme = useComponentTheme("UploadItemPreview");
|
|
5812
|
+
const { item } = useUploadItemContext("Upload.ItemPreview");
|
|
5813
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadItemPreviewBase, props, theme);
|
|
5814
|
+
const { as, children, ref, ...nativeProps } = rest;
|
|
5815
|
+
const hasChildren = isRenderableNode(children);
|
|
5816
|
+
const sourceKey = `${item.id}\0${item.thumbUrl ?? ""}\0${item.url ?? ""}\0${item.file ? fileKey(item.file) : ""}`;
|
|
5817
|
+
const [broken, setBroken] = react.useState({ key: sourceKey, srcs: NO_BROKEN_SRCS });
|
|
5818
|
+
const brokenSrcs = broken.key === sourceKey ? broken.srcs : NO_BROKEN_SRCS;
|
|
5819
|
+
const markBroken = (src2) => setBroken((previous) => {
|
|
5820
|
+
if (previous.key !== sourceKey) return { key: sourceKey, srcs: [src2] };
|
|
5821
|
+
if (previous.srcs.includes(src2)) return previous;
|
|
5822
|
+
return { key: sourceKey, srcs: [...previous.srcs, src2] };
|
|
5823
|
+
});
|
|
5824
|
+
const thumbUsable = item.thumbUrl !== void 0 && !brokenSrcs.includes(item.thumbUrl);
|
|
5825
|
+
const objectUrl = useImageObjectUrl(hasChildren || thumbUsable ? void 0 : item.file, fileType(item));
|
|
5826
|
+
const slotAttrs = (slot) => buildSlotAttrs(UploadItemPreviewBase.getSlotProps(slot), slot, {
|
|
5827
|
+
themeSlotProps: theme?.slotProps,
|
|
5828
|
+
themeClassNames: theme?.classNames,
|
|
5829
|
+
instanceSlotProps: props.slotProps,
|
|
5830
|
+
instanceClassNames: props.classNames
|
|
5831
|
+
});
|
|
5832
|
+
const Component = as ?? "span";
|
|
5833
|
+
const remoteImage = item.url && isImageType(fileType(item)) ? item.url : void 0;
|
|
5834
|
+
const src = [item.thumbUrl, objectUrl ?? void 0, remoteImage].find((candidate) => candidate !== void 0 && !brokenSrcs.includes(candidate));
|
|
5835
|
+
const iconName = fileIconName(item);
|
|
5836
|
+
const FileIcon = iconName ? FILE_ICONS[iconName] : void 0;
|
|
5837
|
+
const { onError: slotOnError, ...imageAttrs } = slotAttrs("image");
|
|
5838
|
+
const defaultContent = src ? (
|
|
5839
|
+
// The defaults sit ahead of the slot layer so `slotProps.image` can still
|
|
5840
|
+
// override them — a consumer wanting a real `alt`, or eager loading for an
|
|
5841
|
+
// above-the-fold row, should not have to fight the part for it.
|
|
5842
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5843
|
+
"img",
|
|
5844
|
+
{
|
|
5845
|
+
alt: "",
|
|
5846
|
+
loading: "lazy",
|
|
5847
|
+
decoding: "async",
|
|
5848
|
+
...imageAttrs,
|
|
5849
|
+
src,
|
|
5850
|
+
onError: (event) => {
|
|
5851
|
+
markBroken(src);
|
|
5852
|
+
slotOnError?.(event);
|
|
5853
|
+
}
|
|
5854
|
+
}
|
|
5855
|
+
)
|
|
5856
|
+
) : FileIcon ? /* @__PURE__ */ jsxRuntime.jsx(FileIcon, { ...slotAttrs("icon") }) : /* @__PURE__ */ jsxRuntime.jsx("span", { ...slotAttrs("extension"), "aria-hidden": "true", children: nameExtension(fileName(item)) || "FILE" });
|
|
5857
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...nativeProps, ...rootAttrs, ref, children: hasChildren ? children : defaultContent });
|
|
5858
|
+
};
|
|
5859
|
+
UploadItemPreview.displayName = "Upload.ItemPreview";
|
|
5860
|
+
var flattenRowChildren = (children, out = []) => {
|
|
5861
|
+
react.Children.forEach(children, (child) => {
|
|
5862
|
+
if (react.isValidElement(child) && child.type === react.Fragment) flattenRowChildren(child.props.children, out);
|
|
5863
|
+
else out.push(child);
|
|
5864
|
+
});
|
|
5865
|
+
return out;
|
|
5866
|
+
};
|
|
5867
|
+
var UploadItem = (props) => {
|
|
5868
|
+
const theme = useComponentTheme("UploadItem");
|
|
5869
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadItemBase, props, theme);
|
|
5870
|
+
const { as, file: item, children, ref, ...nativeProps } = rest;
|
|
5871
|
+
const Component = as ?? "div";
|
|
5872
|
+
const previewNodes = [];
|
|
5873
|
+
const contentNodes = [];
|
|
5874
|
+
const actionsNodes = [];
|
|
5875
|
+
const looseNodes = [];
|
|
5876
|
+
for (const child of flattenRowChildren(children)) {
|
|
5877
|
+
const type = react.isValidElement(child) ? child.type : void 0;
|
|
5878
|
+
if (type === UploadItemPreview) previewNodes.push(child);
|
|
5879
|
+
else if (type === UploadItemContent) contentNodes.push(child);
|
|
5880
|
+
else if (type === UploadItemActions) actionsNodes.push(child);
|
|
5881
|
+
else looseNodes.push(child);
|
|
5882
|
+
}
|
|
5883
|
+
const hasComposedActions = actionsNodes.length > 0;
|
|
5884
|
+
const actionsRegion = hasComposedActions ? actionsNodes : /* @__PURE__ */ jsxRuntime.jsx(UploadItemActions, { children: looseNodes.length > 0 ? looseNodes : void 0 });
|
|
5885
|
+
return (
|
|
5886
|
+
// The row publishes its own file to its parts, so an `Upload.ItemAction`,
|
|
5887
|
+
// `Upload.ItemContent`, or `Upload.ItemPreview` needs no per-instance wiring
|
|
5888
|
+
// to know which entry it renders.
|
|
5889
|
+
/* @__PURE__ */ jsxRuntime.jsx(UploadItemProvider, { value: { item }, children: /* @__PURE__ */ jsxRuntime.jsxs(Component, { ...nativeProps, ...rootAttrs, "data-status": fileStatus(item), ref, children: [
|
|
5890
|
+
previewNodes.length > 0 ? previewNodes : /* @__PURE__ */ jsxRuntime.jsx(UploadItemPreview, {}),
|
|
5891
|
+
contentNodes.length > 0 ? contentNodes : /* @__PURE__ */ jsxRuntime.jsx(UploadItemContent, {}),
|
|
5892
|
+
hasComposedActions && looseNodes,
|
|
5893
|
+
actionsRegion
|
|
5894
|
+
] }) })
|
|
5895
|
+
);
|
|
5896
|
+
};
|
|
5897
|
+
UploadItem.displayName = "Upload.Item";
|
|
5898
|
+
var UploadList = (props) => {
|
|
5899
|
+
const theme = useComponentTheme("UploadList");
|
|
5900
|
+
const { files } = useUploadContext("Upload.List");
|
|
5901
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadListBase, props, theme);
|
|
5902
|
+
const { as, children, ref, ...nativeProps } = rest;
|
|
5903
|
+
if (files.length === 0) return null;
|
|
5904
|
+
const Component = as ?? "div";
|
|
5905
|
+
const rows = typeof children === "function" ? children(files) : isRenderableNode(children) ? children : files.map((item) => /* @__PURE__ */ jsxRuntime.jsx(UploadItem, { file: item }, item.id));
|
|
5906
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...nativeProps, ...rootAttrs, ref, children: rows });
|
|
5907
|
+
};
|
|
5908
|
+
UploadList.displayName = "Upload.List";
|
|
5909
|
+
var DEFAULT_SUBMIT_APPEARANCE = "outlined";
|
|
5910
|
+
var DEFAULT_SUBMIT_VARIANT = "neutral";
|
|
5911
|
+
var UploadSubmit = (props) => {
|
|
5912
|
+
const theme = useComponentTheme("UploadSubmit");
|
|
5913
|
+
const { disabled, files } = useUploadContext("Upload.Submit");
|
|
5914
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadSubmitBase, props, theme);
|
|
5915
|
+
const { onClick: slotOnClick, ...submitRootAttrs } = rootAttrs;
|
|
5916
|
+
const {
|
|
5917
|
+
as,
|
|
5918
|
+
children,
|
|
5919
|
+
ref,
|
|
5920
|
+
disabled: ownDisabled,
|
|
5921
|
+
href,
|
|
5922
|
+
onClick,
|
|
5923
|
+
appearance = DEFAULT_SUBMIT_APPEARANCE,
|
|
5924
|
+
variant = DEFAULT_SUBMIT_VARIANT,
|
|
5925
|
+
...buttonProps
|
|
5926
|
+
} = rest;
|
|
5927
|
+
const handleClick = (event) => {
|
|
5928
|
+
onClick?.(event);
|
|
5929
|
+
slotOnClick?.(event);
|
|
5930
|
+
};
|
|
5931
|
+
const inFlight = files.some((entry) => {
|
|
5932
|
+
const status = fileStatus(entry);
|
|
5933
|
+
return status === "uploading" || status === "processing";
|
|
5934
|
+
});
|
|
5935
|
+
const isDisabled = disabled || ownDisabled || files.length === 0 || inFlight;
|
|
5936
|
+
const isButton = (as ?? "button") === "button";
|
|
5937
|
+
const linkProps = isButton ? void 0 : { href: isDisabled ? void 0 : href };
|
|
5938
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonProps, ...linkProps, ...submitRootAttrs, as, appearance, variant, disabled: isDisabled, onClick: handleClick, ref, children });
|
|
5939
|
+
};
|
|
5940
|
+
UploadSubmit.displayName = "Upload.Submit";
|
|
5941
|
+
var DEFAULT_TRIGGER_APPEARANCE = "outlined";
|
|
5942
|
+
var DEFAULT_TRIGGER_VARIANT = "neutral";
|
|
5943
|
+
var UploadTrigger = (props) => {
|
|
5944
|
+
const theme = useComponentTheme("UploadTrigger");
|
|
5945
|
+
const { disabled, readOnly, openFileDialog } = useUploadContext("Upload.Trigger");
|
|
5946
|
+
const { rootAttrs, rest } = composeRootAttrs(UploadTriggerBase, props, theme);
|
|
5947
|
+
const { onClick: slotOnClick, ...triggerRootAttrs } = rootAttrs;
|
|
5948
|
+
const {
|
|
5949
|
+
as,
|
|
5950
|
+
children,
|
|
5951
|
+
ref,
|
|
5952
|
+
disabled: ownDisabled,
|
|
5953
|
+
href,
|
|
5954
|
+
onClick,
|
|
5955
|
+
appearance = DEFAULT_TRIGGER_APPEARANCE,
|
|
5956
|
+
variant = DEFAULT_TRIGGER_VARIANT,
|
|
5957
|
+
...buttonProps
|
|
5958
|
+
} = rest;
|
|
5959
|
+
const isDisabled = disabled || readOnly || ownDisabled;
|
|
5960
|
+
const isButton = (as ?? "button") === "button";
|
|
5961
|
+
const linkProps = isButton ? void 0 : { href: isDisabled ? void 0 : href };
|
|
5962
|
+
const handleClick = (event) => {
|
|
5963
|
+
const preventedOnEntry = event.defaultPrevented;
|
|
5964
|
+
onClick?.(event);
|
|
5965
|
+
slotOnClick?.(event);
|
|
5966
|
+
if (isConsumerVeto(event, preventedOnEntry)) return;
|
|
5967
|
+
openFileDialog();
|
|
5968
|
+
};
|
|
5969
|
+
return (
|
|
5970
|
+
// Read-only freezes the Trigger rather than unmounting it, which is the
|
|
5971
|
+
// opposite of what the ItemAction's remove does under the same state. The
|
|
5972
|
+
// asymmetry is the point: a file row without its remove still reads as a
|
|
5973
|
+
// whole row, but the zone's browse button is most of what the zone shows —
|
|
5974
|
+
// drop it and a dashed box is left offering a drop that never lands.
|
|
5975
|
+
/* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonProps, ...linkProps, ...triggerRootAttrs, as, appearance, variant, disabled: isDisabled, onClick: handleClick, ref, children })
|
|
5976
|
+
);
|
|
5977
|
+
};
|
|
5978
|
+
UploadTrigger.displayName = "Upload.Trigger";
|
|
5979
|
+
|
|
5980
|
+
// src/components/upload/index.ts
|
|
5981
|
+
var Upload2 = Object.assign(Upload, {
|
|
5982
|
+
Dropzone: UploadDropzone,
|
|
5983
|
+
Actions: UploadActions,
|
|
5984
|
+
Trigger: UploadTrigger,
|
|
5985
|
+
Submit: UploadSubmit,
|
|
5986
|
+
List: UploadList,
|
|
5987
|
+
Item: UploadItem,
|
|
5988
|
+
ItemPreview: UploadItemPreview,
|
|
5989
|
+
ItemContent: UploadItemContent,
|
|
5990
|
+
ItemActions: UploadItemActions,
|
|
5991
|
+
ItemAction: UploadItemAction
|
|
5992
|
+
});
|
|
5993
|
+
|
|
4975
5994
|
Object.defineProperty(exports, "createToaster", {
|
|
4976
5995
|
enumerable: true,
|
|
4977
5996
|
get: function () { return spar.createToaster; }
|
|
@@ -5006,6 +6025,7 @@ exports.TakeoffSparProvider = TakeoffSparProvider;
|
|
|
5006
6025
|
exports.Toast = Toast;
|
|
5007
6026
|
exports.Toaster = Toaster;
|
|
5008
6027
|
exports.Tooltip = Tooltip2;
|
|
6028
|
+
exports.Upload = Upload2;
|
|
5009
6029
|
exports.getExportRows = getExportRows;
|
|
5010
6030
|
exports.useComponentTheme = useComponentTheme;
|
|
5011
6031
|
exports.useTheme = useTheme;
|