@siemens/element-ng 49.17.0 → 49.18.1

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.
@@ -166,7 +166,7 @@ class SiPillsInputComponent {
166
166
  }
167
167
  }
168
168
  rebuildValue(value, trigger) {
169
- if (value) {
169
+ if (value.trim()) {
170
170
  const valueParseResult = this.siPillsInputValueHandlerDirective?.handle(value, trigger);
171
171
  if (valueParseResult) {
172
172
  this.pills.update(pills => [...pills, ...valueParseResult.newPills]);
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-element-ng-pills-input.mjs","sources":["../../../../projects/element-ng/pills-input/si-input-pill.component.ts","../../../../projects/element-ng/pills-input/si-input-pill.component.html","../../../../projects/element-ng/pills-input/si-pills-input-value-handler.ts","../../../../projects/element-ng/pills-input/si-pills-input.component.ts","../../../../projects/element-ng/pills-input/si-pills-input.component.html","../../../../projects/element-ng/pills-input/si-pills-input-pattern-base.ts","../../../../projects/element-ng/pills-input/si-pills-input-csv.directive.ts","../../../../projects/element-ng/pills-input/si-pills-input-email.directive.ts","../../../../projects/element-ng/pills-input/si-pills-input.module.ts","../../../../projects/element-ng/pills-input/index.ts","../../../../projects/element-ng/pills-input/siemens-element-ng-pills-input.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\nimport { elementCancel } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\n\n@Component({\n selector: 'si-input-pill',\n imports: [SiIconComponent],\n templateUrl: './si-input-pill.component.html',\n styles: '.btn { cursor: pointer; }',\n changeDetection: ChangeDetectionStrategy.Default,\n host: {\n class: 'pill pe-0',\n '[class.pe-4]': 'hideClose()'\n }\n})\nexport class SiInputPillComponent {\n /** Emits when the pill's close button is clicked. */\n readonly deletePill = output<void>();\n\n /**\n * Whether to hide the close button.\n *\n * @defaultValue false\n */\n readonly hideClose = input(false);\n\n protected readonly icons = addIcons({ elementCancel });\n}\n","<div class=\"text-truncate\">\n <ng-content />\n</div>\n@if (!hideClose()) {\n <span\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost\"\n aria-hidden=\"true\"\n (click)=\"deletePill.emit()\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </span>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive } from '@angular/core';\n\nexport interface SiPillsInputValueParseResult {\n newValue: string;\n newPills: string[];\n}\n\nexport type SiPillsInputValueHandlerTrigger = 'input' | 'keydown.enter' | 'blur';\n\n@Directive()\nexport abstract class SiPillsInputValueHandlerDirective {\n /** @internal */\n abstract handle(\n value: string,\n trigger: SiPillsInputValueHandlerTrigger\n ): SiPillsInputValueParseResult | undefined;\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n OnInit,\n signal,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { SiTranslatePipe, t, TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport { SiInputPillComponent } from './si-input-pill.component';\nimport {\n SiPillsInputValueHandlerDirective,\n SiPillsInputValueHandlerTrigger\n} from './si-pills-input-value-handler';\n\n@Component({\n selector: 'si-pills-input',\n imports: [SiInputPillComponent, SiTranslatePipe],\n templateUrl: './si-pills-input.component.html',\n styleUrl: './si-pills-input.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiPillsInputComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiPillsInputComponent\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'form-control',\n role: 'listbox',\n 'aria-orientation': 'horizontal',\n '[class.disabled]': 'disabled()',\n '[attr.aria-disabled]': 'disabled()',\n '[class.readonly]': 'readonly()',\n '[attr.aria-readonly]': 'readonly()',\n // using attr so that tabindex is removed if not defined\n '[attr.tabindex]': 'tabindex()',\n '[attr.aria-activedescendant]': 'activeDescendant()',\n '[attr.aria-labelledby]': 'labelledby()',\n '[attr.aria-describedby]': 'errormessageId()',\n '(click)': 'click()',\n '(keydown.arrowLeft)': 'arrowLeft()',\n '(keydown.arrowRight)': 'arrowRight()',\n '(keydown.backspace)': 'delete()',\n '(keydown.delete)': 'delete()'\n }\n})\nexport class SiPillsInputComponent implements OnInit, ControlValueAccessor, SiFormItemControl {\n private static idCounter = 0;\n\n /**\n * The identifier of the pills-input. Will be generated if not provided.\n *\n * @defaultValue\n * ```\n * `__si-pills-input-${SiPillsInputComponent.idCounter++}`\n * ```\n */\n readonly id = input(`__si-pills-input-${SiPillsInputComponent.idCounter++}`);\n\n /**\n * The aria-label for the inner input where users enter new items.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PILLS_INPUT.INPUT_ELEMENT_ARIA_LABEL:Create item`)\n * ```\n */\n readonly inputElementAriaLabel = input(\n t(() => $localize`:@@SI_PILLS_INPUT.INPUT_ELEMENT_ARIA_LABEL:Create item`)\n );\n\n /**\n * Whether the pills-input is disabled.\n *\n * @defaultValue false\n */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n /**\n * Whether the pills-input is readonly\n *\n * @defaultValue false\n */\n readonly readonly = input(false, { transform: booleanAttribute });\n\n /** The placeholder to be shown if no value is currently present. */\n readonly placeholder = input<TranslatableString>();\n\n /**\n * @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n */\n readonly labelledby = input(`${this.id()}-label`);\n\n /**\n * This ID will be bound to the `aria-describedby` attribute of the pills-input.\n * Use this to reference the element containing the error message(s) for the pills-input.\n * It will be picked by the {@link SiFormItemComponent} if the pills-input is used inside a form item.\n *\n * @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n */\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected inputValue = '';\n protected onTouched: () => void = () => {};\n protected onChange: (val: any) => void = () => {};\n\n protected readonly pills = signal<string[]>([]);\n protected readonly activePillIndex = signal<number | undefined>(undefined);\n protected readonly inputId = computed(() => `${this.id()}-input`);\n protected readonly disabled = computed(() => this.disabledInput() || this.disabledNgControl());\n protected readonly activeDescendant = computed(() => {\n const activePillIndex = this.activePillIndex();\n return activePillIndex !== undefined ? `${this.id()}-pill-${activePillIndex}` : null;\n });\n\n protected readonly tabindex = computed(() =>\n this.disabled() ? undefined : this.readonly() ? 0 : -1\n );\n private readonly inputElement = viewChild<ElementRef<HTMLInputElement>>('inputElement');\n private readonly disabledNgControl = signal(false);\n private siPillsInputValueHandlerDirective = inject(SiPillsInputValueHandlerDirective, {\n optional: true\n });\n private readonly cdRef = inject(ChangeDetectorRef);\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n ngOnInit(): void {\n this.siPillsInputValueHandlerDirective ??= {\n handle: (value, trigger) => {\n if (trigger !== 'input') {\n return {\n newPills: [value],\n newValue: ''\n };\n }\n return undefined;\n }\n };\n }\n\n protected input(): void {\n this.inputValue = this.inputElement()!.nativeElement.value;\n this.rebuildValue(this.inputValue, 'input');\n }\n\n protected click(): void {\n this.inputElement()?.nativeElement.focus();\n }\n\n protected blur(): void {\n this.rebuildValue(this.inputValue, 'blur');\n this.activePillIndex.set(undefined);\n this.onTouched();\n }\n\n protected keydownEnter(event: Event): void {\n this.rebuildValue(this.inputValue, 'keydown.enter');\n event.preventDefault();\n }\n\n protected keydownBackspace(event: Event): void {\n const count = this.pills().length;\n if (!this.inputValue && count) {\n const lastChipValue = this.pills().at(-1)!;\n this.remove(count - 1, false);\n this.inputValue = lastChipValue;\n event.preventDefault();\n }\n }\n\n protected remove(index: number, focus = true): void {\n this.pills.update(pills => pills.filter((_, pillIndex) => index !== pillIndex));\n this.onTouched();\n this.onChange(this.pills());\n if (focus) {\n this.inputElement()!.nativeElement.focus();\n }\n }\n\n private rebuildValue(value: string, trigger: SiPillsInputValueHandlerTrigger): void {\n if (value) {\n const valueParseResult = this.siPillsInputValueHandlerDirective?.handle(value, trigger);\n if (valueParseResult) {\n this.pills.update(pills => [...pills, ...valueParseResult.newPills]);\n // Doesn't update when setting to empty string.\n // Not using setTimeout to avoid flickering.\n this.cdRef.detectChanges();\n this.inputValue = valueParseResult.newValue;\n this.cdRef.detectChanges();\n\n if (valueParseResult.newPills.length) {\n this.onTouched();\n this.onChange(this.pills());\n }\n }\n }\n }\n\n protected arrowLeft(): void {\n const activePillIndex = this.activePillIndex();\n const count = this.pills().length;\n if (activePillIndex !== undefined) {\n this.activePillIndex.set(Math.max(0, activePillIndex - 1));\n } else if (!this.inputValue.length && count) {\n this.elementRef.nativeElement.focus();\n this.activePillIndex.set(count - 1);\n }\n }\n\n protected arrowRight(): void {\n const activePillIndex = this.activePillIndex();\n if (activePillIndex !== undefined) {\n this.activePillIndex.set(activePillIndex + 1);\n\n if (this.activePillIndex()! >= this.pills().length) {\n this.inputElement()?.nativeElement.focus();\n this.activePillIndex.set(undefined);\n }\n }\n }\n\n protected delete(): void {\n const activePillIndex = this.activePillIndex();\n const count = this.pills().length;\n if (activePillIndex !== undefined && !this.readonly()) {\n const targetIndex = count > 1 ? Math.min(activePillIndex, count - 2) : undefined;\n this.remove(activePillIndex, targetIndex === undefined);\n this.activePillIndex.set(targetIndex);\n }\n }\n\n /** @internal */\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n /** @internal */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /** @internal */\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n\n /** @internal */\n writeValue(value?: string[] | null): void {\n this.pills.set(value?.slice() ?? []);\n }\n}\n","<!-- aria-required-children is disabled here -->\n@for (chip of pills(); track $index) {\n <si-input-pill\n role=\"option\"\n [id]=\"id() + '-pill-' + $index\"\n [class.active]=\"$index === activePillIndex()\"\n [hideClose]=\"disabled() || readonly()\"\n (deletePill)=\"remove($index)\"\n >\n {{ chip }}\n </si-input-pill>\n}\n@if (!readonly() && !disabled()) {\n <div role=\"presentation\" class=\"flex-fill\">\n <input\n #inputElement\n class=\"focus-none\"\n [id]=\"inputId()\"\n [attr.aria-label]=\"inputElementAriaLabel() | translate\"\n [placeholder]=\"(!pills().length ? (placeholder() ?? '') : '') | translate\"\n [value]=\"inputValue\"\n (keydown.enter)=\"keydownEnter($event)\"\n (keydown.backspace)=\"keydownBackspace($event)\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { signal, Signal } from '@angular/core';\n\nimport {\n SiPillsInputValueHandlerTrigger,\n SiPillsInputValueParseResult\n} from './si-pills-input-value-handler';\n\nexport const SEPARATOR_REGEX = /\\s*[;,]\\s*/g;\n\nexport abstract class SiPillsInputPatternBase {\n /**\n * Regex to split the input value into segments.\n *\n * @defaultValue SEPARATOR_REGEX\n */\n readonly separatorRegex = signal(SEPARATOR_REGEX);\n /** Regex to validate an input string item. */\n readonly validationRegex?: Signal<RegExp | undefined>;\n\n /** @internal */\n handle(\n value: string,\n trigger: SiPillsInputValueHandlerTrigger\n ): SiPillsInputValueParseResult | undefined {\n const segments = value.split(this.separatorRegex()).map(s => s.trim());\n const itemRegex = this.validationRegex?.();\n if (segments.length) {\n const newValue = trigger === 'input' ? segments.pop()! : '';\n if (\n segments.every(segment => {\n return segment && (!itemRegex || segment.match(itemRegex));\n })\n ) {\n return {\n newPills: segments,\n newValue\n };\n }\n }\n\n return {\n newPills: [],\n newValue: value\n };\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive, input } from '@angular/core';\n\nimport { SiPillsInputPatternBase } from './si-pills-input-pattern-base';\nimport { SiPillsInputValueHandlerDirective } from './si-pills-input-value-handler';\n\n@Directive({\n selector: '[siPillsInputCsv]',\n providers: [\n {\n provide: SiPillsInputValueHandlerDirective,\n useExisting: SiPillsInputCsvDirective\n }\n ]\n})\nexport class SiPillsInputCsvDirective extends SiPillsInputPatternBase {\n /** @defaultValue undefined */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n override readonly validationRegex = input<RegExp>(undefined, { alias: 'pillsInputCsvItemRegex' });\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive, signal } from '@angular/core';\n\nimport { SiPillsInputPatternBase } from './si-pills-input-pattern-base';\nimport { SiPillsInputValueHandlerDirective } from './si-pills-input-value-handler';\n\n// From Angular Email Validator\nconst EMAIL_REGEX =\n /^(?=.{1,254}$)(?=.{1,64}@)[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/g;\n\n@Directive({\n selector: '[siPillsInputEmail]',\n providers: [\n {\n provide: SiPillsInputValueHandlerDirective,\n useExisting: SiPillsInputEmailDirective\n }\n ]\n})\nexport class SiPillsInputEmailDirective extends SiPillsInputPatternBase {\n /**\n * @defaultValue signal(EMAIL_REGEX).asReadonly()\n */\n override readonly validationRegex = signal(EMAIL_REGEX).asReadonly();\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiPillsInputCsvDirective } from './si-pills-input-csv.directive';\nimport { SiPillsInputEmailDirective } from './si-pills-input-email.directive';\nimport { SiPillsInputComponent } from './si-pills-input.component';\n\n@NgModule({\n imports: [SiPillsInputComponent, SiPillsInputCsvDirective, SiPillsInputEmailDirective],\n exports: [SiPillsInputComponent, SiPillsInputCsvDirective, SiPillsInputEmailDirective]\n})\nexport class SiPillsInputModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-pills-input.component';\nexport * from './si-pills-input.module';\nexport * from './si-pills-input-csv.directive';\nexport * from './si-pills-input-email.directive';\nexport * from './si-pills-input-value-handler';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-element-ng-pills-input.mjs","sources":["../../../../projects/element-ng/pills-input/si-input-pill.component.ts","../../../../projects/element-ng/pills-input/si-input-pill.component.html","../../../../projects/element-ng/pills-input/si-pills-input-value-handler.ts","../../../../projects/element-ng/pills-input/si-pills-input.component.ts","../../../../projects/element-ng/pills-input/si-pills-input.component.html","../../../../projects/element-ng/pills-input/si-pills-input-pattern-base.ts","../../../../projects/element-ng/pills-input/si-pills-input-csv.directive.ts","../../../../projects/element-ng/pills-input/si-pills-input-email.directive.ts","../../../../projects/element-ng/pills-input/si-pills-input.module.ts","../../../../projects/element-ng/pills-input/index.ts","../../../../projects/element-ng/pills-input/siemens-element-ng-pills-input.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\nimport { elementCancel } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\n\n@Component({\n selector: 'si-input-pill',\n imports: [SiIconComponent],\n templateUrl: './si-input-pill.component.html',\n styles: '.btn { cursor: pointer; }',\n changeDetection: ChangeDetectionStrategy.Default,\n host: {\n class: 'pill pe-0',\n '[class.pe-4]': 'hideClose()'\n }\n})\nexport class SiInputPillComponent {\n /** Emits when the pill's close button is clicked. */\n readonly deletePill = output<void>();\n\n /**\n * Whether to hide the close button.\n *\n * @defaultValue false\n */\n readonly hideClose = input(false);\n\n protected readonly icons = addIcons({ elementCancel });\n}\n","<div class=\"text-truncate\">\n <ng-content />\n</div>\n@if (!hideClose()) {\n <span\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost\"\n aria-hidden=\"true\"\n (click)=\"deletePill.emit()\"\n >\n <si-icon [icon]=\"icons.elementCancel\" />\n </span>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive } from '@angular/core';\n\nexport interface SiPillsInputValueParseResult {\n newValue: string;\n newPills: string[];\n}\n\nexport type SiPillsInputValueHandlerTrigger = 'input' | 'keydown.enter' | 'blur';\n\n@Directive()\nexport abstract class SiPillsInputValueHandlerDirective {\n /** @internal */\n abstract handle(\n value: string,\n trigger: SiPillsInputValueHandlerTrigger\n ): SiPillsInputValueParseResult | undefined;\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n OnInit,\n signal,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { SiTranslatePipe, t, TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport { SiInputPillComponent } from './si-input-pill.component';\nimport {\n SiPillsInputValueHandlerDirective,\n SiPillsInputValueHandlerTrigger\n} from './si-pills-input-value-handler';\n\n@Component({\n selector: 'si-pills-input',\n imports: [SiInputPillComponent, SiTranslatePipe],\n templateUrl: './si-pills-input.component.html',\n styleUrl: './si-pills-input.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiPillsInputComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiPillsInputComponent\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'form-control',\n role: 'listbox',\n 'aria-orientation': 'horizontal',\n '[class.disabled]': 'disabled()',\n '[attr.aria-disabled]': 'disabled()',\n '[class.readonly]': 'readonly()',\n '[attr.aria-readonly]': 'readonly()',\n // using attr so that tabindex is removed if not defined\n '[attr.tabindex]': 'tabindex()',\n '[attr.aria-activedescendant]': 'activeDescendant()',\n '[attr.aria-labelledby]': 'labelledby()',\n '[attr.aria-describedby]': 'errormessageId()',\n '(click)': 'click()',\n '(keydown.arrowLeft)': 'arrowLeft()',\n '(keydown.arrowRight)': 'arrowRight()',\n '(keydown.backspace)': 'delete()',\n '(keydown.delete)': 'delete()'\n }\n})\nexport class SiPillsInputComponent implements OnInit, ControlValueAccessor, SiFormItemControl {\n private static idCounter = 0;\n\n /**\n * The identifier of the pills-input. Will be generated if not provided.\n *\n * @defaultValue\n * ```\n * `__si-pills-input-${SiPillsInputComponent.idCounter++}`\n * ```\n */\n readonly id = input(`__si-pills-input-${SiPillsInputComponent.idCounter++}`);\n\n /**\n * The aria-label for the inner input where users enter new items.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PILLS_INPUT.INPUT_ELEMENT_ARIA_LABEL:Create item`)\n * ```\n */\n readonly inputElementAriaLabel = input(\n t(() => $localize`:@@SI_PILLS_INPUT.INPUT_ELEMENT_ARIA_LABEL:Create item`)\n );\n\n /**\n * Whether the pills-input is disabled.\n *\n * @defaultValue false\n */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n /**\n * Whether the pills-input is readonly\n *\n * @defaultValue false\n */\n readonly readonly = input(false, { transform: booleanAttribute });\n\n /** The placeholder to be shown if no value is currently present. */\n readonly placeholder = input<TranslatableString>();\n\n /**\n * @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n */\n readonly labelledby = input(`${this.id()}-label`);\n\n /**\n * This ID will be bound to the `aria-describedby` attribute of the pills-input.\n * Use this to reference the element containing the error message(s) for the pills-input.\n * It will be picked by the {@link SiFormItemComponent} if the pills-input is used inside a form item.\n *\n * @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n */\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected inputValue = '';\n protected onTouched: () => void = () => {};\n protected onChange: (val: any) => void = () => {};\n\n protected readonly pills = signal<string[]>([]);\n protected readonly activePillIndex = signal<number | undefined>(undefined);\n protected readonly inputId = computed(() => `${this.id()}-input`);\n protected readonly disabled = computed(() => this.disabledInput() || this.disabledNgControl());\n protected readonly activeDescendant = computed(() => {\n const activePillIndex = this.activePillIndex();\n return activePillIndex !== undefined ? `${this.id()}-pill-${activePillIndex}` : null;\n });\n\n protected readonly tabindex = computed(() =>\n this.disabled() ? undefined : this.readonly() ? 0 : -1\n );\n private readonly inputElement = viewChild<ElementRef<HTMLInputElement>>('inputElement');\n private readonly disabledNgControl = signal(false);\n private siPillsInputValueHandlerDirective = inject(SiPillsInputValueHandlerDirective, {\n optional: true\n });\n private readonly cdRef = inject(ChangeDetectorRef);\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n ngOnInit(): void {\n this.siPillsInputValueHandlerDirective ??= {\n handle: (value, trigger) => {\n if (trigger !== 'input') {\n return {\n newPills: [value],\n newValue: ''\n };\n }\n return undefined;\n }\n };\n }\n\n protected input(): void {\n this.inputValue = this.inputElement()!.nativeElement.value;\n this.rebuildValue(this.inputValue, 'input');\n }\n\n protected click(): void {\n this.inputElement()?.nativeElement.focus();\n }\n\n protected blur(): void {\n this.rebuildValue(this.inputValue, 'blur');\n this.activePillIndex.set(undefined);\n this.onTouched();\n }\n\n protected keydownEnter(event: Event): void {\n this.rebuildValue(this.inputValue, 'keydown.enter');\n event.preventDefault();\n }\n\n protected keydownBackspace(event: Event): void {\n const count = this.pills().length;\n if (!this.inputValue && count) {\n const lastChipValue = this.pills().at(-1)!;\n this.remove(count - 1, false);\n this.inputValue = lastChipValue;\n event.preventDefault();\n }\n }\n\n protected remove(index: number, focus = true): void {\n this.pills.update(pills => pills.filter((_, pillIndex) => index !== pillIndex));\n this.onTouched();\n this.onChange(this.pills());\n if (focus) {\n this.inputElement()!.nativeElement.focus();\n }\n }\n\n private rebuildValue(value: string, trigger: SiPillsInputValueHandlerTrigger): void {\n if (value.trim()) {\n const valueParseResult = this.siPillsInputValueHandlerDirective?.handle(value, trigger);\n if (valueParseResult) {\n this.pills.update(pills => [...pills, ...valueParseResult.newPills]);\n // Doesn't update when setting to empty string.\n // Not using setTimeout to avoid flickering.\n this.cdRef.detectChanges();\n this.inputValue = valueParseResult.newValue;\n this.cdRef.detectChanges();\n\n if (valueParseResult.newPills.length) {\n this.onTouched();\n this.onChange(this.pills());\n }\n }\n }\n }\n\n protected arrowLeft(): void {\n const activePillIndex = this.activePillIndex();\n const count = this.pills().length;\n if (activePillIndex !== undefined) {\n this.activePillIndex.set(Math.max(0, activePillIndex - 1));\n } else if (!this.inputValue.length && count) {\n this.elementRef.nativeElement.focus();\n this.activePillIndex.set(count - 1);\n }\n }\n\n protected arrowRight(): void {\n const activePillIndex = this.activePillIndex();\n if (activePillIndex !== undefined) {\n this.activePillIndex.set(activePillIndex + 1);\n\n if (this.activePillIndex()! >= this.pills().length) {\n this.inputElement()?.nativeElement.focus();\n this.activePillIndex.set(undefined);\n }\n }\n }\n\n protected delete(): void {\n const activePillIndex = this.activePillIndex();\n const count = this.pills().length;\n if (activePillIndex !== undefined && !this.readonly()) {\n const targetIndex = count > 1 ? Math.min(activePillIndex, count - 2) : undefined;\n this.remove(activePillIndex, targetIndex === undefined);\n this.activePillIndex.set(targetIndex);\n }\n }\n\n /** @internal */\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n /** @internal */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /** @internal */\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n\n /** @internal */\n writeValue(value?: string[] | null): void {\n this.pills.set(value?.slice() ?? []);\n }\n}\n","<!-- aria-required-children is disabled here -->\n@for (chip of pills(); track $index) {\n <si-input-pill\n role=\"option\"\n [id]=\"id() + '-pill-' + $index\"\n [class.active]=\"$index === activePillIndex()\"\n [hideClose]=\"disabled() || readonly()\"\n (deletePill)=\"remove($index)\"\n >\n {{ chip }}\n </si-input-pill>\n}\n@if (!readonly() && !disabled()) {\n <div role=\"presentation\" class=\"flex-fill\">\n <input\n #inputElement\n class=\"focus-none\"\n [id]=\"inputId()\"\n [attr.aria-label]=\"inputElementAriaLabel() | translate\"\n [placeholder]=\"(!pills().length ? (placeholder() ?? '') : '') | translate\"\n [value]=\"inputValue\"\n (keydown.enter)=\"keydownEnter($event)\"\n (keydown.backspace)=\"keydownBackspace($event)\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { signal, Signal } from '@angular/core';\n\nimport {\n SiPillsInputValueHandlerTrigger,\n SiPillsInputValueParseResult\n} from './si-pills-input-value-handler';\n\nexport const SEPARATOR_REGEX = /\\s*[;,]\\s*/g;\n\nexport abstract class SiPillsInputPatternBase {\n /**\n * Regex to split the input value into segments.\n *\n * @defaultValue SEPARATOR_REGEX\n */\n readonly separatorRegex = signal(SEPARATOR_REGEX);\n /** Regex to validate an input string item. */\n readonly validationRegex?: Signal<RegExp | undefined>;\n\n /** @internal */\n handle(\n value: string,\n trigger: SiPillsInputValueHandlerTrigger\n ): SiPillsInputValueParseResult | undefined {\n const segments = value.split(this.separatorRegex()).map(s => s.trim());\n const itemRegex = this.validationRegex?.();\n if (segments.length) {\n const newValue = trigger === 'input' ? segments.pop()! : '';\n if (\n segments.every(segment => {\n return segment && (!itemRegex || segment.match(itemRegex));\n })\n ) {\n return {\n newPills: segments,\n newValue\n };\n }\n }\n\n return {\n newPills: [],\n newValue: value\n };\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive, input } from '@angular/core';\n\nimport { SiPillsInputPatternBase } from './si-pills-input-pattern-base';\nimport { SiPillsInputValueHandlerDirective } from './si-pills-input-value-handler';\n\n@Directive({\n selector: '[siPillsInputCsv]',\n providers: [\n {\n provide: SiPillsInputValueHandlerDirective,\n useExisting: SiPillsInputCsvDirective\n }\n ]\n})\nexport class SiPillsInputCsvDirective extends SiPillsInputPatternBase {\n /** @defaultValue undefined */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n override readonly validationRegex = input<RegExp>(undefined, { alias: 'pillsInputCsvItemRegex' });\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive, signal } from '@angular/core';\n\nimport { SiPillsInputPatternBase } from './si-pills-input-pattern-base';\nimport { SiPillsInputValueHandlerDirective } from './si-pills-input-value-handler';\n\n// From Angular Email Validator\nconst EMAIL_REGEX =\n /^(?=.{1,254}$)(?=.{1,64}@)[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/g;\n\n@Directive({\n selector: '[siPillsInputEmail]',\n providers: [\n {\n provide: SiPillsInputValueHandlerDirective,\n useExisting: SiPillsInputEmailDirective\n }\n ]\n})\nexport class SiPillsInputEmailDirective extends SiPillsInputPatternBase {\n /**\n * @defaultValue signal(EMAIL_REGEX).asReadonly()\n */\n override readonly validationRegex = signal(EMAIL_REGEX).asReadonly();\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiPillsInputCsvDirective } from './si-pills-input-csv.directive';\nimport { SiPillsInputEmailDirective } from './si-pills-input-email.directive';\nimport { SiPillsInputComponent } from './si-pills-input.component';\n\n@NgModule({\n imports: [SiPillsInputComponent, SiPillsInputCsvDirective, SiPillsInputEmailDirective],\n exports: [SiPillsInputComponent, SiPillsInputCsvDirective, SiPillsInputEmailDirective]\n})\nexport class SiPillsInputModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-pills-input.component';\nexport * from './si-pills-input.module';\nexport * from './si-pills-input-csv.directive';\nexport * from './si-pills-input-email.directive';\nexport * from './si-pills-input-value-handler';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,7 @@
1
1
  import { OverlayContainer, Overlay } from '@angular/cdk/overlay';
2
2
  import * as i0 from '@angular/core';
3
3
  import { inject, ElementRef, DOCUMENT, DestroyRef, Directive } from '@angular/core';
4
+ import { SI_THEME_DOM_TARGET, SiThemeService } from '@siemens/element-ng/theme';
4
5
 
5
6
  /**
6
7
  * Copyright (c) Siemens 2016 - 2026
@@ -36,10 +37,12 @@ class SiShadowRootDirective extends OverlayContainer {
36
37
  elementRef = inject(ElementRef);
37
38
  document = inject(DOCUMENT);
38
39
  destroyRef = inject(DestroyRef);
40
+ themeTarget = inject(SI_THEME_DOM_TARGET);
39
41
  // eslint-disable-next-line @typescript-eslint/naming-convention
40
42
  _createContainer() {
41
43
  const sourceShadow = this.elementRef.nativeElement.shadowRoot;
42
44
  const root = this.document.createElement('element-overlay-root');
45
+ const unregisterThemeTarget = this.themeTarget.registerElement?.(root);
43
46
  this.document.body.append(root);
44
47
  const shadow = root.attachShadow({ mode: 'open' });
45
48
  const shadowElement = this.document.createElement('div');
@@ -68,6 +71,7 @@ class SiShadowRootDirective extends OverlayContainer {
68
71
  observer.observe(sourceShadow, { childList: true });
69
72
  this.destroyRef.onDestroy(() => {
70
73
  observer.disconnect();
74
+ unregisterThemeTarget?.();
71
75
  root.remove();
72
76
  });
73
77
  this._containerElement = shadowElement;
@@ -83,6 +87,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
83
87
  }]
84
88
  }] });
85
89
 
90
+ /**
91
+ * Copyright (c) Siemens 2016 - 2026
92
+ * SPDX-License-Identifier: MIT
93
+ */
94
+ const createShadowRootThemeTarget = () => {
95
+ const element = inject(ElementRef).nativeElement;
96
+ const elements = new Set([element]);
97
+ const getShadowRoot = () => {
98
+ if (!element.shadowRoot) {
99
+ throw new Error('createShadowRootThemeTarget requires a component with Shadow DOM encapsulation.');
100
+ }
101
+ return element.shadowRoot;
102
+ };
103
+ return {
104
+ element,
105
+ rootSelector: ':host',
106
+ forEachElement: callback => elements.forEach(callback),
107
+ registerElement: registeredElement => {
108
+ elements.add(registeredElement);
109
+ registeredElement.classList.toggle('app--dark', element.classList.contains('app--dark'));
110
+ element.classList.forEach(className => {
111
+ if (className.startsWith('theme-')) {
112
+ registeredElement.classList.add(className);
113
+ }
114
+ });
115
+ registeredElement.style.colorScheme = element.style.colorScheme;
116
+ return () => elements.delete(registeredElement);
117
+ },
118
+ getStyleElement: id => getShadowRoot().getElementById(id),
119
+ appendStyleElement: style => getShadowRoot().append(style),
120
+ updateColorScheme: colorScheme => elements.forEach(themeElement => themeElement.style.setProperty('color-scheme', colorScheme))
121
+ };
122
+ };
123
+ /**
124
+ * Provides the shadow root specific theme service with a dedicated theme target
125
+ * for components using Shadow DOM encapsulation.
126
+ * Use this when the component defines and loads the Element theme in its own shadow root instead
127
+ * of reusing the theme defined on `:root`.
128
+ */
129
+ const provideShadowRootThemeTarget = () => {
130
+ return [
131
+ SiThemeService,
132
+ {
133
+ provide: SI_THEME_DOM_TARGET,
134
+ useFactory: createShadowRootThemeTarget
135
+ }
136
+ ];
137
+ };
138
+
86
139
  /**
87
140
  * Copyright (c) Siemens 2016 - 2026
88
141
  * SPDX-License-Identifier: MIT
@@ -92,5 +145,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
92
145
  * Generated bundle index. Do not edit.
93
146
  */
94
147
 
95
- export { SiShadowRootDirective };
148
+ export { SiShadowRootDirective, provideShadowRootThemeTarget };
96
149
  //# sourceMappingURL=siemens-element-ng-shadow-root.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-element-ng-shadow-root.mjs","sources":["../../../../projects/element-ng/shadow-root/si-shadow-root.directive.ts","../../../../projects/element-ng/shadow-root/index.ts","../../../../projects/element-ng/shadow-root/siemens-element-ng-shadow-root.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Overlay, OverlayContainer } from '@angular/cdk/overlay';\nimport { Directive, ElementRef, inject, DOCUMENT, DestroyRef } from '@angular/core';\n\n/**\n * This directive is intended to be used in applications that do NOT load element styles in the root HTML element.\n * So typically module federation, single SPA apps or apps that bootstrap element manually in a shadow root.\n *\n * This directive will ensure that overlays created within this shadow root will have the correct styles applied.\n * It does this by creating a new shadow root in the document body\n * and copying the styles from this shadow root to new one.\n *\n * With that approach, we can ensure that overlay can span the entire screen without being limited to the current shadow root.\n *\n * To use this directive, add it to the component / element which creates the shadow root which holds the element styles.\n *\n * @example\n * ```ts\n * @Component({\n * selector: 'app-root',\n * encapsulation: ViewEncapsulation.ShadowDom,\n * hostDirectives: [SiShadowRootDirective],\n * stylesUrls: ['element-styles.scss'],\n * template: `<si-element-component />`\n * })\n * export class AppComponent { }\n *\n * ```\n *\n */\n@Directive({\n selector: '[siShadowRoot]',\n providers: [{ provide: OverlayContainer, useExisting: SiShadowRootDirective }, Overlay]\n})\nexport class SiShadowRootDirective extends OverlayContainer {\n private elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n private document = inject(DOCUMENT);\n private destroyRef = inject(DestroyRef);\n\n // eslint-disable-next-line @typescript-eslint/naming-convention\n protected override _createContainer(): void {\n const sourceShadow = this.elementRef.nativeElement.shadowRoot!;\n const root = this.document.createElement('element-overlay-root');\n this.document.body.append(root);\n const shadow = root.attachShadow({ mode: 'open' });\n const shadowElement = this.document.createElement('div');\n shadowElement.classList.add('cdk-overlay-container');\n shadow.append(shadowElement);\n\n const styleCopies = new Map<CSSStyleSheet, Node>();\n const syncStyleElements = (): void => {\n const sourceStyleSheets = new Set(Array.from(sourceShadow.styleSheets));\n\n styleCopies.forEach((copy, source) => {\n if (!sourceStyleSheets.has(source)) {\n copy.parentNode?.removeChild(copy);\n styleCopies.delete(source);\n }\n });\n\n sourceStyleSheets.forEach(source => {\n let copy = styleCopies.get(source);\n if (!copy) {\n copy = source.ownerNode!.cloneNode(true);\n styleCopies.set(source, copy);\n }\n shadow.insertBefore(copy, shadowElement);\n });\n };\n\n syncStyleElements();\n const observer = new MutationObserver(syncStyleElements);\n observer.observe(sourceShadow, { childList: true });\n this.destroyRef.onDestroy(() => {\n observer.disconnect();\n root.remove();\n });\n\n this._containerElement = shadowElement;\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-shadow-root.directive';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-element-ng-shadow-root.mjs","sources":["../../../../projects/element-ng/shadow-root/si-shadow-root.directive.ts","../../../../projects/element-ng/shadow-root/si-shadow-root-theme-target.ts","../../../../projects/element-ng/shadow-root/index.ts","../../../../projects/element-ng/shadow-root/siemens-element-ng-shadow-root.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Overlay, OverlayContainer } from '@angular/cdk/overlay';\nimport { Directive, ElementRef, inject, DOCUMENT, DestroyRef } from '@angular/core';\nimport { SI_THEME_DOM_TARGET } from '@siemens/element-ng/theme';\n\n/**\n * This directive is intended to be used in applications that do NOT load element styles in the root HTML element.\n * So typically module federation, single SPA apps or apps that bootstrap element manually in a shadow root.\n *\n * This directive will ensure that overlays created within this shadow root will have the correct styles applied.\n * It does this by creating a new shadow root in the document body\n * and copying the styles from this shadow root to new one.\n *\n * With that approach, we can ensure that overlay can span the entire screen without being limited to the current shadow root.\n *\n * To use this directive, add it to the component / element which creates the shadow root which holds the element styles.\n *\n * @example\n * ```ts\n * @Component({\n * selector: 'app-root',\n * encapsulation: ViewEncapsulation.ShadowDom,\n * hostDirectives: [SiShadowRootDirective],\n * stylesUrls: ['element-styles.scss'],\n * template: `<si-element-component />`\n * })\n * export class AppComponent { }\n *\n * ```\n *\n */\n@Directive({\n selector: '[siShadowRoot]',\n providers: [{ provide: OverlayContainer, useExisting: SiShadowRootDirective }, Overlay]\n})\nexport class SiShadowRootDirective extends OverlayContainer {\n private elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n private document = inject(DOCUMENT);\n private destroyRef = inject(DestroyRef);\n private themeTarget = inject(SI_THEME_DOM_TARGET);\n\n // eslint-disable-next-line @typescript-eslint/naming-convention\n protected override _createContainer(): void {\n const sourceShadow = this.elementRef.nativeElement.shadowRoot!;\n const root = this.document.createElement('element-overlay-root');\n const unregisterThemeTarget = this.themeTarget.registerElement?.(root);\n this.document.body.append(root);\n const shadow = root.attachShadow({ mode: 'open' });\n const shadowElement = this.document.createElement('div');\n shadowElement.classList.add('cdk-overlay-container');\n shadow.append(shadowElement);\n\n const styleCopies = new Map<CSSStyleSheet, Node>();\n const syncStyleElements = (): void => {\n const sourceStyleSheets = new Set(Array.from(sourceShadow.styleSheets));\n\n styleCopies.forEach((copy, source) => {\n if (!sourceStyleSheets.has(source)) {\n copy.parentNode?.removeChild(copy);\n styleCopies.delete(source);\n }\n });\n\n sourceStyleSheets.forEach(source => {\n let copy = styleCopies.get(source);\n if (!copy) {\n copy = source.ownerNode!.cloneNode(true);\n styleCopies.set(source, copy);\n }\n shadow.insertBefore(copy, shadowElement);\n });\n };\n\n syncStyleElements();\n const observer = new MutationObserver(syncStyleElements);\n observer.observe(sourceShadow, { childList: true });\n this.destroyRef.onDestroy(() => {\n observer.disconnect();\n unregisterThemeTarget?.();\n root.remove();\n });\n\n this._containerElement = shadowElement;\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ElementRef, inject, Provider } from '@angular/core';\nimport { SI_THEME_DOM_TARGET, SiThemeDomTarget, SiThemeService } from '@siemens/element-ng/theme';\n\nconst createShadowRootThemeTarget = (): SiThemeDomTarget => {\n const element = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\n const elements = new Set([element]);\n const getShadowRoot = (): ShadowRoot => {\n if (!element.shadowRoot) {\n throw new Error(\n 'createShadowRootThemeTarget requires a component with Shadow DOM encapsulation.'\n );\n }\n return element.shadowRoot;\n };\n\n return {\n element,\n rootSelector: ':host',\n forEachElement: callback => elements.forEach(callback),\n registerElement: registeredElement => {\n elements.add(registeredElement);\n registeredElement.classList.toggle('app--dark', element.classList.contains('app--dark'));\n element.classList.forEach(className => {\n if (className.startsWith('theme-')) {\n registeredElement.classList.add(className);\n }\n });\n registeredElement.style.colorScheme = element.style.colorScheme;\n return () => elements.delete(registeredElement);\n },\n getStyleElement: id => getShadowRoot().getElementById(id) as HTMLStyleElement | null,\n appendStyleElement: style => getShadowRoot().append(style),\n updateColorScheme: colorScheme =>\n elements.forEach(themeElement => themeElement.style.setProperty('color-scheme', colorScheme))\n };\n};\n\n/**\n * Provides the shadow root specific theme service with a dedicated theme target\n * for components using Shadow DOM encapsulation.\n * Use this when the component defines and loads the Element theme in its own shadow root instead\n * of reusing the theme defined on `:root`.\n */\nexport const provideShadowRootThemeTarget = (): Provider => {\n return [\n SiThemeService,\n {\n provide: SI_THEME_DOM_TARGET,\n useFactory: createShadowRootThemeTarget\n }\n ];\n};\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-shadow-root.directive';\nexport * from './si-shadow-root-theme-target';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,9 +1,10 @@
1
- import { of, ReplaySubject, throwError } from 'rxjs';
2
- import { isPlatformBrowser } from '@angular/common';
1
+ import { of, ReplaySubject, throwError, fromEvent, map as map$1 } from 'rxjs';
3
2
  import * as i0 from '@angular/core';
4
- import { EventEmitter, signal, inject, PLATFORM_ID, DOCUMENT, Injectable } from '@angular/core';
3
+ import { InjectionToken, inject, DOCUMENT, EventEmitter, signal, PLATFORM_ID, Injectable } from '@angular/core';
5
4
  import { Meta } from '@angular/platform-browser';
5
+ import { isPlatformBrowser } from '@angular/common';
6
6
  import { take, tap, map, switchMap } from 'rxjs/operators';
7
+ import { toSignal } from '@angular/core/rxjs-interop';
7
8
 
8
9
  /**
9
10
  * Copyright (c) Siemens 2016 - 2026
@@ -108,6 +109,30 @@ class SiDefaultThemeStore extends SiThemeStore {
108
109
  }
109
110
  }
110
111
 
112
+ /**
113
+ * Copyright (c) Siemens 2016 - 2026
114
+ * SPDX-License-Identifier: MIT
115
+ */
116
+ /**
117
+ * Theme DOM target. The default implementation targets the current document.
118
+ */
119
+ const SI_THEME_DOM_TARGET = new InjectionToken('SI_THEME_DOM_TARGET', {
120
+ providedIn: 'root',
121
+ factory: () => {
122
+ const document = inject(DOCUMENT);
123
+ const meta = inject(Meta);
124
+ return {
125
+ element: document.documentElement,
126
+ rootSelector: ':root',
127
+ eventTarget: document.defaultView ?? undefined,
128
+ forEachElement: callback => callback(document.documentElement),
129
+ getStyleElement: id => document.getElementById(id),
130
+ appendStyleElement: style => document.body.append(style),
131
+ updateColorScheme: colorScheme => meta.updateTag({ name: 'color-scheme', content: colorScheme })
132
+ };
133
+ }
134
+ });
135
+
111
136
  const ELEMENT_THEME_NAME = 'element';
112
137
  const elementTheme = {
113
138
  name: 'element',
@@ -407,9 +432,12 @@ class SiThemeService {
407
432
  isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
408
433
  previewTheme;
409
434
  themeStore = inject(SiThemeStore, { optional: true }) ?? new SiDefaultThemeStore(this.isBrowser);
410
- meta = inject(Meta);
411
435
  document = inject(DOCUMENT);
436
+ themeTarget = inject(SI_THEME_DOM_TARGET);
412
437
  constructor() {
438
+ this._resolvedColorScheme = this.themeTarget.element.classList.contains('app--dark')
439
+ ? 'dark'
440
+ : 'light';
413
441
  this.resolvedColorScheme$.subscribe(scheme => (this._resolvedColorScheme = scheme));
414
442
  this.themeNames$.subscribe(names => (this._themeNames = names));
415
443
  if (this.isBrowser) {
@@ -583,7 +611,7 @@ class SiThemeService {
583
611
  return result;
584
612
  }
585
613
  /**
586
- * Apply `light` or `dark` theme to the document.
614
+ * Apply `light` or `dark` theme to the configured theme target.
587
615
  */
588
616
  applyThemeType(type) {
589
617
  if (type === this._resolvedColorScheme || !this.darkMediaQuery || !this.mediaQueryListener) {
@@ -602,7 +630,7 @@ class SiThemeService {
602
630
  }
603
631
  }
604
632
  /**
605
- * Applies the given theme to the document. If no theme is given, the active theme is applied.
633
+ * Applies the given theme to the configured theme target. If no theme is given, the active theme is applied.
606
634
  */
607
635
  applyTheme(theme, type, overwrite) {
608
636
  if (theme) {
@@ -626,7 +654,7 @@ class SiThemeService {
626
654
  }
627
655
  this.previewTheme.schemes[type][name] = value;
628
656
  this.createThemeCSS(this.previewTheme);
629
- this.document.documentElement.classList.add('theme-__preview');
657
+ this.themeTarget.forEachElement(element => element.classList.add('theme-__preview'));
630
658
  this.dispatchThemeSwitchEvent();
631
659
  }
632
660
  /**
@@ -665,34 +693,42 @@ class SiThemeService {
665
693
  this.themeChange.emit(theme);
666
694
  }
667
695
  activateTheme(theme) {
668
- const classList = this.document.documentElement.classList;
669
- classList.forEach(c => {
670
- if (c.startsWith('theme-')) {
671
- classList.remove(c);
696
+ this.themeTarget.forEachElement(element => {
697
+ const classList = element.classList;
698
+ classList.forEach(className => {
699
+ if (className.startsWith('theme-')) {
700
+ classList.remove(className);
701
+ }
702
+ });
703
+ if (theme) {
704
+ classList.add(`theme-${theme.name}`);
672
705
  }
673
706
  });
674
- if (theme) {
675
- classList.add(`theme-${theme.name}`);
676
- }
677
707
  }
678
708
  hasThemeCSS(theme) {
679
709
  const id = `__theme-${theme.name}`;
680
- return !!this.document.getElementById(id);
710
+ return !!this.themeTarget.getStyleElement(id);
681
711
  }
682
712
  createThemeCSS(theme) {
683
713
  let css = '';
684
- const themeSelector = `:root.theme-${theme.name}`;
714
+ const themeSelector = this.createThemeSelector(theme.name);
685
715
  if (theme.schemes.light) {
686
716
  css = this.createThemeVariantCSS(css, themeSelector, theme.schemes.light);
687
717
  }
688
718
  if (theme.schemes.dark) {
689
- css = this.createThemeVariantCSS(css, themeSelector + '.app--dark', theme.schemes.dark);
719
+ css = this.createThemeVariantCSS(css, this.createThemeSelector(theme.name, true), theme.schemes.dark);
690
720
  }
691
721
  this.removeThemeCSS(theme.name);
692
722
  const cssElement = this.document.createElement('style');
693
723
  cssElement.id = `__theme-${theme.name}`;
694
724
  cssElement.textContent = css;
695
- this.document.body.appendChild(cssElement);
725
+ this.themeTarget.appendStyleElement(cssElement);
726
+ }
727
+ createThemeSelector(name, dark = false) {
728
+ const classes = `.theme-${name}${dark ? '.app--dark' : ''}`;
729
+ return this.themeTarget.rootSelector === ':host'
730
+ ? `:host(${classes})`
731
+ : `${this.themeTarget.rootSelector}${classes}`;
696
732
  }
697
733
  createThemeVariantCSS(css, selector, scheme) {
698
734
  css += `${selector} {\n`;
@@ -704,16 +740,16 @@ class SiThemeService {
704
740
  }
705
741
  removeThemeCSS(name) {
706
742
  const id = `__theme-${name}`;
707
- this.document.getElementById(id)?.remove();
708
- this.document.documentElement.classList.remove(`theme-${name}`);
743
+ this.themeTarget.getStyleElement(id)?.remove();
744
+ this.themeTarget.forEachElement(element => element.classList.remove(`theme-${name}`));
709
745
  }
710
746
  toggleDark(dark) {
711
747
  if (!this.isBrowser) {
712
748
  return;
713
749
  }
714
- this.document.documentElement.classList.toggle('app--dark', dark);
750
+ this.themeTarget.forEachElement(element => element.classList.toggle('app--dark', dark));
715
751
  const colorScheme = dark ? 'dark' : 'light';
716
- this.meta.updateTag({ name: 'color-scheme', content: colorScheme });
752
+ this.themeTarget.updateColorScheme(colorScheme);
717
753
  this.resolvedColorSchemeSub.next(colorScheme);
718
754
  this.dispatchThemeSwitchEvent();
719
755
  }
@@ -743,6 +779,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
743
779
  args: [{ providedIn: 'root' }]
744
780
  }], ctorParameters: () => [] });
745
781
 
782
+ /**
783
+ * Copyright (c) Siemens 2016 - 2026
784
+ * SPDX-License-Identifier: MIT
785
+ */
786
+ /**
787
+ * Returns a signal that reflects whether the current Element theme is dark (`true`) or light
788
+ * (`false`). The signal reacts to `theme-switch` events dispatched on `window`.
789
+ *
790
+ * @experimental
791
+ * @returns A boolean signal — `true` when the active theme is dark
792
+ * @throws When called outside of an Angular injection context
793
+ */
794
+ const injectIsDarkTheme = () => {
795
+ if (!isPlatformBrowser(inject(PLATFORM_ID))) {
796
+ return signal(false);
797
+ }
798
+ const targetDom = inject(SI_THEME_DOM_TARGET);
799
+ return toSignal(fromEvent(window, 'theme-switch').pipe(map$1(e => e.detail.dark)), {
800
+ initialValue: targetDom.element.classList.contains('app--dark')
801
+ });
802
+ };
803
+
746
804
  /**
747
805
  * Copyright (c) Siemens 2016 - 2026
748
806
  * SPDX-License-Identifier: MIT
@@ -752,5 +810,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
752
810
  * Generated bundle index. Do not edit.
753
811
  */
754
812
 
755
- export { ELEMENT_THEME_NAME, SI_THEME_LOCAL_STORAGE_KEY, SiDefaultThemeStore, SiThemeService, SiThemeStore, elementTheme };
813
+ export { ELEMENT_THEME_NAME, SI_THEME_DOM_TARGET, SI_THEME_LOCAL_STORAGE_KEY, SiDefaultThemeStore, SiThemeService, SiThemeStore, elementTheme, injectIsDarkTheme };
756
814
  //# sourceMappingURL=siemens-element-ng-theme.mjs.map