@phcdevworks/spectre-components 1.17.0 → 1.18.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 (116) hide show
  1. package/README.md +12 -6
  2. package/dist/alert.cjs.map +1 -1
  3. package/dist/alert.d.cts +2 -2
  4. package/dist/alert.d.ts +2 -2
  5. package/dist/alert.js.map +1 -1
  6. package/dist/avatar.cjs.map +1 -1
  7. package/dist/avatar.d.cts +2 -2
  8. package/dist/avatar.d.ts +2 -2
  9. package/dist/avatar.js.map +1 -1
  10. package/dist/badge.cjs +2 -1
  11. package/dist/badge.cjs.map +1 -1
  12. package/dist/badge.d.cts +2 -2
  13. package/dist/badge.d.ts +2 -2
  14. package/dist/badge.js +2 -1
  15. package/dist/badge.js.map +1 -1
  16. package/dist/button.cjs +2 -1
  17. package/dist/button.cjs.map +1 -1
  18. package/dist/button.d.cts +2 -2
  19. package/dist/button.d.ts +2 -2
  20. package/dist/button.js +2 -1
  21. package/dist/button.js.map +1 -1
  22. package/dist/card.cjs +21 -3
  23. package/dist/card.cjs.map +1 -1
  24. package/dist/card.d.cts +7 -6
  25. package/dist/card.d.ts +7 -6
  26. package/dist/card.js +21 -3
  27. package/dist/card.js.map +1 -1
  28. package/dist/container.cjs.map +1 -1
  29. package/dist/container.d.cts +2 -2
  30. package/dist/container.d.ts +2 -2
  31. package/dist/container.js.map +1 -1
  32. package/dist/dropdown.cjs.map +1 -1
  33. package/dist/dropdown.d.cts +2 -2
  34. package/dist/dropdown.d.ts +2 -2
  35. package/dist/dropdown.js.map +1 -1
  36. package/dist/footer.cjs.map +1 -1
  37. package/dist/footer.js.map +1 -1
  38. package/dist/{form-CVRAWo0Q.d.cts → form-TvtLcoW0.d.cts} +6 -4
  39. package/dist/{form-CVRAWo0Q.d.ts → form-TvtLcoW0.d.ts} +6 -4
  40. package/dist/grid.cjs +49 -0
  41. package/dist/grid.cjs.map +1 -1
  42. package/dist/grid.d.cts +10 -2
  43. package/dist/grid.d.ts +10 -2
  44. package/dist/grid.js +49 -0
  45. package/dist/grid.js.map +1 -1
  46. package/dist/icon-box.cjs.map +1 -1
  47. package/dist/icon-box.d.cts +2 -2
  48. package/dist/icon-box.d.ts +2 -2
  49. package/dist/icon-box.js.map +1 -1
  50. package/dist/index.cjs +77 -6
  51. package/dist/index.cjs.map +1 -1
  52. package/dist/index.d.cts +1 -1
  53. package/dist/index.d.ts +1 -1
  54. package/dist/index.js +77 -6
  55. package/dist/index.js.map +1 -1
  56. package/dist/input.cjs.map +1 -1
  57. package/dist/input.d.cts +2 -2
  58. package/dist/input.d.ts +2 -2
  59. package/dist/input.js.map +1 -1
  60. package/dist/nav-item.cjs.map +1 -1
  61. package/dist/nav-item.d.cts +1 -1
  62. package/dist/nav-item.d.ts +1 -1
  63. package/dist/nav-item.js.map +1 -1
  64. package/dist/nav.cjs.map +1 -1
  65. package/dist/nav.d.cts +1 -1
  66. package/dist/nav.d.ts +1 -1
  67. package/dist/nav.js.map +1 -1
  68. package/dist/rating.cjs.map +1 -1
  69. package/dist/rating.d.cts +2 -2
  70. package/dist/rating.d.ts +2 -2
  71. package/dist/rating.js.map +1 -1
  72. package/dist/section.cjs.map +1 -1
  73. package/dist/section.js.map +1 -1
  74. package/dist/select.cjs.map +1 -1
  75. package/dist/select.d.cts +1 -1
  76. package/dist/select.d.ts +1 -1
  77. package/dist/select.js.map +1 -1
  78. package/dist/sidebar-link.cjs.map +1 -1
  79. package/dist/sidebar-link.d.cts +1 -1
  80. package/dist/sidebar-link.d.ts +1 -1
  81. package/dist/sidebar-link.js.map +1 -1
  82. package/dist/spinner.cjs.map +1 -1
  83. package/dist/spinner.d.cts +2 -2
  84. package/dist/spinner.d.ts +2 -2
  85. package/dist/spinner.js.map +1 -1
  86. package/dist/stack.cjs.map +1 -1
  87. package/dist/stack.d.cts +2 -2
  88. package/dist/stack.d.ts +2 -2
  89. package/dist/stack.js.map +1 -1
  90. package/dist/tag.cjs.map +1 -1
  91. package/dist/tag.d.cts +2 -2
  92. package/dist/tag.d.ts +2 -2
  93. package/dist/tag.js.map +1 -1
  94. package/dist/testimonial.cjs.map +1 -1
  95. package/dist/testimonial.d.cts +2 -2
  96. package/dist/testimonial.d.ts +2 -2
  97. package/dist/testimonial.js.map +1 -1
  98. package/dist/text.cjs +3 -1
  99. package/dist/text.cjs.map +1 -1
  100. package/dist/text.d.cts +2 -2
  101. package/dist/text.d.ts +2 -2
  102. package/dist/text.js +3 -1
  103. package/dist/text.js.map +1 -1
  104. package/dist/textarea.cjs.map +1 -1
  105. package/dist/textarea.d.cts +1 -1
  106. package/dist/textarea.d.ts +1 -1
  107. package/dist/textarea.js.map +1 -1
  108. package/dist/toast.cjs.map +1 -1
  109. package/dist/toast.d.cts +2 -2
  110. package/dist/toast.d.ts +2 -2
  111. package/dist/toast.js.map +1 -1
  112. package/dist/tooltip.cjs.map +1 -1
  113. package/dist/tooltip.d.cts +2 -2
  114. package/dist/tooltip.d.ts +2 -2
  115. package/dist/tooltip.js.map +1 -1
  116. package/package.json +9 -9
