@sikka/hawa 0.30.2-next → 0.30.3-next

package/dist/elements/index.js

@@ -2527,6 +2527,23 @@ var Input = (0, import_react9.forwardRef)(
     };
     let defaultStyle = "hawa-flex hawa-max-h-fit hawa-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
     let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-3 hawa-text-sm ";
+    const handleChange = (e) => {
+      let newValue = e.target.value;
+      if (props.prefixText) {
+        if (newValue.length < props.prefixText.length) {
+          newValue = props.prefixText;
+        } else {
+          const isSubstring = props.prefixText.startsWith(newValue);
+          if (!isSubstring && !newValue.startsWith(props.prefixText)) {
+            newValue = `${props.prefixText}${newValue}`;
+          }
+        }
+      }
+      if (props.onChange) {
+        const newEvent = { ...e, target: { ...e.target, value: newValue } };
+        props.onChange(newEvent);
+      }
+    };
     return /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
@@ -2539,7 +2556,16 @@ var Input = (0, import_react9.forwardRef)(
         )
       },
       props.label && /* @__PURE__ */ import_react9.default.createElement(Label2, { ...labelProps }, props.label),
-      /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.prefixText && /* @__PURE__ */ import_react9.default.createElement("span", { className: cn("hawa-me-2 hawa-opacity-90", !forceHideHelperText && "hawa-mb-2") }, props.prefixText), props.isLoading ? /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react9.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react9.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.outsidePrefix && /* @__PURE__ */ import_react9.default.createElement(
+        "span",
+        {
+          className: cn(
+            "hawa-me-2 hawa-opacity-90",
+            !forceHideHelperText && "hawa-mb-2"
+          )
+        },
+        props.outsidePrefix
+      ), props.isLoading ? /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react9.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           className: cn(
@@ -2563,7 +2589,7 @@ var Input = (0, import_react9.forwardRef)(
           dir: props.dir,
           type: props.type,
           value: props.value,
-          onChange: props.onChange,
+          onChange: handleChange,
           autoComplete: props.autoComplete,
           defaultValue: props.defaultValue,
           placeholder,
@@ -4508,7 +4534,7 @@ CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
 // elements/progress/Progress.tsx
 var React35 = __toESM(require("react"));
 var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"));
-var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement(
+var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React35.createElement(Label2, { ...props.labelProps }, props.label), /* @__PURE__ */ React35.createElement(
   ProgressPrimitive.Root,
   {
     ref,
@@ -4525,7 +4551,7 @@ var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @_
       style: { transform: `translateX(-${100 - (value || 0)}%)` }
     }
   )
-));
+)));
 Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // elements/breadcrumb/Breadcrumb.tsx
