xtreme-ui 0.0.106 → 0.0.108

package/dist/components/base/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/Select.tsx"],"names":[],"mappings":"AAeA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAU,YAAY,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,MAAM,CAAC,CAAC,EAAG,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,2CA2EhD"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/Select.tsx"],"names":[],"mappings":"AAeA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAU,YAAY,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,MAAM,CAAC,CAAC,EAAG,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,2CA6EhD"}

package/dist/components/base/Select/Select.js

@@ -1,61 +1,62 @@
 "use client";
-import { jsxs as I, jsx as c } from "react/jsx-runtime";
-import { useState as O, useMemo as j } from "react";
-import y from "clsx";
-import z from "react-select";
-import { isEqual as d } from "../../../utils/function/common.js";
-import { Icon as H } from "../Icon/Icon.js";
+import { jsxs as O, jsx as c } from "react/jsx-runtime";
+import { useId as j, useState as y, useMemo as z } from "react";
+import H from "clsx";
+import q from "react-select";
+import { isEqual as h } from "../../../utils/function/common.js";
+import { Icon as D } from "../Icon/Icon.js";
 /* empty css            */
-function $(h) {
+function k(S) {
   const {
-    className: S,
+    className: v,
     multi: l = !1,
     placeholder: a = "Select an option",
-    noOptionsMessage: v,
+    noOptionsMessage: x,
     icon: n,
     size: i = "default",
-    iconType: x = "regular",
-    clearable: g = !0,
+    iconType: g = "regular",
+    clearable: b = !0,
     searchable: m = !0,
     disabled: C = !1,
-    loading: b = !1,
+    loading: N = !1,
     options: o,
     value: t,
     onChange: p
-  } = h, [u, f] = O(!1), N = j(() => {
+  } = S, u = j(), [f, d] = y(!1), I = z(() => {
     if (l) {
       const e = t ?? [];
-      return o.filter((s) => e.some((r) => d(s.value, r)));
+      return o.filter((s) => e.some((r) => h(s.value, r)));
     } else
-      return o.find((e) => d(e.value, t)) || null;
-  }, [l, o, t]), M = y(
+      return o.find((e) => h(e.value, t)) || null;
+  }, [l, o, t]), M = H(
     "xtrSelectWrapper",
     i && `${i}Size`,
     l ? "multi" : "single",
     n && "withIcon",
     !!t && "withValue",
-    u && "open",
+    f && "open",
     !m && "noSearch",
-    S
+    v
   );
-  return /* @__PURE__ */ I("div", { className: M, children: [
+  return /* @__PURE__ */ O("div", { className: M, children: [
     /* @__PURE__ */ c(
-      z,
+      q,
       {
         className: "xtrSelect",
         classNamePrefix: "xtrSelect",
+        id: u,
         isMulti: l,
-        menuIsOpen: u,
-        onMenuOpen: () => f(!0),
-        onMenuClose: () => f(!1),
-        noOptionsMessage: v,
+        menuIsOpen: f,
+        onMenuOpen: () => d(!0),
+        onMenuClose: () => d(!1),
+        noOptionsMessage: x,
         placeholder: a,
-        isClearable: g,
+        isClearable: b,
         isSearchable: m,
         isDisabled: C,
-        isLoading: b,
+        isLoading: N,
         options: o,
-        value: N,
+        value: I,
         onChange: (e) => {
           if (l) {
             const s = (e == null ? void 0 : e.map((r) => r.value)) ?? [];
@@ -67,10 +68,10 @@ function $(h) {
         }
       }
     ),
-    a && !l && /* @__PURE__ */ c("p", { className: "placeholder", children: a }),
-    n && /* @__PURE__ */ c(H, { className: "xtrSelectIcon", code: n, type: x })
+    a && !l && /* @__PURE__ */ c("label", { className: "placeholder", htmlFor: u, children: a }),
+    n && /* @__PURE__ */ c(D, { className: "xtrSelectIcon", code: n, type: g })
   ] });
 }
 export {
-  $ as Select
+  k as Select
 };

package/dist/components/base/Textfield/Textfield.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textfield.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Textfield/Textfield.tsx"],"names":[],"mappings":"AAMA,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,eAAO,MAAM,SAAS,8GAwGpB,CAAC"}
+{"version":3,"file":"Textfield.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Textfield/Textfield.tsx"],"names":[],"mappings":"AAMA,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,eAAO,MAAM,SAAS,8GAgHpB,CAAC"}

package/dist/components/base/Textfield/Textfield.js

@@ -1,100 +1,104 @@
 "use client";
-import { jsxs as N, jsx as r } from "react/jsx-runtime";
-import { forwardRef as k, useMemo as p } from "react";
-import D from "clsx";
-import { Icon as F } from "../Icon/Icon.js";
+import { jsxs as I, jsx as r } from "react/jsx-runtime";
+import { forwardRef as D, useId as L, useMemo as f } from "react";
+import U from "clsx";
+import { Icon as B } from "../Icon/Icon.js";
 /* empty css               */
-const L = k((w, g) => {
+const M = D((m, T) => {
   const {
-    className: T,
-    style: v,
+    className: v,
+    style: C,
     type: e = "text",
-    textarea: o,
+    textarea: t,
     placeholder: n,
-    autoComplete: f = "off",
-    active: C,
-    autoFocus: m,
+    autoComplete: h = "off",
+    active: E,
+    autoFocus: x,
     icon: a,
-    iconType: I = "regular",
+    iconType: F = "regular",
     value: l,
-    onChange: d,
-    onFocus: h,
-    onBlur: x,
+    onChange: y,
+    onFocus: b,
+    onBlur: N,
     onKeyUp: c,
     onKeyDown: s,
     onEnterKey: i
-  } = w, u = p(() => {
-    if (o === !0) return null;
+  } = m, K = L(), u = m.id ?? K, p = f(() => {
+    if (t === !0) return null;
     if (a) return a;
     if (e === "number") return "23";
     if (e === "search") return "f002";
     if (e === "password") return "f30d";
-  }, [o, a, e]), E = p(() => {
+  }, [t, a, e]), d = f(() => {
     if (n) return n;
     if (e === "number") return "Enter a number";
     if (e === "search") return "Search";
     if (e === "password") return "Enter password";
     if (e === "phone") return "Enter phone number";
-  }, [n, e]), K = p(() => e === "phone" ? "number" : e, [e]), y = (t) => {
-    c == null || c(t);
-  }, b = (t) => {
-    t.key === "Enter" && (i == null || i(t)), s == null || s(t);
-  }, j = D(
+  }, [n, e]), j = f(() => e === "phone" ? "number" : e, [e]), g = (o) => {
+    c == null || c(o);
+  }, w = (o) => {
+    o.key === "Enter" && (i == null || i(o)), s == null || s(o);
+  }, k = U(
     "xtrTextfield",
-    u && "withIcon",
-    o && "textarea",
+    p && "withIcon",
+    t && "textarea",
     l && "hasValue",
     e === "phone" && "phone",
-    C && "active",
-    T
+    E && "active",
+    v
   );
-  return /* @__PURE__ */ N(
+  return /* @__PURE__ */ I(
     "div",
     {
-      ref: g,
-      className: j,
+      ref: T,
+      className: k,
       role: "textbox",
-      style: v,
+      style: C,
       children: [
-        u && !o && /* @__PURE__ */ r(F, { code: u, type: I }),
-        e === "phone" && /* @__PURE__ */ N("div", { className: "dialCode", children: [
+        /* @__PURE__ */ r("label", { className: "placeholder", htmlFor: u, children: d }),
+        p && !t && /* @__PURE__ */ r(B, { code: p, type: F }),
+        e === "phone" && /* @__PURE__ */ I("div", { className: "dialCode", children: [
           /* @__PURE__ */ r("span", { style: { backgroundImage: "url(https://flagcdn.com/in.svg)" } }),
           /* @__PURE__ */ r("p", { children: "+91" })
         ] }),
-        o ? /* @__PURE__ */ r(
+        t ? /* @__PURE__ */ r(
           "textarea",
           {
             className: "input",
-            autoFocus: m,
-            autoComplete: f,
+            id: u,
+            autoFocus: x,
+            autoComplete: h,
             value: l,
-            onChange: d,
-            onFocus: h,
-            onBlur: x,
-            onKeyUp: y,
-            onKeyDown: b
+            onChange: y,
+            onFocus: b,
+            onBlur: N,
+            onKeyUp: g,
+            onKeyDown: w,
+            "aria-label": d
           }
         ) : /* @__PURE__ */ r(
           "input",
           {
             className: "input",
-            type: K,
-            autoFocus: m,
-            autoComplete: f,
+            id: u,
+            type: j,
+            autoFocus: x,
+            autoComplete: h,
             value: l,
-            onChange: d,
-            onFocus: h,
-            onBlur: x,
-            onKeyUp: y,
-            onKeyDown: b
+            onChange: y,
+            onFocus: b,
+            onBlur: N,
+            onKeyUp: g,
+            onKeyDown: w,
+            "aria-label": d
           }
-        ),
-        /* @__PURE__ */ r("label", { className: "placeholder", children: E })
+        )
       ]
     }
   );
 });
-L.displayName = "Textfield";
+M.displayName = "Textfield";
 export {
-  L as Textfield
+  M as Textfield
 };

package/dist/components/base/Textfield/types.d.ts

@@ -12,6 +12,7 @@ export type TTextfieldProps = {
     icon?: string;
     iconType?: keyof typeof EIconType;
     value?: string;
+    id?: string;
     onChange?: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
     onFocus?: (event: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
     onBlur?: (event: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;

package/dist/components/base/Textfield/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Textfield/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE9E,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,MAAM,MAAM,eAAe,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,OAAO,cAAc,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,OAAO,sBAAsB,CAAC;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAChF,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC9E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC7E,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC3C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC5C,CAAA;AACD,oBAAY,cAAc;IACzB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,QAAQ,aAAa;IACrB,MAAM,WAAW;CACjB;AAED,oBAAY,sBAAsB;IACjC,KAAK,QAAQ;IACb,IAAI,OAAO;IACX,MAAM,SAAS;IACf,kBAAkB,qBAAqB;IACvC,YAAY,eAAe;IAC3B,iBAAiB,oBAAoB;IACrC,aAAa,gBAAgB;IAC7B,kBAAkB,qBAAqB;IACvC,UAAU,aAAa;IACvB,OAAO,UAAU;IACjB,UAAU,aAAa;IACvB,cAAc,iBAAiB;IAC/B,kBAAkB,qBAAqB;IACvC,eAAe,kBAAkB;IACjC,oBAAoB,uBAAuB;IAC3C,cAAc,iBAAiB;IAC/B,gBAAgB,mBAAmB;IACnC,eAAe,kBAAkB;IACjC,eAAe,kBAAkB;IACjC,eAAe,kBAAkB;IACjC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,SAAS,YAAY;IACrB,cAAc,iBAAiB;IAC/B,aAAa,gBAAgB;IAC7B,SAAS,YAAY;IACrB,eAAe,kBAAkB;IACjC,oBAAoB,uBAAuB;IAC3C,gBAAgB,mBAAmB;IACnC,WAAW,cAAc;IACzB,QAAQ,WAAW;IACnB,cAAc,iBAAiB;IAC/B,aAAa,gBAAgB;IAC7B,QAAQ,WAAW;IACnB,SAAS,YAAY;IACrB,sBAAsB,yBAAyB;IAC/C,oBAAoB,uBAAuB;IAC3C,UAAU,aAAa;IACvB,MAAM,SAAS;IACf,UAAU,aAAa;IACvB,YAAY,eAAe;IAC3B,WAAW,cAAc;IACzB,KAAK,QAAQ;IACb,kBAAkB,qBAAqB;IACvC,cAAc,iBAAiB;IAC/B,eAAe,kBAAkB;IACjC,WAAW,cAAc;IACzB,eAAe,kBAAkB;CACjC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Textfield/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE9E,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,MAAM,MAAM,eAAe,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,OAAO,cAAc,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,OAAO,sBAAsB,CAAC;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAChF,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC9E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC7E,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC3C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC5C,CAAA;AACD,oBAAY,cAAc;IACzB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,QAAQ,aAAa;IACrB,MAAM,WAAW;CACjB;AAED,oBAAY,sBAAsB;IACjC,KAAK,QAAQ;IACb,IAAI,OAAO;IACX,MAAM,SAAS;IACf,kBAAkB,qBAAqB;IACvC,YAAY,eAAe;IAC3B,iBAAiB,oBAAoB;IACrC,aAAa,gBAAgB;IAC7B,kBAAkB,qBAAqB;IACvC,UAAU,aAAa;IACvB,OAAO,UAAU;IACjB,UAAU,aAAa;IACvB,cAAc,iBAAiB;IAC/B,kBAAkB,qBAAqB;IACvC,eAAe,kBAAkB;IACjC,oBAAoB,uBAAuB;IAC3C,cAAc,iBAAiB;IAC/B,gBAAgB,mBAAmB;IACnC,eAAe,kBAAkB;IACjC,eAAe,kBAAkB;IACjC,eAAe,kBAAkB;IACjC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,gBAAgB,mBAAmB;IACnC,SAAS,YAAY;IACrB,cAAc,iBAAiB;IAC/B,aAAa,gBAAgB;IAC7B,SAAS,YAAY;IACrB,eAAe,kBAAkB;IACjC,oBAAoB,uBAAuB;IAC3C,gBAAgB,mBAAmB;IACnC,WAAW,cAAc;IACzB,QAAQ,WAAW;IACnB,cAAc,iBAAiB;IAC/B,aAAa,gBAAgB;IAC7B,QAAQ,WAAW;IACnB,SAAS,YAAY;IACrB,sBAAsB,yBAAyB;IAC/C,oBAAoB,uBAAuB;IAC3C,UAAU,aAAa;IACvB,MAAM,SAAS;IACf,UAAU,aAAa;IACvB,YAAY,eAAe;IAC3B,WAAW,cAAc;IACzB,KAAK,QAAQ;IACb,kBAAkB,qBAAqB;IACvC,cAAc,iBAAiB;IAC/B,eAAe,kBAAkB;IACjC,WAAW,cAAc;IACzB,eAAe,kBAAkB;CACjC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xtreme-ui",
-  "version": "0.0.106",
+  "version": "0.0.108",
   "type": "module",
   "description": "Collection of reusable components that can be used in web projects",
   "main": "dist/index.js",