@kamleshchandel/react-select-kc 1.0.2

package/README.md

@@ -0,0 +1 @@
+Hello

package/dist/react-select-kc.cjs.js

@@ -0,0 +1,6 @@
+"use strict";const f=require("react");var Z={exports:{}},W={};var te;function le(){if(te)return W;te=1;var E=Symbol.for("react.transitional.element"),p=Symbol.for("react.fragment");function h(k,d,a){var R=null;if(a!==void 0&&(R=""+a),d.key!==void 0&&(R=""+d.key),"key"in d){a={};for(var O in d)O!=="key"&&(a[O]=d[O])}else a=d;return d=a.ref,{$$typeof:E,type:k,key:R,ref:d!==void 0?d:null,props:a}}return W.Fragment=p,W.jsx=h,W.jsxs=h,W}var q={};var ne;function ce(){return ne||(ne=1,process.env.NODE_ENV!=="production"&&(function(){function E(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===l?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case S:return"Fragment";case M:return"Profiler";case x:return"StrictMode";case N:return"Suspense";case b:return"SuspenseList";case $:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case K:return"Portal";case A:return e.displayName||"Context";case Q:return(e._context.displayName||"Context")+".Consumer";case G:var t=e.render;return e=e.displayName,e||(e=t.displayName||t.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case F:return t=e.displayName||null,t!==null?t:E(e.type)||"Memo";case C:t=e._payload,e=e._init;try{return E(e(t))}catch{}}return null}function p(e){return""+e}function h(e){try{p(e);var t=!1}catch{t=!0}if(t){t=console;var s=t.error,c=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return s.call(t,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",c),p(e)}}function k(e){if(e===S)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===C)return"<...>";try{var t=E(e);return t?"<"+t+">":"<...>"}catch{return"<...>"}}function d(){var e=m.A;return e===null?null:e.getOwner()}function a(){return Error("react-stack-top-frame")}function R(e){if(D.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function O(e,t){function s(){H||(H=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}s.isReactWarning=!0,Object.defineProperty(e,"key",{get:s,configurable:!0})}function J(){var e=E(this.type);return P[e]||(P[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function g(e,t,s,c,I,U){var i=s.ref;return e={$$typeof:z,type:e,key:t,props:s,_owner:c},(i!==void 0?i:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:J}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:I}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:U}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function v(e,t,s,c,I,U){var i=t.children;if(i!==void 0)if(c)if(V(i)){for(c=0;c<i.length;c++)L(i[c]);Object.freeze&&Object.freeze(i)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else L(i);if(D.call(t,"key")){i=E(e);var j=Object.keys(t).filter(function(n){return n!=="key"});c=0<j.length?"{key: someKey, "+j.join(": ..., ")+": ...}":"{key: someKey}",B[i+c]||(j=0<j.length?"{"+j.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,c,i,j,i),B[i+c]=!0)}if(i=null,s!==void 0&&(h(s),i=""+s),R(t)&&(h(t.key),i=""+t.key),"key"in t){s={};for(var r in t)r!=="key"&&(s[r]=t[r])}else s=t;return i&&O(s,typeof e=="function"?e.displayName||e.name||"Unknown":e),g(e,i,s,d(),I,U)}function L(e){Y(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===C&&(e._payload.status==="fulfilled"?Y(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function Y(e){return typeof e=="object"&&e!==null&&e.$$typeof===z}var T=f,z=Symbol.for("react.transitional.element"),K=Symbol.for("react.portal"),S=Symbol.for("react.fragment"),x=Symbol.for("react.strict_mode"),M=Symbol.for("react.profiler"),Q=Symbol.for("react.consumer"),A=Symbol.for("react.context"),G=Symbol.for("react.forward_ref"),N=Symbol.for("react.suspense"),b=Symbol.for("react.suspense_list"),F=Symbol.for("react.memo"),C=Symbol.for("react.lazy"),$=Symbol.for("react.activity"),l=Symbol.for("react.client.reference"),m=T.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,D=Object.prototype.hasOwnProperty,V=Array.isArray,y=console.createTask?console.createTask:function(){return null};T={react_stack_bottom_frame:function(e){return e()}};var H,P={},w=T.react_stack_bottom_frame.bind(T,a)(),X=y(k(a)),B={};q.Fragment=S,q.jsx=function(e,t,s){var c=1e4>m.recentlyCreatedOwnerStacks++;return v(e,t,s,!1,c?Error("react-stack-top-frame"):w,c?y(k(e)):X)},q.jsxs=function(e,t,s){var c=1e4>m.recentlyCreatedOwnerStacks++;return v(e,t,s,!0,c?Error("react-stack-top-frame"):w,c?y(k(e)):X)}})()),q}var se;function ie(){return se||(se=1,process.env.NODE_ENV==="production"?Z.exports=le():Z.exports=ce()),Z.exports}var o=ie();const re="UNIVERSAL_SELECT_VALUE";function ue({options:E=[],loadAsyncOptions:p,value:h,onChange:k,label:d,isMultiSelectAllow:a=!1,closeOnOutsideClick:R=!0,isClearOptionAllow:O=!0,isSearchAllow:J=!0,selectStyle:g={},renderOption:v,renderSelectedOptionChip:L}){const[Y,T]=f.useState(!1),[z,K]=f.useState(()=>{const r=localStorage.getItem(re);return r?JSON.parse(r):a?[]:null}),[S,x]=f.useState(-1),[M,Q]=f.useState([]),[A,G]=f.useState(!1),[N,b]=f.useState(""),F=h!==void 0?h:z,C=f.useRef(null),$=f.useRef(null),l=a?Array.isArray(F)?F:[]:F,m=p?M:E;f.useEffect(()=>{localStorage.setItem(re,JSON.stringify(l))},[l]),f.useEffect(()=>{!a&&l?.label&&b(l.label)},[l,a]);const D=async(r=!1)=>{if(!p)return;G(!0);const n=await p(N);G(!1),n&&Q(u=>r?n:[...u,...n])};f.useEffect(()=>{const r=setTimeout(()=>{D(!0)},400);return()=>clearTimeout(r)},[N]),f.useEffect(()=>{if(R)return document.addEventListener("click",P),()=>{document.removeEventListener("click",P)}},[R]),f.useLayoutEffect(()=>{C?.current?.scrollIntoView({top:0})},[S]);const V=f.useMemo(()=>p||!J?m:m.filter(r=>r.label.toLowerCase().includes(N.toLowerCase())),[m,N,p]),y=r=>{h===void 0&&K(r),k?.(r)},H=r=>a?l.some(n=>n.id===r.id):l?.id===r.id,P=()=>{if(a)b("");else try{const r=localStorage.getItem(re),n=r?JSON.parse(r):null;b(n?.label||"")}catch{b("")}x(-1),T(!1)},w=r=>{if(!a){y(r),b(r.label),P();return}const u=l.some(_=>_.id===r.id)?l.filter(_=>_.id!==r.id):[...l,r];y(u),b(""),requestAnimationFrame(()=>{$.current?.focus()})},X=r=>{if(m.length)if(r.key==="ArrowDown")x(n=>(n+1)%m.length);else if(r.key==="ArrowUp")x(n=>n<=0?m.length-1:n-1);else if(r.key==="Enter"){r.preventDefault();const n=m[S];if(!n||n.disabled)return;w(n),requestAnimationFrame(()=>{$.current?.focus()})}else r.key==="Escape"&&P()},B=r=>{A||r.target.scrollTop+r.target.clientHeight>=r.target.scrollHeight-5&&D()},e=r=>{r.stopPropagation(),x(-1),T(n=>!n)},t=r=>{b(r.target.value),x(-1)},s=(r,n,u)=>({...r&&g?.disabledOption,...n&&g?.highlightOption,...u&&g?.selectedOption}),c=(r,n,u)=>["custom-select-option",r&&"disabled",u&&"selected",n&&"highlight"].join(" "),I=()=>V.map((r,n)=>{const u=r.disabled,_=n===S,ee=H(r),ae=()=>a?o.jsxs("div",{className:`option-label ${u&&"disabled"}`,children:[o.jsx("input",{type:"checkbox",checked:ee,disabled:r.disabled,readOnly:!0}),v?v(r):r.label]}):o.jsx("span",{className:"option-label",children:v?v(r):r.label});return o.jsx("li",{ref:_?C:null,style:s(u,_,ee),className:c(u,_,ee),onClick:oe=>{oe.stopPropagation(),w(r)},children:ae()},r.id)}),U=r=>{r.stopPropagation(),y(a?[]:null),b(""),x(-1)},i=()=>{const r=l&&typeof l=="object"&&"id"in l,n=a?l.length>0:r;return A?o.jsx("span",{children:"Loading..."}):O&&n?o.jsx("span",{onClick:U,children:"Clear"}):o.jsx("span",{children:Y?"↑":"↓"})},j=()=>{const r=()=>l.map(u=>o.jsxs("div",{className:"multiple-options",children:[L?L(u):u.label,o.jsx("span",{onClick:_=>{_.stopPropagation(),w(u)},children:"⤬"})]},u.id)),n=()=>o.jsx("input",{onChange:t,onClick:u=>{u.stopPropagation(),T(!0)},placeholder:"Search Here",value:N});return J?a?o.jsxs("div",{className:"multiple-options-container",children:[r(),n()]}):n():a?l.length<=0?o.jsx("p",{children:"Please Select Options"}):o.jsx("div",{className:"multiple-options-container",children:r()}):o.jsx("p",{children:l?v?v(l):l.label:"Please Select Option"})};return o.jsxs("div",{className:"custom-select",style:g.selectWrapper&&g.selectWrapper,children:[o.jsx("label",{className:"custom-select-label",children:d}),o.jsxs("div",{type:"button",ref:$,className:"custom-select-trigger",tabIndex:0,onClick:e,onKeyDown:X,children:[j(),i()]}),Y&&o.jsxs(o.Fragment,{children:[V.length>0&&o.jsxs("ul",{className:"custom-select-options",style:g.optionsList&&g.optionsList,onScroll:B,children:[I(),A&&o.jsx("li",{className:"search-view",children:"Loading..."})]}),!A&&V.length===0&&o.jsx("div",{className:"no-custom-select-options",children:o.jsx("p",{className:"no-custom-select-option",children:"No Option Available"})})]})]})}module.exports=ue;

package/dist/react-select-kc.es.js

@@ -0,0 +1,464 @@
+import ie, { useState as I, useRef as ne, useEffect as Z, useLayoutEffect as ue, useMemo as fe } from "react";
+var K = { exports: {} }, W = {};
+var ae;
+function de() {
+  if (ae) return W;
+  ae = 1;
+  var b = /* @__PURE__ */ Symbol.for("react.transitional.element"), m = /* @__PURE__ */ Symbol.for("react.fragment");
+  function h(j, f, s) {
+    var _ = null;
+    if (s !== void 0 && (_ = "" + s), f.key !== void 0 && (_ = "" + f.key), "key" in f) {
+      s = {};
+      for (var k in f)
+        k !== "key" && (s[k] = f[k]);
+    } else s = f;
+    return f = s.ref, {
+      $$typeof: b,
+      type: j,
+      key: _,
+      ref: f !== void 0 ? f : null,
+      props: s
+    };
+  }
+  return W.Fragment = m, W.jsx = h, W.jsxs = h, W;
+}
+var J = {};
+var se;
+function me() {
+  return se || (se = 1, process.env.NODE_ENV !== "production" && (function() {
+    function b(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === l ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case O:
+          return "Fragment";
+        case Q:
+          return "Profiler";
+        case T:
+          return "StrictMode";
+        case N:
+          return "Suspense";
+        case p:
+          return "SuspenseList";
+        case $:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case M:
+            return "Portal";
+          case P:
+            return e.displayName || "Context";
+          case ee:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case G:
+            var t = e.render;
+            return e = e.displayName, e || (e = t.displayName || t.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case F:
+            return t = e.displayName || null, t !== null ? t : b(e.type) || "Memo";
+          case A:
+            t = e._payload, e = e._init;
+            try {
+              return b(e(t));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function m(e) {
+      return "" + e;
+    }
+    function h(e) {
+      try {
+        m(e);
+        var t = !1;
+      } catch {
+        t = !0;
+      }
+      if (t) {
+        t = console;
+        var a = t.error, c = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return a.call(
+          t,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          c
+        ), m(e);
+      }
+    }
+    function j(e) {
+      if (e === O) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === A)
+        return "<...>";
+      try {
+        var t = b(e);
+        return t ? "<" + t + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function f() {
+      var e = d.A;
+      return e === null ? null : e.getOwner();
+    }
+    function s() {
+      return Error("react-stack-top-frame");
+    }
+    function _(e) {
+      if (D.call(e, "key")) {
+        var t = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (t && t.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function k(e, t) {
+      function a() {
+        H || (H = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          t
+        ));
+      }
+      a.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: a,
+        configurable: !0
+      });
+    }
+    function q() {
+      var e = b(this.type);
+      return S[e] || (S[e] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function E(e, t, a, c, w, U) {
+      var i = a.ref;
+      return e = {
+        $$typeof: z,
+        type: e,
+        key: t,
+        props: a,
+        _owner: c
+      }, (i !== void 0 ? i : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: q
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: w
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: U
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function g(e, t, a, c, w, U) {
+      var i = t.children;
+      if (i !== void 0)
+        if (c)
+          if (V(i)) {
+            for (c = 0; c < i.length; c++)
+              L(i[c]);
+            Object.freeze && Object.freeze(i);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else L(i);
+      if (D.call(t, "key")) {
+        i = b(e);
+        var x = Object.keys(t).filter(function(n) {
+          return n !== "key";
+        });
+        c = 0 < x.length ? "{key: someKey, " + x.join(": ..., ") + ": ...}" : "{key: someKey}", B[i + c] || (x = 0 < x.length ? "{" + x.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          c,
+          i,
+          x,
+          i
+        ), B[i + c] = !0);
+      }
+      if (i = null, a !== void 0 && (h(a), i = "" + a), _(t) && (h(t.key), i = "" + t.key), "key" in t) {
+        a = {};
+        for (var r in t)
+          r !== "key" && (a[r] = t[r]);
+      } else a = t;
+      return i && k(
+        a,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), E(
+        e,
+        i,
+        a,
+        f(),
+        w,
+        U
+      );
+    }
+    function L(e) {
+      Y(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === A && (e._payload.status === "fulfilled" ? Y(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function Y(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === z;
+    }
+    var R = ie, z = /* @__PURE__ */ Symbol.for("react.transitional.element"), M = /* @__PURE__ */ Symbol.for("react.portal"), O = /* @__PURE__ */ Symbol.for("react.fragment"), T = /* @__PURE__ */ Symbol.for("react.strict_mode"), Q = /* @__PURE__ */ Symbol.for("react.profiler"), ee = /* @__PURE__ */ Symbol.for("react.consumer"), P = /* @__PURE__ */ Symbol.for("react.context"), G = /* @__PURE__ */ Symbol.for("react.forward_ref"), N = /* @__PURE__ */ Symbol.for("react.suspense"), p = /* @__PURE__ */ Symbol.for("react.suspense_list"), F = /* @__PURE__ */ Symbol.for("react.memo"), A = /* @__PURE__ */ Symbol.for("react.lazy"), $ = /* @__PURE__ */ Symbol.for("react.activity"), l = /* @__PURE__ */ Symbol.for("react.client.reference"), d = R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, D = Object.prototype.hasOwnProperty, V = Array.isArray, y = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    R = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var H, S = {}, C = R.react_stack_bottom_frame.bind(
+      R,
+      s
+    )(), X = y(j(s)), B = {};
+    J.Fragment = O, J.jsx = function(e, t, a) {
+      var c = 1e4 > d.recentlyCreatedOwnerStacks++;
+      return g(
+        e,
+        t,
+        a,
+        !1,
+        c ? Error("react-stack-top-frame") : C,
+        c ? y(j(e)) : X
+      );
+    }, J.jsxs = function(e, t, a) {
+      var c = 1e4 > d.recentlyCreatedOwnerStacks++;
+      return g(
+        e,
+        t,
+        a,
+        !0,
+        c ? Error("react-stack-top-frame") : C,
+        c ? y(j(e)) : X
+      );
+    };
+  })()), J;
+}
+var oe;
+function pe() {
+  return oe || (oe = 1, process.env.NODE_ENV === "production" ? K.exports = de() : K.exports = me()), K.exports;
+}
+var o = pe();
+const te = "UNIVERSAL_SELECT_VALUE";
+function he({
+  options: b = [],
+  loadAsyncOptions: m,
+  value: h,
+  onChange: j,
+  label: f,
+  isMultiSelectAllow: s = !1,
+  closeOnOutsideClick: _ = !0,
+  isClearOptionAllow: k = !0,
+  isSearchAllow: q = !0,
+  selectStyle: E = {},
+  renderOption: g,
+  renderSelectedOptionChip: L
+}) {
+  const [Y, R] = I(!1), [z, M] = I(() => {
+    const r = localStorage.getItem(te);
+    return r ? JSON.parse(r) : s ? [] : null;
+  }), [O, T] = I(-1), [Q, ee] = I([]), [P, G] = I(!1), [N, p] = I(""), F = h !== void 0 ? h : z, A = ne(null), $ = ne(null), l = s ? Array.isArray(F) ? F : [] : F, d = m ? Q : b;
+  Z(() => {
+    localStorage.setItem(te, JSON.stringify(l));
+  }, [l]), Z(() => {
+    !s && l?.label && p(l.label);
+  }, [l, s]);
+  const D = async (r = !1) => {
+    if (!m) return;
+    G(!0);
+    const n = await m(N);
+    G(!1), n && ee(
+      (u) => r ? n : [...u, ...n]
+    );
+  };
+  Z(() => {
+    const r = setTimeout(() => {
+      D(!0);
+    }, 400);
+    return () => clearTimeout(r);
+  }, [N]), Z(() => {
+    if (_)
+      return document.addEventListener("click", S), () => {
+        document.removeEventListener("click", S);
+      };
+  }, [_]), ue(() => {
+    A?.current?.scrollIntoView({ top: 0 });
+  }, [O]);
+  const V = fe(() => m || !q ? d : d.filter(
+    (r) => r.label.toLowerCase().includes(N.toLowerCase())
+  ), [d, N, m]), y = (r) => {
+    h === void 0 && M(r), j?.(r);
+  }, H = (r) => s ? l.some((n) => n.id === r.id) : l?.id === r.id, S = () => {
+    if (s)
+      p("");
+    else
+      try {
+        const r = localStorage.getItem(te), n = r ? JSON.parse(r) : null;
+        p(n?.label || "");
+      } catch {
+        p("");
+      }
+    T(-1), R(!1);
+  }, C = (r) => {
+    if (!s) {
+      y(r), p(r.label), S();
+      return;
+    }
+    const u = l.some((v) => v.id === r.id) ? l.filter((v) => v.id !== r.id) : [...l, r];
+    y(u), p(""), requestAnimationFrame(() => {
+      $.current?.focus();
+    });
+  }, X = (r) => {
+    if (d.length)
+      if (r.key === "ArrowDown")
+        T((n) => (n + 1) % d.length);
+      else if (r.key === "ArrowUp")
+        T(
+          (n) => n <= 0 ? d.length - 1 : n - 1
+        );
+      else if (r.key === "Enter") {
+        r.preventDefault();
+        const n = d[O];
+        if (!n || n.disabled) return;
+        C(n), requestAnimationFrame(() => {
+          $.current?.focus();
+        });
+      } else r.key === "Escape" && S();
+  }, B = (r) => {
+    P || r.target.scrollTop + r.target.clientHeight >= r.target.scrollHeight - 5 && D();
+  }, e = (r) => {
+    r.stopPropagation(), T(-1), R((n) => !n);
+  }, t = (r) => {
+    p(r.target.value), T(-1);
+  }, a = (r, n, u) => ({
+    ...r && E?.disabledOption,
+    ...n && E?.highlightOption,
+    ...u && E?.selectedOption
+  }), c = (r, n, u) => [
+    "custom-select-option",
+    r && "disabled",
+    u && "selected",
+    n && "highlight"
+  ].join(" "), w = () => V.map((r, n) => {
+    const u = r.disabled, v = n === O, re = H(r), le = () => s ? /* @__PURE__ */ o.jsxs("div", { className: `option-label ${u && "disabled"}`, children: [
+      /* @__PURE__ */ o.jsx(
+        "input",
+        {
+          type: "checkbox",
+          checked: re,
+          disabled: r.disabled,
+          readOnly: !0
+        }
+      ),
+      g ? g(r) : r.label
+    ] }) : /* @__PURE__ */ o.jsx("span", { className: "option-label", children: g ? g(r) : r.label });
+    return /* @__PURE__ */ o.jsx(
+      "li",
+      {
+        ref: v ? A : null,
+        style: a(u, v, re),
+        className: c(u, v, re),
+        onClick: (ce) => {
+          ce.stopPropagation(), C(r);
+        },
+        children: le()
+      },
+      r.id
+    );
+  }), U = (r) => {
+    r.stopPropagation(), y(s ? [] : null), p(""), T(-1);
+  }, i = () => {
+    const r = l && typeof l == "object" && "id" in l, n = s ? l.length > 0 : r;
+    return P ? /* @__PURE__ */ o.jsx("span", { children: "Loading..." }) : k && n ? /* @__PURE__ */ o.jsx("span", { onClick: U, children: "Clear" }) : /* @__PURE__ */ o.jsx("span", { children: Y ? "↑" : "↓" });
+  }, x = () => {
+    const r = () => l.map((u) => /* @__PURE__ */ o.jsxs("div", { className: "multiple-options", children: [
+      L ? L(u) : u.label,
+      /* @__PURE__ */ o.jsx(
+        "span",
+        {
+          onClick: (v) => {
+            v.stopPropagation(), C(u);
+          },
+          children: "⤬"
+        }
+      )
+    ] }, u.id)), n = () => /* @__PURE__ */ o.jsx(
+      "input",
+      {
+        onChange: t,
+        onClick: (u) => {
+          u.stopPropagation(), R(!0);
+        },
+        placeholder: "Search Here",
+        value: N
+      }
+    );
+    return q ? s ? /* @__PURE__ */ o.jsxs("div", { className: "multiple-options-container", children: [
+      r(),
+      n()
+    ] }) : n() : s ? l.length <= 0 ? /* @__PURE__ */ o.jsx("p", { children: "Please Select Options" }) : /* @__PURE__ */ o.jsx("div", { className: "multiple-options-container", children: r() }) : /* @__PURE__ */ o.jsx("p", { children: l ? g ? g(l) : l.label : "Please Select Option" });
+  };
+  return /* @__PURE__ */ o.jsxs(
+    "div",
+    {
+      className: "custom-select",
+      style: E.selectWrapper && E.selectWrapper,
+      children: [
+        /* @__PURE__ */ o.jsx("label", { className: "custom-select-label", children: f }),
+        /* @__PURE__ */ o.jsxs(
+          "div",
+          {
+            type: "button",
+            ref: $,
+            className: "custom-select-trigger",
+            tabIndex: 0,
+            onClick: e,
+            onKeyDown: X,
+            children: [
+              x(),
+              i()
+            ]
+          }
+        ),
+        Y && /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+          V.length > 0 && /* @__PURE__ */ o.jsxs(
+            "ul",
+            {
+              className: "custom-select-options",
+              style: E.optionsList && E.optionsList,
+              onScroll: B,
+              children: [
+                w(),
+                P && /* @__PURE__ */ o.jsx("li", { className: "search-view", children: "Loading..." })
+              ]
+            }
+          ),
+          !P && V.length === 0 && /* @__PURE__ */ o.jsx("div", { className: "no-custom-select-options", children: /* @__PURE__ */ o.jsx("p", { className: "no-custom-select-option", children: "No Option Available" }) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  he as default
+};

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@kamleshchandel/react-select-kc",
+  "version": "1.0.2",
+  "description": "Universal controlled and uncontrolled select component for React",
+  "main": "dist/react-select-kc.cjs.js",
+  "module": "dist/react-select-kc.es.js",
+  "types": "types/index.d.ts",
+  "files": [
+    "dist",
+    "types"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/react-select-kc.es.js",
+      "require": "./dist/react-select-kc.cjs.js"
+    }
+  },
+  "peerDependencies": {
+    "react": ">=17",
+    "react-dom": ">=17"
+  },
+  "scripts": {
+    "build": "vite build",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "react",
+    "select",
+    "dropdown",
+    "universal-select",
+    "react-component"
+  ],
+  "author": "Kamlesh Chandel",
+  "license": "MIT",
+  "devDependencies": {
+    "@vitejs/plugin-react": "^5.1.2",
+    "vite": "^7.3.1"
+  }
+}

package/types/index.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+
+export interface UniversalSelectOption {
+  id: string | number;
+  label: string;
+  disabled?: boolean;
+}
+
+export interface UniversalSelectProps {
+  options?: UniversalSelectOption[];
+  loadAsyncOptions?: (query: string) => Promise<UniversalSelectOption[]>;
+  value?: UniversalSelectOption | UniversalSelectOption[] | null;
+  onChange?: (
+    value: UniversalSelectOption | UniversalSelectOption[] | null,
+  ) => void;
+  label?: string;
+  isMultiSelectAllow?: boolean;
+  closeOnOutsideClick?: boolean;
+  isClearOptionAllow?: boolean;
+  isSearchAllow?: boolean;
+  selectStyle?: Record<string, React.CSSProperties>;
+  renderOption?: (option: UniversalSelectOption) => React.ReactNode;
+  renderSelectedOptionChip?: (option: UniversalSelectOption) => React.ReactNode;
+}
+
+declare const UniversalSelect: React.FC<UniversalSelectProps>;
+
+export default UniversalSelect;