@konstructio/ui 0.1.2-alpha.7 → 0.1.2-alpha.71

package/dist/x-B9bYxG31.js

@@ -0,0 +1,8 @@
+import { c as o } from "./createLucideIcon-CP-mMPfa.js";
+const c = [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+], t = o("x", c);
+export {
+  t as X
+};

package/dist/{x-4F_5p77m.js → x-Eoa9FJjA.js}

@@ -1,5 +1,5 @@
 import l, { forwardRef as c } from "react";
-import { P as a } from "./index-N2OStZoU.js";
+import { P as a } from "./index-BOE_3f_Z.js";
 function f() {
   return f = Object.assign || function(e) {
     for (var o = 1; o < arguments.length; o++) {

package/package.json

@@ -2,10 +2,31 @@
   "name": "@konstructio/ui",
   "description": "A set of reusable and customizable React components built for konstruct.io",
   "private": false,
-  "version": "0.1.2-alpha.7",
+  "version": "0.1.2-alpha.71",
   "type": "module",
   "license": "MIT",
   "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "icons": [
+        "dist/icons.d.ts"
+      ]
+    }
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./icons": {
+      "types": "./dist/icons.d.ts",
+      "import": "./dist/icons.js"
+    },
+    "./*.css": {
+      "import": "./dist/*.css"
+    }
+  },
   "files": [
     "dist"
   ],
@@ -59,26 +80,33 @@
     "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-slider": "^1.3.6",
-    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-slot": "^1.2.4",
     "@radix-ui/react-switch": "^1.2.6",
     "@radix-ui/react-tabs": "^1.1.13",
     "@radix-ui/react-toast": "^1.2.15",
     "@radix-ui/react-tooltip": "^1.2.8",
-    "@radix-ui/react-visually-hidden": "^1.2.3",
+    "@radix-ui/react-visually-hidden": "^1.2.4",
+    "@react-input/mask": "^2.0.4",
     "@tanstack/react-table": "^8.21.3",
+    "@tanstack/react-virtual": "^3.13.19",
     "chart.js": "^4.5.1",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "countries-and-timezones": "^3.8.0",
+    "country-flag-icons": "^1.6.15",
+    "country-locale-map": "^1.9.12",
+    "google-libphonenumber": "^3.2.44",
+    "i18n-iso-countries": "^7.14.0",
     "js-cookie": "^3.0.5",
-    "lucide-react": "^0.545.0",
-    "react-chartjs-2": "^5.3.0",
-    "react-day-picker": "^9.11.1",
+    "lucide-react": "^0.576.0",
+    "motion": "^12.34.5",
+    "react-chartjs-2": "^5.3.1",
+    "react-day-picker": "^9.14.0",
     "react-feather": "^2.0.10",
