@chayns-components/core 5.0.0-beta.949 → 5.0.0-beta.952

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.
@@ -12,9 +12,11 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
12
12
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
13
13
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
14
14
  const FilterButtons = ({
15
+ allCount,
15
16
  selectedItemIds,
16
17
  onSelect,
17
18
  items,
19
+ shouldCalcCountForAll = false,
18
20
  size = _filterButtons.FilterButtonSize.Normal
19
21
  }) => {
20
22
  const [selectedIds, setSelectedIds] = (0, _react.useState)(['all']);
@@ -50,7 +52,12 @@ const FilterButtons = ({
50
52
  if (items.length === 0) {
51
53
  return null;
52
54
  }
55
+ let allButtonCount = allCount;
56
+ if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {
57
+ allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);
58
+ }
53
59
  const array = [/*#__PURE__*/_react.default.createElement(_FilterButton.default, {
60
+ count: allButtonCount,
54
61
  id: "all",
55
62
  key: "all",
56
63
  onSelect: handleSelect,
@@ -80,7 +87,7 @@ const FilterButtons = ({
80
87
  }));
81
88
  });
82
89
  return array;
83
- }, [handleSelect, items, selectedIds, size]);
90
+ }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);
84
91
  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterButtons.StyledFilterButton, null, reactItems), [reactItems]);
85
92
  };
86
93
  FilterButtons.displayName = 'FilterButtons';
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FilterButtons","selectedItemIds","onSelect","items","size","FilterButtonSize","Normal","selectedIds","setSelectedIds","useState","useEffect","handleSelect","useCallback","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","useMemo","array","createElement","key","isSelected","Array","isArray","shape","FilterButtonItemShape","Rectangular","text","forEach","icons","color","count","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 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 * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n selectedItemIds,\n onSelect,\n items,\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 const array: ReactElement[] = [\n <FilterButton\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 }) => {\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 />,\n );\n });\n\n return array;\n }, [handleSelect, items, selectedIds, 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":[]}
1
+ {"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","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","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 }) => {\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 />,\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":[]}
@@ -31,7 +31,7 @@ const FilterButton = ({
31
31
  }, /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabel, null, icons && /*#__PURE__*/_react.default.createElement(_Icon.default, {
32
32
  icons: icons,
33
33
  size: 15
34
- }), /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabelText, null, text), count && /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabelCount, null, count)), /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemBorder, {
34
+ }), /*#__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, {
35
35
  $isSelected: isSelected,
36
36
  $shape: shape,
37
37
  $color: color
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButton.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_FilterButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FilterButton","icons","size","shape","text","color","count","isSelected","id","onSelect","handleClick","useCallback","useMemo","createElement","StyledFilterButtonItem","$isSelected","$size","onClick","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","StyledFilterButtonItemLabelCount","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 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 onSelect,\n}) => {\n const handleClick = useCallback(() => {\n onSelect(id);\n }, [id, onSelect]);\n\n return useMemo(\n () => (\n <StyledFilterButtonItem $isSelected={isSelected} $size={size} onClick={handleClick}>\n <StyledFilterButtonItemLabel>\n {icons && <Icon icons={icons} size={15} />}\n <StyledFilterButtonItemLabelText>{text}</StyledFilterButtonItemLabelText>\n {count && (\n <StyledFilterButtonItemLabelCount>{count}</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, isSelected, shape, size, text],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"FilterButton.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_FilterButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FilterButton","icons","size","shape","text","color","count","isSelected","id","onSelect","handleClick","useCallback","useMemo","createElement","StyledFilterButtonItem","$isSelected","$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 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 onSelect,\n}) => {\n const handleClick = useCallback(() => {\n onSelect(id);\n }, [id, onSelect]);\n\n return useMemo(\n () => (\n <StyledFilterButtonItem $isSelected={isSelected} $size={size} onClick={handleClick}>\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, isSelected, shape, size, text],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"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","ignoreList":[]}
@@ -4,9 +4,11 @@ import FilterButton from './filter-button/FilterButton';
4
4
  import { StyledFilterButton } from './FilterButtons.styles';
5
5
  const FilterButtons = _ref => {
6
6
  let {
7
+ allCount,
7
8
  selectedItemIds,
8
9
  onSelect,
9
10
  items,
11
+ shouldCalcCountForAll = false,
10
12
  size = FilterButtonSize.Normal
11
13
  } = _ref;
12
14
  const [selectedIds, setSelectedIds] = useState(['all']);
@@ -42,7 +44,12 @@ const FilterButtons = _ref => {
42
44
  if (items.length === 0) {
43
45
  return null;
44
46
  }
47
+ let allButtonCount = allCount;
48
+ if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {
49
+ allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);
50
+ }
45
51
  const array = [/*#__PURE__*/React.createElement(FilterButton, {
52
+ count: allButtonCount,
46
53
  id: "all",
47
54
  key: "all",
48
55
  onSelect: handleSelect,
@@ -73,7 +80,7 @@ const FilterButtons = _ref => {
73
80
  }));
