@ankhorage/surface 3.4.5 → 4.0.0

package/dist/components/navigation/helpers.d.ts

@@ -1,15 +0,0 @@
-import type { AccessibilityState } from 'react-native';
-import type { InteractionState } from '../../internal/resolvers/resolveInteractiveState';
-import type { SurfaceTheme } from '../../theme/types';
-export declare function resolveNavigationAccessibilityState(active: boolean, disabled: boolean, accessibilityState?: AccessibilityState): AccessibilityState;
-export interface ResolvedNavigationItemPresentation {
-    backgroundColor: string;
-    contentColor: string;
-    opacity: number;
-}
-export declare function resolveNavigationItemPresentation(theme: SurfaceTheme, { active, disabled, state, }: {
-    active: boolean;
-    disabled: boolean;
-    state: InteractionState;
-}): ResolvedNavigationItemPresentation;
-//# sourceMappingURL=helpers.d.ts.map

package/dist/components/navigation/helpers.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAC;AACzF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,wBAAgB,mCAAmC,CACjD,MAAM,EAAE,OAAO,EACf,QAAQ,EAAE,OAAO,EACjB,kBAAkB,CAAC,EAAE,kBAAkB,GACtC,kBAAkB,CAYpB;AAED,MAAM,WAAW,kCAAkC;IACjD,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,iCAAiC,CAC/C,KAAK,EAAE,YAAY,EACnB,EACE,MAAM,EACN,QAAQ,EACR,KAAK,GACN,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,gBAAgB,CAAC;CACzB,GACA,kCAAkC,CAwCpC"}

package/dist/components/navigation/helpers.js

@@ -1,48 +0,0 @@
-export function resolveNavigationAccessibilityState(active, disabled, accessibilityState) {
-    const resolved = { ...(accessibilityState ?? {}) };
-    if (active) {
-        resolved.selected = true;
-    }
-    if (disabled) {
-        resolved.disabled = true;
-    }
-    return resolved;
-}
-export function resolveNavigationItemPresentation(theme, { active, disabled, state, }) {
-    const interactionState = disabled ? { ...state, hovered: false, pressed: false } : state;
-    if (disabled) {
-        return {
-            backgroundColor: theme.semantics.surface.disabled,
-            contentColor: theme.semantics.content.disabled,
-            opacity: 1,
-        };
-    }
-    const contentColor = active
-        ? interactionState.pressed
-            ? theme.semantics.action.primary.onSoftActiveText
-            : interactionState.hovered
-                ? theme.semantics.action.primary.onSoftHoverText
-                : theme.semantics.action.primary.onSoftText
-        : theme.semantics.content.default;
-    if (active) {
-        return {
-            backgroundColor: interactionState.pressed
-                ? theme.semantics.action.primary.softActive
-                : interactionState.hovered
-                    ? theme.semantics.action.primary.softHover
-                    : theme.semantics.action.primary.softBg,
-            contentColor,
-            opacity: 1,
-        };
-    }
-    return {
-        backgroundColor: interactionState.pressed
-            ? theme.semantics.neutral.surfaceActive
-            : interactionState.hovered
-                ? theme.semantics.neutral.surfaceHover
-                : 'transparent',
-        contentColor,
-        opacity: 1,
-    };
-}
-//# sourceMappingURL=helpers.js.map

