@sikka/hawa 0.26.29 → 0.26.30

package/dist/destroyableCard/index.mjs

@@ -0,0 +1,164 @@
+import {
+  cn
+} from "../chunk-CBRGWUZG.mjs";
+
+// elements/destroyableCard/DestroyableCard.tsx
+import React2, { useRef, useState } from "react";
+
+// elements/card/Card.tsx
+import * as React from "react";
+var Card = React.forwardRef(
+  ({ className, variant = "default", clickable = false, ...props }, ref) => {
+    let variantStyles = {
+      default: cn(
+        "hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
+        clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
+      ),
+      neoBrutalism: cn(
+        "neo-brutalism",
+        // "hawa-transition-all hawa-uppercase hawa-font-mono  dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono  dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]",
+        clickable && "hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active"
+      )
+    };
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        className: cn(className, variantStyles[variant]),
+        ...props
+      }
+    );
+  }
+);
+var CardHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    ref,
+    className: cn(
+      "hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6",
+      className
+    ),
+    ...props
+  }
+));
+var CardTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "h3",
+  {
+    ref,
+    className: cn("hawa-text-2xl hawa-font-semibold ", className),
+    ...props
+  }
+));
+var CardDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "p",
+  {
+    ref,
+    className: cn("hawa-text-sm hawa-text-muted-foreground", className),
+    ...props
+  }
+));
+var CardContent = React.forwardRef(
+  ({ headless, noPadding, className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref,
+      className: cn(
+        noPadding ? "hawa-p-0" : "hawa-p-6",
+        headless ? "hawa-pt-6" : "hawa-pt-0",
+        className
+      ),
+      ...props
+    }
+  )
+);
+var CardFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    ref,
+    className: cn("hawa-flex hawa-items-center hawa-p-6 hawa-pt-0", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+CardContent.displayName = "CardContent";
+CardHeader.displayName = "CardHeader";
+CardFooter.displayName = "CardFooter";
+CardTitle.displayName = "CardTitle";
+Card.displayName = "Card";
+
+// elements/destroyableCard/DestroyableCard.tsx
+var DestroyableCard = ({
+  position = "bottom-right",
+  fixed,
+  direction,
+  ...props
+}) => {
+  const [closed, setClosed] = useState(false);
+  const popUpRef = useRef(null);
+  const boxPosition = {
+    "bottom-right": "hawa-right-4 hawa-bottom-4",
+    "bottom-left": "hawa-left-4 hawa-bottom-4"
+  };
+  return /* @__PURE__ */ React2.createElement(
+    "div",
+    {
+      className: cn(
+        "hawa-transition-all",
+        closed ? "hawa-opacity-0" : "hawa-opacity-100"
+      ),
+      ref: popUpRef
+    },
+    /* @__PURE__ */ React2.createElement(
+      Card,
+      {
+        className: cn(
+          fixed ? "hawa-fixed" : "hawa-relative",
+          fixed && position && boxPosition[position]
+        ),
+        dir: direction
+      },
+      /* @__PURE__ */ React2.createElement(
+        "button",
+        {
+          type: "button",
+          className: cn(
+            direction === "rtl" ? "hawa-left-2" : "hawa-right-2",
+            "hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white"
+          ),
+          "data-dismiss-target": "#destroyable-card",
+          "aria-label": "Close",
+          onClick: () => {
+            setClosed(true);
+            setTimeout(() => {
+              if (popUpRef?.current) {
+                popUpRef?.current.removeChild(popUpRef?.current.children[0]);
+              }
+            }, 200);
+          }
+        },
+        /* @__PURE__ */ React2.createElement(
+          "svg",
+          {
+            "aria-hidden": "true",
+            className: "hawa-h-5 hawa-w-5",
+            fill: "currentColor",
+            viewBox: "0 0 20 20"
+          },
+          /* @__PURE__ */ React2.createElement(
+            "path",
+            {
+              fillRule: "evenodd",
+              d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+              clipRule: "evenodd"
+            }
+          )
+        )
+      ),
+      /* @__PURE__ */ React2.createElement(CardContent, { headless: true }, props.children)
+    )
+  );
+};
+export {
+  DestroyableCard
+};
+//# sourceMappingURL=index.mjs.map

package/dist/destroyableCard/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../elements/destroyableCard/DestroyableCard.tsx","../../elements/card/Card.tsx"],"sourcesContent":["import React, { FC, useRef, useState } from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Card, CardContent } from \"../card\";\n\ntype DestroyableCard = {\n  position?: \"bottom-right\" | \"bottom-left\";\n  direction?: DirectionType;\n  fixed?: boolean;\n  children?: any;\n};\nexport const DestroyableCard: FC<DestroyableCard> = ({\n  position = \"bottom-right\",\n  fixed,\n  direction,\n  ...props\n}) => {\n  const [closed, setClosed] = useState(false);\n  const popUpRef = useRef<HTMLDivElement>(null);\n\n  const boxPosition = {\n    \"bottom-right\": \"hawa-right-4 hawa-bottom-4\",\n    \"bottom-left\": \"hawa-left-4 hawa-bottom-4\"\n  };\n\n  return (\n    <div\n      className={cn(\n        \"hawa-transition-all\",\n        closed ? \"hawa-opacity-0\" : \"hawa-opacity-100\"\n      )}\n      ref={popUpRef}\n    >\n      <Card\n        className={cn(\n          fixed ? \"hawa-fixed\" : \"hawa-relative\",\n          fixed && position && boxPosition[position]\n        )}\n        dir={direction}\n      >\n        <button\n          type=\"button\"\n          className={cn(\n            direction === \"rtl\" ? \"hawa-left-2\" : \"hawa-right-2\",\n            \"hawa-absolute hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white\"\n          )}\n          data-dismiss-target=\"#destroyable-card\"\n          aria-label=\"Close\"\n          onClick={() => {\n            setClosed(true);\n            setTimeout(() => {\n              if (popUpRef?.current) {\n                popUpRef?.current.removeChild(popUpRef?.current.children[0]);\n              }\n            }, 200);\n          }}\n        >\n          <svg\n            aria-hidden=\"true\"\n            className=\"hawa-h-5 hawa-w-5\"\n            fill=\"currentColor\"\n            viewBox=\"0 0 20 20\"\n          >\n            <path\n              fillRule=\"evenodd\"\n              d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n              clipRule=\"evenodd\"\n            ></path>\n          </svg>\n        </button>\n        <CardContent headless>{props.children}</CardContent>\n      </Card>\n    </div>\n  );\n};\n","import * as React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n  clickable?: boolean;\n  variant?: \"default\" | \"neoBrutalism\";\n}\n\ntype CardContentProps = {\n  headless?: boolean;\n  noPadding?: boolean;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n  ({ className, variant = \"default\", clickable = false, ...props }, ref) => {\n    let variantStyles = {\n      default: cn(\n        \"hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm\",\n        clickable &&\n          \"hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow\"\n      ),\n      neoBrutalism: cn(\n        \"neo-brutalism\",\n        // \"hawa-transition-all hawa-uppercase hawa-font-mono  dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono  dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]\",\n        clickable &&\n          \"hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active\"\n      )\n    };\n    return (\n      <div\n        ref={ref}\n        className={cn(className, variantStyles[variant])}\n        {...props}\n      />\n    );\n  }\n);\nconst CardHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-p-6\",\n      className\n    )}\n    {...props}\n  />\n));\nconst CardTitle = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n  <h3\n    ref={ref}\n    className={cn(\"hawa-text-2xl hawa-font-semibold \", className)}\n    {...props}\n  />\n));\nconst CardDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n  <p\n    ref={ref}\n    className={cn(\"hawa-text-sm hawa-text-muted-foreground\", className)}\n    {...props}\n  />\n));\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n  ({ headless, noPadding, className, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\n        noPadding ? \"hawa-p-0\" : \"hawa-p-6\",\n        headless ? \"hawa-pt-6\" : \"hawa-pt-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n);\nconst CardFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\"hawa-flex hawa-items-center hawa-p-6 hawa-pt-0\", className)}\n    {...props}\n  />\n));\n\nCardDescription.displayName = \"CardDescription\";\nCardContent.displayName = \"CardContent\";\nCardHeader.displayName = \"CardHeader\";\nCardFooter.displayName = \"CardFooter\";\nCardTitle.displayName = \"CardTitle\";\nCard.displayName = \"Card\";\n\nexport {\n  CardDescription,\n  CardContent,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  Card\n};\n"],"mappings":"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","names":["React","React"]}