-    "react-focus-lock": "^2.13.6",
-    "react-remove-scroll": "^2.7.1",
-    "tailwind-merge": "^3.3.1"
+    "react-focus-lock": "^2.13.7",
+    "react-remove-scroll": "^2.7.2",
+    "tailwind-merge": "^3.5.0"
   },
   "peerDependencies": {
     "@tanstack/react-query": "^5.90",
@@ -113,50 +141,51 @@
     }
   },
   "devDependencies": {
-    "@faker-js/faker": "^10.0.0",
-    "@rollup/plugin-alias": "^5.1.1",
-    "@storybook/addon-docs": "^9.1.10",
-    "@storybook/addon-links": "^9.1.10",
-    "@storybook/react-vite": "^9.1.10",
-    "@tailwindcss/vite": "^4.1.14",
-    "@tanstack/react-query": "^5.90.4",
+    "@faker-js/faker": "^10.3.0",
+    "@rollup/plugin-alias": "^6.0.0",
+    "@storybook/addon-docs": "^10.2.14",
+    "@storybook/addon-links": "^10.2.14",
+    "@storybook/react-vite": "^10.2.14",
+    "@tailwindcss/vite": "^4.2.1",
+    "@tanstack/react-query": "^5.90.21",
     "@testing-library/jest-dom": "^6.9.1",
-    "@testing-library/react": "^16.3.0",
+    "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
+    "@types/google-libphonenumber": "^7.4.30",
     "@types/jest-axe": "^3.5.9",
     "@types/js-cookie": "^3.0.6",
-    "@types/lodash": "^4.17.20",
-    "@types/react": "^19.2.2",
-    "@types/react-dom": "^19.2.2",
-    "@typescript-eslint/eslint-plugin": "^8.46.1",
-    "@typescript-eslint/parser": "^8.46.1",
-    "@vitejs/plugin-react": "^5.0.4",
-    "@vitest/coverage-v8": "^3.2.4",
-    "autoprefixer": "^10.4.21",
-    "eslint": "^9.37.0",
+    "@types/lodash": "^4.17.24",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@typescript-eslint/eslint-plugin": "^8.56.1",
+    "@typescript-eslint/parser": "^8.56.1",
+    "@vitejs/plugin-react": "^5.1.4",
+    "@vitest/coverage-v8": "^4.0.18",
+    "autoprefixer": "^10.4.27",
+    "eslint": "^9.39.3",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^6.1.1",
-    "eslint-plugin-react-refresh": "^0.4.23",
-    "eslint-plugin-storybook": "^9.1.10",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "eslint-plugin-storybook": "^10.2.14",
     "eslint-plugin-vitest": "^0.5.4",
-    "glob": "^11.0.3",
+    "glob": "^13.0.6",
     "husky": "^9.1.7",
     "jest-axe": "^10.0.0",
-    "jsdom": "^27.0.0",
-    "lodash": "^4.17.21",
-    "postcss": "^8.5.6",
-    "prettier": "^3.6.2",
-    "rimraf": "^6.0.1",
-    "storybook": "^9.1.10",
-    "tailwindcss": "^4.1.14",
+    "jsdom": "^28.1.0",
+    "lodash": "^4.17.23",
+    "postcss": "^8.5.8",
+    "prettier": "^3.8.1",
+    "rimraf": "^6.1.3",
+    "storybook": "^10.2.14",
+    "tailwindcss": "^4.2.1",
     "ts-node": "^10.9.2",
     "typescript": "^5.9.3",
-    "vite": "^7.1.10",
+    "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
     "vite-plugin-svgr": "^4.5.0",
-    "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^3.2.4"
+    "vite-tsconfig-paths": "^6.1.1",
+    "vitest": "^4.0.18"
   },
   "overrides": {
     "storybook": "$storybook"

package/dist/Modal-B8jrP02v.js

@@ -1,98 +0,0 @@
-import { Body as b } from "./components/Modal/components/Body/Body.js";
-import { Footer as g } from "./components/Modal/components/Footer/Footer.js";
-import { Header as v } from "./components/Modal/components/Header/Header.js";
-import { jsx as n, jsxs as f } from "react/jsx-runtime";
-import { Children as i, isValidElement as s, useEffect as w } from "react";
-import { createPortal as A } from "react-dom";
-import { R as N } from "./index-sp5ZfG6g.js";
-import { R } from "./Combination-VYaRRJBZ.js";
-import { cn as p } from "./utils/index.js";
-import { buttonCloseVariants as k, modalVariants as x } from "./components/Modal/components/Wrapper/Wrapper.variants.js";
-import { X as B } from "./x-4F_5p77m.js";
-const E = ({
-  children: e,
-  theme: t,
-  className: m,
-  buttonCloseClassName: d,
-  onClose: a
-}) => {
-  const l = i.toArray(e).find(
-    (o) => s(o) && o.type === r.Header
-  ), c = i.toArray(e).find(
-    (o) => s(o) && o.type === r.Body
-  ), y = i.toArray(e).find(
-    (o) => s(o) && o.type === r.Footer
-  ), u = i.toArray(e).filter(
-    (o) => !s(o) || ![r.Header, r.Body, r.Footer].includes(
-      o.type
-    )
-  );
-  return /* @__PURE__ */ n(R, { children: /* @__PURE__ */ f(
-    "div",
-    {
-      className: "fixed inset-0 grid place-content-center",
-      "data-theme": t,
-      children: [
-        /* @__PURE__ */ n(
-          "div",
-          {
-            className: "absolute inset-0 bg-black opacity-75 animate-in fade-in-0",
-            onClick: a,
-            role: "presentation"
-          }
-        ),
-        /* @__PURE__ */ f(
-          "div",
-          {
-            className: p(
-              x({
-                className: m
-              })
-            ),
-            role: "dialog",
-            "aria-modal": "true",
-            children: [
-              l,
-              /* @__PURE__ */ f(
-                "button",
-                {
-                  className: p(
-                    k({
-                      className: d
-                    })
-                  ),
-                  onClick: a,
-                  children: [
-                    /* @__PURE__ */ n(B, {}),
-                    /* @__PURE__ */ n(N, { children: "Dismiss modal" })
-                  ]
-                }
-              ),
-              c ?? u,
-              y
-            ]
-          }
-        )
-      ]
-    }
-  ) });
-}, r = ({ isOpen: e, onClose: t, container: m, ...d }) => (w(() => {
-  const a = new AbortController(), l = (c) => {
-    c.code === "Escape" && t?.();
-  };
-  return window.addEventListener("keydown", l, {
-    signal: a.signal
-  }), () => {
-    a.abort();
-  };
-}, [t]), e ? A(
-  /* @__PURE__ */ n(E, { ...d, onClose: t }),
-  m || document.body
-) : null);
-r.Header = v;
-r.Body = b;
-r.Footer = g;
-export {
-  r as M,
-  E as W
-};

package/dist/chevron-down-MZvQoT2F.js

@@ -1,11 +0,0 @@
-import { c as o } from "./createLucideIcon-D2CN7Ma9.js";
-/**
-* @license lucide-react v0.545.0 - ISC
-*
-* This source code is licensed under the ISC license.
-* See the LICENSE file in the root directory of this source tree.
-*/
-const n = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], e = o("chevron-down", n);
-export {
-  e as C
-};