package/dist/components/navigation/helpers.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/navigation/helpers.ts"],"names":[],"mappings":"AAKA,MAAM,UAAU,mCAAmC,CACjD,MAAe,EACf,QAAiB,EACjB,kBAAuC;IAEvC,MAAM,QAAQ,GAAuB,EAAE,GAAG,CAAC,kBAAkB,IAAI,EAAE,CAAC,EAAE,CAAC;IAEvE,IAAI,MAAM,EAAE,CAAC;QACX,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC;IAC3B,CAAC;IAED,IAAI,QAAQ,EAAE,CAAC;QACb,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC;IAC3B,CAAC;IAED,OAAO,QAAQ,CAAC;AAClB,CAAC;AAQD,MAAM,UAAU,iCAAiC,CAC/C,KAAmB,EACnB,EACE,MAAM,EACN,QAAQ,EACR,KAAK,GAKN;IAED,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzF,IAAI,QAAQ,EAAE,CAAC;QACb,OAAO;YACL,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ;YACjD,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ;YAC9C,OAAO,EAAE,CAAC;SACX,CAAC;IACJ,CAAC;IAED,MAAM,YAAY,GAAG,MAAM;QACzB,CAAC,CAAC,gBAAgB,CAAC,OAAO;YACxB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,gBAAgB;YACjD,CAAC,CAAC,gBAAgB,CAAC,OAAO;gBACxB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,eAAe;gBAChD,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,UAAU;QAC/C,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC;IAEpC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO;YACL,eAAe,EAAE,gBAAgB,CAAC,OAAO;gBACvC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,UAAU;gBAC3C,CAAC,CAAC,gBAAgB,CAAC,OAAO;oBACxB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS;oBAC1C,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM;YAC3C,YAAY;YACZ,OAAO,EAAE,CAAC;SACX,CAAC;IACJ,CAAC;IAED,OAAO;QACL,eAAe,EAAE,gBAAgB,CAAC,OAAO;YACvC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,aAAa;YACvC,CAAC,CAAC,gBAAgB,CAAC,OAAO;gBACxB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY;gBACtC,CAAC,CAAC,aAAa;QACnB,YAAY;QACZ,OAAO,EAAE,CAAC;KACX,CAAC;AACJ,CAAC","sourcesContent":["import type { AccessibilityState } from 'react-native';\n\nimport type { InteractionState } from '../../internal/resolvers/resolveInteractiveState';\nimport type { SurfaceTheme } from '../../theme/types';\n\nexport function resolveNavigationAccessibilityState(\n  active: boolean,\n  disabled: boolean,\n  accessibilityState?: AccessibilityState,\n): AccessibilityState {\n  const resolved: AccessibilityState = { ...(accessibilityState ?? {}) };\n\n  if (active) {\n    resolved.selected = true;\n  }\n\n  if (disabled) {\n    resolved.disabled = true;\n  }\n\n  return resolved;\n}\n\nexport interface ResolvedNavigationItemPresentation {\n  backgroundColor: string;\n  contentColor: string;\n  opacity: number;\n}\n\nexport function resolveNavigationItemPresentation(\n  theme: SurfaceTheme,\n  {\n    active,\n    disabled,\n    state,\n  }: {\n    active: boolean;\n    disabled: boolean;\n    state: InteractionState;\n  },\n): ResolvedNavigationItemPresentation {\n  const interactionState = disabled ? { ...state, hovered: false, pressed: false } : state;\n\n  if (disabled) {\n    return {\n      backgroundColor: theme.semantics.surface.disabled,\n      contentColor: theme.semantics.content.disabled,\n      opacity: 1,\n    };\n  }\n\n  const contentColor = active\n    ? interactionState.pressed\n      ? theme.semantics.action.primary.onSoftActiveText\n      : interactionState.hovered\n        ? theme.semantics.action.primary.onSoftHoverText\n        : theme.semantics.action.primary.onSoftText\n    : theme.semantics.content.default;\n\n  if (active) {\n    return {\n      backgroundColor: interactionState.pressed\n        ? theme.semantics.action.primary.softActive\n        : interactionState.hovered\n          ? theme.semantics.action.primary.softHover\n          : theme.semantics.action.primary.softBg,\n      contentColor,\n      opacity: 1,\n    };\n  }\n\n  return {\n    backgroundColor: interactionState.pressed\n      ? theme.semantics.neutral.surfaceActive\n      : interactionState.hovered\n        ? theme.semantics.neutral.surfaceHover\n        : 'transparent',\n    contentColor,\n    opacity: 1,\n  };\n}\n"]}

package/dist/components/navigation/index.d.ts