package/dist/dialog/index.d.mts

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { D as DirectionType } from '../commonTypes-ko_NGEoT.mjs';
+
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: {
+    ({ ...props }: DialogPrimitive.DialogPortalProps): React.JSX.Element;
+    displayName: string | undefined;
+};
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    persist?: boolean | undefined;
+    hideCloseButton?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DialogCarouselContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    hideCloseButton?: boolean | undefined;
+    hidePrevButton?: boolean | undefined;
+    persist?: boolean | undefined;
+    onPrev?: (() => void) | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+interface DialogCarouselProps {
+    children: React.ReactNode;
+    stepsApi?: any;
+    stepsRef?: any;
+    direction?: DirectionType;
+}
+declare const DialogCarousel: React.FC<DialogCarouselProps>;
+interface DialogStepsProps {
+    currentStep: string;
+    visibleStepRef: React.RefObject<HTMLDivElement>;
+    children: React.ReactNode;
+}
+declare const DialogSteps: React.FC<DialogStepsProps>;
+interface DialogStepProps {
+    id: string;
+    children: React.ReactNode;
+    className?: string;
+    stepRef?: any;
+}
+declare const DialogStep: React.FC<DialogStepProps>;
+interface DialogBodyProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const DialogBody: React.FC<DialogBodyProps>;
+
+export { Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger };

