@entropix/react-native 0.3.0 → 1.0.1

package/dist/chunk-Z2MBHXUQ.cjs

@@ -0,0 +1,127 @@
+'use strict';
+
+var chunkP5NAXMSC_cjs = require('./chunk-P5NAXMSC.cjs');
+var chunkBOUIB4OY_cjs = require('./chunk-BOUIB4OY.cjs');
+var core = require('@entropix/core');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var reactNative = require('react-native');
+
+var MenuContext = react.createContext(null);
+function useMenuContext() {
+  const context = react.useContext(MenuContext);
+  if (!context) {
+    throw new Error(
+      "Menu compound components must be used within a <Menu> provider."
+    );
+  }
+  return context;
+}
+function Menu({ children, ...options }) {
+  const menu = core.useMenu(options);
+  return /* @__PURE__ */ jsxRuntime.jsx(MenuContext.Provider, { value: menu, children });
+}
+function MenuTrigger({ children, style, ...rest }) {
+  const { getTriggerProps } = useMenuContext();
+  const propGetterReturn = getTriggerProps();
+  const rnAccessibility = chunkP5NAXMSC_cjs.mapAccessibilityToRN(propGetterReturn.accessibility);
+  const handlePress = react.useCallback(() => {
+    propGetterReturn.onAction?.();
+  }, [propGetterReturn.onAction]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.Pressable,
+    {
+      ...rnAccessibility,
+      ...rest,
+      onPress: handlePress,
+      style,
+      children
+    }
+  );
+}
+function MenuContent({ children, style, testID }) {
+  const { tokens: t, baseTokens: bt } = chunkBOUIB4OY_cjs.useTheme();
+  const { isOpen, getMenuProps } = useMenuContext();
+  const propGetterReturn = getMenuProps();
+  const rnAccessibility = chunkP5NAXMSC_cjs.mapAccessibilityToRN(propGetterReturn.accessibility);
+  if (!isOpen) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.View,
+    {
+      ...rnAccessibility,
+      testID,
+      style: [
+        {
+          minWidth: 160,
+          padding: bt.entropixSpacing1,
+          backgroundColor: t.entropixColorBgPrimary,
+          borderWidth: 1,
+          borderColor: t.entropixColorBorderDefault,
+          borderRadius: bt.entropixRadiusMd,
+          shadowColor: "#000",
+          shadowOffset: { width: 0, height: 2 },
+          shadowOpacity: 0.1,
+          shadowRadius: 8,
+          elevation: 4
+        },
+        style
+      ],
+      children
+    }
+  );
+}
+function wrapStringChildren(children, style) {
+  if (typeof children === "string" || typeof children === "number") {
+    return /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style, children });
+  }
+  return children;
+}
+function MenuItem({
+  index,
+  onSelect,
+  disabled,
+  children,
+  style,
+  textStyle,
+  ...rest
+}) {
+  const { tokens: t, baseTokens: bt } = chunkBOUIB4OY_cjs.useTheme();
+  const { getItemProps } = useMenuContext();
+  const propGetterReturn = getItemProps(index, { onSelect, disabled });
+  const rnAccessibility = chunkP5NAXMSC_cjs.mapAccessibilityToRN(propGetterReturn.accessibility);
+  const handlePress = react.useCallback(() => {
+    propGetterReturn.onAction?.();
+  }, [propGetterReturn.onAction]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.Pressable,
+    {
+      ...rnAccessibility,
+      ...rest,
+      disabled,
+      onPress: propGetterReturn.onAction ? handlePress : void 0,
+      style: [
+        {
+          flexDirection: "row",
+          alignItems: "center",
+          paddingVertical: bt.entropixSpacing2,
+          paddingHorizontal: bt.entropixSpacing3,
+          borderRadius: bt.entropixRadiusSm,
+          opacity: disabled ? 0.5 : 1
+        },
+        style
+      ],
+      children: wrapStringChildren(children, {
+        fontSize: bt.entropixFontSizeSm,
+        color: t.entropixColorTextPrimary,
+        ...textStyle
+      })
+    }
+  );
+}
+
+exports.Menu = Menu;
+exports.MenuContent = MenuContent;
+exports.MenuItem = MenuItem;
+exports.MenuTrigger = MenuTrigger;
+//# sourceMappingURL=chunk-Z2MBHXUQ.cjs.map
+//# sourceMappingURL=chunk-Z2MBHXUQ.cjs.map

