@darkfrost-1107/scaff-z-react 0.1.7

package/dist/shared/custom/form/inputs/select.input.esm

@@ -0,0 +1,44 @@
+import { Select as e, SelectContent as t, SelectGroup as n, SelectItem as r, SelectTrigger as i, SelectValue as a } from "../../../ui/select.esm";
+import { Field as o, FieldError as s, FieldLabel as c } from "../../../ui/field.esm";
+import { Hover as l } from "../../hover/hover.esm";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Controller as f } from "react-hook-form";
+//#region src/shared/custom/form/inputs/select.input.tsx
+function p({ form: p, name: m, label: h, helper: g, placeholder: _, options: v }) {
+	return /* @__PURE__ */ u(f, {
+		control: p.control,
+		name: m,
+		render: ({ field: { value: f, onChange: p }, fieldState: m }) => /* @__PURE__ */ d(o, {
+			"data-invalid": m.invalid,
+			children: [
+				/* @__PURE__ */ d("div", {
+					className: "flex items-center gap-2 mb-2",
+					children: [h && /* @__PURE__ */ u(c, {
+						className: "text-sm font-medium",
+						children: h
+					}), g && /* @__PURE__ */ u(l, { children: g })]
+				}),
+				/* @__PURE__ */ d(e, {
+					value: f,
+					onValueChange: p,
+					children: [/* @__PURE__ */ u(i, {
+						className: "w-full bg-background border-border",
+						children: /* @__PURE__ */ u(a, { placeholder: _ || "Seleccionar..." })
+					}), /* @__PURE__ */ u(t, {
+						className: "bg-card border-border shadow-matte",
+						children: /* @__PURE__ */ u(n, { children: v.map((e) => /* @__PURE__ */ u(r, {
+							value: e.value,
+							children: e.label
+						}, e.value)) })
+					})]
+				}),
+				m.invalid && m.error && /* @__PURE__ */ u(s, {
+					errors: [m.error],
+					className: "mt-2"
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { p as default };

package/dist/shared/custom/form/inputs/tags.input.cjs

@@ -0,0 +1 @@
+const e=require(`../../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../lib/utils.cjs`),n=require(`../../../ui/field.cjs`),r=require(`../../hover/hover.cjs`),i=require(`../../../ui/badge.cjs`);let a=require(`react/jsx-runtime`),o=require(`react`);o=e.__toESM(o);let s=require(`lucide-react`),c=require(`react-hook-form`);function l({form:e,name:l,label:u,helper:d,placeholder:f=`Escribe y presiona Enter...`}){let[p,m]=o.useState(``);return(0,a.jsx)(c.Controller,{control:e.control,name:l,render:({field:{value:e,onChange:o},fieldState:c})=>{let l=Array.isArray(e)?e:[],h=()=>{let e=p.trim();e&&!l.includes(e)&&(o([...l,e]),m(``))},g=e=>{o(l.filter((t,n)=>n!==e))},_=e=>{e.key===`Enter`||e.key===`,`?(e.preventDefault(),h()):e.key===`Backspace`&&!p&&l.length>0&&g(l.length-1)};return(0,a.jsxs)(n.Field,{"data-invalid":c.invalid,children:[(0,a.jsxs)(`div`,{className:`flex items-center gap-2 mb-2`,children:[u&&(0,a.jsx)(n.FieldLabel,{className:`text-sm font-medium`,children:u}),d&&(0,a.jsx)(r.Hover,{children:d})]}),(0,a.jsx)(`div`,{className:t.cn(`group min-h-[44px] p-1.5 rounded-2xl border transition-all duration-300`,`t-card-base focus-within:t-accent-border focus-within:ring-2 focus-within:ring-(--t-accent)/10`,c.invalid?`border-destructive/50`:`hover:border-(--t-border)`),children:(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[l.map((e,t)=>(0,a.jsxs)(i.Badge,{variant:`secondary`,className:`t-badge pl-2 pr-1 py-1 h-7 border-none transition-colors animate-in zoom-in-95 duration-200`,children:[(0,a.jsx)(`span`,{className:`text-xs font-medium`,children:e}),(0,a.jsx)(`button`,{type:`button`,onClick:()=>g(t),className:`ml-1.5 p-0.5 rounded-full hover:bg-(--t-accent)/30 t-accent-text hover:text-foreground transition-all`,children:(0,a.jsx)(s.X,{className:`size-3`})})]},`${e}-${t}`)),(0,a.jsx)(`input`,{value:p,onChange:e=>m(e.target.value),onKeyDown:_,onBlur:h,placeholder:l.length===0?f:``,className:`flex-1 min-w-[120px] bg-transparent border-none outline-none text-sm text-foreground placeholder:text-muted-foreground px-2 h-7`})]})}),(0,a.jsxs)(`div`,{className:`mt-2 flex items-center justify-between`,children:[(0,a.jsxs)(`p`,{className:`text-[10px] text-muted-foreground italic`,children:[`Presiona `,(0,a.jsx)(`span`,{className:`text-foreground font-bold`,children:`Enter`}),` para agregar`]}),c.invalid&&c.error&&(0,a.jsx)(n.FieldError,{errors:[c.error]})]})]})}})}module.exports=l;

package/dist/shared/custom/form/inputs/tags.input.d.ts

@@ -0,0 +1,16 @@
+import { FieldValues, Path } from 'react-hook-form';
+import { FormInputProps } from '../form.component';
+interface TagsInputProps<TFieldValues extends FieldValues> extends FormInputProps<TFieldValues> {
+    name: Path<TFieldValues>;
+    label?: string;
+    helper?: string;
+    placeholder?: string;
+}
+/**
+ * TagsInput
+ *
+ * Un componente para ingresar una lista de textos (tags) de forma dinámica.
+ * Presiona Enter o Coma para agregar un nuevo tag.
+ */
+export default function TagsInput<TFieldValues extends FieldValues>({ form, name, label, helper, placeholder, }: TagsInputProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/custom/form/inputs/tags.input.esm

@@ -0,0 +1,80 @@
+import { cn as e } from "../../../lib/utils.esm";
+import { Field as t, FieldError as n, FieldLabel as r } from "../../../ui/field.esm";
+import { Hover as i } from "../../hover/hover.esm";
+import { Badge as a } from "../../../ui/badge.esm";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import * as c from "react";
+import { X as l } from "lucide-react";
+import { Controller as u } from "react-hook-form";
+//#region src/shared/custom/form/inputs/tags.input.tsx
+function d({ form: d, name: f, label: p, helper: m, placeholder: h = "Escribe y presiona Enter..." }) {
+	let [g, _] = c.useState("");
+	return /* @__PURE__ */ o(u, {
+		control: d.control,
+		name: f,
+		render: ({ field: { value: c, onChange: u }, fieldState: d }) => {
+			let f = Array.isArray(c) ? c : [], v = () => {
+				let e = g.trim();
+				e && !f.includes(e) && (u([...f, e]), _(""));
+			}, y = (e) => {
+				u(f.filter((t, n) => n !== e));
+			}, b = (e) => {
+				e.key === "Enter" || e.key === "," ? (e.preventDefault(), v()) : e.key === "Backspace" && !g && f.length > 0 && y(f.length - 1);
+			};
+			return /* @__PURE__ */ s(t, {
+				"data-invalid": d.invalid,
+				children: [
+					/* @__PURE__ */ s("div", {
+						className: "flex items-center gap-2 mb-2",
+						children: [p && /* @__PURE__ */ o(r, {
+							className: "text-sm font-medium",
+							children: p
+						}), m && /* @__PURE__ */ o(i, { children: m })]
+					}),
+					/* @__PURE__ */ o("div", {
+						className: e("group min-h-[44px] p-1.5 rounded-2xl border transition-all duration-300", "t-card-base focus-within:t-accent-border focus-within:ring-2 focus-within:ring-(--t-accent)/10", d.invalid ? "border-destructive/50" : "hover:border-(--t-border)"),
+						children: /* @__PURE__ */ s("div", {
+							className: "flex flex-wrap gap-1.5",
+							children: [f.map((e, t) => /* @__PURE__ */ s(a, {
+								variant: "secondary",
+								className: "t-badge pl-2 pr-1 py-1 h-7 border-none transition-colors animate-in zoom-in-95 duration-200",
+								children: [/* @__PURE__ */ o("span", {
+									className: "text-xs font-medium",
+									children: e
+								}), /* @__PURE__ */ o("button", {
+									type: "button",
+									onClick: () => y(t),
+									className: "ml-1.5 p-0.5 rounded-full hover:bg-(--t-accent)/30 t-accent-text hover:text-foreground transition-all",
+									children: /* @__PURE__ */ o(l, { className: "size-3" })
+								})]
+							}, `${e}-${t}`)), /* @__PURE__ */ o("input", {
+								value: g,
+								onChange: (e) => _(e.target.value),
+								onKeyDown: b,
+								onBlur: v,
+								placeholder: f.length === 0 ? h : "",
+								className: "flex-1 min-w-[120px] bg-transparent border-none outline-none text-sm text-foreground placeholder:text-muted-foreground px-2 h-7"
+							})]
+						})
+					}),
+					/* @__PURE__ */ s("div", {
+						className: "mt-2 flex items-center justify-between",
+						children: [/* @__PURE__ */ s("p", {
+							className: "text-[10px] text-muted-foreground italic",
+							children: [
+								"Presiona ",
+								/* @__PURE__ */ o("span", {
+									className: "text-foreground font-bold",
+									children: "Enter"
+								}),
+								" para agregar"
+							]
+						}), d.invalid && d.error && /* @__PURE__ */ o(n, { errors: [d.error] })]
+					})
+				]
+			});
+		}
+	});
+}
+//#endregion
+export { d as default };

package/dist/shared/custom/form/inputs/text.input.cjs

@@ -0,0 +1 @@
+require(`../../../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../../ui/field.cjs`),t=require(`../../../ui/input.cjs`),n=require(`../../hover/hover.cjs`),r=require(`../../../ui/input-group.cjs`);let i=require(`react/jsx-runtime`),a=require(`react-hook-form`);function o({form:o,name:s,label:c,placeholder:l,helper:u,id:d,type:f=`text`,icon:p}){let m=d||`input-${String(s)}`;return(0,i.jsx)(a.Controller,{control:o.control,name:s,render:({field:a,fieldState:o})=>(0,i.jsxs)(e.Field,{"data-invalid":o.invalid,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[c&&(0,i.jsx)(e.FieldLabel,{htmlFor:m,children:c}),u&&(0,i.jsx)(n.Hover,{children:u})]}),p?(0,i.jsxs)(r.InputGroup,{children:[(0,i.jsx)(r.InputGroupAddon,{align:`inline-start`,children:p}),(0,i.jsx)(r.InputGroupInput,{...a,id:m,type:f,"aria-invalid":o.invalid,placeholder:l,autoComplete:`off`})]}):(0,i.jsx)(t.Input,{...a,id:m,type:f,"aria-invalid":o.invalid,placeholder:l,autoComplete:`off`}),o.invalid&&o.error&&(0,i.jsx)(e.FieldError,{errors:[o.error]})]})})}module.exports=o;

package/dist/shared/custom/form/inputs/text.input.d.ts

@@ -0,0 +1,13 @@
+import { FieldValues, Path } from 'react-hook-form';
+import { FormInputProps } from '../form.component';
+interface InputProps<T extends FieldValues> extends FormInputProps<T> {
+    name: Path<T>;
+    label?: string;
+    placeholder?: string;
+    helper?: string;
+    id?: string;
+    type?: React.HTMLInputTypeAttribute;
+    icon?: React.ReactNode;
+}
+export default function TextInput<T extends FieldValues>({ form, name, label, placeholder, helper, id, type, icon }: InputProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/custom/form/inputs/text.input.esm

@@ -0,0 +1,47 @@
+import { Field as e, FieldError as t, FieldLabel as n } from "../../../ui/field.esm";
+import { Input as r } from "../../../ui/input.esm";
+import { Hover as i } from "../../hover/hover.esm";
+import { InputGroup as a, InputGroupAddon as o, InputGroupInput as s } from "../../../ui/input-group.esm";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Controller as u } from "react-hook-form";
+//#region src/shared/custom/form/inputs/text.input.tsx
+function d({ form: d, name: f, label: p, placeholder: m, helper: h, id: g, type: _ = "text", icon: v }) {
+	let y = g || `input-${String(f)}`;
+	return /* @__PURE__ */ c(u, {
+		control: d.control,
+		name: f,
+		render: ({ field: u, fieldState: d }) => /* @__PURE__ */ l(e, {
+			"data-invalid": d.invalid,
+			children: [
+				/* @__PURE__ */ l("div", {
+					className: "flex items-center gap-2",
+					children: [p && /* @__PURE__ */ c(n, {
+						htmlFor: y,
+						children: p
+					}), h && /* @__PURE__ */ c(i, { children: h })]
+				}),
+				v ? /* @__PURE__ */ l(a, { children: [/* @__PURE__ */ c(o, {
+					align: "inline-start",
+					children: v
+				}), /* @__PURE__ */ c(s, {
+					...u,
+					id: y,
+					type: _,
+					"aria-invalid": d.invalid,
+					placeholder: m,
+					autoComplete: "off"
+				})] }) : /* @__PURE__ */ c(r, {
+					...u,
+					id: y,
+					type: _,
+					"aria-invalid": d.invalid,
+					placeholder: m,
+					autoComplete: "off"
+				}),
+				d.invalid && d.error && /* @__PURE__ */ c(t, { errors: [d.error] })
+			]
+		})
+	});
+}
+//#endregion
+export { d as default };

package/dist/shared/custom/form/inputs/textarea.input.cjs

@@ -0,0 +1 @@
+require(`../../../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../../ui/field.cjs`),t=require(`../../hover/hover.cjs`),n=require(`../../../ui/textarea.cjs`);let r=require(`react/jsx-runtime`),i=require(`react-hook-form`);function a({form:a,name:o,label:s,placeholder:c,helper:l,id:u,rows:d=4}){let f=u||`textarea-${String(o)}`;return(0,r.jsx)(i.Controller,{control:a.control,name:o,render:({field:i,fieldState:a})=>(0,r.jsxs)(e.Field,{"data-invalid":a.invalid,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-2`,children:[s&&(0,r.jsx)(e.FieldLabel,{htmlFor:f,children:s}),l&&(0,r.jsx)(t.Hover,{children:l})]}),(0,r.jsx)(n.Textarea,{...i,id:f,rows:d,"aria-invalid":a.invalid,placeholder:c,autoComplete:`off`}),a.invalid&&a.error&&(0,r.jsx)(e.FieldError,{errors:[a.error]})]})})}module.exports=a;

package/dist/shared/custom/form/inputs/textarea.input.d.ts

@@ -0,0 +1,12 @@
+import { FieldValues, Path } from 'react-hook-form';
+import { FormInputProps } from '../form.component';
+interface TextAreaInputProps<T extends FieldValues> extends FormInputProps<T> {
+    name: Path<T>;
+    label?: string;
+    placeholder?: string;
+    helper?: string;
+    id?: string;
+    rows?: number;
+}
+export default function TextAreaInput<T extends FieldValues>({ form, name, label, placeholder, helper, id, rows }: TextAreaInputProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/custom/form/inputs/textarea.input.esm

@@ -0,0 +1,36 @@
+import { Field as e, FieldError as t, FieldLabel as n } from "../../../ui/field.esm";
+import { Hover as r } from "../../hover/hover.esm";
+import { Textarea as i } from "../../../ui/textarea.esm";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Controller as s } from "react-hook-form";
+//#region src/shared/custom/form/inputs/textarea.input.tsx
+function c({ form: c, name: l, label: u, placeholder: d, helper: f, id: p, rows: m = 4 }) {
+	let h = p || `textarea-${String(l)}`;
+	return /* @__PURE__ */ a(s, {
+		control: c.control,
+		name: l,
+		render: ({ field: s, fieldState: c }) => /* @__PURE__ */ o(e, {
+			"data-invalid": c.invalid,
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "flex items-center gap-2",
+					children: [u && /* @__PURE__ */ a(n, {
+						htmlFor: h,
+						children: u
+					}), f && /* @__PURE__ */ a(r, { children: f })]
+				}),
+				/* @__PURE__ */ a(i, {
+					...s,
+					id: h,
+					rows: m,
+					"aria-invalid": c.invalid,
+					placeholder: d,
+					autoComplete: "off"
+				}),
+				c.invalid && c.error && /* @__PURE__ */ a(t, { errors: [c.error] })
+			]
+		})
+	});
+}
+//#endregion
+export { c as default };

package/dist/shared/custom/form/layout/form-dialog-layout.cjs

@@ -0,0 +1 @@
+const e=require(`../../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../lib/utils.cjs`),n=require(`../../../ui/dialog.cjs`),r=require(`../../hover/hover.cjs`);let i=require(`react/jsx-runtime`),a=require(`react`);a=e.__toESM(a);function o({trigger:e,title:a,description:o,helper:s,children:c,className:l,open:u,onOpenChange:d}){let f=e?(0,i.jsx)(n.DialogTrigger,{asChild:!0,children:e}):null;return(0,i.jsxs)(n.Dialog,{open:u,onOpenChange:d,children:[f&&(s?(0,i.jsx)(r.Hover,{Trigger:f,children:s}):f),(0,i.jsxs)(n.DialogContent,{className:t.cn(`sm:max-w-2xl bg-card border-border shadow-2xl rounded-(--t-radius-lg) p-0 overflow-hidden flex flex-col animate-in fade-in zoom-in-95 duration-300`,l),children:[(0,i.jsxs)(n.DialogHeader,{className:`gap-1 p-8 pb-4`,children:[(0,i.jsx)(n.DialogTitle,{className:`text-2xl font-semibold tracking-tight text-foreground`,children:a}),o&&(0,i.jsx)(n.DialogDescription,{className:`text-sm text-muted-foreground/70 font-medium`,children:o})]}),(0,i.jsx)(`div`,{className:`relative overflow-y-auto max-h-[calc(90vh-140px)] custom-scrollbar`,children:c})]})]})}module.exports=o;

package/dist/shared/custom/form/layout/form-dialog-layout.d.ts

@@ -0,0 +1,25 @@
+import * as React from "react";
+interface FormDialogLayoutProps {
+    /** Botón o elemento que abre el modal (opcional si se usa control externo) */
+    trigger?: React.ReactNode;
+    /** Título del formulario */
+    title: string;
+    /** Descripción estática debajo del título (DialogDescription) */
+    description?: string;
+    /** Texto de ayuda interactivo que aparece al pasar el cursor (Hover/Tooltip) */
+    helper?: string;
+    /** Formulario u otro contenido interno */
+    children: React.ReactNode;
+    /** Clase adicional para el contenedor de contenido */
+    className?: string;
+    /** Control externo del estado abierto (opcional) */
+    open?: boolean;
+    /** Evento de cambio de estado (opcional) */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Layout de formulario en Diálogo (Modal).
+ * Proporciona una forma estandarizada de mostrar formularios sin saturar la vista principal.
+ */
+export default function FormDialogLayout({ trigger, title, description, helper, children, className, open, onOpenChange }: FormDialogLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/custom/form/layout/form-dialog-layout.esm

@@ -0,0 +1,37 @@
+import { cn as e } from "../../../lib/utils.esm";
+import { Dialog as t, DialogContent as n, DialogDescription as r, DialogHeader as i, DialogTitle as a, DialogTrigger as o } from "../../../ui/dialog.esm";
+import { Hover as s } from "../../hover/hover.esm";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import "react";
+//#region src/shared/custom/form/layout/form-dialog-layout.tsx
+function u({ trigger: u, title: d, description: f, helper: p, children: m, className: h, open: g, onOpenChange: _ }) {
+	let v = u ? /* @__PURE__ */ c(o, {
+		asChild: !0,
+		children: u
+	}) : null;
+	return /* @__PURE__ */ l(t, {
+		open: g,
+		onOpenChange: _,
+		children: [v && (p ? /* @__PURE__ */ c(s, {
+			Trigger: v,
+			children: p
+		}) : v), /* @__PURE__ */ l(n, {
+			className: e("sm:max-w-2xl bg-card border-border shadow-2xl rounded-(--t-radius-lg) p-0 overflow-hidden flex flex-col animate-in fade-in zoom-in-95 duration-300", h),
+			children: [/* @__PURE__ */ l(i, {
+				className: "gap-1 p-8 pb-4",
+				children: [/* @__PURE__ */ c(a, {
+					className: "text-2xl font-semibold tracking-tight text-foreground",
+					children: d
+				}), f && /* @__PURE__ */ c(r, {
+					className: "text-sm text-muted-foreground/70 font-medium",
+					children: f
+				})]
+			}), /* @__PURE__ */ c("div", {
+				className: "relative overflow-y-auto max-h-[calc(90vh-140px)] custom-scrollbar",
+				children: m
+			})]
+		})]
+	});
+}
+//#endregion
+export { u as default };

package/dist/shared/custom/form/layout/form-tab-layout.cjs

@@ -0,0 +1 @@
+const e=require(`../../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../lib/utils.cjs`),n=require(`../../../ui/tabs.cjs`),r=require(`../../layouts/grid.layout.cjs`);let i=require(`react/jsx-runtime`),a=require(`react`);a=e.__toESM(a);let o=require(`lucide-react`);function s({tabs:e,children:s,defaultValue:c,className:l}){let u=c||e[0]?.value,[d,f]=a.useState(u),[p,m]=a.useState(new Set([u])),h=p.size===e.length;return!e||e.length===0?null:(0,i.jsxs)(`div`,{className:t.cn(`flex flex-col`,l),children:[(0,i.jsxs)(n.Tabs,{value:d,onValueChange:e=>{f(e),m(t=>{if(t.has(e))return t;let n=new Set(t);return n.add(e),n})},className:`w-full`,children:[(0,i.jsx)(`div`,{className:`px-4 pt-4`,children:(0,i.jsx)(n.TabsList,{className:`w-full h-auto bg-white/[0.03] p-1.5 rounded-2xl border border-white/5 overflow-hidden`,asChild:!0,children:(0,i.jsx)(r.GridLayout,{cols:e.length,gap:0,className:`w-full`,children:e.map(e=>{let r=p.has(e.value),a=d===e.value;return(0,i.jsx)(n.TabsTrigger,{value:e.value,className:t.cn(`relative rounded-xl transition-all duration-300 py-2.5`,`data-[state=active]:bg-white/10 data-[state=active]:text-white data-[state=active]:shadow-lg`,`text-muted-foreground hover:text-white/80`),children:(0,i.jsxs)(`div`,{className:`flex items-center justify-center gap-2`,children:[e.icon,(0,i.jsx)(`span`,{className:`text-xs font-bold tracking-tight`,children:e.label}),r&&(0,i.jsx)(`div`,{className:t.cn(`size-3.5 rounded-full flex items-center justify-center transition-colors`,a?`bg-indigo-500 text-white`:`bg-emerald-500/20 text-emerald-400`),children:(0,i.jsx)(o.Check,{className:`size-2.5 stroke-[3]`})})]})},e.value)})})})}),e.map(e=>(0,i.jsx)(n.TabsContent,{value:e.value,className:`flex flex-col gap-4 p-6 focus-visible:outline-none focus-visible:ring-0 animate-in fade-in slide-in-from-bottom-2 duration-300`,children:e.content},e.value))]}),s&&(0,i.jsx)(`div`,{className:`mx-6 pb-6 pt-2 border-t border-white/5`,children:s({allVisited:h,activeTab:d})})]})}module.exports=s;

package/dist/shared/custom/form/layout/form-tab-layout.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+export interface FormTabConfig {
+    /** Identificador único de la pestaña */
+    value: string;
+    /** Título que se mostrará en el trigger de la pestaña */
+    label: string;
+    /** Icono opcional para la cabecera */
+    icon?: React.ReactNode;
+    /** Contenido interno de la pestaña (los inputs del formulario) */
+    content: React.ReactNode;
+}
+interface FormTabLayoutProps {
+    /** Configuración de las pestañas a renderizar */
+    tabs: FormTabConfig[];
+    /** Render prop que recibe el estado de la navegación para inyectar controles adicionales (como el botón submit) */
+    children?: (state: {
+        allVisited: boolean;
+        activeTab: string;
+    }) => React.ReactNode;
+    /** Pestaña inicialmente activa. Por defecto es la primera del array. */
+    defaultValue?: string;
+    className?: string;
+}
+/**
+ * Layout de formulario con Pestañas.
+ * Gestiona el estado de visita de cada pestaña y expone un booleano para bloquear/desbloquear acciones.
+ * Utiliza GridLayout para la cabecera de pestañas.
+ */
+export default function FormTabLayout({ tabs, children, defaultValue, className }: FormTabLayoutProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/shared/custom/form/layout/form-tab-layout.esm

@@ -0,0 +1,69 @@
+import { cn as e } from "../../../lib/utils.esm";
+import { Tabs as t, TabsContent as n, TabsList as r, TabsTrigger as i } from "../../../ui/tabs.esm";
+import { GridLayout as a } from "../../layouts/grid.layout.esm";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import * as c from "react";
+import { Check as l } from "lucide-react";
+//#region src/shared/custom/form/layout/form-tab-layout.tsx
+function u({ tabs: u, children: d, defaultValue: f, className: p }) {
+	let m = f || u[0]?.value, [h, g] = c.useState(m), [_, v] = c.useState(new Set([m])), y = _.size === u.length;
+	return !u || u.length === 0 ? null : /* @__PURE__ */ s("div", {
+		className: e("flex flex-col", p),
+		children: [/* @__PURE__ */ s(t, {
+			value: h,
+			onValueChange: (e) => {
+				g(e), v((t) => {
+					if (t.has(e)) return t;
+					let n = new Set(t);
+					return n.add(e), n;
+				});
+			},
+			className: "w-full",
+			children: [/* @__PURE__ */ o("div", {
+				className: "px-4 pt-4",
+				children: /* @__PURE__ */ o(r, {
+					className: "w-full h-auto bg-white/[0.03] p-1.5 rounded-2xl border border-white/5 overflow-hidden",
+					asChild: !0,
+					children: /* @__PURE__ */ o(a, {
+						cols: u.length,
+						gap: 0,
+						className: "w-full",
+						children: u.map((t) => {
+							let n = _.has(t.value), r = h === t.value;
+							return /* @__PURE__ */ o(i, {
+								value: t.value,
+								className: e("relative rounded-xl transition-all duration-300 py-2.5", "data-[state=active]:bg-white/10 data-[state=active]:text-white data-[state=active]:shadow-lg", "text-muted-foreground hover:text-white/80"),
+								children: /* @__PURE__ */ s("div", {
+									className: "flex items-center justify-center gap-2",
+									children: [
+										t.icon,
+										/* @__PURE__ */ o("span", {
+											className: "text-xs font-bold tracking-tight",
+											children: t.label
+										}),
+										n && /* @__PURE__ */ o("div", {
+											className: e("size-3.5 rounded-full flex items-center justify-center transition-colors", r ? "bg-indigo-500 text-white" : "bg-emerald-500/20 text-emerald-400"),
+											children: /* @__PURE__ */ o(l, { className: "size-2.5 stroke-[3]" })
+										})
+									]
+								})
+							}, t.value);
+						})
+					})
+				})
+			}), u.map((e) => /* @__PURE__ */ o(n, {
+				value: e.value,
+				className: "flex flex-col gap-4 p-6 focus-visible:outline-none focus-visible:ring-0 animate-in fade-in slide-in-from-bottom-2 duration-300",
+				children: e.content
+			}, e.value))]
+		}), d && /* @__PURE__ */ o("div", {
+			className: "mx-6 pb-6 pt-2 border-t border-white/5",
+			children: d({
+				allVisited: y,
+				activeTab: h
+			})
+		})]
+	});
+}
+//#endregion
+export { u as default };

package/dist/shared/custom/hover/hover.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../ui/tooltip.cjs`);let t=require(`react/jsx-runtime`),n=require(`lucide-react`);function r({children:r,Trigger:i}){return(0,t.jsx)(e.TooltipProvider,{children:(0,t.jsxs)(e.Tooltip,{children:[(0,t.jsx)(e.TooltipTrigger,{asChild:!0,children:i||(0,t.jsx)(`button`,{type:`button`,className:`text-muted-foreground hover:text-foreground transition-colors outline-none`,tabIndex:-1,children:(0,t.jsx)(n.CircleHelp,{className:`w-3.5 h-3.5`})})}),(0,t.jsx)(e.TooltipContent,{children:(0,t.jsx)(`div`,{className:`max-w-[200px] leading-snug`,children:r})})]})})}exports.Hover=r;

package/dist/shared/custom/hover/hover.d.ts

@@ -0,0 +1,6 @@
+interface HoverProps {
+    children: React.ReactNode;
+    Trigger?: React.ReactNode;
+}
+export declare function Hover({ children, Trigger }: HoverProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/custom/hover/hover.esm

@@ -0,0 +1,20 @@
+import { Tooltip as e, TooltipContent as t, TooltipProvider as n, TooltipTrigger as r } from "../../ui/tooltip.esm";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { CircleHelp as o } from "lucide-react";
+//#region src/shared/custom/hover/hover.tsx
+function s({ children: s, Trigger: c }) {
+	return /* @__PURE__ */ i(n, { children: /* @__PURE__ */ a(e, { children: [/* @__PURE__ */ i(r, {
+		asChild: !0,
+		children: c || /* @__PURE__ */ i("button", {
+			type: "button",
+			className: "text-muted-foreground hover:text-foreground transition-colors outline-none",
+			tabIndex: -1,
+			children: /* @__PURE__ */ i(o, { className: "w-3.5 h-3.5" })
+		})
+	}), /* @__PURE__ */ i(t, { children: /* @__PURE__ */ i("div", {
+		className: "max-w-[200px] leading-snug",
+		children: s
+	}) })] }) });
+}
+//#endregion
+export { s as Hover };

package/dist/shared/custom/layouts/canvas-view.layout.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../lib/utils.cjs`);let n=require(`react/jsx-runtime`),r=require(`react`);r=e.__toESM(r);function i({icon:e,title:r,description:i,label:a=`Módulo`,actions:o,children:s,className:c}){return(0,n.jsx)(`div`,{className:t.cn(`relative w-full h-[calc(80vh)] bg-background overflow-hidden flex flex-col`,c),children:(0,n.jsx)(`main`,{className:`flex-1 w-full h-full relative z-0`,children:s})})}exports.CanvasViewLayout=i;

package/dist/shared/custom/layouts/canvas-view.layout.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { LucideIcon } from 'lucide-react';
+export interface CanvasViewLayoutProps {
+    icon: LucideIcon;
+    title: string;
+    description: string;
+    label?: string;
+    actions?: React.ReactNode;
+    children: React.ReactNode;
+    className?: string;
+}
+/**
+ * CanvasViewLayout
+ * Layout optimizado para vistas que requieren el 100% del área (como lienzos y grafos).
+ * Maximiza el espacio visual y coloca la información de contexto (brief) y acciones
+ * en un panel flotante inferior con efecto glassmorphism.
+ */
+export declare function CanvasViewLayout({ icon, title, description, label, actions, children, className }: CanvasViewLayoutProps): import("react/jsx-runtime").JSX.Element;

package/dist/shared/custom/layouts/canvas-view.layout.esm

@@ -0,0 +1,15 @@
+import { cn as e } from "../../lib/utils.esm";
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+//#region src/shared/custom/layouts/canvas-view.layout.tsx
+function n({ icon: n, title: r, description: i, label: a = "Módulo", actions: o, children: s, className: c }) {
+	return /* @__PURE__ */ t("div", {
+		className: e("relative w-full h-[calc(80vh)] bg-background overflow-hidden flex flex-col", c),
+		children: /* @__PURE__ */ t("main", {
+			className: "flex-1 w-full h-full relative z-0",
+			children: s
+		})
+	});
+}
+//#endregion
+export { n as CanvasViewLayout };

package/dist/shared/custom/layouts/detail-tabs.layout.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../../ui/tabs.cjs`);let r=require(`react/jsx-runtime`),i=require(`react`);i=e.__toESM(i);function a({tabs:e,defaultValue:i,className:a}){return!e||e.length===0?null:(0,r.jsxs)(n.Tabs,{defaultValue:i||e[0].value,className:t.cn(`w-full space-y-6 animate-in fade-in duration-500`,a),children:[(0,r.jsx)(n.TabsList,{className:`w-full max-w-md grid p-1 bg-muted/50 rounded-2xl border border-border/40`,style:{gridTemplateColumns:`repeat(${e.length}, minmax(0, 1fr))`},children:e.map(e=>(0,r.jsxs)(n.TabsTrigger,{value:e.value,className:`py-2.5 rounded-xl font-bold flex items-center justify-center gap-2 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground shadow-none data-[state=active]:shadow-md transition-all`,children:[e.icon&&(0,r.jsx)(`span`,{className:`shrink-0`,children:e.icon}),(0,r.jsx)(`span`,{className:`truncate`,children:e.label})]},e.value))}),e.map(e=>(0,r.jsx)(n.TabsContent,{value:e.value,className:`outline-none`,children:e.content},e.value))]})}exports.DetailTabsLayout=a,exports.default=a;

package/dist/shared/custom/layouts/detail-tabs.layout.d.ts

@@ -0,0 +1,27 @@
+import { default as React } from 'react';
+export interface TabDefinition {
+    /** Identificador único del tab */
+    value: string;
+    /** Etiqueta a mostrar */
+    label: string;
+    /** Icono opcional (lucide-react) */
+    icon?: React.ReactNode;
+    /** Contenido a renderizar cuando el tab está activo */
+    content: React.ReactNode;
+}
+interface DetailTabsLayoutProps {
+    /** Lista de tabs a renderizar */
+    tabs: TabDefinition[];
+    /** Tab seleccionado por defecto (usará el primero si no se provee) */
+    defaultValue?: string;
+    /** Clases adicionales para el contenedor principal */
+    className?: string;
+}
+/**
+ * DetailTabsLayout
+ *
+ * Un componente pre-estilizado para estandarizar las vistas con pestañas
+ * dentro de las páginas de detalle (DetailViewLayout).
+ */
+export declare function DetailTabsLayout({ tabs, defaultValue, className }: DetailTabsLayoutProps): import("react/jsx-runtime").JSX.Element | null;
+export default DetailTabsLayout;

package/dist/shared/custom/layouts/detail-tabs.layout.esm

@@ -0,0 +1,32 @@
+import { cn as e } from "../../lib/utils.esm";
+import { Tabs as t, TabsContent as n, TabsList as r, TabsTrigger as i } from "../../ui/tabs.esm";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import "react";
+//#region src/shared/custom/layouts/detail-tabs.layout.tsx
+function s({ tabs: s, defaultValue: c, className: l }) {
+	return !s || s.length === 0 ? null : /* @__PURE__ */ o(t, {
+		defaultValue: c || s[0].value,
+		className: e("w-full space-y-6 animate-in fade-in duration-500", l),
+		children: [/* @__PURE__ */ a(r, {
+			className: "w-full max-w-md grid p-1 bg-muted/50 rounded-2xl border border-border/40",
+			style: { gridTemplateColumns: `repeat(${s.length}, minmax(0, 1fr))` },
+			children: s.map((e) => /* @__PURE__ */ o(i, {
+				value: e.value,
+				className: "py-2.5 rounded-xl font-bold flex items-center justify-center gap-2 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground shadow-none data-[state=active]:shadow-md transition-all",
+				children: [e.icon && /* @__PURE__ */ a("span", {
+					className: "shrink-0",
+					children: e.icon
+				}), /* @__PURE__ */ a("span", {
+					className: "truncate",
+					children: e.label
+				})]
+			}, e.value))
+		}), s.map((e) => /* @__PURE__ */ a(n, {
+			value: e.value,
+			className: "outline-none",
+			children: e.content
+		}, e.value))]
+	});
+}
+//#endregion
+export { s as DetailTabsLayout, s as default };

package/dist/shared/custom/layouts/detail-view.layout.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../actions/back-button.action.cjs`),r=require(`../ui/typography.cjs`);let i=require(`react/jsx-runtime`),a=require(`react`);a=e.__toESM(a);function o({backLabel:e,backTo:a,referenceLabel:o,icon:s,title:c,badge:l,description:u,metaBlock:d,children:f,sidebar:p,className:m}){return(0,i.jsxs)(`div`,{className:t.cn(`max-w-[1200px] mx-auto p-6 space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-700`,m),children:[(e||o)&&(0,i.jsxs)(`nav`,{className:`flex items-center justify-between border-b pb-4 border-border/40`,children:[e?(0,i.jsx)(n.BackButtonAction,{label:e,to:a,className:`hover:bg-accent/10`}):(0,i.jsx)(`div`,{}),o&&(0,i.jsx)(r.Typography,{variant:`extra-small`,className:`font-medium uppercase tracking-tighter`,children:o})]}),(0,i.jsxs)(`div`,{className:`flex flex-col md:flex-row items-center justify-between gap-8 bg-card/30 p-8 rounded-[2.5rem] border border-border/50 backdrop-blur-xl shadow-2xl shadow-primary/5`,children:[(0,i.jsxs)(`div`,{className:`flex flex-col md:flex-row items-center gap-6`,children:[s,(0,i.jsxs)(`div`,{className:`space-y-2 text-center md:text-left`,children:[(0,i.jsxs)(`div`,{className:`flex flex-wrap items-center justify-center md:justify-start gap-3`,children:[(0,i.jsx)(r.Typography,{variant:`h1`,className:`font-black tracking-tight text-3xl md:text-4xl`,children:c}),l]}),typeof u==`string`?(0,i.jsx)(r.Typography,{variant:`small`,className:`text-muted-foreground font-medium block max-w-xl leading-relaxed`,children:u}):u]})]}),d&&(0,i.jsx)(`div`,{className:`flex flex-col items-center md:items-end gap-3 bg-muted/20 p-6 rounded-3xl border border-border/40 backdrop-blur-sm self-stretch md:self-auto justify-center min-w-[200px]`,children:d})]}),p?(0,i.jsxs)(`div`,{className:`grid grid-cols-1 lg:grid-cols-4 gap-8 items-start`,children:[(0,i.jsx)(`div`,{className:`lg:col-span-3 space-y-6 w-full`,children:f}),(0,i.jsx)(`div`,{className:`space-y-6 w-full`,children:p})]}):(0,i.jsx)(`div`,{className:`w-full`,children:f})]})}exports.DetailViewLayout=o,exports.default=o;

package/dist/shared/custom/layouts/detail-view.layout.d.ts

@@ -0,0 +1,33 @@
+import { default as React } from 'react';
+interface DetailViewLayoutProps {
+    /** Etiqueta del botón de regreso (ej: "Volver a Proyectos") */
+    backLabel?: string;
+    /** Destino opcional de navegación para retroceder (por defecto -1) */
+    backTo?: string | number;
+    /** Etiqueta superior derecha (ej: "ID: 4d2b") */
+    referenceLabel?: string;
+    /** Icono principal de la cabecera */
+    icon: React.ReactNode;
+    /** Título principal (ej: Nombre del proyecto) */
+    title: string;
+    /** Elemento Badge junto al título (ej: Tipo de proyecto) */
+    badge?: React.ReactNode;
+    /** Descripción descriptiva debajo del título */
+    description?: React.ReactNode;
+    /** Bloque de metadatos o información adicional en el lado derecho de la cabecera */
+    metaBlock?: React.ReactNode;
+    /** Contenido principal (izquierda si hay sidebar) */
+    children: React.ReactNode;
+    /** Contenido lateral/acciones (opcional) */
+    sidebar?: React.ReactNode;
+    className?: string;
+}
+/**
+ * DetailViewLayout
+ *
+ * Layout premium y unificado para pantallas de detalle de entidades (Proyectos, Herramientas, etc.).
+ * Centraliza la barra de navegación superior, la tarjeta de cabecera con efecto de cristal (glassmorphism)
+ * y una grilla responsive de 2 columnas para contenido y acciones.
+ */
+export declare function DetailViewLayout({ backLabel, backTo, referenceLabel, icon, title, badge, description, metaBlock, children, sidebar, className }: DetailViewLayoutProps): import("react/jsx-runtime").JSX.Element;
+export default DetailViewLayout;