@cripty2001/utils 0.0.107 → 0.0.109

package/dist/react-ui/form.d.ts

@@ -1,8 +1,9 @@
 import { InputComponentPropsVariants } from "./input";
-export type FormComponentPropsInput = {
+export type FormComponentPropsInput<V extends InputComponentPropsVariants> = {
     label: string;
     required: boolean;
     key: string;
+    variant: keyof V;
 } & ({
     type: "text" | "email" | "password" | "tel";
 } | {
@@ -10,7 +11,7 @@ export type FormComponentPropsInput = {
     options: string[];
 });
 export type FormComponentProps<T extends Record<string, string>, V extends InputComponentPropsVariants> = {
-    inputs: FormComponentPropsInput[];
+    inputs: FormComponentPropsInput<V>[];
     onSubmit: (values: T) => void;
     submitLabel: string;
     value: T;

package/dist/react-ui/form.js

@@ -19,9 +19,9 @@ function FormComponent(props) {
                     case "email":
                     case "password":
                     case "tel":
-                        return (0, jsx_runtime_1.jsx)(input_1.default, { label: input.label, value: value, setValue: setValue, variant: "form", variants: props.variants, children: ({ value, setValue, className }) => ((0, jsx_runtime_1.jsx)("input", { type: input.type, value: value, onChange: (e) => setValue(e.target.value), required: input.required, className: className, placeholder: input.label })) });
+                        return (0, jsx_runtime_1.jsx)(input_1.default, { label: input.label, value: value, setValue: setValue, variant: input.variant, variants: props.variants, children: ({ value, setValue, className }) => ((0, jsx_runtime_1.jsx)("input", { type: input.type, value: value, onChange: (e) => setValue(e.target.value), required: input.required, className: className, placeholder: input.label })) });
                     case "select":
-                        return (0, jsx_runtime_1.jsx)(input_1.default, { label: input.label, value: value, setValue: setValue, variant: "form", variants: props.variants, required: input.required, validate: (v) => {
+                        return (0, jsx_runtime_1.jsx)(input_1.default, { label: input.label, value: value, setValue: setValue, variant: input.variant, variants: props.variants, required: input.required, validate: (v) => {
                                 if (!input.options.includes(v))
                                     throw new Error("Invalid option");
                             }, children: ({ value, setValue, className }) => ((0, jsx_runtime_1.jsx)("select", { value: value, onChange: (e) => setValue(e.target.value), required: input.required, className: className, children: input.options.map(option => ((0, jsx_runtime_1.jsx)("option", { value: option, children: option }, option))) })) });

package/dist/react-ui/input.d.ts

@@ -1,5 +1,9 @@
-export type InputComponentPropsVariants = Record<string, string> & {
-    default: string;
+export type InputComponentPropsVariantsItem = {
+    input: string;
+    label: string;
+};
+export type InputComponentPropsVariants = Record<string, InputComponentPropsVariantsItem> & {
+    default: InputComponentPropsVariantsItem;
 };
 export type InputComponentProps<V extends InputComponentPropsVariants> = {
     label?: string;

package/dist/react-ui/input.js

@@ -10,7 +10,7 @@ function InputComponent(props) {
     const baseClassName = props.variants[variant ?? "default"];
     const [error, setError] = (0, react_1.useState)(null);
     return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: '0.5rem' }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', gap: '0.5rem' }, children: [props.label &&
-                        (0, jsx_runtime_1.jsx)("label", { style: { display: 'block', marginBottom: '0.25rem', fontSize: '0.875rem', fontWeight: 500, color: '#374151' }, children: props.label }), props.copy &&
+                        (0, jsx_runtime_1.jsx)("label", { className: baseClassName.label, children: props.label }), props.copy &&
                         (0, jsx_runtime_1.jsx)(lucide_react_1.CopyIcon, { style: { width: '1rem', height: '1rem', cursor: 'pointer' }, onClick: () => (0, index_1.copyToClipboard)(props.value) })] }), (0, jsx_runtime_1.jsx)("div", { style: { position: 'relative' }, children: props.children({
                     value: props.value,
                     setValue: (v) => {
@@ -25,7 +25,7 @@ function InputComponent(props) {
                             setError(e.message);
                         }
                     },
-                    className: baseClassName
+                    className: baseClassName.input
                 }) }), error &&
                 (0, jsx_runtime_1.jsx)("div", { style: { color: '#ef4444', fontSize: '0.75rem' }, children: error })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cripty2001/utils",
-  "version": "0.0.107",
+  "version": "0.0.109",
   "description": "Internal Set of utils. If you need them use them, otherwise go to the next package ;)",
   "homepage": "https://github.com/cripty2001/utils#readme",
   "bugs": {