@ankhorage/surface 3.4.6 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/README.md +1 -6
- package/dist/examples/DocsExamples.d.ts.map +1 -1
- package/dist/examples/DocsExamples.js +0 -6
- package/dist/examples/DocsExamples.js.map +1 -1
- package/dist/features/bottom-sheet/BottomSheetContext.d.ts +4 -0
- package/dist/features/bottom-sheet/BottomSheetContext.d.ts.map +1 -0
- package/dist/features/bottom-sheet/BottomSheetContext.js +3 -0
- package/dist/features/bottom-sheet/BottomSheetContext.js.map +1 -0
- package/dist/features/bottom-sheet/BottomSheetProvider.d.ts +6 -0
- package/dist/features/bottom-sheet/BottomSheetProvider.d.ts.map +1 -0
- package/dist/features/bottom-sheet/BottomSheetProvider.js +61 -0
- package/dist/features/bottom-sheet/BottomSheetProvider.js.map +1 -0
- package/dist/features/bottom-sheet/public.d.ts +4 -0
- package/dist/features/bottom-sheet/public.d.ts.map +1 -0
- package/dist/features/bottom-sheet/public.js +3 -0
- package/dist/features/bottom-sheet/public.js.map +1 -0
- package/dist/features/bottom-sheet/useBottomSheet.d.ts +4 -0
- package/dist/features/bottom-sheet/useBottomSheet.d.ts.map +1 -0
- package/dist/features/bottom-sheet/useBottomSheet.js +11 -0
- package/dist/features/bottom-sheet/useBottomSheet.js.map +1 -0
- package/dist/index.d.ts +0 -6
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -3
- package/dist/index.js.map +1 -1
- package/dist/types/bottomSheet.d.ts +18 -0
- package/dist/types/bottomSheet.d.ts.map +1 -0
- package/dist/types/bottomSheet.js +2 -0
- package/dist/types/bottomSheet.js.map +1 -0
- package/package.json +17 -3
- package/src/examples/DocsExamples.tsx +0 -6
- package/src/features/bottom-sheet/BottomSheetContext.ts +5 -0
- package/src/features/bottom-sheet/BottomSheetProvider.tsx +129 -0
- package/src/features/bottom-sheet/public.ts +3 -0
- package/src/features/bottom-sheet/useBottomSheet.test.tsx +18 -0
- package/src/features/bottom-sheet/useBottomSheet.ts +15 -0
- package/src/index.test.ts +40 -12
- package/src/index.ts +0 -22
- package/src/types/bottomSheet.ts +19 -0
- package/dist/components/action-sheet/ActionSheet.d.ts +0 -4
- package/dist/components/action-sheet/ActionSheet.d.ts.map +0 -1
- package/dist/components/action-sheet/ActionSheet.js +0 -77
- package/dist/components/action-sheet/ActionSheet.js.map +0 -1
- package/dist/components/action-sheet/ActionSheetItem.d.ts +0 -4
- package/dist/components/action-sheet/ActionSheetItem.d.ts.map +0 -1
- package/dist/components/action-sheet/ActionSheetItem.js +0 -27
- package/dist/components/action-sheet/ActionSheetItem.js.map +0 -1
- package/dist/components/action-sheet/index.d.ts +0 -4
- package/dist/components/action-sheet/index.d.ts.map +0 -1
- package/dist/components/action-sheet/index.js +0 -3
- package/dist/components/action-sheet/index.js.map +0 -1
- package/dist/components/action-sheet/types.d.ts +0 -27
- package/dist/components/action-sheet/types.d.ts.map +0 -1
- package/dist/components/action-sheet/types.js +0 -2
- package/dist/components/action-sheet/types.js.map +0 -1
- package/dist/components/drawer/Drawer.d.ts +0 -4
- package/dist/components/drawer/Drawer.d.ts.map +0 -1
- package/dist/components/drawer/Drawer.js +0 -62
- package/dist/components/drawer/Drawer.js.map +0 -1
- package/dist/components/drawer/index.d.ts +0 -3
- package/dist/components/drawer/index.d.ts.map +0 -1
- package/dist/components/drawer/index.js +0 -2
- package/dist/components/drawer/index.js.map +0 -1
- package/dist/components/drawer/types.d.ts +0 -12
- package/dist/components/drawer/types.d.ts.map +0 -1
- package/dist/components/drawer/types.js +0 -2
- package/dist/components/drawer/types.js.map +0 -1
- package/dist/components/navigation/DrawerNavigation.d.ts +0 -4
- package/dist/components/navigation/DrawerNavigation.d.ts.map +0 -1
- package/dist/components/navigation/DrawerNavigation.js +0 -13
- package/dist/components/navigation/DrawerNavigation.js.map +0 -1
- package/dist/components/navigation/DrawerNavigationItem.d.ts +0 -4
- package/dist/components/navigation/DrawerNavigationItem.d.ts.map +0 -1
- package/dist/components/navigation/DrawerNavigationItem.js +0 -9
- package/dist/components/navigation/DrawerNavigationItem.js.map +0 -1
- package/dist/components/navigation/NavigationItem.d.ts +0 -4
- package/dist/components/navigation/NavigationItem.d.ts.map +0 -1
- package/dist/components/navigation/NavigationItem.js +0 -41
- package/dist/components/navigation/NavigationItem.js.map +0 -1
- package/dist/components/navigation/NavigationList.d.ts +0 -4
- package/dist/components/navigation/NavigationList.d.ts.map +0 -1
- package/dist/components/navigation/NavigationList.js +0 -9
- package/dist/components/navigation/NavigationList.js.map +0 -1
- package/dist/components/navigation/TabBar.d.ts +0 -4
- package/dist/components/navigation/TabBar.d.ts.map +0 -1
- package/dist/components/navigation/TabBar.js +0 -15
- package/dist/components/navigation/TabBar.js.map +0 -1
- package/dist/components/navigation/TabBarItem.d.ts +0 -4
- package/dist/components/navigation/TabBarItem.d.ts.map +0 -1
- package/dist/components/navigation/TabBarItem.js +0 -44
- package/dist/components/navigation/TabBarItem.js.map +0 -1
- package/dist/components/navigation/helpers.d.ts +0 -15
- package/dist/components/navigation/helpers.d.ts.map +0 -1
- package/dist/components/navigation/helpers.js +0 -48
- package/dist/components/navigation/helpers.js.map +0 -1
- package/dist/components/navigation/index.d.ts +0 -8
- package/dist/components/navigation/index.d.ts.map +0 -1
- package/dist/components/navigation/index.js +0 -7
- package/dist/components/navigation/index.js.map +0 -1
- package/dist/components/navigation/types.d.ts +0 -58
- package/dist/components/navigation/types.d.ts.map +0 -1
- package/dist/components/navigation/types.js +0 -2
- package/dist/components/navigation/types.js.map +0 -1
- package/src/components/action-sheet/ActionSheet.tsx +0 -130
- package/src/components/action-sheet/ActionSheetItem.tsx +0 -59
- package/src/components/action-sheet/index.ts +0 -3
- package/src/components/action-sheet/types.ts +0 -29
- package/src/components/drawer/Drawer.tsx +0 -100
- package/src/components/drawer/index.ts +0 -2
- package/src/components/drawer/types.ts +0 -13
- package/src/components/navigation/DrawerNavigation.tsx +0 -32
- package/src/components/navigation/DrawerNavigationItem.tsx +0 -23
- package/src/components/navigation/NavigationItem.tsx +0 -79
- package/src/components/navigation/NavigationList.tsx +0 -31
- package/src/components/navigation/TabBar.tsx +0 -31
- package/src/components/navigation/TabBarItem.tsx +0 -79
- package/src/components/navigation/helpers.test.ts +0 -74
- package/src/components/navigation/helpers.ts +0 -81
- package/src/components/navigation/index.ts +0 -16
- package/src/components/navigation/policy.test.ts +0 -140
- package/src/components/navigation/types.ts +0 -66
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { Drawer } from './Drawer';\nexport type { DrawerProps } from './types';\n"]}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type React from 'react';
|
|
2
|
-
import type { InteractionPolicy } from '../../interactionPolicy';
|
|
3
|
-
export interface DrawerProps {
|
|
4
|
-
visible: boolean;
|
|
5
|
-
onDismiss?: (() => void) | undefined;
|
|
6
|
-
position?: 'left' | 'right';
|
|
7
|
-
children?: React.ReactNode;
|
|
8
|
-
closeOnBackdrop?: boolean;
|
|
9
|
-
interactionPolicy?: InteractionPolicy;
|
|
10
|
-
testID?: string;
|
|
11
|
-
}
|
|
12
|
-
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAEjE,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACrC,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { InteractionPolicy } from '../../interactionPolicy';\n\nexport interface DrawerProps {\n visible: boolean;\n onDismiss?: (() => void) | undefined;\n position?: 'left' | 'right';\n children?: React.ReactNode;\n closeOnBackdrop?: boolean;\n interactionPolicy?: InteractionPolicy;\n testID?: string;\n}\n"]}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { DrawerNavigationProps } from './types';
|
|
3
|
-
export declare function DrawerNavigation({ items, header, footer, compact, testID, interactionPolicy, }: DrawerNavigationProps): React.JSX.Element;
|
|
4
|
-
//# sourceMappingURL=DrawerNavigation.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/DrawerNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErD,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,MAAM,EACN,MAAM,EACN,OAAe,EACf,MAAM,EACN,iBAAiB,GAClB,EAAE,qBAAqB,qBAkBvB"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Stack } from '../../layout';
|
|
3
|
-
import { DrawerNavigationItem } from './DrawerNavigationItem';
|
|
4
|
-
export function DrawerNavigation({ items, header, footer, compact = false, testID, interactionPolicy, }) {
|
|
5
|
-
return (<Stack gap={compact ? 's' : 'm'} testID={testID}>
|
|
6
|
-
{header}
|
|
7
|
-
<Stack gap={compact ? 'xs' : 's'}>
|
|
8
|
-
{items.map((item) => (<DrawerNavigationItem compact={compact} interactionPolicy={interactionPolicy} item={item} key={item.id} testID={testID}/>))}
|
|
9
|
-
</Stack>
|
|
10
|
-
{footer}
|
|
11
|
-
</Stack>);
|
|
12
|
-
}
|
|
13
|
-
//# sourceMappingURL=DrawerNavigation.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerNavigation.js","sourceRoot":"","sources":["../../../src/components/navigation/DrawerNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AACrC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAG9D,MAAM,UAAU,gBAAgB,CAAC,EAC/B,KAAK,EACL,MAAM,EACN,MAAM,EACN,OAAO,GAAG,KAAK,EACf,MAAM,EACN,iBAAiB,GACK;IACtB,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC9C;MAAA,CAAC,MAAM,CACP;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAC/B;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,CAAC,oBAAoB,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC,CACJ;MAAA,EAAE,KAAK,CACP;MAAA,CAAC,MAAM,CACT;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { Stack } from '../../layout';\nimport { DrawerNavigationItem } from './DrawerNavigationItem';\nimport type { DrawerNavigationProps } from './types';\n\nexport function DrawerNavigation({\n items,\n header,\n footer,\n compact = false,\n testID,\n interactionPolicy,\n}: DrawerNavigationProps) {\n return (\n <Stack gap={compact ? 's' : 'm'} testID={testID}>\n {header}\n <Stack gap={compact ? 'xs' : 's'}>\n {items.map((item) => (\n <DrawerNavigationItem\n compact={compact}\n interactionPolicy={interactionPolicy}\n item={item}\n key={item.id}\n testID={testID}\n />\n ))}\n </Stack>\n {footer}\n </Stack>\n );\n}\n"]}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { DrawerNavigationItemProps } from './types';
|
|
3
|
-
export declare function DrawerNavigationItem({ item, compact, testID, interactionPolicy, }: DrawerNavigationItemProps): React.JSX.Element;
|
|
4
|
-
//# sourceMappingURL=DrawerNavigationItem.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerNavigationItem.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/DrawerNavigationItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAEzD,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,OAAe,EACf,MAAM,EACN,iBAAiB,GAClB,EAAE,yBAAyB,qBAY3B"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { NavigationItem } from './NavigationItem';
|
|
3
|
-
export function DrawerNavigationItem({ item, compact = false, testID, interactionPolicy, }) {
|
|
4
|
-
return (<NavigationItem compact={compact} interactionPolicy={interactionPolicy} item={{
|
|
5
|
-
...item,
|
|
6
|
-
accessibilityRole: item.accessibilityRole ?? 'button',
|
|
7
|
-
}} testID={testID}/>);
|
|
8
|
-
}
|
|
9
|
-
//# sourceMappingURL=DrawerNavigationItem.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerNavigationItem.js","sourceRoot":"","sources":["../../../src/components/navigation/DrawerNavigationItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,MAAM,UAAU,oBAAoB,CAAC,EACnC,IAAI,EACJ,OAAO,GAAG,KAAK,EACf,MAAM,EACN,iBAAiB,GACS;IAC1B,OAAO,CACL,CAAC,cAAc,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,CAAC,CAAC;YACJ,GAAG,IAAI;YACP,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,IAAI,QAAQ;SACtD,CAAC,CACF,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { NavigationItem } from './NavigationItem';\nimport type { DrawerNavigationItemProps } from './types';\n\nexport function DrawerNavigationItem({\n item,\n compact = false,\n testID,\n interactionPolicy,\n}: DrawerNavigationItemProps) {\n return (\n <NavigationItem\n compact={compact}\n interactionPolicy={interactionPolicy}\n item={{\n ...item,\n accessibilityRole: item.accessibilityRole ?? 'button',\n }}\n testID={testID}\n />\n );\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationItem.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/NavigationItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,OAAe,EACf,MAAM,EACN,iBAAiB,GAClB,EAAE,mBAAmB,qBA8DrB"}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { View } from 'react-native';
|
|
3
|
-
import { Box } from '../../layout';
|
|
4
|
-
import { ButtonBase } from '../../primitives/button-base';
|
|
5
|
-
import { Icon } from '../../primitives/icon';
|
|
6
|
-
import { Text } from '../../primitives/text';
|
|
7
|
-
import { useTheme } from '../../theme/ThemeContext';
|
|
8
|
-
import { resolveNavigationAccessibilityState, resolveNavigationItemPresentation } from './helpers';
|
|
9
|
-
export function NavigationItem({ item, compact = false, testID, interactionPolicy, }) {
|
|
10
|
-
const { theme } = useTheme();
|
|
11
|
-
const active = Boolean(item.active);
|
|
12
|
-
const disabled = Boolean(item.disabled);
|
|
13
|
-
const resolvedTestID = item.testID ?? (testID ? `${testID}-item-${item.id}` : undefined);
|
|
14
|
-
const resolvedAccessibilityState = resolveNavigationAccessibilityState(active, disabled, item.accessibilityState);
|
|
15
|
-
return (<ButtonBase accessibilityLabel={item.accessibilityLabel} accessibilityRole={item.accessibilityRole ?? 'button'} accessibilityState={resolvedAccessibilityState} disabled={disabled} interactionPolicy={interactionPolicy} onPress={item.onPress} testID={resolvedTestID}>
|
|
16
|
-
{(state) => {
|
|
17
|
-
const presentation = resolveNavigationItemPresentation(theme, {
|
|
18
|
-
active,
|
|
19
|
-
disabled,
|
|
20
|
-
state,
|
|
21
|
-
});
|
|
22
|
-
return (<Box px="m" py={compact ? 's' : 'm'} radius="m" style={{
|
|
23
|
-
backgroundColor: presentation.backgroundColor,
|
|
24
|
-
flexDirection: 'row',
|
|
25
|
-
alignItems: 'center',
|
|
26
|
-
opacity: presentation.opacity,
|
|
27
|
-
}}>
|
|
28
|
-
{item.icon ? (<View style={{ marginRight: theme.spacing.s }}>
|
|
29
|
-
<Icon {...item.icon} color={presentation.contentColor} size={compact ? 's' : 'm'}/>
|
|
30
|
-
</View>) : null}
|
|
31
|
-
<Box flex={1}>
|
|
32
|
-
<Text color={active && !disabled ? 'primary' : undefined} emphasis={disabled ? 'muted' : 'default'} numberOfLines={1} variant={compact ? 'bodySmall' : 'body'} weight="medium">
|
|
33
|
-
{item.label}
|
|
34
|
-
</Text>
|
|
35
|
-
</Box>
|
|
36
|
-
{item.badge ? <View style={{ marginLeft: theme.spacing.s }}>{item.badge}</View> : null}
|
|
37
|
-
</Box>);
|
|
38
|
-
}}
|
|
39
|
-
</ButtonBase>);
|
|
40
|
-
}
|
|
41
|
-
//# sourceMappingURL=NavigationItem.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationItem.js","sourceRoot":"","sources":["../../../src/components/navigation/NavigationItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Box } from '../../layout';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { Icon } from '../../primitives/icon';\nimport { Text } from '../../primitives/text';\nimport { useTheme } from '../../theme/ThemeContext';\nimport { resolveNavigationAccessibilityState, resolveNavigationItemPresentation } from './helpers';\nimport type { NavigationItemProps } from './types';\n\nexport function NavigationItem({\n item,\n compact = false,\n testID,\n interactionPolicy,\n}: NavigationItemProps) {\n const { theme } = useTheme();\n const active = Boolean(item.active);\n const disabled = Boolean(item.disabled);\n const resolvedTestID = item.testID ?? (testID ? `${testID}-item-${item.id}` : undefined);\n const resolvedAccessibilityState = resolveNavigationAccessibilityState(\n active,\n disabled,\n item.accessibilityState,\n );\n\n return (\n <ButtonBase\n accessibilityLabel={item.accessibilityLabel}\n accessibilityRole={item.accessibilityRole ?? 'button'}\n accessibilityState={resolvedAccessibilityState}\n disabled={disabled}\n interactionPolicy={interactionPolicy}\n onPress={item.onPress}\n testID={resolvedTestID}\n >\n {(state) => {\n const presentation = resolveNavigationItemPresentation(theme, {\n active,\n disabled,\n state,\n });\n\n return (\n <Box\n px=\"m\"\n py={compact ? 's' : 'm'}\n radius=\"m\"\n style={{\n backgroundColor: presentation.backgroundColor,\n flexDirection: 'row',\n alignItems: 'center',\n opacity: presentation.opacity,\n }}\n >\n {item.icon ? (\n <View style={{ marginRight: theme.spacing.s }}>\n <Icon {...item.icon} color={presentation.contentColor} size={compact ? 's' : 'm'} />\n </View>\n ) : null}\n <Box flex={1}>\n <Text\n color={active && !disabled ? 'primary' : undefined}\n emphasis={disabled ? 'muted' : 'default'}\n numberOfLines={1}\n variant={compact ? 'bodySmall' : 'body'}\n weight=\"medium\"\n >\n {item.label}\n </Text>\n </Box>\n {item.badge ? <View style={{ marginLeft: theme.spacing.s }}>{item.badge}</View> : null}\n </Box>\n );\n }}\n </ButtonBase>\n );\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAwB,EACxB,OAAe,EACf,MAAM,EACN,iBAAiB,GAClB,EAAE,mBAAmB,qBAkBrB"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Stack } from '../../layout';
|
|
3
|
-
import { NavigationItem } from './NavigationItem';
|
|
4
|
-
export function NavigationList({ items, orientation = 'vertical', compact = false, testID, interactionPolicy, }) {
|
|
5
|
-
return (<Stack direction={orientation === 'horizontal' ? 'row' : 'column'} gap={compact ? 'xs' : 's'} testID={testID}>
|
|
6
|
-
{items.map((item) => (<NavigationItem compact={compact} interactionPolicy={interactionPolicy} item={item} key={item.id} testID={testID}/>))}
|
|
7
|
-
</Stack>);
|
|
8
|
-
}
|
|
9
|
-
//# sourceMappingURL=NavigationList.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/navigation/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,MAAM,UAAU,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,GAAG,UAAU,EACxB,OAAO,GAAG,KAAK,EACf,MAAM,EACN,iBAAiB,GACG;IACpB,OAAO,CACL,CAAC,KAAK,CACJ,SAAS,CAAC,CAAC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAC3D,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAC1B,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,CAAC,cAAc,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC,CACJ;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { Stack } from '../../layout';\nimport { NavigationItem } from './NavigationItem';\nimport type { NavigationListProps } from './types';\n\nexport function NavigationList({\n items,\n orientation = 'vertical',\n compact = false,\n testID,\n interactionPolicy,\n}: NavigationListProps) {\n return (\n <Stack\n direction={orientation === 'horizontal' ? 'row' : 'column'}\n gap={compact ? 'xs' : 's'}\n testID={testID}\n >\n {items.map((item) => (\n <NavigationItem\n compact={compact}\n interactionPolicy={interactionPolicy}\n item={item}\n key={item.id}\n testID={testID}\n />\n ))}\n </Stack>\n );\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/TabBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,OAAe,EAAE,MAAM,EAAE,iBAAiB,EAAE,EAAE,WAAW,qBAuBxF"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Box } from '../../layout';
|
|
3
|
-
import { useTheme } from '../../theme/ThemeContext';
|
|
4
|
-
import { TabBarItem } from './TabBarItem';
|
|
5
|
-
export function TabBar({ items, compact = false, testID, interactionPolicy }) {
|
|
6
|
-
const { theme } = useTheme();
|
|
7
|
-
return (<Box style={{
|
|
8
|
-
flexDirection: 'row',
|
|
9
|
-
borderTopColor: theme.semantics.border.default,
|
|
10
|
-
borderTopWidth: 1,
|
|
11
|
-
}} testID={testID}>
|
|
12
|
-
{items.map((item) => (<TabBarItem compact={compact} interactionPolicy={interactionPolicy} item={item} key={item.id} testID={testID}/>))}
|
|
13
|
-
</Box>);
|
|
14
|
-
}
|
|
15
|
-
//# sourceMappingURL=TabBar.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar.js","sourceRoot":"","sources":["../../../src/components/navigation/TabBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,MAAM,UAAU,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,MAAM,EAAE,iBAAiB,EAAe;IACvF,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE7B,OAAO,CACL,CAAC,GAAG,CACF,KAAK,CAAC,CAAC;YACL,aAAa,EAAE,KAAK;YACpB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO;YAC9C,cAAc,EAAE,CAAC;SAClB,CAAC,CACF,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,CAAC,UAAU,CACT,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC,CACJ;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { Box } from '../../layout';\nimport { useTheme } from '../../theme/ThemeContext';\nimport { TabBarItem } from './TabBarItem';\nimport type { TabBarProps } from './types';\n\nexport function TabBar({ items, compact = false, testID, interactionPolicy }: TabBarProps) {\n const { theme } = useTheme();\n\n return (\n <Box\n style={{\n flexDirection: 'row',\n borderTopColor: theme.semantics.border.default,\n borderTopWidth: 1,\n }}\n testID={testID}\n >\n {items.map((item) => (\n <TabBarItem\n compact={compact}\n interactionPolicy={interactionPolicy}\n item={item}\n key={item.id}\n testID={testID}\n />\n ))}\n </Box>\n );\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarItem.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/TabBarItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,OAAe,EAAE,MAAM,EAAE,iBAAiB,EAAE,EAAE,eAAe,qBAmE/F"}
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { View } from 'react-native';
|
|
3
|
-
import { Box } from '../../layout';
|
|
4
|
-
import { ButtonBase } from '../../primitives/button-base';
|
|
5
|
-
import { Icon } from '../../primitives/icon';
|
|
6
|
-
import { Text } from '../../primitives/text';
|
|
7
|
-
import { useTheme } from '../../theme/ThemeContext';
|
|
8
|
-
import { resolveNavigationAccessibilityState, resolveNavigationItemPresentation } from './helpers';
|
|
9
|
-
export function TabBarItem({ item, compact = false, testID, interactionPolicy }) {
|
|
10
|
-
const { theme } = useTheme();
|
|
11
|
-
const active = Boolean(item.active);
|
|
12
|
-
const disabled = Boolean(item.disabled);
|
|
13
|
-
const resolvedTestID = item.testID ?? (testID ? `${testID}-item-${item.id}` : undefined);
|
|
14
|
-
const resolvedAccessibilityState = resolveNavigationAccessibilityState(active, disabled, item.accessibilityState);
|
|
15
|
-
return (<ButtonBase accessibilityLabel={item.accessibilityLabel} accessibilityRole={item.accessibilityRole ?? 'tab'} accessibilityState={resolvedAccessibilityState} disabled={disabled} interactionPolicy={interactionPolicy} onPress={item.onPress} style={{ flex: 1 }} testID={resolvedTestID}>
|
|
16
|
-
{(state) => {
|
|
17
|
-
const presentation = resolveNavigationItemPresentation(theme, {
|
|
18
|
-
active,
|
|
19
|
-
disabled,
|
|
20
|
-
state,
|
|
21
|
-
});
|
|
22
|
-
const contentColor = disabled
|
|
23
|
-
? theme.semantics.content.muted
|
|
24
|
-
: active
|
|
25
|
-
? theme.semantics.action.primary.base
|
|
26
|
-
: theme.semantics.content.muted;
|
|
27
|
-
return (<Box px="m" py={compact ? 's' : 'm'} style={{
|
|
28
|
-
flex: 1,
|
|
29
|
-
alignItems: 'center',
|
|
30
|
-
justifyContent: 'center',
|
|
31
|
-
backgroundColor: presentation.backgroundColor,
|
|
32
|
-
opacity: presentation.opacity,
|
|
33
|
-
}}>
|
|
34
|
-
{item.icon ? (<View style={{ marginBottom: item.label ? theme.spacing.xs : 0 }}>
|
|
35
|
-
<Icon {...item.icon} color={contentColor} size={compact ? 's' : 'm'}/>
|
|
36
|
-
</View>) : null}
|
|
37
|
-
{item.label ? (<Text color={active && !disabled ? 'primary' : undefined} emphasis={active && !disabled ? 'default' : 'muted'} numberOfLines={1} variant={compact ? 'bodySmall' : 'label'} weight="medium">
|
|
38
|
-
{item.label}
|
|
39
|
-
</Text>) : null}
|
|
40
|
-
</Box>);
|
|
41
|
-
}}
|
|
42
|
-
</ButtonBase>);
|
|
43
|
-
}
|
|
44
|
-
//# sourceMappingURL=TabBarItem.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarItem.js","sourceRoot":"","sources":["../../../src/components/navigation/TabBarItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Box } from '../../layout';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { Icon } from '../../primitives/icon';\nimport { Text } from '../../primitives/text';\nimport { useTheme } from '../../theme/ThemeContext';\nimport { resolveNavigationAccessibilityState, resolveNavigationItemPresentation } from './helpers';\nimport type { TabBarItemProps } from './types';\n\nexport function TabBarItem({ item, compact = false, testID, interactionPolicy }: TabBarItemProps) {\n const { theme } = useTheme();\n const active = Boolean(item.active);\n const disabled = Boolean(item.disabled);\n const resolvedTestID = item.testID ?? (testID ? `${testID}-item-${item.id}` : undefined);\n const resolvedAccessibilityState = resolveNavigationAccessibilityState(\n active,\n disabled,\n item.accessibilityState,\n );\n\n return (\n <ButtonBase\n accessibilityLabel={item.accessibilityLabel}\n accessibilityRole={item.accessibilityRole ?? 'tab'}\n accessibilityState={resolvedAccessibilityState}\n disabled={disabled}\n interactionPolicy={interactionPolicy}\n onPress={item.onPress}\n style={{ flex: 1 }}\n testID={resolvedTestID}\n >\n {(state) => {\n const presentation = resolveNavigationItemPresentation(theme, {\n active,\n disabled,\n state,\n });\n const contentColor = disabled\n ? theme.semantics.content.muted\n : active\n ? theme.semantics.action.primary.base\n : theme.semantics.content.muted;\n\n return (\n <Box\n px=\"m\"\n py={compact ? 's' : 'm'}\n style={{\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: presentation.backgroundColor,\n opacity: presentation.opacity,\n }}\n >\n {item.icon ? (\n <View style={{ marginBottom: item.label ? theme.spacing.xs : 0 }}>\n <Icon {...item.icon} color={contentColor} size={compact ? 's' : 'm'} />\n </View>\n ) : null}\n {item.label ? (\n <Text\n color={active && !disabled ? 'primary' : undefined}\n emphasis={active && !disabled ? 'default' : 'muted'}\n numberOfLines={1}\n variant={compact ? 'bodySmall' : 'label'}\n weight=\"medium\"\n >\n {item.label}\n </Text>\n ) : null}\n </Box>\n );\n }}\n </ButtonBase>\n );\n}\n"]}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import type { AccessibilityState } from 'react-native';
|
|
2
|
-
import type { InteractionState } from '../../internal/resolvers/resolveInteractiveState';
|
|
3
|
-
import type { SurfaceTheme } from '../../theme/types';
|
|
4
|
-
export declare function resolveNavigationAccessibilityState(active: boolean, disabled: boolean, accessibilityState?: AccessibilityState): AccessibilityState;
|
|
5
|
-
export interface ResolvedNavigationItemPresentation {
|
|
6
|
-
backgroundColor: string;
|
|
7
|
-
contentColor: string;
|
|
8
|
-
opacity: number;
|
|
9
|
-
}
|
|
10
|
-
export declare function resolveNavigationItemPresentation(theme: SurfaceTheme, { active, disabled, state, }: {
|
|
11
|
-
active: boolean;
|
|
12
|
-
disabled: boolean;
|
|
13
|
-
state: InteractionState;
|
|
14
|
-
}): ResolvedNavigationItemPresentation;
|
|
15
|
-
//# sourceMappingURL=helpers.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
export function resolveNavigationAccessibilityState(active, disabled, accessibilityState) {
|
|
2
|
-
const resolved = { ...(accessibilityState ?? {}) };
|
|
3
|
-
if (active) {
|
|
4
|
-
resolved.selected = true;
|
|
5
|
-
}
|
|
6
|
-
if (disabled) {
|
|
7
|
-
resolved.disabled = true;
|
|
8
|
-
}
|
|
9
|
-
return resolved;
|
|
10
|
-
}
|
|
11
|
-
export function resolveNavigationItemPresentation(theme, { active, disabled, state, }) {
|
|
12
|
-
const interactionState = disabled ? { ...state, hovered: false, pressed: false } : state;
|
|
13
|
-
if (disabled) {
|
|
14
|
-
return {
|
|
15
|
-
backgroundColor: theme.semantics.surface.disabled,
|
|
16
|
-
contentColor: theme.semantics.content.disabled,
|
|
17
|
-
opacity: 1,
|
|
18
|
-
};
|
|
19
|
-
}
|
|
20
|
-
const contentColor = active
|
|
21
|
-
? interactionState.pressed
|
|
22
|
-
? theme.semantics.action.primary.onSoftActiveText
|
|
23
|
-
: interactionState.hovered
|
|
24
|
-
? theme.semantics.action.primary.onSoftHoverText
|
|
25
|
-
: theme.semantics.action.primary.onSoftText
|
|
26
|
-
: theme.semantics.content.default;
|
|
27
|
-
if (active) {
|
|
28
|
-
return {
|
|
29
|
-
backgroundColor: interactionState.pressed
|
|
30
|
-
? theme.semantics.action.primary.softActive
|
|
31
|
-
: interactionState.hovered
|
|
32
|
-
? theme.semantics.action.primary.softHover
|
|
33
|
-
: theme.semantics.action.primary.softBg,
|
|
34
|
-
contentColor,
|
|
35
|
-
opacity: 1,
|
|
36
|
-
};
|
|
37
|
-
}
|
|
38
|
-
return {
|
|
39
|
-
backgroundColor: interactionState.pressed
|
|
40
|
-
? theme.semantics.neutral.surfaceActive
|
|
41
|
-
: interactionState.hovered
|
|
42
|
-
? theme.semantics.neutral.surfaceHover
|
|
43
|
-
: 'transparent',
|
|
44
|
-
contentColor,
|
|
45
|
-
opacity: 1,
|
|
46
|
-
};
|
|
47
|
-
}
|
|
48
|
-
//# sourceMappingURL=helpers.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"]}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
export { DrawerNavigation } from './DrawerNavigation';
|
|
2
|
-
export { DrawerNavigationItem } from './DrawerNavigationItem';
|
|
3
|
-
export { NavigationItem } from './NavigationItem';
|
|
4
|
-
export { NavigationList } from './NavigationList';
|
|
5
|
-
export { TabBar } from './TabBar';
|
|
6
|
-
export { TabBarItem } from './TabBarItem';
|
|
7
|
-
export type { DrawerNavigationItemProps, DrawerNavigationProps, NavigationItemIcon, NavigationItemProps, NavigationItemSpec, NavigationListProps, TabBarItemProps, TabBarProps, } from './types';
|
|
8
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export { DrawerNavigation } from './DrawerNavigation';
|
|
2
|
-
export { DrawerNavigationItem } from './DrawerNavigationItem';
|
|
3
|
-
export { NavigationItem } from './NavigationItem';
|
|
4
|
-
export { NavigationList } from './NavigationList';
|
|
5
|
-
export { TabBar } from './TabBar';
|
|
6
|
-
export { TabBarItem } from './TabBarItem';
|
|
7
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"]}
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import type React from 'react';
|
|
2
|
-
import type { AccessibilityRole, AccessibilityState } from 'react-native';
|
|
3
|
-
import type { InteractionPolicy } from '../../interactionPolicy';
|
|
4
|
-
import type { IconSource } from '../../primitives/icon';
|
|
5
|
-
export type NavigationItemIcon = IconSource;
|
|
6
|
-
export interface NavigationItemSpec {
|
|
7
|
-
id: string;
|
|
8
|
-
label: React.ReactNode;
|
|
9
|
-
icon?: NavigationItemIcon;
|
|
10
|
-
badge?: React.ReactNode;
|
|
11
|
-
active?: boolean;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
onPress?: (() => void) | undefined;
|
|
14
|
-
accessibilityLabel?: string;
|
|
15
|
-
accessibilityRole?: AccessibilityRole;
|
|
16
|
-
accessibilityState?: AccessibilityState;
|
|
17
|
-
testID?: string;
|
|
18
|
-
}
|
|
19
|
-
export interface NavigationItemProps {
|
|
20
|
-
item: NavigationItemSpec;
|
|
21
|
-
compact?: boolean;
|
|
22
|
-
testID?: string;
|
|
23
|
-
interactionPolicy?: InteractionPolicy;
|
|
24
|
-
}
|
|
25
|
-
export interface NavigationListProps {
|
|
26
|
-
items: readonly NavigationItemSpec[];
|
|
27
|
-
orientation?: 'vertical' | 'horizontal';
|
|
28
|
-
compact?: boolean;
|
|
29
|
-
testID?: string;
|
|
30
|
-
interactionPolicy?: InteractionPolicy;
|
|
31
|
-
}
|
|
32
|
-
export interface TabBarProps {
|
|
33
|
-
items: readonly NavigationItemSpec[];
|
|
34
|
-
compact?: boolean;
|
|
35
|
-
testID?: string;
|
|
36
|
-
interactionPolicy?: InteractionPolicy;
|
|
37
|
-
}
|
|
38
|
-
export interface TabBarItemProps {
|
|
39
|
-
item: NavigationItemSpec;
|
|
40
|
-
compact?: boolean;
|
|
41
|
-
testID?: string;
|
|
42
|
-
interactionPolicy?: InteractionPolicy;
|
|
43
|
-
}
|
|
44
|
-
export interface DrawerNavigationProps {
|
|
45
|
-
items: readonly NavigationItemSpec[];
|
|
46
|
-
header?: React.ReactNode;
|
|
47
|
-
footer?: React.ReactNode;
|
|
48
|
-
compact?: boolean;
|
|
49
|
-
testID?: string;
|
|
50
|
-
interactionPolicy?: InteractionPolicy;
|
|
51
|
-
}
|
|
52
|
-
export interface DrawerNavigationItemProps {
|
|
53
|
-
item: NavigationItemSpec;
|
|
54
|
-
compact?: boolean;
|
|
55
|
-
testID?: string;
|
|
56
|
-
interactionPolicy?: InteractionPolicy;
|
|
57
|
-
}
|
|
58
|
-
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"]}
|
|
@@ -1,130 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Pressable, View } from 'react-native';
|
|
3
|
-
|
|
4
|
-
import { FocusScope } from '../../internal/focus/FocusScope';
|
|
5
|
-
import { Portal } from '../../internal/overlay/Portal';
|
|
6
|
-
import { resolvePointerEvents } from '../../internal/resolvePointerEvents';
|
|
7
|
-
import { resolveOverlayAnimation } from '../../internal/resolvers';
|
|
8
|
-
import { Box, Stack, Surface } from '../../layout';
|
|
9
|
-
import { Text } from '../../primitives/text';
|
|
10
|
-
import { useTheme } from '../../theme/ThemeContext';
|
|
11
|
-
import { ActionSheetItem } from './ActionSheetItem';
|
|
12
|
-
import type { ActionSheetProps } from './types';
|
|
13
|
-
|
|
14
|
-
const boxNonePointerEvents = resolvePointerEvents('box-none');
|
|
15
|
-
|
|
16
|
-
export function ActionSheet({
|
|
17
|
-
visible,
|
|
18
|
-
onDismiss,
|
|
19
|
-
title,
|
|
20
|
-
description,
|
|
21
|
-
children,
|
|
22
|
-
cancelLabel = 'Cancel',
|
|
23
|
-
closeOnBackdrop = true,
|
|
24
|
-
interactionPolicy = 'enabled',
|
|
25
|
-
testID,
|
|
26
|
-
}: ActionSheetProps) {
|
|
27
|
-
const { theme } = useTheme();
|
|
28
|
-
const animation = resolveOverlayAnimation('modal');
|
|
29
|
-
const passive = interactionPolicy === 'passive';
|
|
30
|
-
|
|
31
|
-
if (!visible) {
|
|
32
|
-
return null;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<Portal layer="modal" visible={visible}>
|
|
37
|
-
<View
|
|
38
|
-
{...boxNonePointerEvents.props}
|
|
39
|
-
style={[
|
|
40
|
-
boxNonePointerEvents.style,
|
|
41
|
-
{
|
|
42
|
-
bottom: 0,
|
|
43
|
-
left: 0,
|
|
44
|
-
position: 'absolute',
|
|
45
|
-
right: 0,
|
|
46
|
-
top: 0,
|
|
47
|
-
},
|
|
48
|
-
]}
|
|
49
|
-
>
|
|
50
|
-
<Pressable
|
|
51
|
-
onPress={passive ? undefined : closeOnBackdrop ? onDismiss : undefined}
|
|
52
|
-
style={{
|
|
53
|
-
backgroundColor: theme.semantics.neutral.text,
|
|
54
|
-
bottom: 0,
|
|
55
|
-
left: 0,
|
|
56
|
-
opacity: animation.backdropOpacity,
|
|
57
|
-
position: 'absolute',
|
|
58
|
-
right: 0,
|
|
59
|
-
top: 0,
|
|
60
|
-
}}
|
|
61
|
-
testID={testID ? `${testID}-backdrop` : undefined}
|
|
62
|
-
/>
|
|
63
|
-
<FocusScope
|
|
64
|
-
active={visible}
|
|
65
|
-
onEscape={passive ? undefined : onDismiss}
|
|
66
|
-
testID={testID ? `${testID}-focus` : undefined}
|
|
67
|
-
>
|
|
68
|
-
<Box
|
|
69
|
-
pointerEvents="box-none"
|
|
70
|
-
style={{
|
|
71
|
-
flex: 1,
|
|
72
|
-
justifyContent: 'flex-end',
|
|
73
|
-
}}
|
|
74
|
-
>
|
|
75
|
-
<View
|
|
76
|
-
accessible
|
|
77
|
-
accessibilityViewIsModal
|
|
78
|
-
style={{
|
|
79
|
-
alignSelf: 'center',
|
|
80
|
-
maxWidth: 560,
|
|
81
|
-
padding: 16,
|
|
82
|
-
width: '100%',
|
|
83
|
-
}}
|
|
84
|
-
>
|
|
85
|
-
<Surface
|
|
86
|
-
p="m"
|
|
87
|
-
style={{
|
|
88
|
-
borderRadius: 24,
|
|
89
|
-
shadowOpacity: 0.16,
|
|
90
|
-
shadowRadius: 18,
|
|
91
|
-
shadowOffset: { width: 0, height: -8 },
|
|
92
|
-
}}
|
|
93
|
-
testID={testID}
|
|
94
|
-
variant="raised"
|
|
95
|
-
>
|
|
96
|
-
<Stack gap="s">
|
|
97
|
-
{title || description ? (
|
|
98
|
-
<Box px="m" py="s">
|
|
99
|
-
<Stack gap="xxs">
|
|
100
|
-
{title ? (
|
|
101
|
-
<Text align="center" variant="label" weight="semiBold">
|
|
102
|
-
{title}
|
|
103
|
-
</Text>
|
|
104
|
-
) : null}
|
|
105
|
-
{description ? (
|
|
106
|
-
<Text align="center" emphasis="muted" variant="bodySmall">
|
|
107
|
-
{description}
|
|
108
|
-
</Text>
|
|
109
|
-
) : null}
|
|
110
|
-
</Stack>
|
|
111
|
-
</Box>
|
|
112
|
-
) : null}
|
|
113
|
-
<Stack gap="xxs">{children}</Stack>
|
|
114
|
-
{onDismiss ? (
|
|
115
|
-
<ActionSheetItem
|
|
116
|
-
label={cancelLabel}
|
|
117
|
-
interactionPolicy={interactionPolicy}
|
|
118
|
-
onPress={onDismiss}
|
|
119
|
-
testID={testID ? `${testID}-cancel` : undefined}
|
|
120
|
-
/>
|
|
121
|
-
) : null}
|
|
122
|
-
</Stack>
|
|
123
|
-
</Surface>
|
|
124
|
-
</View>
|
|
125
|
-
</Box>
|
|
126
|
-
</FocusScope>
|
|
127
|
-
</View>
|
|
128
|
-
</Portal>
|
|
129
|
-
);
|
|
130
|
-
}
|