@@ -6646,26 +6672,11 @@ var ColorPicker = ({
 // elements/progressCircle/ProgressCircle.tsx
 var import_react22 = __toESM(require("react"));
 var size2config = {
-  xs: {
-    radius: 15,
-    strokeWidth: 3
-  },
-  sm: {
-    radius: 19,
-    strokeWidth: 4
-  },
-  md: {
-    radius: 32,
-    strokeWidth: 6
-  },
-  lg: {
-    radius: 52,
-    strokeWidth: 8
-  },
-  xl: {
-    radius: 80,
-    strokeWidth: 10
-  }
+  xs: { radius: 15, strokeWidth: 3 },
+  sm: { radius: 19, strokeWidth: 4 },
+  md: { radius: 32, strokeWidth: 6 },
+  lg: { radius: 52, strokeWidth: 8 },
+  xl: { radius: 80, strokeWidth: 10 }
 };
 function getLimitedValue(input) {
   if (input === void 0) {

package/dist/elements/index.mjs

@@ -28,7 +28,7 @@ import {
   TabsTrigger,
   Textarea,
   UncheckMark
-} from "../chunk-Q754X27Z.mjs";
+} from "../chunk-N4O2A727.mjs";
 import {
   Sheet,
   SheetClose,
@@ -2159,26 +2159,11 @@ var ColorPicker = ({
 // elements/progressCircle/ProgressCircle.tsx
 import React21 from "react";
 var size2config = {
-  xs: {
-    radius: 15,
-    strokeWidth: 3
-  },
-  sm: {
-    radius: 19,
-    strokeWidth: 4
-  },
-  md: {
-    radius: 32,
-    strokeWidth: 6
-  },
-  lg: {
-    radius: 52,
-    strokeWidth: 8
-  },
-  xl: {
-    radius: 80,
-    strokeWidth: 10
-  }
+  xs: { radius: 15, strokeWidth: 3 },
+  sm: { radius: 19, strokeWidth: 4 },
+  md: { radius: 32, strokeWidth: 6 },
+  lg: { radius: 52, strokeWidth: 8 },
+  xl: { radius: 80, strokeWidth: 10 }
 };
 function getLimitedValue(input) {
   if (input === void 0) {

package/dist/index.css

@@ -1362,9 +1362,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-h-3\.5 {
   height: 0.875rem;
 }
-.hawa-h-36 {
-  height: 9rem;
-}
 .hawa-h-4 {
   height: 1rem;
 }
@@ -1557,9 +1554,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-w-3\/4 {
   width: 75%;
 }
-.hawa-w-36 {
-  width: 9rem;
-}
 .hawa-w-4 {
   width: 1rem;
 }
@@ -1951,10 +1945,6 @@ input[type="number"]::-webkit-inner-spin-button,
   -moz-column-gap: 0.5rem;
        column-gap: 0.5rem;
 }
-.hawa-gap-x-3 {
-  -moz-column-gap: 0.75rem;
-       column-gap: 0.75rem;
-}
 .hawa-space-x-1 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(0.25rem * var(--tw-space-x-reverse));

package/dist/index.d.mts

@@ -662,6 +662,7 @@ type TextFieldTypes = React__default.InputHTMLAttributes<HTMLInputElement> & {
     countPosition?: "top" | "bottom" | "center";
     popup?: boolean;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 };
 declare const Input: React__default.ForwardRefExoticComponent<React__default.InputHTMLAttributes<HTMLInputElement> & {
@@ -693,6 +694,7 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     countPosition?: "top" | "bottom" | "center" | undefined;
     popup?: boolean | undefined;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 } & React__default.RefAttributes<HTMLInputElement>>;
 
@@ -806,7 +808,10 @@ declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPr
     radius?: RadiusType | undefined;
 } & React$1.RefAttributes<HTMLButtonElement>>;
 
-declare const Progress: React$1.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const Progress: React$1.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
+    label?: string | undefined;
+    labelProps?: LabelProps | undefined;
+} & React$1.RefAttributes<HTMLDivElement>>;
 
 interface BCTypes {
     /** The array of crumbs, each one with a label and a href link */
@@ -893,7 +898,7 @@ declare const ColorPicker: FC<ColorPickerTypes>;
 
 type Size = "xs" | "sm" | "md" | "lg" | "xl";
 interface ProgressCircleProps extends React__default.HTMLAttributes<HTMLDivElement> {
-    value?: number;
+    value: number;
     size?: Size;
     color?: any;
     showAnimation?: boolean;

package/dist/index.d.ts

@@ -662,6 +662,7 @@ type TextFieldTypes = React__default.InputHTMLAttributes<HTMLInputElement> & {
     countPosition?: "top" | "bottom" | "center";
     popup?: boolean;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 };
 declare const Input: React__default.ForwardRefExoticComponent<React__default.InputHTMLAttributes<HTMLInputElement> & {
@@ -693,6 +694,7 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     countPosition?: "top" | "bottom" | "center" | undefined;
     popup?: boolean | undefined;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 } & React__default.RefAttributes<HTMLInputElement>>;
 
@@ -806,7 +808,10 @@ declare const CheckboxElement: React$1.ForwardRefExoticComponent<Omit<CheckboxPr
     radius?: RadiusType | undefined;
 } & React$1.RefAttributes<HTMLButtonElement>>;
 
-declare const Progress: React$1.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const Progress: React$1.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
+    label?: string | undefined;
+    labelProps?: LabelProps | undefined;
+} & React$1.RefAttributes<HTMLDivElement>>;
 
 interface BCTypes {
     /** The array of crumbs, each one with a label and a href link */
@@ -893,7 +898,7 @@ declare const ColorPicker: FC<ColorPickerTypes>;
 
 type Size = "xs" | "sm" | "md" | "lg" | "xl";
 interface ProgressCircleProps extends React__default.HTMLAttributes<HTMLDivElement> {
-    value?: number;
+    value: number;
     size?: Size;
     color?: any;
     showAnimation?: boolean;

package/dist/index.js

@@ -2594,6 +2594,23 @@ var Input = (0, import_react9.forwardRef)(
     };
     let defaultStyle = "hawa-flex hawa-max-h-fit hawa-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
     let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-3 hawa-text-sm ";
+    const handleChange = (e) => {
+      let newValue = e.target.value;
+      if (props.prefixText) {
+        if (newValue.length < props.prefixText.length) {
+          newValue = props.prefixText;
+        } else {
+          const isSubstring = props.prefixText.startsWith(newValue);
+          if (!isSubstring && !newValue.startsWith(props.prefixText)) {
+            newValue = `${props.prefixText}${newValue}`;
+          }
+        }
+      }
+      if (props.onChange) {
+        const newEvent = { ...e, target: { ...e.target, value: newValue } };
+        props.onChange(newEvent);
+      }
+    };
     return /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
@@ -2606,7 +2623,16 @@ var Input = (0, import_react9.forwardRef)(
         )
       },
       props.label && /* @__PURE__ */ import_react9.default.createElement(Label2, { ...labelProps }, props.label),
-      /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.prefixText && /* @__PURE__ */ import_react9.default.createElement("span", { className: cn("hawa-me-2 hawa-opacity-90", !forceHideHelperText && "hawa-mb-2") }, props.prefixText), props.isLoading ? /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react9.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react9.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.outsidePrefix && /* @__PURE__ */ import_react9.default.createElement(
+        "span",
+        {
+          className: cn(
+            "hawa-me-2 hawa-opacity-90",
+            !forceHideHelperText && "hawa-mb-2"
+          )
+        },
+        props.outsidePrefix
+      ), props.isLoading ? /* @__PURE__ */ import_react9.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react9.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           className: cn(
@@ -2630,7 +2656,7 @@ var Input = (0, import_react9.forwardRef)(
           dir: props.dir,
           type: props.type,
           value: props.value,
-          onChange: props.onChange,
+          onChange: handleChange,
           autoComplete: props.autoComplete,
           defaultValue: props.defaultValue,
           placeholder,
@@ -4575,7 +4601,7 @@ CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
 // elements/progress/Progress.tsx
 var React35 = __toESM(require("react"));
 var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"));
-var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement(
+var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React35.createElement(Label2, { ...props.labelProps }, props.label), /* @__PURE__ */ React35.createElement(
   ProgressPrimitive.Root,
   {
     ref,
@@ -4592,7 +4618,7 @@ var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @_
       style: { transform: `translateX(-${100 - (value || 0)}%)` }
     }
   )
-));
+)));
 Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // elements/breadcrumb/Breadcrumb.tsx
@@ -6713,26 +6739,11 @@ var ColorPicker = ({
 // elements/progressCircle/ProgressCircle.tsx
 var import_react22 = __toESM(require("react"));
 var size2config = {
-  xs: {
-    radius: 15,
-    strokeWidth: 3
-  },
-  sm: {
-    radius: 19,
-    strokeWidth: 4
-  },
-  md: {
-    radius: 32,
-    strokeWidth: 6
-  },
-  lg: {
-    radius: 52,
-    strokeWidth: 8
-  },
-  xl: {
-    radius: 80,
-    strokeWidth: 10
-  }
+  xs: { radius: 15, strokeWidth: 3 },
+  sm: { radius: 19, strokeWidth: 4 },
+  md: { radius: 32, strokeWidth: 6 },
+  lg: { radius: 52, strokeWidth: 8 },
+  xl: { radius: 80, strokeWidth: 10 }
 };
 function getLimitedValue(input) {
   if (input === void 0) {
@@ -9943,7 +9954,12 @@ var RegisterForm = ({
         direction: props.direction,
         title: props.errorTitle,
         text: props.errorText,
-        severity: "error"
+        severity: "error",
+        onAlertClosed: () => {
+          if (props.onErrorDismissed) {
+            props.onErrorDismissed();
+          }
+        }
       }
     ), /* @__PURE__ */ import_react48.default.createElement(import_react_hook_form2.FormProvider, { ...methods }, /* @__PURE__ */ import_react48.default.createElement(
       "form",

package/dist/index.mjs

@@ -2367,6 +2367,23 @@ var Input = forwardRef12(
     };
     let defaultStyle = "hawa-flex hawa-max-h-fit hawa-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
     let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-3 hawa-text-sm ";
+    const handleChange = (e) => {
+      let newValue = e.target.value;
+      if (props.prefixText) {
+        if (newValue.length < props.prefixText.length) {
+          newValue = props.prefixText;
+        } else {
+          const isSubstring = props.prefixText.startsWith(newValue);
+          if (!isSubstring && !newValue.startsWith(props.prefixText)) {
+            newValue = `${props.prefixText}${newValue}`;
+          }
+        }
+      }
+      if (props.onChange) {
+        const newEvent = { ...e, target: { ...e.target, value: newValue } };
+        props.onChange(newEvent);
+      }
+    };
     return /* @__PURE__ */ React20.createElement(
       "div",
       {
@@ -2379,7 +2396,16 @@ var Input = forwardRef12(
         )
       },
       props.label && /* @__PURE__ */ React20.createElement(Label2, { ...labelProps }, props.label),
-      /* @__PURE__ */ React20.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.prefixText && /* @__PURE__ */ React20.createElement("span", { className: cn("hawa-me-2 hawa-opacity-90", !forceHideHelperText && "hawa-mb-2") }, props.prefixText), props.isLoading ? /* @__PURE__ */ React20.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ React20.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ React20.createElement(React20.Fragment, null, !props.hideSeparator && /* @__PURE__ */ React20.createElement(
+      /* @__PURE__ */ React20.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.outsidePrefix && /* @__PURE__ */ React20.createElement(
+        "span",
+        {
+          className: cn(
+            "hawa-me-2 hawa-opacity-90",
+            !forceHideHelperText && "hawa-mb-2"
+          )
+        },
+        props.outsidePrefix
+      ), props.isLoading ? /* @__PURE__ */ React20.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ React20.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ React20.createElement(React20.Fragment, null, !props.hideSeparator && /* @__PURE__ */ React20.createElement(
         "div",
         {
           className: cn(
@@ -2403,7 +2429,7 @@ var Input = forwardRef12(
           dir: props.dir,
           type: props.type,
           value: props.value,
-          onChange: props.onChange,
+          onChange: handleChange,
           autoComplete: props.autoComplete,
           defaultValue: props.defaultValue,
           placeholder,
@@ -4348,7 +4374,7 @@ CheckboxElement.displayName = CheckboxPrimitive.Root.displayName;
 // elements/progress/Progress.tsx
 import * as React35 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement(
+var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React35.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React35.createElement(Label2, { ...props.labelProps }, props.label), /* @__PURE__ */ React35.createElement(
   ProgressPrimitive.Root,
   {
     ref,
@@ -4365,7 +4391,7 @@ var Progress = React35.forwardRef(({ className, value, ...props }, ref) => /* @_
       style: { transform: `translateX(-${100 - (value || 0)}%)` }
     }
   )
-));
+)));
 Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // elements/breadcrumb/Breadcrumb.tsx
@@ -6489,26 +6515,11 @@ var ColorPicker = ({
 // elements/progressCircle/ProgressCircle.tsx
 import React44 from "react";
 var size2config = {
-  xs: {
-    radius: 15,
-    strokeWidth: 3
-  },
-  sm: {
-    radius: 19,
-    strokeWidth: 4
-  },
-  md: {
-    radius: 32,
-    strokeWidth: 6
-  },
-  lg: {
-    radius: 52,
-    strokeWidth: 8
-  },
-  xl: {
-    radius: 80,
-    strokeWidth: 10
-  }
+  xs: { radius: 15, strokeWidth: 3 },
+  sm: { radius: 19, strokeWidth: 4 },
+  md: { radius: 32, strokeWidth: 6 },
+  lg: { radius: 52, strokeWidth: 8 },
+  xl: { radius: 80, strokeWidth: 10 }
 };
 function getLimitedValue(input) {
   if (input === void 0) {
@@ -9723,7 +9734,12 @@ var RegisterForm = ({
         direction: props.direction,
         title: props.errorTitle,
         text: props.errorText,
-        severity: "error"
+        severity: "error",
+        onAlertClosed: () => {
+          if (props.onErrorDismissed) {
+            props.onErrorDismissed();
+          }
+        }
       }
     ), /* @__PURE__ */ React75.createElement(FormProvider, { ...methods }, /* @__PURE__ */ React75.createElement(
       "form",

package/dist/input/index.d.mts

@@ -38,6 +38,7 @@ type TextFieldTypes = React__default.InputHTMLAttributes<HTMLInputElement> & {
     countPosition?: "top" | "bottom" | "center";
     popup?: boolean;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 };
 declare const Input: React__default.ForwardRefExoticComponent<React__default.InputHTMLAttributes<HTMLInputElement> & {
@@ -69,6 +70,7 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     countPosition?: "top" | "bottom" | "center" | undefined;
     popup?: boolean | undefined;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 } & React__default.RefAttributes<HTMLInputElement>>;
 

package/dist/input/index.d.ts

@@ -38,6 +38,7 @@ type TextFieldTypes = React__default.InputHTMLAttributes<HTMLInputElement> & {
     countPosition?: "top" | "bottom" | "center";
     popup?: boolean;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 };
 declare const Input: React__default.ForwardRefExoticComponent<React__default.InputHTMLAttributes<HTMLInputElement> & {
@@ -69,6 +70,7 @@ declare const Input: React__default.ForwardRefExoticComponent<React__default.Inp
     countPosition?: "top" | "bottom" | "center" | undefined;
     popup?: boolean | undefined;
     popupContent?: React__default.ReactNode;
+    outsidePrefix?: any;
     prefixText?: any;
 } & React__default.RefAttributes<HTMLInputElement>>;
 

package/dist/input/index.js

@@ -224,6 +224,23 @@ var Input = (0, import_react3.forwardRef)(
     };
     let defaultStyle = "hawa-flex hawa-max-h-fit hawa-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
     let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-3 hawa-text-sm ";
+    const handleChange = (e) => {
+      let newValue = e.target.value;
+      if (props.prefixText) {
+        if (newValue.length < props.prefixText.length) {
+          newValue = props.prefixText;
+        } else {
+          const isSubstring = props.prefixText.startsWith(newValue);
+          if (!isSubstring && !newValue.startsWith(props.prefixText)) {
+            newValue = `${props.prefixText}${newValue}`;
+          }
+        }
+      }
+      if (props.onChange) {
+        const newEvent = { ...e, target: { ...e.target, value: newValue } };
+        props.onChange(newEvent);
+      }
+    };
     return /* @__PURE__ */ import_react3.default.createElement(
       "div",
       {
@@ -236,7 +253,16 @@ var Input = (0, import_react3.forwardRef)(
         )
       },
       props.label && /* @__PURE__ */ import_react3.default.createElement(Label, { ...labelProps }, props.label),
-      /* @__PURE__ */ import_react3.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.prefixText && /* @__PURE__ */ import_react3.default.createElement("span", { className: cn("hawa-me-2 hawa-opacity-90", !forceHideHelperText && "hawa-mb-2") }, props.prefixText), props.isLoading ? /* @__PURE__ */ import_react3.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react3.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react3.default.createElement(
+      /* @__PURE__ */ import_react3.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center " }, props.outsidePrefix && /* @__PURE__ */ import_react3.default.createElement(
+        "span",
+        {
+          className: cn(
+            "hawa-me-2 hawa-opacity-90",
+            !forceHideHelperText && "hawa-mb-2"
+          )
+        },
+        props.outsidePrefix
+      ), props.isLoading ? /* @__PURE__ */ import_react3.default.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ import_react3.default.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, !props.hideSeparator && /* @__PURE__ */ import_react3.default.createElement(
         "div",
         {
           className: cn(
@@ -260,7 +286,7 @@ var Input = (0, import_react3.forwardRef)(
           dir: props.dir,
           type: props.type,
           value: props.value,
-          onChange: props.onChange,
+          onChange: handleChange,
           autoComplete: props.autoComplete,
           defaultValue: props.defaultValue,
           placeholder,