@rcarls/rc-card 0.4.2 → 0.6.0

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.
Files changed (11) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/README.md +5 -1
  3. package/dist/custom-elements.json +60 -36
  4. package/dist/{rc-card-DeNYLO0D.js → rc-card-GT572NkA.js} +112 -72
  5. package/dist/rc-card-GT572NkA.js.map +1 -0
  6. package/dist/rc-card-define.js +1 -1
  7. package/dist/rc-card.js +1 -1
  8. package/dist/types/packages/rc-card/src/rc-card.d.ts +15 -3
  9. package/package.json +5 -2
  10. package/dist/rc-card-DeNYLO0D.js.map +0 -1
  11. package/dist/types/packages/rc-card/src/rc-card.test.d.ts +0 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,30 @@
1
1
  # @rcarls/rc-card
2
2
 
3
+ ## 0.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - f099b02: Add declarative horizontal cards with a two-fifths media column and symmetric
8
+ row and column grid coordination properties.
9
+
10
+ ### Patch Changes
11
+
12
+ - a108336: Warn in development when `rc-card`/`rc-list-item` has `interactive` set but
13
+ no way to resolve a click target: no `action-target`, and for
14
+ `rc-list-item`, no native child checkbox/radio either. Surface clicks
15
+ silently go nowhere in that state; the warning now says so at the point
16
+ the row or card is set up wrong, instead of leaving it to be discovered
17
+ by a user tapping a dead row or card.
18
+ - 6683eb9: Add shared, lifecycle-safe click delegation and let interactive list items
19
+ forward plain surface clicks to same-root native action targets while
20
+ preserving nested and modified clicks.
21
+ - Updated dependencies [6683eb9]
22
+ - Updated dependencies [ee7ba6c]
23
+ - Updated dependencies [30eb232]
24
+ - @rcarls/rc-common@0.6.0
25
+
26
+ ## 0.5.0
27
+
3
28
  ## 0.4.2
4
29
 
5
30
  ## 0.4.1
package/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @rcarls/rc-card
2
2
 
3
- Design-system-neutral card shell with structural slots and parts.
3
+ Design-system-neutral vertical and horizontal card shell with structural slots and parts.
4
4
 
5
5
  ```html
6
6
  <rc-card interactive action-target="recipe-link">
@@ -12,3 +12,7 @@ Design-system-neutral card shell with structural slots and parts.
12
12
 
13
13
  The host owns structure and layout, including one `rem` of default body padding.
14
14
  Authors provide native anchors or buttons for semantics and keyboard access.
15
+
16
+ Set `orientation="horizontal"` for a two-column card with a two-fifths media
17
+ column. Every structural row and column remains configurable through the
18
+ component's public grid custom properties.
package/dist/custom-elements.json CHANGED
@@ -54,6 +54,11 @@
54
54
  "name": "--rc-card-grid-template-rows",
55
55
  "default": "auto auto auto 1fr auto auto"
56
56
  },
57
+ {
58
+ "description": "Grid template columns for the host's structural regions. Horizontal cards default to `minmax(0, 2fr) minmax(0, 3fr)`.",
59
+ "name": "--rc-card-grid-template-columns",
60
+ "default": "minmax(0, 1fr)"
61
+ },
57
62
  {
58
63
  "description": "Card border.",
59
64
  "name": "--rc-card-border",
@@ -122,11 +127,21 @@
122
127
  "name": "--rc-card-media-grid-row",
123
128
  "default": "auto"
124
129
  },
130
+ {
131
+ "description": "Grid column for the media region.",
132
+ "name": "--rc-card-media-grid-column",
133
+ "default": "auto"
134
+ },
125
135
  {
126
136
  "description": "Grid row for the header region.",
127
137
  "name": "--rc-card-header-grid-row",
128
138
  "default": "auto"
129
139
  },
140
+ {
141
+ "description": "Grid column for the header region.",
142
+ "name": "--rc-card-header-grid-column",
143
+ "default": "auto"
144
+ },
130
145
  {
131
146
  "description": "Header block-axis padding.",
132
147
  "name": "--rc-card-header-padding-block",
@@ -142,6 +157,11 @@
142
157
  "name": "--rc-card-title-grid-row",
143
158
  "default": "auto"
144
159
  },
160
+ {
161
+ "description": "Grid column for the title region.",
162
+ "name": "--rc-card-title-grid-column",
163
+ "default": "auto"
164
+ },
145
165
  {
146
166
  "description": "Title block-axis padding.",
147
167
  "name": "--rc-card-title-padding-block",
@@ -167,6 +187,11 @@
167
187
  "name": "--rc-card-subtitle-grid-row",
168
188
  "default": "auto"
169
189
  },
190
+ {
191
+ "description": "Grid column for the subtitle region.",
192
+ "name": "--rc-card-subtitle-grid-column",
193
+ "default": "auto"
194
+ },
170
195
  {
171
196
  "description": "Subtitle block-axis padding.",
172
197
  "name": "--rc-card-subtitle-padding-block",
@@ -192,6 +217,11 @@
192
217
  "name": "--rc-card-body-grid-row",
193
218
  "default": "auto"
194
219
  },
220
+ {
221
+ "description": "Grid column for the body region.",
222
+ "name": "--rc-card-body-grid-column",
223
+ "default": "auto"
224
+ },
195
225
  {
196
226
  "description": "Body block-axis padding.",
197
227
  "name": "--rc-card-body-padding-block",
@@ -207,6 +237,11 @@
207
237
  "name": "--rc-card-actions-grid-row",
208
238
  "default": "auto"
209
239
  },
240
+ {
241
+ "description": "Grid column for the actions region.",
242
+ "name": "--rc-card-actions-grid-column",
243
+ "default": "auto"
244
+ },
210
245
  {
211
246
  "description": "Justify-content for the actions row.",
212
247
  "name": "--rc-card-actions-justify",
@@ -232,6 +267,11 @@
232
267
  "name": "--rc-card-footer-grid-row",
233
268
  "default": "auto"
234
269
  },
270
+ {
271
+ "description": "Grid column for the footer region.",
272
+ "name": "--rc-card-footer-grid-column",
273
+ "default": "auto"
274
+ },
235
275
  {
236
276
  "description": "Footer block-axis padding.",
237
277
  "name": "--rc-card-footer-padding-block",
@@ -312,6 +352,17 @@
312
352
  }
313
353
  ],
314
354
  "members": [
355
+ {
356
+ "kind": "field",
357
+ "name": "orientation",
358
+ "type": {
359
+ "text": "RCCardOrientation"
360
+ },
361
+ "default": "'vertical'",
362
+ "description": "Structural layout direction.",
363
+ "attribute": "orientation",
364
+ "reflects": true
365
+ },
315
366
  {
316
367
  "kind": "field",
317
368
  "name": "selected",
@@ -441,42 +492,6 @@
441
492
  "text": "HTMLAnchorElement | HTMLButtonElement | null"
442
493
  }
443
494
  }
444
- },
445
- {
446
- "kind": "method",
447
- "name": "_eventStartedInInteractiveDescendant",
448
- "privacy": "private",
449
- "return": {
450
- "type": {
451
- "text": "boolean"
452
- }
453
- },
454
- "parameters": [
455
- {
456
- "name": "event",
457
- "type": {
458
- "text": "Event"
459
- }
460
- }
461
- ]
462
- },
463
- {
464
- "kind": "method",
465
- "name": "_handleClick",
466
- "privacy": "private",
467
- "return": {
468
- "type": {
469
- "text": "void"
470
- }
471
- },
472
- "parameters": [
473
- {
474
- "name": "event",
475
- "type": {
476
- "text": "MouseEvent"
477
- }
478
- }
479
- ]
480
495
  }
481
496
  ],
482
497
  "attributes": [
@@ -516,6 +531,15 @@
516
531
  "default": "''",
517
532
  "fieldName": "actionTarget"
518
533
  },
534
+ {
535
+ "description": "Structural layout direction.",
536
+ "name": "orientation",
537
+ "type": {
538
+ "text": "RCCardOrientation"
539
+ },
540
+ "default": "'vertical'",
541
+ "fieldName": "orientation"
542
+ },
519
543
  {
520
544
  "description": "Present when the `media` slot has assigned content.",
521
545
  "name": "has-media"
package/dist/{rc-card-DeNYLO0D.js → rc-card-GT572NkA.js} RENAMED
@@ -1,10 +1,32 @@
1
- import { css as h, LitElement as g, html as u } from "lit";
1
+ import { css as u, LitElement as p, html as h } from "lit";
2
2
  import { property as d, queryAssignedElements as o } from "lit/decorators.js";
3
- const v = h`
3
+ import { ClickDelegateController as v } from "@rcarls/rc-common";
4
+ const m = u`
4
5
  :host {
6
+ --_rc-card-grid-template-rows: auto auto auto 1fr auto auto;
7
+ --_rc-card-grid-template-columns: minmax(0, 1fr);
8
+ --_rc-card-media-grid-row: auto;
9
+ --_rc-card-media-grid-column: auto;
10
+ --_rc-card-header-grid-row: auto;
11
+ --_rc-card-header-grid-column: auto;
12
+ --_rc-card-title-grid-row: auto;
13
+ --_rc-card-title-grid-column: auto;
14
+ --_rc-card-subtitle-grid-row: auto;
15
+ --_rc-card-subtitle-grid-column: auto;
16
+ --_rc-card-body-grid-row: auto;
17
+ --_rc-card-body-grid-column: auto;
18
+ --_rc-card-actions-grid-row: auto;
19
+ --_rc-card-actions-grid-column: auto;
20
+ --_rc-card-footer-grid-row: auto;
21
+ --_rc-card-footer-grid-column: auto;
22
+
5
23
  position: relative;
6
24
  display: grid;
7
- grid-template-rows: var(--rc-card-grid-template-rows, auto auto auto 1fr auto auto);
25
+ grid-template-rows: var(--rc-card-grid-template-rows, var(--_rc-card-grid-template-rows));
26
+ grid-template-columns: var(
27
+ --rc-card-grid-template-columns,
28
+ var(--_rc-card-grid-template-columns)
29
+ );
8
30
  min-inline-size: 0;
9
31
  border: var(--rc-card-border, 0);
10
32
  border-radius: var(--rc-card-radius, 0);
@@ -15,6 +37,34 @@ const v = h`
15
37
  box-sizing: border-box;
