@getflip/swirl-components 0.371.0 → 0.373.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.
package/components.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2025-08-28T13:09:18",
2
+ "timestamp": "2025-09-01T14:17:56",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.35.0",
@@ -59247,13 +59247,7 @@
59247
59247
  "attr": "allow-html",
59248
59248
  "reflectToAttr": false,
59249
59249
  "docs": "",
59250
- "docsTags": [
59251
- {
59252
- "name": "default",
59253
- "text": "true"
59254
- }
59255
- ],
59256
- "default": "true",
59250
+ "docsTags": [],
59257
59251
  "values": [
59258
59252
  {
59259
59253
  "type": "boolean"
@@ -60949,10 +60943,10 @@
60949
60943
  "props": [
60950
60944
  {
60951
60945
  "name": "borderColor",
60952
- "type": "\"default\" | \"highlight\" | \"strong\"",
60946
+ "type": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
60953
60947
  "complexType": {
60954
60948
  "original": "SwirlSeparatorColor",
60955
- "resolved": "\"default\" | \"highlight\" | \"strong\"",
60949
+ "resolved": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
60956
60950
  "references": {
60957
60951
  "SwirlSeparatorColor": {
60958
60952
  "location": "local",
@@ -60973,6 +60967,10 @@
60973
60967
  ],
60974
60968
  "default": "\"default\"",
60975
60969
  "values": [
60970
+ {
60971
+ "value": "critical",
60972
+ "type": "string"
60973
+ },
60976
60974
  {
60977
60975
  "value": "default",
60978
60976
  "type": "string"
@@ -60993,10 +60991,10 @@
60993
60991
  },
60994
60992
  {
60995
60993
  "name": "color",
60996
- "type": "\"default\" | \"highlight\" | \"strong\"",
60994
+ "type": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
60997
60995
  "complexType": {
60998
60996
  "original": "SwirlSeparatorColor",
60999
- "resolved": "\"default\" | \"highlight\" | \"strong\"",
60997
+ "resolved": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
61000
60998
  "references": {
61001
60999
  "SwirlSeparatorColor": {
61002
61000
  "location": "local",
@@ -61017,6 +61015,10 @@
61017
61015
  ],
61018
61016
  "default": "\"default\"",
61019
61017
  "values": [
61018
+ {
61019
+ "value": "critical",
61020
+ "type": "string"
61021
+ },
61020
61022
  {
61021
61023
  "value": "default",
61022
61024
  "type": "string"
@@ -74949,7 +74951,7 @@
74949
74951
  "path": "src/components/swirl-action-list-item/swirl-action-list-item.tsx"
74950
74952
  },
74951
74953
  "src/components/swirl-separator/swirl-separator.tsx::SwirlSeparatorColor": {
74952
- "declaration": "export type SwirlSeparatorColor = \"default\" | \"strong\" | \"highlight\";",
74954
+ "declaration": "export type SwirlSeparatorColor =\n | \"critical\"\n | \"default\"\n | \"strong\"\n | \"highlight\";",
74953
74955
  "docstring": "",
74954
74956
  "path": "src/components/swirl-separator/swirl-separator.tsx"
74955
74957
  },
@@ -652,7 +652,6 @@ const SwirlResourceListItem = class {
652
652
  index.registerInstance(this, hostRef);
653
653
  this.toggleDrag = index.createEvent(this, "toggleDrag", 7);
654
654
  this.valueChange = index.createEvent(this, "valueChange", 7);
655
- this.allowHtml = true;
656
655
  this.checked = false;
657
656
  this.dragHandleDescription = "Press spacebar to toggle grab";
658
657
  this.dragHandleLabel = "Move item";
@@ -781,7 +780,7 @@ const SwirlResourceListItem = class {
781
780
  "resource-list-item--wrap-description": this.descriptionWrap,
782
781
  "resource-list-item--wrap-label": this.labelWrap,
783
782
  });
784
- return (index.h(index.Host, { key: '74c295778be2ba1f1d18172fe93ea8436d0ed609', role: hostRole }, index.h("div", { key: 'b7ac96248b20b6e705f605af9d754911fb53be95', class: className, role: containerRole }, index.h(Tag, { key: 'fe117a7a35e35d3074d5c8df032d58cb018a142b', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: '21210a04c7f96b3dc309a89535318e911afd351c', class: "resource-list-item__media" }, index.h("slot", { key: 'c326fac8899935452789fe8b14271c61175eba7d', name: "media" }))), index.h("span", { key: 'd9fcdfe21c54daeebe56669aadd07d828423272e', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: 'd9ad2ee46f279de7f50a2e86368e8bc3a7cd6428', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: '8b6be5351d9289daf137164aef0806dbd2f6e3d4', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '7f6790113baac9b15e4aef4e8dfd4098a7a213ac', class: "resource-list-item__meta" }, index.h("span", { key: 'e5e19cd610b66fceb249ff4ca675b3e9c6e61edb', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: '54f0b68d16992adf7f8585a0b2573404be0ecdef', class: "resource-list-item__badges" }, index.h("slot", { key: '759c9abe2507f47d41413868e38c63c8062cc432', name: "badges" }))))), this.selectable && (index.h("span", { key: '5c99be2c49bb6418ab48652e707df48b1b384b69', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: '9d0ad429053251757013feeb56effc4f3cb09991', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: '8ccbc8ac044db30a9001a6059b6eaa9ba5742841' }))))), index.h("span", { key: 'b1c571d422c5b60c4e92d37f8b95ef7c1fd6cc18', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: 'd47ebce7bc4897dd2e6b701f35fc1caa17e72fdd', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: 'c876093478e16507d50c80606194e0f8a3320952', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '350f845bcdb1103d03b36f8ccfb17287aeb13ef2', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: '5df7f8049ceabc364754514ccc48a01dd5e4bc99', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '95833ffeafba02439646e30624d19ae7a2f2b65d', size: this.iconSize })))));
783
+ return (index.h(index.Host, { key: 'b8481eecc40a6dd070c42494a31f6debaff66522', role: hostRole }, index.h("div", { key: '9dfc3c29180e7f0b78846e1e97c8a1ecaba1131f', class: className, role: containerRole }, index.h(Tag, { key: '6838cbd70ff00ac55051ce52473439856cfb13cb', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: '5662254d796a536bcf48f55f86071fa5a120a50d', class: "resource-list-item__media" }, index.h("slot", { key: '324351e57461e4123823bbf9a8e484b495d0c09e', name: "media" }))), index.h("span", { key: '53faafd305477c19782c9f9839dd0fc792980dff', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: '43d0540125d94f39a69f71466c4637d5cda94df5', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: '3286e25c32c367565b0e5f7f419c6eb41b87352e', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '4aff751fea343bca5616bc28bfd55cc5ff057d80', class: "resource-list-item__meta" }, index.h("span", { key: '2a96bdd8d54cbc0858aae4bc6d31110efab09e5c', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: '20b8a63e1f8f8f8f31b518c30577416e6a9d4ba1', class: "resource-list-item__badges" }, index.h("slot", { key: '1852d9de88bed5cafb0bfee67f1e0db5468d96e6', name: "badges" }))))), this.selectable && (index.h("span", { key: 'fd2f3cab9fde4745209e347e7d83ec77109ae68a', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: 'f013b3e5c2f6054878e4664a7db851cd8ac3f80d', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: '86b41a9c78e41d772fc7b55c8667056d73bc68a8' }))))), index.h("span", { key: 'dc07a0402d57fd9678f1aa141ae1f621fc1a3841', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: 'f9d82e70ca35fe5bfca3eaa108769a21faf94c46', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: 'eabf05103a4594a63aaf80eba1dab2bbb60538b3', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '16bca6dd134ceaa877bf6a681457145630b37c44', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: 'dbe58a92d77e6bcefeec84b06e862900c62db205', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '27815b58e2e8edbf2eeb2f80cb238a30029123f4', size: this.iconSize })))));
785
784
  }
