am-shared-assets 1.0.3 → 1.0.4

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,55 +1,57 @@
-import { jsxs as l, jsx as t, Fragment as O } from "react/jsx-runtime";
+import { jsxs as u, 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";
-function T(a) {
-  var e, s, r = "";
-  if (typeof a == "string" || typeof a == "number") r += a;
+import Q from "@mui/material/Autocomplete";
+import "react";
+function E(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 = E(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 g() {
+  for (var a, r, s = 0, e = "", n = arguments.length; s < n; s++) (a = arguments[s]) && (r = E(a)) && (e && (e += " "), e += r);
+  return e;
 }
-const Q = {
+const U = {
   sm: "text-xs",
   md: "text-sm"
-}, U = {
+}, X = {
   default: "w-[342px] min-w-[342px]",
   full: "w-full"
-}, X = {
+}, Z = {
   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 = {
+}, H = {
   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 = {
+}, ee = {
   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 = {
+}, re = {
   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 = {
+}, se = {
   white: "text-white",
   black: "text-default-900"
 }, z = {
@@ -69,116 +71,116 @@ const Q = {
   success: "#17c964",
   warning: "#f5a524",
   danger: "#f31260"
-}, $ = {
+}, v = {
   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 = {
+}, ae = {
   none: "rounded-none",
   sm: "rounded-md",
   md: "rounded-xl",
   lg: "rounded-[22px]",
   full: "rounded-full"
-}, Re = ({
+}, qe = ({
   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
+  hasButton: l = !1,
+  buttonTitle: f,
+  buttonTextColor: p = "black",
+  buttonClickHandler: b,
+  closeAlertHandler: x,
+  children: h
 }) => {
-  const p = b(
-    U[n],
-    Q[r],
-    se[o],
-    X[s]
+  const w = g(
+    X[n],
+    U[e],
+    ae[o],
+    Z[s]
   );
-  return y ? /* @__PURE__ */ l(
+  return h ? /* @__PURE__ */ u(
     "div",
     {
-      className: `flex p-3 ${p} ${d && A[d]}`,
+      className: `flex p-3 ${w} ${d && A[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(F, { color: M[s] }) : v[s] }),
+        h
       ]
     }
-  ) : /* @__PURE__ */ l("div", { className: `relative flex justify-between p-3 ${p}`, children: [
-    /* @__PURE__ */ l(
+  ) : /* @__PURE__ */ u("div", { className: `relative flex justify-between p-3 ${w}`, children: [
+    /* @__PURE__ */ u(
       "div",
       {
-        className: `flex ${d ? A[d] : u ? "items-center" : a && e ? "items-start" : "items-center"} gap-3`,
+        className: `flex ${d ? A[d] : l ? "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__ */ l("div", { children: [
-            a && /* @__PURE__ */ t("h2", { className: `font-semibold ${Z[s]}`, children: a }),
-            e && /* @__PURE__ */ t("p", { className: H[s], children: e })
+          /* @__PURE__ */ t("div", { className: "mt-[1px]", children: c || !v[s] ? /* @__PURE__ */ t(F, { color: M[s] }) : v[s] }),
+          /* @__PURE__ */ u("div", { children: [
+            a && /* @__PURE__ */ t("h2", { className: `font-semibold ${H[s]}`, children: a }),
+            r && /* @__PURE__ */ t("p", { className: ee[s], children: r })
           ] })
         ]
       }
     ),
-    u ? /* @__PURE__ */ l("div", { className: "flex items-center", children: [
+    l ? /* @__PURE__ */ u("div", { className: "flex items-center", children: [
       /* @__PURE__ */ t(
         "button",
         {
-          onClick: f,
-          className: `h-8 px-3 rounded-md ${ee[s]} ${re[h]}`,
-          children: x
+          onClick: b,
+          className: `h-8 px-3 rounded-md ${re[s]} ${se[p]}`,
+          children: f
         }
       ),
       i && /* @__PURE__ */ t(
         "button",
         {
-          onClick: w,
+          onClick: x,
           className: "absolute -top-1 -left-1 border border-default-300 bg-default-100 rounded-full",
           children: /* @__PURE__ */ t(S, { color: z.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: x, children: /* @__PURE__ */ t(S, { color: z[s] }) }) })
   ] });
-}, ae = {
+}, te = {
   sm: "h-5 text-xs px-2",
   md: "h-6 text-sm px-2.5",
   lg: "h-7 text-sm px-3"
-}, te = {
+}, ne = {
   neutral: "bg-default-500",
   default: "bg-default-200",
   primary: "bg-layout-focus",
   danger: "bg-base-danger",
   success: "bg-base-success"
-}, ne = {
+}, oe = {
   white: "text-content-1",
   black: "text-layout-fg"
-}, oe = {
+}, de = {
   pill: "rounded-full",
   Rectangle: "rounded-xxs"
-}, Te = ({
+}, Ve = ({
   label: a,
-  color: e = "default",
+  color: r = "default",
   type: s = "pill",
-  size: r = "md",
+  size: e = "md",
   textColor: n = "black"
 }) => {
-  const o = b(
+  const o = g(
+    ne[r],
+    oe[n],
     te[e],
-    ne[n],
-    ae[r],
-    oe[s]
+    de[s]
   );
   return /* @__PURE__ */ t("div", { className: `flex justify-center items-center ${o}`, children: a });
-}, de = {
+}, ce = {
   sm: "h-8 text-xs px-3",
   md: "h-10 text-sm px-4",
   lg: "h-12 text-base px-6"
-}, m = {
+}, y = {
   white: "text-white",
   black: "text-default-900",
   default: "text-default-900",
@@ -201,94 +203,94 @@ const Q = {
   success: "border-base-success",
   warning: "border-base-warning",
   danger: "border-base-danger"
-}, E = {
+}, j = {
   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 = {
+}, ie = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, ie = (a, e, s) => {
-  let r = "";
+}, le = (a, r, s) => {
+  let e = "";
   switch (a) {
     case "solid":
-      r = `${B[e]} ${m[s]}`;
+      e = `${B[r]} ${y[s]}`;
       break;
     case "bordered":
-      r = `border-2 ${I[e]} ${m[e]}`;
+      e = `border-2 ${I[r]} ${y[r]}`;
       break;
     case "light":
-      r = m[e];
+      e = y[r];
       break;
     case "flat":
-      r = `${E[e]} ${m[e]}`;
+      e = `${j[r]} ${y[r]}`;
       break;
     case "faded":
-      r = `border-2 ${I.default} ${E.default} ${m[e]}`;
+      e = `border-2 ${I.default} ${j.default} ${y[r]}`;
       break;
     case "shadow":
-      r = `shadow-lg ${B[e]} ${m[s]}`;
+      e = `shadow-lg ${B[r]} ${y[s]}`;
       break;
   }
-  return r;
-}, Le = ({
+  return e;
+}, Ye = ({
   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
+  width: l = "auto",
+  disabled: f = !1,
+  onClick: p
 }) => {
-  const f = b(
-    u === "full" ? "w-full" : "w-auto",
+  const b = g(
+    l === "full" ? "w-full" : "w-auto",
     i === "right" ? "flex-row" : "flex-row-reverse",
-    ce[o],
-    de[n],
-    ie(e, s, r)
+    ie[o],
+    ce[n],
+    le(r, s, e)
   );
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(
     "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 " + b,
+      onClick: p,
+      disabled: f,
       children: [
         c,
         d && /* @__PURE__ */ t("p", { children: d })
       ]
     }
   );
-}, le = {
+}, ue = {
   sm: "h-6 text-xs",
   md: "h-7 text-sm",
   lg: "h-8 text-base"
-}, ue = {
+}, be = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, j = {
+}, D = {
   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 = {
+}, m = {
   white: "text-content-1",
   black: "text-layout-fg",
   default: "text-layout-fg",
@@ -297,85 +299,85 @@ const Q = {
   success: "text-base-success",
   warning: "text-base-warning",
   danger: "text-base-danger"
-}, v = {
+}, $ = {
   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 = {
+}, ge = {
   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 = {
+}, fe = {
   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 = "";
+}, pe = (a, r, s) => {
+  let e = "";
   switch (a) {
     case "solid":
-      r = `${j[e]} ${g[s]}`;
+      e = `${D[r]} ${m[s]}`;
       break;
     case "bordered":
-      r = `border-2 ${v[e]} ${g[e]}`;
+      e = `border-2 ${$[r]} ${m[r]}`;
       break;
     case "light":
-      r = g[e];
+      e = m[r];
       break;
     case "flat":
-      r = `${be[e]} ${g[e]}`;
+      e = `${ge[r]} ${m[r]}`;
       break;
     case "faded":
-      r = `border-2 ${v.default} bg-default-100 ${g[e]}`;
+      e = `border-2 ${$.default} bg-default-100 ${m[r]}`;
       break;
     case "shadow":
-      r = `shadow-lg ${j[e]} ${g[s]}`;
+      e = `shadow-lg ${D[r]} ${m[s]}`;
       break;
     case "dot":
-      r = `border-2 ${v.default} ${g.black}`;
+      e = `border-2 ${$.default} ${m.black}`;
       break;
   }
-  return r;
-}, Pe = ({
+  return e;
+}, Ge = ({
   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 = g(
+    be[o],
+    ue[n],
+    pe(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__ */ u(O, { children: [
+    /* @__PURE__ */ t("p", { children: e }),
+    a === "dot" && /* @__PURE__ */ t("div", { className: `size-2 rounded-full ${fe[r]}` })
   ] }) });
-}, pe = {
+}, me = {
   sm: "h-8 py-1",
   lg: "h-10 py-2"
-}, me = {
+}, xe = {
   default: "text-default-600",
   primary: "text-base-primary",
   success: "text-base-success",
   warning: "text-base-warning",
   danger: "text-base-danger"
-}, xe = {
+}, he = {
   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 = {
+}, we = {
   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",
@@ -387,76 +389,76 @@ const Q = {
   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 = {
+}, ye = {
   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 = {
+}, ve = {
   sm: "rounded-sm",
   full: "rounded-full"
-}, $e = (a, e, s) => {
-  let r = "";
+}, $e = (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 = `${we[r]} ${C[r]} ${he[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 ${C[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 ${ye[r]} ${C[r]}`;
       break;
   }
-  return r;
-}, Oe = ({
+  return e;
+}, Je = ({
   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,
-  endIcon: y,
-  errorMsg: p = "",
-  hasError: _ = !1
+  color: l = "default",
+  size: f = "sm",
+  rounded: p = "sm",
+  description: b = "",
+  icon: x,
+  endIcon: h,
+  errorMsg: w = "",
+  hasError: N = !1
 }) => {
-  const L = b(ye[h], $e(i, u, _)), N = b(pe[x]);
-  return /* @__PURE__ */ l("label", { className: "flex flex-col w-full", children: [
-    e && /* @__PURE__ */ l(
+  const T = g(ve[p], $e(i, l, N)), _ = g(me[f]);
+  return /* @__PURE__ */ u("label", { className: "flex flex-col w-full", children: [
+    r && /* @__PURE__ */ u(
       "div",
       {
-        className: `h-4 text-xs mb-2 ${_ ? "text-base-danger" : me[u]}`,
+        className: `h-4 text-xs mb-2 ${N ? "text-base-danger" : xe[l]}`,
         children: [
-          e,
+          r,
           s && /* @__PURE__ */ t("span", { className: "text-base-danger text-sm", children: "*" })
         ]
       }
     ),
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       "div",
       {
-        className: `${L} flex items-center px-1.5 transition-all duration-200`,
+        className: `${T} flex items-center px-1.5 transition-all duration-200`,
         children: [
-          w,
-          r ? /* @__PURE__ */ t(
+          x,
+          e ? /* @__PURE__ */ t(
             "input",
             {
               id: `${a}`,
               type: "text",
-              ...r(n),
+              ...e(n),
               placeholder: c,
-              className: `${N} bg-transparent w-full px-1.5 text-sm outline-none`
+              className: `${_} bg-transparent w-full px-1.5 text-sm outline-none`
             }
           ) : /* @__PURE__ */ t(
             "input",
@@ -464,64 +466,64 @@ const Q = {
               id: `${a}`,
               type: "text",
               value: o,
-              onChange: (P) => d && d(P.target.value),
+              onChange: (L) => d && d(L.target.value),
               placeholder: c,
-              className: `${N} bg-transparent w-full px-1.5 text-sm outline-none`
+              className: `${_} bg-transparent w-full px-1.5 text-sm outline-none`
             }
           ),
-          y
+          h
         ]
       }
     ),
-    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 })
+    b && !w && /* @__PURE__ */ t("p", { className: "mt-1 text-xs text-default-400", children: b }),
+    w && /* @__PURE__ */ t("p", { className: "mt-1 mr-1 text-xs text-base-danger", children: w })
   ] });
-}, ve = {
+}, Ce = {
   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 = {
+}, ke = {
   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 = {
+}, Ne = {
   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 = ({
+}, Ke = ({
   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 = g(
+    Ce[o],
+    s ? ke[d] : "border-base-default hover:bg-default-100 transition-all duration-200"
   );
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(
     "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,
+            onChange: (l) => n && n(l.target.value),
+            disabled: e,
             style: { display: "none" }
           }
         ),
@@ -532,7 +534,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 ${Ne[d]}`
               }
             )
           }
@@ -545,25 +547,25 @@ const Q = {
   sm: "min-h-6 text-xs",
   md: "min-h-7 text-sm",
   lg: "min-h-8 text-base"
-}, D = {
+}, P = {
   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 = {
+}, Fe = {
   white: "text-content-1",
   black: "text-default-900"
-}, Fe = {
+}, Se = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "rounded-full"
-}, Se = (a, e) => {
+}, ze = (a, r) => {
   let s = "";
-  const r = {
+  const e = {
     start: "left-4",
     center: "left-1/2 -translate-x-1/2",
     end: "right-4"
@@ -574,35 +576,35 @@ 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 = ({
+}, Ae = ({
   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 = g(
+    _e[e],
+    P[r],
+    Fe[s],
+    Se[n]
   );
-  return /* @__PURE__ */ l("div", { className: "relative", children: [
+  return /* @__PURE__ */ u("div", { className: "relative", children: [
     /* @__PURE__ */ t(
       "div",
       {
@@ -613,7 +615,7 @@ 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] ${ze(o, d)} ${P[r]}`
       }
     )
   ] });
@@ -631,11 +633,11 @@ const Q = {
   success: "#d1f4e0",
   warning: "#fdedd3",
   danger: "#fdd0df"
-}, qe = ({
+}, Qe = ({
   value: a,
-  setValue: e,
+  setValue: r,
   min: s = 0,
-  max: r = 100,
+  max: e = 100,
   step: n = 1,
   color: o = "primary",
   tooltipColor: d = "primary",
@@ -645,15 +647,15 @@ const Q = {
   {
     value: a,
     min: s,
-    max: r,
+    max: e,
     step: n,
-    onChange: (i, u) => {
-      e(u);
+    onChange: (i, l) => {
+      r(l);
     },
     onChangeCommitted: (i) => {
     },
     valueLabelFormat: (i) => /* @__PURE__ */ t(
-      ze,
+      Ae,
       {
         color: d,
         textColor: c,
@@ -690,7 +692,7 @@ const Q = {
       }
     }
   }
-), Ae = () => /* @__PURE__ */ t("div", { className: "custom-select-icon", children: /* @__PURE__ */ t(Y, {}) }), Ve = ({ options: a, value: e, onChange: s }) => /* @__PURE__ */ t(
+), Me = () => /* @__PURE__ */ t("div", { className: "custom-select-icon", children: /* @__PURE__ */ t(Y, {}) }), Ue = ({ options: a, value: r, onChange: s }) => /* @__PURE__ */ t(
   K,
   {
     MenuProps: {
@@ -710,7 +712,7 @@ const Q = {
         }
       }
     },
-    IconComponent: Ae,
+    IconComponent: Me,
     sx: {
       width: "100%",
       height: 34,
@@ -736,9 +738,9 @@ const Q = {
         transform: "rotate(180deg)"
       }
     },
-    value: e,
-    onChange: (r) => s(r.target.value),
-    children: a.map(({ title: r, value: n }, o) => /* @__PURE__ */ t(
+    value: r,
+    onChange: (e) => s(e.target.value),
+    children: a.map(({ title: e, value: n }, o) => /* @__PURE__ */ t(
       J,
       {
         sx: {
@@ -762,44 +764,44 @@ const Q = {
           }
         },
         value: n,
-        children: r
+        children: e
       },
       o
     ))
   }
-), Me = {
+), Be = {
   sm: "min-w-10 min-h-6",
   md: "min-w-12 min-h-7",
   lg: "min-w-14 min-h-8"
-}, Be = {
+}, Ie = {
   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 = ({
+}, Xe = ({
   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 = g(
+    e === "left" ? "flex-row" : "flex-row-reverse",
     d && "opacity-50"
-  ), i = b(
-    Me[n],
-    a ? Be[o] : "bg-default-700",
+  ), i = g(
+    Be[n],
+    a ? Ie[o] : "bg-default-700",
     d && "cursor-auto"
   );
-  return /* @__PURE__ */ l("div", { className: `flex items-center gap-2 ${c}`, children: [
+  return /* @__PURE__ */ u("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 +818,104 @@ const Q = {
     ),
     s && /* @__PURE__ */ t("p", { className: `text-default-600 ${n === "sm" && "text-sm"}`, children: s })
   ] });
-};
+}, je = {
+  sm: "h-8 py-1",
+  lg: "h-10 py-2"
+}, De = {
+  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]"
+}, Pe = ({
+  value: a,
+  onChange: r,
+  placeHolder: s,
+  inputIcon: e,
+  inputEndIcon: n,
+  inputProps: o,
+  inputRef: d,
+  size: c,
+  variant: i,
+  iconOnClick: l,
+  endIconOnClick: f
+}) => /* @__PURE__ */ u("div", { ref: d, className: "relative", children: [
+  e && /* @__PURE__ */ t(
+    "button",
+    {
+      onClick: l,
+      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: `${De[i]} ${je[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: f,
+      className: "absolute top-1/2 -translate-y-1/2 left-2",
+      children: n
+    }
+  )
+] }), Ze = ({
+  label: a,
+  placeHolder: r,
+  inputIcon: s,
+  inputEndIcon: e,
+  value: n,
+  onChange: o,
+  size: d = "sm",
+  variant: c = "flat",
+  options: i,
+  optionsUI: l,
+  iconOnClick: f,
+  endIconOnClick: p
+}) => /* @__PURE__ */ t(
+  Q,
+  {
+    disablePortal: !0,
+    options: i,
+    sx: { width: "100%" },
+    renderOption: (b, x) => /* @__PURE__ */ t("li", { ...b, children: l.find(({ id: h }) => h === x.id)?.element }),
+    renderInput: (b) => /* @__PURE__ */ u("div", { children: [
+      a && /* @__PURE__ */ t("div", { className: "h-4 text-xs mb-2 text-default-600", children: a }),
+      /* @__PURE__ */ t(
+        Pe,
+        {
+          value: n,
+          onChange: o,
+          placeHolder: r,
+          inputIcon: s,
+          inputEndIcon: e,
+          inputProps: b.slotProps.htmlInput,
+          inputRef: b.slotProps.input.ref,
+          size: d,
+          variant: c,
+          iconOnClick: f,
+          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
+  qe as Alert,
+  Ze as Autocomplete,
+  Ve as Badge,
+  Ye as Button,
+  Ge as Chip,
+  Je as Input,
+  Ke as Radio,
+  Qe as RangeSlider,
+  Ue as Select,
+  Xe as Switch,
+  Ae as Tooltip
 };

package/package.json

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