docs: added @csspart JS doc to audio player components (#1144)

* docs: added @csspart JS doc to audio player components * docs: fixed @csspart doc in audio player about panel * docs: added changeset * chore: up-dated changeset
RedHat-UX · Jul 14, 2023 · 77fa329 · 77fa329
1 parent e46bc0a
commit 77fa329
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 0 deletions.
diff --git a/.changeset/forty-candles-train.md b/.changeset/forty-candles-train.md
@@ -0,0 +1,5 @@
+---
+"@rhds/elements": patch
+---
+
+`<rh-audio-player>`: Added @csspart docs.
diff --git a/elements/rh-audio-player/rh-audio-player-about.ts b/elements/rh-audio-player/rh-audio-player-about.ts
@@ -16,6 +16,9 @@ import { HeadingLevelContextConsumer } from '../../lib/context/headings/consumer
  * @slot heading - custom heading for panel
  * @slot - panel content
  * @slot profile - `<rh-avatar>` for attribution
+ * @csspart heading - panel heading
+ * @csspart body - panel body
+ * @csspart profile - panel profile / avatar
  */
 @customElement('rh-audio-player-about')
 export class RhAudioPlayerAbout extends LitElement {

diff --git a/elements/rh-audio-player/rh-audio-player-subscribe.ts b/elements/rh-audio-player/rh-audio-player-subscribe.ts
@@ -18,6 +18,7 @@ import styles from './rh-audio-player-subscribe.css';
  * @slot link - link to subscribe to podcast
  * @csspart heading - scrolling text overflow
  * @csspart body - body content slot
+ * @csspart links - subscribe links
  */
 @customElement('rh-audio-player-subscribe')
 export class RhAudioPlayerSubscribe extends LitElement {

diff --git a/elements/rh-audio-player/rh-audio-player.ts b/elements/rh-audio-player/rh-audio-player.ts
@@ -46,6 +46,11 @@ import { RhTooltip } from '../rh-tooltip/rh-tooltip.js';
  * @cssprop --rh-tooltip-content-padding-block-end - padding bottom on tooltips - {@default var(--rh-space-md, 8px)}
  * @cssprop --rh-tooltip-content-padding-inline-start - padding left on tooltips -  {@default var(--rh-space-md, 8px)}
  * @cssprop --rh-tooltip-content-padding-inline-end - padding right on tooltips - {@default var(--rh-space-md, 8px)}
+ * @csspart panel - expandable panel
+ * @csspart toolbar - main controls
+ * @csspart about - about the episode panel
+ * @csspart subscribe - subscribe panel
+ * @csspart transcript - transcript panel
  */
 @customElement('rh-audio-player')
 export class RhAudioPlayer extends LitElement {

diff --git a/elements/rh-audio-player/rh-transcript.ts b/elements/rh-audio-player/rh-transcript.ts
@@ -26,6 +26,8 @@ const icon = html`
  * Audio Player Transcript Panel
  * @slot heading - custom heading for panel
  * @slot - `rh-cue` elements
+ * @csspart heading - scrolling text overflow
+ * @csspart toolbar - toolbar area above cues list
  */
 @customElement('rh-transcript')
 export class RhTranscript extends LitElement {