786
785
  get el() { return index.getElement(this); }
787
786
  };
@@ -3,7 +3,7 @@
3
3
  var index = require('./index-DM-IG6w2.js');
4
4
  var index$1 = require('./index-DcAhLZUH.js');
5
5
 
6
- const swirlSeparatorCss = ":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-default)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}";
6
+ const swirlSeparatorCss = ":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-critical) .separator__line{background-color:var(--s-border-critical)}:host(.separator--color-critical) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-default)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}";
7
7
 
8
8
  const SwirlSeparator = class {
9
9
  constructor(hostRef) {
@@ -33,7 +33,7 @@ const SwirlSeparator = class {
33
33
  paddingLeft: `var(--s-space-${this.spacing})`,
34
34
  };
35
35
  const className = index$1.classnames("separator", `separator--color-${this.color}`, `separator--orientation-${this.orientation}`);
36
- return (index.h(index.Host, { key: '2bb244ed44ae203e950deeacf824108dd5dca113', "aria-orientation": this.orientation, class: className, role: "separator", style: styles }, index.h("span", { key: '88d7f7383d3083f70164fb93548835085e15ce20', class: "separator__line" }), this.label && (index.h(index.Fragment, { key: '8f7500a0c14d5bfee5c7cf62839dac69c6587013' }, index.h("span", { key: '4be755e74288cf1f298f8a4c52da1205104c8752', class: "separator__label" }, this.label), index.h("span", { key: '8f2296aa2bb0480a971480618f9765c1a967ea8d', class: "separator__line" })))));
36
+ return (index.h(index.Host, { key: '17b01a0eecb1f97564885965da64a90967730e14', "aria-orientation": this.orientation, class: className, role: "separator", style: styles }, index.h("span", { key: 'e9f7f71c5da01191f232455e8f5e6d9c39131a24', class: "separator__line" }), this.label && (index.h(index.Fragment, { key: '1f9f5c1d0b16766ed8677d7657946c335a5ab8ac' }, index.h("span", { key: 'ae1e1cc3149d5f0be42ea4be999cfda0fcfb6def', class: "separator__label" }, this.label), index.h("span", { key: '029ca069ba60923d67310941f464a92212e4fbd5', class: "separator__line" })))));
37
37
  }
38
38
  };