16
38
  }
17
39
 
40
+ :host([orientation='horizontal']) {
41
+ --_rc-card-grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
42
+ --_rc-card-media-grid-row: 1 / -1;
43
+ --_rc-card-media-grid-column: 1;
44
+ --_rc-card-header-grid-row: 1;
45
+ --_rc-card-header-grid-column: 2;
46
+ --_rc-card-title-grid-row: 2;
47
+ --_rc-card-title-grid-column: 2;
48
+ --_rc-card-subtitle-grid-row: 3;
49
+ --_rc-card-subtitle-grid-column: 2;
50
+ --_rc-card-body-grid-row: 4;
51
+ --_rc-card-body-grid-column: 2;
52
+ --_rc-card-actions-grid-row: 5;
53
+ --_rc-card-actions-grid-column: 2;
54
+ --_rc-card-footer-grid-row: 6;
55
+ --_rc-card-footer-grid-column: 2;
56
+ }
57
+
58
+ :host([orientation='horizontal']:not([has-media])) {
59
+ --_rc-card-grid-template-columns: minmax(0, 1fr);
60
+ --_rc-card-header-grid-column: 1;
61
+ --_rc-card-title-grid-column: 1;
62
+ --_rc-card-subtitle-grid-column: 1;
63
+ --_rc-card-body-grid-column: 1;
64
+ --_rc-card-actions-grid-column: 1;
65
+ --_rc-card-footer-grid-column: 1;
66
+ }
67
+
18
68
  :host([hidden]) {
19
69
  display: none;
20
70
  }
@@ -66,17 +116,20 @@ const v = h`
66
116
  }
67
117
 
68
118
  [part='media'] {
69
- grid-row: var(--rc-card-media-grid-row, auto);
119
+ grid-row: var(--rc-card-media-grid-row, var(--_rc-card-media-grid-row));
120
+ grid-column: var(--rc-card-media-grid-column, var(--_rc-card-media-grid-column));
70
121
  }
71
122
 
72
123
  [part='header'] {
73
- grid-row: var(--rc-card-header-grid-row, auto);
124
+ grid-row: var(--rc-card-header-grid-row, var(--_rc-card-header-grid-row));
125
+ grid-column: var(--rc-card-header-grid-column, var(--_rc-card-header-grid-column));
74
126
  padding-block: var(--rc-card-header-padding-block, var(--rc-card-padding-block, 0) 0);
75
127
  padding-inline: var(--rc-card-header-padding-inline, var(--rc-card-padding-inline, 0));
76
128
  }
77
129
 
78
130
  [part='title'] {
79
- grid-row: var(--rc-card-title-grid-row, auto);
131
+ grid-row: var(--rc-card-title-grid-row, var(--_rc-card-title-grid-row));
132
+ grid-column: var(--rc-card-title-grid-column, var(--_rc-card-title-grid-column));
80
133
  padding-block: var(--rc-card-title-padding-block, var(--rc-card-padding-block, 0) 0);
81
134
  padding-inline: var(--rc-card-title-padding-inline, var(--rc-card-padding-inline, 0));
82
135
  color: var(--rc-card-title-color, inherit);
@@ -84,7 +137,8 @@ const v = h`
84
137
  }
85
138
 
86
139
  [part='subtitle'] {
87
- grid-row: var(--rc-card-subtitle-grid-row, auto);
140
+ grid-row: var(--rc-card-subtitle-grid-row, var(--_rc-card-subtitle-grid-row));
141
+ grid-column: var(--rc-card-subtitle-grid-column, var(--_rc-card-subtitle-grid-column));
88
142
  padding-block: var(--rc-card-subtitle-padding-block, 0);
89
143
  padding-inline: var(--rc-card-subtitle-padding-inline, var(--rc-card-padding-inline, 0));
90
144
  color: var(--rc-card-subtitle-color, inherit);
@@ -92,12 +146,14 @@ const v = h`
92
146
  }
93
147
 
94
148
  [part='body'] {
95
- grid-row: var(--rc-card-body-grid-row, auto);
149
+ grid-row: var(--rc-card-body-grid-row, var(--_rc-card-body-grid-row));
150
+ grid-column: var(--rc-card-body-grid-column, var(--_rc-card-body-grid-column));
96
151
  min-block-size: 0;
97
152
  }
98
153
 
99
154
  [part='actions'] {
100
- grid-row: var(--rc-card-actions-grid-row, auto);
155
+ grid-row: var(--rc-card-actions-grid-row, var(--_rc-card-actions-grid-row));
156
+ grid-column: var(--rc-card-actions-grid-column, var(--_rc-card-actions-grid-column));
101
157
  display: flex;
102
158
  align-items: center;
103
159
  justify-content: var(--rc-card-actions-justify, flex-end);
@@ -107,7 +163,8 @@ const v = h`
107
163
  }
108
164
 
109
165
  [part='footer'] {
110
- grid-row: var(--rc-card-footer-grid-row, auto);
166
+ grid-row: var(--rc-card-footer-grid-row, var(--_rc-card-footer-grid-row));
167
+ grid-column: var(--rc-card-footer-grid-column, var(--_rc-card-footer-grid-column));
111
168
  padding-block: var(--rc-card-footer-padding-block, 0 var(--rc-card-padding-block, 0));
112
169
  padding-inline: var(--rc-card-footer-padding-inline, var(--rc-card-padding-inline, 0));
113
170
  }
@@ -143,30 +200,23 @@ const v = h`
143
200
  }
144
201
  }
145
202
  `;
