@hanzo/ui 5.3.28 → 5.3.30

package/dist/carousel.js

@@ -0,0 +1,278 @@
+"use client";
+'use strict';
+
+var React2 = require('react');
+var useEmblaCarousel = require('embla-carousel-react');
+var lucideReact = require('lucide-react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+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 React2__namespace = /*#__PURE__*/_interopNamespace(React2);
+var useEmblaCarousel__default = /*#__PURE__*/_interopDefault(useEmblaCarousel);
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+__name(cn, "cn");
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+        // Keep the additional Hanzo variants for backward compatibility
+        primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        linkFG: "text-primary underline-offset-4 hover:underline",
+        linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React2__namespace.forwardRef(
+  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props,
+        children: [
+          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+            lucideReact.Loader2,
+            {
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+            }
+          ) : null,
+          isLoading && size === "icon" ? null : children
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var button_default = Button;
+var CarouselContext = React2__namespace.createContext(null);
+var useCarousel = /* @__PURE__ */ __name(() => {
+  const service = React2__namespace.useContext(CarouselContext);
+  if (!service) {
+    throw new Error("useCarousel must be used within a <Carousel />");
+  }
+  return service;
+}, "useCarousel");
+var Carousel = React2__namespace.forwardRef(
+  ({
+    orientation = "horizontal",
+    options,
+    setApi,
+    plugins,
+    className,
+    children,
+    onCarouselSelect,
+    ...props
+  }, ref) => {
+    const [carouselRef, api] = useEmblaCarousel__default.default({ ...options, axis: orientation === "horizontal" ? "x" : "y" }, plugins);
+    const [canScrollPrev, setCanScrollPrev] = React2__namespace.useState(false);
+    const [canScrollNext, setCanScrollNext] = React2__namespace.useState(false);
+    const onSelect = React2__namespace.useCallback((api2) => {
+      if (!api2) {
+        return;
+      }
+      setCanScrollPrev(api2.canScrollPrev());
+      setCanScrollNext(api2.canScrollNext());
+      if (onCarouselSelect) {
+        onCarouselSelect(api2);
+      }
+    }, []);
+    const scrollPrev = React2__namespace.useCallback(() => {
+      api?.scrollPrev();
+    }, [api]);
+    const scrollNext = React2__namespace.useCallback(() => {
+      api?.scrollNext();
+    }, [api]);
+    const handleKeyDown = React2__namespace.useCallback((event) => {
+      if (event.key === "ArrowLeft") {
+        event.preventDefault();
+        scrollPrev();
+      } else if (event.key === "ArrowRight") {
+        event.preventDefault();
+        scrollNext();
+      }
+    }, [scrollPrev, scrollNext]);
+    React2__namespace.useEffect(() => {
+      if (!api || !setApi) {
+        return;
+      }
+      setApi(api);
+    }, [api, setApi]);
+    React2__namespace.useEffect(() => {
+      if (!api) {
+        return;
+      }
+      onSelect(api);
+      api.on("reInit", onSelect);
+      api.on("select", onSelect);
+      return () => {
+        api?.off("select", onSelect);
+      };
+    }, [api, onSelect]);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      CarouselContext.Provider,
+      {
+        value: {
+          carouselRef,
+          api,
+          options,
+          orientation: orientation || (options?.axis === "y" ? "vertical" : "horizontal"),
+          scrollPrev,
+          scrollNext,
+          canScrollPrev,
+          canScrollNext
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            ref,
+            onKeyDownCapture: handleKeyDown,
+            className: cn("relative", className),
+            role: "region",
+            "aria-roledescription": "carousel",
+            "data-vaul-no-drag": true,
+            ...props,
+            children
+          }
+        )
+      }
+    );
+  }
+);
+Carousel.displayName = "Carousel";
+var CarouselContent = React2__namespace.forwardRef(({ className, ...props }, ref) => {
+  const { carouselRef, orientation } = useCarousel();
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: carouselRef, className: "overflow-hidden", "data-vaul-no-drag": true, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex",
+        orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
+        className
+      ),
+      ...props
+    }
+  ) });
+});
+CarouselContent.displayName = "CarouselContent";
+var CarouselItem = React2__namespace.forwardRef(({ className, ...props }, ref) => {
+  const { orientation } = useCarousel();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      role: "group",
+      "aria-roledescription": "slide",
+      "data-vaul-no-drag": true,
+      className: cn(
+        "min-w-0 shrink-0 grow-0 basis-full",
+        orientation === "horizontal" ? "pl-4" : "pt-4",
+        className
+      ),
+      ...props
+    }
+  );
+});
+CarouselItem.displayName = "CarouselItem";
+var CarouselPrevious = React2__namespace.forwardRef(({ className, variant = "ghost", size = "icon", ...props }, ref) => {
+  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    button_default,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute  h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-left-12 top-1/2 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollPrev,
+      onClick: scrollPrev,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Previous slide" })
+      ]
+    }
+  );
+});
+CarouselPrevious.displayName = "CarouselPrevious";
+var CarouselNext = React2__namespace.forwardRef(({ className, variant = "ghost", size = "icon", ...props }, ref) => {
+  const { orientation, scrollNext, canScrollNext } = useCarousel();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    button_default,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-right-12 top-1/2 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollNext,
+      onClick: scrollNext,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Next slide" })
+      ]
+    }
+  );
+});
+CarouselNext.displayName = "CarouselNext";
+
+exports.Carousel = Carousel;
+exports.CarouselContent = CarouselContent;
+exports.CarouselItem = CarouselItem;
+exports.CarouselNext = CarouselNext;
+exports.CarouselPrevious = CarouselPrevious;

