@chayns-components/core 5.0.0-beta.13 → 5.0.0-beta.1300

package/lib/cjs/components/filter/Filter.js

@@ -0,0 +1,175 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Filter = require("./Filter.styles");
+var _ExpandableContent = _interopRequireDefault(require("../expandable-content/ExpandableContent"));
+var _Icon = _interopRequireDefault(require("../icon/Icon"));
+var _FIlterContent = _interopRequireDefault(require("./filter-content/FIlterContent"));
+var _filter = require("../../types/filter");
+var _SearchInput = _interopRequireDefault(require("../search-input/SearchInput"));
+var _ContextMenu = _interopRequireDefault(require("../context-menu/ContextMenu"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+//
+const Filter = /*#__PURE__*/(0, _react.forwardRef)(({
+  headline,
+  searchConfig,
+  sortConfig,
+  filterButtonConfig
+}, ref) => {
+  const [isOpen, setIsOpen] = (0, _react.useState)(false);
+  const [isSearchActive, setIsSearchActive] = (0, _react.useState)(false);
+  const [backgroundDistance, setBackgroundDistance] = (0, _react.useState)(0);
+  const [backgroundCoordinates, setBackgroundCoordinates] = (0, _react.useState)({
+    top: 0,
+    left: 0
+  });
+  const contentRef = (0, _react.useRef)(null);
+  const iconRef = (0, _react.useRef)(null);
+  const filterRef = (0, _react.useRef)(null);
+  const contextMenuRef = (0, _react.useRef)(null);
+  const type = (0, _react.useMemo)(() => {
+    if (filterButtonConfig && !searchConfig && !sortConfig) {
+      return _filter.FilterType.ONLY_FILTER;
+    }
+    if (!filterButtonConfig && !searchConfig && sortConfig) {
+      return _filter.FilterType.ONLY_SORT;
+    }
+    if (!filterButtonConfig && searchConfig && !sortConfig) {
+      return _filter.FilterType.ONLY_SEARCH;
+    }
+    return _filter.FilterType.MULTIPLE;
+  }, [filterButtonConfig, searchConfig, sortConfig]);
+  const icons = (0, _react.useMemo)(() => {
+    switch (type) {
+      case _filter.FilterType.ONLY_FILTER:
+        return ['fa fa-filter'];
+      case _filter.FilterType.ONLY_SORT:
+        return ['fa fa-arrow-up-arrow-down'];
+      default:
+        return ['fa fa-search'];
+    }
+  }, [type]);
+  const handleHide = (0, _react.useCallback)(() => {
+    setIsOpen(false);
+    if (type === _filter.FilterType.ONLY_SORT && contextMenuRef.current) {
+      contextMenuRef.current.hide();
+    }
+    if (type === _filter.FilterType.ONLY_SEARCH) {
+      setIsSearchActive(false);
+    }
+  }, [type]);
+  const handleShow = (0, _react.useCallback)(() => {
+    setIsOpen(true);
+    if (type === _filter.FilterType.ONLY_SORT && contextMenuRef.current) {
+      contextMenuRef.current.hide();
+    }
+    if (type === _filter.FilterType.ONLY_SEARCH) {
+      setIsSearchActive(true);
+    }
+  }, [type]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    hide: handleHide,
+    show: handleShow
+  }), [handleHide, handleShow]);
+  const handleIconClick = (0, _react.useCallback)(() => {
+    if (isOpen) {
+      handleHide();
+    } else {
+      handleShow();
+    }
+  }, [handleHide, handleShow, isOpen]);
+  (0, _react.useEffect)(() => {
+    if (headline && iconRef.current && contentRef.current && filterRef.current) {
+      const iconRect = iconRef.current.getBoundingClientRect();
+      const filterRect = filterRef.current.getBoundingClientRect();
+      const contentRect = contentRef.current.getBoundingClientRect();
+      const relativeTop = iconRect.bottom - filterRect.top;
+      const relativeLeft = iconRect.left - filterRect.left;
+      setBackgroundDistance(contentRect.top - iconRect.bottom);
+      setBackgroundCoordinates({
+        top: relativeTop,
+        left: relativeLeft
+      });
+    } else {
+      setBackgroundDistance(0);
+      setBackgroundCoordinates({
+        top: 0,
+        left: 0
+      });
+    }
+  }, [headline]);
+  const iconElement = (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Filter.StyledFilterIcon, {
+    onClick: handleIconClick,
+    $isOpen: isOpen,
+    ref: iconRef
+  }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icons: icons,
+    size: 18
+  })), [handleIconClick, icons, isOpen]);
+  const backgroundElement = (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Filter.StyledMotionFilterBackground, {
+    $top: backgroundCoordinates.top,
+    $left: backgroundCoordinates.left,
+    animate: {
+      height: isOpen ? `${backgroundDistance}px` : 0
+    },
+    transition: {
+      duration: 0.1,
+      delay: isOpen ? 0 : 0.2
+    }
+  }), [backgroundDistance, isOpen, backgroundCoordinates]);
+  const sortItems = (0, _react.useMemo)(() => {
+    if (!sortConfig) {
+      return [];
+    }
+    const {
+      selectedItem,
+      onSortChange
+    } = sortConfig;
+    return sortConfig.items.map(({
+      id,
+      text
+    }) => ({
+      text,
+      key: id.toString(),
+      isSelected: id === selectedItem.id,
+      icons: id === selectedItem.id ? ['fas fa-circle-small'] : [],
+      onClick: () => onSortChange({
+        text,
+        id
+      })
+    }));
+  }, [sortConfig]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Filter.StyledFilter, {
+    ref: filterRef
+  }, /*#__PURE__*/_react.default.createElement(_Filter.StyledFilterHead, null, /*#__PURE__*/_react.default.createElement(_Filter.StyledFilterHeadline, {
+    isSearchActive: isSearchActive
+  }, headline), [_filter.FilterType.MULTIPLE, _filter.FilterType.ONLY_FILTER].includes(type) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, iconElement, backgroundDistance > 0 && backgroundElement), type === _filter.FilterType.ONLY_SEARCH && searchConfig && /*#__PURE__*/_react.default.createElement(_Filter.StyledFilterSearch, null, /*#__PURE__*/_react.default.createElement(_SearchInput.default, {
+    onActiveChange: isActive => {
+      setIsSearchActive(isActive);
+      setIsOpen(isActive);
+    },
+    isActive: isSearchActive,
+    value: searchConfig.searchValue,
+    onChange: ev => searchConfig.onSearchChange(ev.target.value)
+  })), type === _filter.FilterType.ONLY_SORT && sortConfig && /*#__PURE__*/_react.default.createElement(_ContextMenu.default, {
+    ref: contextMenuRef,
+    items: sortItems
+  }, iconElement)), [_filter.FilterType.MULTIPLE, _filter.FilterType.ONLY_FILTER].includes(type) && /*#__PURE__*/_react.default.createElement(_Filter.StyledFilterContentWrapper, {
+    ref: contentRef
+  }, /*#__PURE__*/_react.default.createElement(_ExpandableContent.default, {
+    isOpen: isOpen,
+    startDelay: backgroundDistance > 0 ? 0.1 : 0
+  }, /*#__PURE__*/_react.default.createElement(_FIlterContent.default, {
+    searchConfig: searchConfig,
+    filterButtonConfig: filterButtonConfig,
+    sortConfig: sortConfig
+  })))), [isSearchActive, headline, type, iconElement, backgroundDistance, backgroundElement, searchConfig, sortConfig, sortItems, isOpen, filterButtonConfig]);
+});
+Filter.displayName = 'Filter';
+var _default = exports.default = Filter;
+//# sourceMappingURL=Filter.js.map

