@ztwoint/z-ui 0.1.14 → 0.1.16

package/dist/components/assets/icons/circle-check-filled.js

@@ -0,0 +1,29 @@
+import { jsx as e } from "react/jsx-runtime";
+function i({
+  fill: r = "currentColor",
+  width: t = "1em",
+  height: c = "1em",
+  ...l
+}) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      height: c,
+      width: t,
+      ...l,
+      viewBox: "0 0 20 20",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ e("g", { fill: r, children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "m10,2C5.589,2,2,5.589,2,10s3.589,8,8,8,8-3.589,8-8S14.411,2,10,2Zm4.284,5.621l-4.75,6c-.183.231-.458.37-.753.379-.01,0-.021,0-.031,0-.283,0-.554-.12-.743-.331l-2.25-2.5c-.369-.411-.336-1.043.074-1.412.41-.37,1.042-.336,1.412.074l1.458,1.62,4.015-5.071c.343-.432.971-.506,1.405-.164.433.343.506.972.163,1.405Z",
+          fill: r,
+          strokeWidth: "0"
+        }
+      ) })
+    }
+  );
+}
+export {
+  i as default
+};

package/dist/components/assets/icons/media-record.js

@@ -0,0 +1,34 @@
+import { jsx as r } from "react/jsx-runtime";
+function c({
+  fill: e = "currentColor",
+  width: o = "1em",
+  height: n = "1em",
+  ...t
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      height: n,
+      width: o,
+      ...t,
+      viewBox: "0 0 20 20",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ r("g", { fill: e, children: /* @__PURE__ */ r(
+        "circle",
+        {
+          cx: "10",
+          cy: "10",
+          fill: "none",
+          r: "7",
+          stroke: e,
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      ) })
+    }
+  );
+}
+export {
+  c as default
+};

package/dist/components/assets/icons/upload.js

