@fast-simon/dashboard-utilities 1.0.138-beta.4 → 1.0.138

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 +1 -2
  2. package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js.map +1 -1
  3. package/dist/components/BackOfficeFiltersMenu/styles.module.css +46 -6
  4. package/dist/components/CheckboxFilter/Checkbox/styles.module.css +15 -40
  5. package/dist/components/FacetItem/styles.module.css +6 -4
  6. package/dist/components/FromToFilter/From/styles.module.css +24 -5
  7. package/dist/components/FromToFilter/To/styles.module.css +25 -6
  8. package/dist/components/FromToFilter/styles.module.css +34 -10
  9. package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js +2 -3
  10. package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js.map +1 -1
  11. package/dist/components/InStoreFiltersMenu/styles.module.css +46 -6
  12. package/dist/components/LastReceivedDateFilter/styles.module.css +21 -11
  13. package/dist/components/RadioFilter/Radio/styles.module.css +20 -36
  14. package/dist/components/RadioFilter/styles.module.css +1 -1
  15. package/dist/components/ReactDatePicker/styles.module.css +10 -2
  16. package/dist/components/SingleFilter/styles.module.css +3 -3
  17. package/package.json +1 -1
package/dist/components/BackOfficeFiltersMenu/BackOfficeFiltersMenu.js CHANGED
@@ -5,7 +5,6 @@ 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";
9
8
  const BackOfficeFiltersMenu = ({ narrow, onNarrowChange, onPageChange }) => {
10
9
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
11
10
  const [filters, setFilters] = useState(getBackOfficeFilters());
@@ -68,7 +67,7 @@ const BackOfficeFiltersMenu = ({ narrow, onNarrowChange, onPageChange }) => {
68
67
  onPageChange(1);
69
68
  setFilters(getBackOfficeFilters());
70
69
  };
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", {})] }) }))] })));
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"] }) }))] })));
72
71
  };
73
72
  export default BackOfficeFiltersMenu;
74
73
  //# 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\";\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"]}
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;"]}
package/dist/components/BackOfficeFiltersMenu/styles.module.css CHANGED
@@ -1,10 +1,50 @@
1
1
  .filtersContainer {
2
- padding: 8px 16px;
3
- font-size: 12px;
2
+ padding: 0;
3
+ font-size: 12px;
4
4
  }
5
- .clearAll {
6
- color: var(--blue);
7
- text-decoration: none;
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;
8
32
  cursor: pointer;
9
- font-size: 1.2rem;
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;
10
50
  }
package/dist/components/CheckboxFilter/Checkbox/styles.module.css CHANGED
@@ -22,35 +22,6 @@
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
- }
54
25
  .fsSelectedCheckboxTrue{}
55
26
  .fsSelectedCheckboxFalse{}
56
27
 
@@ -69,9 +40,6 @@
69
40
  .checkbox {
70
41
  display: flex;
71
42
  position: relative;
72
- padding: 0 5px 0 0;
73
- margin-top: 5px;
74
- margin-bottom: 5px;
75
43
  cursor: pointer;
76
44
  -webkit-user-select: none;
77
45
  -moz-user-select: none;
@@ -104,10 +72,13 @@
104
72
  }
105
73
 
106
74
  .checkmark {
107
- min-height: 16px;
108
- min-width: 16px;
109
- background-color: #eee;
75
+ min-height: 13px;
76
+ min-width: 13px;
77
+ border: #717788 2px solid;
78
+ background-color: unset;
79
+ border-radius: 4px;
110
80
  margin-right: 10px;
81
+ position: relative;
111
82
  }
112
83
 
113
84
  .checkbox:hover input ~ .checkmark {
@@ -115,7 +86,10 @@
115
86
  }
116
87
 
117
88
  .checkbox input:checked ~ .checkmark {
118
- background-color: #000000;
89
+ background-color: #4374f2;
90
+ border: none;
91
+ min-height: 17px;
92
+ min-width: 17px;
119
93
  }
120
94
 
121
95
  .checkmark:after {
@@ -129,9 +103,10 @@
129
103
  }
130
104
 
131
105
  .checkbox .checkmark:after {
132
- left: 5px;
133
- width: 4px;
134
- height: 9px;
106
+ left: 6px;
107
+ width: 3px;
108
+ height: 8px;
109
+ top: 2px;
135
110
  border: solid white;
136
111
  border-width: 0 2px 2px 0;
137
112
  -webkit-transform: rotate(45deg);
@@ -140,4 +115,4 @@
140
115
  }
141
116
  :global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
142
117
  display: none;
143
- }
118
+ }
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: #fff0;
11
+ background-color: #f9fafb;
12
12
  border: none;
13
- width: 100%;
13
+ width: calc(100% - 48px);
14
14
  text-align: left;
15
- padding: 8px 0;
15
+ padding: 12px 24px;
16
16
  position: relative;
17
- border-radius: 8px;
17
+ border-radius: 0;
18
18
  transition: background-color .2s ease-out;
19
19
  cursor: pointer;
20
20
  color: #000;
@@ -23,6 +23,8 @@
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;
26
28
  }
27
29
 
28
30
  .fsFacetContainer {
package/dist/components/FromToFilter/From/styles.module.css CHANGED
@@ -1,9 +1,28 @@
1
1
  .from {
2
- float: left;
3
- width: calc(50% - 20px);
4
- padding: 0 10px;
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;
5
17
  }
6
18
 
7
19
  .from > div > input {
8
- max-width: 100%;
9
- }
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
+ }
package/dist/components/FromToFilter/To/styles.module.css CHANGED
@@ -1,9 +1,28 @@
1
1
  .to {
2
- float: left;
3
- width: calc(50% - 20px);
4
- padding: 0 10px;
2
+ flex: 1;
3
+ display: flex;
5
4
  }
6
5
 
7
- .to > div > input {
8
- max-width: 100%;
9
- }
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
+ }
package/dist/components/FromToFilter/styles.module.css CHANGED
@@ -2,13 +2,12 @@
2
2
  -webkit-font-smoothing: antialiased;
3
3
  -moz-osx-font-smoothing: grayscale;
4
4
  letter-spacing: .2px;
5
- background-color: #fff0;
5
+ background-color: #f9fafb;
6
6
  border: none;
7
- width: 100%;
7
+ width: calc(100% - 48px);
8
8
  text-align: left;
9
- padding: 8px 0;
9
+ padding: 12px 24px;
10
10
  position: relative;
11
- border-radius: 8px;
12
11
  transition: background-color .2s ease-out;
13
12
  cursor: pointer;
14
13
  color: #000;
@@ -17,18 +16,43 @@
17
16
  display: flex;
18
17
  gap: 10px;
19
18
  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;
20
27
  }
21
28
 
22
29
  .fsFacetContainer {
23
30
  display: flex;
24
31
  flex-direction: column;
25
32
  }
33
+
26
34
  .fsFacetOptions {
27
- width: 100%;
28
- margin: 0 -5px;
35
+ display: flex;
36
+ flex-direction: row;
37
+ padding: 16px 24px;
38
+ gap: 12px;
39
+ align-items: center;
29
40
  }
41
+
30
42
  .fsFacetOptions:after {
31
- content: "";
32
- display: table;
33
- clear: both;
34
- }
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
+ }
package/dist/components/InStoreFiltersMenu/InStoreFiltersMenu.js CHANGED
@@ -3,7 +3,6 @@ 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";
7
6
  const InStoreFiltersMenu = ({ facets, narrow, onNarrowChange, onPageChange }) => {
8
7
  const filtersRef = React.createRef();
9
8
  useEffect(() => {
@@ -26,9 +25,9 @@ const InStoreFiltersMenu = ({ facets, narrow, onNarrowChange, onPageChange }) =>
26
25
  onNarrowChange({});
27
26
  onPageChange(1);
28
27
  };
29
- return (_jsxs("div", Object.assign({ className: classes.filtersContainer, ref: filtersRef }, { children: [facets.map(facet => {
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 => {
30
29
  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()));
31
- }), _jsx("span", Object.assign({ onClick: clearAll, className: classNames(classes.arrow, classes.clearAll) }, { children: _jsxs("small", { children: ["Clear All\u00A0\u00A0\u00A0", _jsx("i", {})] }) }))] })));
30
+ })] })));
32
31
  };
33
32
  export default InStoreFiltersMenu;
34
33
  //# 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;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"]}
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;"]}
package/dist/components/InStoreFiltersMenu/styles.module.css CHANGED
@@ -1,10 +1,50 @@
1
1
  .filtersContainer {
2
- padding: 8px 16px;
3
- font-size: 12px;
2
+ padding: 0 !important;
3
+ font-size: 12px;
4
4
  }
5
- .clearAll {
6
- color: var(--blue);
7
- text-decoration: none;
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;
8
32
  cursor: pointer;
9
- font-size: 1.2rem;
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;
10
50
  }