package/dist/chevron-right-VYBOBhRt.js

@@ -1,19 +0,0 @@
-import { c as o } from "./createLucideIcon-D2CN7Ma9.js";
-/**
-* @license lucide-react v0.545.0 - ISC
-*
-* This source code is licensed under the ISC license.
-* See the LICENSE file in the root directory of this source tree.
-*/
-const e = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], n = o("chevron-left", e);
-/**
-* @license lucide-react v0.545.0 - ISC
-*
-* This source code is licensed under the ISC license.
-* See the LICENSE file in the root directory of this source tree.
-*/
-const t = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]], h = o("chevron-right", t);
-export {
-  n as C,
-  h as a
-};

package/dist/components/Dropdown/Dropdown.js

@@ -1,42 +0,0 @@
-import { jsx as t, jsxs as p } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
-import { DropdownProvider as c } from "./contexts/dropdown.provider.js";
-import { Wrapper as x } from "./components/Wrapper.js";
-const N = n(
-  ({
-    onChange: r,
-    onBlur: l,
-    value: a,
-    error: s,
-    helperText: e,
-    name: o,
-    highlightSearch: i,
-    ...d
-  }, m) => /* @__PURE__ */ t(
-    c,
-    {
-      highlightSearch: i,
-      name: o,
-      value: a,
-      onBlur: l,
-      onChange: r,
-      children: /* @__PURE__ */ p("div", { className: "relative w-full", children: [
-        /* @__PURE__ */ t(
-          x,
-          {
-            name: o,
-            error: s,
-            ref: m,
-            onBlur: l,
-            ...d
-          }
-        ),
-        s ? /* @__PURE__ */ t("span", { className: "text-xs text-red-700", children: s }) : null,
-        !s && e ? /* @__PURE__ */ t("span", { className: "text-xs text-slate-600", children: e }) : null
-      ] })
-    }
-  )
-);
-export {
-  N as Dropdown
-};

package/dist/components/Dropdown/components/List/List.js

@@ -1,79 +0,0 @@
-import { jsx as l, jsxs as x, Fragment as N } from "react/jsx-runtime";
-import { forwardRef as k, useRef as C, useImperativeHandle as y } from "react";
-import { cn as t } from "../../../../utils/index.js";
-import { useNavigationUlList as j } from "../../hooks/useNavigationList.js";
-import { ListItem as n } from "../ListItem/ListItem.js";
-import { listVariants as I } from "./List.variants.js";
-import { S as O } from "../../../../index-DQH6odE9.js";
-import { useDropdownContext as S } from "../../contexts/dropdown.hook.js";
-const A = k(
-  ({
-    additionalOptions: f,
-    className: p,
-    inputRef: o,
-    isLoading: u,
-    itemClassName: r,
-    name: d,
-    options: i,
-    searchable: c = !1,
-    wrapperInputRef: g,
-    wrapperRef: b
-  }, h) => {
-    const s = C(null), { isOpen: v, searchTerm: L } = S();
-    y(h, () => s.current, [s]), j({
-      ulRef: s,
-      wrapperRef: b,
-      wrapperInputRef: g,
-      inputRef: o,
-      searchable: c
-    });
-    const m = c ? i.filter((e) => {
-      const a = L.toLowerCase();
-      return (typeof e.label == "string" ? e.label.toLowerCase() : "").includes(a);
-    }) : i, w = m.length === 0;
-    return /* @__PURE__ */ l(
-      "ul",
-      {
-        ref: s,
-        title: d,
-        role: "listbox",
-        className: t(I({ className: p })),
-        "data-state": v ? "open" : "closed",
-        children: u ? /* @__PURE__ */ l(
-          n,
-          {
-            className: t("select-none", r),
-            isClickable: !1,
-            inputRef: o,
-            value: "Loading...",
-            label: "Loading..."
-          }
-        ) : w ? /* @__PURE__ */ l(
-          n,
-          {
-            className: t("select-none", r),
-            isClickable: !1,
-            inputRef: o,
-            value: "No options",
-            label: "No options"
-          }
-        ) : /* @__PURE__ */ x(N, { children: [
-          m.map((e) => /* @__PURE__ */ l(
-            n,
-            {
-              className: t("select-none", r),
-              isClickable: !0,
-              inputRef: o,
-              ...e
-            },
-            e.value
-          )),
-          f?.map((e, a) => /* @__PURE__ */ l("li", { role: "option", "data-action": "true", children: /* @__PURE__ */ l(O, { className: "flex p-2 w-full h-full gap-1 items-center text-sm [&>svg]:w-3.5 [&>svg]:h-3.5 [&>svg]:shrink-0 cursor-pointer select-none hover:bg-gray-50 hover:dark:bg-slate-700 focus:outline-0", children: e }) }, a))
-        ] })
-      }
-    );
-  }
-);
-export {
-  A as List
-};

