@g4rcez/components 1.0.1 → 1.1.0

package/dist/src/flow/flow.js

@@ -26,7 +26,7 @@ const Handlers = (props) => {
     return (_jsxs(Fragment, { children: [_jsx(Handle, { id: `${props.id}-handle-top`, type: props.type, position: Position.Top, className: "h-1 w-10 !bg-primary" }), _jsx(Handle, { id: `${props.id}-handle-left`, type: props.type, position: Position.Left, className: "h-4 w-1 !bg-primary" }), _jsx(Handle, { id: `${props.id}-handle-right`, type: props.type, position: Position.Right, className: "h-4 w-1 !bg-primary" }), _jsx(Handle, { id: `${props.id}-handle-bottom`, type: props.type, position: Position.Bottom, className: "h-1 w-10 !bg-primary" })] }));
 };
 const Input = memo((node) => {
-    return (_jsxs("div", { className: css("relative flex min-h-10 min-w-24 items-center justify-center rounded-lg bg-floating-background px-4 py-2 shadow-md", node.selected ? "border-4" : "border", "border-floating-border"), children: [_jsx(Handlers, { id: node.data.id, type: "source" }), node.data.Item ? _jsx(node.data.Item, { ...node }) : _jsx("h3", { className: "text-center", children: node.data.title })] }));
+    return (_jsxs("div", { className: css("relative flex border-2 min-h-10 min-w-24 items-center justify-center rounded-lg bg-floating-background px-4 py-2 shadow-md", node.selected ? "border-primary" : "", "border-floating-border"), children: [_jsx(Handlers, { id: node.data.id, type: "source" }), node.data.Item ? _jsx(node.data.Item, { ...node }) : _jsx("h3", { className: "text-center", children: node.data.title })] }));
 });
 const Connection = memo((node) => {
     const { deleteElements } = useReactFlow();
@@ -61,7 +61,7 @@ const AddNodeOnEdgeDrop = (props) => {
             id,
             position,
             type: "output",
-            data: { ...type, label: type.title },
+            data: { ...type, id, label: type.title },
         };
         setNodes((prev) => [...prev, newNode]);
     }, [screenToFlowPosition, setNodes, type]);
@@ -70,6 +70,6 @@ const AddNodeOnEdgeDrop = (props) => {
         event.dataTransfer.setData("text/plain", JSON.stringify(nodeType));
         event.dataTransfer.effectAllowed = "move";
     };
-    return (_jsxs("div", { className: "relative p-6 w-full bg-card-background", style: { height: 1000 }, ref: reactFlowWrapper, children: [_jsxs(ReactFlow, { fitView: true, ref: ref, edges: edges, nodes: nodes, onDrop: onDrop, nodeOrigin: [0, 0], onConnect: onConnect, onDragOver: onDragOver, className: "bg-background", nodeTypes: nodeTypes, onEdgesChange: onEdgesChange, onNodesChange: onNodesChange, attributionPosition: "top-right", fitViewOptions: { padding: 2 }, onDragStart: onDragStart, colorMode: props.theme ?? "light", children: [_jsx(MiniMap, {}), _jsx(Background, { bgColor: "hsla(var(--floating-background))" }), _jsx(Controls, {})] }), _jsx(Sidebar, { items: props.parents })] }));
+    return (_jsxs("div", { className: "relative w-full bg-card-background", style: { height: 1000 }, ref: reactFlowWrapper, children: [_jsxs(ReactFlow, { fitView: true, ref: ref, edges: edges, nodes: nodes, onDrop: onDrop, nodeOrigin: [0, 0], onConnect: onConnect, onDragOver: onDragOver, className: "bg-background", nodeTypes: nodeTypes, onEdgesChange: onEdgesChange, onNodesChange: onNodesChange, attributionPosition: "top-right", fitViewOptions: { padding: 2 }, onDragStart: onDragStart, colorMode: props.theme ?? "dark", children: [_jsx(MiniMap, {}), _jsx(Background, { bgColor: "hsla(var(--floating-background))" }), _jsx(Controls, {})] }), _jsx(Sidebar, { items: props.parents })] }));
 };
 export const Flow = (props) => (_jsx(ReactFlowProvider, { fitView: true, initialMaxZoom: 1, children: _jsx(DnDProvider, { children: _jsx(AddNodeOnEdgeDrop, { ...props }) }) }));