package/dist/index.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- export { S as SpectreAlertSize, a as SpectreAlertVariant, b as SpectreAvatarShape, c as SpectreAvatarSize, S as SpectreBadgeSize, d as SpectreBadgeVariant, S as SpectreButtonSize, e as SpectreButtonType, f as SpectreButtonVariant, g as SpectreCardVariant, h as SpectreContainerMaxWidth, i as SpectreDropdownPlacement, j as SpectreGridAlign, k as SpectreGridColumns, l as SpectreGridGap, S as SpectreIconBoxSize, m as SpectreIconBoxVariant, S as SpectreInputSize, n as SpectreInputType, S as SpectreRatingSize, S as SpectreSpinnerSize, o as SpectreSpinnerVariant, p as SpectreStackAlign, q as SpectreStackBasis, r as SpectreStackDirection, s as SpectreStackGap, S as SpectreTagSize, t as SpectreTagVariant, u as SpectreTestimonialVariant, v as SpectreTextFamily, w as SpectreTextLevel, x as SpectreTextSize, y as SpectreTextVariant, z as SpectreToastVariant, A as SpectreTooltipPlacement, B as spectreAlertSizes, C as spectreAlertVariants, D as spectreAvatarShapes, E as spectreAvatarSizes, B as spectreBadgeSizes, F as spectreBadgeVariants, B as spectreButtonSizes, G as spectreButtonTypes, H as spectreButtonVariants, I as spectreCardVariants, J as spectreContainerMaxWidths, K as spectreDropdownPlacements, L as spectreGridAligns, M as spectreGridColumns, N as spectreGridGaps, B as spectreIconBoxSizes, O as spectreIconBoxVariants, B as spectreInputSizes, P as spectreInputTypes, B as spectreRatingSizes, B as spectreSpinnerSizes, Q as spectreSpinnerVariants, R as spectreStackAligns, T as spectreStackBases, U as spectreStackDirections, V as spectreStackGaps, B as spectreTagSizes, W as spectreTagVariants, X as spectreTestimonialVariants, Y as spectreTextFamilies, Z as spectreTextLevels, _ as spectreTextSizes, $ as spectreTextVariants, a0 as spectreToastVariants, a1 as spectreTooltipPlacements } from './form-CVRAWo0Q.cjs';
1
+ export { S as SpectreAlertSize, a as SpectreAlertVariant, b as SpectreAvatarShape, c as SpectreAvatarSize, S as SpectreBadgeSize, d as SpectreBadgeVariant, S as SpectreButtonSize, e as SpectreButtonType, f as SpectreButtonVariant, g as SpectreCardVariant, h as SpectreContainerMaxWidth, i as SpectreDropdownPlacement, j as SpectreGridAlign, k as SpectreGridColumns, l as SpectreGridGap, S as SpectreIconBoxSize, m as SpectreIconBoxVariant, S as SpectreInputSize, n as SpectreInputType, S as SpectreRatingSize, S as SpectreSpinnerSize, o as SpectreSpinnerVariant, p as SpectreStackAlign, q as SpectreStackBasis, r as SpectreStackDirection, s as SpectreStackGap, S as SpectreTagSize, t as SpectreTagVariant, u as SpectreTestimonialVariant, v as SpectreTextFamily, w as SpectreTextLevel, x as SpectreTextSize, y as SpectreTextVariant, z as SpectreToastVariant, A as SpectreTooltipPlacement, B as spectreAlertSizes, C as spectreAlertVariants, D as spectreAvatarShapes, E as spectreAvatarSizes, B as spectreBadgeSizes, F as spectreBadgeVariants, B as spectreButtonSizes, G as spectreButtonTypes, H as spectreButtonVariants, I as spectreCardVariants, J as spectreContainerMaxWidths, K as spectreDropdownPlacements, L as spectreGridAligns, M as spectreGridColumns, N as spectreGridGaps, B as spectreIconBoxSizes, O as spectreIconBoxVariants, B as spectreInputSizes, P as spectreInputTypes, B as spectreRatingSizes, B as spectreSpinnerSizes, Q as spectreSpinnerVariants, R as spectreStackAligns, T as spectreStackBases, U as spectreStackDirections, V as spectreStackGaps, B as spectreTagSizes, W as spectreTagVariants, X as spectreTestimonialVariants, Y as spectreTextFamilies, Z as spectreTextLevels, _ as spectreTextSizes, $ as spectreTextVariants, a0 as spectreToastVariants, a1 as spectreTooltipPlacements } from './form-TvtLcoW0.cjs';
2
2
  export { SpectreButtonElement, SpectreButtonProps, SpectreButtonTarget, defineSpectreButton } from './button.cjs';