package/lib/cjs/components/filter/Filter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Filter.js","names":["_react","_interopRequireWildcard","require","_Filter","_ExpandableContent","_interopRequireDefault","_Icon","_FIlterContent","_filter","_SearchInput","_ContextMenu","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Filter","forwardRef","headline","searchConfig","sortConfig","filterButtonConfig","ref","isOpen","setIsOpen","useState","isSearchActive","setIsSearchActive","backgroundDistance","setBackgroundDistance","backgroundCoordinates","setBackgroundCoordinates","top","left","contentRef","useRef","iconRef","filterRef","contextMenuRef","type","useMemo","FilterType","ONLY_FILTER","ONLY_SORT","ONLY_SEARCH","MULTIPLE","icons","handleHide","useCallback","current","hide","handleShow","useImperativeHandle","show","handleIconClick","useEffect","iconRect","getBoundingClientRect","filterRect","contentRect","relativeTop","bottom","relativeLeft","iconElement","createElement","StyledFilterIcon","onClick","$isOpen","size","backgroundElement","StyledMotionFilterBackground","$top","$left","animate","height","transition","duration","delay","sortItems","selectedItem","onSortChange","items","map","id","text","key","toString","isSelected","StyledFilter","StyledFilterHead","StyledFilterHeadline","includes","Fragment","StyledFilterSearch","onActiveChange","isActive","value","searchValue","onChange","ev","onSearchChange","target","StyledFilterContentWrapper","startDelay","displayName","_default","exports"],"sources":["../../../../src/components/filter/Filter.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport {\n    StyledFilter,\n    StyledFilterContentWrapper,\n    StyledFilterHead,\n    StyledFilterHeadline,\n    StyledFilterIcon,\n    StyledFilterSearch,\n    StyledMotionFilterBackground,\n} from './Filter.styles';\nimport ExpandableContent from '../expandable-content/ExpandableContent';\nimport Icon from '../icon/Icon';\nimport FilterContent from './filter-content/FIlterContent';\nimport {\n    FilterButtonConfig,\n    FilterRef,\n    FilterType,\n    SearchConfig,\n    SortConfig,\n} from '../../types/filter';\nimport SearchInput from '../search-input/SearchInput';\nimport ContextMenu, { ContextMenuItem, ContextMenuRef } from '../context-menu/ContextMenu';\n\nexport type FilterProps = {\n    headline: string;\n    searchConfig?: SearchConfig;\n    filterButtonConfig?: FilterButtonConfig;\n    sortConfig?: SortConfig;\n};\n\n//\nconst Filter = forwardRef<FilterRef, FilterProps>(\n    ({ headline, searchConfig, sortConfig, filterButtonConfig }, ref) => {\n        const [isOpen, setIsOpen] = useState(false);\n        const [isSearchActive, setIsSearchActive] = useState(false);\n        const [backgroundDistance, setBackgroundDistance] = useState(0);\n        const [backgroundCoordinates, setBackgroundCoordinates] = useState({ top: 0, left: 0 });\n\n        const contentRef = useRef<HTMLDivElement | null>(null);\n        const iconRef = useRef<HTMLDivElement | null>(null);\n        const filterRef = useRef<HTMLDivElement | null>(null);\n\n        const contextMenuRef = useRef<ContextMenuRef>(null);\n\n        const type = useMemo(() => {\n            if (filterButtonConfig && !searchConfig && !sortConfig) {\n                return FilterType.ONLY_FILTER;\n            }\n\n            if (!filterButtonConfig && !searchConfig && sortConfig) {\n                return FilterType.ONLY_SORT;\n            }\n\n            if (!filterButtonConfig && searchConfig && !sortConfig) {\n                return FilterType.ONLY_SEARCH;\n            }\n\n            return FilterType.MULTIPLE;\n        }, [filterButtonConfig, searchConfig, sortConfig]);\n\n        const icons = useMemo(() => {\n            switch (type) {\n                case FilterType.ONLY_FILTER:\n                    return ['fa fa-filter'];\n                case FilterType.ONLY_SORT:\n                    return ['fa fa-arrow-up-arrow-down'];\n                default:\n                    return ['fa fa-search'];\n            }\n        }, [type]);\n\n        const handleHide = useCallback(() => {\n            setIsOpen(false);\n\n            if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n                contextMenuRef.current.hide();\n            }\n\n            if (type === FilterType.ONLY_SEARCH) {\n                setIsSearchActive(false);\n            }\n        }, [type]);\n\n        const handleShow = useCallback(() => {\n            setIsOpen(true);\n\n            if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n                contextMenuRef.current.hide();\n            }\n\n            if (type === FilterType.ONLY_SEARCH) {\n                setIsSearchActive(true);\n            }\n        }, [type]);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleHide,\n                show: handleShow,\n            }),\n            [handleHide, handleShow],\n        );\n\n        const handleIconClick = useCallback(() => {\n            if (isOpen) {\n                handleHide();\n            } else {\n                handleShow();\n            }\n        }, [handleHide, handleShow, isOpen]);\n\n        useEffect(() => {\n            if (headline && iconRef.current && contentRef.current && filterRef.current) {\n                const iconRect = iconRef.current.getBoundingClientRect();\n                const filterRect = filterRef.current.getBoundingClientRect();\n                const contentRect = contentRef.current.getBoundingClientRect();\n\n                const relativeTop = iconRect.bottom - filterRect.top;\n                const relativeLeft = iconRect.left - filterRect.left;\n\n                setBackgroundDistance(contentRect.top - iconRect.bottom);\n                setBackgroundCoordinates({\n                    top: relativeTop,\n                    left: relativeLeft,\n                });\n            } else {\n                setBackgroundDistance(0);\n                setBackgroundCoordinates({ top: 0, left: 0 });\n            }\n        }, [headline]);\n\n        const iconElement = useMemo(\n            () => (\n                <StyledFilterIcon onClick={handleIconClick} $isOpen={isOpen} ref={iconRef}>\n                    <Icon icons={icons} size={18} />\n                </StyledFilterIcon>\n            ),\n            [handleIconClick, icons, isOpen],\n        );\n\n        const backgroundElement = useMemo(\n            () => (\n                <StyledMotionFilterBackground\n                    $top={backgroundCoordinates.top}\n                    $left={backgroundCoordinates.left}\n                    animate={{ height: isOpen ? `${backgroundDistance}px` : 0 }}\n                    transition={{ duration: 0.1, delay: isOpen ? 0 : 0.2 }}\n                />\n            ),\n            [backgroundDistance, isOpen, backgroundCoordinates],\n        );\n\n        const sortItems: ContextMenuItem[] = useMemo(() => {\n            if (!sortConfig) {\n                return [];\n            }\n\n            const { selectedItem, onSortChange } = sortConfig;\n\n            return sortConfig.items.map(({ id, text }) => ({\n                text,\n                key: id.toString(),\n                isSelected: id === selectedItem.id,\n                icons: id === selectedItem.id ? ['fas fa-circle-small'] : [],\n                onClick: () => onSortChange({ text, id }),\n            }));\n        }, [sortConfig]);\n\n        return useMemo(\n            () => (\n                <StyledFilter ref={filterRef}>\n                    <StyledFilterHead>\n                        <StyledFilterHeadline isSearchActive={isSearchActive}>\n                            {headline}\n                        </StyledFilterHeadline>\n                        {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n                            <>\n                                {iconElement}\n                                {backgroundDistance > 0 && backgroundElement}\n                            </>\n                        )}\n                        {type === FilterType.ONLY_SEARCH && searchConfig && (\n                            <StyledFilterSearch>\n                                <SearchInput\n                                    onActiveChange={(isActive) => {\n                                        setIsSearchActive(isActive);\n                                        setIsOpen(isActive);\n                                    }}\n                                    isActive={isSearchActive}\n                                    value={searchConfig.searchValue}\n                                    onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n                                />\n                            </StyledFilterSearch>\n                        )}\n                        {type === FilterType.ONLY_SORT && sortConfig && (\n                            <ContextMenu ref={contextMenuRef} items={sortItems}>\n                                {iconElement}\n                            </ContextMenu>\n                        )}\n                    </StyledFilterHead>\n                    {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n                        <StyledFilterContentWrapper ref={contentRef}>\n                            <ExpandableContent\n                                isOpen={isOpen}\n                                startDelay={backgroundDistance > 0 ? 0.1 : 0}\n                            >\n                                <FilterContent\n                                    searchConfig={searchConfig}\n                                    filterButtonConfig={filterButtonConfig}\n                                    sortConfig={sortConfig}\n                                />\n                            </ExpandableContent>\n                        </StyledFilterContentWrapper>\n                    )}\n                </StyledFilter>\n            ),\n            [\n                isSearchActive,\n                headline,\n                type,\n                iconElement,\n                backgroundDistance,\n                backgroundElement,\n                searchConfig,\n                sortConfig,\n                sortItems,\n                isOpen,\n                filterButtonConfig,\n            ],\n        );\n    },\n);\n\nFilter.displayName = 'Filter';\n\nexport default Filter;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/filter/Filter.styles.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledMotionFilterBackground = exports.StyledFilterSearch = exports.StyledFilterIcon = exports.StyledFilterHeadline = exports.StyledFilterHead = exports.StyledFilterContentWrapper = exports.StyledFilter = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _react = require("motion/react");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const StyledFilter = exports.StyledFilter = _styledComponents.default.div``;
+const StyledFilterHead = exports.StyledFilterHead = _styledComponents.default.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 20px;
+
+    position: relative;
+`;
+const StyledFilterHeadline = exports.StyledFilterHeadline = _styledComponents.default.h1`
+    margin: 0;
+
+    opacity: ${({
+  isSearchActive
+}) => isSearchActive ? 0 : 1};
+
+    transition: opacity 0.3s;
+`;
+const StyledFilterSearch = exports.StyledFilterSearch = _styledComponents.default.div`
+    position: absolute;
+    width: 100%;
+`;
+const StyledFilterIcon = exports.StyledFilterIcon = _styledComponents.default.div`
+    cursor: pointer;
+
+    width: 30px;
+    height: 30px;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    ${({
+  $isOpen,
+  theme
+}) => $isOpen && (0, _styledComponents.css)`
+            background-color: ${theme['100']};
+        `}
+
+    &:hover {
+        background-color: ${({
+  theme
+}) => theme['100']};
+    }
+`;
+const StyledMotionFilterBackground = exports.StyledMotionFilterBackground = (0, _styledComponents.default)(_react.motion.div)`
+    width: 30px;
+
+    position: absolute;
+
+    top: ${({
+  $top
+}) => $top}px;
+    left: ${({
+  $left
+}) => $left}px;
+
+    background-color: ${({
+  theme
+}) => theme['100']};
+`;
+const StyledFilterContentWrapper = exports.StyledFilterContentWrapper = _styledComponents.default.div``;
+//# sourceMappingURL=Filter.styles.js.map

package/lib/cjs/components/filter/Filter.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Filter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_react","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledFilter","exports","styled","div","StyledFilterHead","StyledFilterHeadline","h1","isSearchActive","StyledFilterSearch","StyledFilterIcon","$isOpen","theme","css","StyledMotionFilterBackground","motion","$top","$left","StyledFilterContentWrapper"],"sources":["../../../../src/components/filter/Filter.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { motion } from 'motion/react';\n\nexport const StyledFilter = styled.div``;\n\nexport const StyledFilterHead = styled.div`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 20px;\n\n    position: relative;\n`;\n\ntype StyledFilterHeadlineProps = WithTheme<{ isSearchActive: boolean }>;\n\nexport const StyledFilterHeadline = styled.h1<StyledFilterHeadlineProps>`\n    margin: 0;\n\n    opacity: ${({ isSearchActive }) => (isSearchActive ? 0 : 1)};\n\n    transition: opacity 0.3s;\n`;\n\nexport const StyledFilterSearch = styled.div`\n    position: absolute;\n    width: 100%;\n`;\n\ntype StyledFilterIconProps = WithTheme<{\n    $isOpen: boolean;\n}>;\n\nexport const StyledFilterIcon = styled.div<StyledFilterIconProps>`\n    cursor: pointer;\n\n    width: 30px;\n    height: 30px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    ${({ $isOpen, theme }) =>\n        $isOpen &&\n        css`\n            background-color: ${theme['100']};\n        `}\n\n    &:hover {\n        background-color: ${({ theme }) => theme['100']};\n    }\n`;\n\ntype StyledMotionFilterBackgroundProps = WithTheme<{ $top: number; $left: number }>;\n\nexport const StyledMotionFilterBackground = styled(motion.div)<StyledMotionFilterBackgroundProps>`\n    width: 30px;\n\n    position: absolute;\n\n    top: ${({ $top }) => $top}px;\n    left: ${({ $left }) => $left}px;\n\n    background-color: ${({ theme }) => theme['100']};\n`;\n\nexport const StyledFilterContentWrapper = styled.div``;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AAAsC,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAE/B,MAAMkB,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAGE,yBAAM,CAACC,GAAG,EAAE;AAEjC,MAAMC,gBAAgB,GAAAH,OAAA,CAAAG,gBAAA,GAAGF,yBAAM,CAACC,GAAG;AAC1C;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAME,oBAAoB,GAAAJ,OAAA,CAAAI,oBAAA,GAAGH,yBAAM,CAACI,EAA6B;AACxE;AACA;AACA,eAAe,CAAC;EAAEC;AAAe,CAAC,KAAMA,cAAc,GAAG,CAAC,GAAG,CAAE;AAC/D;AACA;AACA,CAAC;AAEM,MAAMC,kBAAkB,GAAAP,OAAA,CAAAO,kBAAA,GAAGN,yBAAM,CAACC,GAAG;AAC5C;AACA;AACA,CAAC;AAMM,MAAMM,gBAAgB,GAAAR,OAAA,CAAAQ,gBAAA,GAAGP,yBAAM,CAACC,GAA0B;AACjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEO,OAAO;EAAEC;AAAM,CAAC,KACjBD,OAAO,IACP,IAAAE,qBAAG;AACX,gCAAgCD,KAAK,CAAC,KAAK,CAAC;AAC5C,SAAS;AACT;AACA;AACA,4BAA4B,CAAC;EAAEA;AAAM,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACvD;AACA,CAAC;AAIM,MAAME,4BAA4B,GAAAZ,OAAA,CAAAY,4BAAA,GAAG,IAAAX,yBAAM,EAACY,aAAM,CAACX,GAAG,CAAoC;AACjG;AACA;AACA;AACA;AACA,WAAW,CAAC;EAAEY;AAAK,CAAC,KAAKA,IAAI;AAC7B,YAAY,CAAC;EAAEC;AAAM,CAAC,KAAKA,KAAK;AAChC;AACA,wBAAwB,CAAC;EAAEL;AAAM,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACnD,CAAC;AAEM,MAAMM,0BAA0B,GAAAhB,OAAA,CAAAgB,0BAAA,GAAGf,yBAAM,CAACC,GAAG,EAAE","ignoreList":[]}

package/lib/cjs/components/filter/filter-content/FIlterContent.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _FilterContent = require("./FilterContent.styles");
+var _Input = _interopRequireDefault(require("../../input/Input"));
+var _Icon = _interopRequireDefault(require("../../icon/Icon"));
+var _FilterButtons = _interopRequireDefault(require("../../filter-buttons/FilterButtons"));
+var _ComboBox = _interopRequireDefault(require("../../combobox/ComboBox"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const FilterContent = ({
+  searchConfig,
+  sortConfig,
+  filterButtonConfig
+}) => {
+  const handleSelectSortItem = (0, _react.useCallback)(item => {
+    if (!item) {
+      return;
+    }
+    const {
+      text,
+      value
+    } = item;
+    if (sortConfig) {
+      sortConfig.onSortChange({
+        text,
+        id: value
+      });
+    }
+  }, [sortConfig]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContent, null, searchConfig && /*#__PURE__*/_react.default.createElement(_Input.default, {
+    onChange: ev => searchConfig.onSearchChange(ev.target.value),
+    placeholder: "Suche",
+    value: searchConfig.searchValue,
+    shouldShowClearIcon: searchConfig.searchValue.length > 0,
+    leftElement: /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icons: ['fa fa-search']
+    })
+  }), filterButtonConfig && /*#__PURE__*/_react.default.createElement(_FilterButtons.default, filterButtonConfig), sortConfig && /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterSort, null, /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterSortText, null, "Sortierung"), /*#__PURE__*/_react.default.createElement(_ComboBox.default, {
+    lists: [{
+      list: sortConfig.items.map(({
+        text,
+        id
+      }) => ({
+        text,
+        value: id
+      }))
+    }],
+    placeholder: "",
+    selectedItem: {
+      text: sortConfig.selectedItem.text,
+      value: sortConfig.selectedItem.id
+    },
+    onSelect: handleSelectSortItem
+  }))), [filterButtonConfig, handleSelectSortItem, searchConfig, sortConfig]);
+};
+FilterContent.displayName = 'FilterContent';
+var _default = exports.default = FilterContent;
+//# sourceMappingURL=FIlterContent.js.map

package/lib/cjs/components/filter/filter-content/FIlterContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FIlterContent.js","names":["_react","_interopRequireWildcard","require","_FilterContent","_Input","_interopRequireDefault","_Icon","_FilterButtons","_ComboBox","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterContent","searchConfig","sortConfig","filterButtonConfig","handleSelectSortItem","useCallback","item","text","value","onSortChange","id","useMemo","createElement","StyledFilterContent","onChange","ev","onSearchChange","target","placeholder","searchValue","shouldShowClearIcon","length","leftElement","icons","StyledFilterSort","StyledFilterSortText","lists","list","items","map","selectedItem","onSelect","displayName","_default","exports"],"sources":["../../../../../src/components/filter/filter-content/FIlterContent.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo } from 'react';\nimport {\n    StyledFilterContent,\n    StyledFilterSort,\n    StyledFilterSortText,\n} from './FilterContent.styles';\nimport Input from '../../input/Input';\nimport Icon from '../../icon/Icon';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport { FilterButtonConfig, SearchConfig, SortConfig } from '../../../types/filter';\nimport ComboBox, { IComboBoxItem } from '../../combobox/ComboBox';\n\nexport type FilterContentProps = {\n    searchConfig?: SearchConfig;\n    filterButtonConfig?: FilterButtonConfig;\n    sortConfig?: SortConfig;\n};\n\nconst FilterContent: FC<FilterContentProps> = ({\n    searchConfig,\n    sortConfig,\n    filterButtonConfig,\n}) => {\n    const handleSelectSortItem = useCallback(\n        (item: IComboBoxItem | undefined) => {\n            if (!item) {\n                return;\n            }\n\n            const { text, value } = item;\n\n            if (sortConfig) {\n                sortConfig.onSortChange({ text, id: value });\n            }\n        },\n        [sortConfig],\n    );\n\n    return useMemo(\n        () => (\n            <StyledFilterContent>\n                {searchConfig && (\n                    <Input\n                        onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n                        placeholder=\"Suche\"\n                        value={searchConfig.searchValue}\n                        shouldShowClearIcon={searchConfig.searchValue.length > 0}\n                        leftElement={<Icon icons={['fa fa-search']} />}\n                    />\n                )}\n                {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n                {filterButtonConfig && <FilterButtons {...filterButtonConfig} />}\n                {sortConfig && (\n                    <StyledFilterSort>\n                        <StyledFilterSortText>Sortierung</StyledFilterSortText>\n                        <ComboBox\n                            lists={[\n                                {\n                                    list: sortConfig.items.map(({ text, id }) => ({\n                                        text,\n                                        value: id,\n                                    })),\n                                },\n                            ]}\n                            placeholder=\"\"\n                            selectedItem={{\n                                text: sortConfig.selectedItem.text,\n                                value: sortConfig.selectedItem.id,\n                            }}\n                            onSelect={handleSelectSortItem}\n                        />\n                    </StyledFilterSort>\n                )}\n            </StyledFilterContent>\n        ),\n        [filterButtonConfig, handleSelectSortItem, searchConfig, sortConfig],\n    );\n};\n\nFilterContent.displayName = 'FilterContent';\n\nexport default FilterContent;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/filter/filter-content/FilterContent.styles.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledFilterSortText = exports.StyledFilterSort = exports.StyledFilterContent = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledFilterContent = exports.StyledFilterContent = _styledComponents.default.div`
+    background-color: ${({
+  theme
+}) => theme['100']};
+
+    padding: 12px;
+
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+`;
+const StyledFilterSort = exports.StyledFilterSort = _styledComponents.default.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 20px;
+`;
+const StyledFilterSortText = exports.StyledFilterSortText = _styledComponents.default.div``;
+//# sourceMappingURL=FilterContent.styles.js.map

