@iqmo/browser
Version:
Browser Stlite
2 lines (1 loc) • 3.93 kB
JavaScript
import{c as T,r,z as C,cz as M,cA as W,j as l,bY as I,bZ as j,cb as k,b_ as A,bH as L,cy as V,cB as B,cu as N,cC as O,c8 as $}from"./index-C9lG8Cnd.js";import{a as H}from"./useBasicWidgetState-C76uodSh.js";const P=T("div",{target:"e6zijwc0"})(({theme:i})=>({"span[aria-disabled='true']":{background:i.colors.fadedText05}}),""),E=(i,s)=>i.getStringArrayValue(s),F=i=>i.default.map(s=>i.options[s])??null,G=i=>i.rawValues??null,U=(i,s,t,p)=>{s.setStringArrayValue(i,t.value,{fromUi:t.fromUi},p)},D=i=>{var s;const{element:t,widgetMgr:p,fragmentId:f}=i,e=C(),[a,u]=H({getStateFromWidgetMgr:E,getDefaultStateFromProto:F,getCurrStateFromProto:G,updateWidgetMgrState:U,element:t,widgetMgr:p,fragmentId:f}),h=t.maxSelections>0&&a.length>=t.maxSelections,S=r.useMemo(()=>{if(t.maxSelections===0)return"No results";if(a.length===t.maxSelections){const o=t.maxSelections!==1?"options":"option";return`You can only select up to ${t.maxSelections} ${o}. Remove an option first.`}return"No results"},[t.maxSelections,a.length]),v=r.useMemo(()=>a.map(o=>({value:o,label:o})),[a]),b=r.useCallback(o=>{var d,c;switch(o.type){case"remove":return M(a,(d=o.option)==null?void 0:d.value);case"clear":return[];case"select":return a.concat([(c=o.option)==null?void 0:c.value]);default:throw new Error(`State transition is unknown: ${o.type}`)}},[a]),y=r.useCallback(o=>{t.maxSelections&&o.type==="select"&&a.length>=t.maxSelections||u({value:b(o),fromUi:!0})},[t.maxSelections,b,u,a.length]),x=r.useCallback((o,d)=>{if(h)return[];const c=o.filter(R=>!a.includes(R.value));return W(c,d)},[h,a]),{options:g}=t;let n=i.disabled,m=t.placeholder;g.length===0&&(t.acceptNewOptions?m="Add options":(m="No options to select",n=!0));const z=g.map(o=>({label:o,value:o})),w=g.length>10;return l.jsxs("div",{className:"stMultiSelect","data-testid":"stMultiSelect",children:[l.jsx(I,{label:t.label,disabled:n,labelVisibility:j((s=t.labelVisibility)==null?void 0:s.value),children:t.help&&l.jsx(k,{children:l.jsx(A,{content:t.help,placement:L.TOP_RIGHT})})}),l.jsx(P,{children:l.jsx(V,{creatable:t.acceptNewOptions??!1,options:z,labelKey:"label",valueKey:"value","aria-label":t.label,placeholder:m,type:O.select,multi:!0,onChange:y,value:v,disabled:n,size:"compact",noResultsMsg:S,filterOptions:x,closeOnSelect:!1,overrides:{Popover:{props:{overrides:{Body:{style:()=>({marginTop:e.spacing.px})}}}},SelectArrow:{component:N,props:{overrides:{Svg:{style:()=>({width:e.iconSizes.xl,height:e.iconSizes.xl})}}}},IconsContainer:{style:()=>({paddingRight:e.spacing.sm})},ControlContainer:{style:{minHeight:e.sizes.minElementHeight,borderLeftWidth:e.sizes.borderWidth,borderRightWidth:e.sizes.borderWidth,borderTopWidth:e.sizes.borderWidth,borderBottomWidth:e.sizes.borderWidth}},Placeholder:{style:()=>({flex:"inherit",color:n?e.colors.fadedText40:e.colors.fadedText60})},ValueContainer:{style:()=>({paddingLeft:e.spacing.sm,paddingTop:e.spacing.none,paddingBottom:e.spacing.none,paddingRight:e.spacing.none})},ClearIcon:{props:{overrides:{Svg:{style:{color:e.colors.darkGray,padding:e.spacing.threeXS,height:e.sizes.clearIconSize,width:e.sizes.clearIconSize,cursor:"pointer",":hover":{fill:e.colors.bodyText}}}}}},SearchIcon:{style:{color:e.colors.darkGray}},Tag:{props:{overrides:{Root:{style:{borderTopLeftRadius:e.radii.md,borderTopRightRadius:e.radii.md,borderBottomRightRadius:e.radii.md,borderBottomLeftRadius:e.radii.md,fontSize:e.fontSizes.md,paddingLeft:e.spacing.sm,marginLeft:e.spacing.none,marginRight:e.spacing.sm,height:`calc(${e.sizes.minElementHeight} - 2 * ${e.spacing.xs})`,maxWidth:`calc(100% - ${e.spacing.lg})`,cursor:"default !important"}},Action:{style:{paddingLeft:0}},ActionIcon:{props:{overrides:{Svg:{style:{width:"0.625em",height:"0.625em"}}}}}}}},MultiValue:{props:{overrides:{Root:{style:{fontSize:e.fontSizes.sm}}}}},Input:{props:{readOnly:$.isMobile&&w===!1?"readonly":null}},Dropdown:{component:B}}})})]})},_=r.memo(D);export{_ as default};