@digital-realty/ix-icon-button - npm Package Compare versions

Comparing version 1.0.21 to 1.0.22

dist/IxIconButton.d.ts

@@ -51,5 +51,4 @@ import { LitElement } from 'lit';
     label: string | undefined;
-    protected createRenderRoot(): this;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1 | 2>;
 }
 export {};

dist/IxIconButton.js

 import { __decorate } from "tslib";
 import { html, LitElement, nothing } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { literal, html as staticHtml } from 'lit/static-html.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
@@ -52,109 +53,35 @@ import '@material/web/iconbutton/icon-button.js';
     }
-    createRenderRoot() {
-        return this;
-    }
     render() {
-        let comp;
         const ariaLabel = this.label || this.ariaLabel;
-        if (this.appearance === 'filled') {
-            comp = html `<md-filled-icon-button
-        class="button"
-        ?disabled=${this.disabled}
-        ?flip-icon-in-rtl=${this.flipIconInRtl}
-        href=${ifDefined(this.href)}
-        target=${ifDefined(this.target)}
-        aria-label-selected=${ifDefined(this.ariaLabelSelected)}
-        aria-label=${ariaLabel || nothing}
-        ?toggle=${this.toggle}
-        ?selected=${this.selected}
-        type=${this.type}
-        name=${ifDefined(this.name)}
-        value=${ifDefined(this.value)}
-        ><ix-icon filled>${this.icon}</ix-icon>
-        ${this.selectedIcon
-                ? html `<ix-icon filled slot="selected">${this.selectedIcon}</ix-icon>`
-                : nothing}
-      </md-filled-icon-button>`;
+        let tag = literal `md-icon-button`;
+        if (this.appearance === 'outlined') {
+            tag = literal `md-outlined-icon-button`;
         }
-        else if (this.appearance === 'icon-filled') {
-            comp = html `<md-icon-button
-        class="button"
-        ?disabled=${this.disabled}
-        ?flip-icon-in-rtl=${this.flipIconInRtl}
-        href=${ifDefined(this.href)}
-        target=${ifDefined(this.target)}
-        aria-label-selected=${ifDefined(this.ariaLabelSelected)}
-        aria-label=${ariaLabel || nothing}
-        ?toggle=${this.toggle}
-        ?selected=${this.selected}
-        type=${this.type}
-        name=${ifDefined(this.name)}
-        value=${ifDefined(this.value)}
-        ><ix-icon filled>${this.icon}</ix-icon>
-        ${this.selectedIcon
-                ? html `<ix-icon filled slot="selected">${this.selectedIcon}</ix-icon>`
-                : nothing}
-      </md-icon-button>`;
+        else if (this.appearance === 'filled') {
+            tag = literal `md-filled-icon-button`;
         }
         else if (this.appearance === 'filled-tonal') {
-            comp = html `<md-filled-tonal-icon-button
-        class="button"
-        ?disabled=${this.disabled}
-        ?flip-icon-in-rtl=${this.flipIconInRtl}
-        href=${ifDefined(this.href)}
-        target=${ifDefined(this.target)}
-        aria-label-selected=${ifDefined(this.ariaLabelSelected)}
-        aria-label=${ariaLabel || nothing}
-        ?toggle=${this.toggle}
-        ?selected=${this.selected}
-        type=${this.type}
-        name=${ifDefined(this.name)}
-        value=${ifDefined(this.value)}
-        ><ix-icon>${this.icon}</ix-icon>
-        ${this.selectedIcon
-                ? html `<ix-icon slot="selected">${this.selectedIcon}</ix-icon>`
-                : nothing}
-      </md-filled-tonal-icon-button>`;
+            tag = literal `md-filled-tonal-icon-button`;
         }
-        else if (this.appearance === 'outlined') {
-            comp = html `<md-outlined-icon-button
-        class="button"
-        ?disabled=${this.disabled}
-        ?flip-icon-in-rtl=${this.flipIconInRtl}
-        href=${ifDefined(this.href)}
-        target=${ifDefined(this.target)}
-        aria-label-selected=${ifDefined(this.ariaLabelSelected)}
-        aria-label=${ariaLabel || nothing}
-        ?toggle=${this.toggle}
-        ?selected=${this.selected}
-        type=${this.type}
-        name=${ifDefined(this.name)}
-        value=${ifDefined(this.value)}
-        ><ix-icon>${this.icon}</ix-icon>
-        ${this.selectedIcon
-                ? html `<ix-icon slot="selected">${this.selectedIcon}</ix-icon>`
-                : nothing}
-      </md-outlined-icon-button>`;
-        }
-        else if (this.appearance === 'default') {
-            comp = html `<md-icon-button
-        class="button"
-        ?disabled=${this.disabled}
-        ?flip-icon-in-rtl=${this.flipIconInRtl}
-        href=${ifDefined(this.href)}
-        target=${ifDefined(this.target)}
-        aria-label-selected=${ifDefined(this.ariaLabelSelected)}
-        aria-label=${ariaLabel || nothing}
-        ?toggle=${this.toggle}
-        ?selected=${this.selected}
-        type=${this.type}
-        name=${ifDefined(this.name)}
-        value=${ifDefined(this.value)}
-        ><ix-icon>${this.icon}</ix-icon>
-        ${this.selectedIcon
-                ? html `<ix-icon slot="selected">${this.selectedIcon}</ix-icon>`
-                : nothing}
-      </md-icon-button>`;
-        }
-        return html `${comp}`;
+        return staticHtml `<${tag}
+      class="button"
+      ?disabled=${this.disabled}
+      ?flip-icon-in-rtl=${this.flipIconInRtl}
+      href=${ifDefined(this.href)}
+      target=${ifDefined(this.target)}
+      aria-label-selected=${ifDefined(this.ariaLabelSelected)}
+      aria-label=${ariaLabel || nothing}
+      ?toggle=${this.toggle}
+      ?selected=${this.selected}
+      type=${this.type}
+      name=${ifDefined(this.name)}
+      value=${ifDefined(this.value)}
+      >${this.icon
+            ? html `<ix-icon>${this.icon}</ix-icon>`
+            : html `<slot name="default"></slot
+              ><slot name="selected" slot="selected"></slot>`}
+      ${this.selectedIcon
+            ? html `<ix-icon slot="selected">${this.selectedIcon}</ix-icon>`
+            : nothing}
+      </${tag}>`;
     }
@@ -161,0 +88,0 @@ }

package.json

@@ -6,3 +6,3 @@ {
   "author": "Digital Realty",
-  "version": "1.0.21",
+  "version": "1.0.22",
   "type": "module",
@@ -30,3 +30,3 @@ "main": "dist/index.js",
   "dependencies": {
-    "@digital-realty/ix-icon": "^1.0.3",
+    "@digital-realty/ix-icon": "*",
     "@lit/react": "^1.0.2",
@@ -39,2 +39,3 @@ "@material/web": "1.2.0",
     "@custom-elements-manifest/analyzer": "^0.4.17",
+    "@digital-realty/theme": "^1.0.12",
     "@open-wc/eslint-config": "^9.2.1",
@@ -104,3 +105,3 @@ "@open-wc/testing": "^3.1.6",
   ],
-  "gitHead": "a93ad0076764dc26321faa51bc504ff6b534d836"
+  "gitHead": "5ff9e3f504660342e986801e86861d35b47930da"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Wildcard dependency

Quality

Package has a dependency with a floating version range. This can cause issues if the dependency publishes a new major version.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

19625

decreased by-26.89%

Dev dependency count

16

increased by6.67%

Lines of code

201

decreased by-26.91%

Number of medium quality alerts

1

increased byInfinity%

Dependency changes

• Updated@digital-realty/ix-icon@*