@fast-simon/dashboard-utilities 1.0.139-beta.4 → 1.0.139-beta.6

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 (17) hide show
  1. package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js +2 -1
  2. package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js.map +1 -1
  3. package/dist/components/BackOfficeFiltersMenu/styles.module.css +6 -46
  4. package/dist/components/CheckboxFilter/Checkbox/styles.module.css +40 -15
  5. package/dist/components/FacetItem/styles.module.css +4 -6
  6. package/dist/components/FromToFilter/From/styles.module.css +5 -24
  7. package/dist/components/FromToFilter/To/styles.module.css +6 -25
  8. package/dist/components/FromToFilter/styles.module.css +10 -34
  9. package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js +3 -2
  10. package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js.map +1 -1
  11. package/dist/components/InStoreFiltersMenu/styles.module.css +6 -46
  12. package/dist/components/LastReceivedDateFilter/styles.module.css +11 -21
  13. package/dist/components/RadioFilter/Radio/styles.module.css +36 -20
  14. package/dist/components/RadioFilter/styles.module.css +1 -1
  15. package/dist/components/ReactDatePicker/styles.module.css +2 -10
  16. package/dist/components/SingleFilter/styles.module.css +3 -3
  17. package/package.json +1 -1
package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js CHANGED
@@ -5,6 +5,7 @@ import { FacetItem } from "../FacetItem/FacetItem";
5
5
  import { NarrowParser, FacetsTypes, } from "@fast-simon/utilities";
6
6
  import { FromToFilter } from "../FromToFilter/FromToFilter";
7
7
  import { getBackOfficeFilters, getBackOfficeFilterTooltipText, getLastReceivedTimeRange } from "./utils";