package/dist/components/LastReceivedDateFilter/styles.module.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .fsOptions {
2
- padding: 0 0 8px 8px;
2
+ padding: 12px 24px;
3
3
  }
4
4
  .showMore {
5
5
  color: #737373;
@@ -21,21 +21,31 @@
21
21
  -webkit-transform: rotate(45deg);
22
22
  margin-bottom: 2px;
23
23
  }
24
+
24
25
  .fsFacetContainer {
25
26
  display: flex;
26
27
  flex-direction: row;
27
- padding: 0pc 2px;
28
- width: calc(100% - 4px);
28
+ gap: 12px;
29
+ padding: 8px 0 4px;
30
+ align-items: center;
29
31
  }
32
+
30
33
  .fsFacetOptions {
31
- width: calc(50% - 12px);
32
- padding: 0px 6px;
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;
33
41
  }
42
+
34
43
  .fsFacetOptions:after {
35
- content: "";
36
- display: table;
37
- clear: both;
44
+ content: "";
45
+ display: table;
46
+ clear: both;
47
+ }
48
+
49
+ .fsFacetOptions > .react-datepicker-wrapper {
50
+ width: 100%;
38
51
  }
39
- .fsFacetOptions>.react-datepicker-wrapper {
40
- width: calc(100% - 6px)!important;
41
- }
package/dist/components/RadioFilter/Radio/styles.module.css CHANGED
@@ -1,56 +1,31 @@
1
1
  .fsCheckbox {
2
2
  display: flex;
3
3
  position: relative;
4
- padding: 0 5px 0 0;
5
- margin-top: 5px;
6
- margin-bottom: 5px;
4
+ padding: 8px 0;
7
5
  cursor: pointer;
8
6
  -webkit-user-select: none;
9
7
  -moz-user-select: none;
10
8
  -ms-user-select: none;
11
9
  user-select: none;
12
- font-family: Arial, serif;
13
- animation: growDown 300ms ease forwards;
10
+ font-family: Assistant, sans-serif;
14
11
  align-items: center;
12
+ gap: 8px;
15
13
  }
16
14
 
17
15
  .fsCheckbox input {
18
- position: fixed;
19
- opacity: 0;
16
+ position: relative !important;
17
+ opacity: 1 !important;
20
18
  cursor: pointer;
21
- height: 0;
22
- width: 0;
19
+ width: 16px !important;
20
+ height: 16px !important;
21
+ margin: 0;
22
+ accent-color: #4374f2;
23
23
  }
24
24
 
25
25
  .checkmark {
26
- min-height: 16px;
27
- min-width: 16px;
28
- background-color: #eee;
29
- margin-right: 10px;
26
+ display: none;
30
27
  }
31
28
 
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
- }
54
29
  .fsSelectedCheckboxTrue{}
55
30
  .fsSelectedCheckboxFalse{}
56
31
 
@@ -95,6 +70,15 @@
95
70
  overflow: hidden;
96
71
  }
97
72
 
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
+
98
82
  .checkbox input {
99
83
  position: fixed;
100
84
  opacity: 0;
@@ -142,4 +126,4 @@
142
126
  }
143
127
  :global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
144
128
  display: none;
145
- }
129
+ }
package/dist/components/RadioFilter/styles.module.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .fsOptions {
2
- padding: 0 0 8px 8px;
2
+ padding: 12px 24px;
3
3
  }
4
4
  .showMore {
5
5
  color: #737373;
package/dist/components/ReactDatePicker/styles.module.css CHANGED
@@ -1,3 +1,11 @@
1
- .fullWidthInput{
1
+ .fullWidthInput {
2
2
  width: 100%;
3
- }
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
+ }
package/dist/components/SingleFilter/styles.module.css CHANGED
@@ -1,8 +1,8 @@
1
1
  .fsOptions {
2
- padding: 0 5px 8px 8px;
2
+ padding: 12px 24px;
3
3
  }
4
4
  .showMore {
5
- color: #737373;
5
+ color: #4374f2;
6
6
  }
7
7
 
8
8
  .showMore:hover {
@@ -10,7 +10,7 @@
10
10
  }
11
11
 
12
12
  .arrow {
13
- border: solid #636363;
13
+ border: solid #4374f2;
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.138-beta.4",
3
+ "version": "1.0.138",
4
4
  "scripts": {
5
5
  "dev": "vite",
6
6
  "preview": "vite preview",