@ankhorage/surface 3.0.1 → 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/CHANGELOG.md +12 -0
- package/README.md +1 -1
- package/dist/internal/resolvePointerEvents.d.ts.map +1 -1
- package/dist/internal/resolvePointerEvents.js +20 -2
- package/dist/internal/resolvePointerEvents.js.map +1 -1
- package/dist/primitives/icon/PortableIcon.d.ts +6 -1
- package/dist/primitives/icon/PortableIcon.d.ts.map +1 -1
- package/dist/primitives/icon/PortableIcon.js +4 -0
- package/dist/primitives/icon/PortableIcon.js.map +1 -1
- package/dist/theme/types.d.ts.map +1 -1
- package/dist/theme/types.js.map +1 -1
- package/package.json +11 -10
- package/src/internal/resolvePointerEvents.ts +24 -2
- package/src/primitives/icon/PortableIcon.tsx +9 -1
- package/src/primitives/icon/PortableIcon.web.test.tsx +9 -0
- package/src/theme/types.ts +1 -11
- package/src/webAcceptance.test.tsx +12 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @ankhorage/surface
|
|
2
2
|
|
|
3
|
+
## 3.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 8e53b45: Add the canonical `MaterialDesignIcons` provider backed by the scoped React Native Vector Icons static package.
|
|
8
|
+
|
|
9
|
+
## 3.0.2
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- 6151096: Compile React Native Web box pointer-event modes through static styles so empty overlay roots no longer intercept application controls.
|
|
14
|
+
|
|
3
15
|
## 3.0.1
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
# @ankhorage/surface
|
|
5
5
|
|
|
6
|
-
         
