@gunkin/uiify 0.0.12-alpha → 0.0.13-alpha
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/components/behavior.css +9 -6
- package/dist/components/behavior.css.map +1 -1
- package/dist/components/breadcrumb/Breadcrumb.d.ts.map +1 -1
- package/dist/components/breadcrumb/Breadcrumb.js +5 -4
- package/dist/components/breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/components/carousel/CarouselMarkup.d.ts.map +1 -1
- package/dist/components/carousel/CarouselMarkup.js +2 -1
- package/dist/components/carousel/CarouselMarkup.js.map +1 -1
- package/dist/components/carousel/client/CarouselClientView.d.ts.map +1 -1
- package/dist/components/carousel/client/CarouselClientView.js +1 -0
- package/dist/components/carousel/client/CarouselClientView.js.map +1 -1
- package/dist/components/carousel/client/carousel-controller.d.ts.map +1 -1
- package/dist/components/carousel/client/carousel-controller.js +25 -4
- package/dist/components/carousel/client/carousel-controller.js.map +1 -1
- package/dist/components/carousel/client/carousel-observer.d.ts.map +1 -1
- package/dist/components/carousel/client/carousel-observer.js +40 -0
- package/dist/components/carousel/client/carousel-observer.js.map +1 -1
- package/dist/components/carousel/fade/fade-controller.d.ts.map +1 -1
- package/dist/components/carousel/fade/fade-controller.js +3 -0
- package/dist/components/carousel/fade/fade-controller.js.map +1 -1
- package/dist/components/carousel/types.d.ts +2 -0
- package/dist/components/carousel/types.d.ts.map +1 -1
- package/dist/components/checkbox/Checkbox.d.ts +1 -6
- package/dist/components/checkbox/Checkbox.d.ts.map +1 -1
- package/dist/components/checkbox/Checkbox.js +2 -52
- package/dist/components/checkbox/Checkbox.js.map +1 -1
- package/dist/components/drawer/Drawer.d.ts +1 -1
- package/dist/components/drawer/Drawer.d.ts.map +1 -1
- package/dist/components/drawer/Drawer.js +46 -9
- package/dist/components/drawer/Drawer.js.map +1 -1
- package/dist/components/drawer/DrawerNative.d.ts +8 -16
- package/dist/components/drawer/DrawerNative.d.ts.map +1 -1
- package/dist/components/drawer/DrawerNative.js +80 -34
- package/dist/components/drawer/DrawerNative.js.map +1 -1
- package/dist/components/drawer/drawer-store.d.ts +1 -1
- package/dist/components/drawer/drawer-store.d.ts.map +1 -1
- package/dist/components/drawer/drawer-store.js +7 -3
- package/dist/components/drawer/drawer-store.js.map +1 -1
- package/dist/components/drawer/index.d.ts +3 -3
- package/dist/components/drawer/index.d.ts.map +1 -1
- package/dist/components/drawer/index.js +9 -1
- package/dist/components/drawer/index.js.map +1 -1
- package/dist/components/drawer/types.d.ts +114 -3
- package/dist/components/drawer/types.d.ts.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.d.ts.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.js +1 -0
- package/dist/components/dropdown-menu/DropdownMenu.js.map +1 -1
- package/dist/components/enhance/dialog-dismiss.d.ts +1 -1
- package/dist/components/enhance/dialog-dismiss.d.ts.map +1 -1
- package/dist/components/enhance/dialog-dismiss.js +19 -10
- package/dist/components/enhance/dialog-dismiss.js.map +1 -1
- package/dist/components/enhance/internal/box-observer.d.ts +4 -0
- package/dist/components/enhance/internal/box-observer.d.ts.map +1 -0
- package/dist/components/enhance/internal/box-observer.js +32 -0
- package/dist/components/enhance/internal/box-observer.js.map +1 -0
- package/dist/components/enhance/sheet-swipe.d.ts.map +1 -1
- package/dist/components/enhance/sheet-swipe.js +42 -14
- package/dist/components/enhance/sheet-swipe.js.map +1 -1
- package/dist/components/enhance/types.d.ts +5 -0
- package/dist/components/enhance/types.d.ts.map +1 -0
- package/dist/components/field/Field.d.ts.map +1 -1
- package/dist/components/field/Field.js +1 -0
- package/dist/components/field/Field.js.map +1 -1
- package/dist/components/file-upload/FileUpload.d.ts +4 -7
- package/dist/components/file-upload/FileUpload.d.ts.map +1 -1
- package/dist/components/file-upload/FileUpload.js +28 -122
- package/dist/components/file-upload/FileUpload.js.map +1 -1
- package/dist/components/file-upload/FileUploadInput.d.ts +7 -0
- package/dist/components/file-upload/FileUploadInput.d.ts.map +1 -0
- package/dist/components/file-upload/FileUploadInput.js +60 -0
- package/dist/components/file-upload/FileUploadInput.js.map +1 -0
- package/dist/components/file-upload/FileUploadRoot.d.ts +8 -0
- package/dist/components/file-upload/FileUploadRoot.d.ts.map +1 -0
- package/dist/components/file-upload/FileUploadRoot.js +70 -0
- package/dist/components/file-upload/FileUploadRoot.js.map +1 -0
- package/dist/components/file-upload/file-upload-context.d.ts +3 -0
- package/dist/components/file-upload/file-upload-context.d.ts.map +1 -0
- package/dist/components/file-upload/file-upload-context.js +8 -0
- package/dist/components/file-upload/file-upload-context.js.map +1 -0
- package/dist/components/file-upload/index.d.ts +1 -1
- package/dist/components/file-upload/index.d.ts.map +1 -1
- package/dist/components/file-upload/index.js.map +1 -1
- package/dist/components/file-upload/types.d.ts +8 -10
- package/dist/components/file-upload/types.d.ts.map +1 -1
- package/dist/components/form/Form.d.ts.map +1 -1
- package/dist/components/form/Form.js +2 -1
- package/dist/components/form/Form.js.map +1 -1
- package/dist/components/hover-card/HoverCard.js +1 -1
- package/dist/components/hover-card/HoverCard.js.map +1 -1
- package/dist/components/index.d.ts +0 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +0 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/input/Input.d.ts.map +1 -1
- package/dist/components/input/Input.js +1 -1
- package/dist/components/input/Input.js.map +1 -1
- package/dist/components/internal/choice-family/ChoiceGroup.js +1 -1
- package/dist/components/internal/choice-family/ChoiceGroup.js.map +1 -1
- package/dist/components/internal/choice-family/types.d.ts +3 -3
- package/dist/components/internal/choice-family/types.d.ts.map +1 -1
- package/dist/components/internal/native-check-control/NativeCheckControl.d.ts +7 -0
- package/dist/components/internal/native-check-control/NativeCheckControl.d.ts.map +1 -0
- package/dist/components/internal/native-check-control/NativeCheckControl.js +56 -0
- package/dist/components/internal/native-check-control/NativeCheckControl.js.map +1 -0
- package/dist/components/internal/native-check-control/types.d.ts +13 -0
- package/dist/components/internal/native-check-control/types.d.ts.map +1 -0
- package/dist/components/internal/native-check-control/types.js +1 -0
- package/dist/components/number-field/NumberField.d.ts.map +1 -1
- package/dist/components/number-field/NumberField.js +11 -2
- package/dist/components/number-field/NumberField.js.map +1 -1
- package/dist/components/number-field/format.d.ts +1 -0
- package/dist/components/number-field/format.d.ts.map +1 -1
- package/dist/components/number-field/format.js +18 -6
- package/dist/components/number-field/format.js.map +1 -1
- package/dist/components/popup/PopupParts.d.ts.map +1 -1
- package/dist/components/popup/PopupParts.js +2 -0
- package/dist/components/popup/PopupParts.js.map +1 -1
- package/dist/components/select/Select.d.ts.map +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/select/Select.js.map +1 -1
- package/dist/components/skeleton/Skeleton.d.ts.map +1 -1
- package/dist/components/skeleton/Skeleton.js +14 -35
- package/dist/components/skeleton/Skeleton.js.map +1 -1
- package/dist/components/skeleton/types.d.ts +1 -8
- package/dist/components/skeleton/types.d.ts.map +1 -1
- package/dist/components/table/Table.d.ts +1 -40
- package/dist/components/table/Table.d.ts.map +1 -1
- package/dist/components/table/Table.js +9 -259
- package/dist/components/table/Table.js.map +1 -1
- package/dist/components/table/TableShell.d.ts +5 -1
- package/dist/components/table/TableShell.d.ts.map +1 -1
- package/dist/components/table/TableShell.js +63 -9
- package/dist/components/table/TableShell.js.map +1 -1
- package/dist/components/table/client/Table.d.ts +30 -0
- package/dist/components/table/client/Table.d.ts.map +1 -0
- package/dist/components/table/client/Table.js +135 -0
- package/dist/components/table/client/Table.js.map +1 -0
- package/dist/components/table/client/TableBody.d.ts +7 -0
- package/dist/components/table/client/TableBody.d.ts.map +1 -0
- package/dist/components/table/client/TableBody.js +35 -0
- package/dist/components/table/client/TableBody.js.map +1 -0
- package/dist/components/table/client/TableColumnHeader.d.ts +7 -0
- package/dist/components/table/client/TableColumnHeader.d.ts.map +1 -0
- package/dist/components/table/client/TableColumnHeader.js +69 -0
- package/dist/components/table/client/TableColumnHeader.js.map +1 -0
- package/dist/components/table/client/TableExpansion.d.ts +11 -0
- package/dist/components/table/client/TableExpansion.d.ts.map +1 -0
- package/dist/components/table/client/TableExpansion.js +43 -0
- package/dist/components/table/client/TableExpansion.js.map +1 -0
- package/dist/components/table/client/TableRow.d.ts +7 -0
- package/dist/components/table/client/TableRow.d.ts.map +1 -0
- package/dist/components/table/client/TableRow.js +95 -0
- package/dist/components/table/client/TableRow.js.map +1 -0
- package/dist/components/table/client/TableSelection.d.ts +11 -0
- package/dist/components/table/client/TableSelection.d.ts.map +1 -0
- package/dist/components/table/client/TableSelection.js +48 -0
- package/dist/components/table/client/TableSelection.js.map +1 -0
- package/dist/components/table/client/table-context.d.ts +3 -0
- package/dist/components/table/client/table-context.d.ts.map +1 -0
- package/dist/components/table/client/table-context.js +8 -0
- package/dist/components/table/client/table-context.js.map +1 -0
- package/dist/components/table/client.d.ts +4 -0
- package/dist/components/table/client.d.ts.map +1 -0
- package/dist/components/table/client.js +30 -0
- package/dist/components/table/client.js.map +1 -0
- package/dist/components/table/index.d.ts +2 -2
- package/dist/components/table/index.d.ts.map +1 -1
- package/dist/components/table/index.js +7 -7
- package/dist/components/table/index.js.map +1 -1
- package/dist/components/table/types.d.ts +42 -15
- package/dist/components/table/types.d.ts.map +1 -1
- package/dist/components/textarea/Textarea.d.ts.map +1 -1
- package/dist/components/textarea/Textarea.js +1 -1
- package/dist/components/textarea/Textarea.js.map +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- package/dist/components/tooltip/Tooltip.js.map +1 -1
- package/dist/components/virtual-scroll/VirtualScroll.d.ts.map +1 -1
- package/dist/components/virtual-scroll/VirtualScroll.js +54 -34
- package/dist/components/virtual-scroll/VirtualScroll.js.map +1 -1
- package/dist/components/virtual-scroll/types.d.ts +2 -2
- package/dist/components/virtual-scroll/types.d.ts.map +1 -1
- package/dist/components/virtual-scroll/types.js.map +1 -1
- package/dist/components/virtual-scroll/virtual-scroll-scroll.d.ts.map +1 -1
- package/dist/components/virtual-scroll/virtual-scroll-scroll.js +0 -1
- package/dist/components/virtual-scroll/virtual-scroll-scroll.js.map +1 -1
- package/dist/core/roving-focus.d.ts +2 -1
- package/dist/core/roving-focus.d.ts.map +1 -1
- package/dist/core/roving-focus.js.map +1 -1
- package/dist/core/use-popover.d.ts.map +1 -1
- package/dist/core/use-popover.js +6 -1
- package/dist/core/use-popover.js.map +1 -1
- package/dist/elements/choice/types.d.ts +1 -1
- package/dist/elements/choice/types.d.ts.map +1 -1
- package/dist/styles/index.css +1 -1
- package/dist/styles/tailwind.css +1 -0
- package/dist/styles/tokens.css +1 -1
- package/package.json +1 -1
- package/dist/components/drawer/client-types.d.ts +0 -99
- package/dist/components/drawer/client-types.d.ts.map +0 -1
- package/dist/components/drawer/client-types.js +0 -1
- package/dist/components/enhance/internal/read-box.d.ts +0 -3
- package/dist/components/enhance/internal/read-box.d.ts.map +0 -1
- package/dist/components/enhance/internal/read-box.js +0 -7
- package/dist/components/enhance/internal/read-box.js.map +0 -1
- package/dist/components/stepper/Stepper.d.ts +0 -7
- package/dist/components/stepper/Stepper.d.ts.map +0 -1
- package/dist/components/stepper/Stepper.js +0 -35
- package/dist/components/stepper/Stepper.js.map +0 -1
- package/dist/components/stepper/index.d.ts +0 -3
- package/dist/components/stepper/index.d.ts.map +0 -1
- package/dist/components/stepper/index.js +0 -5
- package/dist/components/stepper/index.js.map +0 -1
- package/dist/components/stepper/types.d.ts +0 -14
- package/dist/components/stepper/types.d.ts.map +0 -1
- package/dist/components/stepper.d.ts +0 -1
- package/dist/components/stepper.js +0 -1
- /package/dist/components/{stepper → enhance}/types.js +0 -0
- /package/dist/components/{stepper → enhance}/types.js.map +0 -0
- /package/dist/components/{drawer/client-types.js.map → internal/native-check-control/types.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileUpload.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/FileUpload.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileUpload.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/FileUpload.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAa,YAAY,EAAkB,MAAM,OAAO,CAAC;AAGlF,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,OAAO,KAAK,EACV,sBAAsB,EACtB,uBAAuB,EACvB,sBAAsB,EACtB,mBAAmB,EACnB,4BAA4B,EAC7B,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,CAAC;AAEvE,wBAAgB,iBAAiB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,EACjE,KAAK,EAAE,sBAAsB,CAAC,GAAG,CAAC,GACjC,YAAY,GAAG,IAAI,CAmCrB;AAED,wBAAgB,kBAAkB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAChE,KAAK,EAAE,uBAAuB,CAAC,GAAG,CAAC,GAClC,YAAY,GAAG,IAAI,CAgCrB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,GAAG,IAAI,CAajF;AAED,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,IAAI,EAC3D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAuBrB;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,4BAA4B,GAAG,YAAY,GAAG,IAAI,CA0B7F;AAED,eAAO,MAAM,UAAU;;;;;;;;CAQtB,CAAC"}
|
|
@@ -1,119 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { useCallback, useMemo, useRef, useSyncExternalStore } from "react";
|
|
4
|
-
import { useControllableState, useId } from "@gunkin/uiify/hooks";
|
|
5
|
-
import { createPartContext } from "@gunkin/uiify/core";
|
|
6
2
|
import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
|
|
7
3
|
import { useRenderElement } from "@gunkin/uiify/core/render";
|
|
8
|
-
import {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
const {
|
|
12
|
-
accept = [],
|
|
13
|
-
className,
|
|
14
|
-
children,
|
|
15
|
-
defaultValue = [],
|
|
16
|
-
disabled = false,
|
|
17
|
-
maxFiles,
|
|
18
|
-
maxSize,
|
|
19
|
-
minSize,
|
|
20
|
-
multiple = false,
|
|
21
|
-
onValueChange,
|
|
22
|
-
onReject,
|
|
23
|
-
value: controlledValue
|
|
24
|
-
} = props;
|
|
25
|
-
const inputId = useId();
|
|
26
|
-
const hiddenInputRef = useRef(null);
|
|
27
|
-
const [files, setFiles] = useControllableState({
|
|
28
|
-
defaultValue: [...defaultValue],
|
|
29
|
-
...controlledValue !== void 0 ? { value: [...controlledValue] } : {},
|
|
30
|
-
...onValueChange ? { onChange: onValueChange } : {}
|
|
31
|
-
});
|
|
32
|
-
const storeRef = useRef(null);
|
|
33
|
-
storeRef.current ??= createFileUploadStore(files);
|
|
34
|
-
const store = storeRef.current;
|
|
35
|
-
const processFiles = useCallback(
|
|
36
|
-
(list) => {
|
|
37
|
-
if (disabled) return;
|
|
38
|
-
const incoming = Array.from(list);
|
|
39
|
-
const { accepted, rejected } = validateFiles(incoming, {
|
|
40
|
-
accept,
|
|
41
|
-
multiple,
|
|
42
|
-
...maxFiles !== void 0 ? { maxFiles } : {},
|
|
43
|
-
...maxSize !== void 0 ? { maxSize } : {},
|
|
44
|
-
...minSize !== void 0 ? { minSize } : {}
|
|
45
|
-
});
|
|
46
|
-
if (rejected.length > 0) onReject?.(rejected);
|
|
47
|
-
if (accepted.length === 0) return;
|
|
48
|
-
const next = multiple ? [...store.getFiles(), ...accepted] : accepted;
|
|
49
|
-
store.setFiles(next);
|
|
50
|
-
setFiles(next);
|
|
51
|
-
},
|
|
52
|
-
[accept, disabled, maxFiles, maxSize, minSize, multiple, onReject, setFiles, store]
|
|
53
|
-
);
|
|
54
|
-
const openPicker = useCallback(() => {
|
|
55
|
-
hiddenInputRef.current?.click();
|
|
56
|
-
}, []);
|
|
57
|
-
const removeAt = useCallback(
|
|
58
|
-
(index) => {
|
|
59
|
-
store.removeAt(index);
|
|
60
|
-
setFiles(store.getFiles());
|
|
61
|
-
},
|
|
62
|
-
[setFiles, store]
|
|
63
|
-
);
|
|
64
|
-
const contextValue = useMemo(
|
|
65
|
-
() => ({
|
|
66
|
-
accept,
|
|
67
|
-
disabled,
|
|
68
|
-
hiddenInputRef,
|
|
69
|
-
inputId,
|
|
70
|
-
multiple,
|
|
71
|
-
openPicker,
|
|
72
|
-
processFiles,
|
|
73
|
-
removeAt,
|
|
74
|
-
store
|
|
75
|
-
}),
|
|
76
|
-
[accept, disabled, inputId, multiple, openPicker, processFiles, removeAt, store]
|
|
77
|
-
);
|
|
78
|
-
return /* @__PURE__ */ jsx("div", { className, "data-uiify-file-upload": "", children: /* @__PURE__ */ jsx(FileUploadProvider, { value: contextValue, children }) });
|
|
79
|
-
}
|
|
80
|
-
FileUploadRootClient.displayName = "FileUploadRootClient";
|
|
81
|
-
const FileUploadRoot = FileUploadRootClient;
|
|
82
|
-
function FileUploadHiddenInput(props) {
|
|
83
|
-
const { className } = props;
|
|
84
|
-
const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles } = useFileUploadContext("HiddenInput");
|
|
85
|
-
return useRenderElement({
|
|
86
|
-
defaultTag: "input",
|
|
87
|
-
props: {
|
|
88
|
-
ref: hiddenInputRef,
|
|
89
|
-
id: inputId,
|
|
90
|
-
type: "file",
|
|
91
|
-
"data-part": "input",
|
|
92
|
-
tabIndex: -1,
|
|
93
|
-
accept: accept.length > 0 ? accept.join(",") : void 0,
|
|
94
|
-
multiple: multiple || void 0,
|
|
95
|
-
style: {
|
|
96
|
-
border: 0,
|
|
97
|
-
clip: "rect(0 0 0 0)",
|
|
98
|
-
height: "1px",
|
|
99
|
-
margin: "-1px",
|
|
100
|
-
overflow: "hidden",
|
|
101
|
-
padding: 0,
|
|
102
|
-
position: "absolute",
|
|
103
|
-
whiteSpace: "nowrap",
|
|
104
|
-
width: "1px"
|
|
105
|
-
},
|
|
106
|
-
disabled: disabled || void 0,
|
|
107
|
-
...className ? { className } : {},
|
|
108
|
-
onChange(event) {
|
|
109
|
-
const list = event.currentTarget.files;
|
|
110
|
-
if (list) processFiles(list);
|
|
111
|
-
event.currentTarget.value = "";
|
|
112
|
-
}
|
|
113
|
-
},
|
|
114
|
-
state: { disabled }
|
|
115
|
-
});
|
|
116
|
-
}
|
|
4
|
+
import { FileUploadRoot, FileUploadRootClient } from "./FileUploadRoot.js";
|
|
5
|
+
import { FileUploadHiddenInput } from "./FileUploadInput.js";
|
|
6
|
+
import { useFileUploadContext } from "./file-upload-context.js";
|
|
117
7
|
function FileUploadTrigger(props) {
|
|
118
8
|
const { as, render, className, children, ...consumerProps } = props;
|
|
119
9
|
const { disabled, inputId, openPicker } = useFileUploadContext("Trigger");
|
|
@@ -121,6 +11,7 @@ function FileUploadTrigger(props) {
|
|
|
121
11
|
const { onClick: consumerOnClick } = consumerProps;
|
|
122
12
|
const interactiveProps = tag === "button" ? {
|
|
123
13
|
type: "button",
|
|
14
|
+
"data-uiify-button": "",
|
|
124
15
|
"aria-controls": inputId,
|
|
125
16
|
disabled: disabled || void 0,
|
|
126
17
|
onClick: composeEventHandlers(consumerOnClick, openPicker)
|
|
@@ -171,17 +62,22 @@ function FileUploadDropzone(props) {
|
|
|
171
62
|
});
|
|
172
63
|
}
|
|
173
64
|
function FileUploadList(props) {
|
|
174
|
-
const { children,
|
|
65
|
+
const { children, ...consumerProps } = props;
|
|
66
|
+
const { files } = useFileUploadContext("List");
|
|
175
67
|
return useRenderElement({
|
|
176
68
|
defaultTag: "ul",
|
|
177
|
-
props: {
|
|
69
|
+
props: {
|
|
70
|
+
...consumerProps,
|
|
71
|
+
role: "list",
|
|
72
|
+
"data-part": "list",
|
|
73
|
+
children: typeof children === "function" ? children(files) : children
|
|
74
|
+
},
|
|
178
75
|
state: {}
|
|
179
76
|
});
|
|
180
77
|
}
|
|
181
78
|
function FileUploadItem(props) {
|
|
182
79
|
const { as, render, children, className, index, ...consumerProps } = props;
|
|
183
|
-
const {
|
|
184
|
-
const files = useSyncExternalStore(store.subscribe, store.getFiles, store.getFiles);
|
|
80
|
+
const { files } = useFileUploadContext("Item");
|
|
185
81
|
const file = files[index];
|
|
186
82
|
const element = useRenderElement({
|
|
187
83
|
as,
|
|
@@ -201,17 +97,27 @@ function FileUploadItem(props) {
|
|
|
201
97
|
return element;
|
|
202
98
|
}
|
|
203
99
|
function FileUploadItemRemove(props) {
|
|
204
|
-
const {
|
|
205
|
-
|
|
100
|
+
const {
|
|
101
|
+
index,
|
|
102
|
+
onClick,
|
|
103
|
+
disabled: consumerDisabled = false,
|
|
104
|
+
children = "\xD7",
|
|
105
|
+
...consumerProps
|
|
106
|
+
} = props;
|
|
107
|
+
const { disabled: rootDisabled, removeAt } = useFileUploadContext("ItemRemove");
|
|
108
|
+
const disabled = rootDisabled || consumerDisabled;
|
|
206
109
|
return useRenderElement({
|
|
207
110
|
defaultTag: "button",
|
|
208
111
|
props: {
|
|
209
112
|
type: "button",
|
|
210
|
-
|
|
113
|
+
...consumerProps,
|
|
114
|
+
"aria-label": consumerProps["aria-label"] ?? "Remove file",
|
|
115
|
+
children,
|
|
211
116
|
"data-part": "remove",
|
|
212
117
|
disabled: disabled || void 0,
|
|
213
|
-
|
|
214
|
-
|
|
118
|
+
onClick: composeEventHandlers(onClick, () => {
|
|
119
|
+
if (!disabled) removeAt(index);
|
|
120
|
+
})
|
|
215
121
|
},
|
|
216
122
|
state: { disabled }
|
|
217
123
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/file-upload/FileUpload.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\";\nimport type { ElementType, DragEvent, ReactElement, SyntheticEvent } from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { createFileUploadStore, validateFiles } from \"./file-upload-store.js\";\nimport type {\n FileUploadStore,\n FileUploadContextValue,\n FileUploadRootProps,\n FileUploadHiddenInputOwnProps,\n FileUploadTriggerProps,\n FileUploadDropzoneProps,\n FileUploadListOwnProps,\n FileUploadItemProps,\n FileUploadItemRemoveOwnProps,\n} from \"./types.js\";\n\nconst [FileUploadProvider, useFileUploadContext] =\n createPartContext<FileUploadContextValue>(\"FileUpload\");\n\nexport function FileUploadRootClient(props: FileUploadRootProps): ReactElement | null {\n const {\n accept = [],\n className,\n children,\n defaultValue = [],\n disabled = false,\n maxFiles,\n maxSize,\n minSize,\n multiple = false,\n onValueChange,\n onReject,\n value: controlledValue,\n } = props;\n\n const inputId = useId();\n const hiddenInputRef = useRef<HTMLInputElement | null>(null);\n const [files, setFiles] = useControllableState<File[]>({\n defaultValue: [...defaultValue],\n ...(controlledValue !== undefined ? { value: [...controlledValue] } : {}),\n ...(onValueChange ? { onChange: onValueChange } : {}),\n });\n\n const storeRef = useRef<FileUploadStore | null>(null);\n storeRef.current ??= createFileUploadStore(files);\n const store = storeRef.current;\n\n const processFiles = useCallback(\n (list: FileList | readonly File[]) => {\n if (disabled) return;\n const incoming = Array.from(list);\n const { accepted, rejected } = validateFiles(incoming, {\n accept,\n multiple,\n ...(maxFiles !== undefined ? { maxFiles } : {}),\n ...(maxSize !== undefined ? { maxSize } : {}),\n ...(minSize !== undefined ? { minSize } : {}),\n });\n if (rejected.length > 0) onReject?.(rejected);\n if (accepted.length === 0) return;\n const next = multiple ? [...store.getFiles(), ...accepted] : accepted;\n store.setFiles(next);\n setFiles(next);\n },\n [accept, disabled, maxFiles, maxSize, minSize, multiple, onReject, setFiles, store],\n );\n\n const openPicker = useCallback(() => {\n hiddenInputRef.current?.click();\n }, []);\n\n const removeAt = useCallback(\n (index: number) => {\n store.removeAt(index);\n setFiles(store.getFiles());\n },\n [setFiles, store],\n );\n\n const contextValue = useMemo(\n () => ({\n accept,\n disabled,\n hiddenInputRef,\n inputId,\n multiple,\n openPicker,\n processFiles,\n removeAt,\n store,\n }),\n [accept, disabled, inputId, multiple, openPicker, processFiles, removeAt, store],\n );\n\n return (\n <div className={className} data-uiify-file-upload=\"\">\n <FileUploadProvider value={contextValue}>{children}</FileUploadProvider>\n </div>\n );\n}\nFileUploadRootClient.displayName = \"FileUploadRootClient\";\n\nexport const FileUploadRoot = FileUploadRootClient;\n\nexport function FileUploadHiddenInput(props: FileUploadHiddenInputOwnProps): ReactElement | null {\n const { className } = props;\n const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles } =\n useFileUploadContext(\"HiddenInput\");\n\n return useRenderElement({\n defaultTag: \"input\",\n props: {\n ref: hiddenInputRef,\n id: inputId,\n type: \"file\",\n \"data-part\": \"input\",\n tabIndex: -1,\n accept: accept.length > 0 ? accept.join(\",\") : undefined,\n multiple: multiple || undefined,\n style: {\n border: 0,\n clip: \"rect(0 0 0 0)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: 0,\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n disabled: disabled || undefined,\n ...(className ? { className } : {}),\n onChange(event: SyntheticEvent<HTMLInputElement>) {\n const list = event.currentTarget.files;\n if (list) processFiles(list);\n event.currentTarget.value = \"\";\n },\n },\n state: { disabled },\n });\n}\n\nexport function FileUploadTrigger<TAs extends ElementType = \"label\">(\n props: FileUploadTriggerProps<TAs>,\n): ReactElement | null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadTriggerProps<ElementType>;\n const { disabled, inputId, openPicker } = useFileUploadContext(\"Trigger\");\n const tag = typeof as === \"string\" ? as : undefined;\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n const interactiveProps =\n tag === \"button\"\n ? {\n type: \"button\" as const,\n \"aria-controls\": inputId,\n disabled: disabled || undefined,\n onClick: composeEventHandlers(consumerOnClick, openPicker),\n }\n : {\n htmlFor: inputId,\n \"aria-controls\": inputId,\n };\n\n return useRenderElement({\n as,\n defaultTag: \"label\",\n props: {\n ...consumerProps,\n ...interactiveProps,\n \"data-part\": \"trigger\",\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadDropzone<TAs extends ElementType = \"div\">(\n props: FileUploadDropzoneProps<TAs>,\n): ReactElement | null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadDropzoneProps<\"div\">;\n const { disabled, processFiles } = useFileUploadContext(\"Dropzone\");\n const { onDragOver: consumerOnDragOver, onDrop: consumerOnDrop } = consumerProps as {\n onDragOver?: (event: DragEvent<HTMLElement>) => void;\n onDrop?: (event: DragEvent<HTMLElement>) => void;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n role: \"region\",\n \"data-part\": \"dropzone\",\n \"aria-label\": \"Drop files here\",\n \"data-disabled\": disabled ? \"\" : undefined,\n onDragOver: composeEventHandlers(consumerOnDragOver, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n }),\n onDrop: composeEventHandlers(consumerOnDrop, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n if (disabled) return;\n processFiles(event.dataTransfer.files);\n }),\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadList(props: FileUploadListOwnProps): ReactElement | null {\n const { children, className } = props;\n return useRenderElement({\n defaultTag: \"ul\",\n props: { role: \"list\", \"data-part\": \"list\", ...(className ? { className } : {}), children },\n state: {},\n });\n}\n\nexport function FileUploadItem<TAs extends ElementType = \"li\">(\n props: FileUploadItemProps<TAs>,\n): ReactElement | null {\n const { as, render, children, className, index, ...consumerProps } =\n props as FileUploadItemProps<\"li\">;\n const { store } = useFileUploadContext(\"Item\");\n const files = useSyncExternalStore(store.subscribe, store.getFiles, store.getFiles);\n const file = files[index];\n\n const element = useRenderElement({\n as,\n defaultTag: \"li\",\n props: {\n ...consumerProps,\n role: \"listitem\",\n \"data-part\": \"item\",\n \"data-name\": file?.name,\n ...(className ? { className } : {}),\n children: children ?? file?.name,\n },\n render,\n state: { index },\n });\n\n if (!file) return null;\n return element;\n}\n\nexport function FileUploadItemRemove(props: FileUploadItemRemoveOwnProps): ReactElement | null {\n const { className, index } = props;\n const { disabled, removeAt } = useFileUploadContext(\"ItemRemove\");\n\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n type: \"button\",\n \"aria-label\": \"Remove file\",\n \"data-part\": \"remove\",\n disabled: disabled || undefined,\n ...(className ? { className } : {}),\n onClick: () => removeAt(index),\n },\n state: { disabled },\n });\n}\n\nexport const FileUpload = {\n Dropzone: FileUploadDropzone,\n HiddenInput: FileUploadHiddenInput,\n Item: FileUploadItem,\n ItemRemove: FileUploadItemRemove,\n List: FileUploadList,\n Root: FileUploadRoot,\n Trigger: FileUploadTrigger,\n};\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/file-upload/FileUpload.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ElementType, DragEvent, ReactElement, SyntheticEvent } from \"react\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { FileUploadRoot, FileUploadRootClient } from \"./FileUploadRoot.js\";\nimport { FileUploadHiddenInput } from \"./FileUploadInput.js\";\nimport { useFileUploadContext } from \"./file-upload-context.js\";\nimport type {\n FileUploadTriggerProps,\n FileUploadDropzoneProps,\n FileUploadListOwnProps,\n FileUploadItemProps,\n FileUploadItemRemoveOwnProps,\n} from \"./types.js\";\nexport { FileUploadRoot, FileUploadRootClient, FileUploadHiddenInput };\n\nexport function FileUploadTrigger<TAs extends ElementType = \"label\">(\n props: FileUploadTriggerProps<TAs>,\n): ReactElement | null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadTriggerProps<ElementType>;\n const { disabled, inputId, openPicker } = useFileUploadContext(\"Trigger\");\n const tag = typeof as === \"string\" ? as : undefined;\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n const interactiveProps =\n tag === \"button\"\n ? {\n type: \"button\" as const,\n \"data-uiify-button\": \"\",\n \"aria-controls\": inputId,\n disabled: disabled || undefined,\n onClick: composeEventHandlers(consumerOnClick, openPicker),\n }\n : {\n htmlFor: inputId,\n \"aria-controls\": inputId,\n };\n\n return useRenderElement({\n as,\n defaultTag: \"label\",\n props: {\n ...consumerProps,\n ...interactiveProps,\n \"data-part\": \"trigger\",\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadDropzone<TAs extends ElementType = \"div\">(\n props: FileUploadDropzoneProps<TAs>,\n): ReactElement | null {\n const { as, render, className, children, ...consumerProps } =\n props as FileUploadDropzoneProps<\"div\">;\n const { disabled, processFiles } = useFileUploadContext(\"Dropzone\");\n const { onDragOver: consumerOnDragOver, onDrop: consumerOnDrop } = consumerProps as {\n onDragOver?: (event: DragEvent<HTMLElement>) => void;\n onDrop?: (event: DragEvent<HTMLElement>) => void;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n role: \"region\",\n \"data-part\": \"dropzone\",\n \"aria-label\": \"Drop files here\",\n \"data-disabled\": disabled ? \"\" : undefined,\n onDragOver: composeEventHandlers(consumerOnDragOver, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n }),\n onDrop: composeEventHandlers(consumerOnDrop, (event: DragEvent<HTMLElement>) => {\n event.preventDefault();\n if (disabled) return;\n processFiles(event.dataTransfer.files);\n }),\n ...(className ? { className } : {}),\n children,\n },\n render,\n state: { disabled },\n });\n}\n\nexport function FileUploadList(props: FileUploadListOwnProps): ReactElement | null {\n const { children, ...consumerProps } = props;\n const { files } = useFileUploadContext(\"List\");\n return useRenderElement({\n defaultTag: \"ul\",\n props: {\n ...consumerProps,\n role: \"list\",\n \"data-part\": \"list\",\n children: typeof children === \"function\" ? children(files) : children,\n },\n state: {},\n });\n}\n\nexport function FileUploadItem<TAs extends ElementType = \"li\">(\n props: FileUploadItemProps<TAs>,\n): ReactElement | null {\n const { as, render, children, className, index, ...consumerProps } =\n props as FileUploadItemProps<\"li\">;\n const { files } = useFileUploadContext(\"Item\");\n const file = files[index];\n\n const element = useRenderElement({\n as,\n defaultTag: \"li\",\n props: {\n ...consumerProps,\n role: \"listitem\",\n \"data-part\": \"item\",\n \"data-name\": file?.name,\n ...(className ? { className } : {}),\n children: children ?? file?.name,\n },\n render,\n state: { index },\n });\n\n if (!file) return null;\n return element;\n}\n\nexport function FileUploadItemRemove(props: FileUploadItemRemoveOwnProps): ReactElement | null {\n const {\n index,\n onClick,\n disabled: consumerDisabled = false,\n children = \"×\",\n ...consumerProps\n } = props;\n const { disabled: rootDisabled, removeAt } = useFileUploadContext(\"ItemRemove\");\n\n const disabled = rootDisabled || consumerDisabled;\n return useRenderElement({\n defaultTag: \"button\",\n props: {\n type: \"button\",\n ...consumerProps,\n \"aria-label\": consumerProps[\"aria-label\"] ?? \"Remove file\",\n children,\n \"data-part\": \"remove\",\n disabled: disabled || undefined,\n onClick: composeEventHandlers(onClick, () => {\n if (!disabled) removeAt(index);\n }),\n },\n state: { disabled },\n });\n}\n\nexport const FileUpload = {\n Dropzone: FileUploadDropzone,\n HiddenInput: FileUploadHiddenInput,\n Item: FileUploadItem,\n ItemRemove: FileUploadItemRemove,\n List: FileUploadList,\n Root: FileUploadRoot,\n Trigger: FileUploadTrigger,\n};\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { ReactElement } from "react";
|
|
2
|
+
import type { FileUploadHiddenInputOwnProps } from "./types.js";
|
|
3
|
+
export declare function FileUploadHiddenInput({ ref, onChange, onClick, ...consumerProps }: FileUploadHiddenInputOwnProps): ReactElement;
|
|
4
|
+
export declare namespace FileUploadHiddenInput {
|
|
5
|
+
var displayName: string;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=FileUploadInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FileUploadInput.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/FileUploadInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,YAAY,CAAC;AAEhE,wBAAgB,qBAAqB,CAAC,EACpC,GAAG,EACH,QAAQ,EACR,OAAO,EACP,GAAG,aAAa,EACjB,EAAE,6BAA6B,GAAG,YAAY,CA8C9C;yBAnDe,qBAAqB"}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect } from "react";
|
|
4
|
+
import { useMergedRefs } from "@gunkin/uiify/hooks";
|
|
5
|
+
import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
|
|
6
|
+
import { useFileUploadContext } from "./file-upload-context.js";
|
|
7
|
+
function FileUploadHiddenInput({
|
|
8
|
+
ref,
|
|
9
|
+
onChange,
|
|
10
|
+
onClick,
|
|
11
|
+
...consumerProps
|
|
12
|
+
}) {
|
|
13
|
+
const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles, files, reset } = useFileUploadContext("HiddenInput");
|
|
14
|
+
const mergedRef = useMergedRefs(ref, hiddenInputRef);
|
|
15
|
+
const syncFiles = () => {
|
|
16
|
+
if (typeof DataTransfer === "undefined" || !hiddenInputRef.current) return;
|
|
17
|
+
const transfer = new DataTransfer();
|
|
18
|
+
files.forEach((file) => transfer.items.add(file));
|
|
19
|
+
hiddenInputRef.current.files = transfer.files;
|
|
20
|
+
};
|
|
21
|
+
useEffect(() => {
|
|
22
|
+
syncFiles();
|
|
23
|
+
const input = hiddenInputRef.current;
|
|
24
|
+
input?.addEventListener("cancel", syncFiles);
|
|
25
|
+
return () => input?.removeEventListener("cancel", syncFiles);
|
|
26
|
+
}, [files, hiddenInputRef]);
|
|
27
|
+
useEffect(() => {
|
|
28
|
+
const form = hiddenInputRef.current?.form;
|
|
29
|
+
if (!form) return;
|
|
30
|
+
form.addEventListener("reset", reset);
|
|
31
|
+
return () => form.removeEventListener("reset", reset);
|
|
32
|
+
}, [hiddenInputRef, reset]);
|
|
33
|
+
return /* @__PURE__ */ jsx(
|
|
34
|
+
"input",
|
|
35
|
+
{
|
|
36
|
+
...consumerProps,
|
|
37
|
+
ref: mergedRef,
|
|
38
|
+
id: inputId,
|
|
39
|
+
type: "file",
|
|
40
|
+
"data-part": "input",
|
|
41
|
+
accept: accept.length ? accept.join(",") : void 0,
|
|
42
|
+
disabled,
|
|
43
|
+
multiple,
|
|
44
|
+
onClick: composeEventHandlers(onClick, (event) => {
|
|
45
|
+
event.currentTarget.value = "";
|
|
46
|
+
}),
|
|
47
|
+
onChange: (event) => {
|
|
48
|
+
composeEventHandlers(onChange, (change) => {
|
|
49
|
+
if (change.currentTarget.files) processFiles(change.currentTarget.files);
|
|
50
|
+
})(event);
|
|
51
|
+
syncFiles();
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
);
|
|
55
|
+
}
|
|
56
|
+
FileUploadHiddenInput.displayName = "FileUploadHiddenInput";
|
|
57
|
+
export {
|
|
58
|
+
FileUploadHiddenInput
|
|
59
|
+
};
|
|
60
|
+
//# sourceMappingURL=FileUploadInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/file-upload/FileUploadInput.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect } from \"react\";\nimport type { ReactElement } from \"react\";\nimport { useMergedRefs } from \"@gunkin/uiify/hooks\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useFileUploadContext } from \"./file-upload-context.js\";\nimport type { FileUploadHiddenInputOwnProps } from \"./types.js\";\n\nexport function FileUploadHiddenInput({\n ref,\n onChange,\n onClick,\n ...consumerProps\n}: FileUploadHiddenInputOwnProps): ReactElement {\n const { accept, disabled, hiddenInputRef, inputId, multiple, processFiles, files, reset } =\n useFileUploadContext(\"HiddenInput\");\n const mergedRef = useMergedRefs(ref, hiddenInputRef);\n const syncFiles = () => {\n // DOM-less consumers do not provide a native file-list constructor.\n if (typeof DataTransfer === \"undefined\" || !hiddenInputRef.current) return;\n const transfer = new DataTransfer();\n files.forEach((file) => transfer.items.add(file));\n hiddenInputRef.current.files = transfer.files;\n };\n useEffect(() => {\n syncFiles();\n const input = hiddenInputRef.current;\n input?.addEventListener(\"cancel\", syncFiles);\n return () => input?.removeEventListener(\"cancel\", syncFiles);\n }, [files, hiddenInputRef]);\n useEffect(() => {\n const form = hiddenInputRef.current?.form;\n if (!form) return;\n form.addEventListener(\"reset\", reset);\n return () => form.removeEventListener(\"reset\", reset);\n }, [hiddenInputRef, reset]);\n return (\n <input\n {...consumerProps}\n ref={mergedRef}\n id={inputId}\n type=\"file\"\n data-part=\"input\"\n accept={accept.length ? accept.join(\",\") : undefined}\n disabled={disabled}\n multiple={multiple}\n onClick={composeEventHandlers(onClick, (event) => {\n // Clearing immediately before the picker makes same-file selection emit change.\n event.currentTarget.value = \"\";\n })}\n onChange={(event) => {\n composeEventHandlers(onChange, (change) => {\n if (change.currentTarget.files) processFiles(change.currentTarget.files);\n })(event);\n // Restore authoritative files even if every picked file was rejected or vetoed.\n syncFiles();\n }}\n />\n );\n}\nFileUploadHiddenInput.displayName = \"FileUploadHiddenInput\";\n"],"mappings":";AAqCI;AApCJ,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AAG9B,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAgD;AAC9C,QAAM,EAAE,QAAQ,UAAU,gBAAgB,SAAS,UAAU,cAAc,OAAO,MAAM,IACtF,qBAAqB,aAAa;AACpC,QAAM,YAAY,cAAc,KAAK,cAAc;AACnD,QAAM,YAAY,MAAM;AAEtB,QAAI,OAAO,iBAAiB,eAAe,CAAC,eAAe,QAAS;AACpE,UAAM,WAAW,IAAI,aAAa;AAClC,UAAM,QAAQ,CAAC,SAAS,SAAS,MAAM,IAAI,IAAI,CAAC;AAChD,mBAAe,QAAQ,QAAQ,SAAS;AAAA,EAC1C;AACA,YAAU,MAAM;AACd,cAAU;AACV,UAAM,QAAQ,eAAe;AAC7B,WAAO,iBAAiB,UAAU,SAAS;AAC3C,WAAO,MAAM,OAAO,oBAAoB,UAAU,SAAS;AAAA,EAC7D,GAAG,CAAC,OAAO,cAAc,CAAC;AAC1B,YAAU,MAAM;AACd,UAAM,OAAO,eAAe,SAAS;AACrC,QAAI,CAAC,KAAM;AACX,SAAK,iBAAiB,SAAS,KAAK;AACpC,WAAO,MAAM,KAAK,oBAAoB,SAAS,KAAK;AAAA,EACtD,GAAG,CAAC,gBAAgB,KAAK,CAAC;AAC1B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,aAAU;AAAA,MACV,QAAQ,OAAO,SAAS,OAAO,KAAK,GAAG,IAAI;AAAA,MAC3C;AAAA,MACA;AAAA,MACA,SAAS,qBAAqB,SAAS,CAAC,UAAU;AAEhD,cAAM,cAAc,QAAQ;AAAA,MAC9B,CAAC;AAAA,MACD,UAAU,CAAC,UAAU;AACnB,6BAAqB,UAAU,CAAC,WAAW;AACzC,cAAI,OAAO,cAAc,MAAO,cAAa,OAAO,cAAc,KAAK;AAAA,QACzE,CAAC,EAAE,KAAK;AAER,kBAAU;AAAA,MACZ;AAAA;AAAA,EACF;AAEJ;AACA,sBAAsB,cAAc;","names":[]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { type ReactElement } from "react";
|
|
2
|
+
import type { FileUploadRootProps } from "./types.js";
|
|
3
|
+
export declare function FileUploadRootClient({ accept, children, defaultValue, disabled, maxFiles, maxSize, minSize, multiple, onValueChange, onReject, value, ...consumerProps }: FileUploadRootProps): ReactElement;
|
|
4
|
+
export declare namespace FileUploadRootClient {
|
|
5
|
+
var displayName: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const FileUploadRoot: typeof FileUploadRootClient;
|
|
8
|
+
//# sourceMappingURL=FileUploadRoot.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FileUploadRoot.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/FileUploadRoot.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAIlD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAEtD,wBAAgB,oBAAoB,CAAC,EACnC,MAAW,EACX,QAAQ,EACR,YAAiB,EACjB,QAAgB,EAChB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,QAAgB,EAChB,aAAa,EACb,QAAQ,EACR,KAAK,EACL,GAAG,aAAa,EACjB,EAAE,mBAAmB,GAAG,YAAY,CA+CpC;yBA5De,oBAAoB;;;AA8DpC,eAAO,MAAM,cAAc,6BAAuB,CAAC"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useRef } from "react";
|
|
4
|
+
import { useControllableState, useId } from "@gunkin/uiify/hooks";
|
|
5
|
+
import { FileUploadProvider } from "./file-upload-context.js";
|
|
6
|
+
import { validateFiles } from "./file-upload-store.js";
|
|
7
|
+
function FileUploadRootClient({
|
|
8
|
+
accept = [],
|
|
9
|
+
children,
|
|
10
|
+
defaultValue = [],
|
|
11
|
+
disabled = false,
|
|
12
|
+
maxFiles,
|
|
13
|
+
maxSize,
|
|
14
|
+
minSize,
|
|
15
|
+
multiple = false,
|
|
16
|
+
onValueChange,
|
|
17
|
+
onReject,
|
|
18
|
+
value,
|
|
19
|
+
...consumerProps
|
|
20
|
+
}) {
|
|
21
|
+
const inputId = useId();
|
|
22
|
+
const hiddenInputRef = useRef(null);
|
|
23
|
+
const [files, setFiles] = useControllableState({
|
|
24
|
+
value,
|
|
25
|
+
defaultValue,
|
|
26
|
+
onChange: (next) => onValueChange?.([...next])
|
|
27
|
+
});
|
|
28
|
+
const processFiles = (list) => {
|
|
29
|
+
if (disabled) return;
|
|
30
|
+
const { accepted, rejected } = validateFiles(Array.from(list), {
|
|
31
|
+
accept,
|
|
32
|
+
multiple,
|
|
33
|
+
...maxFiles === void 0 ? {} : { maxFiles: multiple ? Math.max(0, maxFiles - files.length) : maxFiles },
|
|
34
|
+
...maxSize === void 0 ? {} : { maxSize },
|
|
35
|
+
...minSize === void 0 ? {} : { minSize }
|
|
36
|
+
});
|
|
37
|
+
if (rejected.length) onReject?.(rejected);
|
|
38
|
+
if (accepted.length) setFiles(multiple ? [...files, ...accepted] : accepted);
|
|
39
|
+
};
|
|
40
|
+
return /* @__PURE__ */ jsx("div", { ...consumerProps, "data-uiify-file-upload": "", "data-disabled": disabled ? "" : void 0, children: /* @__PURE__ */ jsx(
|
|
41
|
+
FileUploadProvider,
|
|
42
|
+
{
|
|
43
|
+
value: {
|
|
44
|
+
accept,
|
|
45
|
+
disabled,
|
|
46
|
+
files,
|
|
47
|
+
hiddenInputRef,
|
|
48
|
+
inputId,
|
|
49
|
+
multiple,
|
|
50
|
+
processFiles,
|
|
51
|
+
reset: () => setFiles([]),
|
|
52
|
+
openPicker: () => {
|
|
53
|
+
if (!disabled) hiddenInputRef.current?.click();
|
|
54
|
+
},
|
|
55
|
+
removeAt: (index) => {
|
|
56
|
+
if (!disabled && index >= 0 && index < files.length)
|
|
57
|
+
setFiles(files.filter((_, i) => i !== index));
|
|
58
|
+
}
|
|
59
|
+
},
|
|
60
|
+
children
|
|
61
|
+
}
|
|
62
|
+
) });
|
|
63
|
+
}
|
|
64
|
+
FileUploadRootClient.displayName = "FileUploadRootClient";
|
|
65
|
+
const FileUploadRoot = FileUploadRootClient;
|
|
66
|
+
export {
|
|
67
|
+
FileUploadRoot,
|
|
68
|
+
FileUploadRootClient
|
|
69
|
+
};
|
|
70
|
+
//# sourceMappingURL=FileUploadRoot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/file-upload/FileUploadRoot.tsx"],"sourcesContent":["\"use client\";\nimport { useRef, type ReactElement } from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { FileUploadProvider } from \"./file-upload-context.js\";\nimport { validateFiles } from \"./file-upload-store.js\";\nimport type { FileUploadRootProps } from \"./types.js\";\n\nexport function FileUploadRootClient({\n accept = [],\n children,\n defaultValue = [],\n disabled = false,\n maxFiles,\n maxSize,\n minSize,\n multiple = false,\n onValueChange,\n onReject,\n value,\n ...consumerProps\n}: FileUploadRootProps): ReactElement {\n const inputId = useId();\n const hiddenInputRef = useRef<HTMLInputElement | null>(null);\n const [files, setFiles] = useControllableState<readonly File[]>({\n value,\n defaultValue,\n onChange: (next) => onValueChange?.([...next]),\n });\n const processFiles = (list: FileList | readonly File[]) => {\n if (disabled) return;\n const { accepted, rejected } = validateFiles(Array.from(list), {\n accept,\n multiple,\n ...(maxFiles === undefined\n ? {}\n : { maxFiles: multiple ? Math.max(0, maxFiles - files.length) : maxFiles }),\n ...(maxSize === undefined ? {} : { maxSize }),\n ...(minSize === undefined ? {} : { minSize }),\n });\n if (rejected.length) onReject?.(rejected);\n if (accepted.length) setFiles(multiple ? [...files, ...accepted] : accepted);\n };\n return (\n <div {...consumerProps} data-uiify-file-upload=\"\" data-disabled={disabled ? \"\" : undefined}>\n <FileUploadProvider\n value={{\n accept,\n disabled,\n files,\n hiddenInputRef,\n inputId,\n multiple,\n processFiles,\n reset: () => setFiles([]),\n openPicker: () => {\n if (!disabled) hiddenInputRef.current?.click();\n },\n removeAt: (index) => {\n if (!disabled && index >= 0 && index < files.length)\n setFiles(files.filter((_, i) => i !== index));\n },\n }}\n >\n {children}\n </FileUploadProvider>\n </div>\n );\n}\nFileUploadRootClient.displayName = \"FileUploadRootClient\";\nexport const FileUploadRoot = FileUploadRootClient;\n"],"mappings":";AA4CM;AA3CN,SAAS,cAAiC;AAC1C,SAAS,sBAAsB,aAAa;AAC5C,SAAS,0BAA0B;AACnC,SAAS,qBAAqB;AAGvB,SAAS,qBAAqB;AAAA,EACnC,SAAS,CAAC;AAAA,EACV;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsC;AACpC,QAAM,UAAU,MAAM;AACtB,QAAM,iBAAiB,OAAgC,IAAI;AAC3D,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAAsC;AAAA,IAC9D;AAAA,IACA;AAAA,IACA,UAAU,CAAC,SAAS,gBAAgB,CAAC,GAAG,IAAI,CAAC;AAAA,EAC/C,CAAC;AACD,QAAM,eAAe,CAAC,SAAqC;AACzD,QAAI,SAAU;AACd,UAAM,EAAE,UAAU,SAAS,IAAI,cAAc,MAAM,KAAK,IAAI,GAAG;AAAA,MAC7D;AAAA,MACA;AAAA,MACA,GAAI,aAAa,SACb,CAAC,IACD,EAAE,UAAU,WAAW,KAAK,IAAI,GAAG,WAAW,MAAM,MAAM,IAAI,SAAS;AAAA,MAC3E,GAAI,YAAY,SAAY,CAAC,IAAI,EAAE,QAAQ;AAAA,MAC3C,GAAI,YAAY,SAAY,CAAC,IAAI,EAAE,QAAQ;AAAA,IAC7C,CAAC;AACD,QAAI,SAAS,OAAQ,YAAW,QAAQ;AACxC,QAAI,SAAS,OAAQ,UAAS,WAAW,CAAC,GAAG,OAAO,GAAG,QAAQ,IAAI,QAAQ;AAAA,EAC7E;AACA,SACE,oBAAC,SAAK,GAAG,eAAe,0BAAuB,IAAG,iBAAe,WAAW,KAAK,QAC/E;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,MAAM,SAAS,CAAC,CAAC;AAAA,QACxB,YAAY,MAAM;AAChB,cAAI,CAAC,SAAU,gBAAe,SAAS,MAAM;AAAA,QAC/C;AAAA,QACA,UAAU,CAAC,UAAU;AACnB,cAAI,CAAC,YAAY,SAAS,KAAK,QAAQ,MAAM;AAC3C,qBAAS,MAAM,OAAO,CAAC,GAAG,MAAM,MAAM,KAAK,CAAC;AAAA,QAChD;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;AACA,qBAAqB,cAAc;AAC5B,MAAM,iBAAiB;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"file-upload-context.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/file-upload-context.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAEzD,eAAO,MAAO,kBAAkB,2DAAE,oBAAoB,0CACG,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { createPartContext } from "@gunkin/uiify/core";
|
|
3
|
+
const [FileUploadProvider, useFileUploadContext] = createPartContext("FileUpload");
|
|
4
|
+
export {
|
|
5
|
+
FileUploadProvider,
|
|
6
|
+
useFileUploadContext
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=file-upload-context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/file-upload/file-upload-context.ts"],"sourcesContent":["\"use client\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport type { FileUploadContextValue } from \"./types.js\";\n\nexport const [FileUploadProvider, useFileUploadContext] =\n createPartContext<FileUploadContextValue>(\"FileUpload\");\n"],"mappings":";AACA,SAAS,yBAAyB;AAG3B,MAAM,CAAC,oBAAoB,oBAAoB,IACpD,kBAA0C,YAAY;","names":[]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { FileUpload, FileUploadDropzone, FileUploadHiddenInput, FileUploadItem, FileUploadItemRemove, FileUploadList, FileUploadRoot, FileUploadTrigger, } from "./FileUpload.js";
|
|
2
|
-
export type { FileUploadDropzoneOwnProps, FileUploadDropzoneProps, FileUploadItemOwnProps, FileUploadItemProps, FileUploadRootOwnProps, FileUploadRootProps, FileUploadTriggerOwnProps, FileUploadTriggerProps, FileRejection, } from "./types.js";
|
|
2
|
+
export type { FileUploadDropzoneOwnProps, FileUploadDropzoneProps, FileUploadHiddenInputOwnProps, FileUploadListOwnProps, FileUploadItemRemoveOwnProps, FileUploadItemOwnProps, FileUploadItemProps, FileUploadRootOwnProps, FileUploadRootProps, FileUploadTriggerOwnProps, FileUploadTriggerProps, FileRejection, } from "./types.js";
|
|
3
3
|
export type { FileUploadStore } from "./types.js";
|
|
4
4
|
export { validateFiles } from "./file-upload-store.js";
|
|
5
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,kBAAkB,EAClB,qBAAqB,EACrB,cAAc,EACd,oBAAoB,EACpB,cAAc,EACd,cAAc,EACd,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,sBAAsB,EACtB,mBAAmB,EACnB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,sBAAsB,EACtB,aAAa,GACd,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,kBAAkB,EAClB,qBAAqB,EACrB,cAAc,EACd,oBAAoB,EACpB,cAAc,EACd,cAAc,EACd,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,6BAA6B,EAC7B,sBAAsB,EACtB,4BAA4B,EAC5B,sBAAsB,EACtB,mBAAmB,EACnB,sBAAsB,EACtB,mBAAmB,EACnB,yBAAyB,EACzB,sBAAsB,EACtB,aAAa,GACd,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/file-upload/index.ts"],"sourcesContent":["export {\n FileUpload,\n FileUploadDropzone,\n FileUploadHiddenInput,\n FileUploadItem,\n FileUploadItemRemove,\n FileUploadList,\n FileUploadRoot,\n FileUploadTrigger,\n} from \"./FileUpload.js\";\nexport type {\n FileUploadDropzoneOwnProps,\n FileUploadDropzoneProps,\n FileUploadItemOwnProps,\n FileUploadItemProps,\n FileUploadRootOwnProps,\n FileUploadRootProps,\n FileUploadTriggerOwnProps,\n FileUploadTriggerProps,\n FileRejection,\n} from \"./types.js\";\nexport type { FileUploadStore } from \"./types.js\";\nexport { validateFiles } from \"./file-upload-store.js\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;
|
|
1
|
+
{"version":3,"sources":["../../../src/components/file-upload/index.ts"],"sourcesContent":["export {\n FileUpload,\n FileUploadDropzone,\n FileUploadHiddenInput,\n FileUploadItem,\n FileUploadItemRemove,\n FileUploadList,\n FileUploadRoot,\n FileUploadTrigger,\n} from \"./FileUpload.js\";\nexport type {\n FileUploadDropzoneOwnProps,\n FileUploadDropzoneProps,\n FileUploadHiddenInputOwnProps,\n FileUploadListOwnProps,\n FileUploadItemRemoveOwnProps,\n FileUploadItemOwnProps,\n FileUploadItemProps,\n FileUploadRootOwnProps,\n FileUploadRootProps,\n FileUploadTriggerOwnProps,\n FileUploadTriggerProps,\n FileRejection,\n} from \"./types.js\";\nexport type { FileUploadStore } from \"./types.js\";\nexport { validateFiles } from \"./file-upload-store.js\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAgBP,SAAS,qBAAqB;","names":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ElementType, ReactNode, RefObject } from "react";
|
|
1
|
+
import type { ComponentPropsWithRef, ElementType, ReactNode, RefObject } from "react";
|
|
2
2
|
import type { RenderableProps } from "@gunkin/uiify/core/render";
|
|
3
3
|
export interface FileRejection {
|
|
4
4
|
readonly file: File;
|
|
@@ -28,7 +28,8 @@ export interface FileUploadContextValue {
|
|
|
28
28
|
readonly openPicker: () => void;
|
|
29
29
|
readonly processFiles: (list: FileList | readonly File[]) => void;
|
|
30
30
|
readonly removeAt: (index: number) => void;
|
|
31
|
-
readonly
|
|
31
|
+
readonly reset: () => void;
|
|
32
|
+
readonly files: readonly File[];
|
|
32
33
|
}
|
|
33
34
|
export interface FileUploadRootOwnProps {
|
|
34
35
|
readonly className?: string;
|
|
@@ -43,11 +44,10 @@ export interface FileUploadRootOwnProps {
|
|
|
43
44
|
readonly onReject?: (rejections: FileRejection[]) => void;
|
|
44
45
|
readonly value?: readonly File[];
|
|
45
46
|
}
|
|
46
|
-
export interface FileUploadRootProps extends FileUploadRootOwnProps {
|
|
47
|
+
export interface FileUploadRootProps extends FileUploadRootOwnProps, Omit<ComponentPropsWithRef<"div">, keyof FileUploadRootOwnProps | "defaultValue"> {
|
|
47
48
|
readonly children?: ReactNode;
|
|
48
49
|
}
|
|
49
|
-
export interface FileUploadHiddenInputOwnProps {
|
|
50
|
-
readonly className?: string;
|
|
50
|
+
export interface FileUploadHiddenInputOwnProps extends Omit<ComponentPropsWithRef<"input">, "type" | "value" | "defaultValue" | "accept" | "multiple" | "disabled"> {
|
|
51
51
|
}
|
|
52
52
|
export interface FileUploadTriggerOwnProps {
|
|
53
53
|
readonly children?: ReactNode;
|
|
@@ -63,9 +63,8 @@ export interface FileUploadDropzoneOwnProps {
|
|
|
63
63
|
export type FileUploadDropzoneProps<TAs extends ElementType = "div"> = RenderableProps<TAs, FileUploadDropzoneOwnProps, {
|
|
64
64
|
disabled: boolean;
|
|
65
65
|
}, HTMLElement>;
|
|
66
|
-
export interface FileUploadListOwnProps {
|
|
67
|
-
readonly children?: ReactNode;
|
|
68
|
-
readonly className?: string;
|
|
66
|
+
export interface FileUploadListOwnProps extends Omit<ComponentPropsWithRef<"ul">, "children"> {
|
|
67
|
+
readonly children?: ReactNode | ((files: readonly File[]) => ReactNode);
|
|
69
68
|
}
|
|
70
69
|
export interface FileUploadItemOwnProps {
|
|
71
70
|
readonly children?: ReactNode;
|
|
@@ -75,8 +74,7 @@ export interface FileUploadItemOwnProps {
|
|
|
75
74
|
export type FileUploadItemProps<TAs extends ElementType = "li"> = RenderableProps<TAs, FileUploadItemOwnProps, {
|
|
76
75
|
index: number;
|
|
77
76
|
}, HTMLElement>;
|
|
78
|
-
export interface FileUploadItemRemoveOwnProps {
|
|
79
|
-
readonly className?: string;
|
|
77
|
+
export interface FileUploadItemRemoveOwnProps extends ComponentPropsWithRef<"button"> {
|
|
80
78
|
readonly index: number;
|
|
81
79
|
}
|
|
82
80
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAsB,YAAY,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,YAAY,CAAC;AAE1D,wBAAgB,IAAI,CAAC,GAAG,SAAS,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAsB,YAAY,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,YAAY,CAAC;AAE1D,wBAAgB,IAAI,CAAC,GAAG,SAAS,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,IAAI,CAyBjG"}
|
|
@@ -13,7 +13,8 @@ function Form(props) {
|
|
|
13
13
|
props: {
|
|
14
14
|
...consumerProps,
|
|
15
15
|
noValidate: validationBehavior === "aria" ? true : noValidate,
|
|
16
|
-
"data-validation-behavior": validationBehavior
|
|
16
|
+
"data-validation-behavior": validationBehavior,
|
|
17
|
+
"data-uiify-form": ""
|
|
17
18
|
},
|
|
18
19
|
render,
|
|
19
20
|
state: { validationBehavior }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/form/Form.tsx"],"sourcesContent":["import type { ElementType, FormHTMLAttributes, ReactElement } from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { FormOwnProps, FormProps } from \"./types.js\";\n\nexport function Form<TAs extends ElementType = \"form\">(props: FormProps<TAs>): ReactElement | null {\n const {\n as,\n render,\n validationBehavior = \"native\",\n noValidate,\n ...consumerProps\n } = props as FormOwnProps &\n FormHTMLAttributes<HTMLFormElement> & {\n as?: ElementType;\n render?: (props: Record<string, unknown>, state: FormOwnProps) => ReactElement | null;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"form\",\n props: {\n ...consumerProps,\n noValidate: validationBehavior === \"aria\" ? true : noValidate,\n \"data-validation-behavior\": validationBehavior,\n },\n render,\n state: { validationBehavior },\n });\n}\n"],"mappings":"AACA,SAAS,wBAAwB;AAG1B,SAAS,KAAuC,OAA4C;AACjG,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAMJ,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY;AAAA,IACZ,OAAO;AAAA,MACL,GAAG;AAAA,MACH,YAAY,uBAAuB,SAAS,OAAO;AAAA,MACnD,4BAA4B;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/form/Form.tsx"],"sourcesContent":["import type { ElementType, FormHTMLAttributes, ReactElement } from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { FormOwnProps, FormProps } from \"./types.js\";\n\nexport function Form<TAs extends ElementType = \"form\">(props: FormProps<TAs>): ReactElement | null {\n const {\n as,\n render,\n validationBehavior = \"native\",\n noValidate,\n ...consumerProps\n } = props as FormOwnProps &\n FormHTMLAttributes<HTMLFormElement> & {\n as?: ElementType;\n render?: (props: Record<string, unknown>, state: FormOwnProps) => ReactElement | null;\n };\n\n return useRenderElement({\n as,\n defaultTag: \"form\",\n props: {\n ...consumerProps,\n noValidate: validationBehavior === \"aria\" ? true : noValidate,\n \"data-validation-behavior\": validationBehavior,\n \"data-uiify-form\": \"\",\n },\n render,\n state: { validationBehavior },\n });\n}\n"],"mappings":"AACA,SAAS,wBAAwB;AAG1B,SAAS,KAAuC,OAA4C;AACjG,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAMJ,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY;AAAA,IACZ,OAAO;AAAA,MACL,GAAG;AAAA,MACH,YAAY,uBAAuB,SAAS,OAAO;AAAA,MACnD,4BAA4B;AAAA,MAC5B,mBAAmB;AAAA,IACrB;AAAA,IACA;AAAA,IACA,OAAO,EAAE,mBAAmB;AAAA,EAC9B,CAAC;AACH;","names":[]}
|
|
@@ -66,7 +66,7 @@ function HoverCardTrigger(props) {
|
|
|
66
66
|
...consumerStyle ? { style: consumerStyle } : {},
|
|
67
67
|
"aria-controls": contentId,
|
|
68
68
|
"aria-expanded": open,
|
|
69
|
-
...nativeButton ? { type: "button" } : {},
|
|
69
|
+
...nativeButton ? { type: "button", "data-uiify-button": "" } : {},
|
|
70
70
|
...className ? { className } : {},
|
|
71
71
|
onBlur: composeEventHandlers(consumerOnBlur, (event) => {
|
|
72
72
|
if (!event.currentTarget.contains(event.relatedTarget)) closeCard();
|