@luxfi/ui 7.4.15 → 8.1.0

package/dist/badge.js

@@ -2,164 +2,31 @@
 import { TooltipGroup, Tooltip as Tooltip$1, Text, XStack } from '@hanzo/gui';
 import * as React3 from 'react';
 import React3__default, { Children, createElement } from 'react';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
+import { Box, sx, cn } from '@hanzo/ui';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useClickAway } from '@uidotdev/usehooks';
 
 // src/badge.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var SHIM_PROPS = [
-  "w",
-  "h",
-  "minW",
-  "maxW",
-  "display",
-  "flexGrow",
-  "flexShrink",
-  "flexBasis",
-  "fontWeight",
-  "textStyle",
-  "borderRadius",
-  "alignSelf",
-  "alignItems",
-  "justifyContent",
-  "color",
-  "mt",
-  "mb",
-  "ml",
-  "mr",
-  "height",
-  "overflow",
-  "whiteSpace",
-  "textOverflow",
-  "textTransform",
-  "gap",
-  "gridTemplateColumns",
-  "minWidth",
-  "boxSize",
-  "py",
-  "px",
-  "p",
-  "hideBelow",
-  "fontSize",
-  "flexWrap",
-  "wordBreak",
-  "lineHeight",
-  "marginRight",
-  "position",
-  "background"
-];
-var S = 4;
-function dim(v) {
-  if (v == null) return void 0;
-  if (typeof v === "number") return `${v * S}px`;
-  if (typeof v === "string") return v;
-  if (typeof v === "object") {
-    const o = v;
-    return o.base ?? o.lg ?? o.xl ?? Object.values(o)[0];
-  }
-  return void 0;
-}
-function sp(v) {
-  if (v === void 0) return void 0;
-  return typeof v === "number" ? `${v * S}px` : v;
-}
-function shimToStyle(props) {
-  const s = {};
-  if (props.w !== void 0) s.width = dim(props.w);
-  if (props.h !== void 0) s.height = dim(props.h);
-  if (props.minW !== void 0) s.minWidth = dim(props.minW);
-  if (props.maxW !== void 0) s.maxWidth = dim(props.maxW);
-  if (props.display !== void 0) s.display = props.display;
-  if (props.flexGrow !== void 0) s.flexGrow = props.flexGrow;
-  if (props.flexShrink !== void 0) s.flexShrink = props.flexShrink;
-  if (props.flexBasis !== void 0) s.flexBasis = props.flexBasis;
-  if (props.fontWeight !== void 0) s.fontWeight = props.fontWeight;
-  if (props.borderRadius !== void 0) s.borderRadius = props.borderRadius;
-  if (props.alignSelf !== void 0) s.alignSelf = props.alignSelf;
-  if (props.alignItems !== void 0) s.alignItems = props.alignItems;
-  if (props.justifyContent !== void 0) s.justifyContent = props.justifyContent;
-  if (props.color !== void 0) s.color = props.color;
-  if (props.mt !== void 0) s.marginTop = sp(props.mt);
-  if (props.mb !== void 0) s.marginBottom = sp(props.mb);
-  if (props.ml !== void 0) s.marginLeft = sp(props.ml);
-  if (props.mr !== void 0) s.marginRight = sp(props.mr);
-  if (props.height !== void 0) s.height = props.height;
-  if (props.overflow !== void 0) s.overflow = props.overflow;
-  if (props.whiteSpace !== void 0) s.whiteSpace = props.whiteSpace;
-  if (props.textOverflow !== void 0) s.textOverflow = props.textOverflow;
-  if (props.textTransform !== void 0) s.textTransform = props.textTransform;
-  if (props.gap !== void 0) s.gap = sp(props.gap);
-  if (props.gridTemplateColumns !== void 0) s.gridTemplateColumns = props.gridTemplateColumns;
-  if (props.minWidth !== void 0) s.minWidth = props.minWidth;
-  if (props.boxSize !== void 0) {
-    const v = typeof props.boxSize === "number" ? `${props.boxSize * S}px` : props.boxSize;
-    s.width = v;
-    s.height = v;
-  }
-  if (props.py !== void 0) {
-    const v = sp(props.py);
-    s.paddingTop = v;
-    s.paddingBottom = v;
-  }
-  if (props.px !== void 0) {
-    const v = sp(props.px);
-    s.paddingLeft = v;
-    s.paddingRight = v;
-  }
-  if (props.p !== void 0) s.padding = sp(props.p);
-  if (props.fontSize !== void 0) s.fontSize = props.fontSize;
-  if (props.flexWrap !== void 0) s.flexWrap = props.flexWrap;
-  if (props.wordBreak !== void 0) s.wordBreak = props.wordBreak;
-  if (props.lineHeight !== void 0) s.lineHeight = props.lineHeight;
-  if (props.marginRight !== void 0) s.marginRight = props.marginRight;
-  if (props.position !== void 0) s.position = props.position;
-  if (props.background !== void 0) s.background = props.background;
-  return s;
-}
-function stripShims(props) {
-  const out = { ...props };
-  for (const k of SHIM_PROPS) delete out[k];
-  return out;
-}
 var SKELETON_CLASSES = "lux-skeleton rounded-sm";