package/dist/dialog/index.d.ts

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { D as DirectionType } from '../commonTypes-ko_NGEoT.js';
+
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: {
+    ({ ...props }: DialogPrimitive.DialogPortalProps): React.JSX.Element;
+    displayName: string | undefined;
+};
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    persist?: boolean | undefined;
+    hideCloseButton?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DialogCarouselContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    hideCloseButton?: boolean | undefined;
+    hidePrevButton?: boolean | undefined;
+    persist?: boolean | undefined;
+    onPrev?: (() => void) | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+interface DialogCarouselProps {
+    children: React.ReactNode;
+    stepsApi?: any;
+    stepsRef?: any;
+    direction?: DirectionType;
+}
+declare const DialogCarousel: React.FC<DialogCarouselProps>;
+interface DialogStepsProps {
+    currentStep: string;
+    visibleStepRef: React.RefObject<HTMLDivElement>;
+    children: React.ReactNode;
+}
+declare const DialogSteps: React.FC<DialogStepsProps>;
+interface DialogStepProps {
+    id: string;
+    children: React.ReactNode;
+    className?: string;
+    stepRef?: any;
+}
+declare const DialogStep: React.FC<DialogStepProps>;
+interface DialogBodyProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const DialogBody: React.FC<DialogBodyProps>;
+
+export { Dialog, DialogBody, DialogCarousel, DialogCarouselContent, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPortal, DialogStep, DialogSteps, DialogTitle, DialogTrigger };

package/dist/dialog/index.js

