@janbox/storefront-ui 1.0.27 → 2.0.0

package/dist/utils/stylesheet.js

@@ -1,5 +1,19 @@
+import { mediaQuery } from "../theme/screens.js";
+import "../theme/palette.js";
 import { clsx } from "clsx";
 const cn = (...classes) => clsx(...classes);
+const createSxInterpolation = (sx = {}) => {
+  const { sm, md, lg, ...rest } = sx;
+  return [
+    rest,
+    {
+      [mediaQuery("sm")]: sm,
+      [mediaQuery("md")]: md,
+      [mediaQuery("lg")]: lg
+    }
+  ];
+};
 export {
-  cn
+  cn,
+  createSxInterpolation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@janbox/storefront-ui",
-  "version": "1.0.27",
+  "version": "2.0.0",
   "description": "Storefront UI component library for Janbox",
   "author": "Janbox",
   "keywords": [

package/dist/lib/filter-panel/price-range-filter-panel.d.ts

@@ -1,3 +0,0 @@
-import { InputRangeFilterPanelProps } from './types';
-export declare const PriceRangeFilterPanel: ({ value, queryParam, placeholder, priceTypes, onPriceChange, onPriceTypeChange, }: InputRangeFilterPanelProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=price-range-filter-panel.d.ts.map

package/dist/lib/filter-panel/price-range-filter-panel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"price-range-filter-panel.d.ts","sourceRoot":"","sources":["../../../src/lib/filter-panel/price-range-filter-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAC;AAWrD,eAAO,MAAM,qBAAqB,sFAO/B,0BAA0B,qDAyH5B,CAAC"}

package/dist/lib/filter-panel/price-range-filter-panel.js

@@ -1,127 +0,0 @@
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
-import { TYPING_DEBOUNCE } from "../../constants/index.js";
-import { useQueryParams } from "../../hooks/use-query-params.js";
-import { useId } from "react";
-import "lodash-es";
-import "../../theme/palette.js";
-import { StringParamParser, NumberParamParser } from "../../utils/query-params.js";
-import { RadioButton } from "../radio-button/radio-button.js";
-import { InputRange } from "../input-range/input-range.js";
-const PriceRangeFilterPanel = ({
-  value,
-  queryParam,
-  placeholder,
-  priceTypes = [],
-  onPriceChange,
-  onPriceTypeChange
-}) => {
-  var _a, _b, _c, _d, _e, _f, _g;
-  const uniqueId = useId();
-  const { queryParams, setQueryParams } = useQueryParams({
-    ...((_a = queryParam == null ? void 0 : queryParam.from) == null ? void 0 : _a.key) ? {
-      [queryParam.from.key]: {
-        parser(value2) {
-          return new NumberParamParser(value2).parse();
-        }
-      }
-    } : {},
-    ...((_b = queryParam == null ? void 0 : queryParam.to) == null ? void 0 : _b.key) ? {
-      [queryParam.to.key]: {
-        parser(value2) {
-          return new NumberParamParser(value2).parse();
-        }
-      }
-    } : {},
-    ...((_c = queryParam == null ? void 0 : queryParam.priceType) == null ? void 0 : _c.key) ? {
-      [queryParam.priceType.key]: {
-        parser(value2) {
-          return new StringParamParser(value2).parse();
-        }
-      }
-    } : {}
-  });
-  const finalValue = {
-    from: (value == null ? void 0 : value.from) ?? (((_d = queryParam == null ? void 0 : queryParam.from) == null ? void 0 : _d.key) ? queryParams[queryParam.from.key] : void 0),
-    to: (value == null ? void 0 : value.to) ?? (((_e = queryParam == null ? void 0 : queryParam.to) == null ? void 0 : _e.key) ? queryParams[queryParam.to.key] : void 0),
-    priceType: (value == null ? void 0 : value.priceType) ?? (((_f = queryParam == null ? void 0 : queryParam.priceType) == null ? void 0 : _f.key) ? queryParams[queryParam.priceType.key] : void 0) ?? ((_g = priceTypes.find((priceType) => priceType.isDefault)) == null ? void 0 : _g.value)
-  };
-  const onInputRangeChange = (event, edge) => {
-    var _a2, _b2, _c2, _d2;
-    const valueAsNumber = event.target.valueAsNumber;
-    if (edge === "from" && ((_a2 = queryParam == null ? void 0 : queryParam.from) == null ? void 0 : _a2.key)) {
-      setQueryParams(
-        {
-          [queryParam.from.key]: isNaN(valueAsNumber) ? void 0 : valueAsNumber,
-          ...((_b2 = queryParam.priceType) == null ? void 0 : _b2.key) ? { [queryParam.priceType.key]: finalValue.priceType } : {}
-        },
-        {
-          preventScrollReset: true
-        }
-      );
-    }
-    if (edge === "to" && ((_c2 = queryParam == null ? void 0 : queryParam.to) == null ? void 0 : _c2.key)) {
-      setQueryParams(
-        {
-          [queryParam.to.key]: isNaN(valueAsNumber) ? void 0 : valueAsNumber,
-          ...((_d2 = queryParam.priceType) == null ? void 0 : _d2.key) ? { [queryParam.priceType.key]: finalValue.priceType } : {}
-        },
-        {
-          preventScrollReset: true
-        }
-      );
-    }
-    onPriceChange == null ? void 0 : onPriceChange(event, edge);
-  };
-  const onRadioInputChange = (event) => {
-    var _a2;
-    if ((_a2 = queryParam == null ? void 0 : queryParam.priceType) == null ? void 0 : _a2.key) {
-      setQueryParams(
-        {
-          [queryParam.priceType.key]: event.target.value
-        },
-        {
-          preventScrollReset: true
-        }
-      );
-    }
-    onPriceTypeChange == null ? void 0 : onPriceTypeChange(event);
-  };
-  return /* @__PURE__ */ jsxs("div", { css: { display: "flex", flexDirection: "column", gap: 8 }, children: [
-    /* @__PURE__ */ jsx("div", { css: { display: "flex", alignItems: "center", gap: 8, flexWrap: "wrap" }, children: priceTypes.map((priceType) => {
-      var _a2;
-      return /* @__PURE__ */ jsx(
-        RadioButton,
-        {
-          checked: ((_a2 = finalValue.priceType) == null ? void 0 : _a2.toString()) === priceType.value,
-          value: priceType.value,
-          onChange: onRadioInputChange,
-          name: `${uniqueId}-price-type`,
-          children: priceType.label
-        },
-        priceType.value
-      );
-    }) }),
-    /* @__PURE__ */ jsx(
-      InputRange,
-      {
-        xs: { size: "sm" },
-        onChange: onInputRangeChange,
-        inputs: [
-          {
-            debounce: TYPING_DEBOUNCE,
-            value: finalValue.from ?? "",
-            placeholder: placeholder == null ? void 0 : placeholder.from
-          },
-          {
-            debounce: TYPING_DEBOUNCE,
-            value: finalValue.to ?? "",
-            placeholder: placeholder == null ? void 0 : placeholder.to
-          }
-        ]
-      }
-    )
-  ] });
-};
-export {
-  PriceRangeFilterPanel
-};