groundfloor-react-ui 1.0.10 → 1.0.11

package/components/Inputs/CheckBoxInput.js

@@ -92,6 +92,7 @@ export const CheckBoxInput = ({
     setOptions,
     inline,
     wrapperStyle,
+    isRequired,
     ...props
 }) => {
     useEffect(() => {
@@ -121,13 +122,27 @@ export const CheckBoxInput = ({
 
     return (
         <div style={returnedTarget} {...props}>
-            <Label
-                themeColor={defaultThemeColor}
-                customStyles={labelStyle}
-                type={'check-label'}
-                text={label}
-                {...props}
-            />
+
+            <div style={{ display: 'flex' }}>
+                <Label
+                    themeColor={defaultThemeColor}
+                    customStyles={labelStyle}
+                    type={'check-label'}
+                    text={label}
+                    {...props}
+                />
+
+                {isRequired && (
+                    <div
+                        style={{
+                            marginLeft: '4px',
+                            color: `${defaultThemeColor.variant['error']}`,
+                        }}
+                    >
+                        *
+                    </div>
+                )}
+            </div>
             <ParentDiv
                 style={{ display: 'flex', flexWrap: 'wrap' }}
                 inline={inline}
@@ -250,6 +265,10 @@ CheckBoxInput.propTypes = {
      *	CheckBox checked value changeHandler
      */
     getCheckedArr: PropTypes.func,
+    /**
+   *	mandatory field or not
+   */
+    isRequired: PropTypes.bool,
 };
 
 CheckBoxInput.defaultProps = {
@@ -265,4 +284,5 @@ CheckBoxInput.defaultProps = {
     checkedTextColor: `${defaultThemeColor.neutral['neutral-1']}`,
     defaultBorderColor: '#D4D7E3',
     checkedCheckBoxColor: `${defaultThemeColor.primary['primary-1']}`,
+    isRequired: true
 };

package/components/Inputs/DropdownSelect.js

@@ -396,6 +396,7 @@ export const DropdownSelect = ({
           placeholder={placeHolder}
           onChange={setSelectedValue}
           isLoading={isLoading}
+          isDisabled={isDisabled}
           {...props}
         />
       ) : dropdownType === 'asyncMultiSelect' ? (
@@ -415,6 +416,7 @@ export const DropdownSelect = ({
           placeholder={placeHolder}
           styles={stylesComp}
           isMulti={true}
+          isDisabled={isDisabled}
           hideSelectedOptions={false}
           closeMenuOnSelect={false}
           isSearchable={true}

package/dist/index.es.js

@@ -659,7 +659,7 @@ ${({theme:e,type:t,drawerOpen:o,customStyles:r})=>{if(e){let l={};if(e[t]){for(c
 `,dt=s.div`
   flex-direction: ${({inline:e})=>e?"row":"column"};
   width: ${({inline:e})=>e?"initial":"auto"};
-`,pt=({getCheckedArr:t,checkBoxOuterStyle:o,checkBoxInnerStyle:r,optionTextStyle:i,defaultBorderColor:a,defaultTextColor:n,checkedTextColor:c,checkedCheckBoxColor:s,labelStyle:d,label:p,options:m,setOptions:u,inline:g,wrapperStyle:f,...b})=>{l((()=>{h(m)}),[]);const h=e=>{let o=e.filter((e=>!1!==e.checked));t(o)},y=Object.assign({display:"flex",flexDirection:"column",flexWrap:"wrap"},f);return e.createElement("div",w({style:y},b),e.createElement(L,w({themeColor:M,customStyles:d,type:"check-label",text:p},b)),e.createElement(dt,w({style:{display:"flex",flexWrap:"wrap"},inline:g},b),m?.map(((t,l)=>e.createElement(st,w({inline:g,key:`${t.name}-${l}`,onClick:()=>{((e,t)=>{let o=[...m];o[t].checked=!e.checked,u(o),h(o)})(t,l)}},b),t.checked?e.createElement(nt,w({theme:W,defaultCheckBoxInnerStyle:"checkBox-inner",checkBoxInnerStyle:{...r,cursor:t?.disabled?"not-allowed ":" pointer",borderColor:t?.disabled&&t?.disabledColor},defaultBorderColor:a,checkedCheckBoxColor:s,checked:!t?.disabled&&t.checked},b),e.createElement(it,{icon:"check-icon",size:18,color:"white"})):e.createElement(at,w({theme:W,defaultCheckBoxOuterStyle:"checkBox-outer",checkBoxOuterStyle:{...o,cursor:t?.disabled?"not-allowed ":" pointer",borderColor:t?.disabledColor},defaultBorderColor:a},b)),e.createElement(ct,{inline:g,optionTextStyle:{...i,cursor:t?.disabled?"not-allowed ":" pointer",color:t?.disabledColor},checked:t.checked,defaultTextColor:n,checkedTextColor:c},t.label))))))};pt.propTypes={wrapperStyle:c.object,label:c.string,labelStyle:c.object,checkBoxOuterStyle:c.object,checkBoxInnerStyle:c.object,optionTextStyle:c.object,defaultTextColor:c.string,checkedTextColor:c.string,defaultBorderColor:c.string,checkedCheckBoxColor:c.string,inline:c.bool,options:c.array,setOptions:c.func,getCheckedArr:c.func},pt.defaultProps={label:"",inline:!1,options:[],setOptions:()=>{},getCheckedArr:()=>{},labelStyle:{},checkBoxOuterStyle:{},checkBoxInnerStyle:{},defaultTextColor:`${M.neutral["neutral-2"]}`,checkedTextColor:`${M.neutral["neutral-1"]}`,defaultBorderColor:"#D4D7E3",checkedCheckBoxColor:`${M.primary["primary-1"]}`};const mt=s.div`
+`,pt=({getCheckedArr:t,checkBoxOuterStyle:o,checkBoxInnerStyle:r,optionTextStyle:i,defaultBorderColor:a,defaultTextColor:n,checkedTextColor:c,checkedCheckBoxColor:s,labelStyle:d,label:p,options:m,setOptions:u,inline:g,wrapperStyle:f,isRequired:b,...h})=>{l((()=>{y(m)}),[]);const y=e=>{let o=e.filter((e=>!1!==e.checked));t(o)},x=Object.assign({display:"flex",flexDirection:"column",flexWrap:"wrap"},f);return e.createElement("div",w({style:x},h),e.createElement("div",{style:{display:"flex"}},e.createElement(L,w({themeColor:M,customStyles:d,type:"check-label",text:p},h)),b&&e.createElement("div",{style:{marginLeft:"4px",color:`${M.variant.error}`}},"*")),e.createElement(dt,w({style:{display:"flex",flexWrap:"wrap"},inline:g},h),m?.map(((t,l)=>e.createElement(st,w({inline:g,key:`${t.name}-${l}`,onClick:()=>{((e,t)=>{let o=[...m];o[t].checked=!e.checked,u(o),y(o)})(t,l)}},h),t.checked?e.createElement(nt,w({theme:W,defaultCheckBoxInnerStyle:"checkBox-inner",checkBoxInnerStyle:{...r,cursor:t?.disabled?"not-allowed ":" pointer",borderColor:t?.disabled&&t?.disabledColor},defaultBorderColor:a,checkedCheckBoxColor:s,checked:!t?.disabled&&t.checked},h),e.createElement(it,{icon:"check-icon",size:18,color:"white"})):e.createElement(at,w({theme:W,defaultCheckBoxOuterStyle:"checkBox-outer",checkBoxOuterStyle:{...o,cursor:t?.disabled?"not-allowed ":" pointer",borderColor:t?.disabledColor},defaultBorderColor:a},h)),e.createElement(ct,{inline:g,optionTextStyle:{...i,cursor:t?.disabled?"not-allowed ":" pointer",color:t?.disabledColor},checked:t.checked,defaultTextColor:n,checkedTextColor:c},t.label))))))};pt.propTypes={wrapperStyle:c.object,label:c.string,labelStyle:c.object,checkBoxOuterStyle:c.object,checkBoxInnerStyle:c.object,optionTextStyle:c.object,defaultTextColor:c.string,checkedTextColor:c.string,defaultBorderColor:c.string,checkedCheckBoxColor:c.string,inline:c.bool,options:c.array,setOptions:c.func,getCheckedArr:c.func,isRequired:c.bool},pt.defaultProps={label:"",inline:!1,options:[],setOptions:()=>{},getCheckedArr:()=>{},labelStyle:{},checkBoxOuterStyle:{},checkBoxInnerStyle:{},defaultTextColor:`${M.neutral["neutral-2"]}`,checkedTextColor:`${M.neutral["neutral-1"]}`,defaultBorderColor:"#D4D7E3",checkedCheckBoxColor:`${M.primary["primary-1"]}`,isRequired:!0};const mt=s.div`
   color: #a9b1b8;
   font-size: 21px;
   border: 1px solid
@@ -1364,7 +1364,7 @@ ${({theme:e,type:t,drawerOpen:o,customStyles:r})=>{if(e){let l={};if(e[t]){for(c
   margin-left: 6px;
   margin-top: -14px;
   cursor: pointer;
-`,yo=({customWrapperStyles:t,customLabelStyles:o,labelStyle:r,label:l,isRequired:i,optionArr:a,selectedValue:n,setSelectedValue:c,placeHolder:s,dropdownType:d,isDisabled:p,isValid:m,clearSelected:u,isClearable:g,isLoading:f,height:b,fontSize:A,loadOptions:v,onInputChange:C,...S})=>{const k=t=>e.createElement(y.DropdownIndicator,t,e.createElement(ho,{onClick:()=>{u(),t.clearValue()}},e.createElement(it,{icon:"cross-icon",color:"black",size:8})),e.createElement(ho,null,e.createElement(it,{icon:"triangle-down",color:"black",size:8}))),E=t=>{const o={width:"15px",height:"15px",borderRadius:"2px",padding:"4px",fontSize:"8px",lineHeight:"10px"},r=e.createElement("div",{style:{...o,backgroundColor:t?.data?.color??"#2E56F4"}},e.createElement(it,{icon:"check-icon",color:"white"})),l=e.createElement("div",{style:{...o,backgroundColor:"#e0e7ff"}});return e.createElement(y.Option,t,e.createElement("div",{style:{display:"flex",justifyContent:"start",alignItems:"center",width:"100%"}},t.isSelected?r:l,e.createElement("div",{className:"text-main-alt",style:{marginLeft:"10px"}},t.label)))},z=({index:t,...o})=>{const r=o?.data?.label||"Select";return!t&&e.createElement("div",{className:"text-main-alt"},r)},V=({getValue:t,children:o,...r})=>{const l=t().length;return e.createElement(y.ValueContainer,r,o,l>1&&e.createElement("div",{className:"text-more-alt"},"& ",l-1," more"))},I={control:(e,t)=>({...e,border:m?"1px solid "+M.border:"1px solid "+M.ui.error,height:`${b}px`,minHeight:`${b}px`,boxShadow:(t.isSelected||t.isFocused)&&"none"}),placeholder:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),dropdownIndicator:e=>({...e,height:`${b}px`,display:"flex",justifyContent:"center",alignItems:"center"}),valueContainer:e=>({...e,fontSize:A+"px"}),indicatorsContainer:e=>({...e,padding:0,height:`${b}px`}),menu:e=>({...e,border:"none",marginTop:"1px",borderTopRightRadius:"0px",borderTopLeftRadius:"0px",outline:"none",boxShadow:"0px 6px 20px rgba(56, 66, 100, 0.15)",borderRadius:"4.32px",fontSize:A+"px"}),singleValue:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),multiValue:e=>({...e,marginLeft:"0px"}),input:e=>({...e,fontSize:A+"px"}),option:(e,t)=>({...e,backgroundColor:t.isSelected||t.isFocused?"#F0F3F8":"white",padding:"10px",cursor:"pointer",color:"#081348"}),...S.styles};return e.createElement(fo,{style:t,isValid:m,fontSize:A},l&&e.createElement(bo,{theme:W,labelWrapperStyle:"selectComp-label-wrapper",style:o},e.createElement(L,{themeColor:M,customStyles:r,type:"label-text",text:l,style:{marginBottom:"7px",paddingBottom:"0px"}}),i&&e.createElement("div",{style:{marginLeft:"4px",color:`${M.ui.error}`}},"*")),"multiSelect"===d?e.createElement(h,w({components:{DropdownIndicator:k,MultiValue:z,Option:E,ValueContainer:V,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:s,value:n,options:a,styles:I,isMulti:!0,isDisabled:p,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:f},S)):"asyncSingleSelect"===d?e.createElement(x,w({loadOptions:v,defaultOptions:!0,onInputChange:C,styles:I,components:{DropdownIndicator:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",placeholder:s,onChange:c,isLoading:f},S)):"asyncMultiSelect"===d?e.createElement(x,w({components:{DropdownIndicator:k,MultiValue:z,ValueContainer:V,Option:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:s,styles:I,isMulti:!0,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:f,loadOptions:v,defaultOptions:!0,onInputChange:C},S)):e.createElement(h,w({components:{DropdownIndicator:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",options:a,placeholder:s,isDisabled:p,value:{value:n?n.value:"",label:n?n.label:""},styles:I,onChange:c,isLoading:f},S)))};yo.propTypes={label:c.string,labelStyle:c.object,optionArr:c.array,selectedValue:c.object,setSelectedValue:c.func,placeHolder:c.string,fontSize:c.number,clearSelected:c.func,loadOptions:c.func,onInputChange:c.func},yo.defaultProps={label:"",labelStyle:{},optionArr:[],selectedValue:{},setSelectedValue:void 0,placeHolder:"Select an option",isValid:!0,isClearable:!1,height:31,fontSize:14,loadOptions:()=>{},onInputChange:()=>{},clearSelected:()=>{}};const xo=({label:t,placeholder:o,handleSearch:r,searchInput:l,customStylesForm:i,customStyleObject:a,textBoxStyle:n,...c})=>e.createElement(tt,w({iconAfter:e.createElement(it,{icon:"magnifier-icon"}),label:t,textBoxStyle:n,placeholder:o,ref:l,onChange:r},c)),Ao=s.div`
+`,yo=({customWrapperStyles:t,customLabelStyles:o,labelStyle:r,label:l,isRequired:i,optionArr:a,selectedValue:n,setSelectedValue:c,placeHolder:s,dropdownType:d,isDisabled:p,isValid:m,clearSelected:u,isClearable:g,isLoading:f,height:b,fontSize:A,loadOptions:v,onInputChange:C,...S})=>{const k=t=>e.createElement(y.DropdownIndicator,t,e.createElement(ho,{onClick:()=>{u(),t.clearValue()}},e.createElement(it,{icon:"cross-icon",color:"black",size:8})),e.createElement(ho,null,e.createElement(it,{icon:"triangle-down",color:"black",size:8}))),E=t=>{const o={width:"15px",height:"15px",borderRadius:"2px",padding:"4px",fontSize:"8px",lineHeight:"10px"},r=e.createElement("div",{style:{...o,backgroundColor:t?.data?.color??"#2E56F4"}},e.createElement(it,{icon:"check-icon",color:"white"})),l=e.createElement("div",{style:{...o,backgroundColor:"#e0e7ff"}});return e.createElement(y.Option,t,e.createElement("div",{style:{display:"flex",justifyContent:"start",alignItems:"center",width:"100%"}},t.isSelected?r:l,e.createElement("div",{className:"text-main-alt",style:{marginLeft:"10px"}},t.label)))},z=({index:t,...o})=>{const r=o?.data?.label||"Select";return!t&&e.createElement("div",{className:"text-main-alt"},r)},V=({getValue:t,children:o,...r})=>{const l=t().length;return e.createElement(y.ValueContainer,r,o,l>1&&e.createElement("div",{className:"text-more-alt"},"& ",l-1," more"))},I={control:(e,t)=>({...e,border:m?"1px solid "+M.border:"1px solid "+M.ui.error,height:`${b}px`,minHeight:`${b}px`,boxShadow:(t.isSelected||t.isFocused)&&"none"}),placeholder:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),dropdownIndicator:e=>({...e,height:`${b}px`,display:"flex",justifyContent:"center",alignItems:"center"}),valueContainer:e=>({...e,fontSize:A+"px"}),indicatorsContainer:e=>({...e,padding:0,height:`${b}px`}),menu:e=>({...e,border:"none",marginTop:"1px",borderTopRightRadius:"0px",borderTopLeftRadius:"0px",outline:"none",boxShadow:"0px 6px 20px rgba(56, 66, 100, 0.15)",borderRadius:"4.32px",fontSize:A+"px"}),singleValue:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),multiValue:e=>({...e,marginLeft:"0px"}),input:e=>({...e,fontSize:A+"px"}),option:(e,t)=>({...e,backgroundColor:t.isSelected||t.isFocused?"#F0F3F8":"white",padding:"10px",cursor:"pointer",color:"#081348"}),...S.styles};return e.createElement(fo,{style:t,isValid:m,fontSize:A},l&&e.createElement(bo,{theme:W,labelWrapperStyle:"selectComp-label-wrapper",style:o},e.createElement(L,{themeColor:M,customStyles:r,type:"label-text",text:l,style:{marginBottom:"7px",paddingBottom:"0px"}}),i&&e.createElement("div",{style:{marginLeft:"4px",color:`${M.ui.error}`}},"*")),"multiSelect"===d?e.createElement(h,w({components:{DropdownIndicator:k,MultiValue:z,Option:E,ValueContainer:V,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:s,value:n,options:a,styles:I,isMulti:!0,isDisabled:p,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:f},S)):"asyncSingleSelect"===d?e.createElement(x,w({loadOptions:v,defaultOptions:!0,onInputChange:C,styles:I,components:{DropdownIndicator:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",placeholder:s,onChange:c,isLoading:f,isDisabled:p},S)):"asyncMultiSelect"===d?e.createElement(x,w({components:{DropdownIndicator:k,MultiValue:z,ValueContainer:V,Option:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:s,styles:I,isMulti:!0,isDisabled:p,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:f,loadOptions:v,defaultOptions:!0,onInputChange:C},S)):e.createElement(h,w({components:{DropdownIndicator:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",options:a,placeholder:s,isDisabled:p,value:{value:n?n.value:"",label:n?n.label:""},styles:I,onChange:c,isLoading:f},S)))};yo.propTypes={label:c.string,labelStyle:c.object,optionArr:c.array,selectedValue:c.object,setSelectedValue:c.func,placeHolder:c.string,fontSize:c.number,clearSelected:c.func,loadOptions:c.func,onInputChange:c.func},yo.defaultProps={label:"",labelStyle:{},optionArr:[],selectedValue:{},setSelectedValue:void 0,placeHolder:"Select an option",isValid:!0,isClearable:!1,height:31,fontSize:14,loadOptions:()=>{},onInputChange:()=>{},clearSelected:()=>{}};const xo=({label:t,placeholder:o,handleSearch:r,searchInput:l,customStylesForm:i,customStyleObject:a,textBoxStyle:n,...c})=>e.createElement(tt,w({iconAfter:e.createElement(it,{icon:"magnifier-icon"}),label:t,textBoxStyle:n,placeholder:o,ref:l,onChange:r},c)),Ao=s.div`
   //Set the styles from the default styles object
   ${({theme:e,defaultWrapperStyle:t})=>I(e,t)}
 

package/dist/index.js

@@ -659,7 +659,7 @@ ${({theme:e,type:t,drawerOpen:l,customStyles:o})=>{if(e){let a={};if(e[t]){for(c
 `,nt=m.default.div`
   flex-direction: ${({inline:e})=>e?"row":"column"};
   width: ${({inline:e})=>e?"initial":"auto"};
-`,ct=({getCheckedArr:t,checkBoxOuterStyle:l,checkBoxInnerStyle:o,optionTextStyle:a,defaultBorderColor:r,defaultTextColor:i,checkedTextColor:n,checkedCheckBoxColor:c,labelStyle:d,label:s,options:u,setOptions:f,inline:m,wrapperStyle:g,...b})=>{e.useEffect((()=>{h(u)}),[]);const h=e=>{let l=e.filter((e=>!1!==e.checked));t(l)},y=Object.assign({display:"flex",flexDirection:"column",flexWrap:"wrap"},g);return p.default.createElement("div",v({style:y},b),p.default.createElement(W,v({themeColor:z,customStyles:d,type:"check-label",text:s},b)),p.default.createElement(nt,v({style:{display:"flex",flexWrap:"wrap"},inline:m},b),u?.map(((e,t)=>p.default.createElement(it,v({inline:m,key:`${e.name}-${t}`,onClick:()=>{((e,t)=>{let l=[...u];l[t].checked=!e.checked,f(l),h(l)})(e,t)}},b),e.checked?p.default.createElement(at,v({theme:V,defaultCheckBoxInnerStyle:"checkBox-inner",checkBoxInnerStyle:{...o,cursor:e?.disabled?"not-allowed ":" pointer",borderColor:e?.disabled&&e?.disabledColor},defaultBorderColor:r,checkedCheckBoxColor:c,checked:!e?.disabled&&e.checked},b),p.default.createElement(lt,{icon:"check-icon",size:18,color:"white"})):p.default.createElement(ot,v({theme:V,defaultCheckBoxOuterStyle:"checkBox-outer",checkBoxOuterStyle:{...l,cursor:e?.disabled?"not-allowed ":" pointer",borderColor:e?.disabledColor},defaultBorderColor:r},b)),p.default.createElement(rt,{inline:m,optionTextStyle:{...a,cursor:e?.disabled?"not-allowed ":" pointer",color:e?.disabledColor},checked:e.checked,defaultTextColor:i,checkedTextColor:n},e.label))))))};ct.propTypes={wrapperStyle:f.default.object,label:f.default.string,labelStyle:f.default.object,checkBoxOuterStyle:f.default.object,checkBoxInnerStyle:f.default.object,optionTextStyle:f.default.object,defaultTextColor:f.default.string,checkedTextColor:f.default.string,defaultBorderColor:f.default.string,checkedCheckBoxColor:f.default.string,inline:f.default.bool,options:f.default.array,setOptions:f.default.func,getCheckedArr:f.default.func},ct.defaultProps={label:"",inline:!1,options:[],setOptions:()=>{},getCheckedArr:()=>{},labelStyle:{},checkBoxOuterStyle:{},checkBoxInnerStyle:{},defaultTextColor:`${z.neutral["neutral-2"]}`,checkedTextColor:`${z.neutral["neutral-1"]}`,defaultBorderColor:"#D4D7E3",checkedCheckBoxColor:`${z.primary["primary-1"]}`};const dt=m.default.div`
+`,ct=({getCheckedArr:t,checkBoxOuterStyle:l,checkBoxInnerStyle:o,optionTextStyle:a,defaultBorderColor:r,defaultTextColor:i,checkedTextColor:n,checkedCheckBoxColor:c,labelStyle:d,label:s,options:u,setOptions:f,inline:m,wrapperStyle:g,isRequired:b,...h})=>{e.useEffect((()=>{y(u)}),[]);const y=e=>{let l=e.filter((e=>!1!==e.checked));t(l)},x=Object.assign({display:"flex",flexDirection:"column",flexWrap:"wrap"},g);return p.default.createElement("div",v({style:x},h),p.default.createElement("div",{style:{display:"flex"}},p.default.createElement(W,v({themeColor:z,customStyles:d,type:"check-label",text:s},h)),b&&p.default.createElement("div",{style:{marginLeft:"4px",color:`${z.variant.error}`}},"*")),p.default.createElement(nt,v({style:{display:"flex",flexWrap:"wrap"},inline:m},h),u?.map(((e,t)=>p.default.createElement(it,v({inline:m,key:`${e.name}-${t}`,onClick:()=>{((e,t)=>{let l=[...u];l[t].checked=!e.checked,f(l),y(l)})(e,t)}},h),e.checked?p.default.createElement(at,v({theme:V,defaultCheckBoxInnerStyle:"checkBox-inner",checkBoxInnerStyle:{...o,cursor:e?.disabled?"not-allowed ":" pointer",borderColor:e?.disabled&&e?.disabledColor},defaultBorderColor:r,checkedCheckBoxColor:c,checked:!e?.disabled&&e.checked},h),p.default.createElement(lt,{icon:"check-icon",size:18,color:"white"})):p.default.createElement(ot,v({theme:V,defaultCheckBoxOuterStyle:"checkBox-outer",checkBoxOuterStyle:{...l,cursor:e?.disabled?"not-allowed ":" pointer",borderColor:e?.disabledColor},defaultBorderColor:r},h)),p.default.createElement(rt,{inline:m,optionTextStyle:{...a,cursor:e?.disabled?"not-allowed ":" pointer",color:e?.disabledColor},checked:e.checked,defaultTextColor:i,checkedTextColor:n},e.label))))))};ct.propTypes={wrapperStyle:f.default.object,label:f.default.string,labelStyle:f.default.object,checkBoxOuterStyle:f.default.object,checkBoxInnerStyle:f.default.object,optionTextStyle:f.default.object,defaultTextColor:f.default.string,checkedTextColor:f.default.string,defaultBorderColor:f.default.string,checkedCheckBoxColor:f.default.string,inline:f.default.bool,options:f.default.array,setOptions:f.default.func,getCheckedArr:f.default.func,isRequired:f.default.bool},ct.defaultProps={label:"",inline:!1,options:[],setOptions:()=>{},getCheckedArr:()=>{},labelStyle:{},checkBoxOuterStyle:{},checkBoxInnerStyle:{},defaultTextColor:`${z.neutral["neutral-2"]}`,checkedTextColor:`${z.neutral["neutral-1"]}`,defaultBorderColor:"#D4D7E3",checkedCheckBoxColor:`${z.primary["primary-1"]}`,isRequired:!0};const dt=m.default.div`
   color: #a9b1b8;
   font-size: 21px;
   border: 1px solid
@@ -1364,7 +1364,7 @@ ${({theme:e,type:t,drawerOpen:l,customStyles:o})=>{if(e){let a={};if(e[t]){for(c
   margin-left: 6px;
   margin-top: -14px;
   cursor: pointer;
-`,ml=({customWrapperStyles:e,customLabelStyles:t,labelStyle:l,label:o,isRequired:a,optionArr:r,selectedValue:n,setSelectedValue:c,placeHolder:d,dropdownType:s,isDisabled:u,isValid:f,clearSelected:m,isClearable:g,isLoading:b,height:x,fontSize:A,loadOptions:C,onInputChange:w,...S})=>{const E=e=>p.default.createElement(i.components.DropdownIndicator,e,p.default.createElement(fl,{onClick:()=>{m(),e.clearValue()}},p.default.createElement(lt,{icon:"cross-icon",color:"black",size:8})),p.default.createElement(fl,null,p.default.createElement(lt,{icon:"triangle-down",color:"black",size:8}))),k=e=>{const t={width:"15px",height:"15px",borderRadius:"2px",padding:"4px",fontSize:"8px",lineHeight:"10px"},l=p.default.createElement("div",{style:{...t,backgroundColor:e?.data?.color??"#2E56F4"}},p.default.createElement(lt,{icon:"check-icon",color:"white"})),o=p.default.createElement("div",{style:{...t,backgroundColor:"#e0e7ff"}});return p.default.createElement(i.components.Option,e,p.default.createElement("div",{style:{display:"flex",justifyContent:"start",alignItems:"center",width:"100%"}},e.isSelected?l:o,p.default.createElement("div",{className:"text-main-alt",style:{marginLeft:"10px"}},e.label)))},M=({index:e,...t})=>{const l=t?.data?.label||"Select";return!e&&p.default.createElement("div",{className:"text-main-alt"},l)},R=({getValue:e,children:t,...l})=>{const o=e().length;return p.default.createElement(i.components.ValueContainer,l,t,o>1&&p.default.createElement("div",{className:"text-more-alt"},"& ",o-1," more"))},I={control:(e,t)=>({...e,border:f?"1px solid "+z.border:"1px solid "+z.ui.error,height:`${x}px`,minHeight:`${x}px`,boxShadow:(t.isSelected||t.isFocused)&&"none"}),placeholder:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),dropdownIndicator:e=>({...e,height:`${x}px`,display:"flex",justifyContent:"center",alignItems:"center"}),valueContainer:e=>({...e,fontSize:A+"px"}),indicatorsContainer:e=>({...e,padding:0,height:`${x}px`}),menu:e=>({...e,border:"none",marginTop:"1px",borderTopRightRadius:"0px",borderTopLeftRadius:"0px",outline:"none",boxShadow:"0px 6px 20px rgba(56, 66, 100, 0.15)",borderRadius:"4.32px",fontSize:A+"px"}),singleValue:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),multiValue:e=>({...e,marginLeft:"0px"}),input:e=>({...e,fontSize:A+"px"}),option:(e,t)=>({...e,backgroundColor:t.isSelected||t.isFocused?"#F0F3F8":"white",padding:"10px",cursor:"pointer",color:"#081348"}),...S.styles};return p.default.createElement(ul,{style:e,isValid:f,fontSize:A},o&&p.default.createElement(pl,{theme:V,labelWrapperStyle:"selectComp-label-wrapper",style:t},p.default.createElement(W,{themeColor:z,customStyles:l,type:"label-text",text:o,style:{marginBottom:"7px",paddingBottom:"0px"}}),a&&p.default.createElement("div",{style:{marginLeft:"4px",color:`${z.ui.error}`}},"*")),"multiSelect"===s?p.default.createElement(h.default,v({components:{DropdownIndicator:E,MultiValue:M,Option:k,ValueContainer:R,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:d,value:n,options:r,styles:I,isMulti:!0,isDisabled:u,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:b},S)):"asyncSingleSelect"===s?p.default.createElement(y.default,v({loadOptions:C,defaultOptions:!0,onInputChange:w,styles:I,components:{DropdownIndicator:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",placeholder:d,onChange:c,isLoading:b},S)):"asyncMultiSelect"===s?p.default.createElement(y.default,v({components:{DropdownIndicator:E,MultiValue:M,ValueContainer:R,Option:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:d,styles:I,isMulti:!0,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:b,loadOptions:C,defaultOptions:!0,onInputChange:w},S)):p.default.createElement(h.default,v({components:{DropdownIndicator:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",options:r,placeholder:d,isDisabled:u,value:{value:n?n.value:"",label:n?n.label:""},styles:I,onChange:c,isLoading:b},S)))};ml.propTypes={label:f.default.string,labelStyle:f.default.object,optionArr:f.default.array,selectedValue:f.default.object,setSelectedValue:f.default.func,placeHolder:f.default.string,fontSize:f.default.number,clearSelected:f.default.func,loadOptions:f.default.func,onInputChange:f.default.func},ml.defaultProps={label:"",labelStyle:{},optionArr:[],selectedValue:{},setSelectedValue:void 0,placeHolder:"Select an option",isValid:!0,isClearable:!1,height:31,fontSize:14,loadOptions:()=>{},onInputChange:()=>{},clearSelected:()=>{}};const gl=({label:e,placeholder:t,handleSearch:l,searchInput:o,customStylesForm:a,customStyleObject:r,textBoxStyle:i,...n})=>p.default.createElement($e,v({iconAfter:p.default.createElement(lt,{icon:"magnifier-icon"}),label:e,textBoxStyle:i,placeholder:t,ref:o,onChange:l},n)),bl=m.default.div`
+`,ml=({customWrapperStyles:e,customLabelStyles:t,labelStyle:l,label:o,isRequired:a,optionArr:r,selectedValue:n,setSelectedValue:c,placeHolder:d,dropdownType:s,isDisabled:u,isValid:f,clearSelected:m,isClearable:g,isLoading:b,height:x,fontSize:A,loadOptions:C,onInputChange:w,...S})=>{const E=e=>p.default.createElement(i.components.DropdownIndicator,e,p.default.createElement(fl,{onClick:()=>{m(),e.clearValue()}},p.default.createElement(lt,{icon:"cross-icon",color:"black",size:8})),p.default.createElement(fl,null,p.default.createElement(lt,{icon:"triangle-down",color:"black",size:8}))),k=e=>{const t={width:"15px",height:"15px",borderRadius:"2px",padding:"4px",fontSize:"8px",lineHeight:"10px"},l=p.default.createElement("div",{style:{...t,backgroundColor:e?.data?.color??"#2E56F4"}},p.default.createElement(lt,{icon:"check-icon",color:"white"})),o=p.default.createElement("div",{style:{...t,backgroundColor:"#e0e7ff"}});return p.default.createElement(i.components.Option,e,p.default.createElement("div",{style:{display:"flex",justifyContent:"start",alignItems:"center",width:"100%"}},e.isSelected?l:o,p.default.createElement("div",{className:"text-main-alt",style:{marginLeft:"10px"}},e.label)))},M=({index:e,...t})=>{const l=t?.data?.label||"Select";return!e&&p.default.createElement("div",{className:"text-main-alt"},l)},R=({getValue:e,children:t,...l})=>{const o=e().length;return p.default.createElement(i.components.ValueContainer,l,t,o>1&&p.default.createElement("div",{className:"text-more-alt"},"& ",o-1," more"))},I={control:(e,t)=>({...e,border:f?"1px solid "+z.border:"1px solid "+z.ui.error,height:`${x}px`,minHeight:`${x}px`,boxShadow:(t.isSelected||t.isFocused)&&"none"}),placeholder:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),dropdownIndicator:e=>({...e,height:`${x}px`,display:"flex",justifyContent:"center",alignItems:"center"}),valueContainer:e=>({...e,fontSize:A+"px"}),indicatorsContainer:e=>({...e,padding:0,height:`${x}px`}),menu:e=>({...e,border:"none",marginTop:"1px",borderTopRightRadius:"0px",borderTopLeftRadius:"0px",outline:"none",boxShadow:"0px 6px 20px rgba(56, 66, 100, 0.15)",borderRadius:"4.32px",fontSize:A+"px"}),singleValue:e=>({...e,fontSize:A+"px",marginLeft:"0px"}),multiValue:e=>({...e,marginLeft:"0px"}),input:e=>({...e,fontSize:A+"px"}),option:(e,t)=>({...e,backgroundColor:t.isSelected||t.isFocused?"#F0F3F8":"white",padding:"10px",cursor:"pointer",color:"#081348"}),...S.styles};return p.default.createElement(ul,{style:e,isValid:f,fontSize:A},o&&p.default.createElement(pl,{theme:V,labelWrapperStyle:"selectComp-label-wrapper",style:t},p.default.createElement(W,{themeColor:z,customStyles:l,type:"label-text",text:o,style:{marginBottom:"7px",paddingBottom:"0px"}}),a&&p.default.createElement("div",{style:{marginLeft:"4px",color:`${z.ui.error}`}},"*")),"multiSelect"===s?p.default.createElement(h.default,v({components:{DropdownIndicator:E,MultiValue:M,Option:k,ValueContainer:R,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:d,value:n,options:r,styles:I,isMulti:!0,isDisabled:u,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:b},S)):"asyncSingleSelect"===s?p.default.createElement(y.default,v({loadOptions:C,defaultOptions:!0,onInputChange:w,styles:I,components:{DropdownIndicator:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",placeholder:d,onChange:c,isLoading:b,isDisabled:u},S)):"asyncMultiSelect"===s?p.default.createElement(y.default,v({components:{DropdownIndicator:E,MultiValue:M,ValueContainer:R,Option:k,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",onChange:c,placeholder:d,styles:I,isMulti:!0,isDisabled:u,hideSelectedOptions:!1,closeMenuOnSelect:!1,isSearchable:!0,isLoading:b,loadOptions:C,defaultOptions:!0,onInputChange:w},S)):p.default.createElement(h.default,v({components:{DropdownIndicator:E,IndicatorSeparator:()=>null,ClearIndicator:()=>null},className:"select-manage-page",classNamePrefix:"new-select",name:"select-dropdown",options:r,placeholder:d,isDisabled:u,value:{value:n?n.value:"",label:n?n.label:""},styles:I,onChange:c,isLoading:b},S)))};ml.propTypes={label:f.default.string,labelStyle:f.default.object,optionArr:f.default.array,selectedValue:f.default.object,setSelectedValue:f.default.func,placeHolder:f.default.string,fontSize:f.default.number,clearSelected:f.default.func,loadOptions:f.default.func,onInputChange:f.default.func},ml.defaultProps={label:"",labelStyle:{},optionArr:[],selectedValue:{},setSelectedValue:void 0,placeHolder:"Select an option",isValid:!0,isClearable:!1,height:31,fontSize:14,loadOptions:()=>{},onInputChange:()=>{},clearSelected:()=>{}};const gl=({label:e,placeholder:t,handleSearch:l,searchInput:o,customStylesForm:a,customStyleObject:r,textBoxStyle:i,...n})=>p.default.createElement($e,v({iconAfter:p.default.createElement(lt,{icon:"magnifier-icon"}),label:e,textBoxStyle:i,placeholder:t,ref:o,onChange:l},n)),bl=m.default.div`
   //Set the styles from the default styles object
   ${({theme:e,defaultWrapperStyle:t})=>M(e,t)}
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "groundfloor-react-ui",
   "description": "Official component library for Ground Floor",
-  "version": "1.0.10",
+  "version": "1.0.11",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "private": false,