package/dist/src/hooks/use-form.d.ts

@@ -1,7 +1,7 @@
 import React, { type ComponentProps } from "react";
 import { type AllPaths } from "sidekicker";
 import { z } from "zod";
-import { AutocompleteProps, CheckboxProps, DatePickerProps, InputProps, SelectProps, SwitchProps, TextareaProps } from "../components";
+import { AutocompleteProps, CheckboxProps, DatePickerProps, InputProps, MultiSelectProps, SelectProps, SwitchProps, TextareaProps } from "../components";
 export declare const formToJson: (form: HTMLFormElement) => any;
 export declare const getSchemaShape: <T extends z.ZodObject<any>>(name: string, schema: T) => T;
 type CustomOnInvalid = (args: {
@@ -340,6 +340,7 @@ export declare const useForm: <T extends z.ZodObject<any>>(schema: T, formName:
     };
     datepicker: <Props extends DatePickerProps>(name: AllPaths<z.TypeOf<T>>, props?: Props) => Props;
     name: string;
+    multiselect: <Props extends MultiSelectProps>(name: AllPaths<z.TypeOf<T>>, props?: Props) => Props;
     disabled: boolean;
 };
 export declare const getJsonForm: <T extends z.ZodObject<any>>(form?: HTMLFormElement | null) => z.infer<T>;

package/dist/src/hooks/use-form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-form.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-form.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAA4C,MAAM,OAAO,CAAC;AAC7F,OAAO,EAAE,KAAK,QAAQ,EAAe,MAAM,YAAY,CAAC;AAExD,OAAO,EAAE,CAAC,EAAa,MAAM,KAAK,CAAC;AACnC,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,eAAe,EAAa,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAwGlJ,eAAO,MAAM,UAAU,GAAI,MAAM,eAAe,KAAG,GAIlD,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,MAAM,MAAM,EAAE,QAAQ,CAAC,MAMjF,CAAC;AAmBF,KAAK,eAAe,GAAG,CAAC,IAAI,EAAE;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,KAAK,GAAG,CAAC;AAEhG,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC7B,IAAI,EAAE,CAAC,CAAC;IACR,IAAI,EAAE,GAAG,CAAC;IACV,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,eAAe,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;IACxC,MAAM,EAAE,KAAK,CAAC;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC,CAAC;CACtD,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,EAAE,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC;AAE1G,KAAK,WAAW,CAAC,CAAC,IAAI;IAClB,GAAG,EAAE,MAAM,CAAC,CAAC;IACb,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI,OAAO,CAAC;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IAC5B,KAAK,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;CAClD,CAAC,CAAC;AAUH,eAAO,MAAM,iBAAiB,GAAI,MAAM,MAAM,KAAG,WAAW,CAAC,GAAG,CAU/D,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC,EAAE,UAAU,MAAM,EAAE,OAAM,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAkB;;YA+J/G,KAAK,SAAS,UAAU,uCAAuB,KAAK,KAAU,KAAK;;;aArFlE,KAAK,SAAS,WAAW,GAAG,iBAAiB,uCAAuB,KAAK,KAAU,KAAK;eA4BtF,KAAK,SAAS,aAAa,GAAG,WAAW,uCAAuB,KAAK,KAAU,KAAK;sBAyI7E,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,OAAO,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC;;eA9G7E,KAAK,SAAS,aAAa,uCAAuB,KAAK,KAAU,KAAK;uBApG5E,eAAe,aAAa,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC;yBAyQ5C,cAAc,CAAC,MAAM,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBArP9B,KAAK,SAAS,eAAe,uCAAuB,KAAK,KAAU,KAAK;;;CA+Q/F,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,OAAO,eAAe,GAAG,IAAI,KAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAC5B,CAAC"}
+{"version":3,"file":"use-form.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-form.ts"],"names":[],"mappings":"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"}

