vicdev-ui-lib 1.0.0

package/dist/vicdev-ui-lib.es.js

@@ -0,0 +1,1251 @@
+import { jsx as e, jsxs as s, Fragment as O } from "react/jsx-runtime";
+import { createContext as X, useState as k, useContext as Y, useEffect as K, useRef as G } from "react";
+import { AnimatePresence as q, motion as T } from "framer-motion";
+import { X as E, AlertTriangle as H, Info as J, XCircle as Q, CheckCircle as ee, EyeOff as R, Eye as I, Search as re, FileText as z, Upload as te, Check as ne, File as U, Loader2 as oe, AlertCircle as ae, Download as _, Image as se } from "lucide-react";
+import { createPortal as ie } from "react-dom";
+import { DataTable as le } from "primereact/datatable";
+import { Column as ce } from "primereact/column";
+const j = {
+  primary: "#0f172a",
+  primaryForeground: "#f8fafc",
+  secondary: "#f1f5f9",
+  secondaryForeground: "#0f172a",
+  accent: "#f1f5f9",
+  accentForeground: "#0f172a",
+  destructive: "#ef4444",
+  destructiveForeground: "#f8fafc",
+  background: "#ffffff",
+  foreground: "#0f172a",
+  card: "#ffffff",
+  cardForeground: "#0f172a",
+  border: "#e2e8f0",
+  input: "#e2e8f0",
+  ring: "#0f172a",
+  muted: "#f1f5f9",
+  mutedForeground: "#64748b",
+  popover: "#ffffff",
+  popoverForeground: "#0f172a",
+  radio: "#e2e8f0",
+  radioForeground: "#0f172a"
+}, de = {
+  colors: j,
+  name: "default",
+  description: "Tema por defecto de vicdev-ui-lib"
+};
+function Re(r) {
+  return {
+    colors: {
+      ...j,
+      ...r
+    },
+    name: "custom"
+  };
+}
+function Ie(r) {
+  const { colors: t } = r;
+  return `:root {
+${Object.entries(t).map(([n, o]) => `  --${n.replace(/([A-Z])/g, "-$1").toLowerCase()}: ${o};`).join(`
+`)}
+}`;
+}
+const Z = X(void 0);
+function Ue({ theme: r = de, children: t }) {
+  const [a, n] = k(r), o = {
+    theme: a,
+    setTheme: n
+  };
+  return /* @__PURE__ */ e(Z.Provider, { value: o, children: t });
+}
+function _e() {
+  const r = Y(Z);
+  if (r === void 0)
+    throw new Error("useTheme debe ser usado dentro de un ThemeProvider");
+  return r;
+}
+function ue(r) {
+  const t = { ...j, ...r };
+  return {
+    primary: {
+      DEFAULT: t.primary,
+      foreground: t.primaryForeground
+    },
+    secondary: {
+      DEFAULT: t.secondary,
+      foreground: t.secondaryForeground
+    },
+    accent: {
+      DEFAULT: t.accent,
+      foreground: t.accentForeground
+    },
+    destructive: {
+      DEFAULT: t.destructive,
+      foreground: t.destructiveForeground
+    },
+    background: t.background,
+    foreground: t.foreground,
+    card: {
+      DEFAULT: t.card,
+      foreground: t.cardForeground
+    },
+    border: t.border,
+    input: t.input,
+    ring: t.ring,
+    muted: {
+      DEFAULT: t.muted,
+      foreground: t.mutedForeground
+    },
+    popover: {
+      DEFAULT: t.popover,
+      foreground: t.popoverForeground
+    },
+    radio: {
+      DEFAULT: t.radio,
+      foreground: t.radioForeground
+    }
+  };
+}
+function Ve(r) {
+  return {
+    extend: {
+      colors: ue(r),
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)"
+      }
+    }
+  };
+}
+function me(r) {
+  const t = { ...j, ...r };
+  return `@theme {
+${Object.entries(t).map(([n, o]) => `  --color-${n.replace(/([A-Z])/g, "-$1").toLowerCase()}: ${o};`).join(`
+`)}
+
+  /* Border radius */
+  --radius: 0.5rem;
+}`;
+}
+function fe(r) {
+  const t = { ...j, ...r };
+  return `:root {
+${Object.entries(t).map(([n]) => {
+    const o = n.replace(/([A-Z])/g, "-$1").toLowerCase(), i = `color-${o}`;
+    return `  --${o}: var(--${i});`;
+  }).join(`
+`)}
+}`;
+}
+function We(r) {
+  const t = me(r), a = fe(r);
+  return `${t}
+
+${a}`;
+}
+const V = {
+  primary: "bg-primary text-primary-foreground hover:bg-primary/90 font-bold shadow-lg",
+  secondary: "bg-white border-2 border-border/20 text-foreground hover:border-border/40 hover:bg-card shadow-sm",
+  accent: "bg-gradient-to-r from-accent to-accent/90 text-accent-foreground hover:shadow-lg",
+  danger: "bg-destructive text-destructive-foreground hover:bg-destructive/90 border-0 shadow-lg hover:shadow-destructive/25",
+  outline: "border-2 border-border/30 text-foreground hover:bg-card hover:border-border/50",
+  ghost: "text-foreground hover:bg-card hover:text-primary",
+  success: "bg-green-500 text-white hover:bg-green-600 hover:shadow-green-400/20"
+}, B = ({
+  onClick: r,
+  icon: t,
+  label: a,
+  variant: n = "primary",
+  type: o = "button",
+  className: i = "",
+  disabled: d = !1,
+  children: c,
+  ...u
+}) => /* @__PURE__ */ s(
+  "button",
+  {
+    onClick: r,
+    type: o,
+    disabled: d,
+    className: `
+        flex items-center justify-center px-4 py-3 rounded-xl font-semibold text-sm
+        transition-all duration-300 hover:scale-[1.02] active:scale-[0.98] group
+        disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100
+        ${V[n] ?? V.primary} ${i}
+      `,
+    ...u,
+    children: [
+      t && /* @__PURE__ */ e(
+        t,
+        {
+          size: 20,
+          className: `${a ? "mr-2" : ""} ${d ? "" : "group-hover:rotate-12"} transition-transform duration-300`
+        }
+      ),
+      a,
+      c
+    ]
+  }
+), W = {
+  sm: "max-w-sm",
+  md: "max-w-md",
+  lg: "max-w-2xl",
+  xl: "max-w-4xl",
+  full: "max-w-[90vw]",
+  fullscreen: "w-[95vw] h-[95vh]"
+};
+function pe({
+  isOpen: r,
+  onClose: t,
+  title: a = "",
+  tamaño: n = "lg",
+  children: o,
+  canClose: i = !0
+  // Por defecto se puede cerrar
+}) {
+  const d = /* @__PURE__ */ e(q, { children: r && /* @__PURE__ */ s(O, { children: [
+    /* @__PURE__ */ e(
+      T.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+        className: "fixed inset-0 z-[99998]"
+      }
+    ),
+    /* @__PURE__ */ e(
+      T.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+        className: `fixed inset-0 z-[99999] bg-black/60 backdrop-blur-sm flex items-center justify-center ${n === "fullscreen" ? "p-2" : "p-4"} ${i ? "" : "cursor-not-allowed"}`,
+        onClick: i ? t : (c) => c.stopPropagation(),
+        children: /* @__PURE__ */ s(
+          T.div,
+          {
+            initial: { opacity: 0, scale: 0.95, y: 20 },
+            animate: { opacity: 1, scale: 1, y: 0 },
+            exit: { opacity: 0, scale: 0.95, y: 20 },
+            transition: { type: "spring", damping: 20, stiffness: 300 },
+            className: `
+              bg-background shadow-2xl w-full overflow-hidden relative border border-border/50
+              ${n === "fullscreen" ? "rounded-none h-[95vh]" : "rounded-2xl max-h-[95vh]"}
+              ${W[n] || W.md}
+            `,
+            onClick: (c) => c.stopPropagation(),
+            children: [
+              /* @__PURE__ */ s("div", { className: "bg-gradient-to-r from-primary to-secondary p-4 flex justify-between items-center sticky top-0 z-10 border-b border-primary-foreground/20", children: [
+                /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
+                  /* @__PURE__ */ e("div", { className: "w-8 h-8 bg-primary-foreground/20 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ e("div", { className: "w-4 h-4 bg-primary-foreground rounded-full" }) }),
+                  /* @__PURE__ */ e("h2", { className: "text-lg font-bold text-primary-foreground", children: a })
+                ] }),
+                i ? /* @__PURE__ */ e(
+                  "button",
+                  {
+                    onClick: t,
+                    className: "text-primary-foreground hover:text-primary-foreground/80 hover:bg-primary-foreground/10 p-2 rounded-lg transition-all duration-200",
+                    children: /* @__PURE__ */ e(E, { size: 24 })
+                  }
+                ) : /* @__PURE__ */ e("div", { className: "w-10 h-10 flex items-center justify-center", children: /* @__PURE__ */ e("div", { className: "w-5 h-5 border-2 border-primary-foreground/30 border-t-primary-foreground rounded-full animate-spin" }) })
+              ] }),
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  className: `overflow-y-auto bg-gradient-to-b from-background to-card/30 ${n === "fullscreen" ? "p-8 h-[calc(95vh-100px)]" : "p-6 max-h-[calc(95vh-100px)]"}`,
+                  children: o
+                }
+              )
+            ]
+          }
+        )
+      }
+    )
+  ] }) });
+  return typeof window < "u" ? ie(d, document.body) : d;
+}
+const Ke = ({
+  isOpen: r,
+  onClose: t,
+  onConfirm: a,
+  loading: n = !1,
+  entidad: o
+}) => {
+  if (!r) return null;
+  const {
+    tipo: i = "elemento",
+    // "categoría", "producto", etc.
+    nombre: d = "",
+    dependencias: c = 0,
+    nombreDependencia: u = ""
+  } = o || {};
+  return /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4", children: /* @__PURE__ */ s("div", { className: "bg-background rounded-2xl shadow-2xl max-w-md w-full p-6 transform transition-all", children: [
+    /* @__PURE__ */ e("div", { className: "flex items-center justify-center w-16 h-16 mx-auto mb-4 bg-destructive/10 rounded-full", children: /* @__PURE__ */ e(H, { className: "w-8 h-8 text-destructive" }) }),
+    /* @__PURE__ */ s("h3", { className: "text-xl font-bold text-foreground text-center mb-2", children: [
+      "¿Eliminar ",
+      i,
+      "?"
+    ] }),
+    /* @__PURE__ */ s("p", { className: "text-muted-foreground text-center mb-6", children: [
+      "Esta acción eliminará ",
+      i === "producto" ? "el" : "la",
+      " ",
+      /* @__PURE__ */ s("strong", { children: [
+        i,
+        ' "',
+        d,
+        '"'
+      ] }),
+      c > 0 && u ? /* @__PURE__ */ s(O, { children: [
+        " y afectará a ",
+        /* @__PURE__ */ s("strong", { children: [
+          c,
+          " ",
+          u
+        ] }),
+        "."
+      ] }) : null,
+      /* @__PURE__ */ e("br", {}),
+      "Esta acción no se puede deshacer."
+    ] }),
+    /* @__PURE__ */ s("div", { className: "flex gap-3", children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: () => t(!1),
+          className: "flex-1 px-4 py-3 border border-border text-foreground rounded-xl hover:bg-card transition-colors",
+          children: "Cancelar"
+        }
+      ),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: a,
+          disabled: n,
+          className: `flex-1 px-4 py-3 ${n ? "bg-destructive/70" : "bg-destructive hover:bg-destructive/90"} text-destructive-foreground rounded-xl transition-colors`,
+          children: n ? "Cargando..." : "Eliminar"
+        }
+      )
+    ] })
+  ] }) });
+}, ge = {
+  success: {
+    container: "bg-primary/10 border-primary/30 text-primary",
+    icon: ee
+  },
+  error: {
+    container: "bg-destructive/10 border-destructive/30 text-destructive",
+    icon: Q
+  },
+  info: {
+    container: "bg-blue-500/10 border-blue-500/30 text-blue-600 dark:text-blue-400",
+    icon: J
+  },
+  warning: {
+    container: "bg-amber-500/10 border-amber-500/30 text-amber-700 dark:text-amber-400",
+    icon: H
+  }
+};
+function Ge({
+  message: r,
+  variant: t = "info",
+  open: a,
+  onClose: n,
+  autoClose: o,
+  className: i = ""
+}) {
+  const { container: d, icon: c } = ge[t];
+  return K(() => {
+    if (!a || !o) return;
+    const u = setTimeout(n, o);
+    return () => clearTimeout(u);
+  }, [a, o, n]), a ? /* @__PURE__ */ s(
+    "div",
+    {
+      role: "alert",
+      className: `fixed top-20 right-4 z-[9999] max-w-md flex items-center gap-3 px-4 py-3 rounded-xl border shadow-xl shadow-black/10 dark:shadow-black/30 animate-in slide-in-from-top-5 fade-in duration-300 ${d} ${i}`,
+      children: [
+        /* @__PURE__ */ e(c, { className: "w-5 h-5 shrink-0", "aria-hidden": !0 }),
+        /* @__PURE__ */ e("p", { className: "font-medium flex-1", children: r }),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: n,
+            className: "shrink-0 p-1 rounded-lg hover:bg-black/5 dark:hover:bg-white/5 transition-colors focus:outline-none focus:ring-2 focus:ring-ring",
+            "aria-label": "Cerrar",
+            children: /* @__PURE__ */ e(E, { className: "w-4 h-4" })
+          }
+        )
+      ]
+    }
+  ) : null;
+}
+const he = "No hay registros para mostrar.", be = 10, xe = [10, 25, 50];
+function ve({
+  value: r,
+  columns: t,
+  dataKey: a,
+  emptyMessage: n = he,
+  loading: o = !1,
+  paginator: i = !1,
+  rows: d = be,
+  rowsPerPageOptions: c = xe,
+  size: u = "normal",
+  stripedRows: f = !1,
+  showGridlines: b = !1,
+  className: p,
+  style: g
+}) {
+  const x = t.filter((l) => !l.hidden);
+  return /* @__PURE__ */ e("div", { className: `data-table-viva overflow-hidden rounded-lg border border-border bg-card ${p ?? ""}`.trim(), style: g, children: /* @__PURE__ */ e(
+    le,
+    {
+      value: r,
+      dataKey: a,
+      loading: o,
+      emptyMessage: n,
+      paginator: i,
+      rows: d,
+      rowsPerPageOptions: c,
+      size: u,
+      stripedRows: f,
+      showGridlines: b,
+      paginatorTemplate: "FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown",
+      currentPageReportTemplate: "Mostrando {first} a {last} de {totalRecords} registros",
+      children: x.map((l) => /* @__PURE__ */ e(
+        ce,
+        {
+          field: l.field,
+          header: l.header,
+          sortable: l.sortable ?? !1,
+          align: l.align,
+          alignHeader: l.alignHeader,
+          style: l.style,
+          bodyClassName: l.bodyClassName,
+          body: l.body ? (h) => l.body(h) : void 0
+        },
+        String(l.field)
+      ))
+    }
+  ) });
+}
+function He(r) {
+  return /* @__PURE__ */ e(ve, { ...r });
+}
+const ye = "w-full px-4 py-3 border text-base border-input rounded-xl focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-all bg-background shadow-sm", we = "w-full pl-4 pr-12 py-3 border text-base border-input rounded-xl focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-all bg-background shadow-sm", Ne = "w-full px-4 pt-6 pb-2 border text-base border-input rounded-xl focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-all bg-background shadow-sm", ke = "w-full pl-4 pr-12 pt-6 pb-2 border text-base border-input rounded-xl focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-all bg-background shadow-sm";
+function Ze({
+  label: r,
+  id: t,
+  name: a,
+  type: n = "text",
+  value: o = "",
+  onChange: i,
+  onBlur: d,
+  placeholder: c,
+  required: u = !1,
+  options: f = [],
+  rows: b = 4,
+  className: p = "",
+  floatingLabel: g = !1,
+  helperText: x,
+  disabled: l = !1,
+  inputMode: h
+}) {
+  const [P, $] = k(!1), [v, C] = k(!1), y = G(null), L = g && (P || o !== "" && o !== void 0 && o !== null), m = n === "password", w = m && v ? "text" : n, S = () => {
+    $(!0);
+  }, A = (N) => {
+    $(!1), d?.(N);
+  }, F = g ? m ? ke : Ne : m ? we : ye, M = () => {
+    C(!v);
+  };
+  return /* @__PURE__ */ s("div", { className: p, children: [
+    g ? /* @__PURE__ */ s("div", { className: "relative", children: [
+      r && /* @__PURE__ */ s(
+        "label",
+        {
+          htmlFor: t,
+          className: `absolute left-4 transition-all duration-200 pointer-events-none ${L ? "top-2 text-xs text-muted-foreground font-medium" : "top-1/2 -translate-y-1/2 text-base text-muted-foreground/70"}`,
+          children: [
+            r,
+            u && /* @__PURE__ */ e("span", { className: "text-destructive ml-1", children: "*" })
+          ]
+        }
+      ),
+      n === "textarea" ? /* @__PURE__ */ e(
+        "textarea",
+        {
+          ref: y,
+          id: t,
+          name: a,
+          value: o,
+          onChange: i,
+          onFocus: S,
+          onBlur: A,
+          placeholder: L ? c : "",
+          rows: b,
+          disabled: l,
+          className: `${F} resize-none`
+        }
+      ) : n === "select" ? /* @__PURE__ */ s(
+        "select",
+        {
+          ref: y,
+          id: t,
+          name: a,
+          value: o,
+          onChange: i,
+          onFocus: S,
+          onBlur: A,
+          disabled: l,
+          className: F,
+          children: [
+            /* @__PURE__ */ e("option", { value: "", children: "Seleccionar opción" }),
+            f.map((N) => /* @__PURE__ */ e("option", { value: N.value, children: N.label }, N.value))
+          ]
+        }
+      ) : /* @__PURE__ */ s("div", { className: "relative", children: [
+        /* @__PURE__ */ e(
+          "input",
+          {
+            ref: y,
+            type: w,
+            id: t,
+            name: a,
+            value: o,
+            onChange: i,
+            onFocus: S,
+            onBlur: A,
+            placeholder: L ? c : "",
+            disabled: l,
+            inputMode: h,
+            className: F
+          }
+        ),
+        m && /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: M,
+            className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors focus:outline-none focus:ring-2 focus:ring-ring rounded p-1",
+            "aria-label": v ? "Ocultar contraseña" : "Mostrar contraseña",
+            children: v ? /* @__PURE__ */ e(R, { className: "w-5 h-5" }) : /* @__PURE__ */ e(I, { className: "w-5 h-5" })
+          }
+        )
+      ] })
+    ] }) : /* @__PURE__ */ s(O, { children: [
+      r && /* @__PURE__ */ s(
+        "label",
+        {
+          htmlFor: t,
+          className: "block text-base font-semibold text-foreground mb-2",
+          children: [
+            r,
+            u && /* @__PURE__ */ e("span", { className: "text-destructive ml-1", children: "*" })
+          ]
+        }
+      ),
+      n === "textarea" ? /* @__PURE__ */ e(
+        "textarea",
+        {
+          id: t,
+          name: a,
+          value: o,
+          onChange: i,
+          placeholder: c,
+          rows: b,
+          disabled: l,
+          className: `${F} resize-none`
+        }
+      ) : n === "select" ? /* @__PURE__ */ s(
+        "select",
+        {
+          id: t,
+          name: a,
+          value: o,
+          onChange: i,
+          disabled: l,
+          className: F,
+          children: [
+            /* @__PURE__ */ e("option", { value: "", children: "Seleccionar opción" }),
+            f.map((N) => /* @__PURE__ */ e("option", { value: N.value, children: N.label }, N.value))
+          ]
+        }
+      ) : /* @__PURE__ */ s("div", { className: "relative", children: [
+        /* @__PURE__ */ e(
+          "input",
+          {
+            type: w,
+            id: t,
+            name: a,
+            value: o,
+            onChange: i,
+            onFocus: S,
+            onBlur: A,
+            placeholder: c,
+            disabled: l,
+            inputMode: h,
+            className: F
+          }
+        ),
+        m && /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: M,
+            className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors focus:outline-none focus:ring-2 focus:ring-ring rounded p-1",
+            "aria-label": v ? "Ocultar contraseña" : "Mostrar contraseña",
+            children: v ? /* @__PURE__ */ e(R, { className: "w-5 h-5" }) : /* @__PURE__ */ e(I, { className: "w-5 h-5" })
+          }
+        )
+      ] })
+    ] }),
+    x && /* @__PURE__ */ e("p", { className: `mt-2 text-sm ${p?.includes("border-red-500") ? "text-destructive" : "text-muted-foreground"}`, children: x })
+  ] });
+}
+function Xe({
+  value: r,
+  onChange: t,
+  placeholder: a = "Buscar...",
+  className: n = ""
+}) {
+  return /* @__PURE__ */ s("div", { className: `relative ${n}`, children: [
+    /* @__PURE__ */ e(re, { className: "absolute left-4 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400" }),
+    /* @__PURE__ */ e(
+      "input",
+      {
+        type: "text",
+        value: r,
+        onChange: (o) => t(o.target.value),
+        placeholder: a,
+        className: "w-full pl-12 pr-4 py-3 bg-white border-2 border-gray-200 rounded-xl focus:ring-2 focus:ring-uno focus:border-uno transition-all text-sm font-medium text-divisiones placeholder-gray-400"
+      }
+    ),
+    r && /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => t(""),
+        className: "absolute right-4 top-1/2 transform -translate-y-1/2 text-gray-400 hover:text-divisiones transition-colors",
+        type: "button",
+        children: /* @__PURE__ */ e(E, { className: "w-4 h-4" })
+      }
+    )
+  ] });
+}
+function Ye({
+  id: r,
+  name: t,
+  label: a,
+  accept: n = ".pdf,application/pdf",
+  required: o = !1,
+  helperText: i,
+  onChange: d,
+  error: c,
+  disabled: u = !1,
+  maxSizeMB: f = 10,
+  currentFileName: b
+}) {
+  const [p, g] = k(null), [x, l] = k(!1), h = G(null), P = (m) => {
+    if (n.includes("pdf") && m.type !== "application/pdf")
+      return "El archivo debe ser un PDF";
+    const w = f * 1024 * 1024;
+    return m.size > w ? `El archivo no debe superar ${f}MB` : null;
+  }, $ = (m) => {
+    if (!m) {
+      g(null), d(null);
+      return;
+    }
+    if (P(m)) {
+      d(null);
+      return;
+    }
+    g(m), d(m);
+  }, v = (m) => {
+    const w = m.target.files?.[0] || null;
+    $(w);
+  }, C = (m) => {
+    m.preventDefault(), m.stopPropagation(), m.type === "dragenter" || m.type === "dragover" ? l(!0) : m.type === "dragleave" && l(!1);
+  }, y = (m) => {
+    if (m.preventDefault(), m.stopPropagation(), l(!1), u) return;
+    const w = m.dataTransfer.files?.[0];
+    w && $(w);
+  }, D = () => {
+    g(null), d(null), h.current && (h.current.value = "");
+  };
+  return /* @__PURE__ */ s("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ s("label", { htmlFor: r, className: "block text-sm font-medium text-foreground", children: [
+      a,
+      o && /* @__PURE__ */ e("span", { className: "text-destructive ml-1", children: "*" })
+    ] }),
+    /* @__PURE__ */ s(
+      "div",
+      {
+        className: `
+                    relative border-2 border-dashed rounded-lg p-6 transition-all
+                    ${x ? "border-primary bg-primary/5" : "border-border"}
+                    ${u ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:border-primary/50"}
+                    ${c ? "border-destructive" : ""}
+                `,
+        onDragEnter: C,
+        onDragLeave: C,
+        onDragOver: C,
+        onDrop: y,
+        onClick: () => {
+          u || h.current?.click();
+        },
+        children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              ref: h,
+              id: r,
+              name: t,
+              type: "file",
+              accept: n,
+              onChange: v,
+              disabled: u,
+              className: "hidden"
+            }
+          ),
+          p || b ? /* @__PURE__ */ s("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ s("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: [
+              /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-primary/10 flex-shrink-0", children: /* @__PURE__ */ e(z, { className: "w-5 h-5 text-primary" }) }),
+              /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ e("p", { className: "text-sm font-medium text-foreground truncate", children: p?.name || b }),
+                p && /* @__PURE__ */ s("p", { className: "text-xs text-muted-foreground", children: [
+                  (p.size / 1024 / 1024).toFixed(2),
+                  " MB"
+                ] })
+              ] })
+            ] }),
+            !u && /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                onClick: (m) => {
+                  m.stopPropagation(), D();
+                },
+                className: "p-2 rounded-lg hover:bg-destructive/10 transition-colors flex-shrink-0",
+                children: /* @__PURE__ */ e(E, { className: "w-4 h-4 text-destructive" })
+              }
+            )
+          ] }) : /* @__PURE__ */ s("div", { className: "text-center", children: [
+            /* @__PURE__ */ e(te, { className: "mx-auto h-12 w-12 text-muted-foreground" }),
+            /* @__PURE__ */ s("div", { className: "mt-4", children: [
+              /* @__PURE__ */ s("p", { className: "text-sm text-foreground", children: [
+                "Arrastra y suelta tu archivo aquí, o",
+                " ",
+                /* @__PURE__ */ e("span", { className: "text-primary font-medium", children: "haz clic para seleccionar" })
+              ] }),
+              /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground mt-2", children: n.includes("pdf") ? `Archivos PDF (máx. ${f}MB)` : `Máximo ${f}MB` })
+            ] })
+          ] })
+        ]
+      }
+    ),
+    i && !c && /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground", children: i }),
+    c && /* @__PURE__ */ e("p", { className: "text-xs text-destructive", children: c })
+  ] });
+}
+function qe({
+  label: r,
+  id: t,
+  options: a,
+  selectedIds: n,
+  onChange: o,
+  loading: i = !1,
+  disabled: d = !1,
+  loadingMessage: c = "Cargando...",
+  emptyMessage: u,
+  renderLabel: f,
+  helperText: b,
+  itemName: p = "item",
+  itemNamePlural: g,
+  maxHeight: x = "max-h-60",
+  headerAction: l,
+  emptyAction: h,
+  className: P = ""
+}) {
+  const $ = g || `${p}s`, v = n.length, C = v > 0;
+  return /* @__PURE__ */ s("div", { className: `space-y-2 ${P}`, children: [
+    /* @__PURE__ */ s("div", { className: l ? "flex items-center justify-between" : "", children: [
+      /* @__PURE__ */ e("label", { htmlFor: t, className: "block text-sm font-medium text-foreground", children: r }),
+      l && /* @__PURE__ */ e(
+        B,
+        {
+          type: "button",
+          variant: l.variant || "outline",
+          icon: l.icon,
+          label: l.label,
+          onClick: l.onClick,
+          disabled: d,
+          className: "text-xs"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e("div", { className: `${x} overflow-y-auto border border-border rounded-lg p-3 bg-background`, children: i ? /* @__PURE__ */ e("div", { className: "text-center py-4 text-muted-foreground", children: c }) : a.length === 0 ? /* @__PURE__ */ s("div", { className: "text-center py-4 space-y-3", children: [
+      u && /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground", children: u }),
+      h && /* @__PURE__ */ e(
+        B,
+        {
+          type: "button",
+          variant: h.variant || "primary",
+          icon: h.icon,
+          label: h.label,
+          onClick: h.onClick,
+          disabled: d
+        }
+      )
+    ] }) : /* @__PURE__ */ e("div", { className: "space-y-2", children: a.map((y) => {
+      const D = n.includes(y.id);
+      return /* @__PURE__ */ s(
+        "label",
+        {
+          className: "flex items-center space-x-2 p-2 rounded hover:bg-card/50 cursor-pointer transition-colors",
+          children: [
+            /* @__PURE__ */ e(
+              "input",
+              {
+                type: "checkbox",
+                checked: D,
+                onChange: () => o(y.id),
+                disabled: d,
+                className: "w-4 h-4 text-primary border-border rounded focus:ring-primary focus:ring-2"
+              }
+            ),
+            /* @__PURE__ */ e("span", { className: "text-sm text-foreground", children: f(y) })
+          ]
+        },
+        y.id
+      );
+    }) }) }),
+    b && /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground", children: b }),
+    C && /* @__PURE__ */ s("p", { className: "text-xs text-primary", children: [
+      v,
+      " ",
+      v === 1 ? p : $,
+      " seleccionado",
+      v !== 1 ? "s" : ""
+    ] })
+  ] });
+}
+function Je({
+  label: r,
+  description: t,
+  value: a,
+  onChange: n,
+  icon: o,
+  disabled: i = !1,
+  className: d = ""
+}) {
+  const c = !!a;
+  return /* @__PURE__ */ s("div", { className: `flex items-center justify-between p-4 bg-background rounded-xl border border-border hover:bg-card transition-colors duration-200 ${i ? "opacity-50 cursor-not-allowed" : ""} ${d}`, children: [
+    /* @__PURE__ */ s("div", { className: "flex items-center gap-3 flex-1", children: [
+      o && /* @__PURE__ */ e("div", { className: "flex-shrink-0 w-10 h-10 bg-gradient-to-br from-primary/80 to-primary-foreground/20 rounded-lg flex items-center justify-center text-primary-foreground", children: o }),
+      /* @__PURE__ */ s("div", { className: "flex-1", children: [
+        /* @__PURE__ */ e("label", { className: "block text-sm font-semibold text-foreground mb-1", children: r }),
+        t && /* @__PURE__ */ e("span", { className: "text-xs text-muted-foreground", children: t })
+      ] })
+    ] }),
+    /* @__PURE__ */ e(
+      T.button,
+      {
+        type: "button",
+        onClick: () => !i && n(!c),
+        disabled: i,
+        className: `
+                    relative flex items-center w-14 h-8 rounded-full p-1 transition-colors duration-300 
+                    focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/50
+                    ${i ? "cursor-not-allowed" : "cursor-pointer"}
+                    ${c ? "bg-gradient-to-r from-green-500 to-green-600" : "bg-muted"}
+                `,
+        whileTap: i ? {} : { scale: 0.95 },
+        children: /* @__PURE__ */ e(
+          T.div,
+          {
+            className: "w-6 h-6 bg-white rounded-full shadow-lg flex items-center justify-center",
+            animate: {
+              x: c ? 24 : 0
+            },
+            transition: {
+              type: "spring",
+              stiffness: 500,
+              damping: 30
+            },
+            children: c ? /* @__PURE__ */ e(ne, { className: "w-4 h-4 text-green-600" }) : /* @__PURE__ */ e(E, { className: "w-4 h-4 text-muted-foreground" })
+          }
+        )
+      }
+    )
+  ] });
+}
+const $e = (r) => {
+  const t = typeof r == "string" ? parseFloat(r) : r;
+  return new Intl.NumberFormat("es-CO", {
+    style: "currency",
+    currency: "COP",
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  }).format(t);
+};
+function Qe({
+  value: r,
+  className: t = "",
+  bold: a = !1,
+  primary: n = !1,
+  secondary: o = !1,
+  success: i = !1,
+  error: d = !1,
+  size: c = "base",
+  emptyText: u = "-"
+}) {
+  if (r == null)
+    return /* @__PURE__ */ e("span", { className: `text-muted-foreground ${t}`, children: u });
+  const f = typeof r == "string" ? parseFloat(r) : r;
+  if (isNaN(f))
+    return /* @__PURE__ */ e("span", { className: `text-muted-foreground ${t}`, children: u });
+  const b = $e(f), p = {
+    sm: "text-sm",
+    base: "text-base",
+    lg: "text-lg",
+    xl: "text-xl",
+    "2xl": "text-2xl"
+  }, g = n ? "text-primary" : o ? "text-secondary" : i ? "text-green-600 dark:text-green-400" : d ? "text-destructive" : "text-foreground", x = a ? "font-bold" : "font-normal";
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      className: `${p[c]} ${g} ${x} ${t}`,
+      children: b
+    }
+  );
+}
+const Ce = {
+  small: { width: 60, height: 45 },
+  default: { width: 120, height: 90 },
+  large: { width: 180, height: 135 }
+}, Fe = {
+  default: "/logo.png",
+  logo2: "/logo2.png",
+  white: "/logoW.png",
+  whiteNoBg: "/logoW_sin_bg.png"
+}, er = ({
+  size: r = "default",
+  variant: t = "whiteNoBg",
+  src: a,
+  alt: n = "Logo de Buenity",
+  className: o = "",
+  fondoColor: i = "transparent",
+  // valor por defecto: transparente
+  animated: d = !1,
+  // animaciones desactivadas por defecto
+  animationType: c = "fade",
+  animationDuration: u = 1
+}) => {
+  const { width: f, height: b } = Ce[r], p = a || Fe[t], x = (() => {
+    if (!d) return {};
+    const h = {
+      initial: { opacity: 0 },
+      animate: { opacity: 1 },
+      transition: { duration: u }
+    };
+    switch (c) {
+      case "fade":
+        return {
+          ...h,
+          initial: { opacity: 0 },
+          animate: { opacity: 1 }
+        };
+      case "scale":
+        return {
+          initial: { opacity: 0, scale: 0.8 },
+          animate: { opacity: 1, scale: 1 },
+          transition: { duration: u, ease: "easeOut" }
+        };
+      case "pulse":
+        return {
+          initial: { opacity: 0, scale: 1 },
+          animate: {
+            opacity: 1,
+            scale: [1, 1.05, 1]
+          },
+          transition: {
+            duration: u,
+            repeat: 1 / 0,
+            repeatType: "reverse",
+            ease: "easeInOut"
+          }
+        };
+      case "bounce":
+        return {
+          initial: { opacity: 0, y: -20 },
+          animate: {
+            opacity: 1,
+            y: 0
+          },
+          transition: {
+            duration: u,
+            type: "spring",
+            stiffness: 200,
+            damping: 10
+          }
+        };
+      case "rotate":
+        return {
+          initial: { opacity: 0, rotate: -180 },
+          animate: {
+            opacity: 1,
+            rotate: 0
+          },
+          transition: {
+            duration: u,
+            ease: "easeOut"
+          }
+        };
+      default:
+        return h;
+    }
+  })(), l = {
+    className: "flex items-center rounded-xl justify-center",
+    style: { backgroundColor: i },
+    ...d ? x : {}
+  };
+  return d ? /* @__PURE__ */ e(T.div, { ...l, children: /* @__PURE__ */ e(
+    "img",
+    {
+      src: p,
+      width: f,
+      height: b,
+      alt: n,
+      className: `object-contain ${o}`
+    }
+  ) }) : /* @__PURE__ */ e("div", { ...l, children: /* @__PURE__ */ e(
+    "img",
+    {
+      src: p,
+      width: f,
+      height: b,
+      alt: n,
+      className: `object-contain ${o}`
+    }
+  ) });
+};
+function Te(r) {
+  const t = r.split("?")[0], a = t.match(/rp-(\d+)/i);
+  if (a) return `rp-${a[1]}`;
+  const n = t.split("/");
+  return (n[n.length - 1] || "").replace(/\.(pdf|jpg|jpeg|png|gif|webp)$/i, "") || "Soporte";
+}
+function rr({
+  url: r,
+  isOpen: t,
+  onClose: a,
+  displayName: n
+}) {
+  const [o, i] = k(!0), [d, c] = k(null), [u, f] = k("unknown");
+  K(() => {
+    if (!r) {
+      f("unknown"), i(!1);
+      return;
+    }
+    const l = r.toLowerCase();
+    l.match(/\.(jpg|jpeg|png|gif|webp|svg|bmp)$/) ? f("image") : l.match(/\.pdf$/) || l.includes("application/pdf") ? f("pdf") : f("unknown"), i(!1), c(null);
+  }, [r]);
+  const b = () => {
+    c("Error al cargar la imagen"), i(!1);
+  }, p = () => {
+    if (!r) return;
+    const l = document.createElement("a");
+    l.href = r, l.download = g, l.target = "_blank", document.body.appendChild(l), l.click(), document.body.removeChild(l);
+  }, g = n ?? (r ? Te(r) : "Archivo"), x = () => {
+    switch (u) {
+      case "image":
+        return /* @__PURE__ */ e(se, { className: "w-6 h-6 text-primary" });
+      case "pdf":
+        return /* @__PURE__ */ e(z, { className: "w-6 h-6 text-primary" });
+      default:
+        return /* @__PURE__ */ e(U, { className: "w-6 h-6 text-primary" });
+    }
+  };
+  return t ? /* @__PURE__ */ e(
+    pe,
+    {
+      isOpen: !0,
+      onClose: a,
+      title: g,
+      tamaño: "fullscreen",
+      canClose: !0,
+      children: /* @__PURE__ */ e("div", { className: "flex flex-col h-full min-h-[90dvh]", children: /* @__PURE__ */ s("div", { className: "flex-1 overflow-auto mt-4 bg-muted/30 rounded-xl p-4 min-h-[60vh]", children: [
+        !r && /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center min-h-[400px] text-muted-foreground", children: [
+          /* @__PURE__ */ e(U, { className: "w-12 h-12 mb-4 opacity-50" }),
+          /* @__PURE__ */ e("p", { children: "No hay archivo para visualizar." })
+        ] }),
+        r && o && /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center min-h-[400px] text-muted-foreground", children: [
+          /* @__PURE__ */ e(oe, { className: "w-12 h-12 text-primary animate-spin mb-4" }),
+          /* @__PURE__ */ e("p", { children: "Cargando archivo..." })
+        ] }),
+        r && d && /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center min-h-[400px] text-center", children: [
+          /* @__PURE__ */ e("div", { className: "w-16 h-16 bg-destructive/10 rounded-full flex items-center justify-center mx-auto mb-4", children: /* @__PURE__ */ e(ae, { className: "w-8 h-8 text-destructive" }) }),
+          /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-foreground mb-2", children: "Error al cargar el archivo" }),
+          /* @__PURE__ */ e("p", { className: "text-muted-foreground mb-4", children: d }),
+          /* @__PURE__ */ e(
+            B,
+            {
+              type: "button",
+              variant: "primary",
+              icon: _,
+              label: "Intentar descargar",
+              onClick: p
+            }
+          )
+        ] }),
+        r && !o && !d && /* @__PURE__ */ s(O, { children: [
+          u === "image" && /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ e(
+            "img",
+            {
+              src: r,
+              alt: g,
+              onError: b,
+              onLoad: () => i(!1),
+              className: "max-w-full max-h-[75vh] object-contain rounded-lg shadow-lg border border-border"
+            }
+          ) }),
+          u === "pdf" && /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[82dvh] w-full", children: /* @__PURE__ */ e(
+            "iframe",
+            {
+              src: r,
+              onLoad: () => i(!1),
+              className: "w-full h-[75vh] rounded-lg shadow-lg bg-background border border-border",
+              title: g
+            }
+          ) }),
+          u === "unknown" && /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center min-h-[400px] text-center", children: [
+            /* @__PURE__ */ e("div", { className: "w-16 h-16 bg-muted rounded-full flex items-center justify-center mx-auto mb-4", children: x() }),
+            /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-foreground mb-2", children: "Tipo de archivo no soportado para vista previa" }),
+            /* @__PURE__ */ e("p", { className: "text-muted-foreground mb-4", children: "Puede descargar el archivo para abrirlo en su dispositivo." }),
+            /* @__PURE__ */ e(
+              B,
+              {
+                type: "button",
+                variant: "primary",
+                icon: _,
+                label: "Descargar archivo",
+                onClick: p
+              }
+            )
+          ] })
+        ] })
+      ] }) })
+    }
+  ) : null;
+}
+function tr({
+  url: r,
+  displayName: t,
+  icon: a,
+  className: n = "inline-flex items-center gap-2 text-primary hover:text-primary/80 hover:underline font-medium"
+}) {
+  const o = r.startsWith("http") || r.startsWith("//") ? r : `${typeof window < "u" ? window.location.origin : ""}${r.startsWith("/") ? r : `/${r}`}`;
+  return /* @__PURE__ */ s(
+    "a",
+    {
+      href: o,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: n,
+      children: [
+        a ?? /* @__PURE__ */ e(z, { className: "w-4 h-4 shrink-0" }),
+        t
+      ]
+    }
+  );
+}
+const Pe = {
+  sm: "h-4 w-4",
+  md: "h-6 w-6",
+  lg: "h-10 w-10",
+  xl: "h-16 w-16"
+}, Ee = {
+  primary: "text-primary",
+  secondary: "text-secondary",
+  muted: "text-muted-foreground",
+  destructive: "text-destructive"
+};
+function je({
+  size: r = "md",
+  variant: t = "muted",
+  className: a = ""
+}) {
+  return /* @__PURE__ */ s(
+    "svg",
+    {
+      className: `${Pe[r]} ${Ee[t]} animate-spin ${a}`,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      "aria-hidden": "true",
+      role: "status",
+      "aria-label": "Cargando",
+      children: [
+        /* @__PURE__ */ e(
+          "circle",
+          {
+            className: "opacity-25",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            strokeWidth: "4"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            className: "opacity-75",
+            fill: "currentColor",
+            d: "M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"
+          }
+        )
+      ]
+    }
+  );
+}
+function nr({
+  text: r = "Cargando datos...",
+  size: t = "lg",
+  variant: a = "muted",
+  className: n = "",
+  textClassName: o = ""
+}) {
+  return /* @__PURE__ */ e("div", { className: `w-full h-screen flex items-center justify-center p-6 ${n}`, children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-4", children: [
+    /* @__PURE__ */ e(je, { size: t, variant: a }),
+    r && /* @__PURE__ */ e("span", { className: `text-lg font-semibold text-muted-foreground ${o}`, children: r })
+  ] }) });
+}
+export {
+  B as ActionButton,
+  Qe as CurrencyDisplay,
+  He as DataTable,
+  Ke as DeleteConfirmModal,
+  tr as FileLink,
+  Ye as FileUpload,
+  rr as FileViewerModal,
+  Ze as FormField,
+  je as Loader,
+  nr as LoaderScreen,
+  er as Logo,
+  pe as Modal,
+  qe as MultiSelectCheckbox,
+  Xe as SearchBar,
+  Ue as ThemeProvider,
+  Ge as Toast,
+  Je as ToggleSwitch,
+  Re as createTheme,
+  j as defaultColors,
+  de as defaultTheme,
+  Ie as generateCSSVariables,
+  fe as generateCompatibilityVariables,
+  We as generateTailwindV4CSS,
+  me as generateTailwindV4Theme,
+  Te as getRpSoporteDisplayName,
+  ue as getTailwindColors,
+  Ve as getTailwindConfig,
+  _e as useTheme
+};