@api-client/ui 0.5.38 → 0.5.39

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.
@@ -8,7 +8,8 @@ import '../../ripple/ui-ripple.js';
8
8
  export declare enum ListItemLines {
9
9
  one = "one",
10
10
  two = "two",
11
- three = "three"
11
+ three = "three",
12
+ auto = "auto"
12
13
  }
13
14
  export declare enum ListItemImage {
14
15
  icon = "icon",
@@ -18,26 +19,28 @@ export declare enum ListItemImage {
18
19
  auto = "auto"
19
20
  }
20
21
  /**
21
- * @slot
22
- * @slot overline
23
- * @slot start
24
- * @slot end
25
- * @slot end-text
26
- * @slot supporting-text
22
+ * @slot - The main content of the list item, typically a label or title.
23
+ * @slot overline - The text displayed above the main content.
24
+ * @slot start - The content displayed at the start of the list item.
25
+ * @slot end - The content displayed at the end of the list item.
26
+ * @slot end-text - The text displayed at the end of the list item.
27
+ * @slot supporting-text - The supporting text displayed below the main content.
27
28
  */
28
29
  export default class UiListItem extends UiElement {
30
+ #private;
29
31
  accessor ripple: UiRipple;
32
+ get lines(): ListItemLines;
30
33
  /**
31
- * Whether the chip is disabled. The user can't interact with the chip when `true`.
34
+ * The number of lines to render the list template for.
35
+ * @default ListItemLines.one
32
36
  * @attribute
33
37
  */
34
- accessor disabled: boolean;
38
+ set lines(value: ListItemLines);
35
39
  /**
36
- * The number of lines to render the list template for.
37
- * @default ListItemLines.one
40
+ * Whether the chip is disabled. The user can't interact with the chip when `true`.
38
41
  * @attribute
39
42
  */
40
- accessor lines: ListItemLines;
43
+ accessor disabled: boolean;
41
44
  /**
42
45
  * The type of the list image.
43
46
  * @default ListItemImage.icon
@@ -55,6 +58,8 @@ export default class UiListItem extends UiElement {
55
58
  accessor hasStartItem: boolean;
56
59
  accessor hasEndItem: boolean;
57
60
  accessor hasEndTextItem: boolean;
61
+ accessor hasOverline: boolean;
62
+ accessor hasSupportingText: boolean;
58
63
  constructor();
59
64
  protected updated(changedProperties: PropertyValues<this>): void;
60
65
  connectedCallback(): void;
@@ -77,9 +82,13 @@ export default class UiListItem extends UiElement {
77
82
  * Removes list item from sequential keyboard navigation.
78
83
  */
79
84
  deactivate(): void;
80
- protected handleStartSlotChange(): void;
81
- protected handleEndSlotChange(): void;
82
- protected handleEndTextSlotChange(): void;
85
+ private _handleSlotChange;
86
+ protected handleOverlineSlotChange(event: Event): void;
87
+ protected handleSupportingTextSlotChange(event: Event): void;
88
+ protected handleStartSlotChange(event: Event): void;
89
+ protected handleEndSlotChange(event: Event): void;
90
+ protected handleEndTextSlotChange(event: Event): void;
91
+ getSurfaceClasses(): ClassInfo;
83
92
  protected render(): TemplateResult;
84
93
  protected renderRipple: () => TemplateResult;
85
94
  protected renderFocusRing(): TemplateResult;
@@ -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;AAE1D,OAAO,EAAY,SAAS,EAAE,MAAM,6BAA6B,CAAA;AACjE,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,sCAAsC,CAAA;AAC7C,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;;;;;;;GAOG;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;IAEnE,SAA6D,QAAQ,SAAK;IAEjE,QAAQ,CAAC,YAAY,UAAQ;IAC7B,QAAQ,CAAC,UAAU,UAAQ;IAC3B,QAAQ,CAAC,cAAc,UAAQ;;cAmBrB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOhE,iBAAiB,IAAI,IAAI;cAOf,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAWrC,WAAW,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAYnC,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;IAQ3C,QAAQ,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAQvC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IASzC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAWlD;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;OAEG;IACH,QAAQ,IAAI,OAAO;IAOnB;;OAEG;IACH,UAAU,IAAI,IAAI;IAOlB,SAAS,CAAC,qBAAqB,IAAI,IAAI;IAUvC,SAAS,CAAC,mBAAmB,IAAI,IAAI;IAUrC,SAAS,CAAC,uBAAuB,IAAI,IAAI;cAUtB,MAAM,IAAI,cAAc;IAU3C,SAAS,CAAC,YAAY,QAAO,cAAc,CAG1C;IAED,SAAS,CAAC,eAAe,IAAI,cAAc;IAS3C,SAAS,CAAC,eAAe,IAAI,SAAS;IAOtC,SAAS,CAAC,WAAW,IAAI,cAAc;IAMvC,SAAS,CAAC,aAAa,IAAI,SAAS;IAQpC,SAAS,CAAC,SAAS,IAAI,cAAc;IAOrC,SAAS,CAAC,UAAU,IAAI,cAAc;CAWvC"}
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;AAE1D,OAAO,EAAY,SAAS,EAAE,MAAM,6BAA6B,CAAA;AACjE,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,sCAAsC,CAAA;AAC7C,OAAO,2BAA2B,CAAA;AAElC,oBAAY,aAAa;IACvB,GAAG,QAAQ;IACX,GAAG,QAAQ;IACX,KAAK,UAAU;IACf,IAAI,SAAS;CACd;AAED,oBAAY,aAAa;IACvB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,IAAI,SAAS;CACd;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,SAAS;;IAC3B,QAAQ,CAAC,MAAM,EAAG,QAAQ,CAAA;IAI9C,IAAI,KAAK,IAAI,aAAa,CAKzB;IAED;;;;OAIG;IACH,IACI,KAAK,CAAC,KAAK,EAAE,aAAa,EAI7B;IAED;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;OAIG;IACwC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAA;IAExE;;;;;OAKG;IACyC,QAAQ,CAAC,MAAM,UAAQ;IAEnE,SAA6D,QAAQ,SAAK;IAEjE,QAAQ,CAAC,YAAY,UAAQ;IAC7B,QAAQ,CAAC,UAAU,UAAQ;IAC3B,QAAQ,CAAC,cAAc,UAAQ;IAC/B,QAAQ,CAAC,WAAW,UAAQ;IAC5B,QAAQ,CAAC,iBAAiB,UAAQ;;cAmBxB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOhE,iBAAiB,IAAI,IAAI;cAOf,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAWrC,WAAW,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAYnC,UAAU,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;IAQ3C,QAAQ,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAQvC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IASzC,kBAAkB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAWlD;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;OAEG;IACH,QAAQ,IAAI,OAAO;IAOnB;;OAEG;IACH,UAAU,IAAI,IAAI;IAOlB,OAAO,CAAC,iBAAiB;IAKzB,SAAS,CAAC,wBAAwB,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAKtD,SAAS,CAAC,8BAA8B,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAK5D,SAAS,CAAC,qBAAqB,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAKnD,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAKjD,SAAS,CAAC,uBAAuB,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAKrD,iBAAiB,IAAI,SAAS;cAUX,MAAM,IAAI,cAAc;IAS3C,SAAS,CAAC,YAAY,QAAO,cAAc,CAE1C;IAED,SAAS,CAAC,eAAe,IAAI,cAAc;IAS3C,SAAS,CAAC,eAAe,IAAI,SAAS;IAOtC,SAAS,CAAC,WAAW,IAAI,cAAc;IAMvC,SAAS,CAAC,aAAa,IAAI,SAAS;IAQpC,SAAS,CAAC,SAAS,IAAI,cAAc;IAOrC,SAAS,CAAC,UAAU,IAAI,cAAc;CAWvC"}
@@ -11,6 +11,7 @@ export var ListItemLines;
11
11
  ListItemLines["one"] = "one";
12
12
  ListItemLines["two"] = "two";
13
13
  ListItemLines["three"] = "three";
14
+ ListItemLines["auto"] = "auto";
14
15
  })(ListItemLines || (ListItemLines = {}));