@@ -0,0 +1,369 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// elements/dialog/index.ts
+var dialog_exports = {};
+__export(dialog_exports, {
+  Dialog: () => Dialog,
+  DialogBody: () => DialogBody,
+  DialogCarousel: () => DialogCarousel,
+  DialogCarouselContent: () => DialogCarouselContent,
+  DialogContent: () => DialogContent,
+  DialogDescription: () => DialogDescription,
+  DialogFooter: () => DialogFooter,
+  DialogHeader: () => DialogHeader,
+  DialogPortal: () => DialogPortal,
+  DialogStep: () => DialogStep,
+  DialogSteps: () => DialogSteps,
+  DialogTitle: () => DialogTitle,
+  DialogTrigger: () => DialogTrigger
+});
+module.exports = __toCommonJS(dialog_exports);
+
+// elements/dialog/Dialog.tsx
+var React = __toESM(require("react"));
+var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"));
+
+// util/index.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// elements/dialog/Dialog.tsx
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = ({ ...props }) => /* @__PURE__ */ React.createElement(DialogPrimitive.Portal, { ...props });
+var DialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+var DialogContent = React.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React.createElement(DialogPortal, null, /* @__PURE__ */ React.createElement(DialogOverlay, null), /* @__PURE__ */ React.createElement(
+  DialogPrimitive.Content,
+  {
+    onPointerDownOutside: (e) => {
+      if (persist) {
+        e.preventDefault();
+      }
+    },
+    ref,
+    className: cn(
+      "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full",
+      className
+    ),
+    ...props
+  },
+  children,
+  !hideCloseButton && /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Close,
+    {
+      className: cn(
+        "hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
+        props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
+      )
+    },
+    /* @__PURE__ */ React.createElement(
+      "svg",
+      {
+        "aria-label": "Close Icon",
+        "aria-hidden": "true",
+        className: "hawa-h-5 hawa-w-5",
+        fill: "currentColor",
+        viewBox: "0 0 20 20"
+      },
+      /* @__PURE__ */ React.createElement(
+        "path",
+        {
+          fillRule: "evenodd",
+          d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+          clipRule: "evenodd"
+        }
+      )
+    ),
+    /* @__PURE__ */ React.createElement("span", { className: "hawa-sr-only" }, "Close")
+  )
+)));
+var DialogCarouselContent = React.forwardRef(
+  ({
+    className,
+    children,
+    onPrev,
+    persist,
+    hideCloseButton,
+    hidePrevButton,
+    ...props
+  }, ref) => /* @__PURE__ */ React.createElement(DialogPortal, null, /* @__PURE__ */ React.createElement(DialogOverlay, null), /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Content,
+    {
+      onPointerDownOutside: (e) => {
+        if (persist) {
+          e.preventDefault();
+        }
+      },
+      ref,
+      className: cn(
+        "hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-pt-14 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full",
+        className
+      ),
+      ...props
+    },
+    children,
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: cn(
+          "hawa-absolute hawa-top-0 hawa-flex hawa-w-full hawa-flex-row hawa-p-4",
+          onPrev ? "hawa-justify-between" : "hawa-justify-end"
+        )
+      },
+      hidePrevButton ? /* @__PURE__ */ React.createElement("div", null) : /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          onClick: onPrev,
+          className: cn(
+            "hawa-end-0 hawa-cursor-pointer hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground",
+            props.dir === "rtl" && "hawa-rotate-180"
+          )
+        },
+        /* @__PURE__ */ React.createElement(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "24",
+            height: "24",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            className: "hawa-h-6 hawa-w-6",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          },
+          /* @__PURE__ */ React.createElement("path", { d: "m15 18-6-6 6-6" })
+        )
+      ),
+      !hideCloseButton && /* @__PURE__ */ React.createElement(
+        DialogPrimitive.Close,
+        {
+          className: cn(
+            "hawa-end-0 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground ",
+            props.dir === "rtl" ? " hawa-left-4" : " hawa-right-4"
+          )
+        },
+        /* @__PURE__ */ React.createElement(
+          "svg",
+          {
+            "aria-label": "Close Icon",
+            "aria-hidden": "true",
+            className: "hawa-h-6 hawa-w-6",
+            fill: "currentColor",
+            viewBox: "0 0 20 20"
+          },
+          /* @__PURE__ */ React.createElement(
+            "path",
+            {
+              fillRule: "evenodd",
+              d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+              clipRule: "evenodd"
+            }
+          )
+        ),
+        /* @__PURE__ */ React.createElement("span", { className: "hawa-sr-only" }, "Close")
+      )
+    )
+  ))
+);
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    className: cn(
+      "hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-text-center sm:hawa-text-left",
+      className
+    ),
+    ...props
+  }
+);
+var DialogTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "hawa-text-start hawa-text-lg hawa-font-semibold hawa-leading-none hawa-tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+var DialogDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn(
+      "hawa-text-start hawa-text-sm hawa-text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    className: cn(
+      "hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-gap-2",
+      className
+    ),
+    ...props
+  }
+);
+var DialogCarousel = ({
+  stepsApi,
+  stepsRef,
+  children,
+  direction
+}) => {
+  React.useEffect(() => {
+    if (stepsApi) {
+      stepsApi.reInit();
+    }
+  }, [stepsApi, children]);
+  return /* @__PURE__ */ React.createElement("div", { className: "hawa-overflow-hidden" }, /* @__PURE__ */ React.createElement("div", { ref: stepsRef, dir: direction }, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: "hawa-flex",
+      style: {
+        transition: "height 0.2s"
+      }
+    },
+    React.Children.map(children, (child, index) => /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: cn(
+          "hawa-flex hawa-h-fit hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center"
+        ),
+        key: index
+      },
+      child
+    ))
+  )));
+};
+var DialogSteps = ({
+  currentStep,
+  visibleStepRef,
+  children
+}) => {
+  const [dialogHeight, setDialogHeight] = React.useState(null);
+  React.useEffect(() => {
+    if (visibleStepRef.current) {
+      setDialogHeight(visibleStepRef.current.offsetHeight);
+      console.log("height is ", visibleStepRef.current.offsetHeight);
+    }
+  }, [currentStep, visibleStepRef]);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: "hawa-relative hawa-overflow-clip",
+      style: {
+        height: dialogHeight || "fit-content",
+        transition: "height 0.2s"
+      }
+    },
+    React.Children.map(children, (child, index) => /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref: currentStep === `step-${index + 1}` ? visibleStepRef : null,
+        className: cn(
+          currentStep === `step-${index + 1}` ? "hawa-visible hawa-block" : "hawa-invisible hawa-hidden"
+        )
+      },
+      child
+    ))
+  );
+};
+var DialogStep = ({
+  id,
+  children,
+  className,
+  stepRef
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      id,
+      ref: stepRef,
+      className: cn("hawa-w-full  hawa-px-1", className)
+    },
+    children
+  );
+};
+var DialogBody = ({ children, className }) => {
+  return /* @__PURE__ */ React.createElement("div", { className: cn("hawa-py-6", className) }, children);
+};
+DialogBody.displayName = "DialogBody";
+DialogStep.displayName = "DialogStep";
+DialogSteps.displayName = "DialogSteps";
+DialogCarousel.displayName = "DialogCarousel";
+DialogCarouselContent.displayName = "DialogCarouselContent";
+DialogHeader.displayName = "DialogHeader";
+DialogFooter.displayName = "DialogFooter";
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+DialogPortal.displayName = DialogPrimitive.Portal.displayName;
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Dialog,
+  DialogBody,
+  DialogCarousel,
+  DialogCarouselContent,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogPortal,
+  DialogStep,
+  DialogSteps,
+  DialogTitle,
+  DialogTrigger
+});
+//# sourceMappingURL=index.js.map