@atelier-ui/angular 0.2.26 → 0.2.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -76,15 +76,15 @@ class AtlButton {
|
|
|
76
76
|
});
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
80
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
79
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
80
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlButton, isStandalone: true, selector: "atl-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", 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 }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "button" }, properties: { "class": "hostClasses()", "attr.aria-disabled": "isDisabled()", "attr.disabled": "isDisabled() ? true : null" } }, ngImport: i0, template: `
|
|
81
81
|
@if (loading()) {
|
|
82
82
|
<span class="spinner" aria-hidden="true"></span>
|
|
83
83
|
}
|
|
84
84
|
<ng-content />
|
|
85
85
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-spacing-2);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-family:var(--ui-font-family);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);line-height:var(--ui-line-height-tight);letter-spacing:var(--ui-letter-spacing-tight);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),color var(--ui-transition-fast),box-shadow var(--ui-transition-fast);white-space:nowrap;text-decoration:none;-webkit-user-select:none;user-select:none}:host(:focus-visible){outline:none;box-shadow:var(--ui-focus-ring)}:host(.variant-primary){background-color:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(.variant-primary:hover:not(.is-disabled)){background-color:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(.variant-primary:active:not(.is-disabled)){background-color:var(--ui-color-primary-active);border-color:var(--ui-color-primary-active)}:host(.variant-secondary){background-color:var(--ui-color-secondary);color:var(--ui-color-text-on-secondary);border-color:var(--ui-color-secondary)}:host(.variant-secondary:hover:not(.is-disabled)){background-color:var(--ui-color-secondary-hover);border-color:var(--ui-color-secondary-hover)}:host(.variant-secondary:active:not(.is-disabled)){background-color:var(--ui-color-secondary-active);border-color:var(--ui-color-secondary-active)}:host(.variant-outline){background-color:var(--ui-color-surface-raised);color:var(--ui-color-primary);border-color:var(--ui-color-border-strong)}:host(.variant-outline:hover:not(.is-disabled)){background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-primary)}:host(.variant-outline:active:not(.is-disabled)){background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-primary-active)}:host(.variant-danger){background-color:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger);box-shadow:inset 0 0 0 1px #0000002e}:host(.variant-danger:hover:not(.is-disabled)){background-color:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover);box-shadow:inset 0 0 0 1px #0000002e}:host(.variant-danger:active:not(.is-disabled)){background-color:var(--ui-color-danger-active);border-color:var(--ui-color-danger-active);box-shadow:inset 0 0 0 1px #0000002e}:host(.size-sm){padding:calc((var(--ui-control-height-sm) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2 - 1px) .875rem;font-size:var(--ui-font-size-sm);min-height:var(--ui-control-height-sm)}:host(.size-md){padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - 1px) 1.125rem;font-size:var(--ui-font-size-md);min-height:var(--ui-control-height-md)}:host(.size-lg){padding:calc((var(--ui-control-height-lg) - var(--ui-line-height-tight) * var(--ui-font-size-lg)) / 2 - 1px) 1.5rem;font-size:var(--ui-font-size-lg);min-height:var(--ui-control-height-lg)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed;pointer-events:none}.spinner{display:inline-block;width:1em;height:1em;border:var(--ui-border-width-thick) solid currentColor;border-top-color:transparent;border-radius:var(--ui-radius-full);animation:atl-spin .7s linear infinite;flex-shrink:0}@keyframes atl-spin{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
86
86
|
}
|
|
87
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
87
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlButton, decorators: [{
|
|
88
88
|
type: Component,
|
|
89
89
|
args: [{ selector: 'atl-button', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
90
90
|
@if (loading()) {
|
|
@@ -136,10 +136,10 @@ class AtlCard {
|
|
|
136
136
|
...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
|
|
137
137
|
hostClasses = computed(() => `atl-card variant-${this.variant()} padding-${this.padding()}`, /* @ts-ignore */
|
|
138
138
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
139
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
140
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
139
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlCard, isStandalone: true, selector: "atl-card", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.role": "role() || null" } }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
141
141
|
}
|
|
142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCard, decorators: [{
|
|
143
143
|
type: Component,
|
|
144
144
|
args: [{ selector: 'atl-card', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: {
|
|
145
145
|
'[class]': 'hostClasses()',
|
|
@@ -155,10 +155,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
155
155
|
* ```
|
|
156
156
|
*/
|
|
157
157
|
class AtlCardHeader {
|
|
158
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
159
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
158
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
159
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlCardHeader, isStandalone: true, selector: "atl-card-header", host: { classAttribute: "atl-card-header" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
160
160
|
}
|
|
161
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
161
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardHeader, decorators: [{
|
|
162
162
|
type: Component,
|
|
163
163
|
args: [{ selector: 'atl-card-header', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-card-header' }, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"] }]
|
|
164
164
|
}] });
|
|
@@ -171,10 +171,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
171
171
|
* ```
|
|
172
172
|
*/
|
|
173
173
|
class AtlCardContent {
|
|
174
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
175
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
174
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
175
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlCardContent, isStandalone: true, selector: "atl-card-content", host: { classAttribute: "atl-card-content" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
176
176
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
177
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardContent, decorators: [{
|
|
178
178
|
type: Component,
|
|
179
179
|
args: [{ selector: 'atl-card-content', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-card-content' }, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"] }]
|
|
180
180
|
}] });
|
|
@@ -189,10 +189,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
189
189
|
* ```
|
|
190
190
|
*/
|
|
191
191
|
class AtlCardFooter {
|
|
192
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
193
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
192
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
193
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlCardFooter, isStandalone: true, selector: "atl-card-footer", host: { classAttribute: "atl-card-footer" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
194
194
|
}
|
|
195
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
195
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCardFooter, decorators: [{
|
|
196
196
|
type: Component,
|
|
197
197
|
args: [{ selector: 'atl-card-footer', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-card-footer' }, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-card){display:block;border-radius:var(--ui-radius-xl);background-color:var(--ui-color-surface-raised);overflow:hidden}:host(.atl-card.variant-elevated){box-shadow:var(--ui-shadow-sm);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-card.variant-outlined){border:var(--ui-border-width) solid var(--ui-color-border);background-color:var(--ui-color-surface-raised)}:host(.atl-card.variant-flat){background-color:var(--ui-color-surface-sunken)}:host(.atl-card-header):host-context(.padding-none),:host(.atl-card-content):host-context(.padding-none),:host(.atl-card-footer):host-context(.padding-none){padding:0}:host(.atl-card-header):host-context(.padding-sm),:host(.atl-card-content):host-context(.padding-sm),:host(.atl-card-footer):host-context(.padding-sm){padding:var(--ui-spacing-4)}:host(.atl-card-header):host-context(.padding-md),:host(.atl-card-content):host-context(.padding-md),:host(.atl-card-footer):host-context(.padding-md){padding:var(--ui-spacing-6)}:host(.atl-card-header):host-context(.padding-lg),:host(.atl-card-content):host-context(.padding-lg),:host(.atl-card-footer):host-context(.padding-lg){padding:var(--ui-spacing-8)}:host(.atl-card-header){display:block;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);border-bottom:var(--ui-border-width) solid var(--ui-color-border);letter-spacing:var(--ui-letter-spacing-tight)}:host(.atl-card-content){display:block;color:var(--ui-color-text);line-height:var(--ui-line-height-normal)}:host(.atl-card-footer){display:flex;align-items:center;gap:var(--ui-spacing-3);border-top:var(--ui-border-width) solid var(--ui-color-border)}\n"] }]
|
|
198
198
|
}] });
|
|
@@ -278,8 +278,8 @@ class AtlIcon {
|
|
|
278
278
|
...(ngDevMode ? [{ debugName: "isStroke" }] : /* istanbul ignore next */ []));
|
|
279
279
|
hostClasses = computed(() => `size-${this.size()}`, /* @ts-ignore */
|
|
280
280
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
281
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
282
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
281
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
282
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlIcon, isStandalone: true, selector: "atl-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.role": "label() ? \"img\" : null", "attr.aria-label": "label() || null", "attr.aria-hidden": "label() ? null : \"true\"" } }, ngImport: i0, template: `
|
|
283
283
|
<svg
|
|
284
284
|
[attr.viewBox]="viewBox"
|
|
285
285
|
[attr.fill]="isStroke() ? 'none' : 'currentColor'"
|
|
@@ -296,7 +296,7 @@ class AtlIcon {
|
|
|
296
296
|
</svg>
|
|
297
297
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;justify-content:center;font-family:var(--ui-font-family);font-weight:var(--ui-font-weight-medium);line-height:1;color:currentColor;-webkit-user-select:none;user-select:none;flex-shrink:0}:host(.size-sm){width:1rem;height:1rem;font-size:var(--ui-font-size-sm)}:host(.size-md){width:1.25rem;height:1.25rem;font-size:var(--ui-font-size-md)}:host(.size-lg){width:1.5rem;height:1.5rem;font-size:var(--ui-font-size-lg)}:host svg{width:100%;height:100%;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
298
298
|
}
|
|
299
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
299
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlIcon, decorators: [{
|
|
300
300
|
type: Component,
|
|
301
301
|
args: [{ selector: 'atl-icon', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
302
302
|
<svg
|
|
@@ -351,15 +351,15 @@ class AtlBadge {
|
|
|
351
351
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
352
352
|
variantIcon = computed(() => VARIANT_ICON_NAMES$1[this.variant()], /* @ts-ignore */
|
|
353
353
|
...(ngDevMode ? [{ debugName: "variantIcon" }] : /* istanbul ignore next */ []));
|
|
354
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
355
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
354
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
355
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlBadge, isStandalone: true, selector: "atl-badge", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status" }, properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
356
356
|
@if (variantIcon(); as icon) {
|
|
357
357
|
<atl-icon class="variant-icon" [name]="icon" size="sm" />
|
|
358
358
|
}
|
|
359
359
|
<ng-content />
|
|
360
360
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ui-radius-full);font-family:var(--ui-font-family);font-weight:var(--ui-font-weight-semibold);line-height:var(--ui-line-height-tight);white-space:nowrap;letter-spacing:var(--ui-letter-spacing-wide)}:host(.size-sm){padding:.1875rem var(--ui-spacing-2);font-size:var(--ui-font-size-xs)}:host(.size-md){padding:.3125rem var(--ui-spacing-3);font-size:var(--ui-font-size-sm)}:host(.variant-default){background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text-muted);border:var(--ui-border-width) solid var(--ui-color-border)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border:var(--ui-border-width) solid color-mix(in srgb,var(--ui-color-success-text) 25%,transparent)}:host(.variant-warning){background-color:var(--ui-color-warning-bg);color:var(--ui-color-warning-text);border:var(--ui-border-width) solid color-mix(in srgb,var(--ui-color-warning-text) 25%,transparent)}:host(.variant-danger){background-color:var(--ui-color-danger-bg);color:var(--ui-color-danger-text);border:var(--ui-border-width) solid color-mix(in srgb,var(--ui-color-danger-text) 25%,transparent)}:host(.variant-info){background-color:var(--ui-color-info-bg);color:var(--ui-color-info-text);border:var(--ui-border-width) solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}.variant-icon{font-weight:var(--ui-font-weight-bold);margin-right:.3em;line-height:1}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
361
361
|
}
|
|
362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
362
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBadge, decorators: [{
|
|
363
363
|
type: Component,
|
|
364
364
|
args: [{ selector: 'atl-badge', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
365
365
|
@if (variantIcon(); as icon) {
|
|
@@ -380,6 +380,7 @@ let nextId$d = 0;
|
|
|
380
380
|
* ```html
|
|
381
381
|
* <atl-input type="email" placeholder="you@example.com" [(value)]="email" />
|
|
382
382
|
* <atl-input [formField]="loginForm.email" placeholder="Email" />
|
|
383
|
+
* <atl-input label="Email" type="email" [(value)]="email" />
|
|
383
384
|
* ```
|
|
384
385
|
*/
|
|
385
386
|
class AtlInput {
|
|
@@ -389,9 +390,32 @@ class AtlInput {
|
|
|
389
390
|
/** The type of input field. */
|
|
390
391
|
type = input('text', /* @ts-ignore */
|
|
391
392
|
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
393
|
+
/**
|
|
394
|
+
* Visible caption rendered as a `<label>` associated with the input via
|
|
395
|
+
* `for`/`id`. Omit it when the field is captioned some other way (an
|
|
396
|
+
* external `<label>`, or `aria-label`) — without one of these the input
|
|
397
|
+
* has no accessible name.
|
|
398
|
+
*/
|
|
399
|
+
label = input('', /* @ts-ignore */
|
|
400
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
401
|
+
/**
|
|
402
|
+
* Accessible name for the native input, for when there is no visible
|
|
403
|
+
* `label`. An aliased input rather than a plain host attribute: an
|
|
404
|
+
* unrecognized `aria-label="…"` on `<atl-input>` would sit on the host
|
|
405
|
+
* element, which has no role, leaving the actual control unnamed.
|
|
406
|
+
*/
|
|
407
|
+
ariaLabel = input('', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
|
|
392
408
|
/** Placeholder text shown when the input is empty. */
|
|
393
409
|
placeholder = input('', /* @ts-ignore */
|
|
394
410
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
411
|
+
/**
|
|
412
|
+
* Explicit id for the native input. Wins over the auto-generated id — set
|
|
413
|
+
* this when something outside this component (an external `<label for>`,
|
|
414
|
+
* or `aria-describedby` from elsewhere on the page) needs a known, stable
|
|
415
|
+
* id to point at.
|
|
416
|
+
*/
|
|
417
|
+
id = input('', /* @ts-ignore */
|
|
418
|
+
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
395
419
|
/** Whether the input is disabled. Bound by [formField] directive. */
|
|
396
420
|
disabled = input(false, /* @ts-ignore */
|
|
397
421
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
@@ -415,6 +439,32 @@ class AtlInput {
|
|
|
415
439
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
416
440
|
/** @internal */
|
|
417
441
|
errorId = `atl-input-errors-${nextId$d++}`;
|
|
442
|
+
/**
|
|
443
|
+
* @internal
|
|
444
|
+
* Fallback id, used only when the caller does not supply one. A
|
|
445
|
+
* module-scoped counter — the idiom every other Angular form control in
|
|
446
|
+
* this lib already uses for its own ids (checkbox, radio, toggle, select,
|
|
447
|
+
* textarea all do the same `` `atl-<name>-${nextId++}` `` thing for
|
|
448
|
+
* errorId) — rather than reaching for a `useId()`-equivalent. Collision-free
|
|
449
|
+
* across every instance rendered within one running copy of this module
|
|
450
|
+
* (one browser tab, or one server-render pass), which is the guarantee this
|
|
451
|
+
* lib actually needs: none of these adapters are server-rendered today.
|
|
452
|
+
*
|
|
453
|
+
* This is NOT the guarantee React's/Vue's `useId()` gives. `nextId` is a
|
|
454
|
+
* plain module-level variable, not reset per request: a persistent Node SSR
|
|
455
|
+
* process keeps incrementing it across requests while a fresh client always
|
|
456
|
+
* starts at 0, so server and client render would diverge the moment this
|
|
457
|
+
* component is server-rendered — the exact hydration mismatch this file
|
|
458
|
+
* used to (wrongly) claim the counter avoided. Two independently bundled
|
|
459
|
+
* copies of this module (e.g. two versions loaded by separate
|
|
460
|
+
* micro-frontends on one page) would likewise each start their own `nextId`
|
|
461
|
+
* at 0 and could collide. Neither risk is exercised today; revisit this if
|
|
462
|
+
* SSR or module-duplication ever applies here.
|
|
463
|
+
*/
|
|
464
|
+
generatedId = `atl-input-${nextId$d++}`;
|
|
465
|
+
/** @internal */
|
|
466
|
+
inputId = computed(() => this.id() || (this.label() ? this.generatedId : ''), /* @ts-ignore */
|
|
467
|
+
...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
418
468
|
/** @internal */
|
|
419
469
|
/**
|
|
420
470
|
* The message renders when there is a message. Gating it on `touched` as well was
|
|
@@ -444,10 +494,14 @@ class AtlInput {
|
|
|
444
494
|
const target = event.target;
|
|
445
495
|
this.value.set(target.value);
|
|
446
496
|
}
|
|
447
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
448
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
497
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
498
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlInput, isStandalone: true, selector: "atl-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", 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 }, 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 }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { properties: { "class": "hostClasses()", "attr.id": "null", "attr.aria-label": "null" } }, ngImport: i0, template: `
|
|
499
|
+
@if (label()) {
|
|
500
|
+
<label [attr.for]="inputId()">{{ label() }}</label>
|
|
501
|
+
}
|
|
449
502
|
<div class="input-field">
|
|
450
503
|
<input
|
|
504
|
+
[attr.id]="inputId() || null"
|
|
451
505
|
[type]="type()"
|
|
452
506
|
[value]="value()"
|
|
453
507
|
(input)="onInput($event)"
|
|
@@ -456,6 +510,7 @@ class AtlInput {
|
|
|
456
510
|
[readOnly]="readonly()"
|
|
457
511
|
[placeholder]="placeholder()"
|
|
458
512
|
[attr.name]="name() || null"
|
|
513
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
459
514
|
[attr.aria-invalid]="invalid() || null"
|
|
460
515
|
[attr.aria-required]="required() || null"
|
|
461
516
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
@@ -473,11 +528,15 @@ class AtlInput {
|
|
|
473
528
|
}
|
|
474
529
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md)}input{display:block;width:100%;min-height:var(--ui-control-height-md);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) var(--ui-spacing-4);font-size:inherit;font-family:inherit;line-height:var(--ui-line-height-tight);color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast);outline:none;box-sizing:border-box}input::placeholder{color:var(--ui-color-placeholder)}input:hover:not(:disabled):not(:read-only){border-color:var(--ui-color-input-border-hover)}input:focus{border-color:var(--ui-color-input-border-focus);background-color:var(--ui-color-input-bg-focus);box-shadow:var(--ui-focus-ring)}.input-field{position:relative}:host(.is-invalid) input{border-color:var(--ui-color-input-border-invalid);padding-right:2.25rem}:host(.is-invalid) input:focus{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-invalid) .input-field .invalid-icon{position:absolute;top:50%;transform:translateY(-50%);right:.875rem;color:var(--ui-color-danger);pointer-events:none}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) input{cursor:not-allowed}:host(.is-readonly) input{background-color:var(--ui-color-surface-sunken);border-color:transparent;cursor:default}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
475
530
|
}
|
|
476
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
531
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlInput, decorators: [{
|
|
477
532
|
type: Component,
|
|
478
533
|
args: [{ selector: 'atl-input', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
534
|
+
@if (label()) {
|
|
535
|
+
<label [attr.for]="inputId()">{{ label() }}</label>
|
|
536
|
+
}
|
|
479
537
|
<div class="input-field">
|
|
480
538
|
<input
|
|
539
|
+
[attr.id]="inputId() || null"
|
|
481
540
|
[type]="type()"
|
|
482
541
|
[value]="value()"
|
|
483
542
|
(input)="onInput($event)"
|
|
@@ -486,6 +545,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
486
545
|
[readOnly]="readonly()"
|
|
487
546
|
[placeholder]="placeholder()"
|
|
488
547
|
[attr.name]="name() || null"
|
|
548
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
489
549
|
[attr.aria-invalid]="invalid() || null"
|
|
490
550
|
[attr.aria-required]="required() || null"
|
|
491
551
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
@@ -503,8 +563,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
503
563
|
}
|
|
504
564
|
`, host: {
|
|
505
565
|
'[class]': 'hostClasses()',
|
|
566
|
+
// A static `id="…"` attribute on `<atl-input>` matches the `id` input AND
|
|
567
|
+
// stays as a literal attribute on this host element (Angular keeps static
|
|
568
|
+
// attributes even when they also bind an input) — unlike `[id]="…"`
|
|
569
|
+
// property binding, which does not reflect. Left alone, that host `id`
|
|
570
|
+
// duplicates the one this component puts on the native `<input>`, and
|
|
571
|
+
// since the host is not labelable and comes first in document order,
|
|
572
|
+
// `<label for>` resolves to nothing (`input.labels.length === 0`). Force
|
|
573
|
+
// the host's own `id` attribute to always be absent so `id` unambiguously
|
|
574
|
+
// means "the native input's id", the one place a caller-supplied `id`
|
|
575
|
+
// needs to land for label association to work.
|
|
576
|
+
'[attr.id]': 'null',
|
|
577
|
+
// Same reasoning, same fix, for `aria-label`: force it absent on the host
|
|
578
|
+
// so the alias below (which the compiler recognizes here too) cannot
|
|
579
|
+
// leave a decoy `aria-label` on a roleless element while the native
|
|
580
|
+
// input — the thing that actually needs the accessible name — has none.
|
|
581
|
+
'[attr.aria-label]': 'null',
|
|
506
582
|
}, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md)}input{display:block;width:100%;min-height:var(--ui-control-height-md);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) var(--ui-spacing-4);font-size:inherit;font-family:inherit;line-height:var(--ui-line-height-tight);color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast);outline:none;box-sizing:border-box}input::placeholder{color:var(--ui-color-placeholder)}input:hover:not(:disabled):not(:read-only){border-color:var(--ui-color-input-border-hover)}input:focus{border-color:var(--ui-color-input-border-focus);background-color:var(--ui-color-input-bg-focus);box-shadow:var(--ui-focus-ring)}.input-field{position:relative}:host(.is-invalid) input{border-color:var(--ui-color-input-border-invalid);padding-right:2.25rem}:host(.is-invalid) input:focus{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-invalid) .input-field .invalid-icon{position:absolute;top:50%;transform:translateY(-50%);right:.875rem;color:var(--ui-color-danger);pointer-events:none}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) input{cursor:not-allowed}:host(.is-readonly) input{background-color:var(--ui-color-surface-sunken);border-color:transparent;cursor:default}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"] }]
|
|
507
|
-
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", 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"] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }] } });
|
|
583
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", 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"] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }] } });
|
|
508
584
|
|
|
509
585
|
let nextId$c = 0;
|
|
510
586
|
/**
|
|
@@ -514,6 +590,7 @@ let nextId$c = 0;
|
|
|
514
590
|
* ```html
|
|
515
591
|
* <atl-textarea placeholder="Enter a description" [(value)]="description" />
|
|
516
592
|
* <atl-textarea [formField]="form.bio" [rows]="4" />
|
|
593
|
+
* <atl-textarea label="Bio" [(value)]="bio" />
|
|
517
594
|
* ```
|
|
518
595
|
*/
|
|
519
596
|
class AtlTextarea {
|
|
@@ -523,9 +600,31 @@ class AtlTextarea {
|
|
|
523
600
|
/** Number of visible text rows. */
|
|
524
601
|
rows = input(3, /* @ts-ignore */
|
|
525
602
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
603
|
+
/**
|
|
604
|
+
* Visible caption rendered as a `<label>` associated with the textarea via
|
|
605
|
+
* `for`/`id`. Omit it when the field is captioned some other way (an
|
|
606
|
+
* external `<label>`, or `aria-label`) — without one of these the textarea
|
|
607
|
+
* has no accessible name.
|
|
608
|
+
*/
|
|
609
|
+
label = input('', /* @ts-ignore */
|
|
610
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
611
|
+
/**
|
|
612
|
+
* Accessible name for the native textarea, for when there is no visible
|
|
613
|
+
* `label`. An aliased input rather than a plain host attribute — see
|
|
614
|
+
* `atl-input.ts`'s identical `ariaLabel` for why.
|
|
615
|
+
*/
|
|
616
|
+
ariaLabel = input('', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
|
|
526
617
|
/** Placeholder text shown when the textarea is empty. */
|
|
527
618
|
placeholder = input('', /* @ts-ignore */
|
|
528
619
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
620
|
+
/**
|
|
621
|
+
* Explicit id for the native textarea. Wins over the auto-generated id —
|
|
622
|
+
* set this when something outside this component (an external
|
|
623
|
+
* `<label for>`, or `aria-describedby` from elsewhere on the page) needs a
|
|
624
|
+
* known, stable id to point at.
|
|
625
|
+
*/
|
|
626
|
+
id = input('', /* @ts-ignore */
|
|
627
|
+
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
529
628
|
/** Whether the textarea is disabled. Bound by [formField] directive. */
|
|
530
629
|
disabled = input(false, /* @ts-ignore */
|
|
531
630
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
@@ -552,6 +651,18 @@ class AtlTextarea {
|
|
|
552
651
|
...(ngDevMode ? [{ debugName: "autoResize" }] : /* istanbul ignore next */ []));
|
|
553
652
|
/** @internal */
|
|
554
653
|
errorId = `atl-textarea-errors-${nextId$c++}`;
|
|
654
|
+
/**
|
|
655
|
+
* @internal
|
|
656
|
+
* Fallback id, used only when the caller does not supply one. Same
|
|
657
|
+
* module-scoped counter idiom as `errorId` above and as every other
|
|
658
|
+
* Angular form control in this lib — see `atl-input.ts`'s `generatedId`
|
|
659
|
+
* for the honest account of what guarantee this idiom actually gives
|
|
660
|
+
* (same-module-instance uniqueness, not `useId()`-equivalent SSR safety).
|
|
661
|
+
*/
|
|
662
|
+
generatedId = `atl-textarea-${nextId$c++}`;
|
|
663
|
+
/** @internal */
|
|
664
|
+
inputId = computed(() => this.id() || (this.label() ? this.generatedId : ''), /* @ts-ignore */
|
|
665
|
+
...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
555
666
|
/** @internal */
|
|
556
667
|
/**
|
|
557
668
|
* The message renders when there is a message. Gating it on `touched` as well was
|
|
@@ -583,10 +694,14 @@ class AtlTextarea {
|
|
|
583
694
|
const target = event.target;
|
|
584
695
|
this.value.set(target.value);
|
|
585
696
|
}
|
|
586
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
587
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
697
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
698
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTextarea, isStandalone: true, selector: "atl-textarea", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", 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 }, 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 }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { properties: { "class": "hostClasses()", "attr.id": "null", "attr.aria-label": "null" } }, ngImport: i0, template: `
|
|
699
|
+
@if (label()) {
|
|
700
|
+
<label [attr.for]="inputId()">{{ label() }}</label>
|
|
701
|
+
}
|
|
588
702
|
<div class="textarea-field">
|
|
589
703
|
<textarea
|
|
704
|
+
[attr.id]="inputId() || null"
|
|
590
705
|
[value]="value()"
|
|
591
706
|
(input)="onInput($event)"
|
|
592
707
|
(blur)="touched.set(true)"
|
|
@@ -595,6 +710,7 @@ class AtlTextarea {
|
|
|
595
710
|
[placeholder]="placeholder()"
|
|
596
711
|
[rows]="rows()"
|
|
597
712
|
[attr.name]="name() || null"
|
|
713
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
598
714
|
[attr.aria-invalid]="invalid() || null"
|
|
599
715
|
[attr.aria-required]="required() || null"
|
|
600
716
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
@@ -614,11 +730,15 @@ class AtlTextarea {
|
|
|
614
730
|
}
|
|
615
731
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font:var(--ui-type-body-md)}textarea{display:block;width:100%;padding:.625rem var(--ui-spacing-4);font-size:inherit;font-family:inherit;line-height:var(--ui-line-height-normal);color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast);outline:none;box-sizing:border-box;resize:vertical;min-height:5rem}textarea::placeholder{color:var(--ui-color-placeholder)}textarea:hover:not(:disabled):not(:read-only){border-color:var(--ui-color-input-border-hover)}textarea:focus{border-color:var(--ui-color-input-border-focus);background-color:var(--ui-color-input-bg-focus);box-shadow:var(--ui-focus-ring)}.textarea-field{position:relative}:host(.is-invalid) textarea{border-color:var(--ui-color-input-border-invalid);padding-right:2.25rem}:host(.is-invalid) textarea:focus{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-invalid) .textarea-field .invalid-icon{position:absolute;top:50%;transform:translateY(-50%);right:.875rem;color:var(--ui-color-danger);pointer-events:none}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) textarea{cursor:not-allowed}:host(.is-readonly) textarea{background-color:var(--ui-color-surface-sunken);border-color:transparent;cursor:default}:host(.is-auto-resize) textarea{resize:none;overflow:hidden}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"], dependencies: [{ kind: "ngmodule", type: TextFieldModule }, { kind: "directive", type: i1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
616
732
|
}
|
|
617
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
733
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTextarea, decorators: [{
|
|
618
734
|
type: Component,
|
|
619
735
|
args: [{ selector: 'atl-textarea', standalone: true, imports: [TextFieldModule, AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
736
|
+
@if (label()) {
|
|
737
|
+
<label [attr.for]="inputId()">{{ label() }}</label>
|
|
738
|
+
}
|
|
620
739
|
<div class="textarea-field">
|
|
621
740
|
<textarea
|
|
741
|
+
[attr.id]="inputId() || null"
|
|
622
742
|
[value]="value()"
|
|
623
743
|
(input)="onInput($event)"
|
|
624
744
|
(blur)="touched.set(true)"
|
|
@@ -627,6 +747,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
627
747
|
[placeholder]="placeholder()"
|
|
628
748
|
[rows]="rows()"
|
|
629
749
|
[attr.name]="name() || null"
|
|
750
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
630
751
|
[attr.aria-invalid]="invalid() || null"
|
|
631
752
|
[attr.aria-required]="required() || null"
|
|
632
753
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
@@ -646,8 +767,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
646
767
|
}
|
|
647
768
|
`, host: {
|
|
648
769
|
'[class]': 'hostClasses()',
|
|
770
|
+
// See atl-input.ts's identical host binding for why: a static `id="…"`
|
|
771
|
+
// attribute matches the `id` input AND stays on this host element, which
|
|
772
|
+
// would duplicate the id this component puts on the native `<textarea>`
|
|
773
|
+
// and break `<label for>` association (the host is not labelable and is
|
|
774
|
+
// first in document order). Force the host's own `id` attribute to
|
|
775
|
+
// always be absent.
|
|
776
|
+
'[attr.id]': 'null',
|
|
777
|
+
// Same reasoning, same fix, for `aria-label` — see atl-input.ts.
|
|
778
|
+
'[attr.aria-label]': 'null',
|
|
649
779
|
}, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font:var(--ui-type-body-md)}textarea{display:block;width:100%;padding:.625rem var(--ui-spacing-4);font-size:inherit;font-family:inherit;line-height:var(--ui-line-height-normal);color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast);outline:none;box-sizing:border-box;resize:vertical;min-height:5rem}textarea::placeholder{color:var(--ui-color-placeholder)}textarea:hover:not(:disabled):not(:read-only){border-color:var(--ui-color-input-border-hover)}textarea:focus{border-color:var(--ui-color-input-border-focus);background-color:var(--ui-color-input-bg-focus);box-shadow:var(--ui-focus-ring)}.textarea-field{position:relative}:host(.is-invalid) textarea{border-color:var(--ui-color-input-border-invalid);padding-right:2.25rem}:host(.is-invalid) textarea:focus{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-invalid) .textarea-field .invalid-icon{position:absolute;top:50%;transform:translateY(-50%);right:.875rem;color:var(--ui-color-danger);pointer-events:none}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) textarea{cursor:not-allowed}:host(.is-readonly) textarea{background-color:var(--ui-color-surface-sunken);border-color:transparent;cursor:default}:host(.is-auto-resize) textarea{resize:none;overflow:hidden}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"] }]
|
|
650
|
-
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", 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"] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }] } });
|
|
780
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", 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"] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }] } });
|
|
651
781
|
|
|
652
782
|
let nextId$b = 0;
|
|
653
783
|
/**
|
|
@@ -728,8 +858,8 @@ class AtlCheckbox {
|
|
|
728
858
|
const target = event.target;
|
|
729
859
|
this.checked.set(target.checked);
|
|
730
860
|
}
|
|
731
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
732
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
861
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
862
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlCheckbox, isStandalone: true, selector: "atl-checkbox", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", touched: "touchedChange" }, host: { properties: { "class": "hostClasses()" } }, viewQueries: [{ propertyName: "nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
733
863
|
<label [attr.for]="inputId">
|
|
734
864
|
<input
|
|
735
865
|
#nativeInput
|
|
@@ -755,7 +885,7 @@ class AtlCheckbox {
|
|
|
755
885
|
}
|
|
756
886
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);font-size:var(--ui-font-size-md);line-height:var(--ui-line-height-tight)}label{display:inline-flex;align-items:center;gap:var(--ui-spacing-3);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--ui-color-text);min-height:var(--ui-row-height-sm);padding-block:0;line-height:var(--ui-line-height-tight)}input[type=checkbox]{appearance:none;-webkit-appearance:none;flex-shrink:0;margin:0;width:1.25rem;height:1.25rem;border:var(--ui-border-width-thick) solid var(--ui-color-border-strong);border-radius:var(--ui-radius-sm);background-color:var(--ui-color-input-bg);cursor:pointer;position:relative;transition:border-color var(--ui-transition-fast),background-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast);outline:none}input[type=checkbox]:hover:not(:disabled){border-color:var(--ui-color-primary);background-color:var(--ui-color-primary-light)}input[type=checkbox]:focus-visible{box-shadow:var(--ui-focus-ring);border-color:var(--ui-color-primary)}input[type=checkbox]:checked{background-color:var(--ui-color-primary);border-color:var(--ui-color-primary)}input[type=checkbox]:checked:after{content:\"\";position:absolute;inset:0;margin:auto;width:.35rem;height:.6rem;border:var(--ui-border-width-thick) solid var(--ui-color-text-on-primary);border-top:none;border-left:none;transform:rotate(45deg) translate(-1px,-1px);animation:atl-check-pop var(--ui-duration-normal) var(--ui-ease-spring)}input[type=checkbox]:indeterminate{background-color:var(--ui-color-primary);border-color:var(--ui-color-primary)}input[type=checkbox]:indeterminate:after{content:\"\";position:absolute;inset:0;margin:auto;width:.5rem;height:2px;background-color:var(--ui-color-text-on-primary);animation:atl-check-pop var(--ui-duration-normal) var(--ui-ease-spring)}:host(.is-invalid) input[type=checkbox]{border-color:var(--ui-color-input-border-invalid)}:host(.is-invalid) input[type=checkbox]:focus-visible{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) label{cursor:not-allowed}:host(.is-disabled) input[type=checkbox]{cursor:not-allowed}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}@keyframes atl-check-pop{0%{transform:rotate(45deg) translate(-1px,-1px) scale(0)}60%{transform:rotate(45deg) translate(-1px,-1px) scale(1.15)}to{transform:rotate(45deg) translate(-1px,-1px) scale(1)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
757
887
|
}
|
|
758
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCheckbox, decorators: [{
|
|
759
889
|
type: Component,
|
|
760
890
|
args: [{ selector: 'atl-checkbox', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
761
891
|
<label [attr.for]="inputId">
|
|
@@ -866,8 +996,8 @@ class AtlRadio {
|
|
|
866
996
|
onBlur() {
|
|
867
997
|
this.group?.markTouched();
|
|
868
998
|
}
|
|
869
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
870
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
999
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlRadio, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1000
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlRadio, isStandalone: true, selector: "atl-radio", inputs: { radioValue: { classPropertyName: "radioValue", publicName: "radioValue", isSignal: true, isRequired: true, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
871
1001
|
<label [attr.for]="inputId">
|
|
872
1002
|
<input
|
|
873
1003
|
type="radio"
|
|
@@ -884,7 +1014,7 @@ class AtlRadio {
|
|
|
884
1014
|
</label>
|
|
885
1015
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;gap:var(--ui-spacing-3);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--ui-color-text);line-height:var(--ui-line-height-tight);font-family:var(--ui-font-family);font-size:var(--ui-font-size-md);padding-block:0;min-height:var(--ui-row-height-sm);transition:color var(--ui-transition-fast)}:host(:hover:not(.is-disabled)){color:var(--ui-color-primary)}input[type=radio]{appearance:none;-webkit-appearance:none;flex-shrink:0;width:1.25rem;height:1.25rem;border:var(--ui-border-width-thick) solid var(--ui-color-border-strong);border-radius:50%;background-color:var(--ui-color-input-bg);cursor:pointer;position:relative;transition:border-color var(--ui-transition-fast),border-width var(--ui-transition-fast) var(--ui-ease-out),background-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast);outline:none;margin:0}:host(:hover) input[type=radio]:not(:disabled){border-color:var(--ui-color-primary)}input[type=radio]:focus-visible{box-shadow:var(--ui-focus-ring);border-color:var(--ui-color-primary)}input[type=radio]:checked{border-color:var(--ui-color-primary);border-width:6px}:host(.is-invalid) input[type=radio]{border-color:var(--ui-color-input-border-invalid)}:host(.is-invalid:hover) input[type=radio]{border-color:var(--ui-color-danger-hover)}:host(.is-invalid) input[type=radio]:focus-visible{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed;color:var(--ui-color-text-muted)}:host(.is-disabled) input[type=radio]{cursor:not-allowed;border-color:var(--ui-color-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
886
1016
|
}
|
|
887
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1017
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlRadio, decorators: [{
|
|
888
1018
|
type: Component,
|
|
889
1019
|
args: [{ selector: 'atl-radio', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
890
1020
|
<label [attr.for]="inputId">
|
|
@@ -1023,8 +1153,8 @@ class AtlRadioGroup {
|
|
|
1023
1153
|
this.touched.set(true);
|
|
1024
1154
|
}
|
|
1025
1155
|
}
|
|
1026
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1027
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
1156
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1157
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlRadioGroup, isStandalone: true, selector: "atl-radio-group", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", 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 }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { attributes: { "role": "radiogroup" }, listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "hostClasses()", "attr.aria-invalid": "invalid() || null", "attr.aria-required": "required() || null", "attr.aria-describedby": "showErrors() ? errorId : null" } }, providers: [{ provide: ATL_RADIO_GROUP, useExisting: AtlRadioGroup }], ngImport: i0, template: `
|
|
1028
1158
|
<ng-content />
|
|
1029
1159
|
@if (showErrors()) {
|
|
1030
1160
|
<div class="errors" [id]="errorId" aria-live="polite">
|
|
@@ -1035,7 +1165,7 @@ class AtlRadioGroup {
|
|
|
1035
1165
|
}
|
|
1036
1166
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:flex;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);gap:var(--ui-spacing-3)}:host(.orientation-vertical){flex-direction:column}:host(.orientation-horizontal){flex-direction:row;flex-wrap:wrap}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1037
1167
|
}
|
|
1038
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1168
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlRadioGroup, decorators: [{
|
|
1039
1169
|
type: Component,
|
|
1040
1170
|
args: [{ selector: 'atl-radio-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
1041
1171
|
<ng-content />
|
|
@@ -1123,8 +1253,8 @@ class AtlToggle {
|
|
|
1123
1253
|
const target = event.target;
|
|
1124
1254
|
this.checked.set(target.checked);
|
|
1125
1255
|
}
|
|
1126
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1127
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
1256
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1257
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlToggle, isStandalone: true, selector: "atl-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", touched: "touchedChange" }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
1128
1258
|
<label [attr.for]="inputId">
|
|
1129
1259
|
<input
|
|
1130
1260
|
type="checkbox"
|
|
@@ -1154,7 +1284,7 @@ class AtlToggle {
|
|
|
1154
1284
|
}
|
|
1155
1285
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);font-size:var(--ui-font-size-md);line-height:var(--ui-line-height-tight)}label{display:inline-flex;align-items:center;gap:var(--ui-spacing-3);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--ui-color-text);min-height:var(--ui-row-height-sm);padding-block:0;line-height:var(--ui-line-height-tight)}input[type=checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.track{position:relative;display:inline-flex;align-items:center;flex-shrink:0;width:2.75rem;height:1.5rem;border-radius:var(--ui-radius-full);border:var(--ui-border-width) solid var(--ui-color-border-strong);background-color:var(--ui-color-input-bg);transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast);cursor:pointer}.thumb{position:absolute;left:.125rem;width:1.125rem;height:1.125rem;border-radius:var(--ui-radius-full);background-color:var(--ui-color-border-strong);box-shadow:var(--ui-shadow-xs);transition:transform var(--ui-transition-normal) var(--ui-ease-out),background-color var(--ui-transition-fast)}label:hover:not(:has(input:disabled)) .track{border-color:var(--ui-color-primary)}input[type=checkbox]:focus-visible+.track{box-shadow:var(--ui-focus-ring);border-color:var(--ui-color-primary)}:host(.is-checked) .track{background-color:var(--ui-color-primary);border-color:var(--ui-color-primary)}:host(.is-checked) .thumb{transform:translate(1.25rem);background-color:var(--ui-color-text-on-primary)}:host(.is-invalid) .track{border-color:var(--ui-color-input-border-invalid)}:host(.is-invalid) input[type=checkbox]:focus-visible+.track{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) label{cursor:not-allowed}:host(.is-disabled) .track{cursor:not-allowed}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1156
1286
|
}
|
|
1157
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToggle, decorators: [{
|
|
1158
1288
|
type: Component,
|
|
1159
1289
|
args: [{ selector: 'atl-toggle', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
1160
1290
|
<label [attr.for]="inputId">
|
|
@@ -1237,8 +1367,8 @@ class AtlAlert {
|
|
|
1237
1367
|
dismiss() {
|
|
1238
1368
|
this.dismissed.emit();
|
|
1239
1369
|
}
|
|
1240
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1241
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
1370
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1371
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlAlert, isStandalone: true, selector: "atl-alert", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismissed: "dismissed" }, host: { attributes: { "role": "alert" }, properties: { "class": "hostClassesValue", "attr.aria-live": "ariaLive" } }, ngImport: i0, template: `
|
|
1242
1372
|
<span class="content">
|
|
1243
1373
|
@if (variantIcon(); as icon) {
|
|
1244
1374
|
<atl-icon class="variant-icon" [name]="icon" size="sm" />
|
|
@@ -1252,7 +1382,7 @@ class AtlAlert {
|
|
|
1252
1382
|
}
|
|
1253
1383
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:flex;align-items:flex-start;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4) var(--ui-spacing-5);border-radius:var(--ui-radius-lg);border:var(--ui-border-width) solid transparent;font:var(--ui-type-body-sm);box-sizing:border-box;width:100%}.content{flex:1}:host(.variant-info){background-color:var(--ui-color-info-bg);color:var(--ui-color-info-text);border-color:color-mix(in srgb,var(--ui-color-info-text) 20%,transparent)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border-color:color-mix(in srgb,var(--ui-color-success-text) 20%,transparent)}:host(.variant-warning){background-color:var(--ui-color-warning-bg);color:var(--ui-color-warning-text);border-color:color-mix(in srgb,var(--ui-color-warning-text) 20%,transparent)}:host(.variant-danger){background-color:var(--ui-color-danger-bg);color:var(--ui-color-danger-text);border-color:color-mix(in srgb,var(--ui-color-danger-text) 20%,transparent)}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:1.75rem;height:1.75rem;padding:0;background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:inherit;opacity:.7;transition:opacity var(--ui-transition-fast),background-color var(--ui-transition-fast);line-height:1}.dismiss:hover{opacity:1;background-color:color-mix(in srgb,currentColor 10%,transparent)}.dismiss:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);opacity:1}.content .variant-icon{display:inline-block;font-weight:var(--ui-font-weight-bold);margin-right:.4em;line-height:1}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1254
1384
|
}
|
|
1255
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1385
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAlert, decorators: [{
|
|
1256
1386
|
type: Component,
|
|
1257
1387
|
args: [{ selector: 'atl-alert', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
1258
1388
|
<span class="content">
|
|
@@ -1315,6 +1445,10 @@ let nextId$7 = 0;
|
|
|
1315
1445
|
* <atl-select [formField]="form.country" placeholder="Select a country">
|
|
1316
1446
|
* <atl-option optionValue="us">United States</atl-option>
|
|
1317
1447
|
* </atl-select>
|
|
1448
|
+
*
|
|
1449
|
+
* <atl-select label="Country" [(value)]="country" placeholder="Select a country">
|
|
1450
|
+
* <atl-option optionValue="us">United States</atl-option>
|
|
1451
|
+
* </atl-select>
|
|
1318
1452
|
* ```
|
|
1319
1453
|
*/
|
|
1320
1454
|
class AtlSelect {
|
|
@@ -1327,6 +1461,21 @@ class AtlSelect {
|
|
|
1327
1461
|
/** Placeholder text shown when no option is selected. */
|
|
1328
1462
|
placeholder = input('', /* @ts-ignore */
|
|
1329
1463
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1464
|
+
/**
|
|
1465
|
+
* Visible caption rendered as a `<label>` associated with the trigger
|
|
1466
|
+
* button via `for`/`id`. Omit it when the field is captioned some other
|
|
1467
|
+
* way (an external `<label>`, or `aria-label`) — without one of these the
|
|
1468
|
+
* select has no accessible name (this is the L1 backlog item: a select
|
|
1469
|
+
* with neither produces exactly that).
|
|
1470
|
+
*/
|
|
1471
|
+
label = input('', /* @ts-ignore */
|
|
1472
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
1473
|
+
/**
|
|
1474
|
+
* Accessible name for the trigger button, for when there is no visible
|
|
1475
|
+
* `label`. An aliased input rather than a plain host attribute — see
|
|
1476
|
+
* `atl-input.ts`'s identical `ariaLabel` for why.
|
|
1477
|
+
*/
|
|
1478
|
+
ariaLabel = input('', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
|
|
1330
1479
|
/** Whether the select is disabled. Bound by [formField] directive. */
|
|
1331
1480
|
disabled = input(false, /* @ts-ignore */
|
|
1332
1481
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
@@ -1540,8 +1689,11 @@ class AtlSelect {
|
|
|
1540
1689
|
minWidth: triggerEl.offsetWidth,
|
|
1541
1690
|
});
|
|
1542
1691
|
}
|
|
1543
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1544
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
1692
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1693
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlSelect, isStandalone: true, selector: "atl-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", 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 }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { attributes: { "role": "combobox" }, listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "hostClasses()", "attr.aria-required": "required() || null", "attr.aria-label": "null" } }, providers: [{ provide: ATL_SELECT, useExisting: AtlSelect }], viewQueries: [{ propertyName: "panelRef", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
1694
|
+
@if (label()) {
|
|
1695
|
+
<label [attr.for]="triggerId">{{ label() }}</label>
|
|
1696
|
+
}
|
|
1545
1697
|
<button
|
|
1546
1698
|
type="button"
|
|
1547
1699
|
class="trigger"
|
|
@@ -1550,6 +1702,7 @@ class AtlSelect {
|
|
|
1550
1702
|
aria-haspopup="listbox"
|
|
1551
1703
|
[attr.aria-controls]="panelId"
|
|
1552
1704
|
[attr.aria-activedescendant]="activeOptionId()"
|
|
1705
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
1553
1706
|
[attr.aria-invalid]="invalid() || null"
|
|
1554
1707
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
1555
1708
|
[attr.disabled]="disabled() || null"
|
|
@@ -1586,9 +1739,12 @@ class AtlSelect {
|
|
|
1586
1739
|
}
|
|
1587
1740
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-block;position:relative;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md)}.trigger{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:var(--ui-control-height-md);box-sizing:border-box;line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) var(--ui-spacing-4);font-family:inherit;font-size:inherit;color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);outline:none;cursor:pointer;transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast)}.trigger:hover:not(:disabled){border-color:var(--ui-color-input-border-hover)}.trigger:focus-visible,:host(.is-open) .trigger{border-color:var(--ui-color-input-border-focus);box-shadow:var(--ui-focus-ring)}.trigger:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-invalid) .trigger{border-color:var(--ui-color-input-border-invalid)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}.trigger-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trigger-icon{flex-shrink:0;margin-left:var(--ui-spacing-1);color:var(--ui-color-text-muted);transition:transform var(--ui-transition-fast)}:host(.is-open) .trigger-icon{transform:rotate(180deg)}.panel{position:absolute;left:0;top:calc(100% + var(--ui-spacing-2));width:100%;max-height:16rem;overflow-y:auto;margin:0;padding:var(--ui-spacing-2) 0;background-color:var(--ui-color-surface-raised);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-md);box-shadow:var(--ui-shadow-lg);z-index:var(--ui-z-dropdown);display:none}.panel.is-open{display:block}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text)}.invalid-slot{flex-shrink:0;width:1rem;height:1rem;margin-left:var(--ui-spacing-2)}:host(.is-invalid) .invalid-icon{color:var(--ui-color-danger);pointer-events:none}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1588
1741
|
}
|
|
1589
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1742
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlSelect, decorators: [{
|
|
1590
1743
|
type: Component,
|
|
1591
1744
|
args: [{ selector: 'atl-select', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
1745
|
+
@if (label()) {
|
|
1746
|
+
<label [attr.for]="triggerId">{{ label() }}</label>
|
|
1747
|
+
}
|
|
1592
1748
|
<button
|
|
1593
1749
|
type="button"
|
|
1594
1750
|
class="trigger"
|
|
@@ -1597,6 +1753,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
1597
1753
|
aria-haspopup="listbox"
|
|
1598
1754
|
[attr.aria-controls]="panelId"
|
|
1599
1755
|
[attr.aria-activedescendant]="activeOptionId()"
|
|
1756
|
+
[attr.aria-label]="ariaLabel() || null"
|
|
1600
1757
|
[attr.aria-invalid]="invalid() || null"
|
|
1601
1758
|
[attr.aria-describedby]="showErrors() ? errorId : null"
|
|
1602
1759
|
[attr.disabled]="disabled() || null"
|
|
@@ -1634,9 +1791,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
1634
1791
|
`, host: {
|
|
1635
1792
|
role: 'combobox',
|
|
1636
1793
|
'[class]': 'hostClasses()',
|
|
1794
|
+
'[attr.aria-required]': 'required() || null',
|
|
1637
1795
|
'(keydown)': 'onKeydown($event)',
|
|
1796
|
+
// Same fix as atl-input.ts's `id`: a static `aria-label="…"` attribute
|
|
1797
|
+
// matches the aliased `ariaLabel` input below AND stays on this host
|
|
1798
|
+
// element too. The host already carries `role="combobox"`, so an
|
|
1799
|
+
// aria-label here would actually take effect — as a second, competing
|
|
1800
|
+
// name next to the trigger button's, not as a no-op like on Input's
|
|
1801
|
+
// roleless host. Force it absent so the trigger button (the actual
|
|
1802
|
+
// focusable widget) is the one and only place the name lands.
|
|
1803
|
+
'[attr.aria-label]': 'null',
|
|
1638
1804
|
}, providers: [{ provide: ATL_SELECT, useExisting: AtlSelect }], styles: [":host,:host *{box-sizing:border-box}:host{display:inline-block;position:relative;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md)}.trigger{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:var(--ui-control-height-md);box-sizing:border-box;line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) var(--ui-spacing-4);font-family:inherit;font-size:inherit;color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);outline:none;cursor:pointer;transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast)}.trigger:hover:not(:disabled){border-color:var(--ui-color-input-border-hover)}.trigger:focus-visible,:host(.is-open) .trigger{border-color:var(--ui-color-input-border-focus);box-shadow:var(--ui-focus-ring)}.trigger:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-invalid) .trigger{border-color:var(--ui-color-input-border-invalid)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}.trigger-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trigger-icon{flex-shrink:0;margin-left:var(--ui-spacing-1);color:var(--ui-color-text-muted);transition:transform var(--ui-transition-fast)}:host(.is-open) .trigger-icon{transform:rotate(180deg)}.panel{position:absolute;left:0;top:calc(100% + var(--ui-spacing-2));width:100%;max-height:16rem;overflow-y:auto;margin:0;padding:var(--ui-spacing-2) 0;background-color:var(--ui-color-surface-raised);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-md);box-shadow:var(--ui-shadow-lg);z-index:var(--ui-z-dropdown);display:none}.panel.is-open{display:block}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text)}.invalid-slot{flex-shrink:0;width:1rem;height:1rem;margin-left:var(--ui-spacing-2)}:host(.is-invalid) .invalid-icon{color:var(--ui-color-danger);pointer-events:none}\n"] }]
|
|
1639
|
-
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], panelRef: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
|
|
1805
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], panelRef: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
|
|
1640
1806
|
|
|
1641
1807
|
let nextOptionId = 0;
|
|
1642
1808
|
/**
|
|
@@ -1687,8 +1853,8 @@ class AtlOption {
|
|
|
1687
1853
|
this.context.activeOptionId.set(this.optionId);
|
|
1688
1854
|
}
|
|
1689
1855
|
}
|
|
1690
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1691
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
1856
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlOption, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1857
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlOption, isStandalone: true, selector: "atl-option", inputs: { optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
1692
1858
|
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
1693
1859
|
<div
|
|
1694
1860
|
role="option"
|
|
@@ -1705,7 +1871,7 @@ class AtlOption {
|
|
|
1705
1871
|
</div>
|
|
1706
1872
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}[role=option]{display:flex;align-items:center;justify-content:space-between;min-height:var(--ui-row-height-sm);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);cursor:pointer;color:var(--ui-color-text);font-size:var(--ui-font-size-md);transition:background-color var(--ui-transition-fast)}[role=option]:hover:not(.is-disabled){background-color:var(--ui-color-surface-sunken)}[role=option].is-active{background-color:var(--ui-color-primary-light);color:var(--ui-color-primary)}[role=option].is-selected{font-weight:var(--ui-font-weight-semibold)}[role=option].is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1707
1873
|
}
|
|
1708
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1874
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlOption, decorators: [{
|
|
1709
1875
|
type: Component,
|
|
1710
1876
|
args: [{ selector: 'atl-option', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
1711
1877
|
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
@@ -1954,8 +2120,8 @@ class AtlCombobox {
|
|
|
1954
2120
|
this.outsideClickHandler = null;
|
|
1955
2121
|
}
|
|
1956
2122
|
}
|
|
1957
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1958
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
2123
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCombobox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2124
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlCombobox, isStandalone: true, selector: "atl-combobox", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", 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 }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { properties: { "class": "hostClasses()" } }, viewQueries: [{ propertyName: "panelRef", first: true, predicate: ["panel"], descendants: true, isSignal: true }, { propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
1959
2125
|
<div class="combobox-wrapper">
|
|
1960
2126
|
<input
|
|
1961
2127
|
#inputEl
|
|
@@ -2030,7 +2196,7 @@ class AtlCombobox {
|
|
|
2030
2196
|
}
|
|
2031
2197
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;position:relative;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md)}.combobox-wrapper{position:relative;display:flex;align-items:center}.combobox-input{width:100%;min-height:var(--ui-control-height-md);box-sizing:border-box;line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) calc(var(--ui-spacing-4) + 1.25rem + var(--ui-spacing-5)) calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-md)) / 2 - var(--ui-border-width)) var(--ui-spacing-4);font-family:inherit;font-size:inherit;color:var(--ui-color-text);background-color:var(--ui-color-input-bg);border:var(--ui-border-width) solid var(--ui-color-input-border);border-radius:var(--ui-radius-md);outline:none;transition:border-color var(--ui-transition-fast),box-shadow var(--ui-transition-fast),background-color var(--ui-transition-fast);cursor:text}.combobox-input::placeholder{color:var(--ui-color-placeholder)}.combobox-input:hover:not(:disabled){border-color:var(--ui-color-input-border-hover)}.combobox-input:focus-visible,:host(.is-open) .combobox-input{border-color:var(--ui-color-input-border-focus);box-shadow:var(--ui-focus-ring)}:host(.is-invalid) .combobox-input{border-color:var(--ui-color-input-border-invalid)}:host(.is-invalid) .combobox-input:focus-visible{border-color:var(--ui-color-input-border-invalid);box-shadow:var(--ui-focus-ring-danger)}:host(.is-disabled){opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.is-disabled) .combobox-input{cursor:not-allowed}.combobox-icon{position:absolute;inset-inline-end:var(--ui-spacing-4);pointer-events:none;color:var(--ui-color-text-muted);transition:transform var(--ui-transition-fast);display:flex;align-items:center}:host(.is-open) .combobox-icon{transform:rotate(180deg)}.panel{position:absolute;left:0;top:calc(100% + var(--ui-spacing-2));width:100%;max-height:16rem;overflow-y:auto;margin:0;padding:var(--ui-spacing-2) 0;background-color:var(--ui-color-surface-raised);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-md);box-shadow:var(--ui-shadow-lg);z-index:var(--ui-z-dropdown);list-style:none}.option{display:flex;align-items:center;justify-content:space-between;min-height:var(--ui-row-height-sm);padding-block:0;line-height:var(--ui-line-height-tight);padding-inline:var(--ui-spacing-4);cursor:pointer;color:var(--ui-color-text);font-size:var(--ui-font-size-md);transition:background-color var(--ui-transition-fast)}.option:hover:not(.is-disabled){background-color:var(--ui-color-surface-sunken)}.option.is-active{background-color:var(--ui-color-primary-light);color:var(--ui-color-primary)}.option.is-selected{font-weight:var(--ui-font-weight-semibold)}.option.is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}.option-check{color:var(--ui-color-primary);flex-shrink:0}.no-results{padding:var(--ui-spacing-4);text-align:center;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-sm)}.errors{margin-top:var(--ui-spacing-2)}.error-message{margin:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-error-text);line-height:var(--ui-line-height-normal)}:host(.is-readonly) .combobox-input{border-color:transparent;cursor:default}:host(.is-invalid) .invalid-icon{position:absolute;top:50%;transform:translateY(-50%);inset-inline-end:calc(var(--ui-spacing-4) + var(--ui-spacing-5));color:var(--ui-color-danger);pointer-events:none}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2032
2198
|
}
|
|
2033
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCombobox, decorators: [{
|
|
2034
2200
|
type: Component,
|
|
2035
2201
|
args: [{ selector: 'atl-combobox', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
2036
2202
|
<div class="combobox-wrapper">
|
|
@@ -2180,8 +2346,8 @@ class AtlDialog {
|
|
|
2180
2346
|
this.open.set(false);
|
|
2181
2347
|
}
|
|
2182
2348
|
}
|
|
2183
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2184
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.
|
|
2349
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2350
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.5", type: AtlDialog, isStandalone: true, selector: "atl-dialog", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "hostClasses()", "attr.aria-label": "null", "attr.aria-labelledby": "null" } }, providers: [
|
|
2185
2351
|
{
|
|
2186
2352
|
provide: ATL_DIALOG,
|
|
2187
2353
|
useFactory: (dialog) => ({
|
|
@@ -2208,7 +2374,7 @@ class AtlDialog {
|
|
|
2208
2374
|
</dialog>
|
|
2209
2375
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2210
2376
|
}
|
|
2211
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2377
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialog, decorators: [{
|
|
2212
2378
|
type: Component,
|
|
2213
2379
|
args: [{ selector: 'atl-dialog', standalone: true, imports: [A11yModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
2214
2380
|
{
|
|
@@ -2237,6 +2403,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2237
2403
|
</dialog>
|
|
2238
2404
|
`, host: {
|
|
2239
2405
|
'[class]': 'hostClasses()',
|
|
2406
|
+
// Same defect as atl-input.ts's identical guards: a static aria-label="…"
|
|
2407
|
+
// or aria-labelledby="…" attribute on <atl-dialog> matches the aliased
|
|
2408
|
+
// input below AND stays on this host element too (Angular keeps static
|
|
2409
|
+
// attributes even when they also bind an input). The host is roleless
|
|
2410
|
+
// today, so an undefended attribute here is currently a no-op rather than
|
|
2411
|
+
// a live defect — but force it absent anyway so it stays that way once
|
|
2412
|
+
// this host ever gains a role, and so the aliased input unambiguously
|
|
2413
|
+
// means "the inner <dialog>'s accessible name" (ADR-0091).
|
|
2414
|
+
'[attr.aria-label]': 'null',
|
|
2415
|
+
'[attr.aria-labelledby]': 'null',
|
|
2240
2416
|
}, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"] }]
|
|
2241
2417
|
}], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-labelledby", required: false }] }], dialogRef: [{ type: i0.ViewChild, args: ['dialogEl', { isSignal: true }] }] } });
|
|
2242
2418
|
/**
|
|
@@ -2245,8 +2421,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2245
2421
|
*/
|
|
2246
2422
|
class AtlDialogHeader {
|
|
2247
2423
|
context = inject(ATL_DIALOG);
|
|
2248
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2249
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
2424
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2425
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDialogHeader, isStandalone: true, selector: "atl-dialog-header", host: { properties: { "attr.id": "context.headerId" }, classAttribute: "atl-dialog-header" }, ngImport: i0, template: `
|
|
2250
2426
|
<ng-content />
|
|
2251
2427
|
<button
|
|
2252
2428
|
class="close-btn"
|
|
@@ -2258,7 +2434,7 @@ class AtlDialogHeader {
|
|
|
2258
2434
|
</button>
|
|
2259
2435
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2260
2436
|
}
|
|
2261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2437
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogHeader, decorators: [{
|
|
2262
2438
|
type: Component,
|
|
2263
2439
|
args: [{ selector: 'atl-dialog-header', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
2264
2440
|
<ng-content />
|
|
@@ -2279,10 +2455,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2279
2455
|
* Content slot for `atl-dialog`. Scrollable primary content area.
|
|
2280
2456
|
*/
|
|
2281
2457
|
class AtlDialogContent {
|
|
2282
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2283
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
2458
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2459
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDialogContent, isStandalone: true, selector: "atl-dialog-content", host: { classAttribute: "atl-dialog-content" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2284
2460
|
}
|
|
2285
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2461
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogContent, decorators: [{
|
|
2286
2462
|
type: Component,
|
|
2287
2463
|
args: [{ selector: 'atl-dialog-content', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-dialog-content' }, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"] }]
|
|
2288
2464
|
}] });
|
|
@@ -2290,10 +2466,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2290
2466
|
* Footer slot for `atl-dialog`. Renders below content, typically holds action buttons.
|
|
2291
2467
|
*/
|
|
2292
2468
|
class AtlDialogFooter {
|
|
2293
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2294
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
2469
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2470
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDialogFooter, isStandalone: true, selector: "atl-dialog-footer", host: { classAttribute: "atl-dialog-footer" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2295
2471
|
}
|
|
2296
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2472
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDialogFooter, decorators: [{
|
|
2297
2473
|
type: Component,
|
|
2298
2474
|
args: [{ selector: 'atl-dialog-footer', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-dialog-footer' }, styles: [":host,:host *{box-sizing:border-box}.atl-dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal);position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;display:none;flex-direction:column;max-width:100vw;max-height:calc(100dvh - var(--ui-spacing-8));border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;opacity:0;transform:scale(.95);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}.atl-dialog[open]{display:flex;opacity:1;transform:scale(1)}@starting-style{.atl-dialog[open]{opacity:0;transform:scale(.95)}}.atl-dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{.atl-dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){.atl-dialog::backdrop{background:var(--ui-color-overlay)}}[data-theme=dark] .atl-dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;max-height:inherit;overflow:hidden}.atl-dialog.size-sm,dialog>.panel.size-sm{width:min(24rem,90vw)}.atl-dialog.size-md,dialog>.panel.size-md{width:min(36rem,90vw)}.atl-dialog.size-lg,dialog>.panel.size-lg{width:min(48rem,90vw)}.atl-dialog.size-xl,dialog>.panel.size-xl{width:min(64rem,90vw)}.atl-dialog.size-full,dialog>.panel.size-full{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0;margin:0}:host(.atl-dialog-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-dialog-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-dialog-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"] }]
|
|
2299
2475
|
}] });
|
|
@@ -2375,8 +2551,8 @@ class AtlTabGroup {
|
|
|
2375
2551
|
this.selectTab(targetIdx);
|
|
2376
2552
|
this.tabBtns()[targetIdx]?.nativeElement.focus();
|
|
2377
2553
|
}
|
|
2378
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2379
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
2554
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTabGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2555
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTabGroup, isStandalone: true, selector: "atl-tab-group", inputs: { selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [{ provide: ATL_TAB_GROUP, useExisting: AtlTabGroup }], viewQueries: [{ propertyName: "tabBtns", predicate: ["tabBtn"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
2380
2556
|
<div class="tablist" role="tablist">
|
|
2381
2557
|
@for (tab of tabs(); track tab.id; let i = $index) {
|
|
2382
2558
|
<button
|
|
@@ -2400,7 +2576,7 @@ class AtlTabGroup {
|
|
|
2400
2576
|
<ng-content />
|
|
2401
2577
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.tablist{display:flex;gap:var(--ui-spacing-2);border-bottom:var(--ui-border-width) solid var(--ui-color-border);overflow-x:auto;scrollbar-width:none}.tablist::-webkit-scrollbar{display:none}.tablist button{all:unset;box-sizing:border-box;position:relative;display:inline-flex;align-items:center;min-height:var(--ui-control-height-md);line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-md) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2) var(--ui-spacing-4);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text-muted);cursor:pointer;transition:var(--ui-transition-fast);transition-property:color,background-color;border-radius:var(--ui-radius-md) var(--ui-radius-md) 0 0;white-space:nowrap;-webkit-user-select:none;user-select:none}.tablist button:after{content:\"\";position:absolute;bottom:-1px;left:var(--ui-spacing-2);right:var(--ui-spacing-2);height:3px;background:transparent;border-radius:var(--ui-radius-full) var(--ui-radius-full) 0 0;transition:background var(--ui-transition-fast)}.tablist button.is-active{color:var(--ui-color-primary)}.tablist button.is-active:after{background:var(--ui-color-primary)}.tablist button:hover:not(.is-disabled):not(.is-active){color:var(--ui-color-text);background:var(--ui-color-surface-sunken)}.tablist button:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-md)}.tablist button.is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(.variant-pills) .tablist{border-bottom:none;gap:var(--ui-spacing-2);padding:var(--ui-spacing-1);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg)}:host(.variant-pills) .tablist button{border-radius:var(--ui-radius-md);min-height:var(--ui-control-height-sm);line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-sm) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2) var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}:host(.variant-pills) .tablist button:after{display:none}:host(.variant-pills) .tablist button.is-active{background:var(--ui-color-surface);color:var(--ui-color-text);box-shadow:var(--ui-shadow-sm)}:host(.variant-pills) .tablist button:hover:not(.is-disabled):not(.is-active){background:transparent;color:var(--ui-color-text)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2402
2578
|
}
|
|
2403
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2579
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTabGroup, decorators: [{
|
|
2404
2580
|
type: Component,
|
|
2405
2581
|
args: [{ selector: 'atl-tab-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
2406
2582
|
<div class="tablist" role="tablist">
|
|
@@ -2469,8 +2645,8 @@ class AtlTab {
|
|
|
2469
2645
|
ngOnDestroy() {
|
|
2470
2646
|
this.context.unregisterTab(this.id);
|
|
2471
2647
|
}
|
|
2472
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2473
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
2648
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTab, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2649
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTab, isStandalone: true, selector: "atl-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
2474
2650
|
@if (isActive()) {
|
|
2475
2651
|
<div
|
|
2476
2652
|
role="tabpanel"
|
|
@@ -2483,7 +2659,7 @@ class AtlTab {
|
|
|
2483
2659
|
}
|
|
2484
2660
|
`, isInline: true, styles: [":host{display:contents}[role=tabpanel]{padding:var(--ui-spacing-5) 0}[role=tabpanel]:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-md)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2485
2661
|
}
|
|
2486
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTab, decorators: [{
|
|
2487
2663
|
type: Component,
|
|
2488
2664
|
args: [{ selector: 'atl-tab', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
2489
2665
|
@if (isActive()) {
|
|
@@ -2565,10 +2741,10 @@ class AtlAccordionGroup {
|
|
|
2565
2741
|
event.preventDefault();
|
|
2566
2742
|
targetItem.focus();
|
|
2567
2743
|
}
|
|
2568
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2569
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
2744
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2745
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlAccordionGroup, isStandalone: true, selector: "atl-accordion-group", inputs: { multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "presentation" }, properties: { "class": "hostClassesValue" } }, providers: [{ provide: ATL_ACCORDION_GROUP, useExisting: AtlAccordionGroup }], hostDirectives: [{ directive: i1$2.CdkAccordion, inputs: ["multi", "multi"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-accordion-group){display:block;font-family:var(--ui-font-family);color:var(--ui-color-text)}:host(.atl-accordion-group.variant-default){border-top:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-item):host-context(.variant-default){border-bottom:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-group.variant-bordered){border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);overflow:hidden}:host(.atl-accordion-item:not(:last-child)):host-context(.variant-bordered){border-bottom:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-group.variant-separated){display:flex;flex-direction:column;gap:var(--ui-spacing-2)}:host(.atl-accordion-item):host-context(.variant-separated){border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);overflow:hidden}:host(.atl-accordion-item){display:block}.accordion-heading{all:unset;box-sizing:border-box;display:block}.accordion-trigger{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);width:100%;min-height:var(--ui-row-height-lg);padding-block:0;padding-inline:var(--ui-spacing-5);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);cursor:pointer;transition:background-color var(--ui-transition-fast);-webkit-user-select:none;user-select:none}.accordion-trigger:hover:not(.is-disabled){background:var(--ui-color-surface-sunken)}.accordion-trigger:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);position:relative;z-index:1}.accordion-trigger.is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}.chevron{flex-shrink:0;color:var(--ui-color-text-muted);transition:transform var(--ui-duration-normal) var(--ui-ease-out)}.chevron.is-expanded{transform:rotate(180deg)}.accordion-panel-wrapper{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--ui-duration-normal) var(--ui-ease-out)}.accordion-panel-wrapper.is-expanded{grid-template-rows:1fr}.accordion-panel{overflow:hidden}.accordion-panel-wrapper.is-expanded .accordion-panel{padding:0 var(--ui-spacing-5) var(--ui-spacing-5)}.accordion-panel-wrapper:not(.is-expanded) .accordion-panel{padding:0 var(--ui-spacing-5)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2570
2746
|
}
|
|
2571
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2747
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionGroup, decorators: [{
|
|
2572
2748
|
type: Component,
|
|
2573
2749
|
args: [{ selector: 'atl-accordion-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, hostDirectives: [{ directive: CdkAccordion, inputs: ['multi'] }], host: {
|
|
2574
2750
|
'[class]': 'hostClassesValue',
|
|
@@ -2579,10 +2755,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2579
2755
|
* Directive to mark the accordion header content.
|
|
2580
2756
|
*/
|
|
2581
2757
|
class AtlAccordionHeader {
|
|
2582
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2583
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
2758
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2759
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.5", type: AtlAccordionHeader, isStandalone: true, selector: "[atlAccordionHeader]", ngImport: i0 });
|
|
2584
2760
|
}
|
|
2585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2761
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionHeader, decorators: [{
|
|
2586
2762
|
type: Directive,
|
|
2587
2763
|
args: [{
|
|
2588
2764
|
selector: '[atlAccordionHeader]',
|
|
@@ -2676,8 +2852,8 @@ class AtlAccordionItem {
|
|
|
2676
2852
|
onKeydown(event) {
|
|
2677
2853
|
this.group.handleKeydown(event, this);
|
|
2678
2854
|
}
|
|
2679
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2680
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
2855
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2856
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlAccordionItem, isStandalone: true, selector: "atl-accordion-item", inputs: { expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "attr.data-accordion-id": "id" }, classAttribute: "atl-accordion-item" }, hostDirectives: [{ directive: i1$2.CdkAccordionItem }], ngImport: i0, template: `
|
|
2681
2857
|
<div role="heading" [attr.aria-level]="headingLevel()" class="accordion-heading">
|
|
2682
2858
|
<button
|
|
2683
2859
|
type="button"
|
|
@@ -2709,7 +2885,7 @@ class AtlAccordionItem {
|
|
|
2709
2885
|
</div>
|
|
2710
2886
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-accordion-group){display:block;font-family:var(--ui-font-family);color:var(--ui-color-text)}:host(.atl-accordion-group.variant-default){border-top:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-item):host-context(.variant-default){border-bottom:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-group.variant-bordered){border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);overflow:hidden}:host(.atl-accordion-item:not(:last-child)):host-context(.variant-bordered){border-bottom:var(--ui-border-width) solid var(--ui-color-border)}:host(.atl-accordion-group.variant-separated){display:flex;flex-direction:column;gap:var(--ui-spacing-2)}:host(.atl-accordion-item):host-context(.variant-separated){border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);overflow:hidden}:host(.atl-accordion-item){display:block}.accordion-heading{all:unset;box-sizing:border-box;display:block}.accordion-trigger{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);width:100%;min-height:var(--ui-row-height-lg);padding-block:0;padding-inline:var(--ui-spacing-5);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);cursor:pointer;transition:background-color var(--ui-transition-fast);-webkit-user-select:none;user-select:none}.accordion-trigger:hover:not(.is-disabled){background:var(--ui-color-surface-sunken)}.accordion-trigger:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);position:relative;z-index:1}.accordion-trigger.is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}.chevron{flex-shrink:0;color:var(--ui-color-text-muted);transition:transform var(--ui-duration-normal) var(--ui-ease-out)}.chevron.is-expanded{transform:rotate(180deg)}.accordion-panel-wrapper{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--ui-duration-normal) var(--ui-ease-out)}.accordion-panel-wrapper.is-expanded{grid-template-rows:1fr}.accordion-panel{overflow:hidden}.accordion-panel-wrapper.is-expanded .accordion-panel{padding:0 var(--ui-spacing-5) var(--ui-spacing-5)}.accordion-panel-wrapper:not(.is-expanded) .accordion-panel{padding:0 var(--ui-spacing-5)}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2711
2887
|
}
|
|
2712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAccordionItem, decorators: [{
|
|
2713
2889
|
type: Component,
|
|
2714
2890
|
args: [{ selector: 'atl-accordion-item', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CdkAccordionItem], template: `
|
|
2715
2891
|
<div role="heading" [attr.aria-level]="headingLevel()" class="accordion-heading">
|
|
@@ -2762,10 +2938,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2762
2938
|
* ```
|
|
2763
2939
|
*/
|
|
2764
2940
|
class AtlMenuTrigger {
|
|
2765
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2766
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
2941
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2942
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.5", type: AtlMenuTrigger, isStandalone: true, selector: "[atlMenuTriggerFor]", hostDirectives: [{ directive: i1$3.CdkMenuTrigger, inputs: ["cdkMenuTriggerFor", "atlMenuTriggerFor"] }], ngImport: i0 });
|
|
2767
2943
|
}
|
|
2768
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2944
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuTrigger, decorators: [{
|
|
2769
2945
|
type: Directive,
|
|
2770
2946
|
args: [{
|
|
2771
2947
|
selector: '[atlMenuTriggerFor]',
|
|
@@ -2801,10 +2977,10 @@ class AtlMenu {
|
|
|
2801
2977
|
/** @internal */
|
|
2802
2978
|
hostClasses = computed(() => `atl-menu variant-${this.variant()}`, /* @ts-ignore */
|
|
2803
2979
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
2804
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2805
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
2980
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenu, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2981
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlMenu, isStandalone: true, selector: "atl-menu", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, hostDirectives: [{ directive: i1$3.CdkMenu }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-menu{display:block;min-width:12rem;padding:var(--ui-spacing-2) 0;background:var(--ui-color-surface-raised);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-lg);font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-size:var(--ui-font-size-md);color:var(--ui-color-text);outline:none;overflow:hidden;animation:atl-menu-enter var(--ui-duration-normal) var(--ui-ease-out) forwards}.atl-menu.variant-compact{font-size:var(--ui-font-size-sm);padding:var(--ui-spacing-1) 0}.atl-menu.variant-compact .atl-menu-item{min-height:var(--ui-control-height-sm);line-height:var(--ui-line-height-tight);padding:calc((var(--ui-control-height-sm) - var(--ui-line-height-tight) * var(--ui-font-size-sm)) / 2) var(--ui-spacing-3)}@keyframes atl-menu-enter{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.atl-menu-item{display:flex;align-items:center;gap:var(--ui-spacing-3);min-height:var(--ui-row-height-sm);padding-block:0;padding-inline:var(--ui-spacing-4);cursor:pointer;color:var(--ui-color-text);transition:background var(--ui-transition-fast);outline:none;border:none;background:none;font:inherit;line-height:var(--ui-line-height-tight);width:100%;text-align:start}.atl-menu-item:hover,.atl-menu-item:focus-visible{background:var(--ui-color-surface-sunken)}.atl-menu-item.is-disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}.atl-menu-separator{display:block;height:1px;margin:var(--ui-spacing-2) 0;background:var(--ui-color-border);border:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2806
2982
|
}
|
|
2807
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenu, decorators: [{
|
|
2808
2984
|
type: Component,
|
|
2809
2985
|
args: [{ selector: 'atl-menu', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [CdkMenu], template: `<ng-content />`, host: {
|
|
2810
2986
|
'[class]': 'hostClasses()',
|
|
@@ -2829,15 +3005,15 @@ class AtlMenuItem {
|
|
|
2829
3005
|
/** @internal */
|
|
2830
3006
|
hasSubmenu = computed(() => !!this.menuTrigger, /* @ts-ignore */
|
|
2831
3007
|
...(ngDevMode ? [{ debugName: "hasSubmenu" }] : /* istanbul ignore next */ []));
|
|
2832
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2833
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3008
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3009
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlMenuItem, isStandalone: true, selector: "atl-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-disabled": "disabled()" }, classAttribute: "atl-menu-item" }, hostDirectives: [{ directive: i1$3.CdkMenuItem, inputs: ["cdkMenuItemDisabled", "disabled"], outputs: ["cdkMenuItemTriggered", "triggered"] }], ngImport: i0, template: `
|
|
2834
3010
|
<ng-content />
|
|
2835
3011
|
@if (hasSubmenu()) {
|
|
2836
3012
|
<span class="atl-menu-item-chevron" aria-hidden="true">›</span>
|
|
2837
3013
|
}
|
|
2838
3014
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2839
3015
|
}
|
|
2840
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3016
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuItem, decorators: [{
|
|
2841
3017
|
type: Component,
|
|
2842
3018
|
args: [{
|
|
2843
3019
|
selector: 'atl-menu-item',
|
|
@@ -2873,10 +3049,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
2873
3049
|
* ```
|
|
2874
3050
|
*/
|
|
2875
3051
|
class AtlMenuSeparator {
|
|
2876
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2877
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
3052
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3053
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlMenuSeparator, isStandalone: true, selector: "atl-menu-separator", host: { attributes: { "role": "separator" }, classAttribute: "atl-menu-separator" }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2878
3054
|
}
|
|
2879
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3055
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlMenuSeparator, decorators: [{
|
|
2880
3056
|
type: Component,
|
|
2881
3057
|
args: [{
|
|
2882
3058
|
selector: 'atl-menu-separator',
|
|
@@ -2899,10 +3075,10 @@ class AtlTooltipContent {
|
|
|
2899
3075
|
/** @internal */
|
|
2900
3076
|
tooltipId = input('', /* @ts-ignore */
|
|
2901
3077
|
...(ngDevMode ? [{ debugName: "tooltipId" }] : /* istanbul ignore next */ []));
|
|
2902
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2903
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
3078
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTooltipContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3079
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlTooltipContent, isStandalone: true, selector: "atl-tooltip-content", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, tooltipId: { classPropertyName: "tooltipId", publicName: "tooltipId", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tooltip" }, properties: { "id": "tooltipId()" }, classAttribute: "atl-tooltip" }, ngImport: i0, template: `{{ text() }}`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-tooltip{display:block;padding:var(--ui-spacing-1) var(--ui-spacing-2);background:var(--ui-color-text);color:var(--ui-color-surface);font-family:var(--ui-font-family);font-size:var(--ui-font-size-xs);line-height:var(--ui-line-height-normal);border-radius:var(--ui-radius-sm);box-shadow:var(--ui-shadow-md);max-width:20rem;word-wrap:break-word;pointer-events:none;animation:atl-tooltip-enter var(--ui-duration-fast) var(--ui-ease-out) forwards}@keyframes atl-tooltip-enter{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2904
3080
|
}
|
|
2905
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3081
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTooltipContent, decorators: [{
|
|
2906
3082
|
type: Component,
|
|
2907
3083
|
args: [{ selector: 'atl-tooltip-content', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `{{ text() }}`, host: {
|
|
2908
3084
|
class: 'atl-tooltip',
|
|
@@ -3029,10 +3205,10 @@ class AtlTooltip {
|
|
|
3029
3205
|
this.hideTimer = null;
|
|
3030
3206
|
}
|
|
3031
3207
|
}
|
|
3032
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3033
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
3208
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3209
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.5", type: AtlTooltip, isStandalone: true, selector: "[atlTooltip]", inputs: { atlTooltip: { classPropertyName: "atlTooltip", publicName: "atlTooltip", isSignal: true, isRequired: true, transformFunction: null }, atlTooltipPosition: { classPropertyName: "atlTooltipPosition", publicName: "atlTooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, atlTooltipDisabled: { classPropertyName: "atlTooltipDisabled", publicName: "atlTooltipDisabled", isSignal: true, isRequired: false, transformFunction: null }, atlTooltipShowDelay: { classPropertyName: "atlTooltipShowDelay", publicName: "atlTooltipShowDelay", isSignal: true, isRequired: false, transformFunction: null }, atlTooltipHideDelay: { classPropertyName: "atlTooltipHideDelay", publicName: "atlTooltipHideDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()", "focusin": "show()", "focusout": "hide()", "keydown.escape": "hide()" }, properties: { "attr.aria-describedby": "activeTooltipId()" } }, ngImport: i0 });
|
|
3034
3210
|
}
|
|
3035
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3211
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTooltip, decorators: [{
|
|
3036
3212
|
type: Directive,
|
|
3037
3213
|
args: [{
|
|
3038
3214
|
selector: '[atlTooltip]',
|
|
@@ -3091,10 +3267,10 @@ class AtlSkeleton {
|
|
|
3091
3267
|
return classes.join(' ');
|
|
3092
3268
|
}, /* @ts-ignore */
|
|
3093
3269
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
3094
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3095
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
3270
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3271
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlSkeleton, isStandalone: true, selector: "atl-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 }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, properties: { "class": "hostClasses()", "style.width": "width()", "style.height": "computedHeight()" } }, ngImport: i0, template: ``, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}:host{display:block;background:var(--ui-color-border);overflow:hidden;position:relative}:host(.variant-text){border-radius:var(--ui-radius-sm)}:host(.variant-circular){border-radius:var(--ui-radius-full, 9999px)}:host(.variant-rectangular){border-radius:var(--ui-radius-md)}:host(.is-animated):after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,color-mix(in srgb,var(--ui-color-surface-raised) 80%,transparent) 50%,transparent 100%);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media(prefers-reduced-motion:reduce){:host(.is-animated):after{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3096
3272
|
}
|
|
3097
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3273
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlSkeleton, decorators: [{
|
|
3098
3274
|
type: Component,
|
|
3099
3275
|
args: [{ selector: 'atl-skeleton', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: ``, host: {
|
|
3100
3276
|
'[class]': 'hostClasses()',
|
|
@@ -3155,10 +3331,10 @@ class AtlToastService {
|
|
|
3155
3331
|
this.timers.clear();
|
|
3156
3332
|
this.toasts.set([]);
|
|
3157
3333
|
}
|
|
3158
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3159
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.
|
|
3334
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3335
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToastService, providedIn: 'root' });
|
|
3160
3336
|
}
|
|
3161
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3337
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToastService, decorators: [{
|
|
3162
3338
|
type: Injectable,
|
|
3163
3339
|
args: [{ providedIn: 'root' }]
|
|
3164
3340
|
}] });
|
|
@@ -3187,8 +3363,8 @@ class AtlToast {
|
|
|
3187
3363
|
onDismiss() {
|
|
3188
3364
|
this.dismissed.emit(this.toastId());
|
|
3189
3365
|
}
|
|
3190
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3191
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3366
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToast, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3367
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlToast, isStandalone: true, selector: "atl-toast", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, toastId: { classPropertyName: "toastId", publicName: "toastId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismissed: "dismissed" }, host: { attributes: { "role": "status" }, properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
3192
3368
|
<span class="message">{{ message() }}</span>
|
|
3193
3369
|
@if (dismissible()) {
|
|
3194
3370
|
<button class="dismiss" type="button" aria-label="Dismiss" (click)="onDismiss()">
|
|
@@ -3197,7 +3373,7 @@ class AtlToast {
|
|
|
3197
3373
|
}
|
|
3198
3374
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:flex;align-items:center;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4) var(--ui-spacing-5);border-radius:var(--ui-radius-lg);border-left:4px solid transparent;font:var(--ui-type-body-sm);box-shadow:var(--ui-shadow-lg);background-color:var(--ui-color-surface-raised, var(--ui-color-surface));color:var(--ui-color-text);pointer-events:auto;min-width:18rem;max-width:100%;box-sizing:border-box;animation:toast-enter .3s ease-out}:host(.variant-default){border-left-color:var(--ui-color-border)}:host(.variant-success){border-left-color:var(--ui-color-success);background-color:color-mix(in srgb,var(--ui-color-success) 8%,var(--ui-color-surface-raised, var(--ui-color-surface)))}:host(.variant-warning){border-left-color:var(--ui-color-warning);background-color:color-mix(in srgb,var(--ui-color-warning) 8%,var(--ui-color-surface-raised, var(--ui-color-surface)))}:host(.variant-danger){border-left-color:var(--ui-color-danger);background-color:color-mix(in srgb,var(--ui-color-danger) 8%,var(--ui-color-surface-raised, var(--ui-color-surface)))}:host(.variant-info){border-left-color:var(--ui-color-info);background-color:color-mix(in srgb,var(--ui-color-info) 8%,var(--ui-color-surface-raised, var(--ui-color-surface)))}.message{flex:1}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:1.75rem;height:1.75rem;padding:0;background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted, currentColor);opacity:.7;transition:opacity var(--ui-transition-fast, .15s),background-color var(--ui-transition-fast, .15s);line-height:1}.dismiss:hover{opacity:1;background-color:color-mix(in srgb,currentColor 10%,transparent)}.dismiss:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);opacity:1}@keyframes toast-enter{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){:host{animation:none}}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3199
3375
|
}
|
|
3200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3376
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToast, decorators: [{
|
|
3201
3377
|
type: Component,
|
|
3202
3378
|
args: [{ selector: 'atl-toast', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3203
3379
|
<span class="message">{{ message() }}</span>
|
|
@@ -3231,8 +3407,8 @@ class AtlToastContainer {
|
|
|
3231
3407
|
constructor() {
|
|
3232
3408
|
this.destroyRef.onDestroy(() => this.toastService.clear());
|
|
3233
3409
|
}
|
|
3234
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3235
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3410
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToastContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3411
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlToastContainer, isStandalone: true, selector: "atl-toast-container", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-live": "polite", "role": "status" }, properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
3236
3412
|
@for (toast of toastService.toasts(); track toast.id) {
|
|
3237
3413
|
<atl-toast
|
|
3238
3414
|
[variant]="toast.variant"
|
|
@@ -3244,7 +3420,7 @@ class AtlToastContainer {
|
|
|
3244
3420
|
}
|
|
3245
3421
|
`, isInline: true, styles: [":host{position:fixed;z-index:var(--ui-z-toast, 400);display:flex;flex-direction:column;gap:var(--ui-spacing-2);pointer-events:none;max-width:min(24rem,calc(100vw - 2rem));box-sizing:border-box}:host(.position-bottom-right){bottom:var(--ui-spacing-4);right:var(--ui-spacing-4);align-items:flex-end}:host(.position-bottom-center){bottom:var(--ui-spacing-4);left:50%;transform:translate(-50%);align-items:center}:host(.position-top-right){top:var(--ui-spacing-4);right:var(--ui-spacing-4);align-items:flex-end}:host(.position-top-center){top:var(--ui-spacing-4);left:50%;transform:translate(-50%);align-items:center}\n"], dependencies: [{ kind: "component", type: AtlToast, selector: "atl-toast", inputs: ["variant", "dismissible", "message", "toastId"], outputs: ["dismissed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3246
3422
|
}
|
|
3247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3423
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlToastContainer, decorators: [{
|
|
3248
3424
|
type: Component,
|
|
3249
3425
|
args: [{ selector: 'atl-toast-container', standalone: true, imports: [AtlToast], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3250
3426
|
@for (toast of toastService.toasts(); track toast.id) {
|
|
@@ -3322,8 +3498,8 @@ class AtlAvatar {
|
|
|
3322
3498
|
untracked(() => this.showImage.set(true));
|
|
3323
3499
|
});
|
|
3324
3500
|
}
|
|
3325
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3326
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3501
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAvatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3502
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlAvatar, isStandalone: true, selector: "atl-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "img" }, properties: { "class": "hostClasses()", "attr.aria-label": "ariaLabel()" } }, ngImport: i0, template: `
|
|
3327
3503
|
<!-- eslint-disable -->
|
|
3328
3504
|
@if (src() && showImage()) {
|
|
3329
3505
|
<img [src]="src()" [alt]="alt()" (error)="showImage.set(false)" />
|
|
@@ -3337,7 +3513,7 @@ class AtlAvatar {
|
|
|
3337
3513
|
}
|
|
3338
3514
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-weight:var(--ui-font-weight-semibold);background-color:color-mix(in srgb,var(--ui-color-primary) 12%,var(--ui-color-surface-sunken));color:var(--ui-color-primary);-webkit-user-select:none;user-select:none}:host(.size-xs){width:24px;height:24px;font-size:var(--ui-font-size-2xs)}:host(.size-sm){width:32px;height:32px;font-size:var(--ui-font-size-xs)}:host(.size-md){width:40px;height:40px;font-size:var(--ui-font-size-sm)}:host(.size-lg){width:48px;height:48px;font-size:var(--ui-font-size-md)}:host(.size-xl){width:64px;height:64px;font-size:var(--ui-font-size-lg)}:host(.shape-circle){border-radius:var(--ui-radius-full)}:host(.shape-square){border-radius:var(--ui-radius-md)}img{width:100%;height:100%;object-fit:cover;display:block}.initials{line-height:1;letter-spacing:.02em}atl-icon.icon{width:55%;height:55%;opacity:.6}.status-dot{position:absolute;bottom:0;right:0;width:25%;height:25%;min-width:6px;min-height:6px;max-width:14px;max-height:14px;border-radius:var(--ui-radius-full);border:var(--ui-border-width-thick) solid var(--ui-color-surface);box-sizing:content-box}.status-dot.status-online{background-color:var(--ui-color-success)}.status-dot.status-offline{background-color:var(--ui-color-text-muted)}.status-dot.status-away{background-color:var(--ui-color-warning)}.status-dot.status-busy{background-color:var(--ui-color-danger)}:host(.group){display:inline-flex;align-items:center;background:none;overflow:visible;padding-inline-start:4px}:host-context(atl-avatar-group){box-shadow:0 0 0 2px var(--ui-color-surface);margin-inline-start:-8px}.overflow-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text-muted);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-full);font-weight:var(--ui-font-weight-semibold);box-shadow:0 0 0 2px var(--ui-color-surface);margin-inline-start:-8px}.overflow-badge.size-xs{width:24px;height:24px;font-size:var(--ui-font-size-2xs)}.overflow-badge.size-sm{width:32px;height:32px;font-size:var(--ui-font-size-xs)}.overflow-badge.size-md{width:40px;height:40px;font-size:var(--ui-font-size-sm)}.overflow-badge.size-lg{width:48px;height:48px;font-size:var(--ui-font-size-sm)}.overflow-badge.size-xl{width:64px;height:64px;font-size:var(--ui-font-size-md)}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3339
3515
|
}
|
|
3340
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAvatar, decorators: [{
|
|
3341
3517
|
type: Component,
|
|
3342
3518
|
args: [{ selector: 'atl-avatar', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3343
3519
|
<!-- eslint-disable -->
|
|
@@ -3388,15 +3564,15 @@ class AtlAvatarGroup {
|
|
|
3388
3564
|
});
|
|
3389
3565
|
});
|
|
3390
3566
|
}
|
|
3391
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3392
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3567
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAvatarGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3568
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlAvatarGroup, isStandalone: true, selector: "atl-avatar-group", inputs: { max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"group size-\" + size()" }, classAttribute: "group" }, queries: [{ propertyName: "avatarEls", predicate: AtlAvatar, read: ElementRef, isSignal: true }], ngImport: i0, template: `
|
|
3393
3569
|
<ng-content />
|
|
3394
3570
|
@if (overflowCount() > 0) {
|
|
3395
3571
|
<span [class]="'overflow-badge size-' + size()">+{{ overflowCount() }}</span>
|
|
3396
3572
|
}
|
|
3397
3573
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);font-weight:var(--ui-font-weight-semibold);background-color:color-mix(in srgb,var(--ui-color-primary) 12%,var(--ui-color-surface-sunken));color:var(--ui-color-primary);-webkit-user-select:none;user-select:none}:host(.size-xs){width:24px;height:24px;font-size:var(--ui-font-size-2xs)}:host(.size-sm){width:32px;height:32px;font-size:var(--ui-font-size-xs)}:host(.size-md){width:40px;height:40px;font-size:var(--ui-font-size-sm)}:host(.size-lg){width:48px;height:48px;font-size:var(--ui-font-size-md)}:host(.size-xl){width:64px;height:64px;font-size:var(--ui-font-size-lg)}:host(.shape-circle){border-radius:var(--ui-radius-full)}:host(.shape-square){border-radius:var(--ui-radius-md)}img{width:100%;height:100%;object-fit:cover;display:block}.initials{line-height:1;letter-spacing:.02em}atl-icon.icon{width:55%;height:55%;opacity:.6}.status-dot{position:absolute;bottom:0;right:0;width:25%;height:25%;min-width:6px;min-height:6px;max-width:14px;max-height:14px;border-radius:var(--ui-radius-full);border:var(--ui-border-width-thick) solid var(--ui-color-surface);box-sizing:content-box}.status-dot.status-online{background-color:var(--ui-color-success)}.status-dot.status-offline{background-color:var(--ui-color-text-muted)}.status-dot.status-away{background-color:var(--ui-color-warning)}.status-dot.status-busy{background-color:var(--ui-color-danger)}:host(.group){display:inline-flex;align-items:center;background:none;overflow:visible;padding-inline-start:4px}:host-context(atl-avatar-group){box-shadow:0 0 0 2px var(--ui-color-surface);margin-inline-start:-8px}.overflow-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text-muted);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-full);font-weight:var(--ui-font-weight-semibold);box-shadow:0 0 0 2px var(--ui-color-surface);margin-inline-start:-8px}.overflow-badge.size-xs{width:24px;height:24px;font-size:var(--ui-font-size-2xs)}.overflow-badge.size-sm{width:32px;height:32px;font-size:var(--ui-font-size-xs)}.overflow-badge.size-md{width:40px;height:40px;font-size:var(--ui-font-size-sm)}.overflow-badge.size-lg{width:48px;height:48px;font-size:var(--ui-font-size-sm)}.overflow-badge.size-xl{width:64px;height:64px;font-size:var(--ui-font-size-md)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3398
3574
|
}
|
|
3399
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3575
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlAvatarGroup, decorators: [{
|
|
3400
3576
|
type: Component,
|
|
3401
3577
|
args: [{ selector: 'atl-avatar-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3402
3578
|
<ng-content />
|
|
@@ -3449,14 +3625,14 @@ class AtlProgress {
|
|
|
3449
3625
|
...(ngDevMode ? [{ debugName: "fillWidth" }] : /* istanbul ignore next */ []));
|
|
3450
3626
|
hostClasses = computed(() => `variant-${this.variant()} size-${this.size()}${this.indeterminate() ? ' is-indeterminate' : ''}`, /* @ts-ignore */
|
|
3451
3627
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
3452
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3453
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
3628
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3629
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlProgress, isStandalone: true, selector: "atl-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar", "aria-valuemin": "0" }, properties: { "attr.aria-valuenow": "indeterminate() ? null : clampedValue()", "attr.aria-valuemax": "indeterminate() ? null : max()", "attr.aria-label": "label() || null", "class": "hostClasses()" } }, ngImport: i0, template: `
|
|
3454
3630
|
<div class="track">
|
|
3455
3631
|
<div class="fill" [style.width]="fillWidth()"></div>
|
|
3456
3632
|
</div>
|
|
3457
3633
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;width:100%;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.track{position:relative;width:100%;border-radius:var(--ui-radius-full);background-color:var(--ui-color-surface-sunken);overflow:hidden}:host(.size-sm) .track{height:6px}:host(.size-md) .track{height:10px}:host(.size-lg) .track{height:14px}.fill{height:100%;border-radius:var(--ui-radius-full);background-color:var(--ui-color-primary);transition:width var(--ui-transition-normal)}:host(.variant-success) .fill{background-color:var(--ui-color-success)}:host(.variant-warning) .fill{background-color:var(--ui-color-warning)}:host(.variant-danger) .fill{background-color:var(--ui-color-danger)}@keyframes progress-indeterminate{0%{transform:translate(-150%)}to{transform:translate(350%)}}:host(.is-indeterminate) .fill{width:40%!important;animation:progress-indeterminate 1.4s var(--ui-ease-in-out) infinite}@media(prefers-reduced-motion:reduce){:host(.is-indeterminate) .fill{animation:none;opacity:.5}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3458
3634
|
}
|
|
3459
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3635
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlProgress, decorators: [{
|
|
3460
3636
|
type: Component,
|
|
3461
3637
|
args: [{ selector: 'atl-progress', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3462
3638
|
<div class="track">
|
|
@@ -3511,8 +3687,8 @@ class AtlBreadcrumbs {
|
|
|
3511
3687
|
unregisterItem(id) {
|
|
3512
3688
|
this._itemIds.update((ids) => ids.filter((i) => i !== id));
|
|
3513
3689
|
}
|
|
3514
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3515
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
3690
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBreadcrumbs, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3691
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlBreadcrumbs, isStandalone: true, selector: "atl-breadcrumbs", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.--atl-separator": "separatorCssVar()" }, classAttribute: "atl-breadcrumbs" }, providers: [
|
|
3516
3692
|
{
|
|
3517
3693
|
provide: ATL_BREADCRUMBS,
|
|
3518
3694
|
useFactory: (bc) => ({
|
|
@@ -3530,7 +3706,7 @@ class AtlBreadcrumbs {
|
|
|
3530
3706
|
</nav>
|
|
3531
3707
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host(.atl-breadcrumbs){display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.list{display:flex;flex-wrap:wrap;align-items:center;gap:0;list-style:none;margin:0;padding:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-text-muted)}:host(.atl-breadcrumb-item){display:flex;align-items:center}:host(.atl-breadcrumb-item):after{content:var(--atl-separator, \"\\203a\");margin:0 var(--ui-spacing-2);color:var(--ui-color-border-hover);font-size:var(--ui-font-size-md);line-height:1}:host(.atl-breadcrumb-item.is-current):after{display:none}a{color:var(--ui-color-text-muted);text-decoration:none;border-radius:var(--ui-radius-sm);padding:var(--ui-spacing-1) var(--ui-spacing-2);margin:calc(var(--ui-spacing-1) * -1) calc(var(--ui-spacing-2) * -1);transition:color var(--ui-transition-fast),background-color var(--ui-transition-fast)}a:hover{color:var(--ui-color-text);background-color:var(--ui-color-surface-sunken)}a:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.atl-breadcrumb-item.is-current) a{color:var(--ui-color-text);font-weight:var(--ui-font-weight-semibold)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3532
3708
|
}
|
|
3533
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBreadcrumbs, decorators: [{
|
|
3534
3710
|
type: Component,
|
|
3535
3711
|
args: [{ selector: 'atl-breadcrumbs', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
3536
3712
|
{
|
|
@@ -3574,8 +3750,8 @@ class AtlBreadcrumbItem {
|
|
|
3574
3750
|
this.context.unregisterItem(this.myIndex());
|
|
3575
3751
|
}
|
|
3576
3752
|
}
|
|
3577
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3578
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
3753
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBreadcrumbItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3754
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlBreadcrumbItem, isStandalone: true, selector: "atl-breadcrumb-item", inputs: { href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-current": "isCurrent()" }, classAttribute: "atl-breadcrumb-item" }, ngImport: i0, template: `
|
|
3579
3755
|
<li class="item">
|
|
3580
3756
|
<a
|
|
3581
3757
|
[attr.href]="href() && !isCurrent() ? href() : null"
|
|
@@ -3584,7 +3760,7 @@ class AtlBreadcrumbItem {
|
|
|
3584
3760
|
</li>
|
|
3585
3761
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host(.atl-breadcrumbs){display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.list{display:flex;flex-wrap:wrap;align-items:center;gap:0;list-style:none;margin:0;padding:0;font-size:var(--ui-font-size-sm);color:var(--ui-color-text-muted)}:host(.atl-breadcrumb-item){display:flex;align-items:center}:host(.atl-breadcrumb-item):after{content:var(--atl-separator, \"\\203a\");margin:0 var(--ui-spacing-2);color:var(--ui-color-border-hover);font-size:var(--ui-font-size-md);line-height:1}:host(.atl-breadcrumb-item.is-current):after{display:none}a{color:var(--ui-color-text-muted);text-decoration:none;border-radius:var(--ui-radius-sm);padding:var(--ui-spacing-1) var(--ui-spacing-2);margin:calc(var(--ui-spacing-1) * -1) calc(var(--ui-spacing-2) * -1);transition:color var(--ui-transition-fast),background-color var(--ui-transition-fast)}a:hover{color:var(--ui-color-text);background-color:var(--ui-color-surface-sunken)}a:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.atl-breadcrumb-item.is-current) a{color:var(--ui-color-text);font-weight:var(--ui-font-weight-semibold)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3586
3762
|
}
|
|
3587
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3763
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlBreadcrumbItem, decorators: [{
|
|
3588
3764
|
type: Component,
|
|
3589
3765
|
args: [{ selector: 'atl-breadcrumb-item', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3590
3766
|
<li class="item">
|
|
@@ -3664,8 +3840,8 @@ class AtlPagination {
|
|
|
3664
3840
|
goLast() {
|
|
3665
3841
|
this.goTo(this.pageCount());
|
|
3666
3842
|
}
|
|
3667
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3668
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
3843
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlPagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3844
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlPagination, isStandalone: true, selector: "atl-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: false, transformFunction: null }, siblingCount: { classPropertyName: "siblingCount", publicName: "siblingCount", isSignal: true, isRequired: false, transformFunction: null }, showFirstLast: { classPropertyName: "showFirstLast", publicName: "showFirstLast", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange" }, ngImport: i0, template: `
|
|
3669
3845
|
<nav aria-label="Pagination">
|
|
3670
3846
|
<ul role="list" class="page-list">
|
|
3671
3847
|
@if (showFirstLast()) {
|
|
@@ -3731,7 +3907,7 @@ class AtlPagination {
|
|
|
3731
3907
|
</nav>
|
|
3732
3908
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.page-list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ui-spacing-2);list-style:none;margin:0;padding:0}.page-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;padding:0 var(--ui-spacing-2);border-radius:var(--ui-radius-md);border:var(--ui-border-width) solid transparent;background:transparent;color:var(--ui-color-text);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),color var(--ui-transition-fast)}.page-btn:hover:not(:disabled){background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.page-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}.page-btn.is-active{background-color:var(--ui-color-primary);border-color:var(--ui-color-primary);color:var(--ui-color-text-on-primary);font-weight:var(--ui-font-weight-semibold)}.page-btn.is-active:hover{background-color:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}.page-btn.is-disabled,.page-btn:disabled{opacity:var(--ui-opacity-disabled);pointer-events:none;cursor:default}.ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-sm);-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3733
3909
|
}
|
|
3734
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
3910
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlPagination, decorators: [{
|
|
3735
3911
|
type: Component,
|
|
3736
3912
|
args: [{ selector: 'atl-pagination', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3737
3913
|
<nav aria-label="Pagination">
|
|
@@ -3869,8 +4045,8 @@ class AtlDrawer {
|
|
|
3869
4045
|
this.open.set(false);
|
|
3870
4046
|
}
|
|
3871
4047
|
}
|
|
3872
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3873
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.
|
|
4048
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4049
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.5", type: AtlDrawer, isStandalone: true, selector: "atl-drawer", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [
|
|
3874
4050
|
{
|
|
3875
4051
|
provide: ATL_DRAWER,
|
|
3876
4052
|
useFactory: (drawer) => ({
|
|
@@ -3897,7 +4073,7 @@ class AtlDrawer {
|
|
|
3897
4073
|
</dialog>
|
|
3898
4074
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3899
4075
|
}
|
|
3900
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4076
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawer, decorators: [{
|
|
3901
4077
|
type: Component,
|
|
3902
4078
|
args: [{ selector: 'atl-drawer', standalone: true, imports: [A11yModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
3903
4079
|
{
|
|
@@ -3934,8 +4110,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
3934
4110
|
*/
|
|
3935
4111
|
class AtlDrawerHeader {
|
|
3936
4112
|
context = inject(ATL_DRAWER);
|
|
3937
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3938
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
4113
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4114
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDrawerHeader, isStandalone: true, selector: "atl-drawer-header", host: { properties: { "attr.id": "context.headerId" }, classAttribute: "atl-drawer-header" }, ngImport: i0, template: `
|
|
3939
4115
|
<ng-content />
|
|
3940
4116
|
<button
|
|
3941
4117
|
class="close-btn"
|
|
@@ -3947,7 +4123,7 @@ class AtlDrawerHeader {
|
|
|
3947
4123
|
</button>
|
|
3948
4124
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3949
4125
|
}
|
|
3950
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4126
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerHeader, decorators: [{
|
|
3951
4127
|
type: Component,
|
|
3952
4128
|
args: [{ selector: 'atl-drawer-header', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
3953
4129
|
<ng-content />
|
|
@@ -3968,10 +4144,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
3968
4144
|
* Content slot for `atl-drawer`. Scrollable primary content area.
|
|
3969
4145
|
*/
|
|
3970
4146
|
class AtlDrawerContent {
|
|
3971
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3972
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
4147
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4148
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDrawerContent, isStandalone: true, selector: "atl-drawer-content", host: { classAttribute: "atl-drawer-content" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3973
4149
|
}
|
|
3974
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4150
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerContent, decorators: [{
|
|
3975
4151
|
type: Component,
|
|
3976
4152
|
args: [{ selector: 'atl-drawer-content', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-drawer-content' }, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"] }]
|
|
3977
4153
|
}] });
|
|
@@ -3979,10 +4155,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
3979
4155
|
* Footer slot for `atl-drawer`. Renders at the bottom with action buttons.
|
|
3980
4156
|
*/
|
|
3981
4157
|
class AtlDrawerFooter {
|
|
3982
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
3983
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
4158
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4159
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlDrawerFooter, isStandalone: true, selector: "atl-drawer-footer", host: { classAttribute: "atl-drawer-footer" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3984
4160
|
}
|
|
3985
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4161
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlDrawerFooter, decorators: [{
|
|
3986
4162
|
type: Component,
|
|
3987
4163
|
args: [{ selector: 'atl-drawer-footer', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: { class: 'atl-drawer-footer' }, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(.atl-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, 0 20px 60px rgba(0, 0, 0, .3));color:var(--ui-color-text);overflow:hidden;transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.atl-drawer) dialog[open]{display:flex;transform:translate(0)!important}:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}@starting-style{:host(.atl-drawer) dialog[open]::backdrop{opacity:0}}@media(prefers-color-scheme:dark){:host(.atl-drawer) dialog::backdrop{background:var(--ui-color-overlay)}}:host-context([data-theme=\"dark\"]) dialog::backdrop{background:var(--ui-color-overlay)}.panel{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host(.atl-drawer.position-right) dialog{inset:0 0 0 auto;height:100dvh;transform:translate(100%)}@starting-style{:host(.atl-drawer.position-right) dialog[open]{transform:translate(100%)}}:host(.atl-drawer.position-left) dialog{inset:0 auto 0 0;height:100dvh;transform:translate(-100%)}@starting-style{:host(.atl-drawer.position-left) dialog[open]{transform:translate(-100%)}}:host(.atl-drawer.position-top) dialog{inset:0 0 auto;width:100vw;transform:translateY(-100%)}@starting-style{:host(.atl-drawer.position-top) dialog[open]{transform:translateY(-100%)}}:host(.atl-drawer.position-bottom) dialog{inset:auto 0 0;width:100vw;transform:translateY(100%)}@starting-style{:host(.atl-drawer.position-bottom) dialog[open]{transform:translateY(100%)}}:host(.atl-drawer.position-right.size-sm) dialog,:host(.atl-drawer.position-left.size-sm) dialog{width:20rem}:host(.atl-drawer.position-right.size-md) dialog,:host(.atl-drawer.position-left.size-md) dialog{width:28rem}:host(.atl-drawer.position-right.size-lg) dialog,:host(.atl-drawer.position-left.size-lg) dialog{width:40rem}:host(.atl-drawer.position-right.size-full) dialog,:host(.atl-drawer.position-left.size-full) dialog{width:100vw}:host(.atl-drawer.position-top.size-sm) dialog,:host(.atl-drawer.position-bottom.size-sm) dialog{height:12rem}:host(.atl-drawer.position-top.size-md) dialog,:host(.atl-drawer.position-bottom.size-md) dialog{height:20rem}:host(.atl-drawer.position-top.size-lg) dialog,:host(.atl-drawer.position-bottom.size-lg) dialog{height:32rem}:host(.atl-drawer.position-top.size-full) dialog,:host(.atl-drawer.position-bottom.size-full) dialog{height:100dvh}:host(.atl-drawer-header){display:flex;align-items:center;justify-content:space-between;padding:var(--ui-spacing-5) var(--ui-spacing-6);border-bottom:var(--ui-border-width) solid var(--ui-color-border);font-size:var(--ui-font-size-xl);font-weight:var(--ui-font-weight-semibold);letter-spacing:var(--ui-letter-spacing-tight);color:var(--ui-color-text);flex-shrink:0}:host(.atl-drawer-content){display:block;padding:var(--ui-spacing-6);overflow-y:auto;flex:1;color:var(--ui-color-text)}:host(.atl-drawer-footer){display:flex;align-items:center;justify-content:flex-end;gap:var(--ui-spacing-3);padding:var(--ui-spacing-5) var(--ui-spacing-6);border-top:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}.close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;margin-left:var(--ui-spacing-3);background:transparent;border:none;border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast);line-height:1}.close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}.close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}\n"] }]
|
|
3988
4164
|
}] });
|
|
@@ -4041,8 +4217,8 @@ class AtlTable {
|
|
|
4041
4217
|
return classes.join(' ');
|
|
4042
4218
|
}, /* @ts-ignore */
|
|
4043
4219
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
4044
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4045
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
4220
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4221
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlTable, isStandalone: true, selector: "atl-table", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.aria-label": "null" } }, providers: [{ provide: ATL_TABLE, useExisting: AtlTable }], ngImport: i0, template: `
|
|
4046
4222
|
<!-- The wrapper is the scrollable region — tabindex=0 lets keyboard
|
|
4047
4223
|
users scroll horizontally through wide tables. role=region +
|
|
4048
4224
|
aria-label expose it as a labelled landmark for screen readers
|
|
@@ -4059,7 +4235,7 @@ class AtlTable {
|
|
|
4059
4235
|
</div>
|
|
4060
4236
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4061
4237
|
}
|
|
4062
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTable, decorators: [{
|
|
4063
4239
|
type: Component,
|
|
4064
4240
|
args: [{ selector: 'atl-table', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4065
4241
|
<!-- The wrapper is the scrollable region — tabindex=0 lets keyboard
|
|
@@ -4078,6 +4254,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
4078
4254
|
</div>
|
|
4079
4255
|
`, host: {
|
|
4080
4256
|
'[class]': 'hostClasses()',
|
|
4257
|
+
// Same defect as atl-input.ts's identical guard: a static aria-label="…"
|
|
4258
|
+
// attribute on <atl-table> matches the aliased input above AND stays on
|
|
4259
|
+
// this host element too (Angular keeps static attributes even when they
|
|
4260
|
+
// also bind an input). The host is roleless today, so an undefended
|
|
4261
|
+
// attribute here is currently a no-op rather than a live defect — but
|
|
4262
|
+
// force it absent anyway so it stays that way once this host ever gains a
|
|
4263
|
+
// role, and so the aliased input unambiguously means "the scrollable
|
|
4264
|
+
// region's accessible name" (ADR-0091).
|
|
4265
|
+
'[attr.aria-label]': 'null',
|
|
4081
4266
|
}, providers: [{ provide: ATL_TABLE, useExisting: AtlTable }], encapsulation: ViewEncapsulation.None, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"] }]
|
|
4082
4267
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], stickyHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyHeader", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }] } });
|
|
4083
4268
|
// ---------------------------------------------------------------------------
|
|
@@ -4096,10 +4281,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
4096
4281
|
* ```
|
|
4097
4282
|
*/
|
|
4098
4283
|
class AtlThead {
|
|
4099
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4100
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
4284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlThead, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4285
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlThead, isStandalone: true, selector: "atl-thead", host: { properties: { "style.display": "\"contents\"" } }, ngImport: i0, template: `<thead><ng-content /></thead>`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4101
4286
|
}
|
|
4102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlThead, decorators: [{
|
|
4103
4288
|
type: Component,
|
|
4104
4289
|
args: [{ selector: 'atl-thead', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<thead><ng-content /></thead>`, host: { '[style.display]': '"contents"' }, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"] }]
|
|
4105
4290
|
}] });
|
|
@@ -4126,8 +4311,8 @@ class AtlTbody {
|
|
|
4126
4311
|
/** Number of columns to span in the empty-state row. Should match total column count. */
|
|
4127
4312
|
colSpan = input(1, /* @ts-ignore */
|
|
4128
4313
|
...(ngDevMode ? [{ debugName: "colSpan" }] : /* istanbul ignore next */ []));
|
|
4129
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4130
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4314
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTbody, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4315
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTbody, isStandalone: true, selector: "atl-tbody", inputs: { empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null }, colSpan: { classPropertyName: "colSpan", publicName: "colSpan", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "\"contents\"" } }, ngImport: i0, template: `
|
|
4131
4316
|
<tbody>
|
|
4132
4317
|
@if (!empty()) {
|
|
4133
4318
|
<ng-content />
|
|
@@ -4141,7 +4326,7 @@ class AtlTbody {
|
|
|
4141
4326
|
</tbody>
|
|
4142
4327
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4143
4328
|
}
|
|
4144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTbody, decorators: [{
|
|
4145
4330
|
type: Component,
|
|
4146
4331
|
args: [{ selector: 'atl-tbody', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4147
4332
|
<tbody>
|
|
@@ -4189,8 +4374,8 @@ class AtlTr {
|
|
|
4189
4374
|
/** @internal — applied to inner <tr> for CSS selection styling */
|
|
4190
4375
|
innerClasses = computed(() => this.selected() ? 'is-selected' : '', /* @ts-ignore */
|
|
4191
4376
|
...(ngDevMode ? [{ debugName: "innerClasses" }] : /* istanbul ignore next */ []));
|
|
4192
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4193
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4377
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTr, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4378
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTr, isStandalone: true, selector: "atl-tr", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, rowId: { classPropertyName: "rowId", publicName: "rowId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "class": "hostClasses()", "style.display": "\"contents\"" } }, ngImport: i0, template: `
|
|
4194
4379
|
<tr
|
|
4195
4380
|
[attr.aria-selected]="selectable() ? selected() : null"
|
|
4196
4381
|
[class]="innerClasses()"
|
|
@@ -4204,7 +4389,7 @@ class AtlTr {
|
|
|
4204
4389
|
</tr>
|
|
4205
4390
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], dependencies: [{ kind: "component", type: AtlCheckbox, selector: "atl-checkbox", inputs: ["checked", "touched", "indeterminate", "disabled", "invalid", "required", "name", "errors"], outputs: ["checkedChange", "touchedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4206
4391
|
}
|
|
4207
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4392
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTr, decorators: [{
|
|
4208
4393
|
type: Component,
|
|
4209
4394
|
args: [{ selector: 'atl-tr', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [AtlCheckbox], template: `
|
|
4210
4395
|
<tr
|
|
@@ -4280,8 +4465,8 @@ class AtlTh {
|
|
|
4280
4465
|
const next = current === null ? 'asc' : current === 'asc' ? 'desc' : null;
|
|
4281
4466
|
this.sort.emit(next);
|
|
4282
4467
|
}
|
|
4283
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4284
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4468
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTh, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4469
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlTh, isStandalone: true, selector: "atl-th", inputs: { sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, sortDirection: { classPropertyName: "sortDirection", publicName: "sortDirection", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sort: "sort" }, host: { properties: { "style.display": "\"contents\"" } }, ngImport: i0, template: `
|
|
4285
4470
|
<th
|
|
4286
4471
|
[attr.aria-sort]="ariaSort()"
|
|
4287
4472
|
[style.width]="width() ?? null"
|
|
@@ -4301,7 +4486,7 @@ class AtlTh {
|
|
|
4301
4486
|
</th>
|
|
4302
4487
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4303
4488
|
}
|
|
4304
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4489
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTh, decorators: [{
|
|
4305
4490
|
type: Component,
|
|
4306
4491
|
args: [{ selector: 'atl-th', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4307
4492
|
<th
|
|
@@ -4338,14 +4523,14 @@ class AtlTd {
|
|
|
4338
4523
|
/** Text alignment of the cell content. */
|
|
4339
4524
|
align = input('start', /* @ts-ignore */
|
|
4340
4525
|
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
4341
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4342
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
4526
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTd, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4527
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlTd, isStandalone: true, selector: "atl-td", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "\"contents\"" } }, ngImport: i0, template: `
|
|
4343
4528
|
<td [class]="'align-' + align()">
|
|
4344
4529
|
<ng-content />
|
|
4345
4530
|
</td>
|
|
4346
4531
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-table{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight);color:var(--ui-color-text)}.atl-table-wrapper{width:100%;overflow-x:auto}.atl-table table{width:100%;border-collapse:collapse}.atl-table thead th{font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text-muted);letter-spacing:var(--ui-letter-spacing-wide);text-transform:uppercase;border-bottom:var(--ui-border-width-thick) solid var(--ui-color-border);background-color:var(--ui-color-surface);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);text-align:start;white-space:nowrap}.atl-table tbody td{border-bottom:var(--ui-border-width) solid var(--ui-color-border);height:var(--ui-row-height-md);padding-block:0;padding-inline:var(--ui-spacing-4);line-height:var(--ui-line-height-tight);vertical-align:middle;background-color:var(--ui-color-surface);transition:background-color var(--ui-transition-fast)}.atl-table.size-sm thead th,.atl-table.size-sm tbody td{height:var(--ui-row-height-sm);padding-inline:var(--ui-spacing-3);font-size:var(--ui-font-size-xs)}.atl-table.size-md thead th,.atl-table.size-md tbody td{height:var(--ui-row-height-md);padding-inline:var(--ui-spacing-4);font-size:var(--ui-font-size-sm)}.atl-table.size-lg thead th,.atl-table.size-lg tbody td{height:var(--ui-row-height-lg);padding-inline:var(--ui-spacing-6);font-size:var(--ui-font-size-md)}.atl-table.variant-striped tbody atl-tr:nth-child(2n) td{background-color:var(--ui-color-surface-sunken)}.atl-table.variant-bordered thead th,.atl-table.variant-bordered tbody td{border:var(--ui-border-width) solid var(--ui-color-border)}th.align-start,td.align-start{text-align:start}th.align-center,td.align-center{text-align:center}th.align-end,td.align-end{text-align:end}.atl-table tbody tr:hover td{background-color:var(--ui-color-surface-sunken)}.atl-table tbody tr.is-selected td,.atl-table tbody tr.is-selected:hover td{background-color:var(--ui-color-primary-light)}.atl-tr-select-cell{width:2.75rem;text-align:center}.atl-tr-select-cell .atl-checkbox label{justify-content:center}.atl-table.is-sticky-header thead th{position:sticky;top:0;z-index:1;box-shadow:0 1px 0 0 var(--ui-color-border)}.atl-th-sort-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--ui-spacing-2);cursor:pointer;font:inherit;color:inherit;font-weight:inherit;width:100%}.atl-th-sort-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring);border-radius:var(--ui-radius-sm)}.atl-th-sort-icon{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.atl-table .atl-th-sort-icon atl-icon{width:.625rem;height:.5rem}.atl-th-sort-asc-arrow,.atl-th-sort-desc-arrow{opacity:.25;transition:opacity var(--ui-transition-fast)}th.is-sorted .atl-th-sort-icon{color:var(--ui-color-primary)}th.sort-asc .atl-th-sort-asc-arrow,th.sort-desc .atl-th-sort-desc-arrow{opacity:1}.atl-tbody-empty-cell{text-align:center;padding:var(--ui-spacing-12) var(--ui-spacing-4)!important;color:var(--ui-color-text-muted);font-size:var(--ui-font-size-md);background-color:var(--ui-color-surface)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4347
4532
|
}
|
|
4348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4533
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlTd, decorators: [{
|
|
4349
4534
|
type: Component,
|
|
4350
4535
|
args: [{ selector: 'atl-td', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4351
4536
|
<td [class]="'align-' + align()">
|
|
@@ -4429,8 +4614,8 @@ class AtlStepper {
|
|
|
4429
4614
|
return;
|
|
4430
4615
|
this.activeStep.set(prev);
|
|
4431
4616
|
}
|
|
4432
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4433
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4617
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4618
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlStepper, isStandalone: true, selector: "atl-stepper", inputs: { activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeStep: "activeStepChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [{ provide: ATL_STEPPER, useExisting: AtlStepper }], ngImport: i0, template: `
|
|
4434
4619
|
<div class="stepper-header" role="tablist">
|
|
4435
4620
|
@for (step of steps(); track step.id; let i = $index; let last = $last) {
|
|
4436
4621
|
<div
|
|
@@ -4484,7 +4669,7 @@ class AtlStepper {
|
|
|
4484
4669
|
</div>
|
|
4485
4670
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{display:block;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.stepper-header{display:flex;align-items:center}.step-item{display:flex;flex-direction:column;align-items:center;min-width:0}.step-connector{flex:1;height:var(--step-connector-width);background:var(--ui-color-border);border-radius:var(--ui-radius-full);transition:background var(--ui-transition-normal) var(--ui-ease-out);min-width:var(--ui-spacing-4)}.step-connector.is-active{background:var(--ui-color-primary)}.step-circle{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:var(--step-circle);height:var(--step-circle);border-radius:50%;border:var(--ui-border-width-thick) solid var(--ui-color-border);background:var(--ui-color-surface);color:var(--ui-color-text-muted);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-semibold);cursor:pointer;transition:var(--ui-transition-normal) var(--ui-ease-out);transition-property:border-color,background-color,color,box-shadow;-webkit-user-select:none;user-select:none;flex-shrink:0}.step-circle:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}.step-circle:disabled{cursor:not-allowed}.step-text{display:flex;flex-direction:column;align-items:center;margin-top:var(--ui-spacing-2);text-align:center}.step-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text-muted);white-space:nowrap}.step-description{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted);margin-top:2px}.step-optional{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted);font-style:italic;margin-top:2px}.stepper-content{margin-top:var(--ui-spacing-6)}.stepper-content [role=tabpanel][hidden]{display:none}.step-item.is-active .step-circle{border-color:var(--ui-color-primary);color:var(--ui-color-primary)}.step-item.is-active .step-label{color:var(--ui-color-text);font-weight:var(--ui-font-weight-semibold)}.step-item.is-completed .step-circle{border-color:var(--ui-color-primary);background:var(--ui-color-primary);color:var(--ui-color-text-on-primary)}.step-item.is-completed .step-label{color:var(--ui-color-text)}.step-item.is-error .step-circle{border-color:var(--ui-color-danger);background:var(--ui-color-danger);color:var(--ui-color-text-on-danger, #ffffff)}.step-item.is-error .step-label{color:var(--ui-color-danger)}.step-item.is-disabled .step-circle{opacity:var(--ui-opacity-disabled);cursor:not-allowed}.step-item.is-disabled .step-label{opacity:var(--ui-opacity-disabled)}:host(.orientation-vertical) .stepper-header{flex-direction:column;align-items:stretch}:host(.orientation-vertical) .step-item{flex-direction:row;align-items:flex-start;gap:var(--ui-spacing-3)}:host(.orientation-vertical) .step-text{align-items:flex-start;text-align:left;margin-top:0;padding-top:var(--ui-spacing-1)}:host(.orientation-vertical) .step-connector{flex:none;width:var(--step-connector-width);height:var(--ui-spacing-6);margin-left:calc((var(--step-circle) - var(--step-connector-width)) / 2);min-width:0}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4486
4671
|
}
|
|
4487
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4672
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlStepper, decorators: [{
|
|
4488
4673
|
type: Component,
|
|
4489
4674
|
args: [{ selector: 'atl-stepper', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4490
4675
|
<div class="stepper-header" role="tablist">
|
|
@@ -4608,8 +4793,8 @@ class AtlStep {
|
|
|
4608
4793
|
ngOnDestroy() {
|
|
4609
4794
|
this.context.unregisterStep(this.id);
|
|
4610
4795
|
}
|
|
4611
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4612
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4796
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlStep, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4797
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlStep, isStandalone: true, selector: "atl-step", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, completed: { classPropertyName: "completed", publicName: "completed", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
4613
4798
|
@if (isActive()) {
|
|
4614
4799
|
<div
|
|
4615
4800
|
role="tabpanel"
|
|
@@ -4622,7 +4807,7 @@ class AtlStep {
|
|
|
4622
4807
|
}
|
|
4623
4808
|
`, isInline: true, styles: [":host{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4624
4809
|
}
|
|
4625
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4810
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlStep, decorators: [{
|
|
4626
4811
|
type: Component,
|
|
4627
4812
|
args: [{ selector: 'atl-step', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4628
4813
|
@if (isActive()) {
|
|
@@ -4676,8 +4861,8 @@ class AtlCodeBlock {
|
|
|
4676
4861
|
setTimeout(() => this.copied.set(false), 1800);
|
|
4677
4862
|
});
|
|
4678
4863
|
}
|
|
4679
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4680
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
4864
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCodeBlock, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4865
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlCodeBlock, isStandalone: true, selector: "atl-code-block", inputs: { code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: false, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, filename: { classPropertyName: "filename", publicName: "filename", isSignal: true, isRequired: false, transformFunction: null }, copyable: { classPropertyName: "copyable", publicName: "copyable", isSignal: true, isRequired: false, transformFunction: null }, showLineNumbers: { classPropertyName: "showLineNumbers", publicName: "showLineNumbers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"atl-code-block\"" } }, ngImport: i0, template: `
|
|
4681
4866
|
<div class="code-block-header">
|
|
4682
4867
|
<span class="code-block-label">{{ displayLabel() }}</span>
|
|
4683
4868
|
@if (copyable()) {
|
|
@@ -4711,7 +4896,7 @@ class AtlCodeBlock {
|
|
|
4711
4896
|
</div>
|
|
4712
4897
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}.atl-code-block{display:block;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);overflow:hidden;font-family:var(--ui-font-family);line-height:var(--ui-line-height-tight)}.code-block-header{display:flex;align-items:center;justify-content:space-between;line-height:var(--ui-line-height-tight);padding:0 var(--ui-spacing-4);background:var(--ui-color-surface-raised);border-bottom:var(--ui-border-width) solid var(--ui-color-border);min-height:var(--ui-control-height-md)}.code-block-label{font-family:var(--ui-font-mono);font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-semibold);letter-spacing:.03em;color:var(--ui-color-text-muted);text-transform:lowercase;-webkit-user-select:none;user-select:none}.code-block-copy{display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-1) var(--ui-spacing-2);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:transparent;color:var(--ui-color-text-muted);font-family:inherit;font-size:var(--ui-font-size-xs);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:color var(--ui-transition-fast),background var(--ui-transition-fast),border-color var(--ui-transition-fast);white-space:nowrap}.code-block-copy:hover{color:var(--ui-color-text);background:var(--ui-color-surface);border-color:var(--ui-color-input-border)}.code-block-copy:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}.code-block-body{background:var(--ui-color-surface);overflow-x:auto}.code-block-pre{margin:0;padding:var(--ui-spacing-4);font:var(--ui-type-code);color:var(--ui-color-text);white-space:pre;tab-size:2}.code-line{display:flex}.code-line-number{display:inline-block;min-width:2rem;padding-right:var(--ui-spacing-3);color:var(--ui-color-text-muted);text-align:right;-webkit-user-select:none;user-select:none;border-right:var(--ui-border-width) solid var(--ui-color-border);margin-right:var(--ui-spacing-3);flex-shrink:0;opacity:.6}.code-line-text{flex:1}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4713
4898
|
}
|
|
4714
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
4899
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlCodeBlock, decorators: [{
|
|
4715
4900
|
type: Component,
|
|
4716
4901
|
args: [{ selector: 'atl-code-block', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4717
4902
|
<div class="code-block-header">
|
|
@@ -4836,8 +5021,8 @@ class AtlChat {
|
|
|
4836
5021
|
this.open.set(false);
|
|
4837
5022
|
}
|
|
4838
5023
|
}
|
|
4839
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4840
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
5024
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChat, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5025
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlChat, isStandalone: true, selector: "atl-chat", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [
|
|
4841
5026
|
{
|
|
4842
5027
|
provide: ATL_CHAT,
|
|
4843
5028
|
useFactory: (chat) => ({
|
|
@@ -4893,7 +5078,7 @@ class AtlChat {
|
|
|
4893
5078
|
}
|
|
4894
5079
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4895
5080
|
}
|
|
4896
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5081
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChat, decorators: [{
|
|
4897
5082
|
type: Component,
|
|
4898
5083
|
args: [{ selector: 'atl-chat', standalone: true, imports: [A11yModule, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
4899
5084
|
{
|
|
@@ -4959,8 +5144,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
4959
5144
|
*/
|
|
4960
5145
|
class AtlChatHeader {
|
|
4961
5146
|
context = inject(ATL_CHAT);
|
|
4962
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
4963
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
5147
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5148
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlChatHeader, isStandalone: true, selector: "atl-chat-header", host: { properties: { "attr.id": "context.headerId" } }, ngImport: i0, template: `
|
|
4964
5149
|
<div class="title-block">
|
|
4965
5150
|
<ng-content />
|
|
4966
5151
|
</div>
|
|
@@ -4976,7 +5161,7 @@ class AtlChatHeader {
|
|
|
4976
5161
|
}
|
|
4977
5162
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], dependencies: [{ kind: "component", type: AtlIcon, selector: "atl-icon", inputs: ["name", "size", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4978
5163
|
}
|
|
4979
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5164
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatHeader, decorators: [{
|
|
4980
5165
|
type: Component,
|
|
4981
5166
|
args: [{ selector: 'atl-chat-header', standalone: true, imports: [AtlIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4982
5167
|
<div class="title-block">
|
|
@@ -5015,10 +5200,10 @@ class AtlChatMessages {
|
|
|
5015
5200
|
this.destroyRef.onDestroy(() => observer.disconnect());
|
|
5016
5201
|
});
|
|
5017
5202
|
}
|
|
5018
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
5019
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
5203
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatMessages, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5204
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: AtlChatMessages, isStandalone: true, selector: "atl-chat-messages", ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5020
5205
|
}
|
|
5021
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5206
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatMessages, decorators: [{
|
|
5022
5207
|
type: Component,
|
|
5023
5208
|
args: [{ selector: 'atl-chat-messages', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"] }]
|
|
5024
5209
|
}], ctorParameters: () => [] });
|
|
@@ -5041,10 +5226,10 @@ class AtlChatMessage {
|
|
|
5041
5226
|
...(ngDevMode ? [{ debugName: "failed" }] : /* istanbul ignore next */ []));
|
|
5042
5227
|
hostClasses = computed(() => `role-${this.role()}${this.failed() ? ' is-failed' : ''}`, /* @ts-ignore */
|
|
5043
5228
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
5044
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
5045
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
5229
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatMessage, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5230
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlChatMessage, isStandalone: true, selector: "atl-chat-message", inputs: { role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, failed: { classPropertyName: "failed", publicName: "failed", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.role": "\"listitem\"" } }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5046
5231
|
}
|
|
5047
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5232
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatMessage, decorators: [{
|
|
5048
5233
|
type: Component,
|
|
5049
5234
|
args: [{ selector: 'atl-chat-message', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `<ng-content />`, host: {
|
|
5050
5235
|
'[class]': 'hostClasses()',
|
|
@@ -5069,15 +5254,15 @@ class AtlChatTyping {
|
|
|
5069
5254
|
...(ngDevMode ? [{ debugName: "inline" }] : /* istanbul ignore next */ []));
|
|
5070
5255
|
hostClasses = computed(() => this.inline() ? 'is-inline' : '', /* @ts-ignore */
|
|
5071
5256
|
...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
5072
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
5073
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.
|
|
5257
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatTyping, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5258
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: AtlChatTyping, isStandalone: true, selector: "atl-chat-typing", inputs: { inline: { classPropertyName: "inline", publicName: "inline", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.role": "\"status\"", "attr.aria-live": "\"polite\"" } }, ngImport: i0, template: `
|
|
5074
5259
|
<span class="dot"></span>
|
|
5075
5260
|
<span class="dot"></span>
|
|
5076
5261
|
<span class="dot"></span>
|
|
5077
5262
|
<span class="sr-only">Assistant is typing</span>
|
|
5078
5263
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5079
5264
|
}
|
|
5080
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatTyping, decorators: [{
|
|
5081
5266
|
type: Component,
|
|
5082
5267
|
args: [{ selector: 'atl-chat-typing', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
5083
5268
|
<span class="dot"></span>
|
|
@@ -5107,8 +5292,8 @@ class AtlChatSuggestion {
|
|
|
5107
5292
|
...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
5108
5293
|
/** Fires the label string when the chip is activated. */
|
|
5109
5294
|
selected = output();
|
|
5110
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
5111
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
5295
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatSuggestion, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlChatSuggestion, isStandalone: true, selector: "atl-chat-suggestion", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected" }, ngImport: i0, template: `
|
|
5112
5297
|
<button type="button" class="chip" (click)="selected.emit(label())">
|
|
5113
5298
|
<span class="chip-label">{{ label() }}</span>
|
|
5114
5299
|
@if (hint()) {
|
|
@@ -5117,7 +5302,7 @@ class AtlChatSuggestion {
|
|
|
5117
5302
|
</button>
|
|
5118
5303
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5119
5304
|
}
|
|
5120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatSuggestion, decorators: [{
|
|
5121
5306
|
type: Component,
|
|
5122
5307
|
args: [{ selector: 'atl-chat-suggestion', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
5123
5308
|
<button type="button" class="chip" (click)="selected.emit(label())">
|
|
@@ -5189,8 +5374,8 @@ class AtlChatInput {
|
|
|
5189
5374
|
this.send.emit(text);
|
|
5190
5375
|
this.value.set('');
|
|
5191
5376
|
}
|
|
5192
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
5193
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
5377
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5378
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: AtlChatInput, isStandalone: true, selector: "atl-chat-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", send: "send", stop: "stop" }, ngImport: i0, template: `
|
|
5194
5379
|
<textarea
|
|
5195
5380
|
class="field"
|
|
5196
5381
|
[value]="value()"
|
|
@@ -5221,7 +5406,7 @@ class AtlChatInput {
|
|
|
5221
5406
|
}
|
|
5222
5407
|
`, isInline: true, styles: [":host,:host *{box-sizing:border-box}:host{font-family:var(--ui-font-family);line-height:var(--ui-line-height-normal)}:host(atl-chat){display:contents}.surface{display:flex;flex-direction:column;background:var(--ui-color-surface);color:var(--ui-color-text);overflow:hidden}:host(.variant-drawer) dialog{all:unset;box-sizing:border-box;font-family:var(--ui-font-family);position:fixed;inset:0 0 0 auto;height:100dvh;width:28rem;display:none;flex-direction:column;background:var(--ui-color-surface);box-shadow:var(--ui-shadow-xl, -8px 0 32px rgba(0, 0, 0, .12));color:var(--ui-color-text);overflow:hidden;transform:translate(100%);transition:transform var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) dialog[open]{display:flex;transform:translate(0)}@starting-style{:host(.variant-drawer) dialog[open]{transform:translate(100%)}}:host(.variant-drawer) dialog::backdrop{background:var(--ui-color-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--ui-duration-slow) var(--ui-ease-out, ease-out),display var(--ui-duration-slow) allow-discrete,overlay var(--ui-duration-slow) allow-discrete}:host(.variant-drawer) .drawer-surface{width:100%;height:100%}:host(.variant-popup) .popup-surface{position:fixed;bottom:calc(var(--ui-spacing-6) + 3.5rem + var(--ui-spacing-4));right:var(--ui-spacing-6);width:23.75rem;height:35rem;border-radius:var(--ui-radius-xl);box-shadow:0 12px 32px #0000002e;z-index:var(--ui-z-dropdown)}:host(.variant-popup) .fab-bubble{position:fixed;bottom:var(--ui-spacing-6);right:var(--ui-spacing-6);width:3.5rem;height:3.5rem;border-radius:var(--ui-radius-full);background:var(--ui-color-brand-ai, #b5e61c);color:var(--ui-color-text);border:none;font-size:var(--ui-font-size-lg);font-weight:var(--ui-font-weight-semibold);cursor:pointer;box-shadow:0 6px 16px #0000002e;transition:transform var(--ui-transition-fast),box-shadow var(--ui-transition-fast);z-index:101}:host(.variant-popup) .fab-bubble:hover{transform:scale(1.05);box-shadow:0 8px 20px #00000038}:host(.variant-popup) .fab-bubble:focus-visible{outline:none;box-shadow:var(--ui-focus-ring),0 6px 16px #0000002e}:host(.variant-inline) .inline-surface{width:100%;height:100%;min-height:24rem;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-xl)}:host(.variant-inline) atl-chat-header .close-btn{display:none}:host(atl-chat-header){display:flex;align-items:center;justify-content:space-between;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-bottom:var(--ui-border-width) solid var(--ui-color-border);flex-shrink:0}:host(atl-chat-header) .title-block{display:flex;align-items:center;gap:var(--ui-spacing-3);font-size:var(--ui-font-size-md);font-weight:var(--ui-font-weight-semibold);color:var(--ui-color-text);letter-spacing:var(--ui-letter-spacing-tight);flex:1;min-width:0}:host(atl-chat-header) .close-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ui-control-height-sm);height:var(--ui-control-height-sm);padding:0;background:transparent;border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;color:var(--ui-color-text-muted);transition:background-color var(--ui-transition-fast),color var(--ui-transition-fast)}:host(atl-chat-header) .close-btn:hover{background-color:var(--ui-color-surface-sunken);color:var(--ui-color-text)}:host(atl-chat-header) .close-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-messages){display:flex;flex-direction:column;gap:var(--ui-spacing-3);padding:var(--ui-spacing-4);overflow-y:auto;overflow-anchor:auto;scroll-behavior:smooth;flex:1;background:var(--ui-color-surface)}:host(atl-chat-message){display:block;max-width:85%;padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-lg);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);word-wrap:break-word}:host(atl-chat-message.role-assistant),:host(atl-chat-message.role-system){background:var(--ui-color-surface-sunken);color:var(--ui-color-text);align-self:flex-start}:host(atl-chat-message.role-user){background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);align-self:flex-end}:host(atl-chat-message.role-system){font-style:italic;color:var(--ui-color-text-muted)}:host(atl-chat-message.is-failed){background:var(--ui-color-surface-sunken);border:var(--ui-border-width) dashed var(--ui-color-danger);color:var(--ui-color-text)}:host(atl-chat-typing){display:inline-flex;align-items:center;gap:var(--ui-spacing-1);padding:var(--ui-spacing-2) var(--ui-spacing-3);background:var(--ui-color-surface-sunken);border-radius:var(--ui-radius-lg);align-self:flex-start}:host(atl-chat-typing) .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--ui-color-text-muted);animation:atl-chat-typing 1.4s infinite ease-in-out}:host(atl-chat-typing) .dot:nth-child(2){animation-delay:.16s}:host(atl-chat-typing) .dot:nth-child(3){animation-delay:.32s}:host(atl-chat-typing.is-inline){display:inline-flex;padding:0;margin-left:var(--ui-spacing-1);background:transparent;border-radius:0;vertical-align:baseline;align-self:auto}:host(atl-chat-typing.is-inline) .dot{width:.25rem;height:.25rem}@keyframes atl-chat-typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){:host(atl-chat-typing) .dot{animation:none;opacity:.6}}:host(atl-chat-typing) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host(atl-chat-suggestion){display:block}:host(atl-chat-suggestion) .chip{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ui-spacing-1);width:100%;padding:var(--ui-spacing-3) var(--ui-spacing-4);background:var(--ui-color-surface);color:var(--ui-color-text);border:var(--ui-border-width) solid var(--ui-color-border);border-radius:var(--ui-radius-lg);text-align:left;cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast)}:host(atl-chat-suggestion) .chip:hover{background-color:var(--ui-color-surface-sunken);border-color:var(--ui-color-border-hover)}:host(atl-chat-suggestion) .chip:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(atl-chat-suggestion) .chip-label{font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);color:var(--ui-color-text)}:host(atl-chat-suggestion) .chip-hint{font-size:var(--ui-font-size-xs);color:var(--ui-color-text-muted)}:host(atl-chat-input){display:flex;align-items:flex-end;gap:var(--ui-spacing-2);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-top:var(--ui-border-width) solid var(--ui-color-border);background:var(--ui-color-surface);flex-shrink:0}:host(atl-chat-input) .field{flex:1;min-width:0;padding:var(--ui-spacing-2) var(--ui-spacing-3);border:var(--ui-border-width) solid var(--ui-color-input-border, var(--ui-color-border));border-radius:var(--ui-radius-md);background:var(--ui-color-surface-sunken);color:var(--ui-color-text);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);resize:none;transition:border-color var(--ui-transition-fast)}:host(atl-chat-input) .field::placeholder{color:var(--ui-color-text-muted)}:host(atl-chat-input) .field:hover:not(:disabled){border-color:var(--ui-color-input-border-hover, var(--ui-color-border-hover))}:host(atl-chat-input) .field:focus-visible{outline:none;border-color:var(--ui-color-primary);box-shadow:var(--ui-focus-ring)}:host(atl-chat-input) .field:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:var(--ui-spacing-2) var(--ui-spacing-4);border:var(--ui-border-width) solid transparent;border-radius:var(--ui-radius-md);font-size:var(--ui-font-size-sm);font-weight:var(--ui-font-weight-medium);cursor:pointer;transition:background-color var(--ui-transition-fast),border-color var(--ui-transition-fast),transform var(--ui-transition-fast)}:host(atl-chat-input) .action-btn.variant-primary{background:var(--ui-color-primary);color:var(--ui-color-text-on-primary);border-color:var(--ui-color-primary)}:host(atl-chat-input) .action-btn.variant-primary:hover:not(:disabled){background:var(--ui-color-primary-hover);border-color:var(--ui-color-primary-hover)}:host(atl-chat-input) .action-btn.variant-danger{background:var(--ui-color-danger);color:var(--ui-color-text-on-danger);border-color:var(--ui-color-danger)}:host(atl-chat-input) .action-btn.variant-danger:hover{background:var(--ui-color-danger-hover);border-color:var(--ui-color-danger-hover)}:host(atl-chat-input) .action-btn:disabled{opacity:var(--ui-opacity-disabled);cursor:not-allowed}:host(atl-chat-input) .action-btn:focus-visible{outline:none;box-shadow:var(--ui-focus-ring)}:host(.status-streaming) atl-chat-input .field{cursor:wait}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5223
5408
|
}
|
|
5224
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
5409
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: AtlChatInput, decorators: [{
|
|
5225
5410
|
type: Component,
|
|
5226
5411
|
args: [{ selector: 'atl-chat-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
5227
5412
|
<textarea
|