pixelize-design-library 2.2.105 → 2.2.106

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 (4) hide show
  1. package/dist/Components/FilterSidebar/FilterSidebar.js +33 -26
  2. package/dist/Components/ProductDetails/ProductDetailsProps.d.ts +1 -0
  3. package/dist/Components/ProductDetails/ProductImageSlider.js +4 -4
  4. package/package.json +1 -1
package/dist/Components/FilterSidebar/FilterSidebar.js CHANGED
@@ -259,32 +259,39 @@ var FilterSidebar = function (_a) {
259
259
  return (__assign(__assign({}, prev), (_a = {}, _a[section.id] = true, _a)));
260
260
  });
261
261
  } })),
262
- section.id !== "rating" && (((section.type === "radio") || section.radio) ? (react_1.default.createElement(react_2.RadioGroup, { w: "full", value: internalSelected[section.id] || "", onChange: function (val) {
263
- setInternalSelected(function (prev) {
264
- var _a;
265
- var next = __assign(__assign({}, prev), (_a = {}, _a[section.id] = val, _a));
266
- onChange === null || onChange === void 0 ? void 0 : onChange(next);
267
- return next;
268
- });
269
- } },
270
- react_1.default.createElement(react_2.VStack, { align: "start", spacing: 1, w: "full" }, ((expanded[section.id] ? (section.options || []) : (section.options || []).slice(0, maxVisible))
271
- .filter(function (opt) { return !section.searchable || !(searchTerms[section.id]) || opt.label.toLowerCase().includes((searchTerms[section.id] || "").toLowerCase()); })).map(function (opt) { return (react_1.default.createElement(react_2.Radio, { key: opt.id, value: opt.id, size: "sm", colorScheme: "red" },
272
- react_1.default.createElement(react_2.Text, { fontSize: "xs", color: theme.colors.gray[700] }, opt.label))); })))) : (((expanded[section.id] ? (section.options || []) : (section.options || []).slice(0, maxVisible))
273
- .filter(function (opt) { return !section.searchable || !(searchTerms[section.id]) || opt.label.toLowerCase().includes((searchTerms[section.id] || "").toLowerCase()); })).map(function (opt) { return (react_1.default.createElement(react_2.Flex, { key: opt.id, align: "center", justify: "space-between", w: "full", _hover: { bg: theme.colors.gray[50], borderRadius: "md" }, p: 0 },
274
- react_1.default.createElement(react_2.Flex, { align: "center", gap: 1 },
275
- react_1.default.createElement(Checkbox_1.default, { isChecked: Array.isArray(internalSelected[section.id]) && (internalSelected[section.id] || []).includes(opt.id), onChange: function (e) {
276
- toggleOption(section.id, opt.id, e.target.checked);
277
- }, size: "sm", iconSize: "0.5rem", sx: {
278
- '.chakra-checkbox__control': {
279
- width: '12px',
280
- height: '12px',
281
- }
282
- }, color: "red" }),
283
- react_1.default.createElement(react_2.Text, { fontSize: "xs", color: theme.colors.gray[700], cursor: "pointer", onClick: function () {
284
- var isChecked = Array.isArray(internalSelected[section.id]) && (internalSelected[section.id] || []).includes(opt.id);
285
- toggleOption(section.id, opt.id, !isChecked);
286
- } }, opt.label)),
287
- typeof opt.count === "number" && (react_1.default.createElement(react_2.Badge, { fontSize: "xs", colorScheme: "gray", borderRadius: "full", px: 2 }, opt.count)))); }))),
262
+ section.id !== "rating" && (function () {
263
+ var filteredOptions = (expanded[section.id] ? (section.options || []) : (section.options || []).slice(0, maxVisible))
264
+ .filter(function (opt) { return !section.searchable || !(searchTerms[section.id]) || opt.label.toLowerCase().includes((searchTerms[section.id] || "").toLowerCase()); });
265
+ if (filteredOptions.length === 0 && searchTerms[section.id]) {
266
+ return (react_1.default.createElement(react_2.Box, { p: 2, w: "full", textAlign: "center" },
267
+ react_1.default.createElement(react_2.Text, { fontSize: "xs", color: theme.colors.gray[500] }, "No Data Found")));
268
+ }
269
+ return ((section.type === "radio") || section.radio) ? (react_1.default.createElement(react_2.RadioGroup, { w: "full", value: internalSelected[section.id] || "", onChange: function (val) {
270
+ setInternalSelected(function (prev) {
271
+ var _a;
272
+ var next = __assign(__assign({}, prev), (_a = {}, _a[section.id] = val, _a));
273
+ onChange === null || onChange === void 0 ? void 0 : onChange(next);
274
+ return next;
275
+ });
276
+ } },
277
+ react_1.default.createElement(react_2.VStack, { align: "start", spacing: 1, w: "full" }, filteredOptions.map(function (opt) { return (react_1.default.createElement(react_2.Radio, { key: opt.id, value: opt.id, size: "sm", colorScheme: "red" },
278
+ react_1.default.createElement(react_2.Text, { fontSize: "xs", color: theme.colors.gray[700] }, opt.label))); })))) : (filteredOptions.map(function (opt) { return (react_1.default.createElement(react_2.Flex, { key: opt.id, align: "center", justify: "space-between", w: "full", _hover: { bg: theme.colors.gray[50], borderRadius: "md" }, p: 0 },
279
+ react_1.default.createElement(react_2.Flex, { align: "center", gap: 1 },
280
+ react_1.default.createElement(Checkbox_1.default, { isChecked: Array.isArray(internalSelected[section.id]) && (internalSelected[section.id] || []).includes(opt.id), onChange: function (e) {
281
+ toggleOption(section.id, opt.id, e.target.checked);
282
+ }, size: "sm", iconSize: "0.5rem", sx: {
283
+ '.chakra-checkbox__control': {
284
+ width: '12px',
285
+ height: '12px',
286
+ },
287
+ marginLeft: "2px",
288
+ }, color: "red" }),
289
+ react_1.default.createElement(react_2.Text, { fontSize: "xs", color: theme.colors.gray[700], cursor: "pointer", onClick: function () {
290
+ var isChecked = Array.isArray(internalSelected[section.id]) && (internalSelected[section.id] || []).includes(opt.id);
291
+ toggleOption(section.id, opt.id, !isChecked);
292
+ } }, opt.label)),
293
+ typeof opt.count === "number" && (react_1.default.createElement(react_2.Badge, { fontSize: "xs", colorScheme: "gray", borderRadius: "full", px: 2 }, opt.count)))); }));
294
+ })(),
288
295
  (section.options && section.options.length > maxVisible) && (react_1.default.createElement(react_2.Text, { fontSize: "sm", fontWeight: "medium", color: theme.colors.blue[600], cursor: "pointer", _hover: { textDecoration: "underline" }, onClick: function () { return setExpanded(function (prev) {
289
296
  var _a;
290
297
  return (__assign(__assign({}, prev), (_a = {}, _a[section.id] = !prev[section.id], _a)));
package/dist/Components/ProductDetails/ProductDetailsProps.d.ts CHANGED
@@ -25,6 +25,7 @@ export type images = {
25
25
  imageId: number;
26
26
  order: number;
27
27
  isImage?: boolean;
28
+ thumb?: string;
28
29
  };
29
30
  export type videos = {
30
31
  videoUrl: string;
package/dist/Components/ProductDetails/ProductImageSlider.js CHANGED
@@ -151,7 +151,7 @@ function ProductImageSlider(_a) {
151
151
  var yt = getYouTubeId(url);
152
152
  var vimeo = getVimeoId(url);
153
153
  var dm = getDailymotionId(url);
154
- var thumb = getThumbForItem(url);
154
+ var thumb = (item === null || item === void 0 ? void 0 : item.thumb) || getThumbForItem(url);
155
155
  if (isVideo) {
156
156
  if (!isPlaying) {
157
157
  return (react_2.default.createElement(react_1.Box, { position: "relative", w: "100%", h: "".concat(imageSize, "px") },
@@ -186,7 +186,7 @@ function ProductImageSlider(_a) {
186
186
  var actualIndex = thumbStartIndex + index;
187
187
  var url = src.imageUrl;
188
188
  var isVideo = src.isImage !== undefined ? src.isImage === false : isVideoUrl(url);
189
- var thumb = getThumbForItem(url);
189
+ var thumb = src.thumb || getThumbForItem(url);
190
190
  return (react_2.default.createElement(react_1.Box, { key: actualIndex, w: "".concat(thumbHeight, "px"), h: "".concat(thumbHeight, "px"), borderRadius: "md", overflow: "hidden", cursor: "pointer", border: actualIndex === activeIndex
191
191
  ? "0.125rem solid ".concat(theme.colors.gray[500])
192
192
  : "0.125rem solid transparent", opacity: actualIndex === activeIndex ? 1 : 0.5, onClick: function () { return setActiveIndex(actualIndex); }, _hover: { opacity: 1 }, transition: "all 0.2s", position: "relative" }, isVideo ? (thumb ? (react_2.default.createElement(react_2.default.Fragment, null,
@@ -204,7 +204,7 @@ function ProductImageSlider(_a) {
204
204
  var actualIndex = thumbStartIndex + index;
205
205
  var url = src.imageUrl;
206
206
  var isVideo = src.isImage !== undefined ? src.isImage === false : isVideoUrl(url);
207
- var thumb = getThumbForItem(url);
207
+ var thumb = src.thumb || getThumbForItem(url);
208
208
  return (react_2.default.createElement(react_1.Box, { key: actualIndex, w: "".concat(thumbHeight, "px"), h: "".concat(thumbHeight, "px"), borderRadius: "md", overflow: "hidden", cursor: "pointer", border: actualIndex === activeIndex
209
209
  ? "0.125rem solid ".concat(theme.colors.gray[500])
210
210
  : "0.125rem solid transparent", opacity: actualIndex === activeIndex ? 1 : 0.5, onClick: function () { return setActiveIndex(actualIndex); }, _hover: { opacity: 1 }, transition: "all 0.2s", position: "relative" }, isVideo ? (thumb ? (react_2.default.createElement(react_2.default.Fragment, null,
@@ -234,7 +234,7 @@ function ProductImageSlider(_a) {
234
234
  var yt = getYouTubeId(url);
235
235
  var vimeo = getVimeoId(url);
236
236
  var dm = getDailymotionId(url);
237
- var thumb = getThumbForItem(url);
237
+ var thumb = (item === null || item === void 0 ? void 0 : item.thumb) || getThumbForItem(url);
238
238
  if (isVideo) {
239
239
  if (!isPlaying) {
240
240
  return (react_2.default.createElement(react_1.Box, { position: "relative", w: "100%", h: "".concat(imageSize, "px") },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.2.105",
3
+ "version": "2.2.106",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",