@xaui/native 0.0.32 → 0.0.34
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/alert/index.cjs +1 -1
- package/dist/alert/index.js +1 -1
- package/dist/app-bar/index.cjs +1 -1
- package/dist/app-bar/index.js +1 -1
- package/dist/autocomplete/index.cjs +1 -1
- package/dist/autocomplete/index.js +1 -1
- package/dist/avatar/index.cjs +1 -1
- package/dist/avatar/index.js +1 -1
- package/dist/badge/index.cjs +1 -1
- package/dist/badge/index.js +1 -1
- package/dist/bottom-sheet/index.cjs +5 -4
- package/dist/bottom-sheet/index.js +3 -2
- package/dist/bottom-tab-bar/index.cjs +1 -1
- package/dist/bottom-tab-bar/index.js +1 -1
- package/dist/button/index.cjs +1 -1
- package/dist/button/index.js +1 -1
- package/dist/card/index.cjs +1 -1
- package/dist/card/index.js +1 -1
- package/dist/checkbox/index.cjs +1 -1
- package/dist/checkbox/index.js +1 -1
- package/dist/chip/index.cjs +1 -1
- package/dist/chip/index.js +1 -1
- package/dist/chunk-2ANGPYCP.cjs +308 -0
- package/dist/{chunk-HSPTLUFA.cjs → chunk-56RPWZD2.cjs} +3 -1
- package/dist/chunk-DECMUMCI.js +0 -0
- package/dist/chunk-E4DOPNVW.js +308 -0
- package/dist/chunk-EUQDGTST.cjs +1 -0
- package/dist/{chunk-DXXNBF5P.js → chunk-SHBDANQN.js} +3 -1
- package/dist/color-picker/index.cjs +460 -0
- package/dist/color-picker/index.d.cts +124 -0
- package/dist/color-picker/index.d.ts +124 -0
- package/dist/color-picker/index.js +460 -0
- package/dist/core/index.cjs +4 -2
- package/dist/core/index.d.cts +1 -0
- package/dist/core/index.d.ts +1 -0
- package/dist/core/index.js +3 -1
- package/dist/datepicker/index.cjs +1 -1
- package/dist/datepicker/index.js +1 -1
- package/dist/divider/index.cjs +1 -1
- package/dist/divider/index.js +1 -1
- package/dist/drawer/index.cjs +1 -1
- package/dist/drawer/index.js +1 -1
- package/dist/expansion-panel/index.cjs +1 -1
- package/dist/expansion-panel/index.js +1 -1
- package/dist/fab/index.cjs +1 -1
- package/dist/fab/index.js +1 -1
- package/dist/fab-menu/index.cjs +1 -1
- package/dist/fab-menu/index.js +1 -1
- package/dist/feature-discovery/index.cjs +1 -1
- package/dist/feature-discovery/index.js +1 -1
- package/dist/indicator/index.cjs +1 -1
- package/dist/indicator/index.js +1 -1
- package/dist/input/index.cjs +1 -1
- package/dist/input/index.js +1 -1
- package/dist/input-trigger/index.cjs +8 -0
- package/dist/input-trigger/index.d.cts +9 -0
- package/dist/input-trigger/index.d.ts +9 -0
- package/dist/input-trigger/index.js +8 -0
- package/dist/input-trigger.type-BL70fHE9.d.cts +97 -0
- package/dist/input-trigger.type-BODYStHk.d.ts +97 -0
- package/dist/list/index.cjs +1 -1
- package/dist/list/index.js +1 -1
- package/dist/menu/index.cjs +1 -1
- package/dist/menu/index.js +1 -1
- package/dist/menubox/index.cjs +1 -1
- package/dist/menubox/index.js +1 -1
- package/dist/picker/index.cjs +250 -0
- package/dist/picker/index.d.cts +121 -0
- package/dist/picker/index.d.ts +121 -0
- package/dist/picker/index.js +250 -0
- package/dist/progress/index.cjs +1 -1
- package/dist/progress/index.js +1 -1
- package/dist/radio/index.cjs +1 -1
- package/dist/radio/index.js +1 -1
- package/dist/segment-button/index.cjs +1 -1
- package/dist/segment-button/index.js +1 -1
- package/dist/select/index.cjs +1 -1
- package/dist/select/index.js +1 -1
- package/dist/skeleton/index.cjs +1 -1
- package/dist/skeleton/index.js +1 -1
- package/dist/slider/index.cjs +1 -1
- package/dist/slider/index.js +1 -1
- package/dist/snackbar/index.cjs +1 -1
- package/dist/snackbar/index.js +1 -1
- package/dist/snippet/index.cjs +1 -1
- package/dist/snippet/index.js +1 -1
- package/dist/stepper/index.cjs +1 -1
- package/dist/stepper/index.js +1 -1
- package/dist/switch/index.cjs +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/tabs/index.cjs +1 -1
- package/dist/tabs/index.js +1 -1
- package/dist/timepicker/index.cjs +5 -4
- package/dist/timepicker/index.js +3 -2
- package/dist/toolbar/index.cjs +1 -1
- package/dist/toolbar/index.js +1 -1
- package/dist/typography/index.cjs +1 -1
- package/dist/typography/index.js +1 -1
- package/package.json +16 -1
- /package/dist/{chunk-HC2SSHNU.js → chunk-ED22WCCI.js} +0 -0
- /package/dist/{chunk-XFPPR2VB.cjs → chunk-RVR42THG.cjs} +0 -0
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { I as InputTriggerProps } from '../input-trigger.type-BL70fHE9.cjs';
|
|
3
|
+
export { e as InputTriggerCustomAppearance, a as InputTriggerEvents, d as InputTriggerLabelPlacement, c as InputTriggerSize, b as InputTriggerVariant } from '../input-trigger.type-BL70fHE9.cjs';
|
|
4
|
+
import 'react-native';
|
|
5
|
+
import '../index-DyU3sW3_.cjs';
|
|
6
|
+
|
|
7
|
+
declare const InputTrigger: React.FC<InputTriggerProps>;
|
|
8
|
+
|
|
9
|
+
export { InputTrigger, InputTriggerProps };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { I as InputTriggerProps } from '../input-trigger.type-BODYStHk.js';
|
|
3
|
+
export { e as InputTriggerCustomAppearance, a as InputTriggerEvents, d as InputTriggerLabelPlacement, c as InputTriggerSize, b as InputTriggerVariant } from '../input-trigger.type-BODYStHk.js';
|
|
4
|
+
import 'react-native';
|
|
5
|
+
import '../index-DyU3sW3_.js';
|
|
6
|
+
|
|
7
|
+
declare const InputTrigger: React.FC<InputTriggerProps>;
|
|
8
|
+
|
|
9
|
+
export { InputTrigger, InputTriggerProps };
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { StyleProp, ViewStyle, TextStyle } from 'react-native';
|
|
3
|
+
import { T as ThemeColor, R as Radius } from './index-DyU3sW3_.cjs';
|
|
4
|
+
|
|
5
|
+
type InputTriggerVariant = 'flat' | 'faded' | 'bordered' | 'underlined';
|
|
6
|
+
type InputTriggerSize = 'sm' | 'md' | 'lg';
|
|
7
|
+
type InputTriggerLabelPlacement = 'outside' | 'inside';
|
|
8
|
+
type InputTriggerCustomAppearance = {
|
|
9
|
+
container?: StyleProp<ViewStyle>;
|
|
10
|
+
inputContainer?: StyleProp<ViewStyle>;
|
|
11
|
+
inputWrapper?: StyleProp<ViewStyle>;
|
|
12
|
+
label?: StyleProp<TextStyle>;
|
|
13
|
+
content?: StyleProp<TextStyle>;
|
|
14
|
+
helperText?: StyleProp<TextStyle>;
|
|
15
|
+
};
|
|
16
|
+
type InputTriggerProps = {
|
|
17
|
+
/**
|
|
18
|
+
* Value displayed inside the trigger (acts as placeholder when no value).
|
|
19
|
+
*/
|
|
20
|
+
value?: ReactNode;
|
|
21
|
+
/**
|
|
22
|
+
* Placeholder text shown when no value is set.
|
|
23
|
+
*/
|
|
24
|
+
placeholder?: string;
|
|
25
|
+
/**
|
|
26
|
+
* Label displayed above or inside the trigger.
|
|
27
|
+
*/
|
|
28
|
+
label?: ReactNode;
|
|
29
|
+
/**
|
|
30
|
+
* Position of the label relative to the trigger.
|
|
31
|
+
* @default 'outside'
|
|
32
|
+
*/
|
|
33
|
+
labelPlacement?: InputTriggerLabelPlacement;
|
|
34
|
+
/**
|
|
35
|
+
* Helper text displayed below the trigger.
|
|
36
|
+
*/
|
|
37
|
+
description?: ReactNode;
|
|
38
|
+
/**
|
|
39
|
+
* Error message displayed when isInvalid is true.
|
|
40
|
+
*/
|
|
41
|
+
errorMessage?: ReactNode;
|
|
42
|
+
/**
|
|
43
|
+
* Content rendered at the start of the trigger.
|
|
44
|
+
*/
|
|
45
|
+
startContent?: ReactNode;
|
|
46
|
+
/**
|
|
47
|
+
* Content rendered at the end of the trigger.
|
|
48
|
+
*/
|
|
49
|
+
endContent?: ReactNode;
|
|
50
|
+
/**
|
|
51
|
+
* Theme color for focus and active states.
|
|
52
|
+
* @default 'primary'
|
|
53
|
+
*/
|
|
54
|
+
themeColor?: ThemeColor;
|
|
55
|
+
/**
|
|
56
|
+
* Visual style variant.
|
|
57
|
+
* @default 'flat'
|
|
58
|
+
*/
|
|
59
|
+
variant?: InputTriggerVariant;
|
|
60
|
+
/**
|
|
61
|
+
* Size of the trigger.
|
|
62
|
+
* @default 'md'
|
|
63
|
+
*/
|
|
64
|
+
size?: InputTriggerSize;
|
|
65
|
+
/**
|
|
66
|
+
* Border radius of the trigger.
|
|
67
|
+
* @default 'md'
|
|
68
|
+
*/
|
|
69
|
+
radius?: Radius;
|
|
70
|
+
/**
|
|
71
|
+
* Whether the trigger is disabled.
|
|
72
|
+
* @default false
|
|
73
|
+
*/
|
|
74
|
+
isDisabled?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Whether the trigger is in an invalid state.
|
|
77
|
+
* @default false
|
|
78
|
+
*/
|
|
79
|
+
isInvalid?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Whether the component takes the full available width.
|
|
82
|
+
* @default true
|
|
83
|
+
*/
|
|
84
|
+
fullWidth?: boolean;
|
|
85
|
+
/**
|
|
86
|
+
* Custom style overrides for trigger parts.
|
|
87
|
+
*/
|
|
88
|
+
customAppearance?: InputTriggerCustomAppearance;
|
|
89
|
+
} & InputTriggerEvents;
|
|
90
|
+
type InputTriggerEvents = {
|
|
91
|
+
/**
|
|
92
|
+
* Called when the trigger is pressed.
|
|
93
|
+
*/
|
|
94
|
+
onPress?: () => void;
|
|
95
|
+
};
|
|
96
|
+
|
|
97
|
+
export type { InputTriggerProps as I, InputTriggerEvents as a, InputTriggerVariant as b, InputTriggerSize as c, InputTriggerLabelPlacement as d, InputTriggerCustomAppearance as e };
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { StyleProp, ViewStyle, TextStyle } from 'react-native';
|
|
3
|
+
import { T as ThemeColor, R as Radius } from './index-DyU3sW3_.js';
|
|
4
|
+
|
|
5
|
+
type InputTriggerVariant = 'flat' | 'faded' | 'bordered' | 'underlined';
|
|
6
|
+
type InputTriggerSize = 'sm' | 'md' | 'lg';
|
|
7
|
+
type InputTriggerLabelPlacement = 'outside' | 'inside';
|
|
8
|
+
type InputTriggerCustomAppearance = {
|
|
9
|
+
container?: StyleProp<ViewStyle>;
|
|
10
|
+
inputContainer?: StyleProp<ViewStyle>;
|
|
11
|
+
inputWrapper?: StyleProp<ViewStyle>;
|
|
12
|
+
label?: StyleProp<TextStyle>;
|
|
13
|
+
content?: StyleProp<TextStyle>;
|
|
14
|
+
helperText?: StyleProp<TextStyle>;
|
|
15
|
+
};
|
|
16
|
+
type InputTriggerProps = {
|
|
17
|
+
/**
|
|
18
|
+
* Value displayed inside the trigger (acts as placeholder when no value).
|
|
19
|
+
*/
|
|
20
|
+
value?: ReactNode;
|
|
21
|
+
/**
|
|
22
|
+
* Placeholder text shown when no value is set.
|
|
23
|
+
*/
|
|
24
|
+
placeholder?: string;
|
|
25
|
+
/**
|
|
26
|
+
* Label displayed above or inside the trigger.
|
|
27
|
+
*/
|
|
28
|
+
label?: ReactNode;
|
|
29
|
+
/**
|
|
30
|
+
* Position of the label relative to the trigger.
|
|
31
|
+
* @default 'outside'
|
|
32
|
+
*/
|
|
33
|
+
labelPlacement?: InputTriggerLabelPlacement;
|
|
34
|
+
/**
|
|
35
|
+
* Helper text displayed below the trigger.
|
|
36
|
+
*/
|
|
37
|
+
description?: ReactNode;
|
|
38
|
+
/**
|
|
39
|
+
* Error message displayed when isInvalid is true.
|
|
40
|
+
*/
|
|
41
|
+
errorMessage?: ReactNode;
|
|
42
|
+
/**
|
|
43
|
+
* Content rendered at the start of the trigger.
|
|
44
|
+
*/
|
|
45
|
+
startContent?: ReactNode;
|
|
46
|
+
/**
|
|
47
|
+
* Content rendered at the end of the trigger.
|
|
48
|
+
*/
|
|
49
|
+
endContent?: ReactNode;
|
|
50
|
+
/**
|
|
51
|
+
* Theme color for focus and active states.
|
|
52
|
+
* @default 'primary'
|
|
53
|
+
*/
|
|
54
|
+
themeColor?: ThemeColor;
|
|
55
|
+
/**
|
|
56
|
+
* Visual style variant.
|
|
57
|
+
* @default 'flat'
|
|
58
|
+
*/
|
|
59
|
+
variant?: InputTriggerVariant;
|
|
60
|
+
/**
|
|
61
|
+
* Size of the trigger.
|
|
62
|
+
* @default 'md'
|
|
63
|
+
*/
|
|
64
|
+
size?: InputTriggerSize;
|
|
65
|
+
/**
|
|
66
|
+
* Border radius of the trigger.
|
|
67
|
+
* @default 'md'
|
|
68
|
+
*/
|
|
69
|
+
radius?: Radius;
|
|
70
|
+
/**
|
|
71
|
+
* Whether the trigger is disabled.
|
|
72
|
+
* @default false
|
|
73
|
+
*/
|
|
74
|
+
isDisabled?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Whether the trigger is in an invalid state.
|
|
77
|
+
* @default false
|
|
78
|
+
*/
|
|
79
|
+
isInvalid?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Whether the component takes the full available width.
|
|
82
|
+
* @default true
|
|
83
|
+
*/
|
|
84
|
+
fullWidth?: boolean;
|
|
85
|
+
/**
|
|
86
|
+
* Custom style overrides for trigger parts.
|
|
87
|
+
*/
|
|
88
|
+
customAppearance?: InputTriggerCustomAppearance;
|
|
89
|
+
} & InputTriggerEvents;
|
|
90
|
+
type InputTriggerEvents = {
|
|
91
|
+
/**
|
|
92
|
+
* Called when the trigger is pressed.
|
|
93
|
+
*/
|
|
94
|
+
onPress?: () => void;
|
|
95
|
+
};
|
|
96
|
+
|
|
97
|
+
export type { InputTriggerProps as I, InputTriggerEvents as a, InputTriggerVariant as b, InputTriggerSize as c, InputTriggerLabelPlacement as d, InputTriggerCustomAppearance as e };
|
package/dist/list/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
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-
|
|
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-56RPWZD2.cjs');
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
var _chunkOQ2BLOOGcjs = require('../chunk-OQ2BLOOG.cjs');
|
package/dist/list/index.js
CHANGED
package/dist/menu/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
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; }require('../chunk-
|
|
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; }require('../chunk-56RPWZD2.cjs');
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
var _chunkOQ2BLOOGcjs = require('../chunk-OQ2BLOOG.cjs');
|
package/dist/menu/index.js
CHANGED
package/dist/menubox/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
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-
|
|
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-56RPWZD2.cjs');
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
var _chunkOQ2BLOOGcjs = require('../chunk-OQ2BLOOG.cjs');
|
package/dist/menubox/index.js
CHANGED
|
@@ -0,0 +1,250 @@
|
|
|
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 _chunk2ANGPYCPcjs = require('../chunk-2ANGPYCP.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
var _chunkRVR42THGcjs = require('../chunk-RVR42THG.cjs');
|
|
7
|
+
require('../chunk-56RPWZD2.cjs');
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
var _chunkOQ2BLOOGcjs = require('../chunk-OQ2BLOOG.cjs');
|
|
11
|
+
|
|
12
|
+
// src/components/picker/picker.tsx
|
|
13
|
+
var _react = require('react'); var _react2 = _interopRequireDefault(_react);
|
|
14
|
+
var _reactnative = require('react-native');
|
|
15
|
+
var _core = require('@xaui/core');
|
|
16
|
+
|
|
17
|
+
// src/components/picker/picker.style.ts
|
|
18
|
+
|
|
19
|
+
var styles = _reactnative.StyleSheet.create({
|
|
20
|
+
sheetContent: {
|
|
21
|
+
flex: 1,
|
|
22
|
+
paddingBottom: 24
|
|
23
|
+
},
|
|
24
|
+
sheetTitle: {
|
|
25
|
+
paddingHorizontal: 20,
|
|
26
|
+
paddingTop: 4,
|
|
27
|
+
paddingBottom: 12,
|
|
28
|
+
fontSize: 16,
|
|
29
|
+
fontWeight: "600"
|
|
30
|
+
},
|
|
31
|
+
optionItem: {
|
|
32
|
+
flexDirection: "row",
|
|
33
|
+
alignItems: "center",
|
|
34
|
+
paddingHorizontal: 20,
|
|
35
|
+
paddingVertical: 14,
|
|
36
|
+
gap: 12
|
|
37
|
+
},
|
|
38
|
+
optionItemDisabled: {
|
|
39
|
+
opacity: 0.4
|
|
40
|
+
},
|
|
41
|
+
optionLabel: {
|
|
42
|
+
flex: 1,
|
|
43
|
+
fontSize: 16
|
|
44
|
+
},
|
|
45
|
+
checkmark: {
|
|
46
|
+
width: 20,
|
|
47
|
+
height: 20,
|
|
48
|
+
borderRadius: 10,
|
|
49
|
+
alignItems: "center",
|
|
50
|
+
justifyContent: "center"
|
|
51
|
+
},
|
|
52
|
+
divider: {
|
|
53
|
+
height: _reactnative.StyleSheet.hairlineWidth,
|
|
54
|
+
marginHorizontal: 20
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
// src/components/picker/picker.tsx
|
|
59
|
+
var ChevronDownIcon = ({
|
|
60
|
+
color,
|
|
61
|
+
size
|
|
62
|
+
}) => /* @__PURE__ */ _react2.default.createElement(
|
|
63
|
+
_reactnative.View,
|
|
64
|
+
{
|
|
65
|
+
style: {
|
|
66
|
+
width: size,
|
|
67
|
+
height: size,
|
|
68
|
+
alignItems: "center",
|
|
69
|
+
justifyContent: "center"
|
|
70
|
+
}
|
|
71
|
+
},
|
|
72
|
+
/* @__PURE__ */ _react2.default.createElement(
|
|
73
|
+
_reactnative.View,
|
|
74
|
+
{
|
|
75
|
+
style: {
|
|
76
|
+
width: size * 0.5,
|
|
77
|
+
height: size * 0.5,
|
|
78
|
+
borderRightWidth: 2,
|
|
79
|
+
borderBottomWidth: 2,
|
|
80
|
+
borderColor: color,
|
|
81
|
+
transform: [{ rotate: "45deg" }],
|
|
82
|
+
marginTop: -(size * 0.15)
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
)
|
|
86
|
+
);
|
|
87
|
+
var CheckIcon = ({ color }) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: { width: 20, height: 20, alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ _react2.default.createElement(
|
|
88
|
+
_reactnative.View,
|
|
89
|
+
{
|
|
90
|
+
style: {
|
|
91
|
+
width: 6,
|
|
92
|
+
height: 10,
|
|
93
|
+
borderRightWidth: 2,
|
|
94
|
+
borderBottomWidth: 2,
|
|
95
|
+
borderColor: color,
|
|
96
|
+
transform: [{ rotate: "45deg" }],
|
|
97
|
+
marginTop: -3
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
));
|
|
101
|
+
var OptionItem = ({
|
|
102
|
+
option,
|
|
103
|
+
isSelected,
|
|
104
|
+
themeColor,
|
|
105
|
+
foreground,
|
|
106
|
+
onSelect
|
|
107
|
+
}) => {
|
|
108
|
+
const handlePress = () => {
|
|
109
|
+
if (!option.disabled) {
|
|
110
|
+
onSelect(option.value);
|
|
111
|
+
}
|
|
112
|
+
};
|
|
113
|
+
return /* @__PURE__ */ _react2.default.createElement(
|
|
114
|
+
_reactnative.Pressable,
|
|
115
|
+
{
|
|
116
|
+
onPress: handlePress,
|
|
117
|
+
style: [styles.optionItem, option.disabled && styles.optionItemDisabled],
|
|
118
|
+
disabled: option.disabled
|
|
119
|
+
},
|
|
120
|
+
/* @__PURE__ */ _react2.default.createElement(
|
|
121
|
+
_reactnative.Text,
|
|
122
|
+
{
|
|
123
|
+
style: [
|
|
124
|
+
styles.optionLabel,
|
|
125
|
+
{ color: isSelected ? themeColor : foreground }
|
|
126
|
+
]
|
|
127
|
+
},
|
|
128
|
+
option.label
|
|
129
|
+
),
|
|
130
|
+
isSelected && /* @__PURE__ */ _react2.default.createElement(CheckIcon, { color: themeColor })
|
|
131
|
+
);
|
|
132
|
+
};
|
|
133
|
+
var Picker = ({
|
|
134
|
+
options,
|
|
135
|
+
value,
|
|
136
|
+
placeholder = "Select an option...",
|
|
137
|
+
label,
|
|
138
|
+
labelPlacement = "outside",
|
|
139
|
+
description,
|
|
140
|
+
errorMessage,
|
|
141
|
+
sheetTitle,
|
|
142
|
+
themeColor = "primary",
|
|
143
|
+
variant = "flat",
|
|
144
|
+
size = "md",
|
|
145
|
+
radius = "md",
|
|
146
|
+
isOpened,
|
|
147
|
+
isDisabled = false,
|
|
148
|
+
isInvalid = false,
|
|
149
|
+
fullWidth = true,
|
|
150
|
+
sheetStyle,
|
|
151
|
+
endContent,
|
|
152
|
+
onValueChange,
|
|
153
|
+
onOpenChange,
|
|
154
|
+
onClose
|
|
155
|
+
}) => {
|
|
156
|
+
const [internalIsOpen, setInternalIsOpen] = _react.useState.call(void 0, false);
|
|
157
|
+
const isControlled = isOpened !== void 0;
|
|
158
|
+
const isOpen = isControlled ? Boolean(isOpened) : internalIsOpen;
|
|
159
|
+
const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
|
|
160
|
+
const sheetBackground = theme.mode === "dark" ? theme.colors.background : "#ffffff";
|
|
161
|
+
const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
|
|
162
|
+
const colorScheme = theme.colors[safeThemeColor];
|
|
163
|
+
const selectedOption = options.find((opt) => opt.value === value);
|
|
164
|
+
const displayLabel = _optionalChain([selectedOption, 'optionalAccess', _ => _.label]);
|
|
165
|
+
const setOpen = (nextOpen) => {
|
|
166
|
+
if (nextOpen && isDisabled) return;
|
|
167
|
+
if (!isControlled) {
|
|
168
|
+
setInternalIsOpen(nextOpen);
|
|
169
|
+
}
|
|
170
|
+
_optionalChain([onOpenChange, 'optionalCall', _2 => _2(nextOpen)]);
|
|
171
|
+
};
|
|
172
|
+
const handleOpen = () => {
|
|
173
|
+
setOpen(true);
|
|
174
|
+
};
|
|
175
|
+
const requestClose = () => {
|
|
176
|
+
setOpen(false);
|
|
177
|
+
};
|
|
178
|
+
const handleSheetClose = () => {
|
|
179
|
+
if (isOpen) {
|
|
180
|
+
setOpen(false);
|
|
181
|
+
}
|
|
182
|
+
_optionalChain([onClose, 'optionalCall', _3 => _3()]);
|
|
183
|
+
};
|
|
184
|
+
const handleSelect = (selectedValue) => {
|
|
185
|
+
_optionalChain([onValueChange, 'optionalCall', _4 => _4(selectedValue)]);
|
|
186
|
+
requestClose();
|
|
187
|
+
};
|
|
188
|
+
const chevronColor = _core.withOpacity.call(void 0, theme.colors.foreground, 0.45);
|
|
189
|
+
return /* @__PURE__ */ _react2.default.createElement(_react2.default.Fragment, null, /* @__PURE__ */ _react2.default.createElement(
|
|
190
|
+
_chunk2ANGPYCPcjs.InputTrigger,
|
|
191
|
+
{
|
|
192
|
+
value: displayLabel,
|
|
193
|
+
placeholder,
|
|
194
|
+
label,
|
|
195
|
+
labelPlacement,
|
|
196
|
+
description,
|
|
197
|
+
errorMessage,
|
|
198
|
+
themeColor,
|
|
199
|
+
variant,
|
|
200
|
+
size,
|
|
201
|
+
radius,
|
|
202
|
+
isDisabled,
|
|
203
|
+
isInvalid,
|
|
204
|
+
fullWidth,
|
|
205
|
+
endContent: _nullishCoalesce(endContent, () => ( /* @__PURE__ */ _react2.default.createElement(ChevronDownIcon, { color: chevronColor, size: 20 }))),
|
|
206
|
+
onPress: handleOpen
|
|
207
|
+
}
|
|
208
|
+
), /* @__PURE__ */ _react2.default.createElement(
|
|
209
|
+
_chunkRVR42THGcjs.BottomSheet,
|
|
210
|
+
{
|
|
211
|
+
isOpen,
|
|
212
|
+
snapPoints: [Math.min(0.35 + options.length * 0.065, 0.85)],
|
|
213
|
+
themeColor,
|
|
214
|
+
onClose: handleSheetClose,
|
|
215
|
+
style: { backgroundColor: sheetBackground, ...sheetStyle }
|
|
216
|
+
},
|
|
217
|
+
/* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.sheetContent }, sheetTitle ? /* @__PURE__ */ _react2.default.createElement(
|
|
218
|
+
_reactnative.Text,
|
|
219
|
+
{
|
|
220
|
+
style: [styles.sheetTitle, { color: theme.colors.foreground }]
|
|
221
|
+
},
|
|
222
|
+
sheetTitle
|
|
223
|
+
) : null, /* @__PURE__ */ _react2.default.createElement(_reactnative.ScrollView, null, options.map((option, index) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { key: option.value }, /* @__PURE__ */ _react2.default.createElement(
|
|
224
|
+
OptionItem,
|
|
225
|
+
{
|
|
226
|
+
option,
|
|
227
|
+
isSelected: option.value === value,
|
|
228
|
+
themeColor: colorScheme.main,
|
|
229
|
+
foreground: theme.colors.foreground,
|
|
230
|
+
onSelect: handleSelect
|
|
231
|
+
}
|
|
232
|
+
), index < options.length - 1 && /* @__PURE__ */ _react2.default.createElement(
|
|
233
|
+
_reactnative.View,
|
|
234
|
+
{
|
|
235
|
+
style: [
|
|
236
|
+
styles.divider,
|
|
237
|
+
{
|
|
238
|
+
backgroundColor: _core.withOpacity.call(void 0,
|
|
239
|
+
theme.colors.foreground,
|
|
240
|
+
0.06
|
|
241
|
+
)
|
|
242
|
+
}
|
|
243
|
+
]
|
|
244
|
+
}
|
|
245
|
+
)))))
|
|
246
|
+
));
|
|
247
|
+
};
|
|
248
|
+
|
|
249
|
+
|
|
250
|
+
exports.Picker = Picker;
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { ViewStyle } from 'react-native';
|
|
3
|
+
import { T as ThemeColor, R as Radius } from '../index-DyU3sW3_.cjs';
|
|
4
|
+
import { d as InputTriggerLabelPlacement, b as InputTriggerVariant, c as InputTriggerSize } from '../input-trigger.type-BL70fHE9.cjs';
|
|
5
|
+
|
|
6
|
+
type PickerOption = {
|
|
7
|
+
/**
|
|
8
|
+
* Display label for the option.
|
|
9
|
+
*/
|
|
10
|
+
label: string;
|
|
11
|
+
/**
|
|
12
|
+
* Unique value for the option.
|
|
13
|
+
*/
|
|
14
|
+
value: string;
|
|
15
|
+
/**
|
|
16
|
+
* Whether this option is disabled.
|
|
17
|
+
* @default false
|
|
18
|
+
*/
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
};
|
|
21
|
+
type PickerProps = {
|
|
22
|
+
/**
|
|
23
|
+
* List of selectable options.
|
|
24
|
+
*/
|
|
25
|
+
options: PickerOption[];
|
|
26
|
+
/**
|
|
27
|
+
* Currently selected value (controlled).
|
|
28
|
+
*/
|
|
29
|
+
value?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Placeholder text shown when no value is selected.
|
|
32
|
+
* @default 'Select an option...'
|
|
33
|
+
*/
|
|
34
|
+
placeholder?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Label displayed above or inside the trigger.
|
|
37
|
+
*/
|
|
38
|
+
label?: ReactNode;
|
|
39
|
+
/**
|
|
40
|
+
* Position of the label relative to the trigger.
|
|
41
|
+
* @default 'outside'
|
|
42
|
+
*/
|
|
43
|
+
labelPlacement?: InputTriggerLabelPlacement;
|
|
44
|
+
/**
|
|
45
|
+
* Helper text displayed below the trigger.
|
|
46
|
+
*/
|
|
47
|
+
description?: ReactNode;
|
|
48
|
+
/**
|
|
49
|
+
* Error message when isInvalid is true.
|
|
50
|
+
*/
|
|
51
|
+
errorMessage?: ReactNode;
|
|
52
|
+
/**
|
|
53
|
+
* Title displayed inside the bottom sheet.
|
|
54
|
+
*/
|
|
55
|
+
sheetTitle?: string;
|
|
56
|
+
/**
|
|
57
|
+
* Theme color.
|
|
58
|
+
* @default 'primary'
|
|
59
|
+
*/
|
|
60
|
+
themeColor?: ThemeColor;
|
|
61
|
+
/**
|
|
62
|
+
* Visual variant of the trigger.
|
|
63
|
+
* @default 'flat'
|
|
64
|
+
*/
|
|
65
|
+
variant?: InputTriggerVariant;
|
|
66
|
+
/**
|
|
67
|
+
* Size of the trigger.
|
|
68
|
+
* @default 'md'
|
|
69
|
+
*/
|
|
70
|
+
size?: InputTriggerSize;
|
|
71
|
+
/**
|
|
72
|
+
* Border radius.
|
|
73
|
+
* @default 'md'
|
|
74
|
+
*/
|
|
75
|
+
radius?: Radius;
|
|
76
|
+
/**
|
|
77
|
+
* Controlled open state of the sheet.
|
|
78
|
+
*/
|
|
79
|
+
isOpened?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Whether the trigger is disabled.
|
|
82
|
+
* @default false
|
|
83
|
+
*/
|
|
84
|
+
isDisabled?: boolean;
|
|
85
|
+
/**
|
|
86
|
+
* Whether the trigger is in an invalid state.
|
|
87
|
+
* @default false
|
|
88
|
+
*/
|
|
89
|
+
isInvalid?: boolean;
|
|
90
|
+
/**
|
|
91
|
+
* Whether the trigger takes full available width.
|
|
92
|
+
* @default true
|
|
93
|
+
*/
|
|
94
|
+
fullWidth?: boolean;
|
|
95
|
+
/**
|
|
96
|
+
* Custom style for the bottom sheet container.
|
|
97
|
+
*/
|
|
98
|
+
sheetStyle?: ViewStyle;
|
|
99
|
+
/**
|
|
100
|
+
* Custom end content for the trigger (replaces chevron).
|
|
101
|
+
*/
|
|
102
|
+
endContent?: ReactNode;
|
|
103
|
+
} & PickerEvents;
|
|
104
|
+
type PickerEvents = {
|
|
105
|
+
/**
|
|
106
|
+
* Called when the selected value changes.
|
|
107
|
+
*/
|
|
108
|
+
onValueChange?: (value: string) => void;
|
|
109
|
+
/**
|
|
110
|
+
* Called when the sheet opens or closes.
|
|
111
|
+
*/
|
|
112
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
113
|
+
/**
|
|
114
|
+
* Called when the sheet closes.
|
|
115
|
+
*/
|
|
116
|
+
onClose?: () => void;
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
declare const Picker: React.FC<PickerProps>;
|
|
120
|
+
|
|
121
|
+
export { Picker, type PickerEvents, type PickerOption, type PickerProps };
|