@legion-ui-kit/react-core
Version:
To install the package into your project:
4 lines (3 loc) • 1.72 kB
JavaScript
"use client";
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),a=require("classnames"),l=require("./styles/SelectOption.module.scss.cjs"),r=require("../Icon/index.cjs"),t=require("../../helpers/common.cjs"),c=require("./Select.constant.cjs");function n(e){return e&&e.__esModule?e:{default:e}}var i=n(a);exports.default=a=>{const{activeOption:n,className:u,isOpen:o,onChangeSearch:d,onClearSearch:f,onClick:h,optionClassName:p,options:m,ref:_,searchClassName:v,searchPlaceholder:j,searchStyle:x,searchValue:C,searchable:N,size:E=c.SELECT_OPTION_DEFAULT_PROPS.size,style:O,...S}=a,T=s.useRef(null),y=_||T,g=i.default(l.default.legion_select_option,u,l.default[E],{[l.default.open]:o,[l.default.close]:!o}),A=i.default(l.default.search_wrapper,v),I=i.default(l.default.search_input);s.useEffect(()=>{o&&y?.current&&y.current.scrollTo(0,0)},[o]);return e.jsxs("div",{ref:y,className:g,style:{...O,animationDuration:`${c.SELECT_OPTION_ANIMATION_DURATION}ms`},...S,children:[N&&e.jsxs("div",{className:A,style:x,children:[e.jsx("input",{tabIndex:-1,className:I,placeholder:j,value:C,onChange:e=>{d?.(e.currentTarget.value,e)}}),e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",children:e.jsx("rect",{height:"100%",width:"100%",fill:"none"})}),!t.isEmpty(C)&&e.jsx(r.default,{id:c.SELECT_CLEAR_SEARCH_ID,className:l.default.search_icon,icon:"close-circle",onClick:()=>{d?.(""),f?.("")}})]}),m.map((s,a)=>{const{value:r,label:t}=s,c=i.default(l.default.option,p,{[l.default.active]:Array.isArray(n)?n.includes(r):n===r});return e.jsx("div",{className:c,onClick:(u=s,()=>{h?.(u)}),children:t},a);var u})]})};
//# sourceMappingURL=SelectOption.cjs.map