@underlayerdev/ui 0.0.1

package/fesm2022/underlayerdev-ui.mjs

@@ -0,0 +1,3320 @@
+import * as i1 from '@angular/cdk/accordion';
+import { CdkAccordionItem, CdkAccordion } from '@angular/cdk/accordion';
+import * as i0 from '@angular/core';
+import { inject, ElementRef, ChangeDetectionStrategy, Component, input, DestroyRef, contentChildren, computed, ViewEncapsulation, signal, effect, Directive, output, model, booleanAttribute, viewChild, ViewChild, contentChild, HostListener, Pipe, SecurityContext, Injectable, HostBinding } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import * as i1$1 from '@angular/common';
+import { CommonModule, NgTemplateOutlet, CurrencyPipe } from '@angular/common';
+import { RouterLink } from '@angular/router';
+import { CdkMenuTrigger, CdkMenu, CdkMenuItem } from '@angular/cdk/menu';
+import Splide from '@splidejs/splide';
+import { fromEvent } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
+import { CdkTrapFocus } from '@angular/cdk/a11y';
+import { DomSanitizer } from '@angular/platform-browser';
+
+/**
+ * AccordionItemComponent is a standalone Angular component that extends CdkAccordionItem.
+ * It represents an item within an accordion, providing configurable expansion behavior
+ * and accessibility features.
+ */
+class AccordionItemComponent {
+    cdkAccordionItem = inject(CdkAccordionItem);
+    elementRef = inject((ElementRef));
+    /**
+     * Stable ID for the content region, used for aria-controls linkage.
+     */
+    contentId = `pe-accordion-content-${Math.random().toString(36).slice(2, 11)}`;
+    /**
+     * Stable ID for the trigger button, used for aria-labelledby linkage.
+     */
+    triggerId = `pe-accordion-trigger-${Math.random().toString(36).slice(2, 11)}`;
+    onToggle() {
+        if (this.cdkAccordionItem.disabled) {
+            return;
+        }
+        this.cdkAccordionItem.toggle();
+    }
+    onKeydown(event) {
+        if (this.cdkAccordionItem.disabled) {
+            return;
+        }
+        if (event.key === ' ' || event.key === 'Enter') {
+            event.preventDefault();
+            this.onToggle();
+            return;
+        }
+        // Handle Arrow keys, Home, and End for navigation between accordion items
+        const accordion = this.elementRef.nativeElement.closest('.pe-accordion');
+        if (!accordion) {
+            return;
+        }
+        const triggers = Array.from(accordion.querySelectorAll('.pe-accordion__trigger:not([disabled])'));
+        const currentIndex = triggers.findIndex((t) => t.id === this.triggerId);
+        if (currentIndex === -1) {
+            return;
+        }
+        let targetIndex = null;
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                targetIndex = currentIndex < triggers.length - 1 ? currentIndex + 1 : 0;
+                break;
+            case 'ArrowUp':
+                event.preventDefault();
+                targetIndex = currentIndex > 0 ? currentIndex - 1 : triggers.length - 1;
+                break;
+            case 'Home':
+                event.preventDefault();
+                targetIndex = 0;
+                break;
+            case 'End':
+                event.preventDefault();
+                targetIndex = triggers.length - 1;
+                break;
+        }
+        if (targetIndex !== null && triggers[targetIndex]) {
+            triggers[targetIndex].focus();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.2", type: AccordionItemComponent, isStandalone: true, selector: "pe-accordion-item", hostDirectives: [{ directive: i1.CdkAccordionItem, inputs: ["expanded", "expanded", "disabled", "disabled"], outputs: ["closed", "closed", "opened", "opened", "destroyed", "destroyed", "expandedChange", "expandedChange"] }], ngImport: i0, template: `
+    <div
+      class="pe-accordion__item"
+      [class.pe-accordion__item--expanded]="cdkAccordionItem.expanded"
+      [class.pe-accordion__item--disabled]="cdkAccordionItem.disabled">
+      <button
+        (click)="onToggle()"
+        class="pe-accordion__trigger"
+        [id]="triggerId"
+        [attr.aria-expanded]="cdkAccordionItem.expanded"
+        [attr.aria-controls]="contentId"
+        [attr.aria-disabled]="cdkAccordionItem.disabled ? 'true' : null"
+        [disabled]="cdkAccordionItem.disabled"
+        (keydown)="onKeydown($event)"
+        type="button">
+        <div class="pe-accordion__icon">
+          <ng-content select="[pe-accordion-icon]"></ng-content>
+        </div>
+        <div class="pe-accordion__label">
+          <ng-content select="[pe-accordion-label]"></ng-content>
+        </div>
+        <div class="pe-accordion__status">
+          <ng-content select="[pe-accordion-status]"></ng-content>
+        </div>
+        <span class="pe-accordion__indicator">
+          <i class="pe-icon pe-icon-size-8 pe-icon-weight-bold pe-icon-chevron_down"></i>
+        </span>
+      </button>
+      <div
+        role="region"
+        class="pe-accordion__content"
+        [id]="contentId"
+        [attr.aria-labelledby]="triggerId"
+        [attr.aria-hidden]="!cdkAccordionItem.expanded">
+        <ng-content select="[pe-accordion-content]"></ng-content>
+      </div>
+    </div>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-accordion{color:#fff;display:flex;flex-direction:column;gap:8px}.pe-accordion__item{min-height:48px;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.pe-accordion__item:first-child{padding-top:0}.pe-accordion__item:last-child{border-bottom:none}.pe-accordion__item--disabled{cursor:not-allowed}.pe-accordion__item--disabled .pe-accordion__trigger{cursor:not-allowed;color:#ffffff4d;background-color:#ffffff0d;pointer-events:none}.pe-accordion__item--disabled .pe-accordion__trigger:hover,.pe-accordion__item--disabled .pe-accordion__trigger:active{background-color:#ffffff0d}.pe-accordion__item--disabled .pe-accordion__indicator{color:#ffffff4d}.pe-accordion__item:after{content:\"\";display:block;width:calc(100% - 24px);border-bottom:1px solid transparent}.pe-accordion--divider ::ng-deep .pe-accordion__item:after{border-color:#ffffff1a}.pe-accordion__trigger{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;width:100%;min-height:48px;text-align:start;display:flex;align-items:center;gap:8px;border-radius:12px;padding:0 12px}.pe-accordion__trigger:hover{background-color:#fff3}.pe-accordion__trigger:active{background-color:#ffffff1a}.pe-accordion__trigger:selected{background-color:#fff3}.pe-accordion__trigger{background-color:#fff0;color:inherit}.pe-accordion__trigger:disabled,.pe-accordion__trigger[disabled]{background-color:#fff0}.pe-accordion__trigger:focus-visible,.pe-accordion__trigger:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-accordion__icon{display:flex;align-items:center;font-size:32px;line-height:32px}.pe-accordion__label{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;flex:1}.pe-accordion__status{display:flex;gap:8px}.pe-accordion__indicator{color:#ffffffb3;transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-accordion__item--expanded .pe-accordion__indicator{transform:rotate(180deg)}.pe-accordion__content{color:#ffffffb3;background-color:transparent;padding:12px;width:100%;display:none;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-accordion__item--expanded .pe-accordion__content{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AccordionItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-accordion-item', standalone: true, template: `
+    <div
+      class="pe-accordion__item"
+      [class.pe-accordion__item--expanded]="cdkAccordionItem.expanded"
+      [class.pe-accordion__item--disabled]="cdkAccordionItem.disabled">
+      <button
+        (click)="onToggle()"
+        class="pe-accordion__trigger"
+        [id]="triggerId"
+        [attr.aria-expanded]="cdkAccordionItem.expanded"
+        [attr.aria-controls]="contentId"
+        [attr.aria-disabled]="cdkAccordionItem.disabled ? 'true' : null"
+        [disabled]="cdkAccordionItem.disabled"
+        (keydown)="onKeydown($event)"
+        type="button">
+        <div class="pe-accordion__icon">
+          <ng-content select="[pe-accordion-icon]"></ng-content>
+        </div>
+        <div class="pe-accordion__label">
+          <ng-content select="[pe-accordion-label]"></ng-content>
+        </div>
+        <div class="pe-accordion__status">
+          <ng-content select="[pe-accordion-status]"></ng-content>
+        </div>
+        <span class="pe-accordion__indicator">
+          <i class="pe-icon pe-icon-size-8 pe-icon-weight-bold pe-icon-chevron_down"></i>
+        </span>
+      </button>
+      <div
+        role="region"
+        class="pe-accordion__content"
+        [id]="contentId"
+        [attr.aria-labelledby]="triggerId"
+        [attr.aria-hidden]="!cdkAccordionItem.expanded">
+        <ng-content select="[pe-accordion-content]"></ng-content>
+      </div>
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: CdkAccordionItem,
+                            inputs: ['expanded', 'disabled'],
+                            outputs: ['closed', 'opened', 'destroyed', 'expandedChange'],
+                        },
+                    ], styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-accordion{color:#fff;display:flex;flex-direction:column;gap:8px}.pe-accordion__item{min-height:48px;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.pe-accordion__item:first-child{padding-top:0}.pe-accordion__item:last-child{border-bottom:none}.pe-accordion__item--disabled{cursor:not-allowed}.pe-accordion__item--disabled .pe-accordion__trigger{cursor:not-allowed;color:#ffffff4d;background-color:#ffffff0d;pointer-events:none}.pe-accordion__item--disabled .pe-accordion__trigger:hover,.pe-accordion__item--disabled .pe-accordion__trigger:active{background-color:#ffffff0d}.pe-accordion__item--disabled .pe-accordion__indicator{color:#ffffff4d}.pe-accordion__item:after{content:\"\";display:block;width:calc(100% - 24px);border-bottom:1px solid transparent}.pe-accordion--divider ::ng-deep .pe-accordion__item:after{border-color:#ffffff1a}.pe-accordion__trigger{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;width:100%;min-height:48px;text-align:start;display:flex;align-items:center;gap:8px;border-radius:12px;padding:0 12px}.pe-accordion__trigger:hover{background-color:#fff3}.pe-accordion__trigger:active{background-color:#ffffff1a}.pe-accordion__trigger:selected{background-color:#fff3}.pe-accordion__trigger{background-color:#fff0;color:inherit}.pe-accordion__trigger:disabled,.pe-accordion__trigger[disabled]{background-color:#fff0}.pe-accordion__trigger:focus-visible,.pe-accordion__trigger:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-accordion__icon{display:flex;align-items:center;font-size:32px;line-height:32px}.pe-accordion__label{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;flex:1}.pe-accordion__status{display:flex;gap:8px}.pe-accordion__indicator{color:#ffffffb3;transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-accordion__item--expanded .pe-accordion__indicator{transform:rotate(180deg)}.pe-accordion__content{color:#ffffffb3;background-color:transparent;padding:12px;width:100%;display:none;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-accordion__item--expanded .pe-accordion__content{display:block}\n"] }]
+        }] });
+/**
+ * AccordionComponent is a standalone Angular component that acts as a container
+ * for multiple AccordionItemComponents. It provides configuration options for
+ * multi-expansion behavior and manages the state of its child accordion items.
+ */
+class AccordionComponent {
+    showDivider = input(false, ...(ngDevMode ? [{ debugName: "showDivider" }] : []));
+    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : []));
+    destroyRef = inject(DestroyRef);
+    accordionItems = contentChildren(AccordionItemComponent, { ...(ngDevMode ? { debugName: "accordionItems" } : {}), read: CdkAccordionItem });
+    ngAfterViewInit() {
+        this.setupSingleExpansionLogic();
+    }
+    /**
+     * Sets up the single expansion logic to ensure only one item is expanded at a time
+     * when multi mode is disabled.
+     */
+    setupSingleExpansionLogic() {
+        const items = this.accordionItems();
+        // Early return if no items or multi mode is enabled
+        if (!items.length || this.multi()) {
+            return;
+        }
+        // Subscribe to expansion changes for all items
+        items.forEach((item) => {
+            item.expandedChange.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((expanded) => {
+                this.handleExpansionChange(item, expanded, items);
+            });
+        });
+    }
+    /**
+     * Handles expansion changes and manages single-expansion behavior.
+     * @param changedItem - The accordion item that changed
+     * @param expanded - Whether the item is now expanded
+     * @param allItems - Array of all accordion items
+     */
+    handleExpansionChange(changedItem, expanded, allItems) {
+        // Only handle expansion (not collapse) and only when multi mode is disabled
+        if (!expanded || this.multi()) {
+            return;
+        }
+        // Collapse all other items except the one that was just expanded
+        allItems.forEach((item) => {
+            if (item !== changedItem && item.expanded) {
+                item.expanded = false;
+            }
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.2", type: AccordionComponent, isStandalone: true, selector: "pe-accordion", inputs: { showDivider: { classPropertyName: "showDivider", publicName: "showDivider", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "accordionItems", predicate: AccordionItemComponent, read: CdkAccordionItem, isSignal: true }], ngImport: i0, template: `
+    <cdk-accordion #accordion [multi]="multi()" class="pe-accordion" [class.pe-accordion--divider]="showDivider()">
+      <ng-content />
+    </cdk-accordion>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-accordion{color:#fff;display:flex;flex-direction:column;gap:8px}.pe-accordion__item{min-height:48px;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.pe-accordion__item:first-child{padding-top:0}.pe-accordion__item:last-child{border-bottom:none}.pe-accordion__item--disabled{cursor:not-allowed}.pe-accordion__item--disabled .pe-accordion__trigger{cursor:not-allowed;color:#ffffff4d;background-color:#ffffff0d;pointer-events:none}.pe-accordion__item--disabled .pe-accordion__trigger:hover,.pe-accordion__item--disabled .pe-accordion__trigger:active{background-color:#ffffff0d}.pe-accordion__item--disabled .pe-accordion__indicator{color:#ffffff4d}.pe-accordion__item:after{content:\"\";display:block;width:calc(100% - 24px);border-bottom:1px solid transparent}.pe-accordion--divider ::ng-deep .pe-accordion__item:after{border-color:#ffffff1a}.pe-accordion__trigger{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;width:100%;min-height:48px;text-align:start;display:flex;align-items:center;gap:8px;border-radius:12px;padding:0 12px}.pe-accordion__trigger:hover{background-color:#fff3}.pe-accordion__trigger:active{background-color:#ffffff1a}.pe-accordion__trigger:selected{background-color:#fff3}.pe-accordion__trigger{background-color:#fff0;color:inherit}.pe-accordion__trigger:disabled,.pe-accordion__trigger[disabled]{background-color:#fff0}.pe-accordion__trigger:focus-visible,.pe-accordion__trigger:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-accordion__icon{display:flex;align-items:center;font-size:32px;line-height:32px}.pe-accordion__label{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;flex:1}.pe-accordion__status{display:flex;gap:8px}.pe-accordion__indicator{color:#ffffffb3;transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-accordion__item--expanded .pe-accordion__indicator{transform:rotate(180deg)}.pe-accordion__content{color:#ffffffb3;background-color:transparent;padding:12px;width:100%;display:none;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-accordion__item--expanded .pe-accordion__content{display:block}\n"], dependencies: [{ kind: "directive", type: CdkAccordion, selector: "cdk-accordion, [cdkAccordion]", inputs: ["multi"], exportAs: ["cdkAccordion"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AccordionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-accordion', standalone: true, template: `
+    <cdk-accordion #accordion [multi]="multi()" class="pe-accordion" [class.pe-accordion--divider]="showDivider()">
+      <ng-content />
+    </cdk-accordion>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CdkAccordion], styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-accordion{color:#fff;display:flex;flex-direction:column;gap:8px}.pe-accordion__item{min-height:48px;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.pe-accordion__item:first-child{padding-top:0}.pe-accordion__item:last-child{border-bottom:none}.pe-accordion__item--disabled{cursor:not-allowed}.pe-accordion__item--disabled .pe-accordion__trigger{cursor:not-allowed;color:#ffffff4d;background-color:#ffffff0d;pointer-events:none}.pe-accordion__item--disabled .pe-accordion__trigger:hover,.pe-accordion__item--disabled .pe-accordion__trigger:active{background-color:#ffffff0d}.pe-accordion__item--disabled .pe-accordion__indicator{color:#ffffff4d}.pe-accordion__item:after{content:\"\";display:block;width:calc(100% - 24px);border-bottom:1px solid transparent}.pe-accordion--divider ::ng-deep .pe-accordion__item:after{border-color:#ffffff1a}.pe-accordion__trigger{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;width:100%;min-height:48px;text-align:start;display:flex;align-items:center;gap:8px;border-radius:12px;padding:0 12px}.pe-accordion__trigger:hover{background-color:#fff3}.pe-accordion__trigger:active{background-color:#ffffff1a}.pe-accordion__trigger:selected{background-color:#fff3}.pe-accordion__trigger{background-color:#fff0;color:inherit}.pe-accordion__trigger:disabled,.pe-accordion__trigger[disabled]{background-color:#fff0}.pe-accordion__trigger:focus-visible,.pe-accordion__trigger:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-accordion__icon{display:flex;align-items:center;font-size:32px;line-height:32px}.pe-accordion__label{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;flex:1}.pe-accordion__status{display:flex;gap:8px}.pe-accordion__indicator{color:#ffffffb3;transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-accordion__item--expanded .pe-accordion__indicator{transform:rotate(180deg)}.pe-accordion__content{color:#ffffffb3;background-color:transparent;padding:12px;width:100%;display:none;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-accordion__item--expanded .pe-accordion__content{display:block}\n"] }]
+        }], propDecorators: { showDivider: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDivider", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], accordionItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AccordionItemComponent), { ...{
+                            read: CdkAccordionItem,
+                        }, isSignal: true }] }] } });
+
+/**
+ * A code display component that shows code with automatic line numbering.
+ * Features a clean two-column layout following PE design guidelines.
+ *
+ * @example
+ * <pe-area-code
+ *   [content]="codeContent"
+ *   [showLineNumbers]="true"
+ * />
+ */
+class AreaCodeComponent {
+    // Core inputs
+    content = input('', ...(ngDevMode ? [{ debugName: "content" }] : []));
+    showLineNumbers = input(true, ...(ngDevMode ? [{ debugName: "showLineNumbers" }] : []));
+    maxHeight = input(null, ...(ngDevMode ? [{ debugName: "maxHeight" }] : []));
+    // Computed properties
+    lines = computed(() => {
+        const content = this.content();
+        if (!content)
+            return [''];
+        return content.split('\n');
+    }, ...(ngDevMode ? [{ debugName: "lines" }] : []));
+    lineCount = computed(() => this.lines().length, ...(ngDevMode ? [{ debugName: "lineCount" }] : []));
+    lineNumbers = computed(() => {
+        const count = this.lineCount();
+        return Array.from({ length: count }, (_, i) => i + 1);
+    }, ...(ngDevMode ? [{ debugName: "lineNumbers" }] : []));
+    // Component properties
+    codeId = `pe-area-code-${Math.random().toString(36).slice(2, 11)}`;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AreaCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: AreaCodeComponent, isStandalone: true, selector: "pe-area-code", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, showLineNumbers: { classPropertyName: "showLineNumbers", publicName: "showLineNumbers", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"pe-area-code\" [class.pe-area-code--no-line-numbers]=\"!showLineNumbers()\">\n  <div class=\"pe-area-code__container pe-scrollable\" [style.max-height]=\"maxHeight()\">\n    <!-- Code Display Area -->\n    <div class=\"pe-area-code__display\">\n      <!-- Line Numbers Column -->\n      @if (showLineNumbers()) {\n        <div class=\"pe-area-code__line-numbers\" role=\"presentation\" aria-hidden=\"true\">\n          @for (lineNumber of lineNumbers(); track lineNumber) {\n            <span class=\"pe-area-code__line-number\">{{ lineNumber }}.</span>\n          }\n        </div>\n      }\n      <!-- Code Content Column -->\n      <div class=\"pe-area-code__content\">\n        <pre class=\"pe-area-code__code\" [id]=\"codeId\"><code>{{ content() }}</code></pre>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-area-code{position:relative;display:block;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-area-code__container{position:relative;border-radius:16px;border:2px solid rgba(255,255,255,.1);background-color:#ffffff1a}.pe-area-code__display{display:flex;min-height:2rem;overflow-x:auto}.pe-area-code__line-numbers{flex-shrink:0;display:flex;flex-direction:column;padding:12px 8px;border-right:2px solid rgba(255,255,255,.1);color:#ffffff80;-webkit-user-select:none;user-select:none;min-width:3rem;text-align:right}.pe-area-code__line-number{display:block;white-space:nowrap;padding-right:4px}.pe-area-code__content{flex:1;overflow-x:auto}.pe-area-code__code{display:block;margin:0;padding:12px;background:transparent;color:#fff;white-space:pre;overflow-x:auto;overflow-y:visible;tab-size:2}.pe-area-code__code code{background:transparent;padding:0;font-size:inherit;line-height:inherit;font-family:inherit;color:inherit}.pe-area-code--no-line-numbers .pe-area-code__code{padding-left:16px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AreaCodeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-area-code', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pe-area-code\" [class.pe-area-code--no-line-numbers]=\"!showLineNumbers()\">\n  <div class=\"pe-area-code__container pe-scrollable\" [style.max-height]=\"maxHeight()\">\n    <!-- Code Display Area -->\n    <div class=\"pe-area-code__display\">\n      <!-- Line Numbers Column -->\n      @if (showLineNumbers()) {\n        <div class=\"pe-area-code__line-numbers\" role=\"presentation\" aria-hidden=\"true\">\n          @for (lineNumber of lineNumbers(); track lineNumber) {\n            <span class=\"pe-area-code__line-number\">{{ lineNumber }}.</span>\n          }\n        </div>\n      }\n      <!-- Code Content Column -->\n      <div class=\"pe-area-code__content\">\n        <pre class=\"pe-area-code__code\" [id]=\"codeId\"><code>{{ content() }}</code></pre>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-area-code{position:relative;display:block;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-area-code__container{position:relative;border-radius:16px;border:2px solid rgba(255,255,255,.1);background-color:#ffffff1a}.pe-area-code__display{display:flex;min-height:2rem;overflow-x:auto}.pe-area-code__line-numbers{flex-shrink:0;display:flex;flex-direction:column;padding:12px 8px;border-right:2px solid rgba(255,255,255,.1);color:#ffffff80;-webkit-user-select:none;user-select:none;min-width:3rem;text-align:right}.pe-area-code__line-number{display:block;white-space:nowrap;padding-right:4px}.pe-area-code__content{flex:1;overflow-x:auto}.pe-area-code__code{display:block;margin:0;padding:12px;background:transparent;color:#fff;white-space:pre;overflow-x:auto;overflow-y:visible;tab-size:2}.pe-area-code__code code{background:transparent;padding:0;font-size:inherit;line-height:inherit;font-family:inherit;color:inherit}.pe-area-code--no-line-numbers .pe-area-code__code{padding-left:16px}\n"] }]
+        }], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], showLineNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLineNumbers", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }] } });
+
+// <pe-icon class="pe-icon pe-icon-size-${size} pe-icon-weight-${weight} pe-icon-${icon}" />
+class IconComponent {
+    size = input('8', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    weight = input('medium', ...(ngDevMode ? [{ debugName: "weight" }] : []));
+    icon = input.required(...(ngDevMode ? [{ debugName: "icon" }] : []));
+    hostClasses = computed(() => {
+        return `pe-icon pe-icon-size-${this.size()} pe-icon-weight-${this.weight()} pe-icon-${this.icon()}`;
+    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: IconComponent, isStandalone: true, selector: "pe-icon", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pe-icon',
+                    standalone: true,
+                    template: ``,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        '[class]': 'hostClasses()'
+                    }
+                }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], weight: [{ type: i0.Input, args: [{ isSignal: true, alias: "weight", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }] } });
+
+class SkeletonComponent {
+    variant = input('rect', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    width = input(null, ...(ngDevMode ? [{ debugName: "width" }] : []));
+    height = input(null, ...(ngDevMode ? [{ debugName: "height" }] : []));
+    lines = input(3, ...(ngDevMode ? [{ debugName: "lines" }] : []));
+    borderRadius = input(null, ...(ngDevMode ? [{ debugName: "borderRadius" }] : []));
+    show = input(true, ...(ngDevMode ? [{ debugName: "show" }] : []));
+    hostStyles = computed(() => {
+        const width = this.width();
+        const height = this.height();
+        return {
+            width: width ?? null,
+            height: height ?? null,
+        };
+    }, ...(ngDevMode ? [{ debugName: "hostStyles" }] : []));
+    lineWidths = computed(() => {
+        const count = Math.max(1, this.lines());
+        const widths = [];
+        for (let index = 0; index < count; index += 1) {
+            const base = 100;
+            const step = 8;
+            const value = Math.max(40, base - index * step);
+            widths.push(`${value}%`);
+        }
+        return widths;
+    }, ...(ngDevMode ? [{ debugName: "lineWidths" }] : []));
+    radiusClass = computed(() => {
+        const radius = this.borderRadius();
+        return radius ? `pe-skeleton--radius-${radius}` : null;
+    }, ...(ngDevMode ? [{ debugName: "radiusClass" }] : []));
+    trackByIndex(index) {
+        return index;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: SkeletonComponent, isStandalone: true, selector: "pe-skeleton", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, lines: { classPropertyName: "lines", publicName: "lines", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"pe-skeleton\"\n  [class.pe-skeleton--active]=\"show()\"\n  [class.pe-skeleton--rect]=\"variant() === 'rect'\"\n  [class.pe-skeleton--text]=\"variant() === 'text'\"\n  [class]=\"radiusClass() || ''\"\n  [style.width]=\"hostStyles().width\"\n  [style.height]=\"hostStyles().height\"\n>\n  <div class=\"pe-skeleton__content\">\n    <ng-content />\n  </div>\n\n  @if (show()) {\n    @if (variant() === 'text') {\n      <div class=\"pe-skeleton__overlay pe-skeleton__overlay--text\">\n        @for (lineWidth of lineWidths(); track trackByIndex($index)) {\n          <div class=\"pe-skeleton__block pe-skeleton__block--line\" [style.width]=\"lineWidth\"></div>\n        }\n      </div>\n    } @else {\n      <div class=\"pe-skeleton__overlay pe-skeleton__overlay--rect\">\n        <div class=\"pe-skeleton__block pe-skeleton__block--rect\"></div>\n      </div>\n    }\n  }\n</div>\n\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-skeleton{position:relative;display:block;overflow:hidden}.pe-skeleton__content{transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-skeleton--active .pe-skeleton__content{opacity:0}.pe-skeleton__overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:4px;pointer-events:none}.pe-skeleton__block{display:block;width:100%;height:100%;border-radius:8px;background-color:#3b3b3b;background-image:linear-gradient(90deg,#fff0,#ffffff24,#fff0);background-size:200% 100%;animation:pe-skeleton-shimmer 1.2s infinite linear}.pe-skeleton__block--line{height:12px}.pe-skeleton__overlay--text .pe-skeleton__block--line:last-child{width:60%}.pe-skeleton--radius-xs .pe-skeleton__block{border-radius:4px}.pe-skeleton--radius-sm .pe-skeleton__block{border-radius:8px}.pe-skeleton--radius-md .pe-skeleton__block{border-radius:12px}.pe-skeleton--radius-lg .pe-skeleton__block{border-radius:16px}.pe-skeleton--radius-full .pe-skeleton__block{border-radius:4096px}@keyframes pe-skeleton-shimmer{0%{background-position:-100% 0}to{background-position:100% 0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SkeletonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-skeleton', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-skeleton\"\n  [class.pe-skeleton--active]=\"show()\"\n  [class.pe-skeleton--rect]=\"variant() === 'rect'\"\n  [class.pe-skeleton--text]=\"variant() === 'text'\"\n  [class]=\"radiusClass() || ''\"\n  [style.width]=\"hostStyles().width\"\n  [style.height]=\"hostStyles().height\"\n>\n  <div class=\"pe-skeleton__content\">\n    <ng-content />\n  </div>\n\n  @if (show()) {\n    @if (variant() === 'text') {\n      <div class=\"pe-skeleton__overlay pe-skeleton__overlay--text\">\n        @for (lineWidth of lineWidths(); track trackByIndex($index)) {\n          <div class=\"pe-skeleton__block pe-skeleton__block--line\" [style.width]=\"lineWidth\"></div>\n        }\n      </div>\n    } @else {\n      <div class=\"pe-skeleton__overlay pe-skeleton__overlay--rect\">\n        <div class=\"pe-skeleton__block pe-skeleton__block--rect\"></div>\n      </div>\n    }\n  }\n</div>\n\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-skeleton{position:relative;display:block;overflow:hidden}.pe-skeleton__content{transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-skeleton--active .pe-skeleton__content{opacity:0}.pe-skeleton__overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:4px;pointer-events:none}.pe-skeleton__block{display:block;width:100%;height:100%;border-radius:8px;background-color:#3b3b3b;background-image:linear-gradient(90deg,#fff0,#ffffff24,#fff0);background-size:200% 100%;animation:pe-skeleton-shimmer 1.2s infinite linear}.pe-skeleton__block--line{height:12px}.pe-skeleton__overlay--text .pe-skeleton__block--line:last-child{width:60%}.pe-skeleton--radius-xs .pe-skeleton__block{border-radius:4px}.pe-skeleton--radius-sm .pe-skeleton__block{border-radius:8px}.pe-skeleton--radius-md .pe-skeleton__block{border-radius:12px}.pe-skeleton--radius-lg .pe-skeleton__block{border-radius:16px}.pe-skeleton--radius-full .pe-skeleton__block{border-radius:4096px}@keyframes pe-skeleton-shimmer{0%{background-position:-100% 0}to{background-position:100% 0}}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], lines: [{ type: i0.Input, args: [{ isSignal: true, alias: "lines", required: false }] }], borderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderRadius", required: false }] }], show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }] } });
+
+/**
+ * A reusable avatar component that displays user images, initials, or icons.
+ * Supports multiple sizes and fallback options when an image is not available.
+ * @example
+ * <pe-avatar size="md" [src]="userImageUrl" [initials]="'JD'" />
+ */
+class AvatarComponent {
+    /** The size of the avatar */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** The image source URL */
+    src = input(undefined, ...(ngDevMode ? [{ debugName: "src" }] : []));
+    /** Fallback initials to display when image is not available */
+    initials = input(undefined, ...(ngDevMode ? [{ debugName: "initials" }] : []));
+    /** Fallback icon to display when image and initials are not available */
+    icon = input(undefined, ...(ngDevMode ? [{ debugName: "icon" }] : []));
+    /** Alt text for the avatar image */
+    alt = input('', ...(ngDevMode ? [{ debugName: "alt" }] : []));
+    /** Show a skeleton placeholder instead of content while loading. */
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    /** Internal signal to track image loading errors */
+    imageError = signal(false, ...(ngDevMode ? [{ debugName: "imageError" }] : []));
+    /** Computed icon size based on avatar size */
+    iconSize = computed(() => {
+        const sizeMap = {
+            sm: '5',
+            md: '6',
+            lg: '7',
+            xl: '8',
+        };
+        return sizeMap[this.size()];
+    }, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
+    constructor() {
+        // Reset image error when src changes
+        effect(() => {
+            this.src();
+            this.imageError.set(false);
+        });
+    }
+    /** Handles image loading errors */
+    handleImageError() {
+        this.imageError.set(true);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: AvatarComponent, isStandalone: true, selector: "pe-avatar", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, initials: { classPropertyName: "initials", publicName: "initials", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <pe-skeleton class="pe-avatar pe-avatar--{{ size() }}" [show]="loading()" variant="rect" borderRadius="full">
+      <div class="pe-avatar pe-avatar--{{ size() }}">
+        @if (src() && !imageError()) {
+          <img
+            [src]="src()"
+            [alt]="alt()"
+            (error)="handleImageError()"
+            class="pe-avatar__image"
+          />
+        } @else if (initials()) {
+          <span class="pe-avatar__initials">{{ initials() }}</span>
+        } @else if (icon()) {
+          <pe-icon [icon]="icon()!" [size]="iconSize()" />
+        }
+      </div>
+    </pe-skeleton>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border-radius:4096px;background-color:#ffffff1a;color:#fff}.pe-avatar--sm{width:32px;height:32px;min-width:32px}.pe-avatar--md{width:40px;height:40px;min-width:40px}.pe-avatar--lg{width:48px;height:48px;min-width:48px}.pe-avatar--xl{width:64px;height:64px;min-width:64px}.pe-avatar__image{width:100%;height:100%;object-fit:cover;object-position:center}.pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;text-transform:uppercase;-webkit-user-select:none;user-select:none;line-height:1}.pe-avatar--sm .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-avatar--md .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-avatar--lg .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-avatar--xl .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-avatar .pe-icon{color:#ffffffb3}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: SkeletonComponent, selector: "pe-skeleton", inputs: ["variant", "width", "height", "lines", "borderRadius", "show"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AvatarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-avatar', standalone: true, imports: [IconComponent, SkeletonComponent], template: `
+    <pe-skeleton class="pe-avatar pe-avatar--{{ size() }}" [show]="loading()" variant="rect" borderRadius="full">
+      <div class="pe-avatar pe-avatar--{{ size() }}">
+        @if (src() && !imageError()) {
+          <img
+            [src]="src()"
+            [alt]="alt()"
+            (error)="handleImageError()"
+            class="pe-avatar__image"
+          />
+        } @else if (initials()) {
+          <span class="pe-avatar__initials">{{ initials() }}</span>
+        } @else if (icon()) {
+          <pe-icon [icon]="icon()!" [size]="iconSize()" />
+        }
+      </div>
+    </pe-skeleton>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border-radius:4096px;background-color:#ffffff1a;color:#fff}.pe-avatar--sm{width:32px;height:32px;min-width:32px}.pe-avatar--md{width:40px;height:40px;min-width:40px}.pe-avatar--lg{width:48px;height:48px;min-width:48px}.pe-avatar--xl{width:64px;height:64px;min-width:64px}.pe-avatar__image{width:100%;height:100%;object-fit:cover;object-position:center}.pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;text-transform:uppercase;-webkit-user-select:none;user-select:none;line-height:1}.pe-avatar--sm .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-avatar--md .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-avatar--lg .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-avatar--xl .pe-avatar__initials{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-avatar .pe-icon{color:#ffffffb3}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], initials: [{ type: i0.Input, args: [{ isSignal: true, alias: "initials", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }] } });
+
+/**
+ * A reusable avatar group component that displays multiple avatars with overflow handling.
+ * Supports maximum visible count and shows a "+X" indicator for remaining avatars.
+ * @example
+ * <pe-avatar-group [avatars]="userAvatars" [maxVisible]="3" size="md" />
+ */
+class AvatarGroupComponent {
+    /** Array of avatar data to display */
+    avatars = input.required(...(ngDevMode ? [{ debugName: "avatars" }] : []));
+    /** The size of all avatars in the group */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** Maximum number of avatars to display before showing overflow indicator */
+    maxVisible = input(null, ...(ngDevMode ? [{ debugName: "maxVisible" }] : []));
+    /** Whether avatars should overlap (stacked) or have spacing between them */
+    stacked = input(false, ...(ngDevMode ? [{ debugName: "stacked" }] : []));
+    /** Computed list of visible avatars */
+    visibleAvatars = computed(() => {
+        const max = this.maxVisible();
+        const avatars = this.avatars();
+        return max !== null && max > 0 ? avatars.slice(0, max) : avatars;
+    }, ...(ngDevMode ? [{ debugName: "visibleAvatars" }] : []));
+    /** Computed count of remaining avatars not shown */
+    remainingCount = computed(() => {
+        const max = this.maxVisible();
+        if (max === null || max <= 0)
+            return 0;
+        return Math.max(0, this.avatars().length - max);
+    }, ...(ngDevMode ? [{ debugName: "remainingCount" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AvatarGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: AvatarGroupComponent, isStandalone: true, selector: "pe-avatar-group", inputs: { avatars: { classPropertyName: "avatars", publicName: "avatars", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, maxVisible: { classPropertyName: "maxVisible", publicName: "maxVisible", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div class="pe-avatar-group pe-avatar-group--{{this.size()}}"
+      [class.pe-avatar-group--stacked]="stacked()"
+    >
+      @for (avatar of visibleAvatars(); track $index) {
+        <pe-avatar
+          [size]="size()"
+          [src]="avatar.src"
+          [initials]="avatar.initials"
+          [icon]="avatar.icon"
+          [alt]="avatar.alt || ''"
+          [class.pe-avatar-group__avatar]="!stacked() && $index > 0"
+        />
+      }
+      @if (remainingCount() > 0) {
+        <div class="pe-avatar-group__overflow pe-avatar-group__overflow--{{this.size()}}" 
+          [class.pe-avatar-group__overflow-avatar]="!stacked()">
+          <span class="pe-avatar-group__overflow-text">+{{ remainingCount() }}</span>
+        </div>
+      }
+    </div>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-avatar-group{display:inline-flex;align-items:center;flex-wrap:wrap}.pe-avatar-group__avatar{margin-left:-8px}.pe-avatar-group--sm .pe-avatar-group__avatar{margin-left:-4px}.pe-avatar-group--md .pe-avatar-group__avatar{margin-left:-8px}.pe-avatar-group--lg .pe-avatar-group__avatar,.pe-avatar-group--xl .pe-avatar-group__avatar{margin-left:-12px}.pe-avatar-group--stacked .pe-avatar{margin-left:0!important;border:2px solid #0a0a0a}.pe-avatar-group--stacked .pe-avatar:not(:first-child){margin-left:-8px}.pe-avatar-group--stacked.pe-avatar-group--sm .pe-avatar:not(:first-child){margin-left:-4px}.pe-avatar-group--stacked.pe-avatar-group--md .pe-avatar:not(:first-child){margin-left:-8px}.pe-avatar-group--stacked.pe-avatar-group--lg .pe-avatar:not(:first-child){margin-left:-12px}.pe-avatar-group--stacked.pe-avatar-group--xl .pe-avatar:not(:first-child){margin-left:-16px}.pe-avatar-group__overflow{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4096px;background-color:#ffffff1a;color:#fff;border:2px solid #0a0a0a}.pe-avatar-group__overflow--sm{width:32px;height:32px;min-width:32px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-avatar-group__overflow--md{width:40px;height:40px;min-width:40px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-avatar-group__overflow--lg{width:48px;height:48px;min-width:48px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-avatar-group__overflow--xl{width:64px;height:64px;min-width:64px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-avatar-group__overflow-text{-webkit-user-select:none;user-select:none;line-height:1}\n"], dependencies: [{ kind: "component", type: AvatarComponent, selector: "pe-avatar", inputs: ["size", "src", "initials", "icon", "alt", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: AvatarGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-avatar-group', standalone: true, imports: [AvatarComponent], template: `
+    <div class="pe-avatar-group pe-avatar-group--{{this.size()}}"
+      [class.pe-avatar-group--stacked]="stacked()"
+    >
+      @for (avatar of visibleAvatars(); track $index) {
+        <pe-avatar
+          [size]="size()"
+          [src]="avatar.src"
+          [initials]="avatar.initials"
+          [icon]="avatar.icon"
+          [alt]="avatar.alt || ''"
+          [class.pe-avatar-group__avatar]="!stacked() && $index > 0"
+        />
+      }
+      @if (remainingCount() > 0) {
+        <div class="pe-avatar-group__overflow pe-avatar-group__overflow--{{this.size()}}" 
+          [class.pe-avatar-group__overflow-avatar]="!stacked()">
+          <span class="pe-avatar-group__overflow-text">+{{ remainingCount() }}</span>
+        </div>
+      }
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-avatar-group{display:inline-flex;align-items:center;flex-wrap:wrap}.pe-avatar-group__avatar{margin-left:-8px}.pe-avatar-group--sm .pe-avatar-group__avatar{margin-left:-4px}.pe-avatar-group--md .pe-avatar-group__avatar{margin-left:-8px}.pe-avatar-group--lg .pe-avatar-group__avatar,.pe-avatar-group--xl .pe-avatar-group__avatar{margin-left:-12px}.pe-avatar-group--stacked .pe-avatar{margin-left:0!important;border:2px solid #0a0a0a}.pe-avatar-group--stacked .pe-avatar:not(:first-child){margin-left:-8px}.pe-avatar-group--stacked.pe-avatar-group--sm .pe-avatar:not(:first-child){margin-left:-4px}.pe-avatar-group--stacked.pe-avatar-group--md .pe-avatar:not(:first-child){margin-left:-8px}.pe-avatar-group--stacked.pe-avatar-group--lg .pe-avatar:not(:first-child){margin-left:-12px}.pe-avatar-group--stacked.pe-avatar-group--xl .pe-avatar:not(:first-child){margin-left:-16px}.pe-avatar-group__overflow{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4096px;background-color:#ffffff1a;color:#fff;border:2px solid #0a0a0a}.pe-avatar-group__overflow--sm{width:32px;height:32px;min-width:32px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-avatar-group__overflow--md{width:40px;height:40px;min-width:40px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-avatar-group__overflow--lg{width:48px;height:48px;min-width:48px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-avatar-group__overflow--xl{width:64px;height:64px;min-width:64px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-avatar-group__overflow-text{-webkit-user-select:none;user-select:none;line-height:1}\n"] }]
+        }], propDecorators: { avatars: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatars", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], maxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisible", required: false }] }], stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }] } });
+
+/**
+ * Breadcrumb component for displaying navigation hierarchy.
+ * Supports responsive collapsing on mobile devices and customizable separators.
+ *
+ * @example
+ * ```html
+ * <pe-breadcrumb
+ *   [items]="[
+ *     { label: 'Home', href: '/' },
+ *     { label: 'Products', href: '/products' },
+ *     { label: 'Current Page' }
+ *   ]"
+ * />
+ * ```
+ */
+class BreadcrumbComponent {
+    /** Array of breadcrumb items to display */
+    items = input.required(...(ngDevMode ? [{ debugName: "items" }] : []));
+    /** Separator type between breadcrumb items */
+    separator = input('chevron_right', ...(ngDevMode ? [{ debugName: "separator" }] : []));
+    /** Maximum number of items to show before collapsing (for responsive behavior) */
+    maxItems = input(undefined, ...(ngDevMode ? [{ debugName: "maxItems" }] : []));
+    /** Check if an item is the last item */
+    isLastItem(index) {
+        return index === this.items().length - 1;
+    }
+    /** Check if an item should be shown on mobile (first, last, or within maxItems) */
+    shouldShowOnMobile(index) {
+        const items = this.items();
+        const max = this.maxItems();
+        if (!max || items.length <= max)
+            return true;
+        if (index === 0)
+            return true; // Always show first
+        if (index >= items.length - 2)
+            return true; // Always show last 2
+        return false;
+    }
+    /** Check if ellipsis should be shown on mobile */
+    shouldShowEllipsisOnMobile() {
+        const items = this.items();
+        const max = this.maxItems();
+        if (!max || items.length <= max)
+            return false;
+        return items.length > max + 1; // Show ellipsis if we're hiding items
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: BreadcrumbComponent, isStandalone: true, selector: "pe-breadcrumb", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, maxItems: { classPropertyName: "maxItems", publicName: "maxItems", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav class=\"pe-breadcrumb\" aria-label=\"Breadcrumb\">\n  <ol class=\"pe-breadcrumb__list\">\n    @for (item of items(); track $index) {\n      <li\n        class=\"pe-breadcrumb__item\"\n        [class.pe-breadcrumb__item--current]=\"isLastItem($index)\"\n        [class.pe-breadcrumb__item--with-icon]=\"item.icon\"\n        [class.pe-breadcrumb__item--hidden-mobile]=\"maxItems() && !shouldShowOnMobile($index)\"\n      >\n        @if (isLastItem($index)) {\n          <span class=\"pe-breadcrumb__text\" aria-current=\"page\">\n            @if (item.icon) {\n              <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n            }\n            {{ item.label }}\n          </span>\n        } @else {\n          @if (item.href) {\n            <a [href]=\"item.href\" class=\"pe-breadcrumb__link\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </a>\n          } @else if (item.routerLink) {\n            <a [routerLink]=\"item.routerLink\" class=\"pe-breadcrumb__link\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </a>\n          } @else {\n            <span class=\"pe-breadcrumb__text\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </span>\n          }\n        }\n\n        @if (!isLastItem($index)) {\n          <span class=\"pe-breadcrumb__separator\" aria-hidden=\"true\">\n            @if (separator() === 'chevron_right') {\n              <pe-icon icon=\"chevron_right\" size=\"5\" />\n            } @else if (separator() === 'slash') {\n              <span class=\"pe-breadcrumb__separator-text\">/</span>\n            } @else if (separator() === 'dot') {\n              <span class=\"pe-breadcrumb__separator-text\">\u00B7</span>\n            }\n          </span>\n        }\n      </li>\n    }\n\n    @if (shouldShowEllipsisOnMobile()) {\n      <li class=\"pe-breadcrumb__item pe-breadcrumb__item--ellipsis\" aria-hidden=\"true\">\n        <span class=\"pe-breadcrumb__ellipsis\">...</span>\n        <span class=\"pe-breadcrumb__separator\" aria-hidden=\"true\">\n          @if (separator() === 'chevron_right') {\n            <pe-icon icon=\"chevron_right\" size=\"5\" />\n          } @else if (separator() === 'slash') {\n            <span class=\"pe-breadcrumb__separator-text\">/</span>\n          } @else if (separator() === 'dot') {\n            <span class=\"pe-breadcrumb__separator-text\">\u00B7</span>\n          }\n        </span>\n      </li>\n    }\n  </ol>\n</nav>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-breadcrumb{display:flex;align-items:center;width:100%}.pe-breadcrumb__list{display:flex;align-items:center;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}.pe-breadcrumb__item{display:flex;align-items:center;gap:4px}.pe-breadcrumb__item--current .pe-breadcrumb__text{color:#fff;font-weight:800}.pe-breadcrumb__item--with-icon .pe-breadcrumb__icon{flex-shrink:0}@media(max-width:1279px){.pe-breadcrumb__item--hidden-mobile{display:none}}@media(min-width:1024px){.pe-breadcrumb__item--ellipsis{display:none}}.pe-breadcrumb__link{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;display:inline-flex;align-items:center;gap:4px;color:#ffffffb3;text-decoration:none;transition:color .25s cubic-bezier(.4,0,.2,1)}.pe-breadcrumb__link:hover{color:#fff}.pe-breadcrumb__link:focus-visible{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px;border-radius:4px}.pe-breadcrumb__text{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;display:inline-flex;align-items:center;gap:4px;color:#fff}.pe-breadcrumb__icon{flex-shrink:0;color:inherit}.pe-breadcrumb__separator{display:inline-flex;align-items:center;color:#ffffff4d;margin:0 4px;flex-shrink:0}.pe-breadcrumb__separator-text{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;-webkit-user-select:none;user-select:none}.pe-breadcrumb__ellipsis{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;color:#ffffff4d;margin:0 4px;-webkit-user-select:none;user-select:none}@media(max-width:1279px){.pe-breadcrumb__list,.pe-breadcrumb__item{gap:4px}.pe-breadcrumb__link,.pe-breadcrumb__text{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.pe-breadcrumb__separator{margin:0 4px}}@media(min-width:1024px)and (max-width:1279px){.pe-breadcrumb__list{gap:8px}.pe-breadcrumb__item{gap:4px}.pe-breadcrumb__separator{margin:0 8px}}@media(min-width:1280px){.pe-breadcrumb__list,.pe-breadcrumb__item{gap:8px}.pe-breadcrumb__separator{margin:0 8px}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: BreadcrumbComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-breadcrumb', standalone: true, imports: [IconComponent, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<nav class=\"pe-breadcrumb\" aria-label=\"Breadcrumb\">\n  <ol class=\"pe-breadcrumb__list\">\n    @for (item of items(); track $index) {\n      <li\n        class=\"pe-breadcrumb__item\"\n        [class.pe-breadcrumb__item--current]=\"isLastItem($index)\"\n        [class.pe-breadcrumb__item--with-icon]=\"item.icon\"\n        [class.pe-breadcrumb__item--hidden-mobile]=\"maxItems() && !shouldShowOnMobile($index)\"\n      >\n        @if (isLastItem($index)) {\n          <span class=\"pe-breadcrumb__text\" aria-current=\"page\">\n            @if (item.icon) {\n              <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n            }\n            {{ item.label }}\n          </span>\n        } @else {\n          @if (item.href) {\n            <a [href]=\"item.href\" class=\"pe-breadcrumb__link\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </a>\n          } @else if (item.routerLink) {\n            <a [routerLink]=\"item.routerLink\" class=\"pe-breadcrumb__link\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </a>\n          } @else {\n            <span class=\"pe-breadcrumb__text\">\n              @if (item.icon) {\n                <pe-icon [icon]=\"item.icon\" size=\"5\" class=\"pe-breadcrumb__icon\" />\n              }\n              {{ item.label }}\n            </span>\n          }\n        }\n\n        @if (!isLastItem($index)) {\n          <span class=\"pe-breadcrumb__separator\" aria-hidden=\"true\">\n            @if (separator() === 'chevron_right') {\n              <pe-icon icon=\"chevron_right\" size=\"5\" />\n            } @else if (separator() === 'slash') {\n              <span class=\"pe-breadcrumb__separator-text\">/</span>\n            } @else if (separator() === 'dot') {\n              <span class=\"pe-breadcrumb__separator-text\">\u00B7</span>\n            }\n          </span>\n        }\n      </li>\n    }\n\n    @if (shouldShowEllipsisOnMobile()) {\n      <li class=\"pe-breadcrumb__item pe-breadcrumb__item--ellipsis\" aria-hidden=\"true\">\n        <span class=\"pe-breadcrumb__ellipsis\">...</span>\n        <span class=\"pe-breadcrumb__separator\" aria-hidden=\"true\">\n          @if (separator() === 'chevron_right') {\n            <pe-icon icon=\"chevron_right\" size=\"5\" />\n          } @else if (separator() === 'slash') {\n            <span class=\"pe-breadcrumb__separator-text\">/</span>\n          } @else if (separator() === 'dot') {\n            <span class=\"pe-breadcrumb__separator-text\">\u00B7</span>\n          }\n        </span>\n      </li>\n    }\n  </ol>\n</nav>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-breadcrumb{display:flex;align-items:center;width:100%}.pe-breadcrumb__list{display:flex;align-items:center;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}.pe-breadcrumb__item{display:flex;align-items:center;gap:4px}.pe-breadcrumb__item--current .pe-breadcrumb__text{color:#fff;font-weight:800}.pe-breadcrumb__item--with-icon .pe-breadcrumb__icon{flex-shrink:0}@media(max-width:1279px){.pe-breadcrumb__item--hidden-mobile{display:none}}@media(min-width:1024px){.pe-breadcrumb__item--ellipsis{display:none}}.pe-breadcrumb__link{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;display:inline-flex;align-items:center;gap:4px;color:#ffffffb3;text-decoration:none;transition:color .25s cubic-bezier(.4,0,.2,1)}.pe-breadcrumb__link:hover{color:#fff}.pe-breadcrumb__link:focus-visible{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px;border-radius:4px}.pe-breadcrumb__text{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;display:inline-flex;align-items:center;gap:4px;color:#fff}.pe-breadcrumb__icon{flex-shrink:0;color:inherit}.pe-breadcrumb__separator{display:inline-flex;align-items:center;color:#ffffff4d;margin:0 4px;flex-shrink:0}.pe-breadcrumb__separator-text{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;-webkit-user-select:none;user-select:none}.pe-breadcrumb__ellipsis{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500;color:#ffffff4d;margin:0 4px;-webkit-user-select:none;user-select:none}@media(max-width:1279px){.pe-breadcrumb__list,.pe-breadcrumb__item{gap:4px}.pe-breadcrumb__link,.pe-breadcrumb__text{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.pe-breadcrumb__separator{margin:0 4px}}@media(min-width:1024px)and (max-width:1279px){.pe-breadcrumb__list{gap:8px}.pe-breadcrumb__item{gap:4px}.pe-breadcrumb__separator{margin:0 8px}}@media(min-width:1280px){.pe-breadcrumb__list,.pe-breadcrumb__item{gap:8px}.pe-breadcrumb__separator{margin:0 8px}}\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], maxItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxItems", required: false }] }] } });
+
+const CSS_PREFIX = 'pe-';
+
+/**
+ * Directive that applies styling and behavior to button elements.
+ * @example
+ * <button udsButton size="md" theme="fill-purple">Click me</button>
+ */
+class ButtonDirective {
+    baseClass = `${CSS_PREFIX}btn`;
+    /** The size variant of the button */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** The theme variant of the button */
+    theme = input('fill-purple', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    /** Whether the button only contains an icon */
+    iconOnly = input(false, ...(ngDevMode ? [{ debugName: "iconOnly" }] : []));
+    /** Whether the content should be stacked vertically */
+    vertical = input(false, ...(ngDevMode ? [{ debugName: "vertical" }] : []));
+    /** Computed property for vertical state */
+    shouldBeVertical = computed(() => this.vertical() && this.size() === 'lg', ...(ngDevMode ? [{ debugName: "shouldBeVertical" }] : []));
+    /** All computed classes based on current state */
+    allClasses = computed(() => {
+        const classes = [this.baseClass]; // Base class
+        classes.push(`${this.baseClass}--${this.size()}`); // Size variant
+        classes.push(`${this.baseClass}--${this.theme()}`); // Theme variant
+        if (this.iconOnly()) {
+            classes.push(`${this.baseClass}--icon-only`); // Icon only state
+        }
+        if (this.shouldBeVertical()) {
+            classes.push(`${this.baseClass}--vertical`);
+        }
+        return classes;
+    }, ...(ngDevMode ? [{ debugName: "allClasses" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.2", type: ButtonDirective, isStandalone: true, selector: "[peButton]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "\"button\"", "class": "allClasses()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ButtonDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[peButton]',
+                    standalone: true,
+                    host: {
+                        '[attr.role]': '"button"',
+                        '[class]': 'allClasses()',
+                    },
+                }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }] } });
+
+/**
+ * A reusable button component that supports various themes, sizes, and states.
+ * @example
+ * <uds-button size="md" theme="fill-purple">Click me</uds-button>
+ */
+class ButtonComponent {
+    /** The size of the button */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** The visual theme of the button */
+    theme = input('fill-purple', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    /** Whether the button only contains an icon */
+    iconOnly = input(false, ...(ngDevMode ? [{ debugName: "iconOnly" }] : []));
+    /** Whether the button content should be stacked vertically (only applies to lg size) */
+    vertical = input(false, ...(ngDevMode ? [{ debugName: "vertical" }] : []));
+    /** Whether the button is disabled */
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    /** The button type attribute */
+    type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : []));
+    /** Optional aria-label for accessibility */
+    ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
+    /** Click event emitter with proper type safety */
+    buttonClick = output();
+    /** Handles the click event and prevents it if button is disabled */
+    handleClick(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        this.buttonClick.emit(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: ButtonComponent, isStandalone: true, selector: "pe-button", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: `
+    <button
+      peButton
+      [attr.type]="type()"
+      [attr.aria-label]="ariaLabel()"
+      [attr.aria-disabled]="disabled()"
+      [size]="size()"
+      [theme]="theme()"
+      [iconOnly]="iconOnly()"
+      [vertical]="vertical()"
+      [disabled]="disabled()"
+      (click)="handleClick($event)">
+      <ng-content />
+    </button>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-btn{border:none;cursor:pointer;padding:0;text-decoration-line:none;overflow:visible;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;box-sizing:border-box;width:100%;color:#fff}.pe-btn:focus-visible,.pe-btn:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-btn{transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1)}.pe-btn[disabled],.pe-btn:disabled{cursor:not-allowed;color:#ffffff4d}.pe-btn--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800;height:32px;min-width:96px;padding:8px 12px;border-radius:8px;gap:4px}.pe-btn--sm.pe-btn--icon-only{min-width:32px}.pe-btn--sm .pe-icon{font-size:20px;line-height:20px}.pe-btn--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;height:40px;min-width:112px;padding:8px 16px;border-radius:12px;gap:8px}.pe-btn--md.pe-btn--icon-only{min-width:40px}.pe-btn--md .pe-icon{font-size:24px;line-height:24px}.pe-btn--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;height:48px;min-width:144px;padding:8px 32px;border-radius:16px;gap:12px}.pe-btn--lg.pe-btn--icon-only{min-width:48px}.pe-btn--lg .pe-icon{font-size:28px;line-height:28px}.pe-btn--lg.pe-btn--vertical{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;flex-direction:column;height:auto;width:164px;padding:16px 32px;border-radius:24px;gap:8px}.pe-btn--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800;height:64px;min-width:144px;padding:8px 16px;border-radius:16px;gap:12px}.pe-btn--xl.pe-btn--icon-only{min-width:48px}.pe-btn--xl .pe-icon{font-size:32px;line-height:32px}.pe-btn--icon-only{padding:0}.pe-btn--fill-purple{background-color:#6f3de0;color:inherit}.pe-btn--fill-purple:hover{background-color:#7e4af7}.pe-btn--fill-purple:active{background-color:#5935af}.pe-btn--fill-purple:selected{background-color:#7e4af7}.pe-btn--fill-purple:disabled,.pe-btn--fill-purple[disabled]{background-color:#232323}.pe-btn--fill-purple{color:#fff}.pe-btn--fill-white{background-color:#fff;color:inherit}.pe-btn--fill-white:hover{background-color:#e7e7e7}.pe-btn--fill-white:active{background-color:#fff}.pe-btn--fill-white:selected{background-color:#fff}.pe-btn--fill-white:disabled,.pe-btn--fill-white[disabled]{background-color:#232323}.pe-btn--fill-white{color:#000}.pe-btn--fill-yellow{background-color:#ffe9a3;color:inherit}.pe-btn--fill-yellow:hover{background-color:#fff1c1}.pe-btn--fill-yellow:active{background-color:#ffe58f}.pe-btn--fill-yellow:selected{background-color:#fff1c1}.pe-btn--fill-yellow:disabled,.pe-btn--fill-yellow[disabled]{background-color:#232323}.pe-btn--fill-yellow{color:#000}.pe-btn--fill-red{background-color:#c33a3a;color:inherit}.pe-btn--fill-red:hover{background-color:#d64040}.pe-btn--fill-red:active{background-color:#982d2d}.pe-btn--fill-red:selected{background-color:#d64040}.pe-btn--fill-red:disabled,.pe-btn--fill-red[disabled]{background-color:#232323}.pe-btn--fill-red{color:#fff}.pe-btn--transparent-purple{background-color:#a781ff33;color:inherit}.pe-btn--transparent-purple:hover{background-color:#a781ff4d}.pe-btn--transparent-purple:active{background-color:#a781ff33}.pe-btn--transparent-purple:selected{background-color:#a781ff4d}.pe-btn--transparent-purple:disabled,.pe-btn--transparent-purple[disabled]{background-color:#ffffff0d}.pe-btn--transparent-purple{color:#c2a8ff}.pe-btn--transparent-white{background-color:#ffffff1a;color:inherit}.pe-btn--transparent-white:hover{background-color:#fff3}.pe-btn--transparent-white:active{background-color:#ffffff1a}.pe-btn--transparent-white:selected{background-color:#fff3}.pe-btn--transparent-white:disabled,.pe-btn--transparent-white[disabled]{background-color:#ffffff0d}.pe-btn--transparent-white{color:#fff}.pe-btn--transparent-red{background-color:#f3707033;color:inherit}.pe-btn--transparent-red:hover{background-color:#f370704d}.pe-btn--transparent-red:active{background-color:#f3707033}.pe-btn--transparent-red:selected{background-color:#f370704d}.pe-btn--transparent-red:disabled,.pe-btn--transparent-red[disabled]{background-color:#ffffff0d}.pe-btn--transparent-red{color:#f69d9d}.pe-btn--transparent-black{background-color:#0000004d;color:inherit}.pe-btn--transparent-black:hover{background-color:#00000080}.pe-btn--transparent-black:active{background-color:#000000b3}.pe-btn--transparent-black:selected{background-color:#00000080}.pe-btn--transparent-black:disabled,.pe-btn--transparent-black[disabled]{background-color:#ffffff0d}.pe-btn--transparent-black{color:#fff}.pe-btn--ghost-purple:hover{background-color:#a781ff4d}.pe-btn--ghost-purple:active{background-color:#a781ff33}.pe-btn--ghost-purple:selected{background-color:#a781ff4d}.pe-btn--ghost-purple{background-color:#a781ff00;color:inherit}.pe-btn--ghost-purple:disabled,.pe-btn--ghost-purple[disabled]{background-color:#a781ff00}.pe-btn--ghost-purple{color:#c2a8ff}.pe-btn--ghost-white:hover{background-color:#fff3}.pe-btn--ghost-white:active{background-color:#ffffff1a}.pe-btn--ghost-white:selected{background-color:#fff3}.pe-btn--ghost-white{background-color:#fff0;color:inherit}.pe-btn--ghost-white:disabled,.pe-btn--ghost-white[disabled]{background-color:#fff0}.pe-btn--ghost-white{color:#ffffffb3}.pe-btn--ghost-white:active,.pe-btn--ghost-white:hover{color:#fff}.pe-btn--ghost-red:hover{background-color:#f370704d}.pe-btn--ghost-red:active{background-color:#f3707033}.pe-btn--ghost-red:selected{background-color:#f370704d}.pe-btn--ghost-red{background-color:#f3707000;color:inherit}.pe-btn--ghost-red:disabled,.pe-btn--ghost-red[disabled]{background-color:#f3707000}.pe-btn--ghost-red{color:#f69d9d}.pe-btn--ghost-green:hover{background-color:#50c06c4d}.pe-btn--ghost-green:active{background-color:#50c06c33}.pe-btn--ghost-green:selected{background-color:#50c06c4d}.pe-btn--ghost-green{background-color:#50c06c00;color:inherit}.pe-btn--ghost-green:disabled,.pe-btn--ghost-green[disabled]{background-color:#50c06c00}.pe-btn--ghost-green{color:#7edc96}.pe-btn--outline-white,.pe-btn--outline-purple,.pe-btn--outline-red,.pe-btn--outline-green{transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.pe-btn--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-btn--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-btn--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-btn--outline-white:disabled,.pe-btn--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-btn--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-btn--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-btn--outline-purple:disabled,.pe-btn--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-btn--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-btn--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-btn--outline-red:disabled,.pe-btn--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-btn--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-btn--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-btn--outline-green:disabled,.pe-btn--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}\n"], dependencies: [{ kind: "directive", type: ButtonDirective, selector: "[peButton]", inputs: ["size", "theme", "iconOnly", "vertical"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-button', standalone: true, imports: [ButtonDirective], template: `
+    <button
+      peButton
+      [attr.type]="type()"
+      [attr.aria-label]="ariaLabel()"
+      [attr.aria-disabled]="disabled()"
+      [size]="size()"
+      [theme]="theme()"
+      [iconOnly]="iconOnly()"
+      [vertical]="vertical()"
+      [disabled]="disabled()"
+      (click)="handleClick($event)">
+      <ng-content />
+    </button>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-btn{border:none;cursor:pointer;padding:0;text-decoration-line:none;overflow:visible;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;box-sizing:border-box;width:100%;color:#fff}.pe-btn:focus-visible,.pe-btn:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-btn{transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1)}.pe-btn[disabled],.pe-btn:disabled{cursor:not-allowed;color:#ffffff4d}.pe-btn--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800;height:32px;min-width:96px;padding:8px 12px;border-radius:8px;gap:4px}.pe-btn--sm.pe-btn--icon-only{min-width:32px}.pe-btn--sm .pe-icon{font-size:20px;line-height:20px}.pe-btn--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;height:40px;min-width:112px;padding:8px 16px;border-radius:12px;gap:8px}.pe-btn--md.pe-btn--icon-only{min-width:40px}.pe-btn--md .pe-icon{font-size:24px;line-height:24px}.pe-btn--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;height:48px;min-width:144px;padding:8px 32px;border-radius:16px;gap:12px}.pe-btn--lg.pe-btn--icon-only{min-width:48px}.pe-btn--lg .pe-icon{font-size:28px;line-height:28px}.pe-btn--lg.pe-btn--vertical{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;flex-direction:column;height:auto;width:164px;padding:16px 32px;border-radius:24px;gap:8px}.pe-btn--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800;height:64px;min-width:144px;padding:8px 16px;border-radius:16px;gap:12px}.pe-btn--xl.pe-btn--icon-only{min-width:48px}.pe-btn--xl .pe-icon{font-size:32px;line-height:32px}.pe-btn--icon-only{padding:0}.pe-btn--fill-purple{background-color:#6f3de0;color:inherit}.pe-btn--fill-purple:hover{background-color:#7e4af7}.pe-btn--fill-purple:active{background-color:#5935af}.pe-btn--fill-purple:selected{background-color:#7e4af7}.pe-btn--fill-purple:disabled,.pe-btn--fill-purple[disabled]{background-color:#232323}.pe-btn--fill-purple{color:#fff}.pe-btn--fill-white{background-color:#fff;color:inherit}.pe-btn--fill-white:hover{background-color:#e7e7e7}.pe-btn--fill-white:active{background-color:#fff}.pe-btn--fill-white:selected{background-color:#fff}.pe-btn--fill-white:disabled,.pe-btn--fill-white[disabled]{background-color:#232323}.pe-btn--fill-white{color:#000}.pe-btn--fill-yellow{background-color:#ffe9a3;color:inherit}.pe-btn--fill-yellow:hover{background-color:#fff1c1}.pe-btn--fill-yellow:active{background-color:#ffe58f}.pe-btn--fill-yellow:selected{background-color:#fff1c1}.pe-btn--fill-yellow:disabled,.pe-btn--fill-yellow[disabled]{background-color:#232323}.pe-btn--fill-yellow{color:#000}.pe-btn--fill-red{background-color:#c33a3a;color:inherit}.pe-btn--fill-red:hover{background-color:#d64040}.pe-btn--fill-red:active{background-color:#982d2d}.pe-btn--fill-red:selected{background-color:#d64040}.pe-btn--fill-red:disabled,.pe-btn--fill-red[disabled]{background-color:#232323}.pe-btn--fill-red{color:#fff}.pe-btn--transparent-purple{background-color:#a781ff33;color:inherit}.pe-btn--transparent-purple:hover{background-color:#a781ff4d}.pe-btn--transparent-purple:active{background-color:#a781ff33}.pe-btn--transparent-purple:selected{background-color:#a781ff4d}.pe-btn--transparent-purple:disabled,.pe-btn--transparent-purple[disabled]{background-color:#ffffff0d}.pe-btn--transparent-purple{color:#c2a8ff}.pe-btn--transparent-white{background-color:#ffffff1a;color:inherit}.pe-btn--transparent-white:hover{background-color:#fff3}.pe-btn--transparent-white:active{background-color:#ffffff1a}.pe-btn--transparent-white:selected{background-color:#fff3}.pe-btn--transparent-white:disabled,.pe-btn--transparent-white[disabled]{background-color:#ffffff0d}.pe-btn--transparent-white{color:#fff}.pe-btn--transparent-red{background-color:#f3707033;color:inherit}.pe-btn--transparent-red:hover{background-color:#f370704d}.pe-btn--transparent-red:active{background-color:#f3707033}.pe-btn--transparent-red:selected{background-color:#f370704d}.pe-btn--transparent-red:disabled,.pe-btn--transparent-red[disabled]{background-color:#ffffff0d}.pe-btn--transparent-red{color:#f69d9d}.pe-btn--transparent-black{background-color:#0000004d;color:inherit}.pe-btn--transparent-black:hover{background-color:#00000080}.pe-btn--transparent-black:active{background-color:#000000b3}.pe-btn--transparent-black:selected{background-color:#00000080}.pe-btn--transparent-black:disabled,.pe-btn--transparent-black[disabled]{background-color:#ffffff0d}.pe-btn--transparent-black{color:#fff}.pe-btn--ghost-purple:hover{background-color:#a781ff4d}.pe-btn--ghost-purple:active{background-color:#a781ff33}.pe-btn--ghost-purple:selected{background-color:#a781ff4d}.pe-btn--ghost-purple{background-color:#a781ff00;color:inherit}.pe-btn--ghost-purple:disabled,.pe-btn--ghost-purple[disabled]{background-color:#a781ff00}.pe-btn--ghost-purple{color:#c2a8ff}.pe-btn--ghost-white:hover{background-color:#fff3}.pe-btn--ghost-white:active{background-color:#ffffff1a}.pe-btn--ghost-white:selected{background-color:#fff3}.pe-btn--ghost-white{background-color:#fff0;color:inherit}.pe-btn--ghost-white:disabled,.pe-btn--ghost-white[disabled]{background-color:#fff0}.pe-btn--ghost-white{color:#ffffffb3}.pe-btn--ghost-white:active,.pe-btn--ghost-white:hover{color:#fff}.pe-btn--ghost-red:hover{background-color:#f370704d}.pe-btn--ghost-red:active{background-color:#f3707033}.pe-btn--ghost-red:selected{background-color:#f370704d}.pe-btn--ghost-red{background-color:#f3707000;color:inherit}.pe-btn--ghost-red:disabled,.pe-btn--ghost-red[disabled]{background-color:#f3707000}.pe-btn--ghost-red{color:#f69d9d}.pe-btn--ghost-green:hover{background-color:#50c06c4d}.pe-btn--ghost-green:active{background-color:#50c06c33}.pe-btn--ghost-green:selected{background-color:#50c06c4d}.pe-btn--ghost-green{background-color:#50c06c00;color:inherit}.pe-btn--ghost-green:disabled,.pe-btn--ghost-green[disabled]{background-color:#50c06c00}.pe-btn--ghost-green{color:#7edc96}.pe-btn--outline-white,.pe-btn--outline-purple,.pe-btn--outline-red,.pe-btn--outline-green{transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.pe-btn--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-btn--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-btn--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-btn--outline-white:disabled,.pe-btn--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-btn--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-btn--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-btn--outline-purple:disabled,.pe-btn--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-btn--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-btn--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-btn--outline-red:disabled,.pe-btn--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-btn--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-btn--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-btn--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-btn--outline-green:disabled,.pe-btn--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}\n"] }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }] } });
+
+/**
+ * Generates unique IDs for form field elements (control, helper, error).
+ * Use this so label `for`, helper `id`, and `aria-describedby` stay in sync.
+ */
+function createFormFieldIds(prefix) {
+    const id = `${prefix}-${Math.random().toString(36).slice(2, 11)}`;
+    return {
+        controlId: id,
+        helperId: `${id}-helper`,
+        errorId: `${id}-error`,
+    };
+}
+/**
+ * Builds the value for `aria-describedby` from helper and error IDs.
+ */
+function getFormFieldDescribedBy(helperId, errorId, hasHelperText, hasError, hasErrorText) {
+    const ids = [];
+    if (hasHelperText)
+        ids.push(helperId);
+    if (hasError && hasErrorText)
+        ids.push(errorId);
+    return ids.length > 0 ? ids.join(' ') : undefined;
+}
+
+/**
+ * Shared label for form fields (input, select, textarea).
+ * Renders label text and optional required indicator.
+ */
+class FormFieldLabelComponent {
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    for = input('', ...(ngDevMode ? [{ debugName: "for" }] : []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FormFieldLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: FormFieldLabelComponent, isStandalone: true, selector: "pe-form-field-label", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    @if (label()) {
+      <label
+        [attr.for]="for()"
+        class="pe-form-field__label pe-form-field__label--{{size()}}"
+        [class.pe-form-field__label--required]="required()"
+      >
+        {{ label() }}
+        @if (required()) {
+          <span class="pe-form-field__required-indicator" aria-hidden="true" title="Required"> * </span>
+        }
+      </label>
+    }
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-form-field__label{color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-form-field__label--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-form-field__label--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-form-field__helper-text{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-form-field__helper-text--error{color:#f69d9d}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FormFieldLabelComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-form-field-label', standalone: true, template: `
+    @if (label()) {
+      <label
+        [attr.for]="for()"
+        class="pe-form-field__label pe-form-field__label--{{size()}}"
+        [class.pe-form-field__label--required]="required()"
+      >
+        {{ label() }}
+        @if (required()) {
+          <span class="pe-form-field__required-indicator" aria-hidden="true" title="Required"> * </span>
+        }
+      </label>
+    }
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-form-field__label{color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-form-field__label--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-form-field__label--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-form-field__helper-text{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-form-field__helper-text--error{color:#f69d9d}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], for: [{ type: i0.Input, args: [{ isSignal: true, alias: "for", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+/**
+ * Shared helper/error text for form fields (input, select, textarea).
+ * Shows error text when in error state, otherwise helper text.
+ */
+class FormFieldHelperComponent {
+    id = input.required(...(ngDevMode ? [{ debugName: "id" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FormFieldHelperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: FormFieldHelperComponent, isStandalone: true, selector: "pe-form-field-helper", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <span
+      [id]="id()"
+      class="pe-form-field__helper-text"
+      [class.pe-form-field__helper-text--error]="error()"
+    >
+      @if (error() && errorText()) {
+        {{ errorText() }}
+      } @else {
+        {{ helperText() }}
+      }
+    </span>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-form-field__label{color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-form-field__label--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-form-field__label--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-form-field__helper-text{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-form-field__helper-text--error{color:#f69d9d}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FormFieldHelperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-form-field-helper', standalone: true, template: `
+    <span
+      [id]="id()"
+      class="pe-form-field__helper-text"
+      [class.pe-form-field__helper-text--error]="error()"
+    >
+      @if (error() && errorText()) {
+        {{ errorText() }}
+      } @else {
+        {{ helperText() }}
+      }
+    </span>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-form-field__label{color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--sm{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800}.pe-form-field__label--md{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800}.pe-form-field__label--lg{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800}.pe-form-field__label--xl{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-form-field__helper-text{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-form-field__helper-text--error{color:#f69d9d}\n"] }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }] } });
+
+/**
+ * Calendar component. Implements FormValueControl&lt;Date | null&gt; for Signal Forms [formField].
+ * Use [(value)] or [formField]="myForm().date". Form model field should be Date | null.
+ */
+class CalendarComponent {
+    mode = input('date', ...(ngDevMode ? [{ debugName: "mode" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    minDate = input(null, ...(ngDevMode ? [{ debugName: "minDate" }] : []));
+    maxDate = input(null, ...(ngDevMode ? [{ debugName: "maxDate" }] : []));
+    minTime = input(null, ...(ngDevMode ? [{ debugName: "minTime" }] : []));
+    maxTime = input(null, ...(ngDevMode ? [{ debugName: "maxTime" }] : []));
+    locale = input('en-US', ...(ngDevMode ? [{ debugName: "locale" }] : []));
+    showCalendarIcon = input(true, ...(ngDevMode ? [{ debugName: "showCalendarIcon" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    ids = createFormFieldIds('pe-calendar');
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    currentMonth = signal(new Date(), ...(ngDevMode ? [{ debugName: "currentMonth" }] : []));
+    selectedTime = signal(null, ...(ngDevMode ? [{ debugName: "selectedTime" }] : []));
+    buttonSize = computed(() => {
+        const size = this.size();
+        if (size === 'sm')
+            return 'sm';
+        if (size === 'md')
+            return 'md';
+        if (size === 'lg')
+            return 'lg';
+        if (size === 'xl')
+            return 'xl';
+        return 'md';
+    }, ...(ngDevMode ? [{ debugName: "buttonSize" }] : []));
+    iconSize = computed(() => {
+        const size = this.size();
+        if (size === 'sm')
+            return '6';
+        if (size === 'md')
+            return '7';
+        if (size === 'lg')
+            return '8';
+        // xl calendar uses a slightly larger icon
+        return '10';
+    }, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
+    defaultPlaceholder = computed(() => {
+        const mode = this.mode();
+        if (this.placeholder())
+            return this.placeholder();
+        if (mode === 'date')
+            return 'Select date';
+        if (mode === 'time')
+            return 'Select time';
+        return 'Select date and time';
+    }, ...(ngDevMode ? [{ debugName: "defaultPlaceholder" }] : []));
+    displayValue = computed(() => {
+        const val = this.value();
+        if (!val)
+            return '';
+        const mode = this.mode();
+        const locale = this.locale();
+        if (mode === 'date') {
+            return new Intl.DateTimeFormat(locale, {
+                year: 'numeric',
+                month: '2-digit',
+                day: '2-digit',
+            }).format(val);
+        }
+        if (mode === 'time') {
+            return new Intl.DateTimeFormat(locale, {
+                hour: '2-digit',
+                minute: '2-digit',
+                hour12: false,
+            }).format(val);
+        }
+        return new Intl.DateTimeFormat(locale, {
+            year: 'numeric',
+            month: '2-digit',
+            day: '2-digit',
+            hour: '2-digit',
+            minute: '2-digit',
+            hour12: false,
+        }).format(val);
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : []));
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    resolvedErrorText = computed(() => this.errorText() ||
+        (this.hasError() && this.errors().length ? (this.errors()[0]?.message ?? null) : null), ...(ngDevMode ? [{ debugName: "resolvedErrorText" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.resolvedErrorText()), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    calendarDays = computed(() => {
+        const month = this.currentMonth();
+        const selected = this.value();
+        const today = new Date();
+        today.setHours(0, 0, 0, 0);
+        const firstDay = new Date(month.getFullYear(), month.getMonth(), 1);
+        const lastDay = new Date(month.getFullYear(), month.getMonth() + 1, 0);
+        const startDate = new Date(firstDay);
+        startDate.setDate(startDate.getDate() - startDate.getDay());
+        const days = [];
+        const current = new Date(startDate);
+        for (let i = 0; i < 42; i++) {
+            const date = new Date(current);
+            date.setHours(0, 0, 0, 0);
+            const isCurrentMonth = date.getMonth() === month.getMonth();
+            const isToday = date.getTime() === today.getTime();
+            const isSelected = selected !== null &&
+                date.getTime() === new Date(selected).setHours(0, 0, 0, 0);
+            const isDisabled = this.isDateDisabled(date);
+            days.push({
+                date,
+                isCurrentMonth,
+                isToday,
+                isSelected,
+                isDisabled,
+            });
+            current.setDate(current.getDate() + 1);
+        }
+        return days;
+    }, ...(ngDevMode ? [{ debugName: "calendarDays" }] : []));
+    monthYearLabel = computed(() => {
+        const month = this.currentMonth();
+        return new Intl.DateTimeFormat(this.locale(), {
+            month: 'long',
+            year: 'numeric',
+        }).format(month);
+    }, ...(ngDevMode ? [{ debugName: "monthYearLabel" }] : []));
+    hourOptions = computed(() => {
+        const hours = [];
+        for (let i = 0; i < 24; i++) {
+            hours.push(i);
+        }
+        return hours;
+    }, ...(ngDevMode ? [{ debugName: "hourOptions" }] : []));
+    minuteOptions = computed(() => {
+        const minutes = [];
+        for (let i = 0; i < 60; i += 5) {
+            minutes.push(i);
+        }
+        return minutes;
+    }, ...(ngDevMode ? [{ debugName: "minuteOptions" }] : []));
+    selectedHour = computed(() => {
+        const val = this.value();
+        if (!val)
+            return this.selectedTime()?.hour ?? 0;
+        return val.getHours();
+    }, ...(ngDevMode ? [{ debugName: "selectedHour" }] : []));
+    selectedMinute = computed(() => {
+        const val = this.value();
+        if (!val)
+            return this.selectedTime()?.minute ?? 0;
+        return val.getMinutes();
+    }, ...(ngDevMode ? [{ debugName: "selectedMinute" }] : []));
+    valueChange = output();
+    opened = output();
+    closed = output();
+    constructor() {
+        // Keep currentMonth and selectedTime in sync with the external value
+        effect(() => {
+            const val = this.value();
+            if (val) {
+                this.currentMonth.set(new Date(val.getFullYear(), val.getMonth(), 1));
+                if (this.mode() !== 'date') {
+                    this.selectedTime.set({
+                        hour: val.getHours(),
+                        minute: val.getMinutes(),
+                    });
+                }
+            }
+        });
+    }
+    /**
+     * Closes the CDK menu by simulating an Escape key press.
+     * This lets the CDK handle all focus and cleanup logic.
+     */
+    closeMenuViaEscape() {
+        const escapeEvent = new KeyboardEvent('keydown', {
+            key: 'Escape',
+            code: 'Escape',
+            keyCode: 27,
+            bubbles: true,
+            cancelable: true,
+        });
+        document.dispatchEvent(escapeEvent);
+        this.isOpen.set(false);
+        this.closed.emit();
+    }
+    isDateDisabled(date) {
+        const min = this.minDate();
+        const max = this.maxDate();
+        const dateOnly = new Date(date);
+        dateOnly.setHours(0, 0, 0, 0);
+        if (min) {
+            const minOnly = new Date(min);
+            minOnly.setHours(0, 0, 0, 0);
+            if (dateOnly < minOnly)
+                return true;
+        }
+        if (max) {
+            const maxOnly = new Date(max);
+            maxOnly.setHours(0, 0, 0, 0);
+            if (dateOnly > maxOnly)
+                return true;
+        }
+        return false;
+    }
+    isTimeDisabled(hour, minute) {
+        const min = this.minTime();
+        const max = this.maxTime();
+        if (!min && !max)
+            return false;
+        const testDate = new Date();
+        testDate.setHours(hour, minute, 0, 0);
+        if (min) {
+            const minHour = min.getHours();
+            const minMinute = min.getMinutes();
+            if (hour < minHour || (hour === minHour && minute < minMinute)) {
+                return true;
+            }
+        }
+        if (max) {
+            const maxHour = max.getHours();
+            const maxMinute = max.getMinutes();
+            if (hour > maxHour || (hour === maxHour && minute > maxMinute)) {
+                return true;
+            }
+        }
+        return false;
+    }
+    selectDate(date) {
+        if (this.isDateDisabled(date))
+            return;
+        const mode = this.mode();
+        const currentValue = this.value();
+        let newDate;
+        if (mode === 'date') {
+            newDate = new Date(date);
+            newDate.setHours(0, 0, 0, 0);
+        }
+        else if (mode === 'time') {
+            const time = this.selectedTime();
+            newDate = new Date(date);
+            if (time) {
+                newDate.setHours(time.hour, time.minute, 0, 0);
+            }
+            else {
+                newDate.setHours(0, 0, 0, 0);
+            }
+        }
+        else {
+            const time = this.selectedTime() ?? {
+                hour: currentValue?.getHours() ?? 0,
+                minute: currentValue?.getMinutes() ?? 0,
+            };
+            newDate = new Date(date);
+            newDate.setHours(time.hour, time.minute, 0, 0);
+        }
+        this.value.set(newDate);
+        this.valueChange.emit(newDate);
+        if (mode === 'date') {
+            this.closeMenuViaEscape();
+        }
+    }
+    selectTime(hour, minute) {
+        if (this.isTimeDisabled(hour, minute))
+            return;
+        this.selectedTime.set({ hour, minute });
+        const mode = this.mode();
+        const currentValue = this.value();
+        let newDate;
+        if (mode === 'time') {
+            newDate = new Date();
+            newDate.setHours(hour, minute, 0, 0);
+        }
+        else {
+            const baseDate = currentValue ?? new Date();
+            newDate = new Date(baseDate);
+            newDate.setHours(hour, minute, 0, 0);
+        }
+        this.value.set(newDate);
+        this.valueChange.emit(newDate);
+        if (mode === 'time' || mode === 'datetime') {
+            this.closeMenuViaEscape();
+        }
+    }
+    previousMonth() {
+        const current = this.currentMonth();
+        const newMonth = new Date(current.getFullYear(), current.getMonth() - 1, 1);
+        this.currentMonth.set(newMonth);
+    }
+    nextMonth() {
+        const current = this.currentMonth();
+        const newMonth = new Date(current.getFullYear(), current.getMonth() + 1, 1);
+        this.currentMonth.set(newMonth);
+    }
+    selectToday() {
+        const today = new Date();
+        today.setHours(0, 0, 0, 0);
+        this.selectDate(today);
+    }
+    clear() {
+        this.value.set(null);
+        this.valueChange.emit(null);
+        this.selectedTime.set(null);
+    }
+    open() {
+        if (this.disabled() || this.readOnly())
+            return;
+        this.isOpen.set(true);
+        this.opened.emit();
+    }
+    close() {
+        this.isOpen.set(false);
+        this.closed.emit();
+    }
+    onMenuOpened() {
+        this.isOpen.set(true);
+        this.opened.emit();
+    }
+    onMenuClosed() {
+        this.isOpen.set(false);
+        this.closed.emit();
+    }
+    focus() {
+        const trigger = document.getElementById(this.ids.controlId);
+        trigger?.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: CalendarComponent, isStandalone: true, selector: "pe-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, minTime: { classPropertyName: "minTime", publicName: "minTime", isSignal: true, isRequired: false, transformFunction: null }, maxTime: { classPropertyName: "maxTime", publicName: "maxTime", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, showCalendarIcon: { classPropertyName: "showCalendarIcon", publicName: "showCalendarIcon", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChange: "valueChange", opened: "opened", closed: "closed" }, ngImport: i0, template: "<div\n  class=\"pe-calendar pe-calendar--{{ mode() }} pe-calendar--{{ size() }}\"\n  [class.pe-calendar--error]=\"hasError()\"\n  [class.pe-calendar--disabled]=\"disabled()\"\n  [class.pe-calendar--read-only]=\"readOnly()\"\n  [class.pe-calendar--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-calendar__trigger-group\" [class.pe-calendar__trigger-group--focused]=\"isOpen()\">\n    <button\n      type=\"button\"\n      [id]=\"ids.controlId\"\n      class=\"pe-calendar__trigger\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"calendarMenu\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"ids.controlId + '-menu'\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <span\n        class=\"pe-calendar__trigger-text\"\n        [class.pe-calendar__trigger-text--placeholder]=\"!displayValue()\"\n      >\n        @if (displayValue()) {\n          {{ displayValue() }}\n        } @else {\n          {{ defaultPlaceholder() }}\n        }\n      </span>\n    </button>\n\n    @if (showCalendarIcon()) {\n      <pe-button\n        type=\"button\"\n        theme=\"ghost-white\"\n        [size]=\"buttonSize()\"\n        [iconOnly]=\"true\"\n        [disabled]=\"disabled()\"\n        [cdkMenuTriggerFor]=\"calendarMenu\"\n        class=\"pe-calendar__icon-button\"\n        ariaLabel=\"Open calendar\"\n        (cdkMenuOpened)=\"onMenuOpened()\"\n        (cdkMenuClosed)=\"onMenuClosed()\"\n      >\n        <pe-icon icon=\"calendar\" [size]=\"iconSize()\" />\n      </pe-button>\n    }\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"resolvedErrorText()\"\n    [error]=\"hasError()\"\n  />\n\n  <ng-template #calendarMenu>\n    <div cdkMenu class=\"pe-calendar__popup\" [id]=\"ids.controlId + '-menu'\">\n      @if (mode() === 'date' || mode() === 'datetime') {\n        <div class=\"pe-calendar__date-picker\">\n          <div class=\"pe-calendar__header\">\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Previous month\"\n              (buttonClick)=\"previousMonth()\"\n            >\n              <pe-icon icon=\"chevron_left\" size=\"6\" />\n            </pe-button>\n            <div class=\"pe-calendar__month-year\">{{ monthYearLabel() }}</div>\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Next month\"\n              (buttonClick)=\"nextMonth()\"\n            >\n              <pe-icon icon=\"chevron_right\" size=\"6\" />\n            </pe-button>\n          </div>\n\n          <div class=\"pe-calendar__weekdays\">\n            @for (day of ['S', 'M', 'T', 'W', 'T', 'F', 'S']; track $index) {\n              <div class=\"pe-calendar__weekday\">{{ day }}</div>\n            }\n          </div>\n\n          <div class=\"pe-calendar__days\">\n            @for (day of calendarDays(); track day.date.getTime()) {\n              <button\n                type=\"button\"\n                class=\"pe-calendar__day\"\n                [class.pe-calendar__day--current-month]=\"day.isCurrentMonth\"\n                [class.pe-calendar__day--today]=\"day.isToday\"\n                [class.pe-calendar__day--selected]=\"day.isSelected\"\n                [class.pe-calendar__day--disabled]=\"day.isDisabled\"\n                [disabled]=\"day.isDisabled\"\n                (click)=\"selectDate(day.date)\"\n              >\n                {{ day.date.getDate() }}\n              </button>\n            }\n          </div>\n        </div>\n      }\n\n      @if (mode() === 'time' || mode() === 'datetime') {\n        <div class=\"pe-calendar__time-picker\">\n          <div class=\"pe-calendar__time-controls\">\n            <select\n              class=\"pe-calendar__time-select\"\n              [value]=\"selectedHour()\"\n              (change)=\"selectTime(+$any($event.target).value, selectedMinute())\"\n            >\n              @for (hour of hourOptions(); track hour) {\n                <option [value]=\"hour\" [disabled]=\"isTimeDisabled(hour, selectedMinute())\">\n                  {{ hour.toString().padStart(2, '0') }}\n                </option>\n              }\n            </select>\n            <span class=\"pe-calendar__time-separator\">:</span>\n            <select\n              class=\"pe-calendar__time-select\"\n              [value]=\"selectedMinute()\"\n              (change)=\"selectTime(selectedHour(), +$any($event.target).value)\"\n            >\n              @for (minute of minuteOptions(); track minute) {\n                <option [value]=\"minute\" [disabled]=\"isTimeDisabled(selectedHour(), minute)\">\n                  {{ minute.toString().padStart(2, '0') }}\n                </option>\n              }\n            </select>\n          </div>\n        </div>\n      }\n\n      <div class=\"pe-calendar__actions\">\n        @if (mode() === 'date' || mode() === 'datetime') {\n          <pe-button type=\"button\" theme=\"transparent-white\" (buttonClick)=\"selectToday()\">\n            Today\n          </pe-button>\n        }\n        @if (value()) {\n          <pe-button type=\"button\" theme=\"transparent-white\" (buttonClick)=\"clear()\">\n            Clear\n          </pe-button>\n        }\n      </div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-calendar{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-calendar__trigger-group{display:flex;align-items:center;height:40px;padding:0 12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-calendar__trigger-group--focused{border-color:#ffffff80}.pe-calendar:not(.pe-calendar--disabled) .pe-calendar__trigger-group:hover{border-color:#ffffff4d}.pe-calendar__trigger{all:unset;flex:1;cursor:pointer;text-align:left;background:transparent;border:none;padding:0}.pe-calendar__trigger-text{display:block;color:#fff}.pe-calendar__trigger-text--placeholder{color:#ffffff80}.pe-calendar__trigger:disabled .pe-calendar__trigger-text{color:#ffffff4d;cursor:not-allowed}.pe-calendar__icon-button{flex-shrink:0}.pe-calendar__trigger-group--focused .pe-btn:focus-visible,.pe-calendar__trigger-group--focused .pe-btn:focus{outline:none}.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus-visible,.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus-within,.pe-calendar__trigger-group--focused .pe-calendar__trigger:hover,.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus{outline:none}.pe-calendar__popup{display:flex;flex-direction:column;gap:16px;background-color:#232323;border:2px solid rgba(255,255,255,.1);border-radius:16px;padding:16px;min-width:160px;max-width:512px}.pe-calendar__date-picker{display:flex;flex-direction:column;gap:12px}.pe-calendar__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.pe-calendar__month-year{flex:1;text-align:center;color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.pe-calendar__weekday{text-align:center;color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800;padding:4px}.pe-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.pe-calendar__day{all:unset;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;transition:background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1),color .25s cubic-bezier(.4,0,.2,1);min-height:32px}.pe-calendar__day--current-month{color:#fff}.pe-calendar__day:not(.pe-calendar__day--current-month){color:#ffffff80}.pe-calendar__day--today{border:2px solid #c2a8ff}.pe-calendar__day--selected{background-color:#6f3de0;border-color:#6f3de0;color:#fff}.pe-calendar__day--disabled{color:#ffffff4d;cursor:not-allowed;pointer-events:none}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover{background-color:#ffffff1a;color:inherit}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:hover{background-color:#fff3}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:active{background-color:#ffffff1a}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:selected{background-color:#fff3}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:disabled,.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover[disabled]{background-color:#ffffff0d}.pe-calendar__time-picker{display:flex;flex-direction:column;gap:8px}.pe-calendar__time-controls{display:flex;align-items:center;justify-content:center;gap:8px}.pe-calendar__time-select{appearance:none;background-color:transparent;border:2px solid rgba(255,255,255,.1);border-radius:8px;min-width:48px;height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#fff;cursor:pointer;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-calendar__time-select:hover:not(:disabled){border-color:#ffffff4d}.pe-calendar__time-select:focus{outline:none;border-color:#ffffff80}.pe-calendar__time-select:disabled{color:#ffffff4d;cursor:not-allowed;border-color:#ffffff1a;background-color:transparent}.pe-calendar__time-select option{background-color:#232323;color:#fff}.pe-calendar__time-select option:disabled{color:#ffffff4d}.pe-calendar__time-separator{color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-calendar__actions{display:flex;gap:8px;justify-content:flex-end;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}.pe-calendar--sm .pe-calendar__trigger-group{height:32px;padding:0 8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-calendar--sm .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;min-height:24px}.pe-calendar--md .pe-calendar__trigger-group{height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-calendar--md .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;min-height:32px}.pe-calendar--lg .pe-calendar__trigger-group{height:48px;padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-calendar--lg .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;min-height:40px}.pe-calendar--xl .pe-calendar__trigger-group{height:64px;padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-calendar--xl .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400;min-height:48px}.pe-calendar--error .pe-calendar__trigger-group{border:2px solid #f69d9d}.pe-calendar--disabled .pe-calendar__trigger-group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-calendar--disabled .pe-calendar__trigger,.pe-calendar--disabled .pe-calendar__trigger:disabled::placeholder{color:#ffffff4d}.pe-calendar--read-only .pe-calendar__trigger-group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-calendar--read-only .pe-calendar__trigger,.pe-calendar--read-only .pe-calendar__trigger:read-only::placeholder{color:#ffffffb3}@media(max-width:767px){.pe-calendar__popup{min-width:auto;width:calc(100vw - 32px);max-width:calc(100vw - 32px);box-sizing:border-box;overflow-x:hidden;position:relative}.pe-calendar__day{min-height:24px}}@media(max-width:1023px){.pe-calendar :host ::ng-deep .cdk-overlay-pane{max-width:calc(100vw - 32px)!important;margin-left:16px!important;margin-right:16px!important}}\n"], dependencies: [{ kind: "directive", type: CdkMenuTrigger, selector: "[cdkMenuTriggerFor]", inputs: ["cdkMenuTriggerFor", "cdkMenuPosition", "cdkMenuTriggerData", "cdkMenuTriggerTransformOriginOn"], outputs: ["cdkMenuOpened", "cdkMenuClosed"], exportAs: ["cdkMenuTriggerFor"] }, { kind: "directive", type: CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CalendarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-calendar', standalone: true, imports: [
+                        CdkMenuTrigger,
+                        CdkMenu,
+                        ButtonComponent,
+                        IconComponent,
+                        FormFieldLabelComponent,
+                        FormFieldHelperComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"pe-calendar pe-calendar--{{ mode() }} pe-calendar--{{ size() }}\"\n  [class.pe-calendar--error]=\"hasError()\"\n  [class.pe-calendar--disabled]=\"disabled()\"\n  [class.pe-calendar--read-only]=\"readOnly()\"\n  [class.pe-calendar--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-calendar__trigger-group\" [class.pe-calendar__trigger-group--focused]=\"isOpen()\">\n    <button\n      type=\"button\"\n      [id]=\"ids.controlId\"\n      class=\"pe-calendar__trigger\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"calendarMenu\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"ids.controlId + '-menu'\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <span\n        class=\"pe-calendar__trigger-text\"\n        [class.pe-calendar__trigger-text--placeholder]=\"!displayValue()\"\n      >\n        @if (displayValue()) {\n          {{ displayValue() }}\n        } @else {\n          {{ defaultPlaceholder() }}\n        }\n      </span>\n    </button>\n\n    @if (showCalendarIcon()) {\n      <pe-button\n        type=\"button\"\n        theme=\"ghost-white\"\n        [size]=\"buttonSize()\"\n        [iconOnly]=\"true\"\n        [disabled]=\"disabled()\"\n        [cdkMenuTriggerFor]=\"calendarMenu\"\n        class=\"pe-calendar__icon-button\"\n        ariaLabel=\"Open calendar\"\n        (cdkMenuOpened)=\"onMenuOpened()\"\n        (cdkMenuClosed)=\"onMenuClosed()\"\n      >\n        <pe-icon icon=\"calendar\" [size]=\"iconSize()\" />\n      </pe-button>\n    }\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"resolvedErrorText()\"\n    [error]=\"hasError()\"\n  />\n\n  <ng-template #calendarMenu>\n    <div cdkMenu class=\"pe-calendar__popup\" [id]=\"ids.controlId + '-menu'\">\n      @if (mode() === 'date' || mode() === 'datetime') {\n        <div class=\"pe-calendar__date-picker\">\n          <div class=\"pe-calendar__header\">\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Previous month\"\n              (buttonClick)=\"previousMonth()\"\n            >\n              <pe-icon icon=\"chevron_left\" size=\"6\" />\n            </pe-button>\n            <div class=\"pe-calendar__month-year\">{{ monthYearLabel() }}</div>\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Next month\"\n              (buttonClick)=\"nextMonth()\"\n            >\n              <pe-icon icon=\"chevron_right\" size=\"6\" />\n            </pe-button>\n          </div>\n\n          <div class=\"pe-calendar__weekdays\">\n            @for (day of ['S', 'M', 'T', 'W', 'T', 'F', 'S']; track $index) {\n              <div class=\"pe-calendar__weekday\">{{ day }}</div>\n            }\n          </div>\n\n          <div class=\"pe-calendar__days\">\n            @for (day of calendarDays(); track day.date.getTime()) {\n              <button\n                type=\"button\"\n                class=\"pe-calendar__day\"\n                [class.pe-calendar__day--current-month]=\"day.isCurrentMonth\"\n                [class.pe-calendar__day--today]=\"day.isToday\"\n                [class.pe-calendar__day--selected]=\"day.isSelected\"\n                [class.pe-calendar__day--disabled]=\"day.isDisabled\"\n                [disabled]=\"day.isDisabled\"\n                (click)=\"selectDate(day.date)\"\n              >\n                {{ day.date.getDate() }}\n              </button>\n            }\n          </div>\n        </div>\n      }\n\n      @if (mode() === 'time' || mode() === 'datetime') {\n        <div class=\"pe-calendar__time-picker\">\n          <div class=\"pe-calendar__time-controls\">\n            <select\n              class=\"pe-calendar__time-select\"\n              [value]=\"selectedHour()\"\n              (change)=\"selectTime(+$any($event.target).value, selectedMinute())\"\n            >\n              @for (hour of hourOptions(); track hour) {\n                <option [value]=\"hour\" [disabled]=\"isTimeDisabled(hour, selectedMinute())\">\n                  {{ hour.toString().padStart(2, '0') }}\n                </option>\n              }\n            </select>\n            <span class=\"pe-calendar__time-separator\">:</span>\n            <select\n              class=\"pe-calendar__time-select\"\n              [value]=\"selectedMinute()\"\n              (change)=\"selectTime(selectedHour(), +$any($event.target).value)\"\n            >\n              @for (minute of minuteOptions(); track minute) {\n                <option [value]=\"minute\" [disabled]=\"isTimeDisabled(selectedHour(), minute)\">\n                  {{ minute.toString().padStart(2, '0') }}\n                </option>\n              }\n            </select>\n          </div>\n        </div>\n      }\n\n      <div class=\"pe-calendar__actions\">\n        @if (mode() === 'date' || mode() === 'datetime') {\n          <pe-button type=\"button\" theme=\"transparent-white\" (buttonClick)=\"selectToday()\">\n            Today\n          </pe-button>\n        }\n        @if (value()) {\n          <pe-button type=\"button\" theme=\"transparent-white\" (buttonClick)=\"clear()\">\n            Clear\n          </pe-button>\n        }\n      </div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-calendar{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-calendar__trigger-group{display:flex;align-items:center;height:40px;padding:0 12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-calendar__trigger-group--focused{border-color:#ffffff80}.pe-calendar:not(.pe-calendar--disabled) .pe-calendar__trigger-group:hover{border-color:#ffffff4d}.pe-calendar__trigger{all:unset;flex:1;cursor:pointer;text-align:left;background:transparent;border:none;padding:0}.pe-calendar__trigger-text{display:block;color:#fff}.pe-calendar__trigger-text--placeholder{color:#ffffff80}.pe-calendar__trigger:disabled .pe-calendar__trigger-text{color:#ffffff4d;cursor:not-allowed}.pe-calendar__icon-button{flex-shrink:0}.pe-calendar__trigger-group--focused .pe-btn:focus-visible,.pe-calendar__trigger-group--focused .pe-btn:focus{outline:none}.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus-visible,.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus-within,.pe-calendar__trigger-group--focused .pe-calendar__trigger:hover,.pe-calendar__trigger-group--focused .pe-calendar__trigger:focus{outline:none}.pe-calendar__popup{display:flex;flex-direction:column;gap:16px;background-color:#232323;border:2px solid rgba(255,255,255,.1);border-radius:16px;padding:16px;min-width:160px;max-width:512px}.pe-calendar__date-picker{display:flex;flex-direction:column;gap:12px}.pe-calendar__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.pe-calendar__month-year{flex:1;text-align:center;color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.pe-calendar__weekday{text-align:center;color:#ffffff80;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:800;padding:4px}.pe-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.pe-calendar__day{all:unset;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;color:#fff;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;transition:background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1),color .25s cubic-bezier(.4,0,.2,1);min-height:32px}.pe-calendar__day--current-month{color:#fff}.pe-calendar__day:not(.pe-calendar__day--current-month){color:#ffffff80}.pe-calendar__day--today{border:2px solid #c2a8ff}.pe-calendar__day--selected{background-color:#6f3de0;border-color:#6f3de0;color:#fff}.pe-calendar__day--disabled{color:#ffffff4d;cursor:not-allowed;pointer-events:none}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover{background-color:#ffffff1a;color:inherit}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:hover{background-color:#fff3}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:active{background-color:#ffffff1a}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:selected{background-color:#fff3}.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover:disabled,.pe-calendar__day:not(.pe-calendar__day--disabled):not(.pe-calendar__day--selected):hover[disabled]{background-color:#ffffff0d}.pe-calendar__time-picker{display:flex;flex-direction:column;gap:8px}.pe-calendar__time-controls{display:flex;align-items:center;justify-content:center;gap:8px}.pe-calendar__time-select{appearance:none;background-color:transparent;border:2px solid rgba(255,255,255,.1);border-radius:8px;min-width:48px;height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#fff;cursor:pointer;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-calendar__time-select:hover:not(:disabled){border-color:#ffffff4d}.pe-calendar__time-select:focus{outline:none;border-color:#ffffff80}.pe-calendar__time-select:disabled{color:#ffffff4d;cursor:not-allowed;border-color:#ffffff1a;background-color:transparent}.pe-calendar__time-select option{background-color:#232323;color:#fff}.pe-calendar__time-select option:disabled{color:#ffffff4d}.pe-calendar__time-separator{color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800}.pe-calendar__actions{display:flex;gap:8px;justify-content:flex-end;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}.pe-calendar--sm .pe-calendar__trigger-group{height:32px;padding:0 8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-calendar--sm .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;min-height:24px}.pe-calendar--md .pe-calendar__trigger-group{height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-calendar--md .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;min-height:32px}.pe-calendar--lg .pe-calendar__trigger-group{height:48px;padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-calendar--lg .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;min-height:40px}.pe-calendar--xl .pe-calendar__trigger-group{height:64px;padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-calendar--xl .pe-calendar__day{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400;min-height:48px}.pe-calendar--error .pe-calendar__trigger-group{border:2px solid #f69d9d}.pe-calendar--disabled .pe-calendar__trigger-group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-calendar--disabled .pe-calendar__trigger,.pe-calendar--disabled .pe-calendar__trigger:disabled::placeholder{color:#ffffff4d}.pe-calendar--read-only .pe-calendar__trigger-group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-calendar--read-only .pe-calendar__trigger,.pe-calendar--read-only .pe-calendar__trigger:read-only::placeholder{color:#ffffffb3}@media(max-width:767px){.pe-calendar__popup{min-width:auto;width:calc(100vw - 32px);max-width:calc(100vw - 32px);box-sizing:border-box;overflow-x:hidden;position:relative}.pe-calendar__day{min-height:24px}}@media(max-width:1023px){.pe-calendar :host ::ng-deep .cdk-overlay-pane{max-width:calc(100vw - 32px)!important;margin-left:16px!important;margin-right:16px!important}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], minTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "minTime", required: false }] }], maxTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxTime", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], showCalendarIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCalendarIcon", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+class CardComponent {
+    // State inputs
+    focused = input(false, { ...(ngDevMode ? { debugName: "focused" } : {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    // Layout inputs
+    cardDirection = input('vertical', ...(ngDevMode ? [{ debugName: "cardDirection" }] : []));
+    cardCaptionSize = input('default', ...(ngDevMode ? [{ debugName: "cardCaptionSize" }] : []));
+    footerDist = input('default', ...(ngDevMode ? [{ debugName: "footerDist" }] : []));
+    // Media inputs
+    mediaAspectRatio = input('default', ...(ngDevMode ? [{ debugName: "mediaAspectRatio" }] : []));
+    mediaBlur = input(false, { ...(ngDevMode ? { debugName: "mediaBlur" } : {}), transform: booleanAttribute });
+    mediaGrayscale = input(false, { ...(ngDevMode ? { debugName: "mediaGrayscale" } : {}), transform: booleanAttribute });
+    // Content inputs
+    cardCaption = input('', ...(ngDevMode ? [{ debugName: "cardCaption" }] : []));
+    cardTitle = input('', ...(ngDevMode ? [{ debugName: "cardTitle" }] : []));
+    cardTitleSingleLine = input(false, { ...(ngDevMode ? { debugName: "cardTitleSingleLine" } : {}), transform: booleanAttribute });
+    cardSubtitle = input('', ...(ngDevMode ? [{ debugName: "cardSubtitle" }] : []));
+    cardSubtitleSingleLine = input(false, { ...(ngDevMode ? { debugName: "cardSubtitleSingleLine" } : {}), transform: booleanAttribute });
+    // Loading state
+    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: CardComponent, isStandalone: true, selector: "pe-card", inputs: { focused: { classPropertyName: "focused", publicName: "focused", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, cardDirection: { classPropertyName: "cardDirection", publicName: "cardDirection", isSignal: true, isRequired: false, transformFunction: null }, cardCaptionSize: { classPropertyName: "cardCaptionSize", publicName: "cardCaptionSize", isSignal: true, isRequired: false, transformFunction: null }, footerDist: { classPropertyName: "footerDist", publicName: "footerDist", isSignal: true, isRequired: false, transformFunction: null }, mediaAspectRatio: { classPropertyName: "mediaAspectRatio", publicName: "mediaAspectRatio", isSignal: true, isRequired: false, transformFunction: null }, mediaBlur: { classPropertyName: "mediaBlur", publicName: "mediaBlur", isSignal: true, isRequired: false, transformFunction: null }, mediaGrayscale: { classPropertyName: "mediaGrayscale", publicName: "mediaGrayscale", isSignal: true, isRequired: false, transformFunction: null }, cardCaption: { classPropertyName: "cardCaption", publicName: "cardCaption", isSignal: true, isRequired: false, transformFunction: null }, cardTitle: { classPropertyName: "cardTitle", publicName: "cardTitle", isSignal: true, isRequired: false, transformFunction: null }, cardTitleSingleLine: { classPropertyName: "cardTitleSingleLine", publicName: "cardTitleSingleLine", isSignal: true, isRequired: false, transformFunction: null }, cardSubtitle: { classPropertyName: "cardSubtitle", publicName: "cardSubtitle", isSignal: true, isRequired: false, transformFunction: null }, cardSubtitleSingleLine: { classPropertyName: "cardSubtitleSingleLine", publicName: "cardSubtitleSingleLine", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-disabled": "disabled() ? \"true\" : null", "class.pe-card--focused": "focused()", "class.pe-card--disabled": "disabled()", "class.pe-card--horizontal": "cardDirection() === \"horizontal\"", "class.pe-card--caption-sm": "cardCaptionSize() === \"sm\"", "class.pe-card--footer-equal": "footerDist() === \"equal\"", "class.pe-card--media-square": "mediaAspectRatio() === \"square\"", "class.pe-card--media-portrait": "mediaAspectRatio() === \"portrait\"", "class.pe-card--media-grayscale": "mediaGrayscale()", "class.pe-card--loading": "loading()", "class.pe-card--media-blurred": "mediaBlur()" }, classAttribute: "pe-card" }, ngImport: i0, template: "@if (loading()) {\n  <div class=\"pe-card__skeleton\">\n    <div class=\"pe-card__media\">\n      <pe-skeleton variant=\"rect\" borderRadius=\"lg\" [show]=\"true\" />\n    </div>\n    <div class=\"pe-card__content\">\n      <div class=\"pe-card__content-title pe-card__content-title--single-line\">\n        <pe-skeleton variant=\"text\" [lines]=\"2\" borderRadius=\"sm\" />\n      </div>\n      <div class=\"pe-card__content-subtitle pe-card__content-subtitle--single-line\">\n        <pe-skeleton variant=\"text\" [lines]=\"1\" borderRadius=\"sm\" />\n      </div>\n    </div>\n  </div>\n} @else {\n  <div class=\"pe-card__media\">\n    <ng-content select=\"[udsCardMedia]\" />\n    <ng-content select=\"[udsCardMediaOverlay]\" />\n  </div>\n  <div class=\"pe-card__media-action\">\n    <ng-content select=\"[udsCardMediaAction]\" />\n  </div>\n\n  <div class=\"pe-card__content\">\n    @if (cardCaption()) {\n      <div class=\"pe-card__content-caption\">\n        {{ cardCaption() }}\n      </div>\n    }\n    @if (cardTitle()) {\n      <div\n        class=\"pe-card__content-title\"\n        [class.pe-card__content-title--single-line]=\"cardTitleSingleLine()\"\n      >\n        {{ cardTitle() }}\n      </div>\n    }\n    @if (cardSubtitle()) {\n      <div\n        class=\"pe-card__content-subtitle\"\n        [class.pe-card__content-subtitle--single-line]=\"cardSubtitleSingleLine()\"\n      >\n        {{ cardSubtitle() }}\n      </div>\n    }\n  </div>\n\n  <div class=\"pe-card__footer\">\n    <ng-content select=\"[udsCardFooter]\" />\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-card{display:flex;position:relative;flex-direction:column;overflow:visible;width:100%;color:#ffffff80;border-radius:8px;gap:12px;outline:8px solid transparent;background-color:transparent;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;transition:background-color .25s cubic-bezier(.4,0,.2,1),outline .25s cubic-bezier(.4,0,.2,1)}@media(min-width:0px){.pe-card{min-width:140px}}@media(min-width:768px){.pe-card{min-width:208px}}@media(min-width:1280px){.pe-card{min-width:232px}}.pe-card:hover,.pe-card:focus,.pe-card:focus-within,.pe-card--focused{outline-color:#ffffff1a;background-color:#ffffff1a}.pe-card__media{position:relative;overflow:hidden;width:100%;background-color:#ffffff1a;border-radius:8px}@media(min-width:0px){.pe-card__media{min-height:140px}}@media(min-width:768px){.pe-card__media{min-height:208px}}@media(min-width:1280px){.pe-card__media{min-height:232px}}.pe-card__media>:first-child{width:100%;height:100%;display:block;object-fit:cover;filter:blur(var(--pe-card__media-blur, 0)) grayscale(var(--pe-card__media-grayscale, 0))}.pe-card__media>:nth-child(2){position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.pe-card__media-action{opacity:0;position:absolute;top:8px;right:8px;z-index:2;transition:opacity .15s cubic-bezier(.4,0,.2,1)}@media(max-width:1023px){.pe-card__media-action{opacity:1}}.pe-card:hover .pe-card__media-action,.pe-card:focus .pe-card__media-action,.pe-card:focus-within .pe-card__media-action{opacity:1}.pe-card__content{flex:1}.pe-card__content-caption{color:#ffffff80;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__content-title{color:#fff;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pe-card__content-title--single-line{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__content-subtitle{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pe-card__content-subtitle--single-line{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__footer{display:flex;gap:8px}.pe-card--disabled{cursor:not-allowed;pointer-events:none;opacity:.5}.pe-card--caption-sm .pe-card__content-caption{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-card--footer-equal .pe-card__footer>*{flex:1}.pe-card--media-square .pe-card__media{aspect-ratio:1/1}.pe-card--media-portrait .pe-card__media{aspect-ratio:3/4}.pe-card__media img{width:100%;height:100%;object-fit:cover}.pe-card--media-blurred{--pe-card__media-blur: 16px}.pe-card--media-blurred .pe-card__media>:first-child{fill:#0000004d}.pe-card--media-grayscale{--pe-card__media-grayscale: 1}.pe-card--media-grayscale .pe-card__media>:first-child{opacity:.5;mix-blend-mode:luminosity}.pe-card__skeleton{display:flex;flex-direction:column;gap:12px;min-height:100px}.pe-card__skeleton>.pe-skeleton:first-child{width:100%;aspect-ratio:16/9}.pe-card__skeleton-body{margin-top:12px;display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "component", type: SkeletonComponent, selector: "pe-skeleton", inputs: ["variant", "width", "height", "lines", "borderRadius", "show"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-card', standalone: true, imports: [SkeletonComponent], host: {
+                        class: 'pe-card',
+                        '[attr.aria-disabled]': 'disabled() ? "true" : null',
+                        '[class.pe-card--focused]': 'focused()',
+                        '[class.pe-card--disabled]': 'disabled()',
+                        '[class.pe-card--horizontal]': 'cardDirection() === "horizontal"',
+                        '[class.pe-card--caption-sm]': 'cardCaptionSize() === "sm"',
+                        '[class.pe-card--footer-equal]': 'footerDist() === "equal"',
+                        '[class.pe-card--media-square]': 'mediaAspectRatio() === "square"',
+                        '[class.pe-card--media-portrait]': 'mediaAspectRatio() === "portrait"',
+                        '[class.pe-card--media-grayscale]': 'mediaGrayscale()',
+                        '[class.pe-card--loading]': 'loading()',
+                        '[class.pe-card--media-blurred]': 'mediaBlur()',
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (loading()) {\n  <div class=\"pe-card__skeleton\">\n    <div class=\"pe-card__media\">\n      <pe-skeleton variant=\"rect\" borderRadius=\"lg\" [show]=\"true\" />\n    </div>\n    <div class=\"pe-card__content\">\n      <div class=\"pe-card__content-title pe-card__content-title--single-line\">\n        <pe-skeleton variant=\"text\" [lines]=\"2\" borderRadius=\"sm\" />\n      </div>\n      <div class=\"pe-card__content-subtitle pe-card__content-subtitle--single-line\">\n        <pe-skeleton variant=\"text\" [lines]=\"1\" borderRadius=\"sm\" />\n      </div>\n    </div>\n  </div>\n} @else {\n  <div class=\"pe-card__media\">\n    <ng-content select=\"[udsCardMedia]\" />\n    <ng-content select=\"[udsCardMediaOverlay]\" />\n  </div>\n  <div class=\"pe-card__media-action\">\n    <ng-content select=\"[udsCardMediaAction]\" />\n  </div>\n\n  <div class=\"pe-card__content\">\n    @if (cardCaption()) {\n      <div class=\"pe-card__content-caption\">\n        {{ cardCaption() }}\n      </div>\n    }\n    @if (cardTitle()) {\n      <div\n        class=\"pe-card__content-title\"\n        [class.pe-card__content-title--single-line]=\"cardTitleSingleLine()\"\n      >\n        {{ cardTitle() }}\n      </div>\n    }\n    @if (cardSubtitle()) {\n      <div\n        class=\"pe-card__content-subtitle\"\n        [class.pe-card__content-subtitle--single-line]=\"cardSubtitleSingleLine()\"\n      >\n        {{ cardSubtitle() }}\n      </div>\n    }\n  </div>\n\n  <div class=\"pe-card__footer\">\n    <ng-content select=\"[udsCardFooter]\" />\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-card{display:flex;position:relative;flex-direction:column;overflow:visible;width:100%;color:#ffffff80;border-radius:8px;gap:12px;outline:8px solid transparent;background-color:transparent;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;transition:background-color .25s cubic-bezier(.4,0,.2,1),outline .25s cubic-bezier(.4,0,.2,1)}@media(min-width:0px){.pe-card{min-width:140px}}@media(min-width:768px){.pe-card{min-width:208px}}@media(min-width:1280px){.pe-card{min-width:232px}}.pe-card:hover,.pe-card:focus,.pe-card:focus-within,.pe-card--focused{outline-color:#ffffff1a;background-color:#ffffff1a}.pe-card__media{position:relative;overflow:hidden;width:100%;background-color:#ffffff1a;border-radius:8px}@media(min-width:0px){.pe-card__media{min-height:140px}}@media(min-width:768px){.pe-card__media{min-height:208px}}@media(min-width:1280px){.pe-card__media{min-height:232px}}.pe-card__media>:first-child{width:100%;height:100%;display:block;object-fit:cover;filter:blur(var(--pe-card__media-blur, 0)) grayscale(var(--pe-card__media-grayscale, 0))}.pe-card__media>:nth-child(2){position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.pe-card__media-action{opacity:0;position:absolute;top:8px;right:8px;z-index:2;transition:opacity .15s cubic-bezier(.4,0,.2,1)}@media(max-width:1023px){.pe-card__media-action{opacity:1}}.pe-card:hover .pe-card__media-action,.pe-card:focus .pe-card__media-action,.pe-card:focus-within .pe-card__media-action{opacity:1}.pe-card__content{flex:1}.pe-card__content-caption{color:#ffffff80;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__content-title{color:#fff;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pe-card__content-title--single-line{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__content-subtitle{color:#ffffff80;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:800;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pe-card__content-subtitle--single-line{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.pe-card__footer{display:flex;gap:8px}.pe-card--disabled{cursor:not-allowed;pointer-events:none;opacity:.5}.pe-card--caption-sm .pe-card__content-caption{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-card--footer-equal .pe-card__footer>*{flex:1}.pe-card--media-square .pe-card__media{aspect-ratio:1/1}.pe-card--media-portrait .pe-card__media{aspect-ratio:3/4}.pe-card__media img{width:100%;height:100%;object-fit:cover}.pe-card--media-blurred{--pe-card__media-blur: 16px}.pe-card--media-blurred .pe-card__media>:first-child{fill:#0000004d}.pe-card--media-grayscale{--pe-card__media-grayscale: 1}.pe-card--media-grayscale .pe-card__media>:first-child{opacity:.5;mix-blend-mode:luminosity}.pe-card__skeleton{display:flex;flex-direction:column;gap:12px;min-height:100px}.pe-card__skeleton>.pe-skeleton:first-child{width:100%;aspect-ratio:16/9}.pe-card__skeleton-body{margin-top:12px;display:flex;flex-direction:column;gap:8px}\n"] }]
+        }], propDecorators: { focused: [{ type: i0.Input, args: [{ isSignal: true, alias: "focused", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], cardDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardDirection", required: false }] }], cardCaptionSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardCaptionSize", required: false }] }], footerDist: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerDist", required: false }] }], mediaAspectRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "mediaAspectRatio", required: false }] }], mediaBlur: [{ type: i0.Input, args: [{ isSignal: true, alias: "mediaBlur", required: false }] }], mediaGrayscale: [{ type: i0.Input, args: [{ isSignal: true, alias: "mediaGrayscale", required: false }] }], cardCaption: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardCaption", required: false }] }], cardTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardTitle", required: false }] }], cardTitleSingleLine: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardTitleSingleLine", required: false }] }], cardSubtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardSubtitle", required: false }] }], cardSubtitleSingleLine: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardSubtitleSingleLine", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }] } });
+
+class CarouselItemComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CarouselItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.2", type: CarouselItemComponent, isStandalone: true, selector: "pe-carousel-item", host: { classAttribute: "splide__slide pe-carousel__item" }, ngImport: i0, template: ` <ng-content /> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CarouselItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pe-carousel-item',
+                    standalone: true,
+                    template: ` <ng-content /> `,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        class: 'splide__slide pe-carousel__item',
+                    },
+                }]
+        }] });
+class CarouselComponent {
+    options = input({
+        autoplay: true,
+    }, ...(ngDevMode ? [{ debugName: "options" }] : []));
+    autoMount = input(true, ...(ngDevMode ? [{ debugName: "autoMount" }] : []));
+    mounted = output();
+    carousel = viewChild('carousel', ...(ngDevMode ? [{ debugName: "carousel" }] : []));
+    items = contentChildren(CarouselItemComponent, ...(ngDevMode ? [{ debugName: "items" }] : []));
+    instance = null;
+    constructor() {
+        effect(() => {
+            this.items(); // trigger change detection
+            this.updateCarouselOnItemsChange();
+        });
+    }
+    ngAfterViewInit() {
+        this.init();
+    }
+    ngOnDestroy() {
+        this.instance?.destroy();
+    }
+    // Get the Splide instance
+    getInstance() {
+        return this.instance;
+    }
+    // Methods to control the carousel
+    goNext() {
+        this.instance?.go('>');
+    }
+    goPrev() {
+        this.instance?.go('<');
+    }
+    goTo(index) {
+        this.instance?.go(index);
+    }
+    // Mount the carousel
+    mount() {
+        if (!this.instance) {
+            throw new Error('Carousel instance not found');
+        }
+        this.instance.mount();
+        this.mounted.emit(this.instance);
+    }
+    init() {
+        const carousel = this.carousel();
+        if (!carousel) {
+            throw new Error('Carousel element not found');
+        }
+        // initialize the carousel
+        this.instance = new Splide(carousel.nativeElement, {
+            arrows: false,
+            classes: {
+                page: 'splide__pagination__page pe-carousel__pagination-dot',
+            },
+            ...this.options(),
+        });
+        // mount the carousel
+        if (this.autoMount()) {
+            this.mount();
+        }
+    }
+    updateCarouselOnItemsChange() {
+        this.instance?.refresh();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.2", type: CarouselComponent, isStandalone: true, selector: "pe-carousel", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, autoMount: { classPropertyName: "autoMount", publicName: "autoMount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mounted: "mounted" }, queries: [{ propertyName: "items", predicate: CarouselItemComponent, isSignal: true }], viewQueries: [{ propertyName: "carousel", first: true, predicate: ["carousel"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div class="splide pe-carousel" #carousel role="region" aria-roledescription="carousel">
+      <div class="splide__track pe-carousel__track">
+        <div class="splide__list">
+          <ng-content />
+        </div>
+      </div>
+    </div>
+  `, isInline: true, styles: ["@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;contain:strict;display:inline-block;height:20px;inset:0;margin:auto;position:absolute;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}.pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-carousel{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr}.pe-carousel__pagination-dot{border:0;border-radius:50%;margin:1rem .2rem 0;padding:0;height:6px;width:6px;background-color:#ffffff80}.pe-carousel__pagination-dot.is-active{background-color:#fff}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CarouselComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-carousel', standalone: true, template: `
+    <div class="splide pe-carousel" #carousel role="region" aria-roledescription="carousel">
+      <div class="splide__track pe-carousel__track">
+        <div class="splide__list">
+          <ng-content />
+        </div>
+      </div>
+    </div>
+  `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;contain:strict;display:inline-block;height:20px;inset:0;margin:auto;position:absolute;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}.pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-carousel{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr}.pe-carousel__pagination-dot{border:0;border-radius:50%;margin:1rem .2rem 0;padding:0;height:6px;width:6px;background-color:#ffffff80}.pe-carousel__pagination-dot.is-active{background-color:#fff}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], autoMount: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoMount", required: false }] }], mounted: [{ type: i0.Output, args: ["mounted"] }], carousel: [{ type: i0.ViewChild, args: ['carousel', { isSignal: true }] }], items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => CarouselItemComponent), { isSignal: true }] }] } });
+
+/**
+ * Checkbox component. Implements FormCheckboxControl for Signal Forms [formField].
+ * Use [(checked)] or [formField]="myForm().acceptTerms". No value property.
+ * Uses shared form field label and helper for alignment with input, textarea, radio-group.
+ */
+class CheckboxComponent {
+    checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+    disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    indeterminate = model(false, ...(ngDevMode ? [{ debugName: "indeterminate" }] : []));
+    zone = input('none', ...(ngDevMode ? [{ debugName: "zone" }] : []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    ids = createFormFieldIds('pe-checkbox');
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    resolvedErrorText = computed(() => this.errorText() ||
+        (this.hasError() && this.errors().length ? (this.errors()[0]?.message ?? null) : null), ...(ngDevMode ? [{ debugName: "resolvedErrorText" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.resolvedErrorText()), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    onChange(event) {
+        const input = event.target;
+        this.checked.set(input.checked);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: CheckboxComponent, isStandalone: true, selector: "pe-checkbox", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, zone: { classPropertyName: "zone", publicName: "zone", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", disabled: "disabledChange", indeterminate: "indeterminateChange" }, ngImport: i0, template: `
+    <div
+      class="pe-checkbox pe-checkbox--{{ size() }}"
+      [class.pe-checkbox--accessible-zone]="zone() === 'accessible'"
+      [class.pe-checkbox--visible-zone]="zone() === 'visible'"
+      [class.pe-checkbox--checked-visible-zone]="zone() === 'checked-visible'"
+      [class.pe-checkbox--error]="hasError()"
+      [class.pe-checkbox--disabled]="disabled()"
+      [class.pe-checkbox--required]="required()"
+      [attr.aria-invalid]="hasError()"
+      [attr.aria-required]="required()"
+      [attr.aria-describedby]="describedBy()"
+    >
+      <pe-form-field-label
+        [label]="label()"
+        [required]="required()"
+        [for]="ids.controlId"
+        [size]="size() === 'sm' ? 'sm' : 'md'"
+      />
+
+      <label
+        class="pe-checkbox__row"
+        [class.pe-checkbox__row--accessible-zone]="zone() === 'accessible'"
+        [class.pe-checkbox__row--visible-zone]="zone() === 'visible'"
+        [class.pe-checkbox__row--checked-visible-zone]="zone() === 'checked-visible'"
+        [class.pe-checkbox__row--sm]="size() === 'sm'"
+        [class.pe-checkbox__row--error]="hasError()"
+        [attr.for]="ids.controlId"
+      >
+        <input
+          type="checkbox"
+          class="pe-checkbox__input"
+          [id]="ids.controlId"
+          [checked]="checked()"
+          [disabled]="disabled()"
+          [indeterminate]="indeterminate()"
+          [attr.aria-describedby]="describedBy()"
+          [attr.aria-invalid]="hasError()"
+          [attr.aria-required]="required()"
+          (change)="onChange($event)"
+        />
+        <span class="pe-checkbox__pseudo-input"></span>
+        <span class="pe-checkbox__label">
+          <ng-content />
+        </span>
+      </label>
+
+      <pe-form-field-helper
+        [id]="ids.helperId"
+        [helperText]="helperText()"
+        [errorText]="resolvedErrorText()"
+        [error]="hasError()"
+      />
+    </div>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-checkbox{display:flex;flex-direction:column;align-items:flex-start}.pe-checkbox__row{display:inline-flex;align-items:flex-start;cursor:pointer}.pe-checkbox__row:has(.pe-checkbox__input:disabled){cursor:not-allowed}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled])+.pe-checkbox__pseudo-input{box-shadow:0 0 0 2px #ffffff1a;border-color:#fff}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input,.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):indeterminate:active+.pe-checkbox__pseudo-input,.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):checked:active+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__row:has(.pe-checkbox__input:indeterminate) .pe-checkbox__pseudo-input:before{opacity:1}.pe-checkbox__row--accessible-zone{padding:12px}.pe-checkbox__row--visible-zone{padding:12px;background:#fff3;border-radius:12px}.pe-checkbox__row--checked-visible-zone{padding:12px;border-radius:12px;transition:background-color .25s cubic-bezier(.4,0,.2,1)}.pe-checkbox__row--checked-visible-zone:has(.pe-checkbox__input:checked){background:#fff3}.pe-checkbox__row--error .pe-checkbox__pseudo-input{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:focus-visible+.pe-checkbox__pseudo-input{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):active+.pe-checkbox__pseudo-input[class]{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input,.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled])+.pe-checkbox__pseudo-input{box-shadow:0 0 0 2px #ffffff1a;border-color:#f69d9d}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input,.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):indeterminate:active+.pe-checkbox__pseudo-input,.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):checked:active+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__input{position:absolute;opacity:0}.pe-checkbox__input:focus-visible+.pe-checkbox__pseudo-input{border-color:#ffffff80}.pe-checkbox__input:not([disabled]):active+.pe-checkbox__pseudo-input[class]{border-color:#fff;box-shadow:none}.pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input:before{opacity:1}.pe-checkbox__input:disabled+.pe-checkbox__pseudo-input{border-color:#ffffff1a}.pe-checkbox__input:disabled~.pe-checkbox__label{color:#ffffff4d}.pe-checkbox__input:disabled:checked+.pe-checkbox__pseudo-input{background-color:#ffffff0d;border-color:transparent}.pe-checkbox__input:disabled:checked+.pe-checkbox__pseudo-input:before{opacity:1;color:#ffffff4d}.pe-checkbox__input:indeterminate+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__input:indeterminate+.pe-checkbox__pseudo-input:before{content:\"minus_small\";opacity:1}.pe-checkbox__input[disabled]:indeterminate+.pe-checkbox__pseudo-input{background-color:#ffffff0d;border-color:transparent}.pe-checkbox__input[disabled]:indeterminate+.pe-checkbox__pseudo-input:before{opacity:1;color:#ffffff4d}.pe-checkbox__pseudo-input{margin:2px;border-radius:4px;border:1px solid rgba(255,255,255,.5);width:16px;height:16px;position:relative;flex-shrink:0;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-checkbox__pseudo-input:before{content:\"check_small\";font-family:Ultra Icons;top:-1px;left:-1px;width:16px;height:16px;position:absolute;color:#fff;line-height:16px;opacity:0;text-align:center;font-size:16px}.pe-checkbox__label{margin-left:8px;color:#fff;transition:color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-checkbox--sm .pe-checkbox__label{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-checkbox:not(.pe-checkbox--sm) .pe-checkbox__label{margin-top:-2px;margin-bottom:-2px}\n"], dependencies: [{ kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-checkbox', standalone: true, imports: [FormFieldLabelComponent, FormFieldHelperComponent], template: `
+    <div
+      class="pe-checkbox pe-checkbox--{{ size() }}"
+      [class.pe-checkbox--accessible-zone]="zone() === 'accessible'"
+      [class.pe-checkbox--visible-zone]="zone() === 'visible'"
+      [class.pe-checkbox--checked-visible-zone]="zone() === 'checked-visible'"
+      [class.pe-checkbox--error]="hasError()"
+      [class.pe-checkbox--disabled]="disabled()"
+      [class.pe-checkbox--required]="required()"
+      [attr.aria-invalid]="hasError()"
+      [attr.aria-required]="required()"
+      [attr.aria-describedby]="describedBy()"
+    >
+      <pe-form-field-label
+        [label]="label()"
+        [required]="required()"
+        [for]="ids.controlId"
+        [size]="size() === 'sm' ? 'sm' : 'md'"
+      />
+
+      <label
+        class="pe-checkbox__row"
+        [class.pe-checkbox__row--accessible-zone]="zone() === 'accessible'"
+        [class.pe-checkbox__row--visible-zone]="zone() === 'visible'"
+        [class.pe-checkbox__row--checked-visible-zone]="zone() === 'checked-visible'"
+        [class.pe-checkbox__row--sm]="size() === 'sm'"
+        [class.pe-checkbox__row--error]="hasError()"
+        [attr.for]="ids.controlId"
+      >
+        <input
+          type="checkbox"
+          class="pe-checkbox__input"
+          [id]="ids.controlId"
+          [checked]="checked()"
+          [disabled]="disabled()"
+          [indeterminate]="indeterminate()"
+          [attr.aria-describedby]="describedBy()"
+          [attr.aria-invalid]="hasError()"
+          [attr.aria-required]="required()"
+          (change)="onChange($event)"
+        />
+        <span class="pe-checkbox__pseudo-input"></span>
+        <span class="pe-checkbox__label">
+          <ng-content />
+        </span>
+      </label>
+
+      <pe-form-field-helper
+        [id]="ids.helperId"
+        [helperText]="helperText()"
+        [errorText]="resolvedErrorText()"
+        [error]="hasError()"
+      />
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-checkbox{display:flex;flex-direction:column;align-items:flex-start}.pe-checkbox__row{display:inline-flex;align-items:flex-start;cursor:pointer}.pe-checkbox__row:has(.pe-checkbox__input:disabled){cursor:not-allowed}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled])+.pe-checkbox__pseudo-input{box-shadow:0 0 0 2px #ffffff1a;border-color:#fff}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input,.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):indeterminate:active+.pe-checkbox__pseudo-input,.pe-checkbox__row:hover .pe-checkbox__input:not([disabled]):checked:active+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__row:has(.pe-checkbox__input:indeterminate) .pe-checkbox__pseudo-input:before{opacity:1}.pe-checkbox__row--accessible-zone{padding:12px}.pe-checkbox__row--visible-zone{padding:12px;background:#fff3;border-radius:12px}.pe-checkbox__row--checked-visible-zone{padding:12px;border-radius:12px;transition:background-color .25s cubic-bezier(.4,0,.2,1)}.pe-checkbox__row--checked-visible-zone:has(.pe-checkbox__input:checked){background:#fff3}.pe-checkbox__row--error .pe-checkbox__pseudo-input{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:focus-visible+.pe-checkbox__pseudo-input{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):active+.pe-checkbox__pseudo-input[class]{border-color:#f69d9d}.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input,.pe-checkbox__row--error .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled])+.pe-checkbox__pseudo-input{box-shadow:0 0 0 2px #ffffff1a;border-color:#f69d9d}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):indeterminate+.pe-checkbox__pseudo-input,.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):indeterminate:active+.pe-checkbox__pseudo-input,.pe-checkbox__row--error:hover .pe-checkbox__input:not([disabled]):checked:active+.pe-checkbox__pseudo-input{background-color:#c33a3a;border-color:#c33a3a}.pe-checkbox__input{position:absolute;opacity:0}.pe-checkbox__input:focus-visible+.pe-checkbox__pseudo-input{border-color:#ffffff80}.pe-checkbox__input:not([disabled]):active+.pe-checkbox__pseudo-input[class]{border-color:#fff;box-shadow:none}.pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__input:not([disabled]):checked+.pe-checkbox__pseudo-input:before{opacity:1}.pe-checkbox__input:disabled+.pe-checkbox__pseudo-input{border-color:#ffffff1a}.pe-checkbox__input:disabled~.pe-checkbox__label{color:#ffffff4d}.pe-checkbox__input:disabled:checked+.pe-checkbox__pseudo-input{background-color:#ffffff0d;border-color:transparent}.pe-checkbox__input:disabled:checked+.pe-checkbox__pseudo-input:before{opacity:1;color:#ffffff4d}.pe-checkbox__input:indeterminate+.pe-checkbox__pseudo-input{background-color:#6f3de0;border-color:#6f3de0}.pe-checkbox__input:indeterminate+.pe-checkbox__pseudo-input:before{content:\"minus_small\";opacity:1}.pe-checkbox__input[disabled]:indeterminate+.pe-checkbox__pseudo-input{background-color:#ffffff0d;border-color:transparent}.pe-checkbox__input[disabled]:indeterminate+.pe-checkbox__pseudo-input:before{opacity:1;color:#ffffff4d}.pe-checkbox__pseudo-input{margin:2px;border-radius:4px;border:1px solid rgba(255,255,255,.5);width:16px;height:16px;position:relative;flex-shrink:0;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-checkbox__pseudo-input:before{content:\"check_small\";font-family:Ultra Icons;top:-1px;left:-1px;width:16px;height:16px;position:absolute;color:#fff;line-height:16px;opacity:0;text-align:center;font-size:16px}.pe-checkbox__label{margin-left:8px;color:#fff;transition:color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-checkbox--sm .pe-checkbox__label{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-checkbox:not(.pe-checkbox--sm) .pe-checkbox__label{margin-top:-2px;margin-bottom:-2px}\n"] }]
+        }], propDecorators: { checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }, { type: i0.Output, args: ["indeterminateChange"] }], zone: [{ type: i0.Input, args: [{ isSignal: true, alias: "zone", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }] } });
+
+/**
+ * A collapsible content component that supports both text and icon variants.
+ * Uses CSS transitions for smooth animations and provides accessibility features.
+ *
+ * @example
+ * ```html
+ * <pe-collapse [maxHeight]="300" variant="text">
+ *   <div>Collapsible content here</div>
+ * </pe-collapse>
+ * ```
+ */
+class CollapseComponent {
+    destroyRef = inject(DestroyRef);
+    content;
+    /**
+     * The visual variant of the collapse toggle.
+     * @default 'text'
+     */
+    variant = input('text', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    /**
+     * Controls the collapsed state of the component.
+     * @default true
+     */
+    collapsed = model(true, ...(ngDevMode ? [{ debugName: "collapsed" }] : []));
+    /**
+     * Maximum height of the content when collapsed.
+     * @default 200
+     */
+    maxHeight = input.required(...(ngDevMode ? [{ debugName: "maxHeight" }] : []));
+    /**
+     * Custom label for the expand action.
+     * @default 'See more'
+     */
+    expandLabel = input('See more', ...(ngDevMode ? [{ debugName: "expandLabel" }] : []));
+    /**
+     * Custom label for the collapse action.
+     * @default 'See less'
+     */
+    collapseLabel = input('See less', ...(ngDevMode ? [{ debugName: "collapseLabel" }] : []));
+    /** Current full height of the content */
+    fullHeight = signal(0, ...(ngDevMode ? [{ debugName: "fullHeight" }] : []));
+    /** Whether the content is collapsible based on its height */
+    isCollapsible = computed(() => {
+        const max = Math.max(0, this.maxHeight());
+        return this.fullHeight() > max;
+    }, ...(ngDevMode ? [{ debugName: "isCollapsible" }] : []));
+    ngAfterViewInit() {
+        // Initial height calculation
+        this.updateFullHeight();
+        // Listen for window resize events to recalculate height
+        const resizeSubscription = fromEvent(window, 'resize')
+            .pipe(debounceTime(100))
+            .subscribe(() => this.updateFullHeight());
+        this.destroyRef.onDestroy(() => resizeSubscription.unsubscribe());
+    }
+    /** Updates the full height of the content */
+    updateFullHeight() {
+        if (this.content?.nativeElement) {
+            this.fullHeight.set(this.content.nativeElement.scrollHeight);
+        }
+    }
+    /** Toggles the collapsed state */
+    toggle() {
+        this.collapsed.set(!this.collapsed());
+    }
+    onToggleKeydown(event) {
+        if (event.key === ' ' || event.key === 'Enter') {
+            event.preventDefault();
+            this.toggle();
+        }
+    }
+    computedClasses = computed(() => {
+        return {
+            'pe-collapse': true,
+            'pe-collapse--collapsed': this.isCollapsible() && this.collapsed(),
+        };
+    }, ...(ngDevMode ? [{ debugName: "computedClasses" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CollapseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: CollapseComponent, isStandalone: true, selector: "pe-collapse", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: true, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, host: { attributes: { "role": "region" }, properties: { "style.--pe-collapse-max-height.px": "maxHeight()", "style.--pe-collapse-full-height.px": "fullHeight()" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: `
+    <div [class]="computedClasses()">
+      <div class="pe-collapse__content" #content [attr.aria-expanded]="!collapsed()" [attr.aria-hidden]="collapsed()">
+        <ng-content />
+      </div>
+      @if (isCollapsible()) {
+        <div class="pe-collapse__toggle">
+          <pe-button
+            theme="ghost-white"
+            [iconOnly]="variant() === 'icon'"
+            class="pe-collapse__toggle-button"
+            (click)="toggle()"
+            (keydown)="onToggleKeydown($event)"
+            [attr.aria-label]="collapsed() ? expandLabel() : collapseLabel()">
+            @if (variant() === 'text') {
+              <span>
+                {{ collapsed() ? expandLabel() : collapseLabel() }}
+              </span>
+            } @else if (variant() === 'icon') {
+              <pe-icon size="6" icon="chevron_up" />
+            }
+          </pe-button>
+        </div>
+      }
+    </div>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-collapse__content{position:relative;overflow:hidden;height:var(--pe-collapse-full-height);transition:height .25s cubic-bezier(.4,0,.2,1)}.pe-collapse__toggle{display:flex;align-items:center;justify-content:center;width:100%;padding:4px 0;gap:8px}.pe-collapse__toggle:before,.pe-collapse__toggle:after{content:\"\";display:block;width:100%;height:1px;border-bottom:1px solid rgba(255,255,255,.1)}.pe-collapse__toggle-button .pe-icon{transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-collapse--collapsed .pe-collapse__content{-webkit-mask-image:linear-gradient(to bottom,black calc(100% - 48px),transparent 100%);mask-image:linear-gradient(to bottom,black calc(100% - 48px),transparent 100%);height:var(--pe-collapse-max-height)}.pe-collapse--collapsed .pe-collapse__toggle-button .pe-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CollapseComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-collapse', standalone: true, imports: [ButtonComponent, IconComponent], template: `
+    <div [class]="computedClasses()">
+      <div class="pe-collapse__content" #content [attr.aria-expanded]="!collapsed()" [attr.aria-hidden]="collapsed()">
+        <ng-content />
+      </div>
+      @if (isCollapsible()) {
+        <div class="pe-collapse__toggle">
+          <pe-button
+            theme="ghost-white"
+            [iconOnly]="variant() === 'icon'"
+            class="pe-collapse__toggle-button"
+            (click)="toggle()"
+            (keydown)="onToggleKeydown($event)"
+            [attr.aria-label]="collapsed() ? expandLabel() : collapseLabel()">
+            @if (variant() === 'text') {
+              <span>
+                {{ collapsed() ? expandLabel() : collapseLabel() }}
+              </span>
+            } @else if (variant() === 'icon') {
+              <pe-icon size="6" icon="chevron_up" />
+            }
+          </pe-button>
+        </div>
+      }
+    </div>
+  `, host: {
+                        '[style.--pe-collapse-max-height.px]': 'maxHeight()',
+                        '[style.--pe-collapse-full-height.px]': 'fullHeight()',
+                        role: 'region',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-collapse__content{position:relative;overflow:hidden;height:var(--pe-collapse-full-height);transition:height .25s cubic-bezier(.4,0,.2,1)}.pe-collapse__toggle{display:flex;align-items:center;justify-content:center;width:100%;padding:4px 0;gap:8px}.pe-collapse__toggle:before,.pe-collapse__toggle:after{content:\"\";display:block;width:100%;height:1px;border-bottom:1px solid rgba(255,255,255,.1)}.pe-collapse__toggle-button .pe-icon{transition:transform .25s cubic-bezier(.4,0,.2,1)}.pe-collapse--collapsed .pe-collapse__content{-webkit-mask-image:linear-gradient(to bottom,black calc(100% - 48px),transparent 100%);mask-image:linear-gradient(to bottom,black calc(100% - 48px),transparent 100%);height:var(--pe-collapse-max-height)}.pe-collapse--collapsed .pe-collapse__toggle-button .pe-icon{transform:rotate(180deg)}\n"] }]
+        }], propDecorators: { content: [{
+                type: ViewChild,
+                args: ['content']
+            }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: true }] }], expandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandLabel", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }] } });
+
+class ListItemComponent {
+    checkbox = contentChild(CheckboxComponent, ...(ngDevMode ? [{ debugName: "checkbox" }] : []));
+    theme = input('ghost-white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    hideFocusOutline = input(false, ...(ngDevMode ? [{ debugName: "hideFocusOutline" }] : []));
+    selected = input(false, ...(ngDevMode ? [{ debugName: "selected" }] : []));
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    clickHandler() {
+        if (this.disabled() || this.loading()) {
+            return;
+        }
+        if (!this.disabled()) {
+            this.checkbox()?.checked.update((value) => !value);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.2", type: ListItemComponent, isStandalone: true, selector: "pe-list-item", inputs: { theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideFocusOutline: { classPropertyName: "hideFocusOutline", publicName: "hideFocusOutline", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "checkbox", first: true, predicate: CheckboxComponent, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <pe-skeleton [show]="loading()" variant="rect">
+      <button
+        class="pe-list-item pe-list-item--{{ theme() }}"
+        [class.pe-list-item--no-focus-outline]="hideFocusOutline()"
+        [class.pe-list-item--selected]="selected() || !!checkbox()?.checked"
+        (click)="clickHandler()"
+        [disabled]="disabled() || loading()">
+        <div class="pe-list-item__before-label">
+          <ng-content select="[pe-list-item-before-label]"></ng-content>
+        </div>
+        <div class="pe-list-item__label">
+          <ng-content select="[pe-list-item-label]"></ng-content>
+        </div>
+        <div class="pe-list-item__after-label">
+          <ng-content select="[pe-list-item-after-label]"></ng-content>
+        </div>
+      </button>
+    </pe-skeleton>
+  `, isInline: true, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-list-item{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;text-align:start;display:flex;align-items:center;width:100%;gap:8px;border-radius:8px;padding:8px 12px;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-list-item:hover{background-color:#fff3}.pe-list-item:active{background-color:#ffffff1a}.pe-list-item:selected{background-color:#fff3}.pe-list-item{background-color:#fff0;color:inherit}.pe-list-item:disabled,.pe-list-item[disabled]{background-color:#fff0}.pe-list-item:focus-visible,.pe-list-item:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-list-item--no-focus-outline:focus-visible,.pe-list-item--no-focus-outline:focus{outline:none;outline-offset:0}.pe-list-item--selected{background-color:#fff3}.pe-list-item--transparent-white{background-color:#ffffff1a;color:inherit}.pe-list-item--transparent-white:hover{background-color:#fff3}.pe-list-item--transparent-white:active{background-color:#ffffff1a}.pe-list-item--transparent-white:selected{background-color:#fff3}.pe-list-item--transparent-white:disabled,.pe-list-item--transparent-white[disabled]{background-color:#ffffff0d}.pe-list-item--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-list-item--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-list-item--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-list-item--outline-white:disabled,.pe-list-item--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-list-item--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-list-item--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-list-item--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-list-item--outline-purple:disabled,.pe-list-item--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-list-item--transparent-white.pe-list-item--selected{background-color:#fff3}.pe-list-item__label{flex:1;color:#fff}.pe-list-item__before-label,.pe-list-item__after-label{display:flex;align-items:center;gap:8px}.pe-list-item .pe--icon{color:#fff}.pe-list-item:disabled,.pe-list-item[disabled]{cursor:not-allowed;color:#ffffff4d}.pe-list-item:disabled .pe-list-item__label,.pe-list-item[disabled] .pe-list-item__label{color:#ffffff4d}\n"], dependencies: [{ kind: "component", type: SkeletonComponent, selector: "pe-skeleton", inputs: ["variant", "width", "height", "lines", "borderRadius", "show"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ListItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-list-item', standalone: true, imports: [SkeletonComponent], template: `
+    <pe-skeleton [show]="loading()" variant="rect">
+      <button
+        class="pe-list-item pe-list-item--{{ theme() }}"
+        [class.pe-list-item--no-focus-outline]="hideFocusOutline()"
+        [class.pe-list-item--selected]="selected() || !!checkbox()?.checked"
+        (click)="clickHandler()"
+        [disabled]="disabled() || loading()">
+        <div class="pe-list-item__before-label">
+          <ng-content select="[pe-list-item-before-label]"></ng-content>
+        </div>
+        <div class="pe-list-item__label">
+          <ng-content select="[pe-list-item-label]"></ng-content>
+        </div>
+        <div class="pe-list-item__after-label">
+          <ng-content select="[pe-list-item-after-label]"></ng-content>
+        </div>
+      </button>
+    </pe-skeleton>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-list-item{cursor:pointer;border:none;white-space:nowrap;box-sizing:border-box;text-align:start;display:flex;align-items:center;width:100%;gap:8px;border-radius:8px;padding:8px 12px;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-list-item:hover{background-color:#fff3}.pe-list-item:active{background-color:#ffffff1a}.pe-list-item:selected{background-color:#fff3}.pe-list-item{background-color:#fff0;color:inherit}.pe-list-item:disabled,.pe-list-item[disabled]{background-color:#fff0}.pe-list-item:focus-visible,.pe-list-item:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-list-item--no-focus-outline:focus-visible,.pe-list-item--no-focus-outline:focus{outline:none;outline-offset:0}.pe-list-item--selected{background-color:#fff3}.pe-list-item--transparent-white{background-color:#ffffff1a;color:inherit}.pe-list-item--transparent-white:hover{background-color:#fff3}.pe-list-item--transparent-white:active{background-color:#ffffff1a}.pe-list-item--transparent-white:selected{background-color:#fff3}.pe-list-item--transparent-white:disabled,.pe-list-item--transparent-white[disabled]{background-color:#ffffff0d}.pe-list-item--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-list-item--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-list-item--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-list-item--outline-white:disabled,.pe-list-item--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-list-item--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-list-item--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-list-item--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-list-item--outline-purple:disabled,.pe-list-item--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-list-item--transparent-white.pe-list-item--selected{background-color:#fff3}.pe-list-item__label{flex:1;color:#fff}.pe-list-item__before-label,.pe-list-item__after-label{display:flex;align-items:center;gap:8px}.pe-list-item .pe--icon{color:#fff}.pe-list-item:disabled,.pe-list-item[disabled]{cursor:not-allowed;color:#ffffff4d}.pe-list-item:disabled .pe-list-item__label,.pe-list-item[disabled] .pe-list-item__label{color:#ffffff4d}\n"] }]
+        }], propDecorators: { checkbox: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CheckboxComponent), { isSignal: true }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hideFocusOutline: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideFocusOutline", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }] } });
+
+/**
+ * A customizable dropdown component that displays a list of selectable items.
+ *
+ * Features:
+ * - Configurable themes (ghost-white, transparent-white)
+ * - Icon support for items and trigger button
+ * - Customizable trigger appearance
+ * - Disabled item support
+ * - Two-way binding for selected item
+ *
+ * @example
+ * ```html
+ * <!-- Basic usage -->
+ * <uds-dropdown
+ *   [items]="dropdownItems"
+ *   [theme]="'transparent-white'"
+ *   (selectedItemChange)="onItemSelected($event)">
+ * </uds-dropdown>
+ *
+ * <!-- More options menu -->
+ * <uds-dropdown
+ *   [items]="actionItems"
+ *   [onlyMenuTriggerIcon]="'more_options'">
+ * </uds-dropdown>
+ * ```
+ */
+class DropdownComponent {
+    /**
+     * The visual theme for the dropdown.
+     * @default 'ghost-white'
+     */
+    theme = input('ghost-white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    /**
+     * Array of items to display in the dropdown menu.
+     * @default []
+     */
+    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
+    /**
+     * Whether the dropdown is disabled.
+     * @default false
+     */
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    /**
+     * Overrides the icons of the selected item in the trigger button.
+     * Can override leftIcons, rightIcons, or both.
+     * @default {}
+     *
+     * @example
+     * ```typescript
+     * menuTriggerIcons = {
+     *  chevron_down
+     * }
+     * ```
+     */
+    menuTriggerIcons = input({
+        rightIcons: ['chevron_down'],
+    }, ...(ngDevMode ? [{ debugName: "menuTriggerIcons" }] : []));
+    /**
+     * Shows only a single icon in the trigger button, hiding the selected item's label and icons.
+     * Commonly used with 'more_options' for action menus.
+     * @default undefined
+     *
+     * @example
+     * ```typescript
+     * triggerIconOnly = 'more_options'
+     * ```
+     */
+    triggerIconOnly = input(...(ngDevMode ? [undefined, { debugName: "triggerIconOnly" }] : []));
+    /**
+     * Accessible label for the icon-only trigger button.
+     * @default 'Open menu'
+     */
+    iconOnlyLabel = input('Open menu', ...(ngDevMode ? [{ debugName: "iconOnlyLabel" }] : []));
+    /**
+     * The index of the currently selected item.
+     * Supports two-way binding with [(selectedIndex)].
+     * @default 0
+     */
+    selectedIndex = model(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
+    /**
+     * The currently selected item with any trigger icon overrides applied.
+     */
+    selectedItem = computed(() => {
+        const items = this.items();
+        const index = this.selectedIndex();
+        const fallback = {
+            label: '',
+            value: undefined,
+            leftIcons: [],
+            rightIcons: [],
+            disabled: false,
+        };
+        const item = items[index] ?? items[0] ?? fallback;
+        return {
+            ...item,
+            ...this.menuTriggerIcons(),
+        };
+    }, ...(ngDevMode ? [{ debugName: "selectedItem" }] : []));
+    /**
+     * Right icons for the trigger: when default is chevron_down, shows chevron_down when closed
+     * and chevron_up when open. Otherwise uses selectedItem().rightIcons as-is.
+     */
+    triggerRightIcons = computed(() => {
+        const right = this.selectedItem().rightIcons ?? [];
+        const open = this.isOpen();
+        if (right.length === 1 && right[0] === 'chevron_down') {
+            return open ? ['chevron_up'] : ['chevron_down'];
+        }
+        return right;
+    }, ...(ngDevMode ? [{ debugName: "triggerRightIcons" }] : []));
+    /**
+     * Tracks whether the menu is currently open for ARIA.
+     */
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    /**
+     * Stable id used to link the trigger to the menu container.
+     */
+    menuId = `pe-dropdown-menu-${Math.random().toString(36).slice(2, 11)}`;
+    /**
+     * Emitted when a new item is selected from the dropdown.
+     */
+    selectedItemChange = output();
+    /**
+     * Handles the selection of a dropdown item.
+     * @param index - The index of the selected item
+     */
+    handleItemTriggered(index) {
+        this.selectedIndex.set(index);
+        this.selectedItemChange.emit(this.items()[index]);
+    }
+    onMenuOpened() {
+        this.isOpen.set(true);
+    }
+    onMenuClosed() {
+        this.isOpen.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: DropdownComponent, isStandalone: true, selector: "pe-dropdown", inputs: { theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, menuTriggerIcons: { classPropertyName: "menuTriggerIcons", publicName: "menuTriggerIcons", isSignal: true, isRequired: false, transformFunction: null }, triggerIconOnly: { classPropertyName: "triggerIconOnly", publicName: "triggerIconOnly", isSignal: true, isRequired: false, transformFunction: null }, iconOnlyLabel: { classPropertyName: "iconOnlyLabel", publicName: "iconOnlyLabel", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange", selectedItemChange: "selectedItemChange" }, ngImport: i0, template: "<div class=\"pe-dropdown\">\n  <!-- Template for rendering icon arrays -->\n  <ng-template #renderIcons let-icons>\n    @for (icon of icons; track icon) {\n      <pe-icon size=\"5\" [icon]=\"icon\" />\n    }\n  </ng-template>\n\n  @if (triggerIconOnly(); as iconName) {\n    <pe-button\n      [theme]=\"theme()\"\n      [iconOnly]=\"true\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"menu\"\n      class=\"pe-dropdown__trigger\"\n      aria-haspopup=\"menu\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"menuId\"\n      [attr.aria-label]=\"iconOnlyLabel()\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <pe-icon [icon]=\"iconName\" />\n    </pe-button>\n  } @else {\n    <pe-list-item\n      [theme]=\"theme()\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"menu\"\n      class=\"pe-dropdown__trigger\"\n      aria-haspopup=\"menu\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"menuId\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <ng-container pe-list-item-before-label>\n        @if (selectedItem().leftIcons) {\n          <ng-container\n            *ngTemplateOutlet=\"renderIcons; context: { $implicit: selectedItem().leftIcons }\"\n          />\n        }\n      </ng-container>\n      <ng-container pe-list-item-label>\n        {{ selectedItem().label }}\n      </ng-container>\n      <ng-container pe-list-item-after-label>\n        <ng-container\n          *ngTemplateOutlet=\"renderIcons; context: { $implicit: triggerRightIcons() }\"\n        />\n      </ng-container>\n    </pe-list-item>\n  }\n\n  <ng-template #menu>\n    <div cdkMenu class=\"pe-dropdown__content pe-scrollable\" [id]=\"menuId\">\n      @for (item of items(); track $index) {\n        <pe-list-item\n          cdkMenuItem\n          (cdkMenuItemTriggered)=\"handleItemTriggered($index)\"\n          [disabled]=\"!!item.disabled\"\n          role=\"menuitemradio\"\n          [attr.aria-checked]=\"selectedIndex() === $index ? 'true' : 'false'\"\n        >\n          <ng-container pe-list-item-before-label>\n            <ng-container *ngTemplateOutlet=\"renderIcons; context: { $implicit: item.leftIcons }\" />\n          </ng-container>\n          <ng-container pe-list-item-label>{{ item.label }}</ng-container>\n          <ng-container pe-list-item-after-label>\n            <ng-container\n              *ngTemplateOutlet=\"renderIcons; context: { $implicit: item.rightIcons }\"\n            />\n            @if (selectedIndex() === $index) {\n              <pe-icon size=\"5\" icon=\"check\" />\n            }\n          </ng-container>\n        </pe-list-item>\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-dropdown{display:inline-flex;flex-direction:column;width:100%;gap:4px}.pe-dropdown__content{display:flex;flex-direction:column;gap:4px;background-color:#232323;border-radius:16px;padding:4px;margin:4px 0;max-height:316px;overflow-y:auto}\n"], dependencies: [{ kind: "directive", type: CdkMenuTrigger, selector: "[cdkMenuTriggerFor]", inputs: ["cdkMenuTriggerFor", "cdkMenuPosition", "cdkMenuTriggerData", "cdkMenuTriggerTransformOriginOn"], outputs: ["cdkMenuOpened", "cdkMenuClosed"], exportAs: ["cdkMenuTriggerFor"] }, { kind: "directive", type: CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ListItemComponent, selector: "pe-list-item", inputs: ["theme", "disabled", "hideFocusOutline", "selected", "loading"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: DropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-dropdown', standalone: true, imports: [CdkMenuTrigger, CdkMenu, CdkMenuItem, NgTemplateOutlet, ListItemComponent, IconComponent, ButtonComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pe-dropdown\">\n  <!-- Template for rendering icon arrays -->\n  <ng-template #renderIcons let-icons>\n    @for (icon of icons; track icon) {\n      <pe-icon size=\"5\" [icon]=\"icon\" />\n    }\n  </ng-template>\n\n  @if (triggerIconOnly(); as iconName) {\n    <pe-button\n      [theme]=\"theme()\"\n      [iconOnly]=\"true\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"menu\"\n      class=\"pe-dropdown__trigger\"\n      aria-haspopup=\"menu\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"menuId\"\n      [attr.aria-label]=\"iconOnlyLabel()\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <pe-icon [icon]=\"iconName\" />\n    </pe-button>\n  } @else {\n    <pe-list-item\n      [theme]=\"theme()\"\n      [disabled]=\"disabled()\"\n      [cdkMenuTriggerFor]=\"menu\"\n      class=\"pe-dropdown__trigger\"\n      aria-haspopup=\"menu\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"menuId\"\n      (cdkMenuOpened)=\"onMenuOpened()\"\n      (cdkMenuClosed)=\"onMenuClosed()\"\n    >\n      <ng-container pe-list-item-before-label>\n        @if (selectedItem().leftIcons) {\n          <ng-container\n            *ngTemplateOutlet=\"renderIcons; context: { $implicit: selectedItem().leftIcons }\"\n          />\n        }\n      </ng-container>\n      <ng-container pe-list-item-label>\n        {{ selectedItem().label }}\n      </ng-container>\n      <ng-container pe-list-item-after-label>\n        <ng-container\n          *ngTemplateOutlet=\"renderIcons; context: { $implicit: triggerRightIcons() }\"\n        />\n      </ng-container>\n    </pe-list-item>\n  }\n\n  <ng-template #menu>\n    <div cdkMenu class=\"pe-dropdown__content pe-scrollable\" [id]=\"menuId\">\n      @for (item of items(); track $index) {\n        <pe-list-item\n          cdkMenuItem\n          (cdkMenuItemTriggered)=\"handleItemTriggered($index)\"\n          [disabled]=\"!!item.disabled\"\n          role=\"menuitemradio\"\n          [attr.aria-checked]=\"selectedIndex() === $index ? 'true' : 'false'\"\n        >\n          <ng-container pe-list-item-before-label>\n            <ng-container *ngTemplateOutlet=\"renderIcons; context: { $implicit: item.leftIcons }\" />\n          </ng-container>\n          <ng-container pe-list-item-label>{{ item.label }}</ng-container>\n          <ng-container pe-list-item-after-label>\n            <ng-container\n              *ngTemplateOutlet=\"renderIcons; context: { $implicit: item.rightIcons }\"\n            />\n            @if (selectedIndex() === $index) {\n              <pe-icon size=\"5\" icon=\"check\" />\n            }\n          </ng-container>\n        </pe-list-item>\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-dropdown{display:inline-flex;flex-direction:column;width:100%;gap:4px}.pe-dropdown__content{display:flex;flex-direction:column;gap:4px;background-color:#232323;border-radius:16px;padding:4px;margin:4px 0;max-height:316px;overflow-y:auto}\n"] }]
+        }], propDecorators: { theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], menuTriggerIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "menuTriggerIcons", required: false }] }], triggerIconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerIconOnly", required: false }] }], iconOnlyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnlyLabel", required: false }] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }, { type: i0.Output, args: ["selectedIndexChange"] }], selectedItemChange: [{ type: i0.Output, args: ["selectedItemChange"] }] } });
+
+/**
+ * File input component with label, helper/error text, and optional slots.
+ * Implements FormValueControl<FileList | null> for use with Signal Forms [formField].
+ *
+ * Uses hidden native file input + visible trigger + selected file label.
+ * Content projection: [pe-file-input-left-elements], [pe-file-input-right-elements].
+ */
+class FileInputComponent {
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    appearance = input('border-only', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
+    accept = input('', ...(ngDevMode ? [{ debugName: "accept" }] : []));
+    multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    /** Placeholder when no file is selected (e.g. "Choose file" or "No file chosen"). */
+    placeholderText = input('No file chosen', ...(ngDevMode ? [{ debugName: "placeholderText" }] : []));
+    controlId = input(...(ngDevMode ? [undefined, { debugName: "controlId" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    fileInputRef = viewChild('fileInput', ...(ngDevMode ? [{ debugName: "fileInputRef" }] : []));
+    ids = createFormFieldIds('pe-file-input');
+    effectiveControlId = computed(() => this.controlId() ?? this.ids.controlId, ...(ngDevMode ? [{ debugName: "effectiveControlId" }] : []));
+    effectiveHelperId = computed(() => this.controlId() ? `${this.controlId()}-helper` : this.ids.helperId, ...(ngDevMode ? [{ debugName: "effectiveHelperId" }] : []));
+    effectiveErrorId = computed(() => this.controlId() ? `${this.controlId()}-error` : this.ids.errorId, ...(ngDevMode ? [{ debugName: "effectiveErrorId" }] : []));
+    isFocused = signal(false, ...(ngDevMode ? [{ debugName: "isFocused" }] : []));
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.effectiveHelperId(), this.effectiveErrorId(), !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    /** Display text for selected file(s). */
+    selectedLabel = computed(() => {
+        const files = this.value();
+        if (!files?.length)
+            return this.placeholderText();
+        if (files.length === 1)
+            return files[0].name;
+        return `${files.length} files selected`;
+    }, ...(ngDevMode ? [{ debugName: "selectedLabel" }] : []));
+    inputBlur = output();
+    inputFocus = output();
+    valueChange = output();
+    constructor() {
+        effect(() => {
+            const current = this.value();
+            if (current !== undefined) {
+                this.valueChange.emit(current);
+            }
+        });
+        effect(() => {
+            if (this.value() === null) {
+                const el = this.fileInputRef()?.nativeElement;
+                if (el)
+                    el.value = '';
+            }
+        });
+    }
+    onFileChange(event) {
+        const inputEl = event.target;
+        const fileList = inputEl.files;
+        const next = fileList && fileList.length > 0 ? fileList : null;
+        this.value.set(next);
+        this.valueChange.emit(next);
+    }
+    onBlur(event) {
+        this.isFocused.set(false);
+        this.touched.set(true);
+        this.inputBlur.emit(event);
+    }
+    onFocus(event) {
+        this.isFocused.set(true);
+        this.inputFocus.emit(event);
+    }
+    triggerClick() {
+        if (this.disabled())
+            return;
+        this.fileInputRef()?.nativeElement?.click();
+    }
+    focus() {
+        const el = document.getElementById(this.effectiveControlId());
+        if (el instanceof HTMLInputElement)
+            el.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FileInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.2", type: FileInputComponent, isStandalone: true, selector: "pe-file-input", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, placeholderText: { classPropertyName: "placeholderText", publicName: "placeholderText", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touched: "touchedChange", value: "valueChange", inputBlur: "inputBlur", inputFocus: "inputFocus", valueChange: "valueChange" }, viewQueries: [{ propertyName: "fileInputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"pe-file-input pe-file-input--{{ size() }} pe-file-input--appearance-{{ appearance() }}\"\n  [class.pe-file-input--error]=\"hasError()\"\n  [class.pe-file-input--disabled]=\"disabled()\"\n  [class.pe-file-input--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"effectiveControlId()\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-file-input__group\" [class.pe-file-input__group--focused]=\"isFocused()\">\n    <div class=\"pe-file-input__left-elements\">\n      <ng-content select=\"[pe-file-input-left-elements]\" />\n    </div>\n\n    <input\n      #fileInput\n      [id]=\"effectiveControlId()\"\n      type=\"file\"\n      class=\"pe-file-input__native\"\n      [accept]=\"accept()\"\n      [multiple]=\"multiple()\"\n      [disabled]=\"disabled()\"\n      [required]=\"required()\"\n      (change)=\"onFileChange($event)\"\n      (blur)=\"onBlur($event)\"\n      (focus)=\"onFocus($event)\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n    />\n\n    <button\n      type=\"button\"\n      class=\"pe-file-input__trigger\"\n      [disabled]=\"disabled()\"\n      (click)=\"triggerClick()\"\n    >\n      Choose file\n    </button>\n    <span class=\"pe-file-input__label\">{{ selectedLabel() }}</span>\n\n    <div class=\"pe-file-input__right-elements\">\n      <ng-content select=\"[pe-file-input-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"effectiveHelperId()\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-file-input{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-file-input__group{position:relative;display:flex;align-items:center;height:40px;gap:0;padding:0;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-file-input__group--focused{border-color:#ffffff80}.pe-file-input--appearance-border-only:not(.pe-file-input--disabled) .pe-file-input__group:hover{border-color:#ffffff4d}.pe-file-input--appearance-subtle-tint:not(.pe-file-input--disabled) .pe-file-input__group:hover{border-color:#ffffff4d;background-color:#ffffff0d}.pe-file-input__native{position:absolute;width:0;height:0;opacity:0;overflow:hidden;clip:rect(0,0,0,0)}.pe-file-input__trigger{flex-shrink:0;margin:0 8px 0 0;height:100%;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:4px;background-color:#232323;padding:0 12px;color:#fff;cursor:pointer;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;transition:background-color .25s cubic-bezier(.4,0,.2,1),color .25s cubic-bezier(.4,0,.2,1)}.pe-file-input__trigger:hover:not(:disabled){background-color:#ffffff1a}.pe-file-input__trigger:disabled{cursor:not-allowed;color:#ffffff4d;background-color:transparent}.pe-file-input__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ffffff80}.pe-file-input__left-elements,.pe-file-input__right-elements{display:flex;gap:8px}.pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-file-input--sm .pe-file-input__group{height:32px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-file-input--sm .pe-file-input__left-elements,.pe-file-input--sm .pe-file-input__right-elements{gap:4px}.pe-file-input--sm .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--sm .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-file-input--md .pe-file-input__group{height:40px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-file-input--md .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--md .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-file-input--lg .pe-file-input__group{height:48px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-file-input--lg .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--lg .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-file-input--xl .pe-file-input__group{height:64px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-file-input--xl .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--xl .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-file-input--error .pe-file-input__group{border:2px solid #f69d9d}.pe-file-input--disabled .pe-file-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-file-input--disabled .pe-file-input__label{color:#ffffff4d}\n"], dependencies: [{ kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FileInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-file-input', standalone: true, imports: [FormFieldLabelComponent, FormFieldHelperComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-file-input pe-file-input--{{ size() }} pe-file-input--appearance-{{ appearance() }}\"\n  [class.pe-file-input--error]=\"hasError()\"\n  [class.pe-file-input--disabled]=\"disabled()\"\n  [class.pe-file-input--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"effectiveControlId()\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-file-input__group\" [class.pe-file-input__group--focused]=\"isFocused()\">\n    <div class=\"pe-file-input__left-elements\">\n      <ng-content select=\"[pe-file-input-left-elements]\" />\n    </div>\n\n    <input\n      #fileInput\n      [id]=\"effectiveControlId()\"\n      type=\"file\"\n      class=\"pe-file-input__native\"\n      [accept]=\"accept()\"\n      [multiple]=\"multiple()\"\n      [disabled]=\"disabled()\"\n      [required]=\"required()\"\n      (change)=\"onFileChange($event)\"\n      (blur)=\"onBlur($event)\"\n      (focus)=\"onFocus($event)\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n    />\n\n    <button\n      type=\"button\"\n      class=\"pe-file-input__trigger\"\n      [disabled]=\"disabled()\"\n      (click)=\"triggerClick()\"\n    >\n      Choose file\n    </button>\n    <span class=\"pe-file-input__label\">{{ selectedLabel() }}</span>\n\n    <div class=\"pe-file-input__right-elements\">\n      <ng-content select=\"[pe-file-input-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"effectiveHelperId()\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-file-input{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-file-input__group{position:relative;display:flex;align-items:center;height:40px;gap:0;padding:0;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-file-input__group--focused{border-color:#ffffff80}.pe-file-input--appearance-border-only:not(.pe-file-input--disabled) .pe-file-input__group:hover{border-color:#ffffff4d}.pe-file-input--appearance-subtle-tint:not(.pe-file-input--disabled) .pe-file-input__group:hover{border-color:#ffffff4d;background-color:#ffffff0d}.pe-file-input__native{position:absolute;width:0;height:0;opacity:0;overflow:hidden;clip:rect(0,0,0,0)}.pe-file-input__trigger{flex-shrink:0;margin:0 8px 0 0;height:100%;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:4px;background-color:#232323;padding:0 12px;color:#fff;cursor:pointer;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;transition:background-color .25s cubic-bezier(.4,0,.2,1),color .25s cubic-bezier(.4,0,.2,1)}.pe-file-input__trigger:hover:not(:disabled){background-color:#ffffff1a}.pe-file-input__trigger:disabled{cursor:not-allowed;color:#ffffff4d;background-color:transparent}.pe-file-input__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ffffff80}.pe-file-input__left-elements,.pe-file-input__right-elements{display:flex;gap:8px}.pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-file-input--sm .pe-file-input__group{height:32px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-file-input--sm .pe-file-input__left-elements,.pe-file-input--sm .pe-file-input__right-elements{gap:4px}.pe-file-input--sm .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--sm .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-file-input--md .pe-file-input__group{height:40px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-file-input--md .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--md .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-file-input--lg .pe-file-input__group{height:48px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-file-input--lg .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--lg .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-file-input--xl .pe-file-input__group{height:64px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-file-input--xl .pe-file-input__left-elements ::ng-deep .pe-icon,.pe-file-input--xl .pe-file-input__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-file-input--error .pe-file-input__group{border:2px solid #f69d9d}.pe-file-input--disabled .pe-file-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-file-input--disabled .pe-file-input__label{color:#ffffff4d}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], placeholderText: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderText", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], fileInputRef: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+class FooterComponent {
+    copyrightText = input('', ...(ngDevMode ? [{ debugName: "copyrightText" }] : []));
+    socialLinks = input([], ...(ngDevMode ? [{ debugName: "socialLinks" }] : []));
+    links = input([], ...(ngDevMode ? [{ debugName: "links" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: FooterComponent, isStandalone: true, selector: "pe-footer", inputs: { copyrightText: { classPropertyName: "copyrightText", publicName: "copyrightText", isSignal: true, isRequired: false, transformFunction: null }, socialLinks: { classPropertyName: "socialLinks", publicName: "socialLinks", isSignal: true, isRequired: false, transformFunction: null }, links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"pe-footer\">\n  <p class=\"pe-footer__copyright\">\n    {{ copyrightText() }}\n  </p>\n  @if (socialLinks()) {\n    <ul class=\"pe-footer__social-links\">\n      @for (link of socialLinks(); track link.url) {\n        <li>\n          <pe-button [theme]=\"'ghost-white'\" [iconOnly]=\"true\" [disabled]=\"false\">\n            <pe-icon [icon]=\"link.icon\" />\n          </pe-button>\n        </li>\n      }\n    </ul>\n  }\n  @for (link of links(); track link.url) {\n    <a [href]=\"link.url\" class=\"pe-link pe-body-m--medium\">{{ link.text }}</a>\n  }\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-footer{padding:32px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}.pe-footer__copyright{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;margin:0 auto 0 0;color:#ffffff80}.pe-footer__social-links{display:flex;gap:4px;list-style:none;padding:0;margin:0}.pe-footer__social-links__social-link{display:flex}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: FooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-footer', imports: [ButtonComponent, IconComponent], standalone: true, template: "<div class=\"pe-footer\">\n  <p class=\"pe-footer__copyright\">\n    {{ copyrightText() }}\n  </p>\n  @if (socialLinks()) {\n    <ul class=\"pe-footer__social-links\">\n      @for (link of socialLinks(); track link.url) {\n        <li>\n          <pe-button [theme]=\"'ghost-white'\" [iconOnly]=\"true\" [disabled]=\"false\">\n            <pe-icon [icon]=\"link.icon\" />\n          </pe-button>\n        </li>\n      }\n    </ul>\n  }\n  @for (link of links(); track link.url) {\n    <a [href]=\"link.url\" class=\"pe-link pe-body-m--medium\">{{ link.text }}</a>\n  }\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-footer{padding:32px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}.pe-footer__copyright{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;margin:0 auto 0 0;color:#ffffff80}.pe-footer__social-links{display:flex;gap:4px;list-style:none;padding:0;margin:0}.pe-footer__social-links__social-link{display:flex}\n"] }]
+        }], propDecorators: { copyrightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "copyrightText", required: false }] }], socialLinks: [{ type: i0.Input, args: [{ isSignal: true, alias: "socialLinks", required: false }] }], links: [{ type: i0.Input, args: [{ isSignal: true, alias: "links", required: false }] }] } });
+
+class PillComponent {
+    variant = input('interactive', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    theme = input('transparent-white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    dismiss = output();
+    dismissibleButtonTheme = computed(() => {
+        const t = this.theme();
+        if (t === 'transparent-purple' || t === 'outline-purple')
+            return 'ghost-purple';
+        if (t === 'outline-red')
+            return 'ghost-red';
+        if (t === 'outline-green')
+            return 'ghost-green';
+        return 'ghost-white';
+    }, ...(ngDevMode ? [{ debugName: "dismissibleButtonTheme" }] : []));
+    modifierClass = computed(() => {
+        const classes = ['pe-pill', `pe-pill--${this.variant()}`, `pe-pill--${this.theme()}`, `pe-pill--${this.size()}`];
+        if (this.disabled()) {
+            classes.push('pe-pill--disabled');
+        }
+        return classes;
+    }, ...(ngDevMode ? [{ debugName: "modifierClass" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: PillComponent, isStandalone: true, selector: "pe-pill", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismiss: "dismiss" }, ngImport: i0, template: "@if (variant() === 'selectable') {\n  <label [class]=\"modifierClass()\" [class.pe-pill--disabled]=\"disabled()\">\n    <input type=\"checkbox\" class=\"pe-pill__checkbox\" />\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n  <div [class]=\"modifierClass()\" [class.pe-pill--disabled]=\"disabled()\">\n    <ng-container *ngTemplateOutlet=\"content\" />\n    @if (variant() === 'dismissible') {\n      <pe-button\n        [theme]=\"dismissibleButtonTheme()\"\n        size=\"sm\"\n        [iconOnly]=\"true\"\n        [disabled]=\"disabled()\"\n        (click)=\"dismiss.emit()\"\n      >\n        <pe-icon icon=\"close\" />\n      </pe-button>\n    }\n  </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n  <button [class]=\"modifierClass()\" [disabled]=\"disabled()\">\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </button>\n}\n\n<ng-template #content>\n  <ng-content />\n</ng-template>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-pill{border:none;cursor:pointer;text-decoration-line:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;white-space:nowrap;box-sizing:border-box;background-color:transparent;gap:8px;color:#fff;border-radius:8px;padding:4px 12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.pe-pill--md{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.pe-pill--lg{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500}.pe-pill--interactive,.pe-pill--interactive-rounded,.pe-pill--selectable{cursor:pointer}.pe-pill--interactive:focus-visible,.pe-pill--interactive:focus,.pe-pill--interactive-rounded:focus-visible,.pe-pill--interactive-rounded:focus,.pe-pill--selectable:focus-visible,.pe-pill--selectable:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-pill--interactive-rounded{cursor:pointer;border-radius:4096px}.pe-pill--read-only,.pe-pill--dismissible.pe-pill{cursor:default}.pe-pill--dismissible.pe-pill .pe-btn--sm:last-child .pe-icon{font-size:16px;line-height:16px}.pe-pill--dismissible.pe-pill--md{padding:4px 4px 4px 12px;border-radius:8px}.pe-pill--dismissible.pe-pill--md .pe-btn--sm:last-child{min-width:24px;height:24px}.pe-pill--dismissible.pe-pill--lg{padding:8px 4px 8px 16px;border-radius:12px}.pe-pill--interactive.pe-pill--fill-white,.pe-pill--interactive-rounded.pe-pill--fill-white{background-color:#fff;color:inherit}.pe-pill--interactive.pe-pill--fill-white:hover,.pe-pill--interactive-rounded.pe-pill--fill-white:hover{background-color:#e7e7e7}.pe-pill--interactive.pe-pill--fill-white:active,.pe-pill--interactive-rounded.pe-pill--fill-white:active{background-color:#fff}.pe-pill--interactive.pe-pill--fill-white:selected,.pe-pill--interactive-rounded.pe-pill--fill-white:selected{background-color:#fff}.pe-pill--interactive.pe-pill--fill-white:disabled,.pe-pill--interactive.pe-pill--fill-white[disabled],.pe-pill--interactive-rounded.pe-pill--fill-white:disabled,.pe-pill--interactive-rounded.pe-pill--fill-white[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-white,.pe-pill--interactive-rounded.pe-pill--fill-white{color:#000}.pe-pill--interactive.pe-pill--fill-black:hover,.pe-pill--interactive-rounded.pe-pill--fill-black:hover{background-color:#3b3b3b}.pe-pill--interactive.pe-pill--fill-black:active,.pe-pill--interactive-rounded.pe-pill--fill-black:active{background-color:#232323}.pe-pill--interactive.pe-pill--fill-black:selected,.pe-pill--interactive-rounded.pe-pill--fill-black:selected{background-color:#3b3b3b}.pe-pill--interactive.pe-pill--fill-black:disabled,.pe-pill--interactive.pe-pill--fill-black[disabled],.pe-pill--interactive-rounded.pe-pill--fill-black:disabled,.pe-pill--interactive-rounded.pe-pill--fill-black[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-black,.pe-pill--interactive-rounded.pe-pill--fill-black{background-color:#232323;color:inherit;color:#fff}.pe-pill--interactive.pe-pill--fill-purple,.pe-pill--interactive-rounded.pe-pill--fill-purple{background-color:#6f3de0;color:inherit}.pe-pill--interactive.pe-pill--fill-purple:hover,.pe-pill--interactive-rounded.pe-pill--fill-purple:hover{background-color:#7e4af7}.pe-pill--interactive.pe-pill--fill-purple:active,.pe-pill--interactive-rounded.pe-pill--fill-purple:active{background-color:#5935af}.pe-pill--interactive.pe-pill--fill-purple:selected,.pe-pill--interactive-rounded.pe-pill--fill-purple:selected{background-color:#7e4af7}.pe-pill--interactive.pe-pill--fill-purple:disabled,.pe-pill--interactive.pe-pill--fill-purple[disabled],.pe-pill--interactive-rounded.pe-pill--fill-purple:disabled,.pe-pill--interactive-rounded.pe-pill--fill-purple[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-purple,.pe-pill--interactive-rounded.pe-pill--fill-purple{color:#fff}.pe-pill--interactive.pe-pill--fill-red,.pe-pill--interactive-rounded.pe-pill--fill-red{background-color:#c33a3a;color:inherit}.pe-pill--interactive.pe-pill--fill-red:hover,.pe-pill--interactive-rounded.pe-pill--fill-red:hover{background-color:#d64040}.pe-pill--interactive.pe-pill--fill-red:active,.pe-pill--interactive-rounded.pe-pill--fill-red:active{background-color:#982d2d}.pe-pill--interactive.pe-pill--fill-red:selected,.pe-pill--interactive-rounded.pe-pill--fill-red:selected{background-color:#d64040}.pe-pill--interactive.pe-pill--fill-red:disabled,.pe-pill--interactive.pe-pill--fill-red[disabled],.pe-pill--interactive-rounded.pe-pill--fill-red:disabled,.pe-pill--interactive-rounded.pe-pill--fill-red[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-red,.pe-pill--interactive-rounded.pe-pill--fill-red{color:#fff}.pe-pill--interactive.pe-pill--fill-green,.pe-pill--interactive-rounded.pe-pill--fill-green{background-color:#0b7a27;color:inherit}.pe-pill--interactive.pe-pill--fill-green:hover,.pe-pill--interactive-rounded.pe-pill--fill-green:hover{background-color:#0e892d}.pe-pill--interactive.pe-pill--fill-green:active,.pe-pill--interactive-rounded.pe-pill--fill-green:active{background-color:#096620}.pe-pill--interactive.pe-pill--fill-green:selected,.pe-pill--interactive-rounded.pe-pill--fill-green:selected{background-color:#0e892d}.pe-pill--interactive.pe-pill--fill-green:disabled,.pe-pill--interactive.pe-pill--fill-green[disabled],.pe-pill--interactive-rounded.pe-pill--fill-green:disabled,.pe-pill--interactive-rounded.pe-pill--fill-green[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-green,.pe-pill--interactive-rounded.pe-pill--fill-green{color:#fff}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white{background-color:#ffffff1a;color:inherit}.pe-pill--interactive.pe-pill--transparent-white:hover,.pe-pill--interactive-rounded.pe-pill--transparent-white:hover{background-color:#fff3}.pe-pill--interactive.pe-pill--transparent-white:active,.pe-pill--interactive-rounded.pe-pill--transparent-white:active{background-color:#ffffff1a}.pe-pill--interactive.pe-pill--transparent-white:selected,.pe-pill--interactive-rounded.pe-pill--transparent-white:selected{background-color:#fff3}.pe-pill--interactive.pe-pill--transparent-white:disabled,.pe-pill--interactive.pe-pill--transparent-white[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-white:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-white[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white{color:#fff}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple{background-color:#a781ff33;color:inherit}.pe-pill--interactive.pe-pill--transparent-purple:hover,.pe-pill--interactive-rounded.pe-pill--transparent-purple:hover{background-color:#a781ff4d}.pe-pill--interactive.pe-pill--transparent-purple:active,.pe-pill--interactive-rounded.pe-pill--transparent-purple:active{background-color:#a781ff33}.pe-pill--interactive.pe-pill--transparent-purple:selected,.pe-pill--interactive-rounded.pe-pill--transparent-purple:selected{background-color:#a781ff4d}.pe-pill--interactive.pe-pill--transparent-purple:disabled,.pe-pill--interactive.pe-pill--transparent-purple[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-purple:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-purple[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple{color:#c2a8ff}.pe-pill--interactive.pe-pill--transparent-red,.pe-pill--interactive-rounded.pe-pill--transparent-red{background-color:#f3707033;color:inherit}.pe-pill--interactive.pe-pill--transparent-red:hover,.pe-pill--interactive-rounded.pe-pill--transparent-red:hover{background-color:#f370704d}.pe-pill--interactive.pe-pill--transparent-red:active,.pe-pill--interactive-rounded.pe-pill--transparent-red:active{background-color:#f3707033}.pe-pill--interactive.pe-pill--transparent-red:selected,.pe-pill--interactive-rounded.pe-pill--transparent-red:selected{background-color:#f370704d}.pe-pill--interactive.pe-pill--transparent-red:disabled,.pe-pill--interactive.pe-pill--transparent-red[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-red:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-red[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-red,.pe-pill--interactive-rounded.pe-pill--transparent-red{color:#f69d9d}.pe-pill--interactive.pe-pill--transparent-green,.pe-pill--interactive-rounded.pe-pill--transparent-green{background-color:#50c06c33;color:inherit}.pe-pill--interactive.pe-pill--transparent-green:hover,.pe-pill--interactive-rounded.pe-pill--transparent-green:hover{background-color:#50c06c4d}.pe-pill--interactive.pe-pill--transparent-green:active,.pe-pill--interactive-rounded.pe-pill--transparent-green:active{background-color:#50c06c33}.pe-pill--interactive.pe-pill--transparent-green:selected,.pe-pill--interactive-rounded.pe-pill--transparent-green:selected{background-color:#50c06c4d}.pe-pill--interactive.pe-pill--transparent-green:disabled,.pe-pill--interactive.pe-pill--transparent-green[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-green:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-green[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-green,.pe-pill--interactive-rounded.pe-pill--transparent-green{color:#7edc96}.pe-pill--interactive.pe-pill--stroke-white,.pe-pill--interactive.pe-pill--outline-white,.pe-pill--interactive-rounded.pe-pill--stroke-white,.pe-pill--interactive-rounded.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--interactive.pe-pill--stroke-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--stroke-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--interactive.pe-pill--stroke-white:active:not(:disabled):not([disabled]),.pe-pill--interactive.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--stroke-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--interactive.pe-pill--stroke-white:disabled,.pe-pill--interactive.pe-pill--stroke-white[disabled],.pe-pill--interactive.pe-pill--outline-white:disabled,.pe-pill--interactive.pe-pill--outline-white[disabled],.pe-pill--interactive-rounded.pe-pill--stroke-white:disabled,.pe-pill--interactive-rounded.pe-pill--stroke-white[disabled],.pe-pill--interactive-rounded.pe-pill--outline-white:disabled,.pe-pill--interactive-rounded.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-purple,.pe-pill--interactive-rounded.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:disabled,.pe-pill--interactive.pe-pill--outline-purple[disabled],.pe-pill--interactive-rounded.pe-pill--outline-purple:disabled,.pe-pill--interactive-rounded.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-red,.pe-pill--interactive-rounded.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:disabled,.pe-pill--interactive.pe-pill--outline-red[disabled],.pe-pill--interactive-rounded.pe-pill--outline-red:disabled,.pe-pill--interactive-rounded.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-green,.pe-pill--interactive-rounded.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:disabled,.pe-pill--interactive.pe-pill--outline-green[disabled],.pe-pill--interactive-rounded.pe-pill--outline-green:disabled,.pe-pill--interactive-rounded.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white,.pe-pill--dismissible.pe-pill--transparent-white{background-color:#ffffff1a;color:inherit}.pe-pill--interactive.pe-pill--transparent-white:disabled,.pe-pill--interactive.pe-pill--transparent-white[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-white:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-white[disabled],.pe-pill--dismissible.pe-pill--transparent-white:disabled,.pe-pill--dismissible.pe-pill--transparent-white[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white,.pe-pill--dismissible.pe-pill--transparent-white{color:#fff}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple,.pe-pill--dismissible.pe-pill--transparent-purple{background-color:#a781ff33;color:inherit}.pe-pill--interactive.pe-pill--transparent-purple:disabled,.pe-pill--interactive.pe-pill--transparent-purple[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-purple:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-purple[disabled],.pe-pill--dismissible.pe-pill--transparent-purple:disabled,.pe-pill--dismissible.pe-pill--transparent-purple[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple,.pe-pill--dismissible.pe-pill--transparent-purple{color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-white,.pe-pill--interactive-rounded.pe-pill--outline-white,.pe-pill--dismissible.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--interactive.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--interactive.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--interactive.pe-pill--outline-white:disabled,.pe-pill--interactive.pe-pill--outline-white[disabled],.pe-pill--interactive-rounded.pe-pill--outline-white:disabled,.pe-pill--interactive-rounded.pe-pill--outline-white[disabled],.pe-pill--dismissible.pe-pill--outline-white:disabled,.pe-pill--dismissible.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-purple,.pe-pill--interactive-rounded.pe-pill--outline-purple,.pe-pill--dismissible.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:disabled,.pe-pill--interactive.pe-pill--outline-purple[disabled],.pe-pill--interactive-rounded.pe-pill--outline-purple:disabled,.pe-pill--interactive-rounded.pe-pill--outline-purple[disabled],.pe-pill--dismissible.pe-pill--outline-purple:disabled,.pe-pill--dismissible.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-red,.pe-pill--interactive-rounded.pe-pill--outline-red,.pe-pill--dismissible.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:disabled,.pe-pill--interactive.pe-pill--outline-red[disabled],.pe-pill--interactive-rounded.pe-pill--outline-red:disabled,.pe-pill--interactive-rounded.pe-pill--outline-red[disabled],.pe-pill--dismissible.pe-pill--outline-red:disabled,.pe-pill--dismissible.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-green,.pe-pill--interactive-rounded.pe-pill--outline-green,.pe-pill--dismissible.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:disabled,.pe-pill--interactive.pe-pill--outline-green[disabled],.pe-pill--interactive-rounded.pe-pill--outline-green:disabled,.pe-pill--interactive-rounded.pe-pill--outline-green[disabled],.pe-pill--dismissible.pe-pill--outline-green:disabled,.pe-pill--dismissible.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--read-only.pe-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.pe-pill--read-only.pe-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.pe-pill--read-only.pe-pill--transparent-red{color:#f69d9d;border:1px solid #f69d9d}.pe-pill--read-only.pe-pill--transparent-green{color:#7edc96;border:1px solid #7edc96}.pe-pill--read-only.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--read-only.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--read-only.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--read-only.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--selectable{position:relative}.pe-pill--selectable.pe-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):hover{background-color:#fff3}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):active{background-color:#ffffff1a}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):selected{background-color:#fff3}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):hover{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):active{background-color:#a781ff33}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):selected{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--selectable.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--selectable.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--selectable.pe-pill--outline-white:disabled,.pe-pill--selectable.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):hover{background-color:#fff3}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):active{background-color:#ffffff1a}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):selected{background-color:#fff3}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:disabled,.pe-pill--selectable.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):hover{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):active{background-color:#a781ff33}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):selected{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:disabled,.pe-pill--selectable.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#f3707033;color:inherit}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):hover{background-color:#f370704d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):active{background-color:#f3707033}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):selected{background-color:#f370704d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:disabled,.pe-pill--selectable.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#50c06c33;color:inherit}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):hover{background-color:#50c06c4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):active{background-color:#50c06c33}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):selected{background-color:#50c06c4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable .pe-pill__checkbox{position:absolute;visibility:hidden;height:0;width:0;top:0;left:0}.pe-pill--disabled,.pe-pill[disabled],.pe-pill:disabled{cursor:not-allowed;color:#ffffff4d}.pe-pill--disabled.pe-pill--outline-white,.pe-pill--disabled.pe-pill--outline-purple,.pe-pill--disabled.pe-pill--outline-red,.pe-pill--disabled.pe-pill--outline-green,.pe-pill--disabled.pe-pill--stroke-white,.pe-pill[disabled].pe-pill--outline-white,.pe-pill[disabled].pe-pill--outline-purple,.pe-pill[disabled].pe-pill--outline-red,.pe-pill[disabled].pe-pill--outline-green,.pe-pill[disabled].pe-pill--stroke-white,.pe-pill:disabled.pe-pill--outline-white,.pe-pill:disabled.pe-pill--outline-purple,.pe-pill:disabled.pe-pill--outline-red,.pe-pill:disabled.pe-pill--outline-green,.pe-pill:disabled.pe-pill--stroke-white{border-color:#6c6c6c}.pe-pill .pe-icon{font-size:20px;line-height:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PillComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-pill', standalone: true, imports: [CommonModule, ButtonComponent, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (variant() === 'selectable') {\n  <label [class]=\"modifierClass()\" [class.pe-pill--disabled]=\"disabled()\">\n    <input type=\"checkbox\" class=\"pe-pill__checkbox\" />\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n  <div [class]=\"modifierClass()\" [class.pe-pill--disabled]=\"disabled()\">\n    <ng-container *ngTemplateOutlet=\"content\" />\n    @if (variant() === 'dismissible') {\n      <pe-button\n        [theme]=\"dismissibleButtonTheme()\"\n        size=\"sm\"\n        [iconOnly]=\"true\"\n        [disabled]=\"disabled()\"\n        (click)=\"dismiss.emit()\"\n      >\n        <pe-icon icon=\"close\" />\n      </pe-button>\n    }\n  </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n  <button [class]=\"modifierClass()\" [disabled]=\"disabled()\">\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </button>\n}\n\n<ng-template #content>\n  <ng-content />\n</ng-template>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-pill{border:none;cursor:pointer;text-decoration-line:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;white-space:nowrap;box-sizing:border-box;background-color:transparent;gap:8px;color:#fff;border-radius:8px;padding:4px 12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.pe-pill--md{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.pe-pill--lg{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500}.pe-pill--interactive,.pe-pill--interactive-rounded,.pe-pill--selectable{cursor:pointer}.pe-pill--interactive:focus-visible,.pe-pill--interactive:focus,.pe-pill--interactive-rounded:focus-visible,.pe-pill--interactive-rounded:focus,.pe-pill--selectable:focus-visible,.pe-pill--selectable:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.pe-pill--interactive-rounded{cursor:pointer;border-radius:4096px}.pe-pill--read-only,.pe-pill--dismissible.pe-pill{cursor:default}.pe-pill--dismissible.pe-pill .pe-btn--sm:last-child .pe-icon{font-size:16px;line-height:16px}.pe-pill--dismissible.pe-pill--md{padding:4px 4px 4px 12px;border-radius:8px}.pe-pill--dismissible.pe-pill--md .pe-btn--sm:last-child{min-width:24px;height:24px}.pe-pill--dismissible.pe-pill--lg{padding:8px 4px 8px 16px;border-radius:12px}.pe-pill--interactive.pe-pill--fill-white,.pe-pill--interactive-rounded.pe-pill--fill-white{background-color:#fff;color:inherit}.pe-pill--interactive.pe-pill--fill-white:hover,.pe-pill--interactive-rounded.pe-pill--fill-white:hover{background-color:#e7e7e7}.pe-pill--interactive.pe-pill--fill-white:active,.pe-pill--interactive-rounded.pe-pill--fill-white:active{background-color:#fff}.pe-pill--interactive.pe-pill--fill-white:selected,.pe-pill--interactive-rounded.pe-pill--fill-white:selected{background-color:#fff}.pe-pill--interactive.pe-pill--fill-white:disabled,.pe-pill--interactive.pe-pill--fill-white[disabled],.pe-pill--interactive-rounded.pe-pill--fill-white:disabled,.pe-pill--interactive-rounded.pe-pill--fill-white[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-white,.pe-pill--interactive-rounded.pe-pill--fill-white{color:#000}.pe-pill--interactive.pe-pill--fill-black:hover,.pe-pill--interactive-rounded.pe-pill--fill-black:hover{background-color:#3b3b3b}.pe-pill--interactive.pe-pill--fill-black:active,.pe-pill--interactive-rounded.pe-pill--fill-black:active{background-color:#232323}.pe-pill--interactive.pe-pill--fill-black:selected,.pe-pill--interactive-rounded.pe-pill--fill-black:selected{background-color:#3b3b3b}.pe-pill--interactive.pe-pill--fill-black:disabled,.pe-pill--interactive.pe-pill--fill-black[disabled],.pe-pill--interactive-rounded.pe-pill--fill-black:disabled,.pe-pill--interactive-rounded.pe-pill--fill-black[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-black,.pe-pill--interactive-rounded.pe-pill--fill-black{background-color:#232323;color:inherit;color:#fff}.pe-pill--interactive.pe-pill--fill-purple,.pe-pill--interactive-rounded.pe-pill--fill-purple{background-color:#6f3de0;color:inherit}.pe-pill--interactive.pe-pill--fill-purple:hover,.pe-pill--interactive-rounded.pe-pill--fill-purple:hover{background-color:#7e4af7}.pe-pill--interactive.pe-pill--fill-purple:active,.pe-pill--interactive-rounded.pe-pill--fill-purple:active{background-color:#5935af}.pe-pill--interactive.pe-pill--fill-purple:selected,.pe-pill--interactive-rounded.pe-pill--fill-purple:selected{background-color:#7e4af7}.pe-pill--interactive.pe-pill--fill-purple:disabled,.pe-pill--interactive.pe-pill--fill-purple[disabled],.pe-pill--interactive-rounded.pe-pill--fill-purple:disabled,.pe-pill--interactive-rounded.pe-pill--fill-purple[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-purple,.pe-pill--interactive-rounded.pe-pill--fill-purple{color:#fff}.pe-pill--interactive.pe-pill--fill-red,.pe-pill--interactive-rounded.pe-pill--fill-red{background-color:#c33a3a;color:inherit}.pe-pill--interactive.pe-pill--fill-red:hover,.pe-pill--interactive-rounded.pe-pill--fill-red:hover{background-color:#d64040}.pe-pill--interactive.pe-pill--fill-red:active,.pe-pill--interactive-rounded.pe-pill--fill-red:active{background-color:#982d2d}.pe-pill--interactive.pe-pill--fill-red:selected,.pe-pill--interactive-rounded.pe-pill--fill-red:selected{background-color:#d64040}.pe-pill--interactive.pe-pill--fill-red:disabled,.pe-pill--interactive.pe-pill--fill-red[disabled],.pe-pill--interactive-rounded.pe-pill--fill-red:disabled,.pe-pill--interactive-rounded.pe-pill--fill-red[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-red,.pe-pill--interactive-rounded.pe-pill--fill-red{color:#fff}.pe-pill--interactive.pe-pill--fill-green,.pe-pill--interactive-rounded.pe-pill--fill-green{background-color:#0b7a27;color:inherit}.pe-pill--interactive.pe-pill--fill-green:hover,.pe-pill--interactive-rounded.pe-pill--fill-green:hover{background-color:#0e892d}.pe-pill--interactive.pe-pill--fill-green:active,.pe-pill--interactive-rounded.pe-pill--fill-green:active{background-color:#096620}.pe-pill--interactive.pe-pill--fill-green:selected,.pe-pill--interactive-rounded.pe-pill--fill-green:selected{background-color:#0e892d}.pe-pill--interactive.pe-pill--fill-green:disabled,.pe-pill--interactive.pe-pill--fill-green[disabled],.pe-pill--interactive-rounded.pe-pill--fill-green:disabled,.pe-pill--interactive-rounded.pe-pill--fill-green[disabled]{background-color:#232323}.pe-pill--interactive.pe-pill--fill-green,.pe-pill--interactive-rounded.pe-pill--fill-green{color:#fff}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white{background-color:#ffffff1a;color:inherit}.pe-pill--interactive.pe-pill--transparent-white:hover,.pe-pill--interactive-rounded.pe-pill--transparent-white:hover{background-color:#fff3}.pe-pill--interactive.pe-pill--transparent-white:active,.pe-pill--interactive-rounded.pe-pill--transparent-white:active{background-color:#ffffff1a}.pe-pill--interactive.pe-pill--transparent-white:selected,.pe-pill--interactive-rounded.pe-pill--transparent-white:selected{background-color:#fff3}.pe-pill--interactive.pe-pill--transparent-white:disabled,.pe-pill--interactive.pe-pill--transparent-white[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-white:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-white[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white{color:#fff}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple{background-color:#a781ff33;color:inherit}.pe-pill--interactive.pe-pill--transparent-purple:hover,.pe-pill--interactive-rounded.pe-pill--transparent-purple:hover{background-color:#a781ff4d}.pe-pill--interactive.pe-pill--transparent-purple:active,.pe-pill--interactive-rounded.pe-pill--transparent-purple:active{background-color:#a781ff33}.pe-pill--interactive.pe-pill--transparent-purple:selected,.pe-pill--interactive-rounded.pe-pill--transparent-purple:selected{background-color:#a781ff4d}.pe-pill--interactive.pe-pill--transparent-purple:disabled,.pe-pill--interactive.pe-pill--transparent-purple[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-purple:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-purple[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple{color:#c2a8ff}.pe-pill--interactive.pe-pill--transparent-red,.pe-pill--interactive-rounded.pe-pill--transparent-red{background-color:#f3707033;color:inherit}.pe-pill--interactive.pe-pill--transparent-red:hover,.pe-pill--interactive-rounded.pe-pill--transparent-red:hover{background-color:#f370704d}.pe-pill--interactive.pe-pill--transparent-red:active,.pe-pill--interactive-rounded.pe-pill--transparent-red:active{background-color:#f3707033}.pe-pill--interactive.pe-pill--transparent-red:selected,.pe-pill--interactive-rounded.pe-pill--transparent-red:selected{background-color:#f370704d}.pe-pill--interactive.pe-pill--transparent-red:disabled,.pe-pill--interactive.pe-pill--transparent-red[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-red:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-red[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-red,.pe-pill--interactive-rounded.pe-pill--transparent-red{color:#f69d9d}.pe-pill--interactive.pe-pill--transparent-green,.pe-pill--interactive-rounded.pe-pill--transparent-green{background-color:#50c06c33;color:inherit}.pe-pill--interactive.pe-pill--transparent-green:hover,.pe-pill--interactive-rounded.pe-pill--transparent-green:hover{background-color:#50c06c4d}.pe-pill--interactive.pe-pill--transparent-green:active,.pe-pill--interactive-rounded.pe-pill--transparent-green:active{background-color:#50c06c33}.pe-pill--interactive.pe-pill--transparent-green:selected,.pe-pill--interactive-rounded.pe-pill--transparent-green:selected{background-color:#50c06c4d}.pe-pill--interactive.pe-pill--transparent-green:disabled,.pe-pill--interactive.pe-pill--transparent-green[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-green:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-green[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-green,.pe-pill--interactive-rounded.pe-pill--transparent-green{color:#7edc96}.pe-pill--interactive.pe-pill--stroke-white,.pe-pill--interactive.pe-pill--outline-white,.pe-pill--interactive-rounded.pe-pill--stroke-white,.pe-pill--interactive-rounded.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--interactive.pe-pill--stroke-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--stroke-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--interactive.pe-pill--stroke-white:active:not(:disabled):not([disabled]),.pe-pill--interactive.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--stroke-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--interactive.pe-pill--stroke-white:disabled,.pe-pill--interactive.pe-pill--stroke-white[disabled],.pe-pill--interactive.pe-pill--outline-white:disabled,.pe-pill--interactive.pe-pill--outline-white[disabled],.pe-pill--interactive-rounded.pe-pill--stroke-white:disabled,.pe-pill--interactive-rounded.pe-pill--stroke-white[disabled],.pe-pill--interactive-rounded.pe-pill--outline-white:disabled,.pe-pill--interactive-rounded.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-purple,.pe-pill--interactive-rounded.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:disabled,.pe-pill--interactive.pe-pill--outline-purple[disabled],.pe-pill--interactive-rounded.pe-pill--outline-purple:disabled,.pe-pill--interactive-rounded.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-red,.pe-pill--interactive-rounded.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:disabled,.pe-pill--interactive.pe-pill--outline-red[disabled],.pe-pill--interactive-rounded.pe-pill--outline-red:disabled,.pe-pill--interactive-rounded.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-green,.pe-pill--interactive-rounded.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:disabled,.pe-pill--interactive.pe-pill--outline-green[disabled],.pe-pill--interactive-rounded.pe-pill--outline-green:disabled,.pe-pill--interactive-rounded.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white,.pe-pill--dismissible.pe-pill--transparent-white{background-color:#ffffff1a;color:inherit}.pe-pill--interactive.pe-pill--transparent-white:disabled,.pe-pill--interactive.pe-pill--transparent-white[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-white:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-white[disabled],.pe-pill--dismissible.pe-pill--transparent-white:disabled,.pe-pill--dismissible.pe-pill--transparent-white[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-white,.pe-pill--interactive-rounded.pe-pill--transparent-white,.pe-pill--dismissible.pe-pill--transparent-white{color:#fff}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple,.pe-pill--dismissible.pe-pill--transparent-purple{background-color:#a781ff33;color:inherit}.pe-pill--interactive.pe-pill--transparent-purple:disabled,.pe-pill--interactive.pe-pill--transparent-purple[disabled],.pe-pill--interactive-rounded.pe-pill--transparent-purple:disabled,.pe-pill--interactive-rounded.pe-pill--transparent-purple[disabled],.pe-pill--dismissible.pe-pill--transparent-purple:disabled,.pe-pill--dismissible.pe-pill--transparent-purple[disabled]{background-color:#ffffff0d}.pe-pill--interactive.pe-pill--transparent-purple,.pe-pill--interactive-rounded.pe-pill--transparent-purple,.pe-pill--dismissible.pe-pill--transparent-purple{color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-white,.pe-pill--interactive-rounded.pe-pill--outline-white,.pe-pill--dismissible.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--interactive.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--interactive.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-white:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--interactive.pe-pill--outline-white:disabled,.pe-pill--interactive.pe-pill--outline-white[disabled],.pe-pill--interactive-rounded.pe-pill--outline-white:disabled,.pe-pill--interactive-rounded.pe-pill--outline-white[disabled],.pe-pill--dismissible.pe-pill--outline-white:disabled,.pe-pill--dismissible.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-purple,.pe-pill--interactive-rounded.pe-pill--outline-purple,.pe-pill--dismissible.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-purple:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--interactive.pe-pill--outline-purple:disabled,.pe-pill--interactive.pe-pill--outline-purple[disabled],.pe-pill--interactive-rounded.pe-pill--outline-purple:disabled,.pe-pill--interactive-rounded.pe-pill--outline-purple[disabled],.pe-pill--dismissible.pe-pill--outline-purple:disabled,.pe-pill--dismissible.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-red,.pe-pill--interactive-rounded.pe-pill--outline-red,.pe-pill--dismissible.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-red:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--interactive.pe-pill--outline-red:disabled,.pe-pill--interactive.pe-pill--outline-red[disabled],.pe-pill--interactive-rounded.pe-pill--outline-red:disabled,.pe-pill--interactive-rounded.pe-pill--outline-red[disabled],.pe-pill--dismissible.pe-pill--outline-red:disabled,.pe-pill--dismissible.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--interactive.pe-pill--outline-green,.pe-pill--interactive-rounded.pe-pill--outline-green,.pe-pill--dismissible.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:hover:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--interactive-rounded.pe-pill--outline-green:active:not(:disabled):not([disabled]),.pe-pill--dismissible.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--interactive.pe-pill--outline-green:disabled,.pe-pill--interactive.pe-pill--outline-green[disabled],.pe-pill--interactive-rounded.pe-pill--outline-green:disabled,.pe-pill--interactive-rounded.pe-pill--outline-green[disabled],.pe-pill--dismissible.pe-pill--outline-green:disabled,.pe-pill--dismissible.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--read-only.pe-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.pe-pill--read-only.pe-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.pe-pill--read-only.pe-pill--transparent-red{color:#f69d9d;border:1px solid #f69d9d}.pe-pill--read-only.pe-pill--transparent-green{color:#7edc96;border:1px solid #7edc96}.pe-pill--read-only.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--read-only.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--read-only.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--read-only.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--selectable{position:relative}.pe-pill--selectable.pe-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):hover{background-color:#fff3}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):active{background-color:#ffffff1a}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):selected{background-color:#fff3}.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--transparent-white:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):hover{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):active{background-color:#a781ff33}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):selected{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--transparent-purple:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.pe-pill--selectable.pe-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.pe-pill--selectable.pe-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.pe-pill--selectable.pe-pill--outline-white:disabled,.pe-pill--selectable.pe-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):hover{background-color:#fff3}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):active{background-color:#ffffff1a}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):selected{background-color:#fff3}.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-white:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.pe-pill--selectable.pe-pill--outline-purple:disabled,.pe-pill--selectable.pe-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):hover{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):active{background-color:#a781ff33}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):selected{background-color:#a781ff4d}.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-purple:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.pe-pill--selectable.pe-pill--outline-red:disabled,.pe-pill--selectable.pe-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#f3707033;color:inherit}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):hover{background-color:#f370704d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):active{background-color:#f3707033}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):selected{background-color:#f370704d}.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-red:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable.pe-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.pe-pill--selectable.pe-pill--outline-green:disabled,.pe-pill--selectable.pe-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked){border-color:transparent;background-color:#50c06c33;color:inherit}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):hover{background-color:#50c06c4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):active{background-color:#50c06c33}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):selected{background-color:#50c06c4d}.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked):disabled,.pe-pill--selectable.pe-pill--outline-green:has(.pe-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.pe-pill--selectable .pe-pill__checkbox{position:absolute;visibility:hidden;height:0;width:0;top:0;left:0}.pe-pill--disabled,.pe-pill[disabled],.pe-pill:disabled{cursor:not-allowed;color:#ffffff4d}.pe-pill--disabled.pe-pill--outline-white,.pe-pill--disabled.pe-pill--outline-purple,.pe-pill--disabled.pe-pill--outline-red,.pe-pill--disabled.pe-pill--outline-green,.pe-pill--disabled.pe-pill--stroke-white,.pe-pill[disabled].pe-pill--outline-white,.pe-pill[disabled].pe-pill--outline-purple,.pe-pill[disabled].pe-pill--outline-red,.pe-pill[disabled].pe-pill--outline-green,.pe-pill[disabled].pe-pill--stroke-white,.pe-pill:disabled.pe-pill--outline-white,.pe-pill:disabled.pe-pill--outline-purple,.pe-pill:disabled.pe-pill--outline-red,.pe-pill:disabled.pe-pill--outline-green,.pe-pill:disabled.pe-pill--stroke-white{border-color:#6c6c6c}.pe-pill .pe-icon{font-size:20px;line-height:20px}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], dismiss: [{ type: i0.Output, args: ["dismiss"] }] } });
+
+/** Place on the element projected into [pe-hero-badges] so the hero can detect custom badges content. */
+class PeHeroBadgesSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroBadgesSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: PeHeroBadgesSlotDirective, isStandalone: true, selector: "[pe-hero-badges]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroBadgesSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-hero-badges]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-hero-title] so the hero can detect custom title content. */
+class PeHeroTitleSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroTitleSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: PeHeroTitleSlotDirective, isStandalone: true, selector: "[pe-hero-title]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroTitleSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-hero-title]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-hero-subtitle] so the hero can detect custom subtitle content. */
+class PeHeroSubtitleSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroSubtitleSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: PeHeroSubtitleSlotDirective, isStandalone: true, selector: "[pe-hero-subtitle]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroSubtitleSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-hero-subtitle]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-hero-actions] so the hero can detect custom actions content. */
+class PeHeroActionsSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroActionsSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: PeHeroActionsSlotDirective, isStandalone: true, selector: "[pe-hero-actions]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroActionsSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-hero-actions]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-hero-content] for optional extra content (e.g. between subtitle and actions). */
+class PeHeroContentSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroContentSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: PeHeroContentSlotDirective, isStandalone: true, selector: "[pe-hero-content]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PeHeroContentSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-hero-content]',
+                    standalone: true,
+                }]
+        }] });
+
+/**
+ * Hero component for displaying prominent hero sections with title, description,
+ * call-to-action buttons, optional badges, and background image support.
+ * Fully responsive across mobile, tablet, and desktop.
+ *
+ * When slots are not projected, inputs are used (title, subtitle, badges, primaryAction, secondaryAction).
+ * Content projection slots: pe-hero-badges, pe-hero-title, pe-hero-subtitle, pe-hero-actions, pe-hero-content.
+ *
+ * @example
+ * ```html
+ * <pe-hero
+ *   title="Welcome"
+ *   subtitle="Build amazing experiences"
+ *   [primaryAction]="{ label: 'Get Started', href: '/signup' }"
+ *   [badges]="['New', 'Featured']"
+ * />
+ * ```
+ */
+class HeroComponent {
+    /** Main headline text */
+    title = input.required(...(ngDevMode ? [{ debugName: "title" }] : []));
+    /** Supporting description text */
+    subtitle = input(undefined, ...(ngDevMode ? [{ debugName: "subtitle" }] : []));
+    /** Primary call-to-action button */
+    primaryAction = input(undefined, ...(ngDevMode ? [{ debugName: "primaryAction" }] : []));
+    /** Secondary call-to-action button */
+    secondaryAction = input(undefined, ...(ngDevMode ? [{ debugName: "secondaryAction" }] : []));
+    /** Badge/pill labels to display above the title */
+    badges = input([], ...(ngDevMode ? [{ debugName: "badges" }] : []));
+    /** Background image URL */
+    backgroundImage = input(undefined, ...(ngDevMode ? [{ debugName: "backgroundImage" }] : []));
+    /**
+     * CSS gradient or color for the overlay on top of the background image.
+     * E.g. "linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.7) 100%)" or "rgba(0,0,0,0.5)".
+     * When unset, a default dark overlay is used when a background image is present.
+     */
+    backgroundOverlayGradient = input(undefined, ...(ngDevMode ? [{ debugName: "backgroundOverlayGradient" }] : []));
+    /**
+     * CSS filter applied to the background image (e.g. "brightness(0.8)", "blur(2px)", "grayscale(0.3)").
+     * Combine multiple: "brightness(0.7) contrast(1.1)".
+     */
+    backgroundFilter = input(undefined, ...(ngDevMode ? [{ debugName: "backgroundFilter" }] : []));
+    /** Text and content alignment */
+    alignment = input('center', ...(ngDevMode ? [{ debugName: "alignment" }] : []));
+    /** Hero section size variant */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** Whether hero takes full viewport height */
+    fullHeight = input(false, ...(ngDevMode ? [{ debugName: "fullHeight" }] : []));
+    badgesSlot = contentChild(PeHeroBadgesSlotDirective, ...(ngDevMode ? [{ debugName: "badgesSlot" }] : []));
+    titleSlot = contentChild(PeHeroTitleSlotDirective, ...(ngDevMode ? [{ debugName: "titleSlot" }] : []));
+    subtitleSlot = contentChild(PeHeroSubtitleSlotDirective, ...(ngDevMode ? [{ debugName: "subtitleSlot" }] : []));
+    actionsSlot = contentChild(PeHeroActionsSlotDirective, ...(ngDevMode ? [{ debugName: "actionsSlot" }] : []));
+    contentSlot = contentChild(PeHeroContentSlotDirective, ...(ngDevMode ? [{ debugName: "contentSlot" }] : []));
+    hasBadgesSlot = computed(() => !!this.badgesSlot(), ...(ngDevMode ? [{ debugName: "hasBadgesSlot" }] : []));
+    hasTitleSlot = computed(() => !!this.titleSlot(), ...(ngDevMode ? [{ debugName: "hasTitleSlot" }] : []));
+    hasSubtitleSlot = computed(() => !!this.subtitleSlot(), ...(ngDevMode ? [{ debugName: "hasSubtitleSlot" }] : []));
+    hasActionsSlot = computed(() => !!this.actionsSlot(), ...(ngDevMode ? [{ debugName: "hasActionsSlot" }] : []));
+    hasContentSlot = computed(() => !!this.contentSlot(), ...(ngDevMode ? [{ debugName: "hasContentSlot" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: HeroComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: HeroComponent, isStandalone: true, selector: "pe-hero", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, primaryAction: { classPropertyName: "primaryAction", publicName: "primaryAction", isSignal: true, isRequired: false, transformFunction: null }, secondaryAction: { classPropertyName: "secondaryAction", publicName: "secondaryAction", isSignal: true, isRequired: false, transformFunction: null }, badges: { classPropertyName: "badges", publicName: "badges", isSignal: true, isRequired: false, transformFunction: null }, backgroundImage: { classPropertyName: "backgroundImage", publicName: "backgroundImage", isSignal: true, isRequired: false, transformFunction: null }, backgroundOverlayGradient: { classPropertyName: "backgroundOverlayGradient", publicName: "backgroundOverlayGradient", isSignal: true, isRequired: false, transformFunction: null }, backgroundFilter: { classPropertyName: "backgroundFilter", publicName: "backgroundFilter", isSignal: true, isRequired: false, transformFunction: null }, alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "badgesSlot", first: true, predicate: PeHeroBadgesSlotDirective, descendants: true, isSignal: true }, { propertyName: "titleSlot", first: true, predicate: PeHeroTitleSlotDirective, descendants: true, isSignal: true }, { propertyName: "subtitleSlot", first: true, predicate: PeHeroSubtitleSlotDirective, descendants: true, isSignal: true }, { propertyName: "actionsSlot", first: true, predicate: PeHeroActionsSlotDirective, descendants: true, isSignal: true }, { propertyName: "contentSlot", first: true, predicate: PeHeroContentSlotDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<section\n  class=\"pe-hero pe-hero-alignment-{{ alignment() }} pe-hero-size-{{ size() }}\"\n  role=\"banner\"\n  [attr.aria-label]=\"title()\"\n  [class.pe-hero--full-height]=\"fullHeight()\"\n  [class.pe-hero--has-background]=\"!!backgroundImage()\"\n>\n  @if (backgroundImage()) {\n    <div\n      class=\"pe-hero__background\"\n      [style.background-image]=\"'url(' + backgroundImage() + ')'\"\n      [style.filter]=\"backgroundFilter() || null\"\n      aria-hidden=\"true\"\n    ></div>\n    <div\n      class=\"pe-hero__overlay\"\n      [style.background]=\"backgroundOverlayGradient() || 'rgba(0, 0, 0, 0.4)'\"\n      aria-hidden=\"true\"\n    ></div>\n  }\n\n  <div class=\"pe-hero__content\">\n    @if (hasBadgesSlot()) {\n      <div class=\"pe-hero__badges\">\n        <ng-content select=\"[pe-hero-badges]\" />\n      </div>\n    } @else if (badges().length) {\n      <div class=\"pe-hero__badges\">\n        @for (badge of badges(); track badge) {\n          <pe-pill variant=\"read-only\" theme=\"transparent-white\" size=\"md\">\n            {{ badge }}\n          </pe-pill>\n        }\n      </div>\n    }\n\n    @if (hasTitleSlot()) {\n      <div class=\"pe-hero__title\">\n        <ng-content select=\"[pe-hero-title]\" />\n      </div>\n    } @else {\n      <h1 class=\"pe-hero__title\">{{ title() }}</h1>\n    }\n\n    @if (hasSubtitleSlot()) {\n      <div class=\"pe-hero__subtitle\">\n        <ng-content select=\"[pe-hero-subtitle]\" />\n      </div>\n    } @else if (subtitle()) {\n      <p class=\"pe-hero__subtitle\">{{ subtitle() }}</p>\n    }\n\n    @if (hasContentSlot()) {\n      <div class=\"pe-hero__extra\">\n        <ng-content select=\"[pe-hero-content]\" />\n      </div>\n    }\n\n    @if (hasActionsSlot()) {\n      <div class=\"pe-hero__actions\">\n        <ng-content select=\"[pe-hero-actions]\" />\n      </div>\n    } @else if (primaryAction() || secondaryAction()) {\n      <div class=\"pe-hero__actions\">\n        @if (primaryAction()) {\n          @if (primaryAction()!.href) {\n            <a [href]=\"primaryAction()!.href\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n                [size]=\"primaryAction()!.size ?? 'md'\"\n              >\n                @if (primaryAction()!.icon) {\n                  <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ primaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else if (primaryAction()!.routerLink) {\n            <a [routerLink]=\"primaryAction()!.routerLink\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n                [size]=\"primaryAction()!.size ?? 'md'\"\n              >\n                @if (primaryAction()!.icon) {\n                  <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ primaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else {\n            <pe-button\n              [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n              [size]=\"primaryAction()!.size ?? 'md'\"\n            >\n              @if (primaryAction()!.icon) {\n                <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n              }\n              {{ primaryAction()!.label }}\n            </pe-button>\n          }\n        }\n        @if (secondaryAction()) {\n          @if (secondaryAction()!.href) {\n            <a [href]=\"secondaryAction()!.href\" class=\"pe-hero__action-link\">\n              <pe-button theme=\"ghost-white\" [size]=\"secondaryAction()!.size ?? 'md'\">\n                @if (secondaryAction()!.icon) {\n                  <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ secondaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else if (secondaryAction()!.routerLink) {\n            <a [routerLink]=\"secondaryAction()!.routerLink\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"secondaryAction()!.theme ?? 'ghost-white'\"\n                [size]=\"secondaryAction()!.size ?? 'md'\"\n              >\n                @if (secondaryAction()!.icon) {\n                  <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ secondaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else {\n            <pe-button\n              [theme]=\"secondaryAction()!.theme ?? 'ghost-white'\"\n              [size]=\"secondaryAction()!.size ?? 'md'\"\n            >\n              @if (secondaryAction()!.icon) {\n                <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n              }\n              {{ secondaryAction()!.label }}\n            </pe-button>\n          }\n        }\n      </div>\n    }\n  </div>\n</section>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-hero{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:0;padding:32px 16px;color:#fff}.pe-hero--full-height{min-height:100vh}.pe-hero--has-background .pe-hero__content{position:relative;z-index:1}.pe-hero--alignment-left .pe-hero__content{align-items:flex-start;text-align:left}.pe-hero--alignment-left .pe-hero__badges,.pe-hero--alignment-left .pe-hero__actions{justify-content:flex-start}.pe-hero--alignment-center .pe-hero__content{align-items:center;text-align:center}.pe-hero--alignment-center .pe-hero__badges,.pe-hero--alignment-center .pe-hero__actions{justify-content:center}.pe-hero--alignment-right .pe-hero__content{align-items:flex-end;text-align:right}.pe-hero--alignment-right .pe-hero__badges,.pe-hero--alignment-right .pe-hero__actions{justify-content:flex-end}.pe-hero__background{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#232323}.pe-hero__overlay{position:absolute;inset:0;pointer-events:none}.pe-hero__content{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:100%}.pe-hero__badges{display:flex;flex-wrap:wrap;gap:8px}.pe-hero__title{margin:0;color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero__subtitle{margin:0;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;max-width:100%}.pe-hero__extra{display:flex;flex-direction:column;gap:16px;width:100%}.pe-hero__actions{display:flex;flex-wrap:wrap;gap:12px;flex-direction:column}.pe-hero__action-link{color:inherit;text-decoration:none;display:inline-flex}.pe-hero--size-sm{padding:24px 16px}.pe-hero--size-sm .pe-hero__content{gap:12px}.pe-hero--size-sm .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-hero--size-sm .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-hero--size-md .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero--size-md .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-hero--size-lg{padding:48px 16px}.pe-hero--size-lg .pe-hero__content{gap:24px}.pe-hero--size-lg .pe-hero__title{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-hero--size-lg .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}@media(max-width:1279px){.pe-hero{padding:24px 16px}.pe-hero--size-sm{padding:16px}.pe-hero--size-lg{padding:32px 16px}.pe-hero .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-hero .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-hero .pe-hero__actions{flex-direction:column;width:100%;max-width:100%}.pe-hero .pe-hero__action-link,.pe-hero .pe-hero__actions>pe-button{width:100%}.pe-hero .pe-hero__action-link pe-button{width:100%}}@media(min-width:1024px)and (max-width:1279px){.pe-hero{padding:32px 24px}.pe-hero--size-lg{padding:40px 24px}.pe-hero .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-hero .pe-hero__actions{flex-direction:row;flex-wrap:wrap}}@media(min-width:1280px){.pe-hero{padding:40px 32px}.pe-hero--size-sm{padding:24px 32px}.pe-hero--size-lg{padding:64px 32px}.pe-hero .pe-hero__content{max-width:800px}.pe-hero .pe-hero__actions{flex-direction:row}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: PillComponent, selector: "pe-pill", inputs: ["variant", "theme", "size", "disabled"], outputs: ["dismiss"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: HeroComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-hero', standalone: true, imports: [ButtonComponent, IconComponent, PillComponent, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<section\n  class=\"pe-hero pe-hero-alignment-{{ alignment() }} pe-hero-size-{{ size() }}\"\n  role=\"banner\"\n  [attr.aria-label]=\"title()\"\n  [class.pe-hero--full-height]=\"fullHeight()\"\n  [class.pe-hero--has-background]=\"!!backgroundImage()\"\n>\n  @if (backgroundImage()) {\n    <div\n      class=\"pe-hero__background\"\n      [style.background-image]=\"'url(' + backgroundImage() + ')'\"\n      [style.filter]=\"backgroundFilter() || null\"\n      aria-hidden=\"true\"\n    ></div>\n    <div\n      class=\"pe-hero__overlay\"\n      [style.background]=\"backgroundOverlayGradient() || 'rgba(0, 0, 0, 0.4)'\"\n      aria-hidden=\"true\"\n    ></div>\n  }\n\n  <div class=\"pe-hero__content\">\n    @if (hasBadgesSlot()) {\n      <div class=\"pe-hero__badges\">\n        <ng-content select=\"[pe-hero-badges]\" />\n      </div>\n    } @else if (badges().length) {\n      <div class=\"pe-hero__badges\">\n        @for (badge of badges(); track badge) {\n          <pe-pill variant=\"read-only\" theme=\"transparent-white\" size=\"md\">\n            {{ badge }}\n          </pe-pill>\n        }\n      </div>\n    }\n\n    @if (hasTitleSlot()) {\n      <div class=\"pe-hero__title\">\n        <ng-content select=\"[pe-hero-title]\" />\n      </div>\n    } @else {\n      <h1 class=\"pe-hero__title\">{{ title() }}</h1>\n    }\n\n    @if (hasSubtitleSlot()) {\n      <div class=\"pe-hero__subtitle\">\n        <ng-content select=\"[pe-hero-subtitle]\" />\n      </div>\n    } @else if (subtitle()) {\n      <p class=\"pe-hero__subtitle\">{{ subtitle() }}</p>\n    }\n\n    @if (hasContentSlot()) {\n      <div class=\"pe-hero__extra\">\n        <ng-content select=\"[pe-hero-content]\" />\n      </div>\n    }\n\n    @if (hasActionsSlot()) {\n      <div class=\"pe-hero__actions\">\n        <ng-content select=\"[pe-hero-actions]\" />\n      </div>\n    } @else if (primaryAction() || secondaryAction()) {\n      <div class=\"pe-hero__actions\">\n        @if (primaryAction()) {\n          @if (primaryAction()!.href) {\n            <a [href]=\"primaryAction()!.href\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n                [size]=\"primaryAction()!.size ?? 'md'\"\n              >\n                @if (primaryAction()!.icon) {\n                  <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ primaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else if (primaryAction()!.routerLink) {\n            <a [routerLink]=\"primaryAction()!.routerLink\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n                [size]=\"primaryAction()!.size ?? 'md'\"\n              >\n                @if (primaryAction()!.icon) {\n                  <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ primaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else {\n            <pe-button\n              [theme]=\"primaryAction()!.theme ?? 'fill-purple'\"\n              [size]=\"primaryAction()!.size ?? 'md'\"\n            >\n              @if (primaryAction()!.icon) {\n                <pe-icon [icon]=\"primaryAction()!.icon!\" size=\"6\" />\n              }\n              {{ primaryAction()!.label }}\n            </pe-button>\n          }\n        }\n        @if (secondaryAction()) {\n          @if (secondaryAction()!.href) {\n            <a [href]=\"secondaryAction()!.href\" class=\"pe-hero__action-link\">\n              <pe-button theme=\"ghost-white\" [size]=\"secondaryAction()!.size ?? 'md'\">\n                @if (secondaryAction()!.icon) {\n                  <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ secondaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else if (secondaryAction()!.routerLink) {\n            <a [routerLink]=\"secondaryAction()!.routerLink\" class=\"pe-hero__action-link\">\n              <pe-button\n                [theme]=\"secondaryAction()!.theme ?? 'ghost-white'\"\n                [size]=\"secondaryAction()!.size ?? 'md'\"\n              >\n                @if (secondaryAction()!.icon) {\n                  <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n                }\n                {{ secondaryAction()!.label }}\n              </pe-button>\n            </a>\n          } @else {\n            <pe-button\n              [theme]=\"secondaryAction()!.theme ?? 'ghost-white'\"\n              [size]=\"secondaryAction()!.size ?? 'md'\"\n            >\n              @if (secondaryAction()!.icon) {\n                <pe-icon [icon]=\"secondaryAction()!.icon!\" size=\"6\" />\n              }\n              {{ secondaryAction()!.label }}\n            </pe-button>\n          }\n        }\n      </div>\n    }\n  </div>\n</section>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-hero{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:0;padding:32px 16px;color:#fff}.pe-hero--full-height{min-height:100vh}.pe-hero--has-background .pe-hero__content{position:relative;z-index:1}.pe-hero--alignment-left .pe-hero__content{align-items:flex-start;text-align:left}.pe-hero--alignment-left .pe-hero__badges,.pe-hero--alignment-left .pe-hero__actions{justify-content:flex-start}.pe-hero--alignment-center .pe-hero__content{align-items:center;text-align:center}.pe-hero--alignment-center .pe-hero__badges,.pe-hero--alignment-center .pe-hero__actions{justify-content:center}.pe-hero--alignment-right .pe-hero__content{align-items:flex-end;text-align:right}.pe-hero--alignment-right .pe-hero__badges,.pe-hero--alignment-right .pe-hero__actions{justify-content:flex-end}.pe-hero__background{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#232323}.pe-hero__overlay{position:absolute;inset:0;pointer-events:none}.pe-hero__content{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:100%}.pe-hero__badges{display:flex;flex-wrap:wrap;gap:8px}.pe-hero__title{margin:0;color:#fff;font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero__subtitle{margin:0;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;max-width:100%}.pe-hero__extra{display:flex;flex-direction:column;gap:16px;width:100%}.pe-hero__actions{display:flex;flex-wrap:wrap;gap:12px;flex-direction:column}.pe-hero__action-link{color:inherit;text-decoration:none;display:inline-flex}.pe-hero--size-sm{padding:24px 16px}.pe-hero--size-sm .pe-hero__content{gap:12px}.pe-hero--size-sm .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-hero--size-sm .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-hero--size-md .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero--size-md .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-hero--size-lg{padding:48px 16px}.pe-hero--size-lg .pe-hero__content{gap:24px}.pe-hero--size-lg .pe-hero__title{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-hero--size-lg .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}@media(max-width:1279px){.pe-hero{padding:24px 16px}.pe-hero--size-sm{padding:16px}.pe-hero--size-lg{padding:32px 16px}.pe-hero .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-hero .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-hero .pe-hero__actions{flex-direction:column;width:100%;max-width:100%}.pe-hero .pe-hero__action-link,.pe-hero .pe-hero__actions>pe-button{width:100%}.pe-hero .pe-hero__action-link pe-button{width:100%}}@media(min-width:1024px)and (max-width:1279px){.pe-hero{padding:32px 24px}.pe-hero--size-lg{padding:40px 24px}.pe-hero .pe-hero__title{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-hero .pe-hero__subtitle{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-hero .pe-hero__actions{flex-direction:row;flex-wrap:wrap}}@media(min-width:1280px){.pe-hero{padding:40px 32px}.pe-hero--size-sm{padding:24px 32px}.pe-hero--size-lg{padding:64px 32px}.pe-hero .pe-hero__content{max-width:800px}.pe-hero .pe-hero__actions{flex-direction:row}}\n"] }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], primaryAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "primaryAction", required: false }] }], secondaryAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "secondaryAction", required: false }] }], badges: [{ type: i0.Input, args: [{ isSignal: true, alias: "badges", required: false }] }], backgroundImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "backgroundImage", required: false }] }], backgroundOverlayGradient: [{ type: i0.Input, args: [{ isSignal: true, alias: "backgroundOverlayGradient", required: false }] }], backgroundFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "backgroundFilter", required: false }] }], alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], fullHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullHeight", required: false }] }], badgesSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PeHeroBadgesSlotDirective), { isSignal: true }] }], titleSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PeHeroTitleSlotDirective), { isSignal: true }] }], subtitleSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PeHeroSubtitleSlotDirective), { isSignal: true }] }], actionsSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PeHeroActionsSlotDirective), { isSignal: true }] }], contentSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PeHeroContentSlotDirective), { isSignal: true }] }] } });
+
+/**
+ * Directive to handle image loading errors and display placeholders
+ */
+class ImageNotFoundDirective {
+    // Controls whether to show a placeholder when image fails to load
+    showPlaceholder = input(true, ...(ngDevMode ? [{ debugName: "showPlaceholder" }] : []));
+    // Signal to track if image failed to load
+    imageNotFound = signal(false, ...(ngDevMode ? [{ debugName: "imageNotFound" }] : []));
+    // Signal to control alt and icon visibility of broken images.
+    visibility = signal('hidden', ...(ngDevMode ? [{ debugName: "visibility" }] : []));
+    /**
+     * Handles image loading errors
+     * Hides the image and optionally shows placeholder
+     */
+    handleError() {
+        this.visibility.set('hidden');
+        if (this.showPlaceholder()) {
+            this.imageNotFound.set(true);
+        }
+    }
+    /**
+     * Handles successful image load
+     * Shows the image and removes placeholder
+     */
+    handleLoad() {
+        this.imageNotFound.set(false);
+        this.visibility.set('visible');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ImageNotFoundDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.2", type: ImageNotFoundDirective, isStandalone: true, selector: "[peCatchImageNotFound]", inputs: { showPlaceholder: { classPropertyName: "showPlaceholder", publicName: "showPlaceholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "load": "handleLoad()", "error": "handleError()" }, properties: { "class.pe-image--not-found": "imageNotFound()", "style.visibility": "visibility()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ImageNotFoundDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[peCatchImageNotFound]',
+                    host: {
+                        '(load)': 'handleLoad()',
+                        '(error)': 'handleError()',
+                        '[class.pe-image--not-found]': 'imageNotFound()',
+                        '[style.visibility]': 'visibility()',
+                    },
+                }]
+        }], propDecorators: { showPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPlaceholder", required: false }] }] } });
+
+/**
+ * A reusable input component that follows UDS design system guidelines.
+ * Implements FormValueControl for use with Signal Forms [formField] directive.
+ *
+ * Use [(value)] for two-way binding, or bind with [formField]="myForm().email" for Signal Forms.
+ *
+ * Content projection: [pe-input-left-elements], [pe-input-right-elements].
+ */
+class InputComponent {
+    type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    /** Border/hover style: border-only (hover = border only), subtle-tint (hover = border + 5% fill). */
+    appearance = input('border-only', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    maxLength = input(...(ngDevMode ? [undefined, { debugName: "maxLength" }] : []));
+    minLength = input(...(ngDevMode ? [undefined, { debugName: "minLength" }] : []));
+    pattern = input([], ...(ngDevMode ? [{ debugName: "pattern" }] : []));
+    autocomplete = input('off', ...(ngDevMode ? [{ debugName: "autocomplete" }] : []));
+    /** When provided (e.g. by a parent form field), the input element uses this id instead of the internal one. */
+    controlId = input(...(ngDevMode ? [undefined, { debugName: "controlId" }] : []));
+    /** FormUiControl optional: bound by [formField] when invalid */
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    /** FormUiControl optional: bound by [formField] for validation errors */
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    /** FormUiControl optional: control sets on blur */
+    touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    value = model('', ...(ngDevMode ? [{ debugName: "value" }] : []));
+    ids = createFormFieldIds('pe-input');
+    effectiveControlId = computed(() => this.controlId() ?? this.ids.controlId, ...(ngDevMode ? [{ debugName: "effectiveControlId" }] : []));
+    effectiveHelperId = computed(() => (this.controlId() ? `${this.controlId()}-helper` : this.ids.helperId), ...(ngDevMode ? [{ debugName: "effectiveHelperId" }] : []));
+    effectiveErrorId = computed(() => (this.controlId() ? `${this.controlId()}-error` : this.ids.errorId), ...(ngDevMode ? [{ debugName: "effectiveErrorId" }] : []));
+    isFocused = signal(false, ...(ngDevMode ? [{ debugName: "isFocused" }] : []));
+    isDirty = signal(false, ...(ngDevMode ? [{ debugName: "isDirty" }] : []));
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.effectiveHelperId(), this.effectiveErrorId(), !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    // Outputs
+    inputBlur = output();
+    inputFocus = output();
+    valueChange = output();
+    constructor() {
+        // Effect to emit value changes
+        effect(() => {
+            const currentValue = this.value();
+            if (this.isDirty()) {
+                this.valueChange.emit(currentValue);
+            }
+        });
+    }
+    onInput(event) {
+        const value = event.target.value;
+        this.isDirty.set(true);
+        this.value.set(value);
+    }
+    onBlur(event) {
+        this.isFocused.set(false);
+        this.touched.set(true);
+        this.inputBlur.emit(event);
+    }
+    onFocus(event) {
+        this.isFocused.set(true);
+        this.inputFocus.emit(event);
+    }
+    /**
+     * Programmatically focuses the input element
+     */
+    focus() {
+        const inputEl = document.getElementById(this.effectiveControlId());
+        inputEl?.focus();
+    }
+    select() {
+        const inputEl = document.getElementById(this.effectiveControlId());
+        inputEl?.select();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: InputComponent, isStandalone: true, selector: "pe-input", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, pattern: { classPropertyName: "pattern", publicName: "pattern", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touched: "touchedChange", value: "valueChange", inputBlur: "inputBlur", inputFocus: "inputFocus", valueChange: "valueChange" }, ngImport: i0, template: "<div\n  class=\"pe-input pe-input--{{ size() }} pe-input--appearance-{{ appearance() }}\"\n  [class.pe-input--error]=\"hasError()\"\n  [class.pe-input--disabled]=\"disabled()\"\n  [class.pe-input--read-only]=\"readOnly()\"\n  [class.pe-input--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"effectiveControlId()\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-input__group\" [class.pe-input__group--focused]=\"isFocused()\">\n    <div class=\"pe-input__left-elements\">\n      <ng-content select=\"[pe-input-left-elements]\" />\n    </div>\n\n    <input\n      [id]=\"effectiveControlId()\"\n      [type]=\"type()\"\n      class=\"pe-input__field\"\n      [placeholder]=\"placeholder()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur($event)\"\n      (focus)=\"onFocus($event)\"\n      [disabled]=\"disabled()\"\n      [readonly]=\"readOnly()\"\n      [required]=\"required()\"\n      [attr.maxlength]=\"maxLength()\"\n      [attr.minlength]=\"minLength()\"\n      [attr.pattern]=\"pattern()\"\n      [attr.autocomplete]=\"autocomplete()\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n    />\n\n    <div class=\"pe-input__right-elements\">\n      <ng-content select=\"[pe-input-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"effectiveHelperId()\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-input{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-input__group{display:flex;align-items:center;height:40px;padding:0 12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-input__group--focused{border-color:#ffffff80}.pe-input--appearance-border-only:not(.pe-input--disabled) .pe-input__group:hover{border-color:#ffffff4d}.pe-input--appearance-subtle-tint:not(.pe-input--disabled) .pe-input__group:hover{border-color:#ffffff4d;background-color:#ffffff0d}.pe-input__field{all:unset;flex:1}.pe-input__field::placeholder{color:#ffffff80}.pe-input__field:hover::placeholder{color:#fff}.pe-input__left-elements,.pe-input__right-elements{display:flex;gap:8px}.pe-input__left-elements ::ng-deep .pe-icon,.pe-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-input--sm .pe-input__group{height:32px;padding:0 8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-input--sm .pe-input__left-elements,.pe-input--sm .pe-input__right-elements{gap:4px}.pe-input--sm .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--sm .pe-input__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-input--md .pe-input__group{height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-input--md .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--md .pe-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-input--lg .pe-input__group{height:48px;padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-input--lg .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--lg .pe-input__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-input--xl .pe-input__group{height:64px;padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-input--xl .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--xl .pe-input__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-input--error .pe-input__group{border:2px solid #f69d9d}.pe-input--disabled .pe-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-input--disabled .pe-input__field,.pe-input--disabled .pe-input__field:disabled::placeholder{color:#ffffff4d}.pe-input--read-only .pe-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-input--read-only .pe-input__field,.pe-input--read-only .pe-input__field:read-only::placeholder{color:#ffffffb3}\n"], dependencies: [{ kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-input', standalone: true, imports: [FormFieldLabelComponent, FormFieldHelperComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-input pe-input--{{ size() }} pe-input--appearance-{{ appearance() }}\"\n  [class.pe-input--error]=\"hasError()\"\n  [class.pe-input--disabled]=\"disabled()\"\n  [class.pe-input--read-only]=\"readOnly()\"\n  [class.pe-input--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"effectiveControlId()\"\n    [size]=\"size()\"\n  />\n\n  <div class=\"pe-input__group\" [class.pe-input__group--focused]=\"isFocused()\">\n    <div class=\"pe-input__left-elements\">\n      <ng-content select=\"[pe-input-left-elements]\" />\n    </div>\n\n    <input\n      [id]=\"effectiveControlId()\"\n      [type]=\"type()\"\n      class=\"pe-input__field\"\n      [placeholder]=\"placeholder()\"\n      [value]=\"value()\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onBlur($event)\"\n      (focus)=\"onFocus($event)\"\n      [disabled]=\"disabled()\"\n      [readonly]=\"readOnly()\"\n      [required]=\"required()\"\n      [attr.maxlength]=\"maxLength()\"\n      [attr.minlength]=\"minLength()\"\n      [attr.pattern]=\"pattern()\"\n      [attr.autocomplete]=\"autocomplete()\"\n      [attr.aria-invalid]=\"hasError()\"\n      [attr.aria-required]=\"required()\"\n      [attr.aria-describedby]=\"describedBy()\"\n    />\n\n    <div class=\"pe-input__right-elements\">\n      <ng-content select=\"[pe-input-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"effectiveHelperId()\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-input{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-input__group{display:flex;align-items:center;height:40px;padding:0 12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-input__group--focused{border-color:#ffffff80}.pe-input--appearance-border-only:not(.pe-input--disabled) .pe-input__group:hover{border-color:#ffffff4d}.pe-input--appearance-subtle-tint:not(.pe-input--disabled) .pe-input__group:hover{border-color:#ffffff4d;background-color:#ffffff0d}.pe-input__field{all:unset;flex:1}.pe-input__field::placeholder{color:#ffffff80}.pe-input__field:hover::placeholder{color:#fff}.pe-input__left-elements,.pe-input__right-elements{display:flex;gap:8px}.pe-input__left-elements ::ng-deep .pe-icon,.pe-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-input--sm .pe-input__group{height:32px;padding:0 8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-input--sm .pe-input__left-elements,.pe-input--sm .pe-input__right-elements{gap:4px}.pe-input--sm .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--sm .pe-input__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-input--md .pe-input__group{height:40px;padding:0 12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-input--md .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--md .pe-input__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-input--lg .pe-input__group{height:48px;padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-input--lg .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--lg .pe-input__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-input--xl .pe-input__group{height:64px;padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-input--xl .pe-input__left-elements ::ng-deep .pe-icon,.pe-input--xl .pe-input__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-input--error .pe-input__group{border:2px solid #f69d9d}.pe-input--disabled .pe-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-input--disabled .pe-input__field,.pe-input--disabled .pe-input__field:disabled::placeholder{color:#ffffff4d}.pe-input--read-only .pe-input__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-input--read-only .pe-input__field,.pe-input--read-only .pe-input__field:read-only::placeholder{color:#ffffffb3}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], minLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minLength", required: false }] }], pattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "pattern", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+class ModalComponent {
+    /** Whether the modal is open. Supports two-way binding with [(open)]. */
+    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    /** Visual variant: default, success, error, custom, or bottom-sheet (mobile-only layout). */
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    /** Optional title shown in the header. */
+    title = input(undefined, ...(ngDevMode ? [{ debugName: "title" }] : []));
+    /** Whether clicking the backdrop closes the modal. */
+    closeOnBackdropClick = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdropClick" }] : []));
+    /** Whether to show the close button in the header. */
+    showCloseButton = input(true, ...(ngDevMode ? [{ debugName: "showCloseButton" }] : []));
+    /** Label for the primary confirm action in the confirmation variant. */
+    confirmLabel = input('Confirm', ...(ngDevMode ? [{ debugName: "confirmLabel" }] : []));
+    /** Label for the secondary cancel action in the confirmation variant. */
+    cancelLabel = input('Cancel', ...(ngDevMode ? [{ debugName: "cancelLabel" }] : []));
+    /** Optional CSS class for the panel (e.g. for custom variant). */
+    customClass = input(undefined, ...(ngDevMode ? [{ debugName: "customClass" }] : []));
+    /** Emitted when the modal is closed (button, backdrop, or escape). */
+    closed = output();
+    /** Emitted when the user confirms in the confirmation variant. */
+    confirmed = output();
+    /** Emitted when the user cancels in the confirmation variant. */
+    cancelled = output();
+    panelClass = computed(() => {
+        const variant = this.variant();
+        const custom = this.customClass();
+        const classes = ['pe-modal__panel', `pe-modal__panel--${variant}`];
+        if (custom) {
+            classes.push(custom);
+        }
+        return classes.join(' ');
+    }, ...(ngDevMode ? [{ debugName: "panelClass" }] : []));
+    isConfirmation = computed(() => this.variant() === 'confirmation', ...(ngDevMode ? [{ debugName: "isConfirmation" }] : []));
+    isSuccess = computed(() => this.variant() === 'success', ...(ngDevMode ? [{ debugName: "isSuccess" }] : []));
+    isError = computed(() => this.variant() === 'error', ...(ngDevMode ? [{ debugName: "isError" }] : []));
+    modalTitle = computed(() => (this.isSuccess() || this.isError()) ? '' : this.title(), ...(ngDevMode ? [{ debugName: "modalTitle" }] : []));
+    titleId = `pe-modal-title-${Math.random().toString(36).slice(2, 11)}`;
+    bodyId = `pe-modal-body-${Math.random().toString(36).slice(2, 11)}`;
+    close() {
+        this.open.set(false);
+        this.closed.emit();
+    }
+    onConfirm() {
+        if (!this.isConfirmation()) {
+            return;
+        }
+        this.confirmed.emit();
+        this.close();
+    }
+    onCancel() {
+        if (!this.isConfirmation()) {
+            return;
+        }
+        this.cancelled.emit();
+        this.close();
+    }
+    onBackdropClick(event) {
+        if (this.closeOnBackdropClick() && event.target === event.currentTarget) {
+            this.close();
+        }
+    }
+    onEscape() {
+        if (this.open()) {
+            this.close();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ModalComponent, isStandalone: true, selector: "pe-modal", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdropClick: { classPropertyName: "closeOnBackdropClick", publicName: "closeOnBackdropClick", isSignal: true, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null }, customClass: { classPropertyName: "customClass", publicName: "customClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed", confirmed: "confirmed", cancelled: "cancelled" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "attr.aria-hidden": "!open()" } }, ngImport: i0, template: "@if (open()) {\n  <div\n    class=\"pe-modal pe-modal--backdrop\"\n    role=\"dialog\"\n    [attr.aria-modal]=\"true\"\n    [attr.aria-labelledby]=\"title() ? titleId : null\"\n    [attr.aria-describedby]=\"bodyId\"\n    (click)=\"onBackdropClick($event)\"\n  >\n    <div [class]=\"panelClass()\" cdkTrapFocus (click)=\"$event.stopPropagation()\">\n      @if (modalTitle() || showCloseButton()) {\n        <header class=\"pe-modal__header\">\n          @if (modalTitle()) {\n            <h2 [id]=\"titleId\" class=\"pe-modal__title\">{{ title() }}</h2>\n          }\n          @if (showCloseButton()) {\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Close\"\n              class=\"pe-modal__close\"\n              (buttonClick)=\"close()\"\n            >\n              <pe-icon icon=\"close\" size=\"6\" />\n            </pe-button>\n          }\n        </header>\n      }\n      <div class=\"pe-modal__body\" [id]=\"bodyId\">\n        @if (isSuccess() || isError()) {\n          <div class=\"pe-modal__status\" aria-hidden=\"true\">\n            <pe-icon\n              class=\"pe-modal__status-icon\"\n              [icon]=\"isSuccess() ? 'check_circle' : 'cross_circle'\"\n              size=\"16\"\n            />\n          </div>\n        }\n        <ng-content />\n      </div>\n      <div class=\"pe-modal__footer\">\n        @if (isConfirmation()) {\n          <pe-button theme=\"ghost-white\" (buttonClick)=\"onCancel()\">\n            {{ cancelLabel() }}\n          </pe-button>\n          <pe-button theme=\"fill-purple\" (buttonClick)=\"onConfirm()\">\n            {{ confirmLabel() }}\n          </pe-button>\n        } @else {\n          <ng-content select=\"[pe-modal-footer]\" />\n        }\n      </div>\n    </div>\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-modal--backdrop{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:16px;background-color:#000000b3;transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-modal__panel{position:relative;display:flex;flex-direction:column;max-height:calc(100% - 32px);overflow:auto;border-radius:16px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#fff;transition:opacity .25s cubic-bezier(.4,0,.2,1),transform .25s cubic-bezier(.4,0,.2,1);background-color:#232323;padding:24px;border:1px solid rgba(255,255,255,.1)}.pe-modal__panel--confirmation{border:1px solid rgba(255,255,255,.1)}@media(max-width:767px){.pe-modal__panel--success{border:1px solid #7edc96}.pe-modal__panel--error{border:1px solid #f69d9d}}.pe-modal__panel--custom,.pe-modal__panel--bottom-sheet{border:1px solid rgba(255,255,255,.1)}.pe-modal__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;flex-shrink:0}.pe-modal__title{margin:0;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800;color:#fff}.pe-modal__status{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px}.pe-modal__status-icon{flex-shrink:0}.pe-modal__close{flex-shrink:0;margin-left:auto}.pe-modal__body{flex:1 1 auto;min-height:0;color:#ffffffb3}.pe-modal__panel--success .pe-modal__status-icon{color:#7edc96}.pe-modal__panel--error .pe-modal__status-icon{color:#f69d9d}.pe-modal__panel--success .pe-modal__body,.pe-modal__panel--error .pe-modal__body{text-align:center;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}@media(min-width:768px){.pe-modal--backdrop{padding:24px}.pe-modal__panel{width:100%;max-width:512px}}@media(max-width:767px){.pe-modal--backdrop{align-items:flex-end;padding:0}.pe-modal__panel{width:100%;max-width:100%;border-radius:24px 24px 0 0;max-height:calc(100dvh - 32px);margin-top:auto;border-bottom:none}.pe-modal__panel--bottom-sheet{border-bottom:none}}.pe-modal__footer{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;flex-shrink:0;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-modal', standalone: true, imports: [CdkTrapFocus, ButtonComponent, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        '[attr.aria-hidden]': '!open()',
+                    }, template: "@if (open()) {\n  <div\n    class=\"pe-modal pe-modal--backdrop\"\n    role=\"dialog\"\n    [attr.aria-modal]=\"true\"\n    [attr.aria-labelledby]=\"title() ? titleId : null\"\n    [attr.aria-describedby]=\"bodyId\"\n    (click)=\"onBackdropClick($event)\"\n  >\n    <div [class]=\"panelClass()\" cdkTrapFocus (click)=\"$event.stopPropagation()\">\n      @if (modalTitle() || showCloseButton()) {\n        <header class=\"pe-modal__header\">\n          @if (modalTitle()) {\n            <h2 [id]=\"titleId\" class=\"pe-modal__title\">{{ title() }}</h2>\n          }\n          @if (showCloseButton()) {\n            <pe-button\n              type=\"button\"\n              theme=\"ghost-white\"\n              [iconOnly]=\"true\"\n              ariaLabel=\"Close\"\n              class=\"pe-modal__close\"\n              (buttonClick)=\"close()\"\n            >\n              <pe-icon icon=\"close\" size=\"6\" />\n            </pe-button>\n          }\n        </header>\n      }\n      <div class=\"pe-modal__body\" [id]=\"bodyId\">\n        @if (isSuccess() || isError()) {\n          <div class=\"pe-modal__status\" aria-hidden=\"true\">\n            <pe-icon\n              class=\"pe-modal__status-icon\"\n              [icon]=\"isSuccess() ? 'check_circle' : 'cross_circle'\"\n              size=\"16\"\n            />\n          </div>\n        }\n        <ng-content />\n      </div>\n      <div class=\"pe-modal__footer\">\n        @if (isConfirmation()) {\n          <pe-button theme=\"ghost-white\" (buttonClick)=\"onCancel()\">\n            {{ cancelLabel() }}\n          </pe-button>\n          <pe-button theme=\"fill-purple\" (buttonClick)=\"onConfirm()\">\n            {{ confirmLabel() }}\n          </pe-button>\n        } @else {\n          <ng-content select=\"[pe-modal-footer]\" />\n        }\n      </div>\n    </div>\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-modal--backdrop{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:16px;background-color:#000000b3;transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-modal__panel{position:relative;display:flex;flex-direction:column;max-height:calc(100% - 32px);overflow:auto;border-radius:16px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#fff;transition:opacity .25s cubic-bezier(.4,0,.2,1),transform .25s cubic-bezier(.4,0,.2,1);background-color:#232323;padding:24px;border:1px solid rgba(255,255,255,.1)}.pe-modal__panel--confirmation{border:1px solid rgba(255,255,255,.1)}@media(max-width:767px){.pe-modal__panel--success{border:1px solid #7edc96}.pe-modal__panel--error{border:1px solid #f69d9d}}.pe-modal__panel--custom,.pe-modal__panel--bottom-sheet{border:1px solid rgba(255,255,255,.1)}.pe-modal__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;flex-shrink:0}.pe-modal__title{margin:0;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:800;color:#fff}.pe-modal__status{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px}.pe-modal__status-icon{flex-shrink:0}.pe-modal__close{flex-shrink:0;margin-left:auto}.pe-modal__body{flex:1 1 auto;min-height:0;color:#ffffffb3}.pe-modal__panel--success .pe-modal__status-icon{color:#7edc96}.pe-modal__panel--error .pe-modal__status-icon{color:#f69d9d}.pe-modal__panel--success .pe-modal__body,.pe-modal__panel--error .pe-modal__body{text-align:center;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}@media(min-width:768px){.pe-modal--backdrop{padding:24px}.pe-modal__panel{width:100%;max-width:512px}}@media(max-width:767px){.pe-modal--backdrop{align-items:flex-end;padding:0}.pe-modal__panel{width:100%;max-width:100%;border-radius:24px 24px 0 0;max-height:calc(100dvh - 32px);margin-top:auto;border-bottom:none}.pe-modal__panel--bottom-sheet{border-bottom:none}}.pe-modal__footer{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;flex-shrink:0;justify-content:flex-end}\n"] }]
+        }], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], closeOnBackdropClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdropClick", required: false }] }], showCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCloseButton", required: false }] }], confirmLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmLabel", required: false }] }], cancelLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelLabel", required: false }] }], customClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "customClass", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], confirmed: [{ type: i0.Output, args: ["confirmed"] }], cancelled: [{ type: i0.Output, args: ["cancelled"] }], onEscape: [{
+                type: HostListener,
+                args: ['document:keydown.escape']
+            }] } });
+
+/** Place on the element projected into [pe-navbar-logo] so the navbar can detect logo content. */
+class NavbarLogoSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarLogoSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: NavbarLogoSlotDirective, isStandalone: true, selector: "[pe-navbar-logo]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarLogoSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-navbar-logo]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-navbar-search] so the navbar can show the mobile search toggle. */
+class NavbarSearchSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarSearchSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: NavbarSearchSlotDirective, isStandalone: true, selector: "[pe-navbar-search]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarSearchSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-navbar-search]',
+                    standalone: true,
+                }]
+        }] });
+/** Place on the element projected into [pe-navbar-avatar] so the navbar can detect avatar content. */
+class NavbarAvatarSlotDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarAvatarSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: NavbarAvatarSlotDirective, isStandalone: true, selector: "[pe-navbar-avatar]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarAvatarSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-navbar-avatar]',
+                    standalone: true,
+                }]
+        }] });
+
+class NavbarComponent {
+    /** Default logo link href when logo slot is not projected. */
+    logoHref = input('/', ...(ngDevMode ? [{ debugName: "logoHref" }] : []));
+    /** Default logo image src when logo slot is not projected. */
+    logoSrc = input(undefined, ...(ngDevMode ? [{ debugName: "logoSrc" }] : []));
+    /** Default logo image alt when logo slot is not projected. */
+    logoAlt = input('', ...(ngDevMode ? [{ debugName: "logoAlt" }] : []));
+    /** Default avatar image src when avatar slot is not projected. */
+    avatarSrc = input(undefined, ...(ngDevMode ? [{ debugName: "avatarSrc" }] : []));
+    /** Default avatar initials when avatar slot is not projected and no image. */
+    avatarInitials = input(undefined, ...(ngDevMode ? [{ debugName: "avatarInitials" }] : []));
+    /** Default avatar image alt when avatar slot is not projected. */
+    avatarAlt = input('', ...(ngDevMode ? [{ debugName: "avatarAlt" }] : []));
+    /** For aria-expanded on the toggle button */
+    sidebarOpen = input(false, ...(ngDevMode ? [{ debugName: "sidebarOpen" }] : []));
+    /** When true, show the sidebar toggle button even when a logo slot is projected. */
+    showSidebarToggle = input(false, ...(ngDevMode ? [{ debugName: "showSidebarToggle" }] : []));
+    /** Emitted when the user clicks the sidebar toggle. Parent should flip the open state. */
+    sidebarToggle = output();
+    logoSlot = contentChild(NavbarLogoSlotDirective, ...(ngDevMode ? [{ debugName: "logoSlot" }] : []));
+    searchSlot = contentChild(NavbarSearchSlotDirective, ...(ngDevMode ? [{ debugName: "searchSlot" }] : []));
+    avatarSlot = contentChild(NavbarAvatarSlotDirective, ...(ngDevMode ? [{ debugName: "avatarSlot" }] : []));
+    hasLogoSlot = computed(() => !!this.logoSlot(), ...(ngDevMode ? [{ debugName: "hasLogoSlot" }] : []));
+    hasSearchSlot = computed(() => !!this.searchSlot(), ...(ngDevMode ? [{ debugName: "hasSearchSlot" }] : []));
+    hasAvatarSlot = computed(() => !!this.avatarSlot(), ...(ngDevMode ? [{ debugName: "hasAvatarSlot" }] : []));
+    showToggle = computed(() => !this.hasLogoSlot() || this.showSidebarToggle(), ...(ngDevMode ? [{ debugName: "showToggle" }] : []));
+    searchExpanded = signal(false, ...(ngDevMode ? [{ debugName: "searchExpanded" }] : []));
+    toggleSearch() {
+        this.searchExpanded.update((v) => !v);
+    }
+    toggleSidebar() {
+        this.sidebarToggle.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: NavbarComponent, isStandalone: true, selector: "pe-navbar", inputs: { logoHref: { classPropertyName: "logoHref", publicName: "logoHref", isSignal: true, isRequired: false, transformFunction: null }, logoSrc: { classPropertyName: "logoSrc", publicName: "logoSrc", isSignal: true, isRequired: false, transformFunction: null }, logoAlt: { classPropertyName: "logoAlt", publicName: "logoAlt", isSignal: true, isRequired: false, transformFunction: null }, avatarSrc: { classPropertyName: "avatarSrc", publicName: "avatarSrc", isSignal: true, isRequired: false, transformFunction: null }, avatarInitials: { classPropertyName: "avatarInitials", publicName: "avatarInitials", isSignal: true, isRequired: false, transformFunction: null }, avatarAlt: { classPropertyName: "avatarAlt", publicName: "avatarAlt", isSignal: true, isRequired: false, transformFunction: null }, sidebarOpen: { classPropertyName: "sidebarOpen", publicName: "sidebarOpen", isSignal: true, isRequired: false, transformFunction: null }, showSidebarToggle: { classPropertyName: "showSidebarToggle", publicName: "showSidebarToggle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sidebarToggle: "sidebarToggle" }, queries: [{ propertyName: "logoSlot", first: true, predicate: NavbarLogoSlotDirective, descendants: true, isSignal: true }, { propertyName: "searchSlot", first: true, predicate: NavbarSearchSlotDirective, descendants: true, isSignal: true }, { propertyName: "avatarSlot", first: true, predicate: NavbarAvatarSlotDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<nav class=\"pe-navbar\" role=\"navigation\">\n  <div class=\"pe-navbar__bar\">\n    <div class=\"pe-navbar__logo\">\n      @if (showToggle()) {\n        <pe-button\n          theme=\"ghost-white\"\n          [iconOnly]=\"true\"\n          size=\"sm\"\n          class=\"pe-navbar__sidebar_toggle\"\n          ariaLabel=\"Open menu\"\n          [attr.aria-expanded]=\"sidebarOpen()\"\n          (buttonClick)=\"toggleSidebar()\"\n        >\n          <pe-icon icon=\"menu\" size=\"6\" />\n        </pe-button>\n      }\n      @if (hasLogoSlot()) {\n        <ng-content select=\"[pe-navbar-logo]\" />\n      } @else {\n        <img [src]=\"logoSrc()\" [alt]=\"logoAlt()\" class=\"pe-navbar__logo-img\" height=\"32\" />\n        <a [href]=\"logoHref()\" class=\"pe-navbar__logo-link pe-navbar__logo-text\">Pinake</a>\n      }\n    </div>\n\n    @if (hasSearchSlot()) {\n      <pe-button\n        theme=\"ghost-white\"\n        [iconOnly]=\"true\"\n        class=\"pe-navbar__search-toggle\"\n        ariaLabel=\"Toggle search\"\n        [attr.aria-expanded]=\"searchExpanded()\"\n        (buttonClick)=\"toggleSearch()\"\n      >\n        <pe-icon icon=\"search\" size=\"6\" />\n      </pe-button>\n    }\n\n    <div\n      class=\"pe-navbar__search-wrapper\"\n      [class.pe-navbar__search-wrapper--expanded]=\"searchExpanded()\"\n    >\n      <ng-content select=\"[pe-navbar-search]\" />\n    </div>\n\n    <div class=\"pe-navbar__avatar\">\n      @if (hasAvatarSlot()) {\n        <ng-content select=\"[pe-navbar-avatar]\" />\n      } @else if (avatarSrc() || avatarInitials()) {\n        <pe-avatar\n          [src]=\"avatarSrc()\"\n          [initials]=\"avatarInitials()\"\n          [alt]=\"avatarAlt()\"\n          size=\"md\"\n        />\n      }\n    </div>\n  </div>\n</nav>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-navbar{width:100%}.pe-navbar__bar{min-height:48px;display:flex;align-items:center;gap:16px;padding:8px 16px;background-color:#0a0a0a;border-bottom:1px solid rgba(255,255,255,.1)}@media(min-width:1024px){.pe-navbar__bar{padding:12px 24px;gap:24px}}@media(min-width:1280px){.pe-navbar__bar{padding:12px 32px}}.pe-navbar__bar{flex-wrap:wrap}@media(max-width:1279px){.pe-navbar__bar{position:relative;z-index:100}}@media(max-width:1279px){.pe-navbar__sidebar_toggle{display:inline-flex}}.pe-navbar__sidebar_toggle .pe-icon,.pe-navbar__sidebar_toggle .pe-icon:before{background-color:transparent}.pe-navbar__sidebar_toggle :focus-visible{outline:none;box-shadow:0 0 0 2px #ffffff1a}@media(min-width:1024px){.pe-navbar__sidebar_toggle{display:none}}.pe-navbar__logo{display:flex;align-items:center;flex-shrink:0;margin-right:auto;gap:8px}.pe-navbar__logo-link{display:flex;align-items:center;color:inherit;text-decoration:none}.pe-navbar__logo-text{font-family:Ultra Brand;line-height:36px;font-size:24px;letter-spacing:2.4px;font-weight:1000;text-transform:uppercase;color:inherit}@media(min-width:1024px){.pe-navbar__logo-text{display:none}}.pe-navbar__logo-img{display:block;max-height:40px;width:auto;object-fit:contain}@media(max-width:1279px){.pe-navbar__search-toggle{display:inline-flex}}@media(min-width:1024px){.pe-navbar__search-toggle{display:none}}.pe-navbar__search-wrapper{flex:1;min-width:0;display:flex;align-items:center}@media(max-width:1279px){.pe-navbar__search-wrapper{flex-basis:100%;order:10;max-height:0;overflow:hidden;opacity:0;transition:max-height .25s cubic-bezier(.4,0,.2,1),opacity .25s cubic-bezier(.4,0,.2,1)}.pe-navbar__search-wrapper--expanded{max-height:80px;opacity:1}}@media(min-width:1024px){.pe-navbar__search-wrapper{flex-basis:auto;order:0;max-height:none;opacity:1}}.pe-navbar__avatar{display:flex;align-items:center;flex-shrink:0}\n"], dependencies: [{ kind: "component", type: AvatarComponent, selector: "pe-avatar", inputs: ["size", "src", "initials", "icon", "alt", "loading"] }, { kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: NavbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-navbar', standalone: true, imports: [AvatarComponent, ButtonComponent, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<nav class=\"pe-navbar\" role=\"navigation\">\n  <div class=\"pe-navbar__bar\">\n    <div class=\"pe-navbar__logo\">\n      @if (showToggle()) {\n        <pe-button\n          theme=\"ghost-white\"\n          [iconOnly]=\"true\"\n          size=\"sm\"\n          class=\"pe-navbar__sidebar_toggle\"\n          ariaLabel=\"Open menu\"\n          [attr.aria-expanded]=\"sidebarOpen()\"\n          (buttonClick)=\"toggleSidebar()\"\n        >\n          <pe-icon icon=\"menu\" size=\"6\" />\n        </pe-button>\n      }\n      @if (hasLogoSlot()) {\n        <ng-content select=\"[pe-navbar-logo]\" />\n      } @else {\n        <img [src]=\"logoSrc()\" [alt]=\"logoAlt()\" class=\"pe-navbar__logo-img\" height=\"32\" />\n        <a [href]=\"logoHref()\" class=\"pe-navbar__logo-link pe-navbar__logo-text\">Pinake</a>\n      }\n    </div>\n\n    @if (hasSearchSlot()) {\n      <pe-button\n        theme=\"ghost-white\"\n        [iconOnly]=\"true\"\n        class=\"pe-navbar__search-toggle\"\n        ariaLabel=\"Toggle search\"\n        [attr.aria-expanded]=\"searchExpanded()\"\n        (buttonClick)=\"toggleSearch()\"\n      >\n        <pe-icon icon=\"search\" size=\"6\" />\n      </pe-button>\n    }\n\n    <div\n      class=\"pe-navbar__search-wrapper\"\n      [class.pe-navbar__search-wrapper--expanded]=\"searchExpanded()\"\n    >\n      <ng-content select=\"[pe-navbar-search]\" />\n    </div>\n\n    <div class=\"pe-navbar__avatar\">\n      @if (hasAvatarSlot()) {\n        <ng-content select=\"[pe-navbar-avatar]\" />\n      } @else if (avatarSrc() || avatarInitials()) {\n        <pe-avatar\n          [src]=\"avatarSrc()\"\n          [initials]=\"avatarInitials()\"\n          [alt]=\"avatarAlt()\"\n          size=\"md\"\n        />\n      }\n    </div>\n  </div>\n</nav>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-navbar{width:100%}.pe-navbar__bar{min-height:48px;display:flex;align-items:center;gap:16px;padding:8px 16px;background-color:#0a0a0a;border-bottom:1px solid rgba(255,255,255,.1)}@media(min-width:1024px){.pe-navbar__bar{padding:12px 24px;gap:24px}}@media(min-width:1280px){.pe-navbar__bar{padding:12px 32px}}.pe-navbar__bar{flex-wrap:wrap}@media(max-width:1279px){.pe-navbar__bar{position:relative;z-index:100}}@media(max-width:1279px){.pe-navbar__sidebar_toggle{display:inline-flex}}.pe-navbar__sidebar_toggle .pe-icon,.pe-navbar__sidebar_toggle .pe-icon:before{background-color:transparent}.pe-navbar__sidebar_toggle :focus-visible{outline:none;box-shadow:0 0 0 2px #ffffff1a}@media(min-width:1024px){.pe-navbar__sidebar_toggle{display:none}}.pe-navbar__logo{display:flex;align-items:center;flex-shrink:0;margin-right:auto;gap:8px}.pe-navbar__logo-link{display:flex;align-items:center;color:inherit;text-decoration:none}.pe-navbar__logo-text{font-family:Ultra Brand;line-height:36px;font-size:24px;letter-spacing:2.4px;font-weight:1000;text-transform:uppercase;color:inherit}@media(min-width:1024px){.pe-navbar__logo-text{display:none}}.pe-navbar__logo-img{display:block;max-height:40px;width:auto;object-fit:contain}@media(max-width:1279px){.pe-navbar__search-toggle{display:inline-flex}}@media(min-width:1024px){.pe-navbar__search-toggle{display:none}}.pe-navbar__search-wrapper{flex:1;min-width:0;display:flex;align-items:center}@media(max-width:1279px){.pe-navbar__search-wrapper{flex-basis:100%;order:10;max-height:0;overflow:hidden;opacity:0;transition:max-height .25s cubic-bezier(.4,0,.2,1),opacity .25s cubic-bezier(.4,0,.2,1)}.pe-navbar__search-wrapper--expanded{max-height:80px;opacity:1}}@media(min-width:1024px){.pe-navbar__search-wrapper{flex-basis:auto;order:0;max-height:none;opacity:1}}.pe-navbar__avatar{display:flex;align-items:center;flex-shrink:0}\n"] }]
+        }], propDecorators: { logoHref: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoHref", required: false }] }], logoSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoSrc", required: false }] }], logoAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoAlt", required: false }] }], avatarSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSrc", required: false }] }], avatarInitials: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarInitials", required: false }] }], avatarAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarAlt", required: false }] }], sidebarOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarOpen", required: false }] }], showSidebarToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSidebarToggle", required: false }] }], sidebarToggle: [{ type: i0.Output, args: ["sidebarToggle"] }], logoSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NavbarLogoSlotDirective), { isSignal: true }] }], searchSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NavbarSearchSlotDirective), { isSignal: true }] }], avatarSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NavbarAvatarSlotDirective), { isSignal: true }] }] } });
+
+/**
+ * Extends Angular's CurrencyPipe to use the custom symbol 'ᕫ' for 'UOS' currency code.
+ * For all other codes, behaves exactly like CurrencyPipe.
+ */
+class CustomCurrencyPipe extends CurrencyPipe {
+    static UOS_SYMBOL = 'ᕫ';
+    transform(value, currencyCode, display, digitsInfo, locale) {
+        const customDisplay = currencyCode === 'UOS' ? CustomCurrencyPipe.UOS_SYMBOL : display;
+        return this.separateCurrencyAndPrice(super.transform(value, currencyCode, customDisplay, digitsInfo, locale));
+    }
+    separateCurrencyAndPrice(input) {
+        // Match non-digits at the start (currency), then the number
+        const match = input?.match(/^(\D+)?(\d+(\.\d+)?)/);
+        if (match) {
+            const symbol = match[1] ? match[1].trim() : '';
+            const price = match[2];
+            // Join with a space if symbol exists
+            return symbol ? `${symbol} ${price}` : price;
+        }
+        // Return input if no match
+        return input;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CustomCurrencyPipe, deps: null, target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.1.2", ngImport: i0, type: CustomCurrencyPipe, isStandalone: true, name: "peCurrency" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: CustomCurrencyPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'peCurrency',
+                    standalone: true,
+                }]
+        }] });
+
+class PriceButtonComponent {
+    // Inputs
+    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : [])); // Button label
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : [])); // Button size
+    theme = input('transparent-white', ...(ngDevMode ? [{ debugName: "theme" }] : [])); // Button theme
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : [])); // Disabled state
+    salePosition = input('right', ...(ngDevMode ? [{ debugName: "salePosition" }] : [])); // Sale badge position
+    price = input(0, ...(ngDevMode ? [{ debugName: "price" }] : [])); // Price (0 = free)
+    originalPrice = input(0, ...(ngDevMode ? [{ debugName: "originalPrice" }] : [])); // Original price
+    discountBasis = input(0, ...(ngDevMode ? [{ debugName: "discountBasis" }] : [])); // Discount basis
+    currency = input('USD', ...(ngDevMode ? [{ debugName: "currency" }] : [])); // Currency
+    // Outputs
+    buttonClick = output(); // Click event
+    // Methods
+    handleClick(event) {
+        // Handle click
+        if (this.disabled()) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        this.buttonClick.emit(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PriceButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: PriceButtonComponent, isStandalone: true, selector: "pe-price-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, salePosition: { classPropertyName: "salePosition", publicName: "salePosition", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, originalPrice: { classPropertyName: "originalPrice", publicName: "originalPrice", isSignal: true, isRequired: false, transformFunction: null }, discountBasis: { classPropertyName: "discountBasis", publicName: "discountBasis", isSignal: true, isRequired: false, transformFunction: null }, currency: { classPropertyName: "currency", publicName: "currency", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, host: { properties: { "class.pe-price-button--sale-left": "salePosition() === \"left\"" }, classAttribute: "pe-price-button" }, ngImport: i0, template: "<pe-button [size]=\"size()\" [theme]=\"theme()\" [disabled]=\"disabled()\" (click)=\"handleClick($event)\">\n  @if (label()) {\n    {{ label() }}\n  } @else if (price() > 0) {\n    {{ price() | peCurrency: currency() }}\n  } @else {\n    Free\n  }\n</pe-button>\n@if (price() !== originalPrice() && discountBasis() > 0) {\n  <div class=\"pe-price-button__sale\">\n    <div\n      class=\"pe-price-button__discount\"\n      [attr.aria-label]=\"'Discount ' + discountBasis() + '% off original price'\"\n    >\n      -{{ discountBasis() }}%\n    </div>\n    <div class=\"pe-price-button__original-price\" aria-hidden=\"true\">\n      {{ originalPrice() | peCurrency: currency() }}\n    </div>\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-price-button{display:flex;align-items:center;gap:12px}.pe-price-button--sale-left{flex-direction:row-reverse}.pe-price-button__sale{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.pe-price-button__discount{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;color:#ffe9a3}.pe-price-button__original-price{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#ffffff80;text-decoration:line-through}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "pipe", type: CustomCurrencyPipe, name: "peCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: PriceButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-price-button', standalone: true, imports: [ButtonComponent, CustomCurrencyPipe], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'pe-price-button',
+                        '[class.pe-price-button--sale-left]': 'salePosition() === "left"',
+                    }, template: "<pe-button [size]=\"size()\" [theme]=\"theme()\" [disabled]=\"disabled()\" (click)=\"handleClick($event)\">\n  @if (label()) {\n    {{ label() }}\n  } @else if (price() > 0) {\n    {{ price() | peCurrency: currency() }}\n  } @else {\n    Free\n  }\n</pe-button>\n@if (price() !== originalPrice() && discountBasis() > 0) {\n  <div class=\"pe-price-button__sale\">\n    <div\n      class=\"pe-price-button__discount\"\n      [attr.aria-label]=\"'Discount ' + discountBasis() + '% off original price'\"\n    >\n      -{{ discountBasis() }}%\n    </div>\n    <div class=\"pe-price-button__original-price\" aria-hidden=\"true\">\n      {{ originalPrice() | peCurrency: currency() }}\n    </div>\n  </div>\n}\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-price-button{display:flex;align-items:center;gap:12px}.pe-price-button--sale-left{flex-direction:row-reverse}.pe-price-button__sale{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.pe-price-button__discount{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;color:#ffe9a3}.pe-price-button__original-price{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#ffffff80;text-decoration:line-through}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], salePosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "salePosition", required: false }] }], price: [{ type: i0.Input, args: [{ isSignal: true, alias: "price", required: false }] }], originalPrice: [{ type: i0.Input, args: [{ isSignal: true, alias: "originalPrice", required: false }] }], discountBasis: [{ type: i0.Input, args: [{ isSignal: true, alias: "discountBasis", required: false }] }], currency: [{ type: i0.Input, args: [{ isSignal: true, alias: "currency", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }] } });
+
+/**
+ * Radio button for use inside a group. For Signal Forms use pe-radio-group with [formField].
+ * Use [(checked)] when controlling each radio manually, or place inside pe-radio-group for [formField] binding.
+ *
+ * @example
+ * <pe-radio value="option1" name="my-group" [checked]="isSelected">Option 1</pe-radio>
+ */
+class RadioComponent {
+    /**
+     * The value associated with this radio button.
+     * This value identifies the radio button within its group.
+     */
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
+    /**
+     * The name attribute for the radio button group.
+     * All radio buttons in the same group should share the same name.
+     */
+    name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
+    /**
+     * Whether the radio button is disabled.
+     * @default false
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    /**
+     * Whether the radio button is currently checked/selected.
+     * This is a two-way binding that can be used with [(checked)].
+     */
+    checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+    /**
+     * Unique identifier for the radio button.
+     * If not provided, one will be auto-generated.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    /**
+     * Event emitted when the radio button is clicked.
+     * Useful for additional click handling beyond the default radio behavior.
+     */
+    click = output();
+    /**
+     * Emitted when this radio is selected (checked becomes true).
+     * Used by pe-radio-group to sync the group value.
+     */
+    selected = output();
+    /**
+     * Internal signal for the unique ID
+     */
+    uniqueId = signal(`pe-radio-${Math.random().toString(36).substr(2, 9)}`, ...(ngDevMode ? [{ debugName: "uniqueId" }] : []));
+    /**
+     * Computed ID that uses provided ID or falls back to generated unique ID
+     */
+    radioId = computed(() => this.id() || this.uniqueId(), ...(ngDevMode ? [{ debugName: "radioId" }] : []));
+    /**
+     * Computed ARIA attributes for accessibility
+     */
+    ariaAttributes = computed(() => ({
+        'aria-checked': this.checked(),
+        'aria-disabled': this.disabled(),
+        role: 'radio',
+    }), ...(ngDevMode ? [{ debugName: "ariaAttributes" }] : []));
+    /**
+     * Handles the radio button change event.
+     * Updates the checked state.
+     *
+     * @param event - The change event from the input element
+     */
+    onRadioChange(event) {
+        if (this.disabled()) {
+            return;
+        }
+        const input = event.target;
+        this.checked.set(input.checked);
+        if (input.checked) {
+            this.selected.emit(this.value());
+        }
+    }
+    /**
+     * Handles click events on the radio button.
+     * Useful for additional click handling beyond the default radio behavior.
+     *
+     * @param event - The click event
+     */
+    onRadioClick(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            return;
+        }
+        this.click.emit(event);
+    }
+    /**
+     * Handles keyboard events for accessibility.
+     * Supports Space and Enter keys for selection.
+     *
+     * @param event - The keyboard event
+     */
+    onKeyDown(event) {
+        if (this.disabled()) {
+            return;
+        }
+        if (event.key === ' ' || event.key === 'Enter') {
+            event.preventDefault();
+            this.checked.set(true);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: RadioComponent, isStandalone: true, selector: "pe-radio", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", click: "click", selected: "selected" }, ngImport: i0, template: "<label class=\"pe-radio-container\" [for]=\"radioId()\" [class.pe-radio-disabled]=\"disabled()\">\n  <input\n    type=\"radio\"\n    [id]=\"radioId()\"\n    [name]=\"name()\"\n    [value]=\"value()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    [attr.aria-checked]=\"ariaAttributes()['aria-checked']\"\n    [attr.aria-disabled]=\"ariaAttributes()['aria-disabled']\"\n    [attr.role]=\"ariaAttributes()['role']\"\n    (change)=\"onRadioChange($event)\"\n    (click)=\"onRadioClick($event)\"\n    (keydown)=\"onKeyDown($event)\"\n    class=\"pe-radio-input\"\n  />\n  <span class=\"pe-radio-label\">\n    <ng-content />\n  </span>\n</label>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-radio-container{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.pe-radio-container.pe-radio-disabled{cursor:not-allowed;opacity:.6}.pe-radio-container:has(.pe-radio-input:focus-visible){outline:2px solid rgba(255,255,255,.3);outline-offset:2px;border-radius:4px}.pe-radio-input{appearance:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.5);border-radius:50%;margin:0;cursor:pointer;position:relative;transition:all .15s cubic-bezier(.4,0,.2,1);outline:solid 2px transparent;flex-shrink:0}.pe-radio-input:focus-visible,.pe-radio-input:focus,.pe-radio-input:hover{outline-color:#ffffff4d;border-color:#fff}.pe-radio-input:checked{border-color:transparent;background-color:#6f3de0;color:inherit}.pe-radio-input:checked:hover{background-color:#7e4af7}.pe-radio-input:checked:active{background-color:#5935af}.pe-radio-input:checked:selected{background-color:#7e4af7}.pe-radio-input:checked:disabled,.pe-radio-input:checked[disabled]{background-color:#232323}.pe-radio-input:checked:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:4px;background-color:#fff;border-radius:50%}.pe-radio-input:disabled{cursor:not-allowed;outline-color:transparent;background-color:transparent;border-color:#ffffff4d}.pe-radio-input:disabled:after{background-color:#ffffff4d}.pe-radio-input:disabled+.pe-radio-label{cursor:not-allowed;color:#ffffff4d}.pe-radio-label{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;cursor:pointer}.pe-radio-labelpe-radio-disabled .pe-radio-label{cursor:not-allowed;color:#ffffff4d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadioComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-radio', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<label class=\"pe-radio-container\" [for]=\"radioId()\" [class.pe-radio-disabled]=\"disabled()\">\n  <input\n    type=\"radio\"\n    [id]=\"radioId()\"\n    [name]=\"name()\"\n    [value]=\"value()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    [attr.aria-checked]=\"ariaAttributes()['aria-checked']\"\n    [attr.aria-disabled]=\"ariaAttributes()['aria-disabled']\"\n    [attr.role]=\"ariaAttributes()['role']\"\n    (change)=\"onRadioChange($event)\"\n    (click)=\"onRadioClick($event)\"\n    (keydown)=\"onKeyDown($event)\"\n    class=\"pe-radio-input\"\n  />\n  <span class=\"pe-radio-label\">\n    <ng-content />\n  </span>\n</label>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-radio-container{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.pe-radio-container.pe-radio-disabled{cursor:not-allowed;opacity:.6}.pe-radio-container:has(.pe-radio-input:focus-visible){outline:2px solid rgba(255,255,255,.3);outline-offset:2px;border-radius:4px}.pe-radio-input{appearance:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.5);border-radius:50%;margin:0;cursor:pointer;position:relative;transition:all .15s cubic-bezier(.4,0,.2,1);outline:solid 2px transparent;flex-shrink:0}.pe-radio-input:focus-visible,.pe-radio-input:focus,.pe-radio-input:hover{outline-color:#ffffff4d;border-color:#fff}.pe-radio-input:checked{border-color:transparent;background-color:#6f3de0;color:inherit}.pe-radio-input:checked:hover{background-color:#7e4af7}.pe-radio-input:checked:active{background-color:#5935af}.pe-radio-input:checked:selected{background-color:#7e4af7}.pe-radio-input:checked:disabled,.pe-radio-input:checked[disabled]{background-color:#232323}.pe-radio-input:checked:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:4px;background-color:#fff;border-radius:50%}.pe-radio-input:disabled{cursor:not-allowed;outline-color:transparent;background-color:transparent;border-color:#ffffff4d}.pe-radio-input:disabled:after{background-color:#ffffff4d}.pe-radio-input:disabled+.pe-radio-label{cursor:not-allowed;color:#ffffff4d}.pe-radio-label{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;cursor:pointer}.pe-radio-labelpe-radio-disabled .pe-radio-label{cursor:not-allowed;color:#ffffff4d}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], selected: [{ type: i0.Output, args: ["selected"] }] } });
+
+/**
+ * Radio group that holds the selected option value. Implements FormValueControl for Signal Forms [formField].
+ * Use [(value)] or [formField]="myForm().choice". Renders pe-radio per option; value is the selected option's value.
+ */
+class RadioGroupComponent {
+    name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
+    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    ids = createFormFieldIds('pe-radio-group');
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: RadioGroupComponent, isStandalone: true, selector: "pe-radio-group", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: `
+    <div
+      class="pe-radio-group"
+      [attr.aria-invalid]="hasError()"
+      [attr.aria-required]="required()"
+      [attr.aria-describedby]="describedBy()"
+      role="radiogroup"
+      [attr.aria-label]="label()"
+    >
+      <pe-form-field-label
+        [label]="label()"
+        [required]="required()"
+        [for]="ids.controlId"
+        size="md"
+      />
+      <div class="pe-radio-group__radios" [id]="ids.controlId">
+        @for (opt of options(); track opt.value) {
+          <pe-radio
+            [name]="name()"
+            [value]="opt.value"
+            [checked]="value() === opt.value"
+            [disabled]="disabled()"
+            (selected)="value.set(opt.value)"
+          >
+            {{ opt.label }}
+          </pe-radio>
+        }
+      </div>
+      <pe-form-field-helper
+        [id]="ids.helperId"
+        [helperText]="helperText()"
+        [errorText]="errorText() || (hasError() && errors().length ? (errors()[0].message ?? null) : null)"
+        [error]="hasError()"
+      />
+    </div>
+  `, isInline: true, styles: [".pe-radio-group{display:flex;flex-direction:column;gap:.5rem}.pe-radio-group__radios{display:flex;flex-direction:column;gap:.25rem}\n"], dependencies: [{ kind: "component", type: RadioComponent, selector: "pe-radio", inputs: ["value", "name", "disabled", "checked", "id"], outputs: ["checkedChange", "click", "selected"] }, { kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadioGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-radio-group', standalone: true, imports: [RadioComponent, FormFieldLabelComponent, FormFieldHelperComponent], template: `
+    <div
+      class="pe-radio-group"
+      [attr.aria-invalid]="hasError()"
+      [attr.aria-required]="required()"
+      [attr.aria-describedby]="describedBy()"
+      role="radiogroup"
+      [attr.aria-label]="label()"
+    >
+      <pe-form-field-label
+        [label]="label()"
+        [required]="required()"
+        [for]="ids.controlId"
+        size="md"
+      />
+      <div class="pe-radio-group__radios" [id]="ids.controlId">
+        @for (opt of options(); track opt.value) {
+          <pe-radio
+            [name]="name()"
+            [value]="opt.value"
+            [checked]="value() === opt.value"
+            [disabled]="disabled()"
+            (selected)="value.set(opt.value)"
+          >
+            {{ opt.label }}
+          </pe-radio>
+        }
+      </div>
+      <pe-form-field-helper
+        [id]="ids.helperId"
+        [helperText]="helperText()"
+        [errorText]="errorText() || (hasError() && errors().length ? (errors()[0].message ?? null) : null)"
+        [error]="hasError()"
+      />
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".pe-radio-group{display:flex;flex-direction:column;gap:.5rem}.pe-radio-group__radios{display:flex;flex-direction:column;gap:.25rem}\n"] }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
+
+const lineWidths = {
+    96: 6,
+    64: 6,
+    48: 5,
+    32: 4,
+    24: 4,
+    20: 3,
+    16: 3,
+};
+class RadialComponent {
+    // size of the radial component in px
+    size = input(96, ...(ngDevMode ? [{ debugName: "size" }] : []));
+    // if true, the radial will rotate indefinitely
+    infinite = input(false, { ...(ngDevMode ? { debugName: "infinite" } : {}), transform: booleanAttribute });
+    // percentage of the radial that is filled
+    percentage = input(0, ...(ngDevMode ? [{ debugName: "percentage" }] : []));
+    // optional accessible label for the radial
+    ariaLabel = input(null, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
+    lineWidth = computed(() => lineWidths[this.size()], ...(ngDevMode ? [{ debugName: "lineWidth" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadialComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: RadialComponent, isStandalone: true, selector: "pe-radial", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, infinite: { classPropertyName: "infinite", publicName: "infinite", isSignal: true, isRequired: false, transformFunction: null }, percentage: { classPropertyName: "percentage", publicName: "percentage", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"pe-radial\"\n  role=\"progressbar\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-valuenow]=\"percentage()\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [class.pe-radial--infinite]=\"infinite()\"\n  [style.width.px]=\"size()\"\n  [style.padding.px]=\"lineWidth()\"\n  [style.--pe-radial-percentage]=\"percentage() + '%'\"\n></div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-radial{width:96px;padding:6px;aspect-ratio:1;border-radius:50%;background:#fff}.pe-radial--infinite{--pe-radial-mask: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;animation:pe-radial-rotation 1s infinite linear}.pe-radial:not(.pe-radial--infinite){--pe-radial-percentage: 25%;--pe-radial-mask: conic-gradient( #fff var(--pe-radial-percentage), transparent var(--pe-radial-percentage) ), linear-gradient(#000 0 0) content-box}.pe-radial{-webkit-mask:var(--pe-radial-mask);mask:var(--pe-radial-mask);-webkit-mask-composite:source-out;mask-composite:subtract}@keyframes pe-radial-rotation{to{transform:rotate(1turn)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RadialComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-radial', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-radial\"\n  role=\"progressbar\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-valuenow]=\"percentage()\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [class.pe-radial--infinite]=\"infinite()\"\n  [style.width.px]=\"size()\"\n  [style.padding.px]=\"lineWidth()\"\n  [style.--pe-radial-percentage]=\"percentage() + '%'\"\n></div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-radial{width:96px;padding:6px;aspect-ratio:1;border-radius:50%;background:#fff}.pe-radial--infinite{--pe-radial-mask: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;animation:pe-radial-rotation 1s infinite linear}.pe-radial:not(.pe-radial--infinite){--pe-radial-percentage: 25%;--pe-radial-mask: conic-gradient( #fff var(--pe-radial-percentage), transparent var(--pe-radial-percentage) ), linear-gradient(#000 0 0) content-box}.pe-radial{-webkit-mask:var(--pe-radial-mask);mask:var(--pe-radial-mask);-webkit-mask-composite:source-out;mask-composite:subtract}@keyframes pe-radial-rotation{to{transform:rotate(1turn)}}\n"] }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], infinite: [{ type: i0.Input, args: [{ isSignal: true, alias: "infinite", required: false }] }], percentage: [{ type: i0.Input, args: [{ isSignal: true, alias: "percentage", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
+
+/**
+ * Display-only rich text component. Renders sanitized HTML from the API (or from
+ * pe-rich-text-editor) with no Quill dependency. HTML is sanitized before rendering.
+ *
+ * Use [content] for HTML strings (e.g. from API or editor), or project markup via
+ * ng-content when content is empty.
+ */
+class RichTextComponent {
+    content = input(null, ...(ngDevMode ? [{ debugName: "content" }] : []));
+    size = input('body-l', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    domSanitizer = inject(DomSanitizer);
+    sanitizedContent = computed(() => {
+        const html = this.content() ?? '';
+        return this.domSanitizer.sanitize(SecurityContext.HTML, html) ?? '';
+    }, ...(ngDevMode ? [{ debugName: "sanitizedContent" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RichTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: RichTextComponent, isStandalone: true, selector: "pe-rich-text", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "pe-rich-text-host" }, ngImport: i0, template: `
+    @if (content()) {
+      <div
+        class="pe-rich-text"
+        [class.pe-rich-text--body-m]="size() === 'body-m'"
+        [innerHTML]="sanitizedContent()"
+      ></div>
+    } @else {
+      <div
+        class="pe-rich-text"
+        [class.pe-rich-text--body-m]="size() === 'body-m'"
+      >
+        <ng-content />
+      </div>
+    }`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: RichTextComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pe-rich-text',
+                    template: `
+    @if (content()) {
+      <div
+        class="pe-rich-text"
+        [class.pe-rich-text--body-m]="size() === 'body-m'"
+        [innerHTML]="sanitizedContent()"
+      ></div>
+    } @else {
+      <div
+        class="pe-rich-text"
+        [class.pe-rich-text--body-m]="size() === 'body-m'"
+      >
+        <ng-content />
+      </div>
+    }`,
+                    host: {
+                        class: 'pe-rich-text-host',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+const toastIcon = (kind) => {
+    switch (kind) {
+        case 'success':
+            return 'check_circle';
+        case 'warning':
+            return 'alert';
+        case 'error':
+            return 'cross_circle';
+        case 'info':
+            return 'info';
+    }
+};
+class ToastService {
+    toastsSignal = signal([], ...(ngDevMode ? [{ debugName: "toastsSignal" }] : []));
+    toasts = computed(() => this.toastsSignal().map((toast) => ({
+        id: toast.id,
+        title: toast.title,
+        message: toast.message,
+        kind: toast.kind,
+        dismissible: toast.dismissible,
+        role: toast.kind === 'error' || toast.kind === 'warning' ? 'alert' : 'status',
+        icon: toastIcon(toast.kind),
+        showIcon: toast.showIcon,
+    })), ...(ngDevMode ? [{ debugName: "toasts" }] : []));
+    show(message, config) {
+        const id = this.createId();
+        const merged = {
+            id,
+            message,
+            title: config?.title,
+            kind: config?.kind ?? 'info',
+            dismissible: config?.dismissible ?? true,
+            durationMs: config?.durationMs ?? 5000,
+            showIcon: config?.showIcon ?? false,
+        };
+        this.toastsSignal.update((current) => [...current, merged]);
+        if (merged.durationMs && merged.durationMs > 0) {
+            window.setTimeout(() => {
+                this.dismiss(id);
+            }, merged.durationMs);
+        }
+        return id;
+    }
+    info(message, config) {
+        return this.show(message, { ...config, kind: 'info' });
+    }
+    success(message, config) {
+        return this.show(message, { ...config, kind: 'success' });
+    }
+    warning(message, config) {
+        return this.show(message, { ...config, kind: 'warning' });
+    }
+    error(message, config) {
+        return this.show(message, { ...config, kind: 'error' });
+    }
+    dismiss(id) {
+        this.toastsSignal.update((current) => current.filter((toast) => toast.id !== id));
+    }
+    clear() {
+        this.toastsSignal.set([]);
+    }
+    createId() {
+        if (typeof crypto !== 'undefined' && 'randomUUID' in crypto) {
+            // eslint-disable-next-line no-restricted-globals
+            return crypto.randomUUID();
+        }
+        return `pe-toast-${Math.random().toString(36).slice(2, 11)}`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ToastService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ToastService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class ToastContainerComponent {
+    toastService = inject(ToastService);
+    toasts = this.toastService.toasts;
+    trackById(_, toast) {
+        return toast.id;
+    }
+    dismiss(id) {
+        this.toastService.dismiss(id);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ToastContainerComponent, isStandalone: true, selector: "pe-toast-container", ngImport: i0, template: "<div class=\"pe-toast-container\" aria-live=\"polite\" aria-atomic=\"true\">\n  @for (toast of toasts(); track trackById($index, toast)) {\n    <section class=\"pe-toast pe-toast--{{ toast.kind }}\" [attr.role]=\"toast.role\">\n      <div class=\"pe-toast__icon\">\n        @if (toast.showIcon) {\n          <pe-icon [icon]=\"toast.icon\" size=\"6\" iconWeight=\"bold\" />\n        }\n      </div>\n\n      <div class=\"pe-toast__body\">\n        @if (toast.title) {\n          <h3 class=\"pe-toast__title\">\n            {{ toast.title }}\n          </h3>\n        }\n        <p class=\"pe-toast__message\">\n          {{ toast.message }}\n        </p>\n      </div>\n\n      @if (toast.dismissible) {\n        <pe-button\n          theme=\"ghost-white\"\n          size=\"sm\"\n          [iconOnly]=\"true\"\n          class=\"pe-toast__close\"\n          ariaLabel=\"Dismiss notification\"\n          (buttonClick)=\"dismiss(toast.id)\"\n        >\n          <pe-icon icon=\"cross\" size=\"5\" />\n        </pe-button>\n      }\n    </section>\n  }\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-toast-container{position:fixed;inset-inline-end:16px;inset-block-end:16px;z-index:1200;display:flex;flex-direction:column;gap:12px;pointer-events:none}@media(max-width:767px){.pe-toast-container{inset-inline:12px;inset-block-end:12px}}.pe-toast{display:flex;align-items:flex-start;gap:12px;min-width:280px;max-width:360px;padding:12px 16px;border-radius:12px;background-color:#232323;color:#fff;border:1px solid rgba(255,255,255,.1);box-shadow:0 12px 30px #0006;pointer-events:auto;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}@media(max-width:767px){.pe-toast{min-width:0;width:100%}}.pe-toast__icon{display:flex;align-items:center;justify-content:center;margin-top:4px;color:#fff}.pe-toast__body{flex:1 1 auto}.pe-toast__title{margin:0 0 4px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;color:#fff}.pe-toast__message{margin:0;color:#ffffffb3}.pe-toast__close{margin-inline-start:8px;flex-shrink:0}.pe-toast__close .pe-icon{font-size:12px;line-height:16px}.pe-toast--success{border-color:#7edc96}.pe-toast--warning{border-color:#ffd9af}.pe-toast--error{border-color:#f69d9d}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ToastContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-toast-container', standalone: true, imports: [ButtonComponent, IconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pe-toast-container\" aria-live=\"polite\" aria-atomic=\"true\">\n  @for (toast of toasts(); track trackById($index, toast)) {\n    <section class=\"pe-toast pe-toast--{{ toast.kind }}\" [attr.role]=\"toast.role\">\n      <div class=\"pe-toast__icon\">\n        @if (toast.showIcon) {\n          <pe-icon [icon]=\"toast.icon\" size=\"6\" iconWeight=\"bold\" />\n        }\n      </div>\n\n      <div class=\"pe-toast__body\">\n        @if (toast.title) {\n          <h3 class=\"pe-toast__title\">\n            {{ toast.title }}\n          </h3>\n        }\n        <p class=\"pe-toast__message\">\n          {{ toast.message }}\n        </p>\n      </div>\n\n      @if (toast.dismissible) {\n        <pe-button\n          theme=\"ghost-white\"\n          size=\"sm\"\n          [iconOnly]=\"true\"\n          class=\"pe-toast__close\"\n          ariaLabel=\"Dismiss notification\"\n          (buttonClick)=\"dismiss(toast.id)\"\n        >\n          <pe-icon icon=\"cross\" size=\"5\" />\n        </pe-button>\n      }\n    </section>\n  }\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-toast-container{position:fixed;inset-inline-end:16px;inset-block-end:16px;z-index:1200;display:flex;flex-direction:column;gap:12px;pointer-events:none}@media(max-width:767px){.pe-toast-container{inset-inline:12px;inset-block-end:12px}}.pe-toast{display:flex;align-items:flex-start;gap:12px;min-width:280px;max-width:360px;padding:12px 16px;border-radius:12px;background-color:#232323;color:#fff;border:1px solid rgba(255,255,255,.1);box-shadow:0 12px 30px #0006;pointer-events:auto;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}@media(max-width:767px){.pe-toast{min-width:0;width:100%}}.pe-toast__icon{display:flex;align-items:center;justify-content:center;margin-top:4px;color:#fff}.pe-toast__body{flex:1 1 auto}.pe-toast__title{margin:0 0 4px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:800;color:#fff}.pe-toast__message{margin:0;color:#ffffffb3}.pe-toast__close{margin-inline-start:8px;flex-shrink:0}.pe-toast__close .pe-icon{font-size:12px;line-height:16px}.pe-toast--success{border-color:#7edc96}.pe-toast--warning{border-color:#ffd9af}.pe-toast--error{border-color:#f69d9d}\n"] }]
+        }] });
+
+class TooltipComponent {
+    text = input('', ...(ngDevMode ? [{ debugName: "text" }] : []));
+    position = input('top', ...(ngDevMode ? [{ debugName: "position" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    showDelay = input(150, ...(ngDevMode ? [{ debugName: "showDelay" }] : []));
+    hideDelay = input(100, ...(ngDevMode ? [{ debugName: "hideDelay" }] : []));
+    visible = signal(false, ...(ngDevMode ? [{ debugName: "visible" }] : []));
+    showTimeoutId = null;
+    hideTimeoutId = null;
+    tooltipId = `pe-tooltip-${Math.random().toString(36).slice(2, 11)}`;
+    get ariaDescribedBy() {
+        return this.visible() && !!this.text() ? this.tooltipId : null;
+    }
+    handlePointerEnter() {
+        if (this.disabled() || !this.text())
+            return;
+        this.scheduleShow();
+    }
+    handlePointerLeave() {
+        this.scheduleHide();
+    }
+    isVisible = this.visible.asReadonly();
+    scheduleShow() {
+        this.cancelHide();
+        if (this.visible())
+            return;
+        const delay = this.showDelay();
+        if (delay <= 0) {
+            this.visible.set(true);
+            return;
+        }
+        this.showTimeoutId = window.setTimeout(() => {
+            this.visible.set(true);
+        }, delay);
+    }
+    scheduleHide() {
+        this.cancelShow();
+        if (!this.visible())
+            return;
+        const delay = this.hideDelay();
+        if (delay <= 0) {
+            this.visible.set(false);
+            return;
+        }
+        this.hideTimeoutId = window.setTimeout(() => {
+            this.visible.set(false);
+        }, delay);
+    }
+    cancelShow() {
+        if (this.showTimeoutId !== null) {
+            window.clearTimeout(this.showTimeoutId);
+            this.showTimeoutId = null;
+        }
+    }
+    cancelHide() {
+        if (this.hideTimeoutId !== null) {
+            window.clearTimeout(this.hideTimeoutId);
+            this.hideTimeoutId = null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: TooltipComponent, isStandalone: true, selector: "pe-tooltip", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "showDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "hideDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "handlePointerEnter()", "focusin": "handlePointerEnter()", "mouseleave": "handlePointerLeave()", "focusout": "handlePointerLeave()" }, properties: { "attr.aria-describedby": "this.ariaDescribedBy" } }, ngImport: i0, template: "<span class=\"pe-tooltip-wrapper\">\n  <ng-content />\n\n  @if (isVisible() && text()) {\n    <span\n      class=\"pe-tooltip pe-tooltip--{{ position() }}\"\n      role=\"tooltip\"\n      [attr.id]=\"tooltipId\"\n    >\n      {{ text() }}\n    </span>\n  }\n</span>\n\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-tooltip-wrapper{position:relative;display:inline-flex;align-items:center}.pe-tooltip{position:absolute;z-index:200;padding:8px 16px;border-radius:8px;background-color:#232323;font-weight:400;white-space:nowrap;pointer-events:none}.pe-tooltip--top{inset-block-end:100%;inset-inline-start:50%;margin-block-end:4px;transform:translate(-50%)}.pe-tooltip--bottom{inset-block-start:100%;inset-inline-start:50%;margin-block-start:4px;transform:translate(-50%)}.pe-tooltip--left{inset-inline-end:100%;inset-block-start:50%;margin-inline-end:4px;transform:translateY(-50%)}.pe-tooltip--right{inset-inline-start:100%;inset-block-start:50%;margin-inline-start:4px;transform:translateY(-50%)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TooltipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-tooltip', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"pe-tooltip-wrapper\">\n  <ng-content />\n\n  @if (isVisible() && text()) {\n    <span\n      class=\"pe-tooltip pe-tooltip--{{ position() }}\"\n      role=\"tooltip\"\n      [attr.id]=\"tooltipId\"\n    >\n      {{ text() }}\n    </span>\n  }\n</span>\n\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-tooltip-wrapper{position:relative;display:inline-flex;align-items:center}.pe-tooltip{position:absolute;z-index:200;padding:8px 16px;border-radius:8px;background-color:#232323;font-weight:400;white-space:nowrap;pointer-events:none}.pe-tooltip--top{inset-block-end:100%;inset-inline-start:50%;margin-block-end:4px;transform:translate(-50%)}.pe-tooltip--bottom{inset-block-start:100%;inset-inline-start:50%;margin-block-start:4px;transform:translate(-50%)}.pe-tooltip--left{inset-inline-end:100%;inset-block-start:50%;margin-inline-end:4px;transform:translateY(-50%)}.pe-tooltip--right{inset-inline-start:100%;inset-block-start:50%;margin-inline-start:4px;transform:translateY(-50%)}\n"] }]
+        }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDelay", required: false }] }], hideDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideDelay", required: false }] }], ariaDescribedBy: [{
+                type: HostBinding,
+                args: ['attr.aria-describedby']
+            }], handlePointerEnter: [{
+                type: HostListener,
+                args: ['mouseenter']
+            }, {
+                type: HostListener,
+                args: ['focusin']
+            }], handlePointerLeave: [{
+                type: HostListener,
+                args: ['mouseleave']
+            }, {
+                type: HostListener,
+                args: ['focusout']
+            }] } });
+
+/**
+ * Combobox: search input with filterable dropdown. User types to filter options and selects a result.
+ * Implements FormValueControl for use with Signal Forms [formField]. Use [(value)] for two-way binding.
+ */
+class SearchSelectComponent {
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    placeholder = input('Search...', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+    minCharsToOpen = input(0, ...(ngDevMode ? [{ debugName: "minCharsToOpen" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    valueChange = output();
+    ids = createFormFieldIds('pe-search-select');
+    query = signal('', ...(ngDevMode ? [{ debugName: "query" }] : []));
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    isFocused = signal(false, ...(ngDevMode ? [{ debugName: "isFocused" }] : []));
+    highlightedIndex = signal(0, ...(ngDevMode ? [{ debugName: "highlightedIndex" }] : []));
+    blurCloseTimeout = null;
+    listId = `${this.ids.controlId}-list`;
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    selectedOption = computed(() => {
+        const v = this.value();
+        if (v == null)
+            return null;
+        return this.options().find((opt) => opt.value === v) ?? null;
+    }, ...(ngDevMode ? [{ debugName: "selectedOption" }] : []));
+    selectedLabel = computed(() => this.selectedOption()?.label ?? '', ...(ngDevMode ? [{ debugName: "selectedLabel" }] : []));
+    filteredOptions = computed(() => {
+        const q = this.query().trim().toLowerCase();
+        const opts = this.options();
+        if (!q)
+            return opts;
+        return opts.filter((opt) => opt.label.toLowerCase().includes(q));
+    }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : []));
+    displayText = computed(() => {
+        if (this.isOpen())
+            return this.query();
+        if (this.value() != null)
+            return this.selectedLabel();
+        return this.query();
+    }, ...(ngDevMode ? [{ debugName: "displayText" }] : []));
+    shouldShowPanel = computed(() => {
+        if (!this.isOpen())
+            return false;
+        const min = this.minCharsToOpen();
+        return this.query().trim().length >= min;
+    }, ...(ngDevMode ? [{ debugName: "shouldShowPanel" }] : []));
+    hasNoResults = computed(() => this.shouldShowPanel() && this.filteredOptions().length === 0, ...(ngDevMode ? [{ debugName: "hasNoResults" }] : []));
+    optionId = (index) => `${this.ids.controlId}-option-${index}`;
+    activeDescendantId = computed(() => {
+        const list = this.filteredOptions();
+        const idx = this.highlightedIndex();
+        if (list.length === 0)
+            return undefined;
+        const safeIdx = Math.min(Math.max(0, idx), list.length - 1);
+        return this.optionId(safeIdx);
+    }, ...(ngDevMode ? [{ debugName: "activeDescendantId" }] : []));
+    onInputValueChange(text) {
+        this.query.set(text);
+        this.isOpen.set(true);
+        this.highlightedIndex.set(0);
+        if (this.value() != null && text !== this.selectedLabel()) {
+            this.value.set(null);
+            this.valueChange.emit(null);
+        }
+    }
+    onInputFocus() {
+        this.cancelBlurClose();
+        this.isFocused.set(true);
+        if (this.value() != null)
+            this.query.set(this.selectedLabel());
+        this.isOpen.set(true);
+        this.highlightedIndex.set(0);
+    }
+    onInputBlur() {
+        this.isFocused.set(false);
+        this.blurCloseTimeout = setTimeout(() => {
+            this.blurCloseTimeout = null;
+            this.isOpen.set(false);
+            if (this.value() != null)
+                this.query.set(this.selectedLabel());
+        }, 150);
+    }
+    onKeydown(event) {
+        if (!this.shouldShowPanel())
+            return;
+        const list = this.filteredOptions();
+        if (list.length === 0)
+            return;
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                this.highlightedIndex.set((this.highlightedIndex() + 1) % list.length);
+                break;
+            case 'ArrowUp':
+                event.preventDefault();
+                this.highlightedIndex.set(this.highlightedIndex() <= 0 ? list.length - 1 : this.highlightedIndex() - 1);
+                break;
+            case 'Enter':
+                event.preventDefault();
+                this.selectOption(list[this.highlightedIndex()]);
+                break;
+            case 'Escape':
+                event.preventDefault();
+                this.isOpen.set(false);
+                break;
+            default:
+                break;
+        }
+    }
+    selectOption(opt) {
+        this.cancelBlurClose();
+        this.value.set(opt.value);
+        this.valueChange.emit(opt.value);
+        this.query.set(opt.label);
+        this.isOpen.set(false);
+    }
+    cancelBlurClose() {
+        if (this.blurCloseTimeout != null) {
+            clearTimeout(this.blurCloseTimeout);
+            this.blurCloseTimeout = null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SearchSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: SearchSelectComponent, isStandalone: true, selector: "pe-search-select", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, minCharsToOpen: { classPropertyName: "minCharsToOpen", publicName: "minCharsToOpen", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChange: "valueChange" }, ngImport: i0, template: "<div\n  class=\"pe-search-select pe-search-select--{{ size() }}\"\n  [class.pe-search-select--open]=\"isOpen()\"\n  [class.pe-search-select--error]=\"hasError()\"\n  [class.pe-search-select--disabled]=\"disabled()\"\n  [class.pe-search-select--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-search-select__control\"\n    [class.pe-search-select__control--focused]=\"isFocused()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"listId\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    <pe-input\n      [controlId]=\"ids.controlId\"\n      [value]=\"displayText()\"\n      (valueChange)=\"onInputValueChange($event)\"\n      (inputFocus)=\"onInputFocus()\"\n      (inputBlur)=\"onInputBlur()\"\n      [size]=\"size()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"disabled()\"\n      [label]=\"null\"\n      [helperText]=\"null\"\n      [autocomplete]=\"'off'\"\n    >\n      <ng-container pe-input-right-elements>\n        <pe-icon size=\"5\" icon=\"search\" />\n      </ng-container>\n    </pe-input>\n\n    @if (shouldShowPanel()) {\n      <div\n        class=\"pe-search-select__list pe-scrollable\"\n        [class.pe-search-select__list--empty]=\"hasNoResults()\"\n        [id]=\"listId\"\n        role=\"listbox\"\n      >\n        @if (hasNoResults()) {\n          <div class=\"pe-search-select__empty\" role=\"status\">No results</div>\n        } @else {\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <div\n              class=\"pe-search-select__option\"\n              [class.pe-search-select__option--highlighted]=\"highlightedIndex() === i\"\n              [id]=\"optionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"value() === opt.value\"\n              (mousedown)=\"selectOption(opt)\"\n            >\n              <pe-list-item\n                theme=\"ghost-white\"\n                [selected]=\"value() === opt.value\"\n                [hideFocusOutline]=\"true\"\n              >\n                <ng-container pe-list-item-label>{{ opt.label }}</ng-container>\n              </pe-list-item>\n            </div>\n          }\n        }\n      </div>\n    }\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-search-select{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;width:100%}.pe-search-select__control{position:relative;display:flex;flex-direction:column;width:100%}.pe-search-select__control .pe-list-item:focus-visible,.pe-search-select__control .pe-list-item:focus{outline:none}.pe-search-select__list{position:absolute;top:100%;left:0;right:0;z-index:1;display:flex;flex-direction:column;gap:4px;background-color:#232323;border-radius:16px;padding:4px;margin-top:4px;max-height:316px;overflow-y:auto;border:2px solid rgba(255,255,255,.1)}.pe-search-select__list--empty{padding:12px}.pe-search-select__option{cursor:pointer;border-radius:8px}.pe-search-select__option--highlighted .pe-list-item{background-color:#fff3}.pe-search-select__empty{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#ffffffb3}.pe-search-select--disabled .pe-search-select__control{opacity:.6;cursor:not-allowed}.pe-search-select--error .pe-input__group{border-color:#f69d9d}@media(max-width:1023px){.pe-search-select__list{max-height:316px}}@media(min-width:1024px){.pe-search-select__control{max-width:100%}}\n"], dependencies: [{ kind: "component", type: InputComponent, selector: "pe-input", inputs: ["type", "size", "appearance", "error", "disabled", "readOnly", "required", "placeholder", "label", "helperText", "errorText", "maxLength", "minLength", "pattern", "autocomplete", "controlId", "invalid", "errors", "touched", "value"], outputs: ["touchedChange", "valueChange", "inputBlur", "inputFocus"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: ListItemComponent, selector: "pe-list-item", inputs: ["theme", "disabled", "hideFocusOutline", "selected", "loading"] }, { kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SearchSelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-search-select', standalone: true, imports: [
+                        InputComponent,
+                        IconComponent,
+                        ListItemComponent,
+                        FormFieldLabelComponent,
+                        FormFieldHelperComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-search-select pe-search-select--{{ size() }}\"\n  [class.pe-search-select--open]=\"isOpen()\"\n  [class.pe-search-select--error]=\"hasError()\"\n  [class.pe-search-select--disabled]=\"disabled()\"\n  [class.pe-search-select--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-search-select__control\"\n    [class.pe-search-select__control--focused]=\"isFocused()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [attr.aria-controls]=\"listId\"\n    [attr.aria-activedescendant]=\"activeDescendantId()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    <pe-input\n      [controlId]=\"ids.controlId\"\n      [value]=\"displayText()\"\n      (valueChange)=\"onInputValueChange($event)\"\n      (inputFocus)=\"onInputFocus()\"\n      (inputBlur)=\"onInputBlur()\"\n      [size]=\"size()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"disabled()\"\n      [label]=\"null\"\n      [helperText]=\"null\"\n      [autocomplete]=\"'off'\"\n    >\n      <ng-container pe-input-right-elements>\n        <pe-icon size=\"5\" icon=\"search\" />\n      </ng-container>\n    </pe-input>\n\n    @if (shouldShowPanel()) {\n      <div\n        class=\"pe-search-select__list pe-scrollable\"\n        [class.pe-search-select__list--empty]=\"hasNoResults()\"\n        [id]=\"listId\"\n        role=\"listbox\"\n      >\n        @if (hasNoResults()) {\n          <div class=\"pe-search-select__empty\" role=\"status\">No results</div>\n        } @else {\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <div\n              class=\"pe-search-select__option\"\n              [class.pe-search-select__option--highlighted]=\"highlightedIndex() === i\"\n              [id]=\"optionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"value() === opt.value\"\n              (mousedown)=\"selectOption(opt)\"\n            >\n              <pe-list-item\n                theme=\"ghost-white\"\n                [selected]=\"value() === opt.value\"\n                [hideFocusOutline]=\"true\"\n              >\n                <ng-container pe-list-item-label>{{ opt.label }}</ng-container>\n              </pe-list-item>\n            </div>\n          }\n        }\n      </div>\n    }\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-search-select{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;width:100%}.pe-search-select__control{position:relative;display:flex;flex-direction:column;width:100%}.pe-search-select__control .pe-list-item:focus-visible,.pe-search-select__control .pe-list-item:focus{outline:none}.pe-search-select__list{position:absolute;top:100%;left:0;right:0;z-index:1;display:flex;flex-direction:column;gap:4px;background-color:#232323;border-radius:16px;padding:4px;margin-top:4px;max-height:316px;overflow-y:auto;border:2px solid rgba(255,255,255,.1)}.pe-search-select__list--empty{padding:12px}.pe-search-select__option{cursor:pointer;border-radius:8px}.pe-search-select__option--highlighted .pe-list-item{background-color:#fff3}.pe-search-select__empty{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400;color:#ffffffb3}.pe-search-select--disabled .pe-search-select__control{opacity:.6;cursor:not-allowed}.pe-search-select--error .pe-input__group{border-color:#f69d9d}@media(max-width:1023px){.pe-search-select__list{max-height:316px}}@media(min-width:1024px){.pe-search-select__control{max-width:100%}}\n"] }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], minCharsToOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "minCharsToOpen", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+/**
+ * Form-friendly select built on the dropdown. Implements FormValueControl for Signal Forms [formField].
+ * Use [(value)] or [formField]="myForm().country".
+ *
+ * @example
+ * <pe-select label="Sort by" [options]="options" [(value)]="selected" />
+ */
+class SelectComponent {
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    theme = input('transparent-white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    placeholder = input('Select an option', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    selectedIndex = model(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
+    ids = createFormFieldIds('pe-select');
+    items = computed(() => {
+        const opts = this.options();
+        if (!opts.length)
+            return [];
+        return opts.map((option) => ({
+            label: option.label ?? option.value,
+            value: option.value,
+            leftIcons: option.leftIcons,
+            rightIcons: option.rightIcons,
+            disabled: option.disabled,
+        }));
+    }, ...(ngDevMode ? [{ debugName: "items" }] : []));
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    constructor() {
+        // Keep selectedIndex in sync when value or options change
+        effect(() => {
+            const currentValue = this.value();
+            const options = this.options();
+            if (currentValue == null) {
+                this.selectedIndex.set(0);
+                return;
+            }
+            const index = options.findIndex((opt) => opt.value === currentValue);
+            this.selectedIndex.set(index >= 0 ? index : 0);
+        });
+    }
+    /** Handles index changes coming from the dropdown */
+    onSelectedIndexChange(index) {
+        const options = this.options();
+        const option = options[index];
+        this.selectedIndex.set(index);
+        this.value.set(option?.value ?? null);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.2", type: SelectComponent, isStandalone: true, selector: "pe-select", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", selectedIndex: "selectedIndexChange" }, ngImport: i0, template: "<div\n  class=\"pe-select pe-select--{{ size() }}\"\n  [class.pe-select--disabled]=\"disabled()\"\n  [class.pe-select--error]=\"hasError()\"\n  [class.pe-select--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-select__control\"\n    [id]=\"ids.controlId\"\n    [class.pe-select__control--disabled]=\"disabled()\"\n  >\n    <pe-dropdown\n      class=\"pe-select__dropdown\"\n      [theme]=\"theme()\"\n      [items]=\"items()\"\n      [disabled]=\"disabled()\"\n      [(selectedIndex)]=\"selectedIndex\"\n      (selectedIndexChange)=\"onSelectedIndexChange($event)\"\n    />\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-select{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-select__control{display:flex;align-items:center;min-height:40px;border:2px solid rgba(255,255,255,.1);border-radius:8px;background-color:transparent;transition:border-color .25s cubic-bezier(.4,0,.2,1)}.pe-select__control:hover{border-color:#ffffff4d}.pe-select__control:focus-within{border-color:#ffffff80}.pe-select__control .pe-list-item:focus-visible,.pe-select__control .pe-list-item:focus{outline:none}.pe-select__control--disabled{opacity:.6;cursor:not-allowed}.pe-select--disabled .pe-select__control{border-color:#ffffff1a}.pe-select--disabled .pe-select__control:hover,.pe-select--disabled .pe-select__control:focus-within{border-color:#ffffff1a}.pe-select--disabled .pe-select__control{opacity:.6;cursor:not-allowed}.pe-select__dropdown{width:100%}\n"], dependencies: [{ kind: "component", type: DropdownComponent, selector: "pe-dropdown", inputs: ["theme", "items", "disabled", "menuTriggerIcons", "triggerIconOnly", "iconOnlyLabel", "selectedIndex"], outputs: ["selectedIndexChange", "selectedItemChange"] }, { kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-select', standalone: true, imports: [DropdownComponent, FormFieldLabelComponent, FormFieldHelperComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-select pe-select--{{ size() }}\"\n  [class.pe-select--disabled]=\"disabled()\"\n  [class.pe-select--error]=\"hasError()\"\n  [class.pe-select--required]=\"required()\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-select__control\"\n    [id]=\"ids.controlId\"\n    [class.pe-select__control--disabled]=\"disabled()\"\n  >\n    <pe-dropdown\n      class=\"pe-select__dropdown\"\n      [theme]=\"theme()\"\n      [items]=\"items()\"\n      [disabled]=\"disabled()\"\n      [(selectedIndex)]=\"selectedIndex\"\n      (selectedIndexChange)=\"onSelectedIndexChange($event)\"\n    />\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"errorText() || (hasError() && errors().length ? errors()[0].message : '') || null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-select{white-space:nowrap;box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-select__control{display:flex;align-items:center;min-height:40px;border:2px solid rgba(255,255,255,.1);border-radius:8px;background-color:transparent;transition:border-color .25s cubic-bezier(.4,0,.2,1)}.pe-select__control:hover{border-color:#ffffff4d}.pe-select__control:focus-within{border-color:#ffffff80}.pe-select__control .pe-list-item:focus-visible,.pe-select__control .pe-list-item:focus{outline:none}.pe-select__control--disabled{opacity:.6;cursor:not-allowed}.pe-select--disabled .pe-select__control{border-color:#ffffff1a}.pe-select--disabled .pe-select__control:hover,.pe-select--disabled .pe-select__control:focus-within{border-color:#ffffff1a}.pe-select--disabled .pe-select__control{opacity:.6;cursor:not-allowed}.pe-select__dropdown{width:100%}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }, { type: i0.Output, args: ["selectedIndexChange"] }] } });
+
+class SidebarComponent {
+    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
+    theme = input('ghost-white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    selectedIndex = model(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
+    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    closeOnBackdropClick = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdropClick" }] : []));
+    hideItemFocusOutline = input(true, ...(ngDevMode ? [{ debugName: "hideItemFocusOutline" }] : []));
+    itemSelected = output();
+    close() {
+        this.open.set(false);
+    }
+    onOverlayClick() {
+        if (this.closeOnBackdropClick()) {
+            this.close();
+        }
+    }
+    onItemClick(item, index) {
+        if (item.disabled) {
+            return;
+        }
+        this.selectedIndex.set(index);
+        this.itemSelected.emit(item);
+    }
+    onEscape() {
+        if (this.open()) {
+            this.close();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: SidebarComponent, isStandalone: true, selector: "pe-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdropClick: { classPropertyName: "closeOnBackdropClick", publicName: "closeOnBackdropClick", isSignal: true, isRequired: false, transformFunction: null }, hideItemFocusOutline: { classPropertyName: "hideItemFocusOutline", publicName: "hideItemFocusOutline", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange", open: "openChange", itemSelected: "itemSelected" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "attr.aria-hidden": "!open()" } }, ngImport: i0, template: "<div class=\"pe-sidebar\">\n  <div\n    class=\"pe-sidebar__overlay\"\n    [class.pe-sidebar__overlay--visible]=\"open()\"\n    [attr.aria-hidden]=\"!open()\"\n    (click)=\"onOverlayClick()\"\n  ></div>\n\n  <aside\n    class=\"pe-sidebar__drawer\"\n    [class.pe-sidebar__drawer--open]=\"open()\"\n    role=\"navigation\"\n    [attr.aria-hidden]=\"!open()\"\n  >\n    <div class=\"pe-sidebar__inner\">\n      <header class=\"pe-sidebar__header\">\n        @if (open()) {\n          <pe-button\n            theme=\"ghost-white\"\n            [iconOnly]=\"true\"\n            class=\"pe-sidebar__close\"\n            ariaLabel=\"Close menu\"\n            (buttonClick)=\"close()\"\n          >\n            <pe-icon icon=\"close\" size=\"6\" />\n          </pe-button>\n        }\n        <ng-content select=\"[pe-sidebar-header]\" />\n      </header>\n      <nav class=\"pe-sidebar__nav pe-scrollable\">\n        @if (items().length > 0) {\n          @for (item of items(); track $index) {\n            <pe-list-item\n              [theme]=\"theme()\"\n              [disabled]=\"!!item.disabled\"\n              [selected]=\"selectedIndex() === $index\"\n              [hideFocusOutline]=\"hideItemFocusOutline()\"\n              (click)=\"onItemClick(item, $index)\"\n            >\n              <ng-container pe-list-item-before-label>\n                @if (item.leftIcons) {\n                  @for (icon of item.leftIcons; track icon) {\n                    <pe-icon size=\"5\" [icon]=\"icon\" />\n                  }\n                }\n              </ng-container>\n              <ng-container pe-list-item-label>{{ item.label }}</ng-container>\n              <ng-container pe-list-item-after-label>\n                @if (item.rightIcons) {\n                  @for (icon of item.rightIcons; track icon) {\n                    <pe-icon size=\"5\" [icon]=\"icon\" />\n                  }\n                }\n              </ng-container>\n            </pe-list-item>\n          }\n        } @else {\n          <ng-content select=\"[pe-sidebar-nav]\" />\n        }\n      </nav>\n      <footer class=\"pe-sidebar__footer\">\n        <ng-content select=\"[pe-sidebar-footer]\" />\n      </footer>\n    </div>\n  </aside>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-scrollable::-webkit-scrollbar{width:8px;height:8px}.pe-scrollable::-webkit-scrollbar-track{background:transparent;border-radius:4px}.pe-scrollable::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px;transition:background-color .15s cubic-bezier(.4,0,.2,1)}.pe-scrollable::-webkit-scrollbar-thumb:hover{background:#fff3}.pe-scrollable{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent;overflow:overlay;-webkit-overflow-scrolling:touch}.pe-scrollable::-webkit-scrollbar{opacity:0;transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-scrollable:hover::-webkit-scrollbar{opacity:1}.pe-scrollable{scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .25s cubic-bezier(.4,0,.2,1)}.pe-scrollable:hover{scrollbar-color:rgba(255,255,255,.1) transparent}.pe-sidebar{position:relative;height:100%}.pe-sidebar__overlay{display:none;position:fixed;inset:0;background-color:#000000b3;z-index:900;opacity:0;pointer-events:none;transition:opacity .25s cubic-bezier(.4,0,.2,1)}@media(max-width:1279px){.pe-sidebar__overlay{display:block}}.pe-sidebar__overlay--visible{opacity:1;pointer-events:auto}.pe-sidebar__drawer{position:fixed;top:0;left:0;bottom:0;width:240px;max-width:85vw;height:100%;background-color:#0a0a0a;border-right:1px solid rgba(255,255,255,.1);z-index:1000;display:flex;flex-direction:column;overflow:hidden;transition:transform .25s cubic-bezier(.4,0,.2,1)}@media(max-width:1279px){.pe-sidebar__drawer{transform:translate(-100%)}}@media(max-width:1279px){.pe-sidebar__drawer--open{transform:translate(0)}}@media(min-width:1024px){.pe-sidebar__drawer{position:relative;transform:none;flex-shrink:0}}.pe-sidebar__inner{display:flex;flex-direction:column;height:100%;padding:16px;gap:16px}.pe-sidebar__header{flex-shrink:0;display:flex;align-items:center;gap:8px}@media(min-width:1024px){.pe-sidebar__header .pe-sidebar__close{display:none}}.pe-sidebar__header .pe-sidebar__close .pe-icon,.pe-sidebar__header .pe-sidebar__close .pe-icon:before{background-color:transparent}.pe-sidebar__nav{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.pe-sidebar__footer{flex-shrink:0;border-top:1px solid rgba(255,255,255,.1);padding-top:16px}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "pe-button", inputs: ["size", "theme", "iconOnly", "vertical", "disabled", "type", "ariaLabel"], outputs: ["buttonClick"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: ListItemComponent, selector: "pe-list-item", inputs: ["theme", "disabled", "hideFocusOutline", "selected", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SidebarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-sidebar', standalone: true, imports: [ButtonComponent, IconComponent, ListItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        '[attr.aria-hidden]': '!open()',
+                    }, template: "<div class=\"pe-sidebar\">\n  <div\n    class=\"pe-sidebar__overlay\"\n    [class.pe-sidebar__overlay--visible]=\"open()\"\n    [attr.aria-hidden]=\"!open()\"\n    (click)=\"onOverlayClick()\"\n  ></div>\n\n  <aside\n    class=\"pe-sidebar__drawer\"\n    [class.pe-sidebar__drawer--open]=\"open()\"\n    role=\"navigation\"\n    [attr.aria-hidden]=\"!open()\"\n  >\n    <div class=\"pe-sidebar__inner\">\n      <header class=\"pe-sidebar__header\">\n        @if (open()) {\n          <pe-button\n            theme=\"ghost-white\"\n            [iconOnly]=\"true\"\n            class=\"pe-sidebar__close\"\n            ariaLabel=\"Close menu\"\n            (buttonClick)=\"close()\"\n          >\n            <pe-icon icon=\"close\" size=\"6\" />\n          </pe-button>\n        }\n        <ng-content select=\"[pe-sidebar-header]\" />\n      </header>\n      <nav class=\"pe-sidebar__nav pe-scrollable\">\n        @if (items().length > 0) {\n          @for (item of items(); track $index) {\n            <pe-list-item\n              [theme]=\"theme()\"\n              [disabled]=\"!!item.disabled\"\n              [selected]=\"selectedIndex() === $index\"\n              [hideFocusOutline]=\"hideItemFocusOutline()\"\n              (click)=\"onItemClick(item, $index)\"\n            >\n              <ng-container pe-list-item-before-label>\n                @if (item.leftIcons) {\n                  @for (icon of item.leftIcons; track icon) {\n                    <pe-icon size=\"5\" [icon]=\"icon\" />\n                  }\n                }\n              </ng-container>\n              <ng-container pe-list-item-label>{{ item.label }}</ng-container>\n              <ng-container pe-list-item-after-label>\n                @if (item.rightIcons) {\n                  @for (icon of item.rightIcons; track icon) {\n                    <pe-icon size=\"5\" [icon]=\"icon\" />\n                  }\n                }\n              </ng-container>\n            </pe-list-item>\n          }\n        } @else {\n          <ng-content select=\"[pe-sidebar-nav]\" />\n        }\n      </nav>\n      <footer class=\"pe-sidebar__footer\">\n        <ng-content select=\"[pe-sidebar-footer]\" />\n      </footer>\n    </div>\n  </aside>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-scrollable::-webkit-scrollbar{width:8px;height:8px}.pe-scrollable::-webkit-scrollbar-track{background:transparent;border-radius:4px}.pe-scrollable::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px;transition:background-color .15s cubic-bezier(.4,0,.2,1)}.pe-scrollable::-webkit-scrollbar-thumb:hover{background:#fff3}.pe-scrollable{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent;overflow:overlay;-webkit-overflow-scrolling:touch}.pe-scrollable::-webkit-scrollbar{opacity:0;transition:opacity .25s cubic-bezier(.4,0,.2,1)}.pe-scrollable:hover::-webkit-scrollbar{opacity:1}.pe-scrollable{scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .25s cubic-bezier(.4,0,.2,1)}.pe-scrollable:hover{scrollbar-color:rgba(255,255,255,.1) transparent}.pe-sidebar{position:relative;height:100%}.pe-sidebar__overlay{display:none;position:fixed;inset:0;background-color:#000000b3;z-index:900;opacity:0;pointer-events:none;transition:opacity .25s cubic-bezier(.4,0,.2,1)}@media(max-width:1279px){.pe-sidebar__overlay{display:block}}.pe-sidebar__overlay--visible{opacity:1;pointer-events:auto}.pe-sidebar__drawer{position:fixed;top:0;left:0;bottom:0;width:240px;max-width:85vw;height:100%;background-color:#0a0a0a;border-right:1px solid rgba(255,255,255,.1);z-index:1000;display:flex;flex-direction:column;overflow:hidden;transition:transform .25s cubic-bezier(.4,0,.2,1)}@media(max-width:1279px){.pe-sidebar__drawer{transform:translate(-100%)}}@media(max-width:1279px){.pe-sidebar__drawer--open{transform:translate(0)}}@media(min-width:1024px){.pe-sidebar__drawer{position:relative;transform:none;flex-shrink:0}}.pe-sidebar__inner{display:flex;flex-direction:column;height:100%;padding:16px;gap:16px}.pe-sidebar__header{flex-shrink:0;display:flex;align-items:center;gap:8px}@media(min-width:1024px){.pe-sidebar__header .pe-sidebar__close{display:none}}.pe-sidebar__header .pe-sidebar__close .pe-icon,.pe-sidebar__header .pe-sidebar__close .pe-icon:before{background-color:transparent}.pe-sidebar__nav{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.pe-sidebar__footer{flex-shrink:0;border-top:1px solid rgba(255,255,255,.1);padding-top:16px}\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }, { type: i0.Output, args: ["selectedIndexChange"] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], closeOnBackdropClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdropClick", required: false }] }], hideItemFocusOutline: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideItemFocusOutline", required: false }] }], itemSelected: [{ type: i0.Output, args: ["itemSelected"] }], onEscape: [{
+                type: HostListener,
+                args: ['document:keydown.escape']
+            }] } });
+
+class StatusComponent {
+    status = input('info', ...(ngDevMode ? [{ debugName: "status" }] : []));
+    customIcon = input(...(ngDevMode ? [undefined, { debugName: "customIcon" }] : []));
+    loadingAnimation = input(false, ...(ngDevMode ? [{ debugName: "loadingAnimation" }] : []));
+    get icon() {
+        const customIcon = this.customIcon();
+        if (customIcon) {
+            return customIcon;
+        }
+        const statusIcons = {
+            confirm: 'check',
+            alert: 'alert',
+            error: 'cross',
+            pending: 'hourglass',
+            info: 'info',
+        };
+        return statusIcons[this.status()] || 'info';
+    }
+    computedClasses = computed(() => ({
+        'pe-status': true,
+        'pe-status--confirm': this.status() === 'confirm',
+        'pe-status--alert': this.status() === 'alert',
+        'pe-status--error': this.status() === 'error',
+        'pe-status--pending': this.status() === 'pending',
+        'pe-status--info': this.status() === 'info',
+    }), ...(ngDevMode ? [{ debugName: "computedClasses" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: StatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: StatusComponent, isStandalone: true, selector: "pe-status", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, customIcon: { classPropertyName: "customIcon", publicName: "customIcon", isSignal: true, isRequired: false, transformFunction: null }, loadingAnimation: { classPropertyName: "loadingAnimation", publicName: "loadingAnimation", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [class]=\"computedClasses()\">\n  <div class=\"pe-status-icon\">\n    <pe-icon [icon]=\"icon\" size=\"12\" />\n    @if (loadingAnimation()) {\n      <div class=\"pe-status-loading\">\n        <pe-radial [size]=\"96\" [percentage]=\"50\" [infinite]=\"true\" />\n      </div>\n    }\n  </div>\n  <div class=\"pe-status-title-container\">\n    <div class=\"pe-status-title\">\n      <ng-content select=\"[pe-status-title]\" />\n    </div>\n    <div class=\"pe-status-subtitle\">\n      <ng-content select=\"[pe-status-subtitle]\" />\n    </div>\n  </div>\n  <div class=\"pe-status-description\">\n    <ng-content select=\"[pe-status-description]\" />\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-status{display:flex;flex-direction:column;align-items:center;width:100%;max-width:540px;gap:32px}.pe-status-icon{position:relative;display:flex;align-items:center;justify-content:center;width:96px;height:96px;border-radius:4096px;background-color:#ffffff1a}.pe-status-loading{position:absolute;inset:0;width:100%}.pe-status-title{text-align:center;font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-status-subtitle{text-align:center;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-status-description{text-align:center;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-status--confirm .pe-status-icon{background-color:#0b7a27}.pe-status--alert .pe-status-icon{background-color:#e87523}.pe-status--error .pe-status-icon{background-color:#c33a3a}.pe-status--pending .pe-status-icon{background-color:#6f3de0}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: RadialComponent, selector: "pe-radial", inputs: ["size", "infinite", "percentage", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: StatusComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-status', standalone: true, imports: [IconComponent, RadialComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"computedClasses()\">\n  <div class=\"pe-status-icon\">\n    <pe-icon [icon]=\"icon\" size=\"12\" />\n    @if (loadingAnimation()) {\n      <div class=\"pe-status-loading\">\n        <pe-radial [size]=\"96\" [percentage]=\"50\" [infinite]=\"true\" />\n      </div>\n    }\n  </div>\n  <div class=\"pe-status-title-container\">\n    <div class=\"pe-status-title\">\n      <ng-content select=\"[pe-status-title]\" />\n    </div>\n    <div class=\"pe-status-subtitle\">\n      <ng-content select=\"[pe-status-subtitle]\" />\n    </div>\n  </div>\n  <div class=\"pe-status-description\">\n    <ng-content select=\"[pe-status-description]\" />\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-status{display:flex;flex-direction:column;align-items:center;width:100%;max-width:540px;gap:32px}.pe-status-icon{position:relative;display:flex;align-items:center;justify-content:center;width:96px;height:96px;border-radius:4096px;background-color:#ffffff1a}.pe-status-loading{position:absolute;inset:0;width:100%}.pe-status-title{text-align:center;font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-status-subtitle{text-align:center;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-status-description{text-align:center;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-status--confirm .pe-status-icon{background-color:#0b7a27}.pe-status--alert .pe-status-icon{background-color:#e87523}.pe-status--error .pe-status-icon{background-color:#c33a3a}.pe-status--pending .pe-status-icon{background-color:#6f3de0}\n"] }]
+        }], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], customIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "customIcon", required: false }] }], loadingAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingAnimation", required: false }] }] } });
+
+/**
+ * Table component for tabular data with optional sort (per-column) and global filter.
+ * Uses semantic table markup; responsive with horizontal scroll on small viewports.
+ */
+class TableComponent {
+    columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
+    data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
+    sortColumn = model(null, ...(ngDevMode ? [{ debugName: "sortColumn" }] : []));
+    sortDirection = model('asc', ...(ngDevMode ? [{ debugName: "sortDirection" }] : []));
+    filterPlaceholder = input('Filter...', ...(ngDevMode ? [{ debugName: "filterPlaceholder" }] : []));
+    filterLabel = input('Filter', ...(ngDevMode ? [{ debugName: "filterLabel" }] : []));
+    showGlobalFilter = input(false, ...(ngDevMode ? [{ debugName: "showGlobalFilter" }] : []));
+    emptyMessage = input('No data', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    sortColumnChange = output();
+    filterChange = output();
+    filterQuery = signal('', ...(ngDevMode ? [{ debugName: "filterQuery" }] : []));
+    hasSortableColumn = computed(() => this.columns().some((col) => col.sortable === true), ...(ngDevMode ? [{ debugName: "hasSortableColumn" }] : []));
+    filteredData = computed(() => {
+        const rows = this.data();
+        const query = this.filterQuery().trim().toLowerCase();
+        const cols = this.columns();
+        if (!query)
+            return rows;
+        return rows.filter((row) => {
+            return cols.some((col) => {
+                const val = this.getCellValue(row, col.id);
+                return String(val).toLowerCase().includes(query);
+            });
+        });
+    }, ...(ngDevMode ? [{ debugName: "filteredData" }] : []));
+    sortedData = computed(() => {
+        const rows = this.filteredData();
+        const colId = this.sortColumn();
+        const dir = this.sortDirection();
+        if (!colId)
+            return rows;
+        return [...rows].sort((a, b) => {
+            const aVal = this.getCellValue(a, colId);
+            const bVal = this.getCellValue(b, colId);
+            const aStr = String(aVal ?? '');
+            const bStr = String(bVal ?? '');
+            const cmp = aStr.localeCompare(bStr, undefined, { numeric: true });
+            return dir === 'asc' ? cmp : -cmp;
+        });
+    }, ...(ngDevMode ? [{ debugName: "sortedData" }] : []));
+    filterId = `pe-table-filter-${Math.random().toString(36).slice(2, 9)}`;
+    getCellValue(row, columnId) {
+        return row[columnId];
+    }
+    onFilterInput(value) {
+        this.filterQuery.set(value);
+        this.filterChange.emit(value);
+    }
+    toggleSort(columnId) {
+        const col = this.columns().find((c) => c.id === columnId);
+        if (!col?.sortable)
+            return;
+        const current = this.sortColumn();
+        const currentDir = this.sortDirection();
+        if (current === columnId) {
+            const nextDir = currentDir === 'asc' ? 'desc' : 'asc';
+            this.sortDirection.set(nextDir);
+            this.sortColumnChange.emit({ column: columnId, direction: nextDir });
+            return;
+        }
+        else {
+            this.sortColumn.set(columnId);
+            this.sortDirection.set('asc');
+            this.sortColumnChange.emit({ column: columnId, direction: 'asc' });
+        }
+    }
+    getSortAriaSort(columnId) {
+        if (this.sortColumn() !== columnId)
+            return 'none';
+        return this.sortDirection() === 'asc' ? 'ascending' : 'descending';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: TableComponent, isStandalone: true, selector: "pe-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, sortColumn: { classPropertyName: "sortColumn", publicName: "sortColumn", isSignal: true, isRequired: false, transformFunction: null }, sortDirection: { classPropertyName: "sortDirection", publicName: "sortDirection", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, filterLabel: { classPropertyName: "filterLabel", publicName: "filterLabel", isSignal: true, isRequired: false, transformFunction: null }, showGlobalFilter: { classPropertyName: "showGlobalFilter", publicName: "showGlobalFilter", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortColumn: "sortColumnChange", sortDirection: "sortDirectionChange", sortColumnChange: "sortColumnChange", filterChange: "filterChange" }, ngImport: i0, template: "<div\n  class=\"pe-table\"\n  [class.pe-table--sortable]=\"hasSortableColumn()\"\n  [class.pe-table--filterable]=\"showGlobalFilter()\"\n>\n  @if (showGlobalFilter()) {\n    <div class=\"pe-table__toolbar\">\n      <pe-input\n        [controlId]=\"filterId\"\n        [label]=\"filterLabel()\"\n        [placeholder]=\"filterPlaceholder()\"\n        [value]=\"filterQuery()\"\n        (valueChange)=\"onFilterInput($event)\"\n        size=\"sm\"\n      >\n        <ng-container pe-input-left-elements>\n          <pe-icon size=\"5\" icon=\"search\" />\n        </ng-container>\n      </pe-input>\n    </div>\n  }\n\n  <div class=\"pe-table__scroll pe-scrollable\">\n    <pe-skeleton [show]=\"loading()\" variant=\"rect\">\n      <table class=\"pe-table__table\">\n        <thead class=\"pe-table__head\">\n          <tr class=\"pe-table__row pe-table__row--head\">\n            @for (col of columns(); track col.id) {\n              <th\n                class=\"pe-table__th\"\n                [class.pe-table__th--sortable]=\"col.sortable\"\n                [class.pe-table__th--sort-asc]=\"sortColumn() === col.id && sortDirection() === 'asc'\"\n                [class.pe-table__th--sort-desc]=\"sortColumn() === col.id && sortDirection() === 'desc'\"\n                [attr.scope]=\"'col'\"\n                [attr.aria-sort]=\"col.sortable ? getSortAriaSort(col.id) : null\"\n              >\n                @if (col.sortable) {\n                  <button\n                    type=\"button\"\n                    class=\"pe-table__th-button\"\n                    [attr.aria-label]=\"'Sort by ' + col.label\"\n                    (click)=\"toggleSort(col.id)\"\n                  >\n                    <span class=\"pe-table__th-label\">{{ col.label }}</span>\n                    @if (sortColumn() === col.id && sortDirection() === 'asc') {\n                      <pe-icon size=\"5\" icon=\"arrow_up\" />\n                    } @else if (sortColumn() === col.id && sortDirection() === 'desc') {\n                      <pe-icon size=\"5\" icon=\"arrow_down\" />\n                    } @else {\n                      <pe-icon size=\"5\" icon=\"sort\" />\n                    }\n                  </button>\n                } @else {\n                  <span class=\"pe-table__th-label\">{{ col.label }}</span>\n                }\n              </th>\n            }\n          </tr>\n        </thead>\n        <tbody class=\"pe-table__body\">\n          @if (sortedData().length === 0) {\n            <tr class=\"pe-table__row pe-table__row--empty\">\n              <td class=\"pe-table__cell pe-table__cell--empty\" [attr.colspan]=\"columns().length || 1\">\n                {{ emptyMessage() }}\n              </td>\n            </tr>\n          } @else {\n            @for (row of sortedData(); track $index) {\n              <tr class=\"pe-table__row\">\n                @for (col of columns(); track col.id) {\n                  <td class=\"pe-table__cell\">{{ getCellValue(row, col.id) }}</td>\n                }\n              </tr>\n            }\n          }\n        </tbody>\n      </table>\n    </pe-skeleton>\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-table{box-sizing:border-box;display:flex;flex-direction:column;gap:12px;width:100%}.pe-table__toolbar{flex-shrink:0;max-width:100%}.pe-table__scroll{overflow-x:auto;overflow-y:hidden;width:100%;-webkit-overflow-scrolling:touch}.pe-table__table{width:100%;min-width:100%;border-collapse:collapse;border-spacing:0;border:1px solid rgba(255,255,255,.1);font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#fff}.pe-table__head{position:sticky;top:0;z-index:1;background-color:transparent}.pe-table__row{border-bottom:1px solid rgba(255,255,255,.1)}.pe-table__row--head{border-bottom:2px solid rgba(255,255,255,.1)}.pe-table__row--empty{border-bottom:none}.pe-table__th{padding:8px 12px;text-align:left;font-weight:600;white-space:nowrap}.pe-table__th--sortable .pe-table__th-button{display:inline-flex;align-items:center;gap:4px;width:100%;min-width:0;padding:0;border:none;background:none;cursor:pointer;color:inherit;font:inherit;text-align:left;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;font-weight:600}.pe-table__th--sortable .pe-table__th-button:hover{color:#ffffffb3}.pe-table__th--sortable .pe-table__th-button:focus-visible{outline:2px solid rgba(255,255,255,.3);outline-offset:2px}.pe-table__th--sort-asc,.pe-table__th--sort-desc{color:#c2a8ff}.pe-table__th-label{overflow:hidden;text-overflow:ellipsis}.pe-table__body{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#fff}.pe-table__cell{padding:8px 12px;vertical-align:middle}.pe-table__cell--empty{padding:24px;text-align:center;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}@media(max-width:1023px){.pe-table__scroll{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}.pe-table__table{min-width:max-content}}@media(min-width:1024px){.pe-table__scroll{margin-left:0;margin-right:0;padding-left:0;padding-right:0}}\n"], dependencies: [{ kind: "component", type: InputComponent, selector: "pe-input", inputs: ["type", "size", "appearance", "error", "disabled", "readOnly", "required", "placeholder", "label", "helperText", "errorText", "maxLength", "minLength", "pattern", "autocomplete", "controlId", "invalid", "errors", "touched", "value"], outputs: ["touchedChange", "valueChange", "inputBlur", "inputFocus"] }, { kind: "component", type: IconComponent, selector: "pe-icon", inputs: ["size", "weight", "icon"] }, { kind: "component", type: SkeletonComponent, selector: "pe-skeleton", inputs: ["variant", "width", "height", "lines", "borderRadius", "show"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-table', standalone: true, imports: [InputComponent, IconComponent, SkeletonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-table\"\n  [class.pe-table--sortable]=\"hasSortableColumn()\"\n  [class.pe-table--filterable]=\"showGlobalFilter()\"\n>\n  @if (showGlobalFilter()) {\n    <div class=\"pe-table__toolbar\">\n      <pe-input\n        [controlId]=\"filterId\"\n        [label]=\"filterLabel()\"\n        [placeholder]=\"filterPlaceholder()\"\n        [value]=\"filterQuery()\"\n        (valueChange)=\"onFilterInput($event)\"\n        size=\"sm\"\n      >\n        <ng-container pe-input-left-elements>\n          <pe-icon size=\"5\" icon=\"search\" />\n        </ng-container>\n      </pe-input>\n    </div>\n  }\n\n  <div class=\"pe-table__scroll pe-scrollable\">\n    <pe-skeleton [show]=\"loading()\" variant=\"rect\">\n      <table class=\"pe-table__table\">\n        <thead class=\"pe-table__head\">\n          <tr class=\"pe-table__row pe-table__row--head\">\n            @for (col of columns(); track col.id) {\n              <th\n                class=\"pe-table__th\"\n                [class.pe-table__th--sortable]=\"col.sortable\"\n                [class.pe-table__th--sort-asc]=\"sortColumn() === col.id && sortDirection() === 'asc'\"\n                [class.pe-table__th--sort-desc]=\"sortColumn() === col.id && sortDirection() === 'desc'\"\n                [attr.scope]=\"'col'\"\n                [attr.aria-sort]=\"col.sortable ? getSortAriaSort(col.id) : null\"\n              >\n                @if (col.sortable) {\n                  <button\n                    type=\"button\"\n                    class=\"pe-table__th-button\"\n                    [attr.aria-label]=\"'Sort by ' + col.label\"\n                    (click)=\"toggleSort(col.id)\"\n                  >\n                    <span class=\"pe-table__th-label\">{{ col.label }}</span>\n                    @if (sortColumn() === col.id && sortDirection() === 'asc') {\n                      <pe-icon size=\"5\" icon=\"arrow_up\" />\n                    } @else if (sortColumn() === col.id && sortDirection() === 'desc') {\n                      <pe-icon size=\"5\" icon=\"arrow_down\" />\n                    } @else {\n                      <pe-icon size=\"5\" icon=\"sort\" />\n                    }\n                  </button>\n                } @else {\n                  <span class=\"pe-table__th-label\">{{ col.label }}</span>\n                }\n              </th>\n            }\n          </tr>\n        </thead>\n        <tbody class=\"pe-table__body\">\n          @if (sortedData().length === 0) {\n            <tr class=\"pe-table__row pe-table__row--empty\">\n              <td class=\"pe-table__cell pe-table__cell--empty\" [attr.colspan]=\"columns().length || 1\">\n                {{ emptyMessage() }}\n              </td>\n            </tr>\n          } @else {\n            @for (row of sortedData(); track $index) {\n              <tr class=\"pe-table__row\">\n                @for (col of columns(); track col.id) {\n                  <td class=\"pe-table__cell\">{{ getCellValue(row, col.id) }}</td>\n                }\n              </tr>\n            }\n          }\n        </tbody>\n      </table>\n    </pe-skeleton>\n  </div>\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-table{box-sizing:border-box;display:flex;flex-direction:column;gap:12px;width:100%}.pe-table__toolbar{flex-shrink:0;max-width:100%}.pe-table__scroll{overflow-x:auto;overflow-y:hidden;width:100%;-webkit-overflow-scrolling:touch}.pe-table__table{width:100%;min-width:100%;border-collapse:collapse;border-spacing:0;border:1px solid rgba(255,255,255,.1);font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#fff}.pe-table__head{position:sticky;top:0;z-index:1;background-color:transparent}.pe-table__row{border-bottom:1px solid rgba(255,255,255,.1)}.pe-table__row--head{border-bottom:2px solid rgba(255,255,255,.1)}.pe-table__row--empty{border-bottom:none}.pe-table__th{padding:8px 12px;text-align:left;font-weight:600;white-space:nowrap}.pe-table__th--sortable .pe-table__th-button{display:inline-flex;align-items:center;gap:4px;width:100%;min-width:0;padding:0;border:none;background:none;cursor:pointer;color:inherit;font:inherit;text-align:left;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;font-weight:600}.pe-table__th--sortable .pe-table__th-button:hover{color:#ffffffb3}.pe-table__th--sortable .pe-table__th-button:focus-visible{outline:2px solid rgba(255,255,255,.3);outline-offset:2px}.pe-table__th--sort-asc,.pe-table__th--sort-desc{color:#c2a8ff}.pe-table__th-label{overflow:hidden;text-overflow:ellipsis}.pe-table__body{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400;color:#fff}.pe-table__cell{padding:8px 12px;vertical-align:middle}.pe-table__cell--empty{padding:24px;text-align:center;color:#ffffffb3;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}@media(max-width:1023px){.pe-table__scroll{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}.pe-table__table{min-width:max-content}}@media(min-width:1024px){.pe-table__scroll{margin-left:0;margin-right:0;padding-left:0;padding-right:0}}\n"] }]
+        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], sortColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortColumn", required: false }] }, { type: i0.Output, args: ["sortColumnChange"] }], sortDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDirection", required: false }] }, { type: i0.Output, args: ["sortDirectionChange"] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], filterLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterLabel", required: false }] }], showGlobalFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGlobalFilter", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], sortColumnChange: [{ type: i0.Output, args: ["sortColumnChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }] } });
+
+/**
+ * When projected into pe-textarea, replaces the native textarea with custom content (e.g. Quill).
+ * Use with [pe-textarea-field] on the element to project.
+ */
+class TextareaFieldDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TextareaFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.2", type: TextareaFieldDirective, isStandalone: true, selector: "[pe-textarea-field]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TextareaFieldDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pe-textarea-field]',
+                    standalone: true,
+                }]
+        }] });
+
+/**
+ * Reusable textarea. Implements FormValueControl for Signal Forms [formField].
+ * Use [(value)] for two-way binding or [formField]="myForm().message".
+ *
+ * Content projection: [pe-textarea-field] (replaces native textarea), [pe-textarea-left-elements], [pe-textarea-right-elements].
+ */
+class TextareaComponent {
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    error = input(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+    helperText = input(null, ...(ngDevMode ? [{ debugName: "helperText" }] : []));
+    errorText = input(null, ...(ngDevMode ? [{ debugName: "errorText" }] : []));
+    maxLength = input(...(ngDevMode ? [undefined, { debugName: "maxLength" }] : []));
+    minLength = input(...(ngDevMode ? [undefined, { debugName: "minLength" }] : []));
+    autocomplete = input('off', ...(ngDevMode ? [{ debugName: "autocomplete" }] : []));
+    rows = input(3, ...(ngDevMode ? [{ debugName: "rows" }] : []));
+    resize = input('vertical', ...(ngDevMode ? [{ debugName: "resize" }] : []));
+    /** When using [pe-textarea-field], pass focus state so the group border reflects it. */
+    groupFocused = input(null, ...(ngDevMode ? [{ debugName: "groupFocused" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    errors = input([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    value = model('', ...(ngDevMode ? [{ debugName: "value" }] : []));
+    customField = contentChild(TextareaFieldDirective, ...(ngDevMode ? [{ debugName: "customField" }] : []));
+    ids = createFormFieldIds('pe-textarea');
+    isFocused = signal(false, ...(ngDevMode ? [{ debugName: "isFocused" }] : []));
+    isDirty = signal(false, ...(ngDevMode ? [{ debugName: "isDirty" }] : []));
+    groupFocusedState = computed(() => this.groupFocused() ?? this.isFocused(), ...(ngDevMode ? [{ debugName: "groupFocusedState" }] : []));
+    hasError = computed(() => this.error() || this.invalid(), ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    describedBy = computed(() => getFormFieldDescribedBy(this.ids.helperId, this.ids.errorId, !!this.helperText(), this.hasError(), !!this.errorText() || this.errors().length > 0), ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
+    inputBlur = output();
+    inputFocus = output();
+    valueChange = output();
+    constructor() {
+        effect(() => {
+            const currentValue = this.value();
+            if (this.isDirty()) {
+                this.valueChange.emit(currentValue);
+            }
+        });
+    }
+    onInput(event) {
+        const value = event.target.value;
+        this.isDirty.set(true);
+        this.value.set(value);
+    }
+    onBlur(event) {
+        this.isFocused.set(false);
+        this.touched.set(true);
+        this.inputBlur.emit(event);
+    }
+    onFocus(event) {
+        this.isFocused.set(true);
+        this.inputFocus.emit(event);
+    }
+    focus() {
+        if (this.customField())
+            return;
+        const el = document.getElementById(this.ids.controlId);
+        el?.focus();
+    }
+    select() {
+        const el = document.getElementById(this.ids.controlId);
+        el?.select();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: TextareaComponent, isStandalone: true, selector: "pe-textarea", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, groupFocused: { classPropertyName: "groupFocused", publicName: "groupFocused", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touched: "touchedChange", value: "valueChange", inputBlur: "inputBlur", inputFocus: "inputFocus", valueChange: "valueChange" }, queries: [{ propertyName: "customField", first: true, predicate: TextareaFieldDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"pe-textarea pe-textarea--{{ size() }}\"\n  [class.pe-textarea--error]=\"hasError()\"\n  [class.pe-textarea--disabled]=\"disabled()\"\n  [class.pe-textarea--read-only]=\"readOnly()\"\n  [class.pe-textarea--required]=\"required()\"\n  [class.pe-textarea--resize-none]=\"resize() === 'none'\"\n  [class.pe-textarea--resize-vertical]=\"resize() === 'vertical'\"\n  [class.pe-textarea--resize-horizontal]=\"resize() === 'horizontal'\"\n  [class.pe-textarea--resize-both]=\"resize() === 'both'\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-textarea__group\"\n    [class.pe-textarea__group--focused]=\"groupFocusedState()\"\n    [style.--pe-textarea-rows]=\"rows()\"\n  >\n    <div class=\"pe-textarea__left-elements\">\n      <ng-content select=\"[pe-textarea-left-elements]\" />\n    </div>\n\n    <ng-content select=\"[pe-textarea-field]\" />\n    @if (!customField()) {\n      <textarea\n        [id]=\"ids.controlId\"\n        class=\"pe-textarea__field\"\n        [placeholder]=\"placeholder()\"\n        [value]=\"value()\"\n        (input)=\"onInput($event)\"\n        (blur)=\"onBlur($event)\"\n        (focus)=\"onFocus($event)\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readOnly()\"\n        [required]=\"required()\"\n        [attr.maxlength]=\"maxLength()\"\n        [attr.minlength]=\"minLength()\"\n        [attr.autocomplete]=\"autocomplete()\"\n        [attr.rows]=\"rows()\"\n        [attr.aria-invalid]=\"hasError()\"\n        [attr.aria-required]=\"required()\"\n        [attr.aria-describedby]=\"describedBy()\"\n      ></textarea>\n    }\n\n    <div class=\"pe-textarea__right-elements\">\n      <ng-content select=\"[pe-textarea-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"(errorText() || (hasError() && errors().length ? errors()[0].message : null)) ?? null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-textarea{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-textarea__group{display:flex;align-items:stretch;padding:12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-textarea__group--focused{border-color:#ffffff80}.pe-textarea:not(.pe-textarea--disabled) .pe-textarea__group:hover{border-color:#ffffff4d}.pe-textarea__field{all:unset;flex:1;min-height:0;resize:vertical}.pe-textarea__field::placeholder{color:#ffffff80}.pe-textarea__field:hover::placeholder{color:#fff}.pe-textarea__field--custom{display:flex;flex-direction:column;min-height:0}.pe-textarea__left-elements,.pe-textarea__right-elements{display:flex;gap:8px;align-items:flex-start;padding-top:8px}.pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-textarea--sm .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 20px + 2 * 8px);padding:8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-textarea--sm .pe-textarea__left-elements,.pe-textarea--sm .pe-textarea__right-elements{gap:4px;padding-top:4px}.pe-textarea--sm .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--sm .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-textarea--md .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 24px + 2 * 12px);padding:12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-textarea--md .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--md .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-textarea--lg .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 28px + 2 * 12px);padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-textarea--lg .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--lg .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-textarea--xl .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 36px + 2 * 16px);padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-textarea--xl .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--xl .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-textarea--resize-none .pe-textarea__field{resize:none}.pe-textarea--resize-vertical .pe-textarea__field{resize:vertical}.pe-textarea--resize-horizontal .pe-textarea__field{resize:horizontal}.pe-textarea--resize-both .pe-textarea__field{resize:both}.pe-textarea--error .pe-textarea__group{border:2px solid #f69d9d}.pe-textarea--disabled .pe-textarea__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-textarea--disabled .pe-textarea__field,.pe-textarea--disabled .pe-textarea__field:disabled::placeholder{color:#ffffff4d}.pe-textarea--read-only .pe-textarea__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-textarea--read-only .pe-textarea__field,.pe-textarea--read-only .pe-textarea__field:read-only::placeholder{color:#ffffffb3}\n"], dependencies: [{ kind: "component", type: FormFieldLabelComponent, selector: "pe-form-field-label", inputs: ["label", "required", "for", "size"] }, { kind: "component", type: FormFieldHelperComponent, selector: "pe-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TextareaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pe-textarea', standalone: true, imports: [FormFieldLabelComponent, FormFieldHelperComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"pe-textarea pe-textarea--{{ size() }}\"\n  [class.pe-textarea--error]=\"hasError()\"\n  [class.pe-textarea--disabled]=\"disabled()\"\n  [class.pe-textarea--read-only]=\"readOnly()\"\n  [class.pe-textarea--required]=\"required()\"\n  [class.pe-textarea--resize-none]=\"resize() === 'none'\"\n  [class.pe-textarea--resize-vertical]=\"resize() === 'vertical'\"\n  [class.pe-textarea--resize-horizontal]=\"resize() === 'horizontal'\"\n  [class.pe-textarea--resize-both]=\"resize() === 'both'\"\n  [attr.aria-invalid]=\"hasError()\"\n  [attr.aria-required]=\"required()\"\n  [attr.aria-describedby]=\"describedBy()\"\n>\n  <pe-form-field-label\n    [label]=\"label()\"\n    [required]=\"required()\"\n    [for]=\"ids.controlId\"\n    [size]=\"size()\"\n  />\n\n  <div\n    class=\"pe-textarea__group\"\n    [class.pe-textarea__group--focused]=\"groupFocusedState()\"\n    [style.--pe-textarea-rows]=\"rows()\"\n  >\n    <div class=\"pe-textarea__left-elements\">\n      <ng-content select=\"[pe-textarea-left-elements]\" />\n    </div>\n\n    <ng-content select=\"[pe-textarea-field]\" />\n    @if (!customField()) {\n      <textarea\n        [id]=\"ids.controlId\"\n        class=\"pe-textarea__field\"\n        [placeholder]=\"placeholder()\"\n        [value]=\"value()\"\n        (input)=\"onInput($event)\"\n        (blur)=\"onBlur($event)\"\n        (focus)=\"onFocus($event)\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readOnly()\"\n        [required]=\"required()\"\n        [attr.maxlength]=\"maxLength()\"\n        [attr.minlength]=\"minLength()\"\n        [attr.autocomplete]=\"autocomplete()\"\n        [attr.rows]=\"rows()\"\n        [attr.aria-invalid]=\"hasError()\"\n        [attr.aria-required]=\"required()\"\n        [attr.aria-describedby]=\"describedBy()\"\n      ></textarea>\n    }\n\n    <div class=\"pe-textarea__right-elements\">\n      <ng-content select=\"[pe-textarea-right-elements]\" />\n    </div>\n  </div>\n\n  <pe-form-field-helper\n    [id]=\"ids.helperId\"\n    [helperText]=\"helperText()\"\n    [errorText]=\"(errorText() || (hasError() && errors().length ? errors()[0].message : null)) ?? null\"\n    [error]=\"hasError()\"\n  />\n</div>\n", styles: [".pe-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.pe-rich-text p,.pe-rich-text ul,.pe-rich-text ol,.pe-rich-text blockquote,.pe-rich-text pre{margin-top:0;margin-bottom:16px}.pe-rich-text:last-child,.pe-rich-text p:last-child,.pe-rich-text ul:last-child,.pe-rich-text ol:last-child,.pe-rich-text blockquote:last-child,.pe-rich-text pre:last-child{margin-bottom:0}.pe-rich-text h1,.pe-rich-text h2,.pe-rich-text h3,.pe-rich-text h4,.pe-rich-text h5,.pe-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.pe-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.pe-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.pe-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.pe-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.pe-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.pe-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.pe-rich-text ul,.pe-rich-text ol{padding-left:24px}.pe-rich-text ul ul,.pe-rich-text ul ol,.pe-rich-text ol ul,.pe-rich-text ol ol{margin-top:8px;margin-bottom:8px}.pe-rich-text li{margin-top:4px;margin-bottom:4px}.pe-rich-text strong{font-weight:800}.pe-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text em{font-style:italic}.pe-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.pe-rich-text a:hover{color:#d6c5ff}.pe-rich-text a:active{color:#a781ff}.pe-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.pe-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.pe-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.pe-rich-text--muted{color:#ffffffb3}.pe-rich-text--inverse,.pe-rich-text--inverse a{color:#000}.pe-rich-text--inverse a:hover,.pe-rich-text--inverse a:active{color:#000000b3}.pe-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-rich-text--compact p,.pe-rich-text--compact ul,.pe-rich-text--compact ol,.pe-rich-text--compact blockquote,.pe-rich-text--compact pre{margin-bottom:8px}.pe-rich-text--compact h1,.pe-rich-text--compact h2,.pe-rich-text--compact h3,.pe-rich-text--compact h4,.pe-rich-text--compact h5,.pe-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.pe-textarea{box-sizing:border-box;display:flex;flex-direction:column;gap:4px}.pe-textarea__group{display:flex;align-items:stretch;padding:12px;gap:8px;border-radius:8px;border:2px solid rgba(255,255,255,.1);background-color:transparent;color:#fff;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.pe-textarea__group--focused{border-color:#ffffff80}.pe-textarea:not(.pe-textarea--disabled) .pe-textarea__group:hover{border-color:#ffffff4d}.pe-textarea__field{all:unset;flex:1;min-height:0;resize:vertical}.pe-textarea__field::placeholder{color:#ffffff80}.pe-textarea__field:hover::placeholder{color:#fff}.pe-textarea__field--custom{display:flex;flex-direction:column;min-height:0}.pe-textarea__left-elements,.pe-textarea__right-elements{display:flex;gap:8px;align-items:flex-start;padding-top:8px}.pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-textarea--sm .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 20px + 2 * 8px);padding:8px;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.pe-textarea--sm .pe-textarea__left-elements,.pe-textarea--sm .pe-textarea__right-elements{gap:4px;padding-top:4px}.pe-textarea--sm .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--sm .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:20px;line-height:20px}.pe-textarea--md .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 24px + 2 * 12px);padding:12px;font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.pe-textarea--md .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--md .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:24px;line-height:24px}.pe-textarea--lg .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 28px + 2 * 12px);padding:8px 12px;font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400}.pe-textarea--lg .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--lg .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:28px;line-height:28px}.pe-textarea--xl .pe-textarea__group{min-height:calc(var(--pe-textarea-rows, 3) * 36px + 2 * 16px);padding:8px 16px;font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:400}.pe-textarea--xl .pe-textarea__left-elements ::ng-deep .pe-icon,.pe-textarea--xl .pe-textarea__right-elements ::ng-deep .pe-icon{font-size:32px;line-height:32px}.pe-textarea--resize-none .pe-textarea__field{resize:none}.pe-textarea--resize-vertical .pe-textarea__field{resize:vertical}.pe-textarea--resize-horizontal .pe-textarea__field{resize:horizontal}.pe-textarea--resize-both .pe-textarea__field{resize:both}.pe-textarea--error .pe-textarea__group{border:2px solid #f69d9d}.pe-textarea--disabled .pe-textarea__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-textarea--disabled .pe-textarea__field,.pe-textarea--disabled .pe-textarea__field:disabled::placeholder{color:#ffffff4d}.pe-textarea--read-only .pe-textarea__group{border:2px solid rgba(255,255,255,.1);background-color:transparent}.pe-textarea--read-only .pe-textarea__field,.pe-textarea--read-only .pe-textarea__field:read-only::placeholder{color:#ffffffb3}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helperText: [{ type: i0.Input, args: [{ isSignal: true, alias: "helperText", required: false }] }], errorText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorText", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], minLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minLength", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], groupFocused: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupFocused", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], customField: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TextareaFieldDirective), { isSignal: true }] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+/*
+ * Public API Surface of ui
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AccordionComponent, AccordionItemComponent, AreaCodeComponent, AvatarComponent, AvatarGroupComponent, BreadcrumbComponent, ButtonComponent, CalendarComponent, CardComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, CollapseComponent, CustomCurrencyPipe, DropdownComponent, FileInputComponent, FooterComponent, FormFieldHelperComponent, FormFieldLabelComponent, HeroComponent, IconComponent, ImageNotFoundDirective, InputComponent, ListItemComponent, ModalComponent, NavbarAvatarSlotDirective, NavbarComponent, NavbarLogoSlotDirective, NavbarSearchSlotDirective, PeHeroActionsSlotDirective, PeHeroBadgesSlotDirective, PeHeroContentSlotDirective, PeHeroSubtitleSlotDirective, PeHeroTitleSlotDirective, PillComponent, PriceButtonComponent, RadialComponent, RadioComponent, RadioGroupComponent, RichTextComponent, SearchSelectComponent, SelectComponent, SidebarComponent, SkeletonComponent, StatusComponent, TableComponent, TextareaComponent, TextareaFieldDirective, ToastContainerComponent, TooltipComponent, createFormFieldIds, getFormFieldDescribedBy };
+//# sourceMappingURL=underlayerdev-ui.mjs.map