@ng-native/expo 0.0.1 → 0.1.0

package/dist/expo-ui-components.js

@@ -0,0 +1,707 @@
+/**
+ * Typed components for the `@expo/ui` SwiftUI views an app reaches for most.
+ *
+ * `EXPO_UI_VIEWS` makes every view reachable by name, and a name is all the renderer needs. What a
+ * name cannot give is a type: under strict templates an unknown element is an error, and so is
+ * each prop on it. These are the same elements, claimed by a component whose inputs carry the
+ * props' types and whose host bindings pass each one straight to the node, so nothing changes at
+ * runtime. An unset input stays `undefined` and never reaches native.
+ *
+ * Events are declared as outputs so that `$event` is typed, and are never emitted. Angular binds a
+ * template's `(dateChange)` to the output *and* to the element, and it is the element's own event
+ * that arrives, once. Emitting from a host listener as well would deliver it twice; a host listener
+ * of the same name as the output listens to the output itself and recurses. So subscribe in a
+ * template, not to the output in code.
+ *
+ * Only the views and props an app has needed are here; the rest stay names, as before. Add a view
+ * when a template wants it typed, from `@expo/ui`'s own props for it.
+ *
+ * Still register the names with `registerExpoUiViews`: the component types the element, the
+ * registration is what makes it commit as the SwiftUI view.
+ */
+import { Component, DestroyRef, ElementRef, booleanAttribute, computed, inject, input, model, output, } from '@angular/core';
+import { HostEngine, nativePlatform, } from '@ng-native/fabric';
+import { optionalBoolean, optionalNumber } from "./transforms.js";
+import * as i0 from "@angular/core";
+/**
+ * The bridge from Yoga's layout to SwiftUI's; every other `ui-*` view goes inside one.
+ * `matchContents` sizes the host to the SwiftUI content rather than the other way round, on both
+ * axes or on the ones named. Native reads a flag per axis, which is what this splits it into, as
+ * `@expo/ui`'s own `Host` does: without them the host has no size of its own, and the control
+ * drawn in it spills outside it, where it can be seen but not touched or read by VoiceOver.
+ */
+export class UiHost {
+    matchContents = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "matchContents" }] : /* istanbul ignore next */ []));
+    matchVertical = computed(() => {
+        const match = this.matchContents();
+        return typeof match === 'object' ? match.vertical : match;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "matchVertical" }] : /* istanbul ignore next */ []));
+    matchHorizontal = computed(() => {
+        const match = this.matchContents();
+        return typeof match === 'object' ? match.horizontal : match;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "matchHorizontal" }] : /* istanbul ignore next */ []));
+    ignoreSafeArea = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "ignoreSafeArea" }] : /* istanbul ignore next */ []));
+    useViewportSizeMeasurement = input(undefined, { ...(ngDevMode ? { debugName: "useViewportSizeMeasurement" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiHost, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiHost, isStandalone: true, selector: "ui-host", inputs: { matchContents: { classPropertyName: "matchContents", publicName: "matchContents", isSignal: true, isRequired: false, transformFunction: null }, ignoreSafeArea: { classPropertyName: "ignoreSafeArea", publicName: "ignoreSafeArea", isSignal: true, isRequired: false, transformFunction: null }, useViewportSizeMeasurement: { classPropertyName: "useViewportSizeMeasurement", publicName: "useViewportSizeMeasurement", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "matchContentsVertical": "matchVertical()", "matchContentsHorizontal": "matchHorizontal()", "ignoreSafeArea": "ignoreSafeArea()", "useViewportSizeMeasurement": "useViewportSizeMeasurement()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiHost, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-host',
+                    template: '<ng-content />',
+                    host: {
+                        '[matchContentsVertical]': 'matchVertical()',
+                        '[matchContentsHorizontal]': 'matchHorizontal()',
+                        '[ignoreSafeArea]': 'ignoreSafeArea()',
+                        '[useViewportSizeMeasurement]': 'useViewportSizeMeasurement()',
+                    },
+                }]
+        }], propDecorators: { matchContents: [{ type: i0.Input, args: [{ isSignal: true, alias: "matchContents", required: false }] }], ignoreSafeArea: [{ type: i0.Input, args: [{ isSignal: true, alias: "ignoreSafeArea", required: false }] }], useViewportSizeMeasurement: [{ type: i0.Input, args: [{ isSignal: true, alias: "useViewportSizeMeasurement", required: false }] }] } });
+/** A SwiftUI `Menu`. Its trigger is the `label` or a `<ui-slot name="label">`; its items are children. */
+export class UiMenu {
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    /** An SF Symbol name. */
+    systemImage = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "systemImage" }] : /* istanbul ignore next */ []));
+    accessibilityLabel = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "accessibilityLabel" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiMenu, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiMenu, isStandalone: true, selector: "ui-menu", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, systemImage: { classPropertyName: "systemImage", publicName: "systemImage", isSignal: true, isRequired: false, transformFunction: null }, accessibilityLabel: { classPropertyName: "accessibilityLabel", publicName: "accessibilityLabel", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "label": "label()", "systemImage": "systemImage()", "accessibilityLabel": "accessibilityLabel()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiMenu, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-menu',
+                    template: '<ng-content />',
+                    host: {
+                        '[label]': 'label()',
+                        '[systemImage]': 'systemImage()',
+                        '[accessibilityLabel]': 'accessibilityLabel()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], systemImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemImage", required: false }] }], accessibilityLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityLabel", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Button`, as a menu item or on its own. */
+export class UiButton {
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    /** An SF Symbol name. */
+    systemImage = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "systemImage" }] : /* istanbul ignore next */ []));
+    role = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "role" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    buttonPress = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiButton, isStandalone: true, selector: "ui-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, systemImage: { classPropertyName: "systemImage", publicName: "systemImage", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonPress: "buttonPress" }, host: { properties: { "label": "label()", "systemImage": "systemImage()", "role": "role()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiButton, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-button',
+                    template: '<ng-content />',
+                    host: {
+                        '[label]': 'label()',
+                        '[systemImage]': 'systemImage()',
+                        '[role]': 'role()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], systemImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemImage", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], buttonPress: [{ type: i0.Output, args: ["buttonPress"] }] } });
+/** A SwiftUI `Divider`: a separator between groups of menu items. */
+export class UiDivider {
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiDivider, isStandalone: true, selector: "ui-divider", inputs: { modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiDivider, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-divider',
+                    template: '',
+                    host: { '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/**
+ * Content for a named slot of its parent view, such as a menu's `label`. `extraProps` is what
+ * the slot tells its parent about itself: a `ui-swipe-actions` group's `edge` and
+ * `allowsFullSwipe`.
+ */
+export class UiSlot {
+    name = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    extraProps = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "extraProps" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSlot, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiSlot, isStandalone: true, selector: "ui-slot", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, extraProps: { classPropertyName: "extraProps", publicName: "extraProps", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "name": "name()", "extraProps": "extraProps()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSlot, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-slot',
+                    template: '<ng-content />',
+                    host: { '[name]': 'name()', '[extraProps]': 'extraProps()' },
+                }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], extraProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "extraProps", required: false }] }] } });
+/**
+ * A SwiftUI `List`: rows as SwiftUI lays them out, which is what lets a row take the system's own
+ * swipe actions through `ui-swipe-actions`.
+ */
+export class UiList {
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiList, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiList, isStandalone: true, selector: "ui-list", inputs: { modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiList, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-list',
+                    template: '<ng-content />',
+                    host: { '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/**
+ * The system's swipe actions on a list row, iOS only. The first child is the row; the actions go
+ * in `<ui-slot name="actions" [extraProps]="{ edge: 'trailing', allowsFullSwipe: true }">`, one
+ * slot per edge, as `ui-button`s.
+ */
+export class UiSwipeActions {
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSwipeActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiSwipeActions, isStandalone: true, selector: "ui-swipe-actions", inputs: { modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSwipeActions, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-swipe-actions',
+                    template: '<ng-content />',
+                    host: { '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/**
+ * A SwiftUI `Slider`, iOS only. `valueChanged` reports each new value as the thumb moves; note the
+ * d, which the native event has and `@expo/ui`'s React prop does not.
+ */
+export class UiSlider {
+    value = input(undefined, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    min = input(undefined, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    max = input(undefined, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    /** How many steps the range is divided into; none moves the thumb continuously. */
+    steps = input(undefined, { ...(ngDevMode ? { debugName: "steps" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    valueChanged = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSlider, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiSlider, isStandalone: true, selector: "ui-slider", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, host: { properties: { "value": "value()", "min": "min()", "max": "max()", "steps": "steps()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSlider, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-slider',
+                    template: '',
+                    host: {
+                        '[value]': 'value()',
+                        '[min]': 'min()',
+                        '[max]': 'max()',
+                        '[steps]': 'steps()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }] } });
+/** A SwiftUI `VStack`. */
+export class UiVStack {
+    alignment = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "alignment" }] : /* istanbul ignore next */ []));
+    spacing = input(undefined, { ...(ngDevMode ? { debugName: "spacing" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiVStack, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiVStack, isStandalone: true, selector: "ui-vstack", inputs: { alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "alignment": "alignment()", "spacing": "spacing()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiVStack, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-vstack',
+                    template: '<ng-content />',
+                    host: {
+                        '[alignment]': 'alignment()',
+                        '[spacing]': 'spacing()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Image`: an SF Symbol by `systemName`, or a picture by `uiImage` URL. */
+export class UiImage {
+    systemName = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "systemName" }] : /* istanbul ignore next */ []));
+    uiImage = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "uiImage" }] : /* istanbul ignore next */ []));
+    size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    color = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiImage, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiImage, isStandalone: true, selector: "ui-image", inputs: { systemName: { classPropertyName: "systemName", publicName: "systemName", isSignal: true, isRequired: false, transformFunction: null }, uiImage: { classPropertyName: "uiImage", publicName: "uiImage", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "systemName": "systemName()", "uiImage": "uiImage()", "size": "size()", "color": "color()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiImage, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-image',
+                    template: '',
+                    host: {
+                        '[systemName]': 'systemName()',
+                        '[uiImage]': 'uiImage()',
+                        '[size]': 'size()',
+                        '[color]': 'color()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { systemName: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemName", required: false }] }], uiImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "uiImage", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Text`. */
+export class UiText {
+    text = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "text" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiText, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiText, isStandalone: true, selector: "ui-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "text": "text()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiText, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-text',
+                    template: '',
+                    host: { '[text]': 'text()', '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/**
+ * Listen for one of a `ui-*` view's own events from inside its component. Not a host listener:
+ * one named as an output listens to the output itself, and see the note at the top of this file
+ * for why the outputs are never emitted.
+ */
+function listen(event, handle) {
+    const node = inject(ElementRef).nativeElement;
+    const engine = node.host ?? inject(HostEngine);
+    const stop = engine.setEventListener(node, event, (raw) => handle(raw?.nativeEvent ?? {}));
+    inject(DestroyRef).onDestroy(stop);
+}
+/** The caller's modifiers, with SwiftUI's `disabled` added while the field is. */
+function withDisabled(modifiers, disabled) {
+    return disabled ? [...(modifiers ?? []), { $type: 'disabled', disabled: true }] : modifiers;
+}
+/**
+ * A date picker: SwiftUI's `DatePicker` on iOS, Compose's on Android.
+ *
+ * A Signal Forms field as it stands - `<ui-date-picker [formField]="f.arrival" />` - through its
+ * `value` model, a `Date` (or null). The two platforms take and report a date differently, and
+ * this is where that difference ends: SwiftUI is handed `selection` as ISO text and reports
+ * `dateChange`; Compose is handed `initialDate` in milliseconds and reports `dateSelected`. Either
+ * way the model gets a `Date`. A `disabled` field adds SwiftUI's `disabled` modifier. SwiftUI's
+ * picker always shows a date, today when the field is empty, and the date it reports as it appears
+ * is not taken as the user's; an optional date is best asked for behind a button that shows the
+ * picker once the user wants to give one.
+ *
+ * `selection` is still accepted as ISO text, for a picker bound without a form.
+ */
+export class UiDatePicker {
+    title = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
+    selection = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "selection" }] : /* istanbul ignore next */ []));
+    displayedComponents = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "displayedComponents" }] : /* istanbul ignore next */ []));
+    range = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "range" }] : /* istanbul ignore next */ []));
+    accessibilityLabel = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "accessibilityLabel" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    /** The picked date: what `[formField]` binds. */
+    value = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** The user picked, which is when a form shows a field's errors: a picker has no blur. */
+    touch = output();
+    dateChange = output();
+    android = nativePlatform() === 'android';
+    resolvedSelection = computed(() => this.android ? undefined : (this.selection() ?? this.value()?.toISOString()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedSelection" }] : /* istanbul ignore next */ []));
+    initialDate = computed(() => this.android ? (this.value()?.getTime() ?? null) : undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialDate" }] : /* istanbul ignore next */ []));
+    resolvedModifiers = computed(() => this.android ? this.modifiers() : withDisabled(this.modifiers(), this.disabled()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedModifiers" }] : /* istanbul ignore next */ []));
+    /**
+     * SwiftUI's picker cannot be empty: it shows today, and reports that as a change the moment it
+     * appears. Taken as the user's choice, an empty date field would fill itself in, pass
+     * `required` and mark the form dirty before anyone touched it. So the first report, while the
+     * field is empty and the picker has only just appeared, is the picker describing itself.
+     */
+    appeared = Date.now();
+    settled = false;
+    constructor() {
+        listen(this.android ? 'topDateSelected' : 'topDateChange', ({ date }) => {
+            if (typeof date !== 'string' && typeof date !== 'number')
+                return;
+            const describingItself = !this.settled && this.value() === null && Date.now() - this.appeared < APPEARING_MS;
+            this.settled = true;
+            if (describingItself)
+                return;
+            this.value.set(new Date(date));
+            this.touch.emit();
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiDatePicker, isStandalone: true, selector: "ui-date-picker", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, displayedComponents: { classPropertyName: "displayedComponents", publicName: "displayedComponents", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, accessibilityLabel: { classPropertyName: "accessibilityLabel", publicName: "accessibilityLabel", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch", dateChange: "dateChange" }, host: { properties: { "title": "title()", "selection": "resolvedSelection()", "initialDate": "initialDate()", "displayedComponents": "displayedComponents()", "range": "range()", "accessibilityLabel": "accessibilityLabel()", "modifiers": "resolvedModifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiDatePicker, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-date-picker',
+                    template: '',
+                    host: {
+                        '[title]': 'title()',
+                        '[selection]': 'resolvedSelection()',
+                        '[initialDate]': 'initialDate()',
+                        '[displayedComponents]': 'displayedComponents()',
+                        '[range]': 'range()',
+                        '[accessibilityLabel]': 'accessibilityLabel()',
+                        '[modifiers]': 'resolvedModifiers()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], displayedComponents: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayedComponents", required: false }] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }], accessibilityLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityLabel", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touch: [{ type: i0.Output, args: ["touch"] }], dateChange: [{ type: i0.Output, args: ["dateChange"] }] } });
+/** How long after a date picker appears its first report is taken to be about itself. */
+const APPEARING_MS = 1000;
+/**
+ * A SwiftUI `Picker`, iOS only, as a Signal Forms field: `<ui-picker [options]="rooms"
+ * [formField]="f.room" />`. `options` draws the choices, each tagged with its value, which is the
+ * content slot and `tag` modifiers `@expo/ui` otherwise wants written out by hand; children still
+ * work for anything richer. `pickerStyle` is SwiftUI's (`menu`, `segmented`, `wheel`, `inline`).
+ */
+export class UiPicker {
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    /** An SF Symbol name. */
+    systemImage = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "systemImage" }] : /* istanbul ignore next */ []));
+    options = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "options" }] : /* istanbul ignore next */ []));
+    pickerStyle = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "pickerStyle" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    /** The chosen option's value: what `[formField]` binds. */
+    value = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** The user picked, which is when a form shows a field's errors: a picker has no blur. */
+    touch = output();
+    selectionChange = output();
+    /** Each option's `tag`, one array per value, so a pass hands native the same objects. */
+    tags = computed(() => new Map((this.options() ?? []).map((option) => [
+        option.value,
+        [{ $type: 'tag', tag: option.value }],
+    ])), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tags" }] : /* istanbul ignore next */ []));
+    resolvedModifiers = computed(() => {
+        const style = this.pickerStyle();
+        const own = style
+            ? [{ $type: 'pickerStyle', style }, ...(this.modifiers() ?? [])]
+            : this.modifiers();
+        return withDisabled(own, this.disabled());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedModifiers" }] : /* istanbul ignore next */ []));
+    constructor() {
+        listen('topSelectionChange', ({ selection }) => {
+            if (typeof selection !== 'string' && typeof selection !== 'number')
+                return;
+            this.value.set(selection);
+            this.touch.emit();
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.0", type: UiPicker, isStandalone: true, selector: "ui-picker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, systemImage: { classPropertyName: "systemImage", publicName: "systemImage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, pickerStyle: { classPropertyName: "pickerStyle", publicName: "pickerStyle", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch", selectionChange: "selectionChange" }, host: { properties: { "label": "label()", "systemImage": "systemImage()", "selection": "value()", "modifiers": "resolvedModifiers()" } }, ngImport: i0, template: `
+    @if (options(); as options) {
+      <ui-slot name="content">
+        @for (option of options; track option.value) {
+          <ui-text [text]="option.label" [modifiers]="tags().get(option.value)" />
+        }
+      </ui-slot>
+    }
+    <ng-content />
+  `, isInline: true, dependencies: [{ kind: "component", type: UiSlot, selector: "ui-slot", inputs: ["name", "extraProps"] }, { kind: "component", type: UiText, selector: "ui-text", inputs: ["text", "modifiers"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiPicker, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-picker',
+                    imports: [UiSlot, UiText],
+                    template: `
+    @if (options(); as options) {
+      <ui-slot name="content">
+        @for (option of options; track option.value) {
+          <ui-text [text]="option.label" [modifiers]="tags().get(option.value)" />
+        }
+      </ui-slot>
+    }
+    <ng-content />
+  `,
+                    host: {
+                        '[label]': 'label()',
+                        '[systemImage]': 'systemImage()',
+                        '[selection]': 'value()',
+                        '[modifiers]': 'resolvedModifiers()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], systemImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemImage", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], pickerStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerStyle", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touch: [{ type: i0.Output, args: ["touch"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
+/** A SwiftUI `Toggle`. `isOnChange` reports each flip. */
+export class UiToggle {
+    isOn = input(undefined, { ...(ngDevMode ? { debugName: "isOn" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    isOnChange = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiToggle, isStandalone: true, selector: "ui-toggle", inputs: { isOn: { classPropertyName: "isOn", publicName: "isOn", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOnChange: "isOnChange" }, host: { properties: { "isOn": "isOn()", "label": "label()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiToggle, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-toggle',
+                    template: '<ng-content />',
+                    host: { '[isOn]': 'isOn()', '[label]': 'label()', '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { isOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOn", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], isOnChange: [{ type: i0.Output, args: ["isOnChange"] }] } });
+/** A SwiftUI `Stepper`, between `min` and `max` by `step`. */
+export class UiStepper {
+    value = input(undefined, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    min = input(undefined, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    max = input(undefined, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    step = input(undefined, { ...(ngDevMode ? { debugName: "step" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    valueChange = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiStepper, isStandalone: true, selector: "ui-stepper", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { properties: { "value": "value()", "min": "min()", "max": "max()", "step": "step()", "label": "label()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiStepper, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-stepper',
+                    template: '<ng-content />',
+                    host: {
+                        '[value]': 'value()',
+                        '[min]': 'min()',
+                        '[max]': 'max()',
+                        '[step]': 'step()',
+                        '[label]': 'label()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+/**
+ * A SwiftUI `TextField`. `text` is where it keeps what is typed, a `nativeState('')`: the field
+ * writes to it on the UI thread, and `textChange` reports each change.
+ */
+export class UiTextField {
+    text = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "text" }] : /* istanbul ignore next */ []));
+    placeholder = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    textChange = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiTextField, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiTextField, isStandalone: true, selector: "ui-text-field", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { textChange: "textChange" }, host: { properties: { "text": "text()?.id", "placeholder": "placeholder()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiTextField, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-text-field',
+                    template: '',
+                    host: {
+                        '[text]': 'text()?.id',
+                        '[placeholder]': 'placeholder()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], textChange: [{ type: i0.Output, args: ["textChange"] }] } });
+/** A SwiftUI `ColorPicker`. `selection` is a colour as hex. */
+export class UiColorPicker {
+    selection = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "selection" }] : /* istanbul ignore next */ []));
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    supportsOpacity = input(undefined, { ...(ngDevMode ? { debugName: "supportsOpacity" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    selectionChange = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiColorPicker, isStandalone: true, selector: "ui-color-picker", inputs: { selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, supportsOpacity: { classPropertyName: "supportsOpacity", publicName: "supportsOpacity", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, host: { properties: { "selection": "selection()", "label": "label()", "supportsOpacity": "supportsOpacity()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiColorPicker, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-color-picker',
+                    template: '',
+                    host: {
+                        '[selection]': 'selection()',
+                        '[label]': 'label()',
+                        '[supportsOpacity]': 'supportsOpacity()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], supportsOpacity: [{ type: i0.Input, args: [{ isSignal: true, alias: "supportsOpacity", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
+/** A SwiftUI `Gauge`: `value` between `min` and `max`, drawn as `type` says. */
+export class UiGauge {
+    value = input(undefined, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    min = input(undefined, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    max = input(undefined, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    type = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "type" }] : /* istanbul ignore next */ []));
+    currentValueLabel = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "currentValueLabel" }] : /* istanbul ignore next */ []));
+    minimumValueLabel = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "minimumValueLabel" }] : /* istanbul ignore next */ []));
+    maximumValueLabel = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "maximumValueLabel" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiGauge, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiGauge, isStandalone: true, selector: "ui-gauge", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, currentValueLabel: { classPropertyName: "currentValueLabel", publicName: "currentValueLabel", isSignal: true, isRequired: false, transformFunction: null }, minimumValueLabel: { classPropertyName: "minimumValueLabel", publicName: "minimumValueLabel", isSignal: true, isRequired: false, transformFunction: null }, maximumValueLabel: { classPropertyName: "maximumValueLabel", publicName: "maximumValueLabel", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "value": "value()", "min": "min()", "max": "max()", "type": "type()", "currentValueLabel": "currentValueLabel()", "minimumValueLabel": "minimumValueLabel()", "maximumValueLabel": "maximumValueLabel()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiGauge, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-gauge',
+                    template: '<ng-content />',
+                    host: {
+                        '[value]': 'value()',
+                        '[min]': 'min()',
+                        '[max]': 'max()',
+                        '[type]': 'type()',
+                        '[currentValueLabel]': 'currentValueLabel()',
+                        '[minimumValueLabel]': 'minimumValueLabel()',
+                        '[maximumValueLabel]': 'maximumValueLabel()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], currentValueLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentValueLabel", required: false }] }], minimumValueLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "minimumValueLabel", required: false }] }], maximumValueLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximumValueLabel", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `ProgressView`: a bar filled to `value`, from 0 to 1, or a spinner without one. */
+export class UiProgress {
+    value = input(undefined, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiProgress, isStandalone: true, selector: "ui-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "value": "value()", "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiProgress, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-progress',
+                    template: '',
+                    host: { '[value]': 'value()', '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `HStack`. */
+export class UiHStack {
+    alignment = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "alignment" }] : /* istanbul ignore next */ []));
+    spacing = input(undefined, { ...(ngDevMode ? { debugName: "spacing" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiHStack, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiHStack, isStandalone: true, selector: "ui-hstack", inputs: { alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "alignment": "alignment()", "spacing": "spacing()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiHStack, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-hstack',
+                    template: '<ng-content />',
+                    host: {
+                        '[alignment]': 'alignment()',
+                        '[spacing]': 'spacing()',
+                        '[modifiers]': 'modifiers()',
+                    },
+                }]
+        }], propDecorators: { alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Spacer`: the room left over in its stack. */
+export class UiSpacer {
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSpacer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiSpacer, isStandalone: true, selector: "ui-spacer", inputs: { modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "modifiers": "modifiers()" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSpacer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-spacer',
+                    template: '',
+                    host: { '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `LabeledContent`: a label, and its content beside it. */
+export class UiLabeledContent {
+    label = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiLabeledContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiLabeledContent, isStandalone: true, selector: "ui-labeled-content", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "label": "label()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiLabeledContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-labeled-content',
+                    template: '<ng-content />',
+                    host: { '[label]': 'label()', '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Form`: settings-style grouped rows. */
+export class UiForm {
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiForm, isStandalone: true, selector: "ui-form", inputs: { modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiForm, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-form',
+                    template: '<ng-content />',
+                    host: { '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+/** A SwiftUI `Section` of a form or a list, under `title`. */
+export class UiSection {
+    title = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
+    modifiers = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "modifiers" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.0", type: UiSection, isStandalone: true, selector: "ui-section", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, modifiers: { classPropertyName: "modifiers", publicName: "modifiers", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "title": "title()", "modifiers": "modifiers()" } }, ngImport: i0, template: '<ng-content />', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: UiSection, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-section',
+                    template: '<ng-content />',
+                    host: { '[title]': 'title()', '[modifiers]': 'modifiers()' },
+                }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], modifiers: [{ type: i0.Input, args: [{ isSignal: true, alias: "modifiers", required: false }] }] } });
+//# sourceMappingURL=expo-ui-components.js.map