@spscommerce/ds-web-components 8.2.2 → 8.3.0

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/lib/index.es.js +39 -118
  2. package/dist/package.json +1 -1
  3. package/lib/index.es.js +39 -118
  4. package/package.json +4 -4
package/dist/lib/index.es.js CHANGED
@@ -964,74 +964,34 @@ let f = (q = class extends HTMLElement {
964
964
  }
965
965
  render({ t }) {
966
966
  const s = this.error ? Se.EXCLAMATION_CIRCLE : Se.UPLOAD_CLOUD, n = (this.multiple ? t("design-system:fileUpload.instructions_plural") : t("design-system:fileUpload.instructions")).split("|");
967
- return /* @__PURE__ */ o("div", {
968
- "data-fragment": !0
969
- }, /* @__PURE__ */ o("div", {
970
- className: `${v}__content`
971
- }, this.processing ? /* @__PURE__ */ o("div", {
972
- "data-fragment": !0
973
- }, /* @__PURE__ */ o("i", {
974
- className: "sps-spinner sps-spinner--medium",
975
- "aria-hidden": "true"
976
- }), /* @__PURE__ */ o("div", {
977
- className: `${v}__instructions`
978
- }, t("design-system:fileUpload.processing"))) : /* @__PURE__ */ o("div", {
979
- "data-fragment": !0
980
- }, /* @__PURE__ */ o("i", {
981
- className: `sps-icon sps-icon-${s} ${v}__icon-primary`,
982
- "aria-hidden": "true"
983
- }), /* @__PURE__ */ o("div", {
984
- className: `${v}__title`
985
- }, this.error ? /* @__PURE__ */ o("div", {
986
- "data-fragment": !0
987
- }, t(
967
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", { className: `${v}__content` }, this.processing ? /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("i", { className: "sps-spinner sps-spinner--medium", "aria-hidden": "true" }), /* @__PURE__ */ o("div", { className: `${v}__instructions` }, t("design-system:fileUpload.processing"))) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${s} ${v}__icon-primary`, "aria-hidden": "true" }), /* @__PURE__ */ o("div", { className: `${v}__title` }, this.error ? /* @__PURE__ */ o("div", { "data-fragment": !0 }, t(
988
968
  this.namesOfUnsupportedFiles.length > 1 ? "design-system:fileUpload.cancelled_plural" : "design-system:fileUpload.cancelled"
989
- )) : /* @__PURE__ */ o("div", {
990
- "data-fragment": !0
991
- }, t("design-system:fileUpload.title", { description: this.description }))), this.error ? /* @__PURE__ */ o("div", {
992
- className: `${v}__errored-files`
993
- }, new Set(this.namesOfUnsupportedFiles.map((i, r) => {
969
+ )) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, t("design-system:fileUpload.title", { description: this.description }))), this.error ? /* @__PURE__ */ o("div", { className: `${v}__errored-files` }, new Set(this.namesOfUnsupportedFiles.map((i, r) => {
994
970
  const l = Math.floor(i.length / 2);
995
- return /* @__PURE__ */ o("div", {
996
- className: `${v}__errored-filename`,
997
- key: i
998
- }, /* @__PURE__ */ o("span", {
999
- className: `${v}__errored-filename-segment`
1000
- }, i.substr(0, l)), /* @__PURE__ */ o("div", {
1001
- className: `${v}__errored-filename-segment`
1002
- }, /* @__PURE__ */ o("span", null, i.substr(l))), r < this.namesOfUnsupportedFiles.length - 1 ? "," : "");
1003
- }))) : /* @__PURE__ */ o("span", null), /* @__PURE__ */ o("div", {
1004
- className: `${v}__instructions`
1005
- }, /* @__PURE__ */ o("div", {
1006
- "data-fragment": !0
1007
- }, /* @__PURE__ */ o("span", null, n[0]), /* @__PURE__ */ o("a", {
1008
- href: "",
1009
- onClick: this.handleBrowseLinkClick
1010
- }, n[1]), /* @__PURE__ */ o("span", null, n[2]))), /* @__PURE__ */ o("div", {
1011
- className: `${v}__requirements`
1012
- }, this.acceptExtensions ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.acceptedTypes", { fileTypes: this.acceptExtensionsDescription }), " ", ")") : "", this.maxSize ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.maximumSize", { size: this.maxSize }), " ", ")") : "", this.customRequirement ? /* @__PURE__ */ o("span", null, " ", this.customRequirement, " ") : ""), this.downloadLabel && /* @__PURE__ */ o("div", {
1013
- className: `sps-button sps-button--link ${v}__download-button`,
1014
- onClick: this.handleDownloadButtonClick
1015
- }, /* @__PURE__ */ o("button", {
1016
- type: "button"
1017
- }, /* @__PURE__ */ o("i", {
1018
- className: "sps-icon sps-icon-download-cloud",
1019
- "aria-hidden": "true"
1020
- }), " ", this.downloadLabel)))), this.dismissable && !this.processing && /* @__PURE__ */ o("div", {
1021
- className: `sps-button sps-button--icon ${v}__close-button`,
1022
- onClick: this.dismiss
1023
- }, /* @__PURE__ */ o("button", {
1024
- type: "button",
1025
- title: t("design-system:fileUpload.close")
1026
- }, /* @__PURE__ */ o("i", {
1027
- className: "sps-icon sps-icon-x",
1028
- "aria-hidden": "true"
1029
- }))), /* @__PURE__ */ o("form", null, /* @__PURE__ */ o("input", {
1030
- type: "file",
1031
- accept: this.accept || "*/*",
1032
- multiple: this.multiple || null,
1033
- onChange: this.handleFileInputChange
1034
- })));
971
+ return /* @__PURE__ */ o("div", { className: `${v}__errored-filename`, key: i }, /* @__PURE__ */ o("span", { className: `${v}__errored-filename-segment` }, i.substr(0, l)), /* @__PURE__ */ o("div", { className: `${v}__errored-filename-segment` }, /* @__PURE__ */ o("span", null, i.substr(l))), r < this.namesOfUnsupportedFiles.length - 1 ? "," : "");
972
+ }))) : /* @__PURE__ */ o("span", null), /* @__PURE__ */ o("div", { className: `${v}__instructions` }, /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("span", null, n[0]), /* @__PURE__ */ o("a", { href: "", onClick: this.handleBrowseLinkClick }, n[1]), /* @__PURE__ */ o("span", null, n[2]))), /* @__PURE__ */ o("div", { className: `${v}__requirements` }, this.acceptExtensions ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.acceptedTypes", { fileTypes: this.acceptExtensionsDescription }), " ", ")") : "", this.maxSize ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.maximumSize", { size: this.maxSize }), " ", ")") : "", this.customRequirement ? /* @__PURE__ */ o("span", null, " ", this.customRequirement, " ") : ""), this.downloadLabel && /* @__PURE__ */ o(
973
+ "div",
974
+ {
975
+ className: `sps-button sps-button--link ${v}__download-button`,
976
+ onClick: this.handleDownloadButtonClick
977
+ },
978
+ /* @__PURE__ */ o("button", { type: "button" }, /* @__PURE__ */ o("i", { className: "sps-icon sps-icon-download-cloud", "aria-hidden": "true" }), " ", this.downloadLabel)
979
+ ))), this.dismissable && !this.processing && /* @__PURE__ */ o(
980
+ "div",
981
+ {
982
+ className: `sps-button sps-button--icon ${v}__close-button`,
983
+ onClick: this.dismiss
984
+ },
985
+ /* @__PURE__ */ o("button", { type: "button", title: t("design-system:fileUpload.close") }, /* @__PURE__ */ o("i", { className: "sps-icon sps-icon-x", "aria-hidden": "true" }))
986
+ ), /* @__PURE__ */ o("form", null, /* @__PURE__ */ o(
987
+ "input",
988
+ {
989
+ type: "file",
990
+ accept: this.accept || "*/*",
991
+ multiple: this.multiple || null,
992
+ onChange: this.handleFileInputChange
993
+ }
994
+ )));
1035
995
  }
