@xaui/native 0.9.1-alpha.3 → 0.9.1-alpha.30
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-27ZRTZEE.js +293 -0
- package/dist/chunk-3FV4COTM.js +68 -0
- package/dist/chunk-423RQBOX.js +21 -0
- package/dist/chunk-4GTAZM2C.js +174 -0
- package/dist/chunk-4XPLPQLM.cjs +147 -0
- package/dist/{chunk-3QBT3Q65.cjs → chunk-57SJ4LJF.cjs} +7 -2
- package/dist/chunk-5GO7MAVY.cjs +74 -0
- package/dist/chunk-5RQ7AZPN.cjs +455 -0
- package/dist/chunk-5Z4P6WHR.cjs +525 -0
- package/dist/chunk-6RVCGLKZ.js +661 -0
- package/dist/chunk-7DPL3ZDS.cjs +21 -0
- package/dist/chunk-7EIHHOHP.cjs +42 -0
- package/dist/chunk-7SEZGVTY.js +62 -0
- package/dist/chunk-7XKQJQF2.cjs +70 -0
- package/dist/{chunk-X2K2FX3W.js → chunk-A3EGFI6T.js} +6 -1
- package/dist/chunk-A5OCK3C2.js +525 -0
- package/dist/chunk-BA2DBSAN.js +102 -0
- package/dist/chunk-BFMTUMTU.js +669 -0
- package/dist/chunk-BVJQ3UPZ.js +62 -0
- package/dist/chunk-DFME724B.js +147 -0
- package/dist/chunk-E2CWBQTV.js +119 -0
- package/dist/chunk-E4TS6632.cjs +314 -0
- package/dist/chunk-EGLLDKN6.js +9 -0
- package/dist/chunk-EJQCQPET.cjs +9 -0
- package/dist/chunk-F6CQ6CBI.cjs +112 -0
- package/dist/chunk-F6W3JQ7K.js +42 -0
- package/dist/chunk-FMZQW35T.js +431 -0
- package/dist/chunk-FNEUOBCV.cjs +174 -0
- package/dist/chunk-G7K652GC.js +145 -0
- package/dist/chunk-GGW42MY4.js +20 -0
- package/dist/chunk-GI24YJPE.js +314 -0
- package/dist/chunk-GLGU2WFL.cjs +190 -0
- package/dist/chunk-GPVNCJ3Z.cjs +696 -0
- package/dist/chunk-GVQOD3VW.js +74 -0
- package/dist/chunk-KOC3KQIT.js +124 -0
- package/dist/chunk-KPWZLUES.cjs +124 -0
- package/dist/chunk-KWCHSIMI.cjs +293 -0
- package/dist/chunk-MC7SY2QH.cjs +20 -0
- package/dist/chunk-N527BTY4.cjs +366 -0
- package/dist/chunk-NBFWWQFW.cjs +346 -0
- package/dist/chunk-NYRXUGVL.js +104 -0
- package/dist/{chunk-AW63PTQ4.cjs → chunk-OHEHPQLC.cjs} +72 -72
- package/dist/chunk-Q3WFY5N3.js +366 -0
- package/dist/chunk-QGN2BBJO.cjs +104 -0
- package/dist/chunk-TGZZ3RZU.cjs +86 -0
- package/dist/{chunk-2KXQATVL.js → chunk-TZG3DERP.js} +46 -46
- package/dist/chunk-UBQLKIZC.cjs +431 -0
- package/dist/chunk-URSKA2VR.js +190 -0
- package/dist/chunk-V4WDMM6Z.js +86 -0
- package/dist/chunk-VJEER76X.js +455 -0
- package/dist/chunk-VZBWYWEI.cjs +736 -0
- package/dist/chunk-WR7YLDVV.cjs +68 -0
- package/dist/chunk-X4HQ4H2V.js +701 -0
- package/dist/chunk-XFSW3ZNI.cjs +145 -0
- package/dist/chunk-XQFAUDR2.cjs +62 -0
- package/dist/chunk-YKL6XHM6.js +346 -0
- package/dist/chunk-ZP2E2H2G.cjs +119 -0
- package/dist/chunk-ZSLNGBDS.cjs +700 -0
- package/dist/close-button.type-BUYuoSt2.d.ts +36 -0
- package/dist/close-button.type-CHsgZ3wO.d.cts +36 -0
- package/dist/components/alert/index.cjs +20 -0
- package/dist/components/alert/index.d.cts +169 -0
- package/dist/components/alert/index.d.ts +169 -0
- package/dist/components/alert/index.js +20 -0
- package/dist/components/button/index.cjs +21 -0
- package/dist/components/button/index.d.cts +613 -0
- package/dist/components/button/index.d.ts +613 -0
- package/dist/components/button/index.js +21 -0
- package/dist/components/card/index.cjs +22 -0
- package/dist/components/card/index.d.cts +620 -0
- package/dist/components/card/index.d.ts +620 -0
- package/dist/components/card/index.js +22 -0
- package/dist/components/checkbox/index.cjs +26 -0
- package/dist/components/checkbox/index.d.cts +1136 -0
- package/dist/components/checkbox/index.d.ts +1136 -0
- package/dist/components/checkbox/index.js +26 -0
- package/dist/components/chip/index.cjs +20 -0
- package/dist/components/chip/index.d.cts +608 -0
- package/dist/components/chip/index.d.ts +608 -0
- package/dist/components/chip/index.js +20 -0
- package/dist/components/input/index.cjs +25 -0
- package/dist/components/input/index.d.cts +205 -0
- package/dist/components/input/index.d.ts +205 -0
- package/dist/components/input/index.js +25 -0
- package/dist/components/input-group/index.cjs +27 -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 +27 -0
- package/dist/components/input-otp/index.cjs +29 -0
- package/dist/components/input-otp/index.d.cts +325 -0
- package/dist/components/input-otp/index.d.ts +325 -0
- package/dist/components/input-otp/index.js +29 -0
- package/dist/components/radio/index.cjs +26 -0
- package/dist/components/radio/index.d.cts +1102 -0
- package/dist/components/radio/index.d.ts +1102 -0
- package/dist/components/radio/index.js +26 -0
- package/dist/components/spinner/index.cjs +16 -0
- package/dist/components/spinner/index.d.cts +104 -0
- package/dist/components/spinner/index.d.ts +104 -0
- package/dist/components/spinner/index.js +16 -0
- package/dist/components/switch/index.cjs +27 -0
- package/dist/components/switch/index.d.cts +1154 -0
- package/dist/components/switch/index.d.ts +1154 -0
- package/dist/components/switch/index.js +27 -0
- package/dist/components/text-area/index.cjs +14 -0
- package/dist/components/text-area/index.d.cts +73 -0
- package/dist/components/text-area/index.d.ts +73 -0
- package/dist/components/text-area/index.js +14 -0
- package/dist/components/typography/index.cjs +15 -0
- package/dist/components/typography/index.d.cts +116 -0
- package/dist/components/typography/index.d.ts +116 -0
- package/dist/components/typography/index.js +15 -0
- package/dist/components/view/index.cjs +17 -0
- package/dist/components/view/index.d.cts +152 -0
- package/dist/components/view/index.d.ts +152 -0
- package/dist/components/view/index.js +17 -0
- package/dist/create-recipe-BdVd2ffi.d.ts +114 -0
- package/dist/create-recipe-dC7wMfnj.d.cts +114 -0
- package/dist/icon.type-Kml72iSz.d.ts +73 -0
- package/dist/icon.type-d_i9ma-i.d.cts +73 -0
- package/dist/index.cjs +246 -4
- package/dist/index.d.cts +109 -4
- package/dist/index.d.ts +109 -4
- package/dist/index.js +266 -24
- package/dist/input.type-BUMDlzL9.d.cts +167 -0
- package/dist/input.type-D2qgi03E.d.ts +167 -0
- package/dist/pressable-feedback.type-BA2C9sSz.d.cts +127 -0
- package/dist/pressable-feedback.type-Bs4dQlGj.d.ts +127 -0
- package/dist/style-props.type-CfnoGEP7.d.cts +31 -0
- package/dist/style-props.type-CfnoGEP7.d.ts +31 -0
- package/dist/system/index.cjs +60 -3
- package/dist/system/index.d.cts +347 -181
- package/dist/system/index.d.ts +347 -181
- package/dist/system/index.js +71 -14
- package/dist/theme/index.cjs +4 -3
- package/dist/theme/index.d.cts +34 -23
- package/dist/theme/index.d.ts +34 -23
- package/dist/theme/index.js +3 -2
- package/dist/{theme.type-C9bFJKFm.d.cts → theme.type-C2gNHpEx.d.cts} +1 -1
- package/dist/{theme.type-C9bFJKFm.d.ts → theme.type-C2gNHpEx.d.ts} +1 -1
- package/package.json +174 -18
- package/dist/chunk-QAMNNTGM.js +0 -637
- package/dist/chunk-V63JO65F.cjs +0 -637
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import {
|
|
2
|
+
InputDescription,
|
|
3
|
+
InputError,
|
|
4
|
+
InputField,
|
|
5
|
+
InputLabel,
|
|
6
|
+
InputRoot,
|
|
7
|
+
useInput
|
|
8
|
+
} from "./chunk-A5OCK3C2.js";
|
|
9
|
+
import {
|
|
10
|
+
createSlotContext
|
|
11
|
+
} from "./chunk-E2CWBQTV.js";
|
|
12
|
+
import {
|
|
13
|
+
useStyleProps
|
|
14
|
+
} from "./chunk-URSKA2VR.js";
|
|
15
|
+
|
|
16
|
+
// src/components/text-area/text-area-field.tsx
|
|
17
|
+
import { forwardRef, useMemo } from "react";
|
|
18
|
+
|
|
19
|
+
// src/components/text-area/text-area.context.ts
|
|
20
|
+
var [TextAreaProvider, useTextArea] = createSlotContext("TextArea");
|
|
21
|
+
|
|
22
|
+
// src/components/text-area/text-area-field.tsx
|
|
23
|
+
import { jsx } from "react/jsx-runtime";
|
|
24
|
+
var TextAreaField = forwardRef(
|
|
25
|
+
function TextAreaField2({ style, scrollEnabled, ...props }, ref) {
|
|
26
|
+
const { textAreaStyle, textArea } = useInput();
|
|
27
|
+
const { rows, maxRows } = useTextArea();
|
|
28
|
+
const [styleProps, rest] = useStyleProps(props);
|
|
29
|
+
const height = useMemo(() => {
|
|
30
|
+
const chrome = textArea.paddingVertical * 2;
|
|
31
|
+
return {
|
|
32
|
+
minHeight: rows * textArea.lineHeight + chrome,
|
|
33
|
+
// Unset, the field grows for as long as the text does. With a ceiling it stops
|
|
34
|
+
// there and scrolls, which is the only case that needs `scrollEnabled` — a
|
|
35
|
+
// multiline field that can grow has nothing to scroll.
|
|
36
|
+
maxHeight: maxRows ? maxRows * textArea.lineHeight + chrome : void 0
|
|
37
|
+
};
|
|
38
|
+
}, [rows, maxRows, textArea]);
|
|
39
|
+
return /* @__PURE__ */ jsx(
|
|
40
|
+
InputField,
|
|
41
|
+
{
|
|
42
|
+
ref,
|
|
43
|
+
multiline: true,
|
|
44
|
+
scrollEnabled: scrollEnabled ?? maxRows !== void 0,
|
|
45
|
+
...rest,
|
|
46
|
+
style: [textAreaStyle, height, styleProps, style]
|
|
47
|
+
}
|
|
48
|
+
);
|
|
49
|
+
}
|
|
50
|
+
);
|
|
51
|
+
TextAreaField.displayName = "XAUI.TextArea.Field";
|
|
52
|
+
|
|
53
|
+
// src/components/text-area/text-area.tsx
|
|
54
|
+
import { forwardRef as forwardRef2, useMemo as useMemo2 } from "react";
|
|
55
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
56
|
+
var DEFAULT_ROWS = 3;
|
|
57
|
+
var TextAreaRoot = forwardRef2(function TextArea({ rows = DEFAULT_ROWS, maxRows, children, ...props }, ref) {
|
|
58
|
+
const context = useMemo2(() => ({ rows, maxRows }), [rows, maxRows]);
|
|
59
|
+
return /* @__PURE__ */ jsx2(TextAreaProvider, { value: context, children: /* @__PURE__ */ jsx2(InputRoot, { ref, ...props, children }) });
|
|
60
|
+
});
|
|
61
|
+
TextAreaRoot.displayName = "XAUI.TextArea.Root";
|
|
62
|
+
|
|
63
|
+
// src/components/text-area/index.ts
|
|
64
|
+
var TextArea2 = Object.assign(TextAreaRoot, {
|
|
65
|
+
Label: InputLabel,
|
|
66
|
+
Field: TextAreaField,
|
|
67
|
+
Description: InputDescription,
|
|
68
|
+
Error: InputError
|
|
69
|
+
});
|
|
70
|
+
|
|
71
|
+
export {
|
|
72
|
+
useTextArea,
|
|
73
|
+
TextArea2 as TextArea
|
|
74
|
+
};
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import {
|
|
2
|
+
useRotation
|
|
3
|
+
} from "./chunk-BVJQ3UPZ.js";
|
|
4
|
+
import {
|
|
5
|
+
createRecipe
|
|
6
|
+
} from "./chunk-4GTAZM2C.js";
|
|
7
|
+
import {
|
|
8
|
+
alpha,
|
|
9
|
+
useXAUITheme
|
|
10
|
+
} from "./chunk-A3EGFI6T.js";
|
|
11
|
+
import {
|
|
12
|
+
useStyleProps
|
|
13
|
+
} from "./chunk-URSKA2VR.js";
|
|
14
|
+
|
|
15
|
+
// src/components/spinner/spinner.tsx
|
|
16
|
+
import { forwardRef } from "react";
|
|
17
|
+
import { View } from "react-native";
|
|
18
|
+
import Animated from "react-native-reanimated";
|
|
19
|
+
|
|
20
|
+
// src/components/spinner/spinner.recipe.ts
|
|
21
|
+
var SLOTS = ["root", "arc"];
|
|
22
|
+
var VARIANT_TOKENS = {
|
|
23
|
+
primary: { fg: "accent" },
|
|
24
|
+
secondary: { fg: "accentSoftForeground" },
|
|
25
|
+
default: { fg: "foreground" },
|
|
26
|
+
tertiary: { fg: "muted" },
|
|
27
|
+
success: { fg: "success" },
|
|
28
|
+
warning: { fg: "warning" },
|
|
29
|
+
danger: { fg: "danger" }
|
|
30
|
+
};
|
|
31
|
+
var TRACK_OPACITY = 0.18;
|
|
32
|
+
function sizeAxis(step) {
|
|
33
|
+
return (theme) => {
|
|
34
|
+
const diameter = theme.spacing(step.diameter);
|
|
35
|
+
const stroke = theme.borderWidth.default * step.stroke;
|
|
36
|
+
return {
|
|
37
|
+
root: {
|
|
38
|
+
width: diameter,
|
|
39
|
+
height: diameter,
|
|
40
|
+
borderRadius: diameter / 2,
|
|
41
|
+
borderWidth: stroke
|
|
42
|
+
},
|
|
43
|
+
// The arc is the same ring, drawn one stroke outside the track's box so the two
|
|
44
|
+
// circles land on each other rather than nesting. R13 — `start` and `end`, so the
|
|
45
|
+
// inset mirrors with the layout instead of staying put.
|
|
46
|
+
arc: {
|
|
47
|
+
position: "absolute",
|
|
48
|
+
top: -stroke,
|
|
49
|
+
bottom: -stroke,
|
|
50
|
+
start: -stroke,
|
|
51
|
+
end: -stroke,
|
|
52
|
+
borderRadius: diameter / 2 + stroke,
|
|
53
|
+
borderWidth: stroke
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
var SIZES = {
|
|
59
|
+
xs: { diameter: 4, stroke: 2 },
|
|
60
|
+
sm: { diameter: 5, stroke: 2 },
|
|
61
|
+
md: { diameter: 6, stroke: 2 },
|
|
62
|
+
lg: { diameter: 8, stroke: 3 }
|
|
63
|
+
};
|
|
64
|
+
var spinnerRecipe = createRecipe({
|
|
65
|
+
slots: SLOTS,
|
|
66
|
+
base: () => ({
|
|
67
|
+
// Squircle corners are meaningless on a full circle, and `overflow` would clip the
|
|
68
|
+
// arc that deliberately sits outside this box.
|
|
69
|
+
root: { alignItems: "center", justifyContent: "center" }
|
|
70
|
+
}),
|
|
71
|
+
variantTokens: VARIANT_TOKENS,
|
|
72
|
+
/**
|
|
73
|
+
* One ink, two opacities, and the gap that makes the rotation visible.
|
|
74
|
+
*
|
|
75
|
+
* `borderTopColor: 'transparent'` is structural rather than a colour the theme has an
|
|
76
|
+
* opinion about — it is the quarter of the circle that is missing, and without it a
|
|
77
|
+
* rotating ring is a ring.
|
|
78
|
+
*/
|
|
79
|
+
paint: (_theme, colors) => ({
|
|
80
|
+
root: { borderColor: colors.fg ? alpha(colors.fg, TRACK_OPACITY) : void 0 },
|
|
81
|
+
arc: { borderColor: colors.fg, borderTopColor: "transparent" }
|
|
82
|
+
}),
|
|
83
|
+
variants: {
|
|
84
|
+
size: {
|
|
85
|
+
xs: sizeAxis(SIZES.xs),
|
|
86
|
+
sm: sizeAxis(SIZES.sm),
|
|
87
|
+
md: sizeAxis(SIZES.md),
|
|
88
|
+
lg: sizeAxis(SIZES.lg)
|
|
89
|
+
}
|
|
90
|
+
},
|
|
91
|
+
defaultVariants: { variant: "primary", size: "md" }
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
// src/components/spinner/spinner.tsx
|
|
95
|
+
import { jsx } from "react/jsx-runtime";
|
|
96
|
+
var Spinner = forwardRef(function Spinner2({ variant, size, color, animation = true, style, ...props }, ref) {
|
|
97
|
+
const theme = useXAUITheme();
|
|
98
|
+
const [styleProps, rest] = useStyleProps(props);
|
|
99
|
+
const selection = { variant, size };
|
|
100
|
+
const styles = spinnerRecipe.resolve({ theme, selection });
|
|
101
|
+
const tint = color ? spinnerRecipe.tint({ theme, color, selection }) : void 0;
|
|
102
|
+
const arcStyle = [styles.arc, tint?.arc];
|
|
103
|
+
return /* @__PURE__ */ jsx(
|
|
104
|
+
View,
|
|
105
|
+
{
|
|
106
|
+
ref,
|
|
107
|
+
accessibilityRole: "progressbar",
|
|
108
|
+
accessibilityState: { busy: animation },
|
|
109
|
+
...rest,
|
|
110
|
+
style: [styles.root, tint?.root, styleProps, style],
|
|
111
|
+
children: animation ? /* @__PURE__ */ jsx(SpinningArc, { style: arcStyle }) : /* @__PURE__ */ jsx(View, { style: arcStyle })
|
|
112
|
+
}
|
|
113
|
+
);
|
|
114
|
+
});
|
|
115
|
+
Spinner.displayName = "XAUI.Spinner";
|
|
116
|
+
function SpinningArc({ style }) {
|
|
117
|
+
const rotation = useRotation();
|
|
118
|
+
return /* @__PURE__ */ jsx(Animated.View, { style: [style, rotation] });
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
export {
|
|
122
|
+
spinnerRecipe,
|
|
123
|
+
Spinner
|
|
124
|
+
};
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 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 _chunk7XKQJQF2cjs = require('./chunk-7XKQJQF2.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
var _chunkFNEUOBCVcjs = require('./chunk-FNEUOBCV.cjs');
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
var _chunkGLGU2WFLcjs = require('./chunk-GLGU2WFL.cjs');
|
|
14
|
+
|
|
15
|
+
// src/components/spinner/spinner.tsx
|
|
16
|
+
var _react = require('react');
|
|
17
|
+
var _reactnative = require('react-native');
|
|
18
|
+
var _reactnativereanimated = require('react-native-reanimated'); var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
|
|
19
|
+
|
|
20
|
+
// src/components/spinner/spinner.recipe.ts
|
|
21
|
+
var SLOTS = ["root", "arc"];
|
|
22
|
+
var VARIANT_TOKENS = {
|
|
23
|
+
primary: { fg: "accent" },
|
|
24
|
+
secondary: { fg: "accentSoftForeground" },
|
|
25
|
+
default: { fg: "foreground" },
|
|
26
|
+
tertiary: { fg: "muted" },
|
|
27
|
+
success: { fg: "success" },
|
|
28
|
+
warning: { fg: "warning" },
|
|
29
|
+
danger: { fg: "danger" }
|
|
30
|
+
};
|
|
31
|
+
var TRACK_OPACITY = 0.18;
|
|
32
|
+
function sizeAxis(step) {
|
|
33
|
+
return (theme) => {
|
|
34
|
+
const diameter = theme.spacing(step.diameter);
|
|
35
|
+
const stroke = theme.borderWidth.default * step.stroke;
|
|
36
|
+
return {
|
|
37
|
+
root: {
|
|
38
|
+
width: diameter,
|
|
39
|
+
height: diameter,
|
|
40
|
+
borderRadius: diameter / 2,
|
|
41
|
+
borderWidth: stroke
|
|
42
|
+
},
|
|
43
|
+
// The arc is the same ring, drawn one stroke outside the track's box so the two
|
|
44
|
+
// circles land on each other rather than nesting. R13 — `start` and `end`, so the
|
|
45
|
+
// inset mirrors with the layout instead of staying put.
|
|
46
|
+
arc: {
|
|
47
|
+
position: "absolute",
|
|
48
|
+
top: -stroke,
|
|
49
|
+
bottom: -stroke,
|
|
50
|
+
start: -stroke,
|
|
51
|
+
end: -stroke,
|
|
52
|
+
borderRadius: diameter / 2 + stroke,
|
|
53
|
+
borderWidth: stroke
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
var SIZES = {
|
|
59
|
+
xs: { diameter: 4, stroke: 2 },
|
|
60
|
+
sm: { diameter: 5, stroke: 2 },
|
|
61
|
+
md: { diameter: 6, stroke: 2 },
|
|
62
|
+
lg: { diameter: 8, stroke: 3 }
|
|
63
|
+
};
|
|
64
|
+
var spinnerRecipe = _chunkFNEUOBCVcjs.createRecipe.call(void 0, {
|
|
65
|
+
slots: SLOTS,
|
|
66
|
+
base: () => ({
|
|
67
|
+
// Squircle corners are meaningless on a full circle, and `overflow` would clip the
|
|
68
|
+
// arc that deliberately sits outside this box.
|
|
69
|
+
root: { alignItems: "center", justifyContent: "center" }
|
|
70
|
+
}),
|
|
71
|
+
variantTokens: VARIANT_TOKENS,
|
|
72
|
+
/**
|
|
73
|
+
* One ink, two opacities, and the gap that makes the rotation visible.
|
|
74
|
+
*
|
|
75
|
+
* `borderTopColor: 'transparent'` is structural rather than a colour the theme has an
|
|
76
|
+
* opinion about — it is the quarter of the circle that is missing, and without it a
|
|
77
|
+
* rotating ring is a ring.
|
|
78
|
+
*/
|
|
79
|
+
paint: (_theme, colors) => ({
|
|
80
|
+
root: { borderColor: colors.fg ? _chunk57SJ4LJFcjs.alpha.call(void 0, colors.fg, TRACK_OPACITY) : void 0 },
|
|
81
|
+
arc: { borderColor: colors.fg, borderTopColor: "transparent" }
|
|
82
|
+
}),
|
|
83
|
+
variants: {
|
|
84
|
+
size: {
|
|
85
|
+
xs: sizeAxis(SIZES.xs),
|
|
86
|
+
sm: sizeAxis(SIZES.sm),
|
|
87
|
+
md: sizeAxis(SIZES.md),
|
|
88
|
+
lg: sizeAxis(SIZES.lg)
|
|
89
|
+
}
|
|
90
|
+
},
|
|
91
|
+
defaultVariants: { variant: "primary", size: "md" }
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
// src/components/spinner/spinner.tsx
|
|
95
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
96
|
+
var Spinner = _react.forwardRef.call(void 0, function Spinner2({ variant, size, color, animation = true, style, ...props }, ref) {
|
|
97
|
+
const theme = _chunk57SJ4LJFcjs.useXAUITheme.call(void 0, );
|
|
98
|
+
const [styleProps, rest] = _chunkGLGU2WFLcjs.useStyleProps.call(void 0, props);
|
|
99
|
+
const selection = { variant, size };
|
|
100
|
+
const styles = spinnerRecipe.resolve({ theme, selection });
|
|
101
|
+
const tint = color ? spinnerRecipe.tint({ theme, color, selection }) : void 0;
|
|
102
|
+
const arcStyle = [styles.arc, _optionalChain([tint, 'optionalAccess', _ => _.arc])];
|
|
103
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
104
|
+
_reactnative.View,
|
|
105
|
+
{
|
|
106
|
+
ref,
|
|
107
|
+
accessibilityRole: "progressbar",
|
|
108
|
+
accessibilityState: { busy: animation },
|
|
109
|
+
...rest,
|
|
110
|
+
style: [styles.root, _optionalChain([tint, 'optionalAccess', _2 => _2.root]), styleProps, style],
|
|
111
|
+
children: animation ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SpinningArc, { style: arcStyle }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: arcStyle })
|
|
112
|
+
}
|
|
113
|
+
);
|
|
114
|
+
});
|
|
115
|
+
Spinner.displayName = "XAUI.Spinner";
|
|
116
|
+
function SpinningArc({ style }) {
|
|
117
|
+
const rotation = _chunk7XKQJQF2cjs.useRotation.call(void 0, );
|
|
118
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, { style: [style, rotation] });
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
|
|
123
|
+
|
|
124
|
+
exports.spinnerRecipe = spinnerRecipe; exports.Spinner = Spinner;
|
|
@@ -0,0 +1,293 @@
|
|
|
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 _chunkF6CQ6CBIcjs = require('./chunk-F6CQ6CBI.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
var _chunkGPVNCJ3Zcjs = require('./chunk-GPVNCJ3Z.cjs');
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
var _chunk7DPL3ZDScjs = require('./chunk-7DPL3ZDS.cjs');
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
var _chunk7EIHHOHPcjs = require('./chunk-7EIHHOHP.cjs');
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
var _chunkFNEUOBCVcjs = require('./chunk-FNEUOBCV.cjs');
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
var _chunkZP2E2H2Gcjs = require('./chunk-ZP2E2H2G.cjs');
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
var _chunkGLGU2WFLcjs = require('./chunk-GLGU2WFL.cjs');
|
|
27
|
+
|
|
28
|
+
// src/components/radio/radio-indicator.tsx
|
|
29
|
+
var _react = require('react');
|
|
30
|
+
var _reactnative = require('react-native');
|
|
31
|
+
|
|
32
|
+
// src/components/radio/radio.context.ts
|
|
33
|
+
var [RadioProvider, useRadio] = _chunkZP2E2H2Gcjs.createSlotContext.call(void 0, "Radio");
|
|
34
|
+
|
|
35
|
+
// src/components/radio/radio-indicator.tsx
|
|
36
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
37
|
+
var RadioIndicator = _react.forwardRef.call(void 0,
|
|
38
|
+
function RadioIndicator2({ children, animation = true, style, ...props }, ref) {
|
|
39
|
+
const { indicatorStyle, fillStyle, isSelected } = useRadio();
|
|
40
|
+
const [styleProps, rest] = _chunkGLGU2WFLcjs.useStyleProps.call(void 0, props);
|
|
41
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: [indicatorStyle, styleProps, style], children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
42
|
+
_chunkF6CQ6CBIcjs.SelectionFill,
|
|
43
|
+
{
|
|
44
|
+
isVisible: isSelected,
|
|
45
|
+
style: fillStyle,
|
|
46
|
+
animation,
|
|
47
|
+
children: _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Thumb, {})))
|
|
48
|
+
}
|
|
49
|
+
) });
|
|
50
|
+
}
|
|
51
|
+
);
|
|
52
|
+
RadioIndicator.displayName = "XAUI.Radio.Indicator";
|
|
53
|
+
function Thumb() {
|
|
54
|
+
const { thumbStyle } = useRadio();
|
|
55
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: thumbStyle });
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// src/components/radio/radio-label.tsx
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
var RadioLabel = _react.forwardRef.call(void 0, function RadioLabel2({ children, style, ...props }, ref) {
|
|
63
|
+
const { labelStyle } = useRadio();
|
|
64
|
+
const [styleProps, rest] = _chunkGLGU2WFLcjs.useStyleProps.call(void 0, props);
|
|
65
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.Text, { ref, style: [labelStyle, styleProps, style], ...rest, children });
|
|
66
|
+
});
|
|
67
|
+
RadioLabel.displayName = "XAUI.Radio.Label";
|
|
68
|
+
|
|
69
|
+
// src/components/radio/radio.tsx
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
// src/components/radio/radio.recipe.ts
|
|
73
|
+
var SLOTS = ["root", "indicator", "fill", "thumb", "label"];
|
|
74
|
+
var VARIANT_TOKENS = {
|
|
75
|
+
primary: {
|
|
76
|
+
bg: "fieldBackground",
|
|
77
|
+
border: "fieldBorder",
|
|
78
|
+
bgSelected: "accent",
|
|
79
|
+
fgSelected: "accentForeground"
|
|
80
|
+
},
|
|
81
|
+
secondary: {
|
|
82
|
+
bg: "default",
|
|
83
|
+
border: "fieldBorder",
|
|
84
|
+
bgSelected: "accent",
|
|
85
|
+
fgSelected: "accentForeground"
|
|
86
|
+
},
|
|
87
|
+
tertiary: {
|
|
88
|
+
border: "fieldBorder",
|
|
89
|
+
bgSelected: "accent",
|
|
90
|
+
fgSelected: "accentForeground"
|
|
91
|
+
}
|
|
92
|
+
};
|
|
93
|
+
function sizeAxis(step) {
|
|
94
|
+
const { box, label, gap } = step;
|
|
95
|
+
return (theme) => {
|
|
96
|
+
const side = theme.spacing(box);
|
|
97
|
+
const dot = Math.round(side * THUMB_RATIO);
|
|
98
|
+
return {
|
|
99
|
+
root: { gap: theme.spacing(gap) },
|
|
100
|
+
indicator: { width: side, height: side },
|
|
101
|
+
thumb: { width: dot, height: dot, borderRadius: dot / 2 },
|
|
102
|
+
label: {
|
|
103
|
+
fontSize: theme.fontSizes[label],
|
|
104
|
+
lineHeight: theme.lineHeights[label]
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
};
|
|
108
|
+
}
|
|
109
|
+
var THUMB_RATIO = 10 / 24;
|
|
110
|
+
var SIZES = {
|
|
111
|
+
sm: { box: 5, gap: 2, label: "sm" },
|
|
112
|
+
md: { box: 6, gap: 2, label: "md" },
|
|
113
|
+
lg: { box: 7, gap: 2.5, label: "lg" }
|
|
114
|
+
};
|
|
115
|
+
var radioRecipe = _chunkFNEUOBCVcjs.createRecipe.call(void 0, {
|
|
116
|
+
slots: SLOTS,
|
|
117
|
+
base: (theme) => ({
|
|
118
|
+
root: { flexDirection: "row", alignItems: "center", alignSelf: "flex-start" },
|
|
119
|
+
indicator: {
|
|
120
|
+
alignItems: "center",
|
|
121
|
+
justifyContent: "center",
|
|
122
|
+
borderWidth: theme.borderWidth.field,
|
|
123
|
+
// The one shape decision this component makes, and the whole difference between it
|
|
124
|
+
// and the `Checkbox`: a radio is round, at every size. `radius` still overrides it.
|
|
125
|
+
borderRadius: theme.radius.full,
|
|
126
|
+
overflow: "hidden"
|
|
127
|
+
},
|
|
128
|
+
fill: {
|
|
129
|
+
position: "absolute",
|
|
130
|
+
top: 0,
|
|
131
|
+
bottom: 0,
|
|
132
|
+
start: 0,
|
|
133
|
+
end: 0,
|
|
134
|
+
alignItems: "center",
|
|
135
|
+
justifyContent: "center"
|
|
136
|
+
},
|
|
137
|
+
label: {
|
|
138
|
+
fontFamily: theme.fontFamilies.body,
|
|
139
|
+
color: theme.colors.foreground
|
|
140
|
+
}
|
|
141
|
+
}),
|
|
142
|
+
variantTokens: VARIANT_TOKENS,
|
|
143
|
+
/** The `Checkbox`'s paint, with a dot where the check was. */
|
|
144
|
+
paint: (theme, colors) => ({
|
|
145
|
+
indicator: {
|
|
146
|
+
backgroundColor: colors.bg,
|
|
147
|
+
borderColor: colors.border,
|
|
148
|
+
borderWidth: colors.border ? theme.borderWidth.field : 0
|
|
149
|
+
},
|
|
150
|
+
fill: { backgroundColor: colors.bgSelected },
|
|
151
|
+
thumb: { backgroundColor: colors.fgSelected }
|
|
152
|
+
}),
|
|
153
|
+
variants: {
|
|
154
|
+
size: {
|
|
155
|
+
sm: sizeAxis(SIZES.sm),
|
|
156
|
+
md: sizeAxis(SIZES.md),
|
|
157
|
+
lg: sizeAxis(SIZES.lg)
|
|
158
|
+
},
|
|
159
|
+
radius: _chunkFNEUOBCVcjs.radiusAxis.call(void 0, "indicator"),
|
|
160
|
+
/** Declared after `size` so its border wins. The `Checkbox`'s rule, to the letter. */
|
|
161
|
+
isInvalid: {
|
|
162
|
+
true: (theme) => ({
|
|
163
|
+
indicator: { borderColor: theme.colors.danger, backgroundColor: void 0 },
|
|
164
|
+
fill: { backgroundColor: theme.colors.danger },
|
|
165
|
+
thumb: { backgroundColor: theme.colors.dangerForeground },
|
|
166
|
+
label: { color: theme.colors.danger }
|
|
167
|
+
})
|
|
168
|
+
}
|
|
169
|
+
},
|
|
170
|
+
compoundVariants: [
|
|
171
|
+
{
|
|
172
|
+
when: { variant: "primary" },
|
|
173
|
+
style: (theme) => ({ indicator: theme.shadows.field })
|
|
174
|
+
}
|
|
175
|
+
],
|
|
176
|
+
states: {
|
|
177
|
+
disabled: (theme) => ({ root: { opacity: theme.opacity.disabled } })
|
|
178
|
+
},
|
|
179
|
+
defaultVariants: { variant: "secondary", size: "md" }
|
|
180
|
+
});
|
|
181
|
+
|
|
182
|
+
// src/components/radio/radio.tsx
|
|
183
|
+
|
|
184
|
+
var RadioRoot = _react.forwardRef.call(void 0, function Radio({
|
|
185
|
+
children,
|
|
186
|
+
variant,
|
|
187
|
+
size,
|
|
188
|
+
radius,
|
|
189
|
+
color,
|
|
190
|
+
isSelected,
|
|
191
|
+
defaultSelected = false,
|
|
192
|
+
onSelectedChange,
|
|
193
|
+
isInvalid = false,
|
|
194
|
+
isDisabled = false,
|
|
195
|
+
asChild = false,
|
|
196
|
+
accessibilityRole,
|
|
197
|
+
accessibilityState,
|
|
198
|
+
animation,
|
|
199
|
+
style,
|
|
200
|
+
onPress,
|
|
201
|
+
onPressIn,
|
|
202
|
+
onPressOut,
|
|
203
|
+
...props
|
|
204
|
+
}, ref) {
|
|
205
|
+
const theme = _chunk57SJ4LJFcjs.useXAUITheme.call(void 0, );
|
|
206
|
+
const [styleProps, rest] = _chunkGLGU2WFLcjs.useStyleProps.call(void 0, props);
|
|
207
|
+
const [isPressed, press] = _chunk7DPL3ZDScjs.usePressState.call(void 0, { onPressIn, onPressOut });
|
|
208
|
+
const [selected, setSelected] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
|
|
209
|
+
value: isSelected,
|
|
210
|
+
defaultValue: defaultSelected,
|
|
211
|
+
onChange: onSelectedChange
|
|
212
|
+
});
|
|
213
|
+
const handlePress = _react.useCallback.call(void 0,
|
|
214
|
+
(event) => {
|
|
215
|
+
setSelected(true);
|
|
216
|
+
_optionalChain([onPress, 'optionalCall', _ => _(event)]);
|
|
217
|
+
},
|
|
218
|
+
[setSelected, onPress]
|
|
219
|
+
);
|
|
220
|
+
const selection = {
|
|
221
|
+
variant,
|
|
222
|
+
size,
|
|
223
|
+
radius,
|
|
224
|
+
isInvalid: isInvalid ? "true" : void 0
|
|
225
|
+
};
|
|
226
|
+
const states = { pressed: isPressed, disabled: isDisabled };
|
|
227
|
+
const styles = radioRecipe.resolve({ theme, selection, states });
|
|
228
|
+
const tint = color && !isInvalid ? radioRecipe.tint({ theme, color, selection, states }) : void 0;
|
|
229
|
+
const context = _react.useMemo.call(void 0,
|
|
230
|
+
() => ({
|
|
231
|
+
// The tint never reaches the circle at rest — only the fill and the dot that say it
|
|
232
|
+
// is the chosen one. The `Checkbox` says why, at the same line.
|
|
233
|
+
indicatorStyle: styles.indicator,
|
|
234
|
+
fillStyle: tint ? [styles.fill, tint.fill] : styles.fill,
|
|
235
|
+
thumbStyle: tint ? [styles.thumb, tint.thumb] : styles.thumb,
|
|
236
|
+
labelStyle: styles.label,
|
|
237
|
+
isSelected: selected,
|
|
238
|
+
isDisabled,
|
|
239
|
+
isInvalid
|
|
240
|
+
}),
|
|
241
|
+
[styles, tint, selected, isDisabled, isInvalid]
|
|
242
|
+
);
|
|
243
|
+
const rootStyle = [
|
|
244
|
+
styles.root,
|
|
245
|
+
_optionalChain([tint, 'optionalAccess', _2 => _2.root]),
|
|
246
|
+
styleProps,
|
|
247
|
+
typeof style === "function" ? style({ pressed: isPressed }) : style
|
|
248
|
+
];
|
|
249
|
+
const text = _chunkZP2E2H2Gcjs.childrenToString.call(void 0, children);
|
|
250
|
+
const content = text !== null ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
|
|
251
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, RadioIndicator, {}),
|
|
252
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, RadioLabel, { children: text })
|
|
253
|
+
] }) : _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RadioIndicator, {})));
|
|
254
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RadioProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
255
|
+
_chunkGPVNCJ3Zcjs.PressableFeedback,
|
|
256
|
+
{
|
|
257
|
+
ref,
|
|
258
|
+
isPressed,
|
|
259
|
+
isDisabled,
|
|
260
|
+
asChild,
|
|
261
|
+
animation,
|
|
262
|
+
accessibilityRole: _nullishCoalesce(accessibilityRole, () => ( "radio")),
|
|
263
|
+
accessibilityState: {
|
|
264
|
+
checked: selected,
|
|
265
|
+
disabled: isDisabled,
|
|
266
|
+
...accessibilityState
|
|
267
|
+
},
|
|
268
|
+
"aria-invalid": isInvalid,
|
|
269
|
+
...rest,
|
|
270
|
+
style: rootStyle,
|
|
271
|
+
onPress: handlePress,
|
|
272
|
+
onPressIn: press.onPressIn,
|
|
273
|
+
onPressOut: press.onPressOut,
|
|
274
|
+
children: asChild ? children : content
|
|
275
|
+
}
|
|
276
|
+
) });
|
|
277
|
+
});
|
|
278
|
+
RadioRoot.displayName = "XAUI.Radio.Root";
|
|
279
|
+
|
|
280
|
+
// src/components/radio/index.ts
|
|
281
|
+
var Radio2 = Object.assign(RadioRoot, {
|
|
282
|
+
Indicator: RadioIndicator,
|
|
283
|
+
Label: RadioLabel
|
|
284
|
+
});
|
|
285
|
+
|
|
286
|
+
|
|
287
|
+
|
|
288
|
+
|
|
289
|
+
|
|
290
|
+
|
|
291
|
+
|
|
292
|
+
|
|
293
|
+
exports.useRadio = useRadio; exports.RadioIndicator = RadioIndicator; exports.RadioLabel = RadioLabel; exports.radioRecipe = radioRecipe; exports.RadioRoot = RadioRoot; exports.Radio = Radio2;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/utils/stable-hash.ts
|
|
2
|
+
function canonical(value) {
|
|
3
|
+
if (value === null || typeof value !== "object") return _nullishCoalesce(JSON.stringify(value), () => ( "null"));
|
|
4
|
+
if (Array.isArray(value)) return `[${value.map(canonical).join(",")}]`;
|
|
5
|
+
const entries = Object.entries(value).filter(([, v]) => typeof v !== "function").sort(([a], [b]) => a < b ? -1 : 1).map(([k, v]) => `${JSON.stringify(k)}:${canonical(v)}`);
|
|
6
|
+
return `{${entries.join(",")}}`;
|
|
7
|
+
}
|
|
8
|
+
function stableHash(value) {
|
|
9
|
+
const input = canonical(value);
|
|
10
|
+
let hash = 2166136261;
|
|
11
|
+
for (let i = 0; i < input.length; i++) {
|
|
12
|
+
hash ^= input.charCodeAt(i);
|
|
13
|
+
hash = Math.imul(hash, 16777619) >>> 0;
|
|
14
|
+
}
|
|
15
|
+
return hash.toString(36);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
exports.stableHash = stableHash;
|