@expo/ui 0.1.1-alpha.1 → 0.1.1-alpha.3

package/CHANGELOG.md

@@ -10,6 +10,16 @@
 
 ### 💡 Others
 
+## 0.1.1-alpha.3 — 2025-04-21
+
+### 🐛 Bug fixes
+
+- [Android] Fixed `DatePicker` causing out of memory exception. ([#36227](https://github.com/expo/expo/pull/36227) by [@lukmccall](https://github.com/lukmccall))
+
+## 0.1.1-alpha.2 — 2025-04-14
+
+_This version does not introduce any user-facing changes._
+
 ## 0.1.1-alpha.1 — 2025-04-11
 
 _This version does not introduce any user-facing changes._

package/android/build.gradle

@@ -12,13 +12,13 @@ apply plugin: 'expo-module-gradle-plugin'
 apply plugin: 'org.jetbrains.kotlin.plugin.compose'
 
 group = 'expo.modules.ui'
-version = '0.1.1-alpha.1'
+version = '0.1.1-alpha.3'
 
 android {
   namespace "expo.modules.ui"
   defaultConfig {
     versionCode 1
-    versionName "0.1.1-alpha.1"
+    versionName "0.1.1-alpha.3"
   }
   buildFeatures {
     compose true

package/build/jetpack-compose/Button/index.d.ts

@@ -0,0 +1,70 @@
+import { StyleProp, ViewStyle } from 'react-native';
+import { MaterialIcon } from './types';
+import { ViewEvent } from '../../types';
+/**
+ * The built-in button styles available on Android.
+ * - `outlined` - A button with an outline.
+ * - `elevated` - A filled button with a shadow.
+ */
+export type ButtonVariant = 'default' | 'bordered' | 'borderless' | 'outlined' | 'elevated';
+/**
+ * Colors for button's core elements.
+ */
+export type ButtonElementColors = {
+    containerColor?: string;
+    contentColor?: string;
+    disabledContainerColor?: string;
+    disabledContentColor?: string;
+};
+export type ButtonProps = {
+    /**
+     * A callback that is called when the button is pressed.
+     */
+    onPress?: () => void;
+    /**
+     * A string describing the system image to display in the button.
+     * Uses Material Icons on Android.
+     */
+    systemImage?: MaterialIcon;
+    /**
+     * The button variant.
+     */
+    variant?: ButtonVariant;
+    /**
+     * Additional styles to apply to the button.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * The text to display inside the button.
+     */
+    children: string;
+    /**
+     * Colors for button's core elements.
+     * @platform android
+     */
+    elementColors?: ButtonElementColors;
+    /**
+     * Button color.
+     */
+    color?: string;
+    /**
+     * Disabled state of the button.
+     */
+    disabled?: boolean;
+};
+/**
+ * @hidden
+ */
+export type NativeButtonProps = Omit<ButtonProps, 'role' | 'onPress' | 'children' | 'systemImage'> & {
+    text: string;
+    systemImage?: string;
+} & ViewEvent<'onButtonPressed', void>;
+/**
+ * @hidden
+ */
+export declare function transformButtonProps(props: ButtonProps): NativeButtonProps;
+/**
+ * Displays a native button component.
+ */
+export declare function Button(props: ButtonProps): import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/build/jetpack-compose/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,CAAC;AAE5F;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,WAAW,EACX,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAChD,GAAG;IACF,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAC;AAQvC;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,WAAW,GAAG,iBAAiB,CAe1E;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,+BAQxC"}

package/build/jetpack-compose/Button/index.js

@@ -0,0 +1,31 @@
+import { requireNativeView } from 'expo';
+import { StyleSheet } from 'react-native';
+// We have to work around the `role` and `onPress` props being reserved by React Native.
+const ButtonNativeView = requireNativeView('ExpoUI', 'Button');
+/**
+ * @hidden
+ */
+export function transformButtonProps(props) {
+    const { children, onPress, systemImage, ...restProps } = props;
+    return {
+        ...restProps,
+        text: children ?? '',
+        systemImage,
+        onButtonPressed: onPress,
+        elementColors: props.elementColors
+            ? props.elementColors
+            : props.color
+                ? {
+                    containerColor: props.color,
+                }
+                : undefined,
+    };
+}
+/**
+ * Displays a native button component.
+ */
+export function Button(props) {
+    // Min height from https://m3.material.io/components/buttons/specs, minWidth
+    return (<ButtonNativeView {...transformButtonProps(props)} style={StyleSheet.compose({ minWidth: 80, minHeight: 40 }, props.style)}/>);
+}
+//# sourceMappingURL=index.js.map

package/build/jetpack-compose/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,EAAa,UAAU,EAAa,MAAM,cAAc,CAAC;AAsEhE,wFAAwF;AACxF,MAAM,gBAAgB,GAA2C,iBAAiB,CAChF,QAAQ,EACR,QAAQ,CACT,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAkB;IACrD,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC/D,OAAO;QACL,GAAG,SAAS;QACZ,IAAI,EAAE,QAAQ,IAAI,EAAE;QACpB,WAAW;QACX,eAAe,EAAE,OAAO;QACxB,aAAa,EAAE,KAAK,CAAC,aAAa;YAChC,CAAC,CAAC,KAAK,CAAC,aAAa;YACrB,CAAC,CAAC,KAAK,CAAC,KAAK;gBACX,CAAC,CAAC;oBACE,cAAc,EAAE,KAAK,CAAC,KAAK;iBAC5B;gBACH,CAAC,CAAC,SAAS;KAChB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,MAAM,CAAC,KAAkB;IACvC,4EAA4E;IAC5E,OAAO,CACL,CAAC,gBAAgB,CACf,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAChC,KAAK,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,EACxE,CACH,CAAC;AACJ,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { StyleProp, StyleSheet, ViewStyle } from 'react-native';\n\nimport { MaterialIcon } from './types';\nimport { ViewEvent } from '../../types';\n\n/**\n * The built-in button styles available on Android.\n * - `outlined` - A button with an outline.\n * - `elevated` - A filled button with a shadow.\n */\nexport type ButtonVariant = 'default' | 'bordered' | 'borderless' | 'outlined' | 'elevated';\n\n/**\n * Colors for button's core elements.\n */\nexport type ButtonElementColors = {\n  containerColor?: string;\n  contentColor?: string;\n  disabledContainerColor?: string;\n  disabledContentColor?: string;\n};\n\nexport type ButtonProps = {\n  /**\n   * A callback that is called when the button is pressed.\n   */\n  onPress?: () => void;\n  /**\n   * A string describing the system image to display in the button.\n   * Uses Material Icons on Android.\n   */\n  systemImage?: MaterialIcon;\n  /**\n   * The button variant.\n   */\n  variant?: ButtonVariant;\n  /**\n   * Additional styles to apply to the button.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The text to display inside the button.\n   */\n  children: string;\n  /**\n   * Colors for button's core elements.\n   * @platform android\n   */\n  elementColors?: ButtonElementColors;\n  /**\n   * Button color.\n   */\n  color?: string;\n  /**\n   * Disabled state of the button.\n   */\n  disabled?: boolean;\n};\n\n/**\n * @hidden\n */\nexport type NativeButtonProps = Omit<\n  ButtonProps,\n  'role' | 'onPress' | 'children' | 'systemImage'\n> & {\n  text: string;\n  systemImage?: string;\n} & ViewEvent<'onButtonPressed', void>;\n\n// We have to work around the `role` and `onPress` props being reserved by React Native.\nconst ButtonNativeView: React.ComponentType<NativeButtonProps> = requireNativeView(\n  'ExpoUI',\n  'Button'\n);\n\n/**\n * @hidden\n */\nexport function transformButtonProps(props: ButtonProps): NativeButtonProps {\n  const { children, onPress, systemImage, ...restProps } = props;\n  return {\n    ...restProps,\n    text: children ?? '',\n    systemImage,\n    onButtonPressed: onPress,\n    elementColors: props.elementColors\n      ? props.elementColors\n      : props.color\n        ? {\n            containerColor: props.color,\n          }\n        : undefined,\n  };\n}\n\n/**\n * Displays a native button component.\n */\nexport function Button(props: ButtonProps) {\n  // Min height from https://m3.material.io/components/buttons/specs, minWidth\n  return (\n    <ButtonNativeView\n      {...transformButtonProps(props)}\n      style={StyleSheet.compose({ minWidth: 80, minHeight: 40 }, props.style)}\n    />\n  );\n}\n"]}

package/build/jetpack-compose/Button/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/types.ts"],"names":[],"mappings":"AAAA,KAAK,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEvE,KAAK,IAAI,GACL,YAAY,GACZ,eAAe,GACf,KAAK,GACL,WAAW,GACX,WAAW,GACX,eAAe,GACf,cAAc,GACd,OAAO,GACP,MAAM,GACN,OAAO,GACP,aAAa,GACb,OAAO,GACP,OAAO,GACP,QAAQ,GACR,WAAW,GACX,QAAQ,GACR,MAAM,GACN,MAAM,GACN,OAAO,GACP,WAAW,GACX,MAAM,GACN,UAAU,GACV,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,mBAAmB,GACnB,mBAAmB,GACnB,oBAAoB,GACpB,iBAAiB,GACjB,MAAM,GACN,YAAY,GACZ,MAAM,GACN,aAAa,GACb,MAAM,GACN,UAAU,GACV,eAAe,GACf,QAAQ,GACR,OAAO,GACP,OAAO,GACP,WAAW,GACX,SAAS,GACT,QAAQ,GACR,MAAM,GACN,UAAU,GACV,OAAO,GACP,cAAc,GACd,MAAM,GACN,SAAS,GACT,SAAS,CAAC;AAEd,MAAM,MAAM,YAAY,GAAG,GAAG,OAAO,IAAI,IAAI,EAAE,CAAC"}

package/build/jetpack-compose/Button/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/build/jetpack-compose/Button/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/types.ts"],"names":[],"mappings":"","sourcesContent":["type Variant = 'rounded' | 'twotone' | 'outlined' | 'filled' | 'sharp';\n\ntype Icon =\n  | 'AccountBox'\n  | 'AccountCircle'\n  | 'Add'\n  | 'AddCircle'\n  | 'ArrowBack'\n  | 'ArrowDropDown'\n  | 'ArrowForward'\n  | 'Build'\n  | 'Call'\n  | 'Check'\n  | 'CheckCircle'\n  | 'Clear'\n  | 'Close'\n  | 'Create'\n  | 'DateRange'\n  | 'Delete'\n  | 'Done'\n  | 'Edit'\n  | 'Email'\n  | 'ExitToApp'\n  | 'Face'\n  | 'Favorite'\n  | 'FavoriteBorder'\n  | 'Home'\n  | 'Info'\n  | 'KeyboardArrowDown'\n  | 'KeyboardArrowLeft'\n  | 'KeyboardArrowRight'\n  | 'KeyboardArrowUp'\n  | 'List'\n  | 'LocationOn'\n  | 'Lock'\n  | 'MailOutline'\n  | 'Menu'\n  | 'MoreVert'\n  | 'Notifications'\n  | 'Person'\n  | 'Phone'\n  | 'Place'\n  | 'PlayArrow'\n  | 'Refresh'\n  | 'Search'\n  | 'Send'\n  | 'Settings'\n  | 'Share'\n  | 'ShoppingCart'\n  | 'Star'\n  | 'ThumbUp'\n  | 'Warning';\n\nexport type MaterialIcon = `${Variant}.${Icon}`;\n"]}

package/build/jetpack-compose/ContextMenu/index.d.ts

@@ -0,0 +1,86 @@
+import { ReactElement, ReactNode } from 'react';
+import { NativeSyntheticEvent, StyleProp, ViewStyle } from 'react-native';
+import { ButtonProps } from '../Button';
+import { PickerProps } from '../Picker';
+import { SwitchProps } from '../Switch';
+type SubmenuElement = ReactElement<ButtonProps> | ReactElement<SwitchProps> | ReactElement<PickerProps> | ReactElement<SubmenuProps>;
+export type ContextMenuContentProps = {
+    children: SubmenuElement | SubmenuElement[];
+};
+/**
+ * @hidden
+ */
+export type EventHandlers = Record<string, Record<string, (event: NativeSyntheticEvent<any>) => void>>;
+/**
+ * @hidden
+ */
+export type ContextMenuElementBase = {
+    contextMenuElementID: string;
+};
+/**
+ * Activation method of the context menu.
+ * - `singlePress`: The context menu is opened with a single tap. Does not isolate the content.
+ * - `longPress`: The context menu is opened with a long press. On iOS additionally Highlights the content by blurring the background.
+ */
+export type ActivationMethod = 'singlePress' | 'longPress';
+/**
+ * Props of the `ContextMenu` component.
+ */
+export type ContextMenuProps = {
+    /**
+     * Determines how the context menu will be activated.
+     *
+     * @platform ios
+     */
+    activationMethod?: ActivationMethod;
+    /**
+     * The contents of the submenu are used as an anchor for the context menu.
+     * The children will be wrapped in a pressable element, which triggers opening of the context menu.
+     */
+    children: ReactNode;
+    /**
+     * The color of the container holding the context menu items.
+     *
+     * @platform android
+     */
+    color?: string;
+    /**
+     * Optional styles to apply to the `ContextMenu`.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+/**
+ * Props of the `Submenu` component.
+ */
+export type SubmenuProps = {
+    /**
+     * The button that will be used to expand the submenu. On Android the `text` prop of the `Button` will be used as a section title.
+     */
+    button: ReactElement<ButtonProps>;
+    /**
+     * Children of the submenu. Only `Button`, `Switch`, `Picker` and `Submenu` elements should be used.
+     */
+    children: ReactNode;
+};
+export declare function Submenu(): import("react").JSX.Element;
+export declare function Items(): import("react").JSX.Element;
+export declare namespace Items {
+    var tag: string;
+}
+export declare function Trigger(props: {
+    children: React.ReactNode;
+}): import("react").JSX.Element;
+export declare namespace Trigger {
+    var tag: string;
+}
+export declare function Preview(props: {
+    children: React.ReactNode;
+}): import("react").JSX.Element;
+declare function ContextMenu(props: ContextMenuProps): import("react").JSX.Element;
+declare namespace ContextMenu {
+    var Trigger: typeof import(".").Trigger;
+    var Preview: typeof import(".").Preview;
+    var Items: typeof import(".").Items;
+}
+export { ContextMenu };
+//# sourceMappingURL=index.d.ts.map

package/build/jetpack-compose/ContextMenu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG1E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAOxC,KAAK,cAAc,GACf,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,YAAY,CAAC,CAAC;AAE/B,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,cAAc,GAAG,cAAc,EAAE,CAAC;CAC7C,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,CAChC,MAAM,EACN,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAC3D,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IAAE,oBAAoB,EAAE,MAAM,CAAA;CAAE,CAAC;AAEtE;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAAG,WAAW,CAAC;AAE3D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAyBF,wBAAgB,OAAO,gCAEtB;AAED,wBAAgB,KAAK,gCAEpB;yBAFe,KAAK;;;AAKrB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;yBAFe,OAAO;;;AAKvB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAmC3C;kBAnCQ,WAAW;;;;;AAyCpB,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/build/jetpack-compose/ContextMenu/index.js

@@ -0,0 +1,36 @@
+import { requireNativeView } from 'expo';
+import { Children, useMemo } from 'react';
+import { transformChildrenToElementArray } from './utils';
+const MenuNativeView = requireNativeView('ExpoUI', 'ContextMenu');
+export function Submenu() {
+    return <></>;
+}
+export function Items() {
+    return <></>;
+}
+Items.tag = 'Items';
+export function Trigger(props) {
+    return <></>;
+}
+Trigger.tag = 'Trigger';
+export function Preview(props) {
+    return <></>;
+}
+function ContextMenu(props) {
+    const eventHandlersMap = {};
+    const initialChildren = Children.map(props.children, (c) => c.type.tag === Items.tag ? c.props.children : null);
+    const processedElements = useMemo(() => transformChildrenToElementArray(initialChildren, eventHandlersMap), [initialChildren]);
+    const activationElement = Children.map(props.children, (c) => c.type.tag === Trigger.tag ? c.props.children : null);
+    const createEventHandler = (handlerType) => (e) => {
+        const handler = eventHandlersMap[e.nativeEvent.contextMenuElementID]?.[handlerType];
+        handler?.(e);
+    };
+    return (<MenuNativeView style={props.style} elements={processedElements} onContextMenuButtonPressed={createEventHandler('onPress')} onContextMenuSwitchValueChanged={createEventHandler('onValueChange')} onContextMenuPickerOptionSelected={createEventHandler('onOptionSelected')} {...props}>
+      {activationElement}
+    </MenuNativeView>);
+}
+ContextMenu.Trigger = Trigger;
+ContextMenu.Preview = Preview;
+ContextMenu.Items = Items;
+export { ContextMenu };
+//# sourceMappingURL=index.js.map

package/build/jetpack-compose/ContextMenu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,EAAE,QAAQ,EAA2B,OAAO,EAAE,MAAM,OAAO,CAAC;AAGnE,OAAO,EAAe,+BAA+B,EAAE,MAAM,SAAS,CAAC;AAKvE,MAAM,cAAc,GAAyC,iBAAiB,CAC5E,QAAQ,EACR,aAAa,CACd,CAAC;AAmGF,MAAM,UAAU,OAAO;IACrB,OAAO,EAAE,GAAG,CAAC;AACf,CAAC;AAED,MAAM,UAAU,KAAK;IACnB,OAAO,EAAE,GAAG,CAAC;AACf,CAAC;AACD,KAAK,CAAC,GAAG,GAAG,OAAO,CAAC;AAEpB,MAAM,UAAU,OAAO,CAAC,KAAoC;IAC1D,OAAO,EAAE,GAAG,CAAC;AACf,CAAC;AACD,OAAO,CAAC,GAAG,GAAG,SAAS,CAAC;AAExB,MAAM,UAAU,OAAO,CAAC,KAAoC;IAC1D,OAAO,EAAE,GAAG,CAAC;AACf,CAAC;AAED,SAAS,WAAW,CAAC,KAAuB;IAC1C,MAAM,gBAAgB,GAAkB,EAAE,CAAC;IAC3C,MAAM,eAAe,GAAG,QAAQ,CAAC,GAAG,CAClC,KAAK,CAAC,QAAe,EACrB,CAAC,CAAkE,EAAE,EAAE,CACrE,CAAC,CAAC,IAAI,CAAC,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CACrD,CAAC;IACF,MAAM,iBAAiB,GAAG,OAAO,CAC/B,GAAG,EAAE,CAAC,+BAA+B,CAAC,eAAe,EAAE,gBAAgB,CAAC,EACxE,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,MAAM,iBAAiB,GAAG,QAAQ,CAAC,GAAG,CACpC,KAAK,CAAC,QAAe,EACrB,CAAC,CAAkE,EAAE,EAAE,CACrE,CAAC,CAAC,IAAI,CAAC,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CACvD,CAAC;IAEF,MAAM,kBAAkB,GACtB,CAAC,WAAmB,EAAE,EAAE,CAAC,CAAC,CAAyD,EAAE,EAAE;QACrF,MAAM,OAAO,GAAG,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,oBAAoB,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;QACpF,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;IACf,CAAC,CAAC;IAEJ,OAAO,CACL,CAAC,cAAc,CACb,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CACnB,QAAQ,CAAC,CAAC,iBAAiB,CAAC,CAC5B,0BAA0B,CAAC,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,CAC1D,+BAA+B,CAAC,CAAC,kBAAkB,CAAC,eAAe,CAAC,CAAC,CACrE,iCAAiC,CAAC,CAAC,kBAAkB,CAAC,kBAAkB,CAAC,CAAC,CAC1E,IAAI,KAAK,CAAC,CACV;MAAA,CAAC,iBAAiB,CACpB;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC;AAED,WAAW,CAAC,OAAO,GAAG,OAAO,CAAC;AAC9B,WAAW,CAAC,OAAO,GAAG,OAAO,CAAC;AAC9B,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { Children, ReactElement, ReactNode, useMemo } from 'react';\nimport { NativeSyntheticEvent, StyleProp, ViewStyle } from 'react-native';\n\nimport { MenuElement, transformChildrenToElementArray } from './utils';\nimport { ButtonProps } from '../Button';\nimport { PickerProps } from '../Picker';\nimport { SwitchProps } from '../Switch';\n\nconst MenuNativeView: React.ComponentType<NativeMenuProps> = requireNativeView(\n  'ExpoUI',\n  'ContextMenu'\n);\n\ntype SubmenuElement =\n  | ReactElement<ButtonProps>\n  | ReactElement<SwitchProps>\n  | ReactElement<PickerProps>\n  | ReactElement<SubmenuProps>;\n\nexport type ContextMenuContentProps = {\n  children: SubmenuElement | SubmenuElement[];\n};\n\n/**\n * @hidden\n */\nexport type EventHandlers = Record<\n  string,\n  Record<string, (event: NativeSyntheticEvent<any>) => void>\n>;\n\n/**\n * @hidden\n */\nexport type ContextMenuElementBase = { contextMenuElementID: string };\n\n/**\n * Activation method of the context menu.\n * - `singlePress`: The context menu is opened with a single tap. Does not isolate the content.\n * - `longPress`: The context menu is opened with a long press. On iOS additionally Highlights the content by blurring the background.\n */\nexport type ActivationMethod = 'singlePress' | 'longPress';\n\n/**\n * Props of the `ContextMenu` component.\n */\nexport type ContextMenuProps = {\n  /**\n   * Determines how the context menu will be activated.\n   *\n   * @platform ios\n   */\n  activationMethod?: ActivationMethod;\n\n  /**\n   * The contents of the submenu are used as an anchor for the context menu.\n   * The children will be wrapped in a pressable element, which triggers opening of the context menu.\n   */\n  children: ReactNode;\n\n  /**\n   * The color of the container holding the context menu items.\n   *\n   * @platform android\n   */\n  color?: string;\n\n  /**\n   * Optional styles to apply to the `ContextMenu`.\n   */\n  style?: StyleProp<ViewStyle>;\n};\n\n/**\n * Props of the `Submenu` component.\n */\nexport type SubmenuProps = {\n  /**\n   * The button that will be used to expand the submenu. On Android the `text` prop of the `Button` will be used as a section title.\n   */\n  button: ReactElement<ButtonProps>;\n  /**\n   * Children of the submenu. Only `Button`, `Switch`, `Picker` and `Submenu` elements should be used.\n   */\n  children: ReactNode;\n};\n\n/**\n * @hidden\n */\ntype NativeMenuProps = ContextMenuProps & {\n  elements: MenuElement[];\n  onContextMenuButtonPressed: (\n    event: NativeSyntheticEvent<{ contextMenuElementID: string }>\n  ) => void;\n  onContextMenuSwitchValueChanged: (\n    event: NativeSyntheticEvent<{\n      contextMenuElementID: string;\n      value: boolean;\n    }>\n  ) => void;\n  onContextMenuPickerOptionSelected: (\n    event: NativeSyntheticEvent<{\n      index: number;\n      label: string;\n      contextMenuElementID: string;\n    }>\n  ) => void;\n};\n\nexport function Submenu() {\n  return <></>;\n}\n\nexport function Items() {\n  return <></>;\n}\nItems.tag = 'Items';\n\nexport function Trigger(props: { children: React.ReactNode }) {\n  return <></>;\n}\nTrigger.tag = 'Trigger';\n\nexport function Preview(props: { children: React.ReactNode }) {\n  return <></>;\n}\n\nfunction ContextMenu(props: ContextMenuProps) {\n  const eventHandlersMap: EventHandlers = {};\n  const initialChildren = Children.map(\n    props.children as any,\n    (c: { type: { tag: string }; props: { children: React.ReactNode } }) =>\n      c.type.tag === Items.tag ? c.props.children : null\n  );\n  const processedElements = useMemo(\n    () => transformChildrenToElementArray(initialChildren, eventHandlersMap),\n    [initialChildren]\n  );\n\n  const activationElement = Children.map(\n    props.children as any,\n    (c: { type: { tag: string }; props: { children: React.ReactNode } }) =>\n      c.type.tag === Trigger.tag ? c.props.children : null\n  );\n\n  const createEventHandler =\n    (handlerType: string) => (e: NativeSyntheticEvent<{ contextMenuElementID: string }>) => {\n      const handler = eventHandlersMap[e.nativeEvent.contextMenuElementID]?.[handlerType];\n      handler?.(e);\n    };\n\n  return (\n    <MenuNativeView\n      style={props.style}\n      elements={processedElements}\n      onContextMenuButtonPressed={createEventHandler('onPress')}\n      onContextMenuSwitchValueChanged={createEventHandler('onValueChange')}\n      onContextMenuPickerOptionSelected={createEventHandler('onOptionSelected')}\n      {...props}>\n      {activationElement}\n    </MenuNativeView>\n  );\n}\n\nContextMenu.Trigger = Trigger;\nContextMenu.Preview = Preview;\nContextMenu.Items = Items;\n\nexport { ContextMenu };\n"]}

package/build/jetpack-compose/ContextMenu/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAA0C,SAAS,EAAE,MAAM,OAAO,CAAC;AAG1E,OAAO,EAAE,sBAAsB,EAAE,aAAa,EAAyB,MAAM,SAAS,CAAC;AACvF,OAAO,EAAuB,iBAAiB,EAAwB,MAAM,WAAW,CAAC;AACzF,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAChD,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAGhD,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,iBAAiB,CAAC;CAC3B,GAAG,sBAAsB,CAAC;AAE3B,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,WAAW,CAAC;CACrB,GAAG,sBAAsB,CAAC;AAE3B,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,WAAW,CAAC;CACrB,GAAG,sBAAsB,CAAC;AAE3B,KAAK,cAAc,GAAG;IACpB,OAAO,EAAE;QACP,QAAQ,EAAE,WAAW,EAAE,CAAC;QACxB,MAAM,EAAE,iBAAiB,CAAC;KAC3B,CAAC;CACH,GAAG,sBAAsB,CAAC;AAE3B,MAAM,MAAM,WAAW,GACnB,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,cAAc,CAAC;AAInB,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,SAAS,EACnB,gBAAgB,EAAE,aAAa,GAC9B,WAAW,EAAE,CAIf"}

package/build/jetpack-compose/ContextMenu/utils.js

@@ -0,0 +1,79 @@
+import { Children, isValidElement } from 'react';
+import { Submenu } from './index';
+import { Button, transformButtonProps } from '../Button';
+import { Picker } from '../Picker';
+import { Switch } from '../Switch';
+// Maps the react children to NativeMenuElement[] which is used to render out the native menu
+// TODO: Ideally we want to pass the children directly to the native side without having to do this
+export function transformChildrenToElementArray(children, eventHandlersMap) {
+    return Children.toArray(children)
+        .map((child) => processChildElement(child, eventHandlersMap))
+        .filter((el) => el !== null);
+}
+function processChildElement(child, eventHandlersMap) {
+    if (!isValidElement(child))
+        return null;
+    const uuid = expo.uuidv4();
+    if (child.type === Button) {
+        // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps
+        return createButtonElement(uuid, child.props, eventHandlersMap);
+    }
+    if (child.type === Switch) {
+        // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps
+        return createSwitchElement(uuid, child.props, eventHandlersMap);
+    }
+    if (child.type === Picker) {
+        // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps
+        return createPickerElement(uuid, child.props, eventHandlersMap);
+    }
+    if (isSubmenuComponent(child)) {
+        // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps
+        return createSubmenuElement(uuid, child.props, eventHandlersMap);
+    }
+    console.warn('Unsupported child type in Menu: ', child.type);
+    return null;
+}
+function createButtonElement(uuid, props, handlers) {
+    if (props.onPress) {
+        handlers[uuid] = { onPress: props.onPress };
+    }
+    return {
+        contextMenuElementID: uuid,
+        button: transformButtonProps(props),
+    };
+}
+function createSwitchElement(uuid, props, handlers) {
+    if (props.onValueChange) {
+        handlers[uuid] = {
+            onValueChange: ({ nativeEvent: { value } }) => {
+                props.onValueChange?.(value);
+            },
+        };
+    }
+    return {
+        contextMenuElementID: uuid,
+        switch: props,
+    };
+}
+function createPickerElement(uuid, props, handlers) {
+    if (props.onOptionSelected) {
+        handlers[uuid] = { onOptionSelected: props.onOptionSelected };
+    }
+    return {
+        contextMenuElementID: uuid,
+        picker: props,
+    };
+}
+function createSubmenuElement(uuid, props, handlers) {
+    return {
+        contextMenuElementID: uuid,
+        submenu: {
+            button: transformButtonProps(props.button.props),
+            elements: transformChildrenToElementArray(props.children, handlers),
+        },
+    };
+}
+function isSubmenuComponent(child) {
+    return child.type.toString() === Submenu.toString();
+}
+//# sourceMappingURL=utils.js.map

package/build/jetpack-compose/ContextMenu/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { Children, isValidElement, ReactElement, ReactNode } from 'react';\nimport { NativeSyntheticEvent } from 'react-native';\n\nimport { ContextMenuElementBase, EventHandlers, Submenu, SubmenuProps } from './index';\nimport { Button, ButtonProps, NativeButtonProps, transformButtonProps } from '../Button';\nimport { Picker, PickerProps } from '../Picker';\nimport { Switch, SwitchProps } from '../Switch';\n\n// We use this slightly odd typing for the elements to make unpacking the elements easier on the native side\ntype ButtonMenuElement = {\n  button: NativeButtonProps;\n} & ContextMenuElementBase;\n\ntype SwitchMenuElement = {\n  switch: SwitchProps;\n} & ContextMenuElementBase;\n\ntype PickerMenuElement = {\n  picker: PickerProps;\n} & ContextMenuElementBase;\n\ntype SubmenuElement = {\n  submenu: {\n    elements: MenuElement[];\n    button: NativeButtonProps;\n  };\n} & ContextMenuElementBase;\n\nexport type MenuElement =\n  | ButtonMenuElement\n  | SwitchMenuElement\n  | PickerMenuElement\n  | SubmenuElement;\n\n// Maps the react children to NativeMenuElement[] which is used to render out the native menu\n// TODO: Ideally we want to pass the children directly to the native side without having to do this\nexport function transformChildrenToElementArray(\n  children: ReactNode,\n  eventHandlersMap: EventHandlers\n): MenuElement[] {\n  return Children.toArray(children)\n    .map((child) => processChildElement(child, eventHandlersMap))\n    .filter((el): el is MenuElement => el !== null);\n}\n\nfunction processChildElement(\n  child: ReactNode,\n  eventHandlersMap: EventHandlers\n): MenuElement | null {\n  if (!isValidElement(child)) return null;\n\n  const uuid = expo.uuidv4();\n\n  if (child.type === Button) {\n    // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps\n    return createButtonElement(uuid, child.props, eventHandlersMap);\n  }\n\n  if (child.type === Switch) {\n    // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps\n    return createSwitchElement(uuid, child.props, eventHandlersMap);\n  }\n\n  if (child.type === Picker) {\n    // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps\n    return createPickerElement(uuid, child.props, eventHandlersMap);\n  }\n\n  if (isSubmenuComponent(child)) {\n    // @ts-expect-error TODO TS2345: Argument of type unknown is not assignable to parameter of type SubmenuProps\n    return createSubmenuElement(uuid, child.props, eventHandlersMap);\n  }\n\n  console.warn('Unsupported child type in Menu: ', child.type);\n  return null;\n}\n\nfunction createButtonElement(\n  uuid: string,\n  props: ButtonProps,\n  handlers: EventHandlers\n): MenuElement {\n  if (props.onPress) {\n    handlers[uuid] = { onPress: props.onPress };\n  }\n\n  return {\n    contextMenuElementID: uuid,\n    button: transformButtonProps(props),\n  };\n}\n\nfunction createSwitchElement(\n  uuid: string,\n  props: SwitchProps,\n  handlers: EventHandlers\n): MenuElement {\n  if (props.onValueChange) {\n    handlers[uuid] = {\n      onValueChange: ({ nativeEvent: { value } }: NativeSyntheticEvent<{ value: boolean }>) => {\n        props.onValueChange?.(value);\n      },\n    };\n  }\n\n  return {\n    contextMenuElementID: uuid,\n    switch: props,\n  };\n}\n\nfunction createPickerElement(\n  uuid: string,\n  props: PickerProps,\n  handlers: EventHandlers\n): MenuElement {\n  if (props.onOptionSelected) {\n    handlers[uuid] = { onOptionSelected: props.onOptionSelected };\n  }\n\n  return {\n    contextMenuElementID: uuid,\n    picker: props,\n  };\n}\n\nfunction createSubmenuElement(\n  uuid: string,\n  props: SubmenuProps,\n  handlers: EventHandlers\n): MenuElement {\n  return {\n    contextMenuElementID: uuid,\n    submenu: {\n      button: transformButtonProps(props.button.props),\n      elements: transformChildrenToElementArray(props.children, handlers),\n    },\n  };\n}\n\nfunction isSubmenuComponent(child: ReactElement): boolean {\n  return child.type.toString() === Submenu.toString();\n}\n"]}

package/build/{DatePicker → jetpack-compose/DatePicker}/index.d.ts

@@ -1,37 +1,23 @@
 import { StyleProp, ViewStyle } from 'react-native';
-import { ViewEvent } from '../src/types';
+import { ViewEvent } from '../../types';
 export type AndroidVariant = 'picker' | 'input';
-export type IOSVariant = 'wheel' | 'automatic' | 'graphical' | 'compact';
 export type DisplayedComponents = 'date' | 'hourAndMinute' | 'dateAndTime';
 export type DateTimePickerProps = {
     /**
      * The initial date to display on the picker.
      */
     initialDate?: string | null;
-    /**
-     * A title displayed on the picker on iOS.
-     * @platform ios
-     */
-    title?: string;
     /**
      * Callback function that is called when a date is selected.
      */
     onDateSelected?: (date: Date) => void;
     /**
      * The variant of the picker, which determines its appearance and behavior.
-     * @platform ios
-     * @default 'automatic'
-     */
-    iosVariant?: IOSVariant;
-    /**
-     * The variant of the picker, which determines its appearance and behavior.
-     * @platform android
      * @default 'picker'
      */
-    androidVariant?: AndroidVariant;
+    variant?: AndroidVariant;
     /**
      * Show to button to toggle between variants on Android.
-     * @platform android
      * @default true
      */
     showVariantToggle?: boolean;
@@ -53,13 +39,12 @@ export type DateTimePickerProps = {
     color?: string;
     /**
      * Determines what format the clock should be displayed in on Android.
-     * @platform android
      * @default true
      */
     is24Hour?: boolean;
 };
-type NativeDatePickerProps = Omit<DateTimePickerProps, 'iosVariant' | 'androidVariant' | 'onDateSelected'> & {
-    variant?: IOSVariant | AndroidVariant;
+type NativeDatePickerProps = Omit<DateTimePickerProps, 'variant' | 'onDateSelected'> & {
+    variant?: AndroidVariant;
 } & ViewEvent<'onDateSelected', {
     date: Date;
 }>;

package/build/jetpack-compose/DatePicker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/DatePicker/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,SAAS,EAA0B,MAAM,cAAc,CAAC;AAE5E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEhD,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,eAAe,GAAG,aAAa,CAAC;AAE3E,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,KAAK,qBAAqB,GAAG,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,gBAAgB,CAAC,GAAG;IACrF,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B,GAAG,SAAS,CAAC,gBAAgB,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AAEhD;;GAEG;AACH,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,mBAAmB,GAAG,qBAAqB,CAoB9F;AAOD;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAExD"}

package/build/jetpack-compose/DatePicker/index.js

@@ -0,0 +1,31 @@
+import { requireNativeView } from 'expo';
+import { StyleSheet, PixelRatio } from 'react-native';
+/**
+ * @hidden
+ */
+export function transformDateTimePickerProps(props) {
+    const { variant, ...rest } = props;
+    const { minWidth, minHeight, ...restStyle } = StyleSheet.flatten(rest.style) || {};
+    // On Android, the picker’s minWidth and minHeight must be 12dp.
+    // Otherwise, the picker will crash the app.
+    const minSize = PixelRatio.getPixelSizeForLayoutSize(12);
+    // However, when users pass the minWidth and minHeight props, we trust that they know what they are doing.
+    const parsedMinWidth = minWidth ? minSize : undefined;
+    const parsedMinHeight = minHeight ? minSize : undefined;
+    return {
+        ...rest,
+        onDateSelected: ({ nativeEvent: { date } }) => {
+            props?.onDateSelected?.(new Date(date));
+        },
+        variant,
+        style: [restStyle, { minWidth: parsedMinWidth, minHeight: parsedMinHeight }],
+    };
+}
+const DatePickerNativeView = requireNativeView('ExpoUI', 'DateTimePickerView');
+/**
+ * Renders a `DateTimePicker` component.
+ */
+export function DateTimePicker(props) {
+    return <DatePickerNativeView {...transformDateTimePickerProps(props)}/>;
+}
+//# sourceMappingURL=index.js.map

package/build/jetpack-compose/DatePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/DatePicker/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,EAAwB,UAAU,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAsD5E;;GAEG;AACH,MAAM,UAAU,4BAA4B,CAAC,KAA0B;IACrE,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACnC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;IAEnF,gEAAgE;IAChE,4CAA4C;IAC5C,MAAM,OAAO,GAAG,UAAU,CAAC,yBAAyB,CAAC,EAAE,CAAC,CAAC;IAEzD,0GAA0G;IAC1G,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IACtD,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IAExD,OAAO;QACL,GAAG,IAAI;QACP,cAAc,EAAE,CAAC,EAAE,WAAW,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE;YAC5C,KAAK,EAAE,cAAc,EAAE,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1C,CAAC;QACD,OAAO;QACP,KAAK,EAAE,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;KAC7E,CAAC;AACJ,CAAC;AAED,MAAM,oBAAoB,GAA+C,iBAAiB,CACxF,QAAQ,EACR,oBAAoB,CACrB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,KAA0B;IACvD,OAAO,CAAC,oBAAoB,CAAC,IAAI,4BAA4B,CAAC,KAAK,CAAC,CAAC,EAAG,CAAC;AAC3E,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { StyleProp, ViewStyle, StyleSheet, PixelRatio } from 'react-native';\n\nimport { ViewEvent } from '../../types';\n\nexport type AndroidVariant = 'picker' | 'input';\n\nexport type DisplayedComponents = 'date' | 'hourAndMinute' | 'dateAndTime';\n\nexport type DateTimePickerProps = {\n  /**\n   * The initial date to display on the picker.\n   */\n  initialDate?: string | null;\n  /**\n   * Callback function that is called when a date is selected.\n   */\n  onDateSelected?: (date: Date) => void;\n  /**\n   * The variant of the picker, which determines its appearance and behavior.\n   * @default 'picker'\n   */\n  variant?: AndroidVariant;\n  /**\n   * Show to button to toggle between variants on Android.\n   * @default true\n   */\n  showVariantToggle?: boolean;\n  /**\n   * The components that the picker should display.\n   * On Android, you can have a picker that selects just the date or just the time.\n   * `dateAndTime` is only available on iOS and will result in a date picker on Android.\n   * On iOS, you can have a picker that selects both date and time.\n   * @default 'date'\n   */\n  displayedComponents?: DisplayedComponents;\n  /**\n   * Optional style to apply to the component.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The tint color to use on the picker elements.\n   */\n  color?: string;\n  /**\n   * Determines what format the clock should be displayed in on Android.\n   * @default true\n   */\n  is24Hour?: boolean;\n};\n\ntype NativeDatePickerProps = Omit<DateTimePickerProps, 'variant' | 'onDateSelected'> & {\n  variant?: AndroidVariant;\n} & ViewEvent<'onDateSelected', { date: Date }>;\n\n/**\n * @hidden\n */\nexport function transformDateTimePickerProps(props: DateTimePickerProps): NativeDatePickerProps {\n  const { variant, ...rest } = props;\n  const { minWidth, minHeight, ...restStyle } = StyleSheet.flatten(rest.style) || {};\n\n  // On Android, the picker’s minWidth and minHeight must be 12dp.\n  // Otherwise, the picker will crash the app.\n  const minSize = PixelRatio.getPixelSizeForLayoutSize(12);\n\n  // However, when users pass the minWidth and minHeight props, we trust that they know what they are doing.\n  const parsedMinWidth = minWidth ? minSize : undefined;\n  const parsedMinHeight = minHeight ? minSize : undefined;\n\n  return {\n    ...rest,\n    onDateSelected: ({ nativeEvent: { date } }) => {\n      props?.onDateSelected?.(new Date(date));\n    },\n    variant,\n    style: [restStyle, { minWidth: parsedMinWidth, minHeight: parsedMinHeight }],\n  };\n}\n\nconst DatePickerNativeView: React.ComponentType<NativeDatePickerProps> = requireNativeView(\n  'ExpoUI',\n  'DateTimePickerView'\n);\n\n/**\n * Renders a `DateTimePicker` component.\n */\nexport function DateTimePicker(props: DateTimePickerProps) {\n  return <DatePickerNativeView {...transformDateTimePickerProps(props)} />;\n}\n"]}

package/build/{Picker → jetpack-compose/Picker}/index.d.ts

@@ -1,7 +1,6 @@
 import { StyleProp, ViewStyle } from 'react-native';
 /**
  * Colors for picker's core elements.
- * @platform android
  */
 export type PickerElementColors = {
     activeBorderColor?: string;
@@ -26,11 +25,6 @@ export type PickerProps = {
      * The index of the currently selected option.
      */
     selectedIndex: number | null;
-    /**
-     * A label displayed on the picker when in `'menu'` variant inside a form section on iOS.
-     * @platform ios
-     */
-    label?: string;
     /**
      * Callback function that is called when an option is selected.
      */
@@ -45,18 +39,17 @@ export type PickerProps = {
      * The `'wheel'`, `'inline'`, `'palette'` and `'menu'` variants are iOS only, the `'radio'` variant is Android only. The `'inline'` variant can only be used inside sections or lists. The `'palette'` variant displays differently inside menus.
      * @default 'segmented'
      */
-    variant?: 'wheel' | 'segmented' | 'menu' | 'radio' | 'inline' | 'palette';
+    variant?: 'segmented' | 'radio';
     /**
      * Optional style to apply to the picker component.
      */
     style?: StyleProp<ViewStyle>;
     /**
      * Colors for picker's core elements.
-     * @platform android
      */
     elementColors?: PickerElementColors;
     /**
-     * Picker color. On iOS it only applies to the `'menu'` variant.
+     * Picker color.
      */
     color?: string;
 };

package/build/jetpack-compose/Picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Picker/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,4BAA4B,CAAC,EAAE,MAAM,CAAC;IACtC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,4BAA4B,CAAC,EAAE,MAAM,CAAC;IACtC,8BAA8B,CAAC,EAAE,MAAM,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,WAAW,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,KAAK,IAAI,CAAC;IACtF;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC;IAChC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAOF,KAAK,iBAAiB,GAAG,WAAW,CAAC;AAErC;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,WAAW,GAAG,iBAAiB,CAa1E;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,+BAExC"}

package/build/jetpack-compose/Picker/index.js

@@ -0,0 +1,26 @@
+import { requireNativeView } from 'expo';
+const PickerNativeView = requireNativeView('ExpoUI', 'PickerView');
+/**
+ * @hidden
+ */
+export function transformPickerProps(props) {
+    return {
+        ...props,
+        variant: props.variant ?? 'segmented',
+        elementColors: props.elementColors
+            ? props.elementColors
+            : props.color
+                ? {
+                    activeContainerColor: props.color,
+                }
+                : undefined,
+        color: props.color,
+    };
+}
+/**
+ * Displays a native picker component. Depending on the variant it can be a segmented button, an inline picker, a list of choices or a radio button.
+ */
+export function Picker(props) {
+    return <PickerNativeView {...transformPickerProps(props)}/>;
+}
+//# sourceMappingURL=index.js.map

package/build/jetpack-compose/Picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Picker/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AAuDzC,MAAM,gBAAgB,GAAqC,iBAAiB,CAC1E,QAAQ,EACR,YAAY,CACb,CAAC;AAIF;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAkB;IACrD,OAAO;QACL,GAAG,KAAK;QACR,OAAO,EAAE,KAAK,CAAC,OAAO,IAAI,WAAW;QACrC,aAAa,EAAE,KAAK,CAAC,aAAa;YAChC,CAAC,CAAC,KAAK,CAAC,aAAa;YACrB,CAAC,CAAC,KAAK,CAAC,KAAK;gBACX,CAAC,CAAC;oBACE,oBAAoB,EAAE,KAAK,CAAC,KAAK;iBAClC;gBACH,CAAC,CAAC,SAAS;QACf,KAAK,EAAE,KAAK,CAAC,KAAK;KACnB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,MAAM,CAAC,KAAkB;IACvC,OAAO,CAAC,gBAAgB,CAAC,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAC,EAAG,CAAC;AAC/D,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { StyleProp, ViewStyle } from 'react-native';\n\n/**\n * Colors for picker's core elements.\n */\nexport type PickerElementColors = {\n  activeBorderColor?: string;\n  activeContentColor?: string;\n  inactiveBorderColor?: string;\n  inactiveContentColor?: string;\n  disabledActiveBorderColor?: string;\n  disabledActiveContentColor?: string;\n  disabledInactiveBorderColor?: string;\n  disabledInactiveContentColor?: string;\n  activeContainerColor?: string;\n  inactiveContainerColor?: string;\n  disabledActiveContainerColor?: string;\n  disabledInactiveContainerColor?: string;\n};\n\nexport type PickerProps = {\n  /**\n   * An array of options to be displayed in the picker.\n   */\n  options: string[];\n  /**\n   * The index of the currently selected option.\n   */\n  selectedIndex: number | null;\n  /**\n   * Callback function that is called when an option is selected.\n   */\n  onOptionSelected?: (event: { nativeEvent: { index: number; label: string } }) => void;\n  /**\n   * The variant of the picker, which determines its appearance and behavior.\n   * The `'wheel'`, `'inline'`, `'palette'` and `'menu'` variants are iOS only, the `'radio'` variant is Android only. The `'inline'` variant can only be used inside sections or lists. The `'palette'` variant displays differently inside menus.\n   * @default 'segmented'\n   */\n  variant?: 'segmented' | 'radio';\n  /**\n   * Optional style to apply to the picker component.\n   */\n  style?: StyleProp<ViewStyle>;\n\n  /**\n   * Colors for picker's core elements.\n   */\n  elementColors?: PickerElementColors;\n  /**\n   * Picker color.\n   */\n  color?: string;\n};\n\nconst PickerNativeView: React.ComponentType<PickerProps> = requireNativeView(\n  'ExpoUI',\n  'PickerView'\n);\n\ntype NativePickerProps = PickerProps;\n\n/**\n * @hidden\n */\nexport function transformPickerProps(props: PickerProps): NativePickerProps {\n  return {\n    ...props,\n    variant: props.variant ?? 'segmented',\n    elementColors: props.elementColors\n      ? props.elementColors\n      : props.color\n        ? {\n            activeContainerColor: props.color,\n          }\n        : undefined,\n    color: props.color,\n  };\n}\n\n/**\n * Displays a native picker component. Depending on the variant it can be a segmented button, an inline picker, a list of choices or a radio button.\n */\nexport function Picker(props: PickerProps) {\n  return <PickerNativeView {...transformPickerProps(props)} />;\n}\n"]}

package/build/jetpack-compose/Progress/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Progress/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;;OAIG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;CACvC,CAAC;AAaF;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,+BAE5D;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAExD"}

package/build/jetpack-compose/Progress/index.js

@@ -0,0 +1,15 @@
+import { requireNativeView } from 'expo';
+const NativeProgressView = requireNativeView('ExpoUI', 'ProgressView');
+/**
+ * Renders a `CircularProgress` component.
+ */
+export function CircularProgress(props) {
+    return <NativeProgressView {...props} variant="circular"/>;
+}
+/**
+ * Renders a `LinearProgress` component.
+ */
+export function LinearProgress(props) {
+    return <NativeProgressView {...props} variant="linear"/>;
+}
+//# sourceMappingURL=index.js.map

package/build/jetpack-compose/Progress/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Progress/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AA0DzC,MAAM,kBAAkB,GAA6C,iBAAiB,CACpF,QAAQ,EACR,cAAc,CACf,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAA4B;IAC3D,OAAO,CAAC,kBAAkB,CAAC,IAAI,KAAK,CAAC,CAAC,OAAO,CAAC,UAAU,EAAG,CAAC;AAC9D,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,KAA0B;IACvD,OAAO,CAAC,kBAAkB,CAAC,IAAI,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAG,CAAC;AAC5D,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { ColorValue, StyleProp, ViewStyle } from 'react-native';\n\nexport type ProgressElementColors = {\n  /**\n   * Track color.\n   *\n   * @platform android\n   */\n  trackColor?: ColorValue;\n};\n\nexport type CircularProgressProps = {\n  /**\n   * Custom styles for the progress component.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The current progress value of the slider. This is a number between `0` and `1`.\n   */\n  progress?: number | null;\n  /**\n   * Progress color.\n   */\n  color?: ColorValue;\n  /**\n   * Colors for switch's core elements.\n   * @platform android\n   */\n  elementColors?: ProgressElementColors;\n};\n\nexport type LinearProgressProps = {\n  /**\n   * Custom styles for the progress component.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The current progress value of the slider. This is a number between `0` and `1`.\n   */\n  progress?: number | null;\n  /**\n   * Progress color.\n   */\n  color?: ColorValue;\n  /**\n   * Colors for switch's core elements.\n   * @platform android\n   */\n  elementColors?: ProgressElementColors;\n};\n\ntype NativeProgressProps =\n  | CircularProgressProps\n  | (LinearProgressProps & {\n      variant: 'linear' | 'circular';\n    });\n\nconst NativeProgressView: React.ComponentType<NativeProgressProps> = requireNativeView(\n  'ExpoUI',\n  'ProgressView'\n);\n\n/**\n * Renders a `CircularProgress` component.\n */\nexport function CircularProgress(props: CircularProgressProps) {\n  return <NativeProgressView {...props} variant=\"circular\" />;\n}\n\n/**\n * Renders a `LinearProgress` component.\n */\nexport function LinearProgress(props: LinearProgressProps) {\n  return <NativeProgressView {...props} variant=\"linear\" />;\n}\n"]}