@hanzo/ui 4.8.5 → 4.9.0

package/dist/chunk-QJQPT4WX.js

@@ -0,0 +1,638 @@
+'use strict';
+
+var chunkCVACQJRM_js = require('./chunk-CVACQJRM.js');
+var chunkZKGVLTSI_js = require('./chunk-ZKGVLTSI.js');
+var chunkCRALRACO_js = require('./chunk-CRALRACO.js');
+var chunkDN2AEEA2_js = require('./chunk-DN2AEEA2.js');
+var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
+var jsxRuntime = require('react/jsx-runtime');
+var nextThemes = require('next-themes');
+var sonner = require('sonner');
+var React = require('react');
+var lucideReact = require('lucide-react');
+
+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 AlertDialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(AlertDialogPrimitive);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var AlertDialog = AlertDialogPrimitive__namespace.Root;
+var AlertDialogTrigger = AlertDialogPrimitive__namespace.Trigger;
+var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
+function AlertDialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Overlay,
+    {
+      "data-slot": "overlay",
+      className: chunkDN2AEEA2_js.cn(
+        "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogContent({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      AlertDialogPrimitive__namespace.Content,
+      {
+        ref,
+        "data-slot": "content",
+        className: chunkDN2AEEA2_js.cn(
+          "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+AlertDialogContent.displayName = AlertDialogPrimitive__namespace.Content.displayName;
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "header",
+      className: chunkDN2AEEA2_js.cn(
+        "flex flex-col space-y-2 text-center sm:text-left",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "footer",
+      className: chunkDN2AEEA2_js.cn(
+        "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Title,
+    {
+      ref,
+      "data-slot": "title",
+      className: chunkDN2AEEA2_js.cn("text-lg font-semibold", className),
+      ...props
+    }
+  );
+}
+AlertDialogTitle.displayName = AlertDialogPrimitive__namespace.Title.displayName;
+function AlertDialogDescription({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Description,
+    {
+      ref,
+      "data-slot": "description",
+      className: chunkDN2AEEA2_js.cn("text-sm text-muted-foreground", className),
+      ...props
+    }
+  );
+}
+AlertDialogDescription.displayName = AlertDialogPrimitive__namespace.Description.displayName;
+function AlertDialogAction({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Action,
+    {
+      ref,
+      "data-slot": "action",
+      className: chunkDN2AEEA2_js.cn(chunkCRALRACO_js.buttonVariants(), className),
+      ...props
+    }
+  );
+}
+AlertDialogAction.displayName = AlertDialogPrimitive__namespace.Action.displayName;
+function AlertDialogCancel({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Cancel,
+    {
+      ref,
+      "data-slot": "cancel",
+      className: chunkDN2AEEA2_js.cn(
+        chunkCRALRACO_js.buttonVariants({ variant: "outline" }),
+        "mt-2 sm:mt-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+AlertDialogCancel.displayName = AlertDialogPrimitive__namespace.Cancel.displayName;
+var Toaster = ({ ...props }) => {
+  const { theme = "system" } = nextThemes.useTheme();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    sonner.Toaster,
+    {
+      theme,
+      className: "toaster group",
+      toastOptions: {
+        classNames: {
+          toast: "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+          description: "group-[.toast]:text-muted-foreground",
+          actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+          cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground"
+        }
+      },
+      ...props
+    }
+  );
+};
+function DotPattern({
+  width = 16,
+  height = 16,
+  x = 0,
+  y = 0,
+  cx = 1,
+  cy = 1,
+  cr = 1,
+  className,
+  ...props
+}) {
+  const id = React.useId();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: chunkDN2AEEA2_js.cn(
+        "pointer-events-none absolute inset-0 h-full w-full fill-neutral-400/80",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx(
+          "pattern",
+          {
+            height,
+            id,
+            patternContentUnits: "userSpaceOnUse",
+            patternUnits: "userSpaceOnUse",
+            width,
+            x,
+            y,
+            children: /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy, id: "pattern-circle", r: cr })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { fill: `url(#${id})`, height: "100%", strokeWidth: 0, width: "100%" })
+      ]
+    }
+  );
+}
+var DotsLoader = ({ className }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-4 space-x-1.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 animate-[loaderDots_0.6s_0s_infinite_alternate] rounded-full bg-slate-100" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 animate-[loaderDots_0.6s_0.3s_infinite_alternate] rounded-full bg-slate-100" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 animate-[loaderDots_0.6s_0.6s_infinite_alternate] rounded-full bg-slate-100" })
+  ] }) });
+};
+var ErrorMessage = ({ message, ...props }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: "rounded-sm bg-red-500/10 px-4 py-2 text-sm text-red-700",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "font-bold", children: "Error: " }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "block sm:inline", children: [
+          " ",
+          message,
+          " "
+        ] })
+      ]
+    }
+  );
+};
+var PrettyJsonPrint = ({
+  json,
+  className
+}) => {
+  const formattedJson = React.useMemo(() => {
+    let formattedValue = `Unparseable JSON: String(${json})`;
+    if (typeof json === "object") {
+      formattedValue = JSON.stringify(json, null, 2);
+    } else if (typeof json === "string") {
+      try {
+        const parsedJson = JSON.parse(json);
+        formattedValue = JSON.stringify(parsedJson, null, 2);
+      } catch (error) {
+        console.error("error parsing json", error);
+      }
+    }
+    return formattedValue;
+  }, [json]);
+  return /* @__PURE__ */ jsxRuntime.jsx("pre", { className: chunkDN2AEEA2_js.cn("overflow-x-scroll", className), children: formattedJson });
+};
+var MIN_TEXTAREA_HEIGHT = 32;
+var PromptTextarea = ({ className, ...props }) => {
+  const textareaRef = React__namespace.useRef(null);
+  React__namespace.useLayoutEffect(() => {
+    if (!textareaRef.current) return;
+    textareaRef.current.style.height = "60px";
+    textareaRef.current.style.height = `${Math.max(
+      textareaRef.current.scrollHeight + 2,
+      MIN_TEXTAREA_HEIGHT
+    )}px`;
+    if (props.autoFocus !== void 0 && props.autoFocus) {
+      textareaRef.current.focus();
+    }
+  }, [props.value]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        className: chunkDN2AEEA2_js.cn(
+          "flex w-full rounded-md border border-gray-200 bg-gray-400 px-4 py-2 pt-4 text-sm break-words placeholder-gray-100 placeholder:text-base focus-visible:ring-1 focus-visible:ring-gray-100 focus-visible:outline-hidden focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        style: {
+          minHeight: MIN_TEXTAREA_HEIGHT,
+          resize: "none",
+          maxHeight: "300px"
+        },
+        ...props.field,
+        onKeyDown: props.onKeyDown,
+        ref: textareaRef,
+        ...!props.isLoading && {
+          placeholder: props.label
+        }
+      }
+    ),
+    props.isLoading ? /* @__PURE__ */ jsxRuntime.jsx(DotsLoader, { className: "absolute top-6 left-4" }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(chunkCVACQJRM_js.FormLabel, { className: "sr-only", children: props.label })
+  ] });
+};
+PromptTextarea.displayName = "PromptTextarea";
+var SearchInput = ({
+  className,
+  value,
+  onChange,
+  classNames,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: chunkDN2AEEA2_js.cn(
+        "shadow-border-input focus-within:shadow-border-input-focus relative flex h-10 flex-1 items-center overflow-hidden rounded-full shadow-[0_0_0_1px_currentColor] transition-shadow",
+        classNames?.container
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          chunkZKGVLTSI_js.Input,
+          {
+            className: chunkDN2AEEA2_js.cn(
+              "placeholder:!text-text-placeholder !h-full border-none bg-transparent py-2 pl-10",
+              classNames?.input
+            ),
+            onChange: (e) => {
+              onChange?.(e);
+            },
+            placeholder: "Search...",
+            spellCheck: false,
+            value,
+            ...props
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "text-text-tertiary absolute top-1/2 left-4 -z-[1px] h-4 w-4 -translate-y-1/2" }),
+        value && /* @__PURE__ */ jsxRuntime.jsxs(
+          chunkCRALRACO_js.Button,
+          {
+            className: chunkDN2AEEA2_js.cn("absolute right-1 h-8 w-8 p-2", classNames?.button),
+            onClick: () => {
+              onChange?.({
+                target: { value: "" }
+              });
+            },
+            size: "auto",
+            type: "button",
+            variant: "tertiary",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, {}),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Clear" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+SearchInput.displayName = "SearchInput";
+var StepperContext = React.createContext(
+  void 0
+);
+var StepItemContext = React.createContext(
+  void 0
+);
+var useStepper = () => {
+  const context = React.useContext(StepperContext);
+  if (!context) {
+    throw new Error("useStepper must be used within a Stepper");
+  }
+  return context;
+};
+var useStepItem = () => {
+  const context = React.useContext(StepItemContext);
+  if (!context) {
+    throw new Error("useStepItem must be used within a StepperItem");
+  }
+  return context;
+};
+var Stepper = ({
+  defaultValue = 0,
+  value,
+  onValueChange,
+  orientation = "horizontal",
+  className,
+  ...props
+}) => {
+  const [activeStep, setInternalStep] = React__namespace.useState(defaultValue);
+  const setActiveStep = React__namespace.useCallback(
+    (step) => {
+      if (value === void 0) {
+        setInternalStep(step);
+      }
+      onValueChange?.(step);
+    },
+    [value, onValueChange]
+  );
+  const currentStep = value ?? activeStep;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    StepperContext.Provider,
+    {
+      value: {
+        activeStep: currentStep,
+        setActiveStep,
+        orientation
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: chunkDN2AEEA2_js.cn(
+            "group/stepper inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col",
+            className
+          ),
+          "data-orientation": orientation,
+          ...props
+        }
+      )
+    }
+  );
+};
+Stepper.displayName = "Stepper";
+var StepperItem = ({
+  step,
+  completed = false,
+  disabled = false,
+  loading = false,
+  className,
+  children,
+  ...props
+}) => {
+  const { activeStep } = useStepper();
+  const state = completed || step < activeStep ? "completed" : activeStep === step ? "active" : "inactive";
+  const isLoading = loading && step === activeStep;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    StepItemContext.Provider,
+    {
+      value: { step, state, isDisabled: disabled, isLoading },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: chunkDN2AEEA2_js.cn(
+            "group/step flex items-center group-data-[orientation=horizontal]/stepper:flex-row group-data-[orientation=vertical]/stepper:flex-col",
+            className
+          ),
+          "data-state": state,
+          ...isLoading ? { "data-loading": true } : {},
+          ...props,
+          children
+        }
+      )
+    }
+  );
+};
+StepperItem.displayName = "StepperItem";
+var StepperTrigger = ({
+  asChild = false,
+  className,
+  children,
+  ...props
+}) => {
+  const { setActiveStep } = useStepper();
+  const { step, isDisabled } = useStepItem();
+  if (asChild) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      className: chunkDN2AEEA2_js.cn(
+        "inline-flex items-center gap-3 disabled:pointer-events-none",
+        className
+      ),
+      disabled: isDisabled,
+      onClick: () => setActiveStep(step),
+      ...props,
+      children
+    }
+  );
+};
+StepperTrigger.displayName = "StepperTrigger";
+var StepperIndicator = ({
+  asChild = false,
+  className,
+  children,
+  ...props
+}) => {
+  const { state, step, isLoading } = useStepItem();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: chunkDN2AEEA2_js.cn(
+        "bg-bg-tertiary text-text-secondary data-[state=completed]:bg-brand data-[state=active]:text-text-default data-[state=completed]:text-primary-foreground data-[state=active]:bg-bg-secondary relative flex size-6 shrink-0 items-center justify-center rounded-full text-xs font-medium",
+        className
+      ),
+      "data-state": state,
+      ...props,
+      children: asChild ? children : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "transition-all group-data-[loading=true]/step:scale-0 group-data-[loading=true]/step:opacity-0 group-data-[loading=true]/step:transition-none group-data-[state=completed]/step:scale-0 group-data-[state=completed]/step:opacity-0", children: step }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          lucideReact.Check,
+          {
+            "aria-hidden": "true",
+            className: "absolute scale-0 opacity-0 transition-all group-data-[state=completed]/step:scale-100 group-data-[state=completed]/step:opacity-100",
+            strokeWidth: 2
+          }
+        ),
+        isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute transition-all", children: /* @__PURE__ */ jsxRuntime.jsx(
+          lucideReact.LoaderCircle,
+          {
+            "aria-hidden": "true",
+            className: "animate-spin",
+            size: 14,
+            strokeWidth: 2
+          }
+        ) })
+      ] })
+    }
+  );
+};
+StepperIndicator.displayName = "StepperIndicator";
+var StepperTitle = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx("h3", { className: chunkDN2AEEA2_js.cn("text-sm font-medium", className), ...props });
+StepperTitle.displayName = "StepperTitle";
+var StepperDescription = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx("p", { className: chunkDN2AEEA2_js.cn("text-text-secondary text-sm", className), ...props });
+StepperDescription.displayName = "StepperDescription";
+var StepperSeparator = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: chunkDN2AEEA2_js.cn(
+        "bg-muted group-data-[state=completed]/step:bg-primary m-0.5 group-data-[orientation=horizontal]/stepper:h-0.5 group-data-[orientation=horizontal]/stepper:w-full group-data-[orientation=horizontal]/stepper:flex-1 group-data-[orientation=vertical]/stepper:h-12 group-data-[orientation=vertical]/stepper:w-0.5",
+        className
+      ),
+      ...props
+    }
+  );
+};
+StepperSeparator.displayName = "StepperSeparator";
+var TextLink = ({
+  label,
+  url,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    className: chunkDN2AEEA2_js.cn("cursor-pointer text-white underline", className),
+    onClick: () => {
+      window.open(url);
+    },
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: url, rel: "noreferrer", target: "_blank", children: label })
+  }
+);
+var TextField = ({
+  classes,
+  field,
+  label,
+  type = "text",
+  helperMessage,
+  startAdornment,
+  endAdornment,
+  autoFocus,
+  min,
+  max
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(chunkCVACQJRM_js.FormItem, { className: chunkDN2AEEA2_js.cn(classes?.formItem), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(chunkCVACQJRM_js.FormControl, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      chunkZKGVLTSI_js.Input,
+      {
+        autoFocus,
+        className: chunkDN2AEEA2_js.cn(classes?.input),
+        endAdornment,
+        max,
+        min,
+        spellCheck: false,
+        startAdornment,
+        type,
+        ...field
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunkCVACQJRM_js.FormLabel, { className: chunkDN2AEEA2_js.cn(classes?.label), children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunkCVACQJRM_js.FormDescription, { children: helperMessage }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunkCVACQJRM_js.FormMessage, { className: chunkDN2AEEA2_js.cn(classes?.helperMessage) })
+  ] });
+};
+
+exports.AlertDialog = AlertDialog;
+exports.AlertDialogAction = AlertDialogAction;
+exports.AlertDialogCancel = AlertDialogCancel;
+exports.AlertDialogContent = AlertDialogContent;
+exports.AlertDialogDescription = AlertDialogDescription;
+exports.AlertDialogFooter = AlertDialogFooter;
+exports.AlertDialogHeader = AlertDialogHeader;
+exports.AlertDialogOverlay = AlertDialogOverlay;
+exports.AlertDialogPortal = AlertDialogPortal;
+exports.AlertDialogTitle = AlertDialogTitle;
+exports.AlertDialogTrigger = AlertDialogTrigger;
+exports.DotPattern = DotPattern;
+exports.DotsLoader = DotsLoader;
+exports.ErrorMessage = ErrorMessage;
+exports.PrettyJsonPrint = PrettyJsonPrint;
+exports.PromptTextarea = PromptTextarea;
+exports.SearchInput = SearchInput;
+exports.Stepper = Stepper;
+exports.StepperDescription = StepperDescription;
+exports.StepperIndicator = StepperIndicator;
+exports.StepperItem = StepperItem;
+exports.StepperSeparator = StepperSeparator;
+exports.StepperTitle = StepperTitle;
+exports.StepperTrigger = StepperTrigger;
+exports.TextField = TextField;
+exports.TextLink = TextLink;
+exports.Toaster = Toaster;
+//# sourceMappingURL=chunk-QJQPT4WX.js.map
+//# sourceMappingURL=chunk-QJQPT4WX.js.map