package/dist/chunk-ZPAOLIIG.cjs

@@ -0,0 +1,88 @@
+'use strict';
+
+var chunkP5NAXMSC_cjs = require('./chunk-P5NAXMSC.cjs');
+var chunkBOUIB4OY_cjs = require('./chunk-BOUIB4OY.cjs');
+var react = require('react');
+var reactNative = require('react-native');
+var core = require('@entropix/core');
+var jsxRuntime = require('react/jsx-runtime');
+
+var TRACK_WIDTH = 44;
+var TRACK_HEIGHT = 24;
+var TRACK_PADDING = 2;
+var THUMB_SIZE = TRACK_HEIGHT - TRACK_PADDING * 2;
+var THUMB_TRAVEL = TRACK_WIDTH - TRACK_PADDING * 2 - THUMB_SIZE;
+function Switch({
+  checked,
+  defaultChecked,
+  onChange,
+  disabled,
+  label,
+  style,
+  ...rest
+}) {
+  const { tokens: t, baseTokens: bt } = chunkBOUIB4OY_cjs.useTheme();
+  const { isDisabled, getToggleProps } = core.useToggle({
+    checked,
+    defaultChecked,
+    onChange,
+    disabled,
+    role: "switch"
+  });
+  const propGetterReturn = getToggleProps();
+  const rnAccessibility = chunkP5NAXMSC_cjs.mapAccessibilityToRN(propGetterReturn.accessibility);
+  const isChecked = propGetterReturn.accessibility.checked === true;
+  if (label) {
+    rnAccessibility.accessibilityLabel = label;
+  }
+  const handlePress = react.useCallback(() => {
+    propGetterReturn.onAction?.();
+  }, [propGetterReturn.onAction]);
+  const thumbAnim = react.useRef(
+    new reactNative.Animated.Value(defaultChecked || checked ? THUMB_TRAVEL : 0)
+  ).current;
+  react.useEffect(() => {
+    reactNative.Animated.timing(thumbAnim, {
+      toValue: isChecked ? THUMB_TRAVEL : 0,
+      duration: 150,
+      useNativeDriver: false
+    }).start();
+  }, [isChecked, thumbAnim]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.Pressable,
+    {
+      ...rnAccessibility,
+      ...rest,
+      disabled: isDisabled,
+      onPress: isDisabled ? void 0 : handlePress,
+      style: [
+        {
+          width: TRACK_WIDTH,
+          height: TRACK_HEIGHT,
+          borderRadius: bt.entropixRadiusFull,
+          backgroundColor: isChecked ? t.entropixColorActionPrimaryDefault : t.entropixColorGray300,
+          padding: TRACK_PADDING,
+          justifyContent: "center"
+        },
+        isDisabled && { opacity: 0.5 },
+        style
+      ],
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        reactNative.Animated.View,
+        {
+          style: {
+            width: THUMB_SIZE,
+            height: THUMB_SIZE,
+            borderRadius: bt.entropixRadiusFull,
+            backgroundColor: t.entropixColorWhite,
+            transform: [{ translateX: thumbAnim }]
+          }
+        }
+      )
+    }
+  );
+}
+
+exports.Switch = Switch;
+//# sourceMappingURL=chunk-ZPAOLIIG.cjs.map
+//# sourceMappingURL=chunk-ZPAOLIIG.cjs.map

package/dist/chunk-ZYOTKLBG.js