39
39
  SwirlSeparator.style = swirlSeparatorCss;
@@ -9,7 +9,6 @@ import { DesktopMediaQuery } from "../../services/media-query.service";
9
9
  */
10
10
  export class SwirlResourceListItem {
11
11
  constructor() {
12
- this.allowHtml = true;
13
12
  this.checked = false;
14
13
  this.dragHandleDescription = "Press spacebar to toggle grab";
15
14
  this.dragHandleLabel = "Move item";
@@ -138,7 +137,7 @@ export class SwirlResourceListItem {
138
137
  "resource-list-item--wrap-description": this.descriptionWrap,
139
138
  "resource-list-item--wrap-label": this.labelWrap,
140
139
  });
141
- return (h(Host, { key: '74c295778be2ba1f1d18172fe93ea8436d0ed609', role: hostRole }, h("div", { key: 'b7ac96248b20b6e705f605af9d754911fb53be95', class: className, role: containerRole }, h(Tag, { key: 'fe117a7a35e35d3074d5c8df032d58cb018a142b', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (h("span", { key: '21210a04c7f96b3dc309a89535318e911afd351c', class: "resource-list-item__media" }, h("slot", { key: 'c326fac8899935452789fe8b14271c61175eba7d', name: "media" }))), h("span", { key: 'd9fcdfe21c54daeebe56669aadd07d828423272e', class: "resource-list-item__label-container", style: labelContainerStyles }, h("span", { key: 'd9ad2ee46f279de7f50a2e86368e8bc3a7cd6428', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (h("span", { key: '8b6be5351d9289daf137164aef0806dbd2f6e3d4', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (h("span", { key: '7f6790113baac9b15e4aef4e8dfd4098a7a213ac', class: "resource-list-item__meta" }, h("span", { key: 'e5e19cd610b66fceb249ff4ca675b3e9c6e61edb', class: "resource-list-item__meta-text" }, this.meta), h("span", { key: '54f0b68d16992adf7f8585a0b2573404be0ecdef', class: "resource-list-item__badges" }, h("slot", { key: '759c9abe2507f47d41413868e38c63c8062cc432', name: "badges" }))))), this.selectable && (h("span", { key: '5c99be2c49bb6418ab48652e707df48b1b384b69', "aria-hidden": "true", class: "resource-list-item__checkbox" }, h("span", { key: '9d0ad429053251757013feeb56effc4f3cb09991', class: "resource-list-item__checkbox-icon" }, this.checked && (h("swirl-icon-check-strong", { key: '8ccbc8ac044db30a9001a6059b6eaa9ba5742841' }))))), h("span", { key: 'b1c571d422c5b60c4e92d37f8b95ef7c1fd6cc18', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, h("slot", { key: 'd47ebce7bc4897dd2e6b701f35fc1caa17e72fdd', name: "control" })), showMenu && (h("swirl-popover-trigger", { key: 'c876093478e16507d50c80606194e0f8a3320952', swirlPopover: this.menuTriggerId }, h("swirl-button", { key: '350f845bcdb1103d03b36f8ccfb17287aeb13ef2', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (h("button", { key: '5df7f8049ceabc364754514ccc48a01dd5e4bc99', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, h("swirl-icon-drag-handle", { key: '95833ffeafba02439646e30624d19ae7a2f2b65d', size: this.iconSize })))));
140
+ return (h(Host, { key: 'b8481eecc40a6dd070c42494a31f6debaff66522', role: hostRole }, h("div", { key: '9dfc3c29180e7f0b78846e1e97c8a1ecaba1131f', class: className, role: containerRole }, h(Tag, { key: '6838cbd70ff00ac55051ce52473439856cfb13cb', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (h("span", { key: '5662254d796a536bcf48f55f86071fa5a120a50d', class: "resource-list-item__media" }, h("slot", { key: '324351e57461e4123823bbf9a8e484b495d0c09e', name: "media" }))), h("span", { key: '53faafd305477c19782c9f9839dd0fc792980dff', class: "resource-list-item__label-container", style: labelContainerStyles }, h("span", { key: '43d0540125d94f39a69f71466c4637d5cda94df5', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (h("span", { key: '3286e25c32c367565b0e5f7f419c6eb41b87352e', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (h("span", { key: '4aff751fea343bca5616bc28bfd55cc5ff057d80', class: "resource-list-item__meta" }, h("span", { key: '2a96bdd8d54cbc0858aae4bc6d31110efab09e5c', class: "resource-list-item__meta-text" }, this.meta), h("span", { key: '20b8a63e1f8f8f8f31b518c30577416e6a9d4ba1', class: "resource-list-item__badges" }, h("slot", { key: '1852d9de88bed5cafb0bfee67f1e0db5468d96e6', name: "badges" }))))), this.selectable && (h("span", { key: 'fd2f3cab9fde4745209e347e7d83ec77109ae68a', "aria-hidden": "true", class: "resource-list-item__checkbox" }, h("span", { key: 'f013b3e5c2f6054878e4664a7db851cd8ac3f80d', class: "resource-list-item__checkbox-icon" }, this.checked && (h("swirl-icon-check-strong", { key: '86b41a9c78e41d772fc7b55c8667056d73bc68a8' }))))), h("span", { key: 'dc07a0402d57fd9678f1aa141ae1f621fc1a3841', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, h("slot", { key: 'f9d82e70ca35fe5bfca3eaa108769a21faf94c46', name: "control" })), showMenu && (h("swirl-popover-trigger", { key: 'eabf05103a4594a63aaf80eba1dab2bbb60538b3', swirlPopover: this.menuTriggerId }, h("swirl-button", { key: '16bca6dd134ceaa877bf6a681457145630b37c44', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (h("button", { key: 'dbe58a92d77e6bcefeec84b06e862900c62db205', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, h("swirl-icon-drag-handle", { key: '27815b58e2e8edbf2eeb2f80cb238a30029123f4', size: this.iconSize })))));
142
141
  }
143
142
  static get is() { return "swirl-resource-list-item"; }
144
143
  static get encapsulation() { return "scoped"; }
@@ -209,8 +208,7 @@ export class SwirlResourceListItem {
209
208
  },
210
209
  "getter": false,
211
210
  "setter": false,
212
- "reflect": false,
213
- "defaultValue": "true"
211
+ "reflect": false
214
212
  },
215
213
  "checked": {
216
214
  "type": "boolean",
@@ -21,6 +21,14 @@
21
21
  min-height: 1.125rem;
22
22
  }
23
23
 
24
+ :host(.separator--color-critical) .separator__line {
25
+ background-color: var(--s-border-critical);
26
+ }
27
+
28
+ :host(.separator--color-critical) .separator__label {
29
+ color: var(--s-text-subdued);
30
+ }
31
+
24
32
  :host(.separator--color-strong) .separator__line {
25
33
  background-color: var(--s-border-strong);
26
34
  }
@@ -27,7 +27,7 @@ export class SwirlSeparator {
27
27
  paddingLeft: `var(--s-space-${this.spacing})`,
28
28
  };
29
29
  const className = classnames("separator", `separator--color-${this.color}`, `separator--orientation-${this.orientation}`);
30
- return (h(Host, { key: '2bb244ed44ae203e950deeacf824108dd5dca113', "aria-orientation": this.orientation, class: className, role: "separator", style: styles }, h("span", { key: '88d7f7383d3083f70164fb93548835085e15ce20', class: "separator__line" }), this.label && (h(Fragment, { key: '8f7500a0c14d5bfee5c7cf62839dac69c6587013' }, h("span", { key: '4be755e74288cf1f298f8a4c52da1205104c8752', class: "separator__label" }, this.label), h("span", { key: '8f2296aa2bb0480a971480618f9765c1a967ea8d', class: "separator__line" })))));
30
+ return (h(Host, { key: '17b01a0eecb1f97564885965da64a90967730e14', "aria-orientation": this.orientation, class: className, role: "separator", style: styles }, h("span", { key: 'e9f7f71c5da01191f232455e8f5e6d9c39131a24', class: "separator__line" }), this.label && (h(Fragment, { key: '1f9f5c1d0b16766ed8677d7657946c335a5ab8ac' }, h("span", { key: 'ae1e1cc3149d5f0be42ea4be999cfda0fcfb6def', class: "separator__label" }, this.label), h("span", { key: '029ca069ba60923d67310941f464a92212e4fbd5', class: "separator__line" })))));
31
31
  }
32
32
  static get is() { return "swirl-separator"; }
33
33
  static get encapsulation() { return "shadow"; }
@@ -49,7 +49,7 @@ export class SwirlSeparator {
49
49
  "mutable": false,
50
50
  "complexType": {
51
51
  "original": "SwirlSeparatorColor",
52
- "resolved": "\"default\" | \"highlight\" | \"strong\"",
52
+ "resolved": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
53
53
  "references": {
54
54
  "SwirlSeparatorColor": {
55
55
  "location": "local",
@@ -75,7 +75,7 @@ export class SwirlSeparator {
75
75
  "mutable": true,
76
76
  "complexType": {
77
77
  "original": "SwirlSeparatorColor",
78
- "resolved": "\"default\" | \"highlight\" | \"strong\"",
78
+ "resolved": "\"critical\" | \"default\" | \"highlight\" | \"strong\"",
79
79
  "references": {
80
80
  "SwirlSeparatorColor": {
81
81
  "location": "local",