package/lib/cjs/components/filter/filter-content/FilterContent.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterContent.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledFilterContent","exports","styled","div","theme","StyledFilterSort","StyledFilterSortText"],"sources":["../../../../../src/components/filter/filter-content/FilterContent.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledFilterContentProps = WithTheme<unknown>;\n\nexport const StyledFilterContent = styled.div<StyledFilterContentProps>`\n    background-color: ${({ theme }) => theme['100']};\n\n    padding: 12px;\n\n    display: flex;\n    flex-direction: column;\n    gap: 20px;\n`;\n\nexport const StyledFilterSort = styled.div`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 20px;\n`;\n\nexport const StyledFilterSortText = styled.div``;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKhC,MAAMG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAA6B;AACvE,wBAAwB,CAAC;EAAEC;AAAM,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACnD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,gBAAgB,GAAAJ,OAAA,CAAAI,gBAAA,GAAGH,yBAAM,CAACC,GAAG;AAC1C;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMG,oBAAoB,GAAAL,OAAA,CAAAK,oBAAA,GAAGJ,yBAAM,CAACC,GAAG,EAAE","ignoreList":[]}

package/lib/cjs/components/filter-buttons/FilterButtons.js

@@ -0,0 +1,96 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _filterButtons = require("../../types/filterButtons");
+var _FilterButton = _interopRequireDefault(require("./filter-button/FilterButton"));
+var _FilterButtons = require("./FilterButtons.styles");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const FilterButtons = ({
+  allCount,
+  selectedItemIds,
+  onSelect,
+  items,
+  shouldCalcCountForAll = false,
+  size = _filterButtons.FilterButtonSize.Normal
+}) => {
+  const [selectedIds, setSelectedIds] = (0, _react.useState)(['all']);
+
+  /**
+   * This function set the selectedItemKey
+   */
+  (0, _react.useEffect)(() => {
+    if (selectedItemIds) {
+      setSelectedIds(selectedItemIds);
+    }
+  }, [selectedItemIds]);
+
+  /**
+   * Function to update the selected items
+   */
+  const handleSelect = (0, _react.useCallback)(id => {
+    let newIds;
+    if (id === 'all') {
+      newIds = selectedIds.includes('all') ? ['all'] : [];
+    } else {
+      newIds = selectedIds.includes(id) ? selectedIds.filter(filteredId => filteredId !== id) : [...selectedIds.filter(filteredId => filteredId !== 'all'), id];
+    }
+    if (newIds.length === 0) {
+      newIds = ['all'];
+    }
+    setSelectedIds(newIds);
+    if (typeof onSelect === 'function') {
+      onSelect(newIds.filter(selectedId => selectedId !== 'all'));
+    }
+  }, [onSelect, selectedIds]);
+  const reactItems = (0, _react.useMemo)(() => {
+    if (items.length === 0) {
+      return null;
+    }
+    let allButtonCount = allCount;
+    if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {
+      allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);
+    }
+    const array = [/*#__PURE__*/_react.default.createElement(_FilterButton.default, {
+      count: allButtonCount,
+      id: "all",
+      key: "all",
+      onSelect: handleSelect,
+      isSelected: selectedIds.includes('all') || Array.isArray(selectedIds) && selectedIds.length === 0,
+      shape: _filterButtons.FilterButtonItemShape.Rectangular,
+      size: size,
+      text: "Alle"
+    })];
+    items.forEach(({
+      icons,
+      text,
+      color,
+      count,
+      id,
+      isDisabled
+    }) => {
+      array.push(/*#__PURE__*/_react.default.createElement(_FilterButton.default, {
+        color: color,
+        icons: icons,
+        id: id,
+        key: id,
+        count: count,
+        onSelect: handleSelect,
+        isSelected: selectedIds.includes(id),
+        shape: _filterButtons.FilterButtonItemShape.Round,
+        size: size,
+        text: text,
+        isDisabled: isDisabled
+      }));
+    });
+    return array;
+  }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterButtons.StyledFilterButton, null, reactItems), [reactItems]);
+};
+FilterButtons.displayName = 'FilterButtons';
+var _default = exports.default = FilterButtons;
+//# sourceMappingURL=FilterButtons.js.map

