@bouko/react 2.2.4 → 2.2.5

package/dist/components/form/builder.d.ts

@@ -0,0 +1,24 @@
+import { FormBuilderField } from "./types";
+type Props<T> = {
+    styles?: {
+        container?: string;
+        submit?: string;
+        cancel?: string;
+    };
+    id?: string;
+    button?: string;
+    fields: FormBuilderField<T>;
+    validator?: (x: Partial<T>) => ({
+        success: boolean;
+    });
+    sound?: string;
+    cancel?: boolean;
+    submit: (data: T) => Promise<void | never>;
+};
+type Item = {
+    id: string;
+    initial?: string;
+};
+export declare function mapIdToInitial<T>(arrays: Item[][]): Partial<T>;
+export default function FormBuilder<T>({ fields, button, styles, submit, cancel }: Props<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/form/builder.js

@@ -0,0 +1,45 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useForm } from "./functions";
+import { cn } from "@bouko/style";
+import { RowBox } from "../layout/flex";
+import Input from "../input";
+import TextArea from "../textarea";
+import Select from "../select";
+import MultipleChoice from "../multiple-choice";
+import Attachment from "../attachment";
+import { Button } from "../button";
+import CheckCircle from "../../assets/icons/check-circle.svg";
+import XCircle from "../../assets/icons/x-circle.svg";
+export function mapIdToInitial(arrays) {
+    const result = {};
+    for (const inner of arrays) {
+        for (const obj of inner) {
+            if ("initial" in obj && obj["initial"]) {
+                result[obj.id] = obj.initial;
+            }
+        }
+    }
+    return result;
+}
+export default function FormBuilder({ fields, button, styles, submit, cancel = false }) {
+    const initialShi = mapIdToInitial(fields);
+    const { data, setField, clear } = useForm(initialShi);
+    const isValid = true; // validator(data).success;
+    // const play = useSound(sound);
+    const handleSubmit = async () => {
+        await submit(data);
+    };
+    return (_jsxs("div", { className: cn("flex flex-col w-full gap-4", styles?.container), children: [fields.map((row, i) => (_jsx(RowBox, { style: "w-full gap-5 overflow-hidden", children: row.map(({ element, id, rows, label, placeholder, disabled, options, required, note }) => {
+                    if (element === "input")
+                        return (_jsx(Input, { id: id, styles: { container: "flex-1" }, label: label, placeholder: placeholder, value: data[id], update: x => setField(id, x), disabled: disabled, note: note, required: required }, id));
+                    else if (element === "select")
+                        return (_jsx(Select, { id: id, label: label, placeholder: placeholder, options: options || [], value: data[id], update: x => setField(id, x), note: note, required: required }, id));
+                    else if (element === "textarea")
+                        return (_jsx(TextArea, { id: id, label: label, placeholder: placeholder, rows: rows, value: data[id], update: x => setField(id, x), note: note, required: required }, id));
+                    else if (element === "multiple-choice")
+                        return (_jsx(MultipleChoice, { id: id, label: label, options: options || [], value: data[id], update: x => setField(id, x), note: note, required: required }, id));
+                    else if (element === "attachment")
+                        return (_jsx(Attachment, { id: id, label: label, value: data[id], update: x => setField(id, x), note: note, required: required }, id));
+                }) }, i))), _jsxs(RowBox, { style: "items-center gap-2 mt-2 w-full", children: [_jsxs(Button, { style: cn("text-sm", styles?.submit), onClick: handleSubmit, disabled: !isValid, children: [_jsx("div", { children: _jsx(CheckCircle, {}) }), button || "Submit"] }), cancel !== false && (_jsxs(Button, { style: cn("text-sm text-error hover:text-error-light", styles?.cancel), variant: "ghost", onClick: clear, children: [_jsx(XCircle, {}), "Cancel"] }))] })] }));
+}

package/dist/components/form/index.d.ts

@@ -1,27 +1,3 @@
-import { FormBuilderField } from "./fields";
+export { default as FormBuilder } from "./builder";
 export * from "./functions";
 export * from "./types";
-type Props<T> = {
-    styles?: {
-        container?: string;
-        submit?: string;
-        cancel?: string;
-    };
-    id?: string;
-    button?: string;
-    fields: FormBuilderField<T>;
-    validator?: (x: Partial<T>) => ({
-        success: boolean;
-    });
-    sound?: string;
-    cancel?: boolean;
-    submit: (data: T) => Promise<void | never>;
-};
-export declare function useSound(filename?: string): import("use-sound/dist/types").PlayFunction | undefined;
-export * from "./loaders";
-type Item = {
-    id: string;
-    initial?: string;
-};
-export declare function mapIdToInitial<T>(arrays: Item[][]): Partial<T>;
-export declare function FormBuilder<T>({ fields, button, styles, submit, cancel }: Props<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/index.js

@@ -1,39 +1,3 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useForm } from "./functions";
-import { cn } from "@bouko/style";
-import Fields from "./fields";
-import CheckCircle from "../../assets/icons/check-circle.svg";
-import XCircle from "../../assets/icons/x-circle.svg";
-import { default as base } from "use-sound";
+export { default as FormBuilder } from "./builder";
 export * from "./functions";
 export * from "./types";
-import { RowBox } from "../layout/flex";
-import { Button } from "../button";
-export function useSound(filename) {
-    if (!filename)
-        return;
-    return base(filename)[0];
-}
-export * from "./loaders";
-export function mapIdToInitial(arrays) {
-    const result = {};
-    for (const inner of arrays) {
-        for (const obj of inner) {
-            if ("initial" in obj && obj["initial"]) {
-                result[obj.id] = obj.initial;
-            }
-        }
-    }
-    return result;
-}
-export function FormBuilder({ fields, button, styles, submit, cancel = false }) {
-    const initialShi = mapIdToInitial(fields);
-    const { data, setField, clear } = useForm(initialShi);
-    const isValid = true; // validator(data).success;
-    // const play = useSound(sound);
-    const handleSubmit = async () => {
-        await submit(data);
-    };
-    return (_jsxs("div", { className: cn("flex flex-col w-full gap-4", styles?.container), children: [_jsx(Fields, { fields: fields, data: data, setField: setField }), _jsxs(RowBox, { style: "items-center gap-2 mt-2 w-full", children: [_jsxs(Button, { style: cn("text-sm", styles?.submit), onClick: handleSubmit, disabled: !isValid, children: [_jsx("div", { children: _jsx(CheckCircle, {}) }), button || "Submit"] }), cancel !== false && (_jsxs(Button, { style: cn("text-sm text-error hover:text-error-light", styles?.cancel), variant: "ghost", onClick: clear, children: [_jsx(XCircle, {}), "Cancel"] }))] })] }));
-}

package/package.json

@@ -2,7 +2,7 @@
 
   "name": "@bouko/react",
 
-  "version": "2.2.4",
+  "version": "2.2.5",
 
   "main": "./dist/index.js",