@@ -0,0 +1,52 @@
+import { createContext, useMemo, useContext } from 'react';
+import { tokens } from '@entropix/tokens/native';
+import { tokens as tokens$1 } from '@entropix/tokens/native/light';
+import { tokens as tokens$2 } from '@entropix/tokens/native/dark';
+import { jsx } from 'react/jsx-runtime';
+
+// src/theme/theme-context.tsx
+var ThemeContext = createContext({
+  mode: "light",
+  brand: "default",
+  tokens: tokens$1,
+  baseTokens: tokens
+});
+var brandRegistry = {
+  default: {
+    light: tokens$1,
+    dark: tokens$2
+  }
+};
+function registerBrand(name, themes) {
+  brandRegistry[name] = themes;
+}
+function EntropixProvider({
+  mode = "light",
+  brand = "default",
+  tokens: tokenOverride,
+  children
+}) {
+  const value = useMemo(() => {
+    let resolvedTokens;
+    if (tokenOverride) {
+      resolvedTokens = tokenOverride;
+    } else {
+      const brandThemes = brandRegistry[brand] ?? brandRegistry.default;
+      resolvedTokens = brandThemes[mode] ?? brandThemes.light;
+    }
+    return {
+      mode,
+      brand,
+      tokens: resolvedTokens,
+      baseTokens: tokens
+    };
+  }, [mode, brand, tokenOverride]);
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value, children });
+}
+function useTheme() {
+  return useContext(ThemeContext);
+}
+
+export { EntropixProvider, registerBrand, useTheme };
+//# sourceMappingURL=chunk-ZYOTKLBG.js.map
+//# sourceMappingURL=chunk-ZYOTKLBG.js.map

package/dist/dialog.cjs

@@ -0,0 +1,38 @@
+'use strict';
+
+var chunkPKDXWKLO_cjs = require('./chunk-PKDXWKLO.cjs');
+require('./chunk-P5NAXMSC.cjs');
+require('./chunk-BOUIB4OY.cjs');
+
+
+
+Object.defineProperty(exports, "Dialog", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.Dialog; }
+});
+Object.defineProperty(exports, "DialogClose", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogClose; }
+});
+Object.defineProperty(exports, "DialogContent", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogContent; }
+});
+Object.defineProperty(exports, "DialogDescription", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogDescription; }
+});
+Object.defineProperty(exports, "DialogOverlay", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogOverlay; }
+});
+Object.defineProperty(exports, "DialogTitle", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogTitle; }
+});
+Object.defineProperty(exports, "DialogTrigger", {
+  enumerable: true,
+  get: function () { return chunkPKDXWKLO_cjs.DialogTrigger; }
+});
+//# sourceMappingURL=dialog.cjs.map
+//# sourceMappingURL=dialog.cjs.map

package/dist/dialog.d.cts