package/lib/cjs/components/filter-buttons/FilterButtons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButtons","allCount","selectedItemIds","onSelect","items","shouldCalcCountForAll","size","FilterButtonSize","Normal","selectedIds","setSelectedIds","useState","useEffect","handleSelect","useCallback","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","useMemo","allButtonCount","reduce","acc","item","count","array","createElement","key","isSelected","Array","isArray","shape","FilterButtonItemShape","Rectangular","text","forEach","icons","color","isDisabled","push","Round","StyledFilterButton","displayName","_default","exports"],"sources":["../../../../src/components/filter-buttons/FilterButtons.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n    FilterButtonItemShape,\n    FilterButtonSize,\n    IFilterButtonItem,\n} from '../../types/filterButtons';\nimport FilterButton from './filter-button/FilterButton';\nimport { StyledFilterButton } from './FilterButtons.styles';\n\nexport type FilterButtonsProps = {\n    /**\n     * The number that should be displayed as count in the \"all\" button.\n     */\n    allCount?: number;\n    /**\n     * The items that should be displayed.\n     */\n    items: IFilterButtonItem[];\n    /**\n     * A function that should be executed when an item is selected.\n     */\n    onSelect?: (keys: string[]) => void;\n    /**\n     * The keys of items that should be selected.\n     */\n    selectedItemIds?: string[];\n    /**\n     * If true, the count of all items will be shown in the \"all\" button.\n     */\n    shouldCalcCountForAll?: boolean;\n    /**\n     * The size auf the filter buttons. Use the FilterButtonSize enum.\n     */\n    size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n    allCount,\n    selectedItemIds,\n    onSelect,\n    items,\n    shouldCalcCountForAll = false,\n    size = FilterButtonSize.Normal,\n}) => {\n    const [selectedIds, setSelectedIds] = useState<string[]>(['all']);\n\n    /**\n     * This function set the selectedItemKey\n     */\n    useEffect(() => {\n        if (selectedItemIds) {\n            setSelectedIds(selectedItemIds);\n        }\n    }, [selectedItemIds]);\n\n    /**\n     * Function to update the selected items\n     */\n    const handleSelect = useCallback(\n        (id: string) => {\n            let newIds: string[];\n\n            if (id === 'all') {\n                newIds = selectedIds.includes('all') ? ['all'] : [];\n            } else {\n                newIds = selectedIds.includes(id)\n                    ? selectedIds.filter((filteredId) => filteredId !== id)\n                    : [...selectedIds.filter((filteredId) => filteredId !== 'all'), id];\n            }\n\n            if (newIds.length === 0) {\n                newIds = ['all'];\n            }\n\n            setSelectedIds(newIds);\n\n            if (typeof onSelect === 'function') {\n                onSelect(newIds.filter((selectedId) => selectedId !== 'all'));\n            }\n        },\n        [onSelect, selectedIds],\n    );\n\n    const reactItems = useMemo(() => {\n        if (items.length === 0) {\n            return null;\n        }\n\n        let allButtonCount = allCount;\n\n        if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {\n            allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);\n        }\n\n        const array: ReactElement[] = [\n            <FilterButton\n                count={allButtonCount}\n                id=\"all\"\n                key=\"all\"\n                onSelect={handleSelect}\n                isSelected={\n                    selectedIds.includes('all') ||\n                    (Array.isArray(selectedIds) && selectedIds.length === 0)\n                }\n                shape={FilterButtonItemShape.Rectangular}\n                size={size}\n                text=\"Alle\"\n            />,\n        ];\n\n        items.forEach(({ icons, text, color, count, id, isDisabled }) => {\n            array.push(\n                <FilterButton\n                    color={color}\n                    icons={icons}\n                    id={id}\n                    key={id}\n                    count={count}\n                    onSelect={handleSelect}\n                    isSelected={selectedIds.includes(id)}\n                    shape={FilterButtonItemShape.Round}\n                    size={size}\n                    text={text}\n                    isDisabled={isDisabled}\n                />,\n            );\n        });\n\n        return array;\n    }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);\n\n    return useMemo(() => <StyledFilterButton>{reactItems}</StyledFilterButton>, [reactItems]);\n};\n\nFilterButtons.displayName = 'FilterButtons';\n\nexport default FilterButtons;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/filter-buttons/FilterButtons.styles.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledFilterButton = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledFilterButton = exports.StyledFilterButton = _styledComponents.default.div`
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10px;
+`;
+//# sourceMappingURL=FilterButtons.styles.js.map

package/lib/cjs/components/filter-buttons/FilterButtons.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterButtons.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledFilterButton","exports","styled","div"],"sources":["../../../../src/components/filter-buttons/FilterButtons.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledFilterButton = styled.div`\n    display: flex;\n    flex-wrap: wrap;\n    gap: 10px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC5C;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Icon = _interopRequireDefault(require("../../icon/Icon"));
+var _FilterButton = require("./FilterButton.styles");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const FilterButton = ({
+  icons,
+  size,
+  shape,
+  text,
+  color,
+  count,
+  isSelected,
+  id,
+  isDisabled,
+  onSelect
+}) => {
+  const handleClick = (0, _react.useCallback)(() => {
+    if (isDisabled) {
+      return;
+    }
+    onSelect(id);
+  }, [id, isDisabled, onSelect]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItem, {
+    $isSelected: isSelected,
+    $isDisabled: isDisabled,
+    $size: size,
+    onClick: handleClick
+  }, /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabel, null, icons && /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icons: icons,
+    size: 15
+  }), /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabelText, null, text), typeof count === 'number' && /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabelCount, null, count.toLocaleString())), /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemBorder, {
+    $isSelected: isSelected,
+    $shape: shape,
+    $color: color
+  }), /*#__PURE__*/_react.default.createElement(_FilterButton.StyledMotionFilterButtonItemBackground, {
+    $isSelected: isSelected,
+    $shape: shape,
+    $color: color
+  })), [color, count, handleClick, icons, isDisabled, isSelected, shape, size, text]);
+};
+FilterButton.displayName = 'FilterButton';
+var _default = exports.default = FilterButton;
+//# sourceMappingURL=FilterButton.js.map

