Skip to content

feat(theme): support dynamic dom target in SiThemeService - #2591

Open
chintankavathia wants to merge 1 commit into
mainfrom
feat/theme/scoped/theme-service
Open

feat(theme): support dynamic dom target in SiThemeService#2591
chintankavathia wants to merge 1 commit into
mainfrom
feat/theme/scoped/theme-service

Conversation

@chintankavathia

@chintankavathia chintankavathia commented Aug 20, 2026

Copy link
Copy Markdown
Member

Allows SiThemeService to target specified DOM root instead of hardcoded document element which fails in case of micro frontends loading element on shadow dom host. siShadowRoot can now preconfigure target element for SiThemeService.

Background

The theme service previously applied theme state only to the document root. Content rendered in a Shadow DOM using :host as root selector therefore did not reliably receive theme classes, color scheme, or generated theme styles.


Documentation.
Examples.
Dashboards Demo.
Playwright report.

Coverage Reports:

Code Coverage

@chintankavathia
chintankavathia force-pushed the feat/theme/scoped/theme-service branch from 8716d40 to 01f793c Compare August 20, 2026 06:15
@chintankavathia
chintankavathia marked this pull request as ready for review August 20, 2026 06:34
@chintankavathia
chintankavathia requested review from a team as code owners August 20, 2026 06:34
import { DOCUMENT, inject, InjectionToken } from '@angular/core';
import { Meta } from '@angular/platform-browser';

export type SiResolvedColorScheme = 'dark' | 'light';

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In theme service we have type ThemeType = 'dark' | 'light' | 'auto'. So this is the same minus the 'auto'.

Can we instead have something like

export type ColorScheme = 'light' | 'dark';
export type ThemeType = ColorScheme | 'auto'

so that the relation is clear. Guess si-theme.model.ts is the right place for this

Allows SiThemeService to target specified DOM root instead of hardcoded document element which fails in case of micro frontends loading element on shadow dom host.
`siShadowRoot` can now preconfigure target element for `SiThemeService`.
@chintankavathia
chintankavathia force-pushed the feat/theme/scoped/theme-service branch from 01f793c to 563c9ad Compare August 20, 2026 14:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants