@ztwoint/z-ui 0.2.0-beta.0 → 0.2.0-beta.1

package/dist/v2/assets/icons/timer.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function TimerIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/timer.js

@@ -0,0 +1,27 @@
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+function s({
+  fill: r = "currentColor",
+  width: o = "1em",
+  height: t = "1em",
+  ...n
+}) {
+  return /* @__PURE__ */ c(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: t,
+      width: o,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...n,
+      children: [
+        /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "6", fill: "none", stroke: r, strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("path", { d: "M8 4v4l3 2", stroke: r, strokeWidth: "1.5", strokeLinecap: "round", fill: "none" }),
+        /* @__PURE__ */ e("circle", { cx: "8", cy: "2", r: "1", fill: r })
+      ]
+    }
+  );
+}
+export {
+  s as TimerIcon
+};

package/dist/v2/assets/icons/trash.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function TrashIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/trash.js

@@ -0,0 +1,29 @@
+import { jsx as r } from "react/jsx-runtime";
+function n({
+  fill: a = "currentColor",
+  width: h = "1em",
+  height: e = "1em",
+  ...o
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: e,
+      width: h,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...o,
+      children: /* @__PURE__ */ r(
+        "path",
+        {
+          d: "M5 3V2a1 1 0 011-1h4a1 1 0 011 1v1h3a1 1 0 010 2H2a1 1 0 010-2h3zm1 3v7a1 1 0 001 1h2a1 1 0 001-1V6H6zm-2 0v7a2 2 0 002 2h2a2 2 0 002-2V6H4z",
+          fill: a
+        }
+      )
+    }
+  );
+}
+export {
+  n as TrashIcon
+};

package/dist/v2/assets/icons/unlock.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function UnlockIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/unlock.js

@@ -0,0 +1,26 @@
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+function h({
+  fill: r = "currentColor",
+  width: e = "1em",
+  height: o = "1em",
+  ...n
+}) {
+  return /* @__PURE__ */ i(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: o,
+      width: e,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...n,
+      children: [
+        /* @__PURE__ */ t("rect", { x: "4", y: "7", width: "8", height: "7", rx: "1", fill: "none", stroke: r, strokeWidth: "1.5" }),
+        /* @__PURE__ */ t("path", { d: "M7 7V5a1 1 0 012 0", stroke: r, strokeWidth: "1.5", fill: "none" })
+      ]
+    }
+  );
+}
+export {
+  h as UnlockIcon
+};

package/dist/v2/assets/icons/upload.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function UploadIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,23 @@
+import { jsx as r } from "react/jsx-runtime";
+function i({
+  fill: o = "currentColor",
+  width: e = "1em",
+  height: t = "1em",
+  ...n
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: t,
+      width: e,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...n,
+      children: /* @__PURE__ */ r("path", { d: "M8 6l3 3h-2v4H7V9H5l3-3zM3 13h10v1H3v-1z", fill: o })
+    }
+  );
+}
+export {
+  i as UploadIcon
+};

package/dist/v2/assets/icons/user.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function UserIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/user.js

