@gsretail.com/gui-core
Version:
A skeleton to create your own React component library using Rollup, TypeScript, Sass and Storybook
2 lines (1 loc) • 2.13 kB
JavaScript
import{__rest as e,__assign as l}from"../../node_modules/tslib/tslib.es6.js";import t from"react";import{Box as i,FormControl as a,Autocomplete as o,TextField as n}from"@mui/material";import{GuiIcon as r}from"../../node_modules/@gsretail.com/gui-icons/dist/index.js";import s from"./GuiAutoComplete.styled.js";var d=s((function(s){var d=s.label,m=s.labelWidth,p=s.labelTextAlign,u=s.required,c=s.width,b=s.size,g=s.placeholder,h=s.readOnly,O=s.disabled,f=s.limitTags,x=s.disableCloseOnSelect,E=s.filterSelectedOptions,C=s.multiple,T=s.optionHeight,y=s.arrOption,v=s.renderOption,w=s.getOptionLabel,S=s.value,q=s.onChange;s.children;var N=s.className,j=s.boxProps,z=s.isOptionEqualToValue,A=s.disableClearable,W=e(s,["label","labelWidth","labelTextAlign","required","width","size","placeholder","readOnly","disabled","limitTags","disableCloseOnSelect","filterSelectedOptions","multiple","optionHeight","arrOption","renderOption","getOptionLabel","value","onChange","children","className","boxProps","isOptionEqualToValue","disableClearable"]),H=d?m:"0";return t.createElement(i,l({className:["gui-form gui-autoComplete",N&&N].join(" "),width:c},j),d&&t.createElement(i,{minWidth:m},t.createElement("label",{className:["gui-label",p&&"textAlign-"+p,u&&"Mui-required"].join(" ")},d)),t.createElement(i,{flexGrow:1,style:{maxWidth:"calc("+c+" - "+H+")"}},t.createElement(a,{variant:"outlined",style:{width:"100%"}},t.createElement(o,l({options:y,getOptionLabel:w||function(e){return e.label||""},value:S,onChange:q,multiple:C,limitTags:f&&f,openOnFocus:!0,disableCloseOnSelect:!!C&&x,filterSelectedOptions:E,renderOption:v,renderInput:function(e){return t.createElement(n,l({},e,{placeholder:g,size:b,disabled:O}))},ListboxProps:{style:{maxHeight:T}},popupIcon:t.createElement(r,{name:"ExpandMore"}),size:b,disabled:O,className:h?"Gui-readonly":"",isOptionEqualToValue:z,disableClearable:A},W)),h?t.createElement(i,{className:"readonly-wrap"}):null)))}));d.defaultProps={labelWidth:"auto",labelTextAlign:"left",width:"100%",size:"small",limitTags:-1,optionHeight:"auto",disableCloseOnSelect:!0,multiple:!0};export{d as default};