15
16
  export var ListItemImage;
16
17
  (function (ListItemImage) {
@@ -22,15 +23,14 @@ export var ListItemImage;
22
23
  })(ListItemImage || (ListItemImage = {}));
23
24
  let UiListItem = (() => {
24
25
  let _classSuper = UiElement;
26
+ let _instanceExtraInitializers = [];
25
27
  let _ripple_decorators;
26
28
  let _ripple_initializers = [];
27
29
  let _ripple_extraInitializers = [];
30
+ let _set_lines_decorators;
28
31
  let _disabled_decorators;
29
32
  let _disabled_initializers = [];
30
33
  let _disabled_extraInitializers = [];
31
- let _lines_decorators;
32
- let _lines_initializers = [];
33
- let _lines_extraInitializers = [];
34
34
  let _image_decorators;
35
35
  let _image_initializers = [];
36
36
  let _image_extraInitializers = [];
@@ -49,54 +49,73 @@ let UiListItem = (() => {
49
49
  let _hasEndTextItem_decorators;
50
50
  let _hasEndTextItem_initializers = [];
51
51
  let _hasEndTextItem_extraInitializers = [];
52
+ let _hasOverline_decorators;
53
+ let _hasOverline_initializers = [];
54
+ let _hasOverline_extraInitializers = [];
55
+ let _hasSupportingText_decorators;
56
+ let _hasSupportingText_initializers = [];
57
+ let _hasSupportingText_extraInitializers = [];
52
58
  return class UiListItem extends _classSuper {
53
59
  static {
54
60
  const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
55
61
  _ripple_decorators = [query('ui-ripple')];
62
+ _set_lines_decorators = [property({ type: String, reflect: true })];
56
63
  _disabled_decorators = [property({ type: Boolean, reflect: true })];
57
- _lines_decorators = [property({ type: String, reflect: true })];
58
64
  _image_decorators = [property({ type: String, reflect: true })];
59
65
  _static_decorators = [property({ type: Boolean, reflect: true })];
60
66
  _tabIndex_decorators = [property({ type: Number, reflect: true })];
61
67
  _hasStartItem_decorators = [state()];
62
68
  _hasEndItem_decorators = [state()];
63
69
  _hasEndTextItem_decorators = [state()];
70
+ _hasOverline_decorators = [state()];
71
+ _hasSupportingText_decorators = [state()];
64
72
  __esDecorate(this, null, _ripple_decorators, { kind: "accessor", name: "ripple", static: false, private: false, access: { has: obj => "ripple" in obj, get: obj => obj.ripple, set: (obj, value) => { obj.ripple = value; } }, metadata: _metadata }, _ripple_initializers, _ripple_extraInitializers);
73
+ __esDecorate(this, null, _set_lines_decorators, { kind: "setter", name: "lines", static: false, private: false, access: { has: obj => "lines" in obj, set: (obj, value) => { obj.lines = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
65
74
  __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
66
- __esDecorate(this, null, _lines_decorators, { kind: "accessor", name: "lines", static: false, private: false, access: { has: obj => "lines" in obj, get: obj => obj.lines, set: (obj, value) => { obj.lines = value; } }, metadata: _metadata }, _lines_initializers, _lines_extraInitializers);
67
75
  __esDecorate(this, null, _image_decorators, { kind: "accessor", name: "image", static: false, private: false, access: { has: obj => "image" in obj, get: obj => obj.image, set: (obj, value) => { obj.image = value; } }, metadata: _metadata }, _image_initializers, _image_extraInitializers);
68
76
  __esDecorate(this, null, _static_decorators, { kind: "accessor", name: "static", static: false, private: false, access: { has: obj => "static" in obj, get: obj => obj.static, set: (obj, value) => { obj.static = value; } }, metadata: _metadata }, _static_initializers, _static_extraInitializers);
69
77
  __esDecorate(this, null, _tabIndex_decorators, { kind: "accessor", name: "tabIndex", static: false, private: false, access: { has: obj => "tabIndex" in obj, get: obj => obj.tabIndex, set: (obj, value) => { obj.tabIndex = value; } }, metadata: _metadata }, _tabIndex_initializers, _tabIndex_extraInitializers);
70
78
  __esDecorate(this, null, _hasStartItem_decorators, { kind: "accessor", name: "hasStartItem", static: false, private: false, access: { has: obj => "hasStartItem" in obj, get: obj => obj.hasStartItem, set: (obj, value) => { obj.hasStartItem = value; } }, metadata: _metadata }, _hasStartItem_initializers, _hasStartItem_extraInitializers);
71
79
  __esDecorate(this, null, _hasEndItem_decorators, { kind: "accessor", name: "hasEndItem", static: false, private: false, access: { has: obj => "hasEndItem" in obj, get: obj => obj.hasEndItem, set: (obj, value) => { obj.hasEndItem = value; } }, metadata: _metadata }, _hasEndItem_initializers, _hasEndItem_extraInitializers);
72
80
  __esDecorate(this, null, _hasEndTextItem_decorators, { kind: "accessor", name: "hasEndTextItem", static: false, private: false, access: { has: obj => "hasEndTextItem" in obj, get: obj => obj.hasEndTextItem, set: (obj, value) => { obj.hasEndTextItem = value; } }, metadata: _metadata }, _hasEndTextItem_initializers, _hasEndTextItem_extraInitializers);
81
+ __esDecorate(this, null, _hasOverline_decorators, { kind: "accessor", name: "hasOverline", static: false, private: false, access: { has: obj => "hasOverline" in obj, get: obj => obj.hasOverline, set: (obj, value) => { obj.hasOverline = value; } }, metadata: _metadata }, _hasOverline_initializers, _hasOverline_extraInitializers);
82
+ __esDecorate(this, null, _hasSupportingText_decorators, { kind: "accessor", name: "hasSupportingText", static: false, private: false, access: { has: obj => "hasSupportingText" in obj, get: obj => obj.hasSupportingText, set: (obj, value) => { obj.hasSupportingText = value; } }, metadata: _metadata }, _hasSupportingText_initializers, _hasSupportingText_extraInitializers);
73
83
  if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
74
84
  }
75
- #ripple_accessor_storage = __runInitializers(this, _ripple_initializers, void 0);
85
+ #ripple_accessor_storage = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _ripple_initializers, void 0));
76
86
  get ripple() { return this.#ripple_accessor_storage; }
77
87
  set ripple(value) { this.#ripple_accessor_storage = value; }
78
- #disabled_accessor_storage = (__runInitializers(this, _ripple_extraInitializers), __runInitializers(this, _disabled_initializers, false
88
+ #lines = (__runInitializers(this, _ripple_extraInitializers), ListItemLines.one);
89
+ get lines() {
90
+ if (this.#lines === ListItemLines.auto) {
91
+ return this.hasOverline || this.hasSupportingText ? ListItemLines.two : ListItemLines.one;
92
+ }
93
+ return this.#lines;
94
+ }
79
95
  /**
80
96
  * The number of lines to render the list template for.
81
97
  * @default ListItemLines.one
82
98
  * @attribute
83
99
  */
84
- ));
100
+ set lines(value) {
101
+ const oldValue = this.#lines;
102
+ this.#lines = value;
103
+ this.requestUpdate('lines', oldValue);
104
+ }
105
+ #disabled_accessor_storage = __runInitializers(this, _disabled_initializers, false
85
106
  /**
86
- * Whether the chip is disabled. The user can't interact with the chip when `true`.
107
+ * The type of the list image.
108
+ * @default ListItemImage.icon
87
109
  * @attribute
88
110
  */
89
- get disabled() { return this.#disabled_accessor_storage; }
90
- set disabled(value) { this.#disabled_accessor_storage = value; }
91
- #lines_accessor_storage = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _lines_initializers, void 0));
111
+ );
92
112
  /**
93
- * The number of lines to render the list template for.
94
- * @default ListItemLines.one
113
+ * Whether the chip is disabled. The user can't interact with the chip when `true`.
95
114
  * @attribute
96
115
  */
97
- get lines() { return this.#lines_accessor_storage; }
98
- set lines(value) { this.#lines_accessor_storage = value; }
99
- #image_accessor_storage = (__runInitializers(this, _lines_extraInitializers), __runInitializers(this, _image_initializers, void 0));
116
+ get disabled() { return this.#disabled_accessor_storage; }
117
+ set disabled(value) { this.#disabled_accessor_storage = value; }
118
+ #image_accessor_storage = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _image_initializers, void 0));
100
119
  /**
101
120
  * The type of the list image.
102
121
  * @default ListItemImage.icon
@@ -125,10 +144,16 @@ let UiListItem = (() => {
125
144
  #hasEndTextItem_accessor_storage = (__runInitializers(this, _hasEndItem_extraInitializers), __runInitializers(this, _hasEndTextItem_initializers, false));
126
145
  get hasEndTextItem() { return this.#hasEndTextItem_accessor_storage; }
127
146
  set hasEndTextItem(value) { this.#hasEndTextItem_accessor_storage = value; }
147
+ #hasOverline_accessor_storage = (__runInitializers(this, _hasEndTextItem_extraInitializers), __runInitializers(this, _hasOverline_initializers, false));
148
+ get hasOverline() { return this.#hasOverline_accessor_storage; }
149
+ set hasOverline(value) { this.#hasOverline_accessor_storage = value; }
150
+ #hasSupportingText_accessor_storage = (__runInitializers(this, _hasOverline_extraInitializers), __runInitializers(this, _hasSupportingText_initializers, false));
151
+ get hasSupportingText() { return this.#hasSupportingText_accessor_storage; }
152
+ set hasSupportingText(value) { this.#hasSupportingText_accessor_storage = value; }
128
153
  constructor() {
129
154
  super();
130
- this.lines = ListItemLines.one;
131
155
  this.image = ListItemImage.icon;
156
+ this.lines = ListItemLines.one;
132
157
  this.addEventListener('click', this.handleClick.bind(this));
133
158
  this.addEventListener('pointerdown', this.handlePointerDown.bind(this));
134
159
  this.addEventListener('pointerup', this.handlePointerUp.bind(this));
@@ -237,48 +262,49 @@ let UiListItem = (() => {
237
262
  }
238
263
  this.removeAttribute('tabindex');
239
264
  }
240
- handleStartSlotChange() {
241
- const slot = this.shadowRoot?.querySelector('slot[name="start"]');
242
- if (slot) {
243
- this.hasStartItem = slot.assignedNodes({ flatten: true }).length > 0;
244
- }
245
- else {
246
- this.hasStartItem = false;
247
- }
265
+ _handleSlotChange(event) {
266
+ const slot = event.target;
267
+ return slot.assignedNodes({ flatten: true }).length > 0;
268
+ }
269
+ handleOverlineSlotChange(event) {
270
+ this.hasOverline = this._handleSlotChange(event);
248
271
  this.requestUpdate();
249
272
  }
250
- handleEndSlotChange() {
251
- const slot = this.shadowRoot?.querySelector('slot[name="end"]');
252
- if (slot) {
253
- this.hasEndItem = slot.assignedNodes({ flatten: true }).length > 0;
254
- }
255
- else {
256
- this.hasEndItem = false;
257
- }
273
+ handleSupportingTextSlotChange(event) {
274
+ this.hasSupportingText = this._handleSlotChange(event);
258
275
  this.requestUpdate();
259
276
  }
260
- handleEndTextSlotChange() {
261
- const slot = this.shadowRoot?.querySelector('slot[name="end-text"]');
262
- if (slot) {
263
- this.hasEndTextItem = slot.assignedNodes({ flatten: true }).length > 0;
264
- }
265
- else {
266
- this.hasEndTextItem = false;
267
- }
277
+ handleStartSlotChange(event) {
278
+ this.hasStartItem = this._handleSlotChange(event);
268
279
  this.requestUpdate();
269
280
  }
281
+ handleEndSlotChange(event) {
282
+ this.hasEndItem = this._handleSlotChange(event);
283
+ this.requestUpdate();
284
+ }
285
+ handleEndTextSlotChange(event) {
286
+ this.hasEndTextItem = this._handleSlotChange(event);
287
+ this.requestUpdate();
288
+ }
289
+ getSurfaceClasses() {
290
+ const result = {
291
+ 'surface': true,
292
+ 'one-line': this.lines === ListItemLines.one,
293
+ 'two-lines': this.lines === ListItemLines.two,
294
+ 'three-lines': this.lines === ListItemLines.three,
295
+ };
296
+ return result;
297
+ }
270
298
  render() {
271
- const surfaceClasses = classMap({
272
- surface: true,
273
- });
274
299
  return html `
275
300
  ${this.renderFocusRing()} ${this.renderRipple()}
276
- <div class="${surfaceClasses}">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</div>
301
+ <div class="${classMap(this.getSurfaceClasses())}">
302
+ ${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}
303
+ </div>
277
304
  `;
278
305
  }
279
- renderRipple = (__runInitializers(this, _hasEndTextItem_extraInitializers), () => {
280
- const { disabled, static: isStatic } = this;
281
- return html `<ui-ripple class="ripple" ?disabled="${disabled || isStatic}"></ui-ripple>`;
306
+ renderRipple = (__runInitializers(this, _hasSupportingText_extraInitializers), () => {
307
+ return html `<ui-ripple class="ripple" ?disabled="${this.disabled || this.static}"></ui-ripple>`;
282
308
  });
283
309
  renderFocusRing() {
284
310
  return html `<md-focus-ring
@@ -313,25 +339,25 @@ let UiListItem = (() => {
313
339
  </div>`;
314
340
  }
315
341
  renderBody() {
316
- const { lines = ListItemLines.one } = this;
317
- const hasSupportingText = lines !== ListItemLines.one;
318
342
  return html `
319
343
  <div class="body">
320
- <slot name="overline"></slot>
344
+ <slot name="overline" @slotchange=${this.handleOverlineSlotChange}></slot>
321
345
  <span class="headline"><slot></slot></span>
322
- ${hasSupportingText ? html `<span class="supporting-text"><slot name="supporting-text"></slot></span>` : ''}
346
+ <span class="supporting-text"
347
+ ><slot name="supporting-text" @slotchange=${this.handleSupportingTextSlotChange}></slot
348
+ ></span>
323
349
  </div>
324
350
  `;
325
351
  }
326
352
  };
327
353
  })();
328
354
  /**
329
- * @slot
330
- * @slot overline
331
- * @slot start
332
- * @slot end
333
- * @slot end-text
334
- * @slot supporting-text
355
+ * @slot - The main content of the list item, typically a label or title.
356
+ * @slot overline - The text displayed above the main content.
357
+ * @slot start - The content displayed at the start of the list item.
358
+ * @slot end - The content displayed at the end of the list item.
359
+ * @slot end-text - The text displayed at the end of the list item.
360
+ * @slot supporting-text - The supporting text displayed below the main content.
335
361
  */
336
362
  export default UiListItem;
337
363
  //# sourceMappingURL=ListItem.js.map
@@ -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, state, query } from 'lit/decorators.js'\nimport { classMap, ClassInfo } 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'\n\nimport '@material/web/focus/md-focus-ring.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 overline\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 @property({ type: Number, reflect: true }) override accessor tabIndex = -1\n\n @state() accessor hasStartItem = false\n @state() accessor hasEndItem = false\n @state() accessor hasEndTextItem = 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('pointerenter', this.handlePointerEnter.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 }\n\n protected override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties)\n if (changedProperties.has('tabIndex') && (this.tabIndex === -1 || this.tabIndex === null)) {\n this.ripple?.endPress()\n }\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 // do not prevent default, so that parent elements can handle the key event\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 // do not prevent default, so that parent elements can handle the key event\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 override 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 /**\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 }\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 handleStartSlotChange(): void {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"start\"]')\n if (slot) {\n this.hasStartItem = slot.assignedNodes({ flatten: true }).length > 0\n } else {\n this.hasStartItem = false\n }\n this.requestUpdate()\n }\n\n protected handleEndSlotChange(): void {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"end\"]')\n if (slot) {\n this.hasEndItem = slot.assignedNodes({ flatten: true }).length > 0\n } else {\n this.hasEndItem = false\n }\n this.requestUpdate()\n }\n\n protected handleEndTextSlotChange(): void {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"end-text\"]')\n if (slot) {\n this.hasEndTextItem = slot.assignedNodes({ flatten: true }).length > 0\n } else {\n this.hasEndTextItem = false\n }\n this.requestUpdate()\n }\n\n protected override render(): TemplateResult {\n const surfaceClasses = classMap({\n surface: true,\n })\n return html`\n ${this.renderFocusRing()} ${this.renderRipple()}\n <div class=\"${surfaceClasses}\">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</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 renderFocusRing(): TemplateResult {\n return html`<md-focus-ring\n part=\"focus-ring\"\n class=\"focus-ring\"\n .control=\"${this as HTMLElement}\"\n inward\n ></md-focus-ring>`\n }\n\n protected getStartClasses(): ClassInfo {\n return {\n 'start': true,\n 'has-start': this.hasStartItem,\n }\n }\n\n protected renderStart(): TemplateResult {\n return html`<div class=\"${classMap(this.getStartClasses())}\">\n <slot name=\"start\" @slotchange=${this.handleStartSlotChange}></slot>\n </div>`\n }\n\n protected getEndClasses(): ClassInfo {\n return {\n 'end': true,\n 'has-end': this.hasEndItem,\n 'has-end-text': this.hasEndTextItem,\n }\n }\n\n protected renderEnd(): TemplateResult {\n return html`<div class=\"${classMap(this.getEndClasses())}\">\n <slot name=\"end\" @slotchange=${this.handleEndSlotChange}></slot>\n <slot name=\"end-text\" class=\"trailing-supporting-text\" @slotchange=${this.handleEndTextSlotChange}></slot>\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 <slot name=\"overline\"></slot>\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, state, query } from 'lit/decorators.js'\nimport { classMap, ClassInfo } 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'\n\nimport '@material/web/focus/md-focus-ring.js'\nimport '../../ripple/ui-ripple.js'\n\nexport enum ListItemLines {\n one = 'one',\n two = 'two',\n three = 'three',\n auto = 'auto',\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 - The main content of the list item, typically a label or title.\n * @slot overline - The text displayed above the main content.\n * @slot start - The content displayed at the start of the list item.\n * @slot end - The content displayed at the end of the list item.\n * @slot end-text - The text displayed at the end of the list item.\n * @slot supporting-text - The supporting text displayed below the main content.\n */\nexport default class UiListItem extends UiElement {\n @query('ui-ripple') accessor ripple!: UiRipple\n\n #lines: ListItemLines = ListItemLines.one\n\n get lines(): ListItemLines {\n if (this.#lines === ListItemLines.auto) {\n return this.hasOverline || this.hasSupportingText ? ListItemLines.two : ListItemLines.one\n }\n return this.#lines\n }\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 })\n set lines(value: ListItemLines) {\n const oldValue = this.#lines\n this.#lines = value\n this.requestUpdate('lines', oldValue)\n }\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 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 @property({ type: Number, reflect: true }) override accessor tabIndex = -1\n\n @state() accessor hasStartItem = false\n @state() accessor hasEndItem = false\n @state() accessor hasEndTextItem = false\n @state() accessor hasOverline = false\n @state() accessor hasSupportingText = false\n\n constructor() {\n super()\n\n this.image = ListItemImage.icon\n this.lines = ListItemLines.one\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('pointerenter', this.handlePointerEnter.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 }\n\n protected override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties)\n if (changedProperties.has('tabIndex') && (this.tabIndex === -1 || this.tabIndex === null)) {\n this.ripple?.endPress()\n }\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 // do not prevent default, so that parent elements can handle the key event\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 // do not prevent default, so that parent elements can handle the key event\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 override 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 /**\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 }\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 private _handleSlotChange(event: Event): boolean {\n const slot = event.target as HTMLSlotElement\n return slot.assignedNodes({ flatten: true }).length > 0\n }\n\n protected handleOverlineSlotChange(event: Event): void {\n this.hasOverline = this._handleSlotChange(event)\n this.requestUpdate()\n }\n\n protected handleSupportingTextSlotChange(event: Event): void {\n this.hasSupportingText = this._handleSlotChange(event)\n this.requestUpdate()\n }\n\n protected handleStartSlotChange(event: Event): void {\n this.hasStartItem = this._handleSlotChange(event)\n this.requestUpdate()\n }\n\n protected handleEndSlotChange(event: Event): void {\n this.hasEndItem = this._handleSlotChange(event)\n this.requestUpdate()\n }\n\n protected handleEndTextSlotChange(event: Event): void {\n this.hasEndTextItem = this._handleSlotChange(event)\n this.requestUpdate()\n }\n\n getSurfaceClasses(): ClassInfo {\n const result: ClassInfo = {\n 'surface': true,\n 'one-line': this.lines === ListItemLines.one,\n 'two-lines': this.lines === ListItemLines.two,\n 'three-lines': this.lines === ListItemLines.three,\n }\n return result\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderFocusRing()} ${this.renderRipple()}\n <div class=\"${classMap(this.getSurfaceClasses())}\">\n ${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}\n </div>\n `\n }\n\n protected renderRipple = (): TemplateResult => {\n return html`<ui-ripple class=\"ripple\" ?disabled=\"${this.disabled || this.static}\"></ui-ripple>`\n }\n\n protected renderFocusRing(): TemplateResult {\n return html`<md-focus-ring\n part=\"focus-ring\"\n class=\"focus-ring\"\n .control=\"${this as HTMLElement}\"\n inward\n ></md-focus-ring>`\n }\n\n protected getStartClasses(): ClassInfo {\n return {\n 'start': true,\n 'has-start': this.hasStartItem,\n }\n }\n\n protected renderStart(): TemplateResult {\n return html`<div class=\"${classMap(this.getStartClasses())}\">\n <slot name=\"start\" @slotchange=${this.handleStartSlotChange}></slot>\n </div>`\n }\n\n protected getEndClasses(): ClassInfo {\n return {\n 'end': true,\n 'has-end': this.hasEndItem,\n 'has-end-text': this.hasEndTextItem,\n }\n }\n\n protected renderEnd(): TemplateResult {\n return html`<div class=\"${classMap(this.getEndClasses())}\">\n <slot name=\"end\" @slotchange=${this.handleEndSlotChange}></slot>\n <slot name=\"end-text\" class=\"trailing-supporting-text\" @slotchange=${this.handleEndTextSlotChange}></slot>\n </div>`\n }\n\n protected renderBody(): TemplateResult {\n return html`\n <div class=\"body\">\n <slot name=\"overline\" @slotchange=${this.handleOverlineSlotChange}></slot>\n <span class=\"headline\"><slot></slot></span>\n <span class=\"supporting-text\"\n ><slot name=\"supporting-text\" @slotchange=${this.handleSupportingTextSlotChange}></slot\n ></span>\n </div>\n `\n }\n}\n"]}
@@ -2,7 +2,6 @@ import { css } from 'lit';
2
2
  export default css `
3
3
  :host {
4
4
  display: block;
5
- height: 56px;
6
5
  outline: none;
7
6
  cursor: default;
8
7
  position: relative;
@@ -23,16 +22,6 @@ export default css `
23
22
  display: none;
24
23
  }
25
24
 
26
- :host([lines='two']),
27
- :host([lines='one'][image='image']) {
28
- height: 72px;
29
- }
30
-
31
- :host([lines='three']),
32
- :host([lines='one'][image='video']) {
33
- height: 88px;
34
- }
35
-
36
25
  .surface {
37
26
  height: inherit;
38
27
  box-sizing: border-box;
@@ -43,6 +32,17 @@ export default css `
43
32
  padding: 8px 16px 8px 16px;
44
33
 
45
34
  gap: 16px;
35
+ height: 56px;
36
+ }
37
+
38
+ :host([image='image']) .surface,
39
+ .surface.two-lines {
40
+ height: 72px;
41
+ }
42
+
43
+ :host([image='video']) .surface,
44
+ .surface.three-lines {
45
+ height: 88px;
46
46
  }
47
47
 
48
48
  .ripple {
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.styles.js","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0MjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: block;\n height: 56px;\n outline: none;\n cursor: default;\n position: relative;\n\n color: var(--md-sys-color-on-surface);\n\n --md-focus-ring-shape-end-end: 8px;\n --md-focus-ring-shape-end-start: 8px;\n --md-focus-ring-shape-start-end: 8px;\n --md-focus-ring-shape-start-start: 8px;\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([lines='two']),\n :host([lines='one'][image='image']) {\n height: 72px;\n }\n\n :host([lines='three']),\n :host([lines='one'][image='video']) {\n height: 88px;\n }\n\n .surface {\n height: inherit;\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n overflow: hidden;\n padding: 8px 16px 8px 16px;\n\n gap: 16px;\n }\n\n .ripple {\n z-index: 3;\n }\n\n :host([image='video']) .surface {\n /* The spec says the right padding is 24px but counting from the checkbox check border.\n This does not include spacing presented by the checkbox itself (18 box, 40px state layer)\n */\n padding: 12px 16px 12px 0px;\n }\n\n .headline {\n font-family: var(--md-sys-typescale-body-large-font);\n font-weight: var(--md-sys-typescale-body-large-weight);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n display: flex;\n align-items: center;\n }\n\n .supporting-text {\n color: var(--md-sys-color-on-surface-variant);\n\n font-family: var(--md-sys-typescale-body-medium-font);\n font-weight: var(--md-sys-typescale-body-medium-weight);\n font-size: var(--md-sys-typescale-body-medium-size);\n letter-spacing: var(--md-sys-typescale-body-medium-tracking);\n line-height: var(--md-sys-typescale-body-medium-height);\n\n overflow: hidden;\n }\n\n .supporting-text ::slotted(*),\n slot[name='end-text']::slotted(*) {\n margin: 0;\n padding: 0;\n overflow: hidden;\n }\n\n slot[name='end-text']::slotted(*) {\n /* this is to make up to the 24px right padding defined in the spec. */\n margin-right: 8px;\n }\n\n :host([lines='three']) .supporting-text {\n height: calc(2 * var(--md-sys-typescale-body-medium-height, 1.1));\n }\n\n :host([lines='three']) .supporting-text ::slotted(*) {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n :host([lines='two']) .supporting-text ::slotted(*) {\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .trailing-supporting-text {\n color: var(--md-sys-color-on-surface-variant);\n\n font-family: var(--md-sys-typescale-body-small-font);\n font-weight: var(--md-sys-typescale-body-small-weight);\n font-size: var(--md-sys-typescale-body-small-size);\n letter-spacing: var(--md-sys-typescale-body-small-tracking);\n line-height: var(--md-sys-typescale-body-small-height);\n }\n\n .start {\n display: contents;\n }\n\n .start.has-start {\n align-self: stretch;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .end {\n display: contents;\n }\n\n .end.has-end,\n .end.has-end-text {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n :host slot[name='end']::slotted(*) {\n color: var(--md-sys-color-on-surface-variant);\n fill: var(--md-sys-color-on-surface-variant);\n }\n\n :host slot[name='start']::slotted(*) {\n display: block;\n }\n\n :host([image='icon']) slot[name='start']::slotted(*) {\n width: 24px;\n height: 24px;\n }\n\n :host([image='avatar']) slot[name='start']::slotted(*) {\n width: 40px;\n height: 40px;\n }\n\n :host([image='image']) slot[name='start']::slotted(*) {\n width: 56px;\n height: 56px;\n }\n\n :host([image='video']) slot[name='start']::slotted(*) {\n width: 114px;\n height: 64px;\n }\n\n .body {\n flex: 1;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n }\n\n :host(.highlight) .surface {\n background-color: var(--md-sys-color-tertiary-container);\n color: var(--md-sys-color-on-tertiary-container);\n }\n\n :host(.select) .surface {\n background-color: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n }\n\n [name='overline'] {\n color: var(--md-sys-color-on-surface-variant);\n font-family: var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto));\n font-size: var(--md-sys-typescale-label-small-size, 0.6875rem);\n font-weight: var(\n --md-sys-typescale-label-small-weight,\n var(--md-ref-typeface-weight-medium, 500) --md-ref-typeface-weight-medium is not defined\n );\n line-height: var(--md-sys-typescale-label-small-line-height, 1rem);\n }\n`\n"]}
1
+ {"version":3,"file":"ListItem.styles.js","sourceRoot":"","sources":["../../../../../src/md/list/internals/ListItem.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0MjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: block;\n outline: none;\n cursor: default;\n position: relative;\n\n color: var(--md-sys-color-on-surface);\n\n --md-focus-ring-shape-end-end: 8px;\n --md-focus-ring-shape-end-start: 8px;\n --md-focus-ring-shape-start-end: 8px;\n --md-focus-ring-shape-start-start: 8px;\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n .surface {\n height: inherit;\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n overflow: hidden;\n padding: 8px 16px 8px 16px;\n\n gap: 16px;\n height: 56px;\n }\n\n :host([image='image']) .surface,\n .surface.two-lines {\n height: 72px;\n }\n\n :host([image='video']) .surface,\n .surface.three-lines {\n height: 88px;\n }\n\n .ripple {\n z-index: 3;\n }\n\n :host([image='video']) .surface {\n /* The spec says the right padding is 24px but counting from the checkbox check border.\n This does not include spacing presented by the checkbox itself (18 box, 40px state layer)\n */\n padding: 12px 16px 12px 0px;\n }\n\n .headline {\n font-family: var(--md-sys-typescale-body-large-font);\n font-weight: var(--md-sys-typescale-body-large-weight);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n display: flex;\n align-items: center;\n }\n\n .supporting-text {\n color: var(--md-sys-color-on-surface-variant);\n\n font-family: var(--md-sys-typescale-body-medium-font);\n font-weight: var(--md-sys-typescale-body-medium-weight);\n font-size: var(--md-sys-typescale-body-medium-size);\n letter-spacing: var(--md-sys-typescale-body-medium-tracking);\n line-height: var(--md-sys-typescale-body-medium-height);\n\n overflow: hidden;\n }\n\n .supporting-text ::slotted(*),\n slot[name='end-text']::slotted(*) {\n margin: 0;\n padding: 0;\n overflow: hidden;\n }\n\n slot[name='end-text']::slotted(*) {\n /* this is to make up to the 24px right padding defined in the spec. */\n margin-right: 8px;\n }\n\n :host([lines='three']) .supporting-text {\n height: calc(2 * var(--md-sys-typescale-body-medium-height, 1.1));\n }\n\n :host([lines='three']) .supporting-text ::slotted(*) {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n :host([lines='two']) .supporting-text ::slotted(*) {\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .trailing-supporting-text {\n color: var(--md-sys-color-on-surface-variant);\n\n font-family: var(--md-sys-typescale-body-small-font);\n font-weight: var(--md-sys-typescale-body-small-weight);\n font-size: var(--md-sys-typescale-body-small-size);\n letter-spacing: var(--md-sys-typescale-body-small-tracking);\n line-height: var(--md-sys-typescale-body-small-height);\n }\n\n .start {\n display: contents;\n }\n\n .start.has-start {\n align-self: stretch;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .end {\n display: contents;\n }\n\n .end.has-end,\n .end.has-end-text {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n :host slot[name='end']::slotted(*) {\n color: var(--md-sys-color-on-surface-variant);\n fill: var(--md-sys-color-on-surface-variant);\n }\n\n :host slot[name='start']::slotted(*) {\n display: block;\n }\n\n :host([image='icon']) slot[name='start']::slotted(*) {\n width: 24px;\n height: 24px;\n }\n\n :host([image='avatar']) slot[name='start']::slotted(*) {\n width: 40px;\n height: 40px;\n }\n\n :host([image='image']) slot[name='start']::slotted(*) {\n width: 56px;\n height: 56px;\n }\n\n :host([image='video']) slot[name='start']::slotted(*) {\n width: 114px;\n height: 64px;\n }\n\n .body {\n flex: 1;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n }\n\n :host(.highlight) .surface {\n background-color: var(--md-sys-color-tertiary-container);\n color: var(--md-sys-color-on-tertiary-container);\n }\n\n :host(.select) .surface {\n background-color: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n }\n\n [name='overline'] {\n color: var(--md-sys-color-on-surface-variant);\n font-family: var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto));\n font-size: var(--md-sys-typescale-label-small-size, 0.6875rem);\n font-weight: var(\n --md-sys-typescale-label-small-weight,\n var(--md-ref-typeface-weight-medium, 500) --md-ref-typeface-weight-medium is not defined\n );\n line-height: var(--md-sys-typescale-label-small-line-height, 1rem);\n }\n`\n"]}
@@ -1,4 +1,5 @@
1
1
  import { PropertyValues, TemplateResult } from 'lit';
2
+ import { ClassInfo } from 'lit/directives/class-map.js';
2
3
  import UiListItem from '../../list/internals/ListItem.js';
3
4
  /**
4
5
  * Material Design 3 Select Option component.
@@ -64,19 +65,15 @@ export default class UiOption extends UiListItem {
64
65
  * ```
65
66
  */
66
67
  get renderValue(): string;
68
+ constructor();
67
69
  /**
68
70
  * Initializes the option when it's connected to the DOM. Sets up ARIA attributes
69
71
  * and generates a unique ID if one isn't provided.
70
- *
71
- * @protected
72
72
  */
73
73
  connectedCallback(): void;
74
74
  /**
75
75
  * Handles property updates and triggers appropriate side effects.
76
76
  * Currently monitors the `selected` property to update selection state.
77
- *
78
- * @param {PropertyValues<this>} changedProperties - Map of changed properties
79
- * @protected
80
77
  */
81
78
  protected updated(changedProperties: PropertyValues<this>): void;
82
79
  /**
@@ -95,7 +92,7 @@ export default class UiOption extends UiListItem {
95
92
  * Handles click events on the option. Prevents default behavior and dispatches
96
93
  * a custom 'select' event that the parent select component can listen to.
97
94
  *
98
- * @param {MouseEvent} e - The click event
95
+ * @param e - The click event
99
96
  * @protected
100
97
  * @fires select - Custom event with option details in event.detail
101
98
  * @example
@@ -108,14 +105,7 @@ export default class UiOption extends UiListItem {
108
105
  * ```
109
106
  */
110
107
  handleClick(e: MouseEvent): void;
111
- /**
112
- * Renders the option's template. Creates the main structure with focus ring,
113
- * ripple effect, and content areas.
114
- *
115
- * @returns {TemplateResult} The rendered template
116
- * @protected
117
- */
118
- protected render(): TemplateResult;
108
+ getSurfaceClasses(): ClassInfo;
119
109
  /**
120
110
  * Renders the end section of the option, including the selection check icon
121
111
  * when the option is selected.
@@ -1 +1 @@
1
- {"version":3,"file":"Option.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAG1D,OAAO,UAAU,MAAM,kCAAkC,CAAA;AAGzD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,UAAU;IAC9C;;;;;;;;;OASG;IACwC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IAE7E;;;;;;;;;OASG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;;;;;;;;;OAYG;IACH,IAAI,WAAW,IAAI,MAAM,CAkBxB;IAED;;;;;OAKG;IACM,iBAAiB,IAAI,IAAI;IAQlC;;;;;;OAMG;cACgB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQzE;;;;;;;;;;OAUG;IACH,SAAS,CAAC,oBAAoB,IAAI,IAAI;IAUtC;;;;;;;;;;;;;;;OAeG;IACM,WAAW,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAoBzC;;;;;;OAMG;cACgB,MAAM,IAAI,cAAc;IAY3C;;;OAGG;cACgB,SAAS,IAAI,cAAc;CAS/C"}
1
+ {"version":3,"file":"Option.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAE1D,OAAO,EAAE,SAAS,EAAY,MAAM,6BAA6B,CAAA;AACjE,OAAO,UAA6B,MAAM,kCAAkC,CAAA;AAG5E;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,UAAU;IAC9C;;;;;;;;;OASG;IACwC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IAE7E;;;;;;;;;OASG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;;;;;;;;;OAYG;IACH,IAAI,WAAW,IAAI,MAAM,CAkBxB;;IAOD;;;OAGG;IACM,iBAAiB,IAAI,IAAI;IAQlC;;;OAGG;cACgB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQzE;;;;;;;;;;OAUG;IACH,SAAS,CAAC,oBAAoB,IAAI,IAAI;IAUtC;;;;;;;;;;;;;;;OAeG;IACM,WAAW,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAoBhC,iBAAiB,IAAI,SAAS;IAOvC;;;OAGG;cACgB,SAAS,IAAI,cAAc;CAS/C"}