package/dist/carousel.mjs

@@ -0,0 +1,249 @@
+"use client";
+import * as React2 from 'react';
+import useEmblaCarousel from 'embla-carousel-react';
+import { Loader2, ArrowLeft, ArrowRight } from 'lucide-react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+__name(cn, "cn");
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+        // Keep the additional Hanzo variants for backward compatibility
+        primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        linkFG: "text-primary underline-offset-4 hover:underline",
+        linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React2.forwardRef(
+  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsxs(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props,
+        children: [
+          isLoading ? /* @__PURE__ */ jsx(
+            Loader2,
+            {
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+            }
+          ) : null,
+          isLoading && size === "icon" ? null : children
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var button_default = Button;
+var CarouselContext = React2.createContext(null);
+var useCarousel = /* @__PURE__ */ __name(() => {
+  const service = React2.useContext(CarouselContext);
+  if (!service) {
+    throw new Error("useCarousel must be used within a <Carousel />");
+  }
+  return service;
+}, "useCarousel");
+var Carousel = React2.forwardRef(
+  ({
+    orientation = "horizontal",
+    options,
+    setApi,
+    plugins,
+    className,
+    children,
+    onCarouselSelect,
+    ...props
+  }, ref) => {
+    const [carouselRef, api] = useEmblaCarousel({ ...options, axis: orientation === "horizontal" ? "x" : "y" }, plugins);
+    const [canScrollPrev, setCanScrollPrev] = React2.useState(false);
+    const [canScrollNext, setCanScrollNext] = React2.useState(false);
+    const onSelect = React2.useCallback((api2) => {
+      if (!api2) {
+        return;
+      }
+      setCanScrollPrev(api2.canScrollPrev());
+      setCanScrollNext(api2.canScrollNext());
+      if (onCarouselSelect) {
+        onCarouselSelect(api2);
+      }
+    }, []);
+    const scrollPrev = React2.useCallback(() => {
+      api?.scrollPrev();
+    }, [api]);
+    const scrollNext = React2.useCallback(() => {
+      api?.scrollNext();
+    }, [api]);
+    const handleKeyDown = React2.useCallback((event) => {
+      if (event.key === "ArrowLeft") {
+        event.preventDefault();
+        scrollPrev();
+      } else if (event.key === "ArrowRight") {
+        event.preventDefault();
+        scrollNext();
+      }
+    }, [scrollPrev, scrollNext]);
+    React2.useEffect(() => {
+      if (!api || !setApi) {
+        return;
+      }
+      setApi(api);
+    }, [api, setApi]);
+    React2.useEffect(() => {
+      if (!api) {
+        return;
+      }
+      onSelect(api);
+      api.on("reInit", onSelect);
+      api.on("select", onSelect);
+      return () => {
+        api?.off("select", onSelect);
+      };
+    }, [api, onSelect]);
+    return /* @__PURE__ */ jsx(
+      CarouselContext.Provider,
+      {
+        value: {
+          carouselRef,
+          api,
+          options,
+          orientation: orientation || (options?.axis === "y" ? "vertical" : "horizontal"),
+          scrollPrev,
+          scrollNext,
+          canScrollPrev,
+          canScrollNext
+        },
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref,
+            onKeyDownCapture: handleKeyDown,
+            className: cn("relative", className),
+            role: "region",
+            "aria-roledescription": "carousel",
+            "data-vaul-no-drag": true,
+            ...props,
+            children
+          }
+        )
+      }
+    );
+  }
+);
+Carousel.displayName = "Carousel";
+var CarouselContent = React2.forwardRef(({ className, ...props }, ref) => {
+  const { carouselRef, orientation } = useCarousel();
+  return /* @__PURE__ */ jsx("div", { ref: carouselRef, className: "overflow-hidden", "data-vaul-no-drag": true, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex",
+        orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
+        className
+      ),
+      ...props
+    }
+  ) });
+});
+CarouselContent.displayName = "CarouselContent";
+var CarouselItem = React2.forwardRef(({ className, ...props }, ref) => {
+  const { orientation } = useCarousel();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      role: "group",
+      "aria-roledescription": "slide",
+      "data-vaul-no-drag": true,
+      className: cn(
+        "min-w-0 shrink-0 grow-0 basis-full",
+        orientation === "horizontal" ? "pl-4" : "pt-4",
+        className
+      ),
+      ...props
+    }
+  );
+});
+CarouselItem.displayName = "CarouselItem";
+var CarouselPrevious = React2.forwardRef(({ className, variant = "ghost", size = "icon", ...props }, ref) => {
+  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+  return /* @__PURE__ */ jsxs(
+    button_default,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute  h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-left-12 top-1/2 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollPrev,
+      onClick: scrollPrev,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Previous slide" })
+      ]
+    }
+  );
+});
+CarouselPrevious.displayName = "CarouselPrevious";
+var CarouselNext = React2.forwardRef(({ className, variant = "ghost", size = "icon", ...props }, ref) => {
+  const { orientation, scrollNext, canScrollNext } = useCarousel();
+  return /* @__PURE__ */ jsxs(
+    button_default,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-right-12 top-1/2 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollNext,
+      onClick: scrollNext,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ArrowRight, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Next slide" })
+      ]
+    }
+  );
+});
+CarouselNext.displayName = "CarouselNext";
+
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };

package/dist/checkbox.js

@@ -0,0 +1,60 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var CheckboxPrimitive = require('@radix-ui/react-checkbox');
+var reactIcons = require('@radix-ui/react-icons');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+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 CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+__name(cn, "cn");
+var Checkbox = /* @__PURE__ */ __name(({ className, ref, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
+  CheckboxPrimitive__namespace.Root,
+  {
+    className: cn(
+      "focus-visible:ring-ring data-[state=checked]:bg-brand data-[state=checked]:border-brand peer h-4 w-4 shrink-0 rounded-xs border border-gray-400 shadow-sm focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-black",
+      className
+    ),
+    ref,
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      CheckboxPrimitive__namespace.Indicator,
+      {
+        className: cn("flex items-center justify-center text-current"),
+        children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.CheckIcon, { className: "h-3.5 w-3.5" })
+      }
+    )
+  }
+), "Checkbox");
+Checkbox.displayName = CheckboxPrimitive__namespace.Root.displayName;
+var checkbox_default = Checkbox;
+
+exports.Checkbox = Checkbox;
+exports.default = checkbox_default;

package/dist/checkbox.mjs

@@ -0,0 +1,35 @@
+"use client";
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { CheckIcon } from '@radix-ui/react-icons';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+__name(cn, "cn");
+var Checkbox = /* @__PURE__ */ __name(({ className, ref, ...props }) => /* @__PURE__ */ jsx(
+  CheckboxPrimitive.Root,
+  {
+    className: cn(
+      "focus-visible:ring-ring data-[state=checked]:bg-brand data-[state=checked]:border-brand peer h-4 w-4 shrink-0 rounded-xs border border-gray-400 shadow-sm focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-black",
+      className
+    ),
+    ref,
+    ...props,
+    children: /* @__PURE__ */ jsx(
+      CheckboxPrimitive.Indicator,
+      {
+        className: cn("flex items-center justify-center text-current"),
+        children: /* @__PURE__ */ jsx(CheckIcon, { className: "h-3.5 w-3.5" })
+      }
+    )
+  }
+), "Checkbox");
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+var checkbox_default = Checkbox;
+
+export { Checkbox, checkbox_default as default };