8
+ import classNames from "classnames";
8
9
  const BackOfficeFiltersMenu = ({ narrow, onNarrowChange, onPageChange }) => {
9
10
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
10
11
  const [filters, setFilters] = useState(getBackOfficeFilters());
@@ -67,7 +68,7 @@ const BackOfficeFiltersMenu = ({ narrow, onNarrowChange, onPageChange }) => {
67
68
  onPageChange(1);
68
69
  setFilters(getBackOfficeFilters());
69
70
  };
70
- return (_jsxs("div", Object.assign({ className: classes.filtersContainer, style: { opacity: disableFilters ? 0.5 : 1, pointerEvents: disableFilters ? 'none' : 'auto' } }, { children: [_jsxs("div", Object.assign({ className: classes.headerContainer }, { children: [_jsx("h2", Object.assign({ className: classes.title }, { children: "Inventory & Sales Filters" })), _jsxs("div", Object.assign({ className: classes.clearAllButton, onClick: clearAll }, { children: [_jsx("span", { className: `ph ph-eraser`, style: { fontSize: '20px' } }), _jsx("span", Object.assign({ className: classes.clearAllText }, { children: "Clear all" }))] }))] })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FacetItem, { narrow: narrow[(((_a = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _a === void 0 ? void 0 : _a.meta) && narrow[(((_b = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _b === void 0 ? void 0 : _b.name) + "_from_to")]) ? (((_c = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _c === void 0 ? void 0 : _c.name) + "_from_to") : (_d = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _d === void 0 ? void 0 : _d.id], facet: filters === null || filters === void 0 ? void 0 : filters["filter"], onChange: onFilterChange, onNarrowChange: onNarrowChange, onPageChange: onNarrowChange, type: FacetsTypes.multiSelect, tooltipText: getBackOfficeFilterTooltipText["filter"], disableSelect: disableFilters }, "fs-filters" + ((_e = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _e === void 0 ? void 0 : _e.id.toString())) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FacetItem, { narrow: narrow[(((_f = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _f === void 0 ? void 0 : _f.meta) && narrow[(((_g = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _g === void 0 ? void 0 : _g.name) + "_from_to")]) ? (((_h = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _h === void 0 ? void 0 : _h.name) + "_from_to") : (_j = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _j === void 0 ? void 0 : _j.id], facet: filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"], onChange: onFilterChange, onNarrowChange: onNarrowChange, onPageChange: onNarrowChange, type: FacetsTypes.RadioSelect, tooltipText: getBackOfficeFilterTooltipText["lastReceivedDate"], disableSelect: disableFilters }, "fs-filters" + ((_k = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _k === void 0 ? void 0 : _k.id.toString())) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["stockAvailability"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["stockAvailability"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["variantsInStock"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["variantsInStock"], limit: { min: 0, max: 100 } }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["sales"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["sales"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["weeksOfStock"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["weeksOfStock"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["margin"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["margin"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["marginPercent"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["marginPercent"], limit: { min: 0, max: 100 } }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["merchCreationDate"], convertValueCallback: (value) => { var _a; return Number(value) > 0 ? (_a = (Number(value) / 1000)) === null || _a === void 0 ? void 0 : _a.toString() : value; }, onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["merchCreationDate"] }) }))] })));
71
+ return (_jsxs("div", Object.assign({ className: classes.filtersContainer, style: { opacity: disableFilters ? 0.5 : 1, pointerEvents: disableFilters ? 'none' : 'auto' } }, { children: [_jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FacetItem, { narrow: narrow[(((_a = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _a === void 0 ? void 0 : _a.meta) && narrow[(((_b = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _b === void 0 ? void 0 : _b.name) + "_from_to")]) ? (((_c = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _c === void 0 ? void 0 : _c.name) + "_from_to") : (_d = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _d === void 0 ? void 0 : _d.id], facet: filters === null || filters === void 0 ? void 0 : filters["filter"], onChange: onFilterChange, onNarrowChange: onNarrowChange, onPageChange: onNarrowChange, type: FacetsTypes.multiSelect, tooltipText: getBackOfficeFilterTooltipText["filter"], disableSelect: disableFilters }, "fs-filters" + ((_e = filters === null || filters === void 0 ? void 0 : filters["filter"]) === null || _e === void 0 ? void 0 : _e.id.toString())) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FacetItem, { narrow: narrow[(((_f = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _f === void 0 ? void 0 : _f.meta) && narrow[(((_g = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _g === void 0 ? void 0 : _g.name) + "_from_to")]) ? (((_h = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _h === void 0 ? void 0 : _h.name) + "_from_to") : (_j = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _j === void 0 ? void 0 : _j.id], facet: filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"], onChange: onFilterChange, onNarrowChange: onNarrowChange, onPageChange: onNarrowChange, type: FacetsTypes.RadioSelect, tooltipText: getBackOfficeFilterTooltipText["lastReceivedDate"], disableSelect: disableFilters }, "fs-filters" + ((_k = filters === null || filters === void 0 ? void 0 : filters["lastReceivedDate"]) === null || _k === void 0 ? void 0 : _k.id.toString())) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["stockAvailability"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["stockAvailability"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["variantsInStock"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["variantsInStock"], limit: { min: 0, max: 100 } }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["sales"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["sales"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["weeksOfStock"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["weeksOfStock"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["margin"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["margin"] }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["marginPercent"], onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["marginPercent"], limit: { min: 0, max: 100 } }) })), _jsx("div", Object.assign({ className: classes.sideMenuContainer }, { children: _jsx(FromToFilter, { facet: filters === null || filters === void 0 ? void 0 : filters["merchCreationDate"], convertValueCallback: (value) => { var _a; return Number(value) > 0 ? (_a = (Number(value) / 1000)) === null || _a === void 0 ? void 0 : _a.toString() : value; }, onChange: onFromToFilterChange, tooltipText: getBackOfficeFilterTooltipText["merchCreationDate"] }) })), _jsx("span", Object.assign({ onClick: clearAll, className: classNames(classes.arrow, classes.clearAll) }, { children: _jsxs("small", { children: ["Clear All\u00A0\u00A0\u00A0", _jsx("i", {})] }) }))] })));
71
72
  };
72
73
  export default BackOfficeFiltersMenu;
73
74
  //# sourceMappingURL=BackOfficeFiltersMenu.js.map
package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BackOfficeFiltersMenu.js","sourceRoot":"","sources":["../../../src/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {useState} from 'react';\nimport classes from './styles.module.css';\nimport {FacetItem} from \"../FacetItem/FacetItem\";\nimport {\n Facet,\n NarrowParser,\n FacetsTypes,\n Narrow,\n} from \"@fast-simon/utilities\";\nimport {FromToFilter} from \"../FromToFilter/FromToFilter\";\nimport {getBackOfficeFilters, getBackOfficeFilterTooltipText, getLastReceivedTimeRange} from \"./utils\";\nimport {FromTo} from \"../FromToFilter/utils\";\n\nexport interface Props {\n narrow: Narrow;\n onNarrowChange: (narrow: any) => void;\n onPageChange: (page: number) => void;\n}\n\nconst BackOfficeFiltersMenu: React.FC<Props> = ({narrow, onNarrowChange, onPageChange}) => {\n const [filters, setFilters] = useState<any>(getBackOfficeFilters());\n const [disableFilters, setDisableFilters] = useState<boolean>(false);\n let timer: string | number | NodeJS.Timeout | undefined;\n const onFilterChange = (facetid: string, value: string, updateSingleNarrow?: boolean, fromDate?: string, toDate?: string) => {\n setDisableFilters(true)\n clearTimeout(timer);\n\n if (facetid === 'merch_lrt') {\n let merch_ltr_value = getLastReceivedTimeRange(value, fromDate??'', toDate??'');\n value = merch_ltr_value ?? '';\n timer = setTimeout(() => {\n let newNarrow: Narrow | undefined = undefined;\n narrow?.['merch_lrt']?.values?.() ? Array.from(narrow?.['merch_lrt']?.values?.())?.forEach?.((filterValue) => {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetid, filterValue)\n }\n ) : null;\n if(value) {\n newNarrow = NarrowParser.updateSingleNarrow(newNarrow ?? narrow, facetid, value)\n }\n if (newNarrow) {\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n }\n disableMenuDelay()\n }, 750);\n return;\n }\n timer = setTimeout(() => {\n let newNarrow = NarrowParser.updateNarrow(narrow, facetid, value);\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n disableMenuDelay()\n }, 750);\n }\n const onFromToFilterChange = (facetid: string, value: string) => {\n setDisableFilters(true)\n clearTimeout(timer);\n\n timer = setTimeout(() => {\n let newNarrow: Narrow = {};\n if (!value) {\n newNarrow = Object.fromEntries(\n Object.entries(narrow).filter(([key, value]) => key !== facetid)\n );\n } else {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetid, value);\n }\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n disableMenuDelay()\n }, 750);\n }\n\n const disableMenuDelay = () => {\n const timerId = setTimeout(() => {\n setDisableFilters(false);\n }, 750);\n return () => clearTimeout(timerId);\n }\n\n const clearAll = () => {\n onNarrowChange({});\n onPageChange(1);\n setFilters(getBackOfficeFilters());\n }\n\n return (\n <div className={classes.filtersContainer} style={{ opacity: disableFilters ? 0.5 : 1, pointerEvents: disableFilters ? 'none' : 'auto' }}>\n <div className={classes.headerContainer}>\n <h2 className={classes.title}>Inventory & Sales Filters</h2>\n <div className={classes.clearAllButton} onClick={clearAll}>\n <span className={`ph ph-eraser`} style={{fontSize: '20px'}}/>\n <span className={classes.clearAllText}>Clear all</span>\n </div>\n </div>\n <div className={classes.sideMenuContainer}>\n <FacetItem key={\"fs-filters\"+(filters?.[\"filter\"] as Facet)?.id.toString()}\n narrow={narrow[((filters?.[\"filter\"] as Facet)?.meta && narrow[((filters?.[\"filter\"] as Facet)?.name + \"_from_to\")]) ? ((filters?.[\"filter\"] as Facet)?.name + \"_from_to\") : (filters?.[\"filter\"] as Facet)?.id]}\n facet={(filters?.[\"filter\"] as Facet)} onChange={onFilterChange} onNarrowChange={onNarrowChange} onPageChange={onNarrowChange}\n type={FacetsTypes.multiSelect} tooltipText={getBackOfficeFilterTooltipText[\"filter\"]}\n disableSelect={disableFilters}></FacetItem>\n </div>\n <div className={classes.sideMenuContainer}>\n <FacetItem key={\"fs-filters\"+(filters?.[\"lastReceivedDate\"] as Facet)?.id.toString()}\n narrow={narrow[((filters?.[\"lastReceivedDate\"] as Facet)?.meta && narrow[((filters?.[\"lastReceivedDate\"] as Facet)?.name + \"_from_to\")]) ? ((filters?.[\"lastReceivedDate\"] as Facet)?.name + \"_from_to\") : (filters?.[\"lastReceivedDate\"] as Facet)?.id]}\n facet={(filters?.[\"lastReceivedDate\"] as Facet)} onChange={onFilterChange} onNarrowChange={onNarrowChange} onPageChange={onNarrowChange}\n type={FacetsTypes.RadioSelect} tooltipText={getBackOfficeFilterTooltipText[\"lastReceivedDate\"]}\n disableSelect={disableFilters}></FacetItem>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"stockAvailability\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"stockAvailability\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"variantsInStock\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"variantsInStock\"]} limit={{min: 0, max:100}}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"sales\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"sales\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"weeksOfStock\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"weeksOfStock\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"margin\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"margin\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"marginPercent\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"marginPercent\"]} limit={{min: 0, max:100}}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"merchCreationDate\"] as FromTo)}\n convertValueCallback={(value) => {return Number(value) > 0? (Number(value) / 1000)?.toString() : value}}\n onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"merchCreationDate\"]}></FromToFilter>\n </div>\n </div>\n )\n};\n\nexport default BackOfficeFiltersMenu;"]}
1
+ {"version":3,"file":"BackOfficeFiltersMenu.js","sourceRoot":"","sources":["../../../src/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {useState} from 'react';\nimport classes from './styles.module.css';\nimport {FacetItem} from \"../FacetItem/FacetItem\";\nimport {\n Facet,\n NarrowParser,\n FacetsTypes,\n Narrow,\n} from \"@fast-simon/utilities\";\nimport {FromToFilter} from \"../FromToFilter/FromToFilter\";\nimport {getBackOfficeFilters, getBackOfficeFilterTooltipText, getLastReceivedTimeRange} from \"./utils\";\nimport {FromTo} from \"../FromToFilter/utils\";\nimport classNames from \"classnames\";\n\nexport interface Props {\n narrow: Narrow;\n onNarrowChange: (narrow: any) => void;\n onPageChange: (page: number) => void;\n}\n\nconst BackOfficeFiltersMenu: React.FC<Props> = ({narrow, onNarrowChange, onPageChange}) => {\n const [filters, setFilters] = useState<any>(getBackOfficeFilters());\n const [disableFilters, setDisableFilters] = useState<boolean>(false);\n let timer: string | number | NodeJS.Timeout | undefined;\n const onFilterChange = (facetid: string, value: string, updateSingleNarrow?: boolean, fromDate?: string, toDate?: string) => {\n setDisableFilters(true)\n clearTimeout(timer);\n\n if (facetid === 'merch_lrt') {\n let merch_ltr_value = getLastReceivedTimeRange(value, fromDate??'', toDate??'');\n value = merch_ltr_value ?? '';\n timer = setTimeout(() => {\n let newNarrow: Narrow | undefined = undefined;\n narrow?.['merch_lrt']?.values?.() ? Array.from(narrow?.['merch_lrt']?.values?.())?.forEach?.((filterValue) => {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetid, filterValue)\n }\n ) : null;\n if(value) {\n newNarrow = NarrowParser.updateSingleNarrow(newNarrow ?? narrow, facetid, value)\n }\n if (newNarrow) {\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n }\n disableMenuDelay()\n }, 750);\n return;\n }\n timer = setTimeout(() => {\n let newNarrow = NarrowParser.updateNarrow(narrow, facetid, value);\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n disableMenuDelay()\n }, 750);\n }\n const onFromToFilterChange = (facetid: string, value: string) => {\n setDisableFilters(true)\n clearTimeout(timer);\n\n timer = setTimeout(() => {\n let newNarrow: Narrow = {};\n if (!value) {\n newNarrow = Object.fromEntries(\n Object.entries(narrow).filter(([key, value]) => key !== facetid)\n );\n } else {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetid, value);\n }\n onNarrowChange(newNarrow as any);\n onPageChange(1);\n disableMenuDelay()\n }, 750);\n }\n\n const disableMenuDelay = () => {\n const timerId = setTimeout(() => {\n setDisableFilters(false);\n }, 750);\n return () => clearTimeout(timerId);\n }\n\n const clearAll = () => {\n onNarrowChange({});\n onPageChange(1);\n setFilters(getBackOfficeFilters());\n }\n\n return (\n <div className={classes.filtersContainer} style={{ opacity: disableFilters ? 0.5 : 1, pointerEvents: disableFilters ? 'none' : 'auto' }}>\n <div className={classes.sideMenuContainer}>\n <FacetItem key={\"fs-filters\"+(filters?.[\"filter\"] as Facet)?.id.toString()}\n narrow={narrow[((filters?.[\"filter\"] as Facet)?.meta && narrow[((filters?.[\"filter\"] as Facet)?.name + \"_from_to\")]) ? ((filters?.[\"filter\"] as Facet)?.name + \"_from_to\") : (filters?.[\"filter\"] as Facet)?.id]}\n facet={(filters?.[\"filter\"] as Facet)} onChange={onFilterChange} onNarrowChange={onNarrowChange} onPageChange={onNarrowChange}\n type={FacetsTypes.multiSelect} tooltipText={getBackOfficeFilterTooltipText[\"filter\"]}\n disableSelect={disableFilters}></FacetItem>\n </div>\n <div className={classes.sideMenuContainer}>\n <FacetItem key={\"fs-filters\"+(filters?.[\"lastReceivedDate\"] as Facet)?.id.toString()}\n narrow={narrow[((filters?.[\"lastReceivedDate\"] as Facet)?.meta && narrow[((filters?.[\"lastReceivedDate\"] as Facet)?.name + \"_from_to\")]) ? ((filters?.[\"lastReceivedDate\"] as Facet)?.name + \"_from_to\") : (filters?.[\"lastReceivedDate\"] as Facet)?.id]}\n facet={(filters?.[\"lastReceivedDate\"] as Facet)} onChange={onFilterChange} onNarrowChange={onNarrowChange} onPageChange={onNarrowChange}\n type={FacetsTypes.RadioSelect} tooltipText={getBackOfficeFilterTooltipText[\"lastReceivedDate\"]}\n disableSelect={disableFilters}></FacetItem>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"stockAvailability\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"stockAvailability\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"variantsInStock\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"variantsInStock\"]} limit={{min: 0, max:100}}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"sales\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"sales\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"weeksOfStock\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"weeksOfStock\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"margin\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"margin\"]}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"marginPercent\"] as FromTo)} onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"marginPercent\"]} limit={{min: 0, max:100}}></FromToFilter>\n </div>\n <div className={classes.sideMenuContainer}>\n <FromToFilter facet={(filters?.[\"merchCreationDate\"] as FromTo)}\n convertValueCallback={(value) => {return Number(value) > 0? (Number(value) / 1000)?.toString() : value}}\n onChange={onFromToFilterChange}\n tooltipText={getBackOfficeFilterTooltipText[\"merchCreationDate\"]}></FromToFilter>\n </div>\n <span onClick={clearAll}className={classNames(classes.arrow, classes.clearAll)}><small>Clear All&nbsp;&nbsp;&nbsp;<i/></small>\n </span>\n </div>\n )\n};\n\nexport default BackOfficeFiltersMenu;\n"]}
package/dist/components/BackOfficeFiltersMenu/styles.module.css CHANGED
@@ -1,50 +1,10 @@
1
1
  .filtersContainer {
2
- padding: 0;
3
- font-size: 12px;
2
+ padding: 8px 16px;
3
+ font-size: 12px;
4
4
  }
5
-
6
- .headerContainer {
7
- display: flex;
8
- justify-content: space-between;
9
- align-items: center;
10
- padding: 16px 24px;
11
- background-color: #f9fafb;
12
- }
13
-
14
- .title {
15
- font-family: Assistant;
16
- font-size: 18px;
17
- font-weight: bold;
18
- color: #222635;
19
- margin: 0;
20
- }
21
-
22
- .clearAllButton {
23
- display: flex;
24
- flex-direction: row;
25
- justify-content: center;
26
- align-items: center;
27
- gap: 4px;
28
- padding: 8px 10px;
29
- border-radius: 6px;
30
- border: solid 1px #dddfe4;
31
- background-color: #fff;
5
+ .clearAll {
6
+ color: var(--blue);
7
+ text-decoration: none;
32
8
  cursor: pointer;
33
- transition: background-color 150ms ease-in-out;
34
- }
35
-
36
- .clearAllButton:hover {
37
- background-color: #f5f7fa;
38
- }
39
-
40
- .clearAllText {
41
- font-family: Assistant;
42
- font-size: 14px;
43
- font-weight: normal;
44
- font-stretch: normal;
45
- font-style: normal;
46
- line-height: normal;
47
- letter-spacing: normal;
48
- text-align: center;
49
- color: #33394f;
9
+ font-size: 1.2rem;
50
10
  }
package/dist/components/CheckboxFilter/Checkbox/styles.module.css CHANGED
@@ -22,6 +22,35 @@
22
22
  width: 0;
23
23
  }
24
24
 
25
+ .checkmark {
26
+ min-height: 16px;
27
+ min-width: 16px;
28
+ background-color: #eee;
29
+ margin-right: 10px;
30
+ }
31
+
32
+ .fsCheckbox:hover input ~ .checkmark {
33
+ background-color: #d00202cf;
34
+ }
35
+
36
+ .fsCheckbox input:checked ~ .checkmark {
37
+ background-color: white;
38
+ }
39
+
40
+ .fsCheckbox input:checked ~ .checkmark:after {
41
+ display: block;
42
+ }
43
+
44
+ .fsCheckboxx .checkmark:after {
45
+ left: 5px;
46
+ width: 4px;
47
+ height: 9px;
48
+ border: solid white;
49
+ border-width: 0 2px 2px 0;
50
+ -webkit-transform: rotate(45deg);
51
+ -ms-transform: rotate(45deg);
52
+ transform: rotate(45deg);
53
+ }
25
54
  .fsSelectedCheckboxTrue{}
26
55
  .fsSelectedCheckboxFalse{}
27
56
 
@@ -40,6 +69,9 @@
40
69
  .checkbox {
41
70
  display: flex;
42
71
  position: relative;
72
+ padding: 0 5px 0 0;
73
+ margin-top: 5px;
74
+ margin-bottom: 5px;
43
75
  cursor: pointer;
44
76
  -webkit-user-select: none;
45
77
  -moz-user-select: none;
@@ -72,13 +104,10 @@
72
104
  }
73
105
 
74
106
  .checkmark {
75
- min-height: 13px;
76
- min-width: 13px;
77
- border: #717788 2px solid;
78
- background-color: unset;
79
- border-radius: 4px;
107
+ min-height: 16px;
108
+ min-width: 16px;
109
+ background-color: #eee;
80
110
  margin-right: 10px;
81
- position: relative;
82
111
  }
83
112
 
84
113
  .checkbox:hover input ~ .checkmark {
@@ -86,10 +115,7 @@
86
115
  }
87
116
 
88
117
  .checkbox input:checked ~ .checkmark {
89
- background-color: #4374f2;
90
- border: none;
91
- min-height: 17px;
92
- min-width: 17px;
118
+ background-color: #000000;
93
119
  }
94
120
 
95
121
  .checkmark:after {
@@ -103,10 +129,9 @@
103
129
  }
104
130
 
105
131
  .checkbox .checkmark:after {
106
- left: 6px;
107
- width: 3px;
108
- height: 8px;
109
- top: 2px;
132
+ left: 5px;
133
+ width: 4px;
134
+ height: 9px;
110
135
  border: solid white;
111
136
  border-width: 0 2px 2px 0;
112
137
  -webkit-transform: rotate(45deg);
@@ -115,4 +140,4 @@
115
140
  }
116
141
  :global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
117
142
  display: none;
118
- }
143
+ }
package/dist/components/FacetItem/styles.module.css CHANGED
@@ -8,13 +8,13 @@
8
8
  -webkit-font-smoothing: antialiased;
9
9
  -moz-osx-font-smoothing: grayscale;
10
10
  letter-spacing: .2px;
11
- background-color: #f9fafb;
11
+ background-color: #fff0;
12
12
  border: none;
13
- width: calc(100% - 48px);
13
+ width: 100%;
14
14
  text-align: left;
15
- padding: 12px 24px;
15
+ padding: 8px 0;
16
16
  position: relative;
17
- border-radius: 0;
17
+ border-radius: 8px;
18
18
  transition: background-color .2s ease-out;
19
19
  cursor: pointer;
20
20
  color: #000;
@@ -23,8 +23,6 @@
23
23
  display: flex;
24
24
  gap: 10px;
25
25
  align-items: center;
26
- border-top: solid 1px #dddfe4;
27
- border-bottom: solid 1px #dddfe4;
28
26
  }
29
27
 
30
28
  .fsFacetContainer {
package/dist/components/FromToFilter/From/styles.module.css CHANGED
@@ -1,28 +1,9 @@
1
1
  .from {
2
- flex: 1;
3
- display: flex;
4
- }
5
-
6
- .from > div:first-child {
7
- width: 100%;
8
- display: flex;
9
- align-self: stretch;
10
- flex-grow: 0;
11
- flex-direction: row;
12
- justify-content: flex-start;
13
- align-items: stretch;
14
- gap: 4px;
15
- border-radius: 6px;
16
- border: solid 1px #dddfe4;
2
+ float: left;
3
+ width: calc(50% - 20px);
4
+ padding: 0 10px;
17
5
  }
18
6
 
19
7
  .from > div > input {
20
- width: 100%;
21
- border: none;
22
- padding: 8px 12px;
23
- outline: none;
24
- background: transparent;
25
- font-family: Assistant;
26
- font-size: 14px;
27
- color: #33394f;
28
- }
8
+ max-width: 100%;
9
+ }
package/dist/components/FromToFilter/To/styles.module.css CHANGED
@@ -1,28 +1,9 @@
1
1
  .to {
2
- flex: 1;
3
- display: flex;
2
+ float: left;
3
+ width: calc(50% - 20px);
4
+ padding: 0 10px;
4
5
  }
5
6
 
6
- .to > div {
7
- width: 100%;
8
- display: flex;
9
- align-self: stretch;
10
- flex-grow: 0;
11
- flex-direction: row;
12
- justify-content: flex-start;
13
- align-items: stretch;
14
- gap: 4px;
15
- border-radius: 6px;
16
- border: solid 1px #dddfe4;
17
- }
18
-
19
- .to > div > input {
20
- width: 100%;
21
- border: none;
22
- outline: none;
23
- padding: 8px 12px;
24
- background: transparent;
25
- font-family: Assistant;
26
- font-size: 14px;
27
- color: #33394f;
28
- }
7
+ .to > div > input {
8
+ max-width: 100%;
9
+ }
package/dist/components/FromToFilter/styles.module.css CHANGED
@@ -2,12 +2,13 @@
2
2
  -webkit-font-smoothing: antialiased;
3
3
  -moz-osx-font-smoothing: grayscale;
4
4
  letter-spacing: .2px;
5
- background-color: #f9fafb;
5
+ background-color: #fff0;
6
6
  border: none;
7
- width: calc(100% - 48px);
7
+ width: 100%;
8
8
  text-align: left;
9
- padding: 12px 24px;
9
+ padding: 8px 0;
10
10
  position: relative;
11
+ border-radius: 8px;
11
12
  transition: background-color .2s ease-out;
12
13
  cursor: pointer;
13
14
  color: #000;
@@ -16,43 +17,18 @@
16
17
  display: flex;
17
18
  gap: 10px;
18
19
  align-items: center;
19
- border-radius: 0;
20
- border-top: solid 1px #dddfe4;
21
- border-bottom: solid 1px #dddfe4;
22
- }
23
-
24
- .fromToContainer {
25
- display: flex;
26
- flex-direction: column;
27
20
  }
28
21
 
29
22
  .fsFacetContainer {
30
23
  display: flex;
31
24
  flex-direction: column;
32
25
  }
33
-
34
26
  .fsFacetOptions {
35
- display: flex;
36
- flex-direction: row;
37
- padding: 16px 24px;
38
- gap: 12px;
39
- align-items: center;
27
+ width: 100%;
28
+ margin: 0 -5px;
40
29
  }
41
-
42
30
  .fsFacetOptions:after {
43
- content: "";
44
- display: table;
45
- clear: both;
46
- }
47
-
48
- .toText {
49
- font-family: Assistant;
50
- font-size: 14px;
51
- font-weight: normal;
52
- font-stretch: normal;
53
- font-style: normal;
54
- line-height: normal;
55
- letter-spacing: normal;
56
- text-align: left;
57
- color: #717788;
58
- }
31
+ content: "";
32
+ display: table;
33
+ clear: both;
34
+ }
package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js CHANGED
@@ -3,6 +3,7 @@ import React, { useEffect } from 'react';
3
3
  import classes from './styles.module.css';
4
4
  import { FacetItem } from "../FacetItem/FacetItem";
5
5
  import { NarrowParser } from "@fast-simon/utilities";
6
+ import classNames from "classnames";
6
7
  const InStoreFiltersMenu = ({ facets, narrow, onNarrowChange, onPageChange }) => {
7
8
  const filtersRef = React.createRef();
8
9
  useEffect(() => {
@@ -25,9 +26,9 @@ const InStoreFiltersMenu = ({ facets, narrow, onNarrowChange, onPageChange }) =>
25
26
  onNarrowChange({});
26
27
  onPageChange(1);
27
28
  };
28
- return (_jsxs("div", Object.assign({ className: classes.filtersContainer, ref: filtersRef }, { children: [_jsxs("div", Object.assign({ className: classes.headerContainer }, { children: [_jsx("h2", Object.assign({ className: classes.title }, { children: "In Store Filters" })), _jsxs("div", Object.assign({ className: classes.clearAllButton, onClick: clearAll }, { children: [_jsx("span", { className: `ph ph-eraser`, style: { fontSize: '20px' } }), _jsx("span", Object.assign({ className: classes.clearAllText }, { children: "Clear all" }))] }))] })), facets.map(facet => {
29
+ return (_jsxs("div", Object.assign({ className: classes.filtersContainer, ref: filtersRef }, { children: [facets.map(facet => {
29
30
  return (_jsx(FacetItem, { narrow: narrow[((facet === null || facet === void 0 ? void 0 : facet.meta) && narrow[((facet === null || facet === void 0 ? void 0 : facet.name) + "_from_to")]) ? ((facet === null || facet === void 0 ? void 0 : facet.name) + "_from_to") : facet === null || facet === void 0 ? void 0 : facet.name], facet: facet, onChange: handleNarrowChange, onNarrowChange: onNarrowChange, onPageChange: onPageChange }, "fs-filters" + facet.id.toString()));
30
- })] })));
31
+ }), _jsx("span", Object.assign({ onClick: clearAll, className: classNames(classes.arrow, classes.clearAll) }, { children: _jsxs("small", { children: ["Clear All\u00A0\u00A0\u00A0", _jsx("i", {})] }) }))] })));
31
32
  };
32
33
  export default InStoreFiltersMenu;
33
34
  //# sourceMappingURL=InStoreFiltersMenu.js.map
package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"InStoreFiltersMenu.js","sourceRoot":"","sources":["../../../src/components/InStoreFiltersMenu/InStoreFiltersMenu.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,OAAO,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAiB,MAAM,uBAAuB,CAAC;AASpE,MAAM,kBAAkB,GAAoB,CAAC,EAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,YAAY,EAAC,EAAE,EAAE;IAC3F,MAAM,UAAU,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACX,IAAG,UAAU,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE;YACvD,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,gBAAgB,UAAU,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,GAAC,EAAE,KAAK,CAAC;SAC5G;IACL,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAE,UAAkB,EAAE,kBAA4B,EAAE,EAAE;QAC/F,IAAI,SAAS,GAAW,EAAE,CAAC;QAC3B,IAAG,kBAAkB,EAAE;YAClB,SAAS,GAAG,YAAY,CAAC,kBAAkB,CAAC,MAAM,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;SAC/E;aAAM;YACF,SAAS,GAAG,YAAY,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;SACzE;QACD,cAAc,CAAC,SAAS,CAAC,CAAC;QAC1B,YAAY,CAAC,CAAC,CAAC,CAAC;IACpB,CAAC,CAAA;IACD,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,cAAc,CAAC,EAAE,CAAC,CAAC;QACnB,YAAY,CAAC,CAAC,CAAC,CAAC;IACpB,CAAC,CAAA;IAED,OAAO,CACH,6BAAK,SAAS,EAAE,OAAO,CAAC,gBAAgB,EAAE,GAAG,EAAE,UAAU,iBACrD,6BAAK,SAAS,EAAE,OAAO,CAAC,eAAe,iBACnC,2BAAI,SAAS,EAAE,OAAO,CAAC,KAAK,sCAAuB,EACnD,6BAAK,SAAS,EAAE,OAAO,CAAC,cAAc,EAAE,OAAO,EAAE,QAAQ,iBACrD,eAAM,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,EAAC,QAAQ,EAAE,MAAM,EAAC,GAAG,EAC7D,6BAAM,SAAS,EAAE,OAAO,CAAC,YAAY,+BAAkB,KACrD,KACJ,EAEF,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACf,OAAO,CACJ,KAAC,SAAS,IACC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,KAAI,MAAM,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,IAAG,UAAU,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,IAAG,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAC,EAC/G,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,kBAAkB,EAC5B,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IALrB,YAAY,GAAC,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,CAKG,CACrD,CAAA;YACL,CAAC,CAAC,KAEJ,CACT,CAAA;AACL,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React, {useEffect} from 'react';\nimport classes from './styles.module.css';\nimport {FacetItem} from \"../FacetItem/FacetItem\";\nimport { NarrowParser, Narrow, Facet } from \"@fast-simon/utilities\";\n\nexport interface Props {\n facets: Facet[];\n narrow: Narrow;\n onNarrowChange: (narrow: any) => void;\n onPageChange: (page: number) => void;\n}\n\nconst InStoreFiltersMenu: React.FC<Props> = ({facets, narrow, onNarrowChange, onPageChange}) => {\n const filtersRef = React.createRef<HTMLDivElement>();\n\n useEffect(() => {\n if(filtersRef.current && !filtersRef.current.style.height) {\n filtersRef.current.style.height = `calc(100vh - ${filtersRef.current.getBoundingClientRect().top+20}px)`;\n }\n }, [filtersRef]);\n\n const handleNarrowChange = (facetName: string, narrowName: string, updateSingleNarrow?: boolean) => {\n let newNarrow: Narrow = {};\n if(updateSingleNarrow) {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetName, narrowName);\n } else {\n newNarrow = NarrowParser.updateNarrow(narrow, facetName, narrowName);\n }\n onNarrowChange(newNarrow);\n onPageChange(1);\n }\n const clearAll = () => {\n onNarrowChange({});\n onPageChange(1);\n }\n\n return (\n <div className={classes.filtersContainer} ref={filtersRef}>\n <div className={classes.headerContainer}>\n <h2 className={classes.title}>In Store Filters</h2>\n <div className={classes.clearAllButton} onClick={clearAll}>\n <span className={`ph ph-eraser`} style={{fontSize: '20px'}}/>\n <span className={classes.clearAllText}>Clear all</span>\n </div>\n </div>\n {\n facets.map(facet => {\n return (\n <FacetItem key={\"fs-filters\"+facet.id.toString()}\n narrow={narrow[(facet?.meta && narrow[(facet?.name + \"_from_to\")]) ? (facet?.name + \"_from_to\") : facet?.name]}\n facet={facet}\n onChange={handleNarrowChange}\n onNarrowChange={onNarrowChange}\n onPageChange={onPageChange}></FacetItem>\n )\n })\n }\n </div>\n )\n};\n\nexport default InStoreFiltersMenu;"]}
1
+ {"version":3,"file":"InStoreFiltersMenu.js","sourceRoot":"","sources":["../../../src/components/InStoreFiltersMenu/InStoreFiltersMenu.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACvC,OAAO,OAAO,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAiB,MAAM,uBAAuB,CAAC;AACpE,OAAO,UAAU,MAAM,YAAY,CAAC;AASpC,MAAM,kBAAkB,GAAoB,CAAC,EAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,YAAY,EAAC,EAAE,EAAE;IAC3F,MAAM,UAAU,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACX,IAAG,UAAU,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE;YACvD,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,gBAAgB,UAAU,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,GAAC,EAAE,KAAK,CAAC;SAC5G;IACL,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAE,UAAkB,EAAE,kBAA4B,EAAE,EAAE;QAC/F,IAAI,SAAS,GAAW,EAAE,CAAC;QAC3B,IAAG,kBAAkB,EAAE;YAClB,SAAS,GAAG,YAAY,CAAC,kBAAkB,CAAC,MAAM,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;SAC/E;aAAM;YACF,SAAS,GAAG,YAAY,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;SACzE;QACD,cAAc,CAAC,SAAS,CAAC,CAAC;QAC1B,YAAY,CAAC,CAAC,CAAC,CAAC;IACpB,CAAC,CAAA;IACD,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,cAAc,CAAC,EAAE,CAAC,CAAC;QACnB,YAAY,CAAC,CAAC,CAAC,CAAC;IACpB,CAAC,CAAA;IAED,OAAO,CACH,6BAAK,SAAS,EAAE,OAAO,CAAC,gBAAgB,EAAE,GAAG,EAAE,UAAU,iBAGjD,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACf,OAAO,CACJ,KAAC,SAAS,IACC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,KAAI,MAAM,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,IAAG,UAAU,CAAC,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,IAAG,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAC,EAC/G,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,kBAAkB,EAC5B,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IALrB,YAAY,GAAC,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,CAKG,CACrD,CAAA;YACL,CAAC,CAAC,EAEN,6BAAM,OAAO,EAAE,QAAQ,EAAC,SAAS,EAAE,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC,gBAAE,2DAAkC,aAAI,IAAQ,IACvH,KACL,CACT,CAAA;AACL,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React, {useEffect} from 'react';\nimport classes from './styles.module.css';\nimport {FacetItem} from \"../FacetItem/FacetItem\";\nimport { NarrowParser, Narrow, Facet } from \"@fast-simon/utilities\";\nimport classNames from \"classnames\";\n\nexport interface Props {\n facets: Facet[];\n narrow: Narrow;\n onNarrowChange: (narrow: any) => void;\n onPageChange: (page: number) => void;\n}\n\nconst InStoreFiltersMenu: React.FC<Props> = ({facets, narrow, onNarrowChange, onPageChange}) => {\n const filtersRef = React.createRef<HTMLDivElement>();\n\n useEffect(() => {\n if(filtersRef.current && !filtersRef.current.style.height) {\n filtersRef.current.style.height = `calc(100vh - ${filtersRef.current.getBoundingClientRect().top+20}px)`;\n }\n }, [filtersRef]);\n\n const handleNarrowChange = (facetName: string, narrowName: string, updateSingleNarrow?: boolean) => {\n let newNarrow: Narrow = {};\n if(updateSingleNarrow) {\n newNarrow = NarrowParser.updateSingleNarrow(narrow, facetName, narrowName);\n } else {\n newNarrow = NarrowParser.updateNarrow(narrow, facetName, narrowName);\n }\n onNarrowChange(newNarrow);\n onPageChange(1);\n }\n const clearAll = () => {\n onNarrowChange({});\n onPageChange(1);\n }\n\n return (\n <div className={classes.filtersContainer} ref={filtersRef}>\n\n {\n facets.map(facet => {\n return (\n <FacetItem key={\"fs-filters\"+facet.id.toString()} \n narrow={narrow[(facet?.meta && narrow[(facet?.name + \"_from_to\")]) ? (facet?.name + \"_from_to\") : facet?.name]} \n facet={facet} \n onChange={handleNarrowChange} \n onNarrowChange={onNarrowChange} \n onPageChange={onPageChange}></FacetItem>\n )\n })\n }\n <span onClick={clearAll}className={classNames(classes.arrow, classes.clearAll)}><small>Clear All&nbsp;&nbsp;&nbsp;<i/></small>\n </span>\n </div>\n )\n};\n\nexport default InStoreFiltersMenu;\n"]}
package/dist/components/InStoreFiltersMenu/styles.module.css CHANGED
@@ -1,50 +1,10 @@
1
1
  .filtersContainer {
2
- padding: 0 !important;
3
- font-size: 12px;
2
+ padding: 8px 16px;
3
+ font-size: 12px;
4
4
  }
5
-
6
- .headerContainer {
7
- display: flex;
8
- justify-content: space-between;
9
- align-items: center;
10
- padding: 16px 24px;
11
- background-color: #f9fafb;
12
- }
13
-
14
- .title {
15
- font-family: Assistant;
16
- font-size: 18px;
17
- font-weight: bold;
18
- color: #222635;
19
- margin: 0;
20
- }
21
-
22
- .clearAllButton {
23
- display: flex;
24
- flex-direction: row;
25
- justify-content: center;
26
- align-items: center;
27
- gap: 4px;
28
- padding: 8px 10px;
29
- border-radius: 6px;
30
- border: solid 1px #dddfe4;
31
- background-color: #fff;
5
+ .clearAll {
6
+ color: var(--blue);
7
+ text-decoration: none;
32
8
  cursor: pointer;
33
- transition: background-color 150ms ease-in-out;
34
- }
35
-
36
- .clearAllButton:hover {
37
- background-color: #f5f7fa;
38
- }
39
-
40
- .clearAllText {
41
- font-family: Assistant;
42
- font-size: 14px;
43
- font-weight: normal;
44
- font-stretch: normal;
45
- font-style: normal;
46
- line-height: normal;
47
- letter-spacing: normal;
48
- text-align: center;
49
- color: #33394f;
9
+ font-size: 1.2rem;
50
10
  }
package/dist/components/LastReceivedDateFilter/styles.module.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .fsOptions {
2
- padding: 12px 24px;
2
+ padding: 0 0 8px 8px;
3
3
  }
4
4
  .showMore {
5
5
  color: #737373;
@@ -21,31 +21,21 @@
21
21
  -webkit-transform: rotate(45deg);
22
22
  margin-bottom: 2px;
23
23
  }
24
-
25
24
  .fsFacetContainer {
26
25
  display: flex;
27
26
  flex-direction: row;
28
- gap: 12px;
29
- padding: 8px 0 4px;
30
- align-items: center;
27
+ padding: 0pc 2px;
28
+ width: calc(100% - 4px);
31
29
  }
32
-
33
30
  .fsFacetOptions {
34
- flex: 1;
35
- display: flex;
36
- flex-direction: row;
37
- justify-content: flex-start;
38
- align-items: stretch;
39
- border-radius: 6px;
40
- border: solid 1px #dddfe4;
31
+ width: calc(50% - 12px);
32
+ padding: 0px 6px;
41
33
  }
42
-
43
34
  .fsFacetOptions:after {
44
- content: "";
45
- display: table;
46
- clear: both;
47
- }
48
-
49
- .fsFacetOptions > .react-datepicker-wrapper {
50
- width: 100%;
35
+ content: "";
36
+ display: table;
37
+ clear: both;
51
38
  }
39
+ .fsFacetOptions>.react-datepicker-wrapper {
40
+ width: calc(100% - 6px)!important;
41
+ }
package/dist/components/RadioFilter/Radio/styles.module.css CHANGED
@@ -1,31 +1,56 @@
1
1
  .fsCheckbox {
2
2
  display: flex;
3
3
  position: relative;
4
- padding: 8px 0;
4
+ padding: 0 5px 0 0;
5
+ margin-top: 5px;
6
+ margin-bottom: 5px;
5
7
  cursor: pointer;
6
8
  -webkit-user-select: none;
7
9
  -moz-user-select: none;
8
10
  -ms-user-select: none;
9
11
  user-select: none;
10
- font-family: Assistant, sans-serif;
12
+ font-family: Arial, serif;
13
+ animation: growDown 300ms ease forwards;
11
14
  align-items: center;
12
- gap: 8px;
13
15
  }
14
16
 
15
17
  .fsCheckbox input {
16
- position: relative !important;
17
- opacity: 1 !important;
18
+ position: fixed;
19
+ opacity: 0;
18
20
  cursor: pointer;
19
- width: 16px !important;
20
- height: 16px !important;
21
- margin: 0;
22
- accent-color: #4374f2;
21
+ height: 0;
22
+ width: 0;
23
23
  }
24
24
 
25
25
  .checkmark {
26
- display: none;
26
+ min-height: 16px;
27
+ min-width: 16px;
28
+ background-color: #eee;
29
+ margin-right: 10px;
27
30
  }
28
31
 
32
+ .fsCheckbox:hover input ~ .checkmark {
33
+ background-color: #d00202cf;
34
+ }
35
+
36
+ .fsCheckbox input:checked ~ .checkmark {
37
+ background-color: white;
38
+ }
39
+
40
+ .fsCheckbox input:checked ~ .checkmark:after {
41
+ display: block;
42
+ }
43
+
44
+ .fsCheckboxx .checkmark:after {
45
+ left: 5px;
46
+ width: 4px;
47
+ height: 9px;
48
+ border: solid white;
49
+ border-width: 0 2px 2px 0;
50
+ -webkit-transform: rotate(45deg);
51
+ -ms-transform: rotate(45deg);
52
+ transform: rotate(45deg);
53
+ }
29
54
  .fsSelectedCheckboxTrue{}
30
55
  .fsSelectedCheckboxFalse{}
31
56
 
@@ -70,15 +95,6 @@
70
95
  overflow: hidden;
71
96
  }
72
97
 
73
- .fsCheckboxLabel {
74
- font-family: Assistant, sans-serif;
75
- font-size: 14px;
76
- font-weight: normal;
77
- color: #33394f;
78
- line-height: 20px;
79
- cursor: pointer;
80
- }
81
-
82
98
  .checkbox input {
83
99
  position: fixed;
84
100
  opacity: 0;
@@ -126,4 +142,4 @@
126
142
  }
127
143
  :global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
128
144
  display: none;
129
- }
145
+ }
package/dist/components/RadioFilter/styles.module.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .fsOptions {
2
- padding: 12px 24px;
2
+ padding: 0 0 8px 8px;
3
3
  }
4
4
  .showMore {
5
5
  color: #737373;
package/dist/components/ReactDatePicker/styles.module.css CHANGED
@@ -1,11 +1,3 @@
1
- .fullWidthInput {
1
+ .fullWidthInput{
2
2
  width: 100%;
3
- border: none;
4
- padding: 8px 12px;
5
- outline: none;
6
- background: transparent;
7
- font-family: Assistant;
8
- font-size: 14px;
9
- color: #33394f;
10
- border-radius: 6px;
11
- }
3
+ }
package/dist/components/SingleFilter/styles.module.css CHANGED
@@ -1,8 +1,8 @@
1
1
  .fsOptions {
2
- padding: 12px 0;
2
+ padding: 0 5px 8px 8px;
3
3
  }
4
4
  .showMore {
5
- color: #4374f2;
5
+ color: #737373;
6
6
  }
7
7
 
8
8
  .showMore:hover {
@@ -10,7 +10,7 @@
10
10
  }
11
11
 
12
12
  .arrow {
13
- border: solid #4374f2;
13
+ border: solid #636363;
14
14
  border-width: 0 1.5px 1.5px 0;
15
15
  display: inline-block;
16
16
  padding: 3px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fast-simon/dashboard-utilities",
3
- "version": "1.0.139-beta.4",
3
+ "version": "1.0.139-beta.6",
4
4
  "scripts": {
5
5
  "dev": "vite",
6
6
  "preview": "vite preview",