|
|
7
7
|
|
|
8
8
|
Cross-platform UI foundation for React Native and React Native Web. Provides theming, layout primitives, and core building blocks for modern apps.
|
|
9
9
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolvePointerEvents.d.ts","sourceRoot":"","sources":["../../src/internal/resolvePointerEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,SAAS,
|
|
1
|
+
{"version":3,"file":"resolvePointerEvents.d.ts","sourceRoot":"","sources":["../../src/internal/resolvePointerEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAc,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpG,UAAU,qBAAqB;IAC7B,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;IACxC,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC7B;AASD,wBAAgB,oBAAoB,CAClC,aAAa,EAAE,WAAW,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,GACrD,qBAAqB,CAEvB;AAED,wBAAgB,+BAA+B,CAC7C,aAAa,EAAE,WAAW,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,EACtD,QAAQ,EAAE,OAAO,QAAQ,CAAC,EAAE,GAC3B,qBAAqB,CAYvB"}
|
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
import { Platform } from 'react-native';
|
|
1
|
+
import { Platform, StyleSheet } from 'react-native';
|
|
2
|
+
const webPointerEventStyles = StyleSheet.create({
|
|
3
|
+
auto: { pointerEvents: 'auto' },
|
|
4
|
+
'box-none': { pointerEvents: 'box-none' },
|
|
5
|
+
'box-only': { pointerEvents: 'box-only' },
|
|
6
|
+
none: { pointerEvents: 'none' },
|
|
7
|
+
});
|
|
2
8
|
export function resolvePointerEvents(pointerEvents) {
|
|
3
9
|
return resolvePointerEventsForPlatform(pointerEvents, Platform.OS);
|
|
4
10
|
}
|
|
@@ -6,7 +12,7 @@ export function resolvePointerEventsForPlatform(pointerEvents, platform) {
|
|
|
6
12
|
if (platform === 'web') {
|
|
7
13
|
return {
|
|
8
14
|
props: {},
|
|
9
|
-
style:
|
|
15
|
+
style: getWebPointerEventStyle(pointerEvents),
|
|
10
16
|
};
|
|
11
17
|
}
|
|
12
18
|
return {
|
|
@@ -14,4 +20,16 @@ export function resolvePointerEventsForPlatform(pointerEvents, platform) {
|
|
|
14
20
|
style: null,
|
|
15
21
|
};
|
|
16
22
|
}
|
|
23
|
+
function getWebPointerEventStyle(pointerEvents) {
|
|
24
|
+
switch (pointerEvents) {
|
|
25
|
+
case 'auto':
|
|
26
|
+
return webPointerEventStyles.auto;
|
|
27
|
+
case 'box-none':
|
|
28
|
+
return webPointerEventStyles['box-none'];
|
|
29
|
+
case 'box-only':
|
|
30
|
+
return webPointerEventStyles['box-only'];
|
|
31
|
+
case 'none':
|
|
32
|
+
return webPointerEventStyles.none;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
17
35
|
//# sourceMappingURL=resolvePointerEvents.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolvePointerEvents.js","sourceRoot":"","sources":["../../src/internal/resolvePointerEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"resolvePointerEvents.js","sourceRoot":"","sources":["../../src/internal/resolvePointerEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAkB,UAAU,EAAkC,MAAM,cAAc,CAAC;AAOpG,MAAM,qBAAqB,GAAG,UAAU,CAAC,MAAM,CAAC;IAC9C,IAAI,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE;IAC/B,UAAU,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE;IACzC,UAAU,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE;IACzC,IAAI,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE;CAChC,CAAC,CAAC;AAEH,MAAM,UAAU,oBAAoB,CAClC,aAAsD;IAEtD,OAAO,+BAA+B,CAAC,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;AACrE,CAAC;AAED,MAAM,UAAU,+BAA+B,CAC7C,aAAsD,EACtD,QAA4B;IAE5B,IAAI,QAAQ,KAAK,KAAK,EAAE,CAAC;QACvB,OAAO;YACL,KAAK,EAAE,EAAE;YACT,KAAK,EAAE,uBAAuB,CAAC,aAAa,CAAC;SAC9C,CAAC;IACJ,CAAC;IAED,OAAO;QACL,KAAK,EAAE,EAAE,aAAa,EAAE;QACxB,KAAK,EAAE,IAAI;KACZ,CAAC;AACJ,CAAC;AAED,SAAS,uBAAuB,CAC9B,aAAsD;IAEtD,QAAQ,aAAa,EAAE,CAAC;QACtB,KAAK,MAAM;YACT,OAAO,qBAAqB,CAAC,IAAI,CAAC;QACpC,KAAK,UAAU;YACb,OAAO,qBAAqB,CAAC,UAAU,CAAC,CAAC;QAC3C,KAAK,UAAU;YACb,OAAO,qBAAqB,CAAC,UAAU,CAAC,CAAC;QAC3C,KAAK,MAAM;YACT,OAAO,qBAAqB,CAAC,IAAI,CAAC;IACtC,CAAC;AACH,CAAC","sourcesContent":["import { Platform, type StyleProp, StyleSheet, type ViewProps, type ViewStyle } from 'react-native';\n\ninterface ResolvedPointerEvents {\n props: Pick<ViewProps, 'pointerEvents'>;\n style: StyleProp<ViewStyle>;\n}\n\nconst webPointerEventStyles = StyleSheet.create({\n auto: { pointerEvents: 'auto' },\n 'box-none': { pointerEvents: 'box-none' },\n 'box-only': { pointerEvents: 'box-only' },\n none: { pointerEvents: 'none' },\n});\n\nexport function resolvePointerEvents(\n pointerEvents: NonNullable<ViewProps['pointerEvents']>,\n): ResolvedPointerEvents {\n return resolvePointerEventsForPlatform(pointerEvents, Platform.OS);\n}\n\nexport function resolvePointerEventsForPlatform(\n pointerEvents: NonNullable<ViewProps['pointerEvents']>,\n platform: typeof Platform.OS,\n): ResolvedPointerEvents {\n if (platform === 'web') {\n return {\n props: {},\n style: getWebPointerEventStyle(pointerEvents),\n };\n }\n\n return {\n props: { pointerEvents },\n style: null,\n };\n}\n\nfunction getWebPointerEventStyle(\n pointerEvents: NonNullable<ViewProps['pointerEvents']>,\n): ViewStyle {\n switch (pointerEvents) {\n case 'auto':\n return webPointerEventStyles.auto;\n case 'box-none':\n return webPointerEventStyles['box-none'];\n case 'box-only':\n return webPointerEventStyles['box-only'];\n case 'none':\n return webPointerEventStyles.none;\n }\n}\n"]}
|
|
@@ -2,9 +2,10 @@ import { type FontAwesomeIconName } from '@react-native-vector-icons/fontawesome
|
|
|
2
2
|
import { type FontAwesome5BrandIconName, type FontAwesome5RegularIconName, type FontAwesome5SolidIconName } from '@react-native-vector-icons/fontawesome5/static';
|
|
3
3
|
import { type FontAwesome6BrandIconName, type FontAwesome6RegularIconName, type FontAwesome6SolidIconName } from '@react-native-vector-icons/fontawesome6/static';
|
|
4
4
|
import { type IoniconsIconName } from '@react-native-vector-icons/ionicons/static';
|
|
5
|
+
import { type MaterialDesignIconsIconName } from '@react-native-vector-icons/material-design-icons/static';
|
|
5
6
|
import React from 'react';
|
|
6
7
|
import { type StyleProp, type TextStyle } from 'react-native';
|
|
7
|
-
export declare const SUPPORTED_ICON_PROVIDERS: readonly ["Ionicons", "FontAwesome", "FontAwesome5", "FontAwesome6"];
|
|
8
|
+
export declare const SUPPORTED_ICON_PROVIDERS: readonly ["Ionicons", "FontAwesome", "FontAwesome5", "FontAwesome6", "MaterialDesignIcons"];
|
|
8
9
|
export type IconProvider = (typeof SUPPORTED_ICON_PROVIDERS)[number];
|
|
9
10
|
export type IconVariant = 'regular' | 'solid' | 'brand';
|
|
10
11
|
export type IconSource = {
|
|
@@ -39,6 +40,10 @@ export type IconSource = {
|
|
|
39
40
|
name: FontAwesome6BrandIconName;
|
|
40
41
|
provider: 'FontAwesome6';
|
|
41
42
|
variant: 'brand';
|
|
43
|
+
} | {
|
|
44
|
+
name: MaterialDesignIconsIconName;
|
|
45
|
+
provider: 'MaterialDesignIcons';
|
|
46
|
+
variant?: never;
|
|
42
47
|
};
|
|
43
48
|
type PortableIconProps = IconSource & {
|
|
44
49
|
color: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PortableIcon.d.ts","sourceRoot":"","sources":["../../../src/primitives/icon/PortableIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,+CAA+C,CAAC;AACvD,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,2BAA2B,EAChC,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,2BAA2B,EAChC,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAAY,KAAK,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9D,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"PortableIcon.d.ts","sourceRoot":"","sources":["../../../src/primitives/icon/PortableIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,+CAA+C,CAAC;AACvD,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,2BAA2B,EAChC,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,2BAA2B,EAChC,KAAK,yBAAyB,EAC/B,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAAY,KAAK,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC7F,OAAO,EAEL,KAAK,2BAA2B,EACjC,MAAM,yDAAyD,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9D,eAAO,MAAM,wBAAwB,6FAM3B,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,wBAAwB,CAAC,CAAC,MAAM,CAAC,CAAC;AACrE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAExD,MAAM,MAAM,UAAU,GAClB;IAAE,IAAI,EAAE,gBAAgB,CAAC;IAAC,QAAQ,CAAC,EAAE,UAAU,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,GAClE;IAAE,IAAI,EAAE,mBAAmB,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,GACvE;IAAE,IAAI,EAAE,2BAA2B,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,SAAS,CAAA;CAAE,GACnF;IAAE,IAAI,EAAE,yBAAyB,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,GAC/E;IAAE,IAAI,EAAE,yBAAyB,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,GAC/E;IAAE,IAAI,EAAE,2BAA2B,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,SAAS,CAAA;CAAE,GACnF;IAAE,IAAI,EAAE,yBAAyB,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,GAC/E;IAAE,IAAI,EAAE,yBAAyB,CAAC;IAAC,QAAQ,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,GAC/E;IAAE,IAAI,EAAE,2BAA2B,CAAC;IAAC,QAAQ,EAAE,qBAAqB,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAE5F,KAAK,iBAAiB,GAAG,UAAU,GAAG;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA4CF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBAwBpD"}
|
|
@@ -2,6 +2,7 @@ import { FontAwesome, } from '@react-native-vector-icons/fontawesome/static';
|
|
|
2
2
|
import { FontAwesome5, } from '@react-native-vector-icons/fontawesome5/static';
|
|
3
3
|
import { FontAwesome6, } from '@react-native-vector-icons/fontawesome6/static';
|
|
4
4
|
import { Ionicons } from '@react-native-vector-icons/ionicons/static';
|
|
5
|
+
import { MaterialDesignIcons, } from '@react-native-vector-icons/material-design-icons/static';
|
|
5
6
|
import React from 'react';
|
|
6
7
|
import {} from 'react-native';
|
|
7
8
|
export const SUPPORTED_ICON_PROVIDERS = [
|
|
@@ -9,6 +10,7 @@ export const SUPPORTED_ICON_PROVIDERS = [
|
|
|
9
10
|
'FontAwesome',
|
|
10
11
|
'FontAwesome5',
|
|
11
12
|
'FontAwesome6',
|
|
13
|
+
'MaterialDesignIcons',
|
|
12
14
|
];
|
|
13
15
|
function assertNever(value, configuration) {
|
|
14
16
|
throw new Error(`Unsupported icon ${configuration}: ${String(value)}`);
|
|
@@ -57,6 +59,8 @@ export function PortableIcon(props) {
|
|
|
57
59
|
return renderFontAwesome5(props, sharedProps);
|
|
58
60
|
case 'FontAwesome6':
|
|
59
61
|
return renderFontAwesome6(props, sharedProps);
|
|
62
|
+
case 'MaterialDesignIcons':
|
|
63
|
+
return <MaterialDesignIcons {...sharedProps} name={props.name}/>;
|
|
60
64
|
default:
|
|
61
65
|
return assertNever(provider, 'provider');
|
|
62
66
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PortableIcon.js","sourceRoot":"","sources":["../../../src/primitives/icon/PortableIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,GAEZ,MAAM,+CAA+C,CAAC;AACvD,OAAO,EACL,YAAY,GAIb,MAAM,gDAAgD,CAAC;AACxD,OAAO,EACL,YAAY,GAIb,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAyB,MAAM,4CAA4C,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkC,MAAM,cAAc,CAAC;AAE9D,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,UAAU;IACV,aAAa;IACb,cAAc;IACd,cAAc;
|
|
1
|
+
{"version":3,"file":"PortableIcon.js","sourceRoot":"","sources":["../../../src/primitives/icon/PortableIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FontAwesome,\n type FontAwesomeIconName,\n} from '@react-native-vector-icons/fontawesome/static';\nimport {\n FontAwesome5,\n type FontAwesome5BrandIconName,\n type FontAwesome5RegularIconName,\n type FontAwesome5SolidIconName,\n} from '@react-native-vector-icons/fontawesome5/static';\nimport {\n FontAwesome6,\n type FontAwesome6BrandIconName,\n type FontAwesome6RegularIconName,\n type FontAwesome6SolidIconName,\n} from '@react-native-vector-icons/fontawesome6/static';\nimport { Ionicons, type IoniconsIconName } from '@react-native-vector-icons/ionicons/static';\nimport {\n MaterialDesignIcons,\n type MaterialDesignIconsIconName,\n} from '@react-native-vector-icons/material-design-icons/static';\nimport React from 'react';\nimport { type StyleProp, type TextStyle } from 'react-native';\n\nexport const SUPPORTED_ICON_PROVIDERS = [\n 'Ionicons',\n 'FontAwesome',\n 'FontAwesome5',\n 'FontAwesome6',\n 'MaterialDesignIcons',\n] as const;\n\nexport type IconProvider = (typeof SUPPORTED_ICON_PROVIDERS)[number];\nexport type IconVariant = 'regular' | 'solid' | 'brand';\n\nexport type IconSource =\n | { name: IoniconsIconName; provider?: 'Ionicons'; variant?: never }\n | { name: FontAwesomeIconName; provider: 'FontAwesome'; variant?: never }\n | { name: FontAwesome5RegularIconName; provider: 'FontAwesome5'; variant: 'regular' }\n | { name: FontAwesome5SolidIconName; provider: 'FontAwesome5'; variant: 'solid' }\n | { name: FontAwesome5BrandIconName; provider: 'FontAwesome5'; variant: 'brand' }\n | { name: FontAwesome6RegularIconName; provider: 'FontAwesome6'; variant: 'regular' }\n | { name: FontAwesome6SolidIconName; provider: 'FontAwesome6'; variant: 'solid' }\n | { name: FontAwesome6BrandIconName; provider: 'FontAwesome6'; variant: 'brand' }\n | { name: MaterialDesignIconsIconName; provider: 'MaterialDesignIcons'; variant?: never };\n\ntype PortableIconProps = IconSource & {\n color: string;\n size: number;\n style?: StyleProp<TextStyle>;\n testID?: string;\n};\n\ntype SharedIconProps = Pick<PortableIconProps, 'color' | 'size' | 'style' | 'testID'>;\n\nfunction assertNever(value: never, configuration: string): never {\n throw new Error(`Unsupported icon ${configuration}: ${String(value)}`);\n}\n\nfunction renderFontAwesome5(\n props: Extract<IconSource, { provider: 'FontAwesome5' }>,\n sharedProps: SharedIconProps,\n) {\n const { variant } = props;\n\n switch (variant) {\n case 'brand':\n return <FontAwesome5 {...sharedProps} iconStyle=\"brand\" name={props.name} />;\n case 'regular':\n return <FontAwesome5 {...sharedProps} iconStyle=\"regular\" name={props.name} />;\n case 'solid':\n return <FontAwesome5 {...sharedProps} iconStyle=\"solid\" name={props.name} />;\n default:\n return assertNever(variant, 'FontAwesome5 variant');\n }\n}\n\nfunction renderFontAwesome6(\n props: Extract<IconSource, { provider: 'FontAwesome6' }>,\n sharedProps: SharedIconProps,\n) {\n const { variant } = props;\n\n switch (variant) {\n case 'brand':\n return <FontAwesome6 {...sharedProps} iconStyle=\"brand\" name={props.name} />;\n case 'regular':\n return <FontAwesome6 {...sharedProps} iconStyle=\"regular\" name={props.name} />;\n case 'solid':\n return <FontAwesome6 {...sharedProps} iconStyle=\"solid\" name={props.name} />;\n default:\n return assertNever(variant, 'FontAwesome6 variant');\n }\n}\n\nexport function PortableIcon(props: PortableIconProps) {\n const { provider } = props;\n const sharedProps = {\n color: props.color,\n size: props.size,\n style: props.style,\n testID: props.testID,\n };\n\n switch (provider) {\n case undefined:\n case 'Ionicons':\n return <Ionicons {...sharedProps} name={props.name} />;\n case 'FontAwesome':\n return <FontAwesome {...sharedProps} name={props.name} />;\n case 'FontAwesome5':\n return renderFontAwesome5(props, sharedProps);\n case 'FontAwesome6':\n return renderFontAwesome6(props, sharedProps);\n case 'MaterialDesignIcons':\n return <MaterialDesignIcons {...sharedProps} name={props.name} />;\n default:\n return assertNever(provider, 'provider');\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,KAAK,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,YAAY,EACV,YAAY,EACZ,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,wBAAwB,EACxB,sBAAsB,EACtB,QAAQ,EACR,yBAAyB,EACzB,kBAAkB,GACnB,MAAM,yBAAyB,CAAC;AACjC,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEzE,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,EAAE,aAAa,CAAC;IACvB,MAAM,EAAE,aAAa,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,EAAE,aAAa,CAAC;IACvB,KAAK,EAAE,aAAa,CAAC;IACrB,IAAI,EAAE,aAAa,CAAC;IACpB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,MAAM,EAAE,eAAe,CAAC;IACxB,MAAM,EAAE,eAAe,CAAC;CACzB;AAED,MAAM,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,KAAK,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,YAAY,EACV,YAAY,EACZ,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,wBAAwB,EACxB,sBAAsB,EACtB,QAAQ,EACR,yBAAyB,EACzB,kBAAkB,GACnB,MAAM,yBAAyB,CAAC;AACjC,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEzE,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,EAAE,aAAa,CAAC;IACvB,MAAM,EAAE,aAAa,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,EAAE,aAAa,CAAC;IACvB,KAAK,EAAE,aAAa,CAAC;IACrB,IAAI,EAAE,aAAa,CAAC;IACpB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,MAAM,EAAE,eAAe,CAAC;IACxB,MAAM,EAAE,eAAe,CAAC;CACzB;AAED,MAAM,MAAM,UAAU,GACpB,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE5F,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE;QACN,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;QACnB,OAAO,EAAE,MAAM,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,aAAa,EAAE,MAAM,CAAC;QACtB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,QAAQ,EAAE,sBAAsB,CAAC;IACjC,SAAS,EAAE,cAAc,CAAC;IAC1B,OAAO,EAAE;QACP,IAAI,EAAE,CAAC,CAAC;QACR,EAAE,EAAE,MAAM,CAAC;QACX,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,EAAE,EAAE,MAAM,CAAC;QACX,GAAG,EAAE,MAAM,CAAC;QACZ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,KAAK,EAAE;QACL,IAAI,EAAE,CAAC,CAAC;QACR,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,IAAI,EAAE,MAAM,CAAC;QACb,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,UAAU,EAAE;QACV,QAAQ,EAAE,MAAM,CACd,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,EACrB;YACE,IAAI,EAAE,MAAM,CAAC;YACb,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;SACpD,CACF,CAAC;QACF,KAAK,EAAE;YACL,EAAE,EAAE,MAAM,CAAC;YACX,CAAC,EAAE,MAAM,CAAC;YACV,CAAC,EAAE,MAAM,CAAC;YACV,CAAC,EAAE,MAAM,CAAC;YACV,EAAE,EAAE,MAAM,CAAC;YACX,GAAG,EAAE,MAAM,CAAC;YACZ,KAAK,EAAE,MAAM,CAAC;YACd,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,EAAE,EAAE,MAAM,CAAC;YACX,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;SACvB,CAAC;QACF,OAAO,EAAE;YACP,IAAI,EAAE,UAAU,CAAC;YACjB,UAAU,EAAE,UAAU,CAAC;YACvB,KAAK,EAAE,UAAU,CAAC;YAClB,OAAO,EAAE,UAAU,CAAC;YACpB,MAAM,EAAE,UAAU,CAAC;YACnB,QAAQ,EAAE,UAAU,CAAC;YACrB,IAAI,EAAE,UAAU,CAAC;YACjB,SAAS,EAAE,UAAU,CAAC;YACtB,KAAK,EAAE,UAAU,CAAC;SACnB,CAAC;QACF,KAAK,EAAE;YACL,wDAAwD;YACxD,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;YAC/C,wDAAwD;YACxD,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;SAChD,CAAC;KACH,CAAC;IACF,OAAO,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;CACH;AAED,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,MAAM,EAAE,oBAAoB,CAAC;CAC9B"}
|
package/dist/theme/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { GeneratedThemeSwatches } from '@ankhorage/color-theory';\nimport type { ThemeConfig as ContractsThemeConfig } from '@ankhorage/contracts';\n\nexport type {\n ColorHarmony,\n ColorSwatch,\n ColorSwatchStep,\n GeneratedColorRole,\n GeneratedThemeModeColors,\n GeneratedThemeSwatches,\n HexColor,\n SemanticColorReferenceMap,\n SemanticColorToken,\n} from '@ankhorage/color-theory';\nexport type { ThemeConfig, ThemeModeConfig } from '@ankhorage/contracts';\n\nexport interface NeutralSemantics {\n bg: string;\n bgSubtle: string;\n surface: string;\n surfaceHover: string;\n surfaceActive: string;\n border: string;\n borderStrong: string;\n divider: string;\n text: string;\n textMuted: string;\n textSubtle: string;\n}\n\nexport interface RoleSemantics {\n base: string;\n hover: string;\n strong: string;\n softBg: string;\n softHover: string;\n softActive: string;\n outline: string;\n onSolidText: string;\n}\n\nexport interface SurfaceSemantics {\n default: string;\n subtle: string;\n raised: string;\n inverse: string;\n}\n\nexport interface ContentSemantics {\n default: string;\n muted: string;\n subtle: string;\n inverse: string;\n}\n\nexport interface BorderSemantics {\n default: string;\n strong: string;\n focus: string;\n}\n\nexport interface ActionSemantics {\n primary: RoleSemantics;\n neutral: RoleSemantics;\n danger: RoleSemantics;\n}\n\nexport interface ThemeSemantics {\n neutral: NeutralSemantics;\n brand: RoleSemantics;\n secondary: RoleSemantics;\n accent: RoleSemantics;\n highlight: RoleSemantics;\n danger: RoleSemantics;\n success: RoleSemantics;\n warning: RoleSemantics;\n error: RoleSemantics;\n info: RoleSemantics;\n surface: SurfaceSemantics;\n content: ContentSemantics;\n border: BorderSemantics;\n action: ActionSemantics;\n}\n\nexport type FontWeight =\n
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { GeneratedThemeSwatches } from '@ankhorage/color-theory';\nimport type { ThemeConfig as ContractsThemeConfig } from '@ankhorage/contracts';\n\nexport type {\n ColorHarmony,\n ColorSwatch,\n ColorSwatchStep,\n GeneratedColorRole,\n GeneratedThemeModeColors,\n GeneratedThemeSwatches,\n HexColor,\n SemanticColorReferenceMap,\n SemanticColorToken,\n} from '@ankhorage/color-theory';\nexport type { ThemeConfig, ThemeModeConfig } from '@ankhorage/contracts';\n\nexport interface NeutralSemantics {\n bg: string;\n bgSubtle: string;\n surface: string;\n surfaceHover: string;\n surfaceActive: string;\n border: string;\n borderStrong: string;\n divider: string;\n text: string;\n textMuted: string;\n textSubtle: string;\n}\n\nexport interface RoleSemantics {\n base: string;\n hover: string;\n strong: string;\n softBg: string;\n softHover: string;\n softActive: string;\n outline: string;\n onSolidText: string;\n}\n\nexport interface SurfaceSemantics {\n default: string;\n subtle: string;\n raised: string;\n inverse: string;\n}\n\nexport interface ContentSemantics {\n default: string;\n muted: string;\n subtle: string;\n inverse: string;\n}\n\nexport interface BorderSemantics {\n default: string;\n strong: string;\n focus: string;\n}\n\nexport interface ActionSemantics {\n primary: RoleSemantics;\n neutral: RoleSemantics;\n danger: RoleSemantics;\n}\n\nexport interface ThemeSemantics {\n neutral: NeutralSemantics;\n brand: RoleSemantics;\n secondary: RoleSemantics;\n accent: RoleSemantics;\n highlight: RoleSemantics;\n danger: RoleSemantics;\n success: RoleSemantics;\n warning: RoleSemantics;\n error: RoleSemantics;\n info: RoleSemantics;\n surface: SurfaceSemantics;\n content: ContentSemantics;\n border: BorderSemantics;\n action: ActionSemantics;\n}\n\nexport type FontWeight =\n '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | 'bold' | 'normal';\n\nexport interface ThemeTokens {\n colors: {\n primary: string;\n secondary: string;\n accent: string;\n highlight: string;\n tertiary: string;\n quaternary: string;\n background: string;\n surface: string;\n text: string;\n textSecondary: string;\n border: string;\n error: string;\n success: string;\n warning: string;\n info: string;\n [key: string]: string;\n };\n swatches: GeneratedThemeSwatches;\n semantics: ThemeSemantics;\n spacing: {\n none: 0;\n xs: number;\n s: number;\n m: number;\n l: number;\n xl: number;\n xxl: number;\n [key: string]: number;\n };\n radii: {\n none: 0;\n s: number;\n m: number;\n l: number;\n full: number;\n [key: string]: number;\n };\n typography: {\n headings: Record<\n 1 | 2 | 3 | 4 | 5 | 6,\n {\n size: number;\n lineHeight: number;\n weight: 'regular' | 'medium' | 'semiBold' | 'bold';\n }\n >;\n sizes: {\n xs: number;\n s: number;\n m: number;\n l: number;\n xl: number;\n xxl: number;\n '3xl': number;\n h1: number;\n h2: number;\n h3: number;\n h4: number;\n h5: number;\n h6: number;\n [key: string]: number;\n };\n weights: {\n thin: FontWeight;\n extraLight: FontWeight;\n light: FontWeight;\n regular: FontWeight;\n medium: FontWeight;\n semiBold: FontWeight;\n bold: FontWeight;\n extraBold: FontWeight;\n black: FontWeight;\n };\n fonts: {\n /** Map of weight -> fontFamily name for normal style */\n normal: Record<FontWeight, string | undefined>;\n /** Map of weight -> fontFamily name for italic style */\n italic: Record<FontWeight, string | undefined>;\n };\n };\n shadows: {\n soft: number;\n medium: number;\n hard: number;\n [key: string]: number;\n };\n}\n\nexport interface SurfaceTheme extends ThemeTokens {\n config: ContractsThemeConfig;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ankhorage/surface",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "3.0
|
|
4
|
+
"version": "3.1.0",
|
|
5
5
|
"description": "Stable UI foundation for React Native and React Native Web.",
|
|
6
6
|
"homepage": "https://github.com/ankhorage/surface#readme",
|
|
7
7
|
"bugs": {
|
|
@@ -31,6 +31,7 @@
|
|
|
31
31
|
"@react-native-vector-icons/fontawesome5": "^13.1.3",
|
|
32
32
|
"@react-native-vector-icons/fontawesome6": "^13.1.3",
|
|
33
33
|
"@react-native-vector-icons/ionicons": "^13.1.3",
|
|
34
|
+
"@react-native-vector-icons/material-design-icons": "^13.1.3",
|
|
34
35
|
"react": "19.2.3",
|
|
35
36
|
"react-native": "0.86.x",
|
|
36
37
|
"react-native-safe-area-context": "~5.7.0",
|
|
@@ -62,10 +63,10 @@
|
|
|
62
63
|
},
|
|
63
64
|
"scripts": {
|
|
64
65
|
"build": "rm -rf dist tsconfig.tsbuildinfo tsconfig.build.tsbuildinfo && bun x tsc -p tsconfig.build.json",
|
|
65
|
-
"changeset": "changeset",
|
|
66
|
-
"changeset:status": "changeset status --since=origin/main",
|
|
66
|
+
"changeset": "ankhorage-changeset",
|
|
67
|
+
"changeset:status": "ankhorage-changeset status --since=origin/main",
|
|
67
68
|
"docs": "paradox && ankhorage-prettier --write README.md paradox",
|
|
68
|
-
"knip": "ankhorage-knip",
|
|
69
|
+
"knip:check": "ankhorage-knip",
|
|
69
70
|
"lint": "ankhorage-eslint . --max-warnings=0",
|
|
70
71
|
"lint:fix": "ankhorage-eslint . --fix --max-warnings=0",
|
|
71
72
|
"format": "ankhorage-prettier --write .",
|
|
@@ -73,17 +74,17 @@
|
|
|
73
74
|
"prepack": "bun run build",
|
|
74
75
|
"test": "bun test src",
|
|
75
76
|
"typecheck": "bun x tsc --noEmit -p tsconfig.json",
|
|
76
|
-
"version-packages": "changeset version"
|
|
77
|
+
"version-packages": "ankhorage-changeset version"
|
|
77
78
|
},
|
|
78
79
|
"devDependencies": {
|
|
79
|
-
"@ankhorage/devtools": "^1.
|
|
80
|
-
"@ankhorage/paradox": "^0.1.
|
|
80
|
+
"@ankhorage/devtools": "^1.8.2",
|
|
81
|
+
"@ankhorage/paradox": "^0.1.24",
|
|
81
82
|
"@react-native-vector-icons/fontawesome": "^13.1.3",
|
|
82
83
|
"@react-native-vector-icons/fontawesome5": "^13.1.3",
|
|
83
84
|
"@react-native-vector-icons/fontawesome6": "^13.1.3",
|
|
84
85
|
"@react-native-vector-icons/ionicons": "^13.1.3",
|
|
85
|
-
"@
|
|
86
|
-
"@types/bun": "^1.
|
|
86
|
+
"@react-native-vector-icons/material-design-icons": "^13.1.3",
|
|
87
|
+
"@types/bun": "^1.4.0",
|
|
87
88
|
"@types/node": "^24.13.3",
|
|
88
89
|
"@types/react": "^19.2.18",
|
|
89
90
|
"@types/react-dom": "^19.2.4",
|
|
@@ -96,5 +97,5 @@
|
|
|
96
97
|
"react-native-web": "~0.21.0",
|
|
97
98
|
"typescript": "~6.0.3"
|
|
98
99
|
},
|
|
99
|
-
"packageManager": "bun@1.
|
|
100
|
+
"packageManager": "bun@1.4.0"
|
|
100
101
|
}
|
|
@@ -1,10 +1,17 @@
|
|
|
1
|
-
import { Platform, type StyleProp, type ViewProps, type ViewStyle } from 'react-native';
|
|
1
|
+
import { Platform, type StyleProp, StyleSheet, type ViewProps, type ViewStyle } from 'react-native';
|
|
2
2
|
|
|
3
3
|
interface ResolvedPointerEvents {
|
|
4
4
|
props: Pick<ViewProps, 'pointerEvents'>;
|
|
5
5
|
style: StyleProp<ViewStyle>;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
+
const webPointerEventStyles = StyleSheet.create({
|
|
9
|
+
auto: { pointerEvents: 'auto' },
|
|
10
|
+
'box-none': { pointerEvents: 'box-none' },
|
|
11
|
+
'box-only': { pointerEvents: 'box-only' },
|
|
12
|
+
none: { pointerEvents: 'none' },
|
|
13
|
+
});
|
|
14
|
+
|
|
8
15
|
export function resolvePointerEvents(
|
|
9
16
|
pointerEvents: NonNullable<ViewProps['pointerEvents']>,
|
|
10
17
|
): ResolvedPointerEvents {
|
|
@@ -18,7 +25,7 @@ export function resolvePointerEventsForPlatform(
|
|
|
18
25
|
if (platform === 'web') {
|
|
19
26
|
return {
|
|
20
27
|
props: {},
|
|
21
|
-
style:
|
|
28
|
+
style: getWebPointerEventStyle(pointerEvents),
|
|
22
29
|
};
|
|
23
30
|
}
|
|
24
31
|
|
|
@@ -27,3 +34,18 @@ export function resolvePointerEventsForPlatform(
|
|
|
27
34
|
style: null,
|
|
28
35
|
};
|
|
29
36
|
}
|
|
37
|
+
|
|
38
|
+
function getWebPointerEventStyle(
|
|
39
|
+
pointerEvents: NonNullable<ViewProps['pointerEvents']>,
|
|
40
|
+
): ViewStyle {
|
|
41
|
+
switch (pointerEvents) {
|
|
42
|
+
case 'auto':
|
|
43
|
+
return webPointerEventStyles.auto;
|
|
44
|
+
case 'box-none':
|
|
45
|
+
return webPointerEventStyles['box-none'];
|
|
46
|
+
case 'box-only':
|
|
47
|
+
return webPointerEventStyles['box-only'];
|
|
48
|
+
case 'none':
|
|
49
|
+
return webPointerEventStyles.none;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
@@ -15,6 +15,10 @@ import {
|
|
|
15
15
|
type FontAwesome6SolidIconName,
|
|
16
16
|
} from '@react-native-vector-icons/fontawesome6/static';
|
|
17
17
|
import { Ionicons, type IoniconsIconName } from '@react-native-vector-icons/ionicons/static';
|
|
18
|
+
import {
|
|
19
|
+
MaterialDesignIcons,
|
|
20
|
+
type MaterialDesignIconsIconName,
|
|
21
|
+
} from '@react-native-vector-icons/material-design-icons/static';
|
|
18
22
|
import React from 'react';
|
|
19
23
|
import { type StyleProp, type TextStyle } from 'react-native';
|
|
20
24
|
|
|
@@ -23,6 +27,7 @@ export const SUPPORTED_ICON_PROVIDERS = [
|
|
|
23
27
|
'FontAwesome',
|
|
24
28
|
'FontAwesome5',
|
|
25
29
|
'FontAwesome6',
|
|
30
|
+
'MaterialDesignIcons',
|
|
26
31
|
] as const;
|
|
27
32
|
|
|
28
33
|
export type IconProvider = (typeof SUPPORTED_ICON_PROVIDERS)[number];
|
|
@@ -36,7 +41,8 @@ export type IconSource =
|
|
|
36
41
|
| { name: FontAwesome5BrandIconName; provider: 'FontAwesome5'; variant: 'brand' }
|
|
37
42
|
| { name: FontAwesome6RegularIconName; provider: 'FontAwesome6'; variant: 'regular' }
|
|
38
43
|
| { name: FontAwesome6SolidIconName; provider: 'FontAwesome6'; variant: 'solid' }
|
|
39
|
-
| { name: FontAwesome6BrandIconName; provider: 'FontAwesome6'; variant: 'brand' }
|
|
44
|
+
| { name: FontAwesome6BrandIconName; provider: 'FontAwesome6'; variant: 'brand' }
|
|
45
|
+
| { name: MaterialDesignIconsIconName; provider: 'MaterialDesignIcons'; variant?: never };
|
|
40
46
|
|
|
41
47
|
type PortableIconProps = IconSource & {
|
|
42
48
|
color: string;
|
|
@@ -106,6 +112,8 @@ export function PortableIcon(props: PortableIconProps) {
|
|
|
106
112
|
return renderFontAwesome5(props, sharedProps);
|
|
107
113
|
case 'FontAwesome6':
|
|
108
114
|
return renderFontAwesome6(props, sharedProps);
|
|
115
|
+
case 'MaterialDesignIcons':
|
|
116
|
+
return <MaterialDesignIcons {...sharedProps} name={props.name} />;
|
|
109
117
|
default:
|
|
110
118
|
return assertNever(provider, 'provider');
|
|
111
119
|
}
|
|
@@ -48,6 +48,14 @@ describe('portable icon rendering', () => {
|
|
|
48
48
|
|
|
49
49
|
expect(markup).toContain('font-family:FontAwesome6Brands-Regular');
|
|
50
50
|
});
|
|
51
|
+
|
|
52
|
+
test('renders Material Design Icons through the public Icon API', () => {
|
|
53
|
+
const markup = renderToStaticMarkup(
|
|
54
|
+
<Icon color="#123456" name="bookshelf" provider="MaterialDesignIcons" size={18} />,
|
|
55
|
+
);
|
|
56
|
+
|
|
57
|
+
expect(markup).toContain('font-family:MaterialDesignIcons');
|
|
58
|
+
});
|
|
51
59
|
});
|
|
52
60
|
|
|
53
61
|
describe('portable icon contract', () => {
|
|
@@ -57,6 +65,7 @@ describe('portable icon contract', () => {
|
|
|
57
65
|
'FontAwesome',
|
|
58
66
|
'FontAwesome5',
|
|
59
67
|
'FontAwesome6',
|
|
68
|
+
'MaterialDesignIcons',
|
|
60
69
|
]);
|
|
61
70
|
});
|
|
62
71
|
});
|
package/src/theme/types.ts
CHANGED
|
@@ -83,17 +83,7 @@ export interface ThemeSemantics {
|
|
|
83
83
|
}
|
|
84
84
|
|
|
85
85
|
export type FontWeight =
|
|
86
|
-
| '
|
|
87
|
-
| '200'
|
|
88
|
-
| '300'
|
|
89
|
-
| '400'
|
|
90
|
-
| '500'
|
|
91
|
-
| '600'
|
|
92
|
-
| '700'
|
|
93
|
-
| '800'
|
|
94
|
-
| '900'
|
|
95
|
-
| 'bold'
|
|
96
|
-
| 'normal';
|
|
86
|
+
'100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | 'bold' | 'normal';
|
|
97
87
|
|
|
98
88
|
export interface ThemeTokens {
|
|
99
89
|
colors: {
|
|
@@ -12,6 +12,7 @@ const { Container } = await import('./layout/Container');
|
|
|
12
12
|
const { Grid } = await import('./layout/Grid');
|
|
13
13
|
const { ScrollArea } = await import('./layout/ScrollArea');
|
|
14
14
|
const { Show } = await import('./layout/Show');
|
|
15
|
+
const { OverlayProvider } = await import('./internal/overlay/OverlayProvider');
|
|
15
16
|
const { ThemeProvider } = await import('./theme/ThemeContext');
|
|
16
17
|
|
|
17
18
|
function ResponsiveAcceptanceTree() {
|
|
@@ -82,3 +83,14 @@ test('RN Web 0.21 statically renders and hydrates representative responsive prim
|
|
|
82
83
|
Reflect.deleteProperty(globalThis, 'window');
|
|
83
84
|
}
|
|
84
85
|
});
|
|
86
|
+
|
|
87
|
+
test('RN Web 0.21 compiles box-none overlay pointer events into a hit-test-safe class', () => {
|
|
88
|
+
const markup = renderToString(
|
|
89
|
+
<OverlayProvider>
|
|
90
|
+
<ReactNativeWeb.View testID="interactive-content" />
|
|
91
|
+
</OverlayProvider>,
|
|
92
|
+
);
|
|
93
|
+
|
|
94
|
+
expect(markup).toContain('data-testid="interactive-content"');
|
|
95
|
+
expect(markup).toContain('r-pointerEvents-');
|
|
96
|
+
});
|