@cute-widgets/base 20.0.1

package/fesm2022/cute-widgets-base-core-option.mjs

@@ -0,0 +1,373 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, booleanAttribute, Input, ChangeDetectionStrategy, ViewEncapsulation, Component, EventEmitter, ViewChild, Output, NgModule } from '@angular/core';
+import { ENTER, SPACE, hasModifierKey } from '@angular/cdk/keycodes';
+import { Subject } from 'rxjs';
+import { CuteFocusableControl } from '@cute-widgets/base/abstract';
+import { toTextBgCssClass } from '@cute-widgets/base/core/theming';
+import { CommonModule } from '@angular/common';
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * This code is a modification of the `@angular/material` original
+ * code licensed under MIT-style License (https://angular.dev/license).
+ */
+/**
+ * Injection token used to provide the parent component to options.
+ */
+const CUTE_OPTION_PARENT_COMPONENT = new InjectionToken('CUTE_OPTION_PARENT_COMPONENT');
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * This code is a modification of the `@angular/material` original
+ * code licensed under MIT-style License (https://angular.dev/license).
+ */
+// Notes on the accessibility pattern used for `cute-optgroup`.
+// The option group has two different "modes": regular and inert. The regular mode uses the
+// recommended a11y pattern which has `role="group"` on the group element with `aria-labelledby`
+// pointing to the label. This works for `cute-select`, but it seems to hit a bug for autocomplete
+// under VoiceOver where the group doesn't get read out at all. The bug appears to be that if
+// there's __any__ a11y-related attribute on the group (e.g. `role` or `aria-labelledby`),
+// VoiceOver on Safari won't read it out.
+// We've introduced the `inert` mode as a workaround. Under this mode, all a11y attributes are
+// removed from the group, and we get the screen reader to read out the group label by mirroring it
+// inside an invisible element in the option. This is suboptimal, because the screen reader will
+// repeat the group label on each navigation, whereas the default pattern only reads the group when
+// the user enters a new group. The following alternate approaches were considered:
+// 1. Reading out the group label using the `LiveAnnouncer` solves the problem, but we can't control
+//    when the text will be read out, so sometimes it comes in too late or never if the user
+//    navigates quickly.
+// 2. `<cute-option aria-describedby="groupLabel"` - This works on Safari, but VoiceOver in Chrome
+//    won't read out the description at all.
+// 3. `<cute-option aria-labelledby="optionLabel groupLabel"` - This works on Chrome, but Safari
+//     doesn't read out the text at all. Furthermore, on
+// Counter for unique group ids.
+let _uniqueOptgroupIdCounter = 0;
+/**
+ * Injection token that can be used to reference instances of `CuteOptgroup`. It serves as
+ * an alternative token to the actual `CuteOptgroup` class which could cause unnecessary
+ * retention of the class and its component metadata.
+ */
+const CUTE_OPTGROUP = new InjectionToken('CuteOptgroup');
+/**
+ * Component that is used to group instances of `mat-option`.
+ */
+class CuteOptgroup {
+    constructor() {
+        /** whether the option group is disabled. */
+        this.disabled = false;
+        /** Unique id for the underlying label. */
+        this._labelId = `cute-optgroup-label-${_uniqueOptgroupIdCounter++}`;
+        const parent = inject(CUTE_OPTION_PARENT_COMPONENT, { optional: true });
+        this._inert = parent?.inertGroups ?? false;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOptgroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.15", type: CuteOptgroup, isStandalone: true, selector: "cute-optgroup", inputs: { label: "label", disabled: ["disabled", "disabled", booleanAttribute] }, host: { properties: { "attr.role": "_inert ? null : \"group\"", "attr.aria-disabled": "_inert ? null : disabled", "attr.aria-labelledby": "_inert ? null : _labelId" }, classAttribute: "cute-optgroup" }, providers: [{ provide: CUTE_OPTGROUP, useExisting: CuteOptgroup }], exportAs: ["cuteOptgroup"], ngImport: i0, template: "<span\r\n  class=\"cute-optgroup-label\"\r\n  role=\"presentation\"\r\n  [class.disabled]=\"disabled\"\r\n  [id]=\"_labelId\">\r\n  <span class=\"cute-list-item__primary-text\">{{ label }} <ng-content></ng-content></span>\r\n</span>\r\n\r\n<ng-content select=\"cute-option, ng-container\"></ng-content>\r\n", styles: [".cute-optgroup .cute-optgroup-label{display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;outline:none}.cute-optgroup .cute-optgroup-label.disabled{opacity:.38}.cute-optgroup .cute-optgroup-label .cute-list-item__primary-text{font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;font-family:inherit;text-decoration:inherit;text-transform:inherit;white-space:normal;color:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOptgroup, decorators: [{
+            type: Component,
+            args: [{ selector: 'cute-optgroup', exportAs: 'cuteOptgroup', host: {
+                        'class': 'cute-optgroup',
+                        '[attr.role]': '_inert ? null : "group"',
+                        '[attr.aria-disabled]': '_inert ? null : disabled',
+                        '[attr.aria-labelledby]': '_inert ? null : _labelId',
+                    }, providers: [{ provide: CUTE_OPTGROUP, useExisting: CuteOptgroup }], standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\r\n  class=\"cute-optgroup-label\"\r\n  role=\"presentation\"\r\n  [class.disabled]=\"disabled\"\r\n  [id]=\"_labelId\">\r\n  <span class=\"cute-list-item__primary-text\">{{ label }} <ng-content></ng-content></span>\r\n</span>\r\n\r\n<ng-content select=\"cute-option, ng-container\"></ng-content>\r\n", styles: [".cute-optgroup .cute-optgroup-label{display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;outline:none}.cute-optgroup .cute-optgroup-label.disabled{opacity:.38}.cute-optgroup .cute-optgroup-label .cute-list-item__primary-text{font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;font-family:inherit;text-decoration:inherit;text-transform:inherit;white-space:normal;color:inherit}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { label: [{
+                type: Input
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }] } });
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * This code is a modification of the `@angular/material` original
+ * code licensed under MIT-style License (https://angular.dev/license).
+ */
+/**
+ * Option IDs need to be unique across components, so this counter exists outside
+ * the component definition.
+ */
+let _uniqueIdCounter = 0;
+/** Event object emitted by CuteOption when selected or deselected. */
+class CuteOptionSelectionChange {
+    constructor(
+    /** Reference to the option that emitted the event. */
+    source, 
+    /** Whether the change in the option's value was a result of a user action. */
+    isUserInput = false) {
+        this.source = source;
+        this.isUserInput = isUserInput;
+    }
+}
+/**
+ * Single option inside a `<cute-select>` element.
+ */
+class CuteOption extends CuteFocusableControl {
+    /** Whether the wrapping component is in multiple selection mode. */
+    get multiple() {
+        return this._parent && this._parent.multiple;
+    }
+    /** Whether the option is currently selected. */
+    get selected() {
+        return this._selected;
+    }
+    /** Whether ripples for the option are disabled. */
+    get disableRipple() {
+        return !!(this._parent && this._parent.disableRipple);
+    }
+    /** Whether to display checkmark for single-selection. */
+    get hideSingleSelectionIndicator() {
+        return !!(this._parent && this._parent.hideSingleSelectionIndicator);
+    }
+    getDisabledState() {
+        return (this.group && this.group.disabled) || super.getDisabledState();
+    }
+    generateId() {
+        return `cute-option-${_uniqueIdCounter++}`;
+        ;
+    }
+    constructor() {
+        super();
+        this._parent = inject(CUTE_OPTION_PARENT_COMPONENT, { optional: true });
+        this.group = inject(CUTE_OPTGROUP, { optional: true });
+        this._selected = false;
+        this._active = false;
+        this._mostRecentViewValue = '';
+        /** Event emitted when the option is selected or deselected. */
+        this.onSelectionChange = new EventEmitter();
+        /** Emits when the state of the option changes and any parents have to be notified. */
+        this._stateChanges = new Subject();
+        this.toTextBgCssClass = toTextBgCssClass;
+    }
+    /**
+     * Whether the option is currently active and ready to be selected.
+     * An active option displays styles, as if it is focused, but the
+     * focus is actually retained somewhere else. This comes in handy
+     * for components like autocomplete where focus must remain on the input.
+     */
+    get active() {
+        return this._active;
+    }
+    /**
+     * The displayed value of the option. It is necessary to show the selected option in the
+     * select's trigger.
+     */
+    get viewValue() {
+        // TODO(kara): Add input property alternative for node envs.
+        return (this._text?.nativeElement.textContent || '').trim();
+    }
+    /** Selects the option. */
+    select(emitEvent = true) {
+        if (!this._selected) {
+            this._selected = true;
+            this.markForCheck();
+            if (emitEvent) {
+                this._emitSelectionChangeEvent();
+            }
+        }
+    }
+    /** Deselects the option. */
+    deselect(emitEvent = true) {
+        if (this._selected) {
+            this._selected = false;
+            this.markForCheck();
+            if (emitEvent) {
+                this._emitSelectionChangeEvent();
+            }
+        }
+    }
+    /**
+     * This method sets display styles on the option to make it appear
+     * active. This is used by the ActiveDescendantKeyManager so key
+     * events will display the proper options as active on arrow key events.
+     */
+    setActiveStyles() {
+        if (!this._active) {
+            this._active = true;
+            this.markForCheck();
+        }
+    }
+    /**
+     * This method removes display styles on the option that made it appear
+     * active. This is used by the ActiveDescendantKeyManager so key
+     * events will display the proper options as active on arrow key events.
+     */
+    setInactiveStyles() {
+        if (this._active) {
+            this._active = false;
+            this.markForCheck();
+        }
+    }
+    /** Gets the label to be used when determining whether the option should be focused. */
+    getLabel() {
+        return this.viewValue;
+    }
+    /** Ensures the option is selected when activated from the keyboard. */
+    _handleKeydown(event) {
+        if ((event.keyCode === ENTER || event.keyCode === SPACE) && !hasModifierKey(event)) {
+            this._selectViaInteraction();
+            // Prevent the page from scrolling down and form submits.
+            event.preventDefault();
+        }
+    }
+    /**
+     * Selects the option while indicating the selection came from the user. Used to
+     * determine if the select's view -> model callback should be invoked.
+     * Used by `CuteSelect` component.
+     */
+    _selectViaInteraction() {
+        if (!this.disabled) {
+            this._selected = this.multiple ? !this._selected : true;
+            this.markForCheck();
+            this._emitSelectionChangeEvent(true);
+        }
+    }
+    /** Gets the host DOM element. */
+    _getHostElement() {
+        return this._elementRef.nativeElement;
+    }
+    ngAfterViewChecked() {
+        // Since parent components could be using the option's label to display the selected values
+        // (e.g. `mat-select`) and they don't have a way of knowing if the option's label has changed,
+        // we have to check for changes in the DOM ourselves and dispatch an event. These checks are
+        // relatively cheap, however; we still limit them only to selected options in order to avoid
+        // hitting the DOM too often.
+        if (this._selected) {
+            const viewValue = this.viewValue;
+            if (viewValue !== this._mostRecentViewValue) {
+                if (this._mostRecentViewValue) {
+                    this._stateChanges.next();
+                }
+                this._mostRecentViewValue = viewValue;
+            }
+        }
+    }
+    ngOnDestroy() {
+        super.ngOnDestroy();
+        this._stateChanges.complete();
+    }
+    /** Emits the selection change event. */
+    _emitSelectionChangeEvent(isUserInput = false) {
+        this.onSelectionChange.emit(new CuteOptionSelectionChange(this, isUserInput));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CuteOption, isStandalone: true, selector: "cute-option", inputs: { value: "value" }, outputs: { onSelectionChange: "onSelectionChange" }, host: { attributes: { "role": "option" }, listeners: { "click": "_selectViaInteraction()", "keydown": "_handleKeydown($event)" }, properties: { "class": "selected ? toTextBgCssClass(color??\"primary\") : undefined", "class.selected": "selected", "class.multiple": "multiple", "class.active": "active", "class.disabled": "disabled", "id": "id", "tabindex": "disabled ? -1 : 0", "attr.aria-selected": "selected", "attr.aria-disabled": "disabled" }, classAttribute: "cute-option " }, viewQueries: [{ propertyName: "_text", first: true, predicate: ["text"], descendants: true, static: true }], exportAs: ["cuteOption"], usesInheritance: true, ngImport: i0, template: "\r\n<ng-content select=\"cute-icon, i, img, [role=img]\"></ng-content>\r\n\r\n<span class=\"cute-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n", styles: [".cute-option{display:flex;gap:.25em;position:relative;align-items:center;justify-content:flex-start;-webkit-user-select:none;user-select:none;padding:var(--cute-option-padding-y, .25rem) 1rem;cursor:pointer;background-color:transparent}.cute-option .cute-list-item__primary-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cute-option:hover,.cute-option:active,.cute-option.active{outline:none;background-color:var(--bs-secondary-bg)}.cute-option.disabled{opacity:.5;cursor:auto}.cute-option.disabled:hover,.cute-option.disabled:focus{outline:none;background-color:#0000000f}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOption, decorators: [{
+            type: Component,
+            args: [{ selector: 'cute-option', exportAs: 'cuteOption', host: {
+                        'role': 'option',
+                        'class': 'cute-option ',
+                        //'[class]': 'selected ? "text-bg-"+(color ? color : "primary") : "" ',
+                        '[class]': 'selected ? toTextBgCssClass(color??"primary") : undefined',
+                        '[class.selected]': 'selected',
+                        '[class.multiple]': 'multiple',
+                        '[class.active]': 'active',
+                        '[class.disabled]': 'disabled',
+                        '[id]': 'id',
+                        '[tabindex]': 'disabled ? -1 : 0',
+                        // Set aria-selected to false for non-selected items and true for selected items. Conform to
+                        // [WAI ARIA Listbox authoring practices guide](
+                        //  https://www.w3.org/WAI/ARIA/apg/patterns/listbox/), "If any options are selected, each
+                        // selected option has either aria-selected or aria-checked  set to true. All options that are
+                        // selectable but not selected have either aria-selected or aria-checked set to false." Align
+                        // aria-selected implementation of Chips and List components.
+                        //
+                        // Set `aria-selected="false"` on not-selected listbox options to fix VoiceOver announcing
+                        // every option as "selected" (#21491).
+                        '[attr.aria-selected]': 'selected',
+                        '[attr.aria-disabled]': 'disabled',
+                        '(click)': '_selectViaInteraction()',
+                        '(keydown)': '_handleKeydown($event)',
+                    }, standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "\r\n<ng-content select=\"cute-icon, i, img, [role=img]\"></ng-content>\r\n\r\n<span class=\"cute-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n", styles: [".cute-option{display:flex;gap:.25em;position:relative;align-items:center;justify-content:flex-start;-webkit-user-select:none;user-select:none;padding:var(--cute-option-padding-y, .25rem) 1rem;cursor:pointer;background-color:transparent}.cute-option .cute-list-item__primary-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cute-option:hover,.cute-option:active,.cute-option.active{outline:none;background-color:var(--bs-secondary-bg)}.cute-option.disabled{opacity:.5;cursor:auto}.cute-option.disabled:hover,.cute-option.disabled:focus{outline:none;background-color:#0000000f}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{
+                type: Input
+            }], onSelectionChange: [{
+                type: Output
+            }], _text: [{
+                type: ViewChild,
+                args: ['text', { static: true }]
+            }] } });
+/**
+ * Counts the number of option group labels that precede the specified option.
+ * @param optionIndex Index of the option at which to start counting.
+ * @param options Flat list of all the options.
+ * @param optionGroups Flat list of all the option groups.
+ * @docs-private
+ */
+function _countGroupLabelsBeforeOption(optionIndex, options, optionGroups) {
+    if (optionGroups.length) {
+        let optionsArray = options.toArray();
+        let groups = optionGroups.toArray();
+        let groupCounter = 0;
+        for (let i = 0; i < optionIndex + 1; i++) {
+            if (optionsArray[i].group && optionsArray[i].group === groups[groupCounter]) {
+                groupCounter++;
+            }
+        }
+        return groupCounter;
+    }
+    return 0;
+}
+/**
+ * Determines the position to which to scroll a panel in order for an option to be into view.
+ * @param optionOffset Offset of the option from the top of the panel.
+ * @param optionHeight Height of the options.
+ * @param currentScrollPosition Current scroll position of the panel.
+ * @param panelHeight Height of the panel.
+ * @docs-private
+ */
+function _getOptionScrollPosition(optionOffset, optionHeight, currentScrollPosition, panelHeight) {
+    if (optionOffset < currentScrollPosition) {
+        return optionOffset;
+    }
+    if (optionOffset + optionHeight > currentScrollPosition + panelHeight) {
+        return Math.max(0, optionOffset - panelHeight + optionHeight);
+    }
+    return currentScrollPosition;
+}
+
+const TYPES = [
+    CuteOption,
+    CuteOptgroup,
+];
+class CuteOptionModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: CuteOptionModule, imports: [CommonModule, CuteOption,
+            CuteOptgroup], exports: [CuteOption,
+            CuteOptgroup] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOptionModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteOptionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, ...TYPES],
+                    exports: TYPES,
+                    declarations: [],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CUTE_OPTGROUP, CUTE_OPTION_PARENT_COMPONENT, CuteOptgroup, CuteOption, CuteOptionModule, CuteOptionSelectionChange, _countGroupLabelsBeforeOption, _getOptionScrollPosition };
+//# sourceMappingURL=cute-widgets-base-core-option.mjs.map

package/fesm2022/cute-widgets-base-core-option.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cute-widgets-base-core-option.mjs","sources":["../../../../projects/cute-widgets/base/core/option/src/option-parent.interface.ts","../../../../projects/cute-widgets/base/core/option/src/optgroup.component.ts","../../../../projects/cute-widgets/base/core/option/src/optgroup.component.html","../../../../projects/cute-widgets/base/core/option/src/option.component.ts","../../../../projects/cute-widgets/base/core/option/src/option.component.html","../../../../projects/cute-widgets/base/core/option/src/option.module.ts","../../../../projects/cute-widgets/base/core/option/cute-widgets-base-core-option.ts"],"sourcesContent":["/**\r\n * @license Apache-2.0\r\n *\r\n * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.\r\n *\r\n * You may not use this file except in compliance with the License\r\n * that can be found at http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * This code is a modification of the `@angular/material` original\r\n * code licensed under MIT-style License (https://angular.dev/license).\r\n */\r\nimport {InjectionToken, Signal} from '@angular/core';\r\n\r\n/**\r\n * Describes a parent component that manages a list of options.\r\n * Contains properties that the options can inherit.\r\n */\r\nexport interface CuteOptionParentComponent {\r\n  disableRipple?: boolean| Signal<boolean>;\r\n  multiple?: boolean;\r\n  inertGroups?: boolean;\r\n  hideSingleSelectionIndicator?: boolean;\r\n}\r\n\r\n/**\r\n * Injection token used to provide the parent component to options.\r\n */\r\nexport const CUTE_OPTION_PARENT_COMPONENT = new InjectionToken<CuteOptionParentComponent>(\r\n  'CUTE_OPTION_PARENT_COMPONENT',\r\n);\r\n","/**\r\n * @license Apache-2.0\r\n *\r\n * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.\r\n *\r\n * You may not use this file except in compliance with the License\r\n * that can be found at http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * This code is a modification of the `@angular/material` original\r\n * code licensed under MIT-style License (https://angular.dev/license).\r\n */\r\nimport {\r\n  Component,\r\n  ViewEncapsulation,\r\n  ChangeDetectionStrategy,\r\n  Input,\r\n  InjectionToken,\r\n  booleanAttribute, inject,\r\n} from '@angular/core';\r\nimport {CuteOptionParentComponent, CUTE_OPTION_PARENT_COMPONENT} from './option-parent.interface';\r\n\r\n// Notes on the accessibility pattern used for `cute-optgroup`.\r\n// The option group has two different \"modes\": regular and inert. The regular mode uses the\r\n// recommended a11y pattern which has `role=\"group\"` on the group element with `aria-labelledby`\r\n// pointing to the label. This works for `cute-select`, but it seems to hit a bug for autocomplete\r\n// under VoiceOver where the group doesn't get read out at all. The bug appears to be that if\r\n// there's __any__ a11y-related attribute on the group (e.g. `role` or `aria-labelledby`),\r\n// VoiceOver on Safari won't read it out.\r\n// We've introduced the `inert` mode as a workaround. Under this mode, all a11y attributes are\r\n// removed from the group, and we get the screen reader to read out the group label by mirroring it\r\n// inside an invisible element in the option. This is suboptimal, because the screen reader will\r\n// repeat the group label on each navigation, whereas the default pattern only reads the group when\r\n// the user enters a new group. The following alternate approaches were considered:\r\n// 1. Reading out the group label using the `LiveAnnouncer` solves the problem, but we can't control\r\n//    when the text will be read out, so sometimes it comes in too late or never if the user\r\n//    navigates quickly.\r\n// 2. `<cute-option aria-describedby=\"groupLabel\"` - This works on Safari, but VoiceOver in Chrome\r\n//    won't read out the description at all.\r\n// 3. `<cute-option aria-labelledby=\"optionLabel groupLabel\"` - This works on Chrome, but Safari\r\n//     doesn't read out the text at all. Furthermore, on\r\n\r\n// Counter for unique group ids.\r\nlet _uniqueOptgroupIdCounter = 0;\r\n\r\n/**\r\n * Injection token that can be used to reference instances of `CuteOptgroup`. It serves as\r\n * an alternative token to the actual `CuteOptgroup` class which could cause unnecessary\r\n * retention of the class and its component metadata.\r\n */\r\nexport const CUTE_OPTGROUP = new InjectionToken<CuteOptgroup>('CuteOptgroup');\r\n\r\n/**\r\n * Component that is used to group instances of `mat-option`.\r\n */\r\n@Component({\r\n  selector: 'cute-optgroup',\r\n  exportAs: 'cuteOptgroup',\r\n  templateUrl: './optgroup.component.html',\r\n  styleUrls: ['./optgroup.component.scss'],\r\n  host: {\r\n    'class': 'cute-optgroup',\r\n    '[attr.role]': '_inert ? null : \"group\"',\r\n    '[attr.aria-disabled]': '_inert ? null : disabled',\r\n    '[attr.aria-labelledby]': '_inert ? null : _labelId',\r\n  },\r\n  providers: [{provide: CUTE_OPTGROUP, useExisting: CuteOptgroup}],\r\n  standalone: true,\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class CuteOptgroup {\r\n  /** Label for the option group. */\r\n  @Input() label: string | undefined;\r\n\r\n  /** whether the option group is disabled. */\r\n  @Input({transform: booleanAttribute}) disabled: boolean = false;\r\n\r\n  /** Unique id for the underlying label. */\r\n  _labelId: string = `cute-optgroup-label-${_uniqueOptgroupIdCounter++}`;\r\n\r\n  /** Whether the group is in inert a11y mode. */\r\n  _inert: boolean;\r\n\r\n  constructor(...args: unknown[]);\r\n  constructor() {\r\n    const parent = inject<CuteOptionParentComponent>(CUTE_OPTION_PARENT_COMPONENT, {optional: true});\r\n    this._inert = parent?.inertGroups ?? false;\r\n  }\r\n}\r\n","<span\r\n  class=\"cute-optgroup-label\"\r\n  role=\"presentation\"\r\n  [class.disabled]=\"disabled\"\r\n  [id]=\"_labelId\">\r\n  <span class=\"cute-list-item__primary-text\">{{ label }} <ng-content></ng-content></span>\r\n</span>\r\n\r\n<ng-content select=\"cute-option, ng-container\"></ng-content>\r\n","/**\r\n * @license Apache-2.0\r\n *\r\n * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.\r\n *\r\n * You may not use this file except in compliance with the License\r\n * that can be found at http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * This code is a modification of the `@angular/material` original\r\n * code licensed under MIT-style License (https://angular.dev/license).\r\n */\r\nimport {ENTER, hasModifierKey, SPACE} from '@angular/cdk/keycodes';\r\nimport {\r\n  Component,\r\n  ViewEncapsulation,\r\n  ChangeDetectionStrategy,\r\n  ElementRef,\r\n  AfterViewChecked,\r\n  Input,\r\n  Output,\r\n  EventEmitter,\r\n  QueryList,\r\n  ViewChild,\r\n  inject,\r\n} from '@angular/core';\r\nimport {Subject} from 'rxjs';\r\nimport {CUTE_OPTGROUP, CuteOptgroup} from './optgroup.component';\r\nimport {CuteOptionParentComponent, CUTE_OPTION_PARENT_COMPONENT} from './option-parent.interface';\r\nimport {CuteFocusableControl} from \"@cute-widgets/base/abstract\";\r\nimport {Highlightable} from \"@angular/cdk/a11y\";\r\nimport {toTextBgCssClass} from \"@cute-widgets/base/core/theming\";\r\n\r\n\r\n/**\r\n * Option IDs need to be unique across components, so this counter exists outside\r\n * the component definition.\r\n */\r\nlet _uniqueIdCounter = 0;\r\n\r\n/** Event object emitted by CuteOption when selected or deselected. */\r\nexport class CuteOptionSelectionChange<T = any> {\r\n  constructor(\r\n    /** Reference to the option that emitted the event. */\r\n    public source: CuteOption<T>,\r\n    /** Whether the change in the option's value was a result of a user action. */\r\n    public isUserInput = false,\r\n  ) {}\r\n}\r\n\r\n/**\r\n * Single option inside a `<cute-select>` element.\r\n */\r\n@Component({\r\n  selector: 'cute-option',\r\n  templateUrl: './option.component.html',\r\n  styleUrls: ['./option.component.scss'],\r\n  exportAs: 'cuteOption',\r\n  host: {\r\n    'role': 'option',\r\n    'class': 'cute-option ',\r\n    //'[class]': 'selected ? \"text-bg-\"+(color ? color : \"primary\") : \"\" ',\r\n    '[class]': 'selected ? toTextBgCssClass(color??\"primary\") : undefined',\r\n    '[class.selected]': 'selected',\r\n    '[class.multiple]': 'multiple',\r\n    '[class.active]': 'active',\r\n    '[class.disabled]': 'disabled',\r\n    '[id]': 'id',\r\n    '[tabindex]': 'disabled ? -1 : 0',\r\n    // Set aria-selected to false for non-selected items and true for selected items. Conform to\r\n    // [WAI ARIA Listbox authoring practices guide](\r\n    //  https://www.w3.org/WAI/ARIA/apg/patterns/listbox/), \"If any options are selected, each\r\n    // selected option has either aria-selected or aria-checked  set to true. All options that are\r\n    // selectable but not selected have either aria-selected or aria-checked set to false.\" Align\r\n    // aria-selected implementation of Chips and List components.\r\n    //\r\n    // Set `aria-selected=\"false\"` on not-selected listbox options to fix VoiceOver announcing\r\n    // every option as \"selected\" (#21491).\r\n    '[attr.aria-selected]': 'selected',\r\n    '[attr.aria-disabled]': 'disabled',\r\n    '(click)': '_selectViaInteraction()',\r\n    '(keydown)': '_handleKeydown($event)',\r\n  },\r\n  standalone: true,\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class CuteOption<T = any> extends CuteFocusableControl implements Highlightable, AfterViewChecked {\r\n  private _parent = inject<CuteOptionParentComponent>(CUTE_OPTION_PARENT_COMPONENT, {optional: true});\r\n  public readonly group = inject<CuteOptgroup>(CUTE_OPTGROUP, {optional: true});\r\n\r\n  private _selected = false;\r\n  private _active = false;\r\n  private _mostRecentViewValue = '';\r\n\r\n  /** Whether the wrapping component is in multiple selection mode. */\r\n  get multiple() {\r\n    return this._parent && this._parent.multiple;\r\n  }\r\n\r\n  /** Whether the option is currently selected. */\r\n  get selected(): boolean {\r\n    return this._selected;\r\n  }\r\n\r\n  /** Whether ripples for the option are disabled. */\r\n  get disableRipple(): boolean {\r\n    return !!(this._parent && this._parent.disableRipple);\r\n  }\r\n\r\n  /** Whether to display checkmark for single-selection. */\r\n  get hideSingleSelectionIndicator(): boolean {\r\n    return !!(this._parent && this._parent.hideSingleSelectionIndicator);\r\n  }\r\n\r\n  protected override getDisabledState(): boolean {\r\n    return (this.group && this.group.disabled) || super.getDisabledState();\r\n  }\r\n\r\n  protected override generateId(): string {\r\n    return `cute-option-${_uniqueIdCounter++}`;;\r\n  }\r\n\r\n  /** The form value of the option. */\r\n  @Input() value: T | undefined;\r\n\r\n  /** Event emitted when the option is selected or deselected. */\r\n  @Output() readonly onSelectionChange = new EventEmitter<CuteOptionSelectionChange<T>>();\r\n\r\n  /** Element containing the option's text. */\r\n  @ViewChild('text', {static: true}) _text: ElementRef<HTMLElement> | undefined;\r\n\r\n  /** Emits when the state of the option changes and any parents have to be notified. */\r\n  readonly _stateChanges = new Subject<void>();\r\n\r\n  constructor(...args: unknown[]);\r\n  constructor() {\r\n    super();\r\n  }\r\n\r\n  /**\r\n   * Whether the option is currently active and ready to be selected.\r\n   * An active option displays styles, as if it is focused, but the\r\n   * focus is actually retained somewhere else. This comes in handy\r\n   * for components like autocomplete where focus must remain on the input.\r\n   */\r\n  get active(): boolean {\r\n    return this._active;\r\n  }\r\n\r\n  /**\r\n   * The displayed value of the option. It is necessary to show the selected option in the\r\n   * select's trigger.\r\n   */\r\n  get viewValue(): string {\r\n    // TODO(kara): Add input property alternative for node envs.\r\n    return (this._text?.nativeElement.textContent || '').trim();\r\n  }\r\n\r\n  /** Selects the option. */\r\n  select(emitEvent = true): void {\r\n    if (!this._selected) {\r\n      this._selected = true;\r\n      this.markForCheck();\r\n\r\n      if (emitEvent) {\r\n        this._emitSelectionChangeEvent();\r\n      }\r\n    }\r\n  }\r\n\r\n  /** Deselects the option. */\r\n  deselect(emitEvent = true): void {\r\n    if (this._selected) {\r\n      this._selected = false;\r\n      this.markForCheck();\r\n\r\n      if (emitEvent) {\r\n        this._emitSelectionChangeEvent();\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * This method sets display styles on the option to make it appear\r\n   * active. This is used by the ActiveDescendantKeyManager so key\r\n   * events will display the proper options as active on arrow key events.\r\n   */\r\n  setActiveStyles(): void {\r\n    if (!this._active) {\r\n      this._active = true;\r\n      this.markForCheck();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * This method removes display styles on the option that made it appear\r\n   * active. This is used by the ActiveDescendantKeyManager so key\r\n   * events will display the proper options as active on arrow key events.\r\n   */\r\n  setInactiveStyles(): void {\r\n    if (this._active) {\r\n      this._active = false;\r\n      this.markForCheck();\r\n    }\r\n  }\r\n\r\n  /** Gets the label to be used when determining whether the option should be focused. */\r\n  override getLabel(): string {\r\n    return this.viewValue;\r\n  }\r\n\r\n  /** Ensures the option is selected when activated from the keyboard. */\r\n  protected _handleKeydown(event: KeyboardEvent): void {\r\n    if ((event.keyCode === ENTER || event.keyCode === SPACE) && !hasModifierKey(event)) {\r\n      this._selectViaInteraction();\r\n\r\n      // Prevent the page from scrolling down and form submits.\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Selects the option while indicating the selection came from the user. Used to\r\n   * determine if the select's view -> model callback should be invoked.\r\n   * Used by `CuteSelect` component.\r\n   */\r\n  public _selectViaInteraction(): void {\r\n    if (!this.disabled) {\r\n      this._selected = this.multiple ? !this._selected : true;\r\n      this.markForCheck();\r\n      this._emitSelectionChangeEvent(true);\r\n    }\r\n  }\r\n\r\n  /** Gets the host DOM element. */\r\n  _getHostElement(): HTMLElement {\r\n    return this._elementRef.nativeElement;\r\n  }\r\n\r\n  ngAfterViewChecked() {\r\n    // Since parent components could be using the option's label to display the selected values\r\n    // (e.g. `mat-select`) and they don't have a way of knowing if the option's label has changed,\r\n    // we have to check for changes in the DOM ourselves and dispatch an event. These checks are\r\n    // relatively cheap, however; we still limit them only to selected options in order to avoid\r\n    // hitting the DOM too often.\r\n    if (this._selected) {\r\n      const viewValue = this.viewValue;\r\n\r\n      if (viewValue !== this._mostRecentViewValue) {\r\n        if (this._mostRecentViewValue) {\r\n          this._stateChanges.next();\r\n        }\r\n        this._mostRecentViewValue = viewValue;\r\n      }\r\n    }\r\n  }\r\n\r\n  override ngOnDestroy() {\r\n    super.ngOnDestroy();\r\n    this._stateChanges.complete();\r\n  }\r\n\r\n  /** Emits the selection change event. */\r\n  private _emitSelectionChangeEvent(isUserInput = false): void {\r\n    this.onSelectionChange.emit(new CuteOptionSelectionChange<T>(this, isUserInput));\r\n  }\r\n\r\n  protected readonly toTextBgCssClass = toTextBgCssClass;\r\n}\r\n\r\n/**\r\n * Counts the number of option group labels that precede the specified option.\r\n * @param optionIndex Index of the option at which to start counting.\r\n * @param options Flat list of all the options.\r\n * @param optionGroups Flat list of all the option groups.\r\n * @docs-private\r\n */\r\nexport function _countGroupLabelsBeforeOption(\r\n  optionIndex: number,\r\n  options: QueryList<CuteOption>,\r\n  optionGroups: QueryList<CuteOptgroup>,\r\n): number {\r\n  if (optionGroups.length) {\r\n    let optionsArray = options.toArray();\r\n    let groups = optionGroups.toArray();\r\n    let groupCounter = 0;\r\n\r\n    for (let i = 0; i < optionIndex + 1; i++) {\r\n      if (optionsArray[i].group && optionsArray[i].group === groups[groupCounter]) {\r\n        groupCounter++;\r\n      }\r\n    }\r\n\r\n    return groupCounter;\r\n  }\r\n\r\n  return 0;\r\n}\r\n\r\n/**\r\n * Determines the position to which to scroll a panel in order for an option to be into view.\r\n * @param optionOffset Offset of the option from the top of the panel.\r\n * @param optionHeight Height of the options.\r\n * @param currentScrollPosition Current scroll position of the panel.\r\n * @param panelHeight Height of the panel.\r\n * @docs-private\r\n */\r\nexport function _getOptionScrollPosition(\r\n  optionOffset: number,\r\n  optionHeight: number,\r\n  currentScrollPosition: number,\r\n  panelHeight: number,\r\n): number {\r\n  if (optionOffset < currentScrollPosition) {\r\n    return optionOffset;\r\n  }\r\n\r\n  if (optionOffset + optionHeight > currentScrollPosition + panelHeight) {\r\n    return Math.max(0, optionOffset - panelHeight + optionHeight);\r\n  }\r\n\r\n  return currentScrollPosition;\r\n}\r\n","\r\n<ng-content select=\"cute-icon, i, img, [role=img]\"></ng-content>\r\n\r\n<span class=\"cute-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n","import {NgModule, Type} from '@angular/core';\r\nimport {CommonModule} from '@angular/common';\r\nimport {CuteOption} from './option.component';\r\nimport {CuteOptgroup} from './optgroup.component';\r\n\r\nconst TYPES: (any | Type<any>)[] = [\r\n  CuteOption,\r\n  CuteOptgroup,\r\n];\r\n\r\n@NgModule({\r\n  imports: [CommonModule, ...TYPES],\r\n  exports: TYPES,\r\n  declarations: [],\r\n})\r\nexport class CuteOptionModule {\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/cute-widgets-base-core-pipes.mjs

@@ -0,0 +1,97 @@
+import * as i0 from '@angular/core';
+import { inject, Pipe, SecurityContext } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+/**
+ * Bypass security and trust the given value to be a safe resource.
+ * > WARNING: calling this method with untrusted user data exposes your application to XSS security risks!
+ * @example
+ * ```html
+ * <img [src]="item.source | safe:'url'" alt="Item image"/>
+ * ```
+ */
+class CuteSafePipe {
+    constructor() {
+        this.sanitizer = inject(DomSanitizer);
+    }
+    transform(value, type = "html") {
+        if (typeof value === "string") {
+            switch (type.toLowerCase()) {
+                case 'html': return this.sanitizer.bypassSecurityTrustHtml(value);
+                case 'style': return this.sanitizer.bypassSecurityTrustStyle(value);
+                case 'script': return this.sanitizer.bypassSecurityTrustScript(value);
+                case 'url': return this.sanitizer.bypassSecurityTrustUrl(value);
+                case 'resourceUrl': return this.sanitizer.bypassSecurityTrustResourceUrl(value);
+                default: throw new Error(`Invalid safe type specified: ${type}`);
+            }
+        }
+        return "";
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteSafePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: CuteSafePipe, isStandalone: true, name: "safe" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteSafePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'safe'
+                }]
+        }] });
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+/**
+ * Gets a safe value from either a known safe value or a value with unknown safety.
+ *
+ * @example
+ * ```html
+ * <div [innerHTML]="item.htmlContent | sanitize:'html'"></div>
+ * ```
+ */
+class CuteSanitizePipe {
+    constructor() {
+        this.sanitizer = inject(DomSanitizer);
+    }
+    transform(value, context = 'html') {
+        if (typeof value === "string") {
+            switch (context.toLowerCase()) {
+                case 'html': return this.sanitizer.sanitize(SecurityContext.HTML, value);
+                case 'style': return this.sanitizer.sanitize(SecurityContext.STYLE, value);
+                case 'script': return this.sanitizer.sanitize(SecurityContext.SCRIPT, value);
+                case 'url': return this.sanitizer.sanitize(SecurityContext.URL, value);
+                case 'resourceUrl': return this.sanitizer.sanitize(SecurityContext.RESOURCE_URL, value);
+                case 'none': return this.sanitizer.sanitize(SecurityContext.NONE, value);
+                default: throw new Error(`Invalid security context specified: ${context}`);
+            }
+        }
+        return "";
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteSanitizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: CuteSanitizePipe, isStandalone: true, name: "sanitize" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CuteSanitizePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'sanitize'
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CuteSafePipe, CuteSanitizePipe };
+//# sourceMappingURL=cute-widgets-base-core-pipes.mjs.map

package/fesm2022/cute-widgets-base-core-pipes.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cute-widgets-base-core-pipes.mjs","sources":["../../../../projects/cute-widgets/base/core/pipes/src/safe.pipe.ts","../../../../projects/cute-widgets/base/core/pipes/src/sanitize.pipe.ts","../../../../projects/cute-widgets/base/core/pipes/cute-widgets-base-core-pipes.ts"],"sourcesContent":["/**\r\n * @license Apache-2.0\r\n *\r\n * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.\r\n *\r\n * You may not use this file except in compliance with the License\r\n * that can be found at http://www.apache.org/licenses/LICENSE-2.0\r\n */\r\nimport {inject, Pipe, PipeTransform} from '@angular/core';\r\nimport { DomSanitizer, SafeValue } from \"@angular/platform-browser\";\r\n\r\n/**\r\n * Bypass security and trust the given value to be a safe resource.\r\n * > WARNING: calling this method with untrusted user data exposes your application to XSS security risks!\r\n * @example\r\n * ```html\r\n * <img [src]=\"item.source | safe:'url'\" alt=\"Item image\"/>\r\n * ```\r\n */\r\n@Pipe({\r\n  name: 'safe'\r\n})\r\nexport class CuteSafePipe implements PipeTransform {\r\n  protected sanitizer: DomSanitizer = inject(DomSanitizer);\r\n\r\n  transform(value: any, type: 'html'|'style'|'script'|'url'|'resourceUrl' = \"html\"): SafeValue {\r\n    if (typeof value===\"string\") {\r\n      switch (type.toLowerCase()) {\r\n        case 'html': return this.sanitizer.bypassSecurityTrustHtml(value);\r\n        case 'style': return this.sanitizer.bypassSecurityTrustStyle(value);\r\n        case 'script': return this.sanitizer.bypassSecurityTrustScript(value);\r\n        case 'url': return this.sanitizer.bypassSecurityTrustUrl(value);\r\n        case 'resourceUrl': return this.sanitizer.bypassSecurityTrustResourceUrl(value);\r\n        default: throw new Error(`Invalid safe type specified: ${type}`);\r\n      }\r\n    }\r\n    return \"\";\r\n  }\r\n}\r\n","/**\r\n * @license Apache-2.0\r\n *\r\n * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.\r\n *\r\n * You may not use this file except in compliance with the License\r\n * that can be found at http://www.apache.org/licenses/LICENSE-2.0\r\n */\r\nimport {inject, Pipe, PipeTransform, SecurityContext} from '@angular/core';\r\nimport {DomSanitizer, SafeValue} from \"@angular/platform-browser\";\r\n\r\n/**\r\n * Gets a safe value from either a known safe value or a value with unknown safety.\r\n *\r\n * @example\r\n * ```html\r\n * <div [innerHTML]=\"item.htmlContent | sanitize:'html'\"></div>\r\n * ```\r\n */\r\n@Pipe({\r\n  name: 'sanitize'\r\n})\r\nexport class CuteSanitizePipe implements PipeTransform {\r\n  protected sanitizer: DomSanitizer = inject(DomSanitizer);\r\n\r\n  transform(value: any, context: 'html'|'style'|'script'|'url'|'resourceUrl'|'none' = 'html'): SafeValue|null {\r\n    if (typeof value===\"string\") {\r\n      switch (context.toLowerCase()) {\r\n        case 'html': return this.sanitizer.sanitize(SecurityContext.HTML, value);\r\n        case 'style': return this.sanitizer.sanitize(SecurityContext.STYLE, value);\r\n        case 'script': return this.sanitizer.sanitize(SecurityContext.SCRIPT, value);\r\n        case 'url': return this.sanitizer.sanitize(SecurityContext.URL, value);\r\n        case 'resourceUrl': return this.sanitizer.sanitize(SecurityContext.RESOURCE_URL, value);\r\n        case 'none': return this.sanitizer.sanitize(SecurityContext.NONE, value);\r\n        default: throw new Error(`Invalid security context specified: ${context}`);\r\n      }\r\n    }\r\n    return \"\";\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;;;;AAOG;AAIH;;;;;;;AAOG;MAIU,YAAY,CAAA;AAHzB,IAAA,WAAA,GAAA;AAIY,QAAA,IAAA,CAAA,SAAS,GAAiB,MAAM,CAAC,YAAY,CAAC;AAezD,IAAA;AAbC,IAAA,SAAS,CAAC,KAAU,EAAE,IAAA,GAAoD,MAAM,EAAA;AAC9E,QAAA,IAAI,OAAO,KAAK,KAAG,QAAQ,EAAE;AAC3B,YAAA,QAAQ,IAAI,CAAC,WAAW,EAAE;AACxB,gBAAA,KAAK,MAAM,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,KAAK,CAAC;AACjE,gBAAA,KAAK,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,wBAAwB,CAAC,KAAK,CAAC;AACnE,gBAAA,KAAK,QAAQ,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,yBAAyB,CAAC,KAAK,CAAC;AACrE,gBAAA,KAAK,KAAK,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,sBAAsB,CAAC,KAAK,CAAC;AAC/D,gBAAA,KAAK,aAAa,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,8BAA8B,CAAC,KAAK,CAAC;gBAC/E,SAAS,MAAM,IAAI,KAAK,CAAC,CAAA,6BAAA,EAAgC,IAAI,CAAA,CAAE,CAAC;;QAEpE;AACA,QAAA,OAAO,EAAE;IACX;+GAfW,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA,CAAA;6GAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,CAAA;;4FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAHxB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE;AACP,iBAAA;;;ACrBD;;;;;;;AAOG;AAIH;;;;;;;AAOG;MAIU,gBAAgB,CAAA;AAH7B,IAAA,WAAA,GAAA;AAIY,QAAA,IAAA,CAAA,SAAS,GAAiB,MAAM,CAAC,YAAY,CAAC;AAgBzD,IAAA;AAdC,IAAA,SAAS,CAAC,KAAU,EAAE,OAAA,GAA8D,MAAM,EAAA;AACxF,QAAA,IAAI,OAAO,KAAK,KAAG,QAAQ,EAAE;AAC3B,YAAA,QAAQ,OAAO,CAAC,WAAW,EAAE;AAC3B,gBAAA,KAAK,MAAM,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC;AACxE,gBAAA,KAAK,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC;AAC1E,gBAAA,KAAK,QAAQ,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,MAAM,EAAE,KAAK,CAAC;AAC5E,gBAAA,KAAK,KAAK,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,GAAG,EAAE,KAAK,CAAC;AACtE,gBAAA,KAAK,aAAa,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC;AACvF,gBAAA,KAAK,MAAM,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC;gBACxE,SAAS,MAAM,IAAI,KAAK,CAAC,CAAA,oCAAA,EAAuC,OAAO,CAAA,CAAE,CAAC;;QAE9E;AACA,QAAA,OAAO,EAAE;IACX;+GAhBW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA,CAAA;6GAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,UAAA,EAAA,CAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAH5B,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE;AACP,iBAAA;;;ACrBD;;AAEG;;;;"}