146
- var b = Object.defineProperty, a = (l, t, r, n) => {
147
- for (var i = void 0, s = l.length - 1, p; s >= 0; s--)
148
- (p = l[s]) && (i = p(t, r, i) || i);
149
- return i && b(t, r, i), i;
203
+ var b = Object.defineProperty, t = (s, e, a, c) => {
204
+ for (var i = void 0, n = s.length - 1, g; n >= 0; n--)
205
+ (g = s[n]) && (i = g(e, a, i) || i);
206
+ return i && b(e, a, i), i;
150
207
  };
151
- const f = [
152
- "a[href]",
153
- "button",
154
- "input",
155
- "select",
156
- "textarea",
157
- "summary",
158
- '[role="button"]',
159
- '[role="link"]',
160
- '[tabindex]:not([tabindex="-1"])'
161
- ].join(","), y = ["media", "header", "title", "subtitle", "actions", "footer"], c = class c extends g {
208
+ const _ = ["media", "header", "title", "subtitle", "actions", "footer"], l = class l extends p {
162
209
  constructor() {
163
- super(), this.selected = !1, this.disabled = !1, this.interactive = !1, this.actionTarget = "", this._slotMicrotaskQueued = !1, this.addEventListener("click", (t) => this._handleClick(t));
210
+ super(), this.orientation = "vertical", this.selected = !1, this.disabled = !1, this.interactive = !1, this.actionTarget = "", this._slotMicrotaskQueued = !1, new v(this, {
211
+ target: () => this._resolveActionTarget(),
212
+ disabled: () => this.disabled
213
+ });
164
214
  }
165
215
  firstUpdated() {
166
216
  this._syncSlotPresence();
167
217
  }
168
218
  render() {
169
- return u`
219
+ return h`
170
220
  <div part="container" aria-hidden="true"></div>
171
221
  <div part="media"><slot name="media" @slotchange=${this._handleSlotChange}></slot></div>
172
222
  <div part="header"><slot name="header" @slotchange=${this._handleSlotChange}></slot></div>
@@ -184,7 +234,7 @@ const f = [
184
234
  }));
185
235
  }
186
236
  _syncSlotPresence() {
187
- const t = {
237
+ const e = {
188
238
  media: this._$media ?? [],
189
239
  header: this._$header ?? [],
190
240
  title: this._$title ?? [],
@@ -192,65 +242,55 @@ const f = [
192
242
  actions: this._$actions ?? [],
193
243
  footer: this._$footer ?? []
194
244
  };
195
- for (const r of y)
196
- this.toggleAttribute(`has-${r}`, t[r].length > 0);
245
+ for (const a of _)
246
+ this.toggleAttribute(`has-${a}`, e[a].length > 0);
197
247
  }
198
248
  _resolveActionTarget() {
199
- const t = this.actionTarget.trim();
200
- if (!t)
249
+ const e = this.actionTarget.trim();
250
+ if (!e)
201
251
  return null;
202
- const r = this.getRootNode(), n = r instanceof Document || r instanceof ShadowRoot ? r.getElementById(t) : null;
203
- return n instanceof HTMLAnchorElement || n instanceof HTMLButtonElement ? n : null;
204
- }
205
- _eventStartedInInteractiveDescendant(t) {
206
- for (const r of t.composedPath()) {
207
- if (r === this)
208
- return !1;
209
- if (r instanceof Element && r.matches(f))
210
- return !0;
211
- }
212
- return !1;
252
+ const a = this.getRootNode(), c = a instanceof Document || a instanceof ShadowRoot ? a.getElementById(e) : null;
253
+ return c instanceof HTMLAnchorElement || c instanceof HTMLButtonElement ? c : null;
213
254
  }
214
- _handleClick(t) {
215
- if (this.disabled || t.defaultPrevented || t.button !== 0 || this._eventStartedInInteractiveDescendant(t))
216
- return;
217
- const r = this._resolveActionTarget();
218
- r && (t.preventDefault(), r.click());
255
+ updated(e) {
219
256
  }
220
257
  };
221
- c.styles = v;
222
- let e = c;
223
- a([
258
+ l.styles = m;
259
+ let r = l;
260
+ t([
261
+ d({ reflect: !0 })
262
+ ], r.prototype, "orientation");
263
+ t([
224
264
  d({ type: Boolean, reflect: !0 })
225
- ], e.prototype, "selected");
226
- a([
265
+ ], r.prototype, "selected");
266
+ t([
227
267
  d({ type: Boolean, reflect: !0 })
228
- ], e.prototype, "disabled");
229
- a([
268
+ ], r.prototype, "disabled");
269
+ t([
230
270
  d({ type: Boolean, reflect: !0 })
231
- ], e.prototype, "interactive");
232
- a([
271
+ ], r.prototype, "interactive");
272
+ t([
233
273
  d({ type: String, attribute: "action-target" })
234
- ], e.prototype, "actionTarget");
235
- a([
274
+ ], r.prototype, "actionTarget");
275
+ t([
236
276
  o({ slot: "media", flatten: !0 })
237
- ], e.prototype, "_$media");
238
- a([
277
+ ], r.prototype, "_$media");
278
+ t([
239
279
  o({ slot: "header", flatten: !0 })
240
- ], e.prototype, "_$header");
241
- a([
280
+ ], r.prototype, "_$header");
281
+ t([
242
282
  o({ slot: "title", flatten: !0 })
243
- ], e.prototype, "_$title");
244
- a([
283
+ ], r.prototype, "_$title");
284
+ t([
245
285
  o({ slot: "subtitle", flatten: !0 })
246
- ], e.prototype, "_$subtitle");
247
- a([
286
+ ], r.prototype, "_$subtitle");
287
+ t([
248
288
  o({ slot: "actions", flatten: !0 })
249
- ], e.prototype, "_$actions");
250
- a([
289
+ ], r.prototype, "_$actions");
290
+ t([
251
291
  o({ slot: "footer", flatten: !0 })
252
- ], e.prototype, "_$footer");
292
+ ], r.prototype, "_$footer");
253
293
  export {
254
- e as R
294
+ r as R
255
295
  };
256
- //# sourceMappingURL=rc-card-DeNYLO0D.js.map
296
+ //# sourceMappingURL=rc-card-GT572NkA.js.map
package/dist/rc-card-GT572NkA.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rc-card-GT572NkA.js","sources":["../src/rc-card.styles.ts","../src/rc-card.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const cardStyles = css`\n :host {\n --_rc-card-grid-template-rows: auto auto auto 1fr auto auto;\n --_rc-card-grid-template-columns: minmax(0, 1fr);\n --_rc-card-media-grid-row: auto;\n --_rc-card-media-grid-column: auto;\n --_rc-card-header-grid-row: auto;\n --_rc-card-header-grid-column: auto;\n --_rc-card-title-grid-row: auto;\n --_rc-card-title-grid-column: auto;\n --_rc-card-subtitle-grid-row: auto;\n --_rc-card-subtitle-grid-column: auto;\n --_rc-card-body-grid-row: auto;\n --_rc-card-body-grid-column: auto;\n --_rc-card-actions-grid-row: auto;\n --_rc-card-actions-grid-column: auto;\n --_rc-card-footer-grid-row: auto;\n --_rc-card-footer-grid-column: auto;\n\n position: relative;\n display: grid;\n grid-template-rows: var(--rc-card-grid-template-rows, var(--_rc-card-grid-template-rows));\n grid-template-columns: var(\n --rc-card-grid-template-columns,\n var(--_rc-card-grid-template-columns)\n );\n min-inline-size: 0;\n border: var(--rc-card-border, 0);\n border-radius: var(--rc-card-radius, 0);\n background: var(--rc-card-bg, Canvas);\n color: var(--rc-card-color, CanvasText);\n box-shadow: var(--rc-card-shadow, none);\n overflow: clip;\n box-sizing: border-box;\n }\n\n :host([orientation='horizontal']) {\n --_rc-card-grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);\n --_rc-card-media-grid-row: 1 / -1;\n --_rc-card-media-grid-column: 1;\n --_rc-card-header-grid-row: 1;\n --_rc-card-header-grid-column: 2;\n --_rc-card-title-grid-row: 2;\n --_rc-card-title-grid-column: 2;\n --_rc-card-subtitle-grid-row: 3;\n --_rc-card-subtitle-grid-column: 2;\n --_rc-card-body-grid-row: 4;\n --_rc-card-body-grid-column: 2;\n --_rc-card-actions-grid-row: 5;\n --_rc-card-actions-grid-column: 2;\n --_rc-card-footer-grid-row: 6;\n --_rc-card-footer-grid-column: 2;\n }\n\n :host([orientation='horizontal']:not([has-media])) {\n --_rc-card-grid-template-columns: minmax(0, 1fr);\n --_rc-card-header-grid-column: 1;\n --_rc-card-title-grid-column: 1;\n --_rc-card-subtitle-grid-column: 1;\n --_rc-card-body-grid-column: 1;\n --_rc-card-actions-grid-column: 1;\n --_rc-card-footer-grid-column: 1;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([interactive]:not([disabled])) {\n cursor: pointer;\n }\n\n [part='container'],\n [part='state-layer'] {\n position: absolute;\n inset: 0;\n border-radius: inherit;\n pointer-events: none;\n }\n\n [part='container'] {\n background: var(--rc-card-container-bg, transparent);\n z-index: 0;\n }\n\n [part='state-layer'] {\n background: var(--rc-card-state-layer-bg, currentColor);\n opacity: 0;\n transition: opacity var(--rc-card-state-layer-duration, 150ms)\n var(--rc-card-state-layer-easing, ease);\n z-index: 1;\n }\n\n :host([interactive]:not([disabled]):hover) [part='state-layer'] {\n opacity: var(--rc-card-hover-state-layer-opacity, 0);\n }\n\n :host([interactive]:not([disabled]):active) [part='state-layer'] {\n opacity: var(--rc-card-pressed-state-layer-opacity, 0);\n }\n\n [part='media'],\n [part='header'],\n [part='title'],\n [part='subtitle'],\n [part='body'],\n [part='actions'],\n [part='footer'] {\n position: relative;\n z-index: 2;\n min-inline-size: 0;\n box-sizing: border-box;\n }\n\n [part='media'] {\n grid-row: var(--rc-card-media-grid-row, var(--_rc-card-media-grid-row));\n grid-column: var(--rc-card-media-grid-column, var(--_rc-card-media-grid-column));\n }\n\n [part='header'] {\n grid-row: var(--rc-card-header-grid-row, var(--_rc-card-header-grid-row));\n grid-column: var(--rc-card-header-grid-column, var(--_rc-card-header-grid-column));\n padding-block: var(--rc-card-header-padding-block, var(--rc-card-padding-block, 0) 0);\n padding-inline: var(--rc-card-header-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n [part='title'] {\n grid-row: var(--rc-card-title-grid-row, var(--_rc-card-title-grid-row));\n grid-column: var(--rc-card-title-grid-column, var(--_rc-card-title-grid-column));\n padding-block: var(--rc-card-title-padding-block, var(--rc-card-padding-block, 0) 0);\n padding-inline: var(--rc-card-title-padding-inline, var(--rc-card-padding-inline, 0));\n color: var(--rc-card-title-color, inherit);\n font: var(--rc-card-title-font, inherit);\n }\n\n [part='subtitle'] {\n grid-row: var(--rc-card-subtitle-grid-row, var(--_rc-card-subtitle-grid-row));\n grid-column: var(--rc-card-subtitle-grid-column, var(--_rc-card-subtitle-grid-column));\n padding-block: var(--rc-card-subtitle-padding-block, 0);\n padding-inline: var(--rc-card-subtitle-padding-inline, var(--rc-card-padding-inline, 0));\n color: var(--rc-card-subtitle-color, inherit);\n font: var(--rc-card-subtitle-font, inherit);\n }\n\n [part='body'] {\n grid-row: var(--rc-card-body-grid-row, var(--_rc-card-body-grid-row));\n grid-column: var(--rc-card-body-grid-column, var(--_rc-card-body-grid-column));\n min-block-size: 0;\n }\n\n [part='actions'] {\n grid-row: var(--rc-card-actions-grid-row, var(--_rc-card-actions-grid-row));\n grid-column: var(--rc-card-actions-grid-column, var(--_rc-card-actions-grid-column));\n display: flex;\n align-items: center;\n justify-content: var(--rc-card-actions-justify, flex-end);\n gap: var(--rc-card-actions-gap, 0);\n padding-block: var(--rc-card-actions-padding-block, 0 var(--rc-card-padding-block, 0));\n padding-inline: var(--rc-card-actions-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n [part='footer'] {\n grid-row: var(--rc-card-footer-grid-row, var(--_rc-card-footer-grid-row));\n grid-column: var(--rc-card-footer-grid-column, var(--_rc-card-footer-grid-column));\n padding-block: var(--rc-card-footer-padding-block, 0 var(--rc-card-padding-block, 0));\n padding-inline: var(--rc-card-footer-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n :host(:not([has-media])) [part='media'],\n :host(:not([has-header])) [part='header'],\n :host(:not([has-title])) [part='title'],\n :host(:not([has-subtitle])) [part='subtitle'],\n :host(:not([has-actions])) [part='actions'],\n :host(:not([has-footer])) [part='footer'] {\n display: none;\n }\n\n ::slotted([slot='media']) {\n display: block;\n inline-size: 100%;\n }\n\n ::slotted(:not([slot])) {\n padding-block: var(--rc-card-body-padding-block, var(--rc-card-padding-block, 1rem));\n padding-inline: var(--rc-card-body-padding-inline, var(--rc-card-padding-inline, 1rem));\n }\n\n @media (forced-colors: active) {\n :host {\n border-color: CanvasText;\n background: Canvas;\n color: CanvasText;\n }\n\n [part='state-layer'] {\n background: Highlight;\n }\n }\n`;\n\nexport default cardStyles;\n","import { LitElement, html, type PropertyValues } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { ClickDelegateController } from '@rcarls/rc-common';\n\nimport cardStyles from './rc-card.styles.js';\n\nexport type RCCardOrientation = 'vertical' | 'horizontal';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-card': RCCard;\n }\n}\n\nconst SLOT_NAMES = ['media', 'header', 'title', 'subtitle', 'actions', 'footer'] as const;\n\ntype SlotName = (typeof SLOT_NAMES)[number];\n\n/**\n * Design-system-neutral card shell with first-class structural parts and\n * optional pointer delegation to an author-provided anchor or button.\n *\n * @slot media - Media region, typically an image or figure.\n * @slot header - Header content above title/body.\n * @slot title - Primary card title.\n * @slot subtitle - Secondary title or metadata.\n * @slot - Body content.\n * @slot actions - Action row.\n * @slot footer - Footer content.\n *\n * @csspart container - Non-interactive visual container overlay.\n * @csspart media - Media region wrapper.\n * @csspart header - Header region wrapper.\n * @csspart title - Title region wrapper.\n * @csspart subtitle - Subtitle region wrapper.\n * @csspart body - Body region wrapper.\n * @csspart actions - Actions region wrapper.\n * @csspart footer - Footer region wrapper.\n * @csspart state-layer - Non-interactive overlay for hover/pressed/ripple effects.\n *\n * @attr selected - Declarative selected state for theme styling.\n * @attr disabled - Declarative disabled state. Disables action-target click forwarding.\n * @attr interactive - Visual affordance for cards with an author-provided action target.\n * @attr action-target - ID of a same-root anchor or button that receives forwarded surface clicks.\n * @attr orientation - Structural layout direction: `vertical` or `horizontal`.\n * @attr [has-media] - Present when the `media` slot has assigned content.\n * @attr [has-header] - Present when the `header` slot has assigned content.\n * @attr [has-title] - Present when the `title` slot has assigned content.\n * @attr [has-subtitle] - Present when the `subtitle` slot has assigned content.\n * @attr [has-actions] - Present when the `actions` slot has assigned content.\n * @attr [has-footer] - Present when the `footer` slot has assigned content.\n *\n * @cssprop [--rc-card-grid-template-rows=auto auto auto 1fr auto auto] - Grid template rows for\n * the host's structural regions.\n * @cssprop [--rc-card-grid-template-columns=minmax(0, 1fr)] - Grid template columns for the\n * host's structural regions. Horizontal cards default to `minmax(0, 2fr) minmax(0, 3fr)`.\n * @cssprop [--rc-card-border=0] - Card border.\n * @cssprop [--rc-card-radius=0] - Card border radius.\n * @cssprop [--rc-card-bg=Canvas] - Card background.\n * @cssprop [--rc-card-color=CanvasText] - Card text color.\n * @cssprop [--rc-card-shadow=none] - Card box shadow.\n * @cssprop [--rc-card-container-bg=transparent] - Background of the non-interactive container overlay.\n * @cssprop [--rc-card-state-layer-bg=currentColor] - State-layer overlay color.\n * @cssprop [--rc-card-state-layer-duration=150ms] - State-layer opacity transition duration.\n * @cssprop [--rc-card-state-layer-easing=ease] - State-layer opacity transition easing.\n * @cssprop [--rc-card-hover-state-layer-opacity=0] - State-layer opacity on hover (interactive\n * cards only).\n * @cssprop [--rc-card-pressed-state-layer-opacity=0] - State-layer opacity on active press\n * (interactive cards only).\n * @cssprop [--rc-card-padding-block] - Shared block-axis padding fallback for regions that don't\n * set their own `*-padding-block` property. Defers to each region's own default (0 for\n * header/title/subtitle/actions/footer, 1rem for body) when unset.\n * @cssprop [--rc-card-padding-inline] - Shared inline-axis padding fallback for regions that\n * don't set their own `*-padding-inline` property. Defers to each region's own default (0 for\n * header/title/subtitle/actions/footer, 1rem for body) when unset.\n * @cssprop [--rc-card-media-grid-row=auto] - Grid row for the media region.\n * @cssprop [--rc-card-media-grid-column=auto] - Grid column for the media region.\n * @cssprop [--rc-card-header-grid-row=auto] - Grid row for the header region.\n * @cssprop [--rc-card-header-grid-column=auto] - Grid column for the header region.\n * @cssprop [--rc-card-header-padding-block=var(--rc-card-padding-block, 0) 0] - Header block-axis padding.\n * @cssprop [--rc-card-header-padding-inline=var(--rc-card-padding-inline, 0)] - Header inline-axis padding.\n * @cssprop [--rc-card-title-grid-row=auto] - Grid row for the title region.\n * @cssprop [--rc-card-title-grid-column=auto] - Grid column for the title region.\n * @cssprop [--rc-card-title-padding-block=var(--rc-card-padding-block, 0) 0] - Title block-axis padding.\n * @cssprop [--rc-card-title-padding-inline=var(--rc-card-padding-inline, 0)] - Title inline-axis padding.\n * @cssprop [--rc-card-title-color=inherit] - Title text color.\n * @cssprop [--rc-card-title-font=inherit] - Title font shorthand.\n * @cssprop [--rc-card-subtitle-grid-row=auto] - Grid row for the subtitle region.\n * @cssprop [--rc-card-subtitle-grid-column=auto] - Grid column for the subtitle region.\n * @cssprop [--rc-card-subtitle-padding-block=0] - Subtitle block-axis padding.\n * @cssprop [--rc-card-subtitle-padding-inline=var(--rc-card-padding-inline, 0)] - Subtitle inline-axis padding.\n * @cssprop [--rc-card-subtitle-color=inherit] - Subtitle text color.\n * @cssprop [--rc-card-subtitle-font=inherit] - Subtitle font shorthand.\n * @cssprop [--rc-card-body-grid-row=auto] - Grid row for the body region.\n * @cssprop [--rc-card-body-grid-column=auto] - Grid column for the body region.\n * @cssprop [--rc-card-body-padding-block=var(--rc-card-padding-block, 1rem)] - Body block-axis padding.\n * @cssprop [--rc-card-body-padding-inline=var(--rc-card-padding-inline, 1rem)] - Body inline-axis padding.\n * @cssprop [--rc-card-actions-grid-row=auto] - Grid row for the actions region.\n * @cssprop [--rc-card-actions-grid-column=auto] - Grid column for the actions region.\n * @cssprop [--rc-card-actions-justify=flex-end] - Justify-content for the actions row.\n * @cssprop [--rc-card-actions-gap=0] - Gap between action items.\n * @cssprop [--rc-card-actions-padding-block=0 var(--rc-card-padding-block, 0)] - Actions block-axis padding.\n * @cssprop [--rc-card-actions-padding-inline=var(--rc-card-padding-inline, 0)] - Actions inline-axis padding.\n * @cssprop [--rc-card-footer-grid-row=auto] - Grid row for the footer region.\n * @cssprop [--rc-card-footer-grid-column=auto] - Grid column for the footer region.\n * @cssprop [--rc-card-footer-padding-block=0 var(--rc-card-padding-block, 0)] - Footer block-axis padding.\n * @cssprop [--rc-card-footer-padding-inline=var(--rc-card-padding-inline, 0)] - Footer inline-axis padding.\n */\nexport class RCCard extends LitElement {\n static override styles = cardStyles;\n\n /** Structural layout direction. */\n @property({ reflect: true })\n orientation: RCCardOrientation = 'vertical';\n\n /** Declarative selected state for theme styling. */\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n /** Declarative disabled state. Disables action-target click forwarding. */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Visual affordance for cards with an author-provided action target. */\n @property({ type: Boolean, reflect: true })\n interactive = false;\n\n /** ID of a same-root anchor or button that receives forwarded surface clicks. */\n @property({ type: String, attribute: 'action-target' })\n actionTarget = '';\n\n @queryAssignedElements({ slot: 'media', flatten: true }) private _$media!: Element[];\n @queryAssignedElements({ slot: 'header', flatten: true }) private _$header!: Element[];\n @queryAssignedElements({ slot: 'title', flatten: true }) private _$title!: Element[];\n @queryAssignedElements({ slot: 'subtitle', flatten: true }) private _$subtitle!: Element[];\n @queryAssignedElements({ slot: 'actions', flatten: true }) private _$actions!: Element[];\n @queryAssignedElements({ slot: 'footer', flatten: true }) private _$footer!: Element[];\n\n private _slotMicrotaskQueued = false;\n\n protected override firstUpdated(): void {\n this._syncSlotPresence();\n }\n\n protected override render() {\n return html`\n <div part=\"container\" aria-hidden=\"true\"></div>\n <div part=\"media\"><slot name=\"media\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"header\"><slot name=\"header\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"title\"><slot name=\"title\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"subtitle\"><slot name=\"subtitle\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"body\"><slot @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"actions\"><slot name=\"actions\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"footer\"><slot name=\"footer\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"state-layer\" aria-hidden=\"true\"></div>\n `;\n }\n\n private _handleSlotChange(): void {\n if (this._slotMicrotaskQueued) {\n return;\n }\n\n this._slotMicrotaskQueued = true;\n\n queueMicrotask(() => {\n this._slotMicrotaskQueued = false;\n\n if (!this.isConnected) {\n return;\n }\n\n this._syncSlotPresence();\n });\n }\n\n private _syncSlotPresence(): void {\n const bySlot: Record<SlotName, Element[]> = {\n media: this._$media ?? [],\n header: this._$header ?? [],\n title: this._$title ?? [],\n subtitle: this._$subtitle ?? [],\n actions: this._$actions ?? [],\n footer: this._$footer ?? [],\n };\n\n for (const slotName of SLOT_NAMES) {\n this.toggleAttribute(`has-${slotName}`, bySlot[slotName].length > 0);\n }\n }\n\n private _resolveActionTarget(): HTMLAnchorElement | HTMLButtonElement | null {\n const id = this.actionTarget.trim();\n\n if (!id) {\n return null;\n }\n\n const root = this.getRootNode();\n const $target =\n root instanceof Document || root instanceof ShadowRoot ? root.getElementById(id) : null;\n\n if ($target instanceof HTMLAnchorElement || $target instanceof HTMLButtonElement) {\n return $target;\n }\n\n if (import.meta.env.DEV) {\n console.warn(`[rc-card] action-target=\"${id}\" must reference a same-root <a> or <button>.`);\n }\n\n return null;\n }\n\n constructor() {\n super();\n\n new ClickDelegateController(this, {\n target: () => this._resolveActionTarget(),\n disabled: () => this.disabled,\n });\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n if (!import.meta.env.DEV) {\n return;\n }\n\n if (!changed.has('interactive') && !changed.has('actionTarget')) {\n return;\n }\n\n if (this.interactive && !this.actionTarget.trim()) {\n console.warn(\n `[rc-card] interactive is set with no action-target, so surface clicks have ` +\n `nothing to forward to. Set action-target to a same-root <a> or <button>.`,\n this,\n );\n }\n }\n}\n\nexport default RCCard;\n"],"names":["cardStyles","css","SLOT_NAMES","_RCCard","LitElement","ClickDelegateController","html","bySlot","slotName","id","root","$target","changed","RCCard","__decorateClass","property","queryAssignedElements"],"mappings":";;;AAEO,MAAMA,IAAaC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACa1B,MAAMC,IAAa,CAAC,SAAS,UAAU,SAAS,YAAY,WAAW,QAAQ,GA8FlEC,IAAN,MAAMA,UAAeC,EAAW;AAAA,EAyGrC,cAAc;AACZ,UAAA,GArGF,KAAA,cAAiC,YAIjC,KAAA,WAAW,IAIX,KAAA,WAAW,IAIX,KAAA,cAAc,IAId,KAAA,eAAe,IASf,KAAQ,uBAAuB,IA8E7B,IAAIC,EAAwB,MAAM;AAAA,MAChC,QAAQ,MAAM,KAAK,qBAAA;AAAA,MACnB,UAAU,MAAM,KAAK;AAAA,IAAA,CACtB;AAAA,EACH;AAAA,EAhFmB,eAAqB;AACtC,SAAK,kBAAA;AAAA,EACP;AAAA,EAEmB,SAAS;AAC1B,WAAOC;AAAA;AAAA,yDAE8C,KAAK,iBAAiB;AAAA,2DACpB,KAAK,iBAAiB;AAAA,yDACxB,KAAK,iBAAiB;AAAA,+DAChB,KAAK,iBAAiB;AAAA,2CAC1C,KAAK,iBAAiB;AAAA,6DACJ,KAAK,iBAAiB;AAAA,2DACxB,KAAK,iBAAiB;AAAA;AAAA;AAAA,EAG/E;AAAA,EAEQ,oBAA0B;AAChC,IAAI,KAAK,yBAIT,KAAK,uBAAuB,IAE5B,eAAe,MAAM;AAGnB,MAFA,KAAK,uBAAuB,IAEvB,KAAK,eAIV,KAAK,kBAAA;AAAA,IACP,CAAC;AAAA,EACH;AAAA,EAEQ,oBAA0B;AAChC,UAAMC,IAAsC;AAAA,MAC1C,OAAO,KAAK,WAAW,CAAA;AAAA,MACvB,QAAQ,KAAK,YAAY,CAAA;AAAA,MACzB,OAAO,KAAK,WAAW,CAAA;AAAA,MACvB,UAAU,KAAK,cAAc,CAAA;AAAA,MAC7B,SAAS,KAAK,aAAa,CAAA;AAAA,MAC3B,QAAQ,KAAK,YAAY,CAAA;AAAA,IAAC;AAG5B,eAAWC,KAAYN;AACrB,WAAK,gBAAgB,OAAOM,CAAQ,IAAID,EAAOC,CAAQ,EAAE,SAAS,CAAC;AAAA,EAEvE;AAAA,EAEQ,uBAAqE;AAC3E,UAAMC,IAAK,KAAK,aAAa,KAAA;AAE7B,QAAI,CAACA;AACH,aAAO;AAGT,UAAMC,IAAO,KAAK,YAAA,GACZC,IACJD,aAAgB,YAAYA,aAAgB,aAAaA,EAAK,eAAeD,CAAE,IAAI;AAErF,WAAIE,aAAmB,qBAAqBA,aAAmB,oBACtDA,IAOF;AAAA,EACT;AAAA,EAWmB,QAAQC,GAAqC;AAAA,EAgBhE;AACF;AAlIET,EAAgB,SAASH;AADpB,IAAMa,IAANV;AAKLW,EAAA;AAAA,EADCC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAJhBF,EAKX,WAAA,aAAA;AAIAC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAR/BF,EASX,WAAA,UAAA;AAIAC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAZ/BF,EAaX,WAAA,UAAA;AAIAC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAhB/BF,EAiBX,WAAA,aAAA;AAIAC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,iBAAiB;AAAA,GApB3CF,EAqBX,WAAA,cAAA;AAEiEC,EAAA;AAAA,EAAhEE,EAAsB,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAvB5CH,EAuBsD,WAAA,SAAA;AACCC,EAAA;AAAA,EAAjEE,EAAsB,EAAE,MAAM,UAAU,SAAS,IAAM;AAAA,GAxB7CH,EAwBuD,WAAA,UAAA;AACDC,EAAA;AAAA,EAAhEE,EAAsB,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAzB5CH,EAyBsD,WAAA,SAAA;AACGC,EAAA;AAAA,EAAnEE,EAAsB,EAAE,MAAM,YAAY,SAAS,IAAM;AAAA,GA1B/CH,EA0ByD,WAAA,YAAA;AACDC,EAAA;AAAA,EAAlEE,EAAsB,EAAE,MAAM,WAAW,SAAS,IAAM;AAAA,GA3B9CH,EA2BwD,WAAA,WAAA;AACDC,EAAA;AAAA,EAAjEE,EAAsB,EAAE,MAAM,UAAU,SAAS,IAAM;AAAA,GA5B7CH,EA4BuD,WAAA,UAAA;"}
package/dist/rc-card-define.js CHANGED
@@ -1,4 +1,4 @@
1
- import { R as e } from "./rc-card-DeNYLO0D.js";
1
+ import { R as e } from "./rc-card-GT572NkA.js";
2
2
  customElements.get("rc-card") || customElements.define("rc-card", e);
3
3
  export {
4
4
  e as RCCard
package/dist/rc-card.js CHANGED
@@ -1,4 +1,4 @@
1
- import { R as o } from "./rc-card-DeNYLO0D.js";
1
+ import { R as o } from "./rc-card-GT572NkA.js";
2
2
  export {
3
3
  o as RCCard
4
4
  };
package/dist/types/packages/rc-card/src/rc-card.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import { LitElement } from 'lit';
1
+ import { LitElement, PropertyValues } from 'lit';
2
+ export type RCCardOrientation = 'vertical' | 'horizontal';
2
3
  declare global {
3
4
  interface HTMLElementTagNameMap {
4
5
  'rc-card': RCCard;
@@ -30,6 +31,7 @@ declare global {
30
31
  * @attr disabled - Declarative disabled state. Disables action-target click forwarding.
31
32
  * @attr interactive - Visual affordance for cards with an author-provided action target.
32
33
  * @attr action-target - ID of a same-root anchor or button that receives forwarded surface clicks.
34
+ * @attr orientation - Structural layout direction: `vertical` or `horizontal`.
33
35
  * @attr [has-media] - Present when the `media` slot has assigned content.
34
36
  * @attr [has-header] - Present when the `header` slot has assigned content.
35
37
  * @attr [has-title] - Present when the `title` slot has assigned content.
@@ -39,6 +41,8 @@ declare global {
39
41
  *
40
42
  * @cssprop [--rc-card-grid-template-rows=auto auto auto 1fr auto auto] - Grid template rows for
41
43
  * the host's structural regions.
44
+ * @cssprop [--rc-card-grid-template-columns=minmax(0, 1fr)] - Grid template columns for the
45
+ * host's structural regions. Horizontal cards default to `minmax(0, 2fr) minmax(0, 3fr)`.
42
46
  * @cssprop [--rc-card-border=0] - Card border.
43
47
  * @cssprop [--rc-card-radius=0] - Card border radius.
44
48
  * @cssprop [--rc-card-bg=Canvas] - Card background.
@@ -59,33 +63,42 @@ declare global {
59
63
  * don't set their own `*-padding-inline` property. Defers to each region's own default (0 for
60
64
  * header/title/subtitle/actions/footer, 1rem for body) when unset.
61
65
  * @cssprop [--rc-card-media-grid-row=auto] - Grid row for the media region.
66
+ * @cssprop [--rc-card-media-grid-column=auto] - Grid column for the media region.
62
67
  * @cssprop [--rc-card-header-grid-row=auto] - Grid row for the header region.
68
+ * @cssprop [--rc-card-header-grid-column=auto] - Grid column for the header region.
63
69
  * @cssprop [--rc-card-header-padding-block=var(--rc-card-padding-block, 0) 0] - Header block-axis padding.
64
70
  * @cssprop [--rc-card-header-padding-inline=var(--rc-card-padding-inline, 0)] - Header inline-axis padding.
65
71
  * @cssprop [--rc-card-title-grid-row=auto] - Grid row for the title region.
72
+ * @cssprop [--rc-card-title-grid-column=auto] - Grid column for the title region.
66
73
  * @cssprop [--rc-card-title-padding-block=var(--rc-card-padding-block, 0) 0] - Title block-axis padding.
67
74
  * @cssprop [--rc-card-title-padding-inline=var(--rc-card-padding-inline, 0)] - Title inline-axis padding.
68
75
  * @cssprop [--rc-card-title-color=inherit] - Title text color.
69
76
  * @cssprop [--rc-card-title-font=inherit] - Title font shorthand.
70
77
  * @cssprop [--rc-card-subtitle-grid-row=auto] - Grid row for the subtitle region.
78
+ * @cssprop [--rc-card-subtitle-grid-column=auto] - Grid column for the subtitle region.
71
79
  * @cssprop [--rc-card-subtitle-padding-block=0] - Subtitle block-axis padding.
72
80
  * @cssprop [--rc-card-subtitle-padding-inline=var(--rc-card-padding-inline, 0)] - Subtitle inline-axis padding.
73
81
  * @cssprop [--rc-card-subtitle-color=inherit] - Subtitle text color.
74
82
  * @cssprop [--rc-card-subtitle-font=inherit] - Subtitle font shorthand.
75
83
  * @cssprop [--rc-card-body-grid-row=auto] - Grid row for the body region.
84
+ * @cssprop [--rc-card-body-grid-column=auto] - Grid column for the body region.
76
85
  * @cssprop [--rc-card-body-padding-block=var(--rc-card-padding-block, 1rem)] - Body block-axis padding.
77
86
  * @cssprop [--rc-card-body-padding-inline=var(--rc-card-padding-inline, 1rem)] - Body inline-axis padding.
78
87
  * @cssprop [--rc-card-actions-grid-row=auto] - Grid row for the actions region.
88
+ * @cssprop [--rc-card-actions-grid-column=auto] - Grid column for the actions region.
79
89
  * @cssprop [--rc-card-actions-justify=flex-end] - Justify-content for the actions row.
80
90
  * @cssprop [--rc-card-actions-gap=0] - Gap between action items.
81
91
  * @cssprop [--rc-card-actions-padding-block=0 var(--rc-card-padding-block, 0)] - Actions block-axis padding.
82
92
  * @cssprop [--rc-card-actions-padding-inline=var(--rc-card-padding-inline, 0)] - Actions inline-axis padding.
83
93
  * @cssprop [--rc-card-footer-grid-row=auto] - Grid row for the footer region.
94
+ * @cssprop [--rc-card-footer-grid-column=auto] - Grid column for the footer region.
84
95
  * @cssprop [--rc-card-footer-padding-block=0 var(--rc-card-padding-block, 0)] - Footer block-axis padding.
85
96
  * @cssprop [--rc-card-footer-padding-inline=var(--rc-card-padding-inline, 0)] - Footer inline-axis padding.
86
97
  */
87
98
  export declare class RCCard extends LitElement {
88
99
  static styles: import('lit').CSSResult;
100
+ /** Structural layout direction. */
101
+ orientation: RCCardOrientation;
89
102
  /** Declarative selected state for theme styling. */
90
103
  selected: boolean;
91
104
  /** Declarative disabled state. Disables action-target click forwarding. */
@@ -106,8 +119,7 @@ export declare class RCCard extends LitElement {
106
119
  private _handleSlotChange;
107
120
  private _syncSlotPresence;
108
121
  private _resolveActionTarget;
109
- private _eventStartedInInteractiveDescendant;
110
- private _handleClick;
111
122
  constructor();
123
+ protected updated(changed: PropertyValues<this>): void;
112
124
  }
113
125
  export default RCCard;
package/package.json CHANGED
@@ -3,8 +3,8 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "0.4.2",
7
- "description": "Design-system-neutral card shell with structural slots and parts.",
6
+ "version": "0.6.0",
7
+ "description": "Design-system-neutral vertical and horizontal card shell with structural slots and parts.",
8
8
  "repository": {
9
9
  "type": "git",
10
10
  "url": "git+https://github.com/richardcarls/rc-webcomponents.git",
@@ -44,6 +44,9 @@
44
44
  "test:browser:chrome": "vitest --run --project=chromium",
45
45
  "test:browser:firefox": "vitest --run --project=firefox"
46
46
  },
47
+ "dependencies": {
48
+ "@rcarls/rc-common": "0.6.0"
49
+ },
47
50
  "devDependencies": {
48
51
  "@custom-elements-manifest/analyzer": "0.11.0",
49
52
  "@vitest/browser-playwright": "4.1.5",
package/dist/rc-card-DeNYLO0D.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"rc-card-DeNYLO0D.js","sources":["../src/rc-card.styles.ts","../src/rc-card.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const cardStyles = css`\n :host {\n position: relative;\n display: grid;\n grid-template-rows: var(--rc-card-grid-template-rows, auto auto auto 1fr auto auto);\n min-inline-size: 0;\n border: var(--rc-card-border, 0);\n border-radius: var(--rc-card-radius, 0);\n background: var(--rc-card-bg, Canvas);\n color: var(--rc-card-color, CanvasText);\n box-shadow: var(--rc-card-shadow, none);\n overflow: clip;\n box-sizing: border-box;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([interactive]:not([disabled])) {\n cursor: pointer;\n }\n\n [part='container'],\n [part='state-layer'] {\n position: absolute;\n inset: 0;\n border-radius: inherit;\n pointer-events: none;\n }\n\n [part='container'] {\n background: var(--rc-card-container-bg, transparent);\n z-index: 0;\n }\n\n [part='state-layer'] {\n background: var(--rc-card-state-layer-bg, currentColor);\n opacity: 0;\n transition: opacity var(--rc-card-state-layer-duration, 150ms)\n var(--rc-card-state-layer-easing, ease);\n z-index: 1;\n }\n\n :host([interactive]:not([disabled]):hover) [part='state-layer'] {\n opacity: var(--rc-card-hover-state-layer-opacity, 0);\n }\n\n :host([interactive]:not([disabled]):active) [part='state-layer'] {\n opacity: var(--rc-card-pressed-state-layer-opacity, 0);\n }\n\n [part='media'],\n [part='header'],\n [part='title'],\n [part='subtitle'],\n [part='body'],\n [part='actions'],\n [part='footer'] {\n position: relative;\n z-index: 2;\n min-inline-size: 0;\n box-sizing: border-box;\n }\n\n [part='media'] {\n grid-row: var(--rc-card-media-grid-row, auto);\n }\n\n [part='header'] {\n grid-row: var(--rc-card-header-grid-row, auto);\n padding-block: var(--rc-card-header-padding-block, var(--rc-card-padding-block, 0) 0);\n padding-inline: var(--rc-card-header-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n [part='title'] {\n grid-row: var(--rc-card-title-grid-row, auto);\n padding-block: var(--rc-card-title-padding-block, var(--rc-card-padding-block, 0) 0);\n padding-inline: var(--rc-card-title-padding-inline, var(--rc-card-padding-inline, 0));\n color: var(--rc-card-title-color, inherit);\n font: var(--rc-card-title-font, inherit);\n }\n\n [part='subtitle'] {\n grid-row: var(--rc-card-subtitle-grid-row, auto);\n padding-block: var(--rc-card-subtitle-padding-block, 0);\n padding-inline: var(--rc-card-subtitle-padding-inline, var(--rc-card-padding-inline, 0));\n color: var(--rc-card-subtitle-color, inherit);\n font: var(--rc-card-subtitle-font, inherit);\n }\n\n [part='body'] {\n grid-row: var(--rc-card-body-grid-row, auto);\n min-block-size: 0;\n }\n\n [part='actions'] {\n grid-row: var(--rc-card-actions-grid-row, auto);\n display: flex;\n align-items: center;\n justify-content: var(--rc-card-actions-justify, flex-end);\n gap: var(--rc-card-actions-gap, 0);\n padding-block: var(--rc-card-actions-padding-block, 0 var(--rc-card-padding-block, 0));\n padding-inline: var(--rc-card-actions-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n [part='footer'] {\n grid-row: var(--rc-card-footer-grid-row, auto);\n padding-block: var(--rc-card-footer-padding-block, 0 var(--rc-card-padding-block, 0));\n padding-inline: var(--rc-card-footer-padding-inline, var(--rc-card-padding-inline, 0));\n }\n\n :host(:not([has-media])) [part='media'],\n :host(:not([has-header])) [part='header'],\n :host(:not([has-title])) [part='title'],\n :host(:not([has-subtitle])) [part='subtitle'],\n :host(:not([has-actions])) [part='actions'],\n :host(:not([has-footer])) [part='footer'] {\n display: none;\n }\n\n ::slotted([slot='media']) {\n display: block;\n inline-size: 100%;\n }\n\n ::slotted(:not([slot])) {\n padding-block: var(--rc-card-body-padding-block, var(--rc-card-padding-block, 1rem));\n padding-inline: var(--rc-card-body-padding-inline, var(--rc-card-padding-inline, 1rem));\n }\n\n @media (forced-colors: active) {\n :host {\n border-color: CanvasText;\n background: Canvas;\n color: CanvasText;\n }\n\n [part='state-layer'] {\n background: Highlight;\n }\n }\n`;\n\nexport default cardStyles;\n","import { LitElement, html } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\n\nimport cardStyles from './rc-card.styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-card': RCCard;\n }\n}\n\nconst INTERACTIVE_SELECTOR = [\n 'a[href]',\n 'button',\n 'input',\n 'select',\n 'textarea',\n 'summary',\n '[role=\"button\"]',\n '[role=\"link\"]',\n '[tabindex]:not([tabindex=\"-1\"])',\n].join(',');\n\nconst SLOT_NAMES = ['media', 'header', 'title', 'subtitle', 'actions', 'footer'] as const;\n\ntype SlotName = (typeof SLOT_NAMES)[number];\n\n/**\n * Design-system-neutral card shell with first-class structural parts and\n * optional pointer delegation to an author-provided anchor or button.\n *\n * @slot media - Media region, typically an image or figure.\n * @slot header - Header content above title/body.\n * @slot title - Primary card title.\n * @slot subtitle - Secondary title or metadata.\n * @slot - Body content.\n * @slot actions - Action row.\n * @slot footer - Footer content.\n *\n * @csspart container - Non-interactive visual container overlay.\n * @csspart media - Media region wrapper.\n * @csspart header - Header region wrapper.\n * @csspart title - Title region wrapper.\n * @csspart subtitle - Subtitle region wrapper.\n * @csspart body - Body region wrapper.\n * @csspart actions - Actions region wrapper.\n * @csspart footer - Footer region wrapper.\n * @csspart state-layer - Non-interactive overlay for hover/pressed/ripple effects.\n *\n * @attr selected - Declarative selected state for theme styling.\n * @attr disabled - Declarative disabled state. Disables action-target click forwarding.\n * @attr interactive - Visual affordance for cards with an author-provided action target.\n * @attr action-target - ID of a same-root anchor or button that receives forwarded surface clicks.\n * @attr [has-media] - Present when the `media` slot has assigned content.\n * @attr [has-header] - Present when the `header` slot has assigned content.\n * @attr [has-title] - Present when the `title` slot has assigned content.\n * @attr [has-subtitle] - Present when the `subtitle` slot has assigned content.\n * @attr [has-actions] - Present when the `actions` slot has assigned content.\n * @attr [has-footer] - Present when the `footer` slot has assigned content.\n *\n * @cssprop [--rc-card-grid-template-rows=auto auto auto 1fr auto auto] - Grid template rows for\n * the host's structural regions.\n * @cssprop [--rc-card-border=0] - Card border.\n * @cssprop [--rc-card-radius=0] - Card border radius.\n * @cssprop [--rc-card-bg=Canvas] - Card background.\n * @cssprop [--rc-card-color=CanvasText] - Card text color.\n * @cssprop [--rc-card-shadow=none] - Card box shadow.\n * @cssprop [--rc-card-container-bg=transparent] - Background of the non-interactive container overlay.\n * @cssprop [--rc-card-state-layer-bg=currentColor] - State-layer overlay color.\n * @cssprop [--rc-card-state-layer-duration=150ms] - State-layer opacity transition duration.\n * @cssprop [--rc-card-state-layer-easing=ease] - State-layer opacity transition easing.\n * @cssprop [--rc-card-hover-state-layer-opacity=0] - State-layer opacity on hover (interactive\n * cards only).\n * @cssprop [--rc-card-pressed-state-layer-opacity=0] - State-layer opacity on active press\n * (interactive cards only).\n * @cssprop [--rc-card-padding-block] - Shared block-axis padding fallback for regions that don't\n * set their own `*-padding-block` property. Defers to each region's own default (0 for\n * header/title/subtitle/actions/footer, 1rem for body) when unset.\n * @cssprop [--rc-card-padding-inline] - Shared inline-axis padding fallback for regions that\n * don't set their own `*-padding-inline` property. Defers to each region's own default (0 for\n * header/title/subtitle/actions/footer, 1rem for body) when unset.\n * @cssprop [--rc-card-media-grid-row=auto] - Grid row for the media region.\n * @cssprop [--rc-card-header-grid-row=auto] - Grid row for the header region.\n * @cssprop [--rc-card-header-padding-block=var(--rc-card-padding-block, 0) 0] - Header block-axis padding.\n * @cssprop [--rc-card-header-padding-inline=var(--rc-card-padding-inline, 0)] - Header inline-axis padding.\n * @cssprop [--rc-card-title-grid-row=auto] - Grid row for the title region.\n * @cssprop [--rc-card-title-padding-block=var(--rc-card-padding-block, 0) 0] - Title block-axis padding.\n * @cssprop [--rc-card-title-padding-inline=var(--rc-card-padding-inline, 0)] - Title inline-axis padding.\n * @cssprop [--rc-card-title-color=inherit] - Title text color.\n * @cssprop [--rc-card-title-font=inherit] - Title font shorthand.\n * @cssprop [--rc-card-subtitle-grid-row=auto] - Grid row for the subtitle region.\n * @cssprop [--rc-card-subtitle-padding-block=0] - Subtitle block-axis padding.\n * @cssprop [--rc-card-subtitle-padding-inline=var(--rc-card-padding-inline, 0)] - Subtitle inline-axis padding.\n * @cssprop [--rc-card-subtitle-color=inherit] - Subtitle text color.\n * @cssprop [--rc-card-subtitle-font=inherit] - Subtitle font shorthand.\n * @cssprop [--rc-card-body-grid-row=auto] - Grid row for the body region.\n * @cssprop [--rc-card-body-padding-block=var(--rc-card-padding-block, 1rem)] - Body block-axis padding.\n * @cssprop [--rc-card-body-padding-inline=var(--rc-card-padding-inline, 1rem)] - Body inline-axis padding.\n * @cssprop [--rc-card-actions-grid-row=auto] - Grid row for the actions region.\n * @cssprop [--rc-card-actions-justify=flex-end] - Justify-content for the actions row.\n * @cssprop [--rc-card-actions-gap=0] - Gap between action items.\n * @cssprop [--rc-card-actions-padding-block=0 var(--rc-card-padding-block, 0)] - Actions block-axis padding.\n * @cssprop [--rc-card-actions-padding-inline=var(--rc-card-padding-inline, 0)] - Actions inline-axis padding.\n * @cssprop [--rc-card-footer-grid-row=auto] - Grid row for the footer region.\n * @cssprop [--rc-card-footer-padding-block=0 var(--rc-card-padding-block, 0)] - Footer block-axis padding.\n * @cssprop [--rc-card-footer-padding-inline=var(--rc-card-padding-inline, 0)] - Footer inline-axis padding.\n */\nexport class RCCard extends LitElement {\n static override styles = cardStyles;\n\n /** Declarative selected state for theme styling. */\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n /** Declarative disabled state. Disables action-target click forwarding. */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Visual affordance for cards with an author-provided action target. */\n @property({ type: Boolean, reflect: true })\n interactive = false;\n\n /** ID of a same-root anchor or button that receives forwarded surface clicks. */\n @property({ type: String, attribute: 'action-target' })\n actionTarget = '';\n\n @queryAssignedElements({ slot: 'media', flatten: true }) private _$media!: Element[];\n @queryAssignedElements({ slot: 'header', flatten: true }) private _$header!: Element[];\n @queryAssignedElements({ slot: 'title', flatten: true }) private _$title!: Element[];\n @queryAssignedElements({ slot: 'subtitle', flatten: true }) private _$subtitle!: Element[];\n @queryAssignedElements({ slot: 'actions', flatten: true }) private _$actions!: Element[];\n @queryAssignedElements({ slot: 'footer', flatten: true }) private _$footer!: Element[];\n\n private _slotMicrotaskQueued = false;\n\n protected override firstUpdated(): void {\n this._syncSlotPresence();\n }\n\n protected override render() {\n return html`\n <div part=\"container\" aria-hidden=\"true\"></div>\n <div part=\"media\"><slot name=\"media\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"header\"><slot name=\"header\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"title\"><slot name=\"title\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"subtitle\"><slot name=\"subtitle\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"body\"><slot @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"actions\"><slot name=\"actions\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"footer\"><slot name=\"footer\" @slotchange=${this._handleSlotChange}></slot></div>\n <div part=\"state-layer\" aria-hidden=\"true\"></div>\n `;\n }\n\n private _handleSlotChange(): void {\n if (this._slotMicrotaskQueued) {\n return;\n }\n\n this._slotMicrotaskQueued = true;\n\n queueMicrotask(() => {\n this._slotMicrotaskQueued = false;\n\n if (!this.isConnected) {\n return;\n }\n\n this._syncSlotPresence();\n });\n }\n\n private _syncSlotPresence(): void {\n const bySlot: Record<SlotName, Element[]> = {\n media: this._$media ?? [],\n header: this._$header ?? [],\n title: this._$title ?? [],\n subtitle: this._$subtitle ?? [],\n actions: this._$actions ?? [],\n footer: this._$footer ?? [],\n };\n\n for (const slotName of SLOT_NAMES) {\n this.toggleAttribute(`has-${slotName}`, bySlot[slotName].length > 0);\n }\n }\n\n private _resolveActionTarget(): HTMLAnchorElement | HTMLButtonElement | null {\n const id = this.actionTarget.trim();\n\n if (!id) {\n return null;\n }\n\n const root = this.getRootNode();\n const $target =\n root instanceof Document || root instanceof ShadowRoot ? root.getElementById(id) : null;\n\n if ($target instanceof HTMLAnchorElement || $target instanceof HTMLButtonElement) {\n return $target;\n }\n\n if (import.meta.env.DEV) {\n console.warn(`[rc-card] action-target=\"${id}\" must reference a same-root <a> or <button>.`);\n }\n\n return null;\n }\n\n private _eventStartedInInteractiveDescendant(event: Event): boolean {\n for (const entry of event.composedPath()) {\n if (entry === this) {\n return false;\n }\n\n if (entry instanceof Element && entry.matches(INTERACTIVE_SELECTOR)) {\n return true;\n }\n }\n\n return false;\n }\n\n private _handleClick(event: MouseEvent): void {\n if (this.disabled || event.defaultPrevented || event.button !== 0) {\n return;\n }\n\n if (this._eventStartedInInteractiveDescendant(event)) {\n return;\n }\n\n const $target = this._resolveActionTarget();\n\n if (!$target) {\n return;\n }\n\n event.preventDefault();\n $target.click();\n }\n\n constructor() {\n super();\n this.addEventListener('click', (event) => this._handleClick(event as MouseEvent));\n }\n}\n\nexport default RCCard;\n"],"names":["cardStyles","css","INTERACTIVE_SELECTOR","SLOT_NAMES","_RCCard","LitElement","event","html","bySlot","slotName","id","root","$target","entry","RCCard","__decorateClass","property","queryAssignedElements"],"mappings":"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"}
package/dist/types/packages/rc-card/src/rc-card.test.d.ts DELETED
File without changes