@symbiote-native/vue 0.5.0 → 2.0.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/README.md +28 -13
- package/babel-jsx.cjs +52 -0
- package/build/components/activity-indicator-props.d.ts +5 -0
- package/build/components/activity-indicator-props.js +1 -0
- package/build/components/button-props.d.ts +5 -0
- package/build/components/button-props.js +1 -0
- package/build/components/flat-list/index.d.ts +3 -3
- package/build/components/flat-list/index.js +2 -2
- package/build/components/image-background-props.d.ts +7 -0
- package/build/components/image-background-props.js +1 -0
- package/build/components/image-props.d.ts +5 -0
- package/build/components/image-props.js +5 -0
- package/build/components/{input-accessory-view.d.ts → input-accessory-view-props.d.ts} +1 -3
- package/build/components/input-accessory-view-props.js +5 -0
- package/build/components/keyboard-avoiding-view.js +3 -3
- package/build/components/modal/index.js +1 -1
- package/build/components/pressable-props.d.ts +29 -0
- package/build/components/pressable-props.js +12 -0
- package/build/components/refresh-control-props.d.ts +16 -0
- package/build/components/refresh-control-props.js +9 -0
- package/build/components/safe-area-view-props.d.ts +6 -0
- package/build/components/safe-area-view-props.js +5 -0
- package/build/components/scroll-view/{shared.d.ts → scroll-view-props.d.ts} +4 -27
- package/build/components/scroll-view/scroll-view-props.js +1 -0
- package/build/components/section-list/index.d.ts +3 -3
- package/build/components/switch/switch-props.d.ts +6 -0
- package/build/components/switch/switch-props.js +1 -0
- package/build/components/text-input/text-input-props.d.ts +5 -0
- package/build/components/text-input/text-input-props.js +1 -0
- package/build/components/text-props.d.ts +24 -0
- package/build/components/text-props.js +6 -0
- package/build/components/touchable-native-feedback-props.d.ts +6 -0
- package/build/components/touchable-native-feedback-props.js +1 -0
- package/build/components/touchable-props.d.ts +15 -0
- package/build/components/touchable-props.js +1 -0
- package/build/components/touchable-without-feedback-props.d.ts +3 -0
- package/build/components/touchable-without-feedback-props.js +1 -0
- package/build/components/view-props.d.ts +29 -0
- package/build/components/view-props.js +5 -0
- package/build/components/virtualized-list/index.d.ts +3 -3
- package/build/components/virtualized-list/index.js +42 -37
- package/build/components/virtualized-section-list/index.d.ts +3 -3
- package/build/composables/use-raw-attrs.d.ts +1 -0
- package/build/composables/use-raw-attrs.js +26 -0
- package/build/descriptor-to-vue.js +2 -2
- package/build/host-instance/index.js +4 -5
- package/build/index.d.ts +25 -27
- package/build/index.js +35 -15
- package/build/intrinsic-elements.d.ts +19 -0
- package/build/intrinsic-elements.js +1 -0
- package/build/jsx-runtime.d.ts +67 -0
- package/build/jsx-runtime.js +1 -0
- package/build/modules/animated/create-animated-component.d.ts +1 -1
- package/build/modules/animated/create-animated-component.js +18 -4
- package/build/modules/animated/index.d.ts +3 -1
- package/build/modules/animated/index.js +20 -19
- package/build/modules/image/index.d.ts +3 -0
- package/build/modules/image/index.js +13 -0
- package/build/register.d.ts +1 -0
- package/build/register.js +15 -0
- package/build/renderer/index.js +112 -12
- package/build/runtime-helpers/index.d.ts +14 -1
- package/build/runtime-helpers/index.js +250 -9
- package/build/utils/normalize-attrs.d.ts +1 -0
- package/build/utils/normalize-attrs.js +21 -15
- package/intrinsic-tags.cjs +52 -0
- package/metro-css-parser.cjs +2 -1
- package/metro-vue-transformer.cjs +83 -13
- package/package.json +33 -8
- package/build/components/activity-indicator/index.android.d.ts +0 -4
- package/build/components/activity-indicator/index.android.js +0 -10
- package/build/components/activity-indicator/index.d.ts +0 -1
- package/build/components/activity-indicator/index.ios.d.ts +0 -4
- package/build/components/activity-indicator/index.ios.js +0 -10
- package/build/components/activity-indicator/index.js +0 -4
- package/build/components/activity-indicator/shared.d.ts +0 -8
- package/build/components/activity-indicator/shared.js +0 -48
- package/build/components/button.d.ts +0 -14
- package/build/components/button.js +0 -59
- package/build/components/image-background.d.ts +0 -9
- package/build/components/image-background.js +0 -103
- package/build/components/image.d.ts +0 -9
- package/build/components/image.js +0 -90
- package/build/components/input-accessory-view.js +0 -41
- package/build/components/pressable.d.ts +0 -58
- package/build/components/pressable.js +0 -214
- package/build/components/refresh-control.d.ts +0 -20
- package/build/components/refresh-control.js +0 -47
- package/build/components/safe-area-view.d.ts +0 -8
- package/build/components/safe-area-view.js +0 -33
- package/build/components/scroll-view/index.android.d.ts +0 -4
- package/build/components/scroll-view/index.android.js +0 -64
- package/build/components/scroll-view/index.d.ts +0 -1
- package/build/components/scroll-view/index.ios.d.ts +0 -4
- package/build/components/scroll-view/index.ios.js +0 -17
- package/build/components/scroll-view/index.js +0 -4
- package/build/components/scroll-view/shared.js +0 -271
- package/build/components/scroll-view/sticky-header.d.ts +0 -7
- package/build/components/scroll-view/sticky-header.js +0 -208
- package/build/components/switch/index.android.d.ts +0 -12
- package/build/components/switch/index.android.js +0 -13
- package/build/components/switch/index.d.ts +0 -2
- package/build/components/switch/index.ios.d.ts +0 -12
- package/build/components/switch/index.ios.js +0 -11
- package/build/components/switch/index.js +0 -5
- package/build/components/switch/shared.d.ts +0 -23
- package/build/components/switch/shared.js +0 -126
- package/build/components/text-input/index.d.ts +0 -24
- package/build/components/text-input/index.js +0 -242
- package/build/components/touchable-native-feedback.d.ts +0 -24
- package/build/components/touchable-native-feedback.js +0 -77
- package/build/components/touchable.d.ts +0 -50
- package/build/components/touchable.js +0 -278
- package/build/components.d.ts +0 -51
- package/build/components.js +0 -29
package/README.md
CHANGED
|
@@ -34,9 +34,23 @@ additionally needs a Metro transformer for `.vue` files (see
|
|
|
34
34
|
|
|
35
35
|
## Use it
|
|
36
36
|
|
|
37
|
-
The
|
|
38
|
-
|
|
39
|
-
`
|
|
37
|
+
The zero-config entry mirrors real Vue's own `createApp(App).mount(...)` idiom and wires the same
|
|
38
|
+
RN-backed host seams React's `registerApp` does — this is what
|
|
39
|
+
[`examples/vue-tsx`](../../examples/vue-tsx) and [`examples/vue-sfc`](../../examples/vue-sfc)
|
|
40
|
+
actually use:
|
|
41
|
+
|
|
42
|
+
```js
|
|
43
|
+
// index.js
|
|
44
|
+
import { createApp } from '@symbiote-native/vue/bootstrap';
|
|
45
|
+
import App from './App';
|
|
46
|
+
import { name as appName } from './app.json';
|
|
47
|
+
|
|
48
|
+
createApp(App).mount(appName);
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
For anything the defaults don't cover, drive the lower-level seam directly — the same
|
|
52
|
+
`registerRunnable` seam React uses, with `mount` from `@symbiote-native/vue` driving the engine
|
|
53
|
+
through Vue's `createRenderer`:
|
|
40
54
|
|
|
41
55
|
```js
|
|
42
56
|
// index.js
|
|
@@ -52,23 +66,23 @@ RNAppRegistry.registerRunnable(appName, ({ rootTag }) => {
|
|
|
52
66
|
});
|
|
53
67
|
```
|
|
54
68
|
|
|
55
|
-
The app is ordinary Vue —
|
|
56
|
-
|
|
69
|
+
The app is ordinary Vue. The primitives are TAGS — `<view>`, `<text>`, `<pressable>` — so there is
|
|
70
|
+
nothing to import for them at all; both Vue compilers resolve them as elements and the renderer
|
|
71
|
+
maps each to its Fabric view. A tap→increment counter, authored in TSX:
|
|
57
72
|
|
|
58
73
|
```jsx
|
|
59
74
|
import { ref } from '@vue/runtime-core';
|
|
60
|
-
import { View, Text, Pressable } from '@symbiote-native/vue';
|
|
61
75
|
|
|
62
76
|
export default {
|
|
63
77
|
setup() {
|
|
64
78
|
const count = ref(0);
|
|
65
79
|
return () => (
|
|
66
|
-
<
|
|
67
|
-
<
|
|
68
|
-
<
|
|
69
|
-
<
|
|
70
|
-
</
|
|
71
|
-
</
|
|
80
|
+
<view style={{ padding: 24 }}>
|
|
81
|
+
<text>Taps: {count.value}</text>
|
|
82
|
+
<pressable onPress={() => count.value++}>
|
|
83
|
+
<text>Tap me</text>
|
|
84
|
+
</pressable>
|
|
85
|
+
</view>
|
|
72
86
|
);
|
|
73
87
|
},
|
|
74
88
|
};
|
|
@@ -115,7 +129,8 @@ React doesn't hit this because `react-reconciler` commits synchronously.
|
|
|
115
129
|
The fix lives in the engine: `whenCommitted(node, action)` runs `action` now if the node already
|
|
116
130
|
has a tag, else after the commit that assigns it. Any native/imperative call wired at Vue lifecycle
|
|
117
131
|
time must go through it. This is the only place the Vue adapter's timing differs from React's; the
|
|
118
|
-
implementation is in `core/engine/src/
|
|
132
|
+
implementation is `whenCommitted` in `core/engine/src/commit.ts`, built on the generic hook
|
|
133
|
+
registry in `core/engine/src/post-commit.ts`.
|
|
119
134
|
|
|
120
135
|
---
|
|
121
136
|
|
package/babel-jsx.cjs
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
// The Babel plugins a Vue TSX/JSX app puts in its babel.config.js, as ONE list:
|
|
2
|
+
//
|
|
3
|
+
// const symbioteVueJsx = require('@symbiote-native/vue/babel-jsx');
|
|
4
|
+
// module.exports = {
|
|
5
|
+
// presets: ['module:@react-native/babel-preset'],
|
|
6
|
+
// plugins: [...symbioteVueJsx(), myOtherPlugin],
|
|
7
|
+
// };
|
|
8
|
+
//
|
|
9
|
+
// A list rather than a preset, on purpose. `@vue/babel-plugin-jsx` MUST run before the RN preset's
|
|
10
|
+
// React-JSX transform claims the same JSXElements, and Babel applies `plugins` before `presets` —
|
|
11
|
+
// so it has to stay in the app's plugins array, where the app also controls its position relative
|
|
12
|
+
// to its own plugins. A preset would move it after every plugin and silently change that order.
|
|
13
|
+
//
|
|
14
|
+
// The two entries are handed out together because either alone is broken:
|
|
15
|
+
//
|
|
16
|
+
// lowering only -> `view` compiles to resolveComponent("view"), a
|
|
17
|
+
// component that resolves to nothing, with SLOT children an element path
|
|
18
|
+
// never mounts. Blank subtree, no error.
|
|
19
|
+
// isCustomElement only -> nothing was rewritten, so <View> is still a Vue component and the whole
|
|
20
|
+
// point (one component instance per node on ~73% of the tree) is unpaid.
|
|
21
|
+
//
|
|
22
|
+
// Same "both halves or nothing" invariant the SFC path states in metro-vue-transformer.cjs, and the
|
|
23
|
+
// reason it is expressed as one require() here rather than two lines of documentation.
|
|
24
|
+
//
|
|
25
|
+
// @vue/babel-plugin-jsx is OUR dependency and require() resolves relative to this file, so the app
|
|
26
|
+
// declares no extra devDependency — same reasoning as ./metro-css-parser.cjs.
|
|
27
|
+
|
|
28
|
+
const vueJsx = require('@vue/babel-plugin-jsx');
|
|
29
|
+
|
|
30
|
+
// An intrinsic the renderer resolves through descriptorFor, never a Vue component — including one
|
|
31
|
+
// an app writes by hand. A CLOSED set and not a prefix or shape test: an app's own kebab-case
|
|
32
|
+
// component looks identical to ours since the `symbiote-` marker was dropped, and answering true
|
|
33
|
+
// for it would stop resolving it with nothing red.
|
|
34
|
+
const INTRINSIC_TAGS = require('./intrinsic-tags.cjs');
|
|
35
|
+
|
|
36
|
+
function isSymbioteIntrinsic(tag) {
|
|
37
|
+
return INTRINSIC_TAGS.has(tag);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
module.exports = function symbioteVueJsx(options = {}) {
|
|
41
|
+
return [
|
|
42
|
+
[
|
|
43
|
+
vueJsx,
|
|
44
|
+
{
|
|
45
|
+
...options,
|
|
46
|
+
// Last, deliberately: an app may pass other @vue/babel-plugin-jsx options through, but
|
|
47
|
+
// overriding this one silently produces output this adapter cannot render.
|
|
48
|
+
isCustomElement: isSymbioteIntrinsic,
|
|
49
|
+
},
|
|
50
|
+
],
|
|
51
|
+
];
|
|
52
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { IActivityIndicatorProps as IActivityIndicatorBaseProps } from '@symbiote-native/components';
|
|
2
|
+
import type { IClassNameValue } from '@symbiote-native/engine';
|
|
3
|
+
export type IActivityIndicatorProps = IActivityIndicatorBaseProps & {
|
|
4
|
+
class?: IClassNameValue;
|
|
5
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -37,7 +37,6 @@ export type IFlatListEmits<ItemT> = {
|
|
|
37
37
|
}) => void;
|
|
38
38
|
};
|
|
39
39
|
export declare const FlatList: new <ItemT>(props: (IFlatListProps<ItemT> & ({} | {
|
|
40
|
-
onRefresh?: (() => any) | undefined;
|
|
41
40
|
onViewableItemsChanged?: ((info: IViewableItemsChangedInfo<ItemT>) => any) | undefined;
|
|
42
41
|
onEndReached?: ((info: {
|
|
43
42
|
distanceFromEnd: number;
|
|
@@ -45,13 +44,13 @@ export declare const FlatList: new <ItemT>(props: (IFlatListProps<ItemT> & ({} |
|
|
|
45
44
|
onStartReached?: ((info: {
|
|
46
45
|
distanceFromStart: number;
|
|
47
46
|
}) => any) | undefined;
|
|
47
|
+
onRefresh?: (() => any) | undefined;
|
|
48
48
|
onScrollToIndexFailed?: ((info: {
|
|
49
49
|
index: number;
|
|
50
50
|
highestMeasuredFrameIndex: number;
|
|
51
51
|
averageItemLength: number;
|
|
52
52
|
}) => any) | undefined;
|
|
53
53
|
})) & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps) => import("vue").CreateComponentPublicInstanceWithMixins<IFlatListProps<ItemT> & ({} | {
|
|
54
|
-
onRefresh?: (() => any) | undefined;
|
|
55
54
|
onViewableItemsChanged?: ((info: IViewableItemsChangedInfo<ItemT>) => any) | undefined;
|
|
56
55
|
onEndReached?: ((info: {
|
|
57
56
|
distanceFromEnd: number;
|
|
@@ -59,6 +58,7 @@ export declare const FlatList: new <ItemT>(props: (IFlatListProps<ItemT> & ({} |
|
|
|
59
58
|
onStartReached?: ((info: {
|
|
60
59
|
distanceFromStart: number;
|
|
61
60
|
}) => any) | undefined;
|
|
61
|
+
onRefresh?: (() => any) | undefined;
|
|
62
62
|
onScrollToIndexFailed?: ((info: {
|
|
63
63
|
index: number;
|
|
64
64
|
highestMeasuredFrameIndex: number;
|
|
@@ -72,7 +72,6 @@ export declare const FlatList: new <ItemT>(props: (IFlatListProps<ItemT> & ({} |
|
|
|
72
72
|
M: {};
|
|
73
73
|
Defaults: {};
|
|
74
74
|
}, (IFlatListProps<ItemT> & {}) | (IFlatListProps<ItemT> & {
|
|
75
|
-
onRefresh?: (() => any) | undefined;
|
|
76
75
|
onViewableItemsChanged?: ((info: IViewableItemsChangedInfo<ItemT>) => any) | undefined;
|
|
77
76
|
onEndReached?: ((info: {
|
|
78
77
|
distanceFromEnd: number;
|
|
@@ -80,6 +79,7 @@ export declare const FlatList: new <ItemT>(props: (IFlatListProps<ItemT> & ({} |
|
|
|
80
79
|
onStartReached?: ((info: {
|
|
81
80
|
distanceFromStart: number;
|
|
82
81
|
}) => any) | undefined;
|
|
82
|
+
onRefresh?: (() => any) | undefined;
|
|
83
83
|
onScrollToIndexFailed?: ((info: {
|
|
84
84
|
index: number;
|
|
85
85
|
highestMeasuredFrameIndex: number;
|
|
@@ -133,11 +133,11 @@ export const FlatList = defineComponent((props, { attrs, expose, emit, slots, })
|
|
|
133
133
|
const key = keyExtractor ? keyExtractor(item, index) : String(index);
|
|
134
134
|
// The row IS the virtualized cell, so every item in it shares the row's separators
|
|
135
135
|
// handle (the divider sits between rows, not columns), like RN's multi-column FlatList.
|
|
136
|
-
return h('
|
|
136
|
+
return h('view', { key, style: { flex: 1 } }, slots.item !== undefined
|
|
137
137
|
? slots.item({ item, index, separators: info.separators })
|
|
138
138
|
: []);
|
|
139
139
|
});
|
|
140
|
-
return [h('
|
|
140
|
+
return [h('view', { style: rowStyle }, cells)];
|
|
141
141
|
};
|
|
142
142
|
// Viewability over rows expands back to per-item tokens so the caller sees item-level
|
|
143
143
|
// visibility, not row-level (shared expandRowViewability).
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { IImageProps } from '@symbiote-native/components';
|
|
2
|
+
import type { IClassNameValue, IStyleProp, IViewStyle } from '@symbiote-native/engine';
|
|
3
|
+
export interface IImageBackgroundProps extends Omit<IImageProps, 'style'> {
|
|
4
|
+
style?: IStyleProp<IViewStyle>;
|
|
5
|
+
imageStyle?: IStyleProp<IViewStyle> | string;
|
|
6
|
+
class?: IClassNameValue;
|
|
7
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// The `<image>` tag's prop surface. The wrapper is gone: the whole source/src/srcSet resolution,
|
|
2
|
+
// the width/height -> style fold and `alt` -> accessibility now run in `registerImageBehavior`, on
|
|
3
|
+
// the tag itself. The Image STATICS moved to `modules/image` — an imperative API with no view,
|
|
4
|
+
// which living beside a component made read as one.
|
|
5
|
+
export {};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { type IAccessibilityProps, type IAriaProps } from '@symbiote-native/components';
|
|
1
|
+
import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/components';
|
|
3
2
|
import type { IClassNameValue, IStyleProp, IViewStyle } from '@symbiote-native/engine';
|
|
4
3
|
export interface IInputAccessoryViewProps extends IAccessibilityProps, IAriaProps {
|
|
5
4
|
nativeID?: string;
|
|
@@ -7,4 +6,3 @@ export interface IInputAccessoryViewProps extends IAccessibilityProps, IAriaProp
|
|
|
7
6
|
style?: IStyleProp<IViewStyle>;
|
|
8
7
|
class?: IClassNameValue;
|
|
9
8
|
}
|
|
10
|
-
export declare const InputAccessoryView: FunctionalComponent<{}, {}, any, {}>;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// The `<input-accessory-view>` tag's prop surface. The wrapper is gone: it narrowed attrs, called
|
|
2
|
+
// `renderInputAccessoryView` and nested the slot children under the host — and that fold is now
|
|
3
|
+
// `registerInputAccessoryViewBehavior`'s, running on the tag itself. The prop type stays, for a
|
|
4
|
+
// component forwarding a bag.
|
|
5
|
+
export {};
|
|
@@ -122,11 +122,11 @@ export const KeyboardAvoidingView = defineComponent((_props, { attrs: rawAttrs,
|
|
|
122
122
|
// 'nested' pushes the children in an inner view by `bottom: inset`; the wrapper modes
|
|
123
123
|
// adjust the single wrapper directly.
|
|
124
124
|
if (layout.kind === 'nested') {
|
|
125
|
-
return h('
|
|
126
|
-
h('
|
|
125
|
+
return h('view', wrapperProps, [
|
|
126
|
+
h('view', { style: layout.innerStyle }, childNodes),
|
|
127
127
|
]);
|
|
128
128
|
}
|
|
129
|
-
return h('
|
|
129
|
+
return h('view', wrapperProps, childNodes);
|
|
130
130
|
};
|
|
131
131
|
}, {
|
|
132
132
|
name: 'KeyboardAvoidingView',
|
|
@@ -108,7 +108,7 @@ export const Modal = defineComponent((_props, { attrs: rawAttrs, slots, emit })
|
|
|
108
108
|
style: isStyleProp(attrs.style) ? attrs.style : undefined,
|
|
109
109
|
passthrough: resolveAccessibilityProps(forwardAttrs(attrs)),
|
|
110
110
|
});
|
|
111
|
-
// root =
|
|
111
|
+
// root = modal > [container]; the slot children nest UNDER the container View, never
|
|
112
112
|
// as a direct sibling of the host (RN's modal content layout).
|
|
113
113
|
const [container] = root.children;
|
|
114
114
|
if (typeof container === 'string')
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import type { IClassNameValue, IStyleProp, IViewStyle } from '@symbiote-native/engine';
|
|
2
|
+
import type { IAccessibilityProps, IAriaProps, IPressHandler, IPressState, IPressableAndroidRippleConfig, IRectOffset } from '@symbiote-native/components';
|
|
3
|
+
import type { VNodeRef } from '@vue/runtime-core';
|
|
4
|
+
export type { IPressState, IPressableAndroidRippleConfig, } from '@symbiote-native/components';
|
|
5
|
+
export interface IPressableProps extends IAccessibilityProps, IAriaProps {
|
|
6
|
+
onPress?: IPressHandler;
|
|
7
|
+
onPressIn?: IPressHandler;
|
|
8
|
+
onPressOut?: IPressHandler;
|
|
9
|
+
onPressMove?: IPressHandler;
|
|
10
|
+
onLongPress?: IPressHandler;
|
|
11
|
+
delayLongPress?: number;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
focusable?: boolean;
|
|
14
|
+
cancelable?: boolean;
|
|
15
|
+
hitSlop?: IRectOffset;
|
|
16
|
+
pressRetentionOffset?: IRectOffset;
|
|
17
|
+
unstable_pressDelay?: number;
|
|
18
|
+
minPressDuration?: number;
|
|
19
|
+
android_ripple?: IPressableAndroidRippleConfig;
|
|
20
|
+
android_disableSound?: boolean;
|
|
21
|
+
onHoverIn?: IPressHandler;
|
|
22
|
+
onHoverOut?: IPressHandler;
|
|
23
|
+
delayHoverIn?: number;
|
|
24
|
+
delayHoverOut?: number;
|
|
25
|
+
testID?: string;
|
|
26
|
+
style?: IStyleProp<IViewStyle> | ((state: IPressState) => IStyleProp<IViewStyle>);
|
|
27
|
+
class?: IClassNameValue;
|
|
28
|
+
ref?: VNodeRef;
|
|
29
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// The `<pressable>` tag's prop surface. The press machine — timers, the retention region, the
|
|
2
|
+
// long-press and hover legs, the `disabled`/`focusable`/`accessible` folds and the Android ripple —
|
|
3
|
+
// lives on the engine node as `core/components/src/behaviors/pressable.ts`, wired by
|
|
4
|
+
// `../register`. `@press` / `@press-in` / … reach it as ordinary `onPress` / `onPressIn` props.
|
|
5
|
+
//
|
|
6
|
+
// THERE IS NO SCOPED SLOT, and that is the one surface a tag cannot carry: press state lives on the
|
|
7
|
+
// engine node and never crosses back into Vue's reactivity, so `#default="{ pressed }"` has no
|
|
8
|
+
// channel. A `style` CALLBACK still works — the engine resolves it at both values of `pressed`
|
|
9
|
+
// (`isStyleCallback`, `core/engine/src/node.ts`) — and a `:active` CSS rule is cheaper still. A
|
|
10
|
+
// CHILD that needs the state has to be given it: mirror `@press-in`/`@press-out` into a local ref,
|
|
11
|
+
// which is what any app styling a descendant does.
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { IClassNameValue } from '@symbiote-native/engine';
|
|
2
|
+
import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/components';
|
|
3
|
+
export interface IRefreshControlProps extends IAccessibilityProps, IAriaProps {
|
|
4
|
+
refreshing: boolean;
|
|
5
|
+
id?: string;
|
|
6
|
+
onRefresh?: () => void | Promise<void>;
|
|
7
|
+
tintColor?: string;
|
|
8
|
+
title?: string;
|
|
9
|
+
titleColor?: string;
|
|
10
|
+
progressViewOffset?: number;
|
|
11
|
+
colors?: readonly string[];
|
|
12
|
+
progressBackgroundColor?: string;
|
|
13
|
+
size?: 'default' | 'large';
|
|
14
|
+
enabled?: boolean;
|
|
15
|
+
class?: IClassNameValue;
|
|
16
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// The `<refresh-control>` tag's prop surface. The wrapper is gone: it forwarded every prop and
|
|
2
|
+
// turned the host's `onRefresh` into a typed `refresh` emit, which a tag needs no help with —
|
|
3
|
+
// `@refresh` compiles to an `onRefresh` prop and `routeProp` sends it to the native `topRefresh`
|
|
4
|
+
// event. The controlled-spinner handshake lives in `registerRefreshControlBehavior`.
|
|
5
|
+
//
|
|
6
|
+
// Where the node SITS is still the parent's decision and differs per platform: on iOS a
|
|
7
|
+
// PullToRefreshView sibling inside the ScrollView, on Android an AndroidSwipeRefreshLayout wrapping
|
|
8
|
+
// it. `registerScrollViewBehavior` claims the tag and places it.
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// The `<safe-area-view>` tag's prop surface. The wrapper is gone: its whole body was
|
|
2
|
+
// `normalizeVueAttrs` + `resolveAccessibilityProps` + one `h()`, and both folds now run below every
|
|
3
|
+
// path — kebab->camel and `id -> nativeID` in the renderer's `patchProp`, aria/role in the engine's
|
|
4
|
+
// `fabricProps`. The prop type stays, for a component forwarding a bag.
|
|
5
|
+
export {};
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { type IClassNameValue, type IStyleProp, type ISymbioteEvent, type IViewStyle } from '@symbiote-native/engine';
|
|
4
|
-
import { type IStickyHeaderComponentType } from './sticky-header';
|
|
1
|
+
import type { IClassNameValue, ISymbioteEvent, IStyleProp, IViewStyle } from '@symbiote-native/engine';
|
|
2
|
+
import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/components';
|
|
5
3
|
export type { IScrollViewHandle } from '@symbiote-native/components';
|
|
6
4
|
type IScrollHandler = (event: ISymbioteEvent) => void;
|
|
7
5
|
export interface IScrollViewProps extends IAccessibilityProps, IAriaProps {
|
|
@@ -25,9 +23,8 @@ export interface IScrollViewProps extends IAccessibilityProps, IAriaProps {
|
|
|
25
23
|
x: number;
|
|
26
24
|
y: number;
|
|
27
25
|
};
|
|
28
|
-
refreshControl?: VNode;
|
|
29
26
|
removeClippedSubviews?: boolean;
|
|
30
|
-
|
|
27
|
+
onContentSizeChange?: (width: number, height: number) => void;
|
|
31
28
|
snapToInterval?: number;
|
|
32
29
|
snapToOffsets?: number[];
|
|
33
30
|
snapToAlignment?: 'start' | 'center' | 'end';
|
|
@@ -36,7 +33,6 @@ export interface IScrollViewProps extends IAccessibilityProps, IAriaProps {
|
|
|
36
33
|
disableIntervalMomentum?: boolean;
|
|
37
34
|
stickyHeaderIndices?: number[];
|
|
38
35
|
invertStickyHeaders?: boolean;
|
|
39
|
-
StickyHeaderComponent?: IStickyHeaderComponentType;
|
|
40
36
|
keyboardDismissMode?: 'none' | 'on-drag' | 'interactive';
|
|
41
37
|
keyboardShouldPersistTaps?: boolean | 'always' | 'never' | 'handled';
|
|
42
38
|
maintainVisibleContentPosition?: {
|
|
@@ -73,24 +69,5 @@ export interface IScrollViewProps extends IAccessibilityProps, IAriaProps {
|
|
|
73
69
|
onMomentumScrollBegin?: IScrollHandler;
|
|
74
70
|
onMomentumScrollEnd?: IScrollHandler;
|
|
75
71
|
onScrollToTop?: IScrollHandler;
|
|
72
|
+
class?: IClassNameValue;
|
|
76
73
|
}
|
|
77
|
-
export type IScrollViewEmits = {
|
|
78
|
-
contentSizeChange: (width: number, height: number) => boolean;
|
|
79
|
-
};
|
|
80
|
-
export interface IScrollViewAssembleInput {
|
|
81
|
-
scrollViewIntrinsic: ISymbioteIntrinsic;
|
|
82
|
-
scrollProps: Record<string, unknown>;
|
|
83
|
-
content: VNode;
|
|
84
|
-
refreshControl: VNode | undefined;
|
|
85
|
-
scrollViewBaseStyle: IViewStyle;
|
|
86
|
-
userStyle: IStyleProp<IViewStyle> | undefined;
|
|
87
|
-
layoutSplitStyle: IStyleProp<IViewStyle>;
|
|
88
|
-
scrollOuterProps: Record<string, unknown>;
|
|
89
|
-
setNodeRef: (el: unknown) => void;
|
|
90
|
-
}
|
|
91
|
-
export interface IScrollViewPlatform {
|
|
92
|
-
assemble: (input: IScrollViewAssembleInput) => VNode;
|
|
93
|
-
}
|
|
94
|
-
export declare function createScrollView(platform: IScrollViewPlatform): import("vue").DefineSetupFnComponent<IScrollViewProps, IScrollViewEmits, {}, IScrollViewProps & {
|
|
95
|
-
onContentSizeChange?: ((width: number, height: number) => any) | undefined;
|
|
96
|
-
}, import("vue").PublicProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -6,21 +6,21 @@ export type ISectionListProps<ItemT> = IVirtualizedSectionListProps<ItemT>;
|
|
|
6
6
|
export type ISectionListEmits = IVirtualizedSectionListEmits;
|
|
7
7
|
export type ISectionListSlots<ItemT> = IVirtualizedSectionListSlots<ItemT>;
|
|
8
8
|
export declare const SectionList: new <ItemT>(props: (ISectionListProps<ItemT> & ({} | {
|
|
9
|
-
onRefresh?: (() => any) | undefined;
|
|
10
9
|
onEndReached?: ((info: {
|
|
11
10
|
distanceFromEnd: number;
|
|
12
11
|
}) => any) | undefined;
|
|
13
12
|
onStartReached?: ((info: {
|
|
14
13
|
distanceFromStart: number;
|
|
15
14
|
}) => any) | undefined;
|
|
16
|
-
})) & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps) => import("vue").CreateComponentPublicInstanceWithMixins<ISectionListProps<ItemT> & ({} | {
|
|
17
15
|
onRefresh?: (() => any) | undefined;
|
|
16
|
+
})) & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps) => import("vue").CreateComponentPublicInstanceWithMixins<ISectionListProps<ItemT> & ({} | {
|
|
18
17
|
onEndReached?: ((info: {
|
|
19
18
|
distanceFromEnd: number;
|
|
20
19
|
}) => any) | undefined;
|
|
21
20
|
onStartReached?: ((info: {
|
|
22
21
|
distanceFromStart: number;
|
|
23
22
|
}) => any) | undefined;
|
|
23
|
+
onRefresh?: (() => any) | undefined;
|
|
24
24
|
}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} | IVirtualizedSectionListEmits, import("vue").PublicProps, {}, false, {}, import("vue").SlotsType<ISectionListSlots<ItemT>>, {}, {}, string, {}, any, import("vue").ComponentProvideOptions, {
|
|
25
25
|
P: {};
|
|
26
26
|
B: {};
|
|
@@ -29,11 +29,11 @@ export declare const SectionList: new <ItemT>(props: (ISectionListProps<ItemT> &
|
|
|
29
29
|
M: {};
|
|
30
30
|
Defaults: {};
|
|
31
31
|
}, (ISectionListProps<ItemT> & {}) | (ISectionListProps<ItemT> & {
|
|
32
|
-
onRefresh?: (() => any) | undefined;
|
|
33
32
|
onEndReached?: ((info: {
|
|
34
33
|
distanceFromEnd: number;
|
|
35
34
|
}) => any) | undefined;
|
|
36
35
|
onStartReached?: ((info: {
|
|
37
36
|
distanceFromStart: number;
|
|
38
37
|
}) => any) | undefined;
|
|
38
|
+
onRefresh?: (() => any) | undefined;
|
|
39
39
|
}), {}, {}, {}, {}, {}>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { IClassNameValue } from '@symbiote-native/engine';
|
|
2
|
+
import type { ISwitchProps as ISwitchBaseProps } from '@symbiote-native/components';
|
|
3
|
+
export type ISwitchProps = ISwitchBaseProps & {
|
|
4
|
+
class?: IClassNameValue;
|
|
5
|
+
};
|
|
6
|
+
export type { ISwitchTrackColor, ISwitchChangeEvent, } from '@symbiote-native/components';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { IClassNameValue, IStyleProp, ISymbioteEvent, ITextStyle } from '@symbiote-native/engine';
|
|
2
|
+
import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/components';
|
|
3
|
+
import type { VNodeRef } from '@vue/runtime-core';
|
|
4
|
+
export interface ITextProps extends IAccessibilityProps, IAriaProps {
|
|
5
|
+
style?: IStyleProp<ITextStyle>;
|
|
6
|
+
class?: IClassNameValue;
|
|
7
|
+
onPress?: (event: ISymbioteEvent) => void;
|
|
8
|
+
onLongPress?: (event: ISymbioteEvent) => void;
|
|
9
|
+
onPressIn?: (event: ISymbioteEvent) => void;
|
|
10
|
+
onPressOut?: (event: ISymbioteEvent) => void;
|
|
11
|
+
onLayout?: (event: ISymbioteEvent) => void;
|
|
12
|
+
onTextLayout?: (event: ISymbioteEvent) => void;
|
|
13
|
+
numberOfLines?: number;
|
|
14
|
+
ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';
|
|
15
|
+
selectable?: boolean;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
adjustsFontSizeToFit?: boolean;
|
|
18
|
+
minimumFontScale?: number;
|
|
19
|
+
allowFontScaling?: boolean;
|
|
20
|
+
maxFontSizeMultiplier?: number | null;
|
|
21
|
+
selectionColor?: string;
|
|
22
|
+
ref?: VNodeRef;
|
|
23
|
+
key?: string | number | symbol;
|
|
24
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
// The `<text>` tag's prop surface. There is no `Text` component: the wrapper's one job beyond
|
|
2
|
+
// forwarding attrs was RN's `Text.js` defaults (`ellipsizeMode: 'tail'`, `allowFontScaling: true`),
|
|
3
|
+
// and those are seeded in the renderer's `createElement` (`seedTextDefaults`) plus re-seeded in
|
|
4
|
+
// `patchProp` when a value arrives as an explicit `undefined`. A `<text>` inside another `<text>`
|
|
5
|
+
// still commits as `RCTVirtualText`; that is the engine's commit walk, never an adapter's.
|
|
6
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { INativeFeedbackBackground } from '@symbiote-native/components';
|
|
2
|
+
import type { IPressableProps } from './pressable-props';
|
|
3
|
+
export type ITouchableNativeFeedbackProps = Omit<IPressableProps, 'style'> & {
|
|
4
|
+
background?: INativeFeedbackBackground;
|
|
5
|
+
useForeground?: boolean;
|
|
6
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { IStyleProp, IViewStyle } from '@symbiote-native/engine';
|
|
2
|
+
import type { IPressTimingProps } from '@symbiote-native/components';
|
|
3
|
+
import type { IPressableProps } from './pressable-props';
|
|
4
|
+
export type ITouchableBaseProps = Omit<IPressableProps, 'style'> & IPressTimingProps & {
|
|
5
|
+
style?: IStyleProp<IViewStyle>;
|
|
6
|
+
};
|
|
7
|
+
export interface ITouchableOpacityProps extends ITouchableBaseProps {
|
|
8
|
+
activeOpacity?: number;
|
|
9
|
+
}
|
|
10
|
+
export interface ITouchableHighlightProps extends ITouchableBaseProps {
|
|
11
|
+
activeOpacity?: number;
|
|
12
|
+
underlayColor?: string;
|
|
13
|
+
onShowUnderlay?: () => void;
|
|
14
|
+
onHideUnderlay?: () => void;
|
|
15
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import type { IClassNameValue, IStyleProp, ISymbioteEvent, IViewStyle } from '@symbiote-native/engine';
|
|
2
|
+
import type { IAccessibilityProps, IAriaProps, IResponderProps } from '@symbiote-native/components';
|
|
3
|
+
import type { VNodeRef } from '@vue/runtime-core';
|
|
4
|
+
export interface IViewProps extends IAccessibilityProps, IAriaProps, IResponderProps {
|
|
5
|
+
style?: IStyleProp<IViewStyle>;
|
|
6
|
+
class?: IClassNameValue;
|
|
7
|
+
onPress?: (event: ISymbioteEvent) => void;
|
|
8
|
+
onPressIn?: (event: ISymbioteEvent) => void;
|
|
9
|
+
onPressOut?: (event: ISymbioteEvent) => void;
|
|
10
|
+
onLayout?: (event: ISymbioteEvent) => void;
|
|
11
|
+
onFocus?: (event: ISymbioteEvent) => void;
|
|
12
|
+
onBlur?: (event: ISymbioteEvent) => void;
|
|
13
|
+
pointerEvents?: 'auto' | 'none' | 'box-none' | 'box-only';
|
|
14
|
+
hitSlop?: number | {
|
|
15
|
+
top?: number;
|
|
16
|
+
left?: number;
|
|
17
|
+
bottom?: number;
|
|
18
|
+
right?: number;
|
|
19
|
+
};
|
|
20
|
+
id?: string;
|
|
21
|
+
focusable?: boolean;
|
|
22
|
+
collapsable?: boolean;
|
|
23
|
+
removeClippedSubviews?: boolean;
|
|
24
|
+
renderToHardwareTextureAndroid?: boolean;
|
|
25
|
+
shouldRasterizeIOS?: boolean;
|
|
26
|
+
needsOffscreenAlphaCompositing?: boolean;
|
|
27
|
+
ref?: VNodeRef;
|
|
28
|
+
key?: string | number | symbol;
|
|
29
|
+
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// The `<view>` tag's prop surface. There is no `View` component: it was a functional wrapper whose
|
|
2
|
+
// whole body was `h('view', normalizeVueAttrs(attrs))`, and that fold moved to the renderer's
|
|
3
|
+
// `patchProp` (kebab->camel per key, then `id -> nativeID`) — which covers a hand-written `h('view')`
|
|
4
|
+
// and both compiled paths alike, where a wrapper covered only the call sites that named it.
|
|
5
|
+
export {};
|