package/dist/src/hooks/use-form.js

@@ -1,9 +1,10 @@
+import { isValid } from "date-fns";
 import { parse } from "qs";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { getPath, Is } from "sidekicker";
 import { LocalStorage } from "storage-manager-js";
 import { ZodNumber } from "zod";
-import { formReset } from "../components";
+import { formReset, } from "../components";
 import { path } from "../lib/fns";
 const isValidJSON = (value) => {
     if (typeof value !== "string") {
@@ -171,7 +172,7 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
             const message = validation.success ? undefined : (validation.error.issues[0]?.message ?? "");
             setErrors((prev) => setPath(prev ?? {}, path, message));
         }
-    }, []);
+    }, [schema]);
     const onInvalid = useCallback((exec) => (event) => {
         const form = event.currentTarget;
         const validationErrors = Object.values(ref.current).reduce((acc, input) => {
@@ -193,12 +194,19 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
     }, []);
     const datepicker = (name, props = noop) => {
         const validator = getSchemaShape(name, schema);
-        const onChange = (e) => {
-            if (!e)
+        const onChange = (date) => {
+            if (!isValid(date))
                 return;
-            const value = e instanceof Date ? e.toISOString() : e.target.value;
-            setState((prev) => setPath(prev, name, value));
-            props?.onChange?.(e);
+            setState((prev) => setPath(prev, name, date.toISOString()));
+            setErrors((prev) => setPath(prev, name, undefined));
+            const input = ref.current[name].element;
+            if (input) {
+                const origin = input.getAttribute("data-origin");
+                const inputShadow = document.querySelector(`input[data-target="${origin}"]`);
+                if (inputShadow)
+                    inputShadow.setCustomValidity("");
+            }
+            props?.onChange?.(date);
         };
         return {
             ...props,
@@ -209,7 +217,7 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
             form: formName,
             date: Is.string(state[name]) ? new Date(state[name]) : state[name],
             required: props.required ?? !validator.isOptional(),
-            error: errors?.[name],
+            error: getPath(errors, name),
             ref: (e) => {
                 if (e === null)
                     return;
@@ -233,7 +241,7 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
             loading: opts.loading,
             onInvalid: onInvalidField,
             error: getPath(errors, name, undefined),
-            value: getPath(state, name, undefined) || "",
+            value: getPath(state, name, undefined) ?? "",
             required: props.required ?? !validator.isOptional(),
             ref: (e) => e !== null
                 ? (ref.current[name] = {
@@ -296,6 +304,30 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
                 }),
         };
     };
+    const multiselect = (name, props = noop) => {
+        const validator = getSchemaShape(name, schema);
+        const onChangeOptions = (options) => {
+            setState((prev) => setPath(prev, name, options));
+        };
+        return {
+            ...props,
+            name,
+            id: name,
+            onChangeOptions,
+            form: formName,
+            loading: opts.loading,
+            onInvalid: onInvalidField,
+            error: getPath(errors, name, undefined),
+            required: props.required ?? !validator.isOptional(),
+            value: getPath(state, name, undefined) || props?.value || [],
+            ref: (e) => e === null
+                ? undefined
+                : void (ref.current[name] = {
+                    element: e,
+                    schema: validator,
+                }),
+        };
+    };
     const input = (name, props = noop) => {
         const validator = getSchemaShape(name, schema);
         const isNumber = validator._def.typeName === "ZodNumber";
@@ -340,7 +372,8 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
                 const validation = input.schema.safeParse(value);
                 current.setAttribute("value", value);
                 if (validation.success) {
-                    element.setCustomValidity("");
+                    if (element.setCustomValidity)
+                        element.setCustomValidity("");
                     setErrors((prev) => {
                         if (Is.null(prev))
                             return null;
@@ -353,7 +386,8 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
                 }
                 if (element.required) {
                     const errorMessage = validation.error.issues[0]?.message || "";
-                    element.setCustomValidity(errorMessage);
+                    if (element.setCustomValidity)
+                        element.setCustomValidity(errorMessage);
                     setErrors((prev) => {
                         if (Is.null(prev))
                             return null;
@@ -454,6 +488,7 @@ export const useForm = (schema, formName, opts = defaultOptions) => {
         controller,
         datepicker,
         name: formName,
+        multiselect,
         disabled: errors !== null,
     };
 };

package/dist/src/styles/common.d.ts

@@ -1,6 +1,6 @@
 import { ZIndex } from "./theme.types";
 export declare const rounded: {
-    readonly button: "0.4rem";
+    readonly button: "0.55rem";
     readonly pill: "2rem";
     readonly card: "0.75rem";
     readonly full: "9999px";

package/dist/src/styles/common.js

@@ -1,5 +1,5 @@
 export const rounded = {
-    button: "0.4rem",
+    button: "0.55rem",
     pill: "2rem",
     card: "0.75rem",
     full: "9999px",

package/dist/src/styles/dark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YA2MxB,CAAC"}
+{"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YA4MxB,CAAC"}

package/dist/src/styles/dark.js

@@ -5,7 +5,7 @@ export const DARK_THEME = {
     rounded,
     spacing,
     shadow: {
-        floating: "rgba(15, 15, 15, 0.1) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 5px 12px",
+        floating: "0 1px 1px 0 rgb(0 0 0 / 0.02)",
     },
     colors: {
         foreground: "hsla(210, 50%, 98%)",
@@ -66,6 +66,7 @@ export const DARK_THEME = {
             "mask-error": "hsla(0, 94%, 81%)",
             "switch-bg": "hsla(0, 0%, 9%)",
             switch: "hsla(0, 0%, 100%)",
+            slider: "hsla(0, 0%, 100%)",
         },
         card: {
             muted: "hsla(0, 0%, 22%)",
@@ -168,7 +169,7 @@ export const DARK_THEME = {
             warn: {
                 bg: "hsla(28,33%,9%)",
                 border: "hsla(29,65%,12%)",
-                text: "hsla(27,100%,78%)"
+                text: "hsla(27,100%,78%)",
             },
             info: {
                 text: "hsla(253,100%,83%)",

package/dist/src/styles/light.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YA2MzB,CAAC"}
+{"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YA4MzB,CAAC"}

package/dist/src/styles/light.js

@@ -4,7 +4,7 @@ export const LIGHT_THEME = {
     spacing,
     name: "light",
     shadow: {
-        floating: "rgba(50, 50, 50, 0.1) 0px 0px 0px 1px, rgba(50, 50, 50, 0.1) 0px 3px 6px, rgba(50, 50, 50, 0.1) 0px 2px 3px",
+        floating: "0 1px 1px 0 rgb(0 0 0 / 0.02)",
     },
     zIndex,
     colors: {
@@ -66,6 +66,7 @@ export const LIGHT_THEME = {
             "mask-error": "hsla(0, 94%, 81%)",
             "switch-bg": "hsla(0, 0%, 45%)",
             switch: "hsla(0, 0%, 100%)",
+            slider: "hsla(0, 0%, 100%)",
         },
         card: {
             muted: "hsla(210, 25%, 94%)",

package/dist/src/styles/theme.types.d.ts

@@ -84,6 +84,7 @@ export type DesignTokens = {
             "mask-error": string;
             "switch-bg": string;
             switch: string;
+            slider: string;
         };
     };
 };

package/dist/src/styles/theme.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../src/styles/theme.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../src/styles/theme.types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@g4rcez/components",
   "description": "Customizable react components.",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "sideEffects": false,
   "private": false,
   "packageManager": "pnpm@10.7.0",