@boxcustodia/library 2.0.0-alpha.2 → 2.0.0-alpha.21

package/dist/theme.css

@@ -1,224 +1,232 @@
-@plugin "tailwindcss-animate";
-@custom-variant open (&[data-state="open"]);
-@custom-variant closed (&[data-state="closed"]);
-@custom-variant invalid (&[aria-invalid="true"]);
-
-@theme {
-  --color-background: oklch(100% 0 0);
-  --color-foreground: oklch(13.63% 0.036 259.2);
-
-  --color-popover: oklch(100% 0 0);
-  --color-popover-foreground: oklch(13.63% 0.036 259.2);
-
-  --color-primary: oklch(59.5% 0.195 270.48);
-  --color-primary-foreground: oklch(100% 0 0);
-
-  --color-secondary: oklch(96.83% 0.007 247.9);
-  --color-secondary-foreground: oklch(20.77% 0.04 265.75);
-
-  --color-muted: oklch(96.83% 0.007 247.9);
-  --color-muted-foreground: oklch(55.44% 0.041 257.42);
-
-  --color-accent: oklch(96.74% 0.001 286.38);
-  --color-accent-foreground: oklch(19.06% 0.003 247.96);
-
-  --color-error: oklch(63.68% 0.208 25.33);
-  --color-error-foreground: oklch(98.42% 0.003 247.86);
-
-  --color-success: oklch(70.1% 0.146 156.33);
-  --color-success-foreground: oklch(98.42% 0.003 247.86);
-
-  --color-warning: oklch(79.65% 0.16 70.08);
-  --color-warning-foreground: oklch(17.97% 0.034 59.63);
-
-  --color-info: oklch(62.8% 0.152 237.57);
-  --color-info-foreground: oklch(98.42% 0.003 247.86);
-
-  --animate-toast-bump: toast-bump 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
-  --animate-skeleton: skeleton 1.5s linear infinite;
-
-  --color-input: oklch(76.68% 0 0);
-  --color-checkbox: var(--color-primary);
-  --color-ring: oklch(13.63% 0.036 259.2);
-
-  --radius: 0.5rem;
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: calc(var(--radius));
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-tag: 0.375rem;
-  --radius-checkbox: 0.25rem;
-
-  --icon-size: 1rem;
-}
-/* Tooltip enter animation — @starting-style is more reliable than data-[starting-style]
-   because it guarantees the browser paints the initial state before the transition fires,
-   avoiding the "no animation" issue caused by lost repaint frames. */
-@starting-style {
-  [data-slot="tooltip-popup"] {
-    scale: 0.98;
-    opacity: 0;
-  }
-}
-
-@layer base {
-  body {
-    background-color: var(--color-background);
-    color: var(--color-foreground);
-  }
-  * {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-  }
-  *,
-  ::after,
-  ::before,
-  ::backdrop,
-  ::file-selector-button {
-    border-color: var(--color-gray-200, currentColor);
-  }
-
-  input:disabled,
-  button:disabled,
-  textarea:disabled,
-  select:disabled,
-  [data-disabled="true"] {
-    pointer-events: none;
-    opacity: 0.5;
-  }
-  button:not(:disabled),
-  [role="button"]:not(:disabled) {
-    cursor: pointer;
-  }
-
-  .field-error {
-    border-color: var(--color-error);
-  }
-
-  .lucide {
-    width: var(--icon-size);
-    height: var(--icon-size);
-  }
-
-  @keyframes pulse {
-    0%,
-    100% {
-      opacity: 1;
-    }
-    50% {
-      opacity: 0.9;
-    }
-  }
-
-  @keyframes fadeIn {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-
-  /* Btn loader */
-  .btn-loader-enter,
-  .btn-loader-exit {
-    overflow: hidden;
-  }
-
-  .btn-loader-enter {
-    width: 0;
-    opacity: 0;
-  }
-
-  .btn-loader-enter-active {
-    width: var(--icon-size);
-    opacity: 1;
-    transition:
-      width 0.3s ease,
-      opacity 0.3s ease;
-  }
-
-  .btn-loader-exit {
-    width: var(--icon-size);
-    opacity: 1;
-  }
-
-  .btn-loader-exit-active {
-    width: 0;
-    opacity: 0;
-    transition:
-      width 0.15s ease,
-      opacity 0.25s ease;
-  }
-
-  /* Fade */
-  .fade-enter {
-    opacity: 0;
-    transform: scale(0.8);
-  }
-
-  .fade-enter-active {
-    opacity: 1;
-    transform: scale(1);
-    transition:
-      opacity 0.1s ease,
-      transform 0.1s ease;
-  }
-
-  .fade-exit {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  .fade-exit-active {
-    opacity: 0;
-    transform: scale(0.8);
-    transition:
-      opacity 0.2s ease,
-      transform 0.2s ease;
-  }
-
-  @keyframes skeleton {
-    to {
-      background-position: -200% 0;
-    }
-  }
-
-  @keyframes toast-bump {
-    0%,
-    100% {
-      transform: scale(1);
-    }
-    40% {
-      transform: scale(1.03);
-    }
-  }
-
-  .numberInput {
-    /* Chrome, Safari, Edge, Opera */
-    &::-webkit-outer-spin-button,
-    &::-webkit-inner-spin-button {
-      -webkit-appearance: none;
-      margin: -1;
-    }
-
-    /* Firefox */
-    &[type="number"] {
-      -moz-appearance: textfield;
-    }
-  }
-
-  .space-y-6 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 1.5rem;
-  }
-  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 1rem;
-  }
-  .space-y-2 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 0.5rem;
-  }
-  .space-y-1 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 0.275rem;
-  }
-}
+@import "tw-animate-css";
+@custom-variant open (&[data-state="open"]);
+@custom-variant closed (&[data-state="closed"]);
+@custom-variant invalid (&[aria-invalid="true"]);
+
+@theme {
+  --color-background: oklch(100% 0 0);
+  --color-foreground: oklch(13.63% 0.036 259.2);
+
+  --color-popover: oklch(100% 0 0);
+  --color-popover-foreground: oklch(13.63% 0.036 259.2);
+
+  --color-primary: oklch(59.5% 0.195 270.48);
+  --color-primary-foreground: oklch(100% 0 0);
+
+  --color-secondary: oklch(96.83% 0.007 247.9);
+  --color-secondary-foreground: oklch(20.77% 0.04 265.75);
+
+  --color-muted: oklch(96.83% 0.007 247.9);
+  --color-muted-foreground: oklch(55.44% 0.041 257.42);
+
+  --color-accent: oklch(96.74% 0.001 286.38);
+  --color-accent-foreground: oklch(19.06% 0.003 247.96);
+
+  --color-error: oklch(63.68% 0.208 25.33);
+  --color-error-foreground: oklch(98.42% 0.003 247.86);
+
+  --color-success: oklch(70.1% 0.146 156.33);
+  --color-success-foreground: oklch(98.42% 0.003 247.86);
+
+  --color-warning: oklch(79.65% 0.16 70.08);
+  --color-warning-foreground: oklch(98.42% 0.003 247.86);
+
+  --color-info: oklch(62.8% 0.152 237.57);
+  --color-info-foreground: oklch(98.42% 0.003 247.86);
+
+  --animate-toast-bump: toast-bump 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+  --animate-skeleton: skeleton 1.5s linear infinite;
+
+  --color-input: oklch(76.68% 0 0);
+  --color-checkbox: var(--color-primary);
+  --color-ring: oklch(13.63% 0.036 259.2);
+
+  --radius: 0.5rem;
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: calc(var(--radius));
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-tag: 0.375rem;
+  --radius-checkbox: 0.25rem;
+
+  --icon-size: 1rem;
+
+  --z-overlay: 50;
+  --z-float: 60;
+  --z-toast: 70;
+}
+/* Tooltip enter animation — @starting-style is more reliable than data-[starting-style]
+   because it guarantees the browser paints the initial state before the transition fires,
+   avoiding the "no animation" issue caused by lost repaint frames. */
+@starting-style {
+  [data-slot="tooltip-popup"] {
+    scale: 0.98;
+    opacity: 0;
+  }
+}
+
+@layer base {
+  #root {
+    isolation: isolate;
+  }
+
+  body {
+    background-color: var(--color-background);
+    color: var(--color-foreground);
+  }
+  * {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+  }
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentColor);
+  }
+
+  input:disabled,
+  button:disabled,
+  textarea:disabled,
+  select:disabled,
+  [data-disabled="true"] {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+  button:not(:disabled),
+  [role="button"]:not(:disabled) {
+    cursor: pointer;
+  }
+
+  .field-error {
+    border-color: var(--color-error);
+  }
+
+  .lucide {
+    width: var(--icon-size);
+    height: var(--icon-size);
+  }
+
+  @keyframes pulse {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.9;
+    }
+  }
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+
+  /* Btn loader */
+  .btn-loader-enter,
+  .btn-loader-exit {
+    overflow: hidden;
+  }
+
+  .btn-loader-enter {
+    width: 0;
+    opacity: 0;
+  }
+
+  .btn-loader-enter-active {
+    width: var(--icon-size);
+    opacity: 1;
+    transition:
+      width 0.3s ease,
+      opacity 0.3s ease;
+  }
+
+  .btn-loader-exit {
+    width: var(--icon-size);
+    opacity: 1;
+  }
+
+  .btn-loader-exit-active {
+    width: 0;
+    opacity: 0;
+    transition:
+      width 0.15s ease,
+      opacity 0.25s ease;
+  }
+
+  /* Fade */
+  .fade-enter {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+
+  .fade-enter-active {
+    opacity: 1;
+    transform: scale(1);
+    transition:
+      opacity 0.1s ease,
+      transform 0.1s ease;
+  }
+
+  .fade-exit {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  .fade-exit-active {
+    opacity: 0;
+    transform: scale(0.8);
+    transition:
+      opacity 0.2s ease,
+      transform 0.2s ease;
+  }
+
+  @keyframes skeleton {
+    to {
+      background-position: -200% 0;
+    }
+  }
+
+  @keyframes toast-bump {
+    0%,
+    100% {
+      transform: scale(1);
+    }
+    40% {
+      transform: scale(1.03);
+    }
+  }
+
+  .numberInput {
+    /* Chrome, Safari, Edge, Opera */
+    &::-webkit-outer-spin-button,
+    &::-webkit-inner-spin-button {
+      -webkit-appearance: none;
+      margin: -1;
+    }
+
+    /* Firefox */
+    &[type="number"] {
+      -moz-appearance: textfield;
+    }
+  }
+
+  .space-y-6 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 1.5rem;
+  }
+  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 1rem;
+  }
+  .space-y-2 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 0.5rem;
+  }
+  .space-y-1 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 0.275rem;
+  }
+}

