@ztwoint/z-ui 0.1.15 → 0.1.16

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

@@ -1,50 +1,60 @@
-import { jsx as l, jsxs as c } from "react/jsx-runtime";
-import { forwardRef as f, useState as p, useImperativeHandle as u } from "react";
-import { Z2StepperItem as b } from "./stepper-item/stepper-item.js";
-function x() {
+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 h = f(
-  ({ items: i }, o) => {
-    const [d, s] = p(() => i.map((a, t) => ({
-      ...a,
-      state: a.state ?? (t === 0 ? "active" : "disabled")
-    })));
-    return u(o, () => ({
-      handleNext: (a) => {
-        s((t) => {
-          const r = t.findIndex((e) => e.state === "active");
-          return r === -1 ? t : r === t.length - 1 ? t.map(
-            (e, n) => n === r ? { ...e, state: "completed" } : e
-          ) : t.map((e, n) => n === r ? { ...e, state: "completed" } : n === r + 1 ? { ...e, state: "active", label: a ?? e.label } : e);
+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: (a) => {
-        s((t) => {
-          const r = t.findIndex((e) => e.state === "active");
-          return r <= 0 ? t : t.map((e, n) => n === r ? { ...e, state: "disabled" } : n === 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: () => {
-        s(
-          (a) => a.map((t, r) => ({
-            ...t,
-            state: r === 0 ? "active" : "disabled"
+        d(
+          (t) => t.map((a, n) => ({
+            ...a,
+            state: n === 0 ? "active" : "disabled"
           }))
         );
       },
-      setStepState: (a, t) => {
-        s(
-          (r) => r.map((e, n) => n === a ? { ...e, state: t } : e)
-        );
+      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: d.map((a, t) => /* @__PURE__ */ c("div", { className: "flex flex-row items-center gap-6", children: [
-      /* @__PURE__ */ l(b, { label: a.label, state: a.state }),
-      t < d.length - 1 && /* @__PURE__ */ l(x, {})
-    ] }, a.id)) });
+    })), /* @__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)) });
   }
 );
-h.displayName = "Z2Stepper";
+S.displayName = "Z2Stepper";
 export {
-  h as default
+  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

@@ -8,4 +8,6 @@ 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/stepper';
+export * from './components/dialog/dialog';
+export * from './components/file-upload-area/file-upload-area';
+export * from './components/stepper/stepper';

package/dist/index.js

@@ -1,13 +1,13 @@
 /* empty css                    */
 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 l, buttonVariants as Z } from "./components/button/button.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 S } from "./components/input/input.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 N, Z2SidebarVariants as T } from "./components/collapsible-side-nav-bar/side-nav-bar.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";
@@ -25,24 +25,23 @@ import { default as Y } from "./components/assets/icons/sidebar-left-show-copy.j
 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 lo, Z2DialogClose as Zo, Z2DialogContent as no, Z2DialogDescription as so, Z2DialogFooter as vo, Z2DialogHeader as Do, Z2DialogOverlay as So, Z2DialogPortal as go, Z2DialogTitle as Co, Z2DialogTrigger as uo } from "./components/dialog/dialog.js";
-import { FileUploadArea as Io } from "./components/file-upload-area/file-upload-area.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 { Z2StepperItem as To } from "./components/stepper/stepper-item/stepper-item.js";
-import { Z2PopoverTrigger as co } from "./components/collapsible-side-nav-bar/popover/popover-trigger.js";
-import { Z2PopoverContent as Po } from "./components/collapsible-side-nav-bar/popover/popover-content.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 {
   a as Alert,
   m as AlertCirclesIcon,
   p as AlertDescription,
   i as AlertTitle,
-  l as Button,
+  x as Button,
   G as ChevronUpIcon,
   z as CirclesIcon,
   C as CountryFlags,
   K as DatabaseCopy,
-  Io as FileUploadArea,
-  S as Input,
+  No as FileUploadArea,
+  g as Input,
   n as NavHeader,
   v as NavItem,
   oo as SIDEBAR_WIDTH,
@@ -50,20 +49,20 @@ export {
   Y as SidebarLeftShowCopy,
   k as SubNavIndicator,
   Q as WindowLeftCopy,
-  lo as Z2Dialog,
+  xo as Z2Dialog,
   Zo as Z2DialogClose,
   no as Z2DialogContent,
   so as Z2DialogDescription,
   vo as Z2DialogFooter,
   Do as Z2DialogHeader,
-  So as Z2DialogOverlay,
-  go as Z2DialogPortal,
+  go as Z2DialogOverlay,
+  So as Z2DialogPortal,
   Co as Z2DialogTitle,
   uo as Z2DialogTrigger,
   U as Z2Popover,
-  Po as Z2PopoverContent,
-  co as Z2PopoverTrigger,
-  N as Z2SideNavBar,
+  co as Z2PopoverContent,
+  Io as Z2PopoverTrigger,
+  T as Z2SideNavBar,
   P as Z2SideNavBarContent,
   H as Z2SideNavBarFooter,
   F as Z2SideNavBarGroup,
@@ -71,8 +70,7 @@ export {
   W as Z2SideNavBarItem,
   B as Z2SideNavBarProvider,
   h as Z2SideNavBarSeparator,
-  T as Z2SidebarVariants,
-  To as Z2StepperItem,
+  I as Z2SidebarVariants,
   to as Z2Tabs,
   ao as Z2TabsContent,
   po as Z2TabsList,

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

@@ -9,4 +9,6 @@ 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/stepper';
+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.15",
+  "version": "0.1.16",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

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

@@ -1,2 +0,0 @@
-export * from './stepper';
-export * from './stepper-item/stepper-item';

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

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

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

@@ -1,2 +0,0 @@
-export * from './stepper';
-export * from './stepper-item/stepper-item';