siegel/lib/client_core/ui/Select/index.js

Web application development ecosystem

import e,{useState as t,useRef as l}from"react";import r from"../../../common/is/exists/index.js";import n from"../_internals/resolve_tag_attributes.js";import i from"../_internals/apply_classname.js";import a from"../_internals/component.js";import*as o from"../_internals/key_codes.js";import s from"../_internals/handle_keyboard_selection.js";import c from"../_internals/ref_apply.js";import m from"../_internals/children.js";import _ from"./helpers/get_options.js";let p,d="-ui-select",u=()=>({isActive:!1,arrowSelectIndex:p}),f=a(d,{theme:{root:p,_filled:p,_active:p,_disabled:p,_error:p,_multiselect:p,children:p,label:p,reset:p,title_wrapper:p,title_text:p,title_text__placeholder:p,multiselect_title_option:p,error_text:p,input_wrapper:p,options:p,option:p,option__active:p,option__disabled:p},closeOnSelect:!0,listDisabledOptions:!0},a=>{let d,f,v,h,{theme:x,rootTagAttributes:b,options:E,getDisplayValue:D,selected:j,dropdownIcon:w,disabled:N,placeholder:g,store:y,resetIcon:S,closeOnSelect:k,children:P,label:A,errorMsg:F,className:I,multiselect:B,onChange:M,onFocus:O,onBlur:K,onKeyDown:T}=a,q=y||t(u()),[z,C]=q,{isActive:G,arrowSelectIndex:H}=z,J=(e,t,l)=>{let r;t.stopPropagation(),t.preventDefault(),B?(j.has(e)?j.delete(e):j.add(e),r=j):r=e,M(r,t,l),k&&R.ref.current.blur()},L=r(j),Q=r(F),R={className:i(I,[[x._active,G],[x._filled,L],[x._error,Q],[x._disabled,N],[x._multiselect,B]]),ref:l(null)};N?L&&(f=E.find(e=>e.value==j)):({optionsElement:d,selectedOption:f,selectedOptionIndex:v}=_(a,J,H),R.tabIndex=0,R.onFocus=e=>{O?.(e),e.defaultPrevented||(z.isActive=!0,C({...z}))},G&&(R.onBlur=e=>{K?.(e),e.defaultPrevented||C(u())},R.onKeyDown=e=>{if(T?.(e),!e.defaultPrevented){let t=e.key;t!=o.TAB&&(e.preventDefault(),s({selectStore:q,keyCode:t,options:E,selectedOptionIndex:v},{onDelete(){J(p,e)},onEnter(){let{value:t,payload:l}=E[H];J(t,e,l)}}))}})),c(R,a),R=n(R,b);let U=!1;f?D?h=D(f):B?f.length?h=f.map(({title:t,value:l})=>e.createElement("div",{key:l,className:x.multiselect_title_option,children:t})):(h=g,U=!0):h=f.title:(h=g,U=!0);let V=e.createElement(e.Fragment,null,e.createElement("div",{className:x.title_wrapper,onMouseDown:e=>{G&&(e.preventDefault(),R.ref.current.blur())}},e.createElement("div",{className:i(x.title_text,[[x.title_text__placeholder,U]]),children:h}),!N&&S&&e.createElement("div",{children:S,className:x.reset,onMouseDown:e=>{J(B?new Set:p,e)}}),w),Q&&e.createElement("div",{className:x.error_text,children:F}),d);return e.createElement("div",{...R},A?e.createElement(e.Fragment,null,e.createElement("div",{className:x.label,children:A}),e.createElement("div",{className:x.input_wrapper,children:V})):V,m(P,x))});export default f;export{d as componentID,u as getDefaultState};