package/dist/utils/form.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),a=require("@hookform/resolvers/zod"),s=require("react-hook-form"),d=require("zod"),c=require("../components/form/form.cjs.js"),m=require("../components/field/field.cjs.js");function F(r,e){const o=r.safeParse(e);return o.success?{data:o.data,errors:{}}:{data:null,errors:d.z.flattenError(o.error).fieldErrors}}function f(r,e){return s.useForm({...e,resolver:a.zodResolver(r)})}function v({form:r,onFormSubmit:e,children:o,...t}){return n.jsx(s.FormProvider,{...r,children:n.jsx(c.Form,{onSubmit:i=>{i.preventDefault(),r.handleSubmit(e)()},...t,children:o})})}function k({name:r,rules:e,render:o,...t}){const{control:i}=s.useFormContext();return n.jsx(s.Controller,{name:r,control:i,rules:e,render:({field:l,fieldState:u})=>n.jsx(m.Field,{...t,invalid:u.invalid,error:u.error?.message,children:o({...l,invalid:u.invalid})})})}exports.HookField=k;exports.HookForm=v;exports.parseFormValues=F;exports.useHookForm=f;

package/dist/utils/form.es.js

@@ -0,0 +1,62 @@
+import { jsx as n } from "react/jsx-runtime";
+import { zodResolver as l } from "@hookform/resolvers/zod";
+import { useForm as u, FormProvider as a, useFormContext as d, Controller as f } from "react-hook-form";
+import { z as c } from "zod";
+import { Form as p } from "../components/form/form.es.js";
+import { Field as F } from "../components/field/field.es.js";
+function z(r, o) {
+  const e = r.safeParse(o);
+  return e.success ? { data: e.data, errors: {} } : {
+    data: null,
+    errors: c.flattenError(e.error).fieldErrors
+  };
+}
+function C(r, o) {
+  return u({
+    ...o,
+    resolver: l(r)
+  });
+}
+function E({
+  form: r,
+  onFormSubmit: o,
+  children: e,
+  ...t
+}) {
+  return /* @__PURE__ */ n(a, { ...r, children: /* @__PURE__ */ n(
+    p,
+    {
+      onSubmit: (i) => {
+        i.preventDefault(), r.handleSubmit(o)();
+      },
+      ...t,
+      children: e
+    }
+  ) });
+}
+function P({ name: r, rules: o, render: e, ...t }) {
+  const { control: i } = d();
+  return /* @__PURE__ */ n(
+    f,
+    {
+      name: r,
+      control: i,
+      rules: o,
+      render: ({ field: s, fieldState: m }) => /* @__PURE__ */ n(
+        F,
+        {
+          ...t,
+          invalid: m.invalid,
+          error: m.error?.message,
+          children: e({ ...s, invalid: m.invalid })
+        }
+      )
+    }
+  );
+}
+export {
+  P as HookField,
+  E as HookForm,
+  z as parseFormValues,
+  C as useHookForm
+};

