@symbiote-native/angular 0.1.0

package/build/angular/components/modal.js

@@ -0,0 +1,365 @@
+// Modal: the Angular lifecycle half. RCTModalHostView is an ordinary Fabric host node committing
+// through the same childSet as the rest of the tree (no second JS surface). The style math (the
+// backdrop override, the container/host styles, the presentationStyle default), the visible gate,
+// and the iOS keep-alive reducer all live framework-agnostic in @symbiote-native/components and are shared
+// verbatim with React/Vue; here Angular supplies only the lifecycle: the keep-alive state + a
+// POST-render transition (ngOnChanges queues the reducer on a microtask so it runs AFTER the render
+// that used the OLD state, the Angular twin of React's useEffect / Vue's post-flush watch — one
+// keep-alive frame survives the visible→hidden transition), reusing renderModal's resolved props.
+// The user children nest UNDER the container View via <ng-content>.
+import { CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, inject, Input, Output, } from '@angular/core';
+import { createInitialModalState, modalReducer, renderModal, resolveAccessibilityProps, shouldRenderModal, } from '@symbiote-native/components';
+import { dlog, } from '@symbiote-native/engine';
+import { anchorHostStyle, ModalHost, SymbioteHostPropsDirective, ViewHost } from '../primitives';
+import * as i0 from "@angular/core";
+// Angular infers an `(event)` binding's $event as the DOM Event for a custom-schema element,
+// so each handler enters as `unknown` and is narrowed here before reaching a typed callback.
+function isSymbioteEvent(value) {
+    return typeof value === 'object' && value !== null && 'nativeEvent' in value;
+}
+const ORIENTATIONS = ['portrait', 'landscape'];
+function readOrientation(event) {
+    const native = event.nativeEvent;
+    if (typeof native !== 'object' || native === null || !('orientation' in native))
+        return undefined;
+    const orientation = native.orientation;
+    return ORIENTATIONS.some(value => value === orientation)
+        ? { orientation: orientation === 'landscape' ? 'landscape' : 'portrait' }
+        : undefined;
+}
+export class Modal {
+    show = new EventEmitter();
+    dismiss = new EventEmitter();
+    requestClose = new EventEmitter();
+    orientationChange = new EventEmitter();
+    accessibilityAction = new EventEmitter();
+    accessibilityTap = new EventEmitter();
+    magicTap = new EventEmitter();
+    accessibilityEscape = new EventEmitter();
+    visible;
+    transparent;
+    backdropColor;
+    animationType;
+    presentationStyle;
+    supportedOrientations;
+    hardwareAccelerated;
+    statusBarTranslucent;
+    navigationBarTranslucent;
+    allowSwipeDismissal;
+    style;
+    testID;
+    accessible;
+    accessibilityLabel;
+    accessibilityHint;
+    accessibilityRole;
+    accessibilityState;
+    accessibilityValue;
+    accessibilityActions;
+    accessibilityLabelledBy;
+    importantForAccessibility;
+    accessibilityLiveRegion;
+    screenReaderFocusable;
+    accessibilityViewIsModal;
+    accessibilityElementsHidden;
+    accessibilityIgnoresInvertColors;
+    accessibilityLanguage;
+    accessibilityRespondsToUserInteraction;
+    accessibilityShowsLargeContentViewer;
+    accessibilityLargeContentTitle;
+    role;
+    ariaLabel;
+    ariaLabelledBy;
+    ariaLive;
+    ariaHidden;
+    ariaBusy;
+    ariaChecked;
+    ariaDisabled;
+    ariaExpanded;
+    ariaSelected;
+    ariaModal;
+    ariaValueMax;
+    ariaValueMin;
+    ariaValueNow;
+    ariaValueText;
+    // The iOS keep-alive (state/modal.ts): on visible→hidden the node renders one more frame
+    // (isRendered still true) before unmounting, so the native onDismiss can arrive.
+    state = createInitialModalState(false);
+    changeDetector = inject(ChangeDetectorRef);
+    // This component's OWN host — the non-painting anchor `class="..."` at the use site resolves
+    // onto (see anchorHostStyle's doc comment) — NOT the inner `symbiote-view [style]="containerStyle"`
+    // that hosts the user children; the outer `symbiote-modal` node (bound via `hostProps` below) is
+    // the real primitive the anchor sits in front of.
+    elementRef = inject(ElementRef);
+    ngOnInit() {
+        this.state = createInitialModalState(this.visible === true);
+    }
+    ngOnChanges(changes) {
+        const visibleChange = changes.visible;
+        // First change is reflected by the ngOnInit seed; only later toggles drive the keep-alive.
+        if (visibleChange === undefined || visibleChange.firstChange)
+            return;
+        const isVisible = this.visible === true;
+        // Queue on a microtask so the reducer runs AFTER this CD pass renders with the OLD state —
+        // the keep-alive frame. A synchronous dispatch here would unmount in the same pass.
+        queueMicrotask(() => {
+            this.state = modalReducer(this.state, isVisible ? { type: 'show' } : { type: 'hide' });
+            this.changeDetector.markForCheck();
+        });
+    }
+    get shouldRender() {
+        const render = shouldRenderModal(this.visible === true, this.state);
+        if (!render)
+            dlog('Modal hidden -> no node committed');
+        return render;
+    }
+    // renderModal owns the backdrop/presentationStyle/style math (shared with React/Vue); the
+    // adapter reads the resolved host + container props off the Descriptor it returns.
+    get descriptor() {
+        return renderModal({
+            visible: this.visible,
+            transparent: this.transparent,
+            backdropColor: this.backdropColor,
+            animationType: this.animationType,
+            presentationStyle: this.presentationStyle,
+            supportedOrientations: this.supportedOrientations,
+            hardwareAccelerated: this.hardwareAccelerated,
+            statusBarTranslucent: this.statusBarTranslucent,
+            navigationBarTranslucent: this.navigationBarTranslucent,
+            allowSwipeDismissal: this.allowSwipeDismissal,
+            style: this.style,
+            passthrough: resolveAccessibilityProps(this.accessibilityInputs()),
+        });
+    }
+    // renderModal's own MODAL_HOST_STYLE (position:'absolute') is the outer symbiote-modal node's
+    // style; the anchor's class-derived style goes FIRST, that resolved style SECOND —
+    // flattenStyle's later-wins collapse keeps the modal's own style winning over its ambient class.
+    get hostProps() {
+        const descriptorProps = this.descriptor.props;
+        return { ...descriptorProps, style: [anchorHostStyle(this.elementRef), descriptorProps.style] };
+    }
+    get containerStyle() {
+        const container = this.descriptor.children[0];
+        return typeof container === 'string' ? undefined : container.props.style;
+    }
+    emit(emitter, event) {
+        if (isSymbioteEvent(event))
+            emitter.emit(event);
+    }
+    emitOrientation(event) {
+        if (!isSymbioteEvent(event))
+            return;
+        const change = readOrientation(event);
+        if (change !== undefined)
+            this.orientationChange.emit(change);
+    }
+    // Typed as the a11y intersection WITH the string index (the bag renderModal spreads into the
+    // host props), so resolveAccessibilityProps's result stays assignable to passthrough.
+    accessibilityInputs() {
+        return {
+            testID: this.testID,
+            accessible: this.accessible,
+            accessibilityLabel: this.accessibilityLabel,
+            accessibilityHint: this.accessibilityHint,
+            accessibilityRole: this.accessibilityRole,
+            accessibilityState: this.accessibilityState,
+            accessibilityValue: this.accessibilityValue,
+            accessibilityActions: this.accessibilityActions,
+            accessibilityLabelledBy: this.accessibilityLabelledBy,
+            importantForAccessibility: this.importantForAccessibility,
+            accessibilityLiveRegion: this.accessibilityLiveRegion,
+            screenReaderFocusable: this.screenReaderFocusable,
+            accessibilityViewIsModal: this.accessibilityViewIsModal,
+            accessibilityElementsHidden: this.accessibilityElementsHidden,
+            accessibilityIgnoresInvertColors: this.accessibilityIgnoresInvertColors,
+            accessibilityLanguage: this.accessibilityLanguage,
+            accessibilityRespondsToUserInteraction: this.accessibilityRespondsToUserInteraction,
+            accessibilityShowsLargeContentViewer: this.accessibilityShowsLargeContentViewer,
+            accessibilityLargeContentTitle: this.accessibilityLargeContentTitle,
+            role: this.role,
+            'aria-label': this.ariaLabel,
+            'aria-labelledby': this.ariaLabelledBy,
+            'aria-live': this.ariaLive,
+            'aria-hidden': this.ariaHidden,
+            'aria-busy': this.ariaBusy,
+            'aria-checked': this.ariaChecked,
+            'aria-disabled': this.ariaDisabled,
+            'aria-expanded': this.ariaExpanded,
+            'aria-selected': this.ariaSelected,
+            'aria-modal': this.ariaModal,
+            'aria-valuemax': this.ariaValueMax,
+            'aria-valuemin': this.ariaValueMin,
+            'aria-valuenow': this.ariaValueNow,
+            'aria-valuetext': this.ariaValueText,
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: Modal, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: Modal, isStandalone: true, selector: "Modal", inputs: { visible: "visible", transparent: "transparent", backdropColor: "backdropColor", animationType: "animationType", presentationStyle: "presentationStyle", supportedOrientations: "supportedOrientations", hardwareAccelerated: "hardwareAccelerated", statusBarTranslucent: "statusBarTranslucent", navigationBarTranslucent: "navigationBarTranslucent", allowSwipeDismissal: "allowSwipeDismissal", style: "style", testID: "testID", accessible: "accessible", accessibilityLabel: "accessibilityLabel", accessibilityHint: "accessibilityHint", accessibilityRole: "accessibilityRole", accessibilityState: "accessibilityState", accessibilityValue: "accessibilityValue", accessibilityActions: "accessibilityActions", accessibilityLabelledBy: "accessibilityLabelledBy", importantForAccessibility: "importantForAccessibility", accessibilityLiveRegion: "accessibilityLiveRegion", screenReaderFocusable: "screenReaderFocusable", accessibilityViewIsModal: "accessibilityViewIsModal", accessibilityElementsHidden: "accessibilityElementsHidden", accessibilityIgnoresInvertColors: "accessibilityIgnoresInvertColors", accessibilityLanguage: "accessibilityLanguage", accessibilityRespondsToUserInteraction: "accessibilityRespondsToUserInteraction", accessibilityShowsLargeContentViewer: "accessibilityShowsLargeContentViewer", accessibilityLargeContentTitle: "accessibilityLargeContentTitle", role: "role", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledBy: ["aria-labelledby", "ariaLabelledBy"], ariaLive: ["aria-live", "ariaLive"], ariaHidden: ["aria-hidden", "ariaHidden"], ariaBusy: ["aria-busy", "ariaBusy"], ariaChecked: ["aria-checked", "ariaChecked"], ariaDisabled: ["aria-disabled", "ariaDisabled"], ariaExpanded: ["aria-expanded", "ariaExpanded"], ariaSelected: ["aria-selected", "ariaSelected"], ariaModal: ["aria-modal", "ariaModal"], ariaValueMax: ["aria-valuemax", "ariaValueMax"], ariaValueMin: ["aria-valuemin", "ariaValueMin"], ariaValueNow: ["aria-valuenow", "ariaValueNow"], ariaValueText: ["aria-valuetext", "ariaValueText"] }, outputs: { show: "show", dismiss: "dismiss", requestClose: "requestClose", orientationChange: "orientationChange", accessibilityAction: "accessibilityAction", accessibilityTap: "accessibilityTap", magicTap: "magicTap", accessibilityEscape: "accessibilityEscape" }, usesOnChanges: true, ngImport: i0, template: `
+    @if (shouldRender) {
+      <symbiote-modal
+        [symbioteHostProps]="hostProps"
+        (show)="show.emit()"
+        (dismiss)="dismiss.emit()"
+        (requestClose)="requestClose.emit()"
+        (orientationChange)="emitOrientation($event)"
+        (accessibilityAction)="emit(accessibilityAction, $event)"
+        (accessibilityTap)="emit(accessibilityTap, $event)"
+        (magicTap)="emit(magicTap, $event)"
+        (accessibilityEscape)="emit(accessibilityEscape, $event)"
+      >
+        <symbiote-view [style]="containerStyle" [collapsable]="false">
+          <ng-content></ng-content>
+        </symbiote-view>
+      </symbiote-modal>
+    }
+  `, isInline: true, dependencies: [{ kind: "component", type: ModalHost, selector: "symbiote-modal" }, { kind: "component", type: ViewHost, selector: "symbiote-view, View" }, { kind: "directive", type: SymbioteHostPropsDirective, selector: "[symbioteHostProps]", inputs: ["symbioteHostProps"], exportAs: ["symbioteHost"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: Modal, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'Modal',
+                    standalone: true,
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    imports: [ModalHost, ViewHost, SymbioteHostPropsDirective],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    @if (shouldRender) {
+      <symbiote-modal
+        [symbioteHostProps]="hostProps"
+        (show)="show.emit()"
+        (dismiss)="dismiss.emit()"
+        (requestClose)="requestClose.emit()"
+        (orientationChange)="emitOrientation($event)"
+        (accessibilityAction)="emit(accessibilityAction, $event)"
+        (accessibilityTap)="emit(accessibilityTap, $event)"
+        (magicTap)="emit(magicTap, $event)"
+        (accessibilityEscape)="emit(accessibilityEscape, $event)"
+      >
+        <symbiote-view [style]="containerStyle" [collapsable]="false">
+          <ng-content></ng-content>
+        </symbiote-view>
+      </symbiote-modal>
+    }
+  `,
+                }]
+        }], propDecorators: { show: [{
+                type: Output
+            }], dismiss: [{
+                type: Output
+            }], requestClose: [{
+                type: Output
+            }], orientationChange: [{
+                type: Output
+            }], accessibilityAction: [{
+                type: Output
+            }], accessibilityTap: [{
+                type: Output
+            }], magicTap: [{
+                type: Output
+            }], accessibilityEscape: [{
+                type: Output
+            }], visible: [{
+                type: Input
+            }], transparent: [{
+                type: Input
+            }], backdropColor: [{
+                type: Input
+            }], animationType: [{
+                type: Input
+            }], presentationStyle: [{
+                type: Input
+            }], supportedOrientations: [{
+                type: Input
+            }], hardwareAccelerated: [{
+                type: Input
+            }], statusBarTranslucent: [{
+                type: Input
+            }], navigationBarTranslucent: [{
+                type: Input
+            }], allowSwipeDismissal: [{
+                type: Input
+            }], style: [{
+                type: Input
+            }], testID: [{
+                type: Input
+            }], accessible: [{
+                type: Input
+            }], accessibilityLabel: [{
+                type: Input
+            }], accessibilityHint: [{
+                type: Input
+            }], accessibilityRole: [{
+                type: Input
+            }], accessibilityState: [{
+                type: Input
+            }], accessibilityValue: [{
+                type: Input
+            }], accessibilityActions: [{
+                type: Input
+            }], accessibilityLabelledBy: [{
+                type: Input
+            }], importantForAccessibility: [{
+                type: Input
+            }], accessibilityLiveRegion: [{
+                type: Input
+            }], screenReaderFocusable: [{
+                type: Input
+            }], accessibilityViewIsModal: [{
+                type: Input
+            }], accessibilityElementsHidden: [{
+                type: Input
+            }], accessibilityIgnoresInvertColors: [{
+                type: Input
+            }], accessibilityLanguage: [{
+                type: Input
+            }], accessibilityRespondsToUserInteraction: [{
+                type: Input
+            }], accessibilityShowsLargeContentViewer: [{
+                type: Input
+            }], accessibilityLargeContentTitle: [{
+                type: Input
+            }], role: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input,
+                args: ['aria-label']
+            }], ariaLabelledBy: [{
+                type: Input,
+                args: ['aria-labelledby']
+            }], ariaLive: [{
+                type: Input,
+                args: ['aria-live']
+            }], ariaHidden: [{
+                type: Input,
+                args: ['aria-hidden']
+            }], ariaBusy: [{
+                type: Input,
+                args: ['aria-busy']
+            }], ariaChecked: [{
+                type: Input,
+                args: ['aria-checked']
+            }], ariaDisabled: [{
+                type: Input,
+                args: ['aria-disabled']
+            }], ariaExpanded: [{
+                type: Input,
+                args: ['aria-expanded']
+            }], ariaSelected: [{
+                type: Input,
+                args: ['aria-selected']
+            }], ariaModal: [{
+                type: Input,
+                args: ['aria-modal']
+            }], ariaValueMax: [{
+                type: Input,
+                args: ['aria-valuemax']
+            }], ariaValueMin: [{
+                type: Input,
+                args: ['aria-valuemin']
+            }], ariaValueNow: [{
+                type: Input,
+                args: ['aria-valuenow']
+            }], ariaValueText: [{
+                type: Input,
+                args: ['aria-valuetext']
+            }] } });
+//# sourceMappingURL=modal.js.map

package/build/angular/components/modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal.ts"],"names":[],"mappings":"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"}

package/build/angular/components/pressable/index.d.ts

@@ -0,0 +1,123 @@
+import { EventEmitter } from '@angular/core';
+import { type IAccessibilityProps, type IAccessibilityStateValue, type IAriaProps, type IPressableAndroidRippleConfig, type IPressHandler, type IPressState, type IRectOffset } from '@symbiote-native/components';
+import { type ISymbioteEvent, type IStyleProp, type IViewStyle } from '@symbiote-native/engine';
+import * as i0 from "@angular/core";
+export type { IPressState, IPressableAndroidRippleConfig } from '@symbiote-native/components';
+export interface IAngularPressableProps extends IAccessibilityProps, IAriaProps {
+    onPress?: IPressHandler;
+    onPressIn?: IPressHandler;
+    onPressOut?: IPressHandler;
+    onPressMove?: IPressHandler;
+    onLongPress?: IPressHandler;
+    delayLongPress?: number;
+    disabled?: boolean;
+    cancelable?: boolean;
+    hitSlop?: IRectOffset;
+    pressRetentionOffset?: IRectOffset;
+    unstable_pressDelay?: number;
+    android_ripple?: IPressableAndroidRippleConfig;
+    android_disableSound?: boolean;
+    onHoverIn?: IPressHandler;
+    onHoverOut?: IPressHandler;
+    delayHoverIn?: number;
+    delayHoverOut?: number;
+    testID?: string;
+    nativeID?: string;
+    hasTVPreferredFocus?: boolean;
+    nextFocusDown?: number;
+    nextFocusForward?: number;
+    nextFocusLeft?: number;
+    nextFocusRight?: number;
+    nextFocusUp?: number;
+    style?: IStyleProp<IViewStyle> | ((state: IPressState) => IStyleProp<IViewStyle>);
+}
+export type IAngularPressableInputs = Omit<IAngularPressableProps, 'onPress' | 'onPressIn' | 'onPressOut' | 'onPressMove' | 'onLongPress' | 'onHoverIn' | 'onHoverOut' | 'onAccessibilityAction' | 'onAccessibilityTap' | 'onMagicTap' | 'onAccessibilityEscape'>;
+export declare class Pressable implements IAngularPressableInputs {
+    readonly press: EventEmitter<ISymbioteEvent>;
+    readonly pressIn: EventEmitter<ISymbioteEvent>;
+    readonly pressOut: EventEmitter<ISymbioteEvent>;
+    readonly pressMove: EventEmitter<ISymbioteEvent>;
+    readonly longPress: EventEmitter<ISymbioteEvent>;
+    readonly hoverIn: EventEmitter<ISymbioteEvent>;
+    readonly hoverOut: EventEmitter<ISymbioteEvent>;
+    readonly accessibilityAction: EventEmitter<ISymbioteEvent>;
+    readonly accessibilityTap: EventEmitter<ISymbioteEvent>;
+    readonly magicTap: EventEmitter<ISymbioteEvent>;
+    readonly accessibilityEscape: EventEmitter<ISymbioteEvent>;
+    delayLongPress?: number;
+    disabled?: boolean;
+    cancelable?: boolean;
+    hitSlop?: IRectOffset;
+    pressRetentionOffset?: IRectOffset;
+    unstable_pressDelay?: number;
+    android_ripple?: IPressableAndroidRippleConfig;
+    android_disableSound?: boolean;
+    delayHoverIn?: number;
+    delayHoverOut?: number;
+    testID?: string;
+    nativeID?: string;
+    hasTVPreferredFocus?: boolean;
+    nextFocusDown?: number;
+    nextFocusForward?: number;
+    nextFocusLeft?: number;
+    nextFocusRight?: number;
+    nextFocusUp?: number;
+    style?: IAngularPressableProps['style'];
+    accessible?: boolean;
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+    accessibilityRole?: IAngularPressableProps['accessibilityRole'];
+    accessibilityState?: IAccessibilityStateValue;
+    accessibilityValue?: IAngularPressableProps['accessibilityValue'];
+    accessibilityActions?: IAngularPressableProps['accessibilityActions'];
+    accessibilityLabelledBy?: string | string[];
+    importantForAccessibility?: IAccessibilityProps['importantForAccessibility'];
+    accessibilityLiveRegion?: IAccessibilityProps['accessibilityLiveRegion'];
+    screenReaderFocusable?: boolean;
+    accessibilityViewIsModal?: boolean;
+    accessibilityElementsHidden?: boolean;
+    accessibilityIgnoresInvertColors?: boolean;
+    accessibilityLanguage?: string;
+    accessibilityRespondsToUserInteraction?: boolean;
+    accessibilityShowsLargeContentViewer?: boolean;
+    accessibilityLargeContentTitle?: string;
+    ariaLabel?: string;
+    ariaBusy?: boolean;
+    ariaChecked?: boolean | 'mixed';
+    ariaDisabled?: boolean;
+    ariaExpanded?: boolean;
+    ariaHidden?: boolean;
+    ariaLabelledBy?: string;
+    ariaLive?: IAriaProps['aria-live'];
+    ariaSelected?: boolean;
+    ariaModal?: boolean;
+    ariaValueMax?: number;
+    ariaValueMin?: number;
+    ariaValueNow?: number;
+    ariaValueText?: string;
+    id?: string;
+    role?: IAngularPressableProps['role'];
+    private hostElement?;
+    pressed: boolean;
+    private readonly runtime;
+    private readonly host;
+    private readonly changeDetector;
+    private readonly elementRef;
+    get resolvedStyle(): IStyleProp<IViewStyle> | undefined;
+    get foldedAccessibility(): Partial<IAngularPressableProps>;
+    get resolvedRippleProps(): Record<string, unknown> | undefined;
+    get hostProps(): Record<string, unknown>;
+    handlePressIn(event: unknown): void;
+    handlePressOut(event: unknown): void;
+    handlePress(event: unknown): void;
+    handleResponderMove(event: unknown): void;
+    claimResponder(): boolean;
+    allowTermination(): boolean;
+    emit(emitter: EventEmitter<ISymbioteEvent>, event: unknown): void;
+    private noteHoverNoop;
+    private emitterHandler;
+    private get handlers();
+    private get hostNode();
+    static ɵfac: i0.ɵɵFactoryDeclaration<Pressable, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Pressable, "Pressable, symbiote-pressable", never, { "delayLongPress": { "alias": "delayLongPress"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cancelable": { "alias": "cancelable"; "required": false; }; "hitSlop": { "alias": "hitSlop"; "required": false; }; "pressRetentionOffset": { "alias": "pressRetentionOffset"; "required": false; }; "unstable_pressDelay": { "alias": "unstable_pressDelay"; "required": false; }; "android_ripple": { "alias": "android_ripple"; "required": false; }; "android_disableSound": { "alias": "android_disableSound"; "required": false; }; "delayHoverIn": { "alias": "delayHoverIn"; "required": false; }; "delayHoverOut": { "alias": "delayHoverOut"; "required": false; }; "testID": { "alias": "testID"; "required": false; }; "nativeID": { "alias": "nativeID"; "required": false; }; "hasTVPreferredFocus": { "alias": "hasTVPreferredFocus"; "required": false; }; "nextFocusDown": { "alias": "nextFocusDown"; "required": false; }; "nextFocusForward": { "alias": "nextFocusForward"; "required": false; }; "nextFocusLeft": { "alias": "nextFocusLeft"; "required": false; }; "nextFocusRight": { "alias": "nextFocusRight"; "required": false; }; "nextFocusUp": { "alias": "nextFocusUp"; "required": false; }; "style": { "alias": "style"; "required": false; }; "accessible": { "alias": "accessible"; "required": false; }; "accessibilityLabel": { "alias": "accessibilityLabel"; "required": false; }; "accessibilityHint": { "alias": "accessibilityHint"; "required": false; }; "accessibilityRole": { "alias": "accessibilityRole"; "required": false; }; "accessibilityState": { "alias": "accessibilityState"; "required": false; }; "accessibilityValue": { "alias": "accessibilityValue"; "required": false; }; "accessibilityActions": { "alias": "accessibilityActions"; "required": false; }; "accessibilityLabelledBy": { "alias": "accessibilityLabelledBy"; "required": false; }; "importantForAccessibility": { "alias": "importantForAccessibility"; "required": false; }; "accessibilityLiveRegion": { "alias": "accessibilityLiveRegion"; "required": false; }; "screenReaderFocusable": { "alias": "screenReaderFocusable"; "required": false; }; "accessibilityViewIsModal": { "alias": "accessibilityViewIsModal"; "required": false; }; "accessibilityElementsHidden": { "alias": "accessibilityElementsHidden"; "required": false; }; "accessibilityIgnoresInvertColors": { "alias": "accessibilityIgnoresInvertColors"; "required": false; }; "accessibilityLanguage": { "alias": "accessibilityLanguage"; "required": false; }; "accessibilityRespondsToUserInteraction": { "alias": "accessibilityRespondsToUserInteraction"; "required": false; }; "accessibilityShowsLargeContentViewer": { "alias": "accessibilityShowsLargeContentViewer"; "required": false; }; "accessibilityLargeContentTitle": { "alias": "accessibilityLargeContentTitle"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaBusy": { "alias": "ariaBusy"; "required": false; }; "ariaChecked": { "alias": "ariaChecked"; "required": false; }; "ariaDisabled": { "alias": "ariaDisabled"; "required": false; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; }; "ariaHidden": { "alias": "ariaHidden"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "ariaLive": { "alias": "ariaLive"; "required": false; }; "ariaSelected": { "alias": "ariaSelected"; "required": false; }; "ariaModal": { "alias": "ariaModal"; "required": false; }; "ariaValueMax": { "alias": "ariaValueMax"; "required": false; }; "ariaValueMin": { "alias": "ariaValueMin"; "required": false; }; "ariaValueNow": { "alias": "ariaValueNow"; "required": false; }; "ariaValueText": { "alias": "ariaValueText"; "required": false; }; "id": { "alias": "id"; "required": false; }; "role": { "alias": "role"; "required": false; }; }, { "press": "press"; "pressIn": "pressIn"; "pressOut": "pressOut"; "pressMove": "pressMove"; "longPress": "longPress"; "hoverIn": "hoverIn"; "hoverOut": "hoverOut"; "accessibilityAction": "accessibilityAction"; "accessibilityTap": "accessibilityTap"; "magicTap": "magicTap"; "accessibilityEscape": "accessibilityEscape"; }, never, ["*"], true, never>;
+}