zero-to-app 2.0.2 → 3.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/dist/components/navigation/index.d.ts +3 -0
- package/dist/components/navigation/index.d.ts.map +1 -1
- package/dist/components/navigation/index.js +5 -1
- package/dist/components/navigation/index.js.map +1 -1
- package/dist/components/navigation/native-header.d.ts +10 -5
- package/dist/components/navigation/native-header.d.ts.map +1 -1
- package/dist/components/navigation/native-header.js +22 -4
- package/dist/components/navigation/native-header.js.map +1 -1
- package/dist/components/navigation/themed-stack.d.ts +25 -0
- package/dist/components/navigation/themed-stack.d.ts.map +1 -0
- package/dist/components/navigation/themed-stack.js +37 -0
- package/dist/components/navigation/themed-stack.js.map +1 -0
- package/dist/components/shared/index.d.ts +1 -0
- package/dist/components/shared/index.d.ts.map +1 -1
- package/dist/components/shared/index.js +1 -1
- package/dist/components/shared/index.js.map +1 -1
- package/dist/components/shared/utils.d.ts +19 -0
- package/dist/components/shared/utils.d.ts.map +1 -0
- package/dist/components/shared/utils.js +23 -0
- package/dist/components/shared/utils.js.map +1 -0
- package/dist/components/ui/button.d.ts +5 -7
- package/dist/components/ui/button.d.ts.map +1 -1
- package/dist/components/ui/button.js +8 -11
- package/dist/components/ui/button.js.map +1 -1
- package/dist/components/ui/chip.d.ts +88 -0
- package/dist/components/ui/chip.d.ts.map +1 -0
- package/dist/components/ui/chip.js +129 -0
- package/dist/components/ui/chip.js.map +1 -0
- package/dist/components/ui/fab.d.ts.map +1 -1
- package/dist/components/ui/fab.js +5 -1
- package/dist/components/ui/fab.js.map +1 -1
- package/dist/components/ui/index.d.ts +5 -0
- package/dist/components/ui/index.d.ts.map +1 -1
- package/dist/components/ui/index.js +5 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/screen.d.ts.map +1 -1
- package/dist/components/ui/screen.js +9 -6
- package/dist/components/ui/screen.js.map +1 -1
- package/dist/components/ui/slider.d.ts +47 -0
- package/dist/components/ui/slider.d.ts.map +1 -0
- package/dist/components/ui/slider.js +31 -0
- package/dist/components/ui/slider.js.map +1 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -0
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/use-route-navigation.d.ts +19 -0
- package/dist/hooks/use-route-navigation.d.ts.map +1 -0
- package/dist/hooks/use-route-navigation.js +25 -0
- package/dist/hooks/use-route-navigation.js.map +1 -0
- package/dist/theme/high-contrast-theme.d.ts.map +1 -1
- package/dist/theme/high-contrast-theme.js +32 -0
- package/dist/theme/high-contrast-theme.js.map +1 -1
- package/dist/theme/theme-config.d.ts +16 -0
- package/dist/theme/theme-config.d.ts.map +1 -1
- package/dist/theme/theme-config.js +32 -0
- package/dist/theme/theme-config.js.map +1 -1
- package/package.json +10 -6
|
@@ -2,6 +2,9 @@ export { AppTabs } from './app-tabs';
|
|
|
2
2
|
export type { AppTabsProps, AppTabConfig, AppTabsExternalLink } from './app-tabs';
|
|
3
3
|
export { NativeHeader } from './native-header';
|
|
4
4
|
export type { NativeHeaderProps } from './native-header';
|
|
5
|
+
export { ThemedStack } from './themed-stack';
|
|
6
|
+
export { Drawer } from './drawer/drawer';
|
|
7
|
+
export type { DrawerProps } from './drawer/drawer';
|
|
5
8
|
export { Sidebar, SidebarItem, SidebarSection, SidebarHeader, SidebarFooter, } from './sidebar';
|
|
6
9
|
export type { SidebarProps, SidebarItemProps, SidebarItemIconConfig, SidebarSectionProps, SidebarSectionIconConfig, SidebarHeaderProps, SidebarFooterProps, } from './sidebar';
|
|
7
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/navigation/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGzD,OAAO,EACL,OAAO,EACP,WAAW,EACX,cAAc,EACd,aAAa,EACb,aAAa,GACd,MAAM,WAAW,CAAC;AACnB,YAAY,EACV,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,wBAAwB,EACxB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/navigation/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGzD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,YAAY,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,OAAO,EACL,OAAO,EACP,WAAW,EACX,cAAc,EACd,aAAa,EACb,aAAa,GACd,MAAM,WAAW,CAAC;AACnB,YAAY,EACV,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,wBAAwB,EACxB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,WAAW,CAAC"}
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
// Navigation components
|
|
2
2
|
export { AppTabs } from './app-tabs';
|
|
3
|
-
// NativeHeader
|
|
3
|
+
// NativeHeader — screen-level header buttons for iOS (Stack.Toolbar) and Android (headerLeft/headerRight)
|
|
4
4
|
export { NativeHeader } from './native-header';
|
|
5
|
+
// ThemedStack — Stack wrapper with automatic theme token header styling
|
|
6
|
+
export { ThemedStack } from './themed-stack';
|
|
7
|
+
// Drawer — low-level animated side drawer (used by Sidebar and AppTabs)
|
|
8
|
+
export { Drawer } from './drawer/drawer';
|
|
5
9
|
// Sidebar components
|
|
6
10
|
export { Sidebar, SidebarItem, SidebarSection, SidebarHeader, SidebarFooter, } from './sidebar';
|
|
7
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/navigation/index.ts"],"names":[],"mappings":"AAAA,wBAAwB;AACxB,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/navigation/index.ts"],"names":[],"mappings":"AAAA,wBAAwB;AACxB,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,0GAA0G;AAC1G,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,wEAAwE;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,wEAAwE;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAGzC,qBAAqB;AACrB,OAAO,EACL,OAAO,EACP,WAAW,EACX,cAAc,EACd,aAAa,EACb,aAAa,GACd,MAAM,WAAW,CAAC"}
|
|
@@ -1,20 +1,25 @@
|
|
|
1
1
|
export interface NativeHeaderProps {
|
|
2
|
-
/** SF Symbol name for the right toolbar button */
|
|
2
|
+
/** SF Symbol name for the right toolbar button (iOS only) */
|
|
3
3
|
rightIcon?: string;
|
|
4
4
|
/** Press handler for the right toolbar button */
|
|
5
5
|
onRightPress?: () => void;
|
|
6
|
-
/** SF Symbol name for the left toolbar button */
|
|
6
|
+
/** SF Symbol name for the left toolbar button (iOS only) */
|
|
7
7
|
leftIcon?: string;
|
|
8
8
|
/** Press handler for the left toolbar button */
|
|
9
9
|
onLeftPress?: () => void;
|
|
10
|
+
/** Feather icon name for the right header button (Android only) */
|
|
11
|
+
androidRightIcon?: string;
|
|
12
|
+
/** Feather icon name for the left header button (Android only) */
|
|
13
|
+
androidLeftIcon?: string;
|
|
10
14
|
}
|
|
11
15
|
/**
|
|
12
|
-
* Screen-level native header toolbar for iOS.
|
|
13
|
-
*
|
|
16
|
+
* Screen-level native header toolbar for iOS and Android.
|
|
17
|
+
* iOS: renders SF Symbol buttons via Stack.Toolbar.
|
|
18
|
+
* Android: renders Feather icon buttons via Stack.Screen headerLeft/headerRight.
|
|
14
19
|
* Use inside screen components, not layouts.
|
|
15
20
|
*/
|
|
16
21
|
export declare const NativeHeader: {
|
|
17
|
-
({ rightIcon, onRightPress, leftIcon, onLeftPress, }: NativeHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
({ rightIcon, onRightPress, leftIcon, onLeftPress, androidRightIcon, androidLeftIcon, }: NativeHeaderProps): import("react/jsx-runtime").JSX.Element | null;
|
|
18
23
|
displayName: string;
|
|
19
24
|
};
|
|
20
25
|
//# sourceMappingURL=native-header.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"native-header.d.ts","sourceRoot":"","sources":["../../../components/navigation/native-header.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"native-header.d.ts","sourceRoot":"","sources":["../../../components/navigation/native-header.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,iBAAiB;IAChC,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kEAAkE;IAClE,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY;6FAOtB,iBAAiB;;CAoDnB,CAAC"}
|
|
@@ -1,14 +1,32 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Platform, Pressable } from 'react-native';
|
|
2
3
|
import { Stack } from 'expo-router';
|
|
3
4
|
import { useTheme } from '../../theme';
|
|
5
|
+
import { renderIcon } from '../../icons';
|
|
4
6
|
/**
|
|
5
|
-
* Screen-level native header toolbar for iOS.
|
|
6
|
-
*
|
|
7
|
+
* Screen-level native header toolbar for iOS and Android.
|
|
8
|
+
* iOS: renders SF Symbol buttons via Stack.Toolbar.
|
|
9
|
+
* Android: renders Feather icon buttons via Stack.Screen headerLeft/headerRight.
|
|
7
10
|
* Use inside screen components, not layouts.
|
|
8
11
|
*/
|
|
9
|
-
export const NativeHeader = ({ rightIcon, onRightPress, leftIcon, onLeftPress, }) => {
|
|
12
|
+
export const NativeHeader = ({ rightIcon, onRightPress, leftIcon, onLeftPress, androidRightIcon, androidLeftIcon, }) => {
|
|
10
13
|
const theme = useTheme();
|
|
11
|
-
|
|
14
|
+
if (Platform.OS === 'ios') {
|
|
15
|
+
return (_jsxs(_Fragment, { children: [rightIcon && (_jsx(Stack.Toolbar, { placement: "right", children: _jsx(Stack.Toolbar.Button, { icon: rightIcon, onPress: onRightPress }) })), leftIcon && (_jsx(Stack.Toolbar, { placement: "left", children: _jsx(Stack.Toolbar.Button, { icon: leftIcon, onPress: onLeftPress, tintColor: theme.onSurface }) }))] }));
|
|
16
|
+
}
|
|
17
|
+
if (Platform.OS === 'android') {
|
|
18
|
+
if (!androidRightIcon && !androidLeftIcon)
|
|
19
|
+
return null;
|
|
20
|
+
return (_jsx(Stack.Screen, { options: {
|
|
21
|
+
...(androidRightIcon && {
|
|
22
|
+
headerRight: () => (_jsx(Pressable, { onPress: onRightPress, style: { padding: 8 }, children: renderIcon(androidRightIcon, 'Feather', 24, theme.onSurface) })),
|
|
23
|
+
}),
|
|
24
|
+
...(androidLeftIcon && {
|
|
25
|
+
headerLeft: () => (_jsx(Pressable, { onPress: onLeftPress, style: { padding: 8 }, children: renderIcon(androidLeftIcon, 'Feather', 24, theme.onSurface) })),
|
|
26
|
+
}),
|
|
27
|
+
} }));
|
|
28
|
+
}
|
|
29
|
+
return null;
|
|
12
30
|
};
|
|
13
31
|
NativeHeader.displayName = 'NativeHeader';
|
|
14
32
|
//# sourceMappingURL=native-header.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"native-header.js","sourceRoot":"","sources":["../../../components/navigation/native-header.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"native-header.js","sourceRoot":"","sources":["../../../components/navigation/native-header.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAiBzC;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,gBAAgB,EAChB,eAAe,GACG,EAAE,EAAE;IACtB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,IAAI,QAAQ,CAAC,EAAE,KAAK,KAAK,EAAE,CAAC;QAC1B,OAAO,CACL,8BACG,SAAS,IAAI,CACZ,KAAC,KAAK,CAAC,OAAO,IAAC,SAAS,EAAC,OAAO,YAC9B,KAAC,KAAK,CAAC,OAAO,CAAC,MAAM,IACnB,IAAI,EAAE,SAAgB,EACtB,OAAO,EAAE,YAAY,GACrB,GACY,CACjB,EACA,QAAQ,IAAI,CACX,KAAC,KAAK,CAAC,OAAO,IAAC,SAAS,EAAC,MAAM,YAC7B,KAAC,KAAK,CAAC,OAAO,CAAC,MAAM,IACnB,IAAI,EAAE,QAAe,EACrB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,KAAK,CAAC,SAAS,GAC1B,GACY,CACjB,IACA,CACJ,CAAC;IACJ,CAAC;IAED,IAAI,QAAQ,CAAC,EAAE,KAAK,SAAS,EAAE,CAAC;QAC9B,IAAI,CAAC,gBAAgB,IAAI,CAAC,eAAe;YAAE,OAAO,IAAI,CAAC;QACvD,OAAO,CACL,KAAC,KAAK,CAAC,MAAM,IACX,OAAO,EAAE;gBACP,GAAG,CAAC,gBAAgB,IAAI;oBACtB,WAAW,EAAE,GAAG,EAAE,CAAC,CACjB,KAAC,SAAS,IAAC,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,YACpD,UAAU,CAAC,gBAAgB,EAAE,SAAS,EAAE,EAAE,EAAE,KAAK,CAAC,SAAS,CAAC,GACnD,CACb;iBACF,CAAC;gBACF,GAAG,CAAC,eAAe,IAAI;oBACrB,UAAU,EAAE,GAAG,EAAE,CAAC,CAChB,KAAC,SAAS,IAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,YACnD,UAAU,CAAC,eAAe,EAAE,SAAS,EAAE,EAAE,EAAE,KAAK,CAAC,SAAS,CAAC,GAClD,CACb;iBACF,CAAC;aACH,GACD,CACH,CAAC;IACJ,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { type ComponentProps } from 'react';
|
|
2
|
+
import { Stack } from 'expo-router';
|
|
3
|
+
type StackProps = ComponentProps<typeof Stack>;
|
|
4
|
+
/**
|
|
5
|
+
* A themed wrapper around Expo Router's Stack that automatically applies
|
|
6
|
+
* the app's header styling from the design token system.
|
|
7
|
+
*
|
|
8
|
+
* Applies headerStyle, headerTintColor, and sensible back button defaults.
|
|
9
|
+
* Any screenOptions passed as props are merged and will override the defaults.
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* // _layout.native.tsx
|
|
14
|
+
* <ThemedStack>
|
|
15
|
+
* <Stack.Screen name="index" options={{ title: 'Home' }} />
|
|
16
|
+
* <Stack.Screen name="detail" options={{ title: 'Detail' }} />
|
|
17
|
+
* </ThemedStack>
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
20
|
+
export declare function ThemedStack({ screenOptions, ...props }: StackProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
export declare namespace ThemedStack {
|
|
22
|
+
var displayName: string;
|
|
23
|
+
}
|
|
24
|
+
export {};
|
|
25
|
+
//# sourceMappingURL=themed-stack.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"themed-stack.d.ts","sourceRoot":"","sources":["../../../components/navigation/themed-stack.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,KAAK,UAAU,GAAG,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC;AAE/C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,WAAW,CAAC,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CAmBlE;yBAnBe,WAAW"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Stack } from 'expo-router';
|
|
3
|
+
import { useTheme } from '../../theme';
|
|
4
|
+
/**
|
|
5
|
+
* A themed wrapper around Expo Router's Stack that automatically applies
|
|
6
|
+
* the app's header styling from the design token system.
|
|
7
|
+
*
|
|
8
|
+
* Applies headerStyle, headerTintColor, and sensible back button defaults.
|
|
9
|
+
* Any screenOptions passed as props are merged and will override the defaults.
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* // _layout.native.tsx
|
|
14
|
+
* <ThemedStack>
|
|
15
|
+
* <Stack.Screen name="index" options={{ title: 'Home' }} />
|
|
16
|
+
* <Stack.Screen name="detail" options={{ title: 'Detail' }} />
|
|
17
|
+
* </ThemedStack>
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
20
|
+
export function ThemedStack({ screenOptions, ...props }) {
|
|
21
|
+
const theme = useTheme();
|
|
22
|
+
const defaults = {
|
|
23
|
+
headerStyle: { backgroundColor: theme.tokens.appbar.background },
|
|
24
|
+
headerTintColor: theme.onSurface,
|
|
25
|
+
headerBackVisible: true,
|
|
26
|
+
headerBackButtonDisplayMode: 'minimal',
|
|
27
|
+
};
|
|
28
|
+
const mergedScreenOptions = typeof screenOptions === 'function'
|
|
29
|
+
? (args) => ({
|
|
30
|
+
...defaults,
|
|
31
|
+
...screenOptions(args),
|
|
32
|
+
})
|
|
33
|
+
: { ...defaults, ...screenOptions };
|
|
34
|
+
return _jsx(Stack, { screenOptions: mergedScreenOptions, ...props });
|
|
35
|
+
}
|
|
36
|
+
ThemedStack.displayName = 'ThemedStack';
|
|
37
|
+
//# sourceMappingURL=themed-stack.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"themed-stack.js","sourceRoot":"","sources":["../../../components/navigation/themed-stack.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAIvC;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,aAAa,EAAE,GAAG,KAAK,EAAc;IACjE,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,QAAQ,GAAG;QACf,WAAW,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE;QAChE,eAAe,EAAE,KAAK,CAAC,SAAS;QAChC,iBAAiB,EAAE,IAAI;QACvB,2BAA2B,EAAE,SAAkB;KAChD,CAAC;IAEF,MAAM,mBAAmB,GACvB,OAAO,aAAa,KAAK,UAAU;QACjC,CAAC,CAAC,CAAC,IAAmE,EAAE,EAAE,CAAC,CAAC;YACxE,GAAG,QAAQ;YACX,GAAG,aAAa,CAAC,IAAI,CAAC;SACvB,CAAC;QACJ,CAAC,CAAC,EAAE,GAAG,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;IAExC,OAAO,KAAC,KAAK,IAAC,aAAa,EAAE,mBAAmB,KAAM,KAAK,GAAI,CAAC;AAClE,CAAC;AAED,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/shared/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,kBAAkB,EAClB,yBAAyB,EACzB,sBAAsB,EACtB,uBAAuB,GACxB,MAAM,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/shared/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,kBAAkB,EAClB,yBAAyB,EACzB,sBAAsB,EACtB,uBAAuB,GACxB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export { blurOnWeb } from './utils';
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/shared/index.ts"],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/shared/index.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type GestureResponderEvent } from 'react-native';
|
|
2
|
+
/**
|
|
3
|
+
* Blurs the pressed element on web after interaction.
|
|
4
|
+
*
|
|
5
|
+
* Prevents the focus ring from lingering after mouse/pointer clicks.
|
|
6
|
+
* Keyboard-triggered focus is unaffected — the ring only clears when
|
|
7
|
+
* `onPress` fires (i.e. after a click or Enter key), so tabbing to the
|
|
8
|
+
* element still shows the ring as expected.
|
|
9
|
+
*
|
|
10
|
+
* Apply inside every interactive component's `onPress` handler on web:
|
|
11
|
+
* ```tsx
|
|
12
|
+
* onPress={(e) => {
|
|
13
|
+
* blurOnWeb(e);
|
|
14
|
+
* onPress?.(e);
|
|
15
|
+
* }}
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export declare const blurOnWeb: (e: GestureResponderEvent) => void;
|
|
19
|
+
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../components/shared/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAEpE;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,SAAS,GAAI,GAAG,qBAAqB,KAAG,IAIpD,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Platform } from 'react-native';
|
|
2
|
+
/**
|
|
3
|
+
* Blurs the pressed element on web after interaction.
|
|
4
|
+
*
|
|
5
|
+
* Prevents the focus ring from lingering after mouse/pointer clicks.
|
|
6
|
+
* Keyboard-triggered focus is unaffected — the ring only clears when
|
|
7
|
+
* `onPress` fires (i.e. after a click or Enter key), so tabbing to the
|
|
8
|
+
* element still shows the ring as expected.
|
|
9
|
+
*
|
|
10
|
+
* Apply inside every interactive component's `onPress` handler on web:
|
|
11
|
+
* ```tsx
|
|
12
|
+
* onPress={(e) => {
|
|
13
|
+
* blurOnWeb(e);
|
|
14
|
+
* onPress?.(e);
|
|
15
|
+
* }}
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export const blurOnWeb = (e) => {
|
|
19
|
+
if (Platform.OS === 'web') {
|
|
20
|
+
e.currentTarget?.blur?.();
|
|
21
|
+
}
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../components/shared/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA8B,MAAM,cAAc,CAAC;AAEpE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,CAAwB,EAAQ,EAAE;IAC1D,IAAI,QAAQ,CAAC,EAAE,KAAK,KAAK,EAAE,CAAC;QACzB,CAAC,CAAC,aAAqB,EAAE,IAAI,EAAE,EAAE,CAAC;IACrC,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -109,14 +109,12 @@ export interface ButtonProps extends Omit<InteractiveComponentProps, 'onPress'>,
|
|
|
109
109
|
backgroundColor?: string;
|
|
110
110
|
/**
|
|
111
111
|
* Button size affecting height.
|
|
112
|
-
* - `
|
|
113
|
-
* - `
|
|
114
|
-
* - `
|
|
115
|
-
*
|
|
116
|
-
* - `xl`: 136dp
|
|
117
|
-
* @default 's'
|
|
112
|
+
* - `small`: 32dp
|
|
113
|
+
* - `medium`: 40dp (default)
|
|
114
|
+
* - `large`: 56dp
|
|
115
|
+
* @default 'medium'
|
|
118
116
|
*/
|
|
119
|
-
size?: '
|
|
117
|
+
size?: 'small' | 'medium' | 'large';
|
|
120
118
|
}
|
|
121
119
|
/**
|
|
122
120
|
* Material Design 3 Button component
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EAEL,qBAAqB,EAIrB,IAAI,EAIL,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,yBAAyB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EAEL,qBAAqB,EAIrB,IAAI,EAIL,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,yBAAyB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAKzF;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,UAAU;IACzB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,kDAAkD;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;AAClF,eAAO,MAAM,cAAc,8DAA+D,CAAC;AAE3F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,yBAAyB,EAAE,SAAS,CAAC,EAAE,sBAAsB;IACrG,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,kCAAkC;IAClC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAGD;;;;;;;;;;GAUG;AACH,QAAA,MAAM,MAAM,0EAgQV,CAAC;AAmDH,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
|
@@ -5,6 +5,7 @@ import { ActivityIndicator, Platform, Pressable, StyleSheet, View, } from 'react
|
|
|
5
5
|
import { Typography } from './typography';
|
|
6
6
|
import { useTheme } from '../../theme';
|
|
7
7
|
import { renderIcon } from '../../icons';
|
|
8
|
+
import { blurOnWeb } from '../shared/utils';
|
|
8
9
|
export const ButtonVariants = ['filled', 'elevated', 'tonal', 'outlined', 'text'];
|
|
9
10
|
// 3. COMPONENT
|
|
10
11
|
/**
|
|
@@ -18,7 +19,7 @@ export const ButtonVariants = ['filled', 'elevated', 'tonal', 'outlined', 'text'
|
|
|
18
19
|
* - outlined: Medium-emphasis with border
|
|
19
20
|
* - text: Low-emphasis actions
|
|
20
21
|
*/
|
|
21
|
-
const Button = forwardRef(({ title, variant = 'filled', loading = false, disabled = false, icon, onPress, iconPosition = 'right', style, testID, accessibilityLabel, accessibilityHint, color, backgroundColor, size = '
|
|
22
|
+
const Button = forwardRef(({ title, variant = 'filled', loading = false, disabled = false, icon, onPress, iconPosition = 'right', style, testID, accessibilityLabel, accessibilityHint, color, backgroundColor, size = 'medium', }, ref) => {
|
|
22
23
|
const theme = useTheme();
|
|
23
24
|
const tokens = theme.tokens;
|
|
24
25
|
// Track hover and focus states (web-only features)
|
|
@@ -44,14 +45,12 @@ const Button = forwardRef(({ title, variant = 'filled', loading = false, disable
|
|
|
44
45
|
}, []);
|
|
45
46
|
// Visual heights in dp per size token
|
|
46
47
|
const sizeMap = {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
l: 96,
|
|
51
|
-
xl: 136,
|
|
48
|
+
small: 32,
|
|
49
|
+
medium: 40,
|
|
50
|
+
large: 56,
|
|
52
51
|
};
|
|
53
|
-
// default to '
|
|
54
|
-
const visualHeight = sizeMap[size] ?? sizeMap.
|
|
52
|
+
// default to 'medium' if not provided via props
|
|
53
|
+
const visualHeight = sizeMap[size] ?? sizeMap.medium;
|
|
55
54
|
// Ensure a minimum touch target of 48dp
|
|
56
55
|
const touchHeight = Math.max(48, visualHeight);
|
|
57
56
|
// Dynamic styles based on state
|
|
@@ -191,9 +190,7 @@ const Button = forwardRef(({ title, variant = 'filled', loading = false, disable
|
|
|
191
190
|
return (_jsx(View, { style: position === 'left' ? styles.iconLeft : styles.iconRight, children: renderIcon(icon, iconLibrary, iconSize, iconColor) }));
|
|
192
191
|
};
|
|
193
192
|
return (_jsx(Pressable, { ref: ref, testID: testID, onPress: disabled ? undefined : (e) => {
|
|
194
|
-
|
|
195
|
-
e.currentTarget?.blur?.();
|
|
196
|
-
}
|
|
193
|
+
blurOnWeb(e);
|
|
197
194
|
onPress?.(e);
|
|
198
195
|
}, disabled: disabled, style: getButtonStyle, onHoverIn: () => setHovered(true), onHoverOut: () => setHovered(false), onFocus: () => setFocused(true), onBlur: () => setFocused(false), accessibilityRole: "button", accessibilityLabel: accessibilityLabel ?? title, accessibilityHint: accessibilityHint, accessibilityState: { disabled },
|
|
199
196
|
// Platform-specific ripple effect for Android
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":";AAAA,aAAa;AACb,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EACL,iBAAiB,EAEjB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,IAAI,GAIL,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { type IconLibrary } from '../../icons';
|
|
2
|
+
import type { InteractiveComponentProps } from '../shared/types';
|
|
3
|
+
/**
|
|
4
|
+
* Configuration for the chip's trailing icon.
|
|
5
|
+
*/
|
|
6
|
+
export interface ChipIconConfig {
|
|
7
|
+
/** Icon library to use. @default 'Feather' */
|
|
8
|
+
library?: IconLibrary;
|
|
9
|
+
/** Name of the icon from the specified library */
|
|
10
|
+
name: string;
|
|
11
|
+
/** Icon size in pixels. @default 18 */
|
|
12
|
+
size?: number;
|
|
13
|
+
/** Custom icon color. Defaults to chip text color */
|
|
14
|
+
color?: string;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* Material Design 3 chip visual variants.
|
|
18
|
+
* - `outlined`: Transparent background with 1dp border (default)
|
|
19
|
+
* - `filled`: Solid secondaryContainer background, no border
|
|
20
|
+
*/
|
|
21
|
+
export type ChipVariant = 'filled' | 'outlined';
|
|
22
|
+
export declare const ChipVariants: readonly ["filled", "outlined"];
|
|
23
|
+
/**
|
|
24
|
+
* Props for the Chip component.
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```tsx
|
|
28
|
+
* // Outlined chip (default)
|
|
29
|
+
* <Chip label="Design" onPress={() => {}} />
|
|
30
|
+
*
|
|
31
|
+
* // Filled chip
|
|
32
|
+
* <Chip label="TypeScript" variant="filled" onPress={() => {}} />
|
|
33
|
+
*
|
|
34
|
+
* // Filter chip — toggleable with checkmark
|
|
35
|
+
* <Chip label="Wireless" selected={on} onPress={() => setOn(v => !v)} />
|
|
36
|
+
*
|
|
37
|
+
* // Chip with trailing icon and separate icon press
|
|
38
|
+
* <Chip
|
|
39
|
+
* label="React Native"
|
|
40
|
+
* variant="filled"
|
|
41
|
+
* icon={{ name: 'x' }}
|
|
42
|
+
* onPress={() => {}}
|
|
43
|
+
* onIconPress={() => removeTag('React Native')}
|
|
44
|
+
* />
|
|
45
|
+
* ```
|
|
46
|
+
*/
|
|
47
|
+
export interface ChipProps extends InteractiveComponentProps {
|
|
48
|
+
/** Chip label text */
|
|
49
|
+
label: string;
|
|
50
|
+
/**
|
|
51
|
+
* Visual style variant.
|
|
52
|
+
* - `outlined`: Border, transparent background (default)
|
|
53
|
+
* - `filled`: Solid tonal background, no border
|
|
54
|
+
* @default 'outlined'
|
|
55
|
+
*/
|
|
56
|
+
variant?: ChipVariant;
|
|
57
|
+
/**
|
|
58
|
+
* Selected state — shows a leading checkmark and uses selectedBg color.
|
|
59
|
+
* Use for filter chip behaviour.
|
|
60
|
+
* @default false
|
|
61
|
+
*/
|
|
62
|
+
selected?: boolean;
|
|
63
|
+
/**
|
|
64
|
+
* Optional trailing icon rendered to the right of the label.
|
|
65
|
+
* Provide `onIconPress` to make it independently pressable.
|
|
66
|
+
*/
|
|
67
|
+
icon?: ChipIconConfig;
|
|
68
|
+
/**
|
|
69
|
+
* Called when the trailing icon is pressed independently.
|
|
70
|
+
* When provided, the icon becomes its own pressable target separate from `onPress`.
|
|
71
|
+
*/
|
|
72
|
+
onIconPress?: () => void;
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Material Design 3 Chip component
|
|
76
|
+
* https://m3.material.io/components/chips
|
|
77
|
+
*
|
|
78
|
+
* Height: 32dp visual / 48dp touch target via hitSlop
|
|
79
|
+
* Shape: CornerSmall (8dp border radius)
|
|
80
|
+
* Variants: filled, outlined
|
|
81
|
+
* Behavioural props: selected (filter checkmark), icon + onIconPress (trailing action)
|
|
82
|
+
*/
|
|
83
|
+
declare const Chip: {
|
|
84
|
+
({ label, variant, selected, disabled, icon, onPress, onIconPress, style, testID, accessibilityLabel, accessibilityHint, }: ChipProps): import("react/jsx-runtime").JSX.Element;
|
|
85
|
+
displayName: string;
|
|
86
|
+
};
|
|
87
|
+
export { Chip };
|
|
88
|
+
//# sourceMappingURL=chip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../components/ui/chip.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAKjE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,8CAA8C;IAC9C,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,kDAAkD;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;GAIG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,CAAC;AAChD,eAAO,MAAM,YAAY,iCAAkC,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,WAAW,SAAU,SAAQ,yBAAyB;IAC1D,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAGD;;;;;;;;GAQG;AACH,QAAA,MAAM,IAAI;gIAYP,SAAS;;CA4IX,CAAC;AA4BF,OAAO,EAAE,IAAI,EAAE,CAAC"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
// 1. IMPORTS
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { Platform, Pressable, StyleSheet, View, } from 'react-native';
|
|
5
|
+
import { Typography } from './typography';
|
|
6
|
+
import { useTheme } from '../../theme';
|
|
7
|
+
import { renderIcon } from '../../icons';
|
|
8
|
+
import { blurOnWeb } from '../shared/utils';
|
|
9
|
+
export const ChipVariants = ['filled', 'outlined'];
|
|
10
|
+
// 3. COMPONENT
|
|
11
|
+
/**
|
|
12
|
+
* Material Design 3 Chip component
|
|
13
|
+
* https://m3.material.io/components/chips
|
|
14
|
+
*
|
|
15
|
+
* Height: 32dp visual / 48dp touch target via hitSlop
|
|
16
|
+
* Shape: CornerSmall (8dp border radius)
|
|
17
|
+
* Variants: filled, outlined
|
|
18
|
+
* Behavioural props: selected (filter checkmark), icon + onIconPress (trailing action)
|
|
19
|
+
*/
|
|
20
|
+
const Chip = ({ label, variant = 'outlined', selected = false, disabled = false, icon, onPress, onIconPress, style, testID, accessibilityLabel, accessibilityHint, }) => {
|
|
21
|
+
const theme = useTheme();
|
|
22
|
+
const t = theme.tokens.chip;
|
|
23
|
+
const [hovered, setHovered] = useState(false);
|
|
24
|
+
const [focused, setFocused] = useState(false);
|
|
25
|
+
const getBg = () => {
|
|
26
|
+
if (disabled)
|
|
27
|
+
return variant === 'filled' ? t.disabledBg : 'transparent';
|
|
28
|
+
if (selected)
|
|
29
|
+
return t.selectedBg;
|
|
30
|
+
if (variant === 'filled')
|
|
31
|
+
return t.filledBg;
|
|
32
|
+
return 'transparent';
|
|
33
|
+
};
|
|
34
|
+
const getTextColor = () => {
|
|
35
|
+
if (disabled)
|
|
36
|
+
return t.disabledText;
|
|
37
|
+
if (selected)
|
|
38
|
+
return t.selectedText;
|
|
39
|
+
if (variant === 'filled')
|
|
40
|
+
return t.filledText;
|
|
41
|
+
return t.outlinedText;
|
|
42
|
+
};
|
|
43
|
+
const getBorderColor = () => {
|
|
44
|
+
if (variant === 'filled' || selected)
|
|
45
|
+
return undefined;
|
|
46
|
+
if (disabled)
|
|
47
|
+
return t.disabledBorder;
|
|
48
|
+
return t.outlinedBorder;
|
|
49
|
+
};
|
|
50
|
+
const textColor = getTextColor();
|
|
51
|
+
const borderColor = getBorderColor();
|
|
52
|
+
const bg = getBg();
|
|
53
|
+
const borderRadius = theme.borderRadius.sm; // M3 CornerSmall = 8dp
|
|
54
|
+
// Padding: 8dp on side with leading/trailing content, 12dp otherwise
|
|
55
|
+
const paddingLeft = selected ? 8 : 12;
|
|
56
|
+
const paddingRight = icon ? 8 : 12;
|
|
57
|
+
const getInnerStyle = () => {
|
|
58
|
+
const base = [
|
|
59
|
+
styles.chip,
|
|
60
|
+
{
|
|
61
|
+
backgroundColor: bg,
|
|
62
|
+
borderRadius,
|
|
63
|
+
paddingLeft,
|
|
64
|
+
paddingRight,
|
|
65
|
+
},
|
|
66
|
+
borderColor ? { borderWidth: 1, borderColor } : null,
|
|
67
|
+
disabled ? styles.disabled : null,
|
|
68
|
+
];
|
|
69
|
+
// Focus ring on the visual element
|
|
70
|
+
if (focused && Platform.OS === 'web') {
|
|
71
|
+
base.push({
|
|
72
|
+
outlineWidth: theme.tokens.focusRing.width,
|
|
73
|
+
outlineColor: theme.tokens.focusRing.color,
|
|
74
|
+
outlineStyle: 'solid',
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
if (Platform.OS === 'web' && !disabled) {
|
|
78
|
+
if (hovered) {
|
|
79
|
+
base.push({ opacity: 0.92 });
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
if (style) {
|
|
83
|
+
base.push(style);
|
|
84
|
+
}
|
|
85
|
+
return base;
|
|
86
|
+
};
|
|
87
|
+
const getPressableStyle = ({ pressed }) => {
|
|
88
|
+
const base = [styles.pressable];
|
|
89
|
+
if (Platform.OS === 'web' && pressed && !disabled) {
|
|
90
|
+
base.push({ opacity: 0.88 });
|
|
91
|
+
}
|
|
92
|
+
return base;
|
|
93
|
+
};
|
|
94
|
+
return (_jsx(Pressable, { testID: testID, onPress: disabled ? undefined : (e) => {
|
|
95
|
+
blurOnWeb(e);
|
|
96
|
+
onPress?.();
|
|
97
|
+
}, disabled: disabled, style: getPressableStyle, hitSlop: 8, onHoverIn: () => setHovered(true), onHoverOut: () => setHovered(false), onFocus: () => setFocused(true), onBlur: () => setFocused(false), accessibilityRole: "button", accessibilityLabel: accessibilityLabel ?? label, accessibilityHint: accessibilityHint, accessibilityState: { disabled, selected }, android_ripple: !disabled && Platform.OS === 'android'
|
|
98
|
+
? { color: theme.secondary + '40', borderless: false }
|
|
99
|
+
: undefined, children: _jsxs(View, { style: getInnerStyle(), children: [selected && (_jsx(View, { style: styles.iconWrapper, children: renderIcon({ name: 'check' }, 'Feather', 16, textColor) })), _jsx(Typography, { variant: "labelLarge", color: textColor, numberOfLines: 1, children: label }), icon && (onIconPress ? (_jsx(Pressable, { onPress: disabled ? undefined : (e) => {
|
|
100
|
+
blurOnWeb(e);
|
|
101
|
+
onIconPress?.();
|
|
102
|
+
}, style: styles.iconWrapper, accessibilityRole: "button", accessibilityLabel: `${label} action`, hitSlop: 4, children: renderIcon(icon, icon.library ?? 'Feather', icon.size ?? 18, icon.color ?? textColor) })) : (_jsx(View, { style: styles.iconWrapper, children: renderIcon(icon, icon.library ?? 'Feather', icon.size ?? 18, icon.color ?? textColor) })))] }) }));
|
|
103
|
+
};
|
|
104
|
+
Chip.displayName = 'Chip';
|
|
105
|
+
// 4. STYLES
|
|
106
|
+
const styles = StyleSheet.create({
|
|
107
|
+
// Transparent touch target — no background, extends via hitSlop
|
|
108
|
+
pressable: {
|
|
109
|
+
alignSelf: 'flex-start',
|
|
110
|
+
},
|
|
111
|
+
// Visual chip container — 32dp height, all visual styling lives here
|
|
112
|
+
chip: {
|
|
113
|
+
height: 32,
|
|
114
|
+
minWidth: 56,
|
|
115
|
+
flexDirection: 'row',
|
|
116
|
+
alignItems: 'center',
|
|
117
|
+
gap: 8,
|
|
118
|
+
},
|
|
119
|
+
iconWrapper: {
|
|
120
|
+
alignItems: 'center',
|
|
121
|
+
justifyContent: 'center',
|
|
122
|
+
},
|
|
123
|
+
disabled: {
|
|
124
|
+
opacity: 0.38,
|
|
125
|
+
},
|
|
126
|
+
});
|
|
127
|
+
// 5. EXPORTS
|
|
128
|
+
export { Chip };
|
|
129
|
+
//# sourceMappingURL=chip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../components/ui/chip.tsx"],"names":[],"mappings":"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"}
|