package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterButton.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_FilterButton","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButton","icons","size","shape","text","color","count","isSelected","id","isDisabled","onSelect","handleClick","useCallback","useMemo","createElement","StyledFilterButtonItem","$isSelected","$isDisabled","$size","onClick","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","StyledFilterButtonItemLabelCount","toLocaleString","StyledFilterButtonItemBorder","$shape","$color","StyledMotionFilterButtonItemBackground","displayName","_default","exports"],"sources":["../../../../../src/components/filter-buttons/filter-button/FilterButton.tsx"],"sourcesContent":["import React, { CSSProperties, FC, useCallback, useMemo } from 'react';\nimport type { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';\nimport Icon from '../../icon/Icon';\nimport {\n    StyledFilterButtonItem,\n    StyledFilterButtonItemBorder,\n    StyledFilterButtonItemLabel,\n    StyledFilterButtonItemLabelCount,\n    StyledFilterButtonItemLabelText,\n    StyledMotionFilterButtonItemBackground,\n} from './FilterButton.styles';\n\nexport type FilterButtonProps = {\n    color?: CSSProperties['color'];\n    icons?: string[];\n    isSelected: boolean;\n    shape: FilterButtonItemShape;\n    size: FilterButtonSize;\n    count?: number;\n    text: string;\n    id: string;\n    isDisabled?: boolean;\n    onSelect: (key: string) => void;\n};\n\nconst FilterButton: FC<FilterButtonProps> = ({\n    icons,\n    size,\n    shape,\n    text,\n    color,\n    count,\n    isSelected,\n    id,\n    isDisabled,\n    onSelect,\n}) => {\n    const handleClick = useCallback(() => {\n        if (isDisabled) {\n            return;\n        }\n\n        onSelect(id);\n    }, [id, isDisabled, onSelect]);\n\n    return useMemo(\n        () => (\n            <StyledFilterButtonItem\n                $isSelected={isSelected}\n                $isDisabled={isDisabled}\n                $size={size}\n                onClick={handleClick}\n            >\n                <StyledFilterButtonItemLabel>\n                    {icons && <Icon icons={icons} size={15} />}\n                    <StyledFilterButtonItemLabelText>{text}</StyledFilterButtonItemLabelText>\n                    {typeof count === 'number' && (\n                        <StyledFilterButtonItemLabelCount>\n                            {count.toLocaleString()}\n                        </StyledFilterButtonItemLabelCount>\n                    )}\n                </StyledFilterButtonItemLabel>\n                <StyledFilterButtonItemBorder\n                    $isSelected={isSelected}\n                    $shape={shape}\n                    $color={color}\n                />\n                <StyledMotionFilterButtonItemBackground\n                    $isSelected={isSelected}\n                    $shape={shape}\n                    $color={color}\n                />\n            </StyledFilterButtonItem>\n        ),\n        [color, count, handleClick, icons, isDisabled, isSelected, shape, size, text],\n    );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"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","ignoreList":[]}