@a2ui/angular 0.8.1 → 0.8.3
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.
- package/fesm2022/a2ui-angular-audio-DoZb9mn_.mjs +48 -0
- package/fesm2022/a2ui-angular-audio-DoZb9mn_.mjs.map +1 -0
- package/fesm2022/a2ui-angular-button-CvH0kAtN.mjs +61 -0
- package/fesm2022/a2ui-angular-button-CvH0kAtN.mjs.map +1 -0
- package/fesm2022/a2ui-angular-card-Ix6OIdUv.mjs +48 -0
- package/fesm2022/a2ui-angular-card-Ix6OIdUv.mjs.map +1 -0
- package/fesm2022/a2ui-angular-checkbox-BN4EF2Ci.mjs +78 -0
- package/fesm2022/a2ui-angular-checkbox-BN4EF2Ci.mjs.map +1 -0
- package/fesm2022/a2ui-angular-datetime-input-dmZAjvrF.mjs +120 -0
- package/fesm2022/a2ui-angular-datetime-input-dmZAjvrF.mjs.map +1 -0
- package/fesm2022/a2ui-angular-divider-BizPl3qL.mjs +30 -0
- package/fesm2022/a2ui-angular-divider-BizPl3qL.mjs.map +1 -0
- package/fesm2022/a2ui-angular-icon-BE9Hj9V6.mjs +48 -0
- package/fesm2022/a2ui-angular-icon-BE9Hj9V6.mjs.map +1 -0
- package/fesm2022/a2ui-angular-image-BWzAw0rh.mjs +54 -0
- package/fesm2022/a2ui-angular-image-BWzAw0rh.mjs.map +1 -0
- package/fesm2022/a2ui-angular-list-nEeT59V3.mjs +45 -0
- package/fesm2022/a2ui-angular-list-nEeT59V3.mjs.map +1 -0
- package/fesm2022/a2ui-angular-modal-mr9LmczA.mjs +108 -0
- package/fesm2022/a2ui-angular-modal-mr9LmczA.mjs.map +1 -0
- package/fesm2022/a2ui-angular-multiple-choice-Bry7X74i.mjs +78 -0
- package/fesm2022/a2ui-angular-multiple-choice-Bry7X74i.mjs.map +1 -0
- package/fesm2022/a2ui-angular-slider-BgseUbN2.mjs +79 -0
- package/fesm2022/a2ui-angular-slider-BgseUbN2.mjs.map +1 -0
- package/fesm2022/a2ui-angular-tabs-q5Mn9vgq.mjs +87 -0
- package/fesm2022/a2ui-angular-tabs-q5Mn9vgq.mjs.map +1 -0
- package/fesm2022/a2ui-angular-text-field-Deokh07j.mjs +85 -0
- package/fesm2022/a2ui-angular-text-field-Deokh07j.mjs.map +1 -0
- package/fesm2022/a2ui-angular-video-DuFTfN0B.mjs +48 -0
- package/fesm2022/a2ui-angular-video-DuFTfN0B.mjs.map +1 -0
- package/fesm2022/a2ui-angular.mjs +872 -0
- package/fesm2022/a2ui-angular.mjs.map +1 -0
- package/package.json +13 -46
- package/types/a2ui-angular.d.ts +90 -0
- package/angular.json +0 -35
- package/ng-package.json +0 -8
- package/src/lib/catalog/audio.ts +0 -50
- package/src/lib/catalog/button.ts +0 -56
- package/src/lib/catalog/card.ts +0 -57
- package/src/lib/catalog/checkbox.ts +0 -73
- package/src/lib/catalog/column.ts +0 -96
- package/src/lib/catalog/datetime-input.ts +0 -127
- package/src/lib/catalog/default.ts +0 -185
- package/src/lib/catalog/divider.ts +0 -37
- package/src/lib/catalog/icon.ts +0 -44
- package/src/lib/catalog/image.ts +0 -62
- package/src/lib/catalog/list.ts +0 -63
- package/src/lib/catalog/modal.ts +0 -113
- package/src/lib/catalog/multiple-choice.ts +0 -77
- package/src/lib/catalog/row.ts +0 -100
- package/src/lib/catalog/slider.ts +0 -73
- package/src/lib/catalog/surface.ts +0 -82
- package/src/lib/catalog/tabs.ts +0 -72
- package/src/lib/catalog/text-field.ts +0 -86
- package/src/lib/catalog/text.ts +0 -137
- package/src/lib/catalog/video.ts +0 -50
- package/src/lib/config.ts +0 -25
- package/src/lib/data/index.ts +0 -18
- package/src/lib/data/markdown.ts +0 -114
- package/src/lib/data/processor.ts +0 -47
- package/src/lib/data/types.ts +0 -29
- package/src/lib/rendering/catalog.ts +0 -36
- package/src/lib/rendering/dynamic-component.ts +0 -100
- package/src/lib/rendering/index.ts +0 -20
- package/src/lib/rendering/renderer.ts +0 -109
- package/src/lib/rendering/theming.ts +0 -22
- package/src/public-api.ts +0 -21
- package/tsconfig.json +0 -23
- package/tsconfig.lib.json +0 -16
- package/tsconfig.lib.prod.json +0 -9
- package/tsconfig.spec.json +0 -12
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-list-nEeT59V3.mjs","sources":["../../src/lib/catalog/list.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, input } from '@angular/core';\nimport { Types } from '@a2ui/lit/0.8';\nimport { DynamicComponent } from '../rendering/dynamic-component';\nimport { Renderer } from '../rendering/renderer';\n\n@Component({\n selector: 'a2ui-list',\n imports: [Renderer],\n host: {\n '[attr.direction]': 'direction()',\n },\n styles: `\n :host {\n display: block;\n flex: var(--weight);\n min-height: 0;\n overflow: auto;\n }\n\n :host([direction='vertical']) section {\n display: grid;\n }\n\n :host([direction='horizontal']) section {\n display: flex;\n max-width: 100%;\n overflow-x: scroll;\n overflow-y: hidden;\n scrollbar-width: none;\n\n > ::slotted(*) {\n flex: 1 0 fit-content;\n max-width: min(80%, 400px);\n }\n }\n `,\n template: `\n <section [class]=\"theme.components.List\" [style]=\"theme.additionalStyles?.List\">\n @for (child of component().properties.children; track child) {\n <ng-container a2ui-renderer [surfaceId]=\"surfaceId()!\" [component]=\"child\" />\n }\n </section>\n `,\n})\nexport class List extends DynamicComponent<Types.ListNode> {\n readonly direction = input<'vertical' | 'horizontal'>('vertical');\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AA8CG,MAAO,IAAK,SAAQ,gBAAgC,CAAA;AAC/C,IAAA,SAAS,GAAG,KAAK,CAA4B,UAAU,qDAAC;uGADtD,IAAI,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAJ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAI,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,aAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARL;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,+VAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAnCS,QAAQ,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAqCP,IAAI,EAAA,UAAA,EAAA,CAAA;kBAvChB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,CAAC,QAAQ,CAAC,EAAA,IAAA,EACb;AACJ,wBAAA,kBAAkB,EAAE,aAAa;qBAClC,EAAA,QAAA,EA0BS;;;;;;AAMT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,+VAAA,CAAA,EAAA;;;;;"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { signal, viewChild, effect, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent, Renderer } from './a2ui-angular.mjs';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
Copyright 2025 Google LLC
|
|
7
|
+
|
|
8
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
you may not use this file except in compliance with the License.
|
|
10
|
+
You may obtain a copy of the License at
|
|
11
|
+
|
|
12
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
See the License for the specific language governing permissions and
|
|
18
|
+
limitations under the License.
|
|
19
|
+
*/
|
|
20
|
+
class Modal extends DynamicComponent {
|
|
21
|
+
showDialog = signal(false, ...(ngDevMode ? [{ debugName: "showDialog" }] : []));
|
|
22
|
+
dialog = viewChild('dialog', ...(ngDevMode ? [{ debugName: "dialog" }] : []));
|
|
23
|
+
constructor() {
|
|
24
|
+
super();
|
|
25
|
+
effect(() => {
|
|
26
|
+
const dialog = this.dialog();
|
|
27
|
+
if (dialog && !dialog.nativeElement.open) {
|
|
28
|
+
dialog.nativeElement.showModal();
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
handleDialogClick(event) {
|
|
33
|
+
if (event.target instanceof HTMLDialogElement) {
|
|
34
|
+
this.closeDialog();
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
closeDialog() {
|
|
38
|
+
const dialog = this.dialog();
|
|
39
|
+
if (!dialog) {
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
if (!dialog.nativeElement.open) {
|
|
43
|
+
dialog.nativeElement.close();
|
|
44
|
+
}
|
|
45
|
+
this.showDialog.set(false);
|
|
46
|
+
}
|
|
47
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Modal, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
48
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Modal, isStandalone: true, selector: "a2ui-modal", viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
|
|
49
|
+
@if (showDialog()) {
|
|
50
|
+
<dialog #dialog [class]="theme.components.Modal.backdrop" (click)="handleDialogClick($event)">
|
|
51
|
+
<section [class]="theme.components.Modal.element" [style]="theme.additionalStyles?.Modal">
|
|
52
|
+
<div class="controls">
|
|
53
|
+
<button (click)="closeDialog()">
|
|
54
|
+
<span class="g-icon">close</span>
|
|
55
|
+
</button>
|
|
56
|
+
</div>
|
|
57
|
+
|
|
58
|
+
<ng-container
|
|
59
|
+
a2ui-renderer
|
|
60
|
+
[surfaceId]="surfaceId()!"
|
|
61
|
+
[component]="component().properties.contentChild"
|
|
62
|
+
/>
|
|
63
|
+
</section>
|
|
64
|
+
</dialog>
|
|
65
|
+
} @else {
|
|
66
|
+
<section (click)="showDialog.set(true)">
|
|
67
|
+
<ng-container
|
|
68
|
+
a2ui-renderer
|
|
69
|
+
[surfaceId]="surfaceId()!"
|
|
70
|
+
[component]="component().properties.entryPointChild"
|
|
71
|
+
/>
|
|
72
|
+
</section>
|
|
73
|
+
}
|
|
74
|
+
`, isInline: true, styles: ["dialog{padding:0;border:none;background:none}dialog section .controls{display:flex;justify-content:end;margin-bottom:4px}dialog section .controls button{padding:0;background:none;width:20px;height:20px;pointer:cursor;border:none;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: Renderer, selector: "ng-container[a2ui-renderer]", inputs: ["surfaceId", "component"] }] });
|
|
75
|
+
}
|
|
76
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Modal, decorators: [{
|
|
77
|
+
type: Component,
|
|
78
|
+
args: [{ selector: 'a2ui-modal', imports: [Renderer], template: `
|
|
79
|
+
@if (showDialog()) {
|
|
80
|
+
<dialog #dialog [class]="theme.components.Modal.backdrop" (click)="handleDialogClick($event)">
|
|
81
|
+
<section [class]="theme.components.Modal.element" [style]="theme.additionalStyles?.Modal">
|
|
82
|
+
<div class="controls">
|
|
83
|
+
<button (click)="closeDialog()">
|
|
84
|
+
<span class="g-icon">close</span>
|
|
85
|
+
</button>
|
|
86
|
+
</div>
|
|
87
|
+
|
|
88
|
+
<ng-container
|
|
89
|
+
a2ui-renderer
|
|
90
|
+
[surfaceId]="surfaceId()!"
|
|
91
|
+
[component]="component().properties.contentChild"
|
|
92
|
+
/>
|
|
93
|
+
</section>
|
|
94
|
+
</dialog>
|
|
95
|
+
} @else {
|
|
96
|
+
<section (click)="showDialog.set(true)">
|
|
97
|
+
<ng-container
|
|
98
|
+
a2ui-renderer
|
|
99
|
+
[surfaceId]="surfaceId()!"
|
|
100
|
+
[component]="component().properties.entryPointChild"
|
|
101
|
+
/>
|
|
102
|
+
</section>
|
|
103
|
+
}
|
|
104
|
+
`, styles: ["dialog{padding:0;border:none;background:none}dialog section .controls{display:flex;justify-content:end;margin-bottom:4px}dialog section .controls button{padding:0;background:none;width:20px;height:20px;pointer:cursor;border:none;cursor:pointer}\n"] }]
|
|
105
|
+
}], ctorParameters: () => [], propDecorators: { dialog: [{ type: i0.ViewChild, args: ['dialog', { isSignal: true }] }] } });
|
|
106
|
+
|
|
107
|
+
export { Modal };
|
|
108
|
+
//# sourceMappingURL=a2ui-angular-modal-mr9LmczA.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-modal-mr9LmczA.mjs","sources":["../../src/lib/catalog/modal.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, signal, viewChild, ElementRef, effect } from '@angular/core';\nimport { DynamicComponent } from '../rendering/dynamic-component';\nimport { Types } from '@a2ui/lit/0.8';\nimport { Renderer } from '../rendering';\n\n@Component({\n selector: 'a2ui-modal',\n imports: [Renderer],\n template: `\n @if (showDialog()) {\n <dialog #dialog [class]=\"theme.components.Modal.backdrop\" (click)=\"handleDialogClick($event)\">\n <section [class]=\"theme.components.Modal.element\" [style]=\"theme.additionalStyles?.Modal\">\n <div class=\"controls\">\n <button (click)=\"closeDialog()\">\n <span class=\"g-icon\">close</span>\n </button>\n </div>\n\n <ng-container\n a2ui-renderer\n [surfaceId]=\"surfaceId()!\"\n [component]=\"component().properties.contentChild\"\n />\n </section>\n </dialog>\n } @else {\n <section (click)=\"showDialog.set(true)\">\n <ng-container\n a2ui-renderer\n [surfaceId]=\"surfaceId()!\"\n [component]=\"component().properties.entryPointChild\"\n />\n </section>\n }\n `,\n styles: `\n dialog {\n padding: 0;\n border: none;\n background: none;\n\n & section {\n & .controls {\n display: flex;\n justify-content: end;\n margin-bottom: 4px;\n\n & button {\n padding: 0;\n background: none;\n width: 20px;\n height: 20px;\n pointer: cursor;\n border: none;\n cursor: pointer;\n }\n }\n }\n }\n `,\n})\nexport class Modal extends DynamicComponent<Types.ModalNode> {\n protected readonly showDialog = signal(false);\n protected readonly dialog = viewChild<ElementRef<HTMLDialogElement>>('dialog');\n\n constructor() {\n super();\n\n effect(() => {\n const dialog = this.dialog();\n\n if (dialog && !dialog.nativeElement.open) {\n dialog.nativeElement.showModal();\n }\n });\n }\n\n protected handleDialogClick(event: MouseEvent) {\n if (event.target instanceof HTMLDialogElement) {\n this.closeDialog();\n }\n }\n\n protected closeDialog() {\n const dialog = this.dialog();\n\n if (!dialog) {\n return;\n }\n\n if (!dialog.nativeElement.open) {\n dialog.nativeElement.close();\n }\n\n this.showDialog.set(false);\n }\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AA+DG,MAAO,KAAM,SAAQ,gBAAiC,CAAA;AACvC,IAAA,UAAU,GAAG,MAAM,CAAC,KAAK,sDAAC;AAC1B,IAAA,MAAM,GAAG,SAAS,CAAgC,QAAQ,kDAAC;AAE9E,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;QAEP,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;YAE5B,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE;AACxC,gBAAA,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YAClC;AACF,QAAA,CAAC,CAAC;IACJ;AAEU,IAAA,iBAAiB,CAAC,KAAiB,EAAA;AAC3C,QAAA,IAAI,KAAK,CAAC,MAAM,YAAY,iBAAiB,EAAE;YAC7C,IAAI,CAAC,WAAW,EAAE;QACpB;IACF;IAEU,WAAW,GAAA;AACnB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;QAE5B,IAAI,CAAC,MAAM,EAAE;YACX;QACF;AAEA,QAAA,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE;AAC9B,YAAA,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE;QAC9B;AAEA,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC;IAC5B;uGAlCW,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAL,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAK,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,QAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EArDN;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,wPAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EA3BS,QAAQ,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAsDP,KAAK,EAAA,UAAA,EAAA,CAAA;kBAxDjB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EAAA,OAAA,EACb,CAAC,QAAQ,CAAC,EAAA,QAAA,EACT;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,wPAAA,CAAA,EAAA;8FA6BoE,QAAQ,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;;;"}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, computed, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent } from './a2ui-angular.mjs';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
Copyright 2025 Google LLC
|
|
7
|
+
|
|
8
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
you may not use this file except in compliance with the License.
|
|
10
|
+
You may obtain a copy of the License at
|
|
11
|
+
|
|
12
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
See the License for the specific language governing permissions and
|
|
18
|
+
limitations under the License.
|
|
19
|
+
*/
|
|
20
|
+
class MultipleChoice extends DynamicComponent {
|
|
21
|
+
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
|
|
22
|
+
value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
23
|
+
description = input.required(...(ngDevMode ? [{ debugName: "description" }] : []));
|
|
24
|
+
selectId = super.getUniqueId('a2ui-multiple-choice');
|
|
25
|
+
selectValue = computed(() => super.resolvePrimitive(this.value()), ...(ngDevMode ? [{ debugName: "selectValue" }] : []));
|
|
26
|
+
handleChange(event) {
|
|
27
|
+
const path = this.value()?.path;
|
|
28
|
+
if (!(event.target instanceof HTMLSelectElement) || !event.target.value || !path) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
this.processor.setData(this.component(), this.processor.resolvePath(path, this.component().dataContextPath), event.target.value);
|
|
32
|
+
}
|
|
33
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: MultipleChoice, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
34
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: MultipleChoice, isStandalone: true, selector: "a2ui-multiple-choice", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
|
|
35
|
+
<section [class]="theme.components.MultipleChoice.container">
|
|
36
|
+
<label [class]="theme.components.MultipleChoice.label" [for]="selectId">{{
|
|
37
|
+
description()
|
|
38
|
+
}}</label>
|
|
39
|
+
|
|
40
|
+
<select
|
|
41
|
+
(change)="handleChange($event)"
|
|
42
|
+
[id]="selectId"
|
|
43
|
+
[value]="selectValue()"
|
|
44
|
+
[class]="theme.components.MultipleChoice.element"
|
|
45
|
+
[style]="theme.additionalStyles?.MultipleChoice"
|
|
46
|
+
>
|
|
47
|
+
@for (option of options(); track option.value) {
|
|
48
|
+
<option [value]="option.value">{{ resolvePrimitive(option.label) }}</option>
|
|
49
|
+
}
|
|
50
|
+
</select>
|
|
51
|
+
</section>
|
|
52
|
+
`, isInline: true, styles: [":host{display:block;flex:var(--weight);min-height:0;overflow:auto}select{width:100%;box-sizing:border-box}\n"] });
|
|
53
|
+
}
|
|
54
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: MultipleChoice, decorators: [{
|
|
55
|
+
type: Component,
|
|
56
|
+
args: [{ selector: 'a2ui-multiple-choice', template: `
|
|
57
|
+
<section [class]="theme.components.MultipleChoice.container">
|
|
58
|
+
<label [class]="theme.components.MultipleChoice.label" [for]="selectId">{{
|
|
59
|
+
description()
|
|
60
|
+
}}</label>
|
|
61
|
+
|
|
62
|
+
<select
|
|
63
|
+
(change)="handleChange($event)"
|
|
64
|
+
[id]="selectId"
|
|
65
|
+
[value]="selectValue()"
|
|
66
|
+
[class]="theme.components.MultipleChoice.element"
|
|
67
|
+
[style]="theme.additionalStyles?.MultipleChoice"
|
|
68
|
+
>
|
|
69
|
+
@for (option of options(); track option.value) {
|
|
70
|
+
<option [value]="option.value">{{ resolvePrimitive(option.label) }}</option>
|
|
71
|
+
}
|
|
72
|
+
</select>
|
|
73
|
+
</section>
|
|
74
|
+
`, styles: [":host{display:block;flex:var(--weight);min-height:0;overflow:auto}select{width:100%;box-sizing:border-box}\n"] }]
|
|
75
|
+
}], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: true }] }] } });
|
|
76
|
+
|
|
77
|
+
export { MultipleChoice };
|
|
78
|
+
//# sourceMappingURL=a2ui-angular-multiple-choice-Bry7X74i.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-multiple-choice-Bry7X74i.mjs","sources":["../../src/lib/catalog/multiple-choice.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, computed, input } from '@angular/core';\nimport { DynamicComponent } from '../rendering/dynamic-component';\nimport { Primitives } from '@a2ui/lit/0.8';\n\n@Component({\n selector: 'a2ui-multiple-choice',\n template: `\n <section [class]=\"theme.components.MultipleChoice.container\">\n <label [class]=\"theme.components.MultipleChoice.label\" [for]=\"selectId\">{{\n description()\n }}</label>\n\n <select\n (change)=\"handleChange($event)\"\n [id]=\"selectId\"\n [value]=\"selectValue()\"\n [class]=\"theme.components.MultipleChoice.element\"\n [style]=\"theme.additionalStyles?.MultipleChoice\"\n >\n @for (option of options(); track option.value) {\n <option [value]=\"option.value\">{{ resolvePrimitive(option.label) }}</option>\n }\n </select>\n </section>\n `,\n styles: `\n :host {\n display: block;\n flex: var(--weight);\n min-height: 0;\n overflow: auto;\n }\n\n select {\n width: 100%;\n box-sizing: border-box;\n }\n `,\n})\nexport class MultipleChoice extends DynamicComponent {\n readonly options = input.required<{ label: Primitives.StringValue; value: string }[]>();\n readonly value = input.required<Primitives.StringValue | null>();\n readonly description = input.required<string>();\n\n protected readonly selectId = super.getUniqueId('a2ui-multiple-choice');\n protected selectValue = computed(() => super.resolvePrimitive(this.value()));\n\n protected handleChange(event: Event) {\n const path = this.value()?.path;\n\n if (!(event.target instanceof HTMLSelectElement) || !event.target.value || !path) {\n return;\n }\n\n this.processor.setData(\n this.component(),\n this.processor.resolvePath(path, this.component().dataContextPath),\n event.target.value,\n );\n }\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAyCG,MAAO,cAAe,SAAQ,gBAAgB,CAAA;AACzC,IAAA,OAAO,GAAG,KAAK,CAAC,QAAQ,kDAAsD;AAC9E,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAiC;AACvD,IAAA,WAAW,GAAG,KAAK,CAAC,QAAQ,sDAAU;AAE5B,IAAA,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,sBAAsB,CAAC;AAC7D,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,uDAAC;AAElE,IAAA,YAAY,CAAC,KAAY,EAAA;QACjC,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI;AAE/B,QAAA,IAAI,EAAE,KAAK,CAAC,MAAM,YAAY,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,IAAI,EAAE;YAChF;QACF;AAEA,QAAA,IAAI,CAAC,SAAS,CAAC,OAAO,CACpB,IAAI,CAAC,SAAS,EAAE,EAChB,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,eAAe,CAAC,EAClE,KAAK,CAAC,MAAM,CAAC,KAAK,CACnB;IACH;uGApBW,cAAc,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAjCf;;;;;;;;;;;;;;;;;;AAkBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8GAAA,CAAA,EAAA,CAAA;;2FAeU,cAAc,EAAA,UAAA,EAAA,CAAA;kBAnC1B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,EAAA,QAAA,EACtB;;;;;;;;;;;;;;;;;;AAkBT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,8GAAA,CAAA,EAAA;;;;;"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, computed, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent } from './a2ui-angular.mjs';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
Copyright 2025 Google LLC
|
|
7
|
+
|
|
8
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
you may not use this file except in compliance with the License.
|
|
10
|
+
You may obtain a copy of the License at
|
|
11
|
+
|
|
12
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
See the License for the specific language governing permissions and
|
|
18
|
+
limitations under the License.
|
|
19
|
+
*/
|
|
20
|
+
class Slider extends DynamicComponent {
|
|
21
|
+
value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
22
|
+
label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
23
|
+
minValue = input.required(...(ngDevMode ? [{ debugName: "minValue" }] : []));
|
|
24
|
+
maxValue = input.required(...(ngDevMode ? [{ debugName: "maxValue" }] : []));
|
|
25
|
+
inputId = super.getUniqueId('a2ui-slider');
|
|
26
|
+
resolvedValue = computed(() => super.resolvePrimitive(this.value()) ?? 0, ...(ngDevMode ? [{ debugName: "resolvedValue" }] : []));
|
|
27
|
+
handleInput(event) {
|
|
28
|
+
const path = this.value()?.path;
|
|
29
|
+
if (!(event.target instanceof HTMLInputElement) || !path) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
this.processor.setData(this.component(), path, event.target.valueAsNumber, this.surfaceId());
|
|
33
|
+
}
|
|
34
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Slider, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
35
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.3", type: Slider, isStandalone: true, selector: "[a2ui-slider]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: true, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
|
|
36
|
+
<section [class]="theme.components.Slider.container">
|
|
37
|
+
<label [class]="theme.components.Slider.label" [for]="inputId">
|
|
38
|
+
{{ label() }}
|
|
39
|
+
</label>
|
|
40
|
+
|
|
41
|
+
<input
|
|
42
|
+
autocomplete="off"
|
|
43
|
+
type="range"
|
|
44
|
+
[value]="resolvedValue()"
|
|
45
|
+
[min]="minValue()"
|
|
46
|
+
[max]="maxValue()"
|
|
47
|
+
[id]="inputId"
|
|
48
|
+
(input)="handleInput($event)"
|
|
49
|
+
[class]="theme.components.Slider.element"
|
|
50
|
+
[style]="theme.additionalStyles?.Slider"
|
|
51
|
+
/>
|
|
52
|
+
</section>
|
|
53
|
+
`, isInline: true, styles: [":host{display:block;flex:var(--weight)}input{display:block;width:100%;box-sizing:border-box}\n"] });
|
|
54
|
+
}
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Slider, decorators: [{
|
|
56
|
+
type: Component,
|
|
57
|
+
args: [{ selector: '[a2ui-slider]', template: `
|
|
58
|
+
<section [class]="theme.components.Slider.container">
|
|
59
|
+
<label [class]="theme.components.Slider.label" [for]="inputId">
|
|
60
|
+
{{ label() }}
|
|
61
|
+
</label>
|
|
62
|
+
|
|
63
|
+
<input
|
|
64
|
+
autocomplete="off"
|
|
65
|
+
type="range"
|
|
66
|
+
[value]="resolvedValue()"
|
|
67
|
+
[min]="minValue()"
|
|
68
|
+
[max]="maxValue()"
|
|
69
|
+
[id]="inputId"
|
|
70
|
+
(input)="handleInput($event)"
|
|
71
|
+
[class]="theme.components.Slider.element"
|
|
72
|
+
[style]="theme.additionalStyles?.Slider"
|
|
73
|
+
/>
|
|
74
|
+
</section>
|
|
75
|
+
`, styles: [":host{display:block;flex:var(--weight)}input{display:block;width:100%;box-sizing:border-box}\n"] }]
|
|
76
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], minValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "minValue", required: true }] }], maxValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxValue", required: true }] }] } });
|
|
77
|
+
|
|
78
|
+
export { Slider };
|
|
79
|
+
//# sourceMappingURL=a2ui-angular-slider-BgseUbN2.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-slider-BgseUbN2.mjs","sources":["../../src/lib/catalog/slider.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, computed, input } from '@angular/core';\nimport { Primitives } from '@a2ui/lit/0.8';\nimport { DynamicComponent } from '../rendering/dynamic-component';\n\n@Component({\n selector: '[a2ui-slider]',\n template: `\n <section [class]=\"theme.components.Slider.container\">\n <label [class]=\"theme.components.Slider.label\" [for]=\"inputId\">\n {{ label() }}\n </label>\n\n <input\n autocomplete=\"off\"\n type=\"range\"\n [value]=\"resolvedValue()\"\n [min]=\"minValue()\"\n [max]=\"maxValue()\"\n [id]=\"inputId\"\n (input)=\"handleInput($event)\"\n [class]=\"theme.components.Slider.element\"\n [style]=\"theme.additionalStyles?.Slider\"\n />\n </section>\n `,\n styles: `\n :host {\n display: block;\n flex: var(--weight);\n }\n\n input {\n display: block;\n width: 100%;\n box-sizing: border-box;\n }\n `,\n})\nexport class Slider extends DynamicComponent {\n readonly value = input.required<Primitives.NumberValue | null>();\n readonly label = input('');\n readonly minValue = input.required<number | undefined>();\n readonly maxValue = input.required<number | undefined>();\n\n protected readonly inputId = super.getUniqueId('a2ui-slider');\n protected resolvedValue = computed(() => super.resolvePrimitive(this.value()) ?? 0);\n\n protected handleInput(event: Event) {\n const path = this.value()?.path;\n\n if (!(event.target instanceof HTMLInputElement) || !path) {\n return;\n }\n\n this.processor.setData(this.component(), path, event.target.valueAsNumber, this.surfaceId());\n }\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAwCG,MAAO,MAAO,SAAQ,gBAAgB,CAAA;AACjC,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAiC;AACvD,IAAA,KAAK,GAAG,KAAK,CAAC,EAAE,iDAAC;AACjB,IAAA,QAAQ,GAAG,KAAK,CAAC,QAAQ,mDAAsB;AAC/C,IAAA,QAAQ,GAAG,KAAK,CAAC,QAAQ,mDAAsB;AAErC,IAAA,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,aAAa,CAAC;AACnD,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,yDAAC;AAEzE,IAAA,WAAW,CAAC,KAAY,EAAA;QAChC,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI;AAE/B,QAAA,IAAI,EAAE,KAAK,CAAC,MAAM,YAAY,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE;YACxD;QACF;QAEA,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC;IAC9F;uGAjBW,MAAM,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAhCP;;;;;;;;;;;;;;;;;;AAkBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,gGAAA,CAAA,EAAA,CAAA;;2FAcU,MAAM,EAAA,UAAA,EAAA,CAAA;kBAlClB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,eAAe,EAAA,QAAA,EACf;;;;;;;;;;;;;;;;;;AAkBT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,gGAAA,CAAA,EAAA;;;;;"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { signal, input, computed, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent, Renderer } from './a2ui-angular.mjs';
|
|
4
|
+
import { Styles } from '@a2ui/lit/0.8';
|
|
5
|
+
|
|
6
|
+
/*
|
|
7
|
+
Copyright 2025 Google LLC
|
|
8
|
+
|
|
9
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
10
|
+
you may not use this file except in compliance with the License.
|
|
11
|
+
You may obtain a copy of the License at
|
|
12
|
+
|
|
13
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
14
|
+
|
|
15
|
+
Unless required by applicable law or agreed to in writing, software
|
|
16
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
17
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
18
|
+
See the License for the specific language governing permissions and
|
|
19
|
+
limitations under the License.
|
|
20
|
+
*/
|
|
21
|
+
class Tabs extends DynamicComponent {
|
|
22
|
+
selectedIndex = signal(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
|
|
23
|
+
tabs = input.required(...(ngDevMode ? [{ debugName: "tabs" }] : []));
|
|
24
|
+
buttonClasses = computed(() => {
|
|
25
|
+
const selectedIndex = this.selectedIndex();
|
|
26
|
+
return this.tabs().map((_, index) => {
|
|
27
|
+
return index === selectedIndex
|
|
28
|
+
? Styles.merge(this.theme.components.Tabs.controls.all, this.theme.components.Tabs.controls.selected)
|
|
29
|
+
: this.theme.components.Tabs.controls.all;
|
|
30
|
+
});
|
|
31
|
+
}, ...(ngDevMode ? [{ debugName: "buttonClasses" }] : []));
|
|
32
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Tabs, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
33
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Tabs, isStandalone: true, selector: "a2ui-tabs", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
|
|
34
|
+
@let tabs = this.tabs();
|
|
35
|
+
@let selectedIndex = this.selectedIndex();
|
|
36
|
+
|
|
37
|
+
<section [class]="theme.components.Tabs.container" [style]="theme.additionalStyles?.Tabs">
|
|
38
|
+
<div [class]="theme.components.Tabs.element">
|
|
39
|
+
@for (tab of tabs; track tab) {
|
|
40
|
+
<button
|
|
41
|
+
(click)="this.selectedIndex.set($index)"
|
|
42
|
+
[disabled]="selectedIndex === $index"
|
|
43
|
+
[class]="buttonClasses()[selectedIndex]"
|
|
44
|
+
>
|
|
45
|
+
{{ resolvePrimitive(tab.title) }}
|
|
46
|
+
</button>
|
|
47
|
+
}
|
|
48
|
+
</div>
|
|
49
|
+
|
|
50
|
+
<ng-container
|
|
51
|
+
a2ui-renderer
|
|
52
|
+
[surfaceId]="surfaceId()!"
|
|
53
|
+
[component]="tabs[selectedIndex].child"
|
|
54
|
+
/>
|
|
55
|
+
</section>
|
|
56
|
+
`, isInline: true, styles: [":host{display:block;flex:var(--weight)}\n"], dependencies: [{ kind: "directive", type: Renderer, selector: "ng-container[a2ui-renderer]", inputs: ["surfaceId", "component"] }] });
|
|
57
|
+
}
|
|
58
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Tabs, decorators: [{
|
|
59
|
+
type: Component,
|
|
60
|
+
args: [{ selector: 'a2ui-tabs', imports: [Renderer], template: `
|
|
61
|
+
@let tabs = this.tabs();
|
|
62
|
+
@let selectedIndex = this.selectedIndex();
|
|
63
|
+
|
|
64
|
+
<section [class]="theme.components.Tabs.container" [style]="theme.additionalStyles?.Tabs">
|
|
65
|
+
<div [class]="theme.components.Tabs.element">
|
|
66
|
+
@for (tab of tabs; track tab) {
|
|
67
|
+
<button
|
|
68
|
+
(click)="this.selectedIndex.set($index)"
|
|
69
|
+
[disabled]="selectedIndex === $index"
|
|
70
|
+
[class]="buttonClasses()[selectedIndex]"
|
|
71
|
+
>
|
|
72
|
+
{{ resolvePrimitive(tab.title) }}
|
|
73
|
+
</button>
|
|
74
|
+
}
|
|
75
|
+
</div>
|
|
76
|
+
|
|
77
|
+
<ng-container
|
|
78
|
+
a2ui-renderer
|
|
79
|
+
[surfaceId]="surfaceId()!"
|
|
80
|
+
[component]="tabs[selectedIndex].child"
|
|
81
|
+
/>
|
|
82
|
+
</section>
|
|
83
|
+
`, styles: [":host{display:block;flex:var(--weight)}\n"] }]
|
|
84
|
+
}], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: true }] }] } });
|
|
85
|
+
|
|
86
|
+
export { Tabs };
|
|
87
|
+
//# sourceMappingURL=a2ui-angular-tabs-q5Mn9vgq.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-tabs-q5Mn9vgq.mjs","sources":["../../src/lib/catalog/tabs.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, computed, input, signal } from '@angular/core';\nimport { DynamicComponent } from '../rendering/dynamic-component';\nimport { Renderer } from '../rendering/renderer';\nimport { Styles, Types } from '@a2ui/lit/0.8';\n\n@Component({\n selector: 'a2ui-tabs',\n imports: [Renderer],\n template: `\n @let tabs = this.tabs();\n @let selectedIndex = this.selectedIndex();\n\n <section [class]=\"theme.components.Tabs.container\" [style]=\"theme.additionalStyles?.Tabs\">\n <div [class]=\"theme.components.Tabs.element\">\n @for (tab of tabs; track tab) {\n <button\n (click)=\"this.selectedIndex.set($index)\"\n [disabled]=\"selectedIndex === $index\"\n [class]=\"buttonClasses()[selectedIndex]\"\n >\n {{ resolvePrimitive(tab.title) }}\n </button>\n }\n </div>\n\n <ng-container\n a2ui-renderer\n [surfaceId]=\"surfaceId()!\"\n [component]=\"tabs[selectedIndex].child\"\n />\n </section>\n `,\n styles: `\n :host {\n display: block;\n flex: var(--weight);\n }\n `,\n})\nexport class Tabs extends DynamicComponent {\n protected selectedIndex = signal(0);\n readonly tabs = input.required<Types.ResolvedTabItem[]>();\n\n protected readonly buttonClasses = computed(() => {\n const selectedIndex = this.selectedIndex();\n\n return this.tabs().map((_, index) => {\n return index === selectedIndex\n ? Styles.merge(\n this.theme.components.Tabs.controls.all,\n this.theme.components.Tabs.controls.selected,\n )\n : this.theme.components.Tabs.controls.all;\n });\n });\n}\n"],"names":[],"mappings":";;;;;AAAA;;;;;;;;;;;;;;AAcG;AAyCG,MAAO,IAAK,SAAQ,gBAAgB,CAAA;AAC9B,IAAA,aAAa,GAAG,MAAM,CAAC,CAAC,yDAAC;AAC1B,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,+CAA2B;AAEtC,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE;AAE1C,QAAA,OAAO,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAI;YAClC,OAAO,KAAK,KAAK;AACf,kBAAE,MAAM,CAAC,KAAK,CACZ,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,EACvC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ;AAE9C,kBAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG;AAC7C,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,yDAAC;uGAfS,IAAI,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAJ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAI,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EA/BL;;;;;;;;;;;;;;;;;;;;;;;AAuBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,2CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAxBS,QAAQ,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAgCP,IAAI,EAAA,UAAA,EAAA,CAAA;kBAlChB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,CAAC,QAAQ,CAAC,EAAA,QAAA,EACT;;;;;;;;;;;;;;;;;;;;;;;AAuBT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,2CAAA,CAAA,EAAA;;;;;"}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, computed, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent } from './a2ui-angular.mjs';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
Copyright 2025 Google LLC
|
|
7
|
+
|
|
8
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
you may not use this file except in compliance with the License.
|
|
10
|
+
You may obtain a copy of the License at
|
|
11
|
+
|
|
12
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
See the License for the specific language governing permissions and
|
|
18
|
+
limitations under the License.
|
|
19
|
+
*/
|
|
20
|
+
class TextField extends DynamicComponent {
|
|
21
|
+
text = input.required(...(ngDevMode ? [{ debugName: "text" }] : []));
|
|
22
|
+
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
23
|
+
inputType = input.required(...(ngDevMode ? [{ debugName: "inputType" }] : []));
|
|
24
|
+
inputValue = computed(() => super.resolvePrimitive(this.text()) || '', ...(ngDevMode ? [{ debugName: "inputValue" }] : []));
|
|
25
|
+
resolvedLabel = computed(() => super.resolvePrimitive(this.label()), ...(ngDevMode ? [{ debugName: "resolvedLabel" }] : []));
|
|
26
|
+
inputId = super.getUniqueId('a2ui-input');
|
|
27
|
+
handleInput(event) {
|
|
28
|
+
const path = this.text()?.path;
|
|
29
|
+
if (!(event.target instanceof HTMLInputElement) || !path) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
this.processor.setData(this.component(), path, event.target.value, this.surfaceId());
|
|
33
|
+
}
|
|
34
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TextField, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
35
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: TextField, isStandalone: true, selector: "a2ui-text-field", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, inputType: { classPropertyName: "inputType", publicName: "inputType", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
|
|
36
|
+
@let resolvedLabel = this.resolvedLabel();
|
|
37
|
+
|
|
38
|
+
<section [class]="theme.components.TextField.container">
|
|
39
|
+
@if (resolvedLabel) {
|
|
40
|
+
<label [for]="inputId" [class]="theme.components.TextField.label">{{
|
|
41
|
+
resolvedLabel
|
|
42
|
+
}}</label>
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
<input
|
|
46
|
+
autocomplete="off"
|
|
47
|
+
[class]="theme.components.TextField.element"
|
|
48
|
+
[style]="theme.additionalStyles?.TextField"
|
|
49
|
+
(input)="handleInput($event)"
|
|
50
|
+
[id]="inputId"
|
|
51
|
+
[value]="inputValue()"
|
|
52
|
+
placeholder="Please enter a value"
|
|
53
|
+
[type]="inputType() === 'number' ? 'number' : 'text'"
|
|
54
|
+
/>
|
|
55
|
+
</section>
|
|
56
|
+
`, isInline: true, styles: [":host{display:flex;flex:var(--weight)}section,input,label{box-sizing:border-box}input{display:block;width:100%}label{display:block;margin-bottom:4px}\n"] });
|
|
57
|
+
}
|
|
58
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TextField, decorators: [{
|
|
59
|
+
type: Component,
|
|
60
|
+
args: [{ selector: 'a2ui-text-field', template: `
|
|
61
|
+
@let resolvedLabel = this.resolvedLabel();
|
|
62
|
+
|
|
63
|
+
<section [class]="theme.components.TextField.container">
|
|
64
|
+
@if (resolvedLabel) {
|
|
65
|
+
<label [for]="inputId" [class]="theme.components.TextField.label">{{
|
|
66
|
+
resolvedLabel
|
|
67
|
+
}}</label>
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
<input
|
|
71
|
+
autocomplete="off"
|
|
72
|
+
[class]="theme.components.TextField.element"
|
|
73
|
+
[style]="theme.additionalStyles?.TextField"
|
|
74
|
+
(input)="handleInput($event)"
|
|
75
|
+
[id]="inputId"
|
|
76
|
+
[value]="inputValue()"
|
|
77
|
+
placeholder="Please enter a value"
|
|
78
|
+
[type]="inputType() === 'number' ? 'number' : 'text'"
|
|
79
|
+
/>
|
|
80
|
+
</section>
|
|
81
|
+
`, styles: [":host{display:flex;flex:var(--weight)}section,input,label{box-sizing:border-box}input{display:block;width:100%}label{display:block;margin-bottom:4px}\n"] }]
|
|
82
|
+
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], inputType: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputType", required: true }] }] } });
|
|
83
|
+
|
|
84
|
+
export { TextField };
|
|
85
|
+
//# sourceMappingURL=a2ui-angular-text-field-Deokh07j.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-text-field-Deokh07j.mjs","sources":["../../src/lib/catalog/text-field.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { computed, Component, input } from '@angular/core';\nimport { Primitives, Types } from '@a2ui/lit/0.8';\nimport { DynamicComponent } from '../rendering/dynamic-component';\n\n@Component({\n selector: 'a2ui-text-field',\n styles: `\n :host {\n display: flex;\n flex: var(--weight);\n }\n\n section,\n input,\n label {\n box-sizing: border-box;\n }\n\n input {\n display: block;\n width: 100%;\n }\n\n label {\n display: block;\n margin-bottom: 4px;\n }\n `,\n template: `\n @let resolvedLabel = this.resolvedLabel();\n\n <section [class]=\"theme.components.TextField.container\">\n @if (resolvedLabel) {\n <label [for]=\"inputId\" [class]=\"theme.components.TextField.label\">{{\n resolvedLabel\n }}</label>\n }\n\n <input\n autocomplete=\"off\"\n [class]=\"theme.components.TextField.element\"\n [style]=\"theme.additionalStyles?.TextField\"\n (input)=\"handleInput($event)\"\n [id]=\"inputId\"\n [value]=\"inputValue()\"\n placeholder=\"Please enter a value\"\n [type]=\"inputType() === 'number' ? 'number' : 'text'\"\n />\n </section>\n `,\n})\nexport class TextField extends DynamicComponent {\n readonly text = input.required<Primitives.StringValue | null>();\n readonly label = input.required<Primitives.StringValue | null>();\n readonly inputType = input.required<Types.ResolvedTextField['type'] | null>();\n\n protected inputValue = computed(() => super.resolvePrimitive(this.text()) || '');\n protected resolvedLabel = computed(() => super.resolvePrimitive(this.label()));\n protected inputId = super.getUniqueId('a2ui-input');\n\n protected handleInput(event: Event) {\n const path = this.text()?.path;\n\n if (!(event.target instanceof HTMLInputElement) || !path) {\n return;\n }\n\n this.processor.setData(this.component(), path, event.target.value, this.surfaceId());\n }\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAqDG,MAAO,SAAU,SAAQ,gBAAgB,CAAA;AACpC,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,+CAAiC;AACtD,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAiC;AACvD,IAAA,SAAS,GAAG,KAAK,CAAC,QAAQ,oDAA0C;AAEnE,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,sDAAC;AACtE,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,yDAAC;AACpE,IAAA,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,YAAY,CAAC;AAEzC,IAAA,WAAW,CAAC,KAAY,EAAA;QAChC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI;AAE9B,QAAA,IAAI,EAAE,KAAK,CAAC,MAAM,YAAY,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE;YACxD;QACF;QAEA,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC;IACtF;uGAjBW,SAAS,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAT,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAvBV;;;;;;;;;;;;;;;;;;;;;AAqBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,yJAAA,CAAA,EAAA,CAAA;;2FAEU,SAAS,EAAA,UAAA,EAAA,CAAA;kBA/CrB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAAA,QAAA,EAuBjB;;;;;;;;;;;;;;;;;;;;;AAqBT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,yJAAA,CAAA,EAAA;;;;;"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, computed, Component } from '@angular/core';
|
|
3
|
+
import { DynamicComponent } from './a2ui-angular.mjs';
|
|
4
|
+
|
|
5
|
+
/*
|
|
6
|
+
Copyright 2025 Google LLC
|
|
7
|
+
|
|
8
|
+
Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
you may not use this file except in compliance with the License.
|
|
10
|
+
You may obtain a copy of the License at
|
|
11
|
+
|
|
12
|
+
https://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
See the License for the specific language governing permissions and
|
|
18
|
+
limitations under the License.
|
|
19
|
+
*/
|
|
20
|
+
class Video extends DynamicComponent {
|
|
21
|
+
url = input.required(...(ngDevMode ? [{ debugName: "url" }] : []));
|
|
22
|
+
resolvedUrl = computed(() => this.resolvePrimitive(this.url()), ...(ngDevMode ? [{ debugName: "resolvedUrl" }] : []));
|
|
23
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Video, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Video, isStandalone: true, selector: "a2ui-video", inputs: { url: { classPropertyName: "url", publicName: "url", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
|
|
25
|
+
@let resolvedUrl = this.resolvedUrl();
|
|
26
|
+
|
|
27
|
+
@if (resolvedUrl) {
|
|
28
|
+
<section [class]="theme.components.Video" [style]="theme.additionalStyles?.Video">
|
|
29
|
+
<video controls [src]="resolvedUrl"></video>
|
|
30
|
+
</section>
|
|
31
|
+
}
|
|
32
|
+
`, isInline: true, styles: [":host{display:block;flex:var(--weight);min-height:0;overflow:auto}video{display:block;width:100%;box-sizing:border-box}\n"] });
|
|
33
|
+
}
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Video, decorators: [{
|
|
35
|
+
type: Component,
|
|
36
|
+
args: [{ selector: 'a2ui-video', template: `
|
|
37
|
+
@let resolvedUrl = this.resolvedUrl();
|
|
38
|
+
|
|
39
|
+
@if (resolvedUrl) {
|
|
40
|
+
<section [class]="theme.components.Video" [style]="theme.additionalStyles?.Video">
|
|
41
|
+
<video controls [src]="resolvedUrl"></video>
|
|
42
|
+
</section>
|
|
43
|
+
}
|
|
44
|
+
`, styles: [":host{display:block;flex:var(--weight);min-height:0;overflow:auto}video{display:block;width:100%;box-sizing:border-box}\n"] }]
|
|
45
|
+
}], propDecorators: { url: [{ type: i0.Input, args: [{ isSignal: true, alias: "url", required: true }] }] } });
|
|
46
|
+
|
|
47
|
+
export { Video };
|
|
48
|
+
//# sourceMappingURL=a2ui-angular-video-DuFTfN0B.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"a2ui-angular-video-DuFTfN0B.mjs","sources":["../../src/lib/catalog/video.ts"],"sourcesContent":["/*\n Copyright 2025 Google LLC\n\n Licensed under the Apache License, Version 2.0 (the \"License\");\n you may not use this file except in compliance with the License.\n You may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\n Unless required by applicable law or agreed to in writing, software\n distributed under the License is distributed on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n See the License for the specific language governing permissions and\n limitations under the License.\n */\n\nimport { Component, computed, input } from '@angular/core';\nimport { DynamicComponent } from '../rendering/dynamic-component';\nimport { Primitives } from '@a2ui/lit/0.8';\n\n@Component({\n selector: 'a2ui-video',\n template: `\n @let resolvedUrl = this.resolvedUrl();\n\n @if (resolvedUrl) {\n <section [class]=\"theme.components.Video\" [style]=\"theme.additionalStyles?.Video\">\n <video controls [src]=\"resolvedUrl\"></video>\n </section>\n }\n `,\n styles: `\n :host {\n display: block;\n flex: var(--weight);\n min-height: 0;\n overflow: auto;\n }\n\n video {\n display: block;\n width: 100%;\n box-sizing: border-box;\n }\n `,\n})\nexport class Video extends DynamicComponent {\n readonly url = input.required<Primitives.StringValue | null>();\n protected readonly resolvedUrl = computed(() => this.resolvePrimitive(this.url()));\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAgCG,MAAO,KAAM,SAAQ,gBAAgB,CAAA;AAChC,IAAA,GAAG,GAAG,KAAK,CAAC,QAAQ,8CAAiC;AAC3C,IAAA,WAAW,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,uDAAC;uGAFvE,KAAK,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAL,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAK,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAxBN;;;;;;;;AAQT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,2HAAA,CAAA,EAAA,CAAA;;2FAgBU,KAAK,EAAA,UAAA,EAAA,CAAA;kBA1BjB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EAAA,QAAA,EACZ;;;;;;;;AAQT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,2HAAA,CAAA,EAAA;;;;;"}
|