@nomos-ui/form 0.0.22 → 0.0.24
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/file-input.d.ts +50 -21
- package/dist/components/file-input.d.ts.map +1 -1
- package/dist/components/file-input.js +23 -36
- package/dist/components/file-input.js.map +1 -1
- package/dist/components/form-debug-info.d.ts +2 -1
- package/dist/components/form-debug-info.d.ts.map +1 -1
- package/dist/components/form-debug-info.js +2 -23
- package/dist/components/form-debug-info.js.map +1 -1
- package/dist/components/form-file-input.js +1 -1
- package/dist/components/form-file-input.js.map +1 -1
- package/package.json +3 -9
|
@@ -13,7 +13,7 @@ export type FileInputFile = {
|
|
|
13
13
|
*/
|
|
14
14
|
id: string;
|
|
15
15
|
};
|
|
16
|
-
|
|
16
|
+
type FileInputPropsBase = {
|
|
17
17
|
/** Additional class name for the root container. */
|
|
18
18
|
className?: string;
|
|
19
19
|
/** Additional class name applied to the dashed dropzone area. */
|
|
@@ -53,11 +53,37 @@ export type FileInputProps = {
|
|
|
53
53
|
* maxSize={50 * 1024 * 1024}
|
|
54
54
|
*/
|
|
55
55
|
maxSize?: number;
|
|
56
|
+
/**
|
|
57
|
+
* Fired when a file is rejected before being added to the list.
|
|
58
|
+
* Common reasons: file exceeds `maxSize`.
|
|
59
|
+
*
|
|
60
|
+
* @param message - A human-readable description of why the file was rejected.
|
|
61
|
+
*/
|
|
62
|
+
onError?: (message: string) => void;
|
|
63
|
+
/** Disables the dropzone click / drag and all per-file remove buttons. */
|
|
64
|
+
disabled?: boolean;
|
|
65
|
+
};
|
|
66
|
+
type FileInputPropsSingle = FileInputPropsBase & {
|
|
67
|
+
/**
|
|
68
|
+
* Allow the user to pick or drop more than one file at a time.
|
|
69
|
+
* When `false` (default) `onChange` receives a single `FileInputFile | null`.
|
|
70
|
+
*/
|
|
71
|
+
multiple?: false;
|
|
72
|
+
/** The currently selected file, or `null` when empty. */
|
|
73
|
+
value?: FileInputFile | null;
|
|
74
|
+
/**
|
|
75
|
+
* Fired whenever the selected file changes or is removed.
|
|
76
|
+
*
|
|
77
|
+
* @param file - The selected file, or `null` when cleared.
|
|
78
|
+
*/
|
|
79
|
+
onChange?: (file: FileInputFile | null) => void;
|
|
80
|
+
};
|
|
81
|
+
type FileInputPropsMultiple = FileInputPropsBase & {
|
|
56
82
|
/**
|
|
57
83
|
* Allow the user to pick or drop more than one file at a time.
|
|
58
|
-
* When `
|
|
84
|
+
* When `true` `onChange` receives the full updated `FileInputFile[]`.
|
|
59
85
|
*/
|
|
60
|
-
multiple
|
|
86
|
+
multiple: true;
|
|
61
87
|
/**
|
|
62
88
|
* Controlled list of currently accepted files.
|
|
63
89
|
* Pass an empty array (`[]`) to represent an empty / reset state.
|
|
@@ -69,15 +95,6 @@ export type FileInputProps = {
|
|
|
69
95
|
* @param files - The complete updated file list.
|
|
70
96
|
*/
|
|
71
97
|
onChange?: (files: FileInputFile[]) => void;
|
|
72
|
-
/**
|
|
73
|
-
* Fired when a file is rejected before being added to the list.
|
|
74
|
-
* Common reasons: file exceeds `maxSize`.
|
|
75
|
-
*
|
|
76
|
-
* @param message - A human-readable description of why the file was rejected.
|
|
77
|
-
*/
|
|
78
|
-
onError?: (message: string) => void;
|
|
79
|
-
/** Disables the dropzone click / drag and all per-file remove buttons. */
|
|
80
|
-
disabled?: boolean;
|
|
81
98
|
};
|
|
82
99
|
/**
|
|
83
100
|
* A file-upload input that follows the shadcn component ideology.
|
|
@@ -87,25 +104,37 @@ export type FileInputProps = {
|
|
|
87
104
|
* - Label + required sign + tip + error pattern identical to `Input` / `Textarea`
|
|
88
105
|
* - Drag-and-drop with a clear visual drag state
|
|
89
106
|
* - Per-file rows listing name, size, and a remove button
|
|
90
|
-
* - Single or multiple file support
|
|
107
|
+
* - Single or multiple file support — `onChange` type is narrowed automatically
|
|
91
108
|
*
|
|
92
|
-
* @example
|
|
109
|
+
* @example Single file
|
|
93
110
|
* ```tsx
|
|
94
|
-
* const [
|
|
111
|
+
* const [file, setFile] = React.useState<FileInputFile | null>(null);
|
|
95
112
|
*
|
|
96
113
|
* <FileInput
|
|
97
114
|
* label="Resume"
|
|
98
|
-
*
|
|
99
|
-
*
|
|
100
|
-
* accept=".pdf,.doc,.docx"
|
|
101
|
-
* acceptLabel="PDF, DOC, DOCX"
|
|
115
|
+
* accept=".pdf"
|
|
116
|
+
* acceptLabel="PDF"
|
|
102
117
|
* maxSize={50 * 1024 * 1024}
|
|
103
|
-
*
|
|
118
|
+
* value={file}
|
|
119
|
+
* onChange={setFile}
|
|
120
|
+
* />
|
|
121
|
+
* ```
|
|
122
|
+
*
|
|
123
|
+
* @example Multiple files
|
|
124
|
+
* ```tsx
|
|
125
|
+
* const [files, setFiles] = React.useState<FileInputFile[]>([]);
|
|
126
|
+
*
|
|
127
|
+
* <FileInput
|
|
128
|
+
* label="Attachments"
|
|
129
|
+
* multiple
|
|
130
|
+
* accept=".pdf,.docx"
|
|
131
|
+
* acceptLabel="PDF, DOCX"
|
|
104
132
|
* value={files}
|
|
105
133
|
* onChange={setFiles}
|
|
106
|
-
* onError={(msg) => toast.error(msg)}
|
|
107
134
|
* />
|
|
108
135
|
* ```
|
|
109
136
|
*/
|
|
137
|
+
export type FileInputProps = FileInputPropsSingle | FileInputPropsMultiple;
|
|
110
138
|
export default function FileInput({ className, dropzoneClassName, label, labelClassName, required, showRequiredSign, tip, error, accept, acceptLabel, maxSize, multiple, value, onChange, onError, disabled, }: FileInputProps): import("react/jsx-runtime").JSX.Element;
|
|
139
|
+
export {};
|
|
111
140
|
//# sourceMappingURL=file-input.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-input.d.ts","sourceRoot":"","sources":["../../src/components/file-input.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,wCAAwC;IACxC,IAAI,EAAE,IAAI,CAAC;IACX;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,
|
|
1
|
+
{"version":3,"file":"file-input.d.ts","sourceRoot":"","sources":["../../src/components/file-input.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,wCAAwC;IACxC,IAAI,EAAE,IAAI,CAAC;IACX;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,8CAA8C;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6EAA6E;IAC7E,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kFAAkF;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,KAAK,oBAAoB,GAAG,kBAAkB,GAAG;IAC/C;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,yDAAyD;IACzD,KAAK,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;CACjD,CAAC;AAEF,KAAK,sBAAsB,GAAG,kBAAkB,GAAG;IACjD;;;OAGG;IACH,QAAQ,EAAE,IAAI,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,sBAAsB,CAAC;AAY3E,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,SAAS,EACT,iBAAiB,EACjB,KAAK,EACL,cAAc,EACd,QAAgB,EAChB,gBAAwB,EACxB,GAAG,EACH,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAgB,EAChB,KAAK,EACL,QAAQ,EACR,OAAO,EACP,QAAgB,GACjB,EAAE,cAAc,2CA2KhB"}
|
|
@@ -38,7 +38,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
38
38
|
const React = __importStar(require("react"));
|
|
39
39
|
const lucide_react_1 = require("lucide-react");
|
|
40
40
|
const utils_1 = require("../utils/shadcn-ui/utils");
|
|
41
|
-
/** Converts a raw byte count into a human-readable string (B / KB / MB). */
|
|
42
41
|
function formatBytes(bytes) {
|
|
43
42
|
if (bytes < 1024)
|
|
44
43
|
return `${bytes} B`;
|
|
@@ -46,41 +45,17 @@ function formatBytes(bytes) {
|
|
|
46
45
|
return `${(bytes / 1024).toFixed(1)} KB`;
|
|
47
46
|
return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
|
|
48
47
|
}
|
|
49
|
-
/** Generates a short random alphanumeric ID used as a stable React key. */
|
|
50
48
|
function generateId() {
|
|
51
49
|
return Math.random().toString(36).slice(2, 9);
|
|
52
50
|
}
|
|
53
|
-
|
|
54
|
-
* A file-upload input that follows the shadcn component ideology.
|
|
55
|
-
*
|
|
56
|
-
* Features:
|
|
57
|
-
* - Semantic design tokens (`foreground`, `muted-foreground`, `destructive`, …)
|
|
58
|
-
* - Label + required sign + tip + error pattern identical to `Input` / `Textarea`
|
|
59
|
-
* - Drag-and-drop with a clear visual drag state
|
|
60
|
-
* - Per-file rows listing name, size, and a remove button
|
|
61
|
-
* - Single or multiple file support
|
|
62
|
-
*
|
|
63
|
-
* @example
|
|
64
|
-
* ```tsx
|
|
65
|
-
* const [files, setFiles] = React.useState<FileInputFile[]>([]);
|
|
66
|
-
*
|
|
67
|
-
* <FileInput
|
|
68
|
-
* label="Resume"
|
|
69
|
-
* required
|
|
70
|
-
* showRequiredSign
|
|
71
|
-
* accept=".pdf,.doc,.docx"
|
|
72
|
-
* acceptLabel="PDF, DOC, DOCX"
|
|
73
|
-
* maxSize={50 * 1024 * 1024}
|
|
74
|
-
* tip="Max 50 MB per file."
|
|
75
|
-
* value={files}
|
|
76
|
-
* onChange={setFiles}
|
|
77
|
-
* onError={(msg) => toast.error(msg)}
|
|
78
|
-
* />
|
|
79
|
-
* ```
|
|
80
|
-
*/
|
|
81
|
-
function FileInput({ className, dropzoneClassName, label, labelClassName, required = false, showRequiredSign = false, tip, error, accept, acceptLabel, maxSize, multiple = false, value = [], onChange, onError, disabled = false, }) {
|
|
51
|
+
function FileInput({ className, dropzoneClassName, label, labelClassName, required = false, showRequiredSign = false, tip, error, accept, acceptLabel, maxSize, multiple = false, value, onChange, onError, disabled = false, }) {
|
|
82
52
|
const inputRef = React.useRef(null);
|
|
83
53
|
const [isDragging, setIsDragging] = React.useState(false);
|
|
54
|
+
const fileList = multiple
|
|
55
|
+
? (value ?? [])
|
|
56
|
+
: value
|
|
57
|
+
? [value]
|
|
58
|
+
: [];
|
|
84
59
|
function processFiles(rawFiles) {
|
|
85
60
|
if (!rawFiles || disabled)
|
|
86
61
|
return;
|
|
@@ -94,11 +69,23 @@ function FileInput({ className, dropzoneClassName, label, labelClassName, requir
|
|
|
94
69
|
});
|
|
95
70
|
if (!incoming.length)
|
|
96
71
|
return;
|
|
97
|
-
|
|
98
|
-
|
|
72
|
+
if (multiple) {
|
|
73
|
+
onChange?.([
|
|
74
|
+
...fileList,
|
|
75
|
+
...incoming,
|
|
76
|
+
]);
|
|
77
|
+
}
|
|
78
|
+
else {
|
|
79
|
+
onChange?.(incoming[0] ?? null);
|
|
80
|
+
}
|
|
99
81
|
}
|
|
100
82
|
function removeFile(id) {
|
|
101
|
-
|
|
83
|
+
if (multiple) {
|
|
84
|
+
onChange?.(fileList.filter((f) => f.id !== id));
|
|
85
|
+
}
|
|
86
|
+
else {
|
|
87
|
+
onChange?.(null);
|
|
88
|
+
}
|
|
102
89
|
if (inputRef.current)
|
|
103
90
|
inputRef.current.value = "";
|
|
104
91
|
}
|
|
@@ -116,9 +103,9 @@ function FileInput({ className, dropzoneClassName, label, labelClassName, requir
|
|
|
116
103
|
setIsDragging(false);
|
|
117
104
|
processFiles(e.dataTransfer.files);
|
|
118
105
|
}
|
|
119
|
-
const hasFiles =
|
|
106
|
+
const hasFiles = fileList.length > 0;
|
|
120
107
|
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("w-full space-y-1.5", className), children: [label && ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("flex items-center gap-1", labelClassName), children: [(0, jsx_runtime_1.jsx)("label", { className: "text-sm font-bold text-foreground", children: label }), required && showRequiredSign && ((0, jsx_runtime_1.jsx)(lucide_react_1.AsteriskIcon, { className: "h-3 w-3 text-destructive" }))] })), (0, jsx_runtime_1.jsxs)("div", { onDragOver: onDragOver, onDragLeave: onDragLeave, onDrop: onDrop, className: (0, utils_1.cn)("relative flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed px-6 py-8 text-center transition-colors", "border-input bg-transparent", !disabled && "hover:border-ring/50 hover:bg-accent/40", isDragging && "border-ring bg-accent/60", error && "border-destructive", disabled && "cursor-not-allowed opacity-50", dropzoneClassName), children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, type: "file", accept: accept, multiple: multiple, disabled: disabled, className: "absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed", onChange: (e) => processFiles(e.target.files) }), (0, jsx_runtime_1.jsx)(lucide_react_1.CloudUploadIcon, { className: (0, utils_1.cn)("h-8 w-8 transition-colors", isDragging ? "text-ring" : "text-muted-foreground"), strokeWidth: 1.5 }), (0, jsx_runtime_1.jsxs)("div", { className: "pointer-events-none select-none space-y-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-medium text-foreground", children: "Choose a file or drag & drop it here" }), (acceptLabel || maxSize) && ((0, jsx_runtime_1.jsx)("p", { className: "text-xs text-muted-foreground", children: [acceptLabel, maxSize ? `up to ${formatBytes(maxSize)}` : null]
|
|
121
108
|
.filter(Boolean)
|
|
122
|
-
.join(", ") }))] }), (0, jsx_runtime_1.jsx)("span", { className: "pointer-events-none select-none inline-flex items-center rounded-md border border-input bg-background px-3 py-1.5 text-sm font-medium shadow-xs", children: "Browse File" })] }), hasFiles && ((0, jsx_runtime_1.jsx)("ul", { className: "space-y-2", children:
|
|
109
|
+
.join(", ") }))] }), (0, jsx_runtime_1.jsx)("span", { className: "pointer-events-none select-none inline-flex items-center rounded-md border border-input bg-background px-3 py-1.5 text-sm font-medium shadow-xs", children: "Browse File" })] }), hasFiles && ((0, jsx_runtime_1.jsx)("ul", { className: "space-y-2", children: fileList.map(({ file, id }) => ((0, jsx_runtime_1.jsxs)("li", { className: "flex items-center gap-3 rounded-lg border border-input bg-background px-3 py-2.5 shadow-xs", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-input bg-muted", children: (0, jsx_runtime_1.jsx)(lucide_react_1.FileIcon, { className: "h-4 w-4 text-muted-foreground" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "truncate text-sm font-medium text-foreground", children: file.name }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-muted-foreground", children: formatBytes(file.size) })] }), !disabled && ((0, jsx_runtime_1.jsx)("button", { type: "button", onClick: () => removeFile(id), className: "shrink-0 rounded-full p-1 text-muted-foreground transition-colors hover:bg-destructive/10 hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", "aria-label": `Remove ${file.name}`, children: (0, jsx_runtime_1.jsx)(lucide_react_1.XIcon, { className: "h-4 w-4" }) }))] }, id))) })), tip && !error && ((0, jsx_runtime_1.jsx)("p", { className: "text-xs text-muted-foreground tip-message", children: tip })), error && ((0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-destructive error-message", children: ["*", error] }))] }));
|
|
123
110
|
}
|
|
124
111
|
//# sourceMappingURL=file-input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../src/components/file-input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../src/components/file-input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type ReactElement } from "react";
|
|
2
2
|
import { UseFormReturn } from "react-hook-form";
|
|
3
|
-
export default function FormDebugInfo({ form, }: {
|
|
3
|
+
export default function FormDebugInfo({ form, environment, }: {
|
|
4
4
|
form: UseFormReturn<any>;
|
|
5
|
+
environment?: string;
|
|
5
6
|
}): ReactElement;
|
|
6
7
|
//# sourceMappingURL=form-debug-info.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-debug-info.d.ts","sourceRoot":"","sources":["../../src/components/form-debug-info.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"form-debug-info.d.ts","sourceRoot":"","sources":["../../src/components/form-debug-info.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,IAAI,EACJ,WAAW,GACZ,EAAE;IACD,IAAI,EAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,YAAY,CAiBf"}
|
|
@@ -2,29 +2,8 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.default = FormDebugInfo;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
function
|
|
6
|
-
|
|
7
|
-
if (
|
|
8
|
-
///@ts-ignore
|
|
9
|
-
typeof import.meta !== "undefined" &&
|
|
10
|
-
///@ts-ignore
|
|
11
|
-
import.meta.env?.MODE === "development")
|
|
12
|
-
return true;
|
|
13
|
-
}
|
|
14
|
-
catch { }
|
|
15
|
-
try {
|
|
16
|
-
if (
|
|
17
|
-
///@ts-ignore
|
|
18
|
-
typeof process !== "undefined" &&
|
|
19
|
-
///@ts-ignore
|
|
20
|
-
process.env?.NODE_ENV === "development")
|
|
21
|
-
return true;
|
|
22
|
-
}
|
|
23
|
-
catch { }
|
|
24
|
-
return false;
|
|
25
|
-
}
|
|
26
|
-
function FormDebugInfo({ form, }) {
|
|
27
|
-
if (!isDevelopment())
|
|
5
|
+
function FormDebugInfo({ form, environment, }) {
|
|
6
|
+
if (environment !== "development")
|
|
28
7
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
|
|
29
8
|
return ((0, jsx_runtime_1.jsxs)("details", { children: [(0, jsx_runtime_1.jsx)("summary", { className: "cursor-pointer text-sm text-gray-500", children: "Debug Info" }), (0, jsx_runtime_1.jsxs)("pre", { className: "text-xs bg-gray-100 p-4 rounded mt-2 overflow-auto", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Form Errors:" }), JSON.stringify(form.formState.errors, null, 2), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("strong", { children: "Form Values:" }), JSON.stringify(form.watch(), null, 2)] })] }));
|
|
30
9
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-debug-info.js","sourceRoot":"","sources":["../../src/components/form-debug-info.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"form-debug-info.js","sourceRoot":"","sources":["../../src/components/form-debug-info.tsx"],"names":[],"mappings":";;AAGA,gCAuBC;;AAvBD,SAAwB,aAAa,CAAC,EACpC,IAAI,EACJ,WAAW,GAIZ;IACC,IAAI,WAAW,KAAK,aAAa;QAAE,OAAO,kDAAK,CAAC;IAEhD,OAAO,CACL,gDACE,oCAAS,SAAS,EAAC,sCAAsC,2BAE/C,EACV,iCAAK,SAAS,EAAC,oDAAoD,aACjE,8DAA6B,EAC5B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,EAC/C,gCAAM,EACN,8DAA6B,EAC5B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,IAClC,IACE,CACX,CAAC;AACJ,CAAC"}
|
|
@@ -39,7 +39,7 @@ const form_helpers_1 = require("../utils/helpers/form.helpers");
|
|
|
39
39
|
function FormFileInput({ control, name, ...props }) {
|
|
40
40
|
return ((0, jsx_runtime_1.jsx)(react_hook_form_1.Controller, { control: control, name: name, rules: {
|
|
41
41
|
required: props.required ? "Required" : false,
|
|
42
|
-
}, render: ({ field: { onChange, value }, formState: { errors } }) => ((0, jsx_runtime_1.jsx)(file_input_1.default, { ...props, value: value
|
|
42
|
+
}, render: ({ field: { onChange, value }, formState: { errors } }) => ((0, jsx_runtime_1.jsx)(file_input_1.default, { ...props, value: value, onChange: onChange, onError: (errorMessage) => {
|
|
43
43
|
control.setError(name, {
|
|
44
44
|
type: "manual",
|
|
45
45
|
message: errorMessage,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-file-input.js","sourceRoot":"","sources":["../../src/components/form-file-input.tsx"],"names":[],"mappings":";;;;;AAgDA,gCA4BC;;AA5ED,qDAAyE;AACzE,8DAAyD;AACzD,gEAAsE;AAkBtE;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,SAAwB,aAAa,CAAmC,EACtE,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACyB;IACjC,OAAO,CACL,uBAAC,4BAAU,IACT,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE;YACL,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK;SAC9C,EACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CACjE,uBAAC,oBAAS,OACJ,KAAK,EACT,KAAK,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"form-file-input.js","sourceRoot":"","sources":["../../src/components/form-file-input.tsx"],"names":[],"mappings":";;;;;AAgDA,gCA4BC;;AA5ED,qDAAyE;AACzE,8DAAyD;AACzD,gEAAsE;AAkBtE;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,SAAwB,aAAa,CAAmC,EACtE,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACyB;IACjC,OAAO,CACL,uBAAC,4BAAU,IACT,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE;YACL,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK;SAC9C,EACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CACjE,uBAAC,oBAAS,OACJ,KAAK,EACT,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,YAAoB,EAAE,EAAE;gBAChC,OAAO,CAAC,QAAQ,CAAC,IAAI,EAAE;oBACrB,IAAI,EAAE,QAAQ;oBACd,OAAO,EAAE,YAAY;iBACtB,CAAC,CAAC;YACL,CAAC,EACD,KAAK,EAAE,IAAA,oCAAqB,EAAC,MAAM,EAAE,IAAI,CAAC,GAC1C,CACH,GACD,CACH,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nomos-ui/form",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.24",
|
|
4
4
|
"description": "The Shadcn library for building robust React forms",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/exports/index.js",
|
|
@@ -19,9 +19,7 @@
|
|
|
19
19
|
},
|
|
20
20
|
"typesVersions": {
|
|
21
21
|
"*": {
|
|
22
|
-
"utils": [
|
|
23
|
-
"./dist/exports/utils/index.d.ts"
|
|
24
|
-
]
|
|
22
|
+
"utils": ["./dist/exports/utils/index.d.ts"]
|
|
25
23
|
}
|
|
26
24
|
},
|
|
27
25
|
"scripts": {
|
|
@@ -64,11 +62,7 @@
|
|
|
64
62
|
"url": "https://github.com/uanela/nomos-ui/issues"
|
|
65
63
|
},
|
|
66
64
|
"homepage": "https://github.com/uanela/nomos-ui",
|
|
67
|
-
"files": [
|
|
68
|
-
"dist",
|
|
69
|
-
"README.md",
|
|
70
|
-
"LICENSE"
|
|
71
|
-
],
|
|
65
|
+
"files": ["dist", "README.md", "LICENSE"],
|
|
72
66
|
"sideEffects": false,
|
|
73
67
|
"packageManager": "pnpm@10.13.1",
|
|
74
68
|
"dependencies": {
|