@xaui/native 0.0.26 → 0.0.28
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/LICENSE +21 -0
- package/README.md +105 -228
- package/dist/alert/index.cjs +92 -166
- package/dist/alert/index.js +2 -1
- package/dist/app-bar/index.cjs +24 -98
- package/dist/app-bar/index.js +2 -1
- package/dist/autocomplete/index.cjs +192 -281
- package/dist/autocomplete/index.js +36 -48
- package/dist/avatar/index.cjs +59 -133
- package/dist/avatar/index.js +2 -1
- package/dist/badge/index.cjs +26 -99
- package/dist/badge/index.js +2 -1
- package/dist/bottom-sheet/index.cjs +5 -456
- package/dist/bottom-sheet/index.js +4 -363
- package/dist/bottom-tab-bar/index.cjs +93 -167
- package/dist/bottom-tab-bar/index.js +2 -2
- package/dist/button/index.cjs +73 -525
- package/dist/button/index.js +3 -2
- package/dist/card/index.cjs +76 -169
- package/dist/card/index.js +2 -2
- package/dist/carousel/index.cjs +68 -145
- package/dist/carousel/index.js +1 -1
- package/dist/chart/index.cjs +132 -173
- package/dist/checkbox/index.cjs +70 -143
- package/dist/checkbox/index.js +2 -1
- package/dist/chip/index.cjs +89 -164
- package/dist/chip/index.js +2 -1
- package/dist/chunk-BD72HIPR.cjs +75 -0
- package/dist/chunk-DHSTKO3K.cjs +19 -0
- package/dist/{chunk-CZFDZPAS.js → chunk-DXXNBF5P.js} +5 -0
- package/dist/{chunk-UI5L26KD.js → chunk-F7WH4DMG.js} +1 -1
- package/dist/chunk-GBHQCAKW.js +19 -0
- package/dist/chunk-HC2SSHNU.js +368 -0
- package/dist/chunk-HSPTLUFA.cjs +7 -0
- package/dist/chunk-JEGEPGVU.js +287 -0
- package/dist/chunk-KTLGDLCB.cjs +287 -0
- package/dist/{chunk-GHCVNQET.js → chunk-LTKYHG5V.js} +5 -12
- package/dist/{chunk-ULJSCNPE.js → chunk-LUBWRVI2.js} +1 -1
- package/dist/chunk-OQ2BLOOG.cjs +138 -0
- package/dist/chunk-QMYWIWSX.cjs +384 -0
- package/dist/chunk-XFPPR2VB.cjs +368 -0
- package/dist/core/index.cjs +22 -168
- package/dist/core/index.d.cts +1 -1
- package/dist/core/index.d.ts +1 -1
- package/dist/core/index.js +5 -3
- package/dist/datepicker/index.cjs +239 -320
- package/dist/datepicker/index.js +2 -1
- package/dist/divider/index.cjs +5 -145
- package/dist/divider/index.js +3 -2
- package/dist/drawer/index.cjs +39 -112
- package/dist/drawer/index.js +2 -1
- package/dist/expansion-panel/index.cjs +91 -230
- package/dist/expansion-panel/index.js +3 -2
- package/dist/fab/index.cjs +6 -722
- package/dist/fab/index.js +4 -3
- package/dist/fab-menu/index.cjs +81 -814
- package/dist/fab-menu/index.js +4 -3
- package/dist/feature-discovery/index.cjs +72 -139
- package/dist/feature-discovery/index.js +2 -2
- package/dist/index.cjs +1 -18
- package/dist/indicator/index.cjs +5 -445
- package/dist/indicator/index.js +3 -2
- package/dist/input/index.cjs +214 -282
- package/dist/input/index.js +2 -2
- package/dist/list/index.cjs +71 -146
- package/dist/list/index.js +2 -1
- package/dist/menu/index.cjs +59 -127
- package/dist/menu/index.js +2 -2
- package/dist/menubox/index.cjs +60 -132
- package/dist/menubox/index.js +2 -1
- package/dist/pager/index.cjs +42 -80
- package/dist/progress/index.cjs +43 -114
- package/dist/progress/index.js +2 -1
- package/dist/radio/index.cjs +82 -154
- package/dist/radio/index.js +2 -1
- package/dist/segment-button/index.cjs +60 -147
- package/dist/segment-button/index.js +2 -2
- package/dist/select/index.cjs +149 -224
- package/dist/select/index.js +10 -22
- package/dist/skeleton/index.cjs +23 -94
- package/dist/skeleton/index.js +2 -2
- package/dist/slider/index.cjs +77 -156
- package/dist/slider/index.js +2 -1
- package/dist/snackbar/index.cjs +420 -0
- package/dist/snackbar/index.d.cts +175 -0
- package/dist/snackbar/index.d.ts +175 -0
- package/dist/snackbar/index.js +420 -0
- package/dist/stepper/index.cjs +121 -195
- package/dist/stepper/index.js +2 -1
- package/dist/switch/index.cjs +48 -121
- package/dist/switch/index.js +2 -1
- package/dist/tabs/index.cjs +67 -151
- package/dist/tabs/index.js +2 -1
- package/dist/timepicker/index.cjs +135 -593
- package/dist/timepicker/index.js +24 -383
- package/dist/toolbar/index.cjs +59 -128
- package/dist/toolbar/index.js +2 -1
- package/dist/typography/index.cjs +37 -92
- package/dist/typography/index.d.cts +1 -1
- package/dist/typography/index.d.ts +1 -1
- package/dist/typography/index.js +20 -1
- package/dist/view/index.cjs +178 -223
- package/package.json +7 -1
- package/dist/chunk-3XSXTM3G.js +0 -661
- package/dist/chunk-4KSZLONZ.js +0 -79
- package/dist/chunk-I4V5Y5GD.js +0 -76
- package/dist/chunk-URBEEDFX.js +0 -79
package/dist/checkbox/index.cjs
CHANGED
|
@@ -1,58 +1,27 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
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; }require('../chunk-HSPTLUFA.cjs');
|
|
29
2
|
|
|
30
|
-
|
|
31
|
-
var
|
|
32
|
-
__export(checkbox_exports, {
|
|
33
|
-
Checkbox: () => Checkbox
|
|
34
|
-
});
|
|
35
|
-
module.exports = __toCommonJS(checkbox_exports);
|
|
3
|
+
|
|
4
|
+
var _chunkOQ2BLOOGcjs = require('../chunk-OQ2BLOOG.cjs');
|
|
36
5
|
|
|
37
6
|
// src/components/checkbox/checkbox.tsx
|
|
38
|
-
var
|
|
39
|
-
var
|
|
7
|
+
var _react = require('react'); var _react2 = _interopRequireDefault(_react);
|
|
8
|
+
var _reactnative = require('react-native');
|
|
40
9
|
|
|
41
10
|
// src/components/checkbox/checkbox-icon.tsx
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
var
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
var _reactnativesvg = require('react-native-svg'); var _reactnativesvg2 = _interopRequireDefault(_reactnativesvg);
|
|
45
14
|
|
|
46
15
|
// src/components/checkbox/checkbox.animation.ts
|
|
47
|
-
|
|
16
|
+
|
|
48
17
|
var runCheckAnimation = (opacity, strokeDashoffset) => {
|
|
49
|
-
|
|
50
|
-
|
|
18
|
+
_reactnative.Animated.parallel([
|
|
19
|
+
_reactnative.Animated.timing(opacity, {
|
|
51
20
|
toValue: 1,
|
|
52
21
|
duration: 200,
|
|
53
22
|
useNativeDriver: false
|
|
54
23
|
}),
|
|
55
|
-
|
|
24
|
+
_reactnative.Animated.timing(strokeDashoffset, {
|
|
56
25
|
toValue: 44,
|
|
57
26
|
duration: 250,
|
|
58
27
|
useNativeDriver: false
|
|
@@ -60,13 +29,13 @@ var runCheckAnimation = (opacity, strokeDashoffset) => {
|
|
|
60
29
|
]).start();
|
|
61
30
|
};
|
|
62
31
|
var runUncheckAnimation = (opacity, strokeDashoffset) => {
|
|
63
|
-
|
|
64
|
-
|
|
32
|
+
_reactnative.Animated.parallel([
|
|
33
|
+
_reactnative.Animated.timing(opacity, {
|
|
65
34
|
toValue: 0,
|
|
66
35
|
duration: 200,
|
|
67
36
|
useNativeDriver: false
|
|
68
37
|
}),
|
|
69
|
-
|
|
38
|
+
_reactnative.Animated.timing(strokeDashoffset, {
|
|
70
39
|
toValue: 66,
|
|
71
40
|
duration: 250,
|
|
72
41
|
useNativeDriver: false
|
|
@@ -74,13 +43,13 @@ var runUncheckAnimation = (opacity, strokeDashoffset) => {
|
|
|
74
43
|
]).start();
|
|
75
44
|
};
|
|
76
45
|
var runBackgroundInAnimation = (backgroundScale, backgroundOpacity) => {
|
|
77
|
-
|
|
78
|
-
|
|
46
|
+
_reactnative.Animated.parallel([
|
|
47
|
+
_reactnative.Animated.timing(backgroundScale, {
|
|
79
48
|
toValue: 1,
|
|
80
49
|
duration: 200,
|
|
81
50
|
useNativeDriver: true
|
|
82
51
|
}),
|
|
83
|
-
|
|
52
|
+
_reactnative.Animated.timing(backgroundOpacity, {
|
|
84
53
|
toValue: 1,
|
|
85
54
|
duration: 200,
|
|
86
55
|
useNativeDriver: true
|
|
@@ -88,13 +57,13 @@ var runBackgroundInAnimation = (backgroundScale, backgroundOpacity) => {
|
|
|
88
57
|
]).start();
|
|
89
58
|
};
|
|
90
59
|
var runBackgroundOutAnimation = (backgroundScale, backgroundOpacity) => {
|
|
91
|
-
|
|
92
|
-
|
|
60
|
+
_reactnative.Animated.parallel([
|
|
61
|
+
_reactnative.Animated.timing(backgroundScale, {
|
|
93
62
|
toValue: 0.5,
|
|
94
63
|
duration: 200,
|
|
95
64
|
useNativeDriver: true
|
|
96
65
|
}),
|
|
97
|
-
|
|
66
|
+
_reactnative.Animated.timing(backgroundOpacity, {
|
|
98
67
|
toValue: 0,
|
|
99
68
|
duration: 200,
|
|
100
69
|
useNativeDriver: true
|
|
@@ -102,36 +71,36 @@ var runBackgroundOutAnimation = (backgroundScale, backgroundOpacity) => {
|
|
|
102
71
|
]).start();
|
|
103
72
|
};
|
|
104
73
|
var runPressInAnimation = (scale) => {
|
|
105
|
-
|
|
74
|
+
_reactnative.Animated.spring(scale, {
|
|
106
75
|
toValue: 0.95,
|
|
107
76
|
useNativeDriver: true
|
|
108
77
|
}).start();
|
|
109
78
|
};
|
|
110
79
|
var runPressOutAnimation = (scale) => {
|
|
111
|
-
|
|
80
|
+
_reactnative.Animated.spring(scale, {
|
|
112
81
|
toValue: 1,
|
|
113
82
|
useNativeDriver: true
|
|
114
83
|
}).start();
|
|
115
84
|
};
|
|
116
85
|
|
|
117
86
|
// src/components/checkbox/checkbox-icon.tsx
|
|
118
|
-
var AnimatedSvg =
|
|
119
|
-
var AnimatedPolyline =
|
|
87
|
+
var AnimatedSvg = _reactnative.Animated.createAnimatedComponent(_reactnativesvg2.default);
|
|
88
|
+
var AnimatedPolyline = _reactnative.Animated.createAnimatedComponent(_reactnativesvg.Polyline);
|
|
120
89
|
function CheckIcon({
|
|
121
90
|
isChecked,
|
|
122
91
|
color,
|
|
123
92
|
size
|
|
124
93
|
}) {
|
|
125
|
-
const opacity = (0,
|
|
126
|
-
const strokeDashoffset = (0,
|
|
127
|
-
(0,
|
|
94
|
+
const opacity = _react.useRef.call(void 0, new _reactnative.Animated.Value(0)).current;
|
|
95
|
+
const strokeDashoffset = _react.useRef.call(void 0, new _reactnative.Animated.Value(66)).current;
|
|
96
|
+
_react.useEffect.call(void 0, () => {
|
|
128
97
|
if (isChecked) {
|
|
129
98
|
runCheckAnimation(opacity, strokeDashoffset);
|
|
130
99
|
} else {
|
|
131
100
|
runUncheckAnimation(opacity, strokeDashoffset);
|
|
132
101
|
}
|
|
133
102
|
}, [isChecked, opacity, strokeDashoffset]);
|
|
134
|
-
return /* @__PURE__ */
|
|
103
|
+
return /* @__PURE__ */ _react2.default.createElement(
|
|
135
104
|
AnimatedSvg,
|
|
136
105
|
{
|
|
137
106
|
width: size,
|
|
@@ -140,7 +109,7 @@ function CheckIcon({
|
|
|
140
109
|
fill: "none",
|
|
141
110
|
opacity
|
|
142
111
|
},
|
|
143
|
-
/* @__PURE__ */
|
|
112
|
+
/* @__PURE__ */ _react2.default.createElement(
|
|
144
113
|
AnimatedPolyline,
|
|
145
114
|
{
|
|
146
115
|
points: "1 9 7 14 15 4",
|
|
@@ -155,8 +124,8 @@ function CheckIcon({
|
|
|
155
124
|
);
|
|
156
125
|
}
|
|
157
126
|
function PlaceholderCheckIcon({ color, size }) {
|
|
158
|
-
return /* @__PURE__ */
|
|
159
|
-
|
|
127
|
+
return /* @__PURE__ */ _react2.default.createElement(_reactnativesvg2.default, { width: size, height: size, viewBox: "0 0 17 18" }, /* @__PURE__ */ _react2.default.createElement(
|
|
128
|
+
_reactnativesvg.Path,
|
|
160
129
|
{
|
|
161
130
|
d: "M 1 9 L 7 14 L 15 4",
|
|
162
131
|
stroke: color,
|
|
@@ -171,7 +140,7 @@ function IndeterminateCheckIcon({
|
|
|
171
140
|
color,
|
|
172
141
|
size
|
|
173
142
|
}) {
|
|
174
|
-
return /* @__PURE__ */
|
|
143
|
+
return /* @__PURE__ */ _react2.default.createElement(_reactnativesvg2.default, { width: size, height: size, viewBox: "0 0 24 24" }, /* @__PURE__ */ _react2.default.createElement(_reactnativesvg.Line, { x1: "21", y1: "12", x2: "3", y2: "12", stroke: color, strokeWidth: 3 }));
|
|
175
144
|
}
|
|
176
145
|
function CheckboxIcon({
|
|
177
146
|
isIndeterminate,
|
|
@@ -180,58 +149,17 @@ function CheckboxIcon({
|
|
|
180
149
|
}) {
|
|
181
150
|
const BaseIcon = isIndeterminate ? IndeterminateCheckIcon : CheckIcon;
|
|
182
151
|
if (variant === "light" && !props.isChecked && !isIndeterminate) {
|
|
183
|
-
return /* @__PURE__ */
|
|
152
|
+
return /* @__PURE__ */ _react2.default.createElement(PlaceholderCheckIcon, { size: props.size, color: _nullishCoalesce(props.placeholderColor, () => ( "")) });
|
|
184
153
|
}
|
|
185
|
-
return /* @__PURE__ */
|
|
154
|
+
return /* @__PURE__ */ _react2.default.createElement(BaseIcon, { ...props });
|
|
186
155
|
}
|
|
187
156
|
|
|
188
157
|
// src/components/checkbox/checkbox.hook.ts
|
|
189
|
-
var import_react7 = require("react");
|
|
190
|
-
var import_core = require("@xaui/core");
|
|
191
|
-
|
|
192
|
-
// src/core/theme-context.tsx
|
|
193
|
-
var import_react5 = __toESM(require("react"), 1);
|
|
194
|
-
var import_react_native4 = require("react-native");
|
|
195
|
-
var import_theme = require("@xaui/core/theme");
|
|
196
|
-
var import_palette = require("@xaui/core/palette");
|
|
197
|
-
|
|
198
|
-
// src/core/portal/portal.tsx
|
|
199
|
-
var import_react3 = require("react");
|
|
200
|
-
|
|
201
|
-
// src/core/portal/portal-context.ts
|
|
202
|
-
var import_react2 = require("react");
|
|
203
|
-
var PortalContext = (0, import_react2.createContext)(null);
|
|
204
|
-
|
|
205
|
-
// src/core/portal/portal-host.tsx
|
|
206
|
-
var import_react4 = __toESM(require("react"), 1);
|
|
207
|
-
var import_react_native3 = require("react-native");
|
|
208
|
-
var hostStyles = import_react_native3.StyleSheet.create({
|
|
209
|
-
container: {
|
|
210
|
-
flex: 1
|
|
211
|
-
}
|
|
212
|
-
});
|
|
213
|
-
|
|
214
|
-
// src/core/theme-context.tsx
|
|
215
|
-
var XUIThemeContext = (0, import_react5.createContext)(null);
|
|
216
|
-
|
|
217
|
-
// src/core/theme-hooks.ts
|
|
218
|
-
var import_react6 = require("react");
|
|
219
|
-
var import_react_native5 = require("react-native");
|
|
220
|
-
function useXUITheme() {
|
|
221
|
-
const theme = (0, import_react6.useContext)(XUIThemeContext);
|
|
222
|
-
if (!theme) {
|
|
223
|
-
throw new Error("useXUITheme must be used within XUIProvider");
|
|
224
|
-
}
|
|
225
|
-
return theme;
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
// src/core/index.ts
|
|
229
|
-
var import_theme2 = require("@xaui/core/theme");
|
|
230
158
|
|
|
231
|
-
|
|
159
|
+
var _core = require('@xaui/core');
|
|
232
160
|
function useSizeStyles(size, variant) {
|
|
233
|
-
const theme = useXUITheme();
|
|
234
|
-
const sizeStyles = (0,
|
|
161
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
162
|
+
const sizeStyles = _react.useMemo.call(void 0, () => {
|
|
235
163
|
const sizes = {
|
|
236
164
|
xs: {
|
|
237
165
|
checkboxSize: 14,
|
|
@@ -259,8 +187,8 @@ function useSizeStyles(size, variant) {
|
|
|
259
187
|
return sizeStyles;
|
|
260
188
|
}
|
|
261
189
|
function useRadiusStyles(radius) {
|
|
262
|
-
const theme = useXUITheme();
|
|
263
|
-
const radiusStyles = (0,
|
|
190
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
191
|
+
const radiusStyles = _react.useMemo.call(void 0, () => {
|
|
264
192
|
const radii = {
|
|
265
193
|
none: theme.borderRadius.none,
|
|
266
194
|
sm: theme.borderRadius.sm,
|
|
@@ -273,10 +201,10 @@ function useRadiusStyles(radius) {
|
|
|
273
201
|
return radiusStyles;
|
|
274
202
|
}
|
|
275
203
|
function useCheckmarkColors(themeColor, variant, isActive) {
|
|
276
|
-
const theme = useXUITheme();
|
|
277
|
-
const safeThemeColor = (0,
|
|
204
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
205
|
+
const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
|
|
278
206
|
const colorScheme = theme.colors[safeThemeColor];
|
|
279
|
-
const checkmarkColors = (0,
|
|
207
|
+
const checkmarkColors = _react.useMemo.call(void 0, () => {
|
|
280
208
|
if (variant === "filled") {
|
|
281
209
|
return {
|
|
282
210
|
checked: colorScheme.foreground,
|
|
@@ -303,10 +231,10 @@ function useCheckmarkColors(themeColor, variant, isActive) {
|
|
|
303
231
|
return checkmarkColors;
|
|
304
232
|
}
|
|
305
233
|
function useVariantStyles(themeColor, variant, isActive) {
|
|
306
|
-
const theme = useXUITheme();
|
|
307
|
-
const safeThemeColor = (0,
|
|
234
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
235
|
+
const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
|
|
308
236
|
const colorScheme = theme.colors[safeThemeColor];
|
|
309
|
-
const variantStyles = (0,
|
|
237
|
+
const variantStyles = _react.useMemo.call(void 0, () => {
|
|
310
238
|
if (variant === "filled") {
|
|
311
239
|
return {
|
|
312
240
|
backgroundColor: "transparent",
|
|
@@ -323,7 +251,7 @@ function useVariantStyles(themeColor, variant, isActive) {
|
|
|
323
251
|
return variantStyles;
|
|
324
252
|
}
|
|
325
253
|
function useContainerStyles(labelAlignment) {
|
|
326
|
-
const containerStyles = (0,
|
|
254
|
+
const containerStyles = _react.useMemo.call(void 0, () => {
|
|
327
255
|
const isJustified = labelAlignment === "justify-left" || labelAlignment === "justify-right";
|
|
328
256
|
return {
|
|
329
257
|
flexDirection: labelAlignment === "left" || labelAlignment === "justify-left" ? "row-reverse" : "row",
|
|
@@ -334,8 +262,8 @@ function useContainerStyles(labelAlignment) {
|
|
|
334
262
|
}
|
|
335
263
|
|
|
336
264
|
// src/components/checkbox/checkbox.style.ts
|
|
337
|
-
|
|
338
|
-
var styles =
|
|
265
|
+
|
|
266
|
+
var styles = _reactnative.StyleSheet.create({
|
|
339
267
|
container: {
|
|
340
268
|
flexDirection: "row",
|
|
341
269
|
alignItems: "center",
|
|
@@ -374,7 +302,7 @@ var styles = import_react_native6.StyleSheet.create({
|
|
|
374
302
|
});
|
|
375
303
|
|
|
376
304
|
// src/components/checkbox/checkbox.tsx
|
|
377
|
-
|
|
305
|
+
|
|
378
306
|
var Checkbox = ({
|
|
379
307
|
label,
|
|
380
308
|
labelAlignment = "right",
|
|
@@ -390,21 +318,21 @@ var Checkbox = ({
|
|
|
390
318
|
style,
|
|
391
319
|
onValueChange
|
|
392
320
|
}) => {
|
|
393
|
-
const theme = useXUITheme();
|
|
394
|
-
const colorScheme = theme.colors[(0,
|
|
321
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
322
|
+
const colorScheme = theme.colors[_core.getSafeThemeColor.call(void 0, themeColor)];
|
|
395
323
|
const isControlled = typeof isCheckedProp === "boolean";
|
|
396
|
-
const [internalChecked, setInternalChecked] = (0,
|
|
324
|
+
const [internalChecked, setInternalChecked] = _react.useState.call(void 0, _nullishCoalesce(isCheckedProp, () => ( false)));
|
|
397
325
|
const isChecked = isControlled ? isCheckedProp : internalChecked;
|
|
398
|
-
const scale = (0,
|
|
399
|
-
const backgroundScale = (0,
|
|
400
|
-
const backgroundOpacity = (0,
|
|
326
|
+
const scale = _react.useRef.call(void 0, new _reactnative.Animated.Value(1)).current;
|
|
327
|
+
const backgroundScale = _react.useRef.call(void 0, new _reactnative.Animated.Value(0.5)).current;
|
|
328
|
+
const backgroundOpacity = _react.useRef.call(void 0, new _reactnative.Animated.Value(0)).current;
|
|
401
329
|
const isActive = isChecked || isIndeterminate;
|
|
402
330
|
const sizeStyles = useSizeStyles(size, variant);
|
|
403
331
|
const radiusStyles = useRadiusStyles(radius);
|
|
404
332
|
const checkmarkColors = useCheckmarkColors(themeColor, variant, isActive);
|
|
405
333
|
const variantStyles = useVariantStyles(themeColor, variant, isActive);
|
|
406
334
|
const containerStyles = useContainerStyles(labelAlignment);
|
|
407
|
-
(0,
|
|
335
|
+
_react.useEffect.call(void 0, () => {
|
|
408
336
|
if (variant !== "filled") return;
|
|
409
337
|
if (isActive) {
|
|
410
338
|
runBackgroundInAnimation(backgroundScale, backgroundOpacity);
|
|
@@ -415,7 +343,7 @@ var Checkbox = ({
|
|
|
415
343
|
const handlePress = () => {
|
|
416
344
|
if (!isDisabled) {
|
|
417
345
|
const nextValue = isIndeterminate ? true : !isChecked;
|
|
418
|
-
onValueChange
|
|
346
|
+
_optionalChain([onValueChange, 'optionalCall', _ => _(nextValue)]);
|
|
419
347
|
if (!isControlled) {
|
|
420
348
|
setInternalChecked(nextValue);
|
|
421
349
|
}
|
|
@@ -432,8 +360,8 @@ var Checkbox = ({
|
|
|
432
360
|
}
|
|
433
361
|
};
|
|
434
362
|
const accessibilityChecked = isIndeterminate ? "mixed" : isChecked;
|
|
435
|
-
return /* @__PURE__ */
|
|
436
|
-
|
|
363
|
+
return /* @__PURE__ */ _react2.default.createElement(
|
|
364
|
+
_reactnative.Pressable,
|
|
437
365
|
{
|
|
438
366
|
onPress: handlePress,
|
|
439
367
|
onPressIn: handlePressIn,
|
|
@@ -454,8 +382,8 @@ var Checkbox = ({
|
|
|
454
382
|
style
|
|
455
383
|
]
|
|
456
384
|
},
|
|
457
|
-
/* @__PURE__ */
|
|
458
|
-
|
|
385
|
+
/* @__PURE__ */ _react2.default.createElement(
|
|
386
|
+
_reactnative.Animated.View,
|
|
459
387
|
{
|
|
460
388
|
style: [
|
|
461
389
|
styles.checkbox,
|
|
@@ -470,8 +398,8 @@ var Checkbox = ({
|
|
|
470
398
|
}
|
|
471
399
|
]
|
|
472
400
|
},
|
|
473
|
-
variant === "filled" && /* @__PURE__ */
|
|
474
|
-
|
|
401
|
+
variant === "filled" && /* @__PURE__ */ _react2.default.createElement(
|
|
402
|
+
_reactnative.Animated.View,
|
|
475
403
|
{
|
|
476
404
|
style: [
|
|
477
405
|
styles.background,
|
|
@@ -484,7 +412,7 @@ var Checkbox = ({
|
|
|
484
412
|
]
|
|
485
413
|
}
|
|
486
414
|
),
|
|
487
|
-
/* @__PURE__ */
|
|
415
|
+
/* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.checkmarkContainer }, /* @__PURE__ */ _react2.default.createElement(
|
|
488
416
|
CheckboxIcon,
|
|
489
417
|
{
|
|
490
418
|
isChecked: isActive,
|
|
@@ -496,8 +424,8 @@ var Checkbox = ({
|
|
|
496
424
|
}
|
|
497
425
|
))
|
|
498
426
|
),
|
|
499
|
-
label && /* @__PURE__ */
|
|
500
|
-
|
|
427
|
+
label && /* @__PURE__ */ _react2.default.createElement(
|
|
428
|
+
_reactnative.Text,
|
|
501
429
|
{
|
|
502
430
|
style: [
|
|
503
431
|
styles.label,
|
|
@@ -510,7 +438,6 @@ var Checkbox = ({
|
|
|
510
438
|
)
|
|
511
439
|
);
|
|
512
440
|
};
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
});
|
|
441
|
+
|
|
442
|
+
|
|
443
|
+
exports.Checkbox = Checkbox;
|
package/dist/checkbox/index.js
CHANGED