1036
996
  parseAndValidateMaxSize(t) {
1037
997
  try {
@@ -1500,35 +1460,19 @@ let y = (G = class extends HTMLElement {
1500
1460
  ];
1501
1461
  }
1502
1462
  render({ t }) {
1503
- const s = /* @__PURE__ */ o("div", {
1504
- className: `${_}__metric-count`
1505
- }, this.metric), n = /* @__PURE__ */ o("div", {
1506
- className: `${_}__description`
1507
- }, /* @__PURE__ */ o("div", {
1508
- className: `${_}__title`,
1509
- style: { "-webkit-box-orient": "vertical" }
1510
- }, this.title), /* @__PURE__ */ o("div", {
1511
- className: `${_}__detail`
1512
- }, this.content)), i = this.partnercount, r = this.totalpartners, [
1463
+ const s = /* @__PURE__ */ o("div", { className: `${_}__metric-count` }, this.metric), n = /* @__PURE__ */ o("div", { className: `${_}__description` }, /* @__PURE__ */ o(
1464
+ "div",
1465
+ {
1466
+ className: `${_}__title`,
1467
+ style: { "-webkit-box-orient": "vertical" }
1468
+ },
1469
+ this.title
1470
+ ), /* @__PURE__ */ o("div", { className: `${_}__detail` }, this.content)), i = this.partnercount, r = this.totalpartners, [
1513
1471
  l,
1514
1472
  d,
1515
1473
  g
1516
1474
  ] = (i ? t("design-system:insightCard.partnerCount", { count: i, total: r }) : "").split("|");
1517
- return /* @__PURE__ */ o("div", {
1518
- "data-fragment": !0
1519
- }, /* @__PURE__ */ o("div", {
1520
- className: `${_}__body`
1521
- }, this.icon ? /* @__PURE__ */ o("i", {
1522
- className: `sps-icon sps-icon-${this.icon}`
1523
- }) : /* @__PURE__ */ o("i", {
1524
- className: `sps-icon sps-icon-${lt[this.kind]}`
1525
- }), s, n), i && /* @__PURE__ */ o("div", {
1526
- className: `${_}__partner-count`
1527
- }, i === r ? /* @__PURE__ */ o("div", null, t("design-system:insightCard.all")) : /* @__PURE__ */ o("div", {
1528
- "data-fragment": !0
1529
- }, /* @__PURE__ */ o("div", null, l), /* @__PURE__ */ o("div", null, d), /* @__PURE__ */ o("div", null, g)), /* @__PURE__ */ o("div", {
1530
- className: `${_}__partners-text`
1531
- }, t("design-system:insightCard.partners"))));
1475
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", { className: `${_}__body` }, this.icon ? /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.icon}` }) : /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${lt[this.kind]}` }), s, n), i && /* @__PURE__ */ o("div", { className: `${_}__partner-count` }, i === r ? /* @__PURE__ */ o("div", null, t("design-system:insightCard.all")) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", null, l), /* @__PURE__ */ o("div", null, d), /* @__PURE__ */ o("div", null, g)), /* @__PURE__ */ o("div", { className: `${_}__partners-text` }, t("design-system:insightCard.partners"))));
1532
1476
  }