@@ -0,0 +1,83 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+import { UseDialogOptions } from '@entropix/core';
+import { PressableProps, StyleProp, ViewStyle, ViewProps, TextProps, TextStyle } from 'react-native';
+
+interface DialogProps extends UseDialogOptions {
+    children: React.ReactNode;
+}
+/**
+ * Dialog root — provides dialog state to compound sub-components.
+ * Renders no UI of its own.
+ */
+declare function Dialog({ children, isOpen, defaultOpen, onOpenChange, closeOnOverlayPress, closeOnEscape, modal, role, }: DialogProps): react_jsx_runtime.JSX.Element;
+
+interface DialogTriggerProps extends Omit<PressableProps, "onPress" | "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * DialogTrigger — Pressable that opens/closes the dialog.
+ */
+declare function DialogTrigger({ children, style, ...rest }: DialogTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface DialogContentProps extends Omit<ViewProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+    /** Style for the inner card. */
+    cardStyle?: StyleProp<ViewStyle>;
+    /** Modal animation type. Default: "fade" */
+    animationType?: "none" | "slide" | "fade";
+    /** Whether the modal background is transparent. Default: true */
+    transparent?: boolean;
+}
+/**
+ * DialogContent — wraps children in RN's Modal component.
+ *
+ * Modal provides native focus trapping for screen readers.
+ * onRequestClose handles Android back button (maps to core's "dismiss" intent).
+ */
+declare function DialogContent({ children, style, cardStyle, animationType, transparent, ...rest }: DialogContentProps): react_jsx_runtime.JSX.Element;
+
+interface DialogTitleProps extends Omit<TextProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<TextStyle>;
+}
+/**
+ * DialogTitle — Text element with nativeID for accessibility linking.
+ * Uses accessibilityRole="header" for screen reader heading semantics.
+ */
+declare function DialogTitle({ children, style, ...rest }: DialogTitleProps): react_jsx_runtime.JSX.Element;
+
+interface DialogDescriptionProps extends Omit<TextProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<TextStyle>;
+}
+/**
+ * DialogDescription — Text element with nativeID for accessibility linking.
+ */
+declare function DialogDescription({ children, style, ...rest }: DialogDescriptionProps): react_jsx_runtime.JSX.Element;
+
+interface DialogCloseProps extends Omit<PressableProps, "onPress" | "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * DialogClose — Pressable that closes the dialog.
+ * Renders as a positioned "✕" button by default if no children provided.
+ */
+declare function DialogClose({ children, style, ...rest }: DialogCloseProps): react_jsx_runtime.JSX.Element;
+
+interface DialogOverlayProps {
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * DialogOverlay — backdrop element behind dialog content.
+ * Note: With the self-styled DialogContent, the overlay is built into the
+ * Modal wrapper. This component is kept for consumers who need a separate
+ * overlay element (e.g., custom dismiss-on-tap behavior outside DialogContent).
+ */
+declare function DialogOverlay({ style, testID }: DialogOverlayProps): react_jsx_runtime.JSX.Element | null;
+
+export { Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps };

package/dist/dialog.d.ts

@@ -0,0 +1,83 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+import { UseDialogOptions } from '@entropix/core';
+import { PressableProps, StyleProp, ViewStyle, ViewProps, TextProps, TextStyle } from 'react-native';
+
+interface DialogProps extends UseDialogOptions {
+    children: React.ReactNode;
+}
+/**
+ * Dialog root — provides dialog state to compound sub-components.
+ * Renders no UI of its own.
+ */
+declare function Dialog({ children, isOpen, defaultOpen, onOpenChange, closeOnOverlayPress, closeOnEscape, modal, role, }: DialogProps): react_jsx_runtime.JSX.Element;
+
+interface DialogTriggerProps extends Omit<PressableProps, "onPress" | "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * DialogTrigger — Pressable that opens/closes the dialog.
+ */
+declare function DialogTrigger({ children, style, ...rest }: DialogTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface DialogContentProps extends Omit<ViewProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+    /** Style for the inner card. */
+    cardStyle?: StyleProp<ViewStyle>;
+    /** Modal animation type. Default: "fade" */
+    animationType?: "none" | "slide" | "fade";
+    /** Whether the modal background is transparent. Default: true */
+    transparent?: boolean;
+}
+/**
+ * DialogContent — wraps children in RN's Modal component.
+ *
+ * Modal provides native focus trapping for screen readers.
+ * onRequestClose handles Android back button (maps to core's "dismiss" intent).
+ */
+declare function DialogContent({ children, style, cardStyle, animationType, transparent, ...rest }: DialogContentProps): react_jsx_runtime.JSX.Element;
+
+interface DialogTitleProps extends Omit<TextProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<TextStyle>;
+}
+/**
+ * DialogTitle — Text element with nativeID for accessibility linking.
+ * Uses accessibilityRole="header" for screen reader heading semantics.
+ */
+declare function DialogTitle({ children, style, ...rest }: DialogTitleProps): react_jsx_runtime.JSX.Element;
+
+interface DialogDescriptionProps extends Omit<TextProps, "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<TextStyle>;
+}
+/**
+ * DialogDescription — Text element with nativeID for accessibility linking.
+ */
+declare function DialogDescription({ children, style, ...rest }: DialogDescriptionProps): react_jsx_runtime.JSX.Element;
+
+interface DialogCloseProps extends Omit<PressableProps, "onPress" | "style"> {
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * DialogClose — Pressable that closes the dialog.
+ * Renders as a positioned "✕" button by default if no children provided.
+ */
+declare function DialogClose({ children, style, ...rest }: DialogCloseProps): react_jsx_runtime.JSX.Element;
+
+interface DialogOverlayProps {
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * DialogOverlay — backdrop element behind dialog content.
+ * Note: With the self-styled DialogContent, the overlay is built into the
+ * Modal wrapper. This component is kept for consumers who need a separate
+ * overlay element (e.g., custom dismiss-on-tap behavior outside DialogContent).
+ */
+declare function DialogOverlay({ style, testID }: DialogOverlayProps): react_jsx_runtime.JSX.Element | null;
+
+export { Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps };

package/dist/dialog.js

@@ -0,0 +1,5 @@
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogOverlay, DialogTitle, DialogTrigger } from './chunk-VP567WZL.js';
+import './chunk-73BDGPZT.js';
+import './chunk-ZYOTKLBG.js';
+//# sourceMappingURL=dialog.js.map
+//# sourceMappingURL=dialog.js.map