package/dist/components/Dropdown/components/List/List.variants.js

@@ -1,28 +0,0 @@
-import { c as o } from "../../../../index-D29mdTf5.js";
-const t = o([
-  "absolute",
-  "bg-white",
-  "border",
-  "flex-col",
-  "mt-1",
-  "overflow-hidden",
-  "rounded-md",
-  "shadow-2xs",
-  "top-full",
-  "w-full",
-  "z-10",
-  "max-h-[185px]",
-  "overflow-y-auto",
-  "border-gray-200",
-  "text-zinc-700",
-  "animate-in",
-  "fade-in-50",
-  "zoom-in-95",
-  "duration-[200ms]",
-  "dark:bg-slate-800",
-  "dark:border-slate-700",
-  "dark:text-slate-50"
-]);
-export {
-  t as listVariants
-};

package/dist/components/Dropdown/components/ListItem/ListItem.js

@@ -1,67 +0,0 @@
-import { jsx as o, jsxs as u } from "react/jsx-runtime";
-import { useRef as b, useCallback as l } from "react";
-import { Typography as w } from "../../../Typography/Typography.js";
-import { cn as y } from "../../../../utils/index.js";
-import { listItemVariants as k } from "./ListItem.variants.js";
-import { useDropdownContext as C } from "../../contexts/dropdown.hook.js";
-const E = ({
-  isClickable: f,
-  className: p,
-  inputRef: d,
-  ...t
-}) => {
-  const { searchTerm: r, highlightSearchEnabled: i, setValue: c, toggleOpen: m } = C(), h = b(null), a = l(
-    (e) => {
-      c(e.value, d), m(!1);
-    },
-    [c, m]
-  ), g = l(
-    (e, s) => {
-      e.key === "Enter" && (e.stopPropagation(), a(s));
-    },
-    [a]
-  ), x = l(
-    (e) => {
-      if (typeof e != "string")
-        return e;
-      const s = i && r.length > 0 ? e.split(new RegExp(`(${r})`, "gi")).map((n) => n.toLowerCase() === r.toLowerCase() ? /* @__PURE__ */ o(
-        "mark",
-        {
-          className: "bg-transparent font-semibold text-slate-800 dark:text-slate-50",
-          children: n
-        },
-        n
-      ) : n) : [e];
-      return /* @__PURE__ */ o(
-        w,
-        {
-          variant: "body2",
-          className: "text-zinc-700 dark:text-slate-50",
-          children: s
-        }
-      );
-    },
-    [i, r]
-  );
-  return /* @__PURE__ */ u(
-    "li",
-    {
-      ref: h,
-      role: "option",
-      "data-action": "false",
-      className: y(k({ className: p })),
-      tabIndex: 0,
-      onClick: (e) => {
-        f && (a(t), e.stopPropagation());
-      },
-      onKeyDown: (e) => g(e, t),
-      children: [
-        t.leftIcon ? /* @__PURE__ */ o("span", { className: "w-4 h-4 flex justify-center items-center", children: t.leftIcon }) : null,
-        x(t.label)
-      ]
-    }
-  );
-};
-export {
-  E as ListItem
-};