@@ -1,8 +0,0 @@
-export { DrawerNavigation } from './DrawerNavigation';
-export { DrawerNavigationItem } from './DrawerNavigationItem';
-export { NavigationItem } from './NavigationItem';
-export { NavigationList } from './NavigationList';
-export { TabBar } from './TabBar';
-export { TabBarItem } from './TabBarItem';
-export type { DrawerNavigationItemProps, DrawerNavigationProps, NavigationItemIcon, NavigationItemProps, NavigationItemSpec, NavigationListProps, TabBarItemProps, TabBarProps, } from './types';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/navigation/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EACV,yBAAyB,EACzB,qBAAqB,EACrB,kBAAkB,EAClB,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,eAAe,EACf,WAAW,GACZ,MAAM,SAAS,CAAC"}

package/dist/components/navigation/index.js

@@ -1,7 +0,0 @@
-export { DrawerNavigation } from './DrawerNavigation';
-export { DrawerNavigationItem } from './DrawerNavigationItem';
-export { NavigationItem } from './NavigationItem';
-export { NavigationList } from './NavigationList';
-export { TabBar } from './TabBar';
-export { TabBarItem } from './TabBarItem';
-//# sourceMappingURL=index.js.map

package/dist/components/navigation/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/navigation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export { DrawerNavigation } from './DrawerNavigation';\nexport { DrawerNavigationItem } from './DrawerNavigationItem';\nexport { NavigationItem } from './NavigationItem';\nexport { NavigationList } from './NavigationList';\nexport { TabBar } from './TabBar';\nexport { TabBarItem } from './TabBarItem';\nexport type {\n  DrawerNavigationItemProps,\n  DrawerNavigationProps,\n  NavigationItemIcon,\n  NavigationItemProps,\n  NavigationItemSpec,\n  NavigationListProps,\n  TabBarItemProps,\n  TabBarProps,\n} from './types';\n"]}

package/dist/components/navigation/types.d.ts