1533
1477
  }, a(G, "displayName", _), a(G, "props", {
1534
1478
  icon: "SpsIcon",
@@ -1598,14 +1542,7 @@ let te = (X = class extends HTMLElement {
1598
1542
  this.showAdditionalInsights = !this.showAdditionalInsights, this.update();
1599
1543
  }
1600
1544
  render() {
1601
- return /* @__PURE__ */ o("div", {
1602
- "data-fragment": !0
1603
- }, this.content, this.content.length > 10 && /* @__PURE__ */ o("div", {
1604
- className: "sps-button sps-button--link",
1605
- onClick: this.toggleAdditionalInsights
1606
- }, /* @__PURE__ */ o("button", {
1607
- type: "button"
1608
- }, this.showAdditionalInsights ? "Hide " : "Show ", "Additional Insights")));
1545
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, this.content, this.content.length > 10 && /* @__PURE__ */ o("div", { className: "sps-button sps-button--link", onClick: this.toggleAdditionalInsights }, /* @__PURE__ */ o("button", { type: "button" }, this.showAdditionalInsights ? "Hide " : "Show ", "Additional Insights")));
1609
1546
  }
1610
1547
  }, a(X, "displayName", D), a(X, "props", {}), X);
1611
1548
  ye([
@@ -1972,16 +1909,7 @@ let P = (K = class extends HTMLElement {
1972
1909
  ];
1973
1910
  }
1974
1911
  render() {
1975
- return /* @__PURE__ */ o("a", {
1976
- href: this.href,
1977
- target: this.target,
1978
- className: "sps-tabbed-nav__nav-item-link",
1979
- tabIndex: 0
1980
- }, this.icon && /* @__PURE__ */ o("i", {
1981
- className: `sps-icon sps-icon-${this.icon}`
1982
- }), this.label && /* @__PURE__ */ o("span", null, this.label), this.tag && /* @__PURE__ */ o("span", {
1983
- className: "sps-tag sps-tag--default"
1984
- }, this.tag));
1912
+ return /* @__PURE__ */ o("a", { href: this.href, target: this.target, className: "sps-tabbed-nav__nav-item-link", tabIndex: 0 }, this.icon && /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.icon}` }), this.label && /* @__PURE__ */ o("span", null, this.label), this.tag && /* @__PURE__ */ o("span", { className: "sps-tag sps-tag--default" }, this.tag));
1985
1913
  }
1986
1914
  }, a(K, "displayName", "sps-nav-tab"), a(K, "props", {
1987
1915
  active: "boolean",
@@ -2023,9 +1951,7 @@ let ue = (Q = class extends HTMLElement {
2023
1951
  a(this, "content", []);
2024
1952
  }
2025
1953
  render() {
2026
- return /* @__PURE__ */ o("nav", {
2027
- className: "sps-tabbed-nav"
2028
- }, this.content);
1954
+ return /* @__PURE__ */ o("nav", { className: "sps-tabbed-nav" }, this.content);
2029
1955
  }
2030
1956
  }, a(Q, "displayName", "sps-nav-tab-set"), a(Q, "props", {}), Q);
2031
1957
  st([
@@ -2129,12 +2055,7 @@ let A = (Z = class extends HTMLElement {
2129
2055
  this.waitForWidthInterval && window.clearInterval(this.waitForWidthInterval), this.waitForImgHeightInterval && window.clearInterval(this.waitForImgHeightInterval);
2130
2056
  }
2131
2057
  render() {
2132
- return this.src ? this.width ? /* @__PURE__ */ o("img", {
2133
- src: this.src,
2134
- alt: this.altText
2135
- }) : /* @__PURE__ */ o("span", null) : /* @__PURE__ */ o("i", {
2136
- className: `sps-icon sps-icon-${this.placeholderIcon}`
2137
- });
2058
+ return this.src ? this.width ? /* @__PURE__ */ o("img", { src: this.src, alt: this.altText }) : /* @__PURE__ */ o("span", null) : /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.placeholderIcon}` });
2138
2059
  }