74
81
  });
75
82
  return array;
76
- }, [handleSelect, items, selectedIds, size]);
83
+ }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);
77
84
  return useMemo(() => /*#__PURE__*/React.createElement(StyledFilterButton, null, reactItems), [reactItems]);
78
85
  };
79
86
  FilterButtons.displayName = 'FilterButtons';
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButtons.js","names":["React","useCallback","useEffect","useMemo","useState","FilterButtonItemShape","FilterButtonSize","FilterButton","StyledFilterButton","FilterButtons","_ref","selectedItemIds","onSelect","items","size","Normal","selectedIds","setSelectedIds","handleSelect","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","array","createElement","key","isSelected","Array","isArray","shape","Rectangular","text","forEach","_ref2","icons","color","count","push","Round","displayName"],"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 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 * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n selectedItemIds,\n onSelect,\n items,\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 const array: ReactElement[] = [\n <FilterButton\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 }) => {\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 />,\n );\n });\n\n return array;\n }, [handleSelect, items, selectedIds, 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":[]}
1
+ {"version":3,"file":"FilterButtons.js","names":["React","useCallback","useEffect","useMemo","useState","FilterButtonItemShape","FilterButtonSize","FilterButton","StyledFilterButton","FilterButtons","_ref","allCount","selectedItemIds","onSelect","items","shouldCalcCountForAll","size","Normal","selectedIds","setSelectedIds","handleSelect","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","allButtonCount","reduce","acc","item","count","array","createElement","key","isSelected","Array","isArray","shape","Rectangular","text","forEach","_ref2","icons","color","push","Round","displayName"],"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 }) => {\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 />,\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":[]}
@@ -23,7 +23,7 @@ const FilterButton = _ref => {
23
23
  }, /*#__PURE__*/React.createElement(StyledFilterButtonItemLabel, null, icons && /*#__PURE__*/React.createElement(Icon, {
24
24
  icons: icons,
25
25
  size: 15
26
- }), /*#__PURE__*/React.createElement(StyledFilterButtonItemLabelText, null, text), count && /*#__PURE__*/React.createElement(StyledFilterButtonItemLabelCount, null, count)), /*#__PURE__*/React.createElement(StyledFilterButtonItemBorder, {
26
+ }), /*#__PURE__*/React.createElement(StyledFilterButtonItemLabelText, null, text), typeof count === 'number' && /*#__PURE__*/React.createElement(StyledFilterButtonItemLabelCount, null, count.toLocaleString())), /*#__PURE__*/React.createElement(StyledFilterButtonItemBorder, {
27
27
  $isSelected: isSelected,
28
28
  $shape: shape,
29
29
  $color: color
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButton.js","names":["React","useCallback","useMemo","Icon","StyledFilterButtonItem","StyledFilterButtonItemBorder","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelCount","StyledFilterButtonItemLabelText","StyledMotionFilterButtonItemBackground","FilterButton","_ref","icons","size","shape","text","color","count","isSelected","id","onSelect","handleClick","createElement","$isSelected","$size","onClick","$shape","$color","displayName"],"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 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 onSelect,\n}) => {\n const handleClick = useCallback(() => {\n onSelect(id);\n }, [id, onSelect]);\n\n return useMemo(\n () => (\n <StyledFilterButtonItem $isSelected={isSelected} $size={size} onClick={handleClick}>\n <StyledFilterButtonItemLabel>\n {icons && <Icon icons={icons} size={15} />}\n <StyledFilterButtonItemLabelText>{text}</StyledFilterButtonItemLabelText>\n {count && (\n <StyledFilterButtonItemLabelCount>{count}</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, isSelected, shape, size, text],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAuBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAEtE,OAAOC,IAAI,MAAM,iBAAiB;AAClC,SACIC,sBAAsB,EACtBC,4BAA4B,EAC5BC,2BAA2B,EAC3BC,gCAAgC,EAChCC,+BAA+B,EAC/BC,sCAAsC,QACnC,uBAAuB;AAc9B,MAAMC,YAAmC,GAAGC,IAAA,IAUtC;EAAA,IAVuC;IACzCC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,KAAK;IACLC,UAAU;IACVC,EAAE;IACFC;EACJ,CAAC,GAAAT,IAAA;EACG,MAAMU,WAAW,GAAGpB,WAAW,CAAC,MAAM;IAClCmB,QAAQ,CAACD,EAAE,CAAC;EAChB,CAAC,EAAE,CAACA,EAAE,EAAEC,QAAQ,CAAC,CAAC;EAElB,OAAOlB,OAAO,CACV,mBACIF,KAAA,CAAAsB,aAAA,CAAClB,sBAAsB;IAACmB,WAAW,EAAEL,UAAW;IAACM,KAAK,EAAEX,IAAK;IAACY,OAAO,EAAEJ;EAAY,gBAC/ErB,KAAA,CAAAsB,aAAA,CAAChB,2BAA2B,QACvBM,KAAK,iBAAIZ,KAAA,CAAAsB,aAAA,CAACnB,IAAI;IAACS,KAAK,EAAEA,KAAM;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC,eAC1Cb,KAAA,CAAAsB,aAAA,CAACd,+BAA+B,QAAEO,IAAsC,CAAC,EACxEE,KAAK,iBACFjB,KAAA,CAAAsB,aAAA,CAACf,gCAAgC,QAAEU,KAAwC,CAEtD,CAAC,eAC9BjB,KAAA,CAAAsB,aAAA,CAACjB,4BAA4B;IACzBkB,WAAW,EAAEL,UAAW;IACxBQ,MAAM,EAAEZ,KAAM;IACda,MAAM,EAAEX;EAAM,CACjB,CAAC,eACFhB,KAAA,CAAAsB,aAAA,CAACb,sCAAsC;IACnCc,WAAW,EAAEL,UAAW;IACxBQ,MAAM,EAAEZ,KAAM;IACda,MAAM,EAAEX;EAAM,CACjB,CACmB,CAC3B,EACD,CAACA,KAAK,EAAEC,KAAK,EAAEI,WAAW,EAAET,KAAK,EAAEM,UAAU,EAAEJ,KAAK,EAAED,IAAI,EAAEE,IAAI,CACpE,CAAC;AACL,CAAC;AAEDL,YAAY,CAACkB,WAAW,GAAG,cAAc;AAEzC,eAAelB,YAAY","ignoreList":[]}
1
+ {"version":3,"file":"FilterButton.js","names":["React","useCallback","useMemo","Icon","StyledFilterButtonItem","StyledFilterButtonItemBorder","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelCount","StyledFilterButtonItemLabelText","StyledMotionFilterButtonItemBackground","FilterButton","_ref","icons","size","shape","text","color","count","isSelected","id","onSelect","handleClick","createElement","$isSelected","$size","onClick","toLocaleString","$shape","$color","displayName"],"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 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 onSelect,\n}) => {\n const handleClick = useCallback(() => {\n onSelect(id);\n }, [id, onSelect]);\n\n return useMemo(\n () => (\n <StyledFilterButtonItem $isSelected={isSelected} $size={size} onClick={handleClick}>\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, isSelected, shape, size, text],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAuBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAEtE,OAAOC,IAAI,MAAM,iBAAiB;AAClC,SACIC,sBAAsB,EACtBC,4BAA4B,EAC5BC,2BAA2B,EAC3BC,gCAAgC,EAChCC,+BAA+B,EAC/BC,sCAAsC,QACnC,uBAAuB;AAc9B,MAAMC,YAAmC,GAAGC,IAAA,IAUtC;EAAA,IAVuC;IACzCC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,IAAI;IACJC,KAAK;IACLC,KAAK;IACLC,UAAU;IACVC,EAAE;IACFC;EACJ,CAAC,GAAAT,IAAA;EACG,MAAMU,WAAW,GAAGpB,WAAW,CAAC,MAAM;IAClCmB,QAAQ,CAACD,EAAE,CAAC;EAChB,CAAC,EAAE,CAACA,EAAE,EAAEC,QAAQ,CAAC,CAAC;EAElB,OAAOlB,OAAO,CACV,mBACIF,KAAA,CAAAsB,aAAA,CAAClB,sBAAsB;IAACmB,WAAW,EAAEL,UAAW;IAACM,KAAK,EAAEX,IAAK;IAACY,OAAO,EAAEJ;EAAY,gBAC/ErB,KAAA,CAAAsB,aAAA,CAAChB,2BAA2B,QACvBM,KAAK,iBAAIZ,KAAA,CAAAsB,aAAA,CAACnB,IAAI;IAACS,KAAK,EAAEA,KAAM;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC,eAC1Cb,KAAA,CAAAsB,aAAA,CAACd,+BAA+B,QAAEO,IAAsC,CAAC,EACxE,OAAOE,KAAK,KAAK,QAAQ,iBACtBjB,KAAA,CAAAsB,aAAA,CAACf,gCAAgC,QAC5BU,KAAK,CAACS,cAAc,CAAC,CACQ,CAEb,CAAC,eAC9B1B,KAAA,CAAAsB,aAAA,CAACjB,4BAA4B;IACzBkB,WAAW,EAAEL,UAAW;IACxBS,MAAM,EAAEb,KAAM;IACdc,MAAM,EAAEZ;EAAM,CACjB,CAAC,eACFhB,KAAA,CAAAsB,aAAA,CAACb,sCAAsC;IACnCc,WAAW,EAAEL,UAAW;IACxBS,MAAM,EAAEb,KAAM;IACdc,MAAM,EAAEZ;EAAM,CACjB,CACmB,CAC3B,EACD,CAACA,KAAK,EAAEC,KAAK,EAAEI,WAAW,EAAET,KAAK,EAAEM,UAAU,EAAEJ,KAAK,EAAED,IAAI,EAAEE,IAAI,CACpE,CAAC;AACL,CAAC;AAEDL,YAAY,CAACmB,WAAW,GAAG,cAAc;AAEzC,eAAenB,YAAY","ignoreList":[]}
@@ -1,6 +1,10 @@
1
1
  import { FC } from 'react';
2
2
  import { FilterButtonSize, IFilterButtonItem } from '../../types/filterButtons';
3
3
  export type FilterButtonsProps = {
4
+ /**
5
+ * The number that should be displayed as count in the "all" button.
6
+ */
7
+ allCount?: number;
4
8
  /**
5
9
  * The items that should be displayed.
6
10
  */
@@ -13,6 +17,10 @@ export type FilterButtonsProps = {
13
17
  * The keys of items that should be selected.
14
18
  */
15
19
  selectedItemIds?: string[];
20
+ /**
21
+ * If true, the count of all items will be shown in the "all" button.
22
+ */
23
+ shouldCalcCountForAll?: boolean;
16
24
  /**
17
25
  * The size auf the filter buttons. Use the FilterButtonSize enum.
18
26
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.949",
3
+ "version": "5.0.0-beta.952",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -87,5 +87,5 @@
87
87
  "publishConfig": {
88
88
  "access": "public"
89
89
  },
90
- "gitHead": "ad8fe389b48db6fa767cbab41e553a432e51b07f"
90
+ "gitHead": "19166ed8e4ff3b1fbc6b87817f5e6119e4f0894f"
91
91
  }