3
3
  export { SpectreInputElement, SpectreInputProps, defineSpectreInput } from './input.cjs';
4
4
  export { SpectreTextareaElement, SpectreTextareaProps, defineSpectreTextarea } from './textarea.cjs';
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { S as SpectreAlertSize, a as SpectreAlertVariant, b as SpectreAvatarShape, c as SpectreAvatarSize, S as SpectreBadgeSize, d as SpectreBadgeVariant, S as SpectreButtonSize, e as SpectreButtonType, f as SpectreButtonVariant, g as SpectreCardVariant, h as SpectreContainerMaxWidth, i as SpectreDropdownPlacement, j as SpectreGridAlign, k as SpectreGridColumns, l as SpectreGridGap, S as SpectreIconBoxSize, m as SpectreIconBoxVariant, S as SpectreInputSize, n as SpectreInputType, S as SpectreRatingSize, S as SpectreSpinnerSize, o as SpectreSpinnerVariant, p as SpectreStackAlign, q as SpectreStackBasis, r as SpectreStackDirection, s as SpectreStackGap, S as SpectreTagSize, t as SpectreTagVariant, u as SpectreTestimonialVariant, v as SpectreTextFamily, w as SpectreTextLevel, x as SpectreTextSize, y as SpectreTextVariant, z as SpectreToastVariant, A as SpectreTooltipPlacement, B as spectreAlertSizes, C as spectreAlertVariants, D as spectreAvatarShapes, E as spectreAvatarSizes, B as spectreBadgeSizes, F as spectreBadgeVariants, B as spectreButtonSizes, G as spectreButtonTypes, H as spectreButtonVariants, I as spectreCardVariants, J as spectreContainerMaxWidths, K as spectreDropdownPlacements, L as spectreGridAligns, M as spectreGridColumns, N as spectreGridGaps, B as spectreIconBoxSizes, O as spectreIconBoxVariants, B as spectreInputSizes, P as spectreInputTypes, B as spectreRatingSizes, B as spectreSpinnerSizes, Q as spectreSpinnerVariants, R as spectreStackAligns, T as spectreStackBases, U as spectreStackDirections, V as spectreStackGaps, B as spectreTagSizes, W as spectreTagVariants, X as spectreTestimonialVariants, Y as spectreTextFamilies, Z as spectreTextLevels, _ as spectreTextSizes, $ as spectreTextVariants, a0 as spectreToastVariants, a1 as spectreTooltipPlacements } from './form-CVRAWo0Q.js';
1
+ export { S as SpectreAlertSize, a as SpectreAlertVariant, b as SpectreAvatarShape, c as SpectreAvatarSize, S as SpectreBadgeSize, d as SpectreBadgeVariant, S as SpectreButtonSize, e as SpectreButtonType, f as SpectreButtonVariant, g as SpectreCardVariant, h as SpectreContainerMaxWidth, i as SpectreDropdownPlacement, j as SpectreGridAlign, k as SpectreGridColumns, l as SpectreGridGap, S as SpectreIconBoxSize, m as SpectreIconBoxVariant, S as SpectreInputSize, n as SpectreInputType, S as SpectreRatingSize, S as SpectreSpinnerSize, o as SpectreSpinnerVariant, p as SpectreStackAlign, q as SpectreStackBasis, r as SpectreStackDirection, s as SpectreStackGap, S as SpectreTagSize, t as SpectreTagVariant, u as SpectreTestimonialVariant, v as SpectreTextFamily, w as SpectreTextLevel, x as SpectreTextSize, y as SpectreTextVariant, z as SpectreToastVariant, A as SpectreTooltipPlacement, B as spectreAlertSizes, C as spectreAlertVariants, D as spectreAvatarShapes, E as spectreAvatarSizes, B as spectreBadgeSizes, F as spectreBadgeVariants, B as spectreButtonSizes, G as spectreButtonTypes, H as spectreButtonVariants, I as spectreCardVariants, J as spectreContainerMaxWidths, K as spectreDropdownPlacements, L as spectreGridAligns, M as spectreGridColumns, N as spectreGridGaps, B as spectreIconBoxSizes, O as spectreIconBoxVariants, B as spectreInputSizes, P as spectreInputTypes, B as spectreRatingSizes, B as spectreSpinnerSizes, Q as spectreSpinnerVariants, R as spectreStackAligns, T as spectreStackBases, U as spectreStackDirections, V as spectreStackGaps, B as spectreTagSizes, W as spectreTagVariants, X as spectreTestimonialVariants, Y as spectreTextFamilies, Z as spectreTextLevels, _ as spectreTextSizes, $ as spectreTextVariants, a0 as spectreToastVariants, a1 as spectreTooltipPlacements } from './form-TvtLcoW0.js';
2
2
  export { SpectreButtonElement, SpectreButtonProps, SpectreButtonTarget, defineSpectreButton } from './button.js';