-var HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
 var Skeleton = React3.forwardRef(
   function Skeleton2(props, ref) {
-    const { loading = false, asChild, className, children, style: styleProp, as: Component = "div", ...allRest } = props;
-    const shimStyle = shimToStyle(props);
-    const mergedStyle = Object.keys(shimStyle).length > 0 || styleProp ? { ...shimStyle, ...styleProp } : void 0;
-    const hideBelowClass = props.hideBelow ? HIDE_BELOW_MAP[props.hideBelow] : void 0;
-    const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
-    const htmlRest = stripShims(allRest);
+    const { loading = true, asChild, className, children, style, ...rest } = props;
     if (!loading) {
       if (asChild && React3.isValidElement(children)) return children;
-      return /* @__PURE__ */ jsx(Component, { ref, className: cls, style: mergedStyle, ...htmlRest, children });
-    }
-    if (asChild && React3.isValidElement(children)) {
-      return /* @__PURE__ */ jsx(
-        Component,
-        {
-          ref,
-          "data-loading": true,
-          className: cn(SKELETON_CLASSES, "[&_*]:invisible", cls),
-          style: mergedStyle,
-          ...htmlRest,
-          children
-        }
-      );
+      return /* @__PURE__ */ jsx(Box, { ref, className, style, ...rest, children });
     }
     return /* @__PURE__ */ jsx(
-      Component,
+      "div",
       {
         ref,
         "data-loading": true,
-        className: cn(SKELETON_CLASSES, children ? "[&_*]:invisible" : "min-h-5", cls),
-        style: mergedStyle,
-        ...htmlRest,
+        ...sx(
+          SKELETON_CLASSES,
+          asChild || children ? "[&_*]:invisible" : "min-h-5",
+          className
+        ),
+        style,
+        ...rest,
         children
       }
     );
@@ -174,7 +41,7 @@ React3.forwardRef(
       {
         ref,
         loading,
-        className: cn("rounded-full shrink-0", className),
+        ...sx("rounded-full shrink-0", className),
         style: { width: dimension, height: dimension, ...rest.style },
         ...rest
       }
@@ -184,11 +51,11 @@ React3.forwardRef(
 React3.forwardRef(
   function SkeletonText2(props, ref) {
     const { noOfLines = 3, loading = true, className, ...rest } = props;
-    return /* @__PURE__ */ jsx("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(Box, { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsx(
       Skeleton,
       {
         loading,
-        className: cn("h-4", index === noOfLines - 1 && "max-w-[80%]")
+        ...sx(cn("h-4", index === noOfLines - 1 && "max-w-[80%]"))
       },
       index
     )) });
@@ -381,7 +248,16 @@ var COLOR_PALETTE = {
   bright_purple: { bg: "var(--color-badge-bright-purple-bg)", fg: "var(--color-badge-bright-purple-fg)" },
   bright_pink: { bg: "var(--color-badge-bright-pink-bg)", fg: "var(--color-badge-bright-pink-fg)" }
 };
-var S2 = 4;
+var TONE = {
+  subtle: (p) => ({ backgroundColor: p.bg, color: p.fg, borderWidth: 0 }),
+  solid: (p) => ({ backgroundColor: p.fg, color: p.bg, borderWidth: 0 }),
+  outline: (p) => ({
+    backgroundColor: "transparent",
+    color: p.fg,
+    borderWidth: 1,
+    borderColor: p.fg
+  })
+};
 var Badge = React3__default.forwardRef(
   function Badge2(props, ref) {
     const {
@@ -390,38 +266,22 @@ var Badge = React3__default.forwardRef(
       children,
       truncated = false,
       endElement,
-      variant: _variant,
+      variant = "subtle",
       size = "md",
       colorPalette = "gray",
       className,
-      flexShrink: _flexShrink,
-      gap: _gap,
-      ml: _ml,
-      mr: _mr,
-      style: styleProp,
+      style: badgeStyle,
       ...rest
     } = props;
-    const shimStyle = { ...styleProp };
-    if (_flexShrink !== void 0) shimStyle.flexShrink = _flexShrink;
-    if (_gap !== void 0) shimStyle.gap = typeof _gap === "number" ? `${_gap * S2}px` : _gap;
-    if (_ml !== void 0) {
-      if (typeof _ml === "object") {
-        const obj = _ml;
-        shimStyle.marginLeft = `${(obj.base ?? obj.lg ?? 0) * S2}px`;
-      } else {
-        shimStyle.marginLeft = typeof _ml === "number" ? `${_ml * S2}px` : _ml;
-      }
-    }
-    if (_mr !== void 0) shimStyle.marginRight = typeof _mr === "number" ? `${_mr * S2}px` : _mr;
-    const badgeStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
     const palette = COLOR_PALETTE[colorPalette];
+    const tone = TONE[variant](palette);
     const child = children ? (
       // `ellipsis` is gui Text's own built-in variant for single-line
       // truncation — it expands to the same overflow/text-overflow/
       // white-space/max-width rule Tailwind's `text-ellipsis` did, but
       // through the component's own variants (guaranteed to compile),
       // rather than naming each longhand as a separate style prop.
-      /* @__PURE__ */ jsx(Text, { ellipsis: true, ...SIZE_TEXT[size], color: palette.fg, children })
+      /* @__PURE__ */ jsx(Text, { ellipsis: true, ...SIZE_TEXT[size], color: tone.color, children })
     ) : null;
     const childrenElement = truncated ? /* @__PURE__ */ jsx(TruncatedTextTooltip, { label: children, children: child }) : child;
     const badgeElement = /* @__PURE__ */ jsxs(
@@ -437,7 +297,7 @@ var Badge = React3__default.forwardRef(
         maxWidth: "100%",
         userSelect: "text",
         ...SIZE[size],
-        backgroundColor: palette.bg,
+        ...tone,
         className,
         style: badgeStyle,
         ...rest,

package/dist/bank.d.ts

@@ -1,10 +1,6 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as _hanzogui_core from '@hanzogui/core';
-import * as _hanzogui_web from '@hanzogui/web';
-import React__default from 'react';
-import { GetProps } from '@hanzo/gui';
-
-declare const bankColors: {
+import React from 'react';
+import type { GetProps } from '@hanzo/gui';
+export declare const bankColors: {
     readonly bg: "#000000";
     readonly card: "#111111";
     readonly cardBorder: "#222222";
@@ -27,57 +23,56 @@ declare const bankColors: {
     readonly divider: "#222222";
     readonly disabled: "#444444";
 };
-declare const BankCard: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiElement, _hanzogui_core.RNGuiViewNonStyleProps, _hanzogui_web.StackStyleBase, {
-    size?: "sm" | "md" | "lg" | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankCardProps = GetProps<typeof BankCard>;
-declare const BankInput: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
-    size?: "sm" | "md" | "lg" | undefined;
+export declare const BankCard: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    size?: "sm" | "lg" | "md" | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankCardProps = GetProps<typeof BankCard>;
+export declare const BankInput: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    size?: "sm" | "lg" | "md" | undefined;
     unstyled?: boolean | undefined;
     invalid?: boolean | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankInputProps = GetProps<typeof BankInput> & {
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankInputProps = GetProps<typeof BankInput> & {
     placeholderTextColor?: string;
 };
-declare const BankButton: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiElement, _hanzogui_core.RNGuiViewNonStyleProps, _hanzogui_web.StackStyleBase, {
+export declare const BankButton: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    variant?: "secondary" | "ghost" | "primary" | undefined;
     disabled?: boolean | undefined;
-    variant?: "primary" | "secondary" | "ghost" | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-declare const BankButtonText: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
+}, import("@hanzogui/web").StaticConfigPublic>;
+export declare const BankButtonText: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    variant?: "secondary" | "ghost" | "primary" | undefined;
     unstyled?: boolean | undefined;
-    variant?: "primary" | "secondary" | "ghost" | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankButtonProps = GetProps<typeof BankButton>;
-declare const BankHeading: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankButtonProps = GetProps<typeof BankButton>;
+export declare const BankHeading: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    size?: "sm" | "lg" | "xl" | "xs" | "md" | undefined;
     unstyled?: boolean | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankHeadingProps = GetProps<typeof BankHeading>;
-declare const BankText: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankHeadingProps = GetProps<typeof BankHeading>;
+export declare const BankText: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    variant?: "default" | "link" | "label" | "muted" | "error" | "success" | undefined;
     unstyled?: boolean | undefined;
-    variant?: "default" | "label" | "link" | "error" | "success" | "muted" | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankTextProps = GetProps<typeof BankText>;
-declare function BankField({ label, error, children, }: {
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankTextProps = GetProps<typeof BankText>;
+export declare function BankField({ label, error, children, }: {
     label?: string;
     error?: string;
-    children: React__default.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-declare const BankAlert: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiElement, _hanzogui_core.RNGuiViewNonStyleProps, _hanzogui_web.StackStyleBase, {
-    status?: "error" | "success" | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-declare const BankAlertText: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare const BankAlert: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
     status?: "error" | "success" | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export declare const BankAlertText: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
     unstyled?: boolean | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankAlertProps = GetProps<typeof BankAlert>;
-declare const BankPinBox: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiTextElement, _hanzogui_core.RNGuiTextNonStyleProps, _hanzogui_web.TextStylePropsBase, {
+    status?: "error" | "success" | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankAlertProps = GetProps<typeof BankAlert>;
+export declare const BankPinBox: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/core").RNGuiTextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
     unstyled?: boolean | undefined;
     invalid?: boolean | undefined;
-}, _hanzogui_web.StaticConfigPublic>;
-type BankPinBoxProps = GetProps<typeof BankPinBox>;
-declare const BankDivider: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiElement, _hanzogui_core.RNGuiViewNonStyleProps, _hanzogui_web.StackStyleBase, {}, _hanzogui_web.StaticConfigPublic>;
-declare const BankPage: _hanzogui_web.GuiComponent<_hanzogui_web.TamaDefer, _hanzogui_web.GuiElement, _hanzogui_core.RNGuiViewNonStyleProps, _hanzogui_web.StackStyleBase, {}, _hanzogui_web.StaticConfigPublic>;
-type BankPageProps = GetProps<typeof BankPage>;
-
-export { BankAlert, type BankAlertProps, BankAlertText, BankButton, type BankButtonProps, BankButtonText, BankCard, type BankCardProps, BankDivider, BankField, BankHeading, type BankHeadingProps, BankInput, type BankInputProps, BankPage, type BankPageProps, BankPinBox, type BankPinBoxProps, BankText, type BankTextProps, bankColors };
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankPinBoxProps = GetProps<typeof BankPinBox>;
+export declare const BankDivider: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {}, import("@hanzogui/web").StaticConfigPublic>;
+export declare const BankPage: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {}, import("@hanzogui/web").StaticConfigPublic>;
+export type BankPageProps = GetProps<typeof BankPage>;
+//# sourceMappingURL=bank.d.ts.map

package/dist/bank.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bank.d.ts","sourceRoot":"","sources":["../src/bank.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAI1C,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;CAsBb,CAAA;AAGV,eAAO,MAAM,QAAQ;;8CAsBnB,CAAA;AAEF,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA;AAGrD,eAAO,MAAM,SAAS;;;;8CAuCpB,CAAA;AAEF,MAAM,MAAM,cAAc,GAAG,QAAQ,CAAC,OAAO,SAAS,CAAC,GAAG;IACxD,oBAAoB,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAGD,eAAO,MAAM,UAAU;;;8CAgDrB,CAAA;AAEF,eAAO,MAAM,cAAc;;;8CAczB,CAAA;AAEF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAGzD,eAAO,MAAM,WAAW;;;8CAkBtB,CAAA;AAEF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAA;AAG3D,eAAO,MAAM,QAAQ;;;8CAoBnB,CAAA;AAEF,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA;AAIrD,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,2CAQA;AAGD,eAAO,MAAM,SAAS;;8CAmBpB,CAAA;AAEF,eAAO,MAAM,aAAa;;;8CAUxB,CAAA;AAEF,MAAM,MAAM,cAAc,GAAG,QAAQ,CAAC,OAAO,SAAS,CAAC,CAAA;AAGvD,eAAO,MAAM,UAAU;;;8CAwBrB,CAAA;AAEF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAGzD,eAAO,MAAM,WAAW,sPAKtB,CAAA;AAGF,eAAO,MAAM,QAAQ,sPAOnB,CAAA;AAEF,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA"}

package/dist/banner.cjs

@@ -0,0 +1,78 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var ui = require('@hanzo/ui');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var bannerVariants = ui.variants(
+  "relative w-full border-b px-4 py-3 text-sm [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground",
+        info: "border-[var(--color-link-primary)]/50 bg-[var(--color-link-primary)] text-[var(--color-link-primary)] dark:bg-[var(--color-link-primary)] dark:text-[var(--color-link-primary)] [&>svg]:text-[var(--color-link-primary)] dark:[&>svg]:text-[var(--color-link-primary)]",
+        success: "border-[var(--lux-state-success)]/50 bg-[var(--lux-state-success)] text-[var(--lux-state-success)] dark:bg-[var(--lux-state-success)] dark:text-[var(--lux-state-success)] [&>svg]:text-[var(--lux-state-success)] dark:[&>svg]:text-[var(--lux-state-success)]",
+        warning: "border-[var(--lux-state-notice)]/50 bg-[var(--lux-state-notice)] text-[var(--lux-state-notice)] dark:bg-[var(--lux-state-notice)] dark:text-[var(--lux-state-notice)] [&>svg]:text-[var(--lux-state-notice)] dark:[&>svg]:text-[var(--lux-state-notice)]",
+        error: "border-[var(--lux-state-error)]/50 bg-[var(--lux-state-error)] text-[var(--lux-state-error)] dark:bg-[var(--lux-state-error)] dark:text-[var(--lux-state-error)] [&>svg]:text-[var(--lux-state-error)] dark:[&>svg]:text-[var(--lux-state-error)]"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Banner = React__namespace.forwardRef(
+  ({ className, variant, onClose, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      ui.Box,
+      {
+        ref,
+        role: "alert",
+        className: ui.cn(bannerVariants({ variant }), className),
+        ...props,
+        children: [
+          children,
+          onClose && /* @__PURE__ */ jsxRuntime.jsxs(
+            ui.Box,
+            {
+              tag: "button",
+              type: "button",
+              onClick: onClose,
+              className: "absolute right-4 top-3 rounded-md p-1 hover:bg-black/5 dark:hover:bg-white/5",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { style: ui.css("h-4 w-4") }),
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Banner.displayName = "Banner";
+
+exports.Banner = Banner;
+exports.bannerVariants = bannerVariants;

package/dist/banner.d.ts

@@ -0,0 +1,20 @@
+import * as React from "react";
+import { VariantProps } from '@hanzo/ui';
+declare const bannerVariants: (choice?: (import("@hanzo/ui").Choice<{
+    variant: {
+        default: string;
+        info: string;
+        success: string;
+        warning: string;
+        error: string;
+    };
+}> & {
+    class?: import("@hanzo/ui").ClassValue;
+    className?: import("@hanzo/ui").ClassValue;
+}) | undefined) => string;
+export interface BannerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof bannerVariants> {
+    onClose?: () => void;
+}
+declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<HTMLDivElement>>;
+export { Banner, bannerVariants };
+//# sourceMappingURL=banner.d.ts.map

package/dist/banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../src/banner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,YAAY,EAAiB,MAAM,WAAW,CAAA;AAK5D,QAAA,MAAM,cAAc;;;;;;;;;;;yBAmBnB,CAAA;AAED,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,QAAA,MAAM,MAAM,oFAuBX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/banner.js

@@ -0,0 +1,55 @@
+"use client";
+import * as React from 'react';
+import { variants, Box, cn, css } from '@hanzo/ui';
+import { X } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var bannerVariants = variants(
+  "relative w-full border-b px-4 py-3 text-sm [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground",
+        info: "border-[var(--color-link-primary)]/50 bg-[var(--color-link-primary)] text-[var(--color-link-primary)] dark:bg-[var(--color-link-primary)] dark:text-[var(--color-link-primary)] [&>svg]:text-[var(--color-link-primary)] dark:[&>svg]:text-[var(--color-link-primary)]",
+        success: "border-[var(--lux-state-success)]/50 bg-[var(--lux-state-success)] text-[var(--lux-state-success)] dark:bg-[var(--lux-state-success)] dark:text-[var(--lux-state-success)] [&>svg]:text-[var(--lux-state-success)] dark:[&>svg]:text-[var(--lux-state-success)]",
+        warning: "border-[var(--lux-state-notice)]/50 bg-[var(--lux-state-notice)] text-[var(--lux-state-notice)] dark:bg-[var(--lux-state-notice)] dark:text-[var(--lux-state-notice)] [&>svg]:text-[var(--lux-state-notice)] dark:[&>svg]:text-[var(--lux-state-notice)]",
+        error: "border-[var(--lux-state-error)]/50 bg-[var(--lux-state-error)] text-[var(--lux-state-error)] dark:bg-[var(--lux-state-error)] dark:text-[var(--lux-state-error)] [&>svg]:text-[var(--lux-state-error)] dark:[&>svg]:text-[var(--lux-state-error)]"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Banner = React.forwardRef(
+  ({ className, variant, onClose, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      Box,
+      {
+        ref,
+        role: "alert",
+        className: cn(bannerVariants({ variant }), className),
+        ...props,
+        children: [
+          children,
+          onClose && /* @__PURE__ */ jsxs(
+            Box,
+            {
+              tag: "button",
+              type: "button",
+              onClick: onClose,
+              className: "absolute right-4 top-3 rounded-md p-1 hover:bg-black/5 dark:hover:bg-white/5",
+              children: [
+                /* @__PURE__ */ jsx(X, { style: css("h-4 w-4") }),
+                /* @__PURE__ */ jsx(Box, { tag: "span", className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Banner.displayName = "Banner";
+
+export { Banner, bannerVariants };

package/dist/breadcrumb-and-filters-navigation-bar.cjs

@@ -0,0 +1,51 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var ui = require('@hanzo/ui');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var BreadcrumbAndFiltersNavigationBar = React__namespace.forwardRef(({ className, items = [], ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ui.Box,
+    {
+      tag: "nav",
+      ref,
+      className: ui.cn("border-b bg-background", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { className: "container flex h-16 items-center gap-6", children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        ui.Box,
+        {
+          tag: "a",
+          href: item.href,
+          className: "text-sm font-medium transition-colors hover:text-primary",
+          children: item.label
+        },
+        item.href
+      )) })
+    }
+  );
+});
+BreadcrumbAndFiltersNavigationBar.displayName = "BreadcrumbAndFiltersNavigationBar";
+
+exports.BreadcrumbAndFiltersNavigationBar = BreadcrumbAndFiltersNavigationBar;

package/dist/breadcrumb-and-filters-navigation-bar.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+export interface BreadcrumbAndFiltersNavigationBarProps extends React.HTMLAttributes<HTMLElement> {
+    items?: Array<{
+        label: string;
+        href: string;
+    }>;
+}
+declare const BreadcrumbAndFiltersNavigationBar: React.ForwardRefExoticComponent<BreadcrumbAndFiltersNavigationBarProps & React.RefAttributes<HTMLElement>>;
+export { BreadcrumbAndFiltersNavigationBar };
+//# sourceMappingURL=breadcrumb-and-filters-navigation-bar.d.ts.map

package/dist/breadcrumb-and-filters-navigation-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb-and-filters-navigation-bar.d.ts","sourceRoot":"","sources":["../src/breadcrumb-and-filters-navigation-bar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,WAAW,sCACf,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzC,KAAK,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAC/C;AAED,QAAA,MAAM,iCAAiC,4GAuBrC,CAAA;AAIF,OAAO,EAAE,iCAAiC,EAAE,CAAA"}

package/dist/breadcrumb-and-filters-navigation-bar.js

@@ -0,0 +1,29 @@
+"use client";
+import * as React from 'react';
+import { Box, cn } from '@hanzo/ui';
+import { jsx } from 'react/jsx-runtime';
+
+var BreadcrumbAndFiltersNavigationBar = React.forwardRef(({ className, items = [], ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      tag: "nav",
+      ref,
+      className: cn("border-b bg-background", className),
+      ...props,
+      children: /* @__PURE__ */ jsx(Box, { className: "container flex h-16 items-center gap-6", children: items.map((item) => /* @__PURE__ */ jsx(
+        Box,
+        {
+          tag: "a",
+          href: item.href,
+          className: "text-sm font-medium transition-colors hover:text-primary",
+          children: item.label
+        },
+        item.href
+      )) })
+    }
+  );
+});
+BreadcrumbAndFiltersNavigationBar.displayName = "BreadcrumbAndFiltersNavigationBar";
+
+export { BreadcrumbAndFiltersNavigationBar };