@star-ng/ui 0.0.0-stage → 0.1.0

package/fesm2022/star-ng-ui-popover.mjs

@@ -0,0 +1,241 @@
+import { _IdGenerator } from "@angular/cdk/a11y";
+import { Directionality } from "@angular/cdk/bidi";
+import { createFlexibleConnectedPositionStrategy, createOverlayRef, createRepositionScrollStrategy } from "@angular/cdk/overlay";
+import { TemplatePortal } from "@angular/cdk/portal";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, Injector, ViewContainerRef, afterNextRender, booleanAttribute, inject, input, output, signal, viewChild } from "@angular/core";
+import { StarDirectionService } from "@star-ng/ui/core";
+const POSITIONS = [
+	{
+		originX: "start",
+		originY: "bottom",
+		overlayX: "start",
+		overlayY: "top",
+		offsetY: 8
+	},
+	{
+		originX: "end",
+		originY: "bottom",
+		overlayX: "end",
+		overlayY: "top",
+		offsetY: 8
+	},
+	{
+		originX: "start",
+		originY: "top",
+		overlayX: "start",
+		overlayY: "bottom",
+		offsetY: -8
+	},
+	{
+		originX: "end",
+		originY: "top",
+		overlayX: "end",
+		overlayY: "bottom",
+		offsetY: -8
+	}
+];
+var StarPopover = class StarPopover {
+	injector = inject(Injector);
+	viewContainer = inject(ViewContainerRef);
+	directionality = inject(Directionality);
+	panelId = inject(_IdGenerator).getId("star-popover-");
+	ariaLabel = input(null, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	focusOnShow = input(true, {
+		...ngDevMode ? { debugName: "focusOnShow" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	dismissable = input(true, {
+		...ngDevMode ? { debugName: "dismissable" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	shown = output();
+	hidden = output();
+	visible = signal(false, ...ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []);
+	panel = viewChild.required("panel", ...ngDevMode ? [{ debugName: "panel" }] : /* istanbul ignore next */ []);
+	overlayRef = null;
+	anchor = null;
+	outside = null;
+	constructor() {
+		inject(StarDirectionService);
+		inject(DestroyRef).onDestroy(() => this.overlayRef?.dispose());
+	}
+	toggle(target) {
+		if (this.visible()) this.hide();
+		else this.show(target);
+	}
+	show(target) {
+		const anchor = target instanceof Event ? target.currentTarget ?? target.target : target;
+		if (!anchor) return;
+		if (this.visible()) this.hide(false);
+		this.anchor = anchor;
+		const strategy = createFlexibleConnectedPositionStrategy(this.injector, anchor).withPositions(POSITIONS).withPush(true).withViewportMargin(8);
+		this.overlayRef ??= createOverlayRef(this.injector, {
+			positionStrategy: strategy,
+			scrollStrategy: createRepositionScrollStrategy(this.injector),
+			direction: this.directionality,
+			usePopover: true
+		});
+		this.overlayRef.updatePositionStrategy(strategy);
+		this.overlayRef.attach(new TemplatePortal(this.panel(), this.viewContainer));
+		this.outside = this.overlayRef.outsidePointerEvents().subscribe((event) => {
+			if (this.dismissable() && !anchor.contains(event.target)) this.hide(false);
+		});
+		anchor.setAttribute("aria-expanded", "true");
+		anchor.setAttribute("aria-controls", this.panelId);
+		this.visible.set(true);
+		this.shown.emit();
+		if (this.focusOnShow()) afterNextRender(() => {
+			const root = this.overlayRef?.overlayElement.querySelector(".star-popover");
+			(root?.querySelector("button:not([disabled]), [href], input:not([disabled]), select, textarea, [tabindex]:not([tabindex=\"-1\"])") ?? root)?.focus();
+		}, { injector: this.injector });
+	}
+	hide(restoreFocus = true) {
+		if (!this.visible() || !this.overlayRef) return;
+		const hadFocus = this.overlayRef.overlayElement.contains(document.activeElement);
+		this.overlayRef.detach();
+		this.anchor?.setAttribute("aria-expanded", "false");
+		this.outside?.unsubscribe();
+		if (restoreFocus && hadFocus && this.anchor) (this.anchor.matches("button, a, input, [tabindex]") ? this.anchor : this.anchor.querySelector("button, a, input") ?? this.anchor).focus();
+		this.visible.set(false);
+		this.hidden.emit();
+	}
+	align() {
+		this.overlayRef?.updatePosition();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.6",
+		ngImport: i0,
+		type: StarPopover,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.2.0",
+		version: "22.2.6",
+		type: StarPopover,
+		isStandalone: true,
+		selector: "star-popover",
+		inputs: {
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			focusOnShow: {
+				classPropertyName: "focusOnShow",
+				publicName: "focusOnShow",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dismissable: {
+				classPropertyName: "dismissable",
+				publicName: "dismissable",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			shown: "shown",
+			hidden: "hidden"
+		},
+		viewQueries: [{
+			propertyName: "panel",
+			first: true,
+			predicate: ["panel"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: `
+    <ng-template #panel>
+      <div
+        class="star-popover"
+        role="dialog"
+        tabindex="-1"
+        [id]="panelId"
+        [attr.aria-label]="ariaLabel()"
+        (keydown.escape)="hide()"
+      >
+        <ng-content />
+      </div>
+    </ng-template>
+  `,
+		isInline: true,
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.6",
+	ngImport: i0,
+	type: StarPopover,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "star-popover",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: `
+    <ng-template #panel>
+      <div
+        class="star-popover"
+        role="dialog"
+        tabindex="-1"
+        [id]="panelId"
+        [attr.aria-label]="ariaLabel()"
+        (keydown.escape)="hide()"
+      >
+        <ng-content />
+      </div>
+    </ng-template>
+  `
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		focusOnShow: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "focusOnShow",
+				required: false
+			}]
+		}],
+		dismissable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dismissable",
+				required: false
+			}]
+		}],
+		shown: [{
+			type: i0.Output,
+			args: ["shown"]
+		}],
+		hidden: [{
+			type: i0.Output,
+			args: ["hidden"]
+		}],
+		panel: [{
+			type: i0.ViewChild,
+			args: ["panel", { isSignal: true }]
+		}]
+	}
+});
+export { StarPopover };
+
+//# sourceMappingURL=star-ng-ui-popover.mjs.map

package/fesm2022/star-ng-ui-popover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"star-ng-ui-popover.mjs","names":[],"sources":["../../../projects/star-ng/popover/popover.ts"],"sourcesContent":["import { _IdGenerator } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport {\n  ConnectedPosition,\n  createFlexibleConnectedPositionStrategy,\n  createOverlayRef,\n  createRepositionScrollStrategy,\n  OverlayRef,\n} from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport {\n  afterNextRender,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  DestroyRef,\n  inject,\n  Injector,\n  input,\n  output,\n  signal,\n  TemplateRef,\n  viewChild,\n  ViewContainerRef,\n} from '@angular/core';\nimport { StarDirectionService } from '@star-ng/ui/core';\nimport { Subscription } from 'rxjs';\n\n// `start` and `end` are turned around by the CDK in right-to-left: the popover aligns with the\n// start edge of its anchor in both directions.\nconst POSITIONS: ConnectedPosition[] = [\n  { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 8 },\n  { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: 8 },\n  { originX: 'start', originY: 'top', overlayX: 'start', overlayY: 'bottom', offsetY: -8 },\n  { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom', offsetY: -8 },\n];\n\n/**\n * Popover (PrimeNG `p-popover`, formerly OverlayPanel): rich floating content anchored to an\n * element. Native popover (top layer, works in dialogs), closes on outside click and Escape,\n * moves focus in and back to the anchor.\n *\n * ```html\n * <star-button #anchor (pressed)=\"info.toggle($event)\">Details</star-button>\n * <star-popover #info ariaLabel=\"Order details\">…</star-popover>\n * ```\n */\n@Component({\n  selector: 'star-popover',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  template: `\n    <ng-template #panel>\n      <div\n        class=\"star-popover\"\n        role=\"dialog\"\n        tabindex=\"-1\"\n        [id]=\"panelId\"\n        [attr.aria-label]=\"ariaLabel()\"\n        (keydown.escape)=\"hide()\"\n      >\n        <ng-content />\n      </div>\n    </ng-template>\n  `,\n})\nexport class StarPopover {\n  private readonly injector = inject(Injector);\n  private readonly viewContainer = inject(ViewContainerRef);\n  private readonly directionality = inject(Directionality);\n  readonly panelId = inject(_IdGenerator).getId('star-popover-');\n\n  readonly ariaLabel = input<string | null>(null);\n  /** Moves focus into the popover when it opens. */\n  readonly focusOnShow = input(true, { transform: booleanAttribute });\n  readonly dismissable = input(true, { transform: booleanAttribute });\n\n  readonly shown = output<void>();\n  readonly hidden = output<void>();\n\n  readonly visible = signal(false);\n  private readonly panel = viewChild.required<TemplateRef<unknown>>('panel');\n  private overlayRef: OverlayRef | null = null;\n  private anchor: HTMLElement | null = null;\n  private outside: Subscription | null = null;\n\n  constructor() {\n    // Keeps the CDK direction in step with the page, so a popover opened after a switch is flipped.\n    inject(StarDirectionService);\n    inject(DestroyRef).onDestroy(() => this.overlayRef?.dispose());\n  }\n\n  /** Opens on the event's current target (or a given element), or closes when open. */\n  toggle(target: Event | HTMLElement): void {\n    if (this.visible()) this.hide();\n    else this.show(target);\n  }\n\n  show(target: Event | HTMLElement): void {\n    const anchor =\n      target instanceof Event ? ((target.currentTarget ?? target.target) as HTMLElement) : target;\n    if (!anchor) return;\n    if (this.visible()) this.hide(false);\n    this.anchor = anchor;\n    const strategy = createFlexibleConnectedPositionStrategy(this.injector, anchor)\n      .withPositions(POSITIONS)\n      .withPush(true)\n      .withViewportMargin(8);\n    this.overlayRef ??= createOverlayRef(this.injector, {\n      positionStrategy: strategy,\n      scrollStrategy: createRepositionScrollStrategy(this.injector),\n      direction: this.directionality,\n      usePopover: true,\n    });\n    this.overlayRef.updatePositionStrategy(strategy);\n    this.overlayRef.attach(new TemplatePortal(this.panel(), this.viewContainer));\n    this.outside = this.overlayRef.outsidePointerEvents().subscribe((event) => {\n      if (this.dismissable() && !anchor.contains(event.target as Node)) this.hide(false);\n    });\n    anchor.setAttribute('aria-expanded', 'true');\n    anchor.setAttribute('aria-controls', this.panelId);\n    this.visible.set(true);\n    this.shown.emit();\n    if (this.focusOnShow()) {\n      afterNextRender(\n        () => {\n          const root = this.overlayRef?.overlayElement.querySelector<HTMLElement>('.star-popover');\n          const first = root?.querySelector<HTMLElement>(\n            'button:not([disabled]), [href], input:not([disabled]), select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n          );\n          (first ?? root)?.focus();\n        },\n        { injector: this.injector },\n      );\n    }\n  }\n\n  /** Closes; returns focus to the anchor when focus was inside the popover. */\n  hide(restoreFocus = true): void {\n    if (!this.visible() || !this.overlayRef) return;\n    const hadFocus = this.overlayRef.overlayElement.contains(document.activeElement);\n    this.overlayRef.detach();\n    this.anchor?.setAttribute('aria-expanded', 'false');\n    this.outside?.unsubscribe();\n    if (restoreFocus && hadFocus && this.anchor) {\n      const focusable = this.anchor.matches('button, a, input, [tabindex]')\n        ? this.anchor\n        : (this.anchor.querySelector<HTMLElement>('button, a, input') ?? this.anchor);\n      focusable.focus();\n    }\n    this.visible.set(false);\n    this.hidden.emit();\n  }\n\n  /** Re-positions after content size changes. */\n  align(): void {\n    this.overlayRef?.updatePosition();\n  }\n}\n"],"mappings":"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"}

package/fesm2022/star-ng-ui-progress-bar.mjs

@@ -0,0 +1,183 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, booleanAttribute, computed, input } from "@angular/core";
+var StarProgressBar = class StarProgressBar {
+	value = input(0, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	indeterminate = input(false, {
+		...ngDevMode ? { debugName: "indeterminate" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	showValue = input(false, {
+		...ngDevMode ? { debugName: "showValue" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	severity = input("primary", ...ngDevMode ? [{ debugName: "severity" }] : /* istanbul ignore next */ []);
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	ariaLabel = input(null, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	clamped = computed(() => Math.round(Math.min(100, Math.max(0, this.value()))), ...ngDevMode ? [{ debugName: "clamped" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.6",
+		ngImport: i0,
+		type: StarProgressBar,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.6",
+		type: StarProgressBar,
+		isStandalone: true,
+		selector: "star-progress-bar",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			indeterminate: {
+				classPropertyName: "indeterminate",
+				publicName: "indeterminate",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showValue: {
+				classPropertyName: "showValue",
+				publicName: "showValue",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			severity: {
+				classPropertyName: "severity",
+				publicName: "severity",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "role": "progressbar" },
+			properties: {
+				"class": "'star-progress star-progress--' + severity()",
+				"class.star-progress--indeterminate": "indeterminate()",
+				"class.star-progress--thin": "size() === 'sm'",
+				"attr.aria-valuemin": "indeterminate() ? null : 0",
+				"attr.aria-valuemax": "indeterminate() ? null : 100",
+				"attr.aria-valuenow": "indeterminate() ? null : clamped()",
+				"attr.aria-label": "ariaLabel()"
+			}
+		},
+		ngImport: i0,
+		template: `
+    <span class="star-progress__track">
+      <span class="star-progress__fill" [style.width.%]="indeterminate() ? null : clamped()"></span>
+    </span>
+    @if (showValue() && !indeterminate()) {
+      <span class="star-progress__value" aria-hidden="true">{{ clamped() }}%</span>
+    }
+  `,
+		isInline: true,
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.6",
+	ngImport: i0,
+	type: StarProgressBar,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "star-progress-bar",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				role: "progressbar",
+				"[class]": "'star-progress star-progress--' + severity()",
+				"[class.star-progress--indeterminate]": "indeterminate()",
+				"[class.star-progress--thin]": "size() === 'sm'",
+				"[attr.aria-valuemin]": "indeterminate() ? null : 0",
+				"[attr.aria-valuemax]": "indeterminate() ? null : 100",
+				"[attr.aria-valuenow]": "indeterminate() ? null : clamped()",
+				"[attr.aria-label]": "ariaLabel()"
+			},
+			template: `
+    <span class="star-progress__track">
+      <span class="star-progress__fill" [style.width.%]="indeterminate() ? null : clamped()"></span>
+    </span>
+    @if (showValue() && !indeterminate()) {
+      <span class="star-progress__value" aria-hidden="true">{{ clamped() }}%</span>
+    }
+  `
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		indeterminate: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "indeterminate",
+				required: false
+			}]
+		}],
+		showValue: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showValue",
+				required: false
+			}]
+		}],
+		severity: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "severity",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}]
+	}
+});
+export { StarProgressBar };
+
+//# sourceMappingURL=star-ng-ui-progress-bar.mjs.map

