@xaui/native 0.9.1-alpha.25 → 0.9.1-alpha.27
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-2EBB5BO3.cjs +361 -0
- package/dist/chunk-3LKGVKQY.cjs +145 -0
- package/dist/{chunk-MRYLLKML.js → chunk-56KVKM27.js} +15 -15
- package/dist/{chunk-GSEK6OCY.cjs → chunk-5OXZIZRZ.cjs} +7 -7
- package/dist/{chunk-BULNTP5N.cjs → chunk-63TWVWHG.cjs} +9 -45
- package/dist/chunk-7EIHHOHP.cjs +42 -0
- package/dist/{chunk-EWBBDVTM.cjs → chunk-CQRUNV6S.cjs} +15 -15
- package/dist/chunk-F6W3JQ7K.js +42 -0
- package/dist/{chunk-YEW5LPWL.cjs → chunk-JCKVYYZO.cjs} +42 -4
- package/dist/chunk-LGVIZAB2.js +503 -0
- package/dist/{chunk-I6UCYAO2.js → chunk-N4UJYDOW.js} +23 -56
- package/dist/{chunk-ZDCGPK5Z.js → chunk-TR2TGPDQ.js} +1 -1
- package/dist/{chunk-2OY76YNB.js → chunk-V2FQN6ZK.js} +42 -4
- package/dist/chunk-WEMZ4VMC.js +145 -0
- package/dist/components/alert/index.cjs +1 -1
- package/dist/components/alert/index.d.cts +1 -1
- package/dist/components/alert/index.d.ts +1 -1
- package/dist/components/alert/index.js +1 -1
- package/dist/components/button/index.cjs +3 -3
- package/dist/components/button/index.d.cts +1 -1
- package/dist/components/button/index.d.ts +1 -1
- package/dist/components/button/index.js +2 -2
- package/dist/components/card/index.d.cts +1 -1
- package/dist/components/card/index.d.ts +1 -1
- package/dist/components/checkbox/index.cjs +23 -0
- package/dist/components/checkbox/index.d.cts +1137 -0
- package/dist/components/checkbox/index.d.ts +1137 -0
- package/dist/components/checkbox/index.js +23 -0
- package/dist/components/chip/index.cjs +3 -3
- package/dist/components/chip/index.d.cts +1 -1
- package/dist/components/chip/index.d.ts +1 -1
- package/dist/components/chip/index.js +2 -2
- package/dist/components/input/index.cjs +2 -2
- package/dist/components/input/index.d.cts +6 -6
- package/dist/components/input/index.d.ts +6 -6
- package/dist/components/input/index.js +1 -1
- package/dist/components/input-group/index.cjs +26 -0
- package/dist/components/input-group/index.d.cts +270 -0
- package/dist/components/input-group/index.d.ts +270 -0
- package/dist/components/input-group/index.js +26 -0
- package/dist/components/input-otp/index.cjs +3 -2
- package/dist/components/input-otp/index.d.cts +3 -3
- package/dist/components/input-otp/index.d.ts +3 -3
- package/dist/components/input-otp/index.js +2 -1
- package/dist/components/text-area/index.cjs +3 -3
- package/dist/components/text-area/index.d.cts +1 -1
- package/dist/components/text-area/index.d.ts +1 -1
- package/dist/components/text-area/index.js +2 -2
- package/dist/components/typography/index.d.cts +1 -1
- package/dist/components/typography/index.d.ts +1 -1
- package/dist/{create-recipe-dBN_ewZc.d.cts → create-recipe-CWvI5ot3.d.cts} +8 -1
- package/dist/{create-recipe-C4JkINrA.d.ts → create-recipe-DUo8doTt.d.ts} +8 -1
- package/dist/index.cjs +44 -10
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +57 -23
- package/dist/{input.type-BpJeUIe8.d.cts → input.type-BUMDlzL9.d.cts} +18 -2
- package/dist/{input.type-DjyZ6P2C.d.ts → input.type-D2qgi03E.d.ts} +18 -2
- package/dist/system/index.cjs +3 -3
- package/dist/system/index.d.cts +2 -2
- package/dist/system/index.d.ts +2 -2
- package/dist/system/index.js +5 -5
- package/package.json +21 -1
- package/dist/{chunk-4J26FA6O.js → chunk-EHARM2EN.js} +3 -3
- package/dist/{chunk-AV5LMFS3.cjs → chunk-H7DVR52Z.cjs} +3 -3
|
@@ -0,0 +1,361 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
|
+
|
|
3
|
+
var _chunk7EIHHOHPcjs = require('./chunk-7EIHHOHP.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
var _chunkIG4Q3WQOcjs = require('./chunk-IG4Q3WQO.cjs');
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
var _chunkYXVKQMCKcjs = require('./chunk-YXVKQMCK.cjs');
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
var _chunkHUZ4AUM2cjs = require('./chunk-HUZ4AUM2.cjs');
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
|
|
20
|
+
|
|
21
|
+
// src/components/checkbox/checkbox-indicator.tsx
|
|
22
|
+
var _react = require('react');
|
|
23
|
+
var _reactnative = require('react-native');
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
var _reactnativereanimated = require('react-native-reanimated'); var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
|
|
29
|
+
|
|
30
|
+
// src/components/checkbox/checkbox.context.ts
|
|
31
|
+
var [CheckboxProvider, useCheckbox] = _chunkHUZ4AUM2cjs.createSlotContext.call(void 0, "Checkbox");
|
|
32
|
+
|
|
33
|
+
// src/components/checkbox/checkbox-indicator.tsx
|
|
34
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
35
|
+
var DURATION = 120;
|
|
36
|
+
var FROM_SCALE = 0.8;
|
|
37
|
+
var CheckboxIndicator = _react.forwardRef.call(void 0,
|
|
38
|
+
function CheckboxIndicator2({ children, animation = true, style, ...props }, ref) {
|
|
39
|
+
const { indicatorStyle, isSelected, isIndeterminate } = useCheckbox();
|
|
40
|
+
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
41
|
+
const isFilled = isSelected || isIndeterminate;
|
|
42
|
+
const mark = _nullishCoalesce(children, () => ( (isIndeterminate ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Dash, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Check, {}))));
|
|
43
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: [indicatorStyle, styleProps, style], children: animation ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AnimatedFill, { isSelected: isFilled, children: mark }) : isFilled && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StaticFill, { children: mark }) });
|
|
44
|
+
}
|
|
45
|
+
);
|
|
46
|
+
CheckboxIndicator.displayName = "XAUI.Checkbox.Indicator";
|
|
47
|
+
function AnimatedFill({
|
|
48
|
+
isSelected,
|
|
49
|
+
children
|
|
50
|
+
}) {
|
|
51
|
+
const { fillStyle } = useCheckbox();
|
|
52
|
+
const progress = _reactnativereanimated.useDerivedValue.call(void 0,
|
|
53
|
+
() => _reactnativereanimated.withTiming.call(void 0, isSelected ? 1 : 0, { duration: DURATION }),
|
|
54
|
+
[isSelected]
|
|
55
|
+
);
|
|
56
|
+
const animatedStyle = _reactnativereanimated.useAnimatedStyle.call(void 0, () => ({
|
|
57
|
+
opacity: progress.value,
|
|
58
|
+
transform: [{ scale: FROM_SCALE + (1 - FROM_SCALE) * progress.value }]
|
|
59
|
+
}));
|
|
60
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, { style: [fillStyle, animatedStyle], children });
|
|
61
|
+
}
|
|
62
|
+
function StaticFill({ children }) {
|
|
63
|
+
const { fillStyle } = useCheckbox();
|
|
64
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: fillStyle, children });
|
|
65
|
+
}
|
|
66
|
+
function Check() {
|
|
67
|
+
const { checkStyle } = useCheckbox();
|
|
68
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: checkStyle });
|
|
69
|
+
}
|
|
70
|
+
function Dash() {
|
|
71
|
+
const { dashStyle } = useCheckbox();
|
|
72
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: dashStyle });
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
// src/components/checkbox/checkbox-label.tsx
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
var CheckboxLabel = _react.forwardRef.call(void 0,
|
|
80
|
+
function CheckboxLabel2({ children, style, ...props }, ref) {
|
|
81
|
+
const { labelStyle } = useCheckbox();
|
|
82
|
+
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
83
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.Text, { ref, style: [labelStyle, styleProps, style], ...rest, children });
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
CheckboxLabel.displayName = "XAUI.Checkbox.Label";
|
|
87
|
+
|
|
88
|
+
// src/components/checkbox/checkbox.tsx
|
|
89
|
+
|
|
90
|
+
|
|
91
|
+
// src/components/checkbox/checkbox.recipe.ts
|
|
92
|
+
var SLOTS = ["root", "indicator", "fill", "check", "dash", "label"];
|
|
93
|
+
var VARIANT_TOKENS = {
|
|
94
|
+
primary: {
|
|
95
|
+
bg: "fieldBackground",
|
|
96
|
+
border: "fieldBorder",
|
|
97
|
+
bgSelected: "accent",
|
|
98
|
+
fgSelected: "accentForeground"
|
|
99
|
+
},
|
|
100
|
+
// `bg: 'default'` is the neutral *token*, not this variant's name — the two namespaces
|
|
101
|
+
// meet here as they do on the `Input`, and for the same reason: on a card,
|
|
102
|
+
// `fieldBackground` is the card's own colour and the box would vanish into it.
|
|
103
|
+
secondary: {
|
|
104
|
+
bg: "default",
|
|
105
|
+
border: "fieldBorder",
|
|
106
|
+
bgSelected: "accent",
|
|
107
|
+
fgSelected: "accentForeground"
|
|
108
|
+
},
|
|
109
|
+
tertiary: {
|
|
110
|
+
border: "fieldBorder",
|
|
111
|
+
bgSelected: "accent",
|
|
112
|
+
fgSelected: "accentForeground"
|
|
113
|
+
}
|
|
114
|
+
};
|
|
115
|
+
function sizeAxis(step) {
|
|
116
|
+
const { box, radius, label, gap, stroke } = step;
|
|
117
|
+
return (theme) => {
|
|
118
|
+
const side = theme.spacing(box);
|
|
119
|
+
return {
|
|
120
|
+
root: { gap: theme.spacing(gap) },
|
|
121
|
+
indicator: { width: side, height: side, borderRadius: theme.radius[radius] },
|
|
122
|
+
check: {
|
|
123
|
+
width: side * CHECK_WIDTH,
|
|
124
|
+
height: side * CHECK_HEIGHT,
|
|
125
|
+
borderStartWidth: stroke,
|
|
126
|
+
borderBottomWidth: stroke,
|
|
127
|
+
// An "L" has its ink in one corner, not in the middle of its box, so rotating it
|
|
128
|
+
// about that box's centre leaves the tick sitting low. Rotating by −45° maps a
|
|
129
|
+
// point to `(dy − dx)·√2/2`, and over the two strokes that spans `H` at the top
|
|
130
|
+
// and `H − t − W` at the bottom — an ink centre `(H − t)·√2/4` **below** the box
|
|
131
|
+
// centre, which flexbox then dutifully centres. Lifting by exactly that is what
|
|
132
|
+
// makes the mark look centred rather than measure centred.
|
|
133
|
+
//
|
|
134
|
+
// Both transforms live here, and not half here and half in a sheet, because
|
|
135
|
+
// `transform` is a whole value: the recipe's merge replaces it rather than
|
|
136
|
+
// blending, so a second step would drop the first.
|
|
137
|
+
transform: [
|
|
138
|
+
{ translateY: -((side * CHECK_HEIGHT - stroke) * Math.SQRT2) / 4 },
|
|
139
|
+
{ rotate: "-45deg" }
|
|
140
|
+
]
|
|
141
|
+
},
|
|
142
|
+
// The third state's mark: the check's long stroke, on its own and level.
|
|
143
|
+
dash: {
|
|
144
|
+
width: side * CHECK_WIDTH,
|
|
145
|
+
height: stroke,
|
|
146
|
+
borderRadius: stroke / 2
|
|
147
|
+
},
|
|
148
|
+
label: {
|
|
149
|
+
fontSize: theme.fontSizes[label],
|
|
150
|
+
lineHeight: theme.lineHeights[label]
|
|
151
|
+
}
|
|
152
|
+
};
|
|
153
|
+
};
|
|
154
|
+
}
|
|
155
|
+
var CHECK_WIDTH = 0.5;
|
|
156
|
+
var CHECK_HEIGHT = 0.25;
|
|
157
|
+
var SIZES = {
|
|
158
|
+
sm: { box: 5, radius: "sm", gap: 2, label: "sm", stroke: 2 },
|
|
159
|
+
md: { box: 6, radius: "md", gap: 2, label: "md", stroke: 2 },
|
|
160
|
+
lg: { box: 7, radius: "md", gap: 2.5, label: "lg", stroke: 2.5 }
|
|
161
|
+
};
|
|
162
|
+
var checkboxRecipe = _chunkYXVKQMCKcjs.createRecipe.call(void 0, {
|
|
163
|
+
slots: SLOTS,
|
|
164
|
+
base: (theme) => ({
|
|
165
|
+
root: { flexDirection: "row", alignItems: "center", alignSelf: "flex-start" },
|
|
166
|
+
indicator: {
|
|
167
|
+
alignItems: "center",
|
|
168
|
+
justifyContent: "center",
|
|
169
|
+
borderWidth: theme.borderWidth.field,
|
|
170
|
+
borderCurve: "continuous",
|
|
171
|
+
// The fill is laid inside the box and has to stop at its corners.
|
|
172
|
+
overflow: "hidden"
|
|
173
|
+
},
|
|
174
|
+
// Laid over the box rather than sized to it: the two corners are the indicator's, and
|
|
175
|
+
// an inset of zero is what keeps the fill inside the border it is clipped by.
|
|
176
|
+
fill: {
|
|
177
|
+
position: "absolute",
|
|
178
|
+
top: 0,
|
|
179
|
+
bottom: 0,
|
|
180
|
+
start: 0,
|
|
181
|
+
end: 0,
|
|
182
|
+
alignItems: "center",
|
|
183
|
+
justifyContent: "center"
|
|
184
|
+
},
|
|
185
|
+
label: {
|
|
186
|
+
fontFamily: theme.fontFamilies.body,
|
|
187
|
+
color: theme.colors.foreground
|
|
188
|
+
}
|
|
189
|
+
}),
|
|
190
|
+
variantTokens: VARIANT_TOKENS,
|
|
191
|
+
/**
|
|
192
|
+
* Where the variant's colours land. The border width follows the *presence* of the
|
|
193
|
+
* border role, exactly as on the `Input`.
|
|
194
|
+
*
|
|
195
|
+
* `bgSelected` and `fgSelected` are painted unconditionally, on two slots the indicator
|
|
196
|
+
* only mounts while it is ticked — which is what keeps selection out of the cache key
|
|
197
|
+
* and inside the tint pass at the same time. An axis would have given up the second.
|
|
198
|
+
*/
|
|
199
|
+
paint: (theme, colors) => ({
|
|
200
|
+
indicator: {
|
|
201
|
+
backgroundColor: colors.bg,
|
|
202
|
+
borderColor: colors.border,
|
|
203
|
+
borderWidth: colors.border ? theme.borderWidth.field : 0
|
|
204
|
+
},
|
|
205
|
+
fill: { backgroundColor: colors.bgSelected },
|
|
206
|
+
check: { borderColor: colors.fgSelected },
|
|
207
|
+
dash: { backgroundColor: colors.fgSelected }
|
|
208
|
+
}),
|
|
209
|
+
variants: {
|
|
210
|
+
size: {
|
|
211
|
+
sm: sizeAxis(SIZES.sm),
|
|
212
|
+
md: sizeAxis(SIZES.md),
|
|
213
|
+
lg: sizeAxis(SIZES.lg)
|
|
214
|
+
},
|
|
215
|
+
radius: _chunkYXVKQMCKcjs.radiusAxis.call(void 0, "indicator"),
|
|
216
|
+
/**
|
|
217
|
+
* Declared after `size` so its border wins. The resting fill is dropped rather than
|
|
218
|
+
* repainted — `undefined` over a colour is what RN reads as "no background" — because
|
|
219
|
+
* a box that is wrong should read as an outline, not as a filled control that happens
|
|
220
|
+
* to be red at the edge. HeroUI reaches the same shape with a compound.
|
|
221
|
+
*/
|
|
222
|
+
isInvalid: {
|
|
223
|
+
true: (theme) => ({
|
|
224
|
+
indicator: { borderColor: theme.colors.danger, backgroundColor: void 0 },
|
|
225
|
+
fill: { backgroundColor: theme.colors.danger },
|
|
226
|
+
check: { borderColor: theme.colors.dangerForeground },
|
|
227
|
+
dash: { backgroundColor: theme.colors.dangerForeground },
|
|
228
|
+
// The label turns with it: on a long form the field that is wrong has to be
|
|
229
|
+
// findable without reading every message.
|
|
230
|
+
label: { color: theme.colors.danger }
|
|
231
|
+
})
|
|
232
|
+
}
|
|
233
|
+
},
|
|
234
|
+
/** What `primary` adds to a filled box — the `Input`'s compound, on a smaller field. */
|
|
235
|
+
compoundVariants: [
|
|
236
|
+
{
|
|
237
|
+
when: { variant: "primary" },
|
|
238
|
+
style: (theme) => ({ indicator: theme.shadows.field })
|
|
239
|
+
}
|
|
240
|
+
],
|
|
241
|
+
states: {
|
|
242
|
+
disabled: (theme) => ({ root: { opacity: theme.opacity.disabled } })
|
|
243
|
+
},
|
|
244
|
+
defaultVariants: { variant: "secondary", size: "md" }
|
|
245
|
+
});
|
|
246
|
+
|
|
247
|
+
// src/components/checkbox/checkbox.tsx
|
|
248
|
+
|
|
249
|
+
var CheckboxRoot = _react.forwardRef.call(void 0, function Checkbox({
|
|
250
|
+
children,
|
|
251
|
+
variant,
|
|
252
|
+
size,
|
|
253
|
+
radius,
|
|
254
|
+
color,
|
|
255
|
+
isSelected,
|
|
256
|
+
defaultSelected = false,
|
|
257
|
+
onSelectedChange,
|
|
258
|
+
isIndeterminate = false,
|
|
259
|
+
isInvalid = false,
|
|
260
|
+
isDisabled = false,
|
|
261
|
+
asChild = false,
|
|
262
|
+
accessibilityRole,
|
|
263
|
+
accessibilityState,
|
|
264
|
+
animation,
|
|
265
|
+
style,
|
|
266
|
+
onPress,
|
|
267
|
+
onPressIn,
|
|
268
|
+
onPressOut,
|
|
269
|
+
...props
|
|
270
|
+
}, ref) {
|
|
271
|
+
const theme = _chunk57SJ4LJFcjs.useXAUITheme.call(void 0, );
|
|
272
|
+
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
273
|
+
const [isPressed, press] = _chunkIG4Q3WQOcjs.usePressState.call(void 0, { onPressIn, onPressOut });
|
|
274
|
+
const [selected, setSelected] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
|
|
275
|
+
value: isSelected,
|
|
276
|
+
defaultValue: defaultSelected,
|
|
277
|
+
onChange: onSelectedChange
|
|
278
|
+
});
|
|
279
|
+
const handlePress = _react.useCallback.call(void 0,
|
|
280
|
+
(event) => {
|
|
281
|
+
setSelected((current) => isIndeterminate ? true : !current);
|
|
282
|
+
_optionalChain([onPress, 'optionalCall', _ => _(event)]);
|
|
283
|
+
},
|
|
284
|
+
[setSelected, isIndeterminate, onPress]
|
|
285
|
+
);
|
|
286
|
+
const selection = {
|
|
287
|
+
variant,
|
|
288
|
+
size,
|
|
289
|
+
radius,
|
|
290
|
+
isInvalid: isInvalid ? "true" : void 0
|
|
291
|
+
};
|
|
292
|
+
const states = { pressed: isPressed, disabled: isDisabled };
|
|
293
|
+
const styles = checkboxRecipe.resolve({ theme, selection, states });
|
|
294
|
+
const tint = color && !isInvalid ? checkboxRecipe.tint({ theme, color, selection, states }) : void 0;
|
|
295
|
+
const context = _react.useMemo.call(void 0,
|
|
296
|
+
() => ({
|
|
297
|
+
indicatorStyle: tint ? [styles.indicator, tint.indicator] : styles.indicator,
|
|
298
|
+
fillStyle: tint ? [styles.fill, tint.fill] : styles.fill,
|
|
299
|
+
checkStyle: tint ? [styles.check, tint.check] : styles.check,
|
|
300
|
+
dashStyle: tint ? [styles.dash, tint.dash] : styles.dash,
|
|
301
|
+
labelStyle: styles.label,
|
|
302
|
+
isSelected: selected,
|
|
303
|
+
isIndeterminate,
|
|
304
|
+
isDisabled,
|
|
305
|
+
isInvalid
|
|
306
|
+
}),
|
|
307
|
+
[styles, tint, selected, isIndeterminate, isDisabled, isInvalid]
|
|
308
|
+
);
|
|
309
|
+
const rootStyle = [
|
|
310
|
+
styles.root,
|
|
311
|
+
_optionalChain([tint, 'optionalAccess', _2 => _2.root]),
|
|
312
|
+
styleProps,
|
|
313
|
+
typeof style === "function" ? style({ pressed: isPressed }) : style
|
|
314
|
+
];
|
|
315
|
+
const text = _chunkHUZ4AUM2cjs.childrenToString.call(void 0, children);
|
|
316
|
+
const content = text !== null ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
|
|
317
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxIndicator, {}),
|
|
318
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxLabel, { children: text })
|
|
319
|
+
] }) : _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxIndicator, {})));
|
|
320
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
321
|
+
_chunkIG4Q3WQOcjs.PressableFeedback,
|
|
322
|
+
{
|
|
323
|
+
ref,
|
|
324
|
+
isPressed,
|
|
325
|
+
isDisabled,
|
|
326
|
+
asChild,
|
|
327
|
+
animation,
|
|
328
|
+
accessibilityRole: _nullishCoalesce(accessibilityRole, () => ( "checkbox")),
|
|
329
|
+
accessibilityState: {
|
|
330
|
+
// `'mixed'` is the platform's own word for the third state, and it is the only
|
|
331
|
+
// thing that tells a screen reader this box speaks for rows it cannot see.
|
|
332
|
+
checked: isIndeterminate ? "mixed" : selected,
|
|
333
|
+
disabled: isDisabled,
|
|
334
|
+
...accessibilityState
|
|
335
|
+
},
|
|
336
|
+
"aria-invalid": isInvalid,
|
|
337
|
+
...rest,
|
|
338
|
+
style: rootStyle,
|
|
339
|
+
onPress: handlePress,
|
|
340
|
+
onPressIn: press.onPressIn,
|
|
341
|
+
onPressOut: press.onPressOut,
|
|
342
|
+
children: asChild ? children : content
|
|
343
|
+
}
|
|
344
|
+
) });
|
|
345
|
+
});
|
|
346
|
+
CheckboxRoot.displayName = "XAUI.Checkbox.Root";
|
|
347
|
+
|
|
348
|
+
// src/components/checkbox/index.ts
|
|
349
|
+
var Checkbox2 = Object.assign(CheckboxRoot, {
|
|
350
|
+
Indicator: CheckboxIndicator,
|
|
351
|
+
Label: CheckboxLabel
|
|
352
|
+
});
|
|
353
|
+
|
|
354
|
+
|
|
355
|
+
|
|
356
|
+
|
|
357
|
+
|
|
358
|
+
|
|
359
|
+
|
|
360
|
+
|
|
361
|
+
exports.useCheckbox = useCheckbox; exports.CheckboxIndicator = CheckboxIndicator; exports.CheckboxLabel = CheckboxLabel; exports.checkboxRecipe = checkboxRecipe; exports.CheckboxRoot = CheckboxRoot; exports.Checkbox = Checkbox2;
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
|
+
|
|
3
|
+
var _chunkB4W2XNBPcjs = require('./chunk-B4W2XNBP.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
var _chunkJCKVYYZOcjs = require('./chunk-JCKVYYZO.cjs');
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
var _chunkHUZ4AUM2cjs = require('./chunk-HUZ4AUM2.cjs');
|
|
13
|
+
|
|
14
|
+
// src/components/input-group/input-group-field.tsx
|
|
15
|
+
var _react = require('react');
|
|
16
|
+
|
|
17
|
+
// src/components/input-group/input-group.context.ts
|
|
18
|
+
var [InputGroupProvider, useInputGroup] = _chunkHUZ4AUM2cjs.createSlotContext.call(void 0, "InputGroup");
|
|
19
|
+
|
|
20
|
+
// src/components/input-group/input-group.utils.ts
|
|
21
|
+
function decoratorPadding(prefixWidth, suffixWidth) {
|
|
22
|
+
const paddingStart = prefixWidth > 0 ? prefixWidth : void 0;
|
|
23
|
+
const paddingEnd = suffixWidth > 0 ? suffixWidth : void 0;
|
|
24
|
+
if (paddingStart === void 0 && paddingEnd === void 0) return void 0;
|
|
25
|
+
return { paddingStart, paddingEnd };
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
// src/components/input-group/input-group-field.tsx
|
|
29
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
30
|
+
var InputGroupField = _react.forwardRef.call(void 0,
|
|
31
|
+
function InputGroupField2({ style, ...props }, ref) {
|
|
32
|
+
const { prefixWidth, suffixWidth } = useInputGroup();
|
|
33
|
+
const padding = _react.useMemo.call(void 0,
|
|
34
|
+
() => decoratorPadding(prefixWidth, suffixWidth),
|
|
35
|
+
[prefixWidth, suffixWidth]
|
|
36
|
+
);
|
|
37
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJCKVYYZOcjs.InputField, { ref, ...props, style: [padding, style] });
|
|
38
|
+
}
|
|
39
|
+
);
|
|
40
|
+
InputGroupField.displayName = "XAUI.InputGroup.Field";
|
|
41
|
+
|
|
42
|
+
// src/components/input-group/input-group-icon.tsx
|
|
43
|
+
|
|
44
|
+
function InputGroupIcon({ size, color, ...rest }) {
|
|
45
|
+
const { icon } = _chunkJCKVYYZOcjs.useInput.call(void 0, );
|
|
46
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB4W2XNBPcjs.Icon, { size: _nullishCoalesce(size, () => ( icon.size)), color: _nullishCoalesce(color, () => ( icon.color)), ...rest });
|
|
47
|
+
}
|
|
48
|
+
InputGroupIcon.displayName = "XAUI.InputGroup.Icon";
|
|
49
|
+
|
|
50
|
+
// src/components/input-group/input-group-prefix.tsx
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
// src/components/input-group/input-group-decorator.tsx
|
|
54
|
+
|
|
55
|
+
var _reactnative = require('react-native');
|
|
56
|
+
|
|
57
|
+
var InputGroupDecorator = _react.forwardRef.call(void 0,
|
|
58
|
+
function InputGroupDecorator2({ side, children, isDecorative = false, onLayout, style, ...props }, ref) {
|
|
59
|
+
const { prefixStyle, suffixStyle, isDisabled } = _chunkJCKVYYZOcjs.useInput.call(void 0, );
|
|
60
|
+
const { setPrefixWidth, setSuffixWidth } = useInputGroup();
|
|
61
|
+
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
62
|
+
const report = side === "prefix" ? setPrefixWidth : setSuffixWidth;
|
|
63
|
+
const handleLayout = _react.useCallback.call(void 0,
|
|
64
|
+
(event) => {
|
|
65
|
+
report(event.nativeEvent.layout.width);
|
|
66
|
+
_optionalChain([onLayout, 'optionalCall', _ => _(event)]);
|
|
67
|
+
},
|
|
68
|
+
[report, onLayout]
|
|
69
|
+
);
|
|
70
|
+
const isInert = isDecorative || isDisabled;
|
|
71
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
72
|
+
_reactnative.View,
|
|
73
|
+
{
|
|
74
|
+
ref,
|
|
75
|
+
accessibilityElementsHidden: isDecorative || void 0,
|
|
76
|
+
importantForAccessibility: isDecorative ? "no-hide-descendants" : void 0,
|
|
77
|
+
pointerEvents: isInert ? "none" : void 0,
|
|
78
|
+
...rest,
|
|
79
|
+
style: [side === "prefix" ? prefixStyle : suffixStyle, styleProps, style],
|
|
80
|
+
onLayout: handleLayout,
|
|
81
|
+
children
|
|
82
|
+
}
|
|
83
|
+
);
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
InputGroupDecorator.displayName = "XAUI.InputGroup.Decorator";
|
|
87
|
+
|
|
88
|
+
// src/components/input-group/input-group-prefix.tsx
|
|
89
|
+
|
|
90
|
+
var InputGroupPrefix = _react.forwardRef.call(void 0,
|
|
91
|
+
function InputGroupPrefix2(props, ref) {
|
|
92
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InputGroupDecorator, { ref, side: "prefix", ...props });
|
|
93
|
+
}
|
|
94
|
+
);
|
|
95
|
+
InputGroupPrefix.displayName = "XAUI.InputGroup.Prefix";
|
|
96
|
+
|
|
97
|
+
// src/components/input-group/input-group-suffix.tsx
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
var InputGroupSuffix = _react.forwardRef.call(void 0,
|
|
101
|
+
function InputGroupSuffix2(props, ref) {
|
|
102
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InputGroupDecorator, { ref, side: "suffix", ...props });
|
|
103
|
+
}
|
|
104
|
+
);
|
|
105
|
+
InputGroupSuffix.displayName = "XAUI.InputGroup.Suffix";
|
|
106
|
+
|
|
107
|
+
// src/components/input-group/input-group.tsx
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
var InputGroupRoot = _react.forwardRef.call(void 0, function InputGroup({ children, asChild = false, style, ...props }, ref) {
|
|
112
|
+
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
113
|
+
const [prefixWidth, setPrefixWidth] = _react.useState.call(void 0, 0);
|
|
114
|
+
const [suffixWidth, setSuffixWidth] = _react.useState.call(void 0, 0);
|
|
115
|
+
const context = _react.useMemo.call(void 0,
|
|
116
|
+
() => ({ prefixWidth, suffixWidth, setPrefixWidth, setSuffixWidth }),
|
|
117
|
+
[prefixWidth, suffixWidth]
|
|
118
|
+
);
|
|
119
|
+
const rootStyle = [styleProps, style];
|
|
120
|
+
const surface = asChild ? (
|
|
121
|
+
// R12 — the caller's element *is* the row.
|
|
122
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHUZ4AUM2cjs.Slot, { ref, ...rest, style: rootStyle, children })
|
|
123
|
+
) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: rootStyle, children });
|
|
124
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InputGroupProvider, { value: context, children: surface });
|
|
125
|
+
});
|
|
126
|
+
InputGroupRoot.displayName = "XAUI.InputGroup.Root";
|
|
127
|
+
|
|
128
|
+
// src/components/input-group/index.ts
|
|
129
|
+
var InputGroup2 = Object.assign(InputGroupRoot, {
|
|
130
|
+
Prefix: InputGroupPrefix,
|
|
131
|
+
Field: InputGroupField,
|
|
132
|
+
Suffix: InputGroupSuffix,
|
|
133
|
+
Icon: InputGroupIcon
|
|
134
|
+
});
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
exports.useInputGroup = useInputGroup; exports.decoratorPadding = decoratorPadding; exports.InputGroupField = InputGroupField; exports.InputGroupIcon = InputGroupIcon; exports.InputGroupPrefix = InputGroupPrefix; exports.InputGroupSuffix = InputGroupSuffix; exports.InputGroupRoot = InputGroupRoot; exports.InputGroup = InputGroup2;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { Icon } from "./chunk-ICR42HHG.js";
|
|
2
1
|
import { PressableFeedback, usePressState } from "./chunk-4HELPMAK.js";
|
|
3
2
|
import { warnDev } from "./chunk-EGLLDKN6.js";
|
|
3
|
+
import { Icon } from "./chunk-ICR42HHG.js";
|
|
4
4
|
import { createRecipe, radiusAxis } from "./chunk-3JATAB7S.js";
|
|
5
5
|
import { childrenToString, createSlotContext, useStyleProps } from "./chunk-PMO62QK4.js";
|
|
6
6
|
import { useXAUITheme } from "./chunk-A3EGFI6T.js";
|
|
@@ -74,10 +74,10 @@ function ButtonSpinner({
|
|
|
74
74
|
});
|
|
75
75
|
}
|
|
76
76
|
ButtonSpinner.displayName = "XAUI.Button.Spinner";
|
|
77
|
-
const
|
|
78
|
-
code: "function
|
|
79
|
-
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-
|
|
80
|
-
sourceMap: "{\"version\":3,\"names\":[\"
|
|
77
|
+
const _worklet_633469242714_init_data = {
|
|
78
|
+
code: "function chunk56KVKM27Js1(){const{angle}=this.__closure;return{transform:[{rotate:angle.value+\"deg\"}]};}",
|
|
79
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-56KVKM27.js",
|
|
80
|
+
sourceMap: "{\"version\":3,\"names\":[\"chunk56KVKM27Js1\",\"angle\",\"__closure\",\"transform\",\"rotate\",\"value\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-56KVKM27.js\"],\"mappings\":\"AAqFyC,SAAAA,gBAAMA,CAAA,QAAAC,KAAA,OAAAC,SAAA,CAE3C,MAAO,CAAEC,SAAS,CAAE,CAAC,CAAEC,MAAM,CAAKH,KAAK,CAACI,KAAK,MAAM,CAAC,CAAE,CAAC,CACzD\",\"ignoreList\":[]}"
|
|
81
81
|
};
|
|
82
82
|
function SpinningRing({
|
|
83
83
|
style
|
|
@@ -90,28 +90,28 @@ function SpinningRing({
|
|
|
90
90
|
}), -1, false);
|
|
91
91
|
return () => cancelAnimation(angle);
|
|
92
92
|
}, [angle]);
|
|
93
|
-
const animatedStyle = useAnimatedStyle(function
|
|
94
|
-
|
|
93
|
+
const animatedStyle = useAnimatedStyle(function chunk56KVKM27Js1Factory({
|
|
94
|
+
_worklet_633469242714_init_data,
|
|
95
95
|
angle
|
|
96
96
|
}) {
|
|
97
97
|
const _e = [new global.Error(), -2, -27];
|
|
98
|
-
const
|
|
98
|
+
const chunk56KVKM27Js1 = function () {
|
|
99
99
|
return {
|
|
100
100
|
transform: [{
|
|
101
101
|
rotate: `${angle.value}deg`
|
|
102
102
|
}]
|
|
103
103
|
};
|
|
104
104
|
};
|
|
105
|
-
|
|
105
|
+
chunk56KVKM27Js1.__closure = {
|
|
106
106
|
angle
|
|
107
107
|
};
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
return
|
|
108
|
+
chunk56KVKM27Js1.__workletHash = 633469242714;
|
|
109
|
+
chunk56KVKM27Js1.__pluginVersion = "0.7.4";
|
|
110
|
+
chunk56KVKM27Js1.__initData = _worklet_633469242714_init_data;
|
|
111
|
+
chunk56KVKM27Js1.__stackDetails = _e;
|
|
112
|
+
return chunk56KVKM27Js1;
|
|
113
113
|
}({
|
|
114
|
-
|
|
114
|
+
_worklet_633469242714_init_data,
|
|
115
115
|
angle
|
|
116
116
|
}), [angle]);
|
|
117
117
|
return /* @__PURE__ */jsx3(Animated.View, {
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _chunkJCKVYYZOcjs = require('./chunk-JCKVYYZO.cjs');
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
@@ -21,7 +21,7 @@ var [TextAreaProvider, useTextArea] = _chunkHUZ4AUM2cjs.createSlotContext.call(v
|
|
|
21
21
|
var _jsxruntime = require('react/jsx-runtime');
|
|
22
22
|
var TextAreaField = _react.forwardRef.call(void 0,
|
|
23
23
|
function TextAreaField2({ style, scrollEnabled, ...props }, ref) {
|
|
24
|
-
const { textAreaStyle, textArea } =
|
|
24
|
+
const { textAreaStyle, textArea } = _chunkJCKVYYZOcjs.useInput.call(void 0, );
|
|
25
25
|
const { rows, maxRows } = useTextArea();
|
|
26
26
|
const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
|
|
27
27
|
const height = _react.useMemo.call(void 0, () => {
|
|
@@ -35,7 +35,7 @@ var TextAreaField = _react.forwardRef.call(void 0,
|
|
|
35
35
|
};
|
|
36
36
|
}, [rows, maxRows, textArea]);
|
|
37
37
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
38
|
-
|
|
38
|
+
_chunkJCKVYYZOcjs.InputField,
|
|
39
39
|
{
|
|
40
40
|
ref,
|
|
41
41
|
multiline: true,
|
|
@@ -54,16 +54,16 @@ TextAreaField.displayName = "XAUI.TextArea.Field";
|
|
|
54
54
|
var DEFAULT_ROWS = 3;
|
|
55
55
|
var TextAreaRoot = _react.forwardRef.call(void 0, function TextArea({ rows = DEFAULT_ROWS, maxRows, children, ...props }, ref) {
|
|
56
56
|
const context = _react.useMemo.call(void 0, () => ({ rows, maxRows }), [rows, maxRows]);
|
|
57
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TextAreaProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
57
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TextAreaProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJCKVYYZOcjs.InputRoot, { ref, ...props, children }) });
|
|
58
58
|
});
|
|
59
59
|
TextAreaRoot.displayName = "XAUI.TextArea.Root";
|
|
60
60
|
|
|
61
61
|
// src/components/text-area/index.ts
|
|
62
62
|
var TextArea2 = Object.assign(TextAreaRoot, {
|
|
63
|
-
Label:
|
|
63
|
+
Label: _chunkJCKVYYZOcjs.InputLabel,
|
|
64
64
|
Field: TextAreaField,
|
|
65
|
-
Description:
|
|
66
|
-
Error:
|
|
65
|
+
Description: _chunkJCKVYYZOcjs.InputDescription,
|
|
66
|
+
Error: _chunkJCKVYYZOcjs.InputError
|
|
67
67
|
});
|
|
68
68
|
|
|
69
69
|
|