@@ -1,58 +0,0 @@
-import type React from 'react';
-import type { AccessibilityRole, AccessibilityState } from 'react-native';
-import type { InteractionPolicy } from '../../interactionPolicy';
-import type { IconSource } from '../../primitives/icon';
-export type NavigationItemIcon = IconSource;
-export interface NavigationItemSpec {
-    id: string;
-    label: React.ReactNode;
-    icon?: NavigationItemIcon;
-    badge?: React.ReactNode;
-    active?: boolean;
-    disabled?: boolean;
-    onPress?: (() => void) | undefined;
-    accessibilityLabel?: string;
-    accessibilityRole?: AccessibilityRole;
-    accessibilityState?: AccessibilityState;
-    testID?: string;
-}
-export interface NavigationItemProps {
-    item: NavigationItemSpec;
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-export interface NavigationListProps {
-    items: readonly NavigationItemSpec[];
-    orientation?: 'vertical' | 'horizontal';
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-export interface TabBarProps {
-    items: readonly NavigationItemSpec[];
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-export interface TabBarItemProps {
-    item: NavigationItemSpec;
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-export interface DrawerNavigationProps {
-    items: readonly NavigationItemSpec[];
-    header?: React.ReactNode;
-    footer?: React.ReactNode;
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-export interface DrawerNavigationItemProps {
-    item: NavigationItemSpec;
-    compact?: boolean;
-    testID?: string;
-    interactionPolicy?: InteractionPolicy;
-}
-//# sourceMappingURL=types.d.ts.map

package/dist/components/navigation/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAExD,MAAM,MAAM,kBAAkB,GAAG,UAAU,CAAC;AAE5C,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AAED,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACrC,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACrC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC;AAED,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;CACvC"}

package/dist/components/navigation/types.js

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

package/dist/components/navigation/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/navigation/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { AccessibilityRole, AccessibilityState } from 'react-native';\n\nimport type { InteractionPolicy } from '../../interactionPolicy';\nimport type { IconSource } from '../../primitives/icon';\n\nexport type NavigationItemIcon = IconSource;\n\nexport interface NavigationItemSpec {\n  id: string;\n  label: React.ReactNode;\n  icon?: NavigationItemIcon;\n  badge?: React.ReactNode;\n  active?: boolean;\n  disabled?: boolean;\n  onPress?: (() => void) | undefined;\n  accessibilityLabel?: string;\n  accessibilityRole?: AccessibilityRole;\n  accessibilityState?: AccessibilityState;\n  testID?: string;\n}\n\nexport interface NavigationItemProps {\n  item: NavigationItemSpec;\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n\nexport interface NavigationListProps {\n  items: readonly NavigationItemSpec[];\n  orientation?: 'vertical' | 'horizontal';\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n\nexport interface TabBarProps {\n  items: readonly NavigationItemSpec[];\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n\nexport interface TabBarItemProps {\n  item: NavigationItemSpec;\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n\nexport interface DrawerNavigationProps {\n  items: readonly NavigationItemSpec[];\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n\nexport interface DrawerNavigationItemProps {\n  item: NavigationItemSpec;\n  compact?: boolean;\n  testID?: string;\n  interactionPolicy?: InteractionPolicy;\n}\n"]}

package/src/components/action-sheet/ActionSheet.tsx

@@ -1,130 +0,0 @@
-import React from 'react';
-import { Pressable, View } from 'react-native';
-
-import { FocusScope } from '../../internal/focus/FocusScope';
-import { Portal } from '../../internal/overlay/Portal';
-import { resolvePointerEvents } from '../../internal/resolvePointerEvents';
-import { resolveOverlayAnimation } from '../../internal/resolvers';
-import { Box, Stack, Surface } from '../../layout';
-import { Text } from '../../primitives/text';
-import { useTheme } from '../../theme/ThemeContext';
-import { ActionSheetItem } from './ActionSheetItem';
-import type { ActionSheetProps } from './types';
-
-const boxNonePointerEvents = resolvePointerEvents('box-none');
-
-export function ActionSheet({
-  visible,
-  onDismiss,
-  title,
-  description,
-  children,
-  cancelLabel = 'Cancel',
-  closeOnBackdrop = true,
-  interactionPolicy = 'enabled',
-  testID,
-}: ActionSheetProps) {
-  const { theme } = useTheme();
-  const animation = resolveOverlayAnimation('modal');
-  const passive = interactionPolicy === 'passive';
-
-  if (!visible) {
-    return null;
-  }
-
-  return (
-    <Portal layer="modal" visible={visible}>
-      <View
-        {...boxNonePointerEvents.props}
-        style={[
-          boxNonePointerEvents.style,
-          {
-            bottom: 0,
-            left: 0,
-            position: 'absolute',
-            right: 0,
-            top: 0,
-          },
-        ]}
-      >
-        <Pressable
-          onPress={passive ? undefined : closeOnBackdrop ? onDismiss : undefined}
-          style={{
-            backgroundColor: theme.semantics.neutral.text,
-            bottom: 0,
-            left: 0,
-            opacity: animation.backdropOpacity,
-            position: 'absolute',
-            right: 0,
-            top: 0,
-          }}
-          testID={testID ? `${testID}-backdrop` : undefined}
-        />
-        <FocusScope
-          active={visible}
-          onEscape={passive ? undefined : onDismiss}
-          testID={testID ? `${testID}-focus` : undefined}
-        >
-          <Box
-            pointerEvents="box-none"
-            style={{
-              flex: 1,
-              justifyContent: 'flex-end',
-            }}
-          >
-            <View
-              accessible
-              accessibilityViewIsModal
-              style={{
-                alignSelf: 'center',
-                maxWidth: 560,
-                padding: 16,
-                width: '100%',
-              }}
-            >
-              <Surface
-                p="m"
-                style={{
-                  borderRadius: 24,
-                  shadowOpacity: 0.16,
-                  shadowRadius: 18,
-                  shadowOffset: { width: 0, height: -8 },
-                }}
-                testID={testID}
-                variant="raised"
-              >
-                <Stack gap="s">
-                  {title || description ? (
-                    <Box px="m" py="s">
-                      <Stack gap="xxs">
-                        {title ? (
-                          <Text align="center" variant="label" weight="semiBold">
-                            {title}
-                          </Text>
-                        ) : null}
-                        {description ? (
-                          <Text align="center" emphasis="muted" variant="bodySmall">
-                            {description}
-                          </Text>
-                        ) : null}
-                      </Stack>
-                    </Box>
-                  ) : null}
-                  <Stack gap="xxs">{children}</Stack>
-                  {onDismiss ? (
-                    <ActionSheetItem
-                      label={cancelLabel}
-                      interactionPolicy={interactionPolicy}
-                      onPress={onDismiss}
-                      testID={testID ? `${testID}-cancel` : undefined}
-                    />
-                  ) : null}
-                </Stack>
-              </Surface>
-            </View>
-          </Box>
-        </FocusScope>
-      </View>
-    </Portal>
-  );
-}

package/src/components/action-sheet/ActionSheetItem.tsx

@@ -1,59 +0,0 @@
-import React from 'react';
-
-import { Box, Inline, Stack } from '../../layout';
-import { ButtonBase } from '../../primitives/button-base';
-import { Text } from '../../primitives/text';
-import type { ActionSheetItemProps } from './types';
-
-export function ActionSheetItem({
-  label,
-  description,
-  leading,
-  trailing,
-  color,
-  disabled = false,
-  selected = false,
-  interactionPolicy = 'enabled',
-  onPress,
-  testID,
-}: ActionSheetItemProps) {
-  return (
-    <ButtonBase
-      accessibilityRole="button"
-      accessibilityState={{ disabled, selected }}
-      disabled={disabled}
-      interactionPolicy={interactionPolicy}
-      onPress={onPress}
-      radius="m"
-      testID={testID}
-    >
-      {(state) => (
-        <Box
-          px="m"
-          py="m"
-          radius="m"
-          style={{
-            opacity: state.disabled ? 0.56 : 1,
-          }}
-        >
-          <Inline align="center" gap="m" justify="space-between" wrap="nowrap">
-            {leading ? <Box>{leading}</Box> : null}
-            <Box flex={1}>
-              <Stack gap="xxs">
-                <Text color={color} variant="body" weight={selected ? 'semiBold' : 'medium'}>
-                  {label}
-                </Text>
-                {description ? (
-                  <Text emphasis="muted" variant="bodySmall">
-                    {description}
-                  </Text>
-                ) : null}
-              </Stack>
-            </Box>
-            {trailing ? <Box>{trailing}</Box> : null}
-          </Inline>
-        </Box>
-      )}
-    </ButtonBase>
-  );
-}

package/src/components/action-sheet/index.ts

@@ -1,3 +0,0 @@
-export { ActionSheet } from './ActionSheet';
-export { ActionSheetItem } from './ActionSheetItem';
-export type { ActionSheetItemProps, ActionSheetProps } from './types';

package/src/components/action-sheet/types.ts

@@ -1,29 +0,0 @@
-import type React from 'react';
-
-import type { InteractionPolicy } from '../../interactionPolicy';
-import type { SurfaceColor } from '../../surfaceColor';
-
-export interface ActionSheetProps {
-  visible: boolean;
-  onDismiss?: (() => void) | undefined;
-  title?: React.ReactNode;
-  description?: React.ReactNode;
-  children?: React.ReactNode;
-  cancelLabel?: React.ReactNode;
-  closeOnBackdrop?: boolean;
-  interactionPolicy?: InteractionPolicy;
-  testID?: string;
-}
-
-export interface ActionSheetItemProps {
-  label: React.ReactNode;
-  description?: React.ReactNode;
-  leading?: React.ReactNode;
-  trailing?: React.ReactNode;
-  color?: SurfaceColor;
-  disabled?: boolean;
-  selected?: boolean;
-  interactionPolicy?: InteractionPolicy;
-  onPress?: (() => void) | undefined;
-  testID?: string;
-}

package/src/components/drawer/Drawer.tsx

@@ -1,100 +0,0 @@
-import React from 'react';
-import { Pressable, View } from 'react-native';
-
-import { FocusScope } from '../../internal/focus/FocusScope';
-import { Portal } from '../../internal/overlay/Portal';
-import { resolvePointerEvents } from '../../internal/resolvePointerEvents';
-import { resolveOverlayAnimation } from '../../internal/resolvers';
-import { Box, Surface } from '../../layout';
-import { useTheme } from '../../theme/ThemeContext';
-import type { DrawerProps } from './types';
-
-const boxNonePointerEvents = resolvePointerEvents('box-none');
-
-export function Drawer({
-  visible,
-  onDismiss,
-  position = 'right',
-  children,
-  closeOnBackdrop = true,
-  interactionPolicy = 'enabled',
-  testID,
-}: DrawerProps) {
-  const { theme } = useTheme();
-  const animation = resolveOverlayAnimation('drawer');
-  const passive = interactionPolicy === 'passive';
-
-  if (!visible) {
-    return null;
-  }
-
-  return (
-    <Portal layer="drawer" visible={visible}>
-      <View
-        {...boxNonePointerEvents.props}
-        style={[
-          boxNonePointerEvents.style,
-          {
-            bottom: 0,
-            left: 0,
-            position: 'absolute',
-            right: 0,
-            top: 0,
-          },
-        ]}
-      >
-        <Pressable
-          onPress={passive ? undefined : closeOnBackdrop ? onDismiss : undefined}
-          style={{
-            backgroundColor: theme.semantics.neutral.text,
-            bottom: 0,
-            left: 0,
-            opacity: animation.backdropOpacity,
-            position: 'absolute',
-            right: 0,
-            top: 0,
-          }}
-          testID={testID ? `${testID}-backdrop` : undefined}
-        />
-        <FocusScope
-          active={visible}
-          onEscape={passive ? undefined : onDismiss}
-          testID={testID ? `${testID}-focus` : undefined}
-        >
-          <Box
-            pointerEvents="box-none"
-            style={{
-              flex: 1,
-              justifyContent: 'flex-start',
-            }}
-          >
-            <View
-              accessible
-              accessibilityViewIsModal
-              style={{
-                alignSelf: position === 'left' ? 'flex-start' : 'flex-end',
-                height: '100%',
-                maxWidth: 420,
-                width: '88%',
-              }}
-            >
-              <Surface
-                p="l"
-                style={{
-                  height: '100%',
-                  shadowOpacity: 0.14,
-                  shadowRadius: 14,
-                  shadowOffset: { width: position === 'left' ? 4 : -4, height: 0 },
-                }}
-                testID={testID}
-                variant="raised"
-              >
-                {children}
-              </Surface>
-            </View>
-          </Box>
-        </FocusScope>
-      </View>
-    </Portal>
-  );
-}

package/src/components/drawer/index.ts

@@ -1,2 +0,0 @@
-export { Drawer } from './Drawer';
-export type { DrawerProps } from './types';

package/src/components/drawer/types.ts

@@ -1,13 +0,0 @@
-import type React from 'react';
-
-import type { InteractionPolicy } from '../../interactionPolicy';
-
-export interface DrawerProps {
-  visible: boolean;
-  onDismiss?: (() => void) | undefined;
-  position?: 'left' | 'right';
-  children?: React.ReactNode;
-  closeOnBackdrop?: boolean;
-  interactionPolicy?: InteractionPolicy;
-  testID?: string;
-}

package/src/components/navigation/DrawerNavigation.tsx

@@ -1,32 +0,0 @@
-import React from 'react';
-
-import { Stack } from '../../layout';
-import { DrawerNavigationItem } from './DrawerNavigationItem';
-import type { DrawerNavigationProps } from './types';
-
-export function DrawerNavigation({
-  items,
-  header,
-  footer,
-  compact = false,
-  testID,
-  interactionPolicy,
-}: DrawerNavigationProps) {
-  return (
-    <Stack gap={compact ? 's' : 'm'} testID={testID}>
-      {header}
-      <Stack gap={compact ? 'xs' : 's'}>
-        {items.map((item) => (
-          <DrawerNavigationItem
-            compact={compact}
-            interactionPolicy={interactionPolicy}
-            item={item}
-            key={item.id}
-            testID={testID}
-          />
-        ))}
-      </Stack>
-      {footer}
-    </Stack>
-  );
-}

package/src/components/navigation/DrawerNavigationItem.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-
-import { NavigationItem } from './NavigationItem';
-import type { DrawerNavigationItemProps } from './types';
-
-export function DrawerNavigationItem({
-  item,
-  compact = false,
-  testID,
-  interactionPolicy,
-}: DrawerNavigationItemProps) {
-  return (
-    <NavigationItem
-      compact={compact}
-      interactionPolicy={interactionPolicy}
-      item={{
-        ...item,
-        accessibilityRole: item.accessibilityRole ?? 'button',
-      }}
-      testID={testID}
-    />
-  );
-}

package/src/components/navigation/NavigationItem.tsx

@@ -1,79 +0,0 @@
-import React from 'react';
-import { View } from 'react-native';
-
-import { Box } from '../../layout';
-import { ButtonBase } from '../../primitives/button-base';
-import { Icon } from '../../primitives/icon';
-import { Text } from '../../primitives/text';
-import { useTheme } from '../../theme/ThemeContext';
-import { resolveNavigationAccessibilityState, resolveNavigationItemPresentation } from './helpers';
-import type { NavigationItemProps } from './types';
-
-export function NavigationItem({
-  item,
-  compact = false,
-  testID,
-  interactionPolicy,
-}: NavigationItemProps) {
-  const { theme } = useTheme();
-  const active = Boolean(item.active);
-  const disabled = Boolean(item.disabled);
-  const resolvedTestID = item.testID ?? (testID ? `${testID}-item-${item.id}` : undefined);
-  const resolvedAccessibilityState = resolveNavigationAccessibilityState(
-    active,
-    disabled,
-    item.accessibilityState,
-  );
-
-  return (
-    <ButtonBase
-      accessibilityLabel={item.accessibilityLabel}
-      accessibilityRole={item.accessibilityRole ?? 'button'}
-      accessibilityState={resolvedAccessibilityState}
-      disabled={disabled}
-      interactionPolicy={interactionPolicy}
-      onPress={item.onPress}
-      testID={resolvedTestID}
-    >
-      {(state) => {
-        const presentation = resolveNavigationItemPresentation(theme, {
-          active,
-          disabled,
-          state,
-        });
-
-        return (
-          <Box
-            px="m"
-            py={compact ? 's' : 'm'}
-            radius="m"
-            style={{
-              backgroundColor: presentation.backgroundColor,
-              flexDirection: 'row',
-              alignItems: 'center',
-              opacity: presentation.opacity,
-            }}
-          >
-            {item.icon ? (
-              <View style={{ marginRight: theme.spacing.s }}>
-                <Icon {...item.icon} color={presentation.contentColor} size={compact ? 's' : 'm'} />
-              </View>
-            ) : null}
-            <Box flex={1}>
-              <Text
-                color={active && !disabled ? 'primary' : undefined}
-                emphasis={disabled ? 'muted' : 'default'}
-                numberOfLines={1}
-                variant={compact ? 'bodySmall' : 'body'}
-                weight="medium"
-              >
-                {item.label}
-              </Text>
-            </Box>
-            {item.badge ? <View style={{ marginLeft: theme.spacing.s }}>{item.badge}</View> : null}
-          </Box>
-        );
-      }}
-    </ButtonBase>
-  );
-}