xtreme-ui
Version:
Collection of reusable components that can be used in web projects
2 lines (1 loc) • 1.38 kB
JavaScript
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),i=require("react"),O=require("clsx"),y=require("react-select"),h=require("../../../utils/function/common.cjs"),z=require("../Icon/Icon.cjs");;/* empty css */function E(x){const{className:v,multi:s=!1,placeholder:a="Select an option",noOptionsMessage:g,icon:o,size:u="default",iconType:b="regular",clearable:q=!0,searchable:d=!0,disabled:j=!1,loading:C=!1,options:t,value:c,onChange:m}=x,p=i.useId(),[S,f]=i.useState(!1),I=i.useMemo(()=>{if(s){const e=c??[];return t.filter(l=>e.some(r=>h.isEqual(l.value,r)))}else return t.find(e=>h.isEqual(e.value,c))||null},[s,t,c]),M=O("xtrSelectWrapper",u&&`${u}Size`,s?"multi":"single",o&&"withIcon",!!c&&"withValue",S&&"open",!d&&"noSearch",v),N=e=>{if(s){const l=(e==null?void 0:e.map(r=>r.value))??[];m(l)}else{const l=(e==null?void 0:e.value)??null;m(l)}};return n.jsxs("div",{className:M,children:[n.jsx(y,{className:"xtrSelect",classNamePrefix:"xtrSelect",id:p,isMulti:s,menuIsOpen:S,onMenuOpen:()=>f(!0),onMenuClose:()=>f(!1),noOptionsMessage:g,placeholder:a,isClearable:q,isSearchable:d,isDisabled:j,isLoading:C,options:t,value:I,onChange:N}),a&&!s&&n.jsx("label",{className:"placeholder",htmlFor:p,children:a}),o&&n.jsx(z.Icon,{className:"xtrSelectIcon",code:o,type:b})]})}exports.Select=E;