package/dist/utils/functions/createSafeContext.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),o=()=>{const e=n.createContext(null);return[()=>{const t=n.useContext(e);if(t===null)throw new Error("Context value is null");return t},e.Provider]};exports.createSafeContext=o;

package/dist/utils/functions/createSafeContext.es.js

@@ -0,0 +1,13 @@
+import n from "react";
+const u = () => {
+  const t = n.createContext(null);
+  return [() => {
+    const e = n.useContext(t);
+    if (e === null)
+      throw new Error("Context value is null");
+    return e;
+  }, t.Provider];
+};
+export {
+  u as createSafeContext
+};

package/dist/utils/functions/ensureReactElement.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("react"),u=({children:e,as:s="div",props:o})=>{let t;return typeof e=="string"?t=i.jsx(s,{children:e}):n.isValidElement(e)?t=e:typeof e=="function"?t=e(o):t=i.jsx(s,{children:e}),n.isValidElement(t)?t:i.jsx(s,{children:t})};exports.ensureReactElement=u;

package/dist/utils/functions/ensureReactElement.es.js

@@ -0,0 +1,13 @@
+import { jsx as f } from "react/jsx-runtime";
+import { isValidElement as s } from "react";
+const u = ({
+  children: e,
+  as: o = "div",
+  props: i
+}) => {
+  let t;
+  return typeof e == "string" ? t = /* @__PURE__ */ f(o, { children: e }) : s(e) ? t = e : typeof e == "function" ? t = e(i) : t = /* @__PURE__ */ f(o, { children: e }), s(t) ? t : /* @__PURE__ */ f(o, { children: t });
+};
+export {
+  u as ensureReactElement
+};

