@xaui/native 0.9.1-alpha.7 → 0.9.1-alpha.9
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/{chunk-AW63PTQ4.cjs → chunk-2FEDC7U5.cjs} +2 -1
- package/dist/chunk-3TIDEII6.js +57 -0
- package/dist/{chunk-2KXQATVL.js → chunk-7XGOXTGT.js} +2 -1
- package/dist/chunk-LMUPNKPH.cjs +57 -0
- package/dist/chunk-PBRPIZZ2.js +350 -0
- package/dist/{chunk-GYK2CAX4.js → chunk-U3C6VN4X.js} +190 -232
- package/dist/chunk-V42SPPP3.cjs +350 -0
- package/dist/{chunk-46M765BS.cjs → chunk-VGWN4JTL.cjs} +181 -223
- package/dist/components/button/index.cjs +12 -0
- package/dist/components/button/index.d.cts +192 -0
- package/dist/components/button/index.d.ts +192 -0
- package/dist/components/button/index.js +12 -0
- package/dist/create-recipe-BjxSp9_k.d.cts +197 -0
- package/dist/create-recipe-M99yoHrG.d.ts +197 -0
- package/dist/index.cjs +17 -31
- package/dist/index.d.cts +14 -4
- package/dist/index.d.ts +14 -4
- package/dist/index.js +19 -33
- package/dist/system/index.cjs +4 -2
- package/dist/system/index.d.cts +54 -243
- package/dist/system/index.d.ts +54 -243
- package/dist/system/index.js +6 -4
- package/dist/theme/index.cjs +2 -2
- package/dist/theme/index.js +1 -1
- package/package.json +6 -1
|
@@ -0,0 +1,197 @@
|
|
|
1
|
+
import { ComponentType, ReactNode } from 'react';
|
|
2
|
+
import { ImageSourcePropType, StyleProp, ImageStyle, PressableProps, ViewStyle, TextStyle } from 'react-native';
|
|
3
|
+
import { SharedValue } from 'react-native-reanimated';
|
|
4
|
+
import { g as XAUITheme, X as XAUIColors } from './theme.type-C9bFJKFm.js';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* The props Lucide, Ionicons and `react-native-vector-icons` all accept — the shape
|
|
8
|
+
* `as` is handed. It is a convention rather than an interface anyone published, which is
|
|
9
|
+
* exactly why `Icon` exists: without it every call site computes the two values by hand.
|
|
10
|
+
*/
|
|
11
|
+
type IconComponentProps = {
|
|
12
|
+
size?: number;
|
|
13
|
+
color?: string;
|
|
14
|
+
};
|
|
15
|
+
type IconProps = {
|
|
16
|
+
/** An icon component. `size` and `color` are injected into it. */
|
|
17
|
+
as?: ComponentType<IconComponentProps>;
|
|
18
|
+
/** A raw `react-native-svg` element, cloned with the resolved size and colour. */
|
|
19
|
+
children?: ReactNode;
|
|
20
|
+
/** An image, tinted with the resolved colour. */
|
|
21
|
+
source?: ImageSourcePropType;
|
|
22
|
+
/** Overrides what the surrounding slot asked for. */
|
|
23
|
+
size?: number;
|
|
24
|
+
/** A raw value (R7), never a token. Overrides the slot's. */
|
|
25
|
+
color?: string;
|
|
26
|
+
style?: StyleProp<ImageStyle>;
|
|
27
|
+
};
|
|
28
|
+
/** What a component root publishes so the icons inside it need no props at all. */
|
|
29
|
+
type IconContextValue = {
|
|
30
|
+
size?: number;
|
|
31
|
+
color?: string;
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* What the root does under the finger. `scale-highlight` and `scale-ripple` mount their
|
|
36
|
+
* overlay themselves; `scale` mounts none, which is what a root picks when it renders its
|
|
37
|
+
* own `<PressableFeedback.Highlight>` to style it (R1: no prop reaches into another
|
|
38
|
+
* component's insides).
|
|
39
|
+
*/
|
|
40
|
+
type FeedbackVariant = 'scale-highlight' | 'scale-ripple' | 'scale' | 'none';
|
|
41
|
+
type AnimationConfig = {
|
|
42
|
+
scale?: boolean;
|
|
43
|
+
highlight?: boolean;
|
|
44
|
+
ripple?: boolean;
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* `false` and `'disabled'` turn this component's animations off. `'disable-all'` turns
|
|
48
|
+
* them off for its descendants too — a long list kills every row's worklets with one
|
|
49
|
+
* prop instead of threading it down. An object switches them off one at a time.
|
|
50
|
+
*/
|
|
51
|
+
type AnimationProp = boolean | 'disabled' | 'disable-all' | AnimationConfig;
|
|
52
|
+
/** `animation` once normalised — what the components actually read. */
|
|
53
|
+
type ResolvedAnimation = {
|
|
54
|
+
scale: boolean;
|
|
55
|
+
highlight: boolean;
|
|
56
|
+
ripple: boolean;
|
|
57
|
+
/** True when every sub-animation is off: the branch that mounts no worklet at all. */
|
|
58
|
+
none: boolean;
|
|
59
|
+
/** Propagated to descendants through context. */
|
|
60
|
+
disableAll: boolean;
|
|
61
|
+
};
|
|
62
|
+
type PressableFeedbackProps = Omit<PressableProps, 'style' | 'children' | 'disabled'> & {
|
|
63
|
+
/** Controlled: the root owns the state, because its recipe resolves on it (R5). */
|
|
64
|
+
isPressed?: boolean;
|
|
65
|
+
/** R8: `disabled` is not part of the public vocabulary, `isX` is. */
|
|
66
|
+
isDisabled?: boolean;
|
|
67
|
+
/**
|
|
68
|
+
* Merge into the single child instead of rendering a pressable (R12) — **keeping the
|
|
69
|
+
* feedback**. Swapping this component out for a bare `Slot` would silently drop the
|
|
70
|
+
* touch feedback of every `asChild` control.
|
|
71
|
+
*/
|
|
72
|
+
asChild?: boolean;
|
|
73
|
+
feedbackVariant?: FeedbackVariant;
|
|
74
|
+
animation?: AnimationProp;
|
|
75
|
+
style?: StyleProp<ViewStyle>;
|
|
76
|
+
/**
|
|
77
|
+
* `Pressable`'s function form is dropped on purpose. It exists to hand the press state
|
|
78
|
+
* to children; here the root above already owns that state and this publishes it
|
|
79
|
+
* through context, so the function form would be a second, quieter source of truth.
|
|
80
|
+
*/
|
|
81
|
+
children?: ReactNode;
|
|
82
|
+
};
|
|
83
|
+
/**
|
|
84
|
+
* A slot's own animation, overriding the blanket one on the root. `false` switches that
|
|
85
|
+
* slot off; the object tunes it. Deliberately two knobs rather than a full timing
|
|
86
|
+
* surface — anything past this is a different animation, and that is a component's job,
|
|
87
|
+
* not a prop's.
|
|
88
|
+
*/
|
|
89
|
+
type SlotAnimation = boolean | {
|
|
90
|
+
/** Milliseconds. Falls back to the shared press timing. */
|
|
91
|
+
duration?: number;
|
|
92
|
+
/** How far the overlay goes at full press, 0 to 1. */
|
|
93
|
+
opacity?: number;
|
|
94
|
+
};
|
|
95
|
+
type FeedbackContext = {
|
|
96
|
+
isPressed: boolean;
|
|
97
|
+
animation: ResolvedAnimation;
|
|
98
|
+
/** Absent on the static branch, where nothing animates and no worklet is mounted. */
|
|
99
|
+
progress?: SharedValue<number>;
|
|
100
|
+
/**
|
|
101
|
+
* Bumped on every press-in. The ripple starts from this rather than from a `useEffect`
|
|
102
|
+
* on `isPressed`: a one-shot driven by a boolean depends on React re-rendering between
|
|
103
|
+
* the two touch events, and starting it from the event that carries the coordinates is
|
|
104
|
+
* both simpler and impossible to miss.
|
|
105
|
+
*/
|
|
106
|
+
pressCount?: SharedValue<number>;
|
|
107
|
+
/** Where the finger landed, and how big the root is — the ripple needs both. */
|
|
108
|
+
origin?: SharedValue<{
|
|
109
|
+
x: number;
|
|
110
|
+
y: number;
|
|
111
|
+
}>;
|
|
112
|
+
size?: SharedValue<{
|
|
113
|
+
width: number;
|
|
114
|
+
height: number;
|
|
115
|
+
}>;
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
/**
|
|
119
|
+
* A slot is a view or a text node, and a recipe writes one object per slot, so the two
|
|
120
|
+
* RN style shapes are merged rather than discriminated per slot.
|
|
121
|
+
*/
|
|
122
|
+
type SlotStyle = ViewStyle & TextStyle;
|
|
123
|
+
type SlotStyles<Slot extends string> = Partial<Record<Slot, SlotStyle>>;
|
|
124
|
+
/** The roles a variant consumes. The variant names tokens; `paint` says where they land. */
|
|
125
|
+
type VariantRole = 'bg' | 'bgPressed' | 'fg' | 'border';
|
|
126
|
+
/** Token names per role — no colour value ever appears in a recipe. */
|
|
127
|
+
type VariantTokens = Partial<Record<VariantRole, keyof XAUIColors>>;
|
|
128
|
+
/** The same roles resolved: theme colours, or the slices of a raw `color`. */
|
|
129
|
+
type VariantColors = Partial<Record<VariantRole, string>>;
|
|
130
|
+
/**
|
|
131
|
+
* `disabled` is applied last of the three: a control that is both pressed and disabled
|
|
132
|
+
* has to read disabled.
|
|
133
|
+
*/
|
|
134
|
+
type StateName = 'focused' | 'pressed' | 'disabled';
|
|
135
|
+
type States = Partial<Record<StateName, boolean>>;
|
|
136
|
+
/** Reads the theme and the variant's resolved colours; returns one style per slot. */
|
|
137
|
+
type StyleFn<Slot extends string> = (theme: XAUITheme, colors: VariantColors) => SlotStyles<Slot>;
|
|
138
|
+
/** Named axes of finite token values — `{ size: { sm: fn, md: fn } }`. */
|
|
139
|
+
type Axes<Slot extends string> = Record<string, Record<string, StyleFn<Slot>>>;
|
|
140
|
+
/** One value per axis, plus the variant. Missing keys fall back to `defaultVariants`. */
|
|
141
|
+
type Selection<Variant extends string, A extends Axes<string>> = {
|
|
142
|
+
variant?: Variant;
|
|
143
|
+
} & {
|
|
144
|
+
[Axis in keyof A]?: Extract<keyof A[Axis], string>;
|
|
145
|
+
};
|
|
146
|
+
type CompoundVariant<Slot extends string, Variant extends string, A extends Axes<Slot>> = {
|
|
147
|
+
when: Selection<Variant, A>;
|
|
148
|
+
style: StyleFn<Slot>;
|
|
149
|
+
};
|
|
150
|
+
type RecipeConfig<Slot extends string, Variant extends string, A extends Axes<Slot>> = {
|
|
151
|
+
/** Every slot the component publishes. Slots a recipe never styles resolve to `{}`. */
|
|
152
|
+
slots: readonly Slot[];
|
|
153
|
+
base?: StyleFn<Slot>;
|
|
154
|
+
variantTokens?: Record<Variant, VariantTokens>;
|
|
155
|
+
/** Where the variant's colours land — written once, and it holds for every variant. */
|
|
156
|
+
paint?: StyleFn<Slot>;
|
|
157
|
+
variants?: A;
|
|
158
|
+
compoundVariants?: ReadonlyArray<CompoundVariant<Slot, Variant, A>>;
|
|
159
|
+
states?: Partial<Record<StateName, StyleFn<Slot>>>;
|
|
160
|
+
defaultVariants?: Selection<Variant, A>;
|
|
161
|
+
};
|
|
162
|
+
/** Stable references: the same object for the same tokens, for the app's lifetime. */
|
|
163
|
+
type ResolvedStyles<Slot extends string> = Readonly<Record<Slot, SlotStyle>>;
|
|
164
|
+
/** A selection with `defaultVariants` already folded in, keyed by axis name. */
|
|
165
|
+
type ResolvedSelection = Readonly<Record<string, string | undefined>>;
|
|
166
|
+
|
|
167
|
+
type ResolveArgs<Variant extends string, A extends Axes<string>> = {
|
|
168
|
+
theme: XAUITheme;
|
|
169
|
+
selection?: Selection<Variant, A>;
|
|
170
|
+
states?: States;
|
|
171
|
+
};
|
|
172
|
+
type TintArgs<Variant extends string, A extends Axes<string>> = ResolveArgs<Variant, A> & {
|
|
173
|
+
color: string;
|
|
174
|
+
};
|
|
175
|
+
type Recipe<Slot extends string, Variant extends string, A extends Axes<Slot>> = {
|
|
176
|
+
readonly slots: readonly Slot[];
|
|
177
|
+
/** The cached pass: stable `StyleSheet` references, keyed by tokens alone. */
|
|
178
|
+
resolve(args: ResolveArgs<Variant, A>): ResolvedStyles<Slot>;
|
|
179
|
+
/**
|
|
180
|
+
* The tint pass: the same functions run again with `color`'s slices in place of the
|
|
181
|
+
* theme's tokens. Uncached and allocating, and only ever called when `color` is set.
|
|
182
|
+
*/
|
|
183
|
+
tint(args: TintArgs<Variant, A>): SlotStyles<Slot>;
|
|
184
|
+
};
|
|
185
|
+
/**
|
|
186
|
+
* A component's style, declared once. Resolution splits in two because the two halves
|
|
187
|
+
* have different lifetimes: everything keyed by a finite token is cached forever, and
|
|
188
|
+
* an arbitrary `color` is recomputed per render — which is what keeps the cache bounded
|
|
189
|
+
* by the number of token combinations rather than by the palette users invent.
|
|
190
|
+
*
|
|
191
|
+
* const styles = buttonRecipe.resolve({ theme, selection: { variant, size }, states })
|
|
192
|
+
* const tint = color ? buttonRecipe.tint({ theme, color, selection, states }) : undefined
|
|
193
|
+
* <View style={[styles.root, tint?.root, style]} />
|
|
194
|
+
*/
|
|
195
|
+
declare function createRecipe<Slot extends string, Variant extends string, const A extends Axes<Slot>>(config: RecipeConfig<Slot, Variant, A>): Recipe<Slot, Variant, A>;
|
|
196
|
+
|
|
197
|
+
export { type AnimationConfig as A, type CompoundVariant as C, type FeedbackContext as F, type IconComponentProps as I, type PressableFeedbackProps as P, type ResolvedAnimation as R, type SlotAnimation as S, type TintArgs as T, type VariantColors as V, type IconContextValue as a, type IconProps as b, type AnimationProp as c, type FeedbackVariant as d, createRecipe as e, type Recipe as f, type ResolveArgs as g, type Axes as h, type RecipeConfig as i, type ResolvedSelection as j, type ResolvedStyles as k, type Selection as l, type SlotStyle as m, type SlotStyles as n, type StateName as o, type States as p, type StyleFn as q, type VariantRole as r, type VariantTokens as s };
|
package/dist/index.cjs
CHANGED
|
@@ -4,10 +4,12 @@
|
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
|
+
var _chunkV42SPPP3cjs = require('./chunk-V42SPPP3.cjs');
|
|
7
8
|
|
|
8
9
|
|
|
9
10
|
|
|
10
11
|
|
|
12
|
+
var _chunkLMUPNKPHcjs = require('./chunk-LMUPNKPH.cjs');
|
|
11
13
|
|
|
12
14
|
|
|
13
15
|
|
|
@@ -22,7 +24,6 @@
|
|
|
22
24
|
|
|
23
25
|
|
|
24
26
|
|
|
25
|
-
var _chunk46M765BScjs = require('./chunk-46M765BS.cjs');
|
|
26
27
|
|
|
27
28
|
|
|
28
29
|
|
|
@@ -30,29 +31,29 @@ var _chunk46M765BScjs = require('./chunk-46M765BS.cjs');
|
|
|
30
31
|
|
|
31
32
|
|
|
32
33
|
|
|
34
|
+
var _chunkVGWN4JTLcjs = require('./chunk-VGWN4JTL.cjs');
|
|
33
35
|
|
|
34
36
|
|
|
35
37
|
|
|
36
38
|
|
|
37
|
-
var _chunkAW63PTQ4cjs = require('./chunk-AW63PTQ4.cjs');
|
|
38
39
|
|
|
39
40
|
|
|
40
41
|
|
|
41
42
|
|
|
42
43
|
|
|
43
44
|
|
|
44
|
-
var _chunk3QBT3Q65cjs = require('./chunk-3QBT3Q65.cjs');
|
|
45
45
|
|
|
46
|
-
|
|
47
|
-
var _react = require('react');
|
|
46
|
+
var _chunk2FEDC7U5cjs = require('./chunk-2FEDC7U5.cjs');
|
|
48
47
|
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
var _chunk3QBT3Q65cjs = require('./chunk-3QBT3Q65.cjs');
|
|
54
54
|
|
|
55
55
|
// src/hooks/use-controllable-state.ts
|
|
56
|
+
var _react = require('react');
|
|
56
57
|
function useControllableState({
|
|
57
58
|
value,
|
|
58
59
|
defaultValue,
|
|
@@ -79,7 +80,7 @@ function useControllableState({
|
|
|
79
80
|
function useControlWarning(isControlled) {
|
|
80
81
|
const wasControlled = _react.useRef.call(void 0, isControlled);
|
|
81
82
|
if (wasControlled.current !== isControlled) {
|
|
82
|
-
warnDev(
|
|
83
|
+
_chunkV42SPPP3cjs.warnDev.call(void 0,
|
|
83
84
|
`a component switched from ${wasControlled.current ? "controlled" : "uncontrolled"} to ${isControlled ? "controlled" : "uncontrolled"}. Decide for the life of the component: pass \`value\` always, or never. Passing \`undefined\` for a value you do control reads as "uncontrolled" here.`
|
|
84
85
|
);
|
|
85
86
|
wasControlled.current = isControlled;
|
|
@@ -89,25 +90,7 @@ function useControlWarning(isControlled) {
|
|
|
89
90
|
// src/hooks/use-merged-ref.ts
|
|
90
91
|
|
|
91
92
|
function useMergedRef(...refs) {
|
|
92
|
-
return _react.useMemo.call(void 0, () =>
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
// src/hooks/use-press-state.ts
|
|
96
|
-
|
|
97
|
-
function usePressState(handlers = {}) {
|
|
98
|
-
const [isPressed, setIsPressed] = _react.useState.call(void 0, false);
|
|
99
|
-
const latest = _react.useRef.call(void 0, handlers);
|
|
100
|
-
latest.current = handlers;
|
|
101
|
-
const onPressIn = _react.useCallback.call(void 0, (event) => {
|
|
102
|
-
setIsPressed(true);
|
|
103
|
-
_optionalChain([latest, 'access', _3 => _3.current, 'access', _4 => _4.onPressIn, 'optionalCall', _5 => _5(event)]);
|
|
104
|
-
}, []);
|
|
105
|
-
const onPressOut = _react.useCallback.call(void 0, (event) => {
|
|
106
|
-
setIsPressed(false);
|
|
107
|
-
_optionalChain([latest, 'access', _6 => _6.current, 'access', _7 => _7.onPressOut, 'optionalCall', _8 => _8(event)]);
|
|
108
|
-
}, []);
|
|
109
|
-
const press = _react.useRef.call(void 0, { onPressIn, onPressOut }).current;
|
|
110
|
-
return [isPressed, press];
|
|
93
|
+
return _react.useMemo.call(void 0, () => _chunkVGWN4JTLcjs.mergeRefs.call(void 0, ...refs), refs);
|
|
111
94
|
}
|
|
112
95
|
|
|
113
96
|
// src/hooks/use-previous.ts
|
|
@@ -162,4 +145,7 @@ function usePrevious(value) {
|
|
|
162
145
|
|
|
163
146
|
|
|
164
147
|
|
|
165
|
-
|
|
148
|
+
|
|
149
|
+
|
|
150
|
+
|
|
151
|
+
exports.Button = _chunkV42SPPP3cjs.Button; exports.HIGHLIGHT_OPACITY = _chunkVGWN4JTLcjs.HIGHLIGHT_OPACITY; exports.Icon = _chunkVGWN4JTLcjs.Icon; exports.IconContext = _chunkVGWN4JTLcjs.IconContext; exports.PRESS_DURATION = _chunkVGWN4JTLcjs.PRESS_DURATION; exports.PRESS_SCALE = _chunkVGWN4JTLcjs.PRESS_SCALE; exports.Portal = _chunkLMUPNKPHcjs.Portal; exports.PortalContext = _chunkLMUPNKPHcjs.PortalContext; exports.PortalHost = _chunkLMUPNKPHcjs.PortalHost; exports.PressableFeedback = _chunkVGWN4JTLcjs.PressableFeedback; exports.RELEASE_DURATION = _chunkVGWN4JTLcjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunkVGWN4JTLcjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunkVGWN4JTLcjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunkVGWN4JTLcjs.RIPPLE_OPACITY; exports.Slot = _chunkVGWN4JTLcjs.Slot; exports.ThemeContext = _chunk3QBT3Q65cjs.ThemeContext; exports.XAUIProvider = _chunk2FEDC7U5cjs.XAUIProvider; exports.buildRadius = _chunk2FEDC7U5cjs.buildRadius; exports.buildShadows = _chunk2FEDC7U5cjs.buildShadows; exports.buttonRecipe = _chunkV42SPPP3cjs.buttonRecipe; exports.childrenToString = _chunkVGWN4JTLcjs.childrenToString; exports.createRecipe = _chunkVGWN4JTLcjs.createRecipe; exports.createSlotContext = _chunkVGWN4JTLcjs.createSlotContext; exports.createTheme = _chunk2FEDC7U5cjs.createTheme; exports.defaultTheme = _chunk2FEDC7U5cjs.defaultTheme; exports.deriveColors = _chunk2FEDC7U5cjs.deriveColors; exports.deriveTint = _chunk3QBT3Q65cjs.deriveTint; exports.mergeProps = _chunkVGWN4JTLcjs.mergeProps; exports.mergeRefs = _chunkVGWN4JTLcjs.mergeRefs; exports.palette = _chunk2FEDC7U5cjs.palette; exports.primitives = _chunk2FEDC7U5cjs.primitives; exports.resolveAnimation = _chunkVGWN4JTLcjs.resolveAnimation; exports.resolveSlotAnimation = _chunkVGWN4JTLcjs.resolveSlotAnimation; exports.sourceKeys = _chunk2FEDC7U5cjs.sourceKeys; exports.tokens = _chunk2FEDC7U5cjs.tokens; exports.useButton = _chunkV42SPPP3cjs.useButton; exports.useColorMode = _chunk3QBT3Q65cjs.useColorMode; exports.useControllableState = useControllableState; exports.useFeedback = _chunkVGWN4JTLcjs.useFeedback; exports.useIconContext = _chunkVGWN4JTLcjs.useIconContext; exports.useMergedRef = useMergedRef; exports.usePressState = _chunkV42SPPP3cjs.usePressState; exports.usePrevious = usePrevious; exports.useThemeColor = _chunk3QBT3Q65cjs.useThemeColor; exports.useXAUITheme = _chunk3QBT3Q65cjs.useXAUITheme;
|
package/dist/index.d.cts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
export { Button, ButtonContextValue, ButtonIconProps, ButtonLabelProps, ButtonProps, ButtonSize, ButtonSlot, ButtonSpinnerProps, ButtonVariant, buttonRecipe, useButton } from './components/button/index.cjs';
|
|
1
2
|
import { RefCallback } from 'react';
|
|
2
3
|
import { PossibleRef } from './system/index.cjs';
|
|
3
|
-
export {
|
|
4
|
+
export { AsChildProps, HIGHLIGHT_OPACITY, Icon, IconContext, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Slot, SlotProps, childrenToString, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.cjs';
|
|
4
5
|
import { GestureResponderEvent } from 'react-native';
|
|
6
|
+
export { A as AnimationConfig, c as AnimationProp, h as Axes, C as CompoundVariant, F as FeedbackContext, d as FeedbackVariant, I as IconComponentProps, a as IconContextValue, b as IconProps, P as PressableFeedbackProps, f as Recipe, i as RecipeConfig, g as ResolveArgs, R as ResolvedAnimation, j as ResolvedSelection, k as ResolvedStyles, l as Selection, S as SlotAnimation, m as SlotStyle, n as SlotStyles, o as StateName, p as States, q as StyleFn, T as TintArgs, V as VariantColors, r as VariantRole, s as VariantTokens, e as createRecipe } from './create-recipe-BjxSp9_k.cjs';
|
|
5
7
|
export { ColorModePreference, PaletteFamily, PaletteShade, ThemeContext, XAUIProvider, XAUIProviderProps, XAUITint, buildRadius, buildShadows, createTheme, defaultTheme, deriveColors, deriveTint, palette, primitives, sourceKeys, tokens, useColorMode, useThemeColor, useXAUITheme } from './theme/index.cjs';
|
|
6
8
|
export { C as ColorMode, F as FontSizeKey, a as FontWeightKey, R as RadiusKey, S as Size, X as XAUIColors, b as XAUIDerivedColors, c as XAUIPrimitiveColors, d as XAUIRadius, e as XAUIShadow, f as XAUISourceColors, g as XAUITheme, h as XAUIThemeConfig, i as XAUIThemeSet } from './theme.type-C9bFJKFm.cjs';
|
|
7
9
|
import 'react-native-reanimated';
|
|
@@ -32,10 +34,15 @@ declare function useControllableState<T>({ value, defaultValue, onChange, }: Con
|
|
|
32
34
|
*/
|
|
33
35
|
declare function useMergedRef<T>(...refs: Array<PossibleRef<T>>): RefCallback<T>;
|
|
34
36
|
|
|
37
|
+
/**
|
|
38
|
+
* `null` as much as `undefined`: that is how `PressableProps` types its handlers, and a
|
|
39
|
+
* root forwarding what it was given should not have to launder them first.
|
|
40
|
+
*/
|
|
35
41
|
type PressHandlers = {
|
|
36
|
-
onPressIn?:
|
|
37
|
-
onPressOut?:
|
|
42
|
+
onPressIn?: PressHandler | null;
|
|
43
|
+
onPressOut?: PressHandler | null;
|
|
38
44
|
};
|
|
45
|
+
type PressHandler = (event: GestureResponderEvent) => void;
|
|
39
46
|
/**
|
|
40
47
|
* The press state a root owns, with the handlers that maintain it.
|
|
41
48
|
*
|
|
@@ -50,7 +57,10 @@ type PressHandlers = {
|
|
|
50
57
|
* <PressableFeedback isPressed={isPressed} {...pressHandlers} />
|
|
51
58
|
* ```
|
|
52
59
|
*/
|
|
53
|
-
declare function usePressState(handlers?: PressHandlers): [boolean,
|
|
60
|
+
declare function usePressState(handlers?: PressHandlers): [boolean, {
|
|
61
|
+
onPressIn: PressHandler;
|
|
62
|
+
onPressOut: PressHandler;
|
|
63
|
+
}];
|
|
54
64
|
|
|
55
65
|
/**
|
|
56
66
|
* The value from the render before this one, `undefined` on the first.
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
export { Button, ButtonContextValue, ButtonIconProps, ButtonLabelProps, ButtonProps, ButtonSize, ButtonSlot, ButtonSpinnerProps, ButtonVariant, buttonRecipe, useButton } from './components/button/index.js';
|
|
1
2
|
import { RefCallback } from 'react';
|
|
2
3
|
import { PossibleRef } from './system/index.js';
|
|
3
|
-
export {
|
|
4
|
+
export { AsChildProps, HIGHLIGHT_OPACITY, Icon, IconContext, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Slot, SlotProps, childrenToString, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.js';
|
|
4
5
|
import { GestureResponderEvent } from 'react-native';
|
|
6
|
+
export { A as AnimationConfig, c as AnimationProp, h as Axes, C as CompoundVariant, F as FeedbackContext, d as FeedbackVariant, I as IconComponentProps, a as IconContextValue, b as IconProps, P as PressableFeedbackProps, f as Recipe, i as RecipeConfig, g as ResolveArgs, R as ResolvedAnimation, j as ResolvedSelection, k as ResolvedStyles, l as Selection, S as SlotAnimation, m as SlotStyle, n as SlotStyles, o as StateName, p as States, q as StyleFn, T as TintArgs, V as VariantColors, r as VariantRole, s as VariantTokens, e as createRecipe } from './create-recipe-M99yoHrG.js';
|
|
5
7
|
export { ColorModePreference, PaletteFamily, PaletteShade, ThemeContext, XAUIProvider, XAUIProviderProps, XAUITint, buildRadius, buildShadows, createTheme, defaultTheme, deriveColors, deriveTint, palette, primitives, sourceKeys, tokens, useColorMode, useThemeColor, useXAUITheme } from './theme/index.js';
|
|
6
8
|
export { C as ColorMode, F as FontSizeKey, a as FontWeightKey, R as RadiusKey, S as Size, X as XAUIColors, b as XAUIDerivedColors, c as XAUIPrimitiveColors, d as XAUIRadius, e as XAUIShadow, f as XAUISourceColors, g as XAUITheme, h as XAUIThemeConfig, i as XAUIThemeSet } from './theme.type-C9bFJKFm.js';
|
|
7
9
|
import 'react-native-reanimated';
|
|
@@ -32,10 +34,15 @@ declare function useControllableState<T>({ value, defaultValue, onChange, }: Con
|
|
|
32
34
|
*/
|
|
33
35
|
declare function useMergedRef<T>(...refs: Array<PossibleRef<T>>): RefCallback<T>;
|
|
34
36
|
|
|
37
|
+
/**
|
|
38
|
+
* `null` as much as `undefined`: that is how `PressableProps` types its handlers, and a
|
|
39
|
+
* root forwarding what it was given should not have to launder them first.
|
|
40
|
+
*/
|
|
35
41
|
type PressHandlers = {
|
|
36
|
-
onPressIn?:
|
|
37
|
-
onPressOut?:
|
|
42
|
+
onPressIn?: PressHandler | null;
|
|
43
|
+
onPressOut?: PressHandler | null;
|
|
38
44
|
};
|
|
45
|
+
type PressHandler = (event: GestureResponderEvent) => void;
|
|
39
46
|
/**
|
|
40
47
|
* The press state a root owns, with the handlers that maintain it.
|
|
41
48
|
*
|
|
@@ -50,7 +57,10 @@ type PressHandlers = {
|
|
|
50
57
|
* <PressableFeedback isPressed={isPressed} {...pressHandlers} />
|
|
51
58
|
* ```
|
|
52
59
|
*/
|
|
53
|
-
declare function usePressState(handlers?: PressHandlers): [boolean,
|
|
60
|
+
declare function usePressState(handlers?: PressHandlers): [boolean, {
|
|
61
|
+
onPressIn: PressHandler;
|
|
62
|
+
onPressOut: PressHandler;
|
|
63
|
+
}];
|
|
54
64
|
|
|
55
65
|
/**
|
|
56
66
|
* The value from the render before this one, `undefined` on the first.
|
package/dist/index.js
CHANGED
|
@@ -1,12 +1,21 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Button,
|
|
3
|
+
buttonRecipe,
|
|
4
|
+
useButton,
|
|
5
|
+
usePressState,
|
|
6
|
+
warnDev
|
|
7
|
+
} from "./chunk-PBRPIZZ2.js";
|
|
8
|
+
import {
|
|
9
|
+
Portal,
|
|
10
|
+
PortalContext,
|
|
11
|
+
PortalHost
|
|
12
|
+
} from "./chunk-3TIDEII6.js";
|
|
1
13
|
import {
|
|
2
14
|
HIGHLIGHT_OPACITY,
|
|
3
15
|
Icon,
|
|
4
16
|
IconContext,
|
|
5
17
|
PRESS_DURATION,
|
|
6
18
|
PRESS_SCALE,
|
|
7
|
-
Portal,
|
|
8
|
-
PortalContext,
|
|
9
|
-
PortalHost,
|
|
10
19
|
PressableFeedback,
|
|
11
20
|
RELEASE_DURATION,
|
|
12
21
|
RIPPLE_COVERAGE,
|
|
@@ -22,7 +31,7 @@ import {
|
|
|
22
31
|
resolveSlotAnimation,
|
|
23
32
|
useFeedback,
|
|
24
33
|
useIconContext
|
|
25
|
-
} from "./chunk-
|
|
34
|
+
} from "./chunk-U3C6VN4X.js";
|
|
26
35
|
import {
|
|
27
36
|
XAUIProvider,
|
|
28
37
|
buildRadius,
|
|
@@ -34,7 +43,7 @@ import {
|
|
|
34
43
|
primitives,
|
|
35
44
|
sourceKeys,
|
|
36
45
|
tokens
|
|
37
|
-
} from "./chunk-
|
|
46
|
+
} from "./chunk-7XGOXTGT.js";
|
|
38
47
|
import {
|
|
39
48
|
ThemeContext,
|
|
40
49
|
deriveTint,
|
|
@@ -45,14 +54,6 @@ import {
|
|
|
45
54
|
|
|
46
55
|
// src/hooks/use-controllable-state.ts
|
|
47
56
|
import { useCallback, useRef, useState } from "react";
|
|
48
|
-
|
|
49
|
-
// src/utils/warn-dev.ts
|
|
50
|
-
function warnDev(message) {
|
|
51
|
-
if (typeof __DEV__ !== "undefined" && !__DEV__) return;
|
|
52
|
-
console.warn(`XAUI: ${message}`);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
// src/hooks/use-controllable-state.ts
|
|
56
57
|
function useControllableState({
|
|
57
58
|
value,
|
|
58
59
|
defaultValue,
|
|
@@ -92,34 +93,17 @@ function useMergedRef(...refs) {
|
|
|
92
93
|
return useMemo(() => mergeRefs(...refs), refs);
|
|
93
94
|
}
|
|
94
95
|
|
|
95
|
-
// src/hooks/use-press-state.ts
|
|
96
|
-
import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
|
|
97
|
-
function usePressState(handlers = {}) {
|
|
98
|
-
const [isPressed, setIsPressed] = useState2(false);
|
|
99
|
-
const latest = useRef2(handlers);
|
|
100
|
-
latest.current = handlers;
|
|
101
|
-
const onPressIn = useCallback2((event) => {
|
|
102
|
-
setIsPressed(true);
|
|
103
|
-
latest.current.onPressIn?.(event);
|
|
104
|
-
}, []);
|
|
105
|
-
const onPressOut = useCallback2((event) => {
|
|
106
|
-
setIsPressed(false);
|
|
107
|
-
latest.current.onPressOut?.(event);
|
|
108
|
-
}, []);
|
|
109
|
-
const press = useRef2({ onPressIn, onPressOut }).current;
|
|
110
|
-
return [isPressed, press];
|
|
111
|
-
}
|
|
112
|
-
|
|
113
96
|
// src/hooks/use-previous.ts
|
|
114
|
-
import { useEffect, useRef as
|
|
97
|
+
import { useEffect, useRef as useRef2 } from "react";
|
|
115
98
|
function usePrevious(value) {
|
|
116
|
-
const previous =
|
|
99
|
+
const previous = useRef2(void 0);
|
|
117
100
|
useEffect(() => {
|
|
118
101
|
previous.current = value;
|
|
119
102
|
}, [value]);
|
|
120
103
|
return previous.current;
|
|
121
104
|
}
|
|
122
105
|
export {
|
|
106
|
+
Button,
|
|
123
107
|
HIGHLIGHT_OPACITY,
|
|
124
108
|
Icon,
|
|
125
109
|
IconContext,
|
|
@@ -138,6 +122,7 @@ export {
|
|
|
138
122
|
XAUIProvider,
|
|
139
123
|
buildRadius,
|
|
140
124
|
buildShadows,
|
|
125
|
+
buttonRecipe,
|
|
141
126
|
childrenToString,
|
|
142
127
|
createRecipe,
|
|
143
128
|
createSlotContext,
|
|
@@ -153,6 +138,7 @@ export {
|
|
|
153
138
|
resolveSlotAnimation,
|
|
154
139
|
sourceKeys,
|
|
155
140
|
tokens,
|
|
141
|
+
useButton,
|
|
156
142
|
useColorMode,
|
|
157
143
|
useControllableState,
|
|
158
144
|
useFeedback,
|
package/dist/system/index.cjs
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
+
var _chunkLMUPNKPHcjs = require('../chunk-LMUPNKPH.cjs');
|
|
5
6
|
|
|
6
7
|
|
|
7
8
|
|
|
@@ -22,7 +23,8 @@
|
|
|
22
23
|
|
|
23
24
|
|
|
24
25
|
|
|
25
|
-
|
|
26
|
+
|
|
27
|
+
var _chunkVGWN4JTLcjs = require('../chunk-VGWN4JTL.cjs');
|
|
26
28
|
require('../chunk-3QBT3Q65.cjs');
|
|
27
29
|
|
|
28
30
|
|
|
@@ -48,4 +50,4 @@ require('../chunk-3QBT3Q65.cjs');
|
|
|
48
50
|
|
|
49
51
|
|
|
50
52
|
|
|
51
|
-
exports.HIGHLIGHT_OPACITY =
|
|
53
|
+
exports.HIGHLIGHT_OPACITY = _chunkVGWN4JTLcjs.HIGHLIGHT_OPACITY; exports.Icon = _chunkVGWN4JTLcjs.Icon; exports.IconContext = _chunkVGWN4JTLcjs.IconContext; exports.PRESS_DURATION = _chunkVGWN4JTLcjs.PRESS_DURATION; exports.PRESS_SCALE = _chunkVGWN4JTLcjs.PRESS_SCALE; exports.Portal = _chunkLMUPNKPHcjs.Portal; exports.PortalContext = _chunkLMUPNKPHcjs.PortalContext; exports.PortalHost = _chunkLMUPNKPHcjs.PortalHost; exports.PressableFeedback = _chunkVGWN4JTLcjs.PressableFeedback; exports.RELEASE_DURATION = _chunkVGWN4JTLcjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunkVGWN4JTLcjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunkVGWN4JTLcjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunkVGWN4JTLcjs.RIPPLE_OPACITY; exports.Slot = _chunkVGWN4JTLcjs.Slot; exports.childrenToString = _chunkVGWN4JTLcjs.childrenToString; exports.createRecipe = _chunkVGWN4JTLcjs.createRecipe; exports.createSlotContext = _chunkVGWN4JTLcjs.createSlotContext; exports.mergeProps = _chunkVGWN4JTLcjs.mergeProps; exports.mergeRefs = _chunkVGWN4JTLcjs.mergeRefs; exports.resolveAnimation = _chunkVGWN4JTLcjs.resolveAnimation; exports.resolveSlotAnimation = _chunkVGWN4JTLcjs.resolveSlotAnimation; exports.useFeedback = _chunkVGWN4JTLcjs.useFeedback; exports.useIconContext = _chunkVGWN4JTLcjs.useIconContext;
|