@sikka/hawa 0.1.59 → 0.1.61

package/dist/index.js

@@ -277,6 +277,27 @@ __export(src_exports, {
     CreditCardForm: function() {
         return CreditCardForm;
     },
+    Dialog: function() {
+        return Dialog;
+    },
+    DialogContent: function() {
+        return DialogContent;
+    },
+    DialogDescription: function() {
+        return DialogDescription;
+    },
+    DialogFooter: function() {
+        return DialogFooter;
+    },
+    DialogHeader: function() {
+        return DialogHeader;
+    },
+    DialogTitle: function() {
+        return DialogTitle;
+    },
+    DialogTrigger: function() {
+        return DialogTrigger;
+    },
     DragDropImages: function() {
         return DragDropImages;
     },
@@ -1234,11 +1255,13 @@ var Button = React16.forwardRef(function(_param, ref) {
 Button.displayName = "Button";
 // src/elements/HawaAlert.tsx
 var HawaAlert = function(_param) {
-    var _param_variant = _param.variant, variant = _param_variant === void 0 ? "normal" : _param_variant, _param_direction = _param.direction, direction = _param_direction === void 0 ? "ltr" : _param_direction, duration = _param.duration, icon = _param.icon, props = _object_without_properties(_param, [
+    var _param_variant = _param.variant, variant = _param_variant === void 0 ? "normal" : _param_variant, _param_direction = _param.direction, direction = _param_direction === void 0 ? "ltr" : _param_direction, _param_severity = _param.severity, severity = _param_severity === void 0 ? "info" : _param_severity, duration = _param.duration, icon = _param.icon, className = _param.className, props = _object_without_properties(_param, [
         "variant",
         "direction",
+        "severity",
         "duration",
-        "icon"
+        "icon",
+        "className"
     ]);
     var alertRef = (0, import_react13.useRef)(null);
     var _ref = _sliced_to_array((0, import_react13.useState)(false), 2), closed = _ref[0], setClosed = _ref[1];
@@ -1306,7 +1329,7 @@ var HawaAlert = function(_param) {
     return /* @__PURE__ */ import_react13.default.createElement("div", {
         ref: alertRef
     }, /* @__PURE__ */ import_react13.default.createElement("div", {
-        className: (0, import_clsx7.default)("relative mb-4 flex flex-col rounded p-4 text-sm transition-all", styleVariant[variant][props.severity], closed ? "opacity-0" : "opacity-100"),
+        className: (0, import_clsx7.default)("relative mb-4 flex flex-col rounded p-4 text-sm transition-all", styleVariant[variant][severity], closed ? "opacity-0" : "opacity-100", className),
         role: "alert",
         dir: direction
     }, /* @__PURE__ */ import_react13.default.createElement("div", {
@@ -1317,7 +1340,7 @@ var HawaAlert = function(_param) {
         className: "flex flex-col"
     }, /* @__PURE__ */ import_react13.default.createElement("span", {
         className: (0, import_clsx7.default)("font-medium", direction === "rtl" ? "ml-8" : "mr-8")
-    }, props.title), /* @__PURE__ */ import_react13.default.createElement("span", null, " " + props.text), props.actions && /* @__PURE__ */ import_react13.default.createElement("div", {
+    }, props.title), /* @__PURE__ */ import_react13.default.createElement("span", null, props.text), props.actions && /* @__PURE__ */ import_react13.default.createElement("div", {
         className: "mt-2 flex flex-row gap-2"
     }, props.actions.map(function(act, index) {
         return /* @__PURE__ */ import_react13.default.createElement(Button, {
@@ -1327,7 +1350,7 @@ var HawaAlert = function(_param) {
         }, act.label);
     })))), !props.persistant && /* @__PURE__ */ import_react13.default.createElement("button", {
         type: "button",
-        className: (0, import_clsx7.default)("absolute  top-2 inline-flex h-9 w-9 items-center justify-center rounded-inner p-1.5 text-gray-400 transition-all  hover:text-gray-900", closeButtonStyle[props.severity], direction === "rtl" ? "left-2" : "right-2"),
+        className: (0, import_clsx7.default)("absolute  top-2 inline-flex h-9 w-9 items-center justify-center rounded-inner p-1.5 text-gray-400 transition-all  hover:text-gray-900", closeButtonStyle[severity], direction === "rtl" ? "left-2" : "right-2"),
         "data-dismiss-target": "#alert-default",
         "aria-label": "Close",
         onClick: function() {
@@ -6172,124 +6195,8 @@ var HawaPinInput = function(_param) {
     }));
 };
 // src/elements/HawaItemCard.tsx
-var import_react47 = __toESM(require("react"));
-var import_clsx23 = __toESM(require("clsx"));
-// src/elements/HawaButton.tsx
 var import_react46 = __toESM(require("react"));
 var import_clsx22 = __toESM(require("clsx"));
-var disabledSyles = "cursor-default pointer-events-none";
-var disabledVariantSyles = {
-    contained: "text-gray-300 bg-gray-100",
-    outlined: "text-gray-300 border-gray-300"
-};
-var baseStyles = "cursor-pointer  justify-center items-center text-center font-medium transition-all ";
-var sizeStyles = {
-    icon: "h-10 w-10",
-    xs: "px-1.5 py-2 text-[9px] h-fit",
-    small: "text-xs px-2.5 py-1.5",
-    medium: "text-sm leading-4 px-3 py-2",
-    default: "h-10 px-4 py-2",
-    large: "text-sm px-4 py-2",
-    noPadding: "p-0",
-    full: "h-full max-h-full p-2"
-};
-var widthStyles = {
-    full: "w-full flex justify-center px-5 py-2.5 text-center inline-flex items-center",
-    half: "w-full text-center flex items-center justify-center h-full",
-    normal: "w-fit dark:bg-buttonPrimary-dark dark:hover:bg-buttonPrimary-700 dark:hover:brightness-90 dark:focus:ring-buttonPrimary-500"
-};
-var containerWidthStyles = {
-    full: "w-full flex justify-center text-center inline-flex items-center",
-    half: "w-1/2",
-    normal: "w-fit"
-};
-var variantStyles = {
-    contained: "border-transparent",
-    // outlined: "bg-transparent border",
-    outlined: "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
-};
-var colorStyles = {
-    contained: {
-        default: "text-neutral-900 bg-buttonPrimary-500 hover:bg-buttonPrimary-700 bg-buttonPrimary-500 text-white",
-        primary: "text-white bg-buttonPrimary-500 hover:bg-buttonPrimary-700 transition-all",
-        secondary: "bg-buttonSecondary-500 hover:text-white hover:bg-buttonSecondary-700",
-        gray: "text-neutral-900 bg-gray-200 hover:bg-gray-300",
-        dark: "text-neutral-900 bg-gray-200 hover:bg-gray-300"
-    },
-    outlined: {
-        default: "text-gray-600 border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800 dark:text-white",
-        primary: "text-black hover:bg-gray-50  dark:text-white",
-        secondary: " dark:text-white text-secondary-800 border-secondary-800 hover:bg-buttonSecondary-700 hover:text-white",
-        gray: "border-gray-300 hover:bg-gray-200",
-        dark: "border-gray-900 hover:bg-gray-700"
-    }
-};
-var HawaButton = function(_param) {
-    var className = _param.className, _param_variant = _param.variant, variant = _param_variant === void 0 ? "contained" : _param_variant, _param_color = _param.color, color = _param_color === void 0 ? "default" : _param_color, _param_size = _param.size, size = _param_size === void 0 ? "default" : _param_size, _param_width = _param.width, width = _param_width === void 0 ? "normal" : _param_width, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_isLoading = _param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, tooltip = _param.tooltip, _param_tooltipSize = _param.tooltipSize, tooltipSize = _param_tooltipSize === void 0 ? "normal" : _param_tooltipSize, _param_tooltipPosition = _param.tooltipPosition, tooltipPosition = _param_tooltipPosition === void 0 ? "top-left" : _param_tooltipPosition, _param_tooltipDirection = _param.tooltipDirection, tooltipDirection = _param_tooltipDirection === void 0 ? "ltr" : _param_tooltipDirection, _param_margins = _param.margins, margins = _param_margins === void 0 ? "2" : _param_margins, children = _param.children, badge = _param.badge, _param_edgeCorner = _param.edgeCorner, edgeCorner = _param_edgeCorner === void 0 ? false : _param_edgeCorner, feedback = _param.feedback, props = _object_without_properties(_param, [
-        "className",
-        "variant",
-        "color",
-        "size",
-        "width",
-        "disabled",
-        "isLoading",
-        "tooltip",
-        "tooltipSize",
-        "tooltipPosition",
-        "tooltipDirection",
-        "margins",
-        "children",
-        "badge",
-        "edgeCorner",
-        "feedback"
-    ]);
-    var _ref = _sliced_to_array((0, import_react46.useState)(false), 2), isClicked = _ref[0], setIsClicked = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react46.useState)(children), 2), buttonText = _ref1[0], setButtonText = _ref1[1];
-    var handleClick = function(event) {
-        if (props.onClick) {
-            props.onClick(event);
-        }
-        if (feedback && !isClicked) {
-            setButtonText(feedback);
-            setIsClicked(true);
-            setTimeout(function() {
-                setButtonText(children);
-                setIsClicked(false);
-            }, 2e3);
-        }
-    };
-    return /* @__PURE__ */ import_react46.default.createElement("div", {
-        className: (0, import_clsx22.default)("relative", margins !== "none" ? "my-".concat(margins) : "m-0", containerWidthStyles[width])
-    }, tooltip ? /* @__PURE__ */ import_react46.default.createElement(HawaTooltip, {
-        direction: tooltipDirection,
-        position: tooltipPosition,
-        size: tooltipSize,
-        content: tooltip
-    }, /* @__PURE__ */ import_react46.default.createElement("button", {
-        className: disabled ? (0, import_clsx22.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], widthStyles[width], disabledSyles, disabledVariantSyles[variant]) : (0, import_clsx22.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], colorStyles[variant][color], widthStyles[width]),
-        disabled: disabled,
-        onClick: props.onClick
-    }, !isLoading ? children : /* @__PURE__ */ import_react46.default.createElement(HawaLoading, {
-        size: "button"
-    }))) : /* @__PURE__ */ import_react46.default.createElement("button", {
-        className: disabled ? (0, import_clsx22.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], widthStyles[width], disabledSyles, disabledVariantSyles[variant]) : (0, import_clsx22.default)(className, "overflow-x-clip", baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], colorStyles[variant][color], widthStyles[width]),
-        disabled: disabled,
-        onClick: handleClick
-    }, !isLoading ? /* @__PURE__ */ import_react46.default.createElement("div", {
-        className: (0, import_clsx22.default)(" s flex flex-col-reverse items-start justify-center gap-4 transition-all", isClicked && feedback ? " -translate-y-8 pb-1 pt-1" : "translate-y-0")
-    }, isClicked && feedback ? /* @__PURE__ */ import_react46.default.createElement("div", {
-        className: "w-full  text-center"
-    }, buttonText) : null, /* @__PURE__ */ import_react46.default.createElement("div", {
-        className: "flex w-full select-none flex-row items-center justify-center gap-2 whitespace-nowrap"
-    }, props.startIcon && props.startIcon, children, props.endIcon && props.endIcon)) : /* @__PURE__ */ import_react46.default.createElement(HawaLoading, {
-        design: "dots-pulse",
-        color: "bg-white",
-        size: "button"
-    })), badge && /* @__PURE__ */ import_react46.default.createElement("div", {
-        className: (0, import_clsx22.default)(typeof badge === "boolean" ? "h-5 w-5" : typeof badge === "string" ? "h-5 w-7" : "h-6 w-6", "absolute -right-2 -top-2 inline-flex select-none  items-center justify-center rounded-full border-2 border-white bg-red-500 text-[9px] font-bold text-white dark:border-gray-900")
-    }, typeof badge === "number" && badge > 100 ? "+99" : badge));
-};
-// src/elements/HawaItemCard.tsx
 var HawaItemCard = function(_param) {
     var handleOpenActionHeader = function handleOpenActionHeader() {
         setOpenActionHeader(!openActionHeader);
@@ -6319,8 +6226,8 @@ var HawaItemCard = function(_param) {
         "h-full w-48 rounded-l object-cover"
     };
     var headerActionsButtonStyle = "inline-block rounded p-1 text-sm text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-700";
-    var _ref = _sliced_to_array((0, import_react47.useState)(false), 2), openActionHeader = _ref[0], setOpenActionHeader = _ref[1];
-    (0, import_react47.useEffect)(function() {
+    var _ref = _sliced_to_array((0, import_react46.useState)(false), 2), openActionHeader = _ref[0], setOpenActionHeader = _ref[1];
+    (0, import_react46.useEffect)(function() {
         window.onclick = function() {
             if (openActionHeader) {
                 setOpenActionHeader(false);
@@ -6332,49 +6239,49 @@ var HawaItemCard = function(_param) {
     }, [
         openActionHeader
     ]);
-    return /* @__PURE__ */ import_react47.default.createElement("div", _object_spread({
-        className: (0, import_clsx23.default)(defaultStyle, orientationStyles[orientation])
-    }, props), cardImage && /* @__PURE__ */ import_react47.default.createElement("div", {
+    return /* @__PURE__ */ import_react46.default.createElement("div", _object_spread({
+        className: (0, import_clsx22.default)(defaultStyle, orientationStyles[orientation])
+    }, props), cardImage && /* @__PURE__ */ import_react46.default.createElement("div", {
         className: "group relative overflow-clip"
-    }, /* @__PURE__ */ import_react47.default.createElement("img", {
+    }, /* @__PURE__ */ import_react46.default.createElement("img", {
         src: "https://via.placeholder.com/50",
-        className: (0, import_clsx23.default)(imageStyles[orientation], clickableImage ? "overflow-clip transition-all group-hover:blur-lg" : "")
-    }), clickableImage && /* @__PURE__ */ import_react47.default.createElement("div", {
+        className: (0, import_clsx22.default)(imageStyles[orientation], clickableImage ? "overflow-clip transition-all group-hover:blur-lg" : "")
+    }), clickableImage && /* @__PURE__ */ import_react46.default.createElement("div", {
         className: "absolute left-0 top-0 flex h-full w-full items-center  justify-center opacity-0 transition-all group-hover:opacity-100 "
-    }, /* @__PURE__ */ import_react47.default.createElement(HawaButton, {
-        startIcon: clickableImageActionIcon,
-        variant: "outlined",
-        onClick: clickableImageAction
-    }, clickableImageActionText))), /* @__PURE__ */ import_react47.default.createElement("div", {
+    }, /* @__PURE__ */ import_react46.default.createElement(Button, {
+        variant: "secondary",
+        onClick: clickableImageAction,
+        className: "flex flex-row gap-2"
+    }, clickableImageActionIcon, clickableImageActionText))), /* @__PURE__ */ import_react46.default.createElement("div", {
         className: "relative w-full p-6"
-    }, headerActions && /* @__PURE__ */ import_react47.default.createElement("div", {
+    }, headerActions && /* @__PURE__ */ import_react46.default.createElement("div", {
         className: "max-h- bg-red absolute right-0 top-0 flex justify-end pr-3 pt-3"
-    }, /* @__PURE__ */ import_react47.default.createElement(HawaMenu, {
-        position: "top-right",
-        menuItems: headerActions
-    }, /* @__PURE__ */ import_react47.default.createElement("div", {
-        className: (0, import_clsx23.default)(headerActionsButtonStyle),
-        onClick: handleOpenActionHeader
-    }, /* @__PURE__ */ import_react47.default.createElement("span", {
-        className: "sr-only"
-    }, "Open dropdown"), /* @__PURE__ */ import_react47.default.createElement("svg", {
-        className: "h-6 w-6",
-        "aria-hidden": "true",
-        fill: "currentColor",
-        viewBox: "0 0 20 20"
-    }, /* @__PURE__ */ import_react47.default.createElement("path", {
-        d: "M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z"
-    }))))), header && /* @__PURE__ */ import_react47.default.createElement("h5", {
+    }, /* @__PURE__ */ import_react46.default.createElement(DropdownMenu, {
+        items: headerActions,
+        trigger: /* @__PURE__ */ import_react46.default.createElement("div", {
+            className: (0, import_clsx22.default)(headerActionsButtonStyle),
+            onClick: handleOpenActionHeader
+        }, /* @__PURE__ */ import_react46.default.createElement("span", {
+            className: "sr-only"
+        }, "Open dropdown"), /* @__PURE__ */ import_react46.default.createElement("svg", {
+            className: "h-6 w-6",
+            "aria-hidden": "true",
+            fill: "currentColor",
+            viewBox: "0 0 20 20"
+        }, /* @__PURE__ */ import_react46.default.createElement("path", {
+            d: "M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z"
+        })))
+    })), header && /* @__PURE__ */ import_react46.default.createElement("h5", {
         className: "mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white"
-    }, header), content && /* @__PURE__ */ import_react47.default.createElement("span", {
+    }, header), content && /* @__PURE__ */ import_react46.default.createElement("span", {
         className: "w-full font-normal text-gray-700 dark:text-gray-400"
-    }, content), actions || counts ? /* @__PURE__ */ import_react47.default.createElement("div", {
-        className: (0, import_clsx23.default)("mt-3 flex items-center rounded-b-lg dark:text-white ", actions && counts ? "justify-between" : "justify-end")
+    }, content), actions || counts ? /* @__PURE__ */ import_react46.default.createElement("div", {
+        className: (0, import_clsx22.default)("mt-3 flex items-center rounded-b-lg dark:text-white ", actions && counts ? "justify-between" : "justify-end")
     }, counts, actions) : null));
 };
 // src/elements/HawaPricingCard.tsx
-var import_clsx24 = __toESM(require("clsx"));
-var import_react48 = __toESM(require("react"));
+var import_clsx23 = __toESM(require("clsx"));
+var import_react47 = __toESM(require("react"));
 var HawaPricingCard = function(_param) {
     var _param_size = _param.size, size = _param_size === void 0 ? "medium" : _param_size, _param_direction = _param.direction, direction = _param_direction === void 0 ? "ltr" : _param_direction, _param_currentPlan = _param.currentPlan, currentPlan = _param_currentPlan === void 0 ? false : _param_currentPlan, props = _object_without_properties(_param, [
         "size",
@@ -6388,50 +6295,50 @@ var HawaPricingCard = function(_param) {
         medium: "mx-1 w-full rounded min-w-fit border dark:border-gray-700 bg-background ",
         large: "mx-1 w-full max-w-lg rounded border dark:border-gray-700 bg-background "
     };
-    return /* @__PURE__ */ import_react48.default.createElement("div", {
+    return /* @__PURE__ */ import_react47.default.createElement("div", {
         dir: isArabic ? "rtl" : "ltr",
-        className: (0, import_clsx24.default)(currentPlan ? "border-primary" : "bg-background", cardSizes[size], "flex flex-col gap-4 rounded border-2 p-4")
-    }, /* @__PURE__ */ import_react48.default.createElement("h5", {
+        className: (0, import_clsx23.default)(currentPlan ? "border-primary" : "bg-background", cardSizes[size], "flex flex-col gap-4 rounded border-2 p-4")
+    }, /* @__PURE__ */ import_react47.default.createElement("h5", {
         className: "text-md 0 font-bold text-primary/70"
-    }, props.texts.title), /* @__PURE__ */ import_react48.default.createElement("div", {
+    }, props.texts.title), /* @__PURE__ */ import_react47.default.createElement("div", {
         className: " text-primary/ flex  items-baseline"
-    }, /* @__PURE__ */ import_react48.default.createElement(import_react48.default.Fragment, null, /* @__PURE__ */ import_react48.default.createElement("span", {
+    }, /* @__PURE__ */ import_react47.default.createElement(import_react47.default.Fragment, null, /* @__PURE__ */ import_react47.default.createElement("span", {
         className: "text-5xl font-extrabold tracking-tight"
-    }, props.price), /* @__PURE__ */ import_react48.default.createElement("span", {
+    }, props.price), /* @__PURE__ */ import_react47.default.createElement("span", {
         className: "mx-1 text-sm font-semibold"
-    }, props.texts.currencyText)), /* @__PURE__ */ import_react48.default.createElement("span", {
+    }, props.texts.currencyText)), /* @__PURE__ */ import_react47.default.createElement("span", {
         className: "ml-1 text-xl font-normal text-primary/70"
-    }, "/ ", props.texts.cycleText)), /* @__PURE__ */ import_react48.default.createElement("h5", {
+    }, "/ ", props.texts.cycleText)), /* @__PURE__ */ import_react47.default.createElement("h5", {
         className: "text-md  font-normal text-primary/70"
-    }, props.texts.subtitle), props.features && /* @__PURE__ */ import_react48.default.createElement("ul", {
+    }, props.texts.subtitle), props.features && /* @__PURE__ */ import_react47.default.createElement("ul", {
         role: "list",
         className: "space-y-0 "
     }, (_props_features = props.features) === null || _props_features === void 0 ? void 0 : _props_features.map(function(feature, o) {
-        return /* @__PURE__ */ import_react48.default.createElement("li", {
+        return /* @__PURE__ */ import_react47.default.createElement("li", {
             key: o,
             className: "flex "
-        }, /* @__PURE__ */ import_react48.default.createElement("svg", {
+        }, /* @__PURE__ */ import_react47.default.createElement("svg", {
             "aria-label": "Check Icon",
             "aria-hidden": "true",
             className: "m-2 h-5 w-5 flex-shrink-0 text-primary",
             fill: "currentColor",
             viewBox: "0 0 20 20"
-        }, /* @__PURE__ */ import_react48.default.createElement("path", {
+        }, /* @__PURE__ */ import_react47.default.createElement("path", {
             fillRule: "evenodd",
             d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
             clipRule: "evenodd"
-        })), /* @__PURE__ */ import_react48.default.createElement("span", {
+        })), /* @__PURE__ */ import_react47.default.createElement("span", {
             className: "flex items-center  text-center font-normal leading-tight text-primary/70 "
         }, feature.text));
-    })), /* @__PURE__ */ import_react48.default.createElement(Button, {
+    })), /* @__PURE__ */ import_react47.default.createElement(Button, {
         onClick: props.onPlanClicked,
         disabled: currentPlan,
         className: "w-full"
     }, props.texts.buttonText));
 };
 // src/elements/HawaAdCard.tsx
-var import_clsx25 = __toESM(require("clsx"));
-var import_react49 = __toESM(require("react"));
+var import_clsx24 = __toESM(require("clsx"));
+var import_react48 = __toESM(require("react"));
 var HawaAdCard = function(_param) {
     var orientation = _param.orientation, props = _object_without_properties(_param, [
         "orientation"
@@ -6444,27 +6351,27 @@ var HawaAdCard = function(_param) {
         horizontal: "w-auto h-full bg-blue-500  rounded-inner",
         vertical: "bg-blue-500 rounded-inner w-auto "
     };
-    return /* @__PURE__ */ import_react49.default.createElement("div", _object_spread({
-        className: (0, import_clsx25.default)(cardStyles[orientation], "dark:text-white")
-    }, props), /* @__PURE__ */ import_react49.default.createElement("div", {
+    return /* @__PURE__ */ import_react48.default.createElement("div", _object_spread({
+        className: (0, import_clsx24.default)(cardStyles[orientation], "dark:text-white")
+    }, props), /* @__PURE__ */ import_react48.default.createElement("div", {
         className: "flex aspect-square w-full  max-w-fit  items-start "
-    }, /* @__PURE__ */ import_react49.default.createElement("img", {
+    }, /* @__PURE__ */ import_react48.default.createElement("img", {
         src: props.imageURL ? props.imageURL : "https://via.placeholder.com/50",
         className: imageStyles[orientation]
-    })), /* @__PURE__ */ import_react49.default.createElement("div", {
+    })), /* @__PURE__ */ import_react48.default.createElement("div", {
         className: "w-full text-xs"
-    }, /* @__PURE__ */ import_react49.default.createElement("div", {
+    }, /* @__PURE__ */ import_react48.default.createElement("div", {
         className: "font-bold"
-    }, props.title), /* @__PURE__ */ import_react49.default.createElement("div", {
+    }, props.title), /* @__PURE__ */ import_react48.default.createElement("div", {
         className: "text-[12px]"
-    }, props.description)), /* @__PURE__ */ import_react49.default.createElement("span", {
+    }, props.description)), /* @__PURE__ */ import_react48.default.createElement("span", {
         onClick: props.handleHide,
         className: "absolute right-0 top-0 h-fit cursor-pointer select-none rounded-bl-lg rounded-tr-lg bg-blue-100 px-2.5 py-0.5 text-[10px] font-semibold text-blue-800 dark:bg-blue-200 dark:text-blue-800"
     }, "Hide"));
 };
 // src/elements/HawaLandingCard.tsx
-var import_clsx26 = __toESM(require("clsx"));
-var import_react50 = __toESM(require("react"));
+var import_clsx25 = __toESM(require("clsx"));
+var import_react49 = __toESM(require("react"));
 var HawaLandingCard = function(_param) {
     var _param_orientation = _param.orientation, orientation = _param_orientation === void 0 ? "horizontal" : _param_orientation, props = _object_without_properties(_param, [
         "orientation"
@@ -6478,21 +6385,136 @@ var HawaLandingCard = function(_param) {
         horizontal: "w-8 h-8 rounded",
         vertical: "w-14 h-14 rounded"
     };
-    return /* @__PURE__ */ import_react50.default.createElement("div", _object_spread({
-        className: (0, import_clsx26.default)(cardStyles[orientation], "flex flex-col p-10", "relative overflow-hidden dark:text-white", props.className)
-    }, props), ((_props_texts = props.texts) === null || _props_texts === void 0 ? void 0 : _props_texts.titleTip) && /* @__PURE__ */ import_react50.default.createElement("div", {
+    return /* @__PURE__ */ import_react49.default.createElement("div", _object_spread({
+        className: (0, import_clsx25.default)(cardStyles[orientation], "flex flex-col p-10", "relative overflow-hidden dark:text-white", props.className)
+    }, props), ((_props_texts = props.texts) === null || _props_texts === void 0 ? void 0 : _props_texts.titleTip) && /* @__PURE__ */ import_react49.default.createElement("div", {
         className: "text-sm text-red-600"
-    }, (_props_texts1 = props.texts) === null || _props_texts1 === void 0 ? void 0 : _props_texts1.titleTip), props.imageURL && /* @__PURE__ */ import_react50.default.createElement("img", {
+    }, (_props_texts1 = props.texts) === null || _props_texts1 === void 0 ? void 0 : _props_texts1.titleTip), props.imageURL && /* @__PURE__ */ import_react49.default.createElement("img", {
         className: "absolute -bottom-10 -right-10 h-40 w-auto ",
         src: props.imageURL
-    }), ((_props_texts2 = props.texts) === null || _props_texts2 === void 0 ? void 0 : _props_texts2.title) && /* @__PURE__ */ import_react50.default.createElement("div", {
+    }), ((_props_texts2 = props.texts) === null || _props_texts2 === void 0 ? void 0 : _props_texts2.title) && /* @__PURE__ */ import_react49.default.createElement("div", {
         className: "mt-2 text-lg font-medium"
-    }, (_props_texts3 = props.texts) === null || _props_texts3 === void 0 ? void 0 : _props_texts3.title, " "), ((_props_texts4 = props.texts) === null || _props_texts4 === void 0 ? void 0 : _props_texts4.description) && /* @__PURE__ */ import_react50.default.createElement("div", {
+    }, (_props_texts3 = props.texts) === null || _props_texts3 === void 0 ? void 0 : _props_texts3.title, " "), ((_props_texts4 = props.texts) === null || _props_texts4 === void 0 ? void 0 : _props_texts4.description) && /* @__PURE__ */ import_react49.default.createElement("div", {
         className: "z-10 mt-4 text-sm"
-    }, (_props_texts5 = props.texts) === null || _props_texts5 === void 0 ? void 0 : _props_texts5.description), ((_props_texts6 = props.texts) === null || _props_texts6 === void 0 ? void 0 : _props_texts6.linkText) && /* @__PURE__ */ import_react50.default.createElement("div", {
+    }, (_props_texts5 = props.texts) === null || _props_texts5 === void 0 ? void 0 : _props_texts5.description), ((_props_texts6 = props.texts) === null || _props_texts6 === void 0 ? void 0 : _props_texts6.linkText) && /* @__PURE__ */ import_react49.default.createElement("div", {
         className: "z-10 mt-6 text-sm underline underline-offset-8"
     }, (_props_texts7 = props.texts) === null || _props_texts7 === void 0 ? void 0 : _props_texts7.linkText));
 };
+// src/elements/HawaButton.tsx
+var import_react50 = __toESM(require("react"));
+var import_clsx26 = __toESM(require("clsx"));
+var disabledSyles = "cursor-default pointer-events-none";
+var disabledVariantSyles = {
+    contained: "text-gray-300 bg-gray-100",
+    outlined: "text-gray-300 border-gray-300"
+};
+var baseStyles = "cursor-pointer  justify-center items-center text-center font-medium transition-all ";
+var sizeStyles = {
+    icon: "h-10 w-10",
+    xs: "px-1.5 py-2 text-[9px] h-fit",
+    small: "text-xs px-2.5 py-1.5",
+    medium: "text-sm leading-4 px-3 py-2",
+    default: "h-10 px-4 py-2",
+    large: "text-sm px-4 py-2",
+    noPadding: "p-0",
+    full: "h-full max-h-full p-2"
+};
+var widthStyles = {
+    full: "w-full flex justify-center px-5 py-2.5 text-center inline-flex items-center",
+    half: "w-full text-center flex items-center justify-center h-full",
+    normal: "w-fit dark:bg-buttonPrimary-dark dark:hover:bg-buttonPrimary-700 dark:hover:brightness-90 dark:focus:ring-buttonPrimary-500"
+};
+var containerWidthStyles = {
+    full: "w-full flex justify-center text-center inline-flex items-center",
+    half: "w-1/2",
+    normal: "w-fit"
+};
+var variantStyles = {
+    contained: "border-transparent",
+    // outlined: "bg-transparent border",
+    outlined: "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
+};
+var colorStyles = {
+    contained: {
+        default: "text-neutral-900 bg-buttonPrimary-500 hover:bg-buttonPrimary-700 bg-buttonPrimary-500 text-white",
+        primary: "text-white bg-buttonPrimary-500 hover:bg-buttonPrimary-700 transition-all",
+        secondary: "bg-buttonSecondary-500 hover:text-white hover:bg-buttonSecondary-700",
+        gray: "text-neutral-900 bg-gray-200 hover:bg-gray-300",
+        dark: "text-neutral-900 bg-gray-200 hover:bg-gray-300"
+    },
+    outlined: {
+        default: "text-gray-600 border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800 dark:text-white",
+        primary: "text-black hover:bg-gray-50  dark:text-white",
+        secondary: " dark:text-white text-secondary-800 border-secondary-800 hover:bg-buttonSecondary-700 hover:text-white",
+        gray: "border-gray-300 hover:bg-gray-200",
+        dark: "border-gray-900 hover:bg-gray-700"
+    }
+};
+var HawaButton = function(_param) {
+    var className = _param.className, _param_variant = _param.variant, variant = _param_variant === void 0 ? "contained" : _param_variant, _param_color = _param.color, color = _param_color === void 0 ? "default" : _param_color, _param_size = _param.size, size = _param_size === void 0 ? "default" : _param_size, _param_width = _param.width, width = _param_width === void 0 ? "normal" : _param_width, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_isLoading = _param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, tooltip = _param.tooltip, _param_tooltipSize = _param.tooltipSize, tooltipSize = _param_tooltipSize === void 0 ? "normal" : _param_tooltipSize, _param_tooltipPosition = _param.tooltipPosition, tooltipPosition = _param_tooltipPosition === void 0 ? "top-left" : _param_tooltipPosition, _param_tooltipDirection = _param.tooltipDirection, tooltipDirection = _param_tooltipDirection === void 0 ? "ltr" : _param_tooltipDirection, _param_margins = _param.margins, margins = _param_margins === void 0 ? "2" : _param_margins, children = _param.children, badge = _param.badge, _param_edgeCorner = _param.edgeCorner, edgeCorner = _param_edgeCorner === void 0 ? false : _param_edgeCorner, feedback = _param.feedback, props = _object_without_properties(_param, [
+        "className",
+        "variant",
+        "color",
+        "size",
+        "width",
+        "disabled",
+        "isLoading",
+        "tooltip",
+        "tooltipSize",
+        "tooltipPosition",
+        "tooltipDirection",
+        "margins",
+        "children",
+        "badge",
+        "edgeCorner",
+        "feedback"
+    ]);
+    var _ref = _sliced_to_array((0, import_react50.useState)(false), 2), isClicked = _ref[0], setIsClicked = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react50.useState)(children), 2), buttonText = _ref1[0], setButtonText = _ref1[1];
+    var handleClick = function(event) {
+        if (props.onClick) {
+            props.onClick(event);
+        }
+        if (feedback && !isClicked) {
+            setButtonText(feedback);
+            setIsClicked(true);
+            setTimeout(function() {
+                setButtonText(children);
+                setIsClicked(false);
+            }, 2e3);
+        }
+    };
+    return /* @__PURE__ */ import_react50.default.createElement("div", {
+        className: (0, import_clsx26.default)("relative", margins !== "none" ? "my-".concat(margins) : "m-0", containerWidthStyles[width])
+    }, tooltip ? /* @__PURE__ */ import_react50.default.createElement(HawaTooltip, {
+        direction: tooltipDirection,
+        position: tooltipPosition,
+        size: tooltipSize,
+        content: tooltip
+    }, /* @__PURE__ */ import_react50.default.createElement("button", {
+        className: disabled ? (0, import_clsx26.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], widthStyles[width], disabledSyles, disabledVariantSyles[variant]) : (0, import_clsx26.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], colorStyles[variant][color], widthStyles[width]),
+        disabled: disabled,
+        onClick: props.onClick
+    }, !isLoading ? children : /* @__PURE__ */ import_react50.default.createElement(HawaLoading, {
+        size: "button"
+    }))) : /* @__PURE__ */ import_react50.default.createElement("button", {
+        className: disabled ? (0, import_clsx26.default)(className, baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], widthStyles[width], disabledSyles, disabledVariantSyles[variant]) : (0, import_clsx26.default)(className, "overflow-x-clip", baseStyles, edgeCorner ? "rounded-inner" : "rounded", variantStyles[variant], sizeStyles[size], colorStyles[variant][color], widthStyles[width]),
+        disabled: disabled,
+        onClick: handleClick
+    }, !isLoading ? /* @__PURE__ */ import_react50.default.createElement("div", {
+        className: (0, import_clsx26.default)(" s flex flex-col-reverse items-start justify-center gap-4 transition-all", isClicked && feedback ? " -translate-y-8 pb-1 pt-1" : "translate-y-0")
+    }, isClicked && feedback ? /* @__PURE__ */ import_react50.default.createElement("div", {
+        className: "w-full  text-center"
+    }, buttonText) : null, /* @__PURE__ */ import_react50.default.createElement("div", {
+        className: "flex w-full select-none flex-row items-center justify-center gap-2 whitespace-nowrap"
+    }, props.startIcon && props.startIcon, children, props.endIcon && props.endIcon)) : /* @__PURE__ */ import_react50.default.createElement(HawaLoading, {
+        design: "dots-pulse",
+        color: "bg-white",
+        size: "button"
+    })), badge && /* @__PURE__ */ import_react50.default.createElement("div", {
+        className: (0, import_clsx26.default)(typeof badge === "boolean" ? "h-5 w-5" : typeof badge === "string" ? "h-5 w-7" : "h-6 w-6", "absolute -right-2 -top-2 inline-flex select-none  items-center justify-center rounded-full border-2 border-white bg-red-500 text-[9px] font-bold text-white dark:border-gray-900")
+    }, typeof badge === "number" && badge > 100 ? "+99" : badge));
+};
 // src/elements/HawaStoreButtons.tsx
 var import_react51 = __toESM(require("react"));
 var HawaStoreButtons = function(props) {
@@ -7107,6 +7129,93 @@ function Toaster(props) {
         className: cn("gap-2", isRTL && "fixed left-0")
     }));
 }
+// src/elements/Dialog.tsx
+var React68 = __toESM(require("react"));
+var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"));
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = function(_param) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement(DialogPrimitive.Portal, _object_spread({
+        className: cn(className)
+    }, props));
+};
+DialogPortal.displayName = DialogPrimitive.Portal.displayName;
+var DialogOverlay = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement(DialogPrimitive.Overlay, _object_spread({
+        ref: ref,
+        className: cn("fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className)
+    }, props));
+});
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
+    var className = _param.className, children = _param.children, props = _object_without_properties(_param, [
+        "className",
+        "children"
+    ]);
+    return React68.createElement(DialogPortal, null, /* @__PURE__ */ React68.createElement(DialogOverlay, null), /* @__PURE__ */ React68.createElement(DialogPrimitive.Content, _object_spread({
+        ref: ref,
+        className: 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 md:w-full", className)
+    }, props), children, /* @__PURE__ */ React68.createElement(DialogPrimitive.Close, {
+        className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
+    }, /* @__PURE__ */ React68.createElement("svg", {
+        "aria-label": "Close Icon",
+        "aria-hidden": "true",
+        className: "h-5 w-5",
+        fill: "currentColor",
+        viewBox: "0 0 20 20"
+    }, /* @__PURE__ */ React68.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__ */ React68.createElement("span", {
+        className: "sr-only"
+    }, "Close"))));
+});
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = function(_param) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement("div", _object_spread({
+        className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className)
+    }, props));
+};
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = function(_param) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement("div", _object_spread({
+        className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)
+    }, props));
+};
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement(DialogPrimitive.Title, _object_spread({
+        ref: ref,
+        className: cn("text-lg font-semibold leading-none tracking-tight", className)
+    }, props));
+});
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    return React68.createElement(DialogPrimitive.Description, _object_spread({
+        ref: ref,
+        className: cn("text-sm text-muted-foreground", className)
+    }, props));
+});
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
 // src/layout/Box.tsx
 var import_react56 = __toESM(require("react"));
 var Box = function(props) {
@@ -7269,32 +7378,32 @@ var HawaSiteLayout = function(_param) {
 var import_react61 = __toESM(require("react"));
 var import_clsx28 = __toESM(require("clsx"));
 // src/layout/Sidebar.tsx
-var React73 = __toESM(require("react"));
+var React74 = __toESM(require("react"));
 var AccordionPrimitive = __toESM(require("@radix-ui/react-accordion"));
 var Accordion = AccordionPrimitive.Root;
 var triggerStyles = "flex flex-1 items-center select-none cursor-pointer bg-primary-foreground rounded justify-between p-2 px-3 font-medium transition-all  [&[data-state=open]>svg]:-rotate-90";
-var AccordionItem = React73.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionItem = React74.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React73.createElement(AccordionPrimitive.Item, _object_spread({
+    return React74.createElement(AccordionPrimitive.Item, _object_spread({
         ref: ref,
         className: cn(className)
     }, props));
 });
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React73.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionTrigger = React74.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, showArrow = _param.showArrow, children = _param.children, props = _object_without_properties(_param, [
         "className",
         "showArrow",
         "children"
     ]);
-    return React73.createElement(AccordionPrimitive.Header, {
+    return React74.createElement(AccordionPrimitive.Header, {
         className: "flex"
-    }, /* @__PURE__ */ React73.createElement(AccordionPrimitive.Trigger, _object_spread({
+    }, /* @__PURE__ */ React74.createElement(AccordionPrimitive.Trigger, _object_spread({
         ref: ref,
         className: cn(triggerStyles, className)
-    }, props), children, showArrow && /* @__PURE__ */ React73.createElement("svg", {
+    }, props), children, showArrow && /* @__PURE__ */ React74.createElement("svg", {
         "aria-label": "Chevron Right Icon",
         stroke: "currentColor",
         fill: "currentColor",
@@ -7302,29 +7411,29 @@ var AccordionTrigger = React73.forwardRef(function(_param, ref) /* @__PURE__ */
         height: "1em",
         width: "1em",
         className: "h-4 w-4 shrink-0 rotate-90 transition-transform duration-200"
-    }, /* @__PURE__ */ React73.createElement("path", {
+    }, /* @__PURE__ */ React74.createElement("path", {
         d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"
     }))));
 });
 AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-var AccordionContent = React73.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionContent = React74.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, children = _param.children, props = _object_without_properties(_param, [
         "className",
         "children"
     ]);
-    return React73.createElement(AccordionPrimitive.Content, _object_spread({
+    return React74.createElement(AccordionPrimitive.Content, _object_spread({
         ref: ref,
         className: cn("overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down", className)
-    }, props), /* @__PURE__ */ React73.createElement("div", null, children));
+    }, props), /* @__PURE__ */ React74.createElement("div", null, children));
 });
 AccordionContent.displayName = AccordionPrimitive.Content.displayName;
 var SidebarGroup = function(param) {
     var title = param.title, items = param.items, selectedItem = param.selectedItem, openedItem = param.openedItem, setOpenedItem = param.setOpenedItem, onItemClick = param.onItemClick, onSubItemClick = param.onSubItemClick, direction = param.direction, isOpen = param.isOpen;
-    return /* @__PURE__ */ React73.createElement("div", null, title && /* @__PURE__ */ React73.createElement("h3", {
+    return /* @__PURE__ */ React74.createElement("div", null, title && /* @__PURE__ */ React74.createElement("h3", {
         className: "mb-1 font-bold"
-    }, title), /* @__PURE__ */ React73.createElement("ul", {
+    }, title), /* @__PURE__ */ React74.createElement("ul", {
         className: "flex flex-col gap-2"
-    }, /* @__PURE__ */ React73.createElement(Accordion, {
+    }, /* @__PURE__ */ React74.createElement(Accordion, {
         value: openedItem,
         type: "single",
         onValueChange: function(e) {
@@ -7333,7 +7442,7 @@ var SidebarGroup = function(param) {
         collapsible: true,
         className: "flex flex-col gap-1"
     }, items.map(function(item, idx) {
-        return /* @__PURE__ */ React73.createElement(SidebarItem, {
+        return /* @__PURE__ */ React74.createElement(SidebarItem, {
             isOpen: isOpen,
             isSelected: selectedItem,
             key: idx,
@@ -7350,23 +7459,23 @@ var SidebarItem = function(param) {
         return isSelected && isSelected[index] === value ? "bg-primary text-primary-foreground  cursor-default" : "hover:bg-primary/10";
     };
     if (item.subitems) {
-        return /* @__PURE__ */ React73.createElement(AccordionItem, {
+        return /* @__PURE__ */ React74.createElement(AccordionItem, {
             value: item.value,
             className: "overflow-x-clip",
             dir: direction
-        }, /* @__PURE__ */ React73.createElement(AccordionTrigger, {
+        }, /* @__PURE__ */ React74.createElement(AccordionTrigger, {
             className: cn(getSelectedStyle(item.value, 0)),
             showArrow: isOpen
-        }, /* @__PURE__ */ React73.createElement("div", {
+        }, /* @__PURE__ */ React74.createElement("div", {
             className: cn(!isOpen && "py-1", "flex w-fit flex-row items-center  gap-2")
-        }, item.icon, isOpen && /* @__PURE__ */ React73.createElement("span", {
+        }, item.icon, isOpen && /* @__PURE__ */ React74.createElement("span", {
             className: cn("transition-all ", isOpen ? "opacity-100" : "opacity-0")
-        }, item.label))), item.subitems && /* @__PURE__ */ React73.createElement(AccordionContent, {
+        }, item.label))), item.subitems && /* @__PURE__ */ React74.createElement(AccordionContent, {
             className: " mt-1 h-full rounded  "
-        }, /* @__PURE__ */ React73.createElement("div", {
+        }, /* @__PURE__ */ React74.createElement("div", {
             className: cn("flex h-full flex-col gap-2 bg-foreground/5 p-1")
         }, item.subitems.map(function(subitem, idx) {
-            return /* @__PURE__ */ React73.createElement("li", {
+            return /* @__PURE__ */ React74.createElement("li", {
                 key: idx,
                 onClick: function(e) {
                     e.stopPropagation();
@@ -7381,7 +7490,7 @@ var SidebarItem = function(param) {
             }, subitem.icon, subitem.label);
         }))));
     } else {
-        return /* @__PURE__ */ React73.createElement("div", {
+        return /* @__PURE__ */ React74.createElement("div", {
             dir: direction,
             onClick: function() {
                 if (onItemClick) {
@@ -7391,9 +7500,9 @@ var SidebarItem = function(param) {
                 }
             },
             className: cn(triggerStyles, getSelectedStyle(item.value, 0), "overflow-x-clip ")
-        }, /* @__PURE__ */ React73.createElement("div", {
+        }, /* @__PURE__ */ React74.createElement("div", {
             className: "flex flex-row items-center gap-2 "
-        }, item.icon, /* @__PURE__ */ React73.createElement("span", {
+        }, item.icon, /* @__PURE__ */ React74.createElement("span", {
             className: cn("whitespace-nowrap transition-all", isOpen ? "opacity-100" : "opacity-0")
         }, item.label)));
     }
@@ -10419,6 +10528,13 @@ var import_react95 = require("react");
     ComparingPlans: ComparingPlans,
     ConfirmationPage: ConfirmationPage,
     CreditCardForm: CreditCardForm,
+    Dialog: Dialog,
+    DialogContent: DialogContent,
+    DialogDescription: DialogDescription,
+    DialogFooter: DialogFooter,
+    DialogHeader: DialogHeader,
+    DialogTitle: DialogTitle,
+    DialogTrigger: DialogTrigger,
     DragDropImages: DragDropImages,
     DraggableCard: DraggableCard,
     DropdownMenu: DropdownMenu,