package/dist/utils/functions/getFormData.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=e=>{e.preventDefault();const a=e.currentTarget.elements,r={};return Array.from(a).forEach(n=>{const t=n;t.name&&(r[t.name]=t.value)}),r};exports.getFormData=o;

package/dist/utils/functions/getFormData.es.js

@@ -0,0 +1,11 @@
+const o = (e) => {
+  e.preventDefault();
+  const a = e.currentTarget.elements, r = {};
+  return Array.from(a).forEach((n) => {
+    const t = n;
+    t.name && (r[t.name] = t.value);
+  }), r;
+};
+export {
+  o as getFormData
+};

package/dist/utils/functions/mergeRefs.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function o(n){return t=>{n.forEach(e=>{typeof e=="function"?e(t):e!=null&&(e.current=t)})}}exports.mergeRefs=o;

package/dist/utils/functions/mergeRefs.es.js

@@ -0,0 +1,10 @@
+function o(e) {
+  return (t) => {
+    e.forEach((n) => {
+      typeof n == "function" ? n(t) : n != null && (n.current = t);
+    });
+  };
+}
+export {
+  o as mergeRefs
+};

package/dist/utils/strings/extractInitials.utility.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=t=>t.split(" ").map(e=>e.charAt(0)).join("");exports.extractInitials=i;

package/dist/utils/strings/extractInitials.utility.es.js

@@ -0,0 +1,4 @@
+const i = (t) => t.split(" ").map((a) => a.charAt(0)).join("");
+export {
+  i as extractInitials
+};