@foblex/m-render 2.5.4 → 2.5.5

package/esm2022/lib/f-documentation/f-preview-group-filters/f-preview-group-filters.component.mjs

@@ -0,0 +1,53 @@
+import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';
+import { FDocumentationEnvironmentService } from '../f-documentation-environment.service';
+import { FCheckboxComponent, FRadioButtonComponent } from '../../common-components';
+import { TitleCasePipe } from '@angular/common';
+import { FPreviewGroupService } from '../f-preview-group/f-preview-group.service';
+import * as i0 from "@angular/core";
+export class FPreviewGroupFiltersComponent {
+    _allKey = 'all';
+    _fEnvironment = inject(FDocumentationEnvironmentService);
+    _fPreviewGroupService = inject(FPreviewGroupService);
+    filters = signal([]);
+    activeFilter = signal(this._allKey);
+    isSortByDateChecked = signal(false);
+    initialize() {
+        this.filters.set(this._calculateFiltersMap());
+    }
+    ngAfterViewInit() {
+        this.onFilterChange(this._allKey);
+    }
+    _calculateFiltersMap() {
+        const filters = [];
+        this._fEnvironment.getNavigation().forEach((group) => {
+            group.items.forEach((item) => {
+                if (item.badge && !filters.includes(item.badge.text.toLowerCase())) {
+                    filters.push(item.badge.text.toLowerCase());
+                }
+            });
+        });
+        if (filters.length > 0) {
+            filters.unshift(this._allKey);
+        }
+        return filters;
+    }
+    onFilterChange(key) {
+        this.activeFilter.set(key);
+        this._fPreviewGroupService.filterBy(key, this._allKey);
+    }
+    onSortByDateChange(event) {
+        this.isSortByDateChecked.set(event);
+        this._fPreviewGroupService.sortByDate(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FPreviewGroupFiltersComponent, isStandalone: true, selector: "div[f-preview-group-filters]", ngImport: i0, template: "@if (filters().length) {\n  <div class=\"filters-row\">\n    @for (filter of filters(); track filter) {\n      <f-radio-button [checked]=\"activeFilter() === filter\"\n                      (change)=\"onFilterChange(filter)\">{{ filter | titlecase }}\n      </f-radio-button>\n    }\n    <div class=\"flex-space\"></div>\n    <f-checkbox [checked]=\"isSortByDateChecked()\" (change)=\"onSortByDateChange($event)\">Sort by Newness</f-checkbox>\n  </div>\n}\n\n\n\n", styles: [".filters-row{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;width:100%;padding-top:20px;gap:8px}\n"], dependencies: [{ kind: "component", type: FCheckboxComponent, selector: "f-checkbox", inputs: ["id", "checked"], outputs: ["change"] }, { kind: "component", type: FRadioButtonComponent, selector: "f-radio-button", inputs: ["id", "checked"], outputs: ["change"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupFiltersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'div[f-preview-group-filters]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        FCheckboxComponent,
+                        FRadioButtonComponent,
+                        TitleCasePipe
+                    ], template: "@if (filters().length) {\n  <div class=\"filters-row\">\n    @for (filter of filters(); track filter) {\n      <f-radio-button [checked]=\"activeFilter() === filter\"\n                      (change)=\"onFilterChange(filter)\">{{ filter | titlecase }}\n      </f-radio-button>\n    }\n    <div class=\"flex-space\"></div>\n    <f-checkbox [checked]=\"isSortByDateChecked()\" (change)=\"onSortByDateChange($event)\">Sort by Newness</f-checkbox>\n  </div>\n}\n\n\n\n", styles: [".filters-row{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;width:100%;padding-top:20px;gap:8px}\n"] }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbS1yZW5kZXIvc3JjL2xpYi9mLWRvY3VtZW50YXRpb24vZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnMvZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbS1yZW5kZXIvc3JjL2xpYi9mLWRvY3VtZW50YXRpb24vZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnMvZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnMuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFpQix1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUUsZ0NBQWdDLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUMxRixPQUFPLEVBQUUsa0JBQWtCLEVBQUUscUJBQXFCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUNwRixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDaEQsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sNENBQTRDLENBQUM7O0FBY2xGLE1BQU0sT0FBTyw2QkFBNkI7SUFFdkIsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUV6QixhQUFhLEdBQUcsTUFBTSxDQUFDLGdDQUFnQyxDQUFDLENBQUM7SUFDekQscUJBQXFCLEdBQUcsTUFBTSxDQUFDLG9CQUFvQixDQUFDLENBQUM7SUFFbkQsT0FBTyxHQUFHLE1BQU0sQ0FBVyxFQUFFLENBQUMsQ0FBQztJQUMvQixZQUFZLEdBQUcsTUFBTSxDQUFTLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUU1QyxtQkFBbUIsR0FBRyxNQUFNLENBQVUsS0FBSyxDQUFDLENBQUM7SUFFaEQsVUFBVTtRQUNmLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxvQkFBb0IsRUFBRSxDQUFDLENBQUM7SUFDaEQsQ0FBQztJQUVNLGVBQWU7UUFDcEIsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDcEMsQ0FBQztJQUVPLG9CQUFvQjtRQUMxQixNQUFNLE9BQU8sR0FBYSxFQUFFLENBQUM7UUFDN0IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxhQUFhLEVBQUUsQ0FBQyxPQUFPLENBQUMsQ0FBQyxLQUFLLEVBQUUsRUFBRTtZQUNuRCxLQUFLLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFO2dCQUMzQixJQUFJLElBQUksQ0FBQyxLQUFLLElBQUksQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDLEVBQUUsQ0FBQztvQkFDbkUsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDO2dCQUM5QyxDQUFDO1lBQ0gsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDLENBQUMsQ0FBQztRQUNILElBQUksT0FBTyxDQUFDLE1BQU0sR0FBRyxDQUFDLEVBQUUsQ0FBQztZQUN2QixPQUFPLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUNoQyxDQUFDO1FBQ0QsT0FBTyxPQUFPLENBQUM7SUFDakIsQ0FBQztJQUVTLGNBQWMsQ0FBQyxHQUFXO1FBQ2xDLElBQUksQ0FBQyxZQUFZLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQzNCLElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxRQUFRLENBQUMsR0FBRyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN6RCxDQUFDO0lBRVMsa0JBQWtCLENBQUMsS0FBYztRQUN6QyxJQUFJLENBQUMsbUJBQW1CLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3BDLElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxVQUFVLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDL0MsQ0FBQzt3R0EzQ1UsNkJBQTZCOzRGQUE3Qiw2QkFBNkIsd0ZDbEIxQyxpZEFjQSx1TERESSxrQkFBa0IsdUdBQ2xCLHFCQUFxQixzR0FDckIsYUFBYTs7NEZBR0osNkJBQTZCO2tCQVp6QyxTQUFTOytCQUNFLDhCQUE4QixjQUc1QixJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0sV0FDdEM7d0JBQ1Asa0JBQWtCO3dCQUNsQixxQkFBcUI7d0JBQ3JCLGFBQWE7cUJBQ2QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlclZpZXdJbml0LCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbmplY3QsIHNpZ25hbCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRkRvY3VtZW50YXRpb25FbnZpcm9ubWVudFNlcnZpY2UgfSBmcm9tICcuLi9mLWRvY3VtZW50YXRpb24tZW52aXJvbm1lbnQuc2VydmljZSc7XG5pbXBvcnQgeyBGQ2hlY2tib3hDb21wb25lbnQsIEZSYWRpb0J1dHRvbkNvbXBvbmVudCB9IGZyb20gJy4uLy4uL2NvbW1vbi1jb21wb25lbnRzJztcbmltcG9ydCB7IFRpdGxlQ2FzZVBpcGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgRlByZXZpZXdHcm91cFNlcnZpY2UgfSBmcm9tICcuLi9mLXByZXZpZXctZ3JvdXAvZi1wcmV2aWV3LWdyb3VwLnNlcnZpY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdkaXZbZi1wcmV2aWV3LWdyb3VwLWZpbHRlcnNdJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2YtcHJldmlldy1ncm91cC1maWx0ZXJzLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbICcuL2YtcHJldmlldy1ncm91cC1maWx0ZXJzLmNvbXBvbmVudC5zY3NzJyBdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgaW1wb3J0czogW1xuICAgIEZDaGVja2JveENvbXBvbmVudCxcbiAgICBGUmFkaW9CdXR0b25Db21wb25lbnQsXG4gICAgVGl0bGVDYXNlUGlwZVxuICBdXG59KVxuZXhwb3J0IGNsYXNzIEZQcmV2aWV3R3JvdXBGaWx0ZXJzQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG5cbiAgcHJpdmF0ZSByZWFkb25seSBfYWxsS2V5ID0gJ2FsbCc7XG5cbiAgcHJpdmF0ZSBfZkVudmlyb25tZW50ID0gaW5qZWN0KEZEb2N1bWVudGF0aW9uRW52aXJvbm1lbnRTZXJ2aWNlKTtcbiAgcHJpdmF0ZSBfZlByZXZpZXdHcm91cFNlcnZpY2UgPSBpbmplY3QoRlByZXZpZXdHcm91cFNlcnZpY2UpO1xuXG4gIHByb3RlY3RlZCBmaWx0ZXJzID0gc2lnbmFsPHN0cmluZ1tdPihbXSk7XG4gIHByb3RlY3RlZCBhY3RpdmVGaWx0ZXIgPSBzaWduYWw8c3RyaW5nPih0aGlzLl9hbGxLZXkpO1xuXG4gIHByb3RlY3RlZCBpc1NvcnRCeURhdGVDaGVja2VkID0gc2lnbmFsPGJvb2xlYW4+KGZhbHNlKTtcblxuICBwdWJsaWMgaW5pdGlhbGl6ZSgpOiB2b2lkIHtcbiAgICB0aGlzLmZpbHRlcnMuc2V0KHRoaXMuX2NhbGN1bGF0ZUZpbHRlcnNNYXAoKSk7XG4gIH1cblxuICBwdWJsaWMgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIHRoaXMub25GaWx0ZXJDaGFuZ2UodGhpcy5fYWxsS2V5KTtcbiAgfVxuXG4gIHByaXZhdGUgX2NhbGN1bGF0ZUZpbHRlcnNNYXAoKTogc3RyaW5nW10ge1xuICAgIGNvbnN0IGZpbHRlcnM6IHN0cmluZ1tdID0gW107XG4gICAgdGhpcy5fZkVudmlyb25tZW50LmdldE5hdmlnYXRpb24oKS5mb3JFYWNoKChncm91cCkgPT4ge1xuICAgICAgZ3JvdXAuaXRlbXMuZm9yRWFjaCgoaXRlbSkgPT4ge1xuICAgICAgICBpZiAoaXRlbS5iYWRnZSAmJiAhZmlsdGVycy5pbmNsdWRlcyhpdGVtLmJhZGdlLnRleHQudG9Mb3dlckNhc2UoKSkpIHtcbiAgICAgICAgICBmaWx0ZXJzLnB1c2goaXRlbS5iYWRnZS50ZXh0LnRvTG93ZXJDYXNlKCkpO1xuICAgICAgICB9XG4gICAgICB9KTtcbiAgICB9KTtcbiAgICBpZiAoZmlsdGVycy5sZW5ndGggPiAwKSB7XG4gICAgICBmaWx0ZXJzLnVuc2hpZnQodGhpcy5fYWxsS2V5KTtcbiAgICB9XG4gICAgcmV0dXJuIGZpbHRlcnM7XG4gIH1cblxuICBwcm90ZWN0ZWQgb25GaWx0ZXJDaGFuZ2Uoa2V5OiBzdHJpbmcpOiB2b2lkIHtcbiAgICB0aGlzLmFjdGl2ZUZpbHRlci5zZXQoa2V5KTtcbiAgICB0aGlzLl9mUHJldmlld0dyb3VwU2VydmljZS5maWx0ZXJCeShrZXksIHRoaXMuX2FsbEtleSk7XG4gIH1cblxuICBwcm90ZWN0ZWQgb25Tb3J0QnlEYXRlQ2hhbmdlKGV2ZW50OiBib29sZWFuKTogdm9pZCB7XG4gICAgdGhpcy5pc1NvcnRCeURhdGVDaGVja2VkLnNldChldmVudCk7XG4gICAgdGhpcy5fZlByZXZpZXdHcm91cFNlcnZpY2Uuc29ydEJ5RGF0ZShldmVudCk7XG4gIH1cbn1cbiIsIkBpZiAoZmlsdGVycygpLmxlbmd0aCkge1xuICA8ZGl2IGNsYXNzPVwiZmlsdGVycy1yb3dcIj5cbiAgICBAZm9yIChmaWx0ZXIgb2YgZmlsdGVycygpOyB0cmFjayBmaWx0ZXIpIHtcbiAgICAgIDxmLXJhZGlvLWJ1dHRvbiBbY2hlY2tlZF09XCJhY3RpdmVGaWx0ZXIoKSA9PT0gZmlsdGVyXCJcbiAgICAgICAgICAgICAgICAgICAgICAoY2hhbmdlKT1cIm9uRmlsdGVyQ2hhbmdlKGZpbHRlcilcIj57eyBmaWx0ZXIgfCB0aXRsZWNhc2UgfX1cbiAgICAgIDwvZi1yYWRpby1idXR0b24+XG4gICAgfVxuICAgIDxkaXYgY2xhc3M9XCJmbGV4LXNwYWNlXCI+PC9kaXY+XG4gICAgPGYtY2hlY2tib3ggW2NoZWNrZWRdPVwiaXNTb3J0QnlEYXRlQ2hlY2tlZCgpXCIgKGNoYW5nZSk9XCJvblNvcnRCeURhdGVDaGFuZ2UoJGV2ZW50KVwiPlNvcnQgYnkgTmV3bmVzczwvZi1jaGVja2JveD5cbiAgPC9kaXY+XG59XG5cblxuXG4iXX0=

package/esm2022/lib/f-documentation/index.mjs

@@ -9,9 +9,12 @@ export * from './f-scrollable-container';
 export * from './f-social-links/f-social-links.component';
 export * from './f-version/f-version.component';
 export * from './f-preview/f-preview.component';
+export * from './f-preview/f-preview-base';
+export * from './f-preview-group/f-preview-group.service';
+export * from './f-preview-group-filters/f-preview-group-filters.component';
 export * from './f-documentation.component';
 export * from './f-documentation-environment.service';
 export * from './i-documentation-component';
 export * from './providers';
 export * from './router';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tLXJlbmRlci9zcmMvbGliL2YtZG9jdW1lbnRhdGlvbi9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLFVBQVUsQ0FBQztBQUV6QixjQUFjLFdBQVcsQ0FBQztBQUUxQixjQUFjLG1EQUFtRCxDQUFDO0FBRWxFLGNBQWMsK0JBQStCLENBQUM7QUFFOUMsY0FBYyx5Q0FBeUMsQ0FBQztBQUV4RCxjQUFjLHNCQUFzQixDQUFDO0FBRXJDLGNBQWMsVUFBVSxDQUFDO0FBRXpCLGNBQWMsMEJBQTBCLENBQUM7QUFFekMsY0FBYywyQ0FBMkMsQ0FBQztBQUUxRCxjQUFjLGlDQUFpQyxDQUFDO0FBRWhELGNBQWMsaUNBQWlDLENBQUM7QUFFaEQsY0FBYyw2QkFBNkIsQ0FBQztBQUU1QyxjQUFjLHVDQUF1QyxDQUFDO0FBRXRELGNBQWMsNkJBQTZCLENBQUM7QUFFNUMsY0FBYyxhQUFhLENBQUM7QUFFNUIsY0FBYyxVQUFVLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2RvbWFpbic7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1iYWRnZSc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1oYW1idXJnZXItYnV0dG9uL2YtaGFtYnVyZ2VyLWJ1dHRvbi5jb21wb25lbnQnO1xuXG5leHBvcnQgKiBmcm9tICcuL2YtaGVhZGVyL2YtaGVhZGVyLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1oZWFkZXItbWVudS9mLWhlYWRlci1tZW51LmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1uYXZpZ2F0aW9uLXBhbmVsJztcblxuZXhwb3J0ICogZnJvbSAnLi9mLXBhZ2UnO1xuXG5leHBvcnQgKiBmcm9tICcuL2Ytc2Nyb2xsYWJsZS1jb250YWluZXInO1xuXG5leHBvcnQgKiBmcm9tICcuL2Ytc29jaWFsLWxpbmtzL2Ytc29jaWFsLWxpbmtzLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi12ZXJzaW9uL2YtdmVyc2lvbi5jb21wb25lbnQnO1xuXG5leHBvcnQgKiBmcm9tICcuL2YtcHJldmlldy9mLXByZXZpZXcuY29tcG9uZW50JztcblxuZXhwb3J0ICogZnJvbSAnLi9mLWRvY3VtZW50YXRpb24uY29tcG9uZW50JztcblxuZXhwb3J0ICogZnJvbSAnLi9mLWRvY3VtZW50YXRpb24tZW52aXJvbm1lbnQuc2VydmljZSc7XG5cbmV4cG9ydCAqIGZyb20gJy4vaS1kb2N1bWVudGF0aW9uLWNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vcHJvdmlkZXJzJztcblxuZXhwb3J0ICogZnJvbSAnLi9yb3V0ZXInO1xuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tLXJlbmRlci9zcmMvbGliL2YtZG9jdW1lbnRhdGlvbi9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLFVBQVUsQ0FBQztBQUV6QixjQUFjLFdBQVcsQ0FBQztBQUUxQixjQUFjLG1EQUFtRCxDQUFDO0FBRWxFLGNBQWMsK0JBQStCLENBQUM7QUFFOUMsY0FBYyx5Q0FBeUMsQ0FBQztBQUV4RCxjQUFjLHNCQUFzQixDQUFDO0FBRXJDLGNBQWMsVUFBVSxDQUFDO0FBRXpCLGNBQWMsMEJBQTBCLENBQUM7QUFFekMsY0FBYywyQ0FBMkMsQ0FBQztBQUUxRCxjQUFjLGlDQUFpQyxDQUFDO0FBRWhELGNBQWMsaUNBQWlDLENBQUM7QUFDaEQsY0FBYyw0QkFBNEIsQ0FBQztBQUUzQyxjQUFjLDJDQUEyQyxDQUFDO0FBRTFELGNBQWMsNkRBQTZELENBQUM7QUFFNUUsY0FBYyw2QkFBNkIsQ0FBQztBQUU1QyxjQUFjLHVDQUF1QyxDQUFDO0FBRXRELGNBQWMsNkJBQTZCLENBQUM7QUFFNUMsY0FBYyxhQUFhLENBQUM7QUFFNUIsY0FBYyxVQUFVLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2RvbWFpbic7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1iYWRnZSc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1oYW1idXJnZXItYnV0dG9uL2YtaGFtYnVyZ2VyLWJ1dHRvbi5jb21wb25lbnQnO1xuXG5leHBvcnQgKiBmcm9tICcuL2YtaGVhZGVyL2YtaGVhZGVyLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1oZWFkZXItbWVudS9mLWhlYWRlci1tZW51LmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1uYXZpZ2F0aW9uLXBhbmVsJztcblxuZXhwb3J0ICogZnJvbSAnLi9mLXBhZ2UnO1xuXG5leHBvcnQgKiBmcm9tICcuL2Ytc2Nyb2xsYWJsZS1jb250YWluZXInO1xuXG5leHBvcnQgKiBmcm9tICcuL2Ytc29jaWFsLWxpbmtzL2Ytc29jaWFsLWxpbmtzLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi12ZXJzaW9uL2YtdmVyc2lvbi5jb21wb25lbnQnO1xuXG5leHBvcnQgKiBmcm9tICcuL2YtcHJldmlldy9mLXByZXZpZXcuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vZi1wcmV2aWV3L2YtcHJldmlldy1iYXNlJztcblxuZXhwb3J0ICogZnJvbSAnLi9mLXByZXZpZXctZ3JvdXAvZi1wcmV2aWV3LWdyb3VwLnNlcnZpY2UnO1xuXG5leHBvcnQgKiBmcm9tICcuL2YtcHJldmlldy1ncm91cC1maWx0ZXJzL2YtcHJldmlldy1ncm91cC1maWx0ZXJzLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1kb2N1bWVudGF0aW9uLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZi1kb2N1bWVudGF0aW9uLWVudmlyb25tZW50LnNlcnZpY2UnO1xuXG5leHBvcnQgKiBmcm9tICcuL2ktZG9jdW1lbnRhdGlvbi1jb21wb25lbnQnO1xuXG5leHBvcnQgKiBmcm9tICcuL3Byb3ZpZGVycyc7XG5cbmV4cG9ydCAqIGZyb20gJy4vcm91dGVyJztcbiJdfQ==

package/esm2022/lib/f-home-page/f-home-page.component.mjs

@@ -4,7 +4,6 @@ import { FHomePageHeaderComponent } from './f-home-page-header/f-home-page-heade
 import { FHomePageFeaturesComponent } from './f-home-page-features/f-home-page-features.component';
 import { FHomePageHeroComponent } from './f-home-page-hero/f-home-page-hero.component';
 import { FHomePageEnvironmentService } from './f-home-page-environment.service';
-import { INTERNAL_ENVIRONMENT_SERVICE } from '../domain';
 import * as i0 from "@angular/core";
 export const F_HOME_PAGE_COMPONENT = new InjectionToken('F_HOME_PAGE_COMPONENT');
 export class FHomePageComponent {
@@ -37,7 +36,6 @@ export class FHomePageComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FHomePageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FHomePageComponent, isStandalone: true, selector: "f-home-page", providers: [
             FHomePageEnvironmentService,
-            { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FHomePageEnvironmentService },
             { provide: F_HOME_PAGE_COMPONENT, useExisting: FHomePageComponent }
         ], viewQueries: [{ propertyName: "_backgroundContainer", first: true, predicate: ["backgroundContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "_heroImageContainer", first: true, predicate: ["heroImageContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container #backgroundContainer></ng-container>\n<header f-home-page-header></header>\n\n<div class=\"body\">\n  <div class=\"hero-row\">\n    <f-home-page-hero></f-home-page-hero>\n    <ng-container #heroImageContainer></ng-container>\n  </div>\n  <f-home-page-features></f-home-page-features>\n</div>\n\n<div class=\"flex-space\"></div>\n<footer f-home-page-footer></footer>\n", styles: [":host{display:flex;flex-direction:column;position:relative;width:100%;height:100%;min-height:100%;overflow:hidden;overflow-y:auto}.body{position:relative;z-index:3;pointer-events:none}@media (min-width: 960px){.body{margin-top:50px}}@media (min-width: 1376px){.body{margin-top:100px}}.hero-row{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:center;margin:0 auto}@media (min-width: 960px){.hero-row{flex-direction:row;margin-left:64px;margin-right:64px}}@media (min-width: 1376px){.hero-row{flex-direction:row;margin-left:calc(50% - 624px);margin-right:calc(50% - 624px)}}\n"], dependencies: [{ kind: "component", type: FHomePageFooterComponent, selector: "footer[f-home-page-footer]" }, { kind: "component", type: FHomePageHeaderComponent, selector: "header[f-home-page-header]" }, { kind: "component", type: FHomePageFeaturesComponent, selector: "f-home-page-features" }, { kind: "component", type: FHomePageHeroComponent, selector: "f-home-page-hero" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
@@ -45,7 +43,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Component,
             args: [{ selector: 'f-home-page', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         FHomePageEnvironmentService,
-                        { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FHomePageEnvironmentService },
                         { provide: F_HOME_PAGE_COMPONENT, useExisting: FHomePageComponent }
                     ], imports: [
                         FHomePageFooterComponent,
@@ -60,4 +57,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: ViewChild,
                 args: ['heroImageContainer', { read: ViewContainerRef }]
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZi1ob21lLXBhZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbS1yZW5kZXIvc3JjL2xpYi9mLWhvbWUtcGFnZS9mLWhvbWUtcGFnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tLXJlbmRlci9zcmMvbGliL2YtaG9tZS1wYWdlL2YtaG9tZS1wYWdlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFFTCx1QkFBdUIsRUFBRSxTQUFTLEVBQWdCLE1BQU0sRUFBRSxjQUFjLEVBQVEsU0FBUyxFQUFFLGdCQUFnQixFQUM1RyxNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxtREFBbUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxtREFBbUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsMEJBQTBCLEVBQUUsTUFBTSx1REFBdUQsQ0FBQztBQUNuRyxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUN2RixPQUFPLEVBQUUsMkJBQTJCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUNoRixPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSxXQUFXLENBQUM7O0FBRXpELE1BQU0sQ0FBQyxNQUFNLHFCQUFxQixHQUFHLElBQUksY0FBYyxDQUFxQix1QkFBdUIsQ0FBQyxDQUFDO0FBb0JyRyxNQUFNLE9BQU8sa0JBQWtCO0lBRW5CLG1CQUFtQixHQUFHLE1BQU0sQ0FBQywyQkFBMkIsQ0FBQyxDQUFDO0lBRzVELG9CQUFvQixDQUErQjtJQUduRCxtQkFBbUIsQ0FBK0I7SUFFbkQsZUFBZTtRQUNwQixJQUFJLENBQUMscUJBQXFCLENBQUMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLGlCQUFpQixFQUFFLENBQUMsQ0FBQztRQUN6RSxJQUFJLENBQUMsMEJBQTBCLENBQUMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLHNCQUFzQixFQUFFLENBQUMsQ0FBQztJQUNyRixDQUFDO0lBRU8scUJBQXFCLENBQUksU0FBbUI7UUFDbEQsSUFBSSxTQUFTLEVBQUUsQ0FBQztZQUNkLElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsMkJBQTJCLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQztRQUMzRSxDQUFDO0lBQ0gsQ0FBQztJQUVPLDBCQUEwQixDQUFJLFNBQW1CO1FBQ3ZELElBQUksU0FBUyxFQUFFLENBQUM7WUFDZCxJQUFJLENBQUMsc0JBQXNCLENBQUMsSUFBSSxDQUFDLGdDQUFnQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUM7UUFDaEYsQ0FBQztJQUNILENBQUM7SUFFTyxnQ0FBZ0MsQ0FBSSxTQUFrQjtRQUM1RCxPQUFPLElBQUksQ0FBQyxvQkFBcUIsQ0FBQyxlQUFlLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDL0QsQ0FBQztJQUVPLDJCQUEyQixDQUFJLFNBQWtCO1FBQ3ZELE9BQU8sSUFBSSxDQUFDLG1CQUFvQixDQUFDLGVBQWUsQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUM5RCxDQUFDO0lBRU8sc0JBQXNCLENBQUMsWUFBK0I7UUFDNUQsWUFBWSxDQUFDLGlCQUFpQixDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ2hELENBQUM7d0dBckNVLGtCQUFrQjs0RkFBbEIsa0JBQWtCLDBEQVpsQjtZQUNULDJCQUEyQjtZQUMzQixFQUFFLE9BQU8sRUFBRSw0QkFBNEIsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbkYsRUFBRSxPQUFPLEVBQUUscUJBQXFCLEVBQUUsV0FBVyxFQUFFLGtCQUFrQixFQUFFO1NBQ3BFLGtJQVl5QyxnQkFBZ0Isb0hBR2pCLGdCQUFnQiw2QkN0QzNELCtYQWFBLDZwQkRZSSx3QkFBd0IsdUVBQ3hCLHdCQUF3Qix1RUFDeEIsMEJBQTBCLGlFQUMxQixzQkFBc0I7OzRGQUdiLGtCQUFrQjtrQkFsQjlCLFNBQVM7K0JBQ0UsYUFBYSxjQUdYLElBQUksbUJBQ0MsdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVCwyQkFBMkI7d0JBQzNCLEVBQUUsT0FBTyxFQUFFLDRCQUE0QixFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTt3QkFDbkYsRUFBRSxPQUFPLEVBQUUscUJBQXFCLEVBQUUsV0FBVyxvQkFBb0IsRUFBRTtxQkFDcEUsV0FDUTt3QkFDUCx3QkFBd0I7d0JBQ3hCLHdCQUF3Qjt3QkFDeEIsMEJBQTBCO3dCQUMxQixzQkFBc0I7cUJBQ3ZCOzhCQU9PLG9CQUFvQjtzQkFEM0IsU0FBUzt1QkFBQyxxQkFBcUIsRUFBRSxFQUFFLElBQUksRUFBRSxnQkFBZ0IsRUFBRTtnQkFJcEQsbUJBQW1CO3NCQUQxQixTQUFTO3VCQUFDLG9CQUFvQixFQUFFLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgQ29tcG9uZW50UmVmLCBpbmplY3QsIEluamVjdGlvblRva2VuLCBUeXBlLCBWaWV3Q2hpbGQsIFZpZXdDb250YWluZXJSZWZcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGSG9tZVBhZ2VGb290ZXJDb21wb25lbnQgfSBmcm9tICcuL2YtaG9tZS1wYWdlLWZvb3Rlci9mLWhvbWUtcGFnZS1mb290ZXIuY29tcG9uZW50JztcbmltcG9ydCB7IEZIb21lUGFnZUhlYWRlckNvbXBvbmVudCB9IGZyb20gJy4vZi1ob21lLXBhZ2UtaGVhZGVyL2YtaG9tZS1wYWdlLWhlYWRlci5jb21wb25lbnQnO1xuaW1wb3J0IHsgRkhvbWVQYWdlRmVhdHVyZXNDb21wb25lbnQgfSBmcm9tICcuL2YtaG9tZS1wYWdlLWZlYXR1cmVzL2YtaG9tZS1wYWdlLWZlYXR1cmVzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBGSG9tZVBhZ2VIZXJvQ29tcG9uZW50IH0gZnJvbSAnLi9mLWhvbWUtcGFnZS1oZXJvL2YtaG9tZS1wYWdlLWhlcm8uY29tcG9uZW50JztcbmltcG9ydCB7IEZIb21lUGFnZUVudmlyb25tZW50U2VydmljZSB9IGZyb20gJy4vZi1ob21lLXBhZ2UtZW52aXJvbm1lbnQuc2VydmljZSc7XG5pbXBvcnQgeyBJTlRFUk5BTF9FTlZJUk9OTUVOVF9TRVJWSUNFIH0gZnJvbSAnLi4vZG9tYWluJztcblxuZXhwb3J0IGNvbnN0IEZfSE9NRV9QQUdFX0NPTVBPTkVOVCA9IG5ldyBJbmplY3Rpb25Ub2tlbjxGSG9tZVBhZ2VDb21wb25lbnQ+KCdGX0hPTUVfUEFHRV9DT01QT05FTlQnKTtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZi1ob21lLXBhZ2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vZi1ob21lLXBhZ2UuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsgJy4vZi1ob21lLXBhZ2UuY29tcG9uZW50LnNjc3MnIF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFtcbiAgICBGSG9tZVBhZ2VFbnZpcm9ubWVudFNlcnZpY2UsXG4gICAgeyBwcm92aWRlOiBJTlRFUk5BTF9FTlZJUk9OTUVOVF9TRVJWSUNFLCB1c2VFeGlzdGluZzogRkhvbWVQYWdlRW52aXJvbm1lbnRTZXJ2aWNlIH0sXG4gICAgeyBwcm92aWRlOiBGX0hPTUVfUEFHRV9DT01QT05FTlQsIHVzZUV4aXN0aW5nOiBGSG9tZVBhZ2VDb21wb25lbnQgfVxuICBdLFxuICBpbXBvcnRzOiBbXG4gICAgRkhvbWVQYWdlRm9vdGVyQ29tcG9uZW50LFxuICAgIEZIb21lUGFnZUhlYWRlckNvbXBvbmVudCxcbiAgICBGSG9tZVBhZ2VGZWF0dXJlc0NvbXBvbmVudCxcbiAgICBGSG9tZVBhZ2VIZXJvQ29tcG9uZW50LFxuICBdXG59KVxuZXhwb3J0IGNsYXNzIEZIb21lUGFnZUNvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuXG4gIHByb3RlY3RlZCBfZW52aXJvbm1lbnRTZXJ2aWNlID0gaW5qZWN0KEZIb21lUGFnZUVudmlyb25tZW50U2VydmljZSk7XG5cbiAgQFZpZXdDaGlsZCgnYmFja2dyb3VuZENvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiB9KVxuICBwcml2YXRlIF9iYWNrZ3JvdW5kQ29udGFpbmVyOiBWaWV3Q29udGFpbmVyUmVmIHwgdW5kZWZpbmVkO1xuXG4gIEBWaWV3Q2hpbGQoJ2hlcm9JbWFnZUNvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiB9KVxuICBwcml2YXRlIF9oZXJvSW1hZ2VDb250YWluZXI6IFZpZXdDb250YWluZXJSZWYgfCB1bmRlZmluZWQ7XG5cbiAgcHVibGljIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLl9yZW5kZXJJbWFnZUNvbXBvbmVudCh0aGlzLl9lbnZpcm9ubWVudFNlcnZpY2UuZ2V0SW1hZ2VDb21wb25lbnQoKSk7XG4gICAgdGhpcy5fcmVuZGVyQmFja2dyb3VuZENvbXBvbmVudCh0aGlzLl9lbnZpcm9ubWVudFNlcnZpY2UuZ2V0QmFja2dyb3VuZENvbXBvbmVudCgpKTtcbiAgfVxuXG4gIHByaXZhdGUgX3JlbmRlckltYWdlQ29tcG9uZW50PFQ+KGNvbXBvbmVudD86IFR5cGU8VD4pOiB2b2lkIHtcbiAgICBpZiAoY29tcG9uZW50KSB7XG4gICAgICB0aGlzLnJlcXVlc3RDb21wb25lbnRSZWRyYXcodGhpcy5fZ2V0SW1hZ2VDb21wb25lbnRSZWZlcmVuY2UoY29tcG9uZW50KSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfcmVuZGVyQmFja2dyb3VuZENvbXBvbmVudDxUPihjb21wb25lbnQ/OiBUeXBlPFQ+KTogdm9pZCB7XG4gICAgaWYgKGNvbXBvbmVudCkge1xuICAgICAgdGhpcy5yZXF1ZXN0Q29tcG9uZW50UmVkcmF3KHRoaXMuX2dldEJhY2tncm91bmRDb21wb25lbnRSZWZlcmVuY2UoY29tcG9uZW50KSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfZ2V0QmFja2dyb3VuZENvbXBvbmVudFJlZmVyZW5jZTxUPihjb21wb25lbnQ6IFR5cGU8VD4pOiBDb21wb25lbnRSZWY8VD4ge1xuICAgIHJldHVybiB0aGlzLl9iYWNrZ3JvdW5kQ29udGFpbmVyIS5jcmVhdGVDb21wb25lbnQoY29tcG9uZW50KTtcbiAgfVxuXG4gIHByaXZhdGUgX2dldEltYWdlQ29tcG9uZW50UmVmZXJlbmNlPFQ+KGNvbXBvbmVudDogVHlwZTxUPik6IENvbXBvbmVudFJlZjxUPiB7XG4gICAgcmV0dXJuIHRoaXMuX2hlcm9JbWFnZUNvbnRhaW5lciEuY3JlYXRlQ29tcG9uZW50KGNvbXBvbmVudCk7XG4gIH1cblxuICBwcml2YXRlIHJlcXVlc3RDb21wb25lbnRSZWRyYXcoY29tcG9uZW50UmVmOiBDb21wb25lbnRSZWY8YW55Pik6IHZvaWQge1xuICAgIGNvbXBvbmVudFJlZi5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciAjYmFja2dyb3VuZENvbnRhaW5lcj48L25nLWNvbnRhaW5lcj5cbjxoZWFkZXIgZi1ob21lLXBhZ2UtaGVhZGVyPjwvaGVhZGVyPlxuXG48ZGl2IGNsYXNzPVwiYm9keVwiPlxuICA8ZGl2IGNsYXNzPVwiaGVyby1yb3dcIj5cbiAgICA8Zi1ob21lLXBhZ2UtaGVybz48L2YtaG9tZS1wYWdlLWhlcm8+XG4gICAgPG5nLWNvbnRhaW5lciAjaGVyb0ltYWdlQ29udGFpbmVyPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbiAgPGYtaG9tZS1wYWdlLWZlYXR1cmVzPjwvZi1ob21lLXBhZ2UtZmVhdHVyZXM+XG48L2Rpdj5cblxuPGRpdiBjbGFzcz1cImZsZXgtc3BhY2VcIj48L2Rpdj5cbjxmb290ZXIgZi1ob21lLXBhZ2UtZm9vdGVyPjwvZm9vdGVyPlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZi1ob21lLXBhZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbS1yZW5kZXIvc3JjL2xpYi9mLWhvbWUtcGFnZS9mLWhvbWUtcGFnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tLXJlbmRlci9zcmMvbGliL2YtaG9tZS1wYWdlL2YtaG9tZS1wYWdlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFFTCx1QkFBdUIsRUFBRSxTQUFTLEVBQWdCLE1BQU0sRUFBRSxjQUFjLEVBQVEsU0FBUyxFQUFFLGdCQUFnQixFQUM1RyxNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxtREFBbUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxtREFBbUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsMEJBQTBCLEVBQUUsTUFBTSx1REFBdUQsQ0FBQztBQUNuRyxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUN2RixPQUFPLEVBQUUsMkJBQTJCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQzs7QUFFaEYsTUFBTSxDQUFDLE1BQU0scUJBQXFCLEdBQUcsSUFBSSxjQUFjLENBQXFCLHVCQUF1QixDQUFDLENBQUM7QUFtQnJHLE1BQU0sT0FBTyxrQkFBa0I7SUFFbkIsbUJBQW1CLEdBQUcsTUFBTSxDQUFDLDJCQUEyQixDQUFDLENBQUM7SUFHNUQsb0JBQW9CLENBQStCO0lBR25ELG1CQUFtQixDQUErQjtJQUVuRCxlQUFlO1FBQ3BCLElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsaUJBQWlCLEVBQUUsQ0FBQyxDQUFDO1FBQ3pFLElBQUksQ0FBQywwQkFBMEIsQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsc0JBQXNCLEVBQUUsQ0FBQyxDQUFDO0lBQ3JGLENBQUM7SUFFTyxxQkFBcUIsQ0FBSSxTQUFtQjtRQUNsRCxJQUFJLFNBQVMsRUFBRSxDQUFDO1lBQ2QsSUFBSSxDQUFDLHNCQUFzQixDQUFDLElBQUksQ0FBQywyQkFBMkIsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDO1FBQzNFLENBQUM7SUFDSCxDQUFDO0lBRU8sMEJBQTBCLENBQUksU0FBbUI7UUFDdkQsSUFBSSxTQUFTLEVBQUUsQ0FBQztZQUNkLElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsZ0NBQWdDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQztRQUNoRixDQUFDO0lBQ0gsQ0FBQztJQUVPLGdDQUFnQyxDQUFJLFNBQWtCO1FBQzVELE9BQU8sSUFBSSxDQUFDLG9CQUFxQixDQUFDLGVBQWUsQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUMvRCxDQUFDO0lBRU8sMkJBQTJCLENBQUksU0FBa0I7UUFDdkQsT0FBTyxJQUFJLENBQUMsbUJBQW9CLENBQUMsZUFBZSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQzlELENBQUM7SUFFTyxzQkFBc0IsQ0FBQyxZQUErQjtRQUM1RCxZQUFZLENBQUMsaUJBQWlCLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDaEQsQ0FBQzt3R0FyQ1Usa0JBQWtCOzRGQUFsQixrQkFBa0IsMERBWGxCO1lBQ1QsMkJBQTJCO1lBQzNCLEVBQUUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLFdBQVcsRUFBRSxrQkFBa0IsRUFBRTtTQUNwRSxrSUFZeUMsZ0JBQWdCLG9IQUdqQixnQkFBZ0IsNkJDcEMzRCwrWEFhQSw2cEJEVUksd0JBQXdCLHVFQUN4Qix3QkFBd0IsdUVBQ3hCLDBCQUEwQixpRUFDMUIsc0JBQXNCOzs0RkFHYixrQkFBa0I7a0JBakI5QixTQUFTOytCQUNFLGFBQWEsY0FHWCxJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0sYUFDcEM7d0JBQ1QsMkJBQTJCO3dCQUMzQixFQUFFLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxXQUFXLG9CQUFvQixFQUFFO3FCQUNwRSxXQUNRO3dCQUNQLHdCQUF3Qjt3QkFDeEIsd0JBQXdCO3dCQUN4QiwwQkFBMEI7d0JBQzFCLHNCQUFzQjtxQkFDdkI7OEJBT08sb0JBQW9CO3NCQUQzQixTQUFTO3VCQUFDLHFCQUFxQixFQUFFLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFFO2dCQUlwRCxtQkFBbUI7c0JBRDFCLFNBQVM7dUJBQUMsb0JBQW9CLEVBQUUsRUFBRSxJQUFJLEVBQUUsZ0JBQWdCLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBBZnRlclZpZXdJbml0LFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBDb21wb25lbnRSZWYsIGluamVjdCwgSW5qZWN0aW9uVG9rZW4sIFR5cGUsIFZpZXdDaGlsZCwgVmlld0NvbnRhaW5lclJlZlxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZIb21lUGFnZUZvb3RlckNvbXBvbmVudCB9IGZyb20gJy4vZi1ob21lLXBhZ2UtZm9vdGVyL2YtaG9tZS1wYWdlLWZvb3Rlci5jb21wb25lbnQnO1xuaW1wb3J0IHsgRkhvbWVQYWdlSGVhZGVyQ29tcG9uZW50IH0gZnJvbSAnLi9mLWhvbWUtcGFnZS1oZWFkZXIvZi1ob21lLXBhZ2UtaGVhZGVyLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBGSG9tZVBhZ2VGZWF0dXJlc0NvbXBvbmVudCB9IGZyb20gJy4vZi1ob21lLXBhZ2UtZmVhdHVyZXMvZi1ob21lLXBhZ2UtZmVhdHVyZXMuY29tcG9uZW50JztcbmltcG9ydCB7IEZIb21lUGFnZUhlcm9Db21wb25lbnQgfSBmcm9tICcuL2YtaG9tZS1wYWdlLWhlcm8vZi1ob21lLXBhZ2UtaGVyby5jb21wb25lbnQnO1xuaW1wb3J0IHsgRkhvbWVQYWdlRW52aXJvbm1lbnRTZXJ2aWNlIH0gZnJvbSAnLi9mLWhvbWUtcGFnZS1lbnZpcm9ubWVudC5zZXJ2aWNlJztcblxuZXhwb3J0IGNvbnN0IEZfSE9NRV9QQUdFX0NPTVBPTkVOVCA9IG5ldyBJbmplY3Rpb25Ub2tlbjxGSG9tZVBhZ2VDb21wb25lbnQ+KCdGX0hPTUVfUEFHRV9DT01QT05FTlQnKTtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZi1ob21lLXBhZ2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vZi1ob21lLXBhZ2UuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsgJy4vZi1ob21lLXBhZ2UuY29tcG9uZW50LnNjc3MnIF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFtcbiAgICBGSG9tZVBhZ2VFbnZpcm9ubWVudFNlcnZpY2UsXG4gICAgeyBwcm92aWRlOiBGX0hPTUVfUEFHRV9DT01QT05FTlQsIHVzZUV4aXN0aW5nOiBGSG9tZVBhZ2VDb21wb25lbnQgfVxuICBdLFxuICBpbXBvcnRzOiBbXG4gICAgRkhvbWVQYWdlRm9vdGVyQ29tcG9uZW50LFxuICAgIEZIb21lUGFnZUhlYWRlckNvbXBvbmVudCxcbiAgICBGSG9tZVBhZ2VGZWF0dXJlc0NvbXBvbmVudCxcbiAgICBGSG9tZVBhZ2VIZXJvQ29tcG9uZW50LFxuICBdXG59KVxuZXhwb3J0IGNsYXNzIEZIb21lUGFnZUNvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuXG4gIHByb3RlY3RlZCBfZW52aXJvbm1lbnRTZXJ2aWNlID0gaW5qZWN0KEZIb21lUGFnZUVudmlyb25tZW50U2VydmljZSk7XG5cbiAgQFZpZXdDaGlsZCgnYmFja2dyb3VuZENvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiB9KVxuICBwcml2YXRlIF9iYWNrZ3JvdW5kQ29udGFpbmVyOiBWaWV3Q29udGFpbmVyUmVmIHwgdW5kZWZpbmVkO1xuXG4gIEBWaWV3Q2hpbGQoJ2hlcm9JbWFnZUNvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiB9KVxuICBwcml2YXRlIF9oZXJvSW1hZ2VDb250YWluZXI6IFZpZXdDb250YWluZXJSZWYgfCB1bmRlZmluZWQ7XG5cbiAgcHVibGljIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLl9yZW5kZXJJbWFnZUNvbXBvbmVudCh0aGlzLl9lbnZpcm9ubWVudFNlcnZpY2UuZ2V0SW1hZ2VDb21wb25lbnQoKSk7XG4gICAgdGhpcy5fcmVuZGVyQmFja2dyb3VuZENvbXBvbmVudCh0aGlzLl9lbnZpcm9ubWVudFNlcnZpY2UuZ2V0QmFja2dyb3VuZENvbXBvbmVudCgpKTtcbiAgfVxuXG4gIHByaXZhdGUgX3JlbmRlckltYWdlQ29tcG9uZW50PFQ+KGNvbXBvbmVudD86IFR5cGU8VD4pOiB2b2lkIHtcbiAgICBpZiAoY29tcG9uZW50KSB7XG4gICAgICB0aGlzLnJlcXVlc3RDb21wb25lbnRSZWRyYXcodGhpcy5fZ2V0SW1hZ2VDb21wb25lbnRSZWZlcmVuY2UoY29tcG9uZW50KSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfcmVuZGVyQmFja2dyb3VuZENvbXBvbmVudDxUPihjb21wb25lbnQ/OiBUeXBlPFQ+KTogdm9pZCB7XG4gICAgaWYgKGNvbXBvbmVudCkge1xuICAgICAgdGhpcy5yZXF1ZXN0Q29tcG9uZW50UmVkcmF3KHRoaXMuX2dldEJhY2tncm91bmRDb21wb25lbnRSZWZlcmVuY2UoY29tcG9uZW50KSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfZ2V0QmFja2dyb3VuZENvbXBvbmVudFJlZmVyZW5jZTxUPihjb21wb25lbnQ6IFR5cGU8VD4pOiBDb21wb25lbnRSZWY8VD4ge1xuICAgIHJldHVybiB0aGlzLl9iYWNrZ3JvdW5kQ29udGFpbmVyIS5jcmVhdGVDb21wb25lbnQoY29tcG9uZW50KTtcbiAgfVxuXG4gIHByaXZhdGUgX2dldEltYWdlQ29tcG9uZW50UmVmZXJlbmNlPFQ+KGNvbXBvbmVudDogVHlwZTxUPik6IENvbXBvbmVudFJlZjxUPiB7XG4gICAgcmV0dXJuIHRoaXMuX2hlcm9JbWFnZUNvbnRhaW5lciEuY3JlYXRlQ29tcG9uZW50KGNvbXBvbmVudCk7XG4gIH1cblxuICBwcml2YXRlIHJlcXVlc3RDb21wb25lbnRSZWRyYXcoY29tcG9uZW50UmVmOiBDb21wb25lbnRSZWY8YW55Pik6IHZvaWQge1xuICAgIGNvbXBvbmVudFJlZi5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciAjYmFja2dyb3VuZENvbnRhaW5lcj48L25nLWNvbnRhaW5lcj5cbjxoZWFkZXIgZi1ob21lLXBhZ2UtaGVhZGVyPjwvaGVhZGVyPlxuXG48ZGl2IGNsYXNzPVwiYm9keVwiPlxuICA8ZGl2IGNsYXNzPVwiaGVyby1yb3dcIj5cbiAgICA8Zi1ob21lLXBhZ2UtaGVybz48L2YtaG9tZS1wYWdlLWhlcm8+XG4gICAgPG5nLWNvbnRhaW5lciAjaGVyb0ltYWdlQ29udGFpbmVyPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbiAgPGYtaG9tZS1wYWdlLWZlYXR1cmVzPjwvZi1ob21lLXBhZ2UtZmVhdHVyZXM+XG48L2Rpdj5cblxuPGRpdiBjbGFzcz1cImZsZXgtc3BhY2VcIj48L2Rpdj5cbjxmb290ZXIgZi1ob21lLXBhZ2UtZm9vdGVyPjwvZm9vdGVyPlxuIl19

package/fesm2022/foblex-m-render.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, booleanAttribute, Component, ChangeDetectionStrategy, Input, Output, ViewChild, HostListener, inject, Injectable, Inject, signal, InjectionToken, Optional, ViewChildren, ViewContainerRef, ElementRef, DestroyRef, ChangeDetectorRef } from '@angular/core';
+import { EventEmitter, booleanAttribute, Component, ChangeDetectionStrategy, Input, Output, ViewChild, HostListener, inject, Injectable, Inject, signal, input, output, viewChild, Optional, ViewChildren, ViewContainerRef, ElementRef, DestroyRef, InjectionToken, ChangeDetectorRef } from '@angular/core';
 import * as i2 from '@foblex/platform';
 import { F_LOCAL_STORAGE } from '@foblex/platform';
-import { DOCUMENT, ɵgetDOM as _getDOM, AsyncPipe, JsonPipe } from '@angular/common';
+import { DOCUMENT, ɵgetDOM as _getDOM, AsyncPipe, JsonPipe, TitleCasePipe } from '@angular/common';
 import * as i1 from '@angular/router';
 import { NavigationEnd, Router, RouterLink, ActivatedRoute, RouterOutlet } from '@angular/router';
 import { startWith, filter, BehaviorSubject, Subject, of, map, Subscription, from, switchMap, Observable, fromEvent, debounceTime } from 'rxjs';
@@ -10,15 +10,15 @@ import { catchError, filter as filter$1, take, tap } from 'rxjs/operators';
 import * as i1$1 from '@angular/common/http';
 import { HttpClient } from '@angular/common/http';
 import { deepClone } from '@foblex/utils';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import container from 'markdown-it-container';
 import MarkdownIt from 'markdown-it';
 import * as i2$1 from '@angular/platform-browser';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
-let uniqueId = 0;
+let uniqueId$1 = 0;
 class FCheckboxComponent {
     changeDetectorRef;
-    id = `f-checkbox-${uniqueId++}`;
+    id = `f-checkbox-${uniqueId$1++}`;
     change = new EventEmitter();
     inputElement;
     labelElement;
@@ -388,6 +388,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{ selector: 'f-cookie-popup', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!hasAccepted()) {\n  <div class=\"docs-cookies-popup docs-invert-mode\">\n    <p>This site uses cookies from Google to deliver its services and to analyze traffic.</p>\n\n    <div>\n      <a href=\"https://policies.google.com/technologies/cookies\" target=\"_blank\" rel=\"noopener\">\n        <button class=\"f-button\" [attr.text]=\"'Learn more'\" aria-label=\"Learn More\">\n          Learn more\n        </button>\n      </a>\n      <button\n        (click)=\"accept()\"\n        class=\"f-button\"\n        [attr.text]=\"'Ok, Got it'\"\n        aria-label=\"Ok, Got it\">\n        Ok, Got it\n      </button>\n    </div>\n  </div>\n}\n", styles: [":host{position:fixed;bottom:16px;right:16px;z-index:99999;opacity:0;visibility:hidden;animation:1s linear forwards .5s fadeIn}.docs-cookies-popup{padding:1rem;background-color:var(--background-color);border:1px solid var(--divider-color);color:var(--primary-text);border-radius:var(--border-radius);font-size:14px;max-width:310px;transition:background-color .3s ease,border-color .3s ease,color .3s ease;box-shadow:var(--shadow-3)}.docs-cookies-popup>div{display:flex;gap:8px;align-items:center;width:100%;margin-block-start:1rem}.f-button{outline:none;border:none;height:unset;line-height:26px;font-size:14px;font-weight:500;border-radius:var(--border-radius)}@keyframes fadeIn{to{opacity:100%;visibility:visible}}\n"] }]
         }], ctorParameters: () => [] });
 
+let uniqueId = 0;
+class FRadioButtonComponent {
+    id = input(`f-radio-button-${uniqueId++}`);
+    change = output();
+    checked = input(false);
+    labelElement = viewChild('label');
+    onInputClick() {
+        this._handleInputClick();
+    }
+    onTouchTargetClick() {
+        this._handleInputClick();
+    }
+    _handleInputClick() {
+        this._emitChangeEvent();
+    }
+    _emitChangeEvent() {
+        this.change.emit(true);
+    }
+    onInteractionEvent(event) {
+        event.stopPropagation();
+    }
+    preventBubblingFromLabel(event) {
+        if (!!event.target && this.labelElement()?.nativeElement.contains(event.target)) {
+            event.stopPropagation();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FRadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: FRadioButtonComponent, isStandalone: true, selector: "f-radio-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, host: { listeners: { "click": "preventBubblingFromLabel($event)" }, properties: { "class.f-radio-button-checked": "checked()" } }, viewQueries: [{ propertyName: "labelElement", first: true, predicate: ["label"], descendants: true, isSignal: true }], ngImport: i0, template: "<input [id]=\"id()\"\n       type=\"radio\"\n       [checked]=\"checked()\"\n       (click)=\"onInputClick()\"\n       (change)=\"onInteractionEvent($event)\"/>\n<div class=\"f-radio-button-container\" (click)=\"onTouchTargetClick()\">\n  <div class=\"f-radio-button-inner-circle\"></div>\n</div>\n<label [for]=\"id()\" #label>\n  <ng-content></ng-content>\n</label>\n", styles: [":host{position:relative;display:flex;align-items:center;font-weight:400;white-space:nowrap;font-size:14px;cursor:pointer;background-color:var(--radio-button-container-background);border-radius:var(--radio-button-container-border-radius);padding:0 8px;color:var(--radio-button-text);transition:color .25s,background-color .25s}:host input{position:absolute;inset:0;opacity:0;cursor:pointer}:host .f-radio-button-container{position:relative;display:flex;align-items:center;justify-content:center;width:var(--radio-button-size);height:var(--radio-button-size);margin-right:6px;border-radius:50%;border:1px solid var(--radio-button-border-color);background-color:var(--radio-button-background)}:host .f-radio-button-container .f-radio-button-inner-circle{position:absolute;top:calc(var(--radio-button-size) / 4);right:calc(var(--radio-button-size) / 4);bottom:calc(var(--radio-button-size) / 4);left:calc(var(--radio-button-size) / 4);border-radius:50%}:host label{-webkit-user-select:none;user-select:none}:host.f-radio-button-checked .f-radio-button-container{background-color:var(--radio-button-checked-background)}:host.f-radio-button-checked .f-radio-button-container .f-radio-button-inner-circle{background-color:var(--radio-button-inner-circle-color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FRadioButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'f-radio-button', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.f-radio-button-checked]': 'checked()',
+                    }, template: "<input [id]=\"id()\"\n       type=\"radio\"\n       [checked]=\"checked()\"\n       (click)=\"onInputClick()\"\n       (change)=\"onInteractionEvent($event)\"/>\n<div class=\"f-radio-button-container\" (click)=\"onTouchTargetClick()\">\n  <div class=\"f-radio-button-inner-circle\"></div>\n</div>\n<label [for]=\"id()\" #label>\n  <ng-content></ng-content>\n</label>\n", styles: [":host{position:relative;display:flex;align-items:center;font-weight:400;white-space:nowrap;font-size:14px;cursor:pointer;background-color:var(--radio-button-container-background);border-radius:var(--radio-button-container-border-radius);padding:0 8px;color:var(--radio-button-text);transition:color .25s,background-color .25s}:host input{position:absolute;inset:0;opacity:0;cursor:pointer}:host .f-radio-button-container{position:relative;display:flex;align-items:center;justify-content:center;width:var(--radio-button-size);height:var(--radio-button-size);margin-right:6px;border-radius:50%;border:1px solid var(--radio-button-border-color);background-color:var(--radio-button-background)}:host .f-radio-button-container .f-radio-button-inner-circle{position:absolute;top:calc(var(--radio-button-size) / 4);right:calc(var(--radio-button-size) / 4);bottom:calc(var(--radio-button-size) / 4);left:calc(var(--radio-button-size) / 4);border-radius:50%}:host label{-webkit-user-select:none;user-select:none}:host.f-radio-button-checked .f-radio-button-container{background-color:var(--radio-button-checked-background)}:host.f-radio-button-checked .f-radio-button-container .f-radio-button-inner-circle{background-color:var(--radio-button-inner-circle-color)}\n"] }]
+        }], propDecorators: { preventBubblingFromLabel: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+
 class FStateService {
     fBrowser;
     theme = new Subject();
@@ -541,8 +580,6 @@ class HandleNavigationLinksRequest {
     }
 }
 
-const INTERNAL_ENVIRONMENT_SERVICE = new InjectionToken('INTERNAL_ENVIRONMENT_SERVICE');
-
 class FBadgeComponent {
     text = '';
     type = 'tip';
@@ -856,7 +893,10 @@ class HandleDynamicComponentsHandler {
         this.dispose();
         const components = [
             {
-                tag: 'f-preview', component: FPreviewComponent
+                tag: 'f-preview', component: FPreviewComponent,
+            },
+            {
+                tag: 'f-preview-group-filters', component: FPreviewGroupFiltersComponent,
             },
             ...this.fEnvironmentService.getComponents()
         ];
@@ -1620,9 +1660,13 @@ class ParsePreviewGroup {
         return match ? match[1] : null;
     }
     getGroupsHTML(groups) {
-        return (groups || []).map((x) => {
+        const result = (groups || []).map((x) => {
             return `<h2>${x.text}</h2><div class="f-preview-group">${this.getItemsHTML(x)}</div>`;
         }).join('');
+        return this._getGroupFiltersHTML() + result;
+    }
+    _getGroupFiltersHTML() {
+        return `<f-preview-group-filters></f-preview-group-filters>`;
     }
     getItemsHTML(group) {
         return group.items.map((item) => {
@@ -2338,66 +2382,196 @@ var index$2 = /*#__PURE__*/Object.freeze({
     getContent: getContent
 });
 
-class FPreviewComponent {
-    fEnvironment;
-    fState;
-    router;
-    changeDetectorRef;
-    subscriptions$ = new Subscription();
+class FPreviewBase {
+}
+
+class FPreviewGroupService {
+    _fPreviews = [];
+    _originalOrder = null;
+    add(fPreview) {
+        this._fPreviews.push(fPreview);
+    }
+    remove(fPreview) {
+        this._fPreviews = this._fPreviews.filter(preview => preview !== fPreview);
+    }
+    sortByDate(sort) {
+        if (sort) {
+            this._applyByDateOrder();
+        }
+        else {
+            this._applyOriginalOrder();
+        }
+    }
+    _setOriginalOrder() {
+        this._originalOrder = new Map();
+        this._fPreviews.forEach((x) => {
+            const parentElement = x.hostElement.parentElement;
+            if (parentElement) {
+                const childrenArray = Array.from(parentElement.children);
+                this._originalOrder.set(parentElement, childrenArray);
+            }
+        });
+    }
+    _getOrderByDate() {
+        return this._fPreviews
+            .slice()
+            .sort((a, b) => {
+            const dateA = a.date ? a.date.getTime() : Number.MIN_SAFE_INTEGER;
+            const dateB = b.date ? b.date.getTime() : Number.MIN_SAFE_INTEGER;
+            return dateB - dateA;
+        });
+    }
+    _applyByDateOrder() {
+        this._setOriginalOrder();
+        this._getOrderByDate().forEach((x) => {
+            const parent = x.hostElement.parentElement;
+            parent?.appendChild(x.hostElement);
+        });
+    }
+    _applyOriginalOrder() {
+        this._originalOrder.forEach((originalChildren, parentElement) => {
+            originalChildren.forEach(child => parentElement.appendChild(child));
+        });
+    }
+    filterBy(filterKey, _allKey) {
+        this._resetLastActiveFilter();
+        if (filterKey === _allKey) {
+            return;
+        }
+        this._fPreviews.forEach((x) => {
+            if (x.filterKey !== filterKey) {
+                x.hostElement.style.display = 'none';
+            }
+        });
+    }
+    _resetLastActiveFilter() {
+        this._fPreviews.forEach((x) => {
+            x.hostElement.style.display = 'block';
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupService, decorators: [{
+            type: Injectable
+        }] });
+
+class FPreviewComponent extends FPreviewBase {
+    _elementReference = inject(ElementRef);
+    _fEnvironment = inject(FDocumentationEnvironmentService);
+    _fPreviewGroupService = inject(FPreviewGroupService);
+    _fState = inject(FStateService);
+    _router = inject(Router);
+    _destroyRef = inject(DestroyRef);
     item;
     group;
     viewModel;
-    src;
+    src = signal(undefined);
     url;
-    constructor(fEnvironment, fState, router, changeDetectorRef) {
-        this.fEnvironment = fEnvironment;
-        this.fState = fState;
-        this.router = router;
-        this.changeDetectorRef = changeDetectorRef;
+    get hostElement() {
+        return this._elementReference.nativeElement;
+    }
+    get filterKey() {
+        return this.viewModel?.badge?.text.toLowerCase();
+    }
+    get date() {
+        return this.viewModel?.date;
     }
     initialize() {
-        this.viewModel = this.getNavigationItem(this.getNavigationGroup());
-        this.url = this.normalizeLink(this.viewModel.link, this.getUrlPrefix());
-        this.subscriptions$.add(this.fState.theme$.pipe(startWith(null)).subscribe(() => this.updateTheme()));
+        this.viewModel = this._getNavigationItem(this._getNavigationGroup());
+        this.url = this._normalizeLink(this.viewModel.link, this._getUrlPrefix());
+        this._subscribeToThemeChanges();
     }
-    getNavigationGroup() {
-        return this.fEnvironment.getNavigation().find((x) => x.text === this.group);
+    _subscribeToThemeChanges() {
+        this._fState.theme$.pipe(startWith(null), takeUntilDestroyed(this._destroyRef)).subscribe(() => this.updateTheme());
     }
-    getNavigationItem(group) {
+    ngOnInit() {
+        this._fPreviewGroupService.add(this);
+    }
+    _getNavigationGroup() {
+        return this._fEnvironment.getNavigation().find((x) => x.text === this.group);
+    }
+    _getNavigationItem(group) {
         return group.items.find((x) => x.link === this.item);
     }
     updateTheme() {
-        this.src = this.fState.getPreferredTheme() === 'dark' ? this.viewModel?.image_dark : this.viewModel?.image;
-        if (!this.src) {
-            this.src = this.viewModel?.image;
+        this.src.set(this._fState.getPreferredTheme() === 'dark' ? this.viewModel?.image_dark : this.viewModel?.image);
+        if (!this.src()) {
+            this.src.set(this.viewModel?.image);
         }
-        this.changeDetectorRef.markForCheck();
     }
-    normalizeLink(link, prefix) {
-        if (!this.isExternalLink(link)) {
+    _normalizeLink(link, prefix) {
+        if (!this._isExternalLink(link)) {
             return link.startsWith('/') ? `${prefix}${link}` : `${prefix}/${link}`;
         }
         return link;
     }
-    getUrlPrefix() {
-        return this.router.url.substring(0, this.router.url.lastIndexOf('/'));
+    _getUrlPrefix() {
+        return this._router.url.substring(0, this._router.url.lastIndexOf('/'));
     }
-    isExternalLink(href) {
+    _isExternalLink(href) {
         return href.startsWith('www') || href.startsWith('http');
     }
     ngOnDestroy() {
-        this.subscriptions$.unsubscribe();
+        this._fPreviewGroupService.remove(this);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewComponent, deps: [{ token: FDocumentationEnvironmentService }, { token: FStateService }, { token: i1.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FPreviewComponent, isStandalone: true, selector: "a[f-preview]", host: { properties: { "attr.href": "url", "attr.title": "viewModel?.text" } }, ngImport: i0, template: "@if (viewModel) {\n  <img [src]=\"src\" [alt]=\"viewModel.description\" [title]=\"viewModel.text\">\n  <div class=\"title\">{{ viewModel.text }}</div>\n  <div class=\"description\">{{ viewModel.description }}</div>\n}\n\n\n\n", styles: [":host{display:block;border-radius:4px;background-color:var(--soft-background);padding:24px;width:100%;text-decoration:none!important;color:inherit!important;line-height:24px;font-size:14px;cursor:pointer}:host:hover img{transform:scale(1.1)}:host img{display:block;margin-bottom:16px;width:100%;height:180px;border-radius:4px;object-fit:cover;transition:transform .3s}:host .title{line-height:inherit;font-weight:600;text-transform:uppercase;color:var(--primary-text)}:host .description{margin:8px 0!important;line-height:inherit;color:var(--secondary-text);width:100%;word-wrap:break-word;white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}@media (min-width: 640px){:host{width:calc((100% - 32px)/2)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FPreviewComponent, isStandalone: true, selector: "a[f-preview]", host: { properties: { "attr.href": "url", "attr.title": "viewModel?.text" } }, usesInheritance: true, ngImport: i0, template: "@if (viewModel) {\n  <img [src]=\"src()\" [alt]=\"viewModel.description\" [title]=\"viewModel.text\">\n  <div class=\"title\">\n    {{ viewModel.text }}\n    @if (viewModel.badge) {\n      <span class=\"f-badge {{viewModel.badge.type}}\">{{ viewModel.badge.text }}</span>\n    }\n  </div>\n  <div class=\"description\">{{ viewModel.description }}</div>\n}\n\n\n\n", styles: [":host{display:block;border-radius:4px;background-color:var(--soft-background);padding:24px;width:100%;text-decoration:none!important;color:inherit!important;line-height:24px;font-size:14px;cursor:pointer}:host:hover img{transform:scale(1.1)}:host img{display:block;margin-bottom:16px;width:100%;height:180px;border-radius:4px;object-fit:cover;transition:transform .3s}:host .title{line-height:inherit;font-weight:600;text-transform:uppercase;color:var(--primary-text);display:flex;justify-content:space-between;align-items:center}:host .description{margin:8px 0!important;line-height:inherit;color:var(--secondary-text);width:100%;word-wrap:break-word;white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}@media (min-width: 640px){:host{width:calc((100% - 32px)/2)}}.f-badge{padding:0 6px;line-height:14px;text-transform:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'a[f-preview]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[attr.href]': 'url',
                         '[attr.title]': 'viewModel?.text',
-                    }, template: "@if (viewModel) {\n  <img [src]=\"src\" [alt]=\"viewModel.description\" [title]=\"viewModel.text\">\n  <div class=\"title\">{{ viewModel.text }}</div>\n  <div class=\"description\">{{ viewModel.description }}</div>\n}\n\n\n\n", styles: [":host{display:block;border-radius:4px;background-color:var(--soft-background);padding:24px;width:100%;text-decoration:none!important;color:inherit!important;line-height:24px;font-size:14px;cursor:pointer}:host:hover img{transform:scale(1.1)}:host img{display:block;margin-bottom:16px;width:100%;height:180px;border-radius:4px;object-fit:cover;transition:transform .3s}:host .title{line-height:inherit;font-weight:600;text-transform:uppercase;color:var(--primary-text)}:host .description{margin:8px 0!important;line-height:inherit;color:var(--secondary-text);width:100%;word-wrap:break-word;white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}@media (min-width: 640px){:host{width:calc((100% - 32px)/2)}}\n"] }]
-        }], ctorParameters: () => [{ type: FDocumentationEnvironmentService }, { type: FStateService }, { type: i1.Router }, { type: i0.ChangeDetectorRef }] });
+                    }, template: "@if (viewModel) {\n  <img [src]=\"src()\" [alt]=\"viewModel.description\" [title]=\"viewModel.text\">\n  <div class=\"title\">\n    {{ viewModel.text }}\n    @if (viewModel.badge) {\n      <span class=\"f-badge {{viewModel.badge.type}}\">{{ viewModel.badge.text }}</span>\n    }\n  </div>\n  <div class=\"description\">{{ viewModel.description }}</div>\n}\n\n\n\n", styles: [":host{display:block;border-radius:4px;background-color:var(--soft-background);padding:24px;width:100%;text-decoration:none!important;color:inherit!important;line-height:24px;font-size:14px;cursor:pointer}:host:hover img{transform:scale(1.1)}:host img{display:block;margin-bottom:16px;width:100%;height:180px;border-radius:4px;object-fit:cover;transition:transform .3s}:host .title{line-height:inherit;font-weight:600;text-transform:uppercase;color:var(--primary-text);display:flex;justify-content:space-between;align-items:center}:host .description{margin:8px 0!important;line-height:inherit;color:var(--secondary-text);width:100%;word-wrap:break-word;white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}@media (min-width: 640px){:host{width:calc((100% - 32px)/2)}}.f-badge{padding:0 6px;line-height:14px;text-transform:none}\n"] }]
+        }] });
+
+class FPreviewGroupFiltersComponent {
+    _allKey = 'all';
+    _fEnvironment = inject(FDocumentationEnvironmentService);
+    _fPreviewGroupService = inject(FPreviewGroupService);
+    filters = signal([]);
+    activeFilter = signal(this._allKey);
+    isSortByDateChecked = signal(false);
+    initialize() {
+        this.filters.set(this._calculateFiltersMap());
+    }
+    ngAfterViewInit() {
+        this.onFilterChange(this._allKey);
+    }
+    _calculateFiltersMap() {
+        const filters = [];
+        this._fEnvironment.getNavigation().forEach((group) => {
+            group.items.forEach((item) => {
+                if (item.badge && !filters.includes(item.badge.text.toLowerCase())) {
+                    filters.push(item.badge.text.toLowerCase());
+                }
+            });
+        });
+        if (filters.length > 0) {
+            filters.unshift(this._allKey);
+        }
+        return filters;
+    }
+    onFilterChange(key) {
+        this.activeFilter.set(key);
+        this._fPreviewGroupService.filterBy(key, this._allKey);
+    }
+    onSortByDateChange(event) {
+        this.isSortByDateChecked.set(event);
+        this._fPreviewGroupService.sortByDate(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FPreviewGroupFiltersComponent, isStandalone: true, selector: "div[f-preview-group-filters]", ngImport: i0, template: "@if (filters().length) {\n  <div class=\"filters-row\">\n    @for (filter of filters(); track filter) {\n      <f-radio-button [checked]=\"activeFilter() === filter\"\n                      (change)=\"onFilterChange(filter)\">{{ filter | titlecase }}\n      </f-radio-button>\n    }\n    <div class=\"flex-space\"></div>\n    <f-checkbox [checked]=\"isSortByDateChecked()\" (change)=\"onSortByDateChange($event)\">Sort by Newness</f-checkbox>\n  </div>\n}\n\n\n\n", styles: [".filters-row{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;width:100%;padding-top:20px;gap:8px}\n"], dependencies: [{ kind: "component", type: FCheckboxComponent, selector: "f-checkbox", inputs: ["id", "checked"], outputs: ["change"] }, { kind: "component", type: FRadioButtonComponent, selector: "f-radio-button", inputs: ["id", "checked"], outputs: ["change"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FPreviewGroupFiltersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'div[f-preview-group-filters]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        FCheckboxComponent,
+                        FRadioButtonComponent,
+                        TitleCasePipe
+                    ], template: "@if (filters().length) {\n  <div class=\"filters-row\">\n    @for (filter of filters(); track filter) {\n      <f-radio-button [checked]=\"activeFilter() === filter\"\n                      (change)=\"onFilterChange(filter)\">{{ filter | titlecase }}\n      </f-radio-button>\n    }\n    <div class=\"flex-space\"></div>\n    <f-checkbox [checked]=\"isSortByDateChecked()\" (change)=\"onSortByDateChange($event)\">Sort by Newness</f-checkbox>\n  </div>\n}\n\n\n\n", styles: [".filters-row{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;width:100%;padding-top:20px;gap:8px}\n"] }]
+        }] });
 
 const F_DOCUMENTATION_COMPONENT = new InjectionToken('F_DOCUMENTATION_COMPONENT');
 
@@ -2425,23 +2599,23 @@ class FDocumentationComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FDocumentationComponent, isStandalone: true, selector: "f-documentation", providers: [
             FDocumentationEnvironmentService,
             FPopoverService,
-            { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FDocumentationEnvironmentService },
+            FPreviewGroupService,
             { provide: F_DOCUMENTATION_COMPONENT, useExisting: FDocumentationComponent }
-        ], ngImport: i0, template: "<div class=\"f-backdrop\" [class.visible]=\"isNavigationVisible\" (click)=\"onToggleNavigation(false)\"></div>\n<f-navigation-panel [class.visible]=\"isNavigationVisible\"></f-navigation-panel>\n\n<f-scrollable-container>\n  <f-header></f-header>\n  <router-outlet></router-outlet>\n</f-scrollable-container>\n@if (popoverMessage) {\n  <div class=\"popover\">{{ popoverMessage }}</div>\n}\n", styles: [":host{display:flex;justify-content:flex-start;align-items:flex-start;height:100%;gap:10px}.f-backdrop{position:fixed;inset:0;opacity:0;z-index:var(--z-index-backdrop);background:var(--backdrop-color);transition:opacity .2s ease-in-out;pointer-events:none}.f-backdrop.visible{opacity:1;pointer-events:all}@media (min-width: 960px){.f-backdrop{position:unset}}.popover{position:fixed;min-width:120px;bottom:50%;left:50%;text-align:center;transform:translate(-50%,-50%);background-color:var(--code-view-copy-button-hover-background);border:1px solid var(--code-view-copy-button-border-color);color:var(--primary-text);font-size:14px;padding:4px 8px;border-radius:4px;z-index:var(--z-index-popover);opacity:1}\n"], dependencies: [{ kind: "component", type: FNavigationPanelComponent, selector: "f-navigation-panel" }, { kind: "component", type: FHeaderComponent, selector: "f-header" }, { kind: "component", type: FScrollableContainerComponent, selector: "f-scrollable-container" }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], ngImport: i0, template: "<f-navigation-panel [class.visible]=\"isNavigationVisible\"></f-navigation-panel>\n<div class=\"f-backdrop\" [class.visible]=\"isNavigationVisible\" (click)=\"onToggleNavigation(false)\"></div>\n\n<f-scrollable-container>\n  <f-header></f-header>\n  <router-outlet></router-outlet>\n</f-scrollable-container>\n@if (popoverMessage) {\n  <div class=\"popover\">{{ popoverMessage }}</div>\n}\n", styles: [":host{display:flex;justify-content:flex-start;align-items:flex-start;height:100%;gap:5px}.f-backdrop{position:fixed;inset:0;opacity:0;z-index:var(--z-index-backdrop);background:var(--backdrop-color);transition:opacity .2s ease-in-out;pointer-events:none}.f-backdrop.visible{opacity:1;pointer-events:all}@media (min-width: 960px){.f-backdrop{position:unset}}.popover{position:fixed;min-width:120px;bottom:50%;left:50%;text-align:center;transform:translate(-50%,-50%);background-color:var(--code-view-copy-button-hover-background);border:1px solid var(--code-view-copy-button-border-color);color:var(--primary-text);font-size:14px;padding:4px 8px;border-radius:4px;z-index:var(--z-index-popover);opacity:1}\n"], dependencies: [{ kind: "component", type: FNavigationPanelComponent, selector: "f-navigation-panel" }, { kind: "component", type: FHeaderComponent, selector: "f-header" }, { kind: "component", type: FScrollableContainerComponent, selector: "f-scrollable-container" }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FDocumentationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'f-documentation', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         FDocumentationEnvironmentService,
                         FPopoverService,
-                        { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FDocumentationEnvironmentService },
+                        FPreviewGroupService,
                         { provide: F_DOCUMENTATION_COMPONENT, useExisting: FDocumentationComponent }
                     ], imports: [
                         FNavigationPanelComponent,
                         FHeaderComponent,
                         FScrollableContainerComponent,
                         RouterOutlet
-                    ], template: "<div class=\"f-backdrop\" [class.visible]=\"isNavigationVisible\" (click)=\"onToggleNavigation(false)\"></div>\n<f-navigation-panel [class.visible]=\"isNavigationVisible\"></f-navigation-panel>\n\n<f-scrollable-container>\n  <f-header></f-header>\n  <router-outlet></router-outlet>\n</f-scrollable-container>\n@if (popoverMessage) {\n  <div class=\"popover\">{{ popoverMessage }}</div>\n}\n", styles: [":host{display:flex;justify-content:flex-start;align-items:flex-start;height:100%;gap:10px}.f-backdrop{position:fixed;inset:0;opacity:0;z-index:var(--z-index-backdrop);background:var(--backdrop-color);transition:opacity .2s ease-in-out;pointer-events:none}.f-backdrop.visible{opacity:1;pointer-events:all}@media (min-width: 960px){.f-backdrop{position:unset}}.popover{position:fixed;min-width:120px;bottom:50%;left:50%;text-align:center;transform:translate(-50%,-50%);background-color:var(--code-view-copy-button-hover-background);border:1px solid var(--code-view-copy-button-border-color);color:var(--primary-text);font-size:14px;padding:4px 8px;border-radius:4px;z-index:var(--z-index-popover);opacity:1}\n"] }]
+                    ], template: "<f-navigation-panel [class.visible]=\"isNavigationVisible\"></f-navigation-panel>\n<div class=\"f-backdrop\" [class.visible]=\"isNavigationVisible\" (click)=\"onToggleNavigation(false)\"></div>\n\n<f-scrollable-container>\n  <f-header></f-header>\n  <router-outlet></router-outlet>\n</f-scrollable-container>\n@if (popoverMessage) {\n  <div class=\"popover\">{{ popoverMessage }}</div>\n}\n", styles: [":host{display:flex;justify-content:flex-start;align-items:flex-start;height:100%;gap:5px}.f-backdrop{position:fixed;inset:0;opacity:0;z-index:var(--z-index-backdrop);background:var(--backdrop-color);transition:opacity .2s ease-in-out;pointer-events:none}.f-backdrop.visible{opacity:1;pointer-events:all}@media (min-width: 960px){.f-backdrop{position:unset}}.popover{position:fixed;min-width:120px;bottom:50%;left:50%;text-align:center;transform:translate(-50%,-50%);background-color:var(--code-view-copy-button-hover-background);border:1px solid var(--code-view-copy-button-border-color);color:var(--primary-text);font-size:14px;padding:4px 8px;border-radius:4px;z-index:var(--z-index-popover);opacity:1}\n"] }]
         }] });
 
 const F_DOCS_ENVIRONMENT = new InjectionToken('F_DOCS_ENVIRONMENT');
@@ -2486,7 +2660,10 @@ var index$1 = /*#__PURE__*/Object.freeze({
     FNavigationItemComponent: FNavigationItemComponent,
     FNavigationPanelComponent: FNavigationPanelComponent,
     FPageComponent: FPageComponent,
+    FPreviewBase: FPreviewBase,
     FPreviewComponent: FPreviewComponent,
+    FPreviewGroupFiltersComponent: FPreviewGroupFiltersComponent,
+    FPreviewGroupService: FPreviewGroupService,
     FScrollableContainerComponent: FScrollableContainerComponent,
     FSocialLinksComponent: FSocialLinksComponent,
     FTableOfContentComponent: FTableOfContentComponent,
@@ -2655,7 +2832,6 @@ class FHomePageComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FHomePageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FHomePageComponent, isStandalone: true, selector: "f-home-page", providers: [
             FHomePageEnvironmentService,
-            { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FHomePageEnvironmentService },
             { provide: F_HOME_PAGE_COMPONENT, useExisting: FHomePageComponent }
         ], viewQueries: [{ propertyName: "_backgroundContainer", first: true, predicate: ["backgroundContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "_heroImageContainer", first: true, predicate: ["heroImageContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container #backgroundContainer></ng-container>\n<header f-home-page-header></header>\n\n<div class=\"body\">\n  <div class=\"hero-row\">\n    <f-home-page-hero></f-home-page-hero>\n    <ng-container #heroImageContainer></ng-container>\n  </div>\n  <f-home-page-features></f-home-page-features>\n</div>\n\n<div class=\"flex-space\"></div>\n<footer f-home-page-footer></footer>\n", styles: [":host{display:flex;flex-direction:column;position:relative;width:100%;height:100%;min-height:100%;overflow:hidden;overflow-y:auto}.body{position:relative;z-index:3;pointer-events:none}@media (min-width: 960px){.body{margin-top:50px}}@media (min-width: 1376px){.body{margin-top:100px}}.hero-row{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:center;margin:0 auto}@media (min-width: 960px){.hero-row{flex-direction:row;margin-left:64px;margin-right:64px}}@media (min-width: 1376px){.hero-row{flex-direction:row;margin-left:calc(50% - 624px);margin-right:calc(50% - 624px)}}\n"], dependencies: [{ kind: "component", type: FHomePageFooterComponent, selector: "footer[f-home-page-footer]" }, { kind: "component", type: FHomePageHeaderComponent, selector: "header[f-home-page-header]" }, { kind: "component", type: FHomePageFeaturesComponent, selector: "f-home-page-features" }, { kind: "component", type: FHomePageHeroComponent, selector: "f-home-page-hero" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
@@ -2663,7 +2839,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Component,
             args: [{ selector: 'f-home-page', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         FHomePageEnvironmentService,
-                        { provide: INTERNAL_ENVIRONMENT_SERVICE, useExisting: FHomePageEnvironmentService },
                         { provide: F_HOME_PAGE_COMPONENT, useExisting: FHomePageComponent }
                     ], imports: [
                         FHomePageFooterComponent,
@@ -2702,5 +2877,5 @@ var index = /*#__PURE__*/Object.freeze({
  * Generated bundle index. Do not edit.
  */
 
-export { CalculateHashFromScrollPositionHandler, CalculateHashFromScrollPositionRequest, ChangeCodeFocusedSyntaxPreProcessor, CookiePopup, EMarkdownContainerType, FAnalyticsService, FAsyncCodeViewHandler, FBadgeComponent, FCheckboxComponent, FCodeGroupBodyHandler, FCodeGroupHandler, FCodeViewHandler, FDocumentationComponent, FDocumentationEnvironmentService, FExampleViewHandler, FFooterEditInformationComponent, FFooterNavigationButtonComponent, FFooterNavigationComponent, FHamburgerButtonComponent, FHeadTagService, FHeaderComponent, FHeaderMenuComponent, FHomePageComponent, FHomePageEnvironmentService, FHomePageFeaturesComponent, FHomePageFooterComponent, FHomePageHeaderComponent, FJsonLdService, FMarkdownFooterComponent, FMarkdownRendererComponent, FMetaService, FNavigationGroupComponent, FNavigationHeaderComponent, FNavigationItemComponent, FNavigationPanelComponent, FPageComponent, FPopoverService, FPreviewComponent, FScrollableContainerComponent, FSocialLinksComponent, FTableOfContentComponent, FTableOfContentItemsComponent, FThemeButtonComponent, FVersionComponent, F_ACCEPT_COOKIES_KEY, F_DOCS_ENVIRONMENT, F_DOCS_ROUTES, F_DOCUMENTATION_COMPONENT, F_HOME_PAGE_COMPONENT, F_HOME_PAGE_ENVIRONMENT, F_HOME_PAGE_ROUTES, GetAbsoluteTopToContainerHandler, GetAbsoluteTopToContainerRequest, GetPreviousNextPageNavigationHandler, GetPreviousNextPageNavigationRequest, GetPreviousNextPageNavigationResponse, GetTableOfContentDataHandler, GetTableOfContentDataRequest, GetVersionHandler, GetVersionRequest, HandleDynamicComponentsHandler, HandleDynamicComponentsRequest, HandleNavigationLinksHandler, HandleNavigationLinksRequest, HandleParsedContainersHandler, HandleParsedContainersRequest, HighlightService, INTERNAL_ENVIRONMENT_SERVICE, MarkCodeFocusedBlocksPostProcessor, MarkdownService, ModifyPunctuationHighlightPostProcessor, ParseAlerts, ParseCodeGroup, ParseCodeView, ParseExampleGroup, ParsePreviewGroup, ScrollToElementInContainer, SeparateCodeByLinesPostProcessor, TableOfContentData, copyToClipboard, getContent, setCookieConsent };
+export { CalculateHashFromScrollPositionHandler, CalculateHashFromScrollPositionRequest, ChangeCodeFocusedSyntaxPreProcessor, CookiePopup, EMarkdownContainerType, FAnalyticsService, FAsyncCodeViewHandler, FBadgeComponent, FCheckboxComponent, FCodeGroupBodyHandler, FCodeGroupHandler, FCodeViewHandler, FDocumentationComponent, FDocumentationEnvironmentService, FExampleViewHandler, FFooterEditInformationComponent, FFooterNavigationButtonComponent, FFooterNavigationComponent, FHamburgerButtonComponent, FHeadTagService, FHeaderComponent, FHeaderMenuComponent, FHomePageComponent, FHomePageEnvironmentService, FHomePageFeaturesComponent, FHomePageFooterComponent, FHomePageHeaderComponent, FJsonLdService, FMarkdownFooterComponent, FMarkdownRendererComponent, FMetaService, FNavigationGroupComponent, FNavigationHeaderComponent, FNavigationItemComponent, FNavigationPanelComponent, FPageComponent, FPopoverService, FPreviewBase, FPreviewComponent, FPreviewGroupFiltersComponent, FPreviewGroupService, FRadioButtonComponent, FScrollableContainerComponent, FSocialLinksComponent, FTableOfContentComponent, FTableOfContentItemsComponent, FThemeButtonComponent, FVersionComponent, F_ACCEPT_COOKIES_KEY, F_DOCS_ENVIRONMENT, F_DOCS_ROUTES, F_DOCUMENTATION_COMPONENT, F_HOME_PAGE_COMPONENT, F_HOME_PAGE_ENVIRONMENT, F_HOME_PAGE_ROUTES, GetAbsoluteTopToContainerHandler, GetAbsoluteTopToContainerRequest, GetPreviousNextPageNavigationHandler, GetPreviousNextPageNavigationRequest, GetPreviousNextPageNavigationResponse, GetTableOfContentDataHandler, GetTableOfContentDataRequest, GetVersionHandler, GetVersionRequest, HandleDynamicComponentsHandler, HandleDynamicComponentsRequest, HandleNavigationLinksHandler, HandleNavigationLinksRequest, HandleParsedContainersHandler, HandleParsedContainersRequest, HighlightService, MarkCodeFocusedBlocksPostProcessor, MarkdownService, ModifyPunctuationHighlightPostProcessor, ParseAlerts, ParseCodeGroup, ParseCodeView, ParseExampleGroup, ParsePreviewGroup, ScrollToElementInContainer, SeparateCodeByLinesPostProcessor, TableOfContentData, copyToClipboard, getContent, setCookieConsent };
 //# sourceMappingURL=foblex-m-render.mjs.map