@@ -0,0 +1,26 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+function c({
+  fill: r = "currentColor",
+  width: o = "1em",
+  height: t = "1em",
+  ...n
+}) {
+  return /* @__PURE__ */ s(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: t,
+      width: o,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...n,
+      children: [
+        /* @__PURE__ */ e("circle", { cx: "8", cy: "5", r: "3", fill: "none", stroke: r, strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("path", { d: "M3 14a5 5 0 0110 0", fill: "none", stroke: r, strokeWidth: "1.5" })
+      ]
+    }
+  );
+}
+export {
+  c as UserIcon
+};

package/dist/v2/assets/icons/users.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function UsersIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/users.js

@@ -0,0 +1,27 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+function i({
+  fill: r = "currentColor",
+  width: o = "1em",
+  height: t = "1em",
+  ...n
+}) {
+  return /* @__PURE__ */ s(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: t,
+      width: o,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...n,
+      children: [
+        /* @__PURE__ */ e("circle", { cx: "5", cy: "4", r: "2", fill: "none", stroke: r, strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("circle", { cx: "11", cy: "4", r: "2", fill: "none", stroke: r, strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("path", { d: "M2 13a4 4 0 016 0M10 13a4 4 0 016 0", fill: "none", stroke: r, strokeWidth: "1.5" })
+      ]
+    }
+  );
+}
+export {
+  i as UsersIcon
+};

package/dist/v2/assets/icons/xmark.d.ts

@@ -0,0 +1,2 @@
+import { IconProps } from '../icon.type';
+export declare function XmarkIcon({ fill, width, height, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/v2/assets/icons/xmark.js

@@ -0,0 +1,29 @@
+import { jsx as r } from "react/jsx-runtime";
+function i({
+  fill: a = "currentColor",
+  width: e = "1em",
+  height: o = "1em",
+  ...t
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      "aria-hidden": "true",
+      height: o,
+      width: e,
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...t,
+      children: /* @__PURE__ */ r(
+        "path",
+        {
+          d: "M12.854 3.146a.5.5 0 00-.708 0L8 7.293 3.854 3.146a.5.5 0 10-.708.708L7.293 8l-4.147 4.146a.5.5 0 00.708.708L8 8.707l4.146 4.147a.5.5 0 00.708-.708L8.707 8l4.147-4.146a.5.5 0 000-.708z",
+          fill: a
+        }
+      )
+    }
+  );
+}
+export {
+  i as XmarkIcon
+};

package/dist/v2/assets/index.d.ts

@@ -0,0 +1,2 @@
+export * from './icon';
+export * from './icon.type';

package/dist/v2/atoms/actions/breadcrumb-link.d.ts

@@ -0,0 +1,9 @@
+import { VariantProps } from 'class-variance-authority';
+declare const breadcrumbLinkVariants: (props?: ({
+    type?: "previous" | "current" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+interface Z2BreadcrumbLinkProps extends Omit<React.ComponentProps<'a'>, 'type' | 'children'>, VariantProps<typeof breadcrumbLinkVariants> {
+    label: string;
+}
+declare function Z2BreadcrumbLink({ className, type, label, ...props }: Z2BreadcrumbLinkProps): import("react/jsx-runtime").JSX.Element;
+export { Z2BreadcrumbLink, type Z2BreadcrumbLinkProps };

package/dist/v2/atoms/actions/breadcrumb-link.js

@@ -0,0 +1,61 @@
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { cn as t } from "../../../lib/utils.js";
+import { cva as a } from "class-variance-authority";
+const l = a(
+  "py-1 pr-1 inline-flex items-center gap-0.5 cursor-pointer transition-colors relative",
+  {
+    variants: {
+      type: {
+        previous: [
+          // Default state - text-neutral-500
+          "text-neutral-500",
+          // Hover state - text-neutral-600 with underline
+          "hover:text-neutral-600",
+          // Focus state - text-neutral-600 with white bg and shadow
+          "focus-visible:text-neutral-600 focus-visible:ring-2 focus-visible:ring-neutral-200 focus-visible:outline-none focus-visible:overflow-clip",
+          // Active/Pressed state - text-neutral-700 with underline
+          "active:text-neutral-700"
+        ],
+        current: [
+          // Default state - text-neutral-800
+          "text-neutral-800",
+          // Hover state - text-blue-800 with underline
+          "hover:text-blue-800",
+          // Focus state - text-blue-800 with white bg and shadow
+          "focus-visible:text-blue-800 focus-visible:ring-2 focus-visible:ring-neutral-200 focus-visible:outline-none focus-visible:overflow-clip",
+          // Active/Pressed state - text-neutral-700 with underline
+          "active:text-neutral-700"
+        ]
+      }
+    },
+    defaultVariants: {
+      type: "previous"
+    }
+  }
+);
+function p({ className: i, type: e, label: o, ...s }) {
+  return /* @__PURE__ */ n(
+    "a",
+    {
+      "data-slot": "z2-breadcrumb-link",
+      className: t(l({ type: e }), i),
+      ...s,
+      children: [
+        /* @__PURE__ */ r(
+          "span",
+          {
+            className: t(
+              "text-sm font-normal",
+              e === "previous" ? "hover:shadow-[inset_0_-1px_0_0_var(--color-neutral-200)] active:shadow-[inset_0_-1px_0_0_var(--color-neutral-400)]" : "hover:shadow-[inset_0_-1px_0_0_var(--color-blue-700)] active:shadow-[inset_0_-1px_0_0_var(--color-neutral-400)]"
+            ),
+            children: o
+          }
+        ),
+        e === "previous" && /* @__PURE__ */ r("span", { className: "text-neutral-300 text-xs font-medium px-1", children: "/" })
+      ]
+    }
+  );
+}
+export {
+  p as Z2BreadcrumbLink
+};

package/dist/v2/atoms/actions/button.d.ts

@@ -0,0 +1,13 @@
+import { VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: ({
+    variant?: "danger" | "ghost" | "primary" | "secondary" | "tertiary" | null | undefined;
+    size?: "small" | "large" | "medium" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+interface ButtonProps extends Omit<React.ComponentProps<'button'>, 'children'>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
+    label?: string;
+}
+declare function Button({ className, variant, size, asChild, leadingIcon, trailingIcon, label, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export { Button, buttonVariants, type ButtonProps };

package/dist/v2/atoms/actions/button.js

@@ -0,0 +1,58 @@
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import { Slot as u } from "@radix-ui/react-slot";
+import "react";
+import { cn as m } from "../../../lib/utils.js";
+import { cva as b } from "class-variance-authority";
+const p = b(
+  "cursor-pointer disabled:cursor-not-allowed not-italic font-medium tracking-normal inline-flex items-center justify-center transition-all disabled:text-neutral-400 disabled:pointer-events-none outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  {
+    variants: {
+      variant: {
+        primary: "bg-blue-700 text-blue-50 hover:bg-blue-800 focus:bg-blue-800 disabled:bg-neutral-100",
+        secondary: "bg-neutral-950 text-neutral-50 hover:bg-neutral-800 disabled:bg-neutral-100",
+        tertiary: "text-neutral-900 border border-solid border-neutral-200 hover:border-neutral-300 hover:text-neutral-800 disabled:border-neutral-200",
+        ghost: "text-neutral-900 hover:text-neutral-800",
+        danger: "text-rose-700 border border-solid border-neutral-200 hover:border-neutral-300 hover:text-rose-800 disabled:border-neutral-200"
+      },
+      size: {
+        small: "py-1 px-1.5 text-xs rounded-md gap-0.5 min-w-6 min-h-6 max-h-6",
+        medium: "py-1 px-2 text-sm rounded-lg gap-1 min-w-7 min-h-7 max-h-7",
+        large: "py-1.5 px-2.5 text-sm rounded-lg gap-1 min-w-8 min-h-8 max-h-8"
+      }
+    },
+    defaultVariants: {
+      variant: "primary",
+      size: "medium"
+    }
+  }
+);
+function y({
+  className: s,
+  variant: r = "primary",
+  size: t = "medium",
+  asChild: o = !1,
+  leadingIcon: a,
+  trailingIcon: n,
+  label: i,
+  ...l
+}) {
+  return /* @__PURE__ */ d(
+    o ? u : "button",
+    {
+      "data-slot": "button",
+      "data-variant": r,
+      "data-size": t,
+      className: m(p({ variant: r, size: t, className: s })),
+      ...l,
+      children: [
+        a && /* @__PURE__ */ e("span", { className: "py-0.5 [&_svg]:pointer-events-none [&_svg]:!max-w-3 [&_svg]:!max-h-3 [&_svg]:!aspect-square [&_svg]:shrink-0 ", children: a }),
+        i && /* @__PURE__ */ e("span", { className: "px-0.5 whitespace-nowrap", children: i }),
+        n && /* @__PURE__ */ e("span", { className: "py-0.5 [&_svg]:pointer-events-none [&_svg]:!max-w-3 [&_svg]:!max-h-3 [&_svg]:!aspect-square [&_svg]:shrink-0 ", children: n })
+      ]
+    }
+  );
+}
+export {
+  y as Button,
+  p as buttonVariants
+};

package/dist/v2/atoms/actions/index.d.ts

@@ -0,0 +1,3 @@
+export * from './button';
+export * from './breadcrumb-link';
+export * from './tab-button';

package/dist/v2/atoms/actions/tab-button.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+interface TabButtonProps extends Omit<React.ComponentProps<'button'>, 'children'> {
+    label?: string;
+    numberBadgeLabel?: string;
+    active?: boolean;
+    leadingIcon?: React.ReactNode | null;
+    trailingIcon?: React.ReactNode | null;
+}
+declare function TabButton({ className, label, numberBadgeLabel, leadingIcon, trailingIcon, active, disabled, ...props }: TabButtonProps): import("react/jsx-runtime").JSX.Element;
+export { TabButton, type TabButtonProps };

package/dist/v2/atoms/actions/tab-button.js

@@ -0,0 +1,52 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import "react";
+import { cn as u } from "../../../lib/utils.js";
+import "../indicators/badge.js";
+import { NumberBadge as m } from "../indicators/number-badge.js";
+import "../indicators/featured-icon.js";
+import "../indicators/stepper.js";
+function b({
+  className: l,
+  label: o = "Label",
+  numberBadgeLabel: t,
+  leadingIcon: r = null,
+  trailingIcon: n = null,
+  active: a = !1,
+  disabled: s,
+  ...c
+}) {
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      "data-slot": "tab-button",
+      "data-active": a,
+      className: u(
+        "inline-flex py-3 px-0 justify-center items-center gap-1 text-neutral-600 duration-300 cursor-pointer transition-all",
+        "disabled:cursor-not-allowed disabled:pointer-events-none disabled:text-neutral-400",
+        "hover:text-neutral-700 hover:shadow-[inset_0_-1px_0_0_var(--color-neutral-200)] ",
+        "data-[active=true]:text-neutral-900 data-[active=true]:shadow-[inset_0_-1px_0_0_var(--color-neutral-700)]",
+        "focus-visible:ring-2 focus-visible:ring-neutral-200 focus-visible:outline-none ",
+        l
+      ),
+      disabled: s,
+      ...c,
+      children: [
+        r && /* @__PURE__ */ e("span", { className: "flex items-center justify-center shrink-0 w-3.5 h-3.5 [&_svg]:w-3.5 [&_svg]:h-3.5", children: r }),
+        /* @__PURE__ */ i("span", { className: "flex items-center justify-center gap-1.5", children: [
+          /* @__PURE__ */ e("span", { className: "text-sm font-medium tracking-normal whitespace-nowrap", children: o }),
+          t && /* @__PURE__ */ e(
+            m,
+            {
+              color: s ? "muted" : a ? "brand" : "neutral",
+              label: t
+            }
+          )
+        ] }),
+        n && /* @__PURE__ */ e("span", { className: "flex items-center justify-center shrink-0 w-3.5 h-3.5 [&_svg]:w-3.5 [&_svg]:h-3.5", children: n })
+      ]
+    }
+  );
+}
+export {
+  b as TabButton
+};

package/dist/v2/atoms/actions/tooltip.d.ts

@@ -0,0 +1,8 @@
+import * as RadixTooltip from '@radix-ui/react-tooltip';
+interface TooltipProps extends Omit<RadixTooltip.TooltipContentProps, 'children' | 'asChild'> {
+    children: React.ReactNode;
+    title: string;
+    description?: string;
+}
+declare function Tooltip({ children, title, description, side }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+export { Tooltip, TooltipProps };

package/dist/v2/atoms/actions/tooltip.js

@@ -0,0 +1,22 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import * as t from "@radix-ui/react-tooltip";
+function s({ children: i, title: n, description: l, side: o = "top" }) {
+  return /* @__PURE__ */ e(t.Provider, { children: /* @__PURE__ */ r(t.Root, { children: [
+    /* @__PURE__ */ e(t.Trigger, { asChild: !0, children: i }),
+    /* @__PURE__ */ e(t.Portal, { children: /* @__PURE__ */ r(
+      t.Content,
+      {
+        side: o,
+        className: "bg-neutral-950 py-1 px-2.5 inline-flex flex-col justify-center rounded-lg text-neutral-50",
+        children: [
+          /* @__PURE__ */ e("div", { className: "text-sm font-medium ", children: n }),
+          l && /* @__PURE__ */ e("div", { className: "text-xs text-neutral-300 font-light", children: l }),
+          /* @__PURE__ */ e(t.Arrow, { className: "fill-neutral-950" })
+        ]
+      }
+    ) })
+  ] }) });
+}
+export {
+  s as Tooltip
+};

package/dist/v2/atoms/index.d.ts

@@ -0,0 +1,3 @@
+export * from './inputs';
+export * from './indicators';
+export * from './actions';

package/dist/v2/atoms/indicators/badge.d.ts

@@ -0,0 +1,14 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const z2BadgeVariants: (props?: ({
+    color?: "success" | "warning" | "danger" | "neutral" | "brand" | null | undefined;
+    size?: "small" | "large" | "medium" | null | undefined;
+    type?: "pill" | "plain" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+declare function Z2Badge({ className, color, size, type, label, leadingIcon, trailingIcon, numberBadge, ...props }: Omit<React.ComponentProps<'span'>, 'children'> & VariantProps<typeof z2BadgeVariants> & {
+    label?: string;
+    leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
+    numberBadge?: number;
+}): import("react/jsx-runtime").JSX.Element;
+export { Z2Badge, z2BadgeVariants };

package/dist/v2/atoms/indicators/badge.js

@@ -0,0 +1,99 @@
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { cva as m } from "class-variance-authority";
+import "react";
+import { cn as u } from "../../../lib/utils.js";
+import { NumberBadge as b } from "./number-badge.js";
+const x = m(
+  "inline-flex items-center justify-center gap-0.5 font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 [&>svg]:pointer-events-none transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      color: {
+        neutral: "text-neutral-700",
+        brand: "text-blue-700",
+        success: "text-emerald-700",
+        warning: "text-amber-700",
+        danger: "text-rose-700"
+      },
+      size: {
+        small: "px-2 py-0 text-xs",
+        medium: "px-2.5 py-0.5 text-sm",
+        large: "px-2.5 py-1 text-sm"
+      },
+      type: {
+        pill: "rounded-full border border-solid",
+        plain: ""
+      }
+    },
+    compoundVariants: [
+      {
+        color: "neutral",
+        type: "pill",
+        class: "border-neutral-200 bg-neutral-50 text-neutral-700"
+      },
+      {
+        color: "brand",
+        type: "pill",
+        class: "border-blue-100 bg-blue-50 text-blue-950"
+      },
+      {
+        color: "danger",
+        type: "pill",
+        class: "border-rose-100 bg-rose-50 text-rose-950"
+      },
+      {
+        color: "success",
+        type: "pill",
+        class: "border-emerald-100 bg-emerald-50 text-emerald-950"
+      },
+      {
+        color: "warning",
+        type: "pill",
+        class: "border-amber-100 bg-amber-50 text-amber-950"
+      }
+    ],
+    defaultVariants: {
+      color: "neutral",
+      size: "medium",
+      type: "pill"
+    }
+  }
+);
+function N({
+  className: n,
+  color: t = "neutral",
+  size: i,
+  type: c,
+  label: l,
+  leadingIcon: a,
+  trailingIcon: s,
+  numberBadge: e,
+  ...p
+}) {
+  const d = {
+    neutral: "neutral",
+    brand: "brand",
+    success: "success",
+    warning: "warning",
+    danger: "error"
+  }[t];
+  return /* @__PURE__ */ o(
+    "span",
+    {
+      "data-slot": "badge",
+      className: u(x({ color: t, size: i, type: c }), n),
+      ...p,
+      children: [
+        a && /* @__PURE__ */ r("span", { className: "h-3.5 w-3.5 flex items-center justify-center", children: a }),
+        l && /* @__PURE__ */ o("span", { className: "flex items-center justify-center gap-1 px-0.5 ", children: [
+          l,
+          e != null && /* @__PURE__ */ r(b, { color: d, label: e.toString() })
+        ] }),
+        s && /* @__PURE__ */ r("span", { className: "h-3.5 w-3.5 flex items-center justify-center", children: s })
+      ]
+    }
+  );
+}
+export {
+  N as Z2Badge,
+  x as z2BadgeVariants
+};

package/dist/v2/atoms/indicators/featured-icon.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { VariantProps } from 'class-variance-authority';
+declare const featuredIconVariants: (props?: ({
+    color?: "success" | "warning" | "neutral" | "brand" | "gray" | "error" | null | undefined;
+    size?: "small" | "large" | "medium" | null | undefined;
+    type?: "strong" | "subtle" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+type Z2FeaturedIconProps = Omit<React.ComponentProps<'span'>, 'children'> & VariantProps<typeof featuredIconVariants> & {
+    icon?: React.ReactNode;
+};
+declare function Z2FeaturedIcon({ className, color, size, type, icon, ...props }: Z2FeaturedIconProps): import("react/jsx-runtime").JSX.Element;
+export { Z2FeaturedIcon, type Z2FeaturedIconProps };