@geomak/ui 1.7.0 → 1.7.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/dist/index.cjs +170 -124
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +101 -79
- package/dist/index.d.ts +101 -79
- package/dist/index.js +170 -124
- package/dist/index.js.map +1 -1
- package/dist/styles.css +31 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var chunk255PCZIW_cjs = require('./chunk-255PCZIW.cjs');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
5
|
var React10 = require('react');
|
|
5
6
|
var reactDom = require('react-dom');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var Dialog = require('@radix-ui/react-dialog');
|
|
8
8
|
var framerMotion = require('framer-motion');
|
|
9
9
|
var TooltipPrimitive = require('@radix-ui/react-tooltip');
|
|
@@ -46,18 +46,6 @@ var Popover__namespace = /*#__PURE__*/_interopNamespace(Popover);
|
|
|
46
46
|
var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
|
|
47
47
|
var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
|
|
48
48
|
|
|
49
|
-
function Portal({ children, target }) {
|
|
50
|
-
const [resolved, setResolved] = React10.useState(null);
|
|
51
|
-
React10.useEffect(() => {
|
|
52
|
-
if (target === null) {
|
|
53
|
-
setResolved(null);
|
|
54
|
-
return;
|
|
55
|
-
}
|
|
56
|
-
const node = typeof target === "function" ? target() : target ?? document.body;
|
|
57
|
-
setResolved(node ?? null);
|
|
58
|
-
}, [target]);
|
|
59
|
-
return resolved ? reactDom.createPortal(children, resolved) : null;
|
|
60
|
-
}
|
|
61
49
|
var Moon = ({ color = "gray" }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: color, viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: color, className: "w-8 h-8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M21.752 15.002A9.718 9.718 0 0118 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 003 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 009.002-5.998z" }) });
|
|
62
50
|
var Sun = ({ color = "yellow" }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: color, viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: color, className: "w-8 h-8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 3v2.25m6.364.386l-1.591 1.591M21 12h-2.25m-.386 6.364l-1.591-1.591M12 18.75V21m-4.773-4.227l-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0z" }) });
|
|
63
51
|
var CheckCircle = ({ color = "#fff", size = 28 }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: size, height: size, viewBox: "0 0 28 28", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14 0.25C6.40625 0.25 0.25 6.40625 0.25 14C0.25 21.5937 6.40625 27.75 14 27.75C21.5937 27.75 27.75 21.5937 27.75 14C27.75 6.40625 21.5937 0.25 14 0.25ZM19.96 11.675C20.0697 11.5496 20.1533 11.4034 20.2057 11.2452C20.2582 11.087 20.2784 10.9199 20.2653 10.7537C20.2522 10.5876 20.206 10.4257 20.1295 10.2777C20.0529 10.1296 19.9475 9.99838 19.8194 9.89168C19.6914 9.78497 19.5433 9.70495 19.3839 9.65633C19.2244 9.6077 19.0569 9.59145 18.8911 9.60853C18.7253 9.62562 18.5646 9.67568 18.4184 9.75579C18.2723 9.8359 18.1436 9.94443 18.04 10.075L12.665 16.5237L9.88375 13.7412C9.648 13.5136 9.33224 13.3876 9.0045 13.3904C8.67675 13.3933 8.36324 13.5247 8.13148 13.7565C7.89972 13.9882 7.76825 14.3018 7.76541 14.6295C7.76256 14.9572 7.88855 15.273 8.11625 15.5087L11.8662 19.2587C11.9891 19.3815 12.1361 19.4773 12.298 19.5401C12.4599 19.6028 12.6331 19.6312 12.8066 19.6233C12.98 19.6154 13.15 19.5715 13.3055 19.4943C13.4611 19.4171 13.5988 19.3084 13.71 19.175L19.96 11.675Z", fill: color }) });
|
|
@@ -217,6 +205,18 @@ Icon.Save = Save;
|
|
|
217
205
|
Icon.Copy = Copy;
|
|
218
206
|
Icon.CircleStack = CircleStack;
|
|
219
207
|
var icons_default = Icon;
|
|
208
|
+
function Portal({ children, target }) {
|
|
209
|
+
const [resolved, setResolved] = React10.useState(null);
|
|
210
|
+
React10.useEffect(() => {
|
|
211
|
+
if (target === null) {
|
|
212
|
+
setResolved(null);
|
|
213
|
+
return;
|
|
214
|
+
}
|
|
215
|
+
const node = typeof target === "function" ? target() : target ?? document.body;
|
|
216
|
+
setResolved(node ?? null);
|
|
217
|
+
}, [target]);
|
|
218
|
+
return resolved ? reactDom.createPortal(children, resolved) : null;
|
|
219
|
+
}
|
|
220
220
|
function IconButton({
|
|
221
221
|
icon,
|
|
222
222
|
onClick,
|
|
@@ -332,7 +332,8 @@ function Button({
|
|
|
332
332
|
);
|
|
333
333
|
}
|
|
334
334
|
function Modal({
|
|
335
|
-
|
|
335
|
+
width,
|
|
336
|
+
size,
|
|
336
337
|
isOpen = false,
|
|
337
338
|
onClose,
|
|
338
339
|
onOk,
|
|
@@ -344,6 +345,7 @@ function Modal({
|
|
|
344
345
|
children
|
|
345
346
|
}) {
|
|
346
347
|
const reduced = framerMotion.useReducedMotion();
|
|
348
|
+
const maxWidth = width ?? size?.[0] ?? 600;
|
|
347
349
|
return /* @__PURE__ */ jsxRuntime.jsx(Dialog__namespace.Root, { open: isOpen, onOpenChange: (open) => {
|
|
348
350
|
if (!open) onClose?.();
|
|
349
351
|
}, children: /* @__PURE__ */ jsxRuntime.jsxs(Dialog__namespace.Portal, { forceMount: true, children: [
|
|
@@ -362,7 +364,7 @@ function Modal({
|
|
|
362
364
|
{
|
|
363
365
|
className: "fixed left-1/2 top-1/2 z-modal flex flex-col w-[calc(100%-2rem)] max-h-[90dvh] bg-surface rounded-2xl shadow-xl overflow-hidden focus:outline-none",
|
|
364
366
|
style: {
|
|
365
|
-
maxWidth
|
|
367
|
+
maxWidth,
|
|
366
368
|
x: "-50%",
|
|
367
369
|
y: "-50%"
|
|
368
370
|
},
|
|
@@ -387,7 +389,7 @@ function Modal({
|
|
|
387
389
|
}
|
|
388
390
|
) })
|
|
389
391
|
] }),
|
|
390
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex-1 overflow-y-auto p-5 ${hasFooter ? "" : "pb-5"}`, children
|
|
392
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex-1 overflow-y-auto p-5 ${hasFooter ? "" : "pb-5"}`, children }),
|
|
391
393
|
hasFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-shrink-0 items-center justify-end gap-3 border-t border-border px-5 py-3", children: [
|
|
392
394
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
393
395
|
Button,
|
|
@@ -469,7 +471,7 @@ function Drawer({
|
|
|
469
471
|
}
|
|
470
472
|
) })
|
|
471
473
|
] }),
|
|
472
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto p-5", children
|
|
474
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto p-5", children }),
|
|
473
475
|
hasFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-shrink-0 items-center gap-3 border-t border-border px-5 py-3 ${isRight ? "justify-start" : "justify-end"}`, children: [
|
|
474
476
|
/* @__PURE__ */ jsxRuntime.jsx(Button, { style: { width: 90 }, content: cancelText, onClick: onCancel }),
|
|
475
477
|
/* @__PURE__ */ jsxRuntime.jsx(Button, { style: { width: 90 }, content: okText, onClick: onOk })
|
|
@@ -588,29 +590,46 @@ function Tabs({
|
|
|
588
590
|
{
|
|
589
591
|
"aria-label": "Tabs",
|
|
590
592
|
className: "flex-1 flex items-center gap-1 overflow-x-auto overflow-y-hidden rounded-lg scroll-smooth snap-x snap-mandatory hidden-scrollbar",
|
|
591
|
-
children: tabs.map((tab) =>
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
593
|
+
children: tabs.map((tab) => (
|
|
594
|
+
// Trigger + close button are SIBLINGS, not nested.
|
|
595
|
+
// Nesting a clickable element inside <button> is invalid
|
|
596
|
+
// HTML and breaks keyboard activation of the inner one.
|
|
597
|
+
// The wrapper carries `group` so the close button can
|
|
598
|
+
// react to the trigger's `data-state=active` for styling.
|
|
599
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
600
|
+
"div",
|
|
601
|
+
{
|
|
602
|
+
className: "snap-start snap-always relative flex items-center flex-1 min-w-[120px] max-w-[220px] flex-shrink-0 group",
|
|
603
|
+
children: [
|
|
604
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
605
|
+
TabsPrimitive__namespace.Trigger,
|
|
606
|
+
{
|
|
607
|
+
value: tab.key,
|
|
608
|
+
className: `w-full ${tabsClosable ? "pr-8" : "pr-3"} pl-3 py-2 rounded-3xl cursor-pointer transition-all duration-200 select-none h-10 text-left
|
|
609
|
+
text-foreground-secondary bg-surface-raised
|
|
610
|
+
hover:bg-surface hover:text-foreground
|
|
611
|
+
data-[state=active]:bg-accent data-[state=active]:text-accent-foreground
|
|
612
|
+
focus:outline-none focus-visible:ring-2 focus-visible:ring-accent`,
|
|
613
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm block", children: tab.title })
|
|
614
|
+
}
|
|
615
|
+
),
|
|
616
|
+
tabsClosable && /* @__PURE__ */ jsxRuntime.jsx(
|
|
617
|
+
"button",
|
|
618
|
+
{
|
|
619
|
+
type: "button",
|
|
620
|
+
"aria-label": `Close ${tab.title}`,
|
|
621
|
+
onClick: (e) => {
|
|
622
|
+
e.stopPropagation();
|
|
623
|
+
onTabClose?.(tab.key);
|
|
624
|
+
},
|
|
625
|
+
className: "absolute right-1.5 top-1/2 -translate-y-1/2 rounded p-0.5 text-foreground-secondary group-data-[state=active]:text-accent-foreground hover:bg-black/10 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
|
|
626
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5L5 15M5 5l10 10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
627
|
+
}
|
|
628
|
+
)
|
|
629
|
+
]
|
|
630
|
+
},
|
|
631
|
+
tab.key
|
|
632
|
+
)
|
|
614
633
|
))
|
|
615
634
|
}
|
|
616
635
|
),
|
|
@@ -673,40 +692,41 @@ function TreeNodeItem({
|
|
|
673
692
|
defaultValue: initialOpen,
|
|
674
693
|
style: { paddingLeft: depth * 12 },
|
|
675
694
|
children: /* @__PURE__ */ jsxRuntime.jsxs(Accordion__namespace.Item, { value: item.key, className: "border-none", children: [
|
|
676
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
{
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
695
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
696
|
+
Accordion__namespace.Trigger,
|
|
697
|
+
{
|
|
698
|
+
onClick: () => onNodeClick({
|
|
699
|
+
isParent: true,
|
|
700
|
+
key: item.key,
|
|
701
|
+
label: item.label,
|
|
702
|
+
data: item.nodeData,
|
|
703
|
+
parentLabel: item.parentLabel
|
|
704
|
+
}),
|
|
705
|
+
className: "flex items-center gap-2 cursor-pointer py-1.5 px-2 group focus:outline-none focus-visible:ring-2 focus-visible:ring-accent w-full text-left rounded-md hover:bg-surface-raised transition-colors duration-150",
|
|
706
|
+
children: [
|
|
707
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
708
|
+
"svg",
|
|
687
709
|
{
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
710
|
+
viewBox: "0 0 24 24",
|
|
711
|
+
fill: "none",
|
|
712
|
+
stroke: "currentColor",
|
|
713
|
+
strokeWidth: 2.5,
|
|
714
|
+
className: "h-3.5 w-3.5 flex-shrink-0 text-foreground-muted transition-transform duration-200 group-data-[state=open]:rotate-0 group-data-[state=closed]:-rotate-90",
|
|
715
|
+
"aria-hidden": "true",
|
|
716
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
717
|
+
"path",
|
|
718
|
+
{
|
|
719
|
+
strokeLinecap: "round",
|
|
720
|
+
strokeLinejoin: "round",
|
|
721
|
+
d: "M19 9l-7 7-7-7"
|
|
722
|
+
}
|
|
723
|
+
)
|
|
691
724
|
}
|
|
692
|
-
)
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
{
|
|
698
|
-
className: "text-sm font-semibold text-foreground select-none",
|
|
699
|
-
onClick: () => onNodeClick({
|
|
700
|
-
isParent: true,
|
|
701
|
-
key: item.key,
|
|
702
|
-
label: item.label,
|
|
703
|
-
data: item.nodeData,
|
|
704
|
-
parentLabel: item.parentLabel
|
|
705
|
-
}),
|
|
706
|
-
children: item.label
|
|
707
|
-
}
|
|
708
|
-
)
|
|
709
|
-
] }),
|
|
725
|
+
),
|
|
726
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground select-none", children: item.label })
|
|
727
|
+
]
|
|
728
|
+
}
|
|
729
|
+
),
|
|
710
730
|
/* @__PURE__ */ jsxRuntime.jsx(Accordion__namespace.Content, { className: "overflow-hidden data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-3.5 border-l border-border py-0.5", children: item.children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
711
731
|
TreeNodeItem,
|
|
712
732
|
{
|
|
@@ -1246,7 +1266,12 @@ function MenuBarItem({ icon, isActive, title, onClick }) {
|
|
|
1246
1266
|
className: `transition duration-300 hover:bg-prussian-blue ${isActive ? "bg-prussian-blue" : ""} rounded-lg p-2 cursor-pointer`,
|
|
1247
1267
|
onClick,
|
|
1248
1268
|
tabIndex: 0,
|
|
1249
|
-
onKeyDown: (e) =>
|
|
1269
|
+
onKeyDown: (e) => {
|
|
1270
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
1271
|
+
e.preventDefault();
|
|
1272
|
+
onClick?.();
|
|
1273
|
+
}
|
|
1274
|
+
},
|
|
1250
1275
|
children: icon
|
|
1251
1276
|
}
|
|
1252
1277
|
) });
|
|
@@ -1481,7 +1506,8 @@ var SearchInput = React10__default.default.forwardRef(function SearchInput2({
|
|
|
1481
1506
|
disabled,
|
|
1482
1507
|
value,
|
|
1483
1508
|
onChange,
|
|
1484
|
-
type: "
|
|
1509
|
+
type: "search",
|
|
1510
|
+
enterKeyHint: "search",
|
|
1485
1511
|
name,
|
|
1486
1512
|
id: htmlFor,
|
|
1487
1513
|
className: "focus:outline-none pl-2 h-9 w-56 outline-offset-2 text-prussian-blue mt-1 rounded-lg disabled:bg-disabled disabled:cursor-not-allowed",
|
|
@@ -2452,6 +2478,9 @@ function TextInput({
|
|
|
2452
2478
|
className: `flex ${layout === "vertical" ? "flex-col" : "flex-row items-center gap-2"}`,
|
|
2453
2479
|
style: style ?? {},
|
|
2454
2480
|
children: [
|
|
2481
|
+
label && // Render <label> only when a label is provided. An empty
|
|
2482
|
+
// <label htmlFor=…> announces as an unlabeled control in
|
|
2483
|
+
// some screen readers.
|
|
2455
2484
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2456
2485
|
"label",
|
|
2457
2486
|
{
|
|
@@ -2598,6 +2627,9 @@ function Password({
|
|
|
2598
2627
|
const color = iconColor ?? chunk255PCZIW_cjs.colors_default.PALETTE["prussian-blue"];
|
|
2599
2628
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col items-center justify-center", style: style ?? {}, children: [
|
|
2600
2629
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex ${layout === "vertical" ? "flex-col" : "flex-row items-center gap-2"}`, children: [
|
|
2630
|
+
label && // Render <label> only when a label is provided. An empty
|
|
2631
|
+
// <label htmlFor=…> announces as an unlabeled control in
|
|
2632
|
+
// some screen readers.
|
|
2601
2633
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2602
2634
|
"label",
|
|
2603
2635
|
{
|
|
@@ -2958,7 +2990,7 @@ function FileInput({
|
|
|
2958
2990
|
const fileInput = React10.useRef(null);
|
|
2959
2991
|
const [files, setFiles] = React10.useState([]);
|
|
2960
2992
|
const openPicker = () => {
|
|
2961
|
-
fileInput.current?.
|
|
2993
|
+
fileInput.current?.click();
|
|
2962
2994
|
};
|
|
2963
2995
|
const handleFiles = (list) => {
|
|
2964
2996
|
setFiles(list);
|
|
@@ -2990,56 +3022,70 @@ function FileInput({
|
|
|
2990
3022
|
onChange?.({ target: { files: [], name, id: name, value: "" } });
|
|
2991
3023
|
if (fileInput.current) fileInput.current.value = "";
|
|
2992
3024
|
};
|
|
2993
|
-
return
|
|
2994
|
-
"
|
|
2995
|
-
|
|
2996
|
-
|
|
2997
|
-
|
|
2998
|
-
|
|
2999
|
-
|
|
3000
|
-
|
|
3001
|
-
|
|
3002
|
-
|
|
3003
|
-
|
|
3004
|
-
|
|
3005
|
-
|
|
3006
|
-
|
|
3007
|
-
|
|
3008
|
-
hidden: true,
|
|
3009
|
-
type: "file",
|
|
3010
|
-
accept,
|
|
3011
|
-
multiple: allowMultiple
|
|
3025
|
+
return (
|
|
3026
|
+
// Dropzone is keyboard-activatable: role="button", focusable via
|
|
3027
|
+
// tabIndex, and Space/Enter trigger the file picker. Without these
|
|
3028
|
+
// a keyboard-only user could not upload a file.
|
|
3029
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3030
|
+
"div",
|
|
3031
|
+
{
|
|
3032
|
+
role: "button",
|
|
3033
|
+
tabIndex: 0,
|
|
3034
|
+
"aria-label": "Upload file \u2014 click or drop",
|
|
3035
|
+
onClick: openPicker,
|
|
3036
|
+
onKeyDown: (e) => {
|
|
3037
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
3038
|
+
e.preventDefault();
|
|
3039
|
+
openPicker();
|
|
3012
3040
|
}
|
|
3013
|
-
|
|
3014
|
-
|
|
3015
|
-
|
|
3016
|
-
|
|
3017
|
-
|
|
3018
|
-
|
|
3019
|
-
|
|
3020
|
-
|
|
3021
|
-
|
|
3022
|
-
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
|
|
3026
|
-
|
|
3027
|
-
|
|
3028
|
-
|
|
3029
|
-
|
|
3030
|
-
|
|
3031
|
-
|
|
3032
|
-
|
|
3033
|
-
|
|
3034
|
-
|
|
3035
|
-
|
|
3036
|
-
|
|
3037
|
-
|
|
3038
|
-
|
|
3039
|
-
|
|
3040
|
-
|
|
3041
|
-
|
|
3042
|
-
|
|
3041
|
+
},
|
|
3042
|
+
className: "border-2 hover:border-prussian-blue border-ice-dark w-full h-full rounded-md transition-all duration-300 border-dashed dark:border-independence hover:dark:border-ice-dark cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
|
|
3043
|
+
onDragOver: (e) => e.preventDefault(),
|
|
3044
|
+
onDrop,
|
|
3045
|
+
children: [
|
|
3046
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3047
|
+
"input",
|
|
3048
|
+
{
|
|
3049
|
+
id: name,
|
|
3050
|
+
name,
|
|
3051
|
+
onChange: localOnChange,
|
|
3052
|
+
ref: fileInput,
|
|
3053
|
+
hidden: true,
|
|
3054
|
+
type: "file",
|
|
3055
|
+
accept,
|
|
3056
|
+
multiple: allowMultiple
|
|
3057
|
+
}
|
|
3058
|
+
),
|
|
3059
|
+
files.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-full items-center justify-center gap-2", children: [
|
|
3060
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: chunk255PCZIW_cjs.colors_default.PALETTE["prussian-blue"], className: "w-16 h-16 dark:fill-white", children: /* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M11.47 2.47a.75.75 0 011.06 0l4.5 4.5a.75.75 0 01-1.06 1.06l-3.22-3.22V16.5a.75.75 0 01-1.5 0V4.81L8.03 8.03a.75.75 0 01-1.06-1.06l4.5-4.5zM3 15.75a.75.75 0 01.75.75v2.25a1.5 1.5 0 001.5 1.5h13.5a1.5 1.5 0 001.5-1.5V16.5a.75.75 0 011.5 0v2.25a3 3 0 01-3 3H5.25a3 3 0 01-3-3V16.5a.75.75 0 01.75-.75z", clipRule: "evenodd" }) }),
|
|
3061
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-prussian-blue dark:text-white text-sm", children: "Click or Drop a file" })
|
|
3062
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-3 items-center justify-center w-full h-full", children: files.map((file, id) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3063
|
+
"div",
|
|
3064
|
+
{
|
|
3065
|
+
className: "text-xs flex flex-col items-center w-20 h-24 text-center bg-ice-dark p-4 dark:bg-independence rounded-md relative",
|
|
3066
|
+
children: [
|
|
3067
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3068
|
+
"button",
|
|
3069
|
+
{
|
|
3070
|
+
type: "button",
|
|
3071
|
+
onClick: removeFile,
|
|
3072
|
+
className: "bg-error rounded-full w-4 h-4 absolute right-[-5px] top-[-5px] cursor-pointer flex items-center justify-center",
|
|
3073
|
+
"aria-label": "Remove file",
|
|
3074
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "10", height: "10", viewBox: "0 0 20 20", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5L5 15M5 5l10 10", stroke: "#fff", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
3075
|
+
}
|
|
3076
|
+
),
|
|
3077
|
+
/* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: chunk255PCZIW_cjs.colors_default.PALETTE["prussian-blue"], className: "w-10 h-10 dark:fill-white", children: [
|
|
3078
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M5.625 1.5c-1.036 0-1.875.84-1.875 1.875v17.25c0 1.035.84 1.875 1.875 1.875h12.75c1.035 0 1.875-.84 1.875-1.875V12.75A3.75 3.75 0 0016.5 9h-1.875a1.875 1.875 0 01-1.875-1.875V5.25A3.75 3.75 0 009 1.5H5.625z", clipRule: "evenodd" }),
|
|
3079
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12.971 1.816A5.23 5.23 0 0114.25 5.25v1.875c0 .207.168.375.375.375H16.5a5.23 5.23 0 013.434 1.279 9.768 9.768 0 00-6.963-6.963z" })
|
|
3080
|
+
] }),
|
|
3081
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ellipsis whitespace-nowrap overflow-hidden w-full text-prussian-blue dark:text-white", children: file.name })
|
|
3082
|
+
]
|
|
3083
|
+
},
|
|
3084
|
+
`${id}${file.name}`
|
|
3085
|
+
)) })
|
|
3086
|
+
]
|
|
3087
|
+
}
|
|
3088
|
+
)
|
|
3043
3089
|
);
|
|
3044
3090
|
}
|
|
3045
3091
|
var MONTHS = {
|