@spscommerce/ds-react 5.33.12 → 5.33.13

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 (3) hide show
  1. package/lib/index.cjs.js +62 -62
  2. package/lib/index.es.js +9 -10
  3. package/package.json +12 -13
package/lib/index.es.js CHANGED
@@ -2401,6 +2401,13 @@ const SpsOptionList = React.forwardRef((props2, ref2) => {
2401
2401
  }, [isOpen]);
2402
2402
  const maxHeight = maxHeightPx ? maxHeightPx / 16 : maxHeightRem;
2403
2403
  const optionsInlineStyles = maxHeight ? { maxHeight: `${maxHeight}rem` } : {};
2404
+ function highlightText(text, pattern2) {
2405
+ return pattern2 ? /* @__PURE__ */ React.createElement(React.Fragment, null, text.split(pattern2).map((part, partIdx) => pattern2.test(part) ? /* @__PURE__ */ React.createElement("u", {
2406
+ key: partIdx
2407
+ }, part) : /* @__PURE__ */ React.createElement(React.Fragment, {
2408
+ key: partIdx
2409
+ }, part))) : /* @__PURE__ */ React.createElement(React.Fragment, null, text);
2410
+ }
2404
2411
  return portal(/* @__PURE__ */ React.createElement("div", __spreadValues({
2405
2412
  className: classes,
2406
2413
  id: id2,
@@ -2439,17 +2446,9 @@ const SpsOptionList = React.forwardRef((props2, ref2) => {
2439
2446
  className: clsx("sps-icon", "sps-option-list__option-icon", `sps-icon-${String(option.value.icon)}`)
2440
2447
  }), (!option.value || !option.value.icon && anyOptionHasIcon) && /* @__PURE__ */ React.createElement("span", {
2441
2448
  className: "sps-option-list__option-icon-spacer"
2442
- }), /* @__PURE__ */ React.createElement("span", {
2443
- dangerouslySetInnerHTML: {
2444
- __html: option.getHtml(searchState.replacementPattern)
2445
- }
2446
- }), option.caption && /* @__PURE__ */ React.createElement("div", {
2449
+ }), /* @__PURE__ */ React.createElement("span", null, highlightText(option.text, searchState.replacementPattern)), option.caption && /* @__PURE__ */ React.createElement("div", {
2447
2450
  className: "sps-option-list__option-caption"
2448
- }, /* @__PURE__ */ React.createElement("span", {
2449
- dangerouslySetInnerHTML: {
2450
- __html: option.caption.replace(searchState.replacementPattern, "<u>$&</u>")
2451
- }
2452
- })));
2451
+ }, /* @__PURE__ */ React.createElement("span", null, highlightText(option.caption, searchState.replacementPattern))));
2453
2452
  })), specialActionOption && specialAction.label && /* @__PURE__ */ React.createElement("a", {
2454
2453
  className: clsx("sps-option-list__option", "sps-option-list__special-action", highlightedOptionIndex === optionList.length && "sps-option-list__option--highlighted", specialAction.disabled && "sps-option-list__special-action--disabled"),
2455
2454
  href: specialActionOption.href,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@spscommerce/ds-react",
3
3
  "description": "SPS Design System React components",
4
- "version": "5.33.12",
4
+ "version": "5.33.13",
5
5
  "author": "SPS Commerce",
6
6
  "license": "UNLICENSED",
7
7
  "repository": "https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/ds-react",
@@ -28,11 +28,11 @@
28
28
  },
29
29
  "peerDependencies": {
30
30
  "@react-stately/collections": "^3.3.3",
31
- "@spscommerce/ds-colors": "5.33.12",
32
- "@spscommerce/ds-illustrations": "5.33.12",
33
- "@spscommerce/ds-shared": "5.33.12",
34
- "@spscommerce/positioning": "5.33.12",
35
- "@spscommerce/utils": "5.33.12",
31
+ "@spscommerce/ds-colors": "5.33.13",
32
+ "@spscommerce/ds-illustrations": "5.33.13",
33
+ "@spscommerce/ds-shared": "5.33.13",
34
+ "@spscommerce/positioning": "5.33.13",
35
+ "@spscommerce/utils": "5.33.13",
36
36
  "moment": "^2.25.3",
37
37
  "moment-timezone": "^0.5.28",
38
38
  "react": "^16.9.0",
@@ -40,11 +40,11 @@
40
40
  },
41
41
  "devDependencies": {
42
42
  "@react-stately/collections": "^3.3.3",
43
- "@spscommerce/ds-colors": "5.33.12",
44
- "@spscommerce/ds-illustrations": "5.33.12",
45
- "@spscommerce/ds-shared": "5.33.12",
46
- "@spscommerce/positioning": "5.33.12",
47
- "@spscommerce/utils": "5.33.12",
43
+ "@spscommerce/ds-colors": "5.33.13",
44
+ "@spscommerce/ds-illustrations": "5.33.13",
45
+ "@spscommerce/ds-shared": "5.33.13",
46
+ "@spscommerce/positioning": "5.33.13",
47
+ "@spscommerce/utils": "5.33.13",
48
48
  "@testing-library/react": "^9.3.2",
49
49
  "@types/prop-types": "^15.7.1",
50
50
  "@types/react": "^16.9.0",
@@ -64,6 +64,5 @@
64
64
  "watch": "vite build --watch",
65
65
  "clean": "git clean -fdX",
66
66
  "pub": "pnpm pack && node ../../scripts/publish-package.js"
67
- },
68
- "readme": "[//]: # \"START_AUTOGENERATED\"\n\n## [@spscommerce/ds-react](https://github.com/spscommerce/ui-angular/tree/master/packages/@spscommerce/ds-react#readme)\n\n![release: 1.1.0](https://img.shields.io/badge/release-1.1.0-blue.svg?style=flat-square)\n![build: passing](https://img.shields.io/badge/build-passing-green.svg?style=flat-square)\n![tests: failing](https://img.shields.io/badge/tests-failing-red.svg?style=flat-square)\n\nSPS Design System React components \n \n ### Installation \n \n ```shell\nnpm install --save @spscommerce/ds-react\n```\n\n#### Peer Dependencies\n\n<div class=\"row\">\n <div class=\"col-5\"> \n <table class=\"sps-table\">\n <thead class=\"sps-table__head\">\n <tr class=\"sps-table__row\">\n <th class=\"sps-table__header\">\n <span class=\"sps-table__header-cell-body\"> \n Package\n </span>\n </th>\n <th class=\"sps-table__header text-right\">\n <span class=\"sps-table__header-cell-body\"> \n Version\n </span>\n </th>\n </tr>\n </thead>\n <tbody class=\"sps-table__body\">\n <tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/ds-shared#readme\">@spscommerce/ds-shared</a></td><td class=\"sps-table__cell text-right\">^1.1.0</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/positioning#readme\">@spscommerce/positioning</a></td><td class=\"sps-table__cell text-right\">^1.1.0</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/utils#readme\">@spscommerce/utils</a></td><td class=\"sps-table__cell text-right\">^1.1.0</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"lukeed/clsx\">clsx</a></td><td class=\"sps-table__cell text-right\">^1.0.3</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://momentjs.com\">moment</a></td><td class=\"sps-table__cell text-right\">^2.25.3</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"http://momentjs.com/timezone/\">moment-timezone</a></td><td class=\"sps-table__cell text-right\">^0.5.28</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"ai/nanoid\">nanoid</a></td><td class=\"sps-table__cell text-right\">^2.1.6</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://facebook.github.io/react/\">prop-types</a></td><td class=\"sps-table__cell text-right\">^15.7.2</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://reactjs.org/\">react</a></td><td class=\"sps-table__cell text-right\">^16.9.0</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://reactjs.org/\">react-dom</a></td><td class=\"sps-table__cell text-right\">^16.9.0</td></tr>\n<tr class=\"sps-table__row\"><td class=\"sps-table__cell\"><a href=\"https://scroll-into-view-if-needed.netlify.com\">scroll-into-view-if-needed</a></td><td class=\"sps-table__cell text-right\">^2.2.20</td></tr>\n </tbody>\n </table>\n </div>\n <div class=\"col-7\">\n &nbsp;\n </div>\n</div>\n\n[//]: # \"END_AUTOGENERATED\"\n"
67
+ }
69
68
  }