@@ -0,0 +1,61 @@
+import { jsx as n, jsxs as k } from "react/jsx-runtime";
+function u({
+  fill: e = "currentColor",
+  secondaryfill: o,
+  strokewidth: r = 2,
+  width: t = "1em",
+  height: i = "1em",
+  ...s
+}) {
+  return o = o || e, /* @__PURE__ */ n(
+    "svg",
+    {
+      height: i,
+      width: t,
+      ...s,
+      viewBox: "0 0 20 20",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ k("g", { fill: e, children: [
+        /* @__PURE__ */ n(
+          "polyline",
+          {
+            fill: "none",
+            points: "7.25 5.75 10 3 12.75 5.75",
+            stroke: o,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: r
+          }
+        ),
+        /* @__PURE__ */ n(
+          "line",
+          {
+            fill: "none",
+            stroke: o,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: r,
+            x1: "10",
+            x2: "10",
+            y1: "13",
+            y2: "3"
+          }
+        ),
+        /* @__PURE__ */ n(
+          "path",
+          {
+            d: "m6,9.07c-1.216.268-2.168,1.277-2.328,2.557l-.25,2c-.224,1.791,1.172,3.372,2.977,3.372h7.203c1.804,0,3.201-1.582,2.977-3.372l-.25-2c-.16-1.281-1.113-2.289-2.328-2.557",
+            fill: "none",
+            stroke: e,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: r
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  u as default
+};

package/dist/components/dialog/dialog.js

@@ -0,0 +1,110 @@
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import * as o from "@radix-ui/react-dialog";
+import { cn as l } from "../../lib/utils.js";
+function c({ ...t }) {
+  return /* @__PURE__ */ e(o.Root, { "data-slot": "dialog", ...t });
+}
+function f({ ...t }) {
+  return /* @__PURE__ */ e(o.Trigger, { "data-slot": "dialog-trigger", ...t });
+}
+function r({ ...t }) {
+  return /* @__PURE__ */ e(o.Portal, { "data-slot": "dialog-portal", ...t });
+}
+function u({ ...t }) {
+  return /* @__PURE__ */ e(o.Close, { "data-slot": "dialog-close", ...t });
+}
+function s({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e(
+    o.Overlay,
+    {
+      "data-slot": "dialog-overlay",
+      className: l(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        t
+      ),
+      ...a
+    }
+  );
+}
+function m({
+  className: t,
+  children: a,
+  ...i
+}) {
+  return /* @__PURE__ */ n(r, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ e(s, {}),
+    /* @__PURE__ */ e(
+      o.Content,
+      {
+        "data-slot": "dialog-content",
+        className: l(
+          "surface-neutral-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 shadow-lg duration-200 sm:max-w-lg",
+          t
+        ),
+        ...i,
+        children: a
+      }
+    )
+  ] });
+}
+function p({ className: t, ...a }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      className: l("flex flex-col gap-2 text-center sm:text-left", t),
+      ...a
+    }
+  );
+}
+function x({ className: t, ...a }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      "data-slot": "dialog-footer",
+      className: l("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
+      ...a
+    }
+  );
+}
+function D({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e(
+    o.Title,
+    {
+      "data-slot": "dialog-title",
+      className: l("text-lg leading-none font-semibold", t),
+      ...a
+    }
+  );
+}
+function Z({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e(
+    o.Description,
+    {
+      "data-slot": "dialog-description",
+      className: l("text-muted-foreground text-sm", t),
+      ...a
+    }
+  );
+}
+export {
+  c as Z2Dialog,
+  u as Z2DialogClose,
+  m as Z2DialogContent,
+  Z as Z2DialogDescription,
+  x as Z2DialogFooter,
+  p as Z2DialogHeader,
+  s as Z2DialogOverlay,
+  r as Z2DialogPortal,
+  D as Z2DialogTitle,
+  f as Z2DialogTrigger
+};

package/dist/components/file-upload-area/file-upload-area.const.js

@@ -0,0 +1,4 @@
+const s = [".csv", ".xls", ".xlsx"];
+export {
+  s as DEFAULT_ACCEPT
+};

package/dist/components/file-upload-area/file-upload-area.js

@@ -0,0 +1,71 @@
+import { jsxs as d, jsx as a } from "react/jsx-runtime";
+import { useRef as m, useState as h } from "react";
+import { DEFAULT_ACCEPT as D } from "./file-upload-area.const.js";
+import { UploadIconComponent as v } from "./upload-icon-component.js";
+import x from "./text-preset.js";
+import { cn as y } from "../../lib/utils.js";
+const w = ({
+  onFilesSelected: o,
+  accept: n = D,
+  multiple: f = !0,
+  className: s = "",
+  disabled: e = !1
+}) => {
+  const i = m(null), [C, t] = h(!1), p = (r) => {
+    e || (r.preventDefault(), r.stopPropagation(), t(!0));
+  }, u = (r) => {
+    e || (r.preventDefault(), r.stopPropagation(), t(!1));
+  }, c = (r) => {
+    e || (r.preventDefault(), r.stopPropagation(), t(!1), r.dataTransfer.files && r.dataTransfer.files.length > 0 && o(Array.from(r.dataTransfer.files)));
+  }, l = () => {
+    var r;
+    e || (r = i.current) == null || r.click();
+  }, g = (r) => {
+    e || r.target.files && r.target.files.length > 0 && o(Array.from(r.target.files));
+  };
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      className: y(
+        "flex flex-col items-center justify-center gap-8 p-12 max-w-112 rounded-2xl border-[.5px] border-dashed stroke-solid-high bg-neutral-light",
+        e && "opacity-60 bg-gray-100 cursor-not-allowed",
+        s
+      ),
+      onDragOver: p,
+      onDragLeave: u,
+      onDrop: c,
+      onClick: l,
+      tabIndex: e ? -1 : 0,
+      role: "button",
+      "aria-label": "File upload area. Click or drag and drop files.",
+      "aria-disabled": e,
+      onKeyDown: e ? void 0 : (r) => {
+        (r.key === "Enter" || r.key === " ") && l();
+      },
+      "data-testid": "file-upload-area",
+      children: [
+        /* @__PURE__ */ a(v, {}),
+        /* @__PURE__ */ a(x, { accept: n }),
+        /* @__PURE__ */ a(
+          "input",
+          {
+            ref: i,
+            type: "file",
+            className: "hidden",
+            accept: n.join(","),
+            multiple: f,
+            tabIndex: -1,
+            "data-testid": "file-upload-input",
+            onChange: g,
+            onClick: (r) => r.stopPropagation(),
+            disabled: e
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  w as FileUploadArea,
+  w as default
+};

package/dist/components/file-upload-area/text-preset.js

@@ -0,0 +1,13 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+function n({ accept: r }) {
+  return /* @__PURE__ */ e("div", { className: "flex flex-col items-center text-center gap-2.5", children: [
+    /* @__PURE__ */ t("p", { className: "leading-none-medium-sm text-neutral-primary", children: "Click or drag & drop files here" }),
+    /* @__PURE__ */ e("p", { className: "leading-none-regular-sm text-neutral-secondary", children: [
+      "Supported formats: ",
+      r.map((a) => a.replace(".", "").toUpperCase()).join(", ")
+    ] })
+  ] });
+}
+export {
+  n as default
+};

package/dist/components/file-upload-area/upload-icon-component.js

@@ -0,0 +1,7 @@
+import { jsx as o } from "react/jsx-runtime";
+import e from "../assets/icons/upload.js";
+const r = () => /* @__PURE__ */ o("div", { className: "flex items-center justify-center p-3  gap-2.5 rounded-xl bg-neutral-on-top shadow-[var(--shadow-custom)]", children: /* @__PURE__ */ o(e, { className: "w-5 h-5" }) });
+export {
+  r as UploadIconComponent,
+  r as default
+};

package/dist/components/stepper/stepper.d.ts

@@ -1,16 +1,5 @@
 import { default as React } from 'react';
-export type StepperState = 'active' | 'completed' | 'disabled';
-export type StepperItemType = {
-    id: string;
-    label: string;
-    state?: StepperState;
-};
-export type StepperHandle = {
-    handleNext: (label?: string) => void;
-    handlePrev: (label?: string) => void;
-    reset: () => void;
-    setStepState: (index: number, state: StepperState) => void;
-};
+import { StepperHandle, StepperItemType } from './stepper.types';
 declare const Z2Stepper: React.ForwardRefExoticComponent<{
     items: StepperItemType[];
 } & React.RefAttributes<StepperHandle>>;

package/dist/components/stepper/stepper.js

@@ -0,0 +1,60 @@
+import { jsx as l, jsxs as p } from "react/jsx-runtime";
+import { forwardRef as c, useState as h, useImperativeHandle as x } from "react";
+import { Z2StepperItem as w } from "../stepper-item/stepper-item.js";
+function b() {
+  return /* @__PURE__ */ l("div", { className: "w-3 h-[1.5px] border-solid border-1 stroke-solid-high" });
+}
+const S = c(
+  ({ items: f }, u) => {
+    const [o, d] = h(() => f.map((t, a) => ({
+      ...t,
+      state: t.state ?? (a === 0 ? "active" : "disabled")
+    }))), i = (t, a, n = "handleNext") => {
+      let r;
+      if (a) {
+        if (r = t.findIndex((e) => e.id === a), r === -1)
+          throw new Error(`${n}: step with id '${a}' not found`);
+      } else if (r = t.findIndex((e) => e.state === "active"), r === -1) throw new Error(`${n}: no active step found`);
+      return r;
+    };
+    return x(u, () => ({
+      handleNext: (t, a) => {
+        d((n) => {
+          const r = i(n, t, "handleNext");
+          return r === n.length - 1 ? n.map(
+            (e, s) => s === r ? { ...e, state: "completed" } : e
+          ) : n.map((e, s) => s === r ? { ...e, state: "completed" } : s === r + 1 ? { ...e, state: "active", label: a ?? e.label } : e);
+        });
+      },
+      handlePrev: (t, a) => {
+        d((n) => {
+          const r = i(n, t, "handlePrev");
+          return r <= 0 ? n : n.map((e, s) => s === r ? { ...e, state: "disabled" } : s === r - 1 ? { ...e, state: "active", label: a ?? e.label } : e);
+        });
+      },
+      reset: () => {
+        d(
+          (t) => t.map((a, n) => ({
+            ...a,
+            state: n === 0 ? "active" : "disabled"
+          }))
+        );
+      },
+      setStepState: (t, a) => {
+        if (!t) throw new Error("setStepState: id is required");
+        d((n) => {
+          const r = n.findIndex((e) => e.id === t);
+          if (r === -1) throw new Error(`setStepState: step with id '${t}' not found`);
+          return n.map((e, s) => s === r ? { ...e, state: a } : e);
+        });
+      }
+    })), /* @__PURE__ */ l("div", { className: "w-fit flex flex-row items-center gap-6", children: o.map((t, a) => /* @__PURE__ */ p("div", { className: "flex flex-row items-center gap-6", children: [
+      /* @__PURE__ */ l(w, { label: t.label, state: t.state }),
+      a < o.length - 1 && /* @__PURE__ */ l(b, {})
+    ] }, t.id)) });
+  }
+);
+S.displayName = "Z2Stepper";
+export {
+  S as default
+};

package/dist/components/stepper/stepper.types.d.ts

@@ -0,0 +1,12 @@
+export type StepperState = 'active' | 'completed' | 'disabled';
+export type StepperItemType = {
+    id: string;
+    label: string;
+    state?: StepperState;
+};
+export type StepperHandle = {
+    handleNext: (activeId?: string, label?: string) => void;
+    handlePrev: (activeId?: string, label?: string) => void;
+    reset: () => void;
+    setStepState: (activeId: string, state: StepperState) => void;
+};

package/dist/components/stepper-item/stepper-item.js

@@ -0,0 +1,41 @@
+import { jsxs as m, jsx as i } from "react/jsx-runtime";
+import * as c from "react";
+import { cva as p } from "class-variance-authority";
+import { cn as l } from "../../lib/utils.js";
+import f from "../assets/icons/circle-check-filled.js";
+import n from "../assets/icons/media-record.js";
+const h = p("w-fit flex items-center select-none gap-2", {
+  variants: {
+    state: {
+      active: "",
+      completed: "opacity-100",
+      disabled: "cursor-not-allowed"
+    }
+  },
+  defaultVariants: {
+    state: "active"
+  }
+}), u = "rounded-full transition-colors w-4 h-4 border-none", g = c.forwardRef(
+  ({ label: a, state: e = "active", className: o, ...s }, d) => {
+    let t, r;
+    return e === "completed" ? (t = /* @__PURE__ */ i(f, { fill: "blue", width: 16, height: 16 }), r = "text-neutral-primary leading-none-medium-sm") : e === "active" ? (t = /* @__PURE__ */ i(n, { fill: "blue", width: 16, height: 16 }), r = "text-neutral-primary leading-none-medium-sm") : (t = /* @__PURE__ */ i(n, { fill: "gray", width: 16, height: 16 }), r = "text-neutral-secondary leading-none-medium-sm"), /* @__PURE__ */ m(
+      "div",
+      {
+        ref: d,
+        className: l(h({ state: e }), o),
+        "aria-disabled": e === "disabled",
+        title: e || "disabled",
+        "aria-label": a,
+        ...s,
+        children: [
+          /* @__PURE__ */ i("span", { className: u, children: t }),
+          /* @__PURE__ */ i("span", { className: l(r), children: a })
+        ]
+      }
+    );
+  }
+);
+g.displayName = "Z2StepperItem";
+export {
+  g as Z2StepperItem
+};

package/dist/index.d.ts

@@ -6,3 +6,8 @@ export * from './components/country-flags/country-flags';
 export * from './components/collapsible-side-nav-bar';
 export * from './components/tab/tab';
 export * from './components/tooltip/tooltip';
+export * from './components/dialog/dialog';
+export * from './components/file-upload-area/file-upload-area';
+export * from './components/dialog/dialog';
+export * from './components/file-upload-area/file-upload-area';
+export * from './components/stepper/stepper';

package/dist/index.js

@@ -1,67 +1,81 @@
 /* empty css                    */
-import { Alert as t, AlertDescription as a, AlertTitle as p } from "./components/alert/alert.js";
+import { Alert as a, AlertDescription as p, AlertTitle as i } from "./components/alert/alert.js";
 import { AlertCirclesIcon as m } from "./components/alert/icons/circles-icon.js";
-import { Button as i, buttonVariants as d } from "./components/button/button.js";
-import { NavHeader as s } from "./components/nav-header/nav-header.js";
+import { Button as x, buttonVariants as Z } from "./components/button/button.js";
+import { NavHeader as n } from "./components/nav-header/nav-header.js";
 import { NavItem as v } from "./components/nav-header/nav-item/nav-item.js";
-import { Input as l } from "./components/input/input.js";
-import { CountryFlags as B } from "./components/country-flags/country-flags.js";
-import { Z2SideNavBarProvider as C } from "./components/collapsible-side-nav-bar/side-nav-bar-provider.js";
-import { Z2SideNavBar as T, Z2SidebarVariants as b } from "./components/collapsible-side-nav-bar/side-nav-bar.js";
-import { Z2SideNavBarHeader as A } from "./components/collapsible-side-nav-bar/side-nav-bar-header.js";
-import { Z2SideNavBarContent as g } from "./components/collapsible-side-nav-bar/side-nav-bar-content.js";
-import { Z2SideNavBarFooter as P } from "./components/collapsible-side-nav-bar/side-nav-bar-footer.js";
-import { Z2SideNavBarGroup as H } from "./components/collapsible-side-nav-bar/side-nav-bar-group.js";
+import { Input as g } from "./components/input/input.js";
+import { CountryFlags as C } from "./components/country-flags/country-flags.js";
+import { Z2SideNavBarProvider as B } from "./components/collapsible-side-nav-bar/side-nav-bar-provider.js";
+import { Z2SideNavBar as T, Z2SidebarVariants as I } from "./components/collapsible-side-nav-bar/side-nav-bar.js";
+import { Z2SideNavBarHeader as c } from "./components/collapsible-side-nav-bar/side-nav-bar-header.js";
+import { Z2SideNavBarContent as P } from "./components/collapsible-side-nav-bar/side-nav-bar-content.js";
+import { Z2SideNavBarFooter as H } from "./components/collapsible-side-nav-bar/side-nav-bar-footer.js";
+import { Z2SideNavBarGroup as F } from "./components/collapsible-side-nav-bar/side-nav-bar-group.js";
 import { Z2SideNavBarItem as W } from "./components/collapsible-side-nav-bar/side-nav-bar-item.js";
 import { Z2SideNavBarSeparator as h } from "./components/collapsible-side-nav-bar/side-nav-bar-separator.js";
-import { useZ2SideNavBar as F } from "./components/collapsible-side-nav-bar/context.js";
-import { Z2Popover as V } from "./components/collapsible-side-nav-bar/popover/popover.js";
-import { ChevronUpIcon as O } from "./components/assets/icons/chevron-up-icon.js";
-import { default as j } from "./components/assets/icons/sub-nav-indicator.js";
-import { default as q } from "./components/assets/icons/circles-icon.js";
-import { default as J } from "./components/assets/icons/database-copy.js";
-import { default as M } from "./components/assets/icons/window-left-copy.js";
-import { default as X } from "./components/assets/icons/sidebar-left-show-copy.js";
-import { SIDEBAR_WIDTH as $, SIDEBAR_WIDTH_COLLAPSED as rr } from "./components/collapsible-side-nav-bar/constants.js";
-import { Z2Tabs as er, Z2TabsContent as tr, Z2TabsList as ar, Z2TabsTrigger as pr } from "./components/tab/tab.js";
-import { Z2Tooltip as mr } from "./components/tooltip/tooltip.js";
-import { Z2PopoverTrigger as ir } from "./components/collapsible-side-nav-bar/popover/popover-trigger.js";
-import { Z2PopoverContent as nr } from "./components/collapsible-side-nav-bar/popover/popover-content.js";
+import { useZ2SideNavBar as O } from "./components/collapsible-side-nav-bar/context.js";
+import { Z2Popover as U } from "./components/collapsible-side-nav-bar/popover/popover.js";
+import { ChevronUpIcon as G } from "./components/assets/icons/chevron-up-icon.js";
+import { default as k } from "./components/assets/icons/sub-nav-indicator.js";
+import { default as z } from "./components/assets/icons/circles-icon.js";
+import { default as K } from "./components/assets/icons/database-copy.js";
+import { default as Q } from "./components/assets/icons/window-left-copy.js";
+import { default as Y } from "./components/assets/icons/sidebar-left-show-copy.js";
+import { SIDEBAR_WIDTH as oo, SIDEBAR_WIDTH_COLLAPSED as ro } from "./components/collapsible-side-nav-bar/constants.js";
+import { Z2Tabs as to, Z2TabsContent as ao, Z2TabsList as po, Z2TabsTrigger as io } from "./components/tab/tab.js";
+import { Z2Tooltip as mo } from "./components/tooltip/tooltip.js";
+import { Z2Dialog as xo, Z2DialogClose as Zo, Z2DialogContent as no, Z2DialogDescription as so, Z2DialogFooter as vo, Z2DialogHeader as Do, Z2DialogOverlay as go, Z2DialogPortal as So, Z2DialogTitle as Co, Z2DialogTrigger as uo } from "./components/dialog/dialog.js";
+import { FileUploadArea as No } from "./components/file-upload-area/file-upload-area.js";
+import "./components/stepper/stepper.js";
+import { Z2PopoverTrigger as Io } from "./components/collapsible-side-nav-bar/popover/popover-trigger.js";
+import { Z2PopoverContent as co } from "./components/collapsible-side-nav-bar/popover/popover-content.js";
 export {
-  t as Alert,
+  a as Alert,
   m as AlertCirclesIcon,
-  a as AlertDescription,
-  p as AlertTitle,
-  i as Button,
-  O as ChevronUpIcon,
-  q as CirclesIcon,
-  B as CountryFlags,
-  J as DatabaseCopy,
-  l as Input,
-  s as NavHeader,
+  p as AlertDescription,
+  i as AlertTitle,
+  x as Button,
+  G as ChevronUpIcon,
+  z as CirclesIcon,
+  C as CountryFlags,
+  K as DatabaseCopy,
+  No as FileUploadArea,
+  g as Input,
+  n as NavHeader,
   v as NavItem,
-  $ as SIDEBAR_WIDTH,
-  rr as SIDEBAR_WIDTH_COLLAPSED,
-  X as SidebarLeftShowCopy,
-  j as SubNavIndicator,
-  M as WindowLeftCopy,
-  V as Z2Popover,
-  nr as Z2PopoverContent,
-  ir as Z2PopoverTrigger,
+  oo as SIDEBAR_WIDTH,
+  ro as SIDEBAR_WIDTH_COLLAPSED,
+  Y as SidebarLeftShowCopy,
+  k as SubNavIndicator,
+  Q as WindowLeftCopy,
+  xo as Z2Dialog,
+  Zo as Z2DialogClose,
+  no as Z2DialogContent,
+  so as Z2DialogDescription,
+  vo as Z2DialogFooter,
+  Do as Z2DialogHeader,
+  go as Z2DialogOverlay,
+  So as Z2DialogPortal,
+  Co as Z2DialogTitle,
+  uo as Z2DialogTrigger,
+  U as Z2Popover,
+  co as Z2PopoverContent,
+  Io as Z2PopoverTrigger,
   T as Z2SideNavBar,
-  g as Z2SideNavBarContent,
-  P as Z2SideNavBarFooter,
-  H as Z2SideNavBarGroup,
-  A as Z2SideNavBarHeader,
+  P as Z2SideNavBarContent,
+  H as Z2SideNavBarFooter,
+  F as Z2SideNavBarGroup,
+  c as Z2SideNavBarHeader,
   W as Z2SideNavBarItem,
-  C as Z2SideNavBarProvider,
+  B as Z2SideNavBarProvider,
   h as Z2SideNavBarSeparator,
-  b as Z2SidebarVariants,
-  er as Z2Tabs,
-  tr as Z2TabsContent,
-  ar as Z2TabsList,
-  pr as Z2TabsTrigger,
-  mr as Z2Tooltip,
-  d as buttonVariants,
-  F as useZ2SideNavBar
+  I as Z2SidebarVariants,
+  to as Z2Tabs,
+  ao as Z2TabsContent,
+  po as Z2TabsList,
+  io as Z2TabsTrigger,
+  mo as Z2Tooltip,
+  Z as buttonVariants,
+  O as useZ2SideNavBar
 };

package/dist/types/components/stepper/stepper.d.ts

@@ -1,16 +1,5 @@
 import React from 'react';
-export type StepperState = 'active' | 'completed' | 'disabled';
-export type StepperItemType = {
-    id: string;
-    label: string;
-    state?: StepperState;
-};
-export type StepperHandle = {
-    handleNext: (label?: string) => void;
-    handlePrev: (label?: string) => void;
-    reset: () => void;
-    setStepState: (index: number, state: StepperState) => void;
-};
+import { StepperHandle, StepperItemType } from './stepper.types';
 declare const Z2Stepper: React.ForwardRefExoticComponent<{
     items: StepperItemType[];
 } & React.RefAttributes<StepperHandle>>;

package/dist/types/components/stepper/stepper.types.d.ts

@@ -0,0 +1,12 @@
+export type StepperState = 'active' | 'completed' | 'disabled';
+export type StepperItemType = {
+    id: string;
+    label: string;
+    state?: StepperState;
+};
+export type StepperHandle = {
+    handleNext: (activeId?: string, label?: string) => void;
+    handlePrev: (activeId?: string, label?: string) => void;
+    reset: () => void;
+    setStepState: (activeId: string, state: StepperState) => void;
+};

package/dist/types/index.d.ts

@@ -7,3 +7,8 @@ export * from './components/country-flags/country-flags';
 export * from './components/collapsible-side-nav-bar';
 export * from './components/tab/tab';
 export * from './components/tooltip/tooltip';
+export * from './components/dialog/dialog';
+export * from './components/file-upload-area/file-upload-area';
+export * from './components/dialog/dialog';
+export * from './components/file-upload-area/file-upload-area';
+export * from './components/stepper/stepper';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ztwoint/z-ui",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",