@bouko/react 0.2.1 → 0.2.3

package/dist/components/attachment.d.ts

@@ -1,11 +1,2 @@
-import { type Dispatch, type SetStateAction } from "react";
-type Props = {
-    label?: string;
-    style?: string;
-    value?: File[];
-    required?: boolean;
-    update: Dispatch<SetStateAction<File[]>>;
-    note?: string;
-};
-export default function Attachment({ style, update, label, required, value, note }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+import { type Field } from "@bouko/form";
+export default function Attachment<T>({ id, style, label, value, update, required, note }: Field<T, File[]>): import("react/jsx-runtime").JSX.Element;

package/dist/components/attachment.js

@@ -1,10 +1,15 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useRef } from "react";
 import PaperClip from "../assets/icons/paperclip.svg";
+import { setField } from "@bouko/form";
 import { cn } from "@bouko/style";
-export default function Attachment({ style, update, label, required = true, value, note }) {
+export default function Attachment({ id, style, label, value, update, required = true, note }) {
     const ref = useRef(null);
-    return (_jsxs("div", { className: cn(styles.container, style), children: [label && _jsxs("span", { className: styles.label, children: [label, " ", !required ? _jsx("span", { className: "italic text-slate-400", children: "(optional)" }) : ""] }), _jsxs("div", { onClick: () => ref.current?.click(), className: "flex flex-col justify-center items-center py-3 gap-1 w-full cursor-pointer duration-200 hover:bg-slate-200/40 rounded border-2 border-slate-300 border-dashed", children: [_jsxs("span", { className: "flex gap-2 items-center font-semibold text-sm", children: [_jsx(PaperClip, {}), "Drag and drop files, paste screenshots, or"] }), _jsx("span", { className: "text-xs text-slate-500", children: "browse" }), _jsx("input", { type: "file", className: "hidden", ref: ref })] }), note && _jsx("span", { className: styles.note, children: note })] }));
+    const handleFileChange = (e) => {
+        if (e.target.files)
+            setField(update, id, [e.target.files[0]]);
+    };
+    return (_jsxs("div", { className: cn(styles.container, style), children: [label && _jsxs("span", { className: styles.label, children: [label, " ", !required ? _jsx("span", { className: "italic text-slate-400", children: "(optional)" }) : ""] }), _jsxs("div", { onClick: () => ref.current?.click(), className: "flex flex-col justify-center items-center py-3 gap-1 w-full cursor-pointer duration-200 hover:bg-slate-200/40 rounded border-2 border-slate-300 border-dashed", children: [!value || value.length === 0 && (_jsxs(_Fragment, { children: [_jsxs("span", { className: "flex gap-2 items-center font-semibold text-sm", children: [_jsx(PaperClip, {}), "Drag and drop files, paste screenshots, or"] }), _jsx("span", { className: "text-xs text-slate-500", children: "browse" }), _jsx("input", { type: "file", className: "hidden", onChange: handleFileChange, ref: ref })] })), value && value.length > 0 && value.map((x, i) => (_jsx("span", { className: "text-xs text-slate-500", children: x.name }, i)))] }), note && _jsx("span", { className: styles.note, children: note })] }));
 }
 const styles = {
     container: "flex flex-col gap-2 overflow-hidden",

package/dist/components/select.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { AnimatePresence, motion } from "framer-motion";

package/package.json

@@ -1,50 +1,31 @@
 {
 
   "name": "@bouko/react",
-
-  "version": "0.2.1",
-
+  "version": "0.2.3",
   "main": "./dist/index.js",
-
   "types": "./dist/index.d.ts",
-
   "license": "MIT",
-
   "files": [
-
     "dist"
-
   ],
-
   "publishConfig": {
-
     "access": "public"
-
   },
-
   "author": "",
-
   "description": "",
 
   "scripts": {
-
     "build": "tsc"
-
   },
 
   "dependencies": {
-
     "@bouko/style": "^0.1.1",
-
     "clsx": "^2.1.1",
-
     "framer-motion": "^12.16.0",
-
     "tailwind-merge": "^3.3.0",
-
     "tailwind-variants": "^1.0.0"
+  },
 
-  }
-
-}
+  "devDependencies": {}
 
+}