2139
2060
  setWidth(t) {
2140
2061
  if (t && !this.width) {
package/dist/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@spscommerce/ds-web-components",
3
3
  "description": "SPS Design System Native Web Components",
4
- "version": "8.2.2",
4
+ "version": "8.3.0",
5
5
  "author": "SPS Commerce",
6
6
  "license": "UNLICENSED",
7
7
  "repository": "https://github.com/spscommerce/woodland/tree/main/packages/@spscommerce/ds-web-components",
package/lib/index.es.js CHANGED
@@ -964,74 +964,34 @@ let f = (q = class extends HTMLElement {
964
964
  }
965
965
  render({ t }) {
966
966
  const s = this.error ? Se.EXCLAMATION_CIRCLE : Se.UPLOAD_CLOUD, n = (this.multiple ? t("design-system:fileUpload.instructions_plural") : t("design-system:fileUpload.instructions")).split("|");
967
- return /* @__PURE__ */ o("div", {
968
- "data-fragment": !0
969
- }, /* @__PURE__ */ o("div", {
970
- className: `${v}__content`
971
- }, this.processing ? /* @__PURE__ */ o("div", {
972
- "data-fragment": !0
973
- }, /* @__PURE__ */ o("i", {
974
- className: "sps-spinner sps-spinner--medium",
975
- "aria-hidden": "true"
976
- }), /* @__PURE__ */ o("div", {
977
- className: `${v}__instructions`
978
- }, t("design-system:fileUpload.processing"))) : /* @__PURE__ */ o("div", {
979
- "data-fragment": !0
980
- }, /* @__PURE__ */ o("i", {
981
- className: `sps-icon sps-icon-${s} ${v}__icon-primary`,
982
- "aria-hidden": "true"
983
- }), /* @__PURE__ */ o("div", {
984
- className: `${v}__title`
985
- }, this.error ? /* @__PURE__ */ o("div", {
986
- "data-fragment": !0
987
- }, t(
967
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", { className: `${v}__content` }, this.processing ? /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("i", { className: "sps-spinner sps-spinner--medium", "aria-hidden": "true" }), /* @__PURE__ */ o("div", { className: `${v}__instructions` }, t("design-system:fileUpload.processing"))) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${s} ${v}__icon-primary`, "aria-hidden": "true" }), /* @__PURE__ */ o("div", { className: `${v}__title` }, this.error ? /* @__PURE__ */ o("div", { "data-fragment": !0 }, t(
988
968
  this.namesOfUnsupportedFiles.length > 1 ? "design-system:fileUpload.cancelled_plural" : "design-system:fileUpload.cancelled"
989
- )) : /* @__PURE__ */ o("div", {
990
- "data-fragment": !0
991
- }, t("design-system:fileUpload.title", { description: this.description }))), this.error ? /* @__PURE__ */ o("div", {
992
- className: `${v}__errored-files`
993
- }, new Set(this.namesOfUnsupportedFiles.map((i, r) => {
969
+ )) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, t("design-system:fileUpload.title", { description: this.description }))), this.error ? /* @__PURE__ */ o("div", { className: `${v}__errored-files` }, new Set(this.namesOfUnsupportedFiles.map((i, r) => {
994
970
  const l = Math.floor(i.length / 2);
995
- return /* @__PURE__ */ o("div", {
996
- className: `${v}__errored-filename`,
997
- key: i
998
- }, /* @__PURE__ */ o("span", {
999
- className: `${v}__errored-filename-segment`
1000
- }, i.substr(0, l)), /* @__PURE__ */ o("div", {
1001
- className: `${v}__errored-filename-segment`
1002
- }, /* @__PURE__ */ o("span", null, i.substr(l))), r < this.namesOfUnsupportedFiles.length - 1 ? "," : "");
1003
- }))) : /* @__PURE__ */ o("span", null), /* @__PURE__ */ o("div", {
1004
- className: `${v}__instructions`
1005
- }, /* @__PURE__ */ o("div", {
1006
- "data-fragment": !0
1007
- }, /* @__PURE__ */ o("span", null, n[0]), /* @__PURE__ */ o("a", {
1008
- href: "",
1009
- onClick: this.handleBrowseLinkClick
1010
- }, n[1]), /* @__PURE__ */ o("span", null, n[2]))), /* @__PURE__ */ o("div", {
1011
- className: `${v}__requirements`
1012
- }, this.acceptExtensions ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.acceptedTypes", { fileTypes: this.acceptExtensionsDescription }), " ", ")") : "", this.maxSize ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.maximumSize", { size: this.maxSize }), " ", ")") : "", this.customRequirement ? /* @__PURE__ */ o("span", null, " ", this.customRequirement, " ") : ""), this.downloadLabel && /* @__PURE__ */ o("div", {
1013
- className: `sps-button sps-button--link ${v}__download-button`,
1014
- onClick: this.handleDownloadButtonClick
1015
- }, /* @__PURE__ */ o("button", {
1016
- type: "button"
1017
- }, /* @__PURE__ */ o("i", {
1018
- className: "sps-icon sps-icon-download-cloud",
1019
- "aria-hidden": "true"
1020
- }), " ", this.downloadLabel)))), this.dismissable && !this.processing && /* @__PURE__ */ o("div", {
1021
- className: `sps-button sps-button--icon ${v}__close-button`,
1022
- onClick: this.dismiss
1023
- }, /* @__PURE__ */ o("button", {
1024
- type: "button",
1025
- title: t("design-system:fileUpload.close")
1026
- }, /* @__PURE__ */ o("i", {
1027
- className: "sps-icon sps-icon-x",
1028
- "aria-hidden": "true"
1029
- }))), /* @__PURE__ */ o("form", null, /* @__PURE__ */ o("input", {
1030
- type: "file",
1031
- accept: this.accept || "*/*",
1032
- multiple: this.multiple || null,
1033
- onChange: this.handleFileInputChange
1034
- })));
971
+ return /* @__PURE__ */ o("div", { className: `${v}__errored-filename`, key: i }, /* @__PURE__ */ o("span", { className: `${v}__errored-filename-segment` }, i.substr(0, l)), /* @__PURE__ */ o("div", { className: `${v}__errored-filename-segment` }, /* @__PURE__ */ o("span", null, i.substr(l))), r < this.namesOfUnsupportedFiles.length - 1 ? "," : "");
972
+ }))) : /* @__PURE__ */ o("span", null), /* @__PURE__ */ o("div", { className: `${v}__instructions` }, /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("span", null, n[0]), /* @__PURE__ */ o("a", { href: "", onClick: this.handleBrowseLinkClick }, n[1]), /* @__PURE__ */ o("span", null, n[2]))), /* @__PURE__ */ o("div", { className: `${v}__requirements` }, this.acceptExtensions ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.acceptedTypes", { fileTypes: this.acceptExtensionsDescription }), " ", ")") : "", this.maxSize ? /* @__PURE__ */ o("span", null, "(", " ", t("design-system:fileUpload.maximumSize", { size: this.maxSize }), " ", ")") : "", this.customRequirement ? /* @__PURE__ */ o("span", null, " ", this.customRequirement, " ") : ""), this.downloadLabel && /* @__PURE__ */ o(
973
+ "div",
974
+ {
975
+ className: `sps-button sps-button--link ${v}__download-button`,
976
+ onClick: this.handleDownloadButtonClick
977
+ },
978
+ /* @__PURE__ */ o("button", { type: "button" }, /* @__PURE__ */ o("i", { className: "sps-icon sps-icon-download-cloud", "aria-hidden": "true" }), " ", this.downloadLabel)
979
+ ))), this.dismissable && !this.processing && /* @__PURE__ */ o(
980
+ "div",
981
+ {
982
+ className: `sps-button sps-button--icon ${v}__close-button`,
983
+ onClick: this.dismiss
984
+ },
985
+ /* @__PURE__ */ o("button", { type: "button", title: t("design-system:fileUpload.close") }, /* @__PURE__ */ o("i", { className: "sps-icon sps-icon-x", "aria-hidden": "true" }))
986
+ ), /* @__PURE__ */ o("form", null, /* @__PURE__ */ o(
987
+ "input",
988
+ {
989
+ type: "file",
990
+ accept: this.accept || "*/*",
991
+ multiple: this.multiple || null,
992
+ onChange: this.handleFileInputChange
993
+ }
994
+ )));
1035
995
  }
