@digital-realty/ix-icon-button 1.1.4 → 1.1.6
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/dist/IxIconButton.d.ts
CHANGED
|
@@ -49,6 +49,6 @@ export declare class IxIconButton extends LitElement {
|
|
|
49
49
|
value: string | undefined;
|
|
50
50
|
label: string | undefined;
|
|
51
51
|
filledIcon: boolean;
|
|
52
|
-
render(): import("lit").TemplateResult<1 | 2>;
|
|
52
|
+
render(): import("lit-html").TemplateResult<1 | 2 | 3>;
|
|
53
53
|
}
|
|
54
54
|
export {};
|
package/dist/ix-icon-button.d.ts
CHANGED
package/dist/ix-icon-button.js
CHANGED
|
@@ -1,3 +1,31 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
1
2
|
import { IxIconButton } from './IxIconButton.js';
|
|
2
|
-
|
|
3
|
+
export class IxIconButtonStyled extends IxIconButton {
|
|
4
|
+
}
|
|
5
|
+
IxIconButtonStyled.styles = css `
|
|
6
|
+
:host {
|
|
7
|
+
display: flex;
|
|
8
|
+
|
|
9
|
+
--md-icon-button-state-layer-height: calc(
|
|
10
|
+
var(--md-icon-button-icon-size) * 1.65
|
|
11
|
+
);
|
|
12
|
+
--md-icon-button-state-layer-width: calc(
|
|
13
|
+
var(--md-icon-button-icon-size) * 1.65
|
|
14
|
+
);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
:host([small]) {
|
|
18
|
+
--md-icon-button-state-layer-height: calc(
|
|
19
|
+
var(--md-icon-button-icon-size) * 1.2
|
|
20
|
+
);
|
|
21
|
+
--md-icon-button-state-layer-width: calc(
|
|
22
|
+
var(--md-icon-button-icon-size) * 1.2
|
|
23
|
+
);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
:host(.cancel) {
|
|
27
|
+
--md-sys-color-on-surface-variant: var(--ix-button-cancel-color);
|
|
28
|
+
}
|
|
29
|
+
`;
|
|
30
|
+
window.customElements.define('ix-icon-button', IxIconButtonStyled);
|
|
3
31
|
//# sourceMappingURL=ix-icon-button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ix-icon-button.js","sourceRoot":"","sources":["../src/ix-icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,gBAAgB,EAAE,
|
|
1
|
+
{"version":3,"file":"ix-icon-button.js","sourceRoot":"","sources":["../src/ix-icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,OAAO,kBAAmB,SAAQ,YAAY;;AAClC,yBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwB3B,CAAC;AAGJ,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,gBAAgB,EAAE,kBAAkB,CAAC,CAAC","sourcesContent":["import { css } from 'lit';\nimport { IxIconButton } from './IxIconButton.js';\n\nexport class IxIconButtonStyled extends IxIconButton {\n static override styles = css`\n :host {\n display: flex;\n\n --md-icon-button-state-layer-height: calc(\n var(--md-icon-button-icon-size) * 1.65\n );\n --md-icon-button-state-layer-width: calc(\n var(--md-icon-button-icon-size) * 1.65\n );\n }\n\n :host([small]) {\n --md-icon-button-state-layer-height: calc(\n var(--md-icon-button-icon-size) * 1.2\n );\n --md-icon-button-state-layer-width: calc(\n var(--md-icon-button-icon-size) * 1.2\n );\n }\n\n :host(.cancel) {\n --md-sys-color-on-surface-variant: var(--ix-button-cancel-color);\n }\n `;\n}\n\nwindow.customElements.define('ix-icon-button', IxIconButtonStyled);\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{LitElement,nothing,html as html$1,css}from"lit";import{__decorate}from"tslib";import{query,property}from"lit/decorators.js";import{literal,html}from"lit/static-html.js";import{ifDefined}from"lit/directives/if-defined.js";import"@material/web/iconbutton/icon-button.js";import"@material/web/iconbutton/filled-icon-button.js";import"@material/web/iconbutton/filled-tonal-icon-button.js";import"@material/web/iconbutton/outlined-icon-button.js";import"@digital-realty/ix-icon/ix-icon.js";class IxIconButton extends LitElement{constructor(){super(...arguments),this.appearance="default",this.icon="",this.selectedIcon="",this.disabled=!1,this.flipIconInRtl=!1,this.href=void 0,this.target=void 0,this.ariaLabelSelected=void 0,this.toggle=!1,this.selected=!1,this.type="submit",this.name=void 0,this.value=void 0,this.label=void 0,this.filledIcon=!1}render(){var t=this.label||this.ariaLabel;let e=literal`md-icon-button`;return"outlined"===this.appearance?e=literal`md-outlined-icon-button`:"filled"===this.appearance?e=literal`md-filled-icon-button`:"filled-tonal"===this.appearance&&(e=literal`md-filled-tonal-icon-button`),html`<${e}
|
|
2
2
|
class="button"
|
|
3
3
|
?disabled=${this.disabled}
|
|
4
4
|
?flip-icon-in-rtl=${this.flipIconInRtl}
|
|
@@ -16,4 +16,12 @@ import{__decorate}from"tslib";import{LitElement,nothing,html as html$1}from"lit"
|
|
|
16
16
|
${this.selectedIcon?html$1`<ix-icon ?filled=${this.filledIcon} slot="selected"
|
|
17
17
|
>${this.selectedIcon}</ix-icon
|
|
18
18
|
>`:nothing}
|
|
19
|
-
</${e}>`}}__decorate([query(".button")],IxIconButton.prototype,"component",void 0),__decorate([property()],IxIconButton.prototype,"appearance",void 0),__decorate([property()],IxIconButton.prototype,"icon",void 0),__decorate([property()],IxIconButton.prototype,"selectedIcon",void 0),__decorate([property({type:Boolean,reflect:!0})],IxIconButton.prototype,"disabled",void 0),__decorate([property({type:Boolean,attribute:"flip-icon-in-rtl"})],IxIconButton.prototype,"flipIconInRtl",void 0),__decorate([property()],IxIconButton.prototype,"href",void 0),__decorate([property()],IxIconButton.prototype,"target",void 0),__decorate([property({attribute:"aria-label-selected"})],IxIconButton.prototype,"ariaLabelSelected",void 0),__decorate([property({type:Boolean})],IxIconButton.prototype,"toggle",void 0),__decorate([property({type:Boolean,reflect:!0})],IxIconButton.prototype,"selected",void 0),__decorate([property()],IxIconButton.prototype,"type",void 0),__decorate([property()],IxIconButton.prototype,"name",void 0),__decorate([property()],IxIconButton.prototype,"value",void 0),__decorate([property()],IxIconButton.prototype,"label",void 0),__decorate([property({type:Boolean})],IxIconButton.prototype,"filledIcon",void 0)
|
|
19
|
+
</${e}>`}}__decorate([query(".button")],IxIconButton.prototype,"component",void 0),__decorate([property()],IxIconButton.prototype,"appearance",void 0),__decorate([property()],IxIconButton.prototype,"icon",void 0),__decorate([property()],IxIconButton.prototype,"selectedIcon",void 0),__decorate([property({type:Boolean,reflect:!0})],IxIconButton.prototype,"disabled",void 0),__decorate([property({type:Boolean,attribute:"flip-icon-in-rtl"})],IxIconButton.prototype,"flipIconInRtl",void 0),__decorate([property()],IxIconButton.prototype,"href",void 0),__decorate([property()],IxIconButton.prototype,"target",void 0),__decorate([property({attribute:"aria-label-selected"})],IxIconButton.prototype,"ariaLabelSelected",void 0),__decorate([property({type:Boolean})],IxIconButton.prototype,"toggle",void 0),__decorate([property({type:Boolean,reflect:!0})],IxIconButton.prototype,"selected",void 0),__decorate([property()],IxIconButton.prototype,"type",void 0),__decorate([property()],IxIconButton.prototype,"name",void 0),__decorate([property()],IxIconButton.prototype,"value",void 0),__decorate([property()],IxIconButton.prototype,"label",void 0),__decorate([property({type:Boolean})],IxIconButton.prototype,"filledIcon",void 0);class IxIconButtonStyled extends IxIconButton{}IxIconButtonStyled.styles=css`:host{display:flex;--md-icon-button-state-layer-height:calc(
|
|
20
|
+
var(--md-icon-button-icon-size) * 1.65
|
|
21
|
+
);--md-icon-button-state-layer-width:calc(
|
|
22
|
+
var(--md-icon-button-icon-size) * 1.65
|
|
23
|
+
)}:host([small]){--md-icon-button-state-layer-height:calc(
|
|
24
|
+
var(--md-icon-button-icon-size) * 1.2
|
|
25
|
+
);--md-icon-button-state-layer-width:calc(
|
|
26
|
+
var(--md-icon-button-icon-size) * 1.2
|
|
27
|
+
)}:host(.cancel){--md-sys-color-on-surface-variant:var(--ix-button-cancel-color)}`,window.customElements.define("ix-icon-button",IxIconButtonStyled);export{IxIconButtonStyled};
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Webcomponent ix-icon-button following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Digital Realty",
|
|
6
|
-
"version": "1.1.
|
|
6
|
+
"version": "1.1.6",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"main": "dist/index.js",
|
|
9
9
|
"module": "dist/index.js",
|
|
@@ -27,15 +27,14 @@
|
|
|
27
27
|
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@digital-realty/ix-icon": "^1.1.
|
|
30
|
+
"@digital-realty/ix-icon": "^1.1.6",
|
|
31
31
|
"@lit/react": "^1.0.2",
|
|
32
32
|
"@material/web": "1.2.0",
|
|
33
|
-
"lit": "^
|
|
33
|
+
"lit": "^3.2.1",
|
|
34
34
|
"react": "^18.2.0"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@custom-elements-manifest/analyzer": "^0.4.17",
|
|
38
|
-
"@digital-realty/theme": "^1.0.30",
|
|
39
38
|
"@open-wc/eslint-config": "^9.2.1",
|
|
40
39
|
"@open-wc/testing": "^3.1.6",
|
|
41
40
|
"@typescript-eslint/eslint-plugin": "^5.48.0",
|
|
@@ -48,6 +47,7 @@
|
|
|
48
47
|
"husky": "^4.3.8",
|
|
49
48
|
"lint-staged": "^10.5.4",
|
|
50
49
|
"prettier": "^2.4.1",
|
|
50
|
+
"rollup": "^4.29.1",
|
|
51
51
|
"rollup-plugin-minify-html-literals": "^1.2.6",
|
|
52
52
|
"rollup-plugin-summary": "^2.0.0",
|
|
53
53
|
"rollup-plugin-uglify": "^6.0.4",
|
|
@@ -103,5 +103,5 @@
|
|
|
103
103
|
"README.md",
|
|
104
104
|
"LICENSE"
|
|
105
105
|
],
|
|
106
|
-
"gitHead": "
|
|
106
|
+
"gitHead": "a781e30ec63dcc3307d86b94e35fa93c4e61f22f"
|
|
107
107
|
}
|