am-shared-assets 1.0.6 → 1.0.7

package/dist/components/Input.d.ts

@@ -7,6 +7,7 @@ interface IInputProps {
     name?: string;
     value?: string;
     onChange?: (value: string) => void;
+    isFocused?: boolean;
     placeHolder?: string;
     variant?: "flat" | "bordered" | "faded";
     color?: "default" | "primary" | "success" | "warning" | "danger";
@@ -18,5 +19,5 @@ interface IInputProps {
     errorMsg?: string;
     hasError?: boolean;
 }
-export declare const Input: ({ id, label, required, register, name, value, onChange, placeHolder, variant, color, size, rounded, description, icon, endIcon, errorMsg, hasError, }: IInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Input: ({ id, label, required, register, name, value, onChange, isFocused, placeHolder, variant, color, size, rounded, description, icon, endIcon, errorMsg, hasError, }: IInputProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/index.d.ts

@@ -8,3 +8,4 @@ export { RangeSlider } from './RangeSlider';
 export { Select } from './Select';
 export { Switch } from './Switch';
 export { Tooltip } from './Tooltip';
+export { Autocomplete } from './Autocomplete';

package/dist/components.js

@@ -1,126 +1,128 @@
-import { jsxs as l, jsx as t, Fragment as O } from "react/jsx-runtime";
-import { I as F, b as S, a as W, W as q, T as V, C as Y } from "./ChevronBottomIcon-BM6pUrh1.js";
-import { Slider as G, MenuItem as J } from "@mui/material";
-import K from "@mui/material/Select";
+import { jsxs as l, jsx as t, Fragment as W } from "react/jsx-runtime";
+import { I as S, b as z, a as q, W as V, T as Y, C as G } from "./ChevronBottomIcon-BM6pUrh1.js";
+import { Slider as J, MenuItem as K } from "@mui/material";
+import Q from "@mui/material/Select";
+import U from "@mui/material/Autocomplete";
+import "react";
 function T(a) {
-  var e, s, r = "";
-  if (typeof a == "string" || typeof a == "number") r += a;
+  var r, s, e = "";
+  if (typeof a == "string" || typeof a == "number") e += a;
   else if (typeof a == "object") if (Array.isArray(a)) {
     var n = a.length;
-    for (e = 0; e < n; e++) a[e] && (s = T(a[e])) && (r && (r += " "), r += s);
-  } else for (s in a) a[s] && (r && (r += " "), r += s);
-  return r;
+    for (r = 0; r < n; r++) a[r] && (s = T(a[r])) && (e && (e += " "), e += s);
+  } else for (s in a) a[s] && (e && (e += " "), e += s);
+  return e;
 }
-function b() {
-  for (var a, e, s = 0, r = "", n = arguments.length; s < n; s++) (a = arguments[s]) && (e = T(a)) && (r && (r += " "), r += e);
-  return r;
+function f() {
+  for (var a, r, s = 0, e = "", n = arguments.length; s < n; s++) (a = arguments[s]) && (r = T(a)) && (e && (e += " "), e += r);
+  return e;
 }
-const Q = {
+const X = {
   sm: "text-xs",
   md: "text-sm"
-}, U = {
+}, Z = {
   default: "w-[342px] min-w-[342px]",
   full: "w-full"
-}, X = {
+}, H = {
   default: "bg-default-100",
   primary: "bg-primary-50",
   secondary: "bg-secondary-50",
   success: "bg-success-50",
   warning: "bg-warning-50",
   danger: "bg-danger-50"
-}, Z = {
+}, ee = {
   default: "text-default-900",
   primary: "text-base-primary",
   secondary: "text-base-secondary",
   success: "text-base-success",
   warning: "text-default-900",
   danger: "text-base-danger"
-}, H = {
+}, re = {
   default: "text-default-600",
   primary: "text-base-primary",
   secondary: "text-base-secondary",
   success: "text-base-success",
   warning: "text-default-600",
   danger: "text-base-danger"
-}, ee = {
+}, se = {
   default: "bg-default-300",
   primary: "bg-base-primary",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, re = {
+}, ae = {
   white: "text-white",
   black: "text-default-900"
-}, z = {
+}, A = {
   default: "#a1a1aa",
   primary: "#A9BCE3",
   secondary: "#E2CDA6",
   success: "#a2e9c1",
   warning: "#fbdba7",
   danger: "#faa0bf"
-}, A = {
+}, M = {
   start: "items-start",
   center: "items-center"
-}, M = {
+}, B = {
   default: "#000",
   primary: "#112E62",
   secondary: "#C59C4E",
   success: "#17c964",
   warning: "#f5a524",
   danger: "#f31260"
-}, $ = {
-  success: /* @__PURE__ */ t(V, { color: "#17C964", size: 24 }),
-  warning: /* @__PURE__ */ t(q, { color: "#F5A524", size: 24 }),
-  danger: /* @__PURE__ */ t(W, { color: "#F31260", size: 24 })
-}, se = {
+}, v = {
+  success: /* @__PURE__ */ t(Y, { color: "#17C964", size: 24 }),
+  warning: /* @__PURE__ */ t(V, { color: "#F5A524", size: 24 }),
+  danger: /* @__PURE__ */ t(q, { color: "#F31260", size: 24 })
+}, te = {
   none: "rounded-none",
   sm: "rounded-md",
   md: "rounded-xl",
   lg: "rounded-[22px]",
   full: "rounded-full"
-}, Re = ({
+}, Ve = ({
   title: a,
-  description: e,
+  description: r,
   color: s = "default",
-  size: r = "md",
+  size: e = "md",
   width: n = "default",
   rounded: o = "none",
   infoIconAlignment: d,
   isInfoIcon: c = !0,
   hasCloseButton: i = !0,
   hasButton: u = !1,
-  buttonTitle: x,
-  buttonTextColor: h = "black",
-  buttonClickHandler: f,
-  closeAlertHandler: w,
-  children: y
+  buttonTitle: b,
+  buttonTextColor: p = "black",
+  buttonClickHandler: g,
+  closeAlertHandler: m,
+  children: h
 }) => {
-  const p = b(
-    U[n],
-    Q[r],
-    se[o],
-    X[s]
+  const y = f(
+    Z[n],
+    X[e],
+    te[o],
+    H[s]
   );
-  return y ? /* @__PURE__ */ l(
+  return h ? /* @__PURE__ */ l(
     "div",
     {
-      className: `flex p-3 ${p} ${d && A[d]}`,
+      className: `flex p-3 ${y} ${d && M[d]}`,
       children: [
-        /* @__PURE__ */ t("div", { className: "mt-[1px]", children: c || !$[s] ? /* @__PURE__ */ t(F, { color: M[s] }) : $[s] }),
-        y
+        /* @__PURE__ */ t("div", { className: "mt-[1px]", children: c || !v[s] ? /* @__PURE__ */ t(S, { color: B[s] }) : v[s] }),
+        h
       ]
     }
-  ) : /* @__PURE__ */ l("div", { className: `relative flex justify-between p-3 ${p}`, children: [
+  ) : /* @__PURE__ */ l("div", { className: `relative flex justify-between p-3 ${y}`, children: [
     /* @__PURE__ */ l(
       "div",
       {
-        className: `flex ${d ? A[d] : u ? "items-center" : a && e ? "items-start" : "items-center"} gap-3`,
+        className: `flex ${d ? M[d] : u ? "items-center" : a && r ? "items-start" : "items-center"} gap-3`,
         children: [
-          /* @__PURE__ */ t("div", { className: "mt-[1px]", children: c || !$[s] ? /* @__PURE__ */ t(F, { color: M[s] }) : $[s] }),
+          /* @__PURE__ */ t("div", { className: "mt-[1px]", children: c || !v[s] ? /* @__PURE__ */ t(S, { color: B[s] }) : v[s] }),
           /* @__PURE__ */ l("div", { children: [
-            a && /* @__PURE__ */ t("h2", { className: `font-semibold ${Z[s]}`, children: a }),
-            e && /* @__PURE__ */ t("p", { className: H[s], children: e })
+            a && /* @__PURE__ */ t("h2", { className: `font-semibold ${ee[s]}`, children: a }),
+            r && /* @__PURE__ */ t("p", { className: re[s], children: r })
           ] })
         ]
       }
@@ -129,56 +131,56 @@ const Q = {
       /* @__PURE__ */ t(
         "button",
         {
-          onClick: f,
-          className: `h-8 px-3 rounded-md ${ee[s]} ${re[h]}`,
-          children: x
+          onClick: g,
+          className: `h-8 px-3 rounded-md ${se[s]} ${ae[p]}`,
+          children: b
         }
       ),
       i && /* @__PURE__ */ t(
         "button",
         {
-          onClick: w,
+          onClick: m,
           className: "absolute -top-1 -left-1 border border-default-300 bg-default-100 rounded-full",
-          children: /* @__PURE__ */ t(S, { color: z.default, size: 14 })
+          children: /* @__PURE__ */ t(z, { color: A.default, size: 14 })
         }
       )
-    ] }) : i && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t("button", { onClick: w, children: /* @__PURE__ */ t(S, { color: z[s] }) }) })
+    ] }) : i && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t("button", { onClick: m, children: /* @__PURE__ */ t(z, { color: A[s] }) }) })
   ] });
-}, ae = {
+}, ne = {
   sm: "h-5 text-xs px-2",
   md: "h-6 text-sm px-2.5",
   lg: "h-7 text-sm px-3"
-}, te = {
+}, oe = {
   neutral: "bg-default-500",
   default: "bg-default-200",
   primary: "bg-layout-focus",
   danger: "bg-base-danger",
   success: "bg-base-success"
-}, ne = {
+}, de = {
   white: "text-content-1",
   black: "text-layout-fg"
-}, oe = {
+}, ce = {
   pill: "rounded-full",
   Rectangle: "rounded-xxs"
-}, Te = ({
+}, Ye = ({
   label: a,
-  color: e = "default",
+  color: r = "default",
   type: s = "pill",
-  size: r = "md",
+  size: e = "md",
   textColor: n = "black"
 }) => {
-  const o = b(
-    te[e],
-    ne[n],
-    ae[r],
-    oe[s]
+  const o = f(
+    oe[r],
+    de[n],
+    ne[e],
+    ce[s]
   );
   return /* @__PURE__ */ t("div", { className: `flex justify-center items-center ${o}`, children: a });
-}, de = {
+}, ie = {
   sm: "h-8 text-xs px-3",
   md: "h-10 text-sm px-4",
   lg: "h-12 text-base px-6"
-}, m = {
+}, w = {
   white: "text-white",
   black: "text-default-900",
   default: "text-default-900",
@@ -187,108 +189,108 @@ const Q = {
   success: "text-base-success",
   warning: "text-base-warning",
   danger: "text-base-danger"
-}, B = {
+}, I = {
   default: "bg-default-300",
   primary: "bg-base-primary",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, I = {
+}, j = {
   default: "border-default-300",
   primary: "border-base-primary",
   secondary: "border-base-secondary",
   success: "border-base-success",
   warning: "border-base-warning",
   danger: "border-base-danger"
-}, E = {
+}, D = {
   default: "bg-default-100",
   primary: "bg-primary-100",
   secondary: "bg-secondary-100",
   success: "bg-success-100",
   warning: "bg-warning-100",
   danger: "bg-danger-100"
-}, ce = {
+}, le = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, ie = (a, e, s) => {
-  let r = "";
+}, ue = (a, r, s) => {
+  let e = "";
   switch (a) {
     case "solid":
-      r = `${B[e]} ${m[s]}`;
+      e = `${I[r]} ${w[s]}`;
       break;
     case "bordered":
-      r = `border-2 ${I[e]} ${m[e]}`;
+      e = `border-2 ${j[r]} ${w[r]}`;
       break;
     case "light":
-      r = m[e];
+      e = w[r];
       break;
     case "flat":
-      r = `${E[e]} ${m[e]}`;
+      e = `${D[r]} ${w[r]}`;
       break;
     case "faded":
-      r = `border-2 ${I.default} ${E.default} ${m[e]}`;
+      e = `border-2 ${j.default} ${D.default} ${w[r]}`;
       break;
     case "shadow":
-      r = `shadow-lg ${B[e]} ${m[s]}`;
+      e = `shadow-lg ${I[r]} ${w[s]}`;
       break;
   }
-  return r;
-}, Le = ({
+  return e;
+}, Ge = ({
   type: a = "button",
-  variant: e = "solid",
+  variant: r = "solid",
   color: s = "default",
-  textColor: r = "black",
+  textColor: e = "black",
   size: n = "md",
   rounded: o = "none",
   label: d,
   icon: c,
   iconPosition: i = "left",
   width: u = "auto",
-  disabled: x = !1,
-  onClick: h
+  disabled: b = !1,
+  onClick: p
 }) => {
-  const f = b(
+  const g = f(
     u === "full" ? "w-full" : "w-auto",
     i === "right" ? "flex-row" : "flex-row-reverse",
-    ce[o],
-    de[n],
-    ie(e, s, r)
+    le[o],
+    ie[n],
+    ue(r, s, e)
   );
   return /* @__PURE__ */ l(
     "button",
     {
       type: a,
-      className: "flex items-center justify-center gap-2 font-semibold transition-all duration-300 " + f,
-      onClick: h,
-      disabled: x,
+      className: "flex items-center justify-center gap-2 font-semibold transition-all duration-300 " + g,
+      onClick: p,
+      disabled: b,
       children: [
         c,
         d && /* @__PURE__ */ t("p", { children: d })
       ]
     }
   );
-}, le = {
+}, be = {
   sm: "h-6 text-xs",
   md: "h-7 text-sm",
   lg: "h-8 text-base"
-}, ue = {
+}, ge = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, j = {
+}, P = {
   default: "bg-default-200",
   primary: "bg-base-primary",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, g = {
+}, x = {
   white: "text-content-1",
   black: "text-layout-fg",
   default: "text-layout-fg",
@@ -297,148 +299,149 @@ const Q = {
   success: "text-base-success",
   warning: "text-base-warning",
   danger: "text-base-danger"
-}, v = {
+}, C = {
   default: "border-default-200",
   primary: "border-base-primary",
   secondary: "border-base-secondary",
   success: "border-base-success",
   warning: "border-base-warning",
   danger: "border-base-danger"
-}, be = {
+}, fe = {
   default: "bg-default-200",
   primary: "bg-primary-100",
   secondary: "bg-secondary-100",
   success: "bg-success-100",
   warning: "bg-warning-100",
   danger: "bg-danger-100"
-}, ge = {
+}, pe = {
   default: "bg-default-400",
   primary: "bg-base-primary",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, fe = (a, e, s) => {
-  let r = "";
+}, me = (a, r, s) => {
+  let e = "";
   switch (a) {
     case "solid":
-      r = `${j[e]} ${g[s]}`;
+      e = `${P[r]} ${x[s]}`;
       break;
     case "bordered":
-      r = `border-2 ${v[e]} ${g[e]}`;
+      e = `border-2 ${C[r]} ${x[r]}`;
       break;
     case "light":
-      r = g[e];
+      e = x[r];
       break;
     case "flat":
-      r = `${be[e]} ${g[e]}`;
+      e = `${fe[r]} ${x[r]}`;
       break;
     case "faded":
-      r = `border-2 ${v.default} bg-default-100 ${g[e]}`;
+      e = `border-2 ${C.default} bg-default-100 ${x[r]}`;
       break;
     case "shadow":
-      r = `shadow-lg ${j[e]} ${g[s]}`;
+      e = `shadow-lg ${P[r]} ${x[s]}`;
       break;
     case "dot":
-      r = `border-2 ${v.default} ${g.black}`;
+      e = `border-2 ${C.default} ${x.black}`;
       break;
   }
-  return r;
-}, Pe = ({
+  return e;
+}, Je = ({
   variant: a = "solid",
-  color: e = "default",
+  color: r = "default",
   textColor: s = "black",
-  label: r,
+  label: e,
   size: n = "md",
   rounded: o = "none",
   children: d
 }) => {
-  const c = b(
-    ue[o],
-    le[n],
-    fe(a, e, s)
+  const c = f(
+    ge[o],
+    be[n],
+    me(a, r, s)
   );
-  return /* @__PURE__ */ t("div", { className: `w-fit flex items-center justify-center gap-1 px-2 ${c}`, children: d || /* @__PURE__ */ l(O, { children: [
-    /* @__PURE__ */ t("p", { children: r }),
-    a === "dot" && /* @__PURE__ */ t("div", { className: `size-2 rounded-full ${ge[e]}` })
+  return /* @__PURE__ */ t("div", { className: `w-fit flex items-center justify-center gap-1 px-2 ${c}`, children: d || /* @__PURE__ */ l(W, { children: [
+    /* @__PURE__ */ t("p", { children: e }),
+    a === "dot" && /* @__PURE__ */ t("div", { className: `size-2 rounded-full ${pe[r]}` })
   ] }) });
-}, pe = {
+}, xe = {
   sm: "h-8 py-1",
   lg: "h-10 py-2"
-}, me = {
+}, he = {
   default: "text-default-600",
   primary: "text-base-primary",
   success: "text-base-success",
   warning: "text-base-warning",
   danger: "text-base-danger"
-}, xe = {
+}, we = {
   primary: "text-base-primary hover:text-base-primary",
   success: "text-base-success hover:text-base-success",
   warning: "text-base-warning hover:text-base-warning"
-}, he = {
+}, ye = {
   default: "bg-default-100 hover:bg-default-200 focus-within:hover:bg-transparent",
   primary: "bg-primary-100 hover:bg-primary-50 focus-within:hover:bg-transparent",
   success: "bg-success-100 hover:bg-success-50 focus-within:hover:bg-transparent",
   warning: "bg-warning-100 hover:bg-warning-50 focus-within:hover:bg-transparent",
   danger: "bg-danger-100 hover:bg-danger-50 focus-within:hover:bg-transparent"
-}, C = {
+}, k = {
   default: "focus-within:bg-transparent focus-within:border focus-within:border-layout-fg focus-within:hover:border-layout-fg focus-within:hover:bg-transparent",
   primary: "focus-within:bg-transparent focus-within:border focus-within:border-base-primary focus-within:hover:border-base-primary focus-within:hover:bg-transparent",
   success: "focus-within:bg-transparent focus-within:border focus-within:border-base-success focus-within:hover:border-base-success focus-within:hover:bg-transparent",
   warning: "focus-within:bg-transparent focus-within:border focus-within:border-base-warning focus-within:hover:border-base-warning focus-within:hover:bg-transparent",
   danger: "focus-within:bg-transparent focus-within:border focus-within:border-base-danger focus-within:hover:border-base-danger focus-within:hover:bg-transparent"
-}, we = {
+}, ve = {
   default: "hover:border-default-400",
   primary: "hover:border-base-primary",
   success: "hover:border-base-success",
   warning: "hover:border-base-warning",
   danger: "hover:border-base-danger"
-}, ye = {
+}, $e = {
   sm: "rounded-sm",
   full: "rounded-full"
-}, $e = (a, e, s) => {
-  let r = "";
+}, Ce = (a, r, s) => {
+  let e = "";
   if (s)
-    return r = "bg-danger-100 hover:bg-danger-50 focus-within:hover:bg-transparent focus-within:bg-transparent focus-within:border focus-within:border-base-danger";
+    return e = "bg-danger-100 hover:bg-danger-50 focus-within:hover:bg-transparent focus-within:bg-transparent focus-within:border focus-within:border-base-danger";
   switch (a) {
     case "flat":
-      r = `${he[e]} ${C[e]} ${xe[e]} focus-within:text-layout-fg`;
+      e = `${ye[r]} ${k[r]} ${we[r]} focus-within:text-layout-fg`;
       break;
     case "bordered":
-      r = `bg-transparent border border-default-200 hover:border-default-400 ${C[e]}`;
+      e = `bg-transparent border border-default-200 hover:border-default-400 ${k[r]}`;
       break;
     case "faded":
-      r = `border border-default-200 bg-default-100 hover:bg-default-200 ${we[e]} ${C[e]}`;
+      e = `border border-default-200 bg-default-100 hover:bg-default-200 ${ve[r]} ${k[r]}`;
       break;
   }
-  return r;
-}, Oe = ({
+  return e;
+}, Ke = ({
   id: a,
-  label: e,
+  label: r,
   required: s = !1,
-  register: r,
+  register: e,
   name: n,
   value: o,
   onChange: d,
-  placeHolder: c,
-  variant: i = "flat",
-  color: u = "default",
-  size: x = "sm",
-  rounded: h = "sm",
-  description: f = "",
-  icon: w,
+  isFocused: c = !1,
+  placeHolder: i,
+  variant: u = "flat",
+  color: b = "default",
+  size: p = "sm",
+  rounded: g = "sm",
+  description: m = "",
+  icon: h,
   endIcon: y,
-  errorMsg: p = "",
+  errorMsg: $ = "",
   hasError: _ = !1
 }) => {
-  const L = b(ye[h], $e(i, u, _)), N = b(pe[x]);
+  const L = f($e[g], Ce(u, b, _)), F = f(xe[p]);
   return /* @__PURE__ */ l("label", { className: "flex flex-col w-full", children: [
-    e && /* @__PURE__ */ l(
+    r && /* @__PURE__ */ l(
       "div",
       {
-        className: `h-4 text-xs mb-2 ${_ ? "text-base-danger" : me[u]}`,
+        className: `h-4 text-xs mb-2 ${_ ? "text-base-danger" : he[b]}`,
         children: [
-          e,
+          r,
           s && /* @__PURE__ */ t("span", { className: "text-base-danger text-sm", children: "*" })
         ]
       }
@@ -448,15 +451,16 @@ const Q = {
       {
         className: `${L} flex items-center px-1.5 transition-all duration-200`,
         children: [
-          w,
-          r ? /* @__PURE__ */ t(
+          h,
+          e ? /* @__PURE__ */ t(
             "input",
             {
               id: `${a}`,
               type: "text",
-              ...r(n),
-              placeholder: c,
-              className: `${N} bg-transparent w-full px-1.5 text-sm outline-none`
+              ...e(n),
+              placeholder: i,
+              className: `${F} bg-transparent w-full px-1.5 text-sm outline-none`,
+              autoFocus: c
             }
           ) : /* @__PURE__ */ t(
             "input",
@@ -464,64 +468,65 @@ const Q = {
               id: `${a}`,
               type: "text",
               value: o,
-              onChange: (P) => d && d(P.target.value),
-              placeholder: c,
-              className: `${N} bg-transparent w-full px-1.5 text-sm outline-none`
+              onChange: (O) => d && d(O.target.value),
+              placeholder: i,
+              className: `${F} bg-transparent w-full px-1.5 text-sm outline-none`,
+              autoFocus: c
             }
           ),
           y
         ]
       }
     ),
-    f && !p && /* @__PURE__ */ t("p", { className: "mt-1 text-xs text-default-400", children: f }),
-    p && /* @__PURE__ */ t("p", { className: "mt-1 mr-1 text-xs text-base-danger", children: p })
+    m && !$ && /* @__PURE__ */ t("p", { className: "mt-1 text-xs text-default-400", children: m }),
+    $ && /* @__PURE__ */ t("p", { className: "mt-1 mr-1 text-xs text-base-danger", children: $ })
   ] });
-}, ve = {
+}, ke = {
   sm: "size-4 min-w-4 p-[3px]",
   md: "size-5 min-w-5 p-1",
   lg: "size-6 min-w-6 p-[5px]"
-}, Ce = {
+}, Ne = {
   primary: "border-base-primary",
   secondary: "border-base-secondary",
   success: "border-base-success",
   warning: "border-base-warning",
   danger: "border-base-danger",
   neutral: "border-default-500"
-}, ke = {
+}, _e = {
   primary: "bg-base-primary",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger",
   neutral: "bg-default-500"
-}, We = ({
+}, Qe = ({
   name: a,
-  value: e,
+  value: r,
   checked: s,
-  disabled: r = !1,
+  disabled: e = !1,
   onChange: n,
   size: o = "md",
   color: d = "primary",
   children: c
 }) => {
-  const i = b(
-    ve[o],
-    s ? Ce[d] : "border-base-default hover:bg-default-100 transition-all duration-200"
+  const i = f(
+    ke[o],
+    s ? Ne[d] : "border-base-default hover:bg-default-100 transition-all duration-200"
   );
   return /* @__PURE__ */ l(
     "label",
     {
-      className: `flex items-center gap-2 ${r ? "opacity-50" : "cursor-pointer"}`,
+      className: `flex items-center gap-2 ${e ? "opacity-50" : "cursor-pointer"}`,
       children: [
         /* @__PURE__ */ t(
           "input",
           {
             name: a,
             type: "radio",
-            value: e,
+            value: r,
             checked: s,
             onChange: (u) => n && n(u.target.value),
-            disabled: r,
+            disabled: e,
             style: { display: "none" }
           }
         ),
@@ -532,7 +537,7 @@ const Q = {
             children: s && /* @__PURE__ */ t(
               "span",
               {
-                className: `block w-full h-full rounded-full ${ke[d]}`
+                className: `block w-full h-full rounded-full ${_e[d]}`
               }
             )
           }
@@ -541,29 +546,29 @@ const Q = {
       ]
     }
   );
-}, _e = {
+}, Fe = {
   sm: "min-h-6 text-xs",
   md: "min-h-7 text-sm",
   lg: "min-h-8 text-base"
-}, D = {
+}, R = {
   default: "bg-content-1",
   primary: "bg-layout-focus",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, Ne = {
+}, Se = {
   white: "text-content-1",
   black: "text-default-900"
-}, Fe = {
+}, ze = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, Se = (a, e) => {
+}, Ae = (a, r) => {
   let s = "";
-  const r = {
+  const e = {
     start: "left-4",
     center: "left-1/2 -translate-x-1/2",
     end: "right-4"
@@ -574,33 +579,33 @@ const Q = {
   };
   switch (a) {
     case "top":
-      s = "top-[-3px] " + r[e];
+      s = "top-[-3px] " + e[r];
       break;
     case "right":
-      s = "right-[-3px] " + n[e];
+      s = "right-[-3px] " + n[r];
       break;
     case "bottom":
-      s = "bottom-[-3px] " + r[e];
+      s = "bottom-[-3px] " + e[r];
       break;
     case "left":
-      s = "left-[-3px] " + n[e];
+      s = "left-[-3px] " + n[r];
       break;
   }
   return s;
-}, ze = ({
+}, Me = ({
   label: a,
-  color: e = "default",
+  color: r = "default",
   textColor: s = "black",
-  size: r = "md",
+  size: e = "md",
   rounded: n = "md",
   direction: o = "bottom",
   position: d = "center"
 }) => {
-  const c = b(
-    _e[r],
-    D[e],
-    Ne[s],
-    Fe[n]
+  const c = f(
+    Fe[e],
+    R[r],
+    Se[s],
+    ze[n]
   );
   return /* @__PURE__ */ l("div", { className: "relative", children: [
     /* @__PURE__ */ t(
@@ -613,47 +618,47 @@ const Q = {
     /* @__PURE__ */ t(
       "div",
       {
-        className: `absolute size-2.5 rotate-45 rounded-[2px] shadow-[0px_0px_1px_0px_#0000004D,0px_2px_10px_0px_#0000000F,0px_0px_5px_0px_#00000005] ${Se(o, d)} ${D[e]}`
+        className: `absolute size-2.5 rotate-45 rounded-[2px] shadow-[0px_0px_1px_0px_#0000004D,0px_2px_10px_0px_#0000000F,0px_0px_5px_0px_#00000005] ${Ae(o, d)} ${R[r]}`
       }
     )
   ] });
-}, R = {
+}, E = {
   foreground: "#000000",
   primary: "#112E62",
   secondary: "#C59C4E",
   success: "#17C964",
   warning: "#F5A524",
   danger: "#F31260"
-}, k = {
+}, N = {
   foreground: "#A1A1AA",
   primary: "#D6E0F3",
   secondary: "#EEE1C9",
   success: "#d1f4e0",
   warning: "#fdedd3",
   danger: "#fdd0df"
-}, qe = ({
+}, Ue = ({
   value: a,
-  setValue: e,
+  setValue: r,
   min: s = 0,
-  max: r = 100,
+  max: e = 100,
   step: n = 1,
   color: o = "primary",
   tooltipColor: d = "primary",
   tooltipTextColor: c = "white"
 }) => /* @__PURE__ */ t(
-  G,
+  J,
   {
     value: a,
     min: s,
-    max: r,
+    max: e,
     step: n,
     onChange: (i, u) => {
-      e(u);
+      r(u);
     },
     onChangeCommitted: (i) => {
     },
     valueLabelFormat: (i) => /* @__PURE__ */ t(
-      ze,
+      Me,
       {
         color: d,
         textColor: c,
@@ -670,28 +675,28 @@ const Q = {
         width: "16px",
         height: "16px",
         border: "2px solid",
-        borderColor: R[o],
+        borderColor: E[o],
         color: "#fff"
       },
       "& .MuiSlider-thumb.Mui-focusVisible": {
-        boxShadow: `0 0 0 4px ${k[o]}`
+        boxShadow: `0 0 0 4px ${N[o]}`
       },
       "& .MuiSlider-thumb.Mui-active": {
-        boxShadow: `0 0 0 4px ${k[o]}`
+        boxShadow: `0 0 0 4px ${N[o]}`
       },
       "& .MuiSlider-thumb:hover": {
-        boxShadow: `0 0 0 4px ${k[o]}`
+        boxShadow: `0 0 0 4px ${N[o]}`
       },
       "& .MuiSlider-track": {
-        color: R[o]
+        color: E[o]
       },
       "& .MuiSlider-valueLabel": {
         backgroundColor: "transparent"
       }
     }
   }
-), Ae = () => /* @__PURE__ */ t("div", { className: "custom-select-icon", children: /* @__PURE__ */ t(Y, {}) }), Ve = ({ options: a, value: e, onChange: s }) => /* @__PURE__ */ t(
-  K,
+), Be = () => /* @__PURE__ */ t("div", { className: "custom-select-icon", children: /* @__PURE__ */ t(G, {}) }), Xe = ({ options: a, value: r, onChange: s }) => /* @__PURE__ */ t(
+  Q,
   {
     MenuProps: {
       sx: {
@@ -710,7 +715,7 @@ const Q = {
         }
       }
     },
-    IconComponent: Ae,
+    IconComponent: Be,
     sx: {
       width: "100%",
       height: 34,
@@ -736,10 +741,10 @@ const Q = {
         transform: "rotate(180deg)"
       }
     },
-    value: e,
-    onChange: (r) => s(r.target.value),
-    children: a.map(({ title: r, value: n }, o) => /* @__PURE__ */ t(
-      J,
+    value: r,
+    onChange: (e) => s(e.target.value),
+    children: a.map(({ title: e, value: n }, o) => /* @__PURE__ */ t(
+      K,
       {
         sx: {
           fontFamily: "YekanBakh",
@@ -762,44 +767,44 @@ const Q = {
           }
         },
         value: n,
-        children: r
+        children: e
       },
       o
     ))
   }
-), Me = {
+), Ie = {
   sm: "min-w-10 min-h-6",
   md: "min-w-12 min-h-7",
   lg: "min-w-14 min-h-8"
-}, Be = {
+}, je = {
   default: "bg-default-400",
   primary: "bg-layout-focus",
   secondary: "bg-base-secondary",
   success: "bg-base-success",
   warning: "bg-base-warning",
   danger: "bg-base-danger"
-}, Ye = ({
+}, Ze = ({
   enabled: a,
-  onChange: e,
+  onChange: r,
   label: s,
-  labelPosition: r = "left",
+  labelPosition: e = "left",
   size: n = "md",
   color: o = "default",
   disabled: d = !1
 }) => {
-  const c = b(
-    r === "left" ? "flex-row" : "flex-row-reverse",
+  const c = f(
+    e === "left" ? "flex-row" : "flex-row-reverse",
     d && "opacity-50"
-  ), i = b(
-    Me[n],
-    a ? Be[o] : "bg-default-700",
+  ), i = f(
+    Ie[n],
+    a ? je[o] : "bg-default-700",
     d && "cursor-auto"
   );
   return /* @__PURE__ */ l("div", { className: `flex items-center gap-2 ${c}`, children: [
     /* @__PURE__ */ t(
       "button",
       {
-        onClick: e,
+        onClick: r,
         className: `relative rounded-full transition-colors duration-300 p-1 ${i}`,
         disabled: d,
         children: /* @__PURE__ */ t(
@@ -816,16 +821,104 @@ const Q = {
     ),
     s && /* @__PURE__ */ t("p", { className: `text-default-600 ${n === "sm" && "text-sm"}`, children: s })
   ] });
-};
+}, De = {
+  sm: "h-8 py-1",
+  lg: "h-10 py-2"
+}, Pe = {
+  flat: "bg-default-100 hover:bg-default-200 focus:bg-transparent focus:border-2 border-[#11181C]",
+  faded: "bg-default-100 hover:bg-default-200 focus:bg-transparent border-2 border-default-200 hover:border-default-400 focus:border-[#11181C]",
+  bordered: "bg-transparent border-2 border-default-200 hover:border-default-400 focus:border-[#11181C]"
+}, Re = ({
+  value: a,
+  onChange: r,
+  placeHolder: s,
+  inputIcon: e,
+  inputEndIcon: n,
+  inputProps: o,
+  inputRef: d,
+  size: c,
+  variant: i,
+  iconOnClick: u,
+  endIconOnClick: b
+}) => /* @__PURE__ */ l("div", { ref: d, className: "relative", children: [
+  e && /* @__PURE__ */ t(
+    "button",
+    {
+      onClick: u,
+      className: "absolute top-1/2 -translate-y-1/2 right-2",
+      children: e
+    }
+  ),
+  /* @__PURE__ */ t(
+    "input",
+    {
+      ...o,
+      type: "text",
+      value: a,
+      onChange: (p) => r && r(p.target.value),
+      placeholder: s,
+      className: `${Pe[i]} ${De[c]} transition-all duration-300 w-full px-3 text-sm outline-none rounded-sm ${n && "pl-[30px]"} ${e && "pr-[30px]"}`
+    }
+  ),
+  n && /* @__PURE__ */ t(
+    "button",
+    {
+      onClick: b,
+      className: "absolute top-1/2 -translate-y-1/2 left-2",
+      children: n
+    }
+  )
+] }), He = ({
+  label: a,
+  placeHolder: r,
+  inputIcon: s,
+  inputEndIcon: e,
+  value: n,
+  onChange: o,
+  size: d = "sm",
+  variant: c = "flat",
+  options: i,
+  optionsUI: u,
+  iconOnClick: b,
+  endIconOnClick: p
+}) => /* @__PURE__ */ t(
+  U,
+  {
+    disablePortal: !0,
+    options: i,
+    sx: { width: "100%" },
+    renderOption: (g, m) => /* @__PURE__ */ t("li", { ...g, children: u.find(({ id: h }) => h === m.id)?.element }),
+    renderInput: (g) => /* @__PURE__ */ l("div", { children: [
+      a && /* @__PURE__ */ t("div", { className: "h-4 text-xs mb-2 text-default-600", children: a }),
+      /* @__PURE__ */ t(
+        Re,
+        {
+          value: n,
+          onChange: o,
+          placeHolder: r,
+          inputIcon: s,
+          inputEndIcon: e,
+          inputProps: g.slotProps.htmlInput,
+          inputRef: g.slotProps.input.ref,
+          size: d,
+          variant: c,
+          iconOnClick: b,
+          endIconOnClick: p
+        }
+      )
+    ] })
+  }
+);
 export {
-  Re as Alert,
-  Te as Badge,
-  Le as Button,
-  Pe as Chip,
-  Oe as Input,
-  We as Radio,
-  qe as RangeSlider,
-  Ve as Select,
-  Ye as Switch,
-  ze as Tooltip
+  Ve as Alert,
+  He as Autocomplete,
+  Ye as Badge,
+  Ge as Button,
+  Je as Chip,
+  Ke as Input,
+  Qe as Radio,
+  Ue as RangeSlider,
+  Xe as Select,
+  Ze as Switch,
+  Me as Tooltip
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "am-shared-assets",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "type": "module",
   "license": "MIT",
   "description": "",