package/fesm2022/star-ng-ui-progress-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"star-ng-ui-progress-bar.mjs","names":[],"sources":["../../../projects/star-ng/progress-bar/progress-bar.ts"],"sourcesContent":["import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n} from '@angular/core';\n\n/**\n * Progress bar (PrimeNG `p-progressbar`): determinate value or indeterminate stripe,\n * optional value label, severity color. `role=\"progressbar\"` with `aria-valuenow`.\n *\n * `<star-progress-bar [value]=\"uploaded()\" showValue ariaLabel=\"Upload\" />`\n */\n@Component({\n  selector: 'star-progress-bar',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    role: 'progressbar',\n    '[class]': \"'star-progress star-progress--' + severity()\",\n    '[class.star-progress--indeterminate]': 'indeterminate()',\n    '[class.star-progress--thin]': \"size() === 'sm'\",\n    '[attr.aria-valuemin]': 'indeterminate() ? null : 0',\n    '[attr.aria-valuemax]': 'indeterminate() ? null : 100',\n    '[attr.aria-valuenow]': 'indeterminate() ? null : clamped()',\n    '[attr.aria-label]': 'ariaLabel()',\n  },\n  template: `\n    <span class=\"star-progress__track\">\n      <span class=\"star-progress__fill\" [style.width.%]=\"indeterminate() ? null : clamped()\"></span>\n    </span>\n    @if (showValue() && !indeterminate()) {\n      <span class=\"star-progress__value\" aria-hidden=\"true\">{{ clamped() }}%</span>\n    }\n  `,\n})\nexport class StarProgressBar {\n  readonly value = input(0);\n  readonly indeterminate = input(false, { transform: booleanAttribute });\n  readonly showValue = input(false, { transform: booleanAttribute });\n  readonly severity = input<'primary' | 'success' | 'warn' | 'danger' | 'info'>('primary');\n  readonly size = input<'sm' | 'md'>('md');\n  readonly ariaLabel = input<string | null>(null);\n\n  protected readonly clamped = computed(() => Math.round(Math.min(100, Math.max(0, this.value()))));\n}\n"],"mappings":";;AAoCA,IAAa,kBAAb,MAAa,gBAAe;CACjB,QAAQ,MAAM,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAChB,gBAAgB,MAAM,OAAK;EAAA,GAAA,YAAA,EAAA,WAAA,gBAAA,+BAAA,CAAA;EAAI,WAAW;CAAgB,CAAA;CAC1D,YAAY,MAAM,OAAK;EAAA,GAAA,YAAA,EAAA,WAAA,YAAA,+BAAA,CAAA;EAAI,WAAW;CAAgB,CAAA;CACtD,WAAW,MAA0D,WAAU,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAC/E,OAAO,MAAmB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,YAAY,MAAqB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CAE5B,UAAU,eAAe,KAAK,MAAM,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,MAAK,CAAE,CAAC,CAAC,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CARtF,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAe,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAf,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAe,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,eAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,WAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,WAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA;GAAA,YAAA,EAAA,QAAA,cAAA;GAAA,YAAA;IAAA,SAAA;IAAA,sCAAA;IAAA,6BAAA;IAAA,sBAAA;IAAA,sBAAA;IAAA,sBAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,UAAA;EAAA,UAThB;;;;;;;;EAOT,UAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAEU,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAe,YAAA,CAAA;EAtB3B,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,iBAAiB,wBAAwB;GACzC,MAAM;IACJ,MAAM;IACN,WAAW;IACX,wCAAwC;IACxC,+BAA+B;IAC/B,wBAAwB;IACxB,wBAAwB;IACxB,wBAAwB;IACxB,qBAAqB;GACtB;GACD,UAAU;;;;;;;;EAQX,CAAA"}