@vonage/vwc-expansion-panel 2.35.0 → 2.36.1
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/package.json +7 -7
- package/src/vwc-expansion-panel.css.ts +1 -1
- package/src/vwc-expansion-panel.scss +1 -0
- package/src/vwc-expansion-panel.ts +2 -0
- package/vwc-expansion-panel.css.js +1 -1
- package/vwc-expansion-panel.css.js.map +1 -1
- package/vwc-expansion-panel.js +2 -0
- package/vwc-expansion-panel.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vonage/vwc-expansion-panel",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.36.1",
|
|
4
4
|
"description": "expansion panel component",
|
|
5
5
|
"author": "yinonov <yinon@hotmail.com>",
|
|
6
6
|
"homepage": "https://github.com/Vonage/vivid/tree/master/components/expansion-panel#readme",
|
|
@@ -30,16 +30,16 @@
|
|
|
30
30
|
"dependencies": {
|
|
31
31
|
"@material/mwc-base": "^0.22.1",
|
|
32
32
|
"@material/mwc-ripple": "^0.22.1",
|
|
33
|
-
"@vonage/vvd-core": "2.
|
|
34
|
-
"@vonage/vwc-icon": "2.
|
|
33
|
+
"@vonage/vvd-core": "2.36.1",
|
|
34
|
+
"@vonage/vwc-icon": "2.36.1",
|
|
35
35
|
"lit-element": "^2.4.0",
|
|
36
36
|
"tslib": "^2.3.0"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@vonage/vvd-design-tokens": "2.
|
|
40
|
-
"@vonage/vvd-typography": "2.
|
|
41
|
-
"@vonage/vvd-umbrella": "2.
|
|
39
|
+
"@vonage/vvd-design-tokens": "2.36.1",
|
|
40
|
+
"@vonage/vvd-typography": "2.36.1",
|
|
41
|
+
"@vonage/vvd-umbrella": "2.36.1",
|
|
42
42
|
"typescript": "^4.3.2"
|
|
43
43
|
},
|
|
44
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "43325a4f79ef2b781222a9d68cf678f63411b255"
|
|
45
45
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
// autogenerated module
|
|
2
2
|
import {css} from 'lit-element';
|
|
3
|
-
export const style = css`:host{--mdc-ripple-color: var(--vvd-color-on-canvas);display:flex;flex-direction:column}:host(:not([open])) .toggle-close,:host(:not([open])) .expansion-panel-body{display:none}:host([open]) .toggle-open{display:none}:host([open]) .toggle-close{display:initial}.expansion-panel-header{padding:0;margin:0}.expansion-panel-button{font:500 condensed 20px / 28px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;position:relative;display:flex;width:100%;align-items:center;padding:16px;border:0 none;background:transparent;cursor:pointer}.expansion-panel-button .leading-icon,.expansion-panel-button .trailing-icon{display:flex}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .trailing-icon vwc-icon{--vvd-icon-size:var(--vvd-expansion-panel-icon-size, 20px)}.expansion-panel-button .heading-text{flex-grow:1;margin-inline-end:auto;text-align:left}.expansion-panel-button .meta{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;overflow:hidden;max-width:20%;flex-shrink:0;color:var(--vvd-color-neutral-70);margin-inline-start:16px;text-align:end;text-overflow:ellipsis;white-space:nowrap}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .leading-icon slot[name=icon i]::slotted(vwc-icon){margin-inline-end:16px}.expansion-panel-button .trailing-icon vwc-icon,.expansion-panel-button .trailing-icon slot[name=trailingIcon i]::slotted(vwc-icon){margin-inline-start:16px}.expansion-panel-body{font:400 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;padding:8px 32px 24px 16px}:host(:not([icon=""])) .expansion-panel-body,:host([leadingToggle]) .expansion-panel-body{padding-left:48px}:host([leadingToggle]) .expansion-panel-body{padding-right:16px}:host([dense]) .expansion-panel-button{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) .meta{font:600 ultra-condensed 12px / 16px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) vwc-icon{--vvd-expansion-panel-icon-size: 16px}`;
|
|
3
|
+
export const style = css`:host{--mdc-ripple-color: var(--vvd-color-on-canvas);display:flex;flex-direction:column}:host(:not([open])) .toggle-close,:host(:not([open])) .expansion-panel-body{display:none}:host([open]) .toggle-open{display:none}:host([open]) .toggle-close{display:initial}.expansion-panel-header{padding:0;margin:0}.expansion-panel-button{font:500 condensed 20px / 28px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;position:relative;display:flex;width:100%;align-items:center;padding:16px;border:0 none;background:transparent;cursor:pointer;outline:transparent}.expansion-panel-button .leading-icon,.expansion-panel-button .trailing-icon{display:flex}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .trailing-icon vwc-icon{--vvd-icon-size:var(--vvd-expansion-panel-icon-size, 20px)}.expansion-panel-button .heading-text{flex-grow:1;margin-inline-end:auto;text-align:left}.expansion-panel-button .meta{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;overflow:hidden;max-width:20%;flex-shrink:0;color:var(--vvd-color-neutral-70);margin-inline-start:16px;text-align:end;text-overflow:ellipsis;white-space:nowrap}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .leading-icon slot[name=icon i]::slotted(vwc-icon){margin-inline-end:16px}.expansion-panel-button .trailing-icon vwc-icon,.expansion-panel-button .trailing-icon slot[name=trailingIcon i]::slotted(vwc-icon){margin-inline-start:16px}.expansion-panel-body{font:400 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;padding:8px 32px 24px 16px}:host(:not([icon=""])) .expansion-panel-body,:host([leadingToggle]) .expansion-panel-body{padding-left:48px}:host([leadingToggle]) .expansion-panel-body{padding-right:16px}:host([dense]) .expansion-panel-button{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) .meta{font:600 ultra-condensed 12px / 16px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) vwc-icon{--vvd-expansion-panel-icon-size: 16px}`;
|
|
@@ -93,6 +93,8 @@ export class VWCExpansionPanel extends VWCExpansionPanelBase {
|
|
|
93
93
|
return html`
|
|
94
94
|
<button class="expansion-panel-button" id="expansion-panel"
|
|
95
95
|
@mousedown="${this.handleRippleActivate}"
|
|
96
|
+
@focus="${this.handleRippleMouseEnter}"
|
|
97
|
+
@focusout="${this.handleRippleMouseLeave}"
|
|
96
98
|
@mouseenter="${this.handleRippleMouseEnter}"
|
|
97
99
|
@mouseleave="${this.handleRippleMouseLeave}"
|
|
98
100
|
@touchstart="${() => {
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit-element';
|
|
2
|
-
export const style = css `:host{--mdc-ripple-color: var(--vvd-color-on-canvas);display:flex;flex-direction:column}:host(:not([open])) .toggle-close,:host(:not([open])) .expansion-panel-body{display:none}:host([open]) .toggle-open{display:none}:host([open]) .toggle-close{display:initial}.expansion-panel-header{padding:0;margin:0}.expansion-panel-button{font:500 condensed 20px / 28px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;position:relative;display:flex;width:100%;align-items:center;padding:16px;border:0 none;background:transparent;cursor:pointer}.expansion-panel-button .leading-icon,.expansion-panel-button .trailing-icon{display:flex}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .trailing-icon vwc-icon{--vvd-icon-size:var(--vvd-expansion-panel-icon-size, 20px)}.expansion-panel-button .heading-text{flex-grow:1;margin-inline-end:auto;text-align:left}.expansion-panel-button .meta{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;overflow:hidden;max-width:20%;flex-shrink:0;color:var(--vvd-color-neutral-70);margin-inline-start:16px;text-align:end;text-overflow:ellipsis;white-space:nowrap}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .leading-icon slot[name=icon i]::slotted(vwc-icon){margin-inline-end:16px}.expansion-panel-button .trailing-icon vwc-icon,.expansion-panel-button .trailing-icon slot[name=trailingIcon i]::slotted(vwc-icon){margin-inline-start:16px}.expansion-panel-body{font:400 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;padding:8px 32px 24px 16px}:host(:not([icon=""])) .expansion-panel-body,:host([leadingToggle]) .expansion-panel-body{padding-left:48px}:host([leadingToggle]) .expansion-panel-body{padding-right:16px}:host([dense]) .expansion-panel-button{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) .meta{font:600 ultra-condensed 12px / 16px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) vwc-icon{--vvd-expansion-panel-icon-size: 16px}`;
|
|
2
|
+
export const style = css `:host{--mdc-ripple-color: var(--vvd-color-on-canvas);display:flex;flex-direction:column}:host(:not([open])) .toggle-close,:host(:not([open])) .expansion-panel-body{display:none}:host([open]) .toggle-open{display:none}:host([open]) .toggle-close{display:initial}.expansion-panel-header{padding:0;margin:0}.expansion-panel-button{font:500 condensed 20px / 28px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;position:relative;display:flex;width:100%;align-items:center;padding:16px;border:0 none;background:transparent;cursor:pointer;outline:transparent}.expansion-panel-button .leading-icon,.expansion-panel-button .trailing-icon{display:flex}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .trailing-icon vwc-icon{--vvd-icon-size:var(--vvd-expansion-panel-icon-size, 20px)}.expansion-panel-button .heading-text{flex-grow:1;margin-inline-end:auto;text-align:left}.expansion-panel-button .meta{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;overflow:hidden;max-width:20%;flex-shrink:0;color:var(--vvd-color-neutral-70);margin-inline-start:16px;text-align:end;text-overflow:ellipsis;white-space:nowrap}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .leading-icon slot[name=icon i]::slotted(vwc-icon){margin-inline-end:16px}.expansion-panel-button .trailing-icon vwc-icon,.expansion-panel-button .trailing-icon slot[name=trailingIcon i]::slotted(vwc-icon){margin-inline-start:16px}.expansion-panel-body{font:400 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;padding:8px 32px 24px 16px}:host(:not([icon=""])) .expansion-panel-body,:host([leadingToggle]) .expansion-panel-body{padding-left:48px}:host([leadingToggle]) .expansion-panel-body{padding-right:16px}:host([dense]) .expansion-panel-button{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) .meta{font:600 ultra-condensed 12px / 16px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) vwc-icon{--vvd-expansion-panel-icon-size: 16px}`;
|
|
3
3
|
//# sourceMappingURL=vwc-expansion-panel.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vwc-expansion-panel.css.js","sourceRoot":"","sources":["src/vwc-expansion-panel.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,aAAa,CAAC;AAChC,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"vwc-expansion-panel.css.js","sourceRoot":"","sources":["src/vwc-expansion-panel.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,aAAa,CAAC;AAChC,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,qqEAAqqE,CAAC","sourcesContent":["// autogenerated module\nimport {css} from 'lit-element';\nexport const style = css`:host{--mdc-ripple-color: var(--vvd-color-on-canvas);display:flex;flex-direction:column}:host(:not([open])) .toggle-close,:host(:not([open])) .expansion-panel-body{display:none}:host([open]) .toggle-open{display:none}:host([open]) .toggle-close{display:initial}.expansion-panel-header{padding:0;margin:0}.expansion-panel-button{font:500 condensed 20px / 28px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;position:relative;display:flex;width:100%;align-items:center;padding:16px;border:0 none;background:transparent;cursor:pointer;outline:transparent}.expansion-panel-button .leading-icon,.expansion-panel-button .trailing-icon{display:flex}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .trailing-icon vwc-icon{--vvd-icon-size:var(--vvd-expansion-panel-icon-size, 20px)}.expansion-panel-button .heading-text{flex-grow:1;margin-inline-end:auto;text-align:left}.expansion-panel-button .meta{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;overflow:hidden;max-width:20%;flex-shrink:0;color:var(--vvd-color-neutral-70);margin-inline-start:16px;text-align:end;text-overflow:ellipsis;white-space:nowrap}.expansion-panel-button .leading-icon vwc-icon,.expansion-panel-button .leading-icon slot[name=icon i]::slotted(vwc-icon){margin-inline-end:16px}.expansion-panel-button .trailing-icon vwc-icon,.expansion-panel-button .trailing-icon slot[name=trailingIcon i]::slotted(vwc-icon){margin-inline-start:16px}.expansion-panel-body{font:400 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none;padding:8px 32px 24px 16px}:host(:not([icon=\"\"])) .expansion-panel-body,:host([leadingToggle]) .expansion-panel-body{padding-left:48px}:host([leadingToggle]) .expansion-panel-body{padding-right:16px}:host([dense]) .expansion-panel-button{font:600 ultra-condensed 14px / 20px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) .meta{font:600 ultra-condensed 12px / 16px SpeziaWebVariable;letter-spacing:0px;text-decoration:none;text-transform:none}:host([dense]) vwc-icon{--vvd-expansion-panel-icon-size: 16px}`;"]}
|
package/vwc-expansion-panel.js
CHANGED
|
@@ -46,6 +46,8 @@ let VWCExpansionPanel = class VWCExpansionPanel extends VWCExpansionPanelBase {
|
|
|
46
46
|
return html `
|
|
47
47
|
<button class="expansion-panel-button" id="expansion-panel"
|
|
48
48
|
@mousedown="${this.handleRippleActivate}"
|
|
49
|
+
@focus="${this.handleRippleMouseEnter}"
|
|
50
|
+
@focusout="${this.handleRippleMouseLeave}"
|
|
49
51
|
@mouseenter="${this.handleRippleMouseEnter}"
|
|
50
52
|
@mouseleave="${this.handleRippleMouseLeave}"
|
|
51
53
|
@touchstart="${() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vwc-expansion-panel.js","sourceRoot":"","sources":["src/vwc-expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import '@vonage/vvd-core';\nimport '@vonage/vwc-icon';\nimport '@material/mwc-ripple/mwc-ripple.js';\nimport {\n\tcustomElement,\n\teventOptions,\n\thtml,\n\tproperty,\n\tqueryAsync,\n\tTemplateResult\n} from 'lit-element';\nimport type {Ripple} from '@material/mwc-ripple';\nimport {RippleHandlers} from '@material/mwc-ripple/ripple-handlers.js';\nimport {VWCExpansionPanelBase} from './vwc-expansion-panel-base.js';\nimport {style} from './vwc-expansion-panel.css.js';\nimport {nothing} from 'lit-html';\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'vwc-expansion-panel': VWCExpansionPanel;\n\t}\n}\n\nconst iconSets = ['chevron', 'binary'];\nexport type IndicatorIconSets = typeof iconSets;\n\nconst VALID_HEADER_VALUES = [2, 3, 4, 5, 6];\n\nfunction isValidHeaderValue(headerValue: string | number) {\n\treturn VALID_HEADER_VALUES.includes(Number(headerValue));\n}\n\n@customElement('vwc-expansion-panel')\nexport class VWCExpansionPanel extends VWCExpansionPanelBase {\n\tstatic override styles = style;\n\n\t/**\n\t * @deprecated use \"heading\" instead\n\t */\n\t@property({type: String, reflect: true})\n\t\theader = '';\n\n\t/**\n\t * The heading of the expanded panel\n\t */\n\t@property({type: String, reflect: true})\n\t\theading = '';\n\n\t@property({type: String, reflect: true})\n\t\ticon = '';\n\n\t@property({type: String, reflect: true})\n\t\tindicatorIconSet: IndicatorIconSets[number] = 'chevron';\n\n\t@property({type: String, reflect: true})\n\t\tmeta = '';\n\n\t@property({type: Boolean, reflect: true})\n\t\tdense = false;\n\n\t@property({type: Boolean, reflect: true})\n\t\tleadingToggle = false;\n\n\t@property({type: Boolean, reflect: true})\n\t\tnoRipple = false;\n\t@queryAsync('mwc-ripple') ripple!: Promise<Ripple>;\n\tprotected rippleHandlers = new RippleHandlers(() => {\n\t\treturn this.ripple;\n\t});\n\t@property({type: String, reflect: true, attribute: 'heading-level'})\n\tprivate headingLevel = '3';\n\n\toverride openChanged(isOpen: boolean): void {\n\t\tsuper.openChanged(isOpen);\n\t\tthis.toggleAttribute('open', isOpen);\n\t}\n\n\tprotected toggleOpen(): void {\n\t\tthis.open = !this.open;\n\t}\n\n\tprotected renderRipple(): TemplateResult | string {\n\t\treturn !this.noRipple ? html`\n\t\t\t<mwc-ripple></mwc-ripple>` : '';\n\t}\n\n\tprivate renderMeta(): TemplateResult | unknown {\n\t\treturn this.meta ? html`<span class=\"meta\">${this.meta}</span>` : nothing;\n\t}\n\n\tprotected renderHeaderButton(): TemplateResult {\n\n\t\treturn html`\n\t\t\t<button class=\"expansion-panel-button\" id=\"expansion-panel\"\n\t\t\t\t\t\t\t@mousedown=\"${this.handleRippleActivate}\"\n\t\t\t\t\t\t\t@mouseenter=\"${this.handleRippleMouseEnter}\"\n\t\t\t\t\t\t\t@mouseleave=\"${this.handleRippleMouseLeave}\"\n\t\t\t\t\t\t\t@touchstart=\"${() => {\n\t\tthis.toggleOpen();\n\t\tthis.handleRippleActivate;\n\t}}\"\n\t\t\t\t\t\t\t@touchend=\"${this.handleRippleDeactivate}\"\n\t\t\t\t\t\t\t@touchcancel=\"${this.handleRippleDeactivate}\"\n\t\t\t\t\t\t\t@click=${() => this.toggleOpen()}\n\t\t\t\t\t\t\t?aria-expanded=${this.open}\n\t\t\t\t\t\t\taria-controls=\"content\"\n\t\t\t>\n\t\t\t\t${this.renderRipple()}\n\t\t\t\t<span class=\"leading-icon\">\n\t\t\t\t\t<slot name=\"icon\">\n\t\t\t\t\t\t${this.renderIconOrToggle()}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t\t<span class=\"heading-text\">${this.heading || this.header}</span>\n\t\t\t\t${this.renderMeta()}\n\t\t\t\t<span class=\"trailing-icon\">\n\t\t\t\t\t<slot name=\"trailingIcon\">\n\t\t\t\t\t\t${!this.leadingToggle ? this.renderToggle() : ''}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t</button>\n\t\t`;\n\t}\n\n\tprotected renderPanelHeader(): TemplateResult | string {\n\t\tif (!isValidHeaderValue(this.headingLevel)) this.headingLevel = '3';\n\t\tswitch (this.headingLevel.toString()) {\n\t\tcase '2':\n\t\t\treturn html`<h2 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h2>`;\n\t\tcase '4':\n\t\t\treturn html`<h4 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h4>`;\n\t\tcase '5':\n\t\t\treturn html`<h5 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h5>`;\n\t\tcase '6':\n\t\t\treturn html`<h6 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h6>`;\n\t\tdefault:\n\t\t\treturn html`<h3 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h3>`;\n\t\t}\n\t}\n\n\tprotected override render(): TemplateResult {\n\t\treturn html`\n\t\t\t${this.renderPanelHeader()}\n\t\t\t<div id=\"content\" class=\"expansion-panel-body\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>`;\n\n\t}\n\n\tprotected renderIconOrToggle(): TemplateResult | string {\n\t\tif (this.leadingToggle) {\n\t\t\treturn this.renderToggle();\n\t\t} else if (this.icon) {\n\t\t\treturn html`\n\t\t\t\t<vwc-icon type=\"${this.icon}\" size=\"medium\"></vwc-icon>`;\n\t\t} else {\n\t\t\treturn '';\n\t\t}\n\t}\n\n\tprotected renderToggle(): TemplateResult {\n\t\treturn html`\n\t\t\t<vwc-icon\n\t\t\t\tclass=\"toggle-open\"\n\t\t\t\ttype=\"${this.indicatorIconSet === 'chevron' ? 'chevron-down-solid' : 'plus-solid'}\"\n\t\t\t>\n\t\t\t</vwc-icon>\n\t\t\t<vwc-icon\n\t\t\t\tclass=\"toggle-close\"\n\t\t\t\ttype=\"${this.indicatorIconSet === 'chevron' ? 'chevron-up-solid' : 'minus-solid'}\"\n\t\t\t>\n\t\t\t</vwc-icon>\n\t\t`;\n\t}\n\n\t@eventOptions({passive: true})\n\tprivate handleRippleActivate(evt?: Event) {\n\t\tconst onUp = () => {\n\t\t\twindow.removeEventListener('mouseup', onUp);\n\n\t\t\tthis.handleRippleDeactivate();\n\t\t};\n\n\t\twindow.addEventListener('mouseup', onUp);\n\t\tthis.rippleHandlers.startPress(evt);\n\t}\n\n\tprivate handleRippleDeactivate() {\n\t\tthis.rippleHandlers.endPress();\n\t}\n\n\tprivate handleRippleMouseEnter() {\n\t\tthis.rippleHandlers.startHover();\n\t}\n\n\tprivate handleRippleMouseLeave() {\n\t\tthis.rippleHandlers.endHover();\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"vwc-expansion-panel.js","sourceRoot":"","sources":["src/vwc-expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import '@vonage/vvd-core';\nimport '@vonage/vwc-icon';\nimport '@material/mwc-ripple/mwc-ripple.js';\nimport {\n\tcustomElement,\n\teventOptions,\n\thtml,\n\tproperty,\n\tqueryAsync,\n\tTemplateResult\n} from 'lit-element';\nimport type {Ripple} from '@material/mwc-ripple';\nimport {RippleHandlers} from '@material/mwc-ripple/ripple-handlers.js';\nimport {VWCExpansionPanelBase} from './vwc-expansion-panel-base.js';\nimport {style} from './vwc-expansion-panel.css.js';\nimport {nothing} from 'lit-html';\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'vwc-expansion-panel': VWCExpansionPanel;\n\t}\n}\n\nconst iconSets = ['chevron', 'binary'];\nexport type IndicatorIconSets = typeof iconSets;\n\nconst VALID_HEADER_VALUES = [2, 3, 4, 5, 6];\n\nfunction isValidHeaderValue(headerValue: string | number) {\n\treturn VALID_HEADER_VALUES.includes(Number(headerValue));\n}\n\n@customElement('vwc-expansion-panel')\nexport class VWCExpansionPanel extends VWCExpansionPanelBase {\n\tstatic override styles = style;\n\n\t/**\n\t * @deprecated use \"heading\" instead\n\t */\n\t@property({type: String, reflect: true})\n\t\theader = '';\n\n\t/**\n\t * The heading of the expanded panel\n\t */\n\t@property({type: String, reflect: true})\n\t\theading = '';\n\n\t@property({type: String, reflect: true})\n\t\ticon = '';\n\n\t@property({type: String, reflect: true})\n\t\tindicatorIconSet: IndicatorIconSets[number] = 'chevron';\n\n\t@property({type: String, reflect: true})\n\t\tmeta = '';\n\n\t@property({type: Boolean, reflect: true})\n\t\tdense = false;\n\n\t@property({type: Boolean, reflect: true})\n\t\tleadingToggle = false;\n\n\t@property({type: Boolean, reflect: true})\n\t\tnoRipple = false;\n\t@queryAsync('mwc-ripple') ripple!: Promise<Ripple>;\n\tprotected rippleHandlers = new RippleHandlers(() => {\n\t\treturn this.ripple;\n\t});\n\t@property({type: String, reflect: true, attribute: 'heading-level'})\n\tprivate headingLevel = '3';\n\n\toverride openChanged(isOpen: boolean): void {\n\t\tsuper.openChanged(isOpen);\n\t\tthis.toggleAttribute('open', isOpen);\n\t}\n\n\tprotected toggleOpen(): void {\n\t\tthis.open = !this.open;\n\t}\n\n\tprotected renderRipple(): TemplateResult | string {\n\t\treturn !this.noRipple ? html`\n\t\t\t<mwc-ripple></mwc-ripple>` : '';\n\t}\n\n\tprivate renderMeta(): TemplateResult | unknown {\n\t\treturn this.meta ? html`<span class=\"meta\">${this.meta}</span>` : nothing;\n\t}\n\n\tprotected renderHeaderButton(): TemplateResult {\n\n\t\treturn html`\n\t\t\t<button class=\"expansion-panel-button\" id=\"expansion-panel\"\n\t\t\t\t\t\t\t@mousedown=\"${this.handleRippleActivate}\"\n\t\t\t\t\t\t\t@focus=\"${this.handleRippleMouseEnter}\"\n\t\t\t\t\t\t\t@focusout=\"${this.handleRippleMouseLeave}\"\n\t\t\t\t\t\t\t@mouseenter=\"${this.handleRippleMouseEnter}\"\n\t\t\t\t\t\t\t@mouseleave=\"${this.handleRippleMouseLeave}\"\n\t\t\t\t\t\t\t@touchstart=\"${() => {\n\t\tthis.toggleOpen();\n\t\tthis.handleRippleActivate;\n\t}}\"\n\t\t\t\t\t\t\t@touchend=\"${this.handleRippleDeactivate}\"\n\t\t\t\t\t\t\t@touchcancel=\"${this.handleRippleDeactivate}\"\n\t\t\t\t\t\t\t@click=${() => this.toggleOpen()}\n\t\t\t\t\t\t\t?aria-expanded=${this.open}\n\t\t\t\t\t\t\taria-controls=\"content\"\n\t\t\t>\n\t\t\t\t${this.renderRipple()}\n\t\t\t\t<span class=\"leading-icon\">\n\t\t\t\t\t<slot name=\"icon\">\n\t\t\t\t\t\t${this.renderIconOrToggle()}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t\t<span class=\"heading-text\">${this.heading || this.header}</span>\n\t\t\t\t${this.renderMeta()}\n\t\t\t\t<span class=\"trailing-icon\">\n\t\t\t\t\t<slot name=\"trailingIcon\">\n\t\t\t\t\t\t${!this.leadingToggle ? this.renderToggle() : ''}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t</button>\n\t\t`;\n\t}\n\n\tprotected renderPanelHeader(): TemplateResult | string {\n\t\tif (!isValidHeaderValue(this.headingLevel)) this.headingLevel = '3';\n\t\tswitch (this.headingLevel.toString()) {\n\t\tcase '2':\n\t\t\treturn html`<h2 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h2>`;\n\t\tcase '4':\n\t\t\treturn html`<h4 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h4>`;\n\t\tcase '5':\n\t\t\treturn html`<h5 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h5>`;\n\t\tcase '6':\n\t\t\treturn html`<h6 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h6>`;\n\t\tdefault:\n\t\t\treturn html`<h3 class=\"expansion-panel-header\">${this.renderHeaderButton()}</h3>`;\n\t\t}\n\t}\n\n\tprotected override render(): TemplateResult {\n\t\treturn html`\n\t\t\t${this.renderPanelHeader()}\n\t\t\t<div id=\"content\" class=\"expansion-panel-body\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>`;\n\n\t}\n\n\tprotected renderIconOrToggle(): TemplateResult | string {\n\t\tif (this.leadingToggle) {\n\t\t\treturn this.renderToggle();\n\t\t} else if (this.icon) {\n\t\t\treturn html`\n\t\t\t\t<vwc-icon type=\"${this.icon}\" size=\"medium\"></vwc-icon>`;\n\t\t} else {\n\t\t\treturn '';\n\t\t}\n\t}\n\n\tprotected renderToggle(): TemplateResult {\n\t\treturn html`\n\t\t\t<vwc-icon\n\t\t\t\tclass=\"toggle-open\"\n\t\t\t\ttype=\"${this.indicatorIconSet === 'chevron' ? 'chevron-down-solid' : 'plus-solid'}\"\n\t\t\t>\n\t\t\t</vwc-icon>\n\t\t\t<vwc-icon\n\t\t\t\tclass=\"toggle-close\"\n\t\t\t\ttype=\"${this.indicatorIconSet === 'chevron' ? 'chevron-up-solid' : 'minus-solid'}\"\n\t\t\t>\n\t\t\t</vwc-icon>\n\t\t`;\n\t}\n\n\t@eventOptions({passive: true})\n\tprivate handleRippleActivate(evt?: Event) {\n\t\tconst onUp = () => {\n\t\t\twindow.removeEventListener('mouseup', onUp);\n\n\t\t\tthis.handleRippleDeactivate();\n\t\t};\n\n\t\twindow.addEventListener('mouseup', onUp);\n\t\tthis.rippleHandlers.startPress(evt);\n\t}\n\n\tprivate handleRippleDeactivate() {\n\t\tthis.rippleHandlers.endPress();\n\t}\n\n\tprivate handleRippleMouseEnter() {\n\t\tthis.rippleHandlers.startHover();\n\t}\n\n\tprivate handleRippleMouseLeave() {\n\t\tthis.rippleHandlers.endHover();\n\t}\n}\n"]}
|