3
3
  export { SpectreInputElement, SpectreInputProps, defineSpectreInput } from './input.js';
4
4
  export { SpectreTextareaElement, SpectreTextareaProps, defineSpectreTextarea } from './textarea.js';
package/dist/index.js CHANGED
@@ -16,7 +16,8 @@ var spectreButtonVariants = [
16
16
  "danger",
17
17
  "success",
18
18
  "cta",
19
- "accent"
19
+ "accent",
20
+ "inverse"
20
21
  ];
21
22
  function isButtonVariant(value) {
22
23
  return spectreButtonVariants.includes(value);
@@ -53,7 +54,8 @@ var spectreBadgeVariants = [
53
54
  "ghost",
54
55
  "outline",
55
56
  "accent",
56
- "cta"
57
+ "cta",
58
+ "inverse"
57
59
  ];
58
60
  function isBadgeVariant(value) {
59
61
  return spectreBadgeVariants.includes(value);
@@ -77,6 +79,12 @@ var spectreCardVariants = [
77
79
  function isCardVariant(value) {
78
80
  return spectreCardVariants.includes(value);
79
81
  }
82
+ var spectreCardPaddingSizes = ["sm", "md", "lg"];
83
+ function isCardPaddingSize(value) {
84
+ return spectreCardPaddingSizes.includes(
85
+ value
86
+ );
87
+ }
80
88
  var spectreIconBoxVariants = [
81
89
  "primary",
82
90
  "secondary",
@@ -371,7 +379,9 @@ var spectreTextVariants = [
371
379
  "muted",
372
380
  "subtle",
373
381
  "meta",
374
- "brand"
382
+ "brand",
383
+ "onInverse",
384
+ "onInverseMuted"
375
385
  ];
376
386
  function isTextVariant(value) {
377
387
  return spectreTextVariants.includes(value);
@@ -2058,10 +2068,22 @@ function defineSpectreBadge(tagName = "sp-badge") {
2058
2068
  }
2059
2069
  var paddedConverter = {
2060
2070
  fromAttribute(value) {
2061
- return value !== "false";
2071
+ if (value === "false") {
2072
+ return false;
2073
+ }
2074
+ if (value != null && isCardPaddingSize(value)) {
2075
+ return value;
2076
+ }
2077
+ return true;
2062
2078
  },
2063
2079
  toAttribute(value) {
2064
- return value ? null : "false";
2080
+ if (value === false) {
2081
+ return "false";
2082
+ }
2083
+ if (value === true) {
2084
+ return null;
2085
+ }
2086
+ return value;
2065
2087
  }
2066
2088
  };
2067
2089
  var SpectreCardElement = class extends SpectreProjectableElement {
@@ -2110,7 +2132,7 @@ var SpectreCardElement = class extends SpectreProjectableElement {
2110
2132
  if (changedProperties.has("loading") && this.loading == null) {
2111
2133
  this.loading = false;
2112
2134
  }
2113
- if (changedProperties.has("padded") && this.padded == null) {
2135
+ if (changedProperties.has("padded") && (this.padded == null || typeof this.padded !== "boolean" && !isCardPaddingSize(this.padded))) {
2114
2136
  this.padded = true;
2115
2137
  }
2116
2138
  if (changedProperties.has("variant") && (this.variant == null || !isCardVariant(this.variant))) {
@@ -2999,6 +3021,7 @@ var SpectreGridElement = class extends SpectreProjectableElement {
2999
3021
  this.innerClass = void 0;
3000
3022
  this.leadingTracks = void 0;
3001
3023
  this.rowGap = void 0;
3024
+ this._role = null;
3002
3025
  }
3003
3026
  get id() {
3004
3027
  return super.id;
@@ -3012,9 +3035,56 @@ var SpectreGridElement = class extends SpectreProjectableElement {
3012
3035
  set title(value) {
3013
3036
  super.title = value;
3014
3037
  }
3038
+ get role() {
3039
+ return this._role;
3040
+ }
3041
+ set role(value) {
3042
+ const normalizedValue = value?.trim() || null;
3043
+ if (this._role === normalizedValue) {
3044
+ return;
3045
+ }
3046
+ this._role = normalizedValue;
3047
+ if (HTMLElement.prototype.hasAttribute.call(this, "role")) {
3048
+ HTMLElement.prototype.removeAttribute.call(this, "role");
3049
+ }
3050
+ this.requestUpdate();
3051
+ }
3052
+ getAttribute(qualifiedName) {
3053
+ if (qualifiedName === "role") {
3054
+ return this.role;
3055
+ }
3056
+ return super.getAttribute(qualifiedName);
3057
+ }
3058
+ hasAttribute(qualifiedName) {
3059
+ if (qualifiedName === "role") {
3060
+ return this.role !== null;
3061
+ }
3062
+ return super.hasAttribute(qualifiedName);
3063
+ }
3064
+ setAttribute(qualifiedName, value) {
3065
+ if (qualifiedName === "role") {
3066
+ this.role = value;
3067
+ return;
3068
+ }
3069
+ super.setAttribute(qualifiedName, value);
3070
+ }
3071
+ removeAttribute(qualifiedName) {
3072
+ if (qualifiedName === "role") {
3073
+ this.role = null;
3074
+ return;
3075
+ }
3076
+ super.removeAttribute(qualifiedName);
3077
+ }
3015
3078
  connectedCallback() {
3016
3079
  var _a;
3080
+ const initialRole = HTMLElement.prototype.getAttribute.call(this, "role");
3081
+ if (initialRole !== null) {
3082
+ HTMLElement.prototype.removeAttribute.call(this, "role");
3083
+ }
3017
3084
  super.connectedCallback();
3085
+ if (initialRole !== null) {
3086
+ this.role = initialRole;
3087
+ }
3018
3088
  (_a = this.style).display || (_a.display = "block");
3019
3089
  }
3020
3090
  getContentContainer() {
@@ -3114,6 +3184,7 @@ var SpectreGridElement = class extends SpectreProjectableElement {
3114
3184
  class="${this.gridClasses}"
3115
3185
  data-sp-grid-native
3116
3186
  id="${ifDefined(this.id || void 0)}"
3187
+ role="${ifDefined(this.role ?? void 0)}"
3117
3188
  title="${ifDefined(this.title || void 0)}"
3118
3189
  >
3119
3190
  ${this.hasProjectedContent ? this.projectedContent : nothing}