@sikka/hawa 0.1.92 → 0.1.93

package/dist/index.js

@@ -221,14 +221,14 @@ var React16 = _interopRequireWildcard(_react);
 var React19 = _interopRequireWildcard(_react);
 var React31 = _interopRequireWildcard(_react);
 var React60 = _interopRequireWildcard(_react);
-var React62 = _interopRequireWildcard(_react);
 var React63 = _interopRequireWildcard(_react);
-var React64 = _interopRequireWildcard(_react);
 var React65 = _interopRequireWildcard(_react);
 var React66 = _interopRequireWildcard(_react);
 var React67 = _interopRequireWildcard(_react);
+var React68 = _interopRequireWildcard(_react);
 var React69 = _interopRequireWildcard(_react);
-var React75 = _interopRequireWildcard(_react);
+var React71 = _interopRequireWildcard(_react);
+var React77 = _interopRequireWildcard(_react);
 var _clsx = require("clsx");
 var _clsx2 = _interopRequireDefault(_clsx);
 var HawaCheckbox = function(props) {
@@ -385,7 +385,9 @@ var HawaTextField = function(_param) {
     }, props.icon), /* @__PURE__ */ React6.default.createElement("input", _object_spread_props(_object_spread({}, props), {
         className: cn(defaultInputStyle, props.icon && "pl-10", preview && "border-transparent bg-transparent px-0"),
         disabled: preview
-    }))), props.helpertext ? /* @__PURE__ */ React6.default.createElement("p", {
+    }))), props.iconInside && /* @__PURE__ */ React6.default.createElement("div", {
+        className: "absolute right-1 top-[41px]  -translate-y-1/2"
+    }, props.iconInside), props.helpertext ? /* @__PURE__ */ React6.default.createElement("p", {
         className: "mb-0 mt-1 text-xs text-red-600 dark:text-red-500"
     }, props.helpertext) : null));
 };
