@getflip/swirl-components 0.388.0 → 0.389.1

package/dist/collection/components/swirl-separator/swirl-separator.js

@@ -5,6 +5,7 @@ export class SwirlSeparator {
         this.borderColor = "default";
         this.color = "default";
         this.orientation = "horizontal";
+        this.semantics = "separator";
         this.spacing = "8";
     }
     componentWillLoad() {
@@ -27,7 +28,10 @@ export class SwirlSeparator {
                 paddingLeft: `var(--s-space-${this.spacing})`,
             };
         const className = classnames("separator", `separator--color-${this.color}`, `separator--orientation-${this.orientation}`);
-        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" })))));
+        const attributes = this.semantics === "separator"
+            ? { "aria-orientation": this.orientation }
+            : {};
+        return (h(Host, { key: '23acb3a29638b92737838e75a54d7616e6c9150e', ...attributes, class: className, role: this.semantics, style: styles }, h("span", { key: '3ebf80f47fb36438403551f560db91ecf7d7e559', class: "separator__line" }), this.label && (h(Fragment, { key: '84ac7960ba714ab27559751c11bd7c4b56ac3176' }, h("span", { key: '6f8dc3ad3bde938789e28ad05c67da657262a4d1', class: "separator__label" }, this.label), h("span", { key: '63ddb77ea887a890bb1731d12a939783b592e21a', class: "separator__line" })))));
     }
     static get is() { return "swirl-separator"; }
     static get encapsulation() { return "shadow"; }
@@ -140,6 +144,32 @@ export class SwirlSeparator {
                 "reflect": false,
                 "defaultValue": "\"horizontal\""
             },
+            "semantics": {
+                "type": "string",
+                "attribute": "semantics",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlSeparatorSemantics",
+                    "resolved": "\"none\" | \"separator\"",
+                    "references": {
+                        "SwirlSeparatorSemantics": {
+                            "location": "local",
+                            "path": "/home/runner/work/swirl/swirl/packages/swirl-components/src/components/swirl-separator/swirl-separator.tsx",
+                            "id": "src/components/swirl-separator/swirl-separator.tsx::SwirlSeparatorSemantics"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "\"separator\""
+            },
             "spacing": {
                 "type": "string",
                 "attribute": "spacing",

package/dist/collection/components/swirl-shell-navigation-item/swirl-shell-navigation-item.js

@@ -8,6 +8,7 @@ export class SwirlShellNavigationItem {
         this.hideLabel = false;
         this.inlineLabelColor = "default";
         this.markAsNewLabel = "New";
+        this.useCustomIconSize = false;
         this.variant = "default";
     }
     componentWillLoad() {
@@ -17,6 +18,9 @@ export class SwirlShellNavigationItem {
         this.forceIconProps();
     }
     forceIconProps() {
+        if (this.useCustomIconSize) {
+            return;
+        }
         const iconEl = this.el.querySelector("[slot='icon']");
         const smallIcon = (this.hideLabel && this.variant === "app-icon") ||
             this.variant === "default";
@@ -57,9 +61,9 @@ export class SwirlShellNavigationItem {
         const tooltipContent = this.description
             ? `${this.label} ${this.description}`
             : this.label;
-        return (h(Host, { key: 'eb3cc38916a4a868d447c631b65d2ebfb3c158e5' }, h("swirl-tooltip", { key: '5d38b0bf756b0a845d0ddff0aa6fe2a955da44f8', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: '852f4913ae1c9e90f0ecccf32f14d857321c5694', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'f9de6d6dc253563b0397fbbc42d4bdb5260015fb', class: "shell-navigation-item__icon" }, h("slot", { key: 'e1a0fc498c658f9094c906b8319971af9025883e', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: '6697baa3fdc919e7a2b7c8595b871566a6b8eaa2', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: 'feadd39faef80c53f72a77e16a5def012d77c53b', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
+        return (h(Host, { key: '5f8337a6e328f4b70794c5df34bea4ce004cdbfc' }, h("swirl-tooltip", { key: 'de803be5c5e466daed55cf67c6127f897425e10d', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: '56b42a124385745a2048c1fac11abd75c5f5ea47', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'fe342b65d7beef54084c3fecd2f448bf2cf8e5c8', class: "shell-navigation-item__icon" }, h("slot", { key: '9c1b2a2476fc0235e3241ed57b458a97809ad50a', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: '89bb559959dae885912f6af1311c22755cd14af2', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: 'b9015202651b5c205849113fcc0e8ce783d18412', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
                 "shell-navigation-item__badge--dot": this.badgeLabel === "",
-            }), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: 'dd8f48f9940c328b8fae2676e9a3b773a70e12d1', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: 'ffbfa549236b20fc6fff35a96865386ea7b7517f', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
+            }), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '9e05640b202bd785e50ae6741804b64c3e1e276a', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: '30aa107e83bc07394bd7de154109097d0ccf51c4', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
     }
     static get is() { return "swirl-shell-navigation-item"; }
     static get encapsulation() { return "shadow"; }
@@ -312,6 +316,26 @@ export class SwirlShellNavigationItem {
                 "reflect": false,
                 "defaultValue": "\"New\""
             },
+            "useCustomIconSize": {
+                "type": "boolean",
+                "attribute": "use-custom-icon-size",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "target": {
                 "type": "string",
                 "attribute": "target",