@api-client/ui 0.2.9 → 0.2.10
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAG1D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAA;AAC3F,OAAO,QAAQ,MAAM,kCAAkC,CAAA;AAGvD,OAAO,2BAA2B,CAAA;AAElC,oBAAY,aAAa;IACvB,GAAG,QAAQ;IACX,GAAG,QAAQ;IACX,KAAK,UAAU;CAChB;AAED,oBAAY,aAAa;IACvB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,IAAI,SAAS;CACd;AAED;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,SAAS;IAC3B,QAAQ,CAAC,MAAM,EAAG,QAAQ,CAAA;IAE9C;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;OAIG;IACwC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAA;IAExE;;;;OAIG;IACwC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAA;IAExE;;;;;OAKG;IACyC,QAAQ,CAAC,MAAM,UAAQ;;IAoB1D,iBAAiB,IAAI,IAAI;cAOf,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;
|
|
1
|
+
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAG1D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAA;AAC3F,OAAO,QAAQ,MAAM,kCAAkC,CAAA;AAGvD,OAAO,2BAA2B,CAAA;AAElC,oBAAY,aAAa;IACvB,GAAG,QAAQ;IACX,GAAG,QAAQ;IACX,KAAK,UAAU;CAChB;AAED,oBAAY,aAAa;IACvB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,IAAI,SAAS;CACd;AAED;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,SAAS;IAC3B,QAAQ,CAAC,MAAM,EAAG,QAAQ,CAAA;IAE9C;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;OAIG;IACwC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAA;IAExE;;;;OAIG;IACwC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAA;IAExE;;;;;OAKG;IACyC,QAAQ,CAAC,MAAM,UAAQ;;IAoB1D,iBAAiB,IAAI,IAAI;cAOf,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAYrC,WAAW,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAYnC,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;IAQ3C,QAAQ,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAQhD,SAAS,CAAC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAS1C,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAWlD,SAAS,CAAC,WAAW,IAAI,IAAI;IAO7B,SAAS,CAAC,UAAU,IAAI,IAAI;IAO5B;;OAEG;IACH,QAAQ,IAAI,IAAI;IAShB;;OAEG;IACH,QAAQ,IAAI,OAAO;IAOnB;;OAEG;IACH,UAAU,IAAI,IAAI;IAOlB,SAAS,CAAC,gBAAgB,IAAI,IAAI;cAIf,MAAM,IAAI,cAAc;IAiB3C,SAAS,CAAC,YAAY,QAAO,cAAc,CAG1C;IAED,SAAS,CAAC,WAAW,IAAI,cAAc;IAMvC,SAAS,CAAC,SAAS,IAAI,cAAc;IAOrC,SAAS,CAAC,UAAU,IAAI,cAAc;CAUvC"}
|
|
@@ -120,45 +120,77 @@ let UiListItem = (() => {
|
|
|
120
120
|
}
|
|
121
121
|
}
|
|
122
122
|
handleKeyDown(e) {
|
|
123
|
+
if (this.disabled || this.static) {
|
|
124
|
+
e.stopPropagation();
|
|
125
|
+
e.preventDefault();
|
|
126
|
+
return;
|
|
127
|
+
}
|
|
123
128
|
if (e.key !== ' ' && e.key !== 'Enter')
|
|
124
129
|
return;
|
|
125
130
|
e.preventDefault();
|
|
126
131
|
this.beginPress({ positionEvent: e });
|
|
127
132
|
}
|
|
128
133
|
handleKeyUp(e) {
|
|
134
|
+
if (this.disabled || this.static) {
|
|
135
|
+
e.stopPropagation();
|
|
136
|
+
e.preventDefault();
|
|
137
|
+
return;
|
|
138
|
+
}
|
|
129
139
|
if (e.key !== ' ' && e.key !== 'Enter')
|
|
130
140
|
return;
|
|
131
141
|
e.preventDefault();
|
|
132
142
|
this.endPress({ cancelled: false, actionData: { item: this } });
|
|
133
143
|
}
|
|
134
144
|
beginPress(options) {
|
|
145
|
+
if (this.disabled || this.static) {
|
|
146
|
+
return;
|
|
147
|
+
}
|
|
135
148
|
super.beginPress(options);
|
|
136
149
|
this.ripple.beginPress(options.positionEvent);
|
|
137
150
|
}
|
|
138
151
|
endPress(options) {
|
|
152
|
+
if (this.disabled || this.static) {
|
|
153
|
+
return;
|
|
154
|
+
}
|
|
139
155
|
super.endPress(options);
|
|
140
156
|
this.ripple.endPress();
|
|
141
157
|
}
|
|
142
158
|
handlePointerEnter(e) {
|
|
159
|
+
if (this.disabled || this.static) {
|
|
160
|
+
e.stopPropagation();
|
|
161
|
+
e.preventDefault();
|
|
162
|
+
return;
|
|
163
|
+
}
|
|
143
164
|
this.ripple.beginHover(e);
|
|
144
165
|
}
|
|
145
166
|
handlePointerLeave(e) {
|
|
167
|
+
if (this.disabled || this.static) {
|
|
168
|
+
e.stopPropagation();
|
|
169
|
+
e.preventDefault();
|
|
170
|
+
return;
|
|
171
|
+
}
|
|
146
172
|
super.handlePointerLeave(e);
|
|
147
173
|
this.ripple.endHover();
|
|
148
174
|
}
|
|
149
175
|
handleFocus() {
|
|
176
|
+
if (this.disabled || this.static) {
|
|
177
|
+
return;
|
|
178
|
+
}
|
|
150
179
|
this.ripple.beginFocus();
|
|
151
180
|
}
|
|
152
181
|
handleBlur() {
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
182
|
+
if (this.disabled || this.static) {
|
|
183
|
+
return;
|
|
184
|
+
}
|
|
156
185
|
this.ripple.endFocus();
|
|
157
186
|
}
|
|
158
187
|
/**
|
|
159
188
|
* Focuses list item and makes list item focusable via keyboard.
|
|
160
189
|
*/
|
|
161
190
|
activate() {
|
|
191
|
+
if (this.disabled || this.static) {
|
|
192
|
+
return;
|
|
193
|
+
}
|
|
162
194
|
this.setAttribute('tabindex', '0');
|
|
163
195
|
this.focus();
|
|
164
196
|
this.ripple.beginFocus();
|
|
@@ -167,12 +199,18 @@ let UiListItem = (() => {
|
|
|
167
199
|
* Returns true if list item is currently focused and is focusable.
|
|
168
200
|
*/
|
|
169
201
|
isActive() {
|
|
202
|
+
if (this.disabled || this.static) {
|
|
203
|
+
return false;
|
|
204
|
+
}
|
|
170
205
|
return this.getAttribute('tabindex') === '0';
|
|
171
206
|
}
|
|
172
207
|
/**
|
|
173
208
|
* Removes list item from sequential keyboard navigation.
|
|
174
209
|
*/
|
|
175
210
|
deactivate() {
|
|
211
|
+
if (this.disabled || this.static) {
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
176
214
|
this.removeAttribute('tabindex');
|
|
177
215
|
}
|
|
178
216
|
handleSlotChange() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { BeginPressConfig, EndPressConfig } from '../../../controllers/ActionController.js'\nimport UiRipple from '../../ripple/internals/ripple.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { ripple } from '../../effects/rippleDirective.js'\nimport '../../ripple/ui-ripple.js'\n\nexport enum ListItemLines {\n one = 'one',\n two = 'two',\n three = 'three',\n}\n\nexport enum ListItemImage {\n icon = 'icon',\n avatar = 'avatar',\n image = 'image',\n video = 'video',\n auto = 'auto',\n}\n\n/**\n * @slot\n * @slot start\n * @slot end\n * @slot end-text\n * @slot supporting-text\n */\nexport default class UiListItem extends UiElement {\n @query('ui-ripple') accessor ripple!: UiRipple\n\n /**\n * Whether the chip is disabled. The user can't interact with the chip when `true`.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n /**\n * The number of lines to render the list template for.\n * @default ListItemLines.one\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor lines: ListItemLines\n\n /**\n * The type of the list image.\n * @default ListItemImage.icon\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor image: ListItemImage\n\n /**\n * Whether the list item is static and should not be focusable.\n * The ripple effect will not be applied when `true`.\n * @default false\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor static = false\n\n constructor() {\n super()\n\n this.lines = ListItemLines.one\n this.image = ListItemImage.icon\n\n this.addEventListener('click', this.handleClick.bind(this))\n this.addEventListener('pointerdown', this.handlePointerDown.bind(this))\n this.addEventListener('pointerup', this.handlePointerUp.bind(this))\n this.addEventListener('pointercancel', this.handlePointerCancel.bind(this))\n this.addEventListener('pointerleave', this.handlePointerLeave.bind(this))\n this.addEventListener('contextmenu', this.handleContextMenu.bind(this))\n this.addEventListener('keydown', this.handleKeyDown.bind(this))\n this.addEventListener('keyup', this.handleKeyUp.bind(this))\n this.addEventListener('focus', this.handleFocus.bind(this))\n this.addEventListener('blur', this.handleBlur.bind(this))\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'listitem')\n }\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('disabled')) {\n setDisabled(this, cp.get('disabled'))\n }\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n if (e.key !== ' ' && e.key !== 'Enter') return\n\n e.preventDefault()\n this.beginPress({ positionEvent: e })\n }\n\n override handleKeyUp(e: KeyboardEvent): void {\n if (e.key !== ' ' && e.key !== 'Enter') return\n\n e.preventDefault()\n this.endPress({ cancelled: false, actionData: { item: this } })\n }\n\n override beginPress(options: BeginPressConfig): void {\n super.beginPress(options)\n this.ripple.beginPress(options.positionEvent)\n }\n\n override endPress(options: EndPressConfig): void {\n super.endPress(options)\n this.ripple.endPress()\n }\n\n protected handlePointerEnter(e: PointerEvent): void {\n this.ripple.beginHover(e)\n }\n\n override handlePointerLeave(e: PointerEvent): void {\n super.handlePointerLeave(e)\n\n this.ripple.endHover()\n }\n\n protected handleFocus(): void {\n this.ripple.beginFocus()\n }\n\n protected handleBlur(): void {\n // if (this.matches(':focus-within')) {\n // return;\n // }\n this.ripple.endFocus()\n }\n\n /**\n * Focuses list item and makes list item focusable via keyboard.\n */\n activate(): void {\n this.setAttribute('tabindex', '0')\n this.focus()\n this.ripple.beginFocus()\n }\n\n /**\n * Returns true if list item is currently focused and is focusable.\n */\n isActive(): boolean {\n return this.getAttribute('tabindex') === '0'\n }\n\n /**\n * Removes list item from sequential keyboard navigation.\n */\n deactivate(): void {\n this.removeAttribute('tabindex')\n }\n\n protected handleSlotChange(): void {\n this.requestUpdate()\n }\n\n protected override render(): TemplateResult {\n const { pressed = false } = this\n const surfaceClasses = classMap({\n surface: true,\n pressed,\n })\n\n return html`\n <div class=\"${surfaceClasses}\" ${ripple(() => this.ripple)}>\n <div class=\"container\"></div>\n <div class=\"state\"></div>\n <div class=\"content\">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</div>\n ${this.renderRipple()}\n </div>\n `\n }\n\n protected renderRipple = (): TemplateResult => {\n const { disabled, static: isStatic } = this\n return html`<ui-ripple class=\"ripple\" ?disabled=\"${disabled || isStatic}\"></ui-ripple>`\n }\n\n protected renderStart(): TemplateResult {\n return html`<div class=\"start\">\n <slot name=\"start\" @slotchange=${this.handleSlotChange}></slot>\n </div>`\n }\n\n protected renderEnd(): TemplateResult {\n return html`<div class=\"end\">\n <slot name=\"end\" @slotchange=${this.handleSlotChange}></slot>\n <span class=\"trailing-supporting-text\"><slot name=\"end-text\"></slot></span>\n </div>`\n }\n\n protected renderBody(): TemplateResult {\n const { lines = ListItemLines.one } = this\n const hasSupportingText = lines !== ListItemLines.one\n return html`\n <div class=\"body\">\n <span class=\"headline\"><slot></slot></span>\n ${hasSupportingText ? html`<span class=\"supporting-text\"><slot name=\"supporting-text\"></slot></span>` : ''}\n </div>\n `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { BeginPressConfig, EndPressConfig } from '../../../controllers/ActionController.js'\nimport UiRipple from '../../ripple/internals/ripple.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { ripple } from '../../effects/rippleDirective.js'\nimport '../../ripple/ui-ripple.js'\n\nexport enum ListItemLines {\n one = 'one',\n two = 'two',\n three = 'three',\n}\n\nexport enum ListItemImage {\n icon = 'icon',\n avatar = 'avatar',\n image = 'image',\n video = 'video',\n auto = 'auto',\n}\n\n/**\n * @slot\n * @slot start\n * @slot end\n * @slot end-text\n * @slot supporting-text\n */\nexport default class UiListItem extends UiElement {\n @query('ui-ripple') accessor ripple!: UiRipple\n\n /**\n * Whether the chip is disabled. The user can't interact with the chip when `true`.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n /**\n * The number of lines to render the list template for.\n * @default ListItemLines.one\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor lines: ListItemLines\n\n /**\n * The type of the list image.\n * @default ListItemImage.icon\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor image: ListItemImage\n\n /**\n * Whether the list item is static and should not be focusable.\n * The ripple effect will not be applied when `true`.\n * @default false\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor static = false\n\n constructor() {\n super()\n\n this.lines = ListItemLines.one\n this.image = ListItemImage.icon\n\n this.addEventListener('click', this.handleClick.bind(this))\n this.addEventListener('pointerdown', this.handlePointerDown.bind(this))\n this.addEventListener('pointerup', this.handlePointerUp.bind(this))\n this.addEventListener('pointercancel', this.handlePointerCancel.bind(this))\n this.addEventListener('pointerleave', this.handlePointerLeave.bind(this))\n this.addEventListener('contextmenu', this.handleContextMenu.bind(this))\n this.addEventListener('keydown', this.handleKeyDown.bind(this))\n this.addEventListener('keyup', this.handleKeyUp.bind(this))\n this.addEventListener('focus', this.handleFocus.bind(this))\n this.addEventListener('blur', this.handleBlur.bind(this))\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'listitem')\n }\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('disabled')) {\n setDisabled(this, cp.get('disabled'))\n }\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n if (this.disabled || this.static) {\n e.stopPropagation()\n e.preventDefault()\n return\n }\n if (e.key !== ' ' && e.key !== 'Enter') return\n\n e.preventDefault()\n this.beginPress({ positionEvent: e })\n }\n\n override handleKeyUp(e: KeyboardEvent): void {\n if (this.disabled || this.static) {\n e.stopPropagation()\n e.preventDefault()\n return\n }\n if (e.key !== ' ' && e.key !== 'Enter') return\n\n e.preventDefault()\n this.endPress({ cancelled: false, actionData: { item: this } })\n }\n\n override beginPress(options: BeginPressConfig): void {\n if (this.disabled || this.static) {\n return\n }\n super.beginPress(options)\n this.ripple.beginPress(options.positionEvent)\n }\n\n override endPress(options: EndPressConfig): void {\n if (this.disabled || this.static) {\n return\n }\n super.endPress(options)\n this.ripple.endPress()\n }\n\n protected handlePointerEnter(e: PointerEvent): void {\n if (this.disabled || this.static) {\n e.stopPropagation()\n e.preventDefault()\n return\n }\n this.ripple.beginHover(e)\n }\n\n override handlePointerLeave(e: PointerEvent): void {\n if (this.disabled || this.static) {\n e.stopPropagation()\n e.preventDefault()\n return\n }\n super.handlePointerLeave(e)\n\n this.ripple.endHover()\n }\n\n protected handleFocus(): void {\n if (this.disabled || this.static) {\n return\n }\n this.ripple.beginFocus()\n }\n\n protected handleBlur(): void {\n if (this.disabled || this.static) {\n return\n }\n this.ripple.endFocus()\n }\n\n /**\n * Focuses list item and makes list item focusable via keyboard.\n */\n activate(): void {\n if (this.disabled || this.static) {\n return\n }\n this.setAttribute('tabindex', '0')\n this.focus()\n this.ripple.beginFocus()\n }\n\n /**\n * Returns true if list item is currently focused and is focusable.\n */\n isActive(): boolean {\n if (this.disabled || this.static) {\n return false\n }\n return this.getAttribute('tabindex') === '0'\n }\n\n /**\n * Removes list item from sequential keyboard navigation.\n */\n deactivate(): void {\n if (this.disabled || this.static) {\n return\n }\n this.removeAttribute('tabindex')\n }\n\n protected handleSlotChange(): void {\n this.requestUpdate()\n }\n\n protected override render(): TemplateResult {\n const { pressed = false } = this\n const surfaceClasses = classMap({\n surface: true,\n pressed,\n })\n\n return html`\n <div class=\"${surfaceClasses}\" ${ripple(() => this.ripple)}>\n <div class=\"container\"></div>\n <div class=\"state\"></div>\n <div class=\"content\">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</div>\n ${this.renderRipple()}\n </div>\n `\n }\n\n protected renderRipple = (): TemplateResult => {\n const { disabled, static: isStatic } = this\n return html`<ui-ripple class=\"ripple\" ?disabled=\"${disabled || isStatic}\"></ui-ripple>`\n }\n\n protected renderStart(): TemplateResult {\n return html`<div class=\"start\">\n <slot name=\"start\" @slotchange=${this.handleSlotChange}></slot>\n </div>`\n }\n\n protected renderEnd(): TemplateResult {\n return html`<div class=\"end\">\n <slot name=\"end\" @slotchange=${this.handleSlotChange}></slot>\n <span class=\"trailing-supporting-text\"><slot name=\"end-text\"></slot></span>\n </div>`\n }\n\n protected renderBody(): TemplateResult {\n const { lines = ListItemLines.one } = this\n const hasSupportingText = lines !== ListItemLines.one\n return html`\n <div class=\"body\">\n <span class=\"headline\"><slot></slot></span>\n ${hasSupportingText ? html`<span class=\"supporting-text\"><slot name=\"supporting-text\"></slot></span>` : ''}\n </div>\n `\n }\n}\n"]}
|
package/package.json
CHANGED
|
@@ -92,6 +92,11 @@ export default class UiListItem extends UiElement {
|
|
|
92
92
|
}
|
|
93
93
|
|
|
94
94
|
override handleKeyDown(e: KeyboardEvent): void {
|
|
95
|
+
if (this.disabled || this.static) {
|
|
96
|
+
e.stopPropagation()
|
|
97
|
+
e.preventDefault()
|
|
98
|
+
return
|
|
99
|
+
}
|
|
95
100
|
if (e.key !== ' ' && e.key !== 'Enter') return
|
|
96
101
|
|
|
97
102
|
e.preventDefault()
|
|
@@ -99,6 +104,11 @@ export default class UiListItem extends UiElement {
|
|
|
99
104
|
}
|
|
100
105
|
|
|
101
106
|
override handleKeyUp(e: KeyboardEvent): void {
|
|
107
|
+
if (this.disabled || this.static) {
|
|
108
|
+
e.stopPropagation()
|
|
109
|
+
e.preventDefault()
|
|
110
|
+
return
|
|
111
|
+
}
|
|
102
112
|
if (e.key !== ' ' && e.key !== 'Enter') return
|
|
103
113
|
|
|
104
114
|
e.preventDefault()
|
|
@@ -106,33 +116,52 @@ export default class UiListItem extends UiElement {
|
|
|
106
116
|
}
|
|
107
117
|
|
|
108
118
|
override beginPress(options: BeginPressConfig): void {
|
|
119
|
+
if (this.disabled || this.static) {
|
|
120
|
+
return
|
|
121
|
+
}
|
|
109
122
|
super.beginPress(options)
|
|
110
123
|
this.ripple.beginPress(options.positionEvent)
|
|
111
124
|
}
|
|
112
125
|
|
|
113
126
|
override endPress(options: EndPressConfig): void {
|
|
127
|
+
if (this.disabled || this.static) {
|
|
128
|
+
return
|
|
129
|
+
}
|
|
114
130
|
super.endPress(options)
|
|
115
131
|
this.ripple.endPress()
|
|
116
132
|
}
|
|
117
133
|
|
|
118
134
|
protected handlePointerEnter(e: PointerEvent): void {
|
|
135
|
+
if (this.disabled || this.static) {
|
|
136
|
+
e.stopPropagation()
|
|
137
|
+
e.preventDefault()
|
|
138
|
+
return
|
|
139
|
+
}
|
|
119
140
|
this.ripple.beginHover(e)
|
|
120
141
|
}
|
|
121
142
|
|
|
122
143
|
override handlePointerLeave(e: PointerEvent): void {
|
|
144
|
+
if (this.disabled || this.static) {
|
|
145
|
+
e.stopPropagation()
|
|
146
|
+
e.preventDefault()
|
|
147
|
+
return
|
|
148
|
+
}
|
|
123
149
|
super.handlePointerLeave(e)
|
|
124
150
|
|
|
125
151
|
this.ripple.endHover()
|
|
126
152
|
}
|
|
127
153
|
|
|
128
154
|
protected handleFocus(): void {
|
|
155
|
+
if (this.disabled || this.static) {
|
|
156
|
+
return
|
|
157
|
+
}
|
|
129
158
|
this.ripple.beginFocus()
|
|
130
159
|
}
|
|
131
160
|
|
|
132
161
|
protected handleBlur(): void {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
162
|
+
if (this.disabled || this.static) {
|
|
163
|
+
return
|
|
164
|
+
}
|
|
136
165
|
this.ripple.endFocus()
|
|
137
166
|
}
|
|
138
167
|
|
|
@@ -140,6 +169,9 @@ export default class UiListItem extends UiElement {
|
|
|
140
169
|
* Focuses list item and makes list item focusable via keyboard.
|
|
141
170
|
*/
|
|
142
171
|
activate(): void {
|
|
172
|
+
if (this.disabled || this.static) {
|
|
173
|
+
return
|
|
174
|
+
}
|
|
143
175
|
this.setAttribute('tabindex', '0')
|
|
144
176
|
this.focus()
|
|
145
177
|
this.ripple.beginFocus()
|
|
@@ -149,6 +181,9 @@ export default class UiListItem extends UiElement {
|
|
|
149
181
|
* Returns true if list item is currently focused and is focusable.
|
|
150
182
|
*/
|
|
151
183
|
isActive(): boolean {
|
|
184
|
+
if (this.disabled || this.static) {
|
|
185
|
+
return false
|
|
186
|
+
}
|
|
152
187
|
return this.getAttribute('tabindex') === '0'
|
|
153
188
|
}
|
|
154
189
|
|
|
@@ -156,6 +191,9 @@ export default class UiListItem extends UiElement {
|
|
|
156
191
|
* Removes list item from sequential keyboard navigation.
|
|
157
192
|
*/
|
|
158
193
|
deactivate(): void {
|
|
194
|
+
if (this.disabled || this.static) {
|
|
195
|
+
return
|
|
196
|
+
}
|
|
159
197
|
this.removeAttribute('tabindex')
|
|
160
198
|
}
|
|
161
199
|
|