npm - @activecollab/components - Versions diffs - 1.0.5 → 1.0.9 - Mend

@activecollab/components 1.0.5 → 1.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1557) hide show

package/dist/esm/components/ComboBox/ComboBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.js","sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import React, {\n FC,\n useCallback,\n useState,\n useEffect,\n useRef,\n useMemo,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n StyledComboBox,\n StyledComboBoxCloseSmallIcon,\n StyledComboBoxCollapseExpandSingleIcon,\n StyledComboBoxInput,\n StyledComboBoxList,\n StyledComboBoxWrapper,\n} from \"./Styles\";\n\ninterface IComboBoxProps {\n /** Set selected items /\n selected?: string \| number;\n /* Set combobox in to loading state /\n loading?: boolean;\n /* Text to display while in loading state /\n loadingText?: string;\n /* onChange callback /\n onChange?: (e: string \| number) => void;\n /* Placeholder for Select input /\n placeholder?: string;\n /* disable Input element */\n disabled?: boolean;\n}\n\nexport const ComboBox: FC<IComboBoxProps & IAutocompleteProps> = ({\n options = [],\n selected,\n loading = false,\n loadingText,\n onChange,\n placeholder,\n handleEmptyAction,\n disabled = false,\n ...prop\n}) => {\n const selectedName = useMemo(() => {\n let value = \"\";\n if (!selected) {\n return value;\n }\n options.map((v) => {\n if ((v as IOptionGroupProps)?.options) {\n return (v as IOptionGroupProps).options.find((q) => {\n if (q.id === selected) {\n value = q.name;\n return;\n }\n });\n } else {\n if (v.id === selected) {\n value = v.name;\n return;\n }\n }\n });\n return value;\n }, [options, selected]);\n const [value, setValue] = useState(selectedName);\n const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n const [childNode, setChildNode] = useState<HTMLInputElement \| null>();\n const elementRef = useRef<HTMLInputElement \| null>(null);\n const handleRef = useForkRef(setChildNode, elementRef);\n\n const [open, setOpen] = useState(false);\n\n const handleOnKeyDown = useCallback(\n (e) => {\n if (e.key === \"Escape\" && open) {\n setOpen(false);\n setValue(selectedName);\n e.stopPropagation();\n }\n },\n [open, selectedName]\n );\n\n const formRef = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n open && childNode?.focus();\n !open && childNode?.blur();\n }, [childNode, open]);\n\n useEffect(() => {\n setValue(selectedName);\n }, [selectedName]);\n\n const emptyAction = useCallback(\n (v) => {\n handleEmptyAction?.(v);\n setOpen(false);\n },\n [handleEmptyAction]\n );\n\n const handleChange = useCallback(\n (selectedValue) => {\n if (selectedValue) {\n onChange?.(selectedValue);\n setOpen(false);\n }\n },\n [onChange]\n );\n\n const onClose = useCallback(() => {\n setTimeout(() => {\n setOpen(false);\n }, 200);\n setValue(selectedName);\n }, [selectedName]);\n\n const onOpen = useCallback(() => {\n if (!disabled) {\n setOpen(true);\n }\n }, [disabled]);\n\n const handleRenderOption = useCallback((option, props) => {\n return (\n <>\n <OptionContent\n imageUrl={option.image}\n color={option.color}\n textColor={option.textColor}\n name={option.name}\n />\n <RadioButton {...props} />\n </>\n );\n }, []);\n\n const handleDeselect = useCallback(\n (e) => {\n e.stopPropagation();\n onChange?.(\"\");\n setOpen(false);\n },\n [onChange]\n );\n\n const handleMouseDown = useCallback((e) => {\n e.preventDefault();\n }, []);\n\n return (\n <StyledComboBox className=\"c-combo-box\" $open={open} $loading={loading}>\n <StyledComboBoxWrapper\n onClick={onOpen}\n onFocus={onOpen}\n onBlur={onClose}\n ref={formRef}\n $loading={loading}\n >\n <StyledComboBoxInput\n ref={handleRef}\n value={loading && loadingText ? loadingText : value}\n onKeyDown={handleOnKeyDown}\n onChange={handleOnChange}\n placeholder={placeholder}\n disabled={disabled}\n />\n {!disabled ? (\n <>\n {loading ? (\n <SpinnerLoader />\n ) : selected ? (\n <Button\n onMouseDown={handleMouseDown}\n onClick={handleDeselect}\n variant=\"text gray\"\n >\n <StyledComboBoxCloseSmallIcon />\n </Button>\n ) : null}\n <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n </>\n ) : null}\n </StyledComboBoxWrapper>\n {!disabled ? (\n <Popper\n anchorEl={formRef.current}\n open={open}\n placement=\"bottom\"\n style={{ zIndex: 10 }}\n >\n <RemoveScroll noIsolation allowPinchZoom>\n <StyledComboBoxList $width={formRef.current?.clientWidth}>\n <Autocomplete\n {...prop}\n inputEl={childNode}\n selected={selected}\n handleChange={handleChange}\n renderOption={handleRenderOption}\n options={options}\n type=\"single\"\n handleEmptyAction={emptyAction}\n />\n </StyledComboBoxList>\n </RemoveScroll>\n </Popper>\n ) : null}\n </StyledComboBox>\n );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"names":["ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","prop","selectedName","useMemo","value","map","v","find","q","id","name","useState","setValue","handleOnChange","useCallback","e","target","childNode","setChildNode","elementRef","useRef","handleRef","useForkRef","open","setOpen","handleOnKeyDown","key","stopPropagation","formRef","useEffect","focus","blur","emptyAction","handleChange","selectedValue","onClose","setTimeout","onOpen","handleRenderOption","option","props","_jsxs","_jsx","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","current","zIndex","clientWidth","displayName"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":["React","useCallback","useState","useEffect","useRef","useMemo","RadioButton","Autocomplete","Button","useForkRef","Popper","RemoveScroll","SpinnerLoader","OptionContent","StyledComboBox","StyledComboBoxCloseSmallIcon","StyledComboBoxCollapseExpandSingleIcon","StyledComboBoxInput","StyledComboBoxList","StyledComboBoxWrapper","ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","prop","selectedName","value","map","v","find","q","id","name","setValue","handleOnChange","e","target","childNode","setChildNode","elementRef","handleRef","open","setOpen","handleOnKeyDown","key","stopPropagation","formRef","focus","blur","emptyAction","handleChange","selectedValue","onClose","setTimeout","onOpen","handleRenderOption","option","props","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","current","zIndex","clientWidth","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAEEC,WAFF,EAGEC,QAHF,EAIEC,SAJF,EAKEC,MALF,EAMEC,OANF,QAOO,OAPP;AAQA,SAASC,WAAT,QAA4B,gBAA5B;AACA,SAASC,YAAT,QAA6B,iBAA7B;AACA,SAASC,MAAT,QAAuB,kBAAvB;AAEA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,SAASC,MAAT,QAAuB,WAAvB;AAEA,SAASC,YAAT,QAA6B,qBAA7B;AACA,SAASC,aAAT,QAA8B,kCAA9B;AACA,SAASC,aAAT,QAA8B,uCAA9B;AACA,SACEC,cADF,EAEEC,4BAFF,EAGEC,sCAHF,EAIEC,mBAJF,EAKEC,kBALF,EAMEC,qBANF,QAOO,UAPP;AAwBA,OAAO,IAAMC,QAAiD,GAAG,SAApDA,QAAoD,OAU3D;AAAA;;AAAA,0BATJC,OASI;AAAA,MATJA,OASI,6BATM,EASN;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,0BAPJC,OAOI;AAAA,MAPJA,OAOI,6BAPM,KAON;AAAA,MANJC,WAMI,QANJA,WAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,WAII,QAJJA,WAII;AAAA,MAHJC,iBAGI,QAHJA,iBAGI;AAAA,2BAFJC,QAEI;AAAA,MAFJA,QAEI,8BAFO,KAEP;AAAA,MADDC,IACC;;AACJ,MAAMC,YAAY,GAAGzB,OAAO,CAAC,YAAM;AACjC,QAAI0B,KAAK,GAAG,EAAZ;;AACA,QAAI,CAACT,QAAL,EAAe;AACb,aAAOS,KAAP;AACD;;AACDV,IAAAA,OAAO,CAACW,GAAR,CAAY,UAACC,CAAD,EAAO;AACjB,UAAKA,CAAL,YAAKA,CAAD,CAA0BZ,OAA9B,EAAuC;AACrC,eAAQY,CAAD,CAAyBZ,OAAzB,CAAiCa,IAAjC,CAAsC,UAACC,CAAD,EAAO;AAClD,cAAIA,CAAC,CAACC,EAAF,KAASd,QAAb,EAAuB;AACrBS,YAAAA,KAAK,GAAGI,CAAC,CAACE,IAAV;AACA;AACD;AACF,SALM,CAAP;AAMD,OAPD,MAOO;AACL,YAAIJ,CAAC,CAACG,EAAF,KAASd,QAAb,EAAuB;AACrBS,UAAAA,KAAK,GAAGE,CAAC,CAACI,IAAV;AACA;AACD;AACF;AACF,KAdD;AAeA,WAAON,KAAP;AACD,GArB2B,EAqBzB,CAACV,OAAD,EAAUC,QAAV,CArByB,CAA5B;;AAsBA,kBAA0BpB,QAAQ,CAAC4B,YAAD,CAAlC;AAAA,MAAOC,KAAP;AAAA,MAAcO,QAAd;;AACA,MAAMC,cAAc,GAAGtC,WAAW,CAAC,UAACuC,CAAD;AAAA,WAAOF,QAAQ,CAACE,CAAC,CAACC,MAAF,CAASV,KAAV,CAAf;AAAA,GAAD,EAAkC,EAAlC,CAAlC;;AACA,mBAAkC7B,QAAQ,EAA1C;AAAA,MAAOwC,SAAP;AAAA,MAAkBC,YAAlB;;AACA,MAAMC,UAAU,GAAGxC,MAAM,CAA0B,IAA1B,CAAzB;AACA,MAAMyC,SAAS,GAAGpC,UAAU,CAACkC,YAAD,EAAeC,UAAf,CAA5B;;AAEA,mBAAwB1C,QAAQ,CAAC,KAAD,CAAhC;AAAA,MAAO4C,IAAP;AAAA,MAAaC,OAAb;;AAEA,MAAMC,eAAe,GAAG/C,WAAW,CACjC,UAACuC,CAAD,EAAO;AACL,QAAIA,CAAC,CAACS,GAAF,KAAU,QAAV,IAAsBH,IAA1B,EAAgC;AAC9BC,MAAAA,OAAO,CAAC,KAAD,CAAP;AACAT,MAAAA,QAAQ,CAACR,YAAD,CAAR;AACAU,MAAAA,CAAC,CAACU,eAAF;AACD;AACF,GAPgC,EAQjC,CAACJ,IAAD,EAAOhB,YAAP,CARiC,CAAnC;AAWA,MAAMqB,OAAO,GAAG/C,MAAM,CAAwB,IAAxB,CAAtB;AAEAD,EAAAA,SAAS,CAAC,YAAM;AACd2C,IAAAA,IAAI,KAAIJ,SAAJ,oBAAIA,SAAS,CAAEU,KAAX,EAAJ,CAAJ;AACA,KAACN,IAAD,KAASJ,SAAT,oBAASA,SAAS,CAAEW,IAAX,EAAT;AACD,GAHQ,EAGN,CAACX,SAAD,EAAYI,IAAZ,CAHM,CAAT;AAKA3C,EAAAA,SAAS,CAAC,YAAM;AACdmC,IAAAA,QAAQ,CAACR,YAAD,CAAR;AACD,GAFQ,EAEN,CAACA,YAAD,CAFM,CAAT;AAIA,MAAMwB,WAAW,GAAGrD,WAAW,CAC7B,UAACgC,CAAD,EAAO;AACLN,IAAAA,iBAAiB,QAAjB,YAAAA,iBAAiB,CAAGM,CAAH,CAAjB;AACAc,IAAAA,OAAO,CAAC,KAAD,CAAP;AACD,GAJ4B,EAK7B,CAACpB,iBAAD,CAL6B,CAA/B;AAQA,MAAM4B,YAAY,GAAGtD,WAAW,CAC9B,UAACuD,aAAD,EAAmB;AACjB,QAAIA,aAAJ,EAAmB;AACjB/B,MAAAA,QAAQ,QAAR,YAAAA,QAAQ,CAAG+B,aAAH,CAAR;AACAT,MAAAA,OAAO,CAAC,KAAD,CAAP;AACD;AACF,GAN6B,EAO9B,CAACtB,QAAD,CAP8B,CAAhC;AAUA,MAAMgC,OAAO,GAAGxD,WAAW,CAAC,YAAM;AAChCyD,IAAAA,UAAU,CAAC,YAAM;AACfX,MAAAA,OAAO,CAAC,KAAD,CAAP;AACD,KAFS,EAEP,GAFO,CAAV;AAGAT,IAAAA,QAAQ,CAACR,YAAD,CAAR;AACD,GAL0B,EAKxB,CAACA,YAAD,CALwB,CAA3B;AAOA,MAAM6B,MAAM,GAAG1D,WAAW,CAAC,YAAM;AAC/B,QAAI,CAAC2B,QAAL,EAAe;AACbmB,MAAAA,OAAO,CAAC,IAAD,CAAP;AACD;AACF,GAJyB,EAIvB,CAACnB,QAAD,CAJuB,CAA1B;AAMA,MAAMgC,kBAAkB,GAAG3D,WAAW,CAAC,UAAC4D,MAAD,EAASC,KAAT,EAAmB;AACxD,wBACE,uDACE,oBAAC,aAAD;AACE,MAAA,QAAQ,EAAED,MAAM,CAACE,KADnB;AAEE,MAAA,KAAK,EAAEF,MAAM,CAACG,KAFhB;AAGE,MAAA,SAAS,EAAEH,MAAM,CAACI,SAHpB;AAIE,MAAA,IAAI,EAAEJ,MAAM,CAACxB;AAJf,MADF,eAOE,oBAAC,WAAD,EAAiByB,KAAjB,CAPF,CADF;AAWD,GAZqC,EAYnC,EAZmC,CAAtC;AAcA,MAAMI,cAAc,GAAGjE,WAAW,CAChC,UAACuC,CAAD,EAAO;AACLA,IAAAA,CAAC,CAACU,eAAF;AACAzB,IAAAA,QAAQ,QAAR,YAAAA,QAAQ,CAAG,EAAH,CAAR;AACAsB,IAAAA,OAAO,CAAC,KAAD,CAAP;AACD,GAL+B,EAMhC,CAACtB,QAAD,CANgC,CAAlC;AASA,MAAM0C,eAAe,GAAGlE,WAAW,CAAC,UAACuC,CAAD,EAAO;AACzCA,IAAAA,CAAC,CAAC4B,cAAF;AACD,GAFkC,EAEhC,EAFgC,CAAnC;AAIA,sBACE,oBAAC,cAAD;AAAgB,IAAA,SAAS,EAAC,aAA1B;AAAwC,IAAA,KAAK,EAAEtB,IAA/C;AAAqD,IAAA,QAAQ,EAAEvB;AAA/D,kBACE,oBAAC,qBAAD;AACE,IAAA,OAAO,EAAEoC,MADX;AAEE,IAAA,OAAO,EAAEA,MAFX;AAGE,IAAA,MAAM,EAAEF,OAHV;AAIE,IAAA,GAAG,EAAEN,OAJP;AAKE,IAAA,QAAQ,EAAE5B;AALZ,kBAOE,oBAAC,mBAAD;AACE,IAAA,GAAG,EAAEsB,SADP;AAEE,IAAA,KAAK,EAAEtB,OAAO,IAAIC,WAAX,GAAyBA,WAAzB,GAAuCO,KAFhD;AAGE,IAAA,SAAS,EAAEiB,eAHb;AAIE,IAAA,QAAQ,EAAET,cAJZ;AAKE,IAAA,WAAW,EAAEb,WALf;AAME,IAAA,QAAQ,EAAEE;AANZ,IAPF,EAeG,CAACA,QAAD,gBACC,0CACGL,OAAO,gBACN,oBAAC,aAAD,OADM,GAEJD,QAAQ,gBACV,oBAAC,MAAD;AACE,IAAA,WAAW,EAAE6C,eADf;AAEE,IAAA,OAAO,EAAED,cAFX;AAGE,IAAA,OAAO,EAAC;AAHV,kBAKE,oBAAC,4BAAD,OALF,CADU,GAQR,IAXN,eAYE,oBAAC,sCAAD;AAAwC,IAAA,KAAK,EAAEpB;AAA/C,IAZF,CADD,GAeG,IA9BN,CADF,EAiCG,CAAClB,QAAD,gBACC,oBAAC,MAAD;AACE,IAAA,QAAQ,EAAEuB,OAAO,CAACkB,OADpB;AAEE,IAAA,IAAI,EAAEvB,IAFR;AAGE,IAAA,SAAS,EAAC,QAHZ;AAIE,IAAA,KAAK,EAAE;AAAEwB,MAAAA,MAAM,EAAE;AAAV;AAJT,kBAME,oBAAC,YAAD;AAAc,IAAA,WAAW,MAAzB;AAA0B,IAAA,cAAc;AAAxC,kBACE,oBAAC,kBAAD;AAAoB,IAAA,MAAM,sBAAEnB,OAAO,CAACkB,OAAV,qBAAE,iBAAiBE;AAA7C,kBACE,oBAAC,YAAD,eACM1C,IADN;AAEE,IAAA,OAAO,EAAEa,SAFX;AAGE,IAAA,QAAQ,EAAEpB,QAHZ;AAIE,IAAA,YAAY,EAAEiC,YAJhB;AAKE,IAAA,YAAY,EAAEK,kBALhB;AAME,IAAA,OAAO,EAAEvC,OANX;AAOE,IAAA,IAAI,EAAC,QAPP;AAQE,IAAA,iBAAiB,EAAEiC;AARrB,KADF,CADF,CANF,CADD,GAsBG,IAvDN,CADF;AA2DD,CApLM;AAsLPlC,QAAQ,CAACoD,WAAT,GAAuB,UAAvB","sourcesContent":["import React, {\n FC,\n useCallback,\n useState,\n useEffect,\n useRef,\n useMemo,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n StyledComboBox,\n StyledComboBoxCloseSmallIcon,\n StyledComboBoxCollapseExpandSingleIcon,\n StyledComboBoxInput,\n StyledComboBoxList,\n StyledComboBoxWrapper,\n} from \"./Styles\";\n\ninterface IComboBoxProps {\n /** Set selected items /\n selected?: string \| number;\n /* Set combobox in to loading state /\n loading?: boolean;\n /* Text to display while in loading state /\n loadingText?: string;\n /* onChange callback /\n onChange?: (e: string \| number) => void;\n /* Placeholder for Select input /\n placeholder?: string;\n /* disable Input element */\n disabled?: boolean;\n}\n\nexport const ComboBox: FC<IComboBoxProps & IAutocompleteProps> = ({\n options = [],\n selected,\n loading = false,\n loadingText,\n onChange,\n placeholder,\n handleEmptyAction,\n disabled = false,\n ...prop\n}) => {\n const selectedName = useMemo(() => {\n let value = \"\";\n if (!selected) {\n return value;\n }\n options.map((v) => {\n if ((v as IOptionGroupProps)?.options) {\n return (v as IOptionGroupProps).options.find((q) => {\n if (q.id === selected) {\n value = q.name;\n return;\n }\n });\n } else {\n if (v.id === selected) {\n value = v.name;\n return;\n }\n }\n });\n return value;\n }, [options, selected]);\n const [value, setValue] = useState(selectedName);\n const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n const [childNode, setChildNode] = useState<HTMLInputElement \| null>();\n const elementRef = useRef<HTMLInputElement \| null>(null);\n const handleRef = useForkRef(setChildNode, elementRef);\n\n const [open, setOpen] = useState(false);\n\n const handleOnKeyDown = useCallback(\n (e) => {\n if (e.key === \"Escape\" && open) {\n setOpen(false);\n setValue(selectedName);\n e.stopPropagation();\n }\n },\n [open, selectedName]\n );\n\n const formRef = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n open && childNode?.focus();\n !open && childNode?.blur();\n }, [childNode, open]);\n\n useEffect(() => {\n setValue(selectedName);\n }, [selectedName]);\n\n const emptyAction = useCallback(\n (v) => {\n handleEmptyAction?.(v);\n setOpen(false);\n },\n [handleEmptyAction]\n );\n\n const handleChange = useCallback(\n (selectedValue) => {\n if (selectedValue) {\n onChange?.(selectedValue);\n setOpen(false);\n }\n },\n [onChange]\n );\n\n const onClose = useCallback(() => {\n setTimeout(() => {\n setOpen(false);\n }, 200);\n setValue(selectedName);\n }, [selectedName]);\n\n const onOpen = useCallback(() => {\n if (!disabled) {\n setOpen(true);\n }\n }, [disabled]);\n\n const handleRenderOption = useCallback((option, props) => {\n return (\n <>\n <OptionContent\n imageUrl={option.image}\n color={option.color}\n textColor={option.textColor}\n name={option.name}\n />\n <RadioButton {...props} />\n </>\n );\n }, []);\n\n const handleDeselect = useCallback(\n (e) => {\n e.stopPropagation();\n onChange?.(\"\");\n setOpen(false);\n },\n [onChange]\n );\n\n const handleMouseDown = useCallback((e) => {\n e.preventDefault();\n }, []);\n\n return (\n <StyledComboBox className=\"c-combo-box\" $open={open} $loading={loading}>\n <StyledComboBoxWrapper\n onClick={onOpen}\n onFocus={onOpen}\n onBlur={onClose}\n ref={formRef}\n $loading={loading}\n >\n <StyledComboBoxInput\n ref={handleRef}\n value={loading && loadingText ? loadingText : value}\n onKeyDown={handleOnKeyDown}\n onChange={handleOnChange}\n placeholder={placeholder}\n disabled={disabled}\n />\n {!disabled ? (\n <>\n {loading ? (\n <SpinnerLoader />\n ) : selected ? (\n <Button\n onMouseDown={handleMouseDown}\n onClick={handleDeselect}\n variant=\"text gray\"\n >\n <StyledComboBoxCloseSmallIcon />\n </Button>\n ) : null}\n <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n </>\n ) : null}\n </StyledComboBoxWrapper>\n {!disabled ? (\n <Popper\n anchorEl={formRef.current}\n open={open}\n placement=\"bottom\"\n style={{ zIndex: 10 }}\n >\n <RemoveScroll noIsolation allowPinchZoom>\n <StyledComboBoxList $width={formRef.current?.clientWidth}>\n <Autocomplete\n {...prop}\n inputEl={childNode}\n selected={selected}\n handleChange={handleChange}\n renderOption={handleRenderOption}\n options={options}\n type=\"single\"\n handleEmptyAction={emptyAction}\n />\n </StyledComboBoxList>\n </RemoveScroll>\n </Popper>\n ) : null}\n </StyledComboBox>\n );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"file":"ComboBox.js"}

package/dist/esm/components/ComboBox/Styles.js CHANGED Viewed

@@ -1,11 +1,9 @@
-import styled, { css } from 'styled-components';
-import { Input } from '../Input/Input.js';
-import { BoxSizingStyle } from '../BoxSizingStyle.js';
-import { FontStyle } from '../FontStyle.js';
-import CloseSmallIcon from '../Icons/collection/CloseSmall.js';
-import CollapseExpandSingleIcon from '../Icons/collection/CollapseExpandSingle.js';
-var StyledComboBox = styled.div.withConfig({
+import styled, { css } from "styled-components";
+import { CollapseExpandSingleIcon, CloseSmallIcon } from "../Icons/collection";
+import { Input } from "../Input/Input";
+import { BoxSizingStyle } from "../BoxSizingStyle";
+import { FontStyle } from "../FontStyle";
+export var StyledComboBox = styled.div.withConfig({
   displayName: "Styles__StyledComboBox",
   componentId: "sc-5qvkpb-0"
 })(["border:1px solid var(--border-primary);border-radius:10px;color:var(--color-theme-900);font-size:14px;background-color:var(--input-background-color);cursor:text;", " ", " ", " ", ""], FontStyle, BoxSizingStyle, function (props) {
@@ -14,7 +12,7 @@ var StyledComboBox = styled.div.withConfig({
   return props.$loading && css(["cursor:progress;"]);
 });
 StyledComboBox.displayName = "StyledComboBox";
-var StyledComboBoxWrapper = styled.div.withConfig({
+export var StyledComboBoxWrapper = styled.div.withConfig({
   displayName: "Styles__StyledComboBoxWrapper",
   componentId: "sc-5qvkpb-1"
 })(["width:100%;height:100%;display:flex;align-items:center;", ""], function (props) {
@@ -22,30 +20,28 @@ var StyledComboBoxWrapper = styled.div.withConfig({
 });
 StyledComboBoxWrapper.displayName = "StyledComboBoxWrapper";
 var StyledIconDefaults = css(["flex-shrink:0;cursor:pointer;"]);
-var StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon).withConfig({
+export var StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon).withConfig({
   displayName: "Styles__StyledComboBoxCloseSmallIcon",
   componentId: "sc-5qvkpb-2"
 })(["", " opacity:0;transition-property:all;transition-duration:0.2s;transition-delay:0.5s;", ":hover &{opacity:1;transition-delay:0s;}"], StyledIconDefaults, StyledComboBoxWrapper);
 StyledComboBoxCloseSmallIcon.displayName = "StyledComboBoxCloseSmallIcon";
-var StyledComboBoxCollapseExpandSingleIcon = styled(CollapseExpandSingleIcon).withConfig({
+export var StyledComboBoxCollapseExpandSingleIcon = styled(CollapseExpandSingleIcon).withConfig({
   displayName: "Styles__StyledComboBoxCollapseExpandSingleIcon",
   componentId: "sc-5qvkpb-3"
 })(["", " margin:0 4px 0 0;color:var(--color-theme-600);transform:rotate(180deg);", ""], StyledIconDefaults, function (props) {
   return props.$open && css(["transform:rotate(0deg);"]);
 });
 StyledComboBoxCollapseExpandSingleIcon.displayName = "StyledComboBoxCollapseExpandSingleIcon";
-var StyledComboBoxInput = styled(Input).withConfig({
+export var StyledComboBoxInput = styled(Input).withConfig({
   displayName: "Styles__StyledComboBoxInput",
   componentId: "sc-5qvkpb-4"
 })(["overflow:hidden;text-overflow:ellipsis;background-color:transparent;border:none;width:100%;"]);
 StyledComboBoxInput.displayName = "StyledComboBoxInput";
-var StyledComboBoxList = styled.div.withConfig({
+export var StyledComboBoxList = styled.div.withConfig({
   displayName: "Styles__StyledComboBoxList",
   componentId: "sc-5qvkpb-5"
 })(["min-width:260px;background-color:var(--page-paper-main);border-radius:8px;border:1px solid var(--border-primary);box-shadow:var(--shadow-tertiary);margin:8px 0;width:", ";"], function (props) {
-  return "".concat(props.$width, "px");
+  return props.$width + "px";
 });
 StyledComboBoxList.displayName = "StyledComboBoxList";
-export { StyledComboBox, StyledComboBoxCloseSmallIcon, StyledComboBoxCollapseExpandSingleIcon, StyledComboBoxInput, StyledComboBoxList, StyledComboBoxWrapper };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/ComboBox/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"Styles.js","~~sources":["../../../../src/components/ComboBox/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { CollapseExpandSingleIcon, CloseSmallIcon } from \"../Icons/collection\";\nimport { Input } from \"../Input/Input\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledComboBoxProps {\n $open?: boolean;\n $loading?: boolean;\n}\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n border: 1px solid var(--border-primary);\n border-radius: 10px;\n color: var(--color-theme-900);\n font-size: 14px;\n background-color: var(--input-background-color);\n cursor: text;\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${(props) =>\n props.$open &&\n css`\n border-color: var(--color-primary);\n `}\n\n ${(props) =>\n props.$loading &&\n css`\n cursor: progress;\n `}\n`;\n\nStyledComboBox.displayName = \"StyledComboBox\";\n\nexport const StyledComboBoxWrapper = styled.div<{ $loading?: boolean }>`\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n\n ${(props) =>\n props.$loading &&\n css`\n pointer-events: none;\n `}\n`;\n\nStyledComboBoxWrapper.displayName = \"StyledComboBoxWrapper\";\n\nconst StyledIconDefaults = css`\n flex-shrink: 0;\n cursor: pointer;\n`;\n\nexport const StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon)`\n ${StyledIconDefaults}\n opacity: 0;\n transition-property: all;\n transition-duration: 0.2s;\n transition-delay: 0.5s;\n\n ${StyledComboBoxWrapper}:hover & {\n opacity: 1;\n transition-delay: 0s;\n }\n`;\n\nStyledComboBoxCloseSmallIcon.displayName = \"StyledComboBoxCloseSmallIcon\";\n\nexport const StyledComboBoxCollapseExpandSingleIcon = styled(\n CollapseExpandSingleIcon\n)<{ $open?: boolean }>`\n ${StyledIconDefaults}\n margin: 0 4px 0 0;\n color: var(--color-theme-600);\n transform: rotate(180deg);\n\n ${(props) =>\n props.$open &&\n css`\n transform: rotate(0deg);\n `}\n`;\n\nStyledComboBoxCollapseExpandSingleIcon.displayName =\n \"StyledComboBoxCollapseExpandSingleIcon\";\n\nexport const StyledComboBoxInput = styled(Input)`\n overflow: hidden;\n text-overflow: ellipsis;\n background-color: transparent;\n border: none;\n width: 100%;\n`;\n\nStyledComboBoxInput.displayName = \"StyledComboBoxInput\";\n\nexport const StyledComboBoxList = styled.div<{ $width?: number }>`\n min-width: 260px;\n background-color: var(--page-paper-main);\n border-radius: 8px;\n border: 1px solid var(--border-primary);\n box-shadow: var(--shadow-tertiary);\n margin: 8px 0;\n width: ${(props) => `${props.$width}px`};\n`;\n\nStyledComboBoxList.displayName = \"StyledComboBoxList\";\n"],"~~names~~":["~~StyledComboBox~~","styled","div","FontStyle","BoxSizingStyle","props","$open","css","$loading","displayName","StyledComboBoxWrapper","StyledIconDefaults","StyledComboBoxCloseSmallIcon","CloseSmallIcon","StyledComboBoxCollapseExpandSingleIcon","CollapseExpandSingleIcon","StyledComboBoxInput","Input","StyledComboBoxList","$width"],"mappings":";;;;;;;IAWaA,cAAc,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,6LAOvBC,SAPuB,EAQvBC,cARuB,EAUvB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAC,GADA,wCADA;AAAA,CAVuB,EAgBvB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,QAAN,IACAD,GADA,sBADA;AAAA,CAhBuB;AAuB3BP,cAAc,CAACS,WAAf,GAA6B,gBAA7B;IAEaC,qBAAqB,GAAGT,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,oEAM9B,UAACG,KAAD;AAAA,SACAA,KAAK,CAACG,QAAN,IACAD,GADA,0BADA;AAAA,CAN8B;AAalCG,qBAAqB,CAACD,WAAtB,GAAoC,uBAApC;AAEA,IAAME,kBAAkB,GAAGJ,GAAH,mCAAxB;IAKaK,4BAA4B,GAAGX,MAAM,CAACY,cAAD,CAAT;AAAA;AAAA;AAAA,2IACrCF,kBADqC,EAOrCD,qBAPqC;AAazCE,4BAA4B,CAACH,WAA7B,GAA2C,8BAA3C;IAEaK,sCAAsC,GAAGb,MAAM,CAC1Dc,wBAD0D,CAAT;AAAA;AAAA;AAAA,yFAG/CJ,kBAH+C,EAQ/C,UAACN,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAC,GADA,6BADA;AAAA,CAR+C;AAenDO,sCAAsC,CAACL,WAAvC,GACE,wCADF;IAGaO,mBAAmB,GAAGf,MAAM,CAACgB,KAAD,CAAT;AAAA;AAAA;AAAA;AAQhCD,mBAAmB,CAACP,WAApB,GAAkC,qBAAlC;IAEaS,kBAAkB,GAAGjB,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,oLAOpB,UAACG,KAAD;AAAA,mBAAcA,KAAK,CAACc,MAApB;AAAA,CAPoB;AAU/BD,kBAAkB,CAACT,WAAnB,GAAiC,oBAAjC;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/ComboBox/Styles.ts"],"names":["styled","css","CollapseExpandSingleIcon","CloseSmallIcon","Input","BoxSizingStyle","FontStyle","StyledComboBox","div","props","$open","$loading","displayName","StyledComboBoxWrapper","StyledIconDefaults","StyledComboBoxCloseSmallIcon","StyledComboBoxCollapseExpandSingleIcon","StyledComboBoxInput","StyledComboBoxList","$width"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AACA,SAASC,wBAAT,EAAmCC,cAAnC,QAAyD,qBAAzD;AACA,SAASC,KAAT,QAAsB,gBAAtB;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAOA,OAAO,IAAMC,cAAc,GAAGP,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,6LAOvBF,SAPuB,EAQvBD,cARuB,EAUvB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAT,GADA,wCADA;AAAA,CAVuB,EAgBvB,UAACQ,KAAD;AAAA,SACAA,KAAK,CAACE,QAAN,IACAV,GADA,sBADA;AAAA,CAhBuB,CAApB;AAuBPM,cAAc,CAACK,WAAf,GAA6B,gBAA7B;AAEA,OAAO,IAAMC,qBAAqB,GAAGb,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,oEAM9B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACE,QAAN,IACAV,GADA,0BADA;AAAA,CAN8B,CAA3B;AAaPY,qBAAqB,CAACD,WAAtB,GAAoC,uBAApC;AAEA,IAAME,kBAAkB,GAAGb,GAAH,mCAAxB;AAKA,OAAO,IAAMc,4BAA4B,GAAGf,MAAM,CAACG,cAAD,CAAT;AAAA;AAAA;AAAA,2IACrCW,kBADqC,EAOrCD,qBAPqC,CAAlC;AAaPE,4BAA4B,CAACH,WAA7B,GAA2C,8BAA3C;AAEA,OAAO,IAAMI,sCAAsC,GAAGhB,MAAM,CAC1DE,wBAD0D,CAAT;AAAA;AAAA;AAAA,yFAG/CY,kBAH+C,EAQ/C,UAACL,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAT,GADA,6BADA;AAAA,CAR+C,CAA5C;AAePe,sCAAsC,CAACJ,WAAvC,GACE,wCADF;AAGA,OAAO,IAAMK,mBAAmB,GAAGjB,MAAM,CAACI,KAAD,CAAT;AAAA;AAAA;AAAA,mGAAzB;AAQPa,mBAAmB,CAACL,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMM,kBAAkB,GAAGlB,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,oLAOpB,UAACC,KAAD;AAAA,SAAcA,KAAK,CAACU,MAApB;AAAA,CAPoB,CAAxB;AAUPD,kBAAkB,CAACN,WAAnB,GAAiC,oBAAjC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { CollapseExpandSingleIcon, CloseSmallIcon } from \"../Icons/collection\";\nimport { Input } from \"../Input/Input\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledComboBoxProps {\n $open?: boolean;\n $loading?: boolean;\n}\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n border: 1px solid var(--border-primary);\n border-radius: 10px;\n color: var(--color-theme-900);\n font-size: 14px;\n background-color: var(--input-background-color);\n cursor: text;\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${(props) =>\n props.$open &&\n css`\n border-color: var(--color-primary);\n `}\n\n ${(props) =>\n props.$loading &&\n css`\n cursor: progress;\n `}\n`;\n\nStyledComboBox.displayName = \"StyledComboBox\";\n\nexport const StyledComboBoxWrapper = styled.div<{ $loading?: boolean }>`\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n\n ${(props) =>\n props.$loading &&\n css`\n pointer-events: none;\n `}\n`;\n\nStyledComboBoxWrapper.displayName = \"StyledComboBoxWrapper\";\n\nconst StyledIconDefaults = css`\n flex-shrink: 0;\n cursor: pointer;\n`;\n\nexport const StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon)`\n ${StyledIconDefaults}\n opacity: 0;\n transition-property: all;\n transition-duration: 0.2s;\n transition-delay: 0.5s;\n\n ${StyledComboBoxWrapper}:hover & {\n opacity: 1;\n transition-delay: 0s;\n }\n`;\n\nStyledComboBoxCloseSmallIcon.displayName = \"StyledComboBoxCloseSmallIcon\";\n\nexport const StyledComboBoxCollapseExpandSingleIcon = styled(\n CollapseExpandSingleIcon\n)<{ $open?: boolean }>`\n ${StyledIconDefaults}\n margin: 0 4px 0 0;\n color: var(--color-theme-600);\n transform: rotate(180deg);\n\n ${(props) =>\n props.$open &&\n css`\n transform: rotate(0deg);\n `}\n`;\n\nStyledComboBoxCollapseExpandSingleIcon.displayName =\n \"StyledComboBoxCollapseExpandSingleIcon\";\n\nexport const StyledComboBoxInput = styled(Input)`\n overflow: hidden;\n text-overflow: ellipsis;\n background-color: transparent;\n border: none;\n width: 100%;\n`;\n\nStyledComboBoxInput.displayName = \"StyledComboBoxInput\";\n\nexport const StyledComboBoxList = styled.div<{ $width?: number }>`\n min-width: 260px;\n background-color: var(--page-paper-main);\n border-radius: 8px;\n border: 1px solid var(--border-primary);\n box-shadow: var(--shadow-tertiary);\n margin: 8px 0;\n width: ${(props) => `${props.$width}px`};\n`;\n\nStyledComboBoxList.displayName = \"StyledComboBoxList\";\n"],"file":"Styles.js"}

package/dist/esm/components/ComboBox/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from "./ComboBox";
2	+ //# sourceMappingURL=index.js.map

package/dist/esm/components/ComboBox/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../src/components/ComboBox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAd","sourcesContent":["export * from \"./ComboBox\";\n"],"file":"index.js"}

package/dist/esm/components/CompleteCheckbox/CompleteCheckbox.js CHANGED Viewed

@@ -1,9 +1,7 @@
-import 'react';
-import classnames from 'classnames';
-import { StyledCompleteCheckbox } from './Styles.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-var CompleteCheckbox = function CompleteCheckbox(_ref) {
+import React from "react";
+import classnames from "classnames";
+import { StyledCompleteCheckbox } from "./Styles";
+export var CompleteCheckbox = function CompleteCheckbox(_ref) {
   var _ref$completed = _ref.completed,
       completed = _ref$completed === void 0 ? false : _ref$completed,
       _ref$disabled = _ref.disabled,
@@ -15,25 +13,21 @@ var CompleteCheckbox = function CompleteCheckbox(_ref) {
       _ref$primary = _ref.primary,
       primary = _ref$primary === void 0 ? false : _ref$primary,
       checkMarkClassName = _ref.checkMarkClassName;
-  return /*#__PURE__*/jsx(StyledCompleteCheckbox, {
+  return /*#__PURE__*/React.createElement(StyledCompleteCheckbox, {
     onClick: onClick,
     className: classnames("c-complete-checkbox", className),
     $primary: primary,
     $completed: completed,
     $disabled: disabled,
-    $animation: !disabled && completed && animate,
-    children: /*#__PURE__*/jsxs("svg", {
-      viewBox: "0 0 48 48",
-      className: checkMarkClassName ? checkMarkClassName : "tw-w-12 tw-h-12",
-      children: [/*#__PURE__*/jsx("path", {
-        d: "M7,7l5.7,5.7 M0,24h8 M7,41l5.7-5.7 M24,48v-8 M41,41l-5.7-5.7 M48,24h-8 M41,7l-5.7,5.7 M24,0v8"
-      }), /*#__PURE__*/jsx("polyline", {
-        points: "19.5,24 22.5,27 28.5,21"
-      })]
-    })
-  });
+    $animation: !disabled && completed && animate
+  }, /*#__PURE__*/React.createElement("svg", {
+    viewBox: "0 0 48 48",
+    className: checkMarkClassName ? checkMarkClassName : "tw-w-12 tw-h-12"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M7,7l5.7,5.7 M0,24h8 M7,41l5.7-5.7 M24,48v-8 M41,41l-5.7-5.7 M48,24h-8 M41,7l-5.7,5.7 M24,0v8"
+  }), /*#__PURE__*/React.createElement("polyline", {
+    points: "19.5,24 22.5,27 28.5,21"
+  })));
 };
 CompleteCheckbox.displayName = "CompleteCheckbox";
-export { CompleteCheckbox };
-//# sourceMappingURL=CompleteCheckbox.js.map
+//# sourceMappingURL=CompleteCheckbox.js.map

package/dist/esm/components/CompleteCheckbox/CompleteCheckbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"CompleteCheckbox.js","~~sources":["../../../../src/components/CompleteCheckbox/CompleteCheckbox.tsx"],"sourcesContent":["import React, { FC, MouseEvent } from \"react\";\nimport classnames from \"classnames\";\nimport { StyledCompleteCheckbox } from \"./Styles\";\n\ninterface ICompleteCheckboxProps {\n /** Change completed state of checkbox /\n completed?: boolean;\n /* Callback /\n onClick?: (event: MouseEvent) => void;\n /* Make component disabled for interaction /\n disabled?: boolean;\n /* Animation (works only when is completed and not disabled) /\n animate?: boolean;\n /* Class names /\n className?: string \| undefined;\n /* Set green color for checkbox /\n primary?: boolean;\n /* Set checkmark height and width */\n checkMarkClassName?: string;\n}\n\nexport const CompleteCheckbox: FC<ICompleteCheckboxProps> = ({\n completed = false,\n disabled = false,\n animate = false,\n onClick,\n className,\n primary = false,\n checkMarkClassName,\n}) => {\n return (\n <StyledCompleteCheckbox\n onClick={onClick}\n className={classnames(\"c-complete-checkbox\", className)}\n $primary={primary}\n $completed={completed}\n $disabled={disabled}\n $animation={!disabled && completed && animate}\n >\n <svg\n viewBox=\"0 0 48 48\"\n className={checkMarkClassName ? checkMarkClassName : \"tw-w-12 tw-h-12\"}\n >\n <path d=\"M7,7l5.7,5.7 M0,24h8 M7,41l5.7-5.7 M24,48v-8 M41,41l-5.7-5.7 M48,24h-8 M41,7l-5.7,5.7 M24,0v8\" />\n <polyline points=\"19.5,24 22.5,27 28.5,21\" />\n </svg>\n </StyledCompleteCheckbox>\n );\n};\n\nCompleteCheckbox.displayName = \"CompleteCheckbox\";\n"],"~~names~~":["CompleteCheckbox","completed","disabled","animate","onClick","className","primary","checkMarkClassName","_jsx","classnames","_jsxs","displayName"],"mappings":";;;;;IAqBaA,gBAA4C,GAAG,SAA/CA,gBAA+C,OAQtD;AAAA,4BAPJC,SAOI;AAAA,MAPJA,SAOI,+BAPQ,KAOR;AAAA,2BANJC,QAMI;AAAA,MANJA,QAMI,8BANO,KAMP;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,KAKN;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,0BAFJC,OAEI;AAAA,MAFJA,OAEI,6BAFM,KAEN;AAAA,MADJC,kBACI,QADJA,kBACI;AACJ,sBACEC,IAAC,sBAAD;AACE,IAAA,OAAO,EAAEJ,OADX;AAEE,IAAA,SAAS,EAAEK,UAAU,CAAC,qBAAD,EAAwBJ,SAAxB,CAFvB;AAGE,IAAA,QAAQ,EAAEC,OAHZ;AAIE,IAAA,UAAU,EAAEL,SAJd;AAKE,IAAA,SAAS,EAAEC,QALb;AAME,IAAA,UAAU,EAAE,CAACA,QAAD,IAAaD,SAAb,IAA0BE,OANxC;AAAA,2BAQEO;AACE,MAAA,OAAO,EAAC,WADV;AAEE,MAAA,SAAS,EAAEH,kBAAkB,GAAGA,kBAAH,GAAwB,iBAFvD;AAAA,8BAIEC;AAAM,QAAA,CAAC,EAAC;AAAR,QAJF,eAKEA;AAAU,QAAA,MAAM,EAAC;AAAjB,QALF;AAAA;AARF,IADF;AAkBD;AAEDR,gBAAgB,CAACW,WAAjB,GAA+B,kBAA/B;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/CompleteCheckbox/CompleteCheckbox.tsx"],"names":["React","classnames","StyledCompleteCheckbox","CompleteCheckbox","completed","disabled","animate","onClick","className","primary","checkMarkClassName","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAAsC,OAAtC;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,sBAAT,QAAuC,UAAvC;AAmBA,OAAO,IAAMC,gBAA4C,GAAG,SAA/CA,gBAA+C,OAQtD;AAAA,4BAPJC,SAOI;AAAA,MAPJA,SAOI,+BAPQ,KAOR;AAAA,2BANJC,QAMI;AAAA,MANJA,QAMI,8BANO,KAMP;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,KAKN;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,0BAFJC,OAEI;AAAA,MAFJA,OAEI,6BAFM,KAEN;AAAA,MADJC,kBACI,QADJA,kBACI;AACJ,sBACE,oBAAC,sBAAD;AACE,IAAA,OAAO,EAAEH,OADX;AAEE,IAAA,SAAS,EAAEN,UAAU,CAAC,qBAAD,EAAwBO,SAAxB,CAFvB;AAGE,IAAA,QAAQ,EAAEC,OAHZ;AAIE,IAAA,UAAU,EAAEL,SAJd;AAKE,IAAA,SAAS,EAAEC,QALb;AAME,IAAA,UAAU,EAAE,CAACA,QAAD,IAAaD,SAAb,IAA0BE;AANxC,kBAQE;AACE,IAAA,OAAO,EAAC,WADV;AAEE,IAAA,SAAS,EAAEI,kBAAkB,GAAGA,kBAAH,GAAwB;AAFvD,kBAIE;AAAM,IAAA,CAAC,EAAC;AAAR,IAJF,eAKE;AAAU,IAAA,MAAM,EAAC;AAAjB,IALF,CARF,CADF;AAkBD,CA3BM;AA6BPP,gBAAgB,CAACQ,WAAjB,GAA+B,kBAA/B","sourcesContent":["import React, { FC, MouseEvent } from \"react\";\nimport classnames from \"classnames\";\nimport { StyledCompleteCheckbox } from \"./Styles\";\n\ninterface ICompleteCheckboxProps {\n /** Change completed state of checkbox /\n completed?: boolean;\n /* Callback /\n onClick?: (event: MouseEvent) => void;\n /* Make component disabled for interaction /\n disabled?: boolean;\n /* Animation (works only when is completed and not disabled) /\n animate?: boolean;\n /* Class names /\n className?: string \| undefined;\n /* Set green color for checkbox /\n primary?: boolean;\n /* Set checkmark height and width */\n checkMarkClassName?: string;\n}\n\nexport const CompleteCheckbox: FC<ICompleteCheckboxProps> = ({\n completed = false,\n disabled = false,\n animate = false,\n onClick,\n className,\n primary = false,\n checkMarkClassName,\n}) => {\n return (\n <StyledCompleteCheckbox\n onClick={onClick}\n className={classnames(\"c-complete-checkbox\", className)}\n $primary={primary}\n $completed={completed}\n $disabled={disabled}\n $animation={!disabled && completed && animate}\n >\n <svg\n viewBox=\"0 0 48 48\"\n className={checkMarkClassName ? checkMarkClassName : \"tw-w-12 tw-h-12\"}\n >\n <path d=\"M7,7l5.7,5.7 M0,24h8 M7,41l5.7-5.7 M24,48v-8 M41,41l-5.7-5.7 M48,24h-8 M41,7l-5.7,5.7 M24,0v8\" />\n <polyline points=\"19.5,24 22.5,27 28.5,21\" />\n </svg>\n </StyledCompleteCheckbox>\n );\n};\n\nCompleteCheckbox.displayName = \"CompleteCheckbox\";\n"],"file":"CompleteCheckbox.js"}

package/dist/esm/components/CompleteCheckbox/Styles.js CHANGED Viewed

@@ -1,8 +1,7 @@
-import styled, { keyframes, css } from 'styled-components';
+import styled, { css, keyframes } from "styled-components";
 var burstScale = keyframes(["from{transform:scale(0);}to{transform:scale(1);}"]);
 var burstAnimation = keyframes(["from{stroke-dashoffset:0;}to{stroke-dashoffset:8;}"]);
-var StyledCompleteCheckbox = styled.div.withConfig({
+export var StyledCompleteCheckbox = styled.div.withConfig({
   displayName: "Styles__StyledCompleteCheckbox",
   componentId: "sc-1801dzg-0"
 })(["", " border-color:var(--color-theme-600);transition:ease 0.3s all;svg{", " top:50%;left:50%;transform:translate(-50%,-50%);}svg path{fill:none;stroke:#32b370;stroke-width:3;transform:scale(0);}", " svg polyline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:0.3s;stroke-dasharray:13;stroke-dashoffset:13;stroke:#d2d2d2;", "}", " ", " ", " ", ""], {
@@ -35,6 +34,4 @@ var StyledCompleteCheckbox = styled.div.withConfig({
   });
 });
 StyledCompleteCheckbox.displayName = "StyledCompleteCheckbox";
-export { StyledCompleteCheckbox };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/CompleteCheckbox/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"Styles.js","~~sources":["../../../../src/components/CompleteCheckbox/Styles.ts"],"sourcesContent":["import styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\n\ninterface StyledCompleteCheckboxProps {\n $primary?: boolean;\n $completed?: boolean;\n $disabled?: boolean;\n $animation?: boolean;\n}\n\nconst burstScale = keyframes`\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n`;\n\nconst burstAnimation = keyframes`\n from {\n stroke-dashoffset: 0;\n }\n to {\n stroke-dashoffset: 8;\n }\n`;\n\nexport const StyledCompleteCheckbox = styled.div<StyledCompleteCheckboxProps>`\n ${tw`tw-w-6 tw-h-6 tw-rounded-full tw-border tw-border-solid tw-relative tw-cursor-pointer`}\n border-color: var(--color-theme-600);\n transition: ease 0.3s all;\n\n svg {\n ${tw`tw-absolute tw-pointer-events-none`}\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n svg path {\n fill: none;\n stroke: #32b370;\n stroke-width: 3;\n transform: scale(0);\n }\n\n ${(props) =>\n props.$primary &&\n css`\n svg path {\n stroke: var(--color-primary);\n }\n `}\n\n svg polyline {\n fill: none;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition: 0.3s;\n stroke-dasharray: 13;\n stroke-dashoffset: 13;\n stroke: #d2d2d2;\n ${(props) =>\n props.$primary &&\n css`\n stroke: var(--color-theme-500);\n `}\n }\n\n ${(props) =>\n props.$completed &&\n css`\n box-shadow: inset 0 0 0 12px var(--color-primary);\n border-color: var(--color-primary);\n border-width: 0px;\n\n ${!props.$primary &&\n css`\n ${tw`tw-border tw-border-solid`}\n box-shadow: inset 0 0 0 12px #84cc7c;\n border-color: #84cc7c;\n `}\n\n &:hover {\n box-shadow: inset 0 0 0 12px #84cc7c;\n ${props.$primary &&\n css`\n box-shadow: inset 0 0 0 12px var(--color-primary);\n `}\n }\n\n svg polyline {\n stroke-dashoffset: 0;\n stroke: #fff;\n ${props.$primary &&\n css`\n stroke: var(--color-theme-100);\n `}\n }\n\n svg path {\n stroke-dasharray: 8;\n stroke-dashoffset: 0;\n transform-origin: 24px 24px;\n }\n `}\n\n ${(props) =>\n !props.$completed &&\n !props.$disabled &&\n css`\n &:hover {\n border: 1px solid var(--color-primary);\n box-shadow: inset 0 0 0 2px var(--color-primary);\n border-width: 0px;\n ${!props.$primary &&\n css`\n border: 1px solid #84cc7c;\n box-shadow: inset 0 0 0 2px #84cc7c;\n `}\n svg polyline {\n stroke-dashoffset: 0;\n }\n }\n `}\n\n ${(props) =>\n props.$animation &&\n css`\n /* Delay of 0.01s is for safari transform bug. */\n svg path {\n animation: ${burstScale} 0.6s ease 0s 1 normal,\n ${burstAnimation} 0.4s ease 0.2s 1 normal;\n }\n `}\n\n ${(props) =>\n props.$disabled &&\n css`\n ${tw`tw-cursor-default`}\n opacity: 0.5;\n `}\n`;\n\nStyledCompleteCheckbox.displayName = \"StyledCompleteCheckbox\";\n"],"~~names~~":["~~burstScale~~","keyframes","burstAnimation","StyledCompleteCheckbox","styled","div","props","$primary","css","$completed","$disabled","$animation","displayName"],"mappings":";;AAUA,IAAMA,UAAU,GAAGC,SAAH,sDAAhB;AASA,IAAMC,cAAc,GAAGD,SAAH,wDAApB;IASaE,sBAAsB,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,gYAC7B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD6B,EAM3B;AAAA;AAAA;AAAA,CAN2B,EAmB/B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAC,GADA,4CADA;AAAA,CAnB+B,EAoC7B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAC,GADA,oCADA;AAAA,CApC6B,EA2C/B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,UAAN,IACAD,GADA,+RAMI,CAACF,KAAK,CAACC,QAAP,IACFC,GADE,qEAEI;AAAA;AAAA;AAAA,GAFJ,CANJ,EAeMF,KAAK,CAACC,QAAN,IACFC,GADE,uDAfN,EAwBMF,KAAK,CAACC,QAAN,IACFC,GADE,oCAxBN,CADA;AAAA,CA3C+B,EAiF/B,UAACF,KAAD;AAAA,SACA,CAACA,KAAK,CAACG,UAAP,IACA,CAACH,KAAK,CAACI,SADP,IAEAF,GAFA,8JAOM,CAACF,KAAK,CAACC,QAAP,IACFC,GADE,kEAPN,CADA;AAAA,CAjF+B,EAoG/B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACK,UAAN,IACAH,GADA,mFAIiBR,UAJjB,EAKQE,cALR,CADA;AAAA,CApG+B,EA8G/B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACI,SAAN,IACAF,GADA,wBAEM;AAAA;AAAA,GAFN,CADA;AAAA,CA9G+B;AAsHnCL,sBAAsB,CAACS,WAAvB,GAAqC,wBAArC;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/CompleteCheckbox/Styles.ts"],"names":["styled","css","keyframes","burstScale","burstAnimation","StyledCompleteCheckbox","div","props","$primary","$completed","$disabled","$animation","displayName"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,EAAsBC,SAAtB,QAAuC,mBAAvC;AAUA,IAAMC,UAAU,GAAGD,SAAH,sDAAhB;AASA,IAAME,cAAc,GAAGF,SAAH,wDAApB;AASA,OAAO,IAAMG,sBAAsB,GAAGL,MAAM,CAACM,GAAV;AAAA;AAAA;AAAA,gYAC7B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD6B,EAM3B;AAAA;AAAA;AAAA,CAN2B,EAmB/B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAP,GADA,4CADA;AAAA,CAnB+B,EAoC7B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAP,GADA,oCADA;AAAA,CApC6B,EA2C/B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACE,UAAN,IACAR,GADA,+RAMI,CAACM,KAAK,CAACC,QAAP,IACFP,GADE,qEAEI;AAAA;AAAA;AAAA,GAFJ,CANJ,EAeMM,KAAK,CAACC,QAAN,IACFP,GADE,uDAfN,EAwBMM,KAAK,CAACC,QAAN,IACFP,GADE,oCAxBN,CADA;AAAA,CA3C+B,EAiF/B,UAACM,KAAD;AAAA,SACA,CAACA,KAAK,CAACE,UAAP,IACA,CAACF,KAAK,CAACG,SADP,IAEAT,GAFA,8JAOM,CAACM,KAAK,CAACC,QAAP,IACFP,GADE,kEAPN,CADA;AAAA,CAjF+B,EAoG/B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACI,UAAN,IACAV,GADA,mFAIiBE,UAJjB,EAKQC,cALR,CADA;AAAA,CApG+B,EA8G/B,UAACG,KAAD;AAAA,SACAA,KAAK,CAACG,SAAN,IACAT,GADA,wBAEM;AAAA;AAAA,GAFN,CADA;AAAA,CA9G+B,CAA5B;AAsHPI,sBAAsB,CAACO,WAAvB,GAAqC,wBAArC","sourcesContent":["import styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\n\ninterface StyledCompleteCheckboxProps {\n $primary?: boolean;\n $completed?: boolean;\n $disabled?: boolean;\n $animation?: boolean;\n}\n\nconst burstScale = keyframes`\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n`;\n\nconst burstAnimation = keyframes`\n from {\n stroke-dashoffset: 0;\n }\n to {\n stroke-dashoffset: 8;\n }\n`;\n\nexport const StyledCompleteCheckbox = styled.div<StyledCompleteCheckboxProps>`\n ${tw`tw-w-6 tw-h-6 tw-rounded-full tw-border tw-border-solid tw-relative tw-cursor-pointer`}\n border-color: var(--color-theme-600);\n transition: ease 0.3s all;\n\n svg {\n ${tw`tw-absolute tw-pointer-events-none`}\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n svg path {\n fill: none;\n stroke: #32b370;\n stroke-width: 3;\n transform: scale(0);\n }\n\n ${(props) =>\n props.$primary &&\n css`\n svg path {\n stroke: var(--color-primary);\n }\n `}\n\n svg polyline {\n fill: none;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition: 0.3s;\n stroke-dasharray: 13;\n stroke-dashoffset: 13;\n stroke: #d2d2d2;\n ${(props) =>\n props.$primary &&\n css`\n stroke: var(--color-theme-500);\n `}\n }\n\n ${(props) =>\n props.$completed &&\n css`\n box-shadow: inset 0 0 0 12px var(--color-primary);\n border-color: var(--color-primary);\n border-width: 0px;\n\n ${!props.$primary &&\n css`\n ${tw`tw-border tw-border-solid`}\n box-shadow: inset 0 0 0 12px #84cc7c;\n border-color: #84cc7c;\n `}\n\n &:hover {\n box-shadow: inset 0 0 0 12px #84cc7c;\n ${props.$primary &&\n css`\n box-shadow: inset 0 0 0 12px var(--color-primary);\n `}\n }\n\n svg polyline {\n stroke-dashoffset: 0;\n stroke: #fff;\n ${props.$primary &&\n css`\n stroke: var(--color-theme-100);\n `}\n }\n\n svg path {\n stroke-dasharray: 8;\n stroke-dashoffset: 0;\n transform-origin: 24px 24px;\n }\n `}\n\n ${(props) =>\n !props.$completed &&\n !props.$disabled &&\n css`\n &:hover {\n border: 1px solid var(--color-primary);\n box-shadow: inset 0 0 0 2px var(--color-primary);\n border-width: 0px;\n ${!props.$primary &&\n css`\n border: 1px solid #84cc7c;\n box-shadow: inset 0 0 0 2px #84cc7c;\n `}\n svg polyline {\n stroke-dashoffset: 0;\n }\n }\n `}\n\n ${(props) =>\n props.$animation &&\n css`\n /* Delay of 0.01s is for safari transform bug. */\n svg path {\n animation: ${burstScale} 0.6s ease 0s 1 normal,\n ${burstAnimation} 0.4s ease 0.2s 1 normal;\n }\n `}\n\n ${(props) =>\n props.$disabled &&\n css`\n ${tw`tw-cursor-default`}\n opacity: 0.5;\n `}\n`;\n\nStyledCompleteCheckbox.displayName = \"StyledCompleteCheckbox\";\n"],"file":"Styles.js"}

package/dist/esm/components/CompleteCheckbox/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from "./CompleteCheckbox";
2	+ //# sourceMappingURL=index.js.map

package/dist/esm/components/CompleteCheckbox/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../src/components/CompleteCheckbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAd","sourcesContent":["export * from \"./CompleteCheckbox\";\n"],"file":"index.js"}

package/dist/esm/components/ConfirmDialog/ConfirmDialog.js CHANGED Viewed

@@ -1,15 +1,9 @@
-import { forwardRef } from 'react';
-import classnames from 'classnames';
-import { Button } from '../Button/Button.js';
-import { Body2 } from '../Typography/Variants/Body2.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Dialog } from '../Dialog/Dialog.js';
-import { DialogTitle } from '../Dialog/DialogTitle.js';
-import { DialogContentDivider } from '../Dialog/DialogContentDivider.js';
-import { DialogContent } from '../Dialog/DialogContent.js';
-import { DialogActions } from '../Dialog/DialogActions.js';
-var ConfirmDialog = /*#__PURE__*/forwardRef(function (_ref, ref) {
+import React, { forwardRef } from "react";
+import classnames from "classnames";
+import { Dialog, DialogTitle, DialogContent, DialogActions, DialogContentDivider } from "../Dialog";
+import { Button } from "../Button/Button";
+import { Body2 } from "../Typography/Variants/Body2";
+export var ConfirmDialog = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$open = _ref.open,
       open = _ref$open === void 0 ? false : _ref$open,
       onCancel = _ref.onCancel,
@@ -25,38 +19,26 @@ var ConfirmDialog = /*#__PURE__*/forwardRef(function (_ref, ref) {
       cancelBtnText = _ref$cancelBtnText === void 0 ? "Cancel" : _ref$cancelBtnText,
       _ref$shouldShowCancel = _ref.shouldShowCancelButton,
       shouldShowCancelButton = _ref$shouldShowCancel === void 0 ? true : _ref$shouldShowCancel;
-  return /*#__PURE__*/jsxs(Dialog, {
+  return /*#__PURE__*/React.createElement(Dialog, {
     ref: ref,
     open: open,
     onClose: onCancel,
-    className: classnames("c-confirm-dialog", className),
-    children: [/*#__PURE__*/jsx(DialogTitle, {
-      children: dialogTitle
-    }), /*#__PURE__*/jsx(DialogContentDivider, {}), /*#__PURE__*/jsx(DialogContent, {
-      children: /*#__PURE__*/jsx(Body2, {
-        lineHeight: "loose",
-        color: "secondary",
-        children: dialogContent
-      })
-    }), /*#__PURE__*/jsx(DialogContentDivider, {}), /*#__PURE__*/jsxs(DialogActions, {
-      children: [/*#__PURE__*/jsx(Button, {
-        variant: "primary",
-        style: {
-          marginRight: "12px"
-        },
-        onClick: onConfirm,
-        children: confirmBtnText
-      }), shouldShowCancelButton ? /*#__PURE__*/jsx(Button, {
-        variant: "secondary",
-        "data-action": "cancel",
-        onClick: onCancel,
-        type: "button",
-        children: cancelBtnText
-      }) : null]
-    })]
-  });
+    className: classnames("c-confirm-dialog", className)
+  }, /*#__PURE__*/React.createElement(DialogTitle, null, dialogTitle), /*#__PURE__*/React.createElement(DialogContentDivider, null), /*#__PURE__*/React.createElement(DialogContent, null, /*#__PURE__*/React.createElement(Body2, {
+    lineHeight: "loose",
+    color: "secondary"
+  }, dialogContent)), /*#__PURE__*/React.createElement(DialogContentDivider, null), /*#__PURE__*/React.createElement(DialogActions, null, /*#__PURE__*/React.createElement(Button, {
+    variant: "primary",
+    style: {
+      marginRight: "12px"
+    },
+    onClick: onConfirm
+  }, confirmBtnText), shouldShowCancelButton ? /*#__PURE__*/React.createElement(Button, {
+    variant: "secondary",
+    "data-action": "cancel",
+    onClick: onCancel,
+    type: "button"
+  }, cancelBtnText) : null));
 });
 ConfirmDialog.displayName = "ConfirmDialog";
-export { ConfirmDialog };
-//# sourceMappingURL=ConfirmDialog.js.map
+//# sourceMappingURL=ConfirmDialog.js.map

package/dist/esm/components/ConfirmDialog/ConfirmDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"ConfirmDialog.js","~~sources":["../../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classnames from \"classnames\";\nimport {\n Dialog,\n DialogTitle,\n DialogContent,\n DialogActions,\n DialogContentDivider,\n} from \"../Dialog\";\nimport { Button } from \"../Button/Button\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\n\nexport interface IConfirmDialog {\n open?: boolean;\n onCancel?: () => void;\n onConfirm?: () => void;\n className?: string;\n dialogTitle?: string;\n dialogContent?: string;\n confirmBtnText?: string;\n cancelBtnText?: string;\n shouldShowCancelButton?: boolean;\n}\n\nexport const ConfirmDialog = forwardRef<HTMLDivElement, IConfirmDialog>(\n (\n {\n open = false,\n onCancel,\n onConfirm,\n className,\n dialogTitle = \"Discard changes?\",\n dialogContent = \"All unsaved changes will be lost.\",\n confirmBtnText = \"OK\",\n cancelBtnText = \"Cancel\",\n shouldShowCancelButton = true,\n },\n ref\n ) => {\n return (\n <Dialog\n ref={ref}\n open={open}\n onClose={onCancel}\n className={classnames(\"c-confirm-dialog\", className)}\n >\n <DialogTitle>{dialogTitle}</DialogTitle>\n <DialogContentDivider />\n <DialogContent>\n <Body2 lineHeight=\"loose\" color=\"secondary\">\n {dialogContent}\n </Body2>\n </DialogContent>\n <DialogContentDivider />\n <DialogActions>\n <Button\n variant=\"primary\"\n style={{ marginRight: \"12px\" }}\n onClick={onConfirm}\n >\n {confirmBtnText}\n </Button>\n {shouldShowCancelButton ? (\n <Button\n variant=\"secondary\"\n data-action=\"cancel\"\n onClick={onCancel}\n type=\"button\"\n >\n {cancelBtnText}\n </Button>\n ) : null}\n </DialogActions>\n </Dialog>\n );\n }\n);\n\nConfirmDialog.displayName = \"ConfirmDialog\";\n"],"~~names~~":["ConfirmDialog","forwardRef","ref","open","onCancel","onConfirm","className","dialogTitle","dialogContent","confirmBtnText","cancelBtnText","shouldShowCancelButton","_jsxs","classnames","_jsx","marginRight","displayName"],"mappings":";;;;;;;;;;;IAwBaA,aAAa,gBAAGC,UAAU,CACrC,gBAYEC,GAZF,EAaK;AAAA,uBAXDC,IAWC;AAAA,MAXDA,IAWC,0BAXM,KAWN;AAAA,MAVDC,QAUC,QAVDA,QAUC;AAAA,MATDC,SASC,QATDA,SASC;AAAA,MARDC,SAQC,QARDA,SAQC;AAAA,8BAPDC,WAOC;AAAA,MAPDA,WAOC,iCAPa,kBAOb;AAAA,gCANDC,aAMC;AAAA,MANDA,aAMC,mCANe,mCAMf;AAAA,iCALDC,cAKC;AAAA,MALDA,cAKC,oCALgB,IAKhB;AAAA,gCAJDC,aAIC;AAAA,MAJDA,aAIC,mCAJe,QAIf;AAAA,mCAHDC,sBAGC;AAAA,MAHDA,sBAGC,sCAHwB,IAGxB;AACH,sBACEC,KAAC,MAAD;AACE,IAAA,GAAG,EAAEV,GADP;AAEE,IAAA,IAAI,EAAEC,IAFR;AAGE,IAAA,OAAO,EAAEC,QAHX;AAIE,IAAA,SAAS,EAAES,UAAU,CAAC,kBAAD,EAAqBP,SAArB,CAJvB;AAAA,4BAMEQ,IAAC,WAAD;AAAA,gBAAcP;AAAd,MANF,eAOEO,IAAC,oBAAD,KAPF,eAQEA,IAAC,aAAD;AAAA,6BACEA,IAAC,KAAD;AAAO,QAAA,UAAU,EAAC,OAAlB;AAA0B,QAAA,KAAK,EAAC,WAAhC;AAAA,kBACGN;AADH;AADF,MARF,eAaEM,IAAC,oBAAD,KAbF,eAcEF,KAAC,aAAD;AAAA,8BACEE,IAAC,MAAD;AACE,QAAA,OAAO,EAAC,SADV;AAEE,QAAA,KAAK,EAAE;AAAEC,UAAAA,WAAW,EAAE;AAAf,SAFT;AAGE,QAAA,OAAO,EAAEV,SAHX;AAAA,kBAKGI;AALH,QADF,EAQGE,sBAAsB,gBACrBG,IAAC,MAAD;AACE,QAAA,OAAO,EAAC,WADV;AAEE,uBAAY,QAFd;AAGE,QAAA,OAAO,EAAEV,QAHX;AAIE,QAAA,IAAI,EAAC,QAJP;AAAA,kBAMGM;AANH,QADqB,GASnB,IAjBN;AAAA,MAdF;AAAA,IADF;AAoCD,CAnDoC;AAsDvCV,aAAa,CAACgB,WAAd,GAA4B,eAA5B;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"names":["React","forwardRef","classnames","Dialog","DialogTitle","DialogContent","DialogActions","DialogContentDivider","Button","Body2","ConfirmDialog","ref","open","onCancel","onConfirm","className","dialogTitle","dialogContent","confirmBtnText","cancelBtnText","shouldShowCancelButton","marginRight","displayName"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SACEC,MADF,EAEEC,WAFF,EAGEC,aAHF,EAIEC,aAJF,EAKEC,oBALF,QAMO,WANP;AAOA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,KAAT,QAAsB,8BAAtB;AAcA,OAAO,IAAMC,aAAa,gBAAGT,UAAU,CACrC,gBAYEU,GAZF,EAaK;AAAA,uBAXDC,IAWC;AAAA,MAXDA,IAWC,0BAXM,KAWN;AAAA,MAVDC,QAUC,QAVDA,QAUC;AAAA,MATDC,SASC,QATDA,SASC;AAAA,MARDC,SAQC,QARDA,SAQC;AAAA,8BAPDC,WAOC;AAAA,MAPDA,WAOC,iCAPa,kBAOb;AAAA,gCANDC,aAMC;AAAA,MANDA,aAMC,mCANe,mCAMf;AAAA,iCALDC,cAKC;AAAA,MALDA,cAKC,oCALgB,IAKhB;AAAA,gCAJDC,aAIC;AAAA,MAJDA,aAIC,mCAJe,QAIf;AAAA,mCAHDC,sBAGC;AAAA,MAHDA,sBAGC,sCAHwB,IAGxB;AACH,sBACE,oBAAC,MAAD;AACE,IAAA,GAAG,EAAET,GADP;AAEE,IAAA,IAAI,EAAEC,IAFR;AAGE,IAAA,OAAO,EAAEC,QAHX;AAIE,IAAA,SAAS,EAAEX,UAAU,CAAC,kBAAD,EAAqBa,SAArB;AAJvB,kBAME,oBAAC,WAAD,QAAcC,WAAd,CANF,eAOE,oBAAC,oBAAD,OAPF,eAQE,oBAAC,aAAD,qBACE,oBAAC,KAAD;AAAO,IAAA,UAAU,EAAC,OAAlB;AAA0B,IAAA,KAAK,EAAC;AAAhC,KACGC,aADH,CADF,CARF,eAaE,oBAAC,oBAAD,OAbF,eAcE,oBAAC,aAAD,qBACE,oBAAC,MAAD;AACE,IAAA,OAAO,EAAC,SADV;AAEE,IAAA,KAAK,EAAE;AAAEI,MAAAA,WAAW,EAAE;AAAf,KAFT;AAGE,IAAA,OAAO,EAAEP;AAHX,KAKGI,cALH,CADF,EAQGE,sBAAsB,gBACrB,oBAAC,MAAD;AACE,IAAA,OAAO,EAAC,WADV;AAEE,mBAAY,QAFd;AAGE,IAAA,OAAO,EAAEP,QAHX;AAIE,IAAA,IAAI,EAAC;AAJP,KAMGM,aANH,CADqB,GASnB,IAjBN,CAdF,CADF;AAoCD,CAnDoC,CAAhC;AAsDPT,aAAa,CAACY,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { forwardRef } from \"react\";\nimport classnames from \"classnames\";\nimport {\n Dialog,\n DialogTitle,\n DialogContent,\n DialogActions,\n DialogContentDivider,\n} from \"../Dialog\";\nimport { Button } from \"../Button/Button\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\n\nexport interface IConfirmDialog {\n open?: boolean;\n onCancel?: () => void;\n onConfirm?: () => void;\n className?: string;\n dialogTitle?: string;\n dialogContent?: string;\n confirmBtnText?: string;\n cancelBtnText?: string;\n shouldShowCancelButton?: boolean;\n}\n\nexport const ConfirmDialog = forwardRef<HTMLDivElement, IConfirmDialog>(\n (\n {\n open = false,\n onCancel,\n onConfirm,\n className,\n dialogTitle = \"Discard changes?\",\n dialogContent = \"All unsaved changes will be lost.\",\n confirmBtnText = \"OK\",\n cancelBtnText = \"Cancel\",\n shouldShowCancelButton = true,\n },\n ref\n ) => {\n return (\n <Dialog\n ref={ref}\n open={open}\n onClose={onCancel}\n className={classnames(\"c-confirm-dialog\", className)}\n >\n <DialogTitle>{dialogTitle}</DialogTitle>\n <DialogContentDivider />\n <DialogContent>\n <Body2 lineHeight=\"loose\" color=\"secondary\">\n {dialogContent}\n </Body2>\n </DialogContent>\n <DialogContentDivider />\n <DialogActions>\n <Button\n variant=\"primary\"\n style={{ marginRight: \"12px\" }}\n onClick={onConfirm}\n >\n {confirmBtnText}\n </Button>\n {shouldShowCancelButton ? (\n <Button\n variant=\"secondary\"\n data-action=\"cancel\"\n onClick={onCancel}\n type=\"button\"\n >\n {cancelBtnText}\n </Button>\n ) : null}\n </DialogActions>\n </Dialog>\n );\n }\n);\n\nConfirmDialog.displayName = \"ConfirmDialog\";\n"],"file":"ConfirmDialog.js"}

package/dist/esm/components/ConfirmDialog/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from "./ConfirmDialog";
2	+ //# sourceMappingURL=index.js.map

package/dist/esm/components/ConfirmDialog/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../src/components/ConfirmDialog/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAd","sourcesContent":["export * from \"./ConfirmDialog\";\n"],"file":"index.js"}

package/dist/esm/components/CounterButton/CounterButton.js CHANGED Viewed

@@ -1,18 +1,12 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import React, { forwardRef } from 'react';
-import classnames from 'classnames';
-import { Tooltip } from '../Tooltip/Tooltip.js';
-import CloseSmallIcon from '../Icons/collection/CloseSmall.js';
-import { StyledCounterButton, StyledCounterButtonLabel, StyledCounterButtonCounter, StyledCounterButtonReset } from './Styles.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _excluded = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var CounterButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
+import React, { forwardRef } from "react";
+import classNames from "classnames";
+import { Tooltip } from "../Tooltip/Tooltip";
+import CloseSmallIcon from "../Icons/collection/CloseSmall";
+import { StyledCounterButton, StyledCounterButtonCounter, StyledCounterButtonLabel, StyledCounterButtonReset } from "./Styles";
+export var CounterButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var label = _ref.label,
       icon = _ref.icon,
       active = _ref.active,
@@ -21,44 +15,36 @@ var CounterButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
       tooltipText = _ref.tooltipText,
       onClearAll = _ref.onClearAll,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded);
+      args = _objectWithoutPropertiesLoose(_ref, _excluded);
-  return /*#__PURE__*/jsxs("div", {
-    className: classnames("tw-flex ac-font box-sizing", className),
-    children: [/*#__PURE__*/jsxs(StyledCounterButton, _objectSpread(_objectSpread({
-      className: classnames("c-counter-button", {
-        "c-counter-button__selected": counter
-      })
-    }, args), {}, {
-      ref: ref,
-      variant: "text gray",
-      $active: counter > 0 || active,
-      $selected: counter > 0,
-      children: [icon && /*#__PURE__*/React.cloneElement(icon, {
-        className: classnames("c-counter-button__icon")
-      }), label && /*#__PURE__*/jsx(StyledCounterButtonLabel, {
-        color: "secondary",
-        weight: "medium",
-        className: "c-counter-button__label",
-        $active: active,
-        children: label
-      }), counter > 0 ? /*#__PURE__*/jsx(StyledCounterButtonCounter, {
-        className: "c-counter-button__counter",
-        children: counter
-      }) : null]
-    })), counter > 0 ? /*#__PURE__*/jsx(Tooltip, {
-      title: "".concat(tooltipText),
-      popperTooltipClassName: "z-index-1300",
-      children: /*#__PURE__*/jsx(StyledCounterButtonReset, {
-        variant: "text colored",
-        className: "c-counter-button__reset",
-        onClick: onClearAll,
-        children: /*#__PURE__*/jsx(CloseSmallIcon, {})
-      })
-    }) : null]
-  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("tw-flex ac-font box-sizing", className)
+  }, /*#__PURE__*/React.createElement(StyledCounterButton, _extends({
+    className: classNames("c-counter-button", {
+      "c-counter-button__selected": counter
+    })
+  }, args, {
+    ref: ref,
+    variant: "text gray",
+    $active: counter > 0 || active,
+    $selected: counter > 0
+  }), icon && /*#__PURE__*/React.cloneElement(icon, {
+    className: classNames("c-counter-button__icon")
+  }), label && /*#__PURE__*/React.createElement(StyledCounterButtonLabel, {
+    color: "secondary",
+    weight: "medium",
+    className: "c-counter-button__label",
+    $active: active
+  }, label), counter > 0 ? /*#__PURE__*/React.createElement(StyledCounterButtonCounter, {
+    className: "c-counter-button__counter"
+  }, counter) : null), counter > 0 ? /*#__PURE__*/React.createElement(Tooltip, {
+    title: "" + tooltipText,
+    popperTooltipClassName: "z-index-1300"
+  }, /*#__PURE__*/React.createElement(StyledCounterButtonReset, {
+    variant: "text colored",
+    className: "c-counter-button__reset",
+    onClick: onClearAll
+  }, /*#__PURE__*/React.createElement(CloseSmallIcon, null))) : null);
 });
 CounterButton.displayName = "CounterButton";
-export { CounterButton };
-//# sourceMappingURL=CounterButton.js.map
+//# sourceMappingURL=CounterButton.js.map

package/dist/esm/components/CounterButton/CounterButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"CounterButton.js","~~sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"sourcesContent":["import React, { forwardRef, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport CloseSmallIcon from \"../Icons/collection/CloseSmall\";\nimport {\n StyledCounterButton,\n StyledCounterButtonCounter,\n StyledCounterButtonLabel,\n StyledCounterButtonReset,\n} from \"./Styles\";\n\ninterface ICounterButtonProps {\n /** Set active state /\n active?: boolean;\n /* Label for value /\n label?: string;\n /* Icon /\n icon?: ReactElement;\n /* Number of applied filters /\n counter?: number;\n /* OnClearAll callback /\n onClearAll: () => void;\n /* Tooltip content /\n tooltipText?: string;\n /* Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLButtonElement, ICounterButtonProps>(\n (\n {\n label,\n icon,\n active,\n counter = 0,\n tooltipText,\n onClearAll,\n className,\n ...args\n },\n ref\n ) => {\n return (\n <div className={classNames(\"tw-flex ac-font box-sizing\", className)}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\n ref={ref}\n variant={\"text gray\"}\n $active={counter > 0 \|\| active}\n $selected={counter > 0}\n >\n {icon &&\n React.cloneElement(icon, {\n className: classNames(\"c-counter-button__icon\"),\n })}\n {label && (\n <StyledCounterButtonLabel\n color=\"secondary\"\n weight=\"medium\"\n className={\"c-counter-button__label\"}\n $active={active}\n >\n {label}\n </StyledCounterButtonLabel>\n )}\n {counter > 0 ? (\n <StyledCounterButtonCounter className={\"c-counter-button__counter\"}>\n {counter}\n </StyledCounterButtonCounter>\n ) : null}\n </StyledCounterButton>\n {counter > 0 ? (\n <Tooltip\n title={`${tooltipText}`}\n popperTooltipClassName=\"z-index-1300\"\n >\n <StyledCounterButtonReset\n variant=\"text colored\"\n className=\"c-counter-button__reset\"\n onClick={onClearAll}\n >\n <CloseSmallIcon />\n </StyledCounterButtonReset>\n </Tooltip>\n ) : null}\n </div>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"~~names~~":["CounterButton","forwardRef","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","_jsxs","classNames","React","cloneElement","_jsx","displayName"],"mappings":";;;;;;;;;;;;;;IA4BaA,aAAa,gBAAGC,UAAU,CACrC,gBAWEC,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACEC;AAAK,IAAA,SAAS,EAAEC,UAAU,CAAC,4BAAD,EAA+BH,SAA/B,CAA1B;AAAA,4BACEE,KAAC,mBAAD;AACE,MAAA,SAAS,EAAEC,UAAU,CAAC,kBAAD,EAAqB;AACxC,sCAA8BN;AADU,OAArB;AADvB,OAIMI,IAJN;AAKE,MAAA,GAAG,EAAER,GALP;AAME,MAAA,OAAO,EAAE,WANX;AAOE,MAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,MAAA,SAAS,EAAEC,OAAO,GAAG,CARvB;AAAA,iBAUGF,IAAI,iBACHS,KAAK,CAACC,YAAN,CAAmBV,IAAnB,EAAyB;AACvBK,QAAAA,SAAS,EAAEG,UAAU,CAAC,wBAAD;AADE,OAAzB,CAXJ,EAcGT,KAAK,iBACJY,IAAC,wBAAD;AACE,QAAA,KAAK,EAAC,WADR;AAEE,QAAA,MAAM,EAAC,QAFT;AAGE,QAAA,SAAS,EAAE,yBAHb;AAIE,QAAA,OAAO,EAAEV,MAJX;AAAA,kBAMGF;AANH,QAfJ,EAwBGG,OAAO,GAAG,CAAV,gBACCS,IAAC,0BAAD;AAA4B,QAAA,SAAS,EAAE,2BAAvC;AAAA,kBACGT;AADH,QADD,GAIG,IA5BN;AAAA,OADF,EA+BGA,OAAO,GAAG,CAAV,gBACCS,IAAC,OAAD;AACE,MAAA,KAAK,YAAKR,WAAL,CADP;AAEE,MAAA,sBAAsB,EAAC,cAFzB;AAAA,6BAIEQ,IAAC,wBAAD;AACE,QAAA,OAAO,EAAC,cADV;AAEE,QAAA,SAAS,EAAC,yBAFZ;AAGE,QAAA,OAAO,EAAEP,UAHX;AAAA,+BAKEO,IAAC,cAAD;AALF;AAJF,MADD,GAaG,IA5CN;AAAA,IADF;AAgDD,CA9DoC;AAiEvCf,aAAa,CAACgB,WAAd,GAA4B,eAA5B;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["React","forwardRef","classNames","Tooltip","CloseSmallIcon","StyledCounterButton","StyledCounterButtonCounter","StyledCounterButtonLabel","StyledCounterButtonReset","CounterButton","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","cloneElement","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAgD,OAAhD;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,OAAT,QAAwB,oBAAxB;AACA,OAAOC,cAAP,MAA2B,gCAA3B;AACA,SACEC,mBADF,EAEEC,0BAFF,EAGEC,wBAHF,EAIEC,wBAJF,QAKO,UALP;AAwBA,OAAO,IAAMC,aAAa,gBAAGR,UAAU,CACrC,gBAWES,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACE;AAAK,IAAA,SAAS,EAAEhB,UAAU,CAAC,4BAAD,EAA+Be,SAA/B;AAA1B,kBACE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAEf,UAAU,CAAC,kBAAD,EAAqB;AACxC,oCAA8BY;AADU,KAArB;AADvB,KAIMI,IAJN;AAKE,IAAA,GAAG,EAAER,GALP;AAME,IAAA,OAAO,EAAE,WANX;AAOE,IAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,IAAA,SAAS,EAAEC,OAAO,GAAG;AARvB,MAUGF,IAAI,iBACHZ,KAAK,CAACmB,YAAN,CAAmBP,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAEf,UAAU,CAAC,wBAAD;AADE,GAAzB,CAXJ,EAcGS,KAAK,iBACJ,oBAAC,wBAAD;AACE,IAAA,KAAK,EAAC,WADR;AAEE,IAAA,MAAM,EAAC,QAFT;AAGE,IAAA,SAAS,EAAE,yBAHb;AAIE,IAAA,OAAO,EAAEE;AAJX,KAMGF,KANH,CAfJ,EAwBGG,OAAO,GAAG,CAAV,gBACC,oBAAC,0BAAD;AAA4B,IAAA,SAAS,EAAE;AAAvC,KACGA,OADH,CADD,GAIG,IA5BN,CADF,EA+BGA,OAAO,GAAG,CAAV,gBACC,oBAAC,OAAD;AACE,IAAA,KAAK,OAAKC,WADZ;AAEE,IAAA,sBAAsB,EAAC;AAFzB,kBAIE,oBAAC,wBAAD;AACE,IAAA,OAAO,EAAC,cADV;AAEE,IAAA,SAAS,EAAC,yBAFZ;AAGE,IAAA,OAAO,EAAEC;AAHX,kBAKE,oBAAC,cAAD,OALF,CAJF,CADD,GAaG,IA5CN,CADF;AAgDD,CA9DoC,CAAhC;AAiEPP,aAAa,CAACW,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { forwardRef, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport CloseSmallIcon from \"../Icons/collection/CloseSmall\";\nimport {\n StyledCounterButton,\n StyledCounterButtonCounter,\n StyledCounterButtonLabel,\n StyledCounterButtonReset,\n} from \"./Styles\";\n\ninterface ICounterButtonProps {\n /** Set active state /\n active?: boolean;\n /* Label for value /\n label?: string;\n /* Icon /\n icon?: ReactElement;\n /* Number of applied filters /\n counter?: number;\n /* OnClearAll callback /\n onClearAll: () => void;\n /* Tooltip content /\n tooltipText?: string;\n /* Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLButtonElement, ICounterButtonProps>(\n (\n {\n label,\n icon,\n active,\n counter = 0,\n tooltipText,\n onClearAll,\n className,\n ...args\n },\n ref\n ) => {\n return (\n <div className={classNames(\"tw-flex ac-font box-sizing\", className)}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\n ref={ref}\n variant={\"text gray\"}\n $active={counter > 0 \|\| active}\n $selected={counter > 0}\n >\n {icon &&\n React.cloneElement(icon, {\n className: classNames(\"c-counter-button__icon\"),\n })}\n {label && (\n <StyledCounterButtonLabel\n color=\"secondary\"\n weight=\"medium\"\n className={\"c-counter-button__label\"}\n $active={active}\n >\n {label}\n </StyledCounterButtonLabel>\n )}\n {counter > 0 ? (\n <StyledCounterButtonCounter className={\"c-counter-button__counter\"}>\n {counter}\n </StyledCounterButtonCounter>\n ) : null}\n </StyledCounterButton>\n {counter > 0 ? (\n <Tooltip\n title={`${tooltipText}`}\n popperTooltipClassName=\"z-index-1300\"\n >\n <StyledCounterButtonReset\n variant=\"text colored\"\n className=\"c-counter-button__reset\"\n onClick={onClearAll}\n >\n <CloseSmallIcon />\n </StyledCounterButtonReset>\n </Tooltip>\n ) : null}\n </div>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"file":"CounterButton.js"}

package/dist/esm/components/CounterButton/Styles.js CHANGED Viewed

@@ -1,8 +1,7 @@
-import styled, { css } from 'styled-components';
-import { Body2 } from '../Typography/Variants/Body2.js';
-import { Button } from '../Button/Button.js';
-var StyledCounterButton = styled(Button).withConfig({
+import styled, { css } from "styled-components";
+import { Body2 } from "../Typography/Variants/Body2";
+import { Button } from "../Button/Button";
+export var StyledCounterButton = styled(Button).withConfig({
   displayName: "Styles__StyledCounterButton",
   componentId: "sc-1ecrcba-0"
 })(["", " ", ""], function (props) {
@@ -11,17 +10,17 @@ var StyledCounterButton = styled(Button).withConfig({
   return props.$selected && css(["border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--color-primary-200);"]);
 });
 StyledCounterButton.displayName = "StyledCounterButton";
-var StyledCounterButtonCounter = styled.div.withConfig({
+export var StyledCounterButtonCounter = styled.div.withConfig({
   displayName: "Styles__StyledCounterButtonCounter",
   componentId: "sc-1ecrcba-1"
 })(["border-radius:50%;background-color:var(--color-primary);color:var(--page-paper-main);line-height:15px;width:15px;font-weight:bold;font-size:10px;text-align:center;margin-left:4px;margin-right:-6px;"]);
 StyledCounterButtonCounter.displayName = "StyledCounterButtonCounter";
-var StyledCounterButtonReset = styled(Button).withConfig({
+export var StyledCounterButtonReset = styled(Button).withConfig({
   displayName: "Styles__StyledCounterButtonReset",
   componentId: "sc-1ecrcba-2"
 })(["background-color:var(--color-primary-200);border-top-left-radius:0;border-bottom-left-radius:0;&:hover{background-color:var(--color-primary-300);border-top-left-radius:0;border-bottom-left-radius:0;}"]);
 StyledCounterButtonReset.displayName = "StyledCounterButtonReset";
-var StyledCounterButtonLabel = styled(Body2).withConfig({
+export var StyledCounterButtonLabel = styled(Body2).withConfig({
   displayName: "Styles__StyledCounterButtonLabel",
   componentId: "sc-1ecrcba-3"
 })(["", " ", ":hover &{", "}", ""], {
@@ -32,6 +31,4 @@ var StyledCounterButtonLabel = styled(Body2).withConfig({
   return props.$active && css(["color:var(--color-primary);"]);
 });
 StyledCounterButtonLabel.displayName = "StyledCounterButtonLabel";
-export { StyledCounterButton, StyledCounterButtonCounter, StyledCounterButtonLabel, StyledCounterButtonReset };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/CounterButton/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file":"Styles.js","~~sources":["../../../../src/components/CounterButton/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\nimport { Button } from \"../Button/Button\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButton = styled(Button)<StyledCounterButtonProps>`\n ${(props) =>\n props.$active &&\n css`\n padding: 0 8px;\n\n svg {\n fill: var(--color-primary);\n }\n\n &:hover {\n background: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n props.$selected &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n background-color: var(--color-primary-200);\n `}\n`;\n\nStyledCounterButton.displayName = \"StyledCounterButton\";\n\nexport const StyledCounterButtonCounter = styled.div<{ $selected?: boolean }>`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n margin-right: -6px;\n`;\n\nStyledCounterButtonCounter.displayName = \"StyledCounterButtonCounter\";\n\nexport const StyledCounterButtonReset = styled(Button)`\n background-color: var(--color-primary-200);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n &:hover {\n background-color: var(--color-primary-300);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n`;\n\nStyledCounterButtonReset.displayName = \"StyledCounterButtonReset\";\n\nexport const StyledCounterButtonLabel = styled(Body2)<{ $active?: boolean }>`\n ${tw`tw-pointer-events-none`}\n\n ${StyledCounterButton}:hover & {\n ${(props) =>\n !props.$active &&\n css`\n color: var(--color-theme-900);\n `}\n }\n\n ${(props) =>\n props.$active &&\n css`\n color: var(--color-primary);\n `}\n`;\n\nStyledCounterButtonLabel.displayName = \"StyledCounterButtonLabel\";\n"],"~~names~~":["~~StyledCounterButton~~","styled","Button","props","$active","css","$selected","displayName","StyledCounterButtonCounter","div","StyledCounterButtonReset","StyledCounterButtonLabel","Body2"],"mappings":";;;;IAUaA,mBAAmB,GAAGC,MAAM,CAACC,MAAD,CAAT;AAAA;AAAA;AAAA,kBAC5B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAC,GADA,gGADA;AAAA,CAD4B,EAe5B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,SAAN,IACAD,GADA,uGADA;AAAA,CAf4B;AAwBhCL,mBAAmB,CAACO,WAApB,GAAkC,qBAAlC;IAEaC,0BAA0B,GAAGP,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA;AAavCD,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;IAEaG,wBAAwB,GAAGT,MAAM,CAACC,MAAD,CAAT;AAAA;AAAA;AAAA;AAYrCQ,wBAAwB,CAACH,WAAzB,GAAuC,0BAAvC;IAEaI,wBAAwB,GAAGV,MAAM,CAACW,KAAD,CAAT;AAAA;AAAA;AAAA,oCAC/B;AAAA;AAAA,CAD+B,EAGjCZ,mBAHiC,EAI/B,UAACG,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,OAAP,IACAC,GADA,mCADA;AAAA,CAJ+B,EAWjC,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAC,GADA,iCADA;AAAA,CAXiC;AAkBrCM,wBAAwB,CAACJ,WAAzB,GAAuC,0BAAvC;;;;"}
1	+ {"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["styled","css","Body2","Button","StyledCounterButton","props","$active","$selected","displayName","StyledCounterButtonCounter","div","StyledCounterButtonReset","StyledCounterButtonLabel"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,KAAT,QAAsB,8BAAtB;AACA,SAASC,MAAT,QAAuB,kBAAvB;AAOA,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,kBAC5B,UAACE,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAL,GADA,gGADA;AAAA,CAD4B,EAe5B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACE,SAAN,IACAN,GADA,uGADA;AAAA,CAf4B,CAAzB;AAwBPG,mBAAmB,CAACI,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMC,0BAA0B,GAAGT,MAAM,CAACU,GAAV;AAAA;AAAA;AAAA,6MAAhC;AAaPD,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMG,wBAAwB,GAAGX,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,+MAA9B;AAYPQ,wBAAwB,CAACH,WAAzB,GAAuC,0BAAvC;AAEA,OAAO,IAAMI,wBAAwB,GAAGZ,MAAM,CAACE,KAAD,CAAT;AAAA;AAAA;AAAA,oCAC/B;AAAA;AAAA,CAD+B,EAGjCE,mBAHiC,EAI/B,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,OAAP,IACAL,GADA,mCADA;AAAA,CAJ+B,EAWjC,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAL,GADA,iCADA;AAAA,CAXiC,CAA9B;AAkBPW,wBAAwB,CAACJ,WAAzB,GAAuC,0BAAvC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\nimport { Button } from \"../Button/Button\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButton = styled(Button)<StyledCounterButtonProps>`\n ${(props) =>\n props.$active &&\n css`\n padding: 0 8px;\n\n svg {\n fill: var(--color-primary);\n }\n\n &:hover {\n background: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n props.$selected &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n background-color: var(--color-primary-200);\n `}\n`;\n\nStyledCounterButton.displayName = \"StyledCounterButton\";\n\nexport const StyledCounterButtonCounter = styled.div<{ $selected?: boolean }>`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n margin-right: -6px;\n`;\n\nStyledCounterButtonCounter.displayName = \"StyledCounterButtonCounter\";\n\nexport const StyledCounterButtonReset = styled(Button)`\n background-color: var(--color-primary-200);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n &:hover {\n background-color: var(--color-primary-300);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n`;\n\nStyledCounterButtonReset.displayName = \"StyledCounterButtonReset\";\n\nexport const StyledCounterButtonLabel = styled(Body2)<{ $active?: boolean }>`\n ${tw`tw-pointer-events-none`}\n\n ${StyledCounterButton}:hover & {\n ${(props) =>\n !props.$active &&\n css`\n color: var(--color-theme-900);\n `}\n }\n\n ${(props) =>\n props.$active &&\n css`\n color: var(--color-primary);\n `}\n`;\n\nStyledCounterButtonLabel.displayName = \"StyledCounterButtonLabel\";\n"],"file":"Styles.js"}

package/dist/esm/components/CounterButton/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from "./CounterButton";
2	+ //# sourceMappingURL=index.js.map

package/dist/esm/components/CounterButton/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../src/components/CounterButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAd","sourcesContent":["export * from \"./CounterButton\";\n"],"file":"index.js"}