@sikka/hawa 0.2.45-next → 0.2.48-next

package/dist/index.js

@@ -263,6 +263,9 @@ __export(components_exports, {
     ColorPicker: function() {
         return ColorPicker;
     },
+    Combobox: function() {
+        return Combobox;
+    },
     Command: function() {
         return Command;
     },
@@ -317,9 +320,33 @@ __export(components_exports, {
     FileDropzone: function() {
         return FileDropzone;
     },
+    Form: function() {
+        return Form;
+    },
+    FormControl: function() {
+        return FormControl;
+    },
+    FormDescription: function() {
+        return FormDescription;
+    },
+    FormField: function() {
+        return FormField;
+    },
+    FormItem: function() {
+        return FormItem;
+    },
+    FormLabel: function() {
+        return FormLabel;
+    },
+    FormMessage: function() {
+        return FormMessage;
+    },
     Input: function() {
         return Input;
     },
+    InterfaceSettings: function() {
+        return InterfaceSettings;
+    },
     Label: function() {
         return Label;
     },
@@ -344,6 +371,9 @@ __export(components_exports, {
     PopoverTrigger: function() {
         return PopoverTrigger;
     },
+    Progress: function() {
+        return Progress;
+    },
     Radio: function() {
         return Radio;
     },
@@ -356,6 +386,9 @@ __export(components_exports, {
     Select: function() {
         return Select;
     },
+    Separator: function() {
+        return Separator2;
+    },
     Skeleton: function() {
         return Skeleton;
     },
@@ -409,6 +442,9 @@ __export(components_exports, {
     },
     buttonVariants: function() {
         return buttonVariants;
+    },
+    useFormField: function() {
+        return useFormField;
     }
 });
 module.exports = __toCommonJS(components_exports);
@@ -1449,7 +1485,7 @@ var Alert = function(_param) {
             }, 200);
         }
     }, /* @__PURE__ */ import_react10.default.createElement("span", {
-        className: "sr-only"
+        className: "hawa-sr-only"
     }, "Close"), /* @__PURE__ */ import_react10.default.createElement("svg", {
         "aria-label": "Close Icon",
         "aria-hidden": "true",
@@ -3812,12 +3848,13 @@ var Input = function(_param) {
     var widthStyles = {
         small: "hawa-w-full hawa-max-w-2xs",
         normal: "hawa-w-1/2",
-        full: "hawa-w-full"
+        full: "hawa-w-full",
+        auto: ""
     };
-    var defaultStyle = "hawa-flex hawa-max-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-2";
+    var defaultStyle = "hawa-flex hawa-max-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
     var defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm hawa-text-black dark:hawa-text-white ";
     return /* @__PURE__ */ import_react15.default.createElement("div", {
-        className: cn(defaultStyle, marginStyles[margin], widthStyles[width], props.className)
+        className: cn(defaultStyle, marginStyles[margin], widthStyles[width], props.containerClassName, "hawa-w-full hawa-gap-2")
     }, props.label && /* @__PURE__ */ import_react15.default.createElement(Label, null, props.label), props.isLoading ? /* @__PURE__ */ import_react15.default.createElement(Skeleton, {
         className: "hawa-h-[38px] hawa-w-full"
     }) : /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement("div", {
@@ -3826,10 +3863,20 @@ var Input = function(_param) {
         className: cn("hawa-relative")
     }, props.icon && /* @__PURE__ */ import_react15.default.createElement("div", {
         className: "hawa-absolute hawa-left-3 hawa-top-1/2 hawa--translate-y-1/2"
-    }, props.icon), /* @__PURE__ */ import_react15.default.createElement("input", _object_spread_props(_object_spread({}, props), {
+    }, props.icon), /* @__PURE__ */ import_react15.default.createElement("input", {
         className: cn(defaultInputStyle, props.icon && "hawa-pl-10", "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0", preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0", (_props_inputProps = props.inputProps) === null || _props_inputProps === void 0 ? void 0 : _props_inputProps.className),
-        disabled: preview
-    }))), props.iconInside && /* @__PURE__ */ import_react15.default.createElement("div", {
+        onChange: props.onChange,
+        autoComplete: props.autoComplete,
+        value: props.value,
+        defaultValue: props.defaultValue,
+        type: props.type,
+        placeholder: props.placeholder,
+        disabled: preview,
+        style: {
+            minWidth: "100%",
+            width: "auto"
+        }
+    })), props.iconInside && /* @__PURE__ */ import_react15.default.createElement("div", {
         className: "hawa-absolute hawa-right-1 hawa-top-[41px]  hawa--translate-y-1/2"
     }, props.iconInside), props.helperText && /* @__PURE__ */ import_react15.default.createElement("p", {
         className: "hawa-mb-0 hawa-mt-0 hawa-text-xs hawa-text-red-600 dark:hawa-text-red-500"
@@ -3840,25 +3887,6 @@ var import_clsx7 = __toESM(require("clsx"));
 var import_react16 = __toESM(require("react"));
 var import_react_select = __toESM(require("react-select"));
 var import_creatable = __toESM(require("react-select/creatable"));
-var Control = function(_param) {
-    var cx = _param.cx, children = _param.children, getStyles = _param.getStyles, innerProps = _param.innerProps, innerRef = _param.innerRef, _param_size = _param.size, size = _param_size === void 0 ? "normal" : _param_size, props = _object_without_properties(_param, [
-        "cx",
-        "children",
-        "getStyles",
-        "innerProps",
-        "innerRef",
-        "size"
-    ]);
-    var sizeStyles = {
-        small: "hawa-h-7 hawa-text-xs",
-        normal: "hawa-h-[2.38rem]  hawa-text-sm",
-        large: ""
-    };
-    return /* @__PURE__ */ import_react16.default.createElement("div", _object_spread({
-        ref: innerRef,
-        className: (0, import_clsx7.default)(sizeStyles[size], "hawa-flex  hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500")
-    }, innerProps), children);
-};
 var Menu = function(_param) {
     var cx = _param.cx, children = _param.children, getStyles = _param.getStyles, innerProps = _param.innerProps, innerRef = _param.innerRef, props = _object_without_properties(_param, [
         "cx",
@@ -3887,20 +3915,33 @@ var Option = function(_param) /* @__PURE__ */ {
     }, innerProps), children);
 };
 var Select = function(props) {
+    var Control = function(param) {
+        var // cx,
+        children = param.children, // getStyles,
+        innerProps = param.innerProps, innerRef = param.innerRef;
+        return /* @__PURE__ */ import_react16.default.createElement("div", _object_spread({
+            ref: innerRef,
+            className: (0, import_clsx7.default)(// sizeStyles[size],
+            " hawa-text-sm hawa-flex hawa-p-2 hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500")
+        }, innerProps), children);
+    };
     var NoOption = function() {
         var _props_texts;
         var _props_texts_noOptions;
         return /* @__PURE__ */ import_react16.default.createElement("div", null, (_props_texts_noOptions = (_props_texts = props.texts) === null || _props_texts === void 0 ? void 0 : _props_texts.noOptions) !== null && _props_texts_noOptions !== void 0 ? _props_texts_noOptions : "No Items Found");
     };
     return /* @__PURE__ */ import_react16.default.createElement("div", {
-        className: "hawa-flex hawa-w-full hawa-flex-col hawa-gap-2"
+        className: cn("hawa-flex hawa-flex-col hawa-gap-2", props.width === "fit" ? "hawa-w-fit" : "hawa-w-full")
     }, props.label && /* @__PURE__ */ import_react16.default.createElement(Label, null, props.label), props.isLoading ? /* @__PURE__ */ import_react16.default.createElement(Skeleton, {
         className: "hawa-h-[38px] hawa-w-full"
     }) : !props.isCreatable ? /* @__PURE__ */ import_react16.default.createElement(import_react_select.default, {
         noOptionsMessage: NoOption,
         classNames: {
+            control: function() {
+                return cn(" hawa-text-sm hawa-flex hawa-p-2 hawa-w-full  hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500", props.controlClassNames);
+            },
             container: function() {
-                return cn("hawa-rounded", props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer");
+                return cn("hawa-rounded", props.containerClassNames, props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer");
             },
             //   TODO: enable keyboard to go to the next item in the list
             placeholder: function() {
@@ -3916,7 +3957,7 @@ var Select = function(props) {
                 return "hawa-text-black dark:hawa-text-white hawa-px-2";
             },
             indicatorsContainer: function() {
-                return " hawa-px-2 hawa-cursor-pointer hawa-text-muted-foreground";
+                return " hawa-px-0 hawa-cursor-pointer hawa-text-muted-foreground";
             }
         },
         unstyled: true,
@@ -3932,7 +3973,7 @@ var Select = function(props) {
             props.onChange(newValue, action));
         },
         components: {
-            Control: Control,
+            // Control,
             Option: Option,
             Menu: Menu
         },
@@ -3945,7 +3986,7 @@ var Select = function(props) {
         },
         classNames: {
             container: function() {
-                return cn("hawa-rounded", props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer");
+                return cn("hawa-rounded ", props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer");
             },
             placeholder: function() {
                 return "hawa-px-2 hawa-text-muted-foreground";
@@ -3995,8 +4036,11 @@ var PhoneInput = function(props) {
         className: "hawa-mb-2 hawa-block hawa-text-sm hawa-font-medium"
     }, props.label), /* @__PURE__ */ import_react17.default.createElement("div", {
         dir: "ltr",
-        className: "hawa-flex hawa-flex-row "
+        className: "hawa-flex hawa-flex-row hawa-w-full "
     }, /* @__PURE__ */ import_react17.default.createElement(Select, {
+        width: "fit",
+        controlClassNames: "hawa-rounded-r-none",
+        containerClassNames: "hawa-w-[100px] hawa-p-0 hawa-rounded-r-none",
         options: countries_default,
         isMulti: false,
         isSearchable: true,
@@ -4010,11 +4054,12 @@ var PhoneInput = function(props) {
         onChange: props.handleChange,
         type: "number",
         placeholder: "531045453",
+        width: "auto",
         inputProps: {
-            className: "hawa-border-l-0 hawa-border-l-transparent"
+            className: "hawa-w-full hawa-min-w-full hawa-border-l-0 hawa-border-l-transparent hawa-rounded-l-none "
         }
     }), props.helperText && /* @__PURE__ */ import_react17.default.createElement("p", {
-        className: "hawa-mb-1 hawa-mt-1 hawa-text-xs hawa-text-red-600 dark:hawa-text-red-500"
+        className: "hawa-mb-1   hawa-mt-1 hawa-text-xs hawa-text-red-600 dark:hawa-text-red-500"
     }, props.helperText)));
 };
 // components/elements/AppStores.tsx
@@ -4098,15 +4143,229 @@ var AppStores = function(props) {
         className: "hawa-font-sans hawa--mt-1 hawa-text-xl hawa-font-semibold"
     }, "Google Play")))));
 };
+// components/elements/Separator.tsx
+var React30 = __toESM(require("react"));
+// node_modules/@babel/runtime/helpers/esm/extends.js
+function _extends1() {
+    _extends1 = Object.assign ? Object.assign.bind() : function _extends(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends1.apply(this, arguments);
+}
+// node_modules/@radix-ui/react-separator/dist/index.mjs
+var import_react22 = require("react");
+// node_modules/@radix-ui/react-primitive/dist/index.mjs
+var import_react21 = require("react");
+var import_react_dom = require("react-dom");
+// node_modules/@radix-ui/react-slot/dist/index.mjs
+var import_react20 = require("react");
+// node_modules/@radix-ui/react-compose-refs/dist/index.mjs
+var import_react19 = require("react");
+function $6ed0406888f73fc4$var$setRef(ref, value) {
+    if (typeof ref === "function") ref(value);
+    else if (ref !== null && ref !== void 0) ref.current = value;
+}
+function $6ed0406888f73fc4$export$43e446d32b3d21af() {
+    for(var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++){
+        refs[_key] = arguments[_key];
+    }
+    return function(node) {
+        return refs.forEach(function(ref) {
+            return $6ed0406888f73fc4$var$setRef(ref, node);
+        });
+    };
+}
+// node_modules/@radix-ui/react-slot/dist/index.mjs
+var $5e63c961fc1ce211$export$8c6ed5c666ac1360 = /* @__PURE__ */ (0, import_react20.forwardRef)(function(props, forwardedRef) {
+    var children = props.children, slotProps = _object_without_properties(props, [
+        "children"
+    ]);
+    var childrenArray = import_react20.Children.toArray(children);
+    var slottable = childrenArray.find($5e63c961fc1ce211$var$isSlottable);
+    if (slottable) {
+        var newElement = slottable.props.children;
+        var newChildren = childrenArray.map(function(child) {
+            if (child === slottable) {
+                if (import_react20.Children.count(newElement) > 1) return import_react20.Children.only(null);
+                return /* @__PURE__ */ (0, import_react20.isValidElement)(newElement) ? newElement.props.children : null;
+            } else return child;
+        });
+        return /* @__PURE__ */ (0, import_react20.createElement)($5e63c961fc1ce211$var$SlotClone, _extends1({}, slotProps, {
+            ref: forwardedRef
+        }), /* @__PURE__ */ (0, import_react20.isValidElement)(newElement) ? /* @__PURE__ */ (0, import_react20.cloneElement)(newElement, void 0, newChildren) : null);
+    }
+    return /* @__PURE__ */ (0, import_react20.createElement)($5e63c961fc1ce211$var$SlotClone, _extends1({}, slotProps, {
+        ref: forwardedRef
+    }), children);
+});
+$5e63c961fc1ce211$export$8c6ed5c666ac1360.displayName = "Slot";
+var $5e63c961fc1ce211$var$SlotClone = /* @__PURE__ */ (0, import_react20.forwardRef)(function(props, forwardedRef) {
+    var children = props.children, slotProps = _object_without_properties(props, [
+        "children"
+    ]);
+    if (/* @__PURE__ */ (0, import_react20.isValidElement)(children)) return /* @__PURE__ */ (0, import_react20.cloneElement)(children, _object_spread_props(_object_spread({}, $5e63c961fc1ce211$var$mergeProps(slotProps, children.props)), {
+        ref: forwardedRef ? $6ed0406888f73fc4$export$43e446d32b3d21af(forwardedRef, children.ref) : children.ref
+    }));
+    return import_react20.Children.count(children) > 1 ? import_react20.Children.only(null) : null;
+});
+$5e63c961fc1ce211$var$SlotClone.displayName = "SlotClone";
+var $5e63c961fc1ce211$export$d9f1ccf0bdb05d45 = function(param) {
+    var children = param.children;
+    return /* @__PURE__ */ (0, import_react20.createElement)(import_react20.Fragment, null, children);
+};
+function $5e63c961fc1ce211$var$isSlottable(child) {
+    return /* @__PURE__ */ (0, import_react20.isValidElement)(child) && child.type === $5e63c961fc1ce211$export$d9f1ccf0bdb05d45;
+}
+function $5e63c961fc1ce211$var$mergeProps(slotProps, childProps) {
+    var _loop = function(propName) {
+        var slotPropValue = slotProps[propName];
+        var childPropValue = childProps[propName];
+        var isHandler = /^on[A-Z]/.test(propName);
+        if (isHandler) {
+            if (slotPropValue && childPropValue) overrideProps[propName] = function() {
+                for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
+                    args[_key] = arguments[_key];
+                }
+                childPropValue.apply(void 0, _to_consumable_array(args));
+                slotPropValue.apply(void 0, _to_consumable_array(args));
+            };
+            else if (slotPropValue) overrideProps[propName] = slotPropValue;
+        } else if (propName === "style") overrideProps[propName] = _object_spread({}, slotPropValue, childPropValue);
+        else if (propName === "className") overrideProps[propName] = [
+            slotPropValue,
+            childPropValue
+        ].filter(Boolean).join(" ");
+    };
+    var overrideProps = _object_spread({}, childProps);
+    for(var propName in childProps)_loop(propName);
+    return _object_spread({}, slotProps, overrideProps);
+}
+// node_modules/@radix-ui/react-primitive/dist/index.mjs
+var $8927f6f2acc4f386$var$NODES = [
+    "a",
+    "button",
+    "div",
+    "form",
+    "h2",
+    "h3",
+    "img",
+    "input",
+    "label",
+    "li",
+    "nav",
+    "ol",
+    "p",
+    "span",
+    "svg",
+    "ul"
+];
+var $8927f6f2acc4f386$export$250ffa63cdc0d034 = $8927f6f2acc4f386$var$NODES.reduce(function(primitive, node) {
+    var Node = /* @__PURE__ */ (0, import_react21.forwardRef)(function(props, forwardedRef) {
+        var asChild = props.asChild, primitiveProps = _object_without_properties(props, [
+            "asChild"
+        ]);
+        var Comp = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : node;
+        (0, import_react21.useEffect)(function() {
+            window[Symbol.for("radix-ui")] = true;
+        }, []);
+        return /* @__PURE__ */ (0, import_react21.createElement)(Comp, _extends1({}, primitiveProps, {
+            ref: forwardedRef
+        }));
+    });
+    Node.displayName = "Primitive.".concat(node);
+    return _object_spread_props(_object_spread({}, primitive), _define_property({}, node, Node));
+}, {});
+// node_modules/@radix-ui/react-separator/dist/index.mjs
+var $89eedd556c436f6a$var$DEFAULT_ORIENTATION = "horizontal";
+var $89eedd556c436f6a$var$ORIENTATIONS = [
+    "horizontal",
+    "vertical"
+];
+var $89eedd556c436f6a$export$1ff3c3f08ae963c0 = /* @__PURE__ */ (0, import_react22.forwardRef)(function(props, forwardedRef) {
+    var decorative = props.decorative, tmp = props.orientation, orientationProp = tmp === void 0 ? $89eedd556c436f6a$var$DEFAULT_ORIENTATION : tmp, domProps = _object_without_properties(props, [
+        "decorative",
+        "orientation"
+    ]);
+    var orientation = $89eedd556c436f6a$var$isValidOrientation(orientationProp) ? orientationProp : $89eedd556c436f6a$var$DEFAULT_ORIENTATION;
+    var ariaOrientation = orientation === "vertical" ? orientation : void 0;
+    var semanticProps = decorative ? {
+        role: "none"
+    } : {
+        "aria-orientation": ariaOrientation,
+        role: "separator"
+    };
+    return /* @__PURE__ */ (0, import_react22.createElement)($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends1({
+        "data-orientation": orientation
+    }, semanticProps, domProps, {
+        ref: forwardedRef
+    }));
+});
+$89eedd556c436f6a$export$1ff3c3f08ae963c0.propTypes = {
+    orientation: function orientation(props, propName, componentName) {
+        var propValue = props[propName];
+        var strVal = String(propValue);
+        if (propValue && !$89eedd556c436f6a$var$isValidOrientation(propValue)) return new Error($89eedd556c436f6a$var$getInvalidOrientationError(strVal, componentName));
+        return null;
+    }
+};
+function $89eedd556c436f6a$var$getInvalidOrientationError(value, componentName) {
+    return "Invalid prop `orientation` of value `".concat(value, "` supplied to `").concat(componentName, "`, expected one of:\n  - horizontal\n  - vertical\n\nDefaulting to `").concat($89eedd556c436f6a$var$DEFAULT_ORIENTATION, "`.");
+}
+function $89eedd556c436f6a$var$isValidOrientation(orientation) {
+    return $89eedd556c436f6a$var$ORIENTATIONS.includes(orientation);
+}
+var $89eedd556c436f6a$export$be92b6f5f03c0fe9 = $89eedd556c436f6a$export$1ff3c3f08ae963c0;
+// components/elements/Separator.tsx
+var Separator2 = React30.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 React30.createElement($89eedd556c436f6a$export$be92b6f5f03c0fe9, _object_spread({
+        ref: ref,
+        decorative: decorative,
+        orientation: orientation,
+        className: cn("hawa-shrink-0 hawa-bg-border", orientation === "horizontal" ? "hawa-h-[1px] hawa-w-full" : "hawa-h-full hawa-w-[1px]", className)
+    }, props));
+});
+Separator2.displayName = $89eedd556c436f6a$export$be92b6f5f03c0fe9.displayName;
+// components/elements/Progress.tsx
+var React31 = __toESM(require("react"));
+var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"));
+var Progress = React31.forwardRef(function(_param, ref) /* @__PURE__ */ {
+    var className = _param.className, value = _param.value, props = _object_without_properties(_param, [
+        "className",
+        "value"
+    ]);
+    return React31.createElement(ProgressPrimitive.Root, _object_spread({
+        ref: ref,
+        className: cn("hawa-relative hawa-h-4 hawa-w-full hawa-overflow-hidden hawa-rounded hawa-bg-secondary", className)
+    }, props), /* @__PURE__ */ React31.createElement(ProgressPrimitive.Indicator, {
+        className: "hawa-h-full hawa-w-full hawa-flex-1 hawa-bg-primary hawa-transition-all",
+        style: {
+            transform: "translateX(-".concat(100 - (value || 0), "%)")
+        }
+    }));
+});
+Progress.displayName = ProgressPrimitive.Root.displayName;
 // components/elements/BackToTop.tsx
-var import_react19 = __toESM(require("react"));
+var import_react23 = __toESM(require("react"));
 var import_clsx8 = require("clsx");
 var BackToTop = function(_param) {
     var props = _extends({}, _object_destructuring_empty(_param));
-    var _ref = _sliced_to_array((0, import_react19.useState)(false), 2), visible = _ref[0], setVisible = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react19.useState)(null), 2), rect = _ref1[0], _setRect = _ref1[1];
-    var self = (0, import_react19.useRef)(null);
-    var _rect = (0, import_react19.useRef)(rect);
+    var _ref = _sliced_to_array((0, import_react23.useState)(false), 2), visible = _ref[0], setVisible = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react23.useState)(null), 2), rect = _ref1[0], _setRect = _ref1[1];
+    var self = (0, import_react23.useRef)(null);
+    var _rect = (0, import_react23.useRef)(rect);
     var setRect = function(data) {
         _rect.current = data;
         _setRect(data);
@@ -4140,7 +4399,7 @@ var BackToTop = function(_param) {
             });
         }
     };
-    (0, import_react19.useEffect)(function() {
+    (0, import_react23.useEffect)(function() {
         if (!props.anchor.current) return;
         props.anchor.current.addEventListener("scroll", onScroll);
         var interval = setInterval(function() {
@@ -4172,7 +4431,7 @@ var BackToTop = function(_param) {
         };
         return style;
     };
-    return /* @__PURE__ */ import_react19.default.createElement(Button, {
+    return /* @__PURE__ */ import_react23.default.createElement(Button, {
         className: cn("hawa-fixed hawa-cursor-pointer hawa-rounded hawa-transition-all", visible ? "hawa-pointer-events-all hawa-opacity-100" : "hawa-pointer-events-none hawa-opacity-0"),
         onClick: backToTop,
         style: _object_spread_props(_object_spread({}, getStyles()), {
@@ -4180,113 +4439,113 @@ var BackToTop = function(_param) {
         }),
         ref: self,
         size: "icon"
-    }, /* @__PURE__ */ import_react19.default.createElement("svg", {
+    }, /* @__PURE__ */ import_react23.default.createElement("svg", {
         className: (0, import_clsx8.clsx)("hawa-h-6 hawa-w-6 hawa-shrink-0 hawa-rotate-180 hawa-transition-all  disabled:hawa-bg-gray-200"),
         "aria-label": "Arrow Icon",
         viewBox: "0 0 20 20",
         fill: "currentColor"
-    }, /* @__PURE__ */ import_react19.default.createElement("path", {
+    }, /* @__PURE__ */ import_react23.default.createElement("path", {
         d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
     })));
 };
 // components/elements/Tabs.tsx
-var React31 = __toESM(require("react"));
+var React33 = __toESM(require("react"));
 var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"));
-var TabsContext = React31.createContext({
+var TabsContext = React33.createContext({
     orientation: "vertical"
 });
-var Tabs = React31.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var Tabs = React33.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, orientation = _param.orientation, props = _object_without_properties(_param, [
         "className",
         "orientation"
     ]);
-    return React31.createElement(TabsPrimitive.Root, _object_spread({
+    return React33.createElement(TabsPrimitive.Root, _object_spread({
         ref: ref,
         className: cn("hawa-flex hawa-gap-2", orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col", className)
-    }, props), /* @__PURE__ */ React31.createElement(TabsContext.Provider, {
+    }, props), /* @__PURE__ */ React33.createElement(TabsContext.Provider, {
         value: {
             orientation: orientation
         }
     }, props.children));
 });
 Tabs.displayName = TabsPrimitive.Root.displayName;
-var TabsList = React31.forwardRef(function(_param, ref) {
+var TabsList = React33.forwardRef(function(_param, ref) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    var orientation = React31.useContext(TabsContext).orientation;
+    var orientation = React33.useContext(TabsContext).orientation;
     console.log("orient ", orientation);
-    return /* @__PURE__ */ React31.createElement(TabsPrimitive.List, _object_spread({
+    return /* @__PURE__ */ React33.createElement(TabsPrimitive.List, _object_spread({
         ref: ref,
         className: cn("hawa-flex hawa-w-fit hawa-flex-wrap hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground  dark:hawa-border-primary/10", orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row", className)
     }, props));
 });
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React31.forwardRef(function(_param, ref) {
+var TabsTrigger = React33.forwardRef(function(_param, ref) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return /* @__PURE__ */ React31.createElement(TabsPrimitive.Trigger, _object_spread({
+    return /* @__PURE__ */ React33.createElement(TabsPrimitive.Trigger, _object_spread({
         ref: ref,
         className: cn("hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-whitespace-nowrap hawa-rounded hawa-border hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground data-[state=active]:hawa-shadow-sm  dark:hawa-border-primary/10", className)
     }, props));
 });
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React31.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var TabsContent = React33.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React31.createElement(TabsPrimitive.Content, _object_spread({
+    return React33.createElement(TabsPrimitive.Content, _object_spread({
         ref: ref,
         className: cn("hawa-w-full hawa-ring-offset-hawa-background focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2", className)
     }, props));
 });
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 // components/elements/ScrollArea.tsx
-var React32 = __toESM(require("react"));
+var React34 = __toESM(require("react"));
 var ScrollAreaPrimitive = __toESM(require("@radix-ui/react-scroll-area"));
-var ScrollArea = React32.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ScrollArea = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, children = _param.children, _param_orientation = _param.orientation, orientation = _param_orientation === void 0 ? "vertical" : _param_orientation, props = _object_without_properties(_param, [
         "className",
         "children",
         "orientation"
     ]);
-    return React32.createElement(ScrollAreaPrimitive.Root, _object_spread({
+    return React34.createElement(ScrollAreaPrimitive.Root, _object_spread({
         ref: ref,
         className: cn("hawa-relative hawa-overflow-hidden", className)
-    }, props), /* @__PURE__ */ React32.createElement(ScrollAreaPrimitive.Viewport, {
+    }, props), /* @__PURE__ */ React34.createElement(ScrollAreaPrimitive.Viewport, {
         className: "hawa-h-full hawa-w-full hawa-rounded-[inherit]"
-    }, children), /* @__PURE__ */ React32.createElement(ScrollBar, {
+    }, children), /* @__PURE__ */ React34.createElement(ScrollBar, {
         orientation: orientation
-    }), /* @__PURE__ */ React32.createElement(ScrollAreaPrimitive.Corner, null));
+    }), /* @__PURE__ */ React34.createElement(ScrollAreaPrimitive.Corner, null));
 });
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React32.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var ScrollBar = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, _param_orientation = _param.orientation, orientation = _param_orientation === void 0 ? "vertical" : _param_orientation, props = _object_without_properties(_param, [
         "className",
         "orientation"
     ]);
-    return React32.createElement(ScrollAreaPrimitive.ScrollAreaScrollbar, _object_spread({
+    return React34.createElement(ScrollAreaPrimitive.ScrollAreaScrollbar, _object_spread({
         ref: ref,
         orientation: orientation,
         className: cn("hawa-flex hawa-touch-none hawa-select-none hawa-transition-colors", orientation === "vertical" && "hawa-h-full hawa-w-2.5 hawa-border-l hawa-border-l-transparent hawa-p-[1px]", orientation === "horizontal" && "hawa-h-2.5 hawa-border-t hawa-border-t-transparent hawa-p-[1px]", className)
-    }, props), /* @__PURE__ */ React32.createElement(ScrollAreaPrimitive.ScrollAreaThumb, {
+    }, props), /* @__PURE__ */ React34.createElement(ScrollAreaPrimitive.ScrollAreaThumb, {
         className: cn("hawa-relative hawa-rounded-full hawa-bg-border", orientation === "vertical" && "hawa-flex-1")
     }));
 });
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 // components/elements/Logos.tsx
-var import_react20 = __toESM(require("react"));
+var import_react24 = __toESM(require("react"));
 var Logos = {
     logo: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             xmlns: "http://www.w3.org/2000/svg",
             viewBox: "0 0 256 256"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("rect", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("rect", {
             width: "256",
             height: "256",
             fill: "none"
-        }), /* @__PURE__ */ import_react20.default.createElement("line", {
+        }), /* @__PURE__ */ import_react24.default.createElement("line", {
             x1: "208",
             y1: "128",
             x2: "128",
@@ -4296,7 +4555,7 @@ var Logos = {
             strokeLinecap: "round",
             strokeLinejoin: "round",
             strokeWidth: "16"
-        }), /* @__PURE__ */ import_react20.default.createElement("line", {
+        }), /* @__PURE__ */ import_react24.default.createElement("line", {
             x1: "192",
             y1: "40",
             x2: "40",
@@ -4309,7 +4568,7 @@ var Logos = {
         }));
     },
     mail: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             stroke: "currentColor",
             fill: "none",
             "stroke-width": "2",
@@ -4319,14 +4578,14 @@ var Logos = {
             height: "1em",
             width: "1em",
             xmlns: "http://www.w3.org/2000/svg"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"
-        }), /* @__PURE__ */ import_react20.default.createElement("polyline", {
+        }), /* @__PURE__ */ import_react24.default.createElement("polyline", {
             points: "22,6 12,13 2,6"
         }));
     },
     phone: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             stroke: "currentColor",
             fill: "none",
             "stroke-width": "2",
@@ -4335,131 +4594,131 @@ var Logos = {
             height: "1em",
             width: "1em",
             xmlns: "http://www.w3.org/2000/svg"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             "stroke-linecap": "round",
             "stroke-linejoin": "round",
             d: "M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"
         }));
     },
     twitter: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             xmlns: "http://www.w3.org/2000/svg",
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             fill: "currentColor",
             d: "M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148a13.98 13.98 0 0 0 10.15 5.144 4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z"
         }));
     },
     microsoft: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             xmlns: "http://www.w3.org/2000/svg",
             viewBox: "0 0 20 20"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             fill: "currentColor",
             d: "M7.462 0H0v7.19h7.462V0zM16 0H8.538v7.19H16V0zM7.462 8.211H0V16h7.462V8.211zm8.538 0H8.538V16H16V8.211z"
         }));
     },
     gitHub: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 438.549 438.549"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             fill: "currentColor",
             d: "M409.132 114.573c-19.608-33.596-46.205-60.194-79.798-79.8-33.598-19.607-70.277-29.408-110.063-29.408-39.781 0-76.472 9.804-110.063 29.408-33.596 19.605-60.192 46.204-79.8 79.8C9.803 148.168 0 184.854 0 224.63c0 47.78 13.94 90.745 41.827 128.906 27.884 38.164 63.906 64.572 108.063 79.227 5.14.954 8.945.283 11.419-1.996 2.475-2.282 3.711-5.14 3.711-8.562 0-.571-.049-5.708-.144-15.417a2549.81 2549.81 0 01-.144-25.406l-6.567 1.136c-4.187.767-9.469 1.092-15.846 1-6.374-.089-12.991-.757-19.842-1.999-6.854-1.231-13.229-4.086-19.13-8.559-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-.951-2.568-2.098-3.711-3.429-1.142-1.331-1.997-2.663-2.568-3.997-.572-1.335-.098-2.43 1.427-3.289 1.525-.859 4.281-1.276 8.28-1.276l5.708.853c3.807.763 8.516 3.042 14.133 6.851 5.614 3.806 10.229 8.754 13.846 14.842 4.38 7.806 9.657 13.754 15.846 17.847 6.184 4.093 12.419 6.136 18.699 6.136 6.28 0 11.704-.476 16.274-1.423 4.565-.952 8.848-2.383 12.847-4.285 1.713-12.758 6.377-22.559 13.988-29.41-10.848-1.14-20.601-2.857-29.264-5.14-8.658-2.286-17.605-5.996-26.835-11.14-9.235-5.137-16.896-11.516-22.985-19.126-6.09-7.614-11.088-17.61-14.987-29.979-3.901-12.374-5.852-26.648-5.852-42.826 0-23.035 7.52-42.637 22.557-58.817-7.044-17.318-6.379-36.732 1.997-58.24 5.52-1.715 13.706-.428 24.554 3.853 10.85 4.283 18.794 7.952 23.84 10.994 5.046 3.041 9.089 5.618 12.135 7.708 17.705-4.947 35.976-7.421 54.818-7.421s37.117 2.474 54.823 7.421l10.849-6.849c7.419-4.57 16.18-8.758 26.262-12.565 10.088-3.805 17.802-4.853 23.134-3.138 8.562 21.509 9.325 40.922 2.279 58.24 15.036 16.18 22.559 35.787 22.559 58.817 0 16.178-1.958 30.497-5.853 42.966-3.9 12.471-8.941 22.457-15.125 29.979-6.191 7.521-13.901 13.85-23.131 18.986-9.232 5.14-18.182 8.85-26.84 11.136-8.662 2.286-18.415 4.004-29.263 5.146 9.894 8.562 14.842 22.077 14.842 40.539v60.237c0 3.422 1.19 6.279 3.572 8.562 2.379 2.279 6.136 2.95 11.276 1.995 44.163-14.653 80.185-41.062 108.068-79.226 27.88-38.161 41.825-81.126 41.825-128.906-.01-39.771-9.818-76.454-29.414-110.049z"
         }));
     },
     radix: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 25 25",
             fill: "none"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M12 25C7.58173 25 4 21.4183 4 17C4 12.5817 7.58173 9 12 9V25Z",
             fill: "currentcolor"
-        }), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M12 0H4V8H12V0Z",
             fill: "currentcolor"
-        }), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M17 8C19.2091 8 21 6.20914 21 4C21 1.79086 19.2091 0 17 0C14.7909 0 13 1.79086 13 4C13 6.20914 14.7909 8 17 8Z",
             fill: "currentcolor"
         }));
     },
     aria: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             role: "img",
             viewBox: "0 0 24 24",
             fill: "currentColor"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M13.966 22.624l-1.69-4.281H8.122l3.892-9.144 5.662 13.425zM8.884 1.376H0v21.248zm15.116 0h-8.884L24 22.624Z"
         }));
     },
     npm: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z",
             fill: "currentColor"
         }));
     },
     yarn: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M12 0C5.375 0 0 5.375 0 12s5.375 12 12 12 12-5.375 12-12S18.625 0 12 0zm.768 4.105c.183 0 .363.053.525.157.125.083.287.185.755 1.154.31-.088.468-.042.551-.019.204.056.366.19.463.375.477.917.542 2.553.334 3.605-.241 1.232-.755 2.029-1.131 2.576.324.329.778.899 1.117 1.825.278.774.31 1.478.273 2.015a5.51 5.51 0 0 0 .602-.329c.593-.366 1.487-.917 2.553-.931.714-.009 1.269.445 1.353 1.103a1.23 1.23 0 0 1-.945 1.362c-.649.158-.95.278-1.821.843-1.232.797-2.539 1.242-3.012 1.39a1.686 1.686 0 0 1-.704.343c-.737.181-3.266.315-3.466.315h-.046c-.783 0-1.214-.241-1.45-.491-.658.329-1.51.19-2.122-.134a1.078 1.078 0 0 1-.58-1.153 1.243 1.243 0 0 1-.153-.195c-.162-.25-.528-.936-.454-1.946.056-.723.556-1.367.88-1.71a5.522 5.522 0 0 1 .408-2.256c.306-.727.885-1.348 1.32-1.737-.32-.537-.644-1.367-.329-2.21.227-.602.412-.936.82-1.08h-.005c.199-.074.389-.153.486-.259a3.418 3.418 0 0 1 2.298-1.103c.037-.093.079-.185.125-.283.31-.658.639-1.029 1.024-1.168a.94.94 0 0 1 .328-.06zm.006.7c-.507.016-1.001 1.519-1.001 1.519s-1.27-.204-2.266.871c-.199.218-.468.334-.746.44-.079.028-.176.023-.417.672-.371.991.625 2.094.625 2.094s-1.186.839-1.626 1.881c-.486 1.144-.338 2.261-.338 2.261s-.843.732-.899 1.487c-.051.663.139 1.2.343 1.515.227.343.51.176.51.176s-.561.653-.037.931c.477.25 1.283.394 1.71-.037.31-.31.371-1.001.486-1.283.028-.065.12.111.209.199.097.093.264.195.264.195s-.755.324-.445 1.066c.102.246.468.403 1.066.398.222-.005 2.664-.139 3.313-.296.375-.088.505-.283.505-.283s1.566-.431 2.998-1.357c.917-.598 1.293-.76 2.034-.936.612-.148.57-1.098-.241-1.084-.839.009-1.575.44-2.196.825-1.163.718-1.742.672-1.742.672l-.018-.032c-.079-.13.371-1.293-.134-2.678-.547-1.515-1.413-1.881-1.344-1.997.297-.5 1.038-1.297 1.334-2.78.176-.899.13-2.377-.269-3.151-.074-.144-.732.241-.732.241s-.616-1.371-.788-1.483a.271.271 0 0 0-.157-.046z",
             fill: "currentColor"
         }));
     },
     pnpm: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M0 0v7.5h7.5V0zm8.25 0v7.5h7.498V0zm8.25 0v7.5H24V0zM8.25 8.25v7.5h7.498v-7.5zm8.25 0v7.5H24v-7.5zM0 16.5V24h7.5v-7.5zm8.25 0V24h7.498v-7.5zm8.25 0V24H24v-7.5z",
             fill: "currentColor"
         }));
     },
     react: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z",
             fill: "currentColor"
         }));
     },
     tailwind: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M12.001,4.8c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 C13.666,10.618,15.027,12,18.001,12c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C16.337,6.182,14.976,4.8,12.001,4.8z M6.001,12c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 c1.177,1.194,2.538,2.576,5.512,2.576c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C10.337,13.382,8.976,12,6.001,12z",
             fill: "currentColor"
         }));
     },
     google: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             role: "img",
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             fill: "currentColor",
             d: "M12.48 10.92v3.28h7.84c-.24 1.84-.853 3.187-1.787 4.133-1.147 1.147-2.933 2.4-6.053 2.4-4.827 0-8.6-3.893-8.6-8.72s3.773-8.72 8.6-8.72c2.6 0 4.507 1.027 5.907 2.347l2.307-2.307C18.747 1.44 16.133 0 12.48 0 5.867 0 .307 5.387.307 12s5.56 12 12.173 12c3.573 0 6.267-1.173 8.373-3.36 2.16-2.16 2.84-5.213 2.84-7.667 0-.76-.053-1.467-.173-2.053H12.48z"
         }));
     },
     apple: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             role: "img",
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M12.152 6.896c-.948 0-2.415-1.078-3.96-1.04-2.04.027-3.91 1.183-4.961 3.014-2.117 3.675-.546 9.103 1.519 12.09 1.013 1.454 2.208 3.09 3.792 3.039 1.52-.065 2.09-.987 3.935-.987 1.831 0 2.35.987 3.96.948 1.637-.026 2.676-1.48 3.676-2.948 1.156-1.688 1.636-3.325 1.662-3.415-.039-.013-3.182-1.221-3.22-4.857-.026-3.04 2.48-4.494 2.597-4.559-1.429-2.09-3.623-2.324-4.39-2.376-2-.156-3.675 1.09-4.61 1.09zM15.53 3.83c.843-1.012 1.4-2.427 1.245-3.83-1.207.052-2.662.805-3.532 1.818-.78.896-1.454 2.338-1.273 3.714 1.338.104 2.715-.688 3.559-1.701",
             fill: "currentColor"
         }));
     },
     paypal: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             role: "img",
             viewBox: "0 0 24 24"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M7.076 21.337H2.47a.641.641 0 0 1-.633-.74L4.944.901C5.026.382 5.474 0 5.998 0h7.46c2.57 0 4.578.543 5.69 1.81 1.01 1.15 1.304 2.42 1.012 4.287-.023.143-.047.288-.077.437-.983 5.05-4.349 6.797-8.647 6.797h-2.19c-.524 0-.968.382-1.05.9l-1.12 7.106zm14.146-14.42a3.35 3.35 0 0 0-.607-.541c-.013.076-.026.175-.041.254-.93 4.778-4.005 7.201-9.138 7.201h-2.19a.563.563 0 0 0-.556.479l-1.187 7.527h-.506l-.24 1.516a.56.56 0 0 0 .554.647h3.882c.46 0 .85-.334.922-.788.06-.26.76-4.852.816-5.09a.932.932 0 0 1 .923-.788h.58c3.76 0 6.705-1.528 7.565-5.946.36-1.847.174-3.388-.777-4.471z",
             fill: "currentColor"
         }));
     },
     spinner: function(props) {
-        return /* @__PURE__ */ import_react20.default.createElement("svg", _object_spread({
+        return /* @__PURE__ */ import_react24.default.createElement("svg", _object_spread({
             xmlns: "http://www.w3.org/2000/svg",
             width: "24",
             height: "24",
@@ -4469,20 +4728,20 @@ var Logos = {
             strokeWidth: "2",
             strokeLinecap: "round",
             strokeLinejoin: "round"
-        }, props), /* @__PURE__ */ import_react20.default.createElement("path", {
+        }, props), /* @__PURE__ */ import_react24.default.createElement("path", {
             d: "M21 12a9 9 0 1 1-6.219-8.56"
         }));
     }
 };
 // components/elements/Command.tsx
-var React34 = __toESM(require("react"));
+var React36 = __toESM(require("react"));
 var import_cmdk = require("cmdk");
 var import_lucide_react = require("lucide-react");
-var Command = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var Command = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement(import_cmdk.Command, _object_spread({
+    return React36.createElement(import_cmdk.Command, _object_spread({
         ref: ref,
         className: cn("hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-overflow-hidden hawa-rounded-md hawa-bg-popover hawa-text-popover-foreground", className)
     }, props));
@@ -4492,69 +4751,69 @@ var CommandDialog = function(_param) {
     var children = _param.children, props = _object_without_properties(_param, [
         "children"
     ]);
-    return /* @__PURE__ */ React34.createElement(Dialog, _object_spread({}, props), /* @__PURE__ */ React34.createElement(DialogContent, {
+    return /* @__PURE__ */ React36.createElement(Dialog, _object_spread({}, props), /* @__PURE__ */ React36.createElement(DialogContent, {
         className: "hawa-overflow-hidden hawa-p-0 hawa-shadow-lg"
-    }, /* @__PURE__ */ React34.createElement(Command, {
+    }, /* @__PURE__ */ React36.createElement(Command, {
         className: "[&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:hawa-pt-0 [&_[cmdk-group]]:hawa-px-2 [&_[cmdk-input-wrapper]_svg]:hawa-h-5 [&_[cmdk-input-wrapper]_svg]:hawa-w-5 [&_[cmdk-input]]:hawa-h-12 [&_[cmdk-item]]:hawa-px-2 [&_[cmdk-item]]:hawa-py-3 [&_[cmdk-item]_svg]:hawa-h-5 [&_[cmdk-item]_svg]:hawa-w-5"
     }, children)));
 };
-var CommandInput = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var CommandInput = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement("div", {
+    return React36.createElement("div", {
         className: "hawa-flex hawa-items-center hawa-border-b hawa-px-3",
         "cmdk-input-wrapper": ""
-    }, /* @__PURE__ */ React34.createElement(import_lucide_react.Search, {
+    }, /* @__PURE__ */ React36.createElement(import_lucide_react.Search, {
         className: "hawa-mr-2 hawa-h-4 hawa-w-4 hawa-shrink-0 hawa-opacity-50"
-    }), /* @__PURE__ */ React34.createElement(import_cmdk.Command.Input, _object_spread({
+    }), /* @__PURE__ */ React36.createElement(import_cmdk.Command.Input, _object_spread({
         ref: ref,
         className: cn("hawa-flex hawa-h-11 hawa-w-full hawa-rounded-md hawa-bg-transparent hawa-py-3 hawa-text-sm hawa-outline-none placeholder:hawa-text-muted-foreground disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50", className)
     }, props)));
 });
 CommandInput.displayName = import_cmdk.Command.Input.displayName;
-var CommandList = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var CommandList = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement(import_cmdk.Command.List, _object_spread({
+    return React36.createElement(import_cmdk.Command.List, _object_spread({
         ref: ref,
         className: cn("hawa-max-h-[300px] hawa-overflow-y-auto hawa-overflow-x-hidden", className)
     }, props));
 });
 CommandList.displayName = import_cmdk.Command.List.displayName;
-var CommandEmpty = React34.forwardRef(function(props, ref) {
-    return /* @__PURE__ */ React34.createElement(import_cmdk.Command.Empty, _object_spread({
+var CommandEmpty = React36.forwardRef(function(props, ref) {
+    return /* @__PURE__ */ React36.createElement(import_cmdk.Command.Empty, _object_spread({
         ref: ref,
         className: "hawa-py-6 hawa-text-center hawa-text-sm"
     }, props));
 });
 CommandEmpty.displayName = import_cmdk.Command.Empty.displayName;
-var CommandGroup = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var CommandGroup = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement(import_cmdk.Command.Group, _object_spread({
+    return React36.createElement(import_cmdk.Command.Group, _object_spread({
         ref: ref,
         className: cn("hawa-overflow-hidden hawa-p-1 hawa-text-foreground [&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-py-1.5 [&_[cmdk-group-heading]]:hawa-text-xs [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground", className)
     }, props));
 });
 CommandGroup.displayName = import_cmdk.Command.Group.displayName;
-var CommandSeparator = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var CommandSeparator = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement(import_cmdk.Command.Separator, _object_spread({
+    return React36.createElement(import_cmdk.Command.Separator, _object_spread({
         ref: ref,
         className: cn("hawa--mx-1 hawa-h-px hawa-bg-border", className)
     }, props));
 });
 CommandSeparator.displayName = import_cmdk.Command.Separator.displayName;
-var CommandItem = React34.forwardRef(function(_param, ref) /* @__PURE__ */ {
+var CommandItem = React36.forwardRef(function(_param, ref) /* @__PURE__ */ {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return React34.createElement(import_cmdk.Command.Item, _object_spread({
+    return React36.createElement(import_cmdk.Command.Item, _object_spread({
         ref: ref,
         className: cn("hawa-relative hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-rounded-sm hawa-px-2 hawa-py-1.5 hawa-text-sm hawa-outline-none aria-selected:hawa-bg-accent aria-selected:hawa-text-accent-foreground data-[disabled]:hawa-pointer-events-none data-[disabled]:hawa-opacity-50", className)
     }, props));
@@ -4564,11 +4823,242 @@ var CommandShortcut = function(_param) {
     var className = _param.className, props = _object_without_properties(_param, [
         "className"
     ]);
-    return /* @__PURE__ */ React34.createElement("span", _object_spread({
+    return /* @__PURE__ */ React36.createElement("span", _object_spread({
         className: cn("hawa-ml-auto hawa-text-xs hawa-tracking-widest hawa-text-muted-foreground", className)
     }, props));
 };
 CommandShortcut.displayName = "CommandShortcut";
+// components/elements/Combobox.tsx
+var React37 = __toESM(require("react"));
+var import_lucide_react2 = require("lucide-react");
+var PopoverPrimitive2 = __toESM(require("@radix-ui/react-popover"));
+var frameworks = [
+    {
+        value: "next.js",
+        label: "Next.js"
+    },
+    {
+        value: "sveltekit",
+        label: "SvelteKit"
+    },
+    {
+        value: "nuxt.js",
+        label: "Nuxt.js"
+    },
+    {
+        value: "remix",
+        label: "Remix"
+    },
+    {
+        value: "astro",
+        label: "Astro"
+    }
+];
+function Combobox() {
+    var _frameworks_find;
+    var _React37_useState = _sliced_to_array(React37.useState(false), 2), open = _React37_useState[0], setOpen = _React37_useState[1];
+    var _React37_useState1 = _sliced_to_array(React37.useState(""), 2), value = _React37_useState1[0], setValue = _React37_useState1[1];
+    return /* @__PURE__ */ React37.createElement(PopoverPrimitive2.Root, {
+        open: open,
+        onOpenChange: setOpen
+    }, /* @__PURE__ */ React37.createElement(PopoverTrigger, {
+        asChild: true
+    }, /* @__PURE__ */ React37.createElement(Button, {
+        variant: "outline",
+        role: "combobox",
+        "aria-expanded": open,
+        className: "hawa-w-[200px] hawa-justify-between"
+    }, value ? (_frameworks_find = frameworks.find(function(framework) {
+        return framework.value === value;
+    })) === null || _frameworks_find === void 0 ? void 0 : _frameworks_find.label : "Select framework...", /* @__PURE__ */ React37.createElement(import_lucide_react2.ChevronsUpDown, {
+        className: "hawa-ml-2 hawa-h-4 hawa-w-4 hawa-shrink-0 hawa-opacity-50"
+    }))), /* @__PURE__ */ React37.createElement(PopoverContent, {
+        className: "hawa-w-[200px] hawa-p-0"
+    }, /* @__PURE__ */ React37.createElement(Command, null, /* @__PURE__ */ React37.createElement(CommandInput, {
+        placeholder: "Search framework..."
+    }), /* @__PURE__ */ React37.createElement(CommandEmpty, null, "No framework found."), /* @__PURE__ */ React37.createElement(CommandGroup, null, frameworks.map(function(framework) {
+        return /* @__PURE__ */ React37.createElement(CommandItem, {
+            key: framework.value,
+            onSelect: function(currentValue) {
+                setValue(currentValue === value ? "" : currentValue);
+                setOpen(false);
+            }
+        }, /* @__PURE__ */ React37.createElement(import_lucide_react2.Check, {
+            className: cn("hawa-mr-2 hawa-h-4 hawa-w-4", value === framework.value ? "hawa-opacity-100" : "hawa-opacity-0")
+        }), framework.label);
+    })))));
+}
+// components/elements/Form.tsx
+var React38 = __toESM(require("react"));
+var import_react_hook_form = require("react-hook-form");
+var Form = import_react_hook_form.FormProvider;
+var FormFieldContext = React38.createContext({});
+var FormField = function(_param) {
+    var props = _extends({}, _object_destructuring_empty(_param));
+    return /* @__PURE__ */ React38.createElement(FormFieldContext.Provider, {
+        value: {
+            name: props.name
+        }
+    }, /* @__PURE__ */ React38.createElement(import_react_hook_form.Controller, _object_spread({}, props)));
+};
+var useFormField = function() {
+    var fieldContext = React38.useContext(FormFieldContext);
+    var itemContext = React38.useContext(FormItemContext);
+    var _ref = (0, import_react_hook_form.useFormContext)(), getFieldState = _ref.getFieldState, formState = _ref.formState;
+    var fieldState = getFieldState(fieldContext.name, formState);
+    if (!fieldContext) {
+        throw new Error("useFormField should be used within <FormField>");
+    }
+    var id = itemContext.id;
+    return _object_spread({
+        id: id,
+        name: fieldContext.name,
+        formItemId: "".concat(id, "-form-item"),
+        formDescriptionId: "".concat(id, "-form-item-description"),
+        formMessageId: "".concat(id, "-form-item-message")
+    }, fieldState);
+};
+var FormItemContext = React38.createContext({});
+var FormItem = React38.forwardRef(function(_param, ref) {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    var id = React38.useId();
+    return /* @__PURE__ */ React38.createElement(FormItemContext.Provider, {
+        value: {
+            id: id
+        }
+    }, /* @__PURE__ */ React38.createElement("div", _object_spread({
+        ref: ref,
+        className: cn("space-y-2", className)
+    }, props)));
+});
+FormItem.displayName = "FormItem";
+var FormLabel = React38.forwardRef(function(_param, ref) {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    var _useFormField = useFormField(), error = _useFormField.error, formItemId = _useFormField.formItemId;
+    return /* @__PURE__ */ React38.createElement(Label, _object_spread({
+        ref: ref,
+        className: cn(error && "text-destructive", className),
+        htmlFor: formItemId
+    }, props));
+});
+FormLabel.displayName = "FormLabel";
+var FormControl = React38.forwardRef(function(_param, ref) {
+    var props = _extends({}, _object_destructuring_empty(_param));
+    var _useFormField = useFormField(), error = _useFormField.error, formItemId = _useFormField.formItemId, formDescriptionId = _useFormField.formDescriptionId, formMessageId = _useFormField.formMessageId;
+    return /* @__PURE__ */ React38.createElement($5e63c961fc1ce211$export$8c6ed5c666ac1360, _object_spread({
+        ref: ref,
+        id: formItemId,
+        "aria-describedby": !error ? "".concat(formDescriptionId) : "".concat(formDescriptionId, " ").concat(formMessageId),
+        "aria-invalid": !!error
+    }, props));
+});
+FormControl.displayName = "FormControl";
+var FormDescription = React38.forwardRef(function(_param, ref) {
+    var className = _param.className, props = _object_without_properties(_param, [
+        "className"
+    ]);
+    var formDescriptionId = useFormField().formDescriptionId;
+    return /* @__PURE__ */ React38.createElement("p", _object_spread({
+        ref: ref,
+        id: formDescriptionId,
+        className: cn("text-sm text-muted-foreground", className)
+    }, props));
+});
+FormDescription.displayName = "FormDescription";
+var FormMessage = React38.forwardRef(function(_param, ref) {
+    var className = _param.className, children = _param.children, props = _object_without_properties(_param, [
+        "className",
+        "children"
+    ]);
+    var _useFormField = useFormField(), error = _useFormField.error, formMessageId = _useFormField.formMessageId;
+    var body = error ? String(error === null || error === void 0 ? void 0 : error.message) : children;
+    if (!body) {
+        return null;
+    }
+    return /* @__PURE__ */ React38.createElement("p", _object_spread({
+        ref: ref,
+        id: formMessageId,
+        className: cn("text-sm font-medium text-destructive", className)
+    }, props), body);
+});
+FormMessage.displayName = "FormMessage";
+// components/elements/InterfaceSettings.tsx
+var import_react25 = __toESM(require("react"));
+var InterfaceSettings = function(_param) {
+    var _param_orientation = _param.orientation, orientation = _param_orientation === void 0 ? "horizontal" : _param_orientation, _param_width = _param.width, width = _param_width === void 0 ? "default" : _param_width, props = _object_without_properties(_param, [
+        "orientation",
+        "width"
+    ]);
+    var _ref = _sliced_to_array((0, import_react25.useState)(props.currentColorMode), 2), color = _ref[0], setColor = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react25.useState)(props.currentLanguage), 2), language = _ref1[0], setLanguage = _ref1[1];
+    var orientationStyle = {
+        horizontal: "hawa-flex hawa-flex-row hawa-justify-between",
+        vertical: "hawa-flex hawa-flex-col hawa-items-center hawa-gap-2"
+    };
+    return /* @__PURE__ */ import_react25.default.createElement("div", {
+        className: cn(orientationStyle[orientation])
+    }, /* @__PURE__ */ import_react25.default.createElement(Radio, {
+        width: width,
+        defaultValue: language,
+        onChangeTab: function(e) {
+            props.handleLanguage(e);
+            setLanguage(e);
+        },
+        design: "tabs",
+        options: [
+            {
+                value: "ar",
+                label: "عربي"
+            },
+            {
+                value: "en",
+                label: "English"
+            }
+        ]
+    }), /* @__PURE__ */ import_react25.default.createElement(Radio, {
+        width: width,
+        defaultValue: color,
+        onChangeTab: function(e) {
+            props.handleColorMode(e);
+            setColor(e);
+        },
+        design: "tabs",
+        options: [
+            {
+                value: "light",
+                label: /* @__PURE__ */ import_react25.default.createElement("svg", {
+                    width: "15",
+                    height: "15",
+                    viewBox: "0 0 15 15",
+                    fill: "none",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    className: "hawa-h-[1.2rem] hawa-w-[1.2rem] hawa-rotate-0 hawa-scale-100 hawa-transition-all dark:hawa--rotate-90"
+                }, /* @__PURE__ */ import_react25.default.createElement("path", {
+                    d: "M7.5 0C7.77614 0 8 0.223858 8 0.5V2.5C8 2.77614 7.77614 3 7.5 3C7.22386 3 7 2.77614 7 2.5V0.5C7 0.223858 7.22386 0 7.5 0ZM2.1967 2.1967C2.39196 2.00144 2.70854 2.00144 2.90381 2.1967L4.31802 3.61091C4.51328 3.80617 4.51328 4.12276 4.31802 4.31802C4.12276 4.51328 3.80617 4.51328 3.61091 4.31802L2.1967 2.90381C2.00144 2.70854 2.00144 2.39196 2.1967 2.1967ZM0.5 7C0.223858 7 0 7.22386 0 7.5C0 7.77614 0.223858 8 0.5 8H2.5C2.77614 8 3 7.77614 3 7.5C3 7.22386 2.77614 7 2.5 7H0.5ZM2.1967 12.8033C2.00144 12.608 2.00144 12.2915 2.1967 12.0962L3.61091 10.682C3.80617 10.4867 4.12276 10.4867 4.31802 10.682C4.51328 10.8772 4.51328 11.1938 4.31802 11.3891L2.90381 12.8033C2.70854 12.9986 2.39196 12.9986 2.1967 12.8033ZM12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8H14.5C14.7761 8 15 7.77614 15 7.5C15 7.22386 14.7761 7 14.5 7H12.5ZM10.682 4.31802C10.4867 4.12276 10.4867 3.80617 10.682 3.61091L12.0962 2.1967C12.2915 2.00144 12.608 2.00144 12.8033 2.1967C12.9986 2.39196 12.9986 2.70854 12.8033 2.90381L11.3891 4.31802C11.1938 4.51328 10.8772 4.51328 10.682 4.31802ZM8 12.5C8 12.2239 7.77614 12 7.5 12C7.22386 12 7 12.2239 7 12.5V14.5C7 14.7761 7.22386 15 7.5 15C7.77614 15 8 14.7761 8 14.5V12.5ZM10.682 10.682C10.8772 10.4867 11.1938 10.4867 11.3891 10.682L12.8033 12.0962C12.9986 12.2915 12.9986 12.608 12.8033 12.8033C12.608 12.9986 12.2915 12.9986 12.0962 12.8033L10.682 11.3891C10.4867 11.1938 10.4867 10.8772 10.682 10.682ZM5.5 7.5C5.5 6.39543 6.39543 5.5 7.5 5.5C8.60457 5.5 9.5 6.39543 9.5 7.5C9.5 8.60457 8.60457 9.5 7.5 9.5C6.39543 9.5 5.5 8.60457 5.5 7.5ZM7.5 4.5C5.84315 4.5 4.5 5.84315 4.5 7.5C4.5 9.15685 5.84315 10.5 7.5 10.5C9.15685 10.5 10.5 9.15685 10.5 7.5C10.5 5.84315 9.15685 4.5 7.5 4.5Z",
+                    fill: "currentColor"
+                }))
+            },
+            {
+                value: "dark",
+                label: /* @__PURE__ */ import_react25.default.createElement("svg", {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    width: "24",
+                    height: "24",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    className: "hawa-h-[1.2rem] hawa-w-[1.2rem]  hawa-transition-all dark:hawa-rotate-0 dark:hawa-scale-100"
+                }, /* @__PURE__ */ import_react25.default.createElement("path", {
+                    d: "M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"
+                }))
+            }
+        ]
+    }));
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
     ActionCard: ActionCard,
@@ -4587,6 +5077,7 @@ CommandShortcut.displayName = "CommandShortcut";
     Chip: Chip,
     CodeBlock: CodeBlock,
     ColorPicker: ColorPicker,
+    Combobox: Combobox,
     Command: Command,
     CommandDialog: CommandDialog,
     CommandEmpty: CommandEmpty,
@@ -4605,7 +5096,15 @@ CommandShortcut.displayName = "CommandShortcut";
     DialogTrigger: DialogTrigger,
     DropdownMenu: DropdownMenu,
     FileDropzone: FileDropzone,
+    Form: Form,
+    FormControl: FormControl,
+    FormDescription: FormDescription,
+    FormField: FormField,
+    FormItem: FormItem,
+    FormLabel: FormLabel,
+    FormMessage: FormMessage,
     Input: Input,
+    InterfaceSettings: InterfaceSettings,
     Label: Label,
     Loading: Loading,
     Logos: Logos,
@@ -4614,10 +5113,12 @@ CommandShortcut.displayName = "CommandShortcut";
     Popover: Popover,
     PopoverContent: PopoverContent,
     PopoverTrigger: PopoverTrigger,
+    Progress: Progress,
     Radio: Radio,
     ScrollArea: ScrollArea,
     ScrollBar: ScrollBar,
     Select: Select,
+    Separator: Separator,
     Skeleton: Skeleton,
     Slider: Slider,
     Switch: Switch,
@@ -4635,5 +5136,6 @@ CommandShortcut.displayName = "CommandShortcut";
     ToastViewport: ToastViewport,
     Toaster: Toaster,
     Tooltip: Tooltip,
-    buttonVariants: buttonVariants
+    buttonVariants: buttonVariants,
+    useFormField: useFormField
 });