@@ -477,7 +479,7 @@ var HawaRadio = function(_param) {
         case "tabs":
             return /* @__PURE__ */ React6.default.createElement("ul", {
                 ref: ref,
-                className: _clsx2.default.call(void 0, _optionalChain([
+                className: cn(_optionalChain([
                     props,
                     "access",
                     function(_3) {
@@ -507,7 +509,7 @@ var HawaRadio = function(_param) {
                                 setSelectedOption(opt.value);
                                 props.onChangeTab(opt.value);
                             },
-                            className: _clsx2.default.call(void 0, "w-full cursor-pointer", orientation === "horizontal" && parentDirection === "ltr" && "rounded-none first:rounded-l last:rounded-r", orientation === "horizontal" && parentDirection === "rtl" && "rounded-none first:rounded-r last:rounded-l", orientation === "vertical" && "rounded-none first:rounded-t last:rounded-b", "last flex flex-row items-center justify-center gap-2 ", selectedOption === opt.value ? activeTabStyle : inactiveTabStyle),
+                            className: cn("w-full cursor-pointer", orientation === "horizontal" && parentDirection === "ltr" && "rounded-none first:rounded-l last:rounded-r", orientation === "horizontal" && parentDirection === "rtl" && "rounded-none first:rounded-r last:rounded-l", orientation === "vertical" && "rounded-none first:rounded-t last:rounded-b", "last flex flex-row items-center justify-center gap-2 ", selectedOption === opt.value ? activeTabStyle : inactiveTabStyle),
                             key: o
                         }, opt.icon && opt.icon, opt.label);
                     });
@@ -515,7 +517,7 @@ var HawaRadio = function(_param) {
             ]));
         case "bordered":
             return /* @__PURE__ */ React6.default.createElement("div", {
-                className: _clsx2.default.call(void 0, orientationStyle[orientation], "gap-4")
+                className: cn(orientationStyle[orientation], "gap-4")
             }, props.options.map(function(opt, i) {
                 return /* @__PURE__ */ React6.default.createElement("div", {
                     className: "rounded border border-gray-200   "
@@ -530,12 +532,12 @@ var HawaRadio = function(_param) {
                     name: "bordered-radio"
                 }), /* @__PURE__ */ React6.default.createElement("label", {
                     htmlFor: opt.value.toString(),
-                    className: _clsx2.default.call(void 0, "ml-2 w-full  p-4 pl-3  text-sm font-medium dark:text-white", opt.disabled ? "opacity-50" : "cursor-pointer text-gray-900")
+                    className: cn("ml-2 w-full  p-4 pl-3  text-sm font-medium dark:text-white", opt.disabled ? "opacity-50" : "cursor-pointer text-gray-900")
                 }, opt.label)));
             }));
         case "cards":
             return /* @__PURE__ */ React6.default.createElement("ul", {
-                className: _clsx2.default.call(void 0, orientationStyle[orientation], "gap-4")
+                className: cn(orientationStyle[orientation], "gap-4")
             }, _optionalChain([
                 props,
                 "access",
@@ -559,7 +561,7 @@ var HawaRadio = function(_param) {
                             disabled: opt.disabled
                         }), /* @__PURE__ */ React6.default.createElement("label", {
                             htmlFor: opt.value.toString(),
-                            className: _clsx2.default.call(void 0, "inline-flex h-full w-full  items-center justify-between rounded-lg border border-gray-200 bg-white p-5                    text-gray-500  peer-checked:border-blue-600 peer-checked:text-blue-600 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300 dark:peer-checked:text-blue-500", opt.disabled ? "opacity-50" : "cursor-pointer hover:bg-gray-100 hover:text-gray-600")
+                            className: cn("inline-flex h-full w-full  items-center justify-between rounded-lg border border-gray-200 bg-white p-5                    text-gray-500  peer-checked:border-blue-600 peer-checked:text-blue-600 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-400  dark:peer-checked:text-primary", opt.disabled ? "opacity-50" : "cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 dark:hover:text-gray-300 hover:text-gray-600")
                         }, /* @__PURE__ */ React6.default.createElement("div", {
                             className: "block  h-full w-full"
                         }, /* @__PURE__ */ React6.default.createElement("div", {
@@ -572,10 +574,10 @@ var HawaRadio = function(_param) {
             ]));
         default:
             return /* @__PURE__ */ React6.default.createElement("div", {
-                className: orientationStyle[orientation]
+                className: cn(orientationStyle[orientation], "gap-2")
             }, props.options.map(function(opt, i) {
                 return /* @__PURE__ */ React6.default.createElement("div", {
-                    className: "radio-item radio-item-default mb-4 flex items-center transition-all",
+                    className: "radio-item radio-item-default  flex items-center transition-all",
                     key: i + 1
                 }, /* @__PURE__ */ React6.default.createElement("input", {
                     disabled: opt.disabled,
@@ -585,7 +587,7 @@ var HawaRadio = function(_param) {
                     name: "default-radio"
                 }), /* @__PURE__ */ React6.default.createElement("label", {
                     htmlFor: opt.value.toString(),
-                    className: _clsx2.default.call(void 0, "ml-2 text-sm font-medium dark:text-white", opt.disabled ? "text-gray-400" : "cursor-pointer text-gray-900")
+                    className: cn("text-sm font-medium dark:text-white", opt.disabled ? "text-gray-400" : "cursor-pointer text-gray-900")
                 }, opt.label));
             }));
     }
@@ -6859,6 +6861,119 @@ var ActionCard = function(props) {
         className: "flex flex-row justify-between text-sm transition-all duration-200 ".concat(hovered ? "opacity-100" : "opacity-0")
     }, props.bottomElement));
 };
+// src/elements/StickyFeatures.tsx
+var StickyFeatures = function(props) {
+    return /* @__PURE__ */ React6.default.createElement("div", {
+        className: "bg-white py-24 sm:py-32"
+    }, /* @__PURE__ */ React6.default.createElement("div", {
+        className: "mx-auto flex max-w-5xl flex-col items-start gap-10 px-6 md:flex-row lg:px-8"
+    }, /* @__PURE__ */ React6.default.createElement("div", {
+        className: "w-full md:sticky md:top-10 md:w-[28rem]"
+    }, /* @__PURE__ */ React6.default.createElement("h2", {
+        className: "text-lg font-semibold leading-8 tracking-tight text-indigo-600"
+    }, props.tag), /* @__PURE__ */ React6.default.createElement("p", {
+        className: "mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl"
+    }, props.title), /* @__PURE__ */ React6.default.createElement("p", {
+        className: "mb-2 mt-6 text-base leading-7 text-gray-600"
+    }, props.description)), /* @__PURE__ */ React6.default.createElement("div", {
+        className: "mt-5 w-full min-w-0 flex-1 md:mt-0"
+    }, /* @__PURE__ */ React6.default.createElement("dl", {
+        className: "grid grid-cols-1 gap-x-8 gap-y-10 md:max-w-xl lg:max-w-none lg:gap-y-16"
+    }, props.features.map(function(f) {
+        return /* @__PURE__ */ React6.default.createElement("div", {
+            className: "relative rounded-lg bg-gray-50 p-10"
+        }, /* @__PURE__ */ React6.default.createElement("div", {
+            className: "flex h-10 w-10 items-center justify-center rounded-lg bg-indigo-600"
+        }, f.icon), /* @__PURE__ */ React6.default.createElement("dt", {
+            className: "mt-4 text-lg font-semibold leading-7 text-gray-900"
+        }, f.title), /* @__PURE__ */ React6.default.createElement("dd", {
+            className: "mt-2 text-base leading-7 text-gray-600"
+        }, f.description));
+    })))));
+};
+// src/elements/UserReferralSource.tsx
+// src/elements/Textarea.tsx
+var Textarea = React60.forwardRef(function(_param, ref) {
+    var className = _param.className, label = _param.label, props = _object_without_properties(_param, [
+        "className",
+        "label"
+    ]);
+    return /* @__PURE__ */ React60.createElement(React60.Fragment, null, label && /* @__PURE__ */ React60.createElement(Label, {
+        htmlFor: props.id
+    }, label), /* @__PURE__ */ React60.createElement("textarea", _object_spread({
+        className: cn("flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", className),
+        ref: ref
+    }, props)));
+});
+Textarea.displayName = "Textarea";
+// src/elements/UserReferralSource.tsx
+var UserReferralSource = function(_param) {
+    var _param_position = _param.position, position = _param_position === void 0 ? "bottom-right" : _param_position, props = _object_without_properties(_param, [
+        "position"
+    ]);
+    var _react_useState_call = _sliced_to_array(_react.useState.call(void 0, false), 2), closed = _react_useState_call[0], setClosed = _react_useState_call[1];
+    var _react_useState_call1 = _sliced_to_array(_react.useState.call(void 0, false), 2), answered = _react_useState_call1[0], setAnswered = _react_useState_call1[1];
+    var _react_useState_call2 = _sliced_to_array(_react.useState.call(void 0, null), 2), clickedOption = _react_useState_call2[0], setClickedOption = _react_useState_call2[1];
+    var _react_useState_call3 = _sliced_to_array(_react.useState.call(void 0, 5), 2), closingTimer = _react_useState_call3[0], setClosingTimer = _react_useState_call3[1];
+    var popUpRef = _react.useRef.call(void 0, null);
+    var boxPosition = {
+        "bottom-right": "right-4",
+        "bottom-left": "left-4"
+    };
+    _react.useEffect.call(void 0, function() {
+        var timeoutHide = setTimeout(function() {
+            if (closingTimer >= 0) {
+                setClosingTimer(closingTimer - 1);
+            }
+        }, 1e3);
+        return function() {
+            clearTimeout(timeoutHide);
+        };
+    }, [
+        closingTimer
+    ]);
+    var slowClose = function() {
+        setClosed(true);
+        setTimeout(function() {
+            popUpRef.current.removeChild(popUpRef.current.children[0]);
+        }, 200);
+    };
+    return /* @__PURE__ */ React6.default.createElement(Card, {
+        ref: popUpRef,
+        className: _clsx2.default.call(void 0, "fixed bottom-4 p-4 ", boxPosition[position])
+    }, /* @__PURE__ */ React6.default.createElement("button", {
+        type: "button",
+        className: "absolute right-2 top-2 inline-flex h-8 w-8 rounded p-1.5 text-gray-400 transition-all hover:bg-gray-100 hover:text-gray-900 focus:ring-2 focus:ring-gray-300 dark:bg-gray-800 dark:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-white",
+        "data-dismiss-target": "#toast-default",
+        "aria-label": "Close",
+        onClick: function() {
+            return slowClose();
+        }
+    }, /* @__PURE__ */ React6.default.createElement("svg", {
+        "aria-hidden": "true",
+        className: "h-5 w-5",
+        fill: "currentColor",
+        viewBox: "0 0 20 20"
+    }, /* @__PURE__ */ React6.default.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__ */ React6.default.createElement(CardContent, {
+        headless: true
+    }, /* @__PURE__ */ React6.default.createElement("div", {
+        className: _clsx2.default.call(void 0, "flex flex-col gap-4", // "relative flex w-full max-w-sm flex-col gap-2 rounded border bg-background p-4 shadow-md transition-all",
+        closed ? "opacity-0" : "opacity-100")
+    }, /* @__PURE__ */ React6.default.createElement("div", {
+        className: "mt-4 font-bold"
+    }, props.question), /* @__PURE__ */ React6.default.createElement("div", {
+        className: "flex w-full flex-row gap-1 rounded "
+    }, /* @__PURE__ */ React6.default.createElement(HawaRadio, {
+        orientation: "vertical",
+        options: props.options
+    })), /* @__PURE__ */ React6.default.createElement("div", null, /* @__PURE__ */ React6.default.createElement(Textarea, null))), /* @__PURE__ */ React6.default.createElement(Button, {
+        className: "mt-4 w-full"
+    }, "Submit")));
+};
 // src/elements/Carousel.tsx
 // src/hooks/useCarousel.ts
 var useCarousel = function(imageWidth) {
@@ -6933,13 +7048,13 @@ var Carousel = function(param) {
     }));
 };
 // src/elements/Input.tsx
-var Input = React60.forwardRef(function(_param, ref) {
+var Input = React63.forwardRef(function(_param, ref) {
     var className = _param.className, preview = _param.preview, type = _param.type, props = _object_without_properties(_param, [
         "className",
         "preview",
         "type"
     ]);
-    return /* @__PURE__ */ React60.createElement("input", _object_spread({
+    return /* @__PURE__ */ React63.createElement("input", _object_spread({
         type: type,
         className: cn("flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", className, preview && "  disabled:cursor-default disabled:opacity-100 border-opacity-25 "),
         disabled: preview,
@@ -7022,13 +7137,13 @@ var InterfaceSettings = function(_param) {
 // src/elements/Popover.tsx
 var _reactpopover = require("@radix-ui/react-popover");
 var PopoverPrimitive = _interopRequireWildcard(_reactpopover);
-var PopoverContent = React62.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var PopoverContent = React65.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, _param_align = _param.align, align = _param_align === void 0 ? "center" : _param_align, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, props = _object_without_properties(_param, [
         "className",
         "align",
         "sideOffset"
     ]);
-    return React62.createElement(PopoverPrimitive.Portal, null, /* @__PURE__ */ React62.createElement(PopoverPrimitive.Content, _object_spread({
+    return React65.createElement(PopoverPrimitive.Portal, null, /* @__PURE__ */ React65.createElement(PopoverPrimitive.Content, _object_spread({
         ref: ref,
         align: align,
         sideOffset: sideOffset,
@@ -7038,7 +7153,7 @@ var PopoverContent = React62.forwardRef(function(_param, ref) /* @__PURE__ */ {
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 var Popover = function(param) {
     var trigger = param.trigger, children = param.children, className = param.className, _param_align = param.align, align = _param_align === void 0 ? "center" : _param_align, side = param.side, _param_sideOffset = param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset;
-    return /* @__PURE__ */ React62.createElement(PopoverPrimitive.Root, null, /* @__PURE__ */ React62.createElement(PopoverPrimitive.Trigger, null, trigger), /* @__PURE__ */ React62.createElement(PopoverContent, {
+    return /* @__PURE__ */ React65.createElement(PopoverPrimitive.Root, null, /* @__PURE__ */ React65.createElement(PopoverPrimitive.Trigger, null, trigger), /* @__PURE__ */ React65.createElement(PopoverContent, {
         side: side,
         className: className,
         align: align,
@@ -7048,79 +7163,65 @@ var Popover = function(param) {
 // src/elements/Tabs.tsx
 var _reacttabs = require("@radix-ui/react-tabs");
 var TabsPrimitive = _interopRequireWildcard(_reacttabs);
-var TabsContext = React63.createContext({
+var TabsContext = React66.createContext({
     orientation: "vertical"
 });
-var Tabs = React63.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var Tabs = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, orientation = _param.orientation, props = _object_without_properties(_param, [
         "className",
         "orientation"
     ]);
-    return React63.createElement(TabsPrimitive.Root, _object_spread({
+    return React66.createElement(TabsPrimitive.Root, _object_spread({
         ref: ref,
         className: cn("flex gap-2", orientation === "horizontal" ? "flex-row" : "flex-col", className)
-    }, props), /* @__PURE__ */ React63.createElement(TabsContext.Provider, {
+    }, props), /* @__PURE__ */ React66.createElement(TabsContext.Provider, {
         value: {
             orientation: orientation
         }
     }, props.children));
 });
 Tabs.displayName = TabsPrimitive.Root.displayName;
-var TabsList = React63.forwardRef(function(_param, ref) {
+var TabsList = React66.forwardRef(function(_param, ref) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    var orientation = React63.useContext(TabsContext).orientation;
-    return /* @__PURE__ */ React63.createElement(TabsPrimitive.List, _object_spread({
+    var orientation = React66.useContext(TabsContext).orientation;
+    return /* @__PURE__ */ React66.createElement(TabsPrimitive.List, _object_spread({
         ref: ref,
         className: cn("flex w-fit flex-wrap items-center justify-start gap-1 rounded border  bg-muted p-1 text-muted-foreground  dark:border-primary/10 ", orientation === "horizontal" ? "flex-col" : "flex-row", className)
     }, props));
 });
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React63.forwardRef(function(_param, ref) {
+var TabsTrigger = React66.forwardRef(function(_param, ref) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return /* @__PURE__ */ React63.createElement(TabsPrimitive.Trigger, _object_spread({
+    return /* @__PURE__ */ React66.createElement(TabsPrimitive.Trigger, _object_spread({
         ref: ref,
         className: cn("inline-flex w-full flex-1 select-none items-center justify-center whitespace-nowrap rounded border px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm  dark:border-primary/10", className)
     }, props));
 });
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React63.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var TabsContent = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React63.createElement(TabsPrimitive.Content, _object_spread({
+    return React66.createElement(TabsPrimitive.Content, _object_spread({
         ref: ref,
         className: cn("w-full ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", className)
     }, props));
 });
 TabsContent.displayName = TabsPrimitive.Content.displayName;
-// src/elements/Textarea.tsx
-var Textarea = React64.forwardRef(function(_param, ref) {
-    var className = _param.className, label = _param.label, props = _object_without_properties(_param, [
-        "className",
-        "label"
-    ]);
-    return /* @__PURE__ */ React64.createElement(React64.Fragment, null, label && /* @__PURE__ */ React64.createElement(Label, {
-        htmlFor: props.id
-    }, label), /* @__PURE__ */ React64.createElement("textarea", _object_spread({
-        className: cn("flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", className),
-        ref: ref
-    }, props)));
-});
-Textarea.displayName = "Textarea";
 // src/elements/Separator.tsx
 var _reactseparator = require("@radix-ui/react-separator");
 var SeparatorPrimitive = _interopRequireWildcard(_reactseparator);
-var Separator3 = React65.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var Separator3 = React67.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, _param_orientation = _param.orientation, orientation = _param_orientation === void 0 ? "horizontal" : _param_orientation, _param_decorative = _param.decorative, decorative = _param_decorative === void 0 ? true : _param_decorative, props = _object_without_properties(_param, [
         "className",
         "orientation",
         "decorative"
     ]);
-    return React65.createElement(SeparatorPrimitive.Root, _object_spread({
+    return React67.createElement(SeparatorPrimitive.Root, _object_spread({
         ref: ref,
         decorative: decorative,
         orientation: orientation,
@@ -7150,24 +7251,24 @@ var toastVariants = _classvarianceauthority.cva.call(void 0, "group pointer-even
     }
 });
 var ToastProvider = ToastPrimitives.Provider;
-var ToastViewport = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ToastViewport = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React66.createElement(ToastPrimitives.Viewport, _object_spread({
+    return React68.createElement(ToastPrimitives.Viewport, _object_spread({
         ref: ref,
         className: cn("fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]", className)
     }, props));
 });
 ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
-var Toast = React66.forwardRef(function(_param, ref) {
+var Toast = React68.forwardRef(function(_param, ref) {
     var className = _param.className, variant = _param.variant, _param_severity = _param.severity, severity = _param_severity === void 0 ? "none" : _param_severity, direction = _param.direction, props = _object_without_properties(_param, [
         "className",
         "variant",
         "severity",
         "direction"
     ]);
-    return /* @__PURE__ */ React66.createElement(ToastPrimitives.Root, _object_spread({
+    return /* @__PURE__ */ React68.createElement(ToastPrimitives.Root, _object_spread({
         ref: ref,
         className: cn(toastVariants({
             variant: variant,
@@ -7177,52 +7278,52 @@ var Toast = React66.forwardRef(function(_param, ref) {
     }, props));
 });
 Toast.displayName = ToastPrimitives.Root.displayName;
-var ToastAction = React66.forwardRef(function(_param, ref) {
+var ToastAction = React68.forwardRef(function(_param, ref) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return /* @__PURE__ */ React66.createElement(ToastPrimitives.Action, _object_spread({
+    return /* @__PURE__ */ React68.createElement(ToastPrimitives.Action, _object_spread({
         ref: ref,
         className: cn("inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", "group-[.info]:border-muted/40 group-[.info]:hover:border-info/30 group-[.info]:hover:bg-info group-[.info]:hover:text-info-foreground group-[.info]:focus:ring-info", "group-[.error]:border-muted/40 group-[.error]:hover:border-error/30 group-[.error]:hover:bg-error group-[.error]:hover:text-error-foreground group-[.error]:focus:ring-error", "group-[.success]:border-muted/40 group-[.success]:hover:border-success/30 group-[.success]:hover:bg-success group-[.success]:hover:text-success-foreground group-[.success]:focus:ring-success", "group-[.warning]:border-muted/40 group-[.warning]:hover:border-warning/30 group-[.warning]:hover:bg-warning group-[.warning]:hover:text-warning-foreground group-[.warning]:focus:ring-warning", className)
     }, props));
 });
 ToastAction.displayName = ToastPrimitives.Action.displayName;
-var ToastClose = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ToastClose = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React66.createElement(ToastPrimitives.Close, _object_spread({
+    return React68.createElement(ToastPrimitives.Close, _object_spread({
         ref: ref,
         className: cn("absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600", className),
         "toast-close": ""
-    }, props), /* @__PURE__ */ React66.createElement("svg", {
+    }, props), /* @__PURE__ */ React68.createElement("svg", {
         "aria-label": "Close Icon",
         "aria-hidden": "true",
         className: "h-4 w-4",
         fill: "currentColor",
         viewBox: "0 0 20 20"
-    }, /* @__PURE__ */ React66.createElement("path", {
+    }, /* @__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"
     })));
 });
 ToastClose.displayName = ToastPrimitives.Close.displayName;
-var ToastTitle = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ToastTitle = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React66.createElement(ToastPrimitives.Title, _object_spread({
+    return React68.createElement(ToastPrimitives.Title, _object_spread({
         ref: ref,
         className: cn("text-sm font-semibold", className)
     }, props));
 });
 ToastTitle.displayName = ToastPrimitives.Title.displayName;
-var ToastDescription = React66.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ToastDescription = React68.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React66.createElement(ToastPrimitives.Description, _object_spread({
+    return React68.createElement(ToastPrimitives.Description, _object_spread({
         ref: ref,
         className: cn("text-sm opacity-90", className)
     }, props));
@@ -7340,8 +7441,8 @@ function toast(_param) {
     };
 }
 function useToast() {
-    var _React67_useState = _sliced_to_array(React67.useState(memoryState), 2), state = _React67_useState[0], setState = _React67_useState[1];
-    React67.useEffect(function() {
+    var _React69_useState = _sliced_to_array(React69.useState(memoryState), 2), state = _React69_useState[0], setState = _React69_useState[1];
+    React69.useEffect(function() {
         listeners.push(setState);
         return function() {
             var index = listeners.indexOf(setState);
@@ -7394,42 +7495,42 @@ var DialogPortal = function(_param) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement(DialogPrimitive.Portal, _object_spread({
+    return React71.createElement(DialogPrimitive.Portal, _object_spread({
         className: cn(className)
     }, props));
 };
 DialogPortal.displayName = DialogPrimitive.Portal.displayName;
-var DialogOverlay = React69.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var DialogOverlay = React71.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement(DialogPrimitive.Overlay, _object_spread({
+    return React71.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 = React69.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var DialogContent = React71.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, children = _param.children, props = _object_without_properties(_param, [
         "className",
         "children"
     ]);
-    return React69.createElement(DialogPortal, null, /* @__PURE__ */ React69.createElement(DialogOverlay, null), /* @__PURE__ */ React69.createElement(DialogPrimitive.Content, _object_spread({
+    return React71.createElement(DialogPortal, null, /* @__PURE__ */ React71.createElement(DialogOverlay, null), /* @__PURE__ */ React71.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__ */ React69.createElement(DialogPrimitive.Close, {
+    }, props), children, /* @__PURE__ */ React71.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__ */ React69.createElement("svg", {
+    }, /* @__PURE__ */ React71.createElement("svg", {
         "aria-label": "Close Icon",
         "aria-hidden": "true",
         className: "h-5 w-5",
         fill: "currentColor",
         viewBox: "0 0 20 20"
-    }, /* @__PURE__ */ React69.createElement("path", {
+    }, /* @__PURE__ */ React71.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__ */ React69.createElement("span", {
+    })), /* @__PURE__ */ React71.createElement("span", {
         className: "sr-only"
     }, "Close"))));
 });
@@ -7438,7 +7539,7 @@ var DialogHeader = function(_param) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement("div", _object_spread({
+    return React71.createElement("div", _object_spread({
         className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className)
     }, props));
 };
@@ -7447,26 +7548,26 @@ var DialogFooter = function(_param) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement("div", _object_spread({
+    return React71.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 = React69.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var DialogTitle = React71.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement(DialogPrimitive.Title, _object_spread({
+    return React71.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 = React69.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var DialogDescription = React71.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React69.createElement(DialogPrimitive.Description, _object_spread({
+    return React71.createElement(DialogPrimitive.Description, _object_spread({
         ref: ref,
         className: cn("text-sm text-muted-foreground", className)
     }, props));
@@ -7671,28 +7772,28 @@ var _reactaccordion = require("@radix-ui/react-accordion");
 var AccordionPrimitive = _interopRequireWildcard(_reactaccordion);
 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 = React75.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionItem = React77.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React75.createElement(AccordionPrimitive.Item, _object_spread({
+    return React77.createElement(AccordionPrimitive.Item, _object_spread({
         ref: ref,
         className: cn(className)
     }, props));
 });
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React75.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionTrigger = React77.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, showArrow = _param.showArrow, children = _param.children, props = _object_without_properties(_param, [
         "className",
         "showArrow",
         "children"
     ]);
-    return React75.createElement(AccordionPrimitive.Header, {
+    return React77.createElement(AccordionPrimitive.Header, {
         className: "flex"
-    }, /* @__PURE__ */ React75.createElement(AccordionPrimitive.Trigger, _object_spread({
+    }, /* @__PURE__ */ React77.createElement(AccordionPrimitive.Trigger, _object_spread({
         ref: ref,
         className: cn(triggerStyles, className)
-    }, props), children, showArrow && /* @__PURE__ */ React75.createElement("svg", {
+    }, props), children, showArrow && /* @__PURE__ */ React77.createElement("svg", {
         "aria-label": "Chevron Right Icon",
         stroke: "currentColor",
         fill: "currentColor",
@@ -7700,29 +7801,29 @@ var AccordionTrigger = React75.forwardRef(function(_param, ref) /* @__PURE__ */
         height: "1em",
         width: "1em",
         className: "h-4 w-4 shrink-0 rotate-90 transition-transform duration-200"
-    }, /* @__PURE__ */ React75.createElement("path", {
+    }, /* @__PURE__ */ React77.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 = React75.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var AccordionContent = React77.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, children = _param.children, props = _object_without_properties(_param, [
         "className",
         "children"
     ]);
-    return React75.createElement(AccordionPrimitive.Content, _object_spread({
+    return React77.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__ */ React75.createElement("div", null, children));
+    }, props), /* @__PURE__ */ React77.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__ */ React75.createElement("div", null, title && /* @__PURE__ */ React75.createElement("h3", {
+    return /* @__PURE__ */ React77.createElement("div", null, title && /* @__PURE__ */ React77.createElement("h3", {
         className: "mb-1 font-bold"
-    }, title), /* @__PURE__ */ React75.createElement("ul", {
+    }, title), /* @__PURE__ */ React77.createElement("ul", {
         className: "flex flex-col gap-2"
-    }, /* @__PURE__ */ React75.createElement(Accordion, {
+    }, /* @__PURE__ */ React77.createElement(Accordion, {
         value: openedItem,
         type: "single",
         onValueChange: function(e) {
@@ -7731,7 +7832,7 @@ var SidebarGroup = function(param) {
         collapsible: true,
         className: "flex flex-col gap-1"
     }, items.map(function(item, idx) {
-        return /* @__PURE__ */ React75.createElement(SidebarItem, {
+        return /* @__PURE__ */ React77.createElement(SidebarItem, {
             isOpen: isOpen,
             isSelected: selectedItem,
             key: idx,
@@ -7748,23 +7849,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__ */ React75.createElement(AccordionItem, {
+        return /* @__PURE__ */ React77.createElement(AccordionItem, {
             value: item.value,
             className: "overflow-x-clip",
             dir: direction
-        }, /* @__PURE__ */ React75.createElement(AccordionTrigger, {
+        }, /* @__PURE__ */ React77.createElement(AccordionTrigger, {
             className: cn(getSelectedStyle(item.value, 0)),
             showArrow: isOpen
-        }, /* @__PURE__ */ React75.createElement("div", {
+        }, /* @__PURE__ */ React77.createElement("div", {
             className: cn(!isOpen && "py-1", "flex w-fit flex-row items-center  gap-2")
-        }, item.icon, isOpen && /* @__PURE__ */ React75.createElement("span", {
+        }, item.icon, isOpen && /* @__PURE__ */ React77.createElement("span", {
             className: cn("transition-all ", isOpen ? "opacity-100" : "opacity-0")
-        }, item.label))), item.subitems && /* @__PURE__ */ React75.createElement(AccordionContent, {
+        }, item.label))), item.subitems && /* @__PURE__ */ React77.createElement(AccordionContent, {
             className: " mt-1 h-full rounded  "
-        }, /* @__PURE__ */ React75.createElement("div", {
+        }, /* @__PURE__ */ React77.createElement("div", {
             className: cn("flex h-full flex-col gap-2 bg-foreground/5 p-1")
         }, item.subitems.map(function(subitem, idx) {
-            return /* @__PURE__ */ React75.createElement("li", {
+            return /* @__PURE__ */ React77.createElement("li", {
                 key: idx,
                 onClick: function(e) {
                     e.stopPropagation();
@@ -7779,7 +7880,7 @@ var SidebarItem = function(param) {
             }, subitem.icon, subitem.label);
         }))));
     } else {
-        return /* @__PURE__ */ React75.createElement("div", {
+        return /* @__PURE__ */ React77.createElement("div", {
             dir: direction,
             onClick: function() {
                 if (onItemClick) {
@@ -7789,9 +7890,9 @@ var SidebarItem = function(param) {
                 }
             },
             className: cn(triggerStyles, getSelectedStyle(item.value, 0), "overflow-x-clip ")
-        }, /* @__PURE__ */ React75.createElement("div", {
+        }, /* @__PURE__ */ React77.createElement("div", {
             className: "flex flex-row items-center gap-2 "
-        }, item.icon, /* @__PURE__ */ React75.createElement("span", {
+        }, item.icon, /* @__PURE__ */ React77.createElement("span", {
             className: cn("whitespace-nowrap transition-all", isOpen ? "opacity-100" : "opacity-0")
         }, item.label)));
     }
@@ -10441,8 +10542,48 @@ var SelectPayment = function(props) {
 };
 // src/blocks/Payment/CreditCardForm.tsx
 var CreditCardForm = function(props) {
+    var _react_useState_call = _sliced_to_array(_react.useState.call(void 0, ""), 2), cardNumber = _react_useState_call[0], setCardNumber = _react_useState_call[1];
+    var _react_useState_call1 = _sliced_to_array(_react.useState.call(void 0, ""), 2), cardType = _react_useState_call1[0], setCardType = _react_useState_call1[1];
     var methods = _reacthookform.useForm.call(void 0);
     var errors = methods.formState.errors, handleSubmit = methods.handleSubmit, control = methods.control;
+    var getCardType = function(card_bin) {
+        var visa_regex = /^4[0-9]{0,15}$/m;
+        var mastercard_regex = /^5$|^5[0-5][0-9]{0,16}$/m;
+        var amex_regex = /^3$|^3[47][0-9]{0,13}$/m;
+        var mada_regex = /^(440647|440795|446404|457865|968208|457997|474491|636120|417633|468540|468541|468542|468543|968201|446393|409201|458456|484783|462220|455708|410621|455036|486094|486095|486096|504300|440533|489318|489319|445564|968211|410685|406996|432328|428671|428672|428673|968206|446672|543357|434107|407197|407395|412565|431361|604906|521076|529415|535825|543085|524130|554180|549760|968209|524514|529741|537767|535989|536023|513213|520058|558563|588982|589005|531095|530906|532013|968204|422817|422818|422819|428331|483010|483011|483012|589206|968207|419593|439954|530060|531196|420132)/;
+        var meeza_regex = /^507803[0-6][0-9]|507808[3-9][0-9]|507809[0-9][0-9]|507810[0-2][0-9]/;
+        var card_type = "visa";
+        if (card_bin.replace(/[^\d]/g, "").match(mada_regex)) {
+            card_type = "mada";
+        } else if (card_bin.replace(/[^\d]/g, "").match(meeza_regex)) {
+            card_type = "meeza";
+        } else if (card_bin.replace(/[^\d]/g, "").match(visa_regex)) {
+            card_type = "visa";
+        } else if (card_bin.replace(/[^\d]/g, "").match(mastercard_regex)) {
+            card_type = "mastercard";
+        } else if (card_bin.replace(/[^\d]/g, "").match(amex_regex)) {
+            card_type = "amex";
+        }
+        return card_type;
+    };
+    var onCardNumberChange = function(event) {
+        var _event_target = event.target, value = _event_target.value, name = _event_target.name;
+        var cardNumber2 = value;
+        value = value.replace(/\D/g, "");
+        if (/^3[47]\d{0,13}$/.test(value)) {
+            cardNumber2 = value.replace(/(\d{4})/, "$1 ").replace(/(\d{4}) (\d{6})/, "$1 $2 ");
+        } else if (/^3(?:0[0-5]|[68]\d)\d{0,11}$/.test(value)) {
+            cardNumber2 = value.replace(/(\d{4})/, "$1 ").replace(/(\d{4}) (\d{6})/, "$1 $2 ");
+        } else if (/^\d{0,16}$/.test(value)) {
+            cardNumber2 = value.replace(/(\d{4})/, "$1 ").replace(/(\d{4}) (\d{4})/, "$1 $2 ").replace(/(\d{4}) (\d{4}) (\d{4})/, "$1 $2 $3 ");
+        }
+        console.log("card number is ", cardNumber2.trimRight());
+        setCardNumber(cardNumber2.trimRight());
+    };
+    _react.useEffect.call(void 0, function() {
+        var cardTypeSlug = getCardType(cardNumber);
+        setCardType(cardTypeSlug);
+    });
     return /* @__PURE__ */ React6.default.createElement(Card, null, /* @__PURE__ */ React6.default.createElement("form", {
         onSubmit: handleSubmit(props.handle)
     }, /* @__PURE__ */ React6.default.createElement(CardContent, {
@@ -10451,7 +10592,7 @@ var CreditCardForm = function(props) {
         className: "flex flex-row gap-4"
     }, /* @__PURE__ */ React6.default.createElement(_reacthookform.Controller, {
         control: control,
-        name: "cardName",
+        name: "cardNumber",
         render: function(param) {
             var field = param.field;
             return /* @__PURE__ */ React6.default.createElement(HawaTextField, {
@@ -10459,6 +10600,7 @@ var CreditCardForm = function(props) {
                 name: "cardNumber",
                 placeholder: "1234 1234 1234 1234",
                 type: "number",
+                onChange: onCardNumberChange,
                 label: "Card Number",
                 helpertext: _optionalChain([
                     errors,
@@ -10470,7 +10612,12 @@ var CreditCardForm = function(props) {
                     function(_244) {
                         return _244.message;
                     }
-                ])
+                ]),
+                iconInside: /* @__PURE__ */ React6.default.createElement("img", {
+                    src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payment-symbols/borderless/".concat(cardType, ".png"),
+                    alt: "",
+                    className: "h-8"
+                })
             });
         },
         rules: {
@@ -11958,6 +12105,7 @@ exports.SignInForm = SignInForm;
 exports.SignInPhone = SignInPhone;
 exports.SignUpForm = SignUpForm;
 exports.Skeleton = Skeleton;
+exports.StickyFeatures = StickyFeatures;
 exports.SubsectionList = SubsectionList;
 exports.Switch = Switch;
 exports.Tabs = Tabs;
@@ -11979,6 +12127,7 @@ exports.Tooltip = Tooltip;
 exports.UsageCard = UsageCard;
 exports.UserFeedback = UserFeedback;
 exports.UserProfileForm = UserProfileForm;
+exports.UserReferralSource = UserReferralSource;
 exports.UserSettingsForm = UserSettingsForm;
 exports.buttonVariants = buttonVariants;
 exports.reducer = reducer;