Module 19147

function(e,l,a){a.d(l,{S:()=>p});var t=a(627968),o=a(64700),n=a(540637),i=a(978617),s=a(158954),r=a(389723),d=a(783878),u=a(379649);let c=[{label:"Aardvark",value:"aardvark",id:"aardvark",description:"This is an aardvark"},{label:"Cat",value:"cat",id:"cat",description:"This is a cat"},{label:"Dog",value:"dog",id:"dog"},{label:"Kangaroo",value:"kangaroo",id:"kangaroo",description:"This is a kangaroo"},{label:"Panda",value:"panda",id:"panda"},{label:"Snake",value:"snake",id:"snake",disabled:!0}],b=[{label:"Aardvark",value:"aardvark",id:"aardvark",leading:s.N$i,trailing:{type:"badge",badgeType:"new"},description:"This is an aardvark"},{label:"Cat",value:"cat",id:"cat",leading:s.N$i,trailing:"20m",description:"This is a cat"},{label:"Dog",value:"dog",id:"dog",leading:s.N$i},{label:"Kangaroo",value:"kangaroo",id:"kangaroo",leading:{type:"image",src:u}},{label:"Panda",value:"panda",id:"panda",leading:{type:"avatar",src:u}},{label:"Snake",value:"snake",id:"snake",leading:s.N$i,disabled:!0}],p={title:"Select",stories:[{id:"select",name:"Select",component:function(e){let{selectionMode:l,withLeadingAndTrailing:a,...n}=e,[s,r]=o.useState(void 0),[d,u]=o.useState([]),c=m(a,n.asyncOptions);return"single"===l?(0,t.jsx)(i.l6,{...n,selectionMode:l,options:c,onSelectionChange:r,value:s}):(0,t.jsx)(i.l6,{...n,selectionMode:l,options:c,onSelectionChange:u,value:d})},controls:{selectionMode:{label:"SelectionType",type:"select",options:[{label:"Single",value:"single"},{label:"Multiple",value:"multiple"}],defaultValue:"single"},withLeadingAndTrailing:{label:"Show leading and trailing content",type:"boolean",defaultValue:!1},asyncOptions:{label:"Async loaded options",type:"boolean",defaultValue:!1},required:{label:"Required",type:"boolean",defaultValue:!1},disabled:{type:"boolean",label:"Disabled",defaultValue:!1},readOnly:{type:"boolean",label:"Read Only",defaultValue:!1},clearable:{type:"boolean",label:"Clearable",defaultValue:!1},fullWidth:{type:"boolean",label:"Full width",defaultValue:!1},closeOnSelect:{type:"boolean",label:"Close on select",defaultValue:!1},shouldFocusWrap:{type:"boolean",label:"Should listbox focus wrap",defaultValue:!1},wrapTags:{type:"boolean",label:"Wrap tags",defaultValue:!1},maxOptionsVisible:{type:"number",label:"Max options visible",defaultValue:5},label:{type:"text",label:"Label",defaultValue:"Sort by"},hideLabel:{type:"boolean",label:"Hide Label",defaultValue:!1},placeholder:{type:"text",label:"Placeholder",defaultValue:void 0},description:{type:"text",label:"Description",defaultValue:"This is an example description"},errorMessage:{type:"text",label:"Error Message",defaultValue:""},successMessage:{type:"text",label:"Success Message",defaultValue:""},layout:{type:"select",label:"Layout",defaultValue:"vertical",options:[{label:"Vertical",value:"vertical"},{label:"Horizontal",value:"horizontal"},{label:"Horizontal (Responsive)",value:"horizontal-responsive"}]}}},{id:"searchable-select",name:"SearchableSelect",component:function(e){let{selectionMode:l,withLeadingAndTrailing:a,asyncOptions:n,...i}=e,[s,r]=o.useState(void 0),[u,c]=o.useState([]),b=m(a,n);return"single"===l?(0,t.jsx)(d.Z,{...i,selectionMode:l,onSelectionChange:r,value:s,options:b}):(0,t.jsx)(d.Z,{...i,selectionMode:l,onSelectionChange:c,value:u,options:b})},controls:{selectionMode:{label:"Selection Mode",type:"select",options:[{label:"Single",value:"single"},{label:"Multiple",value:"multiple"}],defaultValue:"single"},withLeadingAndTrailing:{label:"Show leading and trailing content",type:"boolean",defaultValue:!1},asyncOptions:{label:"Async loaded options",type:"boolean",defaultValue:!1},required:{label:"Required",type:"boolean",defaultValue:!1},disabled:{type:"boolean",label:"Disabled",defaultValue:!1},clearable:{type:"boolean",label:"Clearable",defaultValue:!1},closeOnSelect:{type:"boolean",label:"Close on select",defaultValue:!1},shouldFocusWrap:{type:"boolean",label:"Should listbox focus wrap",defaultValue:!1},wrapTags:{type:"boolean",label:"Wrap tags",defaultValue:!1},maxOptionsVisible:{type:"number",label:"Max options visible",defaultValue:5},label:{type:"text",label:"Label",defaultValue:"Sort by"},hideLabel:{type:"boolean",label:"Hide Label",defaultValue:!1},placeholder:{type:"text",label:"Placeholder",defaultValue:void 0},description:{type:"text",label:"Description",defaultValue:"This is an example description"},helperText:{type:"text",label:"Helper Text",defaultValue:"This is an example of helper text, which can be used to provide additional information about the field."},errorMessage:{type:"text",label:"Error Message",defaultValue:""},successMessage:{type:"text",label:"Success Message",defaultValue:""}}},{id:"combobox",name:"ComboBox",component:function(e){let{selectionMode:l,label:a,hideLabel:n,description:i,helperText:s,errorMessage:d,successMessage:u,wrapTags:c,withLeadingAndTrailing:b,placeholder:p,...x}=e,{required:h,disabled:v}=x,y=m(b,x.asyncOptions),[f,g]=o.useState(null);return(0,t.jsxs)(r.iS,{selectionMode:l,onSelectionChange:g,options:y,value:f,...x,children:[(0,t.jsx)(r.a3,{label:a,hideLabel:n,placeholder:p,required:h,disabled:v,description:i,helperText:s,errorMessage:d,successMessage:u,wrapTags:c}),(0,t.jsx)(r.X2,{})]})},controls:{selectionMode:{label:"Selection Mode",type:"select",options:[{label:"Single",value:"single"},{label:"Multiple",value:"multiple"}],defaultValue:"single"},withLeadingAndTrailing:{label:"Show leading and trailing content",type:"boolean",defaultValue:!1},asyncOptions:{label:"Async loaded options",type:"boolean",defaultValue:!1},required:{label:"Required",type:"boolean",defaultValue:!1},disabled:{type:"boolean",label:"Disabled",defaultValue:!1},clearable:{type:"boolean",label:"Clearable",defaultValue:!1},closeOnSelect:{type:"boolean",label:"Close on select",defaultValue:!1},shouldFocusWrap:{type:"boolean",label:"Should listbox focus wrap",defaultValue:!1},wrapTags:{type:"boolean",label:"Wrap tags",defaultValue:!1},label:{type:"text",label:"Label",defaultValue:"Sort by"},hideLabel:{type:"boolean",label:"Hide Label",defaultValue:!1},placeholder:{type:"text",label:"Placeholder",defaultValue:void 0},description:{type:"text",label:"Description",defaultValue:"This is an example description"},helperText:{type:"text",label:"Helper Text",defaultValue:"This is an example of helper text, which can be used to provide additional information about the field."},errorMessage:{type:"text",label:"Error Message",defaultValue:""},successMessage:{type:"text",label:"Success Message",defaultValue:""}}},{id:"listbox",name:"ListBox",component:function(e){let{selectionMode:l,required:a,shouldFocusWrap:i,withLeadingAndTrailing:s}=e,[r,d]=o.useState(null);return(0,t.jsx)(n.q,{selectionMode:l,required:a,shouldFocusWrap:i,items:s?b:c,onSelectionChange:d,selectedItems:r})},controls:{selectionMode:{label:"Selection Mode",type:"select",options:[{label:"Single",value:"single"},{label:"Multiple",value:"multiple"}],defaultValue:"single"},withLeadingAndTrailing:{label:"Show leading and trailing content",type:"boolean",defaultValue:!1},required:{label:"Required",type:"boolean",defaultValue:!1},shouldFocusWrap:{label:"Should focus wrap",type:"boolean",defaultValue:!1}}}]};function m(e,l){let a=o.useRef(null);return o.useMemo(()=>{let t=e?b:c;return l?e=>new Promise(null!=a.current?e=>e(a.current):e=>setTimeout(()=>(a.current=t,e(t)),1e3)):t},[e,l])}}