@mhmo91/schmancy 0.10.37 → 0.10.38

package/src/audio/sound.service.ts

@@ -735,8 +735,8 @@ class SoundService {
 	)
 
 	/** BehaviorSubject for current theme name (for debugging/display) */
-	private readonly _themeName$ = new BehaviorSubject<string>('default')
-	public readonly themeName$ = this._themeName$.asObservable()
+	readonly #themeName$ = new BehaviorSubject<string>('default')
+	public readonly themeName$ = this.#themeName$.asObservable()
 
 	// Getters for synchronous access
 	get theme(): SoundTheme | null {
@@ -758,7 +758,7 @@ class SoundService {
 	private constructor() {
 		// Subscribe to theme changes to update theme name
 		this.theme$.subscribe(theme => {
-			this._themeName$.next(theme?.name ?? 'default')
+			this.#themeName$.next(theme?.name ?? 'default')
 		})
 	}
 

package/src/breadcrumb/breadcrumb.ts

@@ -45,12 +45,12 @@ export class SchmancyBreadcrumb extends SchmancyElement {
 		// separator is visually present without affecting the accessible name.
 		return html`
 			<nav role="navigation">
-				<slot @slotchange=${() => this._insertSeparators()}></slot>
+				<slot @slotchange=${() => this.insertSeparators()}></slot>
 			</nav>
 		`
 	}
 
-	private _insertSeparators() {
+	private insertSeparators() {
 		const slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null
 		if (!slot) return
 		const items = slot.assignedElements({ flatten: true })

package/src/button/button.ts

@@ -71,7 +71,7 @@ export class SchmancyButton extends SchmancyElement {
 	 * while a submit is in flight. Stays focusable; disabled buttons drop from
 	 * the tab order and are unreachable to AT (WCAG 2.2 AA).
 	 */
-	private _formBusyObserver?: MutationObserver
+	private formBusyObserver?: MutationObserver
 
 	constructor() {
 		super()
@@ -128,20 +128,20 @@ export class SchmancyButton extends SchmancyElement {
 			}
 		}
 		sync()
-		this._formBusyObserver = new MutationObserver(sync)
-		this._formBusyObserver.observe(form, { attributes: true, attributeFilter: ['aria-busy'] })
+		this.formBusyObserver = new MutationObserver(sync)
+		this.formBusyObserver.observe(form, { attributes: true, attributeFilter: ['aria-busy'] })
 	}
 
 	override disconnectedCallback(): void {
-		this._formBusyObserver?.disconnect()
-		this._formBusyObserver = undefined
+		this.formBusyObserver?.disconnect()
+		this.formBusyObserver = undefined
 		super.disconnectedCallback()
 	}
 
 	@query('[part="base"]', true)
 	private nativeElement!: HTMLElement
 
-	private _ariaLabel!: string
+	#ariaLabel!: string
 
 	/**
 	 * The variant of the button.
@@ -208,8 +208,8 @@ export class SchmancyButton extends SchmancyElement {
 	public disabled = false
 
 	public override set ariaLabel(value: string) {
-		const oldVal = this._ariaLabel
-		this._ariaLabel = value
+		const oldVal = this.#ariaLabel
+		this.#ariaLabel = value
 
 		if (this.hasAttribute('aria-label')) {
 			this.removeAttribute('aria-label')
@@ -219,7 +219,7 @@ export class SchmancyButton extends SchmancyElement {
 
 	@property({ attribute: 'aria-label' })
 	public override get ariaLabel() {
-		return this._ariaLabel
+		return this.#ariaLabel
 	}
 
 	@queryAssignedElements({
@@ -293,7 +293,7 @@ export class SchmancyButton extends SchmancyElement {
 	}
 
 	// Prevent default behavior when the component is disabled.
-	private _preventDefault(event: Event) {
+	private preventDefault(event: Event) {
 		event.preventDefault()
 		event.stopPropagation()
 	}
@@ -429,7 +429,7 @@ export class SchmancyButton extends SchmancyElement {
 					class="${this.classMap(classes)}"
 					tabindex=${this.disabled ? '-1' : '0'}
 					aria-disabled=${this.disabled}
-					@click=${this.disabled ? this._preventDefault : undefined}
+					@click=${this.disabled ? this.preventDefault : undefined}
 				>
 					${when(!this.disabled, () => html`<div class="${this.classMap(stateLayerClasses)}"></div>`)}
 					<slot name="prefix"></slot>

package/src/button/icon-button.ts

@@ -1,5 +1,5 @@
 import { SchmancyElement } from '@mixins/index'
-import { css, html, LitElement, PropertyValueMap } from 'lit'
+import { css, html, LitElement } from 'lit'
 import { customElement, property, query, state } from 'lit/decorators.js'
 import { ifDefined } from 'lit/directives/if-defined.js'
 import { when } from 'lit/directives/when.js'
@@ -50,7 +50,7 @@ export class SchmnacyIconButton extends SchmancyElement {
 	@query('[part="base"]', true)
 	private nativeElement!: HTMLElement
 
-	private _ariaLabel!: string
+	#ariaLabel!: string
 
 	/**
 	 * The size of the icon.
@@ -123,31 +123,31 @@ export class SchmnacyIconButton extends SchmancyElement {
 	// no slotchange ever fires), or a nested <schmancy-icon> element.
 	// `textContent` flattens through all three.
 	@state()
-	private _capturedIcon?: string
+	private capturedIcon?: string
 
-	private _observer?: MutationObserver
+	private observer?: MutationObserver
 
 	connectedCallback(): void {
 		super.connectedCallback()
-		this._captureIcon()
-		this._observer = new MutationObserver(() => this._captureIcon())
-		this._observer.observe(this, { childList: true, characterData: true, subtree: true })
+		this.captureIcon()
+		this.observer = new MutationObserver(() => this.captureIcon())
+		this.observer.observe(this, { childList: true, characterData: true, subtree: true })
 	}
 
 	disconnectedCallback(): void {
 		super.disconnectedCallback()
-		this._observer?.disconnect()
+		this.observer?.disconnect()
 	}
 
-	private _captureIcon(): void {
+	private captureIcon(): void {
 		if (this.icon || this.text) return
-		this._capturedIcon = this.textContent?.trim() || undefined
+		this.capturedIcon = this.textContent?.trim() || undefined
 	}
 
 	// Manage aria-label manually so that we can always use our internal property.
 	public override set ariaLabel(value: string) {
-		const oldVal = this._ariaLabel
-		this._ariaLabel = value
+		const oldVal = this.#ariaLabel
+		this.#ariaLabel = value
 
 		if (this.hasAttribute('aria-label')) {
 			this.removeAttribute('aria-label')
@@ -157,7 +157,7 @@ export class SchmnacyIconButton extends SchmancyElement {
 
 	@property({ attribute: 'aria-label' })
 	public override get ariaLabel() {
-		return this._ariaLabel
+		return this.#ariaLabel
 	}
 
 	/** Sets focus in the button. */
@@ -175,12 +175,12 @@ export class SchmnacyIconButton extends SchmancyElement {
 	}
 
 	// Prevent default behavior when the component is disabled.
-	private _preventDefault(event: Event) {
+	private preventDefault(event: Event) {
 		event.preventDefault()
 		event.stopPropagation()
 	}
 
-	protected firstUpdated(_changedProperties: PropertyValueMap<unknown> | Map<PropertyKey, unknown>): void {
+	protected firstUpdated(): void {
 		// Add any first-update logic here if needed.
 	}
 
@@ -236,14 +236,14 @@ export class SchmnacyIconButton extends SchmancyElement {
 					class="${this.classMap(classes)}"
 					tabindex=${this.disabled ? '-1' : '0'}
 					aria-disabled=${this.disabled}
-					@click=${this.disabled ? this._preventDefault : undefined}
+					@click=${this.disabled ? this.preventDefault : undefined}
 				>
 					${when(!this.disabled, () => html`<div class="absolute inset-0 ${this.classMap(stateLayerClasses)}"></div>`)}
 					${this.text
 						? html`<slot></slot>`
 						: html`
 							<slot style="display:none"></slot>
-							<schmancy-icon class=${iconSizeClass}>${this.icon || this._capturedIcon}</schmancy-icon>
+							<schmancy-icon class=${iconSizeClass}>${this.icon || this.capturedIcon}</schmancy-icon>
 						`
 					}
 				</a>
@@ -266,7 +266,7 @@ export class SchmnacyIconButton extends SchmancyElement {
 					? html`<slot></slot>`
 					: html`
 						<slot style="display:none"></slot>
-						<schmancy-icon class=${iconSizeClass}>${this.icon || this._capturedIcon}</schmancy-icon>
+						<schmancy-icon class=${iconSizeClass}>${this.icon || this.capturedIcon}</schmancy-icon>
 					`
 				}
 			</button>

package/src/card/card.ts

@@ -156,18 +156,18 @@ export default class SchmancyCard extends SchmancyElement {
 
 	connectedCallback() {
 		super.connectedCallback()
-		this._updateAriaAttributes()
+		this.updateAriaAttributes()
 	}
 
 	updated(changedProperties: Map<string, unknown>) {
 		super.updated(changedProperties)
 		if (changedProperties.has('interactive') || changedProperties.has('disabled')) {
-			this._updateAriaAttributes()
+			this.updateAriaAttributes()
 		}
 	}
 
 	// Consolidate ARIA attribute updates
-	private _updateAriaAttributes() {
+	private updateAriaAttributes() {
 		const isInteractive = this.interactive && !this.disabled
 
 		if (isInteractive) {
@@ -184,7 +184,7 @@ export default class SchmancyCard extends SchmancyElement {
 	}
 
 	// Shared ripple creation logic
-	private _addRipple(x: number, y: number) {
+	private addRipple(x: number, y: number) {
 		const id = this.nextRippleId++
 		this.ripples = [...this.ripples, { x, y, id }]
 
@@ -195,7 +195,7 @@ export default class SchmancyCard extends SchmancyElement {
 	}
 
 	// Shared navigation logic
-	private _navigate() {
+	private navigate() {
 		if (!this.href) return
 
 		if (this.target === '_blank') {
@@ -206,9 +206,9 @@ export default class SchmancyCard extends SchmancyElement {
 	}
 
 	// Combined action trigger (ripple + navigate + event)
-	private _triggerAction(x: number, y: number) {
-		this._addRipple(x, y)
-		this._navigate()
+	private triggerAction(x: number, y: number) {
+		this.addRipple(x, y)
+		this.navigate()
 
 		this.dispatchEvent(
 			new CustomEvent('schmancy-click', {
@@ -223,7 +223,7 @@ export default class SchmancyCard extends SchmancyElement {
 		if (this.disabled || !this.interactive) return
 
 		const rect = this.getBoundingClientRect()
-		this._triggerAction(e.clientX - rect.left, e.clientY - rect.top)
+		this.triggerAction(e.clientX - rect.left, e.clientY - rect.top)
 	}
 
 	private handleKeyDown = (e: KeyboardEvent) => {
@@ -231,22 +231,22 @@ export default class SchmancyCard extends SchmancyElement {
 
 		if (e.key === 'Enter' || e.key === ' ') {
 			e.preventDefault()
-			this._setPressed(true)
+			this.setPressed(true)
 
 			// Simulate click at center
 			const rect = this.getBoundingClientRect()
-			this._triggerAction(rect.width / 2, rect.height / 2)
+			this.triggerAction(rect.width / 2, rect.height / 2)
 		}
 	}
 
 	private handleKeyUp = (e: KeyboardEvent) => {
 		if (e.key === 'Enter' || e.key === ' ') {
-			this._setPressed(false)
+			this.setPressed(false)
 		}
 	}
 
 	// Consolidate pressed state management
-	private _setPressed(pressed: boolean) {
+	private setPressed(pressed: boolean) {
 		this.pressed = pressed
 		if (pressed) {
 			this.setAttribute('pressed', '')
@@ -257,11 +257,11 @@ export default class SchmancyCard extends SchmancyElement {
 
 	private handleMouseDown = () => {
 		if (this.disabled || !this.interactive) return
-		this._setPressed(true)
+		this.setPressed(true)
 	}
 
-	private handleMouseUp = () => this._setPressed(false)
-	private handleMouseLeave = () => this._setPressed(false)
+	private handleMouseUp = () => this.setPressed(false)
+	private handleMouseLeave = () => this.setPressed(false)
 
 	protected render() {
 		const isInteractive = this.interactive && !this.disabled

package/src/content-drawer/drawer.ts

@@ -139,7 +139,7 @@ export class SchmancyContentDrawer extends SchmancyElement {
 		}
 	}
 
-	private _overlaySubscription: Subscription | null = null
+	private overlaySubscription: Subscription | null = null
 
 	private handleRender(detail: TRenderCustomEvent['detail']) {
 		if (this.mode === 'push') {
@@ -155,16 +155,16 @@ export class SchmancyContentDrawer extends SchmancyElement {
 			// `show()` mounts the same component as a modal overlay; subscription
 			// = lifecycle, so dropping the previous one closes any prior modal
 			// before opening the next.
-			this._overlaySubscription?.unsubscribe()
-			this._overlaySubscription = show(detail.component, { props: detail.props })
+			this.overlaySubscription?.unsubscribe()
+			this.overlaySubscription = show(detail.component, { props: detail.props })
 				.pipe(takeUntil(this.disconnecting))
-				.subscribe({ complete: () => { this._overlaySubscription = null } })
+				.subscribe({ complete: () => { this.overlaySubscription = null } })
 		}
 	}
 
 	private dismissOverlay() {
-		this._overlaySubscription?.unsubscribe()
-		this._overlaySubscription = null
+		this.overlaySubscription?.unsubscribe()
+		this.overlaySubscription = null
 	}
 
 	getOffsetTop(element: HTMLElement | null) {

package/src/details/details.ts

@@ -133,11 +133,11 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 
 	@property({ type: Boolean, reflect: true })
 	get open() {
-		return this._open$.value
+		return this.#open$.value
 	}
 	set open(value: boolean) {
-		if (this._open$.value !== value) {
-			this._open$.next(value)
+		if (this.#open$.value !== value) {
+			this.#open$.next(value)
 		}
 	}
 
@@ -162,16 +162,16 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 	@property({ attribute: 'content-padding' })
 	contentPadding = 'p-3'
 
-	private _open$ = new BehaviorSubject<boolean>(false)
-	private _indicatorRef: Ref<HTMLElement> = createRef()
-	private _contentRef: Ref<HTMLDivElement> = createRef()
-	private _currentAnimation?: Animation
-	private _indicatorIsOpen = false
-	private _closing = false
-	private _closeSub?: Subscription
+	#open$ = new BehaviorSubject<boolean>(false)
+	#indicatorRef: Ref<HTMLElement> = createRef()
+	#contentRef: Ref<HTMLDivElement> = createRef()
+	#currentAnimation?: Animation
+	#indicatorIsOpen = false
+	#closing = false
+	#closeSub?: Subscription
 
 	/** True when browser handles close animation natively via ::details-content */
-	private _nativeAnim =
+	#nativeAnim =
 		typeof CSS !== 'undefined' &&
 		!!CSS.supports?.('selector(::details-content)') &&
 		!!CSS.supports?.('interpolate-size', 'allow-keywords')
@@ -180,7 +180,7 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 	 * Lazy rendering: tracks if content has ever been opened.
 	 * Once true, content stays rendered (even when closed) for smooth animations.
 	 */
-	@state() private _hasOpened = false
+	@state() private hasOpened = false
 
 	constructor() {
 		super()
@@ -191,15 +191,15 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 	connectedCallback() {
 		super.connectedCallback()
 
-		this._open$
+		this.#open$
 			.pipe(
 				distinctUntilChanged(),
 				tap(isOpen => {
-					if (isOpen && !this._hasOpened) {
-						this._hasOpened = true
+					if (isOpen && !this.hasOpened) {
+						this.hasOpened = true
 					}
-					this._animateIndicator(isOpen)
-					this._updateIndicatorSlot()
+					this.#animateIndicator(isOpen)
+					this.#updateIndicatorSlot()
 				}),
 				takeUntil(this.disconnecting),
 			)
@@ -208,11 +208,11 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 
 	disconnectedCallback() {
 		super.disconnectedCallback()
-		this._closeSub?.unsubscribe()
+		this.#closeSub?.unsubscribe()
 	}
 
 	render() {
-		const isOpen = this._open$.value
+		const isOpen = this.#open$.value
 
 		const detailsClasses = this.classMap({
 			'w-full rounded-xl transition-shadow duration-200 ease-out': true,
@@ -240,15 +240,15 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 		})
 
 		return html`
-			<details ?open=${isOpen} @toggle=${this._handleToggle} class=${detailsClasses}>
-				<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this._handleSummaryClick}>
+			<details ?open=${isOpen} @toggle=${this.#handleToggle} class=${detailsClasses}>
+				<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this.#handleSummaryClick}>
 					${!this.hideIndicator
 						? html`
 								<span
-									${ref(this._indicatorRef)}
+									${ref(this.#indicatorRef)}
 									class="flex items-center justify-center w-5 h-5 rounded-full shrink-0 opacity-70 group-hover:opacity-100"
 								>
-									<slot name="indicator" @slotchange=${this._handleIndicatorSlotChange}>
+									<slot name="indicator" @slotchange=${this.#handleIndicatorSlotChange}>
 										<svg
 											width="20"
 											height="20"
@@ -278,13 +278,13 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 				</summary>
 
 				<div
-					${ref(this._contentRef)}
+					${ref(this.#contentRef)}
 					class="content-wrapper"
-					data-open=${isOpen && !this._closing}
+					data-open=${isOpen && !this.#closing}
 					aria-hidden=${isOpen ? 'false' : 'true'}
 				>
 					<div class="content-inner">
-						${this._hasOpened
+						${this.hasOpened
 							? html`
 									<div class=${contentClasses}>
 										<slot></slot>
@@ -298,7 +298,7 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 		`
 	}
 
-	private _handleSummaryClick(e: MouseEvent) {
+	#handleSummaryClick(e: MouseEvent) {
 		if ((e.target as HTMLElement).closest('[slot="actions"]')) {
 			e.preventDefault()
 			return
@@ -307,23 +307,23 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 			e.preventDefault()
 			return
 		}
-		if (this._closing) {
+		if (this.#closing) {
 			e.preventDefault()
 			return
 		}
 
 		// Native animated path (Chromium 131+): browser handles everything via CSS
-		if (this._nativeAnim) return
+		if (this.#nativeAnim) return
 
 		// Fallback: manually animate close via CSS transition, then close native details
-		if (this._open$.value) {
+		if (this.#open$.value) {
 			e.preventDefault()
-			this._startClose()
+			this.#startClose()
 		}
-		// If closed, let native open happen (handled by _handleToggle)
+		// If closed, let native open happen (handled by #handleToggle)
 	}
 
-	private _handleToggle(e: Event) {
+	#handleToggle(e: Event) {
 		e.stopPropagation()
 
 		const ownDetails = this.shadowRoot?.querySelector('details')
@@ -331,15 +331,15 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 
 		const newState = ownDetails.open
 
-		if (this._nativeAnim) {
+		if (this.#nativeAnim) {
 			// Native path: handle both open and close
-			if (this._open$.value !== newState) {
+			if (this.#open$.value !== newState) {
 				this.open = newState
 				this.dispatchScopedEvent('toggle', { open: newState })
 			}
 		} else {
-			// Fallback path: only handle OPEN (close is driven by _startClose)
-			if (newState && this._open$.value !== newState) {
+			// Fallback path: only handle OPEN (close is driven by #startClose)
+			if (newState && this.#open$.value !== newState) {
 				this.open = newState
 				this.dispatchScopedEvent('toggle', { open: newState })
 			}
@@ -350,25 +350,25 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 	 * Fallback close: trigger CSS grid+opacity transition, then close native <details>.
 	 * The CSS transition (400ms) handles the visual collapse — no WAAPI needed.
 	 */
-	private _startClose() {
-		this._closing = true
-		this._closeSub?.unsubscribe()
+	#startClose() {
+		this.#closing = true
+		this.#closeSub?.unsubscribe()
 
 		// Immediately collapse the grid wrapper via DOM attribute
-		this._contentRef.value?.setAttribute('data-open', 'false')
+		this.#contentRef.value?.setAttribute('data-open', 'false')
 
 		// Animate indicator immediately
-		this._animateIndicator(false)
+		this.#animateIndicator(false)
 
 		// After CSS transition completes, close native details and update state
-		const wrapper = this._contentRef.value
+		const wrapper = this.#contentRef.value
 		if (!wrapper) return
 
-		this._closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(
+		this.#closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(
 			filter(e => e.propertyName === 'grid-template-rows'),
 			take(1),
 			tap(() => {
-				this._closing = false
+				this.#closing = false
 				this.open = false
 				this.dispatchScopedEvent('toggle', { open: false })
 			}),
@@ -376,33 +376,33 @@ export default class SchmancyDetails extends SurfaceMixin(SchmancyElement) {
 		).subscribe()
 	}
 
-	private _handleIndicatorSlotChange(e: Event) {
+	#handleIndicatorSlotChange(e: Event) {
 		const slot = e.target as HTMLSlotElement
 		slot.assignedElements().forEach(el => {
-			el.setAttribute('data-open', String(this._open$.value))
+			el.setAttribute('data-open', String(this.#open$.value))
 		})
 	}
 
-	private _updateIndicatorSlot() {
+	#updateIndicatorSlot() {
 		const slot = this.shadowRoot?.querySelector('slot[name="indicator"]') as HTMLSlotElement | null
 		if (slot) {
 			slot.assignedElements().forEach(el => {
-				el.setAttribute('data-open', String(this._open$.value))
+				el.setAttribute('data-open', String(this.#open$.value))
 			})
 		}
 	}
 
 	/** Idempotent indicator rotation — skips if already at target state */
-	private _animateIndicator(isOpen: boolean) {
-		if (this._indicatorIsOpen === isOpen) return
-		this._indicatorIsOpen = isOpen
+	#animateIndicator(isOpen: boolean) {
+		if (this.#indicatorIsOpen === isOpen) return
+		this.#indicatorIsOpen = isOpen
 
-		const indicator = this._indicatorRef.value
+		const indicator = this.#indicatorRef.value
 		if (!indicator || reducedMotion$.value) return
 
-		this._currentAnimation?.cancel()
+		this.#currentAnimation?.cancel()
 
-		this._currentAnimation = indicator.animate(
+		this.#currentAnimation = indicator.animate(
 			[
 				{ transform: `rotate(${isOpen ? '0deg' : `${this.indicatorRotate}deg`})` },
 				{ transform: `rotate(${isOpen ? `${this.indicatorRotate}deg` : '0deg'})` },

package/src/directives/ai-badge.ts

@@ -17,7 +17,8 @@ interface State {
 class AIBadgeDirective extends AsyncDirective {
 	private state: State | null = null
 
-	render(_message?: string) {
+	render(message?: string) {
+		void message
 		return noChange
 	}
 

package/src/directives/animate-text.ts

@@ -56,7 +56,8 @@ class AnimateTextDirective extends AsyncDirective {
 	private disconnecting$ = new Subject<void>()
 	private initialized = false
 
-	render(_options: AnimateTextOptions) {
+	render(options: AnimateTextOptions) {
+		void options
 		return noChange
 	}
 

package/src/directives/art/art.directive.ts

@@ -23,7 +23,8 @@ interface ExtendedArtState extends ArtState {
 class ArtDirective extends AsyncDirective {
 	private state: ExtendedArtState | null = null
 
-	render(_options: ArtOptions) {
+	render(options: ArtOptions) {
+		void options
 		return noChange
 	}
 

package/src/directives/battery.ts

@@ -317,7 +317,8 @@ class FutureCellDirective extends AsyncDirective {
 		return base * (0.15 + pct * 0.85)
 	}
 
-	render(_options: FutureCellOptions) {
+	render(options: FutureCellOptions) {
+		void options
 		return noChange
 	}
 

package/src/directives/confirm-click.ts

@@ -36,7 +36,9 @@ class ConfirmClickDirective extends Directive {
 		}
 	}
 
-	render(_callback: () => void, _options?: ConfirmClickOptions) {
+	render(callback: () => void, options?: ConfirmClickOptions) {
+		void callback
+		void options
 		return undefined
 	}
 
@@ -105,11 +107,11 @@ class ConfirmClickDirective extends Directive {
 		const timeout = options.timeout ?? 3000
 
 		// Read the host's icon — reuse it so the user sees the same action "armed"
-		const iconButton = element as HTMLElement & { icon?: string; _capturedIcon?: string }
+		const iconButton = element as HTMLElement & { icon?: string; ['capturedIcon']?: string }
 		const hostIcon =
 			options.icon ??
 			iconButton.icon ??
-			iconButton._capturedIcon ??
+			iconButton['capturedIcon'] ??
 			element.textContent?.trim() ??
 			'warning'