1036
996
  parseAndValidateMaxSize(t) {
1037
997
  try {
@@ -1500,35 +1460,19 @@ let y = (G = class extends HTMLElement {
1500
1460
  ];
1501
1461
  }
1502
1462
  render({ t }) {
1503
- const s = /* @__PURE__ */ o("div", {
1504
- className: `${_}__metric-count`
1505
- }, this.metric), n = /* @__PURE__ */ o("div", {
1506
- className: `${_}__description`
1507
- }, /* @__PURE__ */ o("div", {
1508
- className: `${_}__title`,
1509
- style: { "-webkit-box-orient": "vertical" }
1510
- }, this.title), /* @__PURE__ */ o("div", {
1511
- className: `${_}__detail`
1512
- }, this.content)), i = this.partnercount, r = this.totalpartners, [
1463
+ const s = /* @__PURE__ */ o("div", { className: `${_}__metric-count` }, this.metric), n = /* @__PURE__ */ o("div", { className: `${_}__description` }, /* @__PURE__ */ o(
1464
+ "div",
1465
+ {
1466
+ className: `${_}__title`,
1467
+ style: { "-webkit-box-orient": "vertical" }
1468
+ },
1469
+ this.title
1470
+ ), /* @__PURE__ */ o("div", { className: `${_}__detail` }, this.content)), i = this.partnercount, r = this.totalpartners, [
1513
1471
  l,
1514
1472
  d,
1515
1473
  g
1516
1474
  ] = (i ? t("design-system:insightCard.partnerCount", { count: i, total: r }) : "").split("|");
1517
- return /* @__PURE__ */ o("div", {
1518
- "data-fragment": !0
1519
- }, /* @__PURE__ */ o("div", {
1520
- className: `${_}__body`
1521
- }, this.icon ? /* @__PURE__ */ o("i", {
1522
- className: `sps-icon sps-icon-${this.icon}`
1523
- }) : /* @__PURE__ */ o("i", {
1524
- className: `sps-icon sps-icon-${lt[this.kind]}`
1525
- }), s, n), i && /* @__PURE__ */ o("div", {
1526
- className: `${_}__partner-count`
1527
- }, i === r ? /* @__PURE__ */ o("div", null, t("design-system:insightCard.all")) : /* @__PURE__ */ o("div", {
1528
- "data-fragment": !0
1529
- }, /* @__PURE__ */ o("div", null, l), /* @__PURE__ */ o("div", null, d), /* @__PURE__ */ o("div", null, g)), /* @__PURE__ */ o("div", {
1530
- className: `${_}__partners-text`
1531
- }, t("design-system:insightCard.partners"))));
1475
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", { className: `${_}__body` }, this.icon ? /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.icon}` }) : /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${lt[this.kind]}` }), s, n), i && /* @__PURE__ */ o("div", { className: `${_}__partner-count` }, i === r ? /* @__PURE__ */ o("div", null, t("design-system:insightCard.all")) : /* @__PURE__ */ o("div", { "data-fragment": !0 }, /* @__PURE__ */ o("div", null, l), /* @__PURE__ */ o("div", null, d), /* @__PURE__ */ o("div", null, g)), /* @__PURE__ */ o("div", { className: `${_}__partners-text` }, t("design-system:insightCard.partners"))));
1532
1476
  }
1533
1477
  }, a(G, "displayName", _), a(G, "props", {
1534
1478
  icon: "SpsIcon",
@@ -1598,14 +1542,7 @@ let te = (X = class extends HTMLElement {
1598
1542
  this.showAdditionalInsights = !this.showAdditionalInsights, this.update();
1599
1543
  }
1600
1544
  render() {
1601
- return /* @__PURE__ */ o("div", {
1602
- "data-fragment": !0
1603
- }, this.content, this.content.length > 10 && /* @__PURE__ */ o("div", {
1604
- className: "sps-button sps-button--link",
1605
- onClick: this.toggleAdditionalInsights
1606
- }, /* @__PURE__ */ o("button", {
1607
- type: "button"
1608
- }, this.showAdditionalInsights ? "Hide " : "Show ", "Additional Insights")));
1545
+ return /* @__PURE__ */ o("div", { "data-fragment": !0 }, this.content, this.content.length > 10 && /* @__PURE__ */ o("div", { className: "sps-button sps-button--link", onClick: this.toggleAdditionalInsights }, /* @__PURE__ */ o("button", { type: "button" }, this.showAdditionalInsights ? "Hide " : "Show ", "Additional Insights")));
1609
1546
  }
1610
1547
  }, a(X, "displayName", D), a(X, "props", {}), X);
1611
1548
  ye([
@@ -1972,16 +1909,7 @@ let P = (K = class extends HTMLElement {
1972
1909
  ];
1973
1910
  }
1974
1911
  render() {
1975
- return /* @__PURE__ */ o("a", {
1976
- href: this.href,
1977
- target: this.target,
1978
- className: "sps-tabbed-nav__nav-item-link",
1979
- tabIndex: 0
1980
- }, this.icon && /* @__PURE__ */ o("i", {
1981
- className: `sps-icon sps-icon-${this.icon}`
1982
- }), this.label && /* @__PURE__ */ o("span", null, this.label), this.tag && /* @__PURE__ */ o("span", {
1983
- className: "sps-tag sps-tag--default"
1984
- }, this.tag));
1912
+ return /* @__PURE__ */ o("a", { href: this.href, target: this.target, className: "sps-tabbed-nav__nav-item-link", tabIndex: 0 }, this.icon && /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.icon}` }), this.label && /* @__PURE__ */ o("span", null, this.label), this.tag && /* @__PURE__ */ o("span", { className: "sps-tag sps-tag--default" }, this.tag));
1985
1913
  }
1986
1914
  }, a(K, "displayName", "sps-nav-tab"), a(K, "props", {
1987
1915
  active: "boolean",
@@ -2023,9 +1951,7 @@ let ue = (Q = class extends HTMLElement {
2023
1951
  a(this, "content", []);
2024
1952
  }
2025
1953
  render() {
2026
- return /* @__PURE__ */ o("nav", {
2027
- className: "sps-tabbed-nav"
2028
- }, this.content);
1954
+ return /* @__PURE__ */ o("nav", { className: "sps-tabbed-nav" }, this.content);
2029
1955
  }
2030
1956
  }, a(Q, "displayName", "sps-nav-tab-set"), a(Q, "props", {}), Q);
2031
1957
  st([
@@ -2129,12 +2055,7 @@ let A = (Z = class extends HTMLElement {
2129
2055
  this.waitForWidthInterval && window.clearInterval(this.waitForWidthInterval), this.waitForImgHeightInterval && window.clearInterval(this.waitForImgHeightInterval);
2130
2056
  }
2131
2057
  render() {
2132
- return this.src ? this.width ? /* @__PURE__ */ o("img", {
2133
- src: this.src,
2134
- alt: this.altText
2135
- }) : /* @__PURE__ */ o("span", null) : /* @__PURE__ */ o("i", {
2136
- className: `sps-icon sps-icon-${this.placeholderIcon}`
2137
- });
2058
+ return this.src ? this.width ? /* @__PURE__ */ o("img", { src: this.src, alt: this.altText }) : /* @__PURE__ */ o("span", null) : /* @__PURE__ */ o("i", { className: `sps-icon sps-icon-${this.placeholderIcon}` });
2138
2059
  }
2139
2060
  setWidth(t) {
2140
2061
  if (t && !this.width) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@spscommerce/ds-web-components",
3
3
  "description": "SPS Design System Native Web Components",
4
- "version": "8.2.2",
4
+ "version": "8.3.0",
5
5
  "author": "SPS Commerce",
6
6
  "license": "UNLICENSED",
7
7
  "repository": "https://github.com/spscommerce/woodland/tree/main/packages/@spscommerce/ds-web-components",
@@ -25,15 +25,15 @@
25
25
  },
26
26
  "peerDependencies": {
27
27
  "@spscommerce/utils": "^6.11.3",
28
- "@spscommerce/ds-shared": "8.2.2"
28
+ "@spscommerce/ds-shared": "8.3.0"
29
29
  },
30
30
  "devDependencies": {
31
31
  "@spscommerce/utils": "^6.12.1",
32
32
  "@testing-library/react": "^10.0.0",
33
33
  "react": "^16.9.0",
34
34
  "react-dom": "^16.9.0",
35
- "@spscommerce/ds-shared": "8.2.2",
36
- "test": "8.2.2"
35
+ "@spscommerce/ds-shared": "8.3.0",
36
+ "test": "8.3.0"
37
37
  },
38
38
  "scripts": {
39
39
  "build": "pnpm run build:js && pnpm run build:types && pnpm run build:create-dist && pnpm run build:copy-dist",