@atelier-ui/angular 0.0.22 → 0.0.23
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.
|
@@ -146,21 +146,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
146
146
|
* <llm-badge variant="warning">Pending</llm-badge>
|
|
147
147
|
* ```
|
|
148
148
|
*/
|
|
149
|
+
const VARIANT_ICONS$1 = {
|
|
150
|
+
default: null,
|
|
151
|
+
success: '✓',
|
|
152
|
+
warning: '⚠',
|
|
153
|
+
danger: '✕',
|
|
154
|
+
info: 'ℹ',
|
|
155
|
+
};
|
|
149
156
|
class LlmBadge {
|
|
150
157
|
/** Semantic color variant of the badge. */
|
|
151
158
|
variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
152
159
|
/** Size of the badge. */
|
|
153
160
|
size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
154
161
|
hostClasses = computed(() => `variant-${this.variant()} size-${this.size()}`, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
162
|
+
variantIcon = computed(() => VARIANT_ICONS$1[this.variant()], ...(ngDevMode ? [{ debugName: "variantIcon" }] : /* istanbul ignore next */ []));
|
|
155
163
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LlmBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
156
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
164
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: LlmBadge, isStandalone: true, selector: "llm-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: `
|
|
165
|
+
@if (variantIcon(); as icon) {
|
|
166
|
+
<span class="variant-icon" aria-hidden="true">{{ icon }}</span>
|
|
167
|
+
}
|
|
168
|
+
<ng-content />
|
|
169
|
+
`, isInline: true, styles: [":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:.01em}: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:1px solid var(--ui-color-border)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border:1px 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:1px 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:1px 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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}.variant-icon{font-weight:700;margin-right:.3em;line-height:1}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
157
170
|
}
|
|
158
171
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LlmBadge, decorators: [{
|
|
159
172
|
type: Component,
|
|
160
|
-
args: [{ selector: 'llm-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template:
|
|
173
|
+
args: [{ selector: 'llm-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
174
|
+
@if (variantIcon(); as icon) {
|
|
175
|
+
<span class="variant-icon" aria-hidden="true">{{ icon }}</span>
|
|
176
|
+
}
|
|
177
|
+
<ng-content />
|
|
178
|
+
`, host: {
|
|
161
179
|
'[class]': 'hostClasses()',
|
|
162
180
|
role: 'status',
|
|
163
|
-
}, styles: [":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:.01em}: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:1px solid var(--ui-color-border)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border:1px 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:1px 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:1px 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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}
|
|
181
|
+
}, styles: [":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:.01em}: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:1px solid var(--ui-color-border)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border:1px 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:1px 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:1px 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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}.variant-icon{font-weight:700;margin-right:.3em;line-height:1}\n"] }]
|
|
164
182
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
165
183
|
|
|
166
184
|
let nextId$c = 0;
|
|
@@ -861,6 +879,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
861
879
|
* </llm-alert>
|
|
862
880
|
* ```
|
|
863
881
|
*/
|
|
882
|
+
const VARIANT_ICONS = {
|
|
883
|
+
info: 'ℹ',
|
|
884
|
+
success: '✓',
|
|
885
|
+
warning: '⚠',
|
|
886
|
+
danger: '✕',
|
|
887
|
+
};
|
|
864
888
|
class LlmAlert {
|
|
865
889
|
/** Semantic color variant of the alert. */
|
|
866
890
|
variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
@@ -869,6 +893,7 @@ class LlmAlert {
|
|
|
869
893
|
/** Emitted when the dismiss button is clicked. */
|
|
870
894
|
dismissed = output();
|
|
871
895
|
hostClasses = computed(() => `variant-${this.variant()}`, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
|
|
896
|
+
variantIcon = computed(() => VARIANT_ICONS[this.variant()], ...(ngDevMode ? [{ debugName: "variantIcon" }] : /* istanbul ignore next */ []));
|
|
872
897
|
/** @internal */
|
|
873
898
|
get isDismissible() {
|
|
874
899
|
return this.dismissible();
|
|
@@ -886,7 +911,10 @@ class LlmAlert {
|
|
|
886
911
|
}
|
|
887
912
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LlmAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
888
913
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: LlmAlert, isStandalone: true, selector: "llm-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: `
|
|
889
|
-
<span class="content"
|
|
914
|
+
<span class="content">
|
|
915
|
+
<span class="variant-icon" aria-hidden="true">{{ variantIcon() }}</span>
|
|
916
|
+
<ng-content />
|
|
917
|
+
</span>
|
|
890
918
|
@if (isDismissible) {
|
|
891
919
|
<button class="dismiss" type="button" aria-label="Dismiss" (click)="dismiss()">
|
|
892
920
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
@@ -895,12 +923,15 @@ class LlmAlert {
|
|
|
895
923
|
</svg>
|
|
896
924
|
</button>
|
|
897
925
|
}
|
|
898
|
-
`, isInline: true, styles: [":host{display:flex;align-items:flex-start;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-md);border:1px solid transparent;font-family:var(--ui-font-family);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border-color:1px 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-color:1px 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-color:1px solid color-mix(in srgb,var(--ui-color-danger-text) 25%,transparent)}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.125rem;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}
|
|
926
|
+
`, isInline: true, styles: [":host{display:flex;align-items:flex-start;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-md);border:1px solid transparent;font-family:var(--ui-font-family);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border-color:1px 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-color:1px 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-color:1px solid color-mix(in srgb,var(--ui-color-danger-text) 25%,transparent)}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.125rem;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:700;margin-right:.4em;line-height:1}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
899
927
|
}
|
|
900
928
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LlmAlert, decorators: [{
|
|
901
929
|
type: Component,
|
|
902
930
|
args: [{ selector: 'llm-alert', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
903
|
-
<span class="content"
|
|
931
|
+
<span class="content">
|
|
932
|
+
<span class="variant-icon" aria-hidden="true">{{ variantIcon() }}</span>
|
|
933
|
+
<ng-content />
|
|
934
|
+
</span>
|
|
904
935
|
@if (isDismissible) {
|
|
905
936
|
<button class="dismiss" type="button" aria-label="Dismiss" (click)="dismiss()">
|
|
906
937
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
@@ -913,7 +944,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
913
944
|
'[class]': 'hostClassesValue',
|
|
914
945
|
role: 'alert',
|
|
915
946
|
'[attr.aria-live]': 'ariaLive',
|
|
916
|
-
}, styles: [":host{display:flex;align-items:flex-start;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-md);border:1px solid transparent;font-family:var(--ui-font-family);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border-color:1px 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-color:1px 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-color:1px solid color-mix(in srgb,var(--ui-color-danger-text) 25%,transparent)}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.125rem;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}
|
|
947
|
+
}, styles: [":host{display:flex;align-items:flex-start;gap:var(--ui-spacing-3);padding:var(--ui-spacing-3) var(--ui-spacing-4);border-radius:var(--ui-radius-md);border:1px solid transparent;font-family:var(--ui-font-family);font-size:var(--ui-font-size-sm);line-height:var(--ui-line-height-normal);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:1px solid color-mix(in srgb,var(--ui-color-info-text) 25%,transparent)}:host(.variant-success){background-color:var(--ui-color-success-bg);color:var(--ui-color-success-text);border-color:1px 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-color:1px 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-color:1px solid color-mix(in srgb,var(--ui-color-danger-text) 25%,transparent)}.dismiss{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.125rem;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:700;margin-right:.4em;line-height:1}\n"] }]
|
|
917
948
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], dismissed: [{ type: i0.Output, args: ["dismissed"] }] } });
|
|
918
949
|
|
|
919
950
|
const LLM_SELECT = new InjectionToken('LLM_SELECT');
|