@bacon-pos/ui 0.5.1 → 0.7.0
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/lib/commonjs/components/Dropdown/Dropdown.js +282 -0
- package/lib/commonjs/components/Dropdown/Dropdown.js.map +1 -0
- package/lib/commonjs/components/Dropdown/Dropdown.stories.js +519 -0
- package/lib/commonjs/components/Dropdown/Dropdown.stories.js.map +1 -0
- package/lib/commonjs/components/Dropdown/Dropdown.test.js +113 -0
- package/lib/commonjs/components/Dropdown/Dropdown.test.js.map +1 -0
- package/lib/commonjs/components/Dropdown/index.js +19 -0
- package/lib/commonjs/components/Dropdown/index.js.map +1 -0
- package/lib/commonjs/components/Menu/Menu.js +214 -0
- package/lib/commonjs/components/Menu/Menu.js.map +1 -0
- package/lib/commonjs/components/Menu/Menu.test.js +71 -0
- package/lib/commonjs/components/Menu/Menu.test.js.map +1 -0
- package/lib/commonjs/components/Menu/MenuButton.js +73 -0
- package/lib/commonjs/components/Menu/MenuButton.js.map +1 -0
- package/lib/commonjs/components/Menu/MenuButton.stories.js +166 -0
- package/lib/commonjs/components/Menu/MenuButton.stories.js.map +1 -0
- package/lib/commonjs/components/Menu/SelectButton.js +143 -0
- package/lib/commonjs/components/Menu/SelectButton.js.map +1 -0
- package/lib/commonjs/components/Menu/SelectButton.stories.js +116 -0
- package/lib/commonjs/components/Menu/SelectButton.stories.js.map +1 -0
- package/lib/commonjs/components/Menu/SelectButton.test.js +80 -0
- package/lib/commonjs/components/Menu/SelectButton.test.js.map +1 -0
- package/lib/commonjs/components/Menu/UserMenu.js +73 -0
- package/lib/commonjs/components/Menu/UserMenu.js.map +1 -0
- package/lib/commonjs/components/Menu/UserMenu.stories.js +85 -0
- package/lib/commonjs/components/Menu/UserMenu.stories.js.map +1 -0
- package/lib/commonjs/components/Menu/UserMenu.test.js +52 -0
- package/lib/commonjs/components/Menu/UserMenu.test.js.map +1 -0
- package/lib/commonjs/components/Menu/index.js +34 -0
- package/lib/commonjs/components/Menu/index.js.map +1 -0
- package/lib/commonjs/components/Select/Select.js +246 -0
- package/lib/commonjs/components/Select/Select.js.map +1 -0
- package/lib/commonjs/components/Select/Select.stories.js +221 -0
- package/lib/commonjs/components/Select/Select.stories.js.map +1 -0
- package/lib/commonjs/components/Select/Select.test.js +165 -0
- package/lib/commonjs/components/Select/Select.test.js.map +1 -0
- package/lib/commonjs/components/Select/index.js +13 -0
- package/lib/commonjs/components/Select/index.js.map +1 -0
- package/lib/commonjs/components/UserChip/UserChip.js +121 -0
- package/lib/commonjs/components/UserChip/UserChip.js.map +1 -0
- package/lib/commonjs/components/UserChip/UserChip.stories.js +153 -0
- package/lib/commonjs/components/UserChip/UserChip.stories.js.map +1 -0
- package/lib/commonjs/components/UserChip/UserChip.test.js +59 -0
- package/lib/commonjs/components/UserChip/UserChip.test.js.map +1 -0
- package/lib/commonjs/components/UserChip/index.js +13 -0
- package/lib/commonjs/components/UserChip/index.js.map +1 -0
- package/lib/commonjs/components/index.js +57 -13
- package/lib/commonjs/components/index.js.map +1 -1
- package/lib/module/components/Dropdown/Dropdown.js +277 -0
- package/lib/module/components/Dropdown/Dropdown.js.map +1 -0
- package/lib/module/components/Dropdown/Dropdown.stories.js +515 -0
- package/lib/module/components/Dropdown/Dropdown.stories.js.map +1 -0
- package/lib/module/components/Dropdown/Dropdown.test.js +113 -0
- package/lib/module/components/Dropdown/Dropdown.test.js.map +1 -0
- package/lib/module/components/Dropdown/index.js +4 -0
- package/lib/module/components/Dropdown/index.js.map +1 -0
- package/lib/module/components/Menu/Menu.js +210 -0
- package/lib/module/components/Menu/Menu.js.map +1 -0
- package/lib/module/components/Menu/Menu.test.js +71 -0
- package/lib/module/components/Menu/Menu.test.js.map +1 -0
- package/lib/module/components/Menu/MenuButton.js +69 -0
- package/lib/module/components/Menu/MenuButton.js.map +1 -0
- package/lib/module/components/Menu/MenuButton.stories.js +162 -0
- package/lib/module/components/Menu/MenuButton.stories.js.map +1 -0
- package/lib/module/components/Menu/SelectButton.js +139 -0
- package/lib/module/components/Menu/SelectButton.js.map +1 -0
- package/lib/module/components/Menu/SelectButton.stories.js +112 -0
- package/lib/module/components/Menu/SelectButton.stories.js.map +1 -0
- package/lib/module/components/Menu/SelectButton.test.js +80 -0
- package/lib/module/components/Menu/SelectButton.test.js.map +1 -0
- package/lib/module/components/Menu/UserMenu.js +69 -0
- package/lib/module/components/Menu/UserMenu.js.map +1 -0
- package/lib/module/components/Menu/UserMenu.stories.js +81 -0
- package/lib/module/components/Menu/UserMenu.stories.js.map +1 -0
- package/lib/module/components/Menu/UserMenu.test.js +52 -0
- package/lib/module/components/Menu/UserMenu.test.js.map +1 -0
- package/lib/module/components/Menu/index.js +7 -0
- package/lib/module/components/Menu/index.js.map +1 -0
- package/lib/module/components/Select/Select.js +244 -0
- package/lib/module/components/Select/Select.js.map +1 -0
- package/lib/module/components/Select/Select.stories.js +217 -0
- package/lib/module/components/Select/Select.stories.js.map +1 -0
- package/lib/module/components/Select/Select.test.js +165 -0
- package/lib/module/components/Select/Select.test.js.map +1 -0
- package/lib/module/components/Select/index.js +4 -0
- package/lib/module/components/Select/index.js.map +1 -0
- package/lib/module/components/UserChip/UserChip.js +117 -0
- package/lib/module/components/UserChip/UserChip.js.map +1 -0
- package/lib/module/components/UserChip/UserChip.stories.js +149 -0
- package/lib/module/components/UserChip/UserChip.stories.js.map +1 -0
- package/lib/module/components/UserChip/UserChip.test.js +59 -0
- package/lib/module/components/UserChip/UserChip.test.js.map +1 -0
- package/lib/module/components/UserChip/index.js +4 -0
- package/lib/module/components/UserChip/index.js.map +1 -0
- package/lib/module/components/index.js +4 -0
- package/lib/module/components/index.js.map +1 -1
- package/lib/typescript/commonjs/components/Dropdown/Dropdown.d.ts +105 -0
- package/lib/typescript/commonjs/components/Dropdown/Dropdown.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Dropdown/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/Dropdown/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Menu/Menu.d.ts +66 -0
- package/lib/typescript/commonjs/components/Menu/Menu.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Menu/MenuButton.d.ts +46 -0
- package/lib/typescript/commonjs/components/Menu/MenuButton.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Menu/SelectButton.d.ts +60 -0
- package/lib/typescript/commonjs/components/Menu/SelectButton.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Menu/UserMenu.d.ts +46 -0
- package/lib/typescript/commonjs/components/Menu/UserMenu.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Menu/index.d.ts +9 -0
- package/lib/typescript/commonjs/components/Menu/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Select/Select.d.ts +73 -0
- package/lib/typescript/commonjs/components/Select/Select.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/Select/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/Select/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/UserChip/UserChip.d.ts +33 -0
- package/lib/typescript/commonjs/components/UserChip/UserChip.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/UserChip/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/UserChip/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/components/index.d.ts +4 -0
- package/lib/typescript/commonjs/components/index.d.ts.map +1 -1
- package/lib/typescript/module/components/Dropdown/Dropdown.d.ts +105 -0
- package/lib/typescript/module/components/Dropdown/Dropdown.d.ts.map +1 -0
- package/lib/typescript/module/components/Dropdown/index.d.ts +3 -0
- package/lib/typescript/module/components/Dropdown/index.d.ts.map +1 -0
- package/lib/typescript/module/components/Menu/Menu.d.ts +66 -0
- package/lib/typescript/module/components/Menu/Menu.d.ts.map +1 -0
- package/lib/typescript/module/components/Menu/MenuButton.d.ts +46 -0
- package/lib/typescript/module/components/Menu/MenuButton.d.ts.map +1 -0
- package/lib/typescript/module/components/Menu/SelectButton.d.ts +60 -0
- package/lib/typescript/module/components/Menu/SelectButton.d.ts.map +1 -0
- package/lib/typescript/module/components/Menu/UserMenu.d.ts +46 -0
- package/lib/typescript/module/components/Menu/UserMenu.d.ts.map +1 -0
- package/lib/typescript/module/components/Menu/index.d.ts +9 -0
- package/lib/typescript/module/components/Menu/index.d.ts.map +1 -0
- package/lib/typescript/module/components/Select/Select.d.ts +73 -0
- package/lib/typescript/module/components/Select/Select.d.ts.map +1 -0
- package/lib/typescript/module/components/Select/index.d.ts +3 -0
- package/lib/typescript/module/components/Select/index.d.ts.map +1 -0
- package/lib/typescript/module/components/UserChip/UserChip.d.ts +33 -0
- package/lib/typescript/module/components/UserChip/UserChip.d.ts.map +1 -0
- package/lib/typescript/module/components/UserChip/index.d.ts +3 -0
- package/lib/typescript/module/components/UserChip/index.d.ts.map +1 -0
- package/lib/typescript/module/components/index.d.ts +4 -0
- package/lib/typescript/module/components/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/Dropdown/Dropdown.tsx +319 -0
- package/src/components/Dropdown/index.ts +2 -0
- package/src/components/Menu/Menu.tsx +249 -0
- package/src/components/Menu/MenuButton.tsx +98 -0
- package/src/components/Menu/SelectButton.tsx +171 -0
- package/src/components/Menu/UserMenu.tsx +100 -0
- package/src/components/Menu/index.ts +14 -0
- package/src/components/Select/Select.tsx +323 -0
- package/src/components/Select/index.ts +2 -0
- package/src/components/UserChip/UserChip.tsx +138 -0
- package/src/components/UserChip/index.ts +2 -0
- package/src/components/index.ts +4 -0
|
@@ -0,0 +1,244 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { Pressable, View } from 'react-native';
|
|
5
|
+
import { useTheme } from "../../theme/index.js";
|
|
6
|
+
import { Dropdown } from "../Dropdown/Dropdown.js";
|
|
7
|
+
import { Icon } from "../Icon/Icon.js";
|
|
8
|
+
import { Menu } from "../Menu/Menu.js";
|
|
9
|
+
import { Text } from "../Text/Text.js";
|
|
10
|
+
|
|
11
|
+
/** Width of the focus ring, in px (Figma "Focus" effect: spread 6). */
|
|
12
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
const FOCUS_RING_SPREAD = 6;
|
|
14
|
+
const FOCUS_RING_ALPHA = 0.15;
|
|
15
|
+
|
|
16
|
+
/** Convert a `#RRGGBB` (or `#RGB`) token to an `rgba()` string at the given alpha. */
|
|
17
|
+
function hexToRgba(hex, alpha) {
|
|
18
|
+
const h = hex.replace('#', '');
|
|
19
|
+
const full = h.length === 3 ? h.replace(/./g, c => c + c) : h;
|
|
20
|
+
const r = parseInt(full.slice(0, 2), 16);
|
|
21
|
+
const g = parseInt(full.slice(2, 4), 16);
|
|
22
|
+
const b = parseInt(full.slice(4, 6), 16);
|
|
23
|
+
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
|
24
|
+
}
|
|
25
|
+
const SIZES = {
|
|
26
|
+
md: {
|
|
27
|
+
height: 48,
|
|
28
|
+
gap: 8,
|
|
29
|
+
iconSize: 20,
|
|
30
|
+
textVariant: 'bodyMedium'
|
|
31
|
+
},
|
|
32
|
+
lg: {
|
|
33
|
+
height: 58,
|
|
34
|
+
gap: 10,
|
|
35
|
+
iconSize: 24,
|
|
36
|
+
textVariant: 'bodyLarge'
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
/** An option in a `Select`. */
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Select — a form field that opens a `Dropdown` of options. The field mirrors
|
|
44
|
+
* `Input` (pill, label, helper/error, lime focus ring, red error ring); it is
|
|
45
|
+
* not editable — pressing it opens the menu, which matches the field width. The
|
|
46
|
+
* current option is marked with a check. With `multiple`, rows become checkboxes,
|
|
47
|
+
* the value is an array, and the menu stays open while picking.
|
|
48
|
+
*/
|
|
49
|
+
export function Select({
|
|
50
|
+
options,
|
|
51
|
+
multiple = false,
|
|
52
|
+
value,
|
|
53
|
+
defaultValue,
|
|
54
|
+
onChange,
|
|
55
|
+
label,
|
|
56
|
+
helperText,
|
|
57
|
+
error,
|
|
58
|
+
placeholder = 'Select option',
|
|
59
|
+
leftIcon,
|
|
60
|
+
size = 'lg',
|
|
61
|
+
width,
|
|
62
|
+
fullWidth = true,
|
|
63
|
+
disabled = false,
|
|
64
|
+
renderValue,
|
|
65
|
+
matchTriggerWidth = true,
|
|
66
|
+
menuWidth,
|
|
67
|
+
maxHeight,
|
|
68
|
+
anchorOrigin = {
|
|
69
|
+
vertical: 'bottom',
|
|
70
|
+
horizontal: 'left'
|
|
71
|
+
},
|
|
72
|
+
menuOrigin = {
|
|
73
|
+
vertical: 'top',
|
|
74
|
+
horizontal: 'left'
|
|
75
|
+
},
|
|
76
|
+
offset = 8,
|
|
77
|
+
autoFit = true,
|
|
78
|
+
insets,
|
|
79
|
+
closeOnSelect,
|
|
80
|
+
style
|
|
81
|
+
}) {
|
|
82
|
+
const theme = useTheme();
|
|
83
|
+
const sizeConfig = SIZES[size];
|
|
84
|
+
const isControlled = value !== undefined;
|
|
85
|
+
const [internal, setInternal] = useState(defaultValue ?? (multiple ? [] : undefined));
|
|
86
|
+
const current = isControlled ? value : internal;
|
|
87
|
+
const selectedKeys = multiple ? current ?? [] : current != null ? [current] : [];
|
|
88
|
+
const commit = next => {
|
|
89
|
+
if (!isControlled) setInternal(next);
|
|
90
|
+
onChange?.(next);
|
|
91
|
+
};
|
|
92
|
+
const selectSingle = key => commit(key);
|
|
93
|
+
const toggleMulti = key => {
|
|
94
|
+
const set = new Set(selectedKeys);
|
|
95
|
+
if (set.has(key)) set.delete(key);else set.add(key);
|
|
96
|
+
commit([...set]);
|
|
97
|
+
};
|
|
98
|
+
const selectedOptions = options.filter(o => selectedKeys.includes(o.key));
|
|
99
|
+
const isEmpty = selectedOptions.length === 0;
|
|
100
|
+
const displayText = renderValue ? renderValue(selectedOptions) : isEmpty ? placeholder : selectedOptions.map(o => o.label).join(', ');
|
|
101
|
+
const hasError = Boolean(error);
|
|
102
|
+
const message = typeof error === 'string' ? error : helperText;
|
|
103
|
+
const rows = options.map(o => ({
|
|
104
|
+
key: o.key,
|
|
105
|
+
label: o.label,
|
|
106
|
+
disabled: o.disabled,
|
|
107
|
+
leading: o.icon ? {
|
|
108
|
+
kind: 'icon',
|
|
109
|
+
name: o.icon
|
|
110
|
+
} : undefined,
|
|
111
|
+
trailing: multiple ? {
|
|
112
|
+
kind: 'checkbox',
|
|
113
|
+
checked: selectedKeys.includes(o.key),
|
|
114
|
+
onChange: () => toggleMulti(o.key)
|
|
115
|
+
} : selectedKeys.includes(o.key) ? {
|
|
116
|
+
kind: 'icon',
|
|
117
|
+
name: 'check',
|
|
118
|
+
color: theme.colors.feedback.success
|
|
119
|
+
} : undefined
|
|
120
|
+
}));
|
|
121
|
+
const shouldClose = closeOnSelect ?? !multiple;
|
|
122
|
+
const iconBox = {
|
|
123
|
+
width: sizeConfig.iconSize,
|
|
124
|
+
height: sizeConfig.iconSize,
|
|
125
|
+
alignItems: 'center',
|
|
126
|
+
justifyContent: 'center'
|
|
127
|
+
};
|
|
128
|
+
const containerWidth = width != null ? {
|
|
129
|
+
width,
|
|
130
|
+
alignSelf: 'flex-start'
|
|
131
|
+
} : fullWidth ? {
|
|
132
|
+
alignSelf: 'stretch'
|
|
133
|
+
} : {
|
|
134
|
+
alignSelf: 'flex-start'
|
|
135
|
+
};
|
|
136
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
137
|
+
style: [containerWidth, style],
|
|
138
|
+
children: [label ? /*#__PURE__*/_jsx(Text, {
|
|
139
|
+
variant: "bodySmall",
|
|
140
|
+
color: "secondary",
|
|
141
|
+
style: {
|
|
142
|
+
marginBottom: 4,
|
|
143
|
+
marginLeft: 8
|
|
144
|
+
},
|
|
145
|
+
children: label
|
|
146
|
+
}) : null, /*#__PURE__*/_jsx(Menu, {
|
|
147
|
+
anchorOrigin: anchorOrigin,
|
|
148
|
+
menuOrigin: menuOrigin,
|
|
149
|
+
offset: offset,
|
|
150
|
+
autoFit: autoFit,
|
|
151
|
+
insets: insets,
|
|
152
|
+
triggerStyle: {
|
|
153
|
+
alignSelf: 'stretch'
|
|
154
|
+
},
|
|
155
|
+
renderTrigger: ({
|
|
156
|
+
open,
|
|
157
|
+
toggle
|
|
158
|
+
}) => {
|
|
159
|
+
const showRing = open && !disabled;
|
|
160
|
+
const borderColor = disabled ? theme.colors.disabled.border : hasError ? theme.colors.feedback.error : open ? theme.colors.border.focus : theme.colors.border.default;
|
|
161
|
+
const ringColor = hasError ? theme.colors.feedback.error : theme.colors.border.focus;
|
|
162
|
+
const boxShadow = showRing ? [{
|
|
163
|
+
offsetX: 0,
|
|
164
|
+
offsetY: 0,
|
|
165
|
+
blurRadius: 0,
|
|
166
|
+
spreadDistance: FOCUS_RING_SPREAD,
|
|
167
|
+
color: hexToRgba(ringColor, FOCUS_RING_ALPHA)
|
|
168
|
+
}] : undefined;
|
|
169
|
+
return /*#__PURE__*/_jsxs(Pressable, {
|
|
170
|
+
onPress: toggle,
|
|
171
|
+
disabled: disabled,
|
|
172
|
+
accessibilityRole: "button",
|
|
173
|
+
accessibilityState: {
|
|
174
|
+
expanded: open,
|
|
175
|
+
disabled
|
|
176
|
+
},
|
|
177
|
+
accessibilityLabel: label ?? placeholder,
|
|
178
|
+
style: {
|
|
179
|
+
flexDirection: 'row',
|
|
180
|
+
alignItems: 'center',
|
|
181
|
+
gap: sizeConfig.gap,
|
|
182
|
+
height: sizeConfig.height,
|
|
183
|
+
paddingHorizontal: 16,
|
|
184
|
+
borderWidth: 1,
|
|
185
|
+
borderColor,
|
|
186
|
+
borderRadius: theme.radii.pill,
|
|
187
|
+
backgroundColor: disabled ? theme.colors.disabled.background : theme.colors.background.default,
|
|
188
|
+
boxShadow
|
|
189
|
+
},
|
|
190
|
+
children: [leftIcon ? /*#__PURE__*/_jsx(View, {
|
|
191
|
+
style: iconBox,
|
|
192
|
+
children: /*#__PURE__*/_jsx(Icon, {
|
|
193
|
+
name: leftIcon,
|
|
194
|
+
size: sizeConfig.iconSize,
|
|
195
|
+
color: disabled ? theme.colors.disabled.foreground : 'secondary'
|
|
196
|
+
})
|
|
197
|
+
}) : null, /*#__PURE__*/_jsx(Text, {
|
|
198
|
+
variant: sizeConfig.textVariant,
|
|
199
|
+
color: disabled ? 'tertiary' : isEmpty ? 'tertiary' : 'primary',
|
|
200
|
+
numberOfLines: 1,
|
|
201
|
+
style: {
|
|
202
|
+
flex: 1,
|
|
203
|
+
minWidth: 0
|
|
204
|
+
},
|
|
205
|
+
children: displayText
|
|
206
|
+
}), /*#__PURE__*/_jsx(View, {
|
|
207
|
+
style: [iconBox, {
|
|
208
|
+
transform: [{
|
|
209
|
+
rotate: open ? '180deg' : '0deg'
|
|
210
|
+
}]
|
|
211
|
+
}],
|
|
212
|
+
children: /*#__PURE__*/_jsx(Icon, {
|
|
213
|
+
name: "chevron-down",
|
|
214
|
+
size: sizeConfig.iconSize,
|
|
215
|
+
color: disabled ? theme.colors.disabled.foreground : 'secondary'
|
|
216
|
+
})
|
|
217
|
+
})]
|
|
218
|
+
});
|
|
219
|
+
},
|
|
220
|
+
children: ({
|
|
221
|
+
close,
|
|
222
|
+
triggerWidth,
|
|
223
|
+
maxHeight: autoMaxHeight
|
|
224
|
+
}) => /*#__PURE__*/_jsx(Dropdown, {
|
|
225
|
+
options: rows,
|
|
226
|
+
width: matchTriggerWidth ? triggerWidth : menuWidth,
|
|
227
|
+
maxHeight: maxHeight ?? autoMaxHeight,
|
|
228
|
+
onSelect: multiple ? undefined : key => {
|
|
229
|
+
selectSingle(key);
|
|
230
|
+
if (shouldClose) close();
|
|
231
|
+
}
|
|
232
|
+
})
|
|
233
|
+
}), message ? /*#__PURE__*/_jsx(Text, {
|
|
234
|
+
variant: "bodySmall",
|
|
235
|
+
color: hasError ? theme.colors.feedback.error : 'tertiary',
|
|
236
|
+
style: {
|
|
237
|
+
marginTop: 8,
|
|
238
|
+
marginLeft: 8
|
|
239
|
+
},
|
|
240
|
+
children: message
|
|
241
|
+
}) : null]
|
|
242
|
+
});
|
|
243
|
+
}
|
|
244
|
+
//# sourceMappingURL=Select.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useState","Pressable","View","useTheme","Dropdown","Icon","Menu","Text","jsx","_jsx","jsxs","_jsxs","FOCUS_RING_SPREAD","FOCUS_RING_ALPHA","hexToRgba","hex","alpha","h","replace","full","length","c","r","parseInt","slice","g","b","SIZES","md","height","gap","iconSize","textVariant","lg","Select","options","multiple","value","defaultValue","onChange","label","helperText","error","placeholder","leftIcon","size","width","fullWidth","disabled","renderValue","matchTriggerWidth","menuWidth","maxHeight","anchorOrigin","vertical","horizontal","menuOrigin","offset","autoFit","insets","closeOnSelect","style","theme","sizeConfig","isControlled","undefined","internal","setInternal","current","selectedKeys","commit","next","selectSingle","key","toggleMulti","set","Set","has","delete","add","selectedOptions","filter","o","includes","isEmpty","displayText","map","join","hasError","Boolean","message","rows","leading","icon","kind","name","trailing","checked","color","colors","feedback","success","shouldClose","iconBox","alignItems","justifyContent","containerWidth","alignSelf","children","variant","marginBottom","marginLeft","triggerStyle","renderTrigger","open","toggle","showRing","borderColor","border","focus","default","ringColor","boxShadow","offsetX","offsetY","blurRadius","spreadDistance","onPress","accessibilityRole","accessibilityState","expanded","accessibilityLabel","flexDirection","paddingHorizontal","borderWidth","borderRadius","radii","pill","backgroundColor","background","foreground","numberOfLines","flex","minWidth","transform","rotate","close","triggerWidth","autoMaxHeight","onSelect","marginTop"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,217 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import { Select } from "./Select.js";
|
|
6
|
+
import { Button } from "../Button/Button.js";
|
|
7
|
+
import { Dialog } from "../Dialog/Dialog.js";
|
|
8
|
+
import { Text } from "../Text/Text.js";
|
|
9
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
+
const meta = {
|
|
11
|
+
title: 'Components/Select',
|
|
12
|
+
component: Select
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
const OPTIONS = [{
|
|
16
|
+
key: 'dine-in',
|
|
17
|
+
label: 'Dine in',
|
|
18
|
+
icon: 'dish'
|
|
19
|
+
}, {
|
|
20
|
+
key: 'take-out',
|
|
21
|
+
label: 'Take out',
|
|
22
|
+
icon: 'shopping-bag'
|
|
23
|
+
}, {
|
|
24
|
+
key: 'delivery',
|
|
25
|
+
label: 'Delivery',
|
|
26
|
+
icon: 'truck-delivery'
|
|
27
|
+
}, {
|
|
28
|
+
key: 'pickup',
|
|
29
|
+
label: 'Pickup',
|
|
30
|
+
icon: 'shopping-bag'
|
|
31
|
+
}];
|
|
32
|
+
function Frame({
|
|
33
|
+
children
|
|
34
|
+
}) {
|
|
35
|
+
// Height gives the open menu room in the Storybook canvas.
|
|
36
|
+
return /*#__PURE__*/_jsx(View, {
|
|
37
|
+
style: {
|
|
38
|
+
padding: 24,
|
|
39
|
+
width: 360,
|
|
40
|
+
height: 420
|
|
41
|
+
},
|
|
42
|
+
children: children
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
/** Default field (matches Figma "Default"). */
|
|
47
|
+
export const Default = {
|
|
48
|
+
render: () => /*#__PURE__*/_jsx(Frame, {
|
|
49
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
50
|
+
options: OPTIONS,
|
|
51
|
+
label: "Label",
|
|
52
|
+
helperText: "Helper text",
|
|
53
|
+
leftIcon: "shopping-bag",
|
|
54
|
+
onChange: () => {}
|
|
55
|
+
})
|
|
56
|
+
})
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
/** Single select — the current option is marked with a check. */
|
|
60
|
+
export const SingleSelect = {
|
|
61
|
+
render: () => {
|
|
62
|
+
const [value, setValue] = useState('dine-in');
|
|
63
|
+
return /*#__PURE__*/_jsxs(Frame, {
|
|
64
|
+
children: [/*#__PURE__*/_jsx(Select, {
|
|
65
|
+
options: OPTIONS,
|
|
66
|
+
label: "Order type",
|
|
67
|
+
helperText: "Helper text",
|
|
68
|
+
leftIcon: "shopping-bag",
|
|
69
|
+
value: value,
|
|
70
|
+
onChange: setValue
|
|
71
|
+
}), /*#__PURE__*/_jsxs(Text, {
|
|
72
|
+
variant: "caption",
|
|
73
|
+
color: "secondary",
|
|
74
|
+
style: {
|
|
75
|
+
marginTop: 12
|
|
76
|
+
},
|
|
77
|
+
children: ["value: ", String(value)]
|
|
78
|
+
})]
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
/** Multi select — rows become checkboxes; the menu stays open while picking. */
|
|
84
|
+
export const MultiSelect = {
|
|
85
|
+
render: () => {
|
|
86
|
+
const [value, setValue] = useState(['dine-in', 'delivery']);
|
|
87
|
+
return /*#__PURE__*/_jsxs(Frame, {
|
|
88
|
+
children: [/*#__PURE__*/_jsx(Select, {
|
|
89
|
+
options: OPTIONS,
|
|
90
|
+
multiple: true,
|
|
91
|
+
label: "Order types",
|
|
92
|
+
helperText: "Choose one or more",
|
|
93
|
+
value: value,
|
|
94
|
+
onChange: setValue
|
|
95
|
+
}), /*#__PURE__*/_jsxs(Text, {
|
|
96
|
+
variant: "caption",
|
|
97
|
+
color: "secondary",
|
|
98
|
+
style: {
|
|
99
|
+
marginTop: 12
|
|
100
|
+
},
|
|
101
|
+
children: ["value: ", Array.isArray(value) ? value.join(', ') : value]
|
|
102
|
+
})]
|
|
103
|
+
});
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
/** Error state — red border, red ring on open, red helper text. */
|
|
108
|
+
export const Error = {
|
|
109
|
+
render: () => /*#__PURE__*/_jsx(Frame, {
|
|
110
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
111
|
+
options: OPTIONS,
|
|
112
|
+
label: "Order type",
|
|
113
|
+
error: "Please choose an option",
|
|
114
|
+
leftIcon: "shopping-bag",
|
|
115
|
+
onChange: () => {}
|
|
116
|
+
})
|
|
117
|
+
})
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
/** Disabled. */
|
|
121
|
+
export const Disabled = {
|
|
122
|
+
render: () => /*#__PURE__*/_jsx(Frame, {
|
|
123
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
124
|
+
options: OPTIONS,
|
|
125
|
+
label: "Label",
|
|
126
|
+
helperText: "Helper text",
|
|
127
|
+
leftIcon: "shopping-bag",
|
|
128
|
+
disabled: true,
|
|
129
|
+
defaultValue: "dine-in"
|
|
130
|
+
})
|
|
131
|
+
})
|
|
132
|
+
};
|
|
133
|
+
|
|
134
|
+
/** Long list — the menu scrolls past maxHeight. */
|
|
135
|
+
export const Scrollable = {
|
|
136
|
+
render: () => {
|
|
137
|
+
const many = Array.from({
|
|
138
|
+
length: 20
|
|
139
|
+
}).map((_, i) => ({
|
|
140
|
+
key: String(i),
|
|
141
|
+
label: `Option ${i + 1}`
|
|
142
|
+
}));
|
|
143
|
+
return /*#__PURE__*/_jsx(Frame, {
|
|
144
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
145
|
+
options: many,
|
|
146
|
+
label: "Pick one",
|
|
147
|
+
maxHeight: 260,
|
|
148
|
+
onChange: () => {}
|
|
149
|
+
})
|
|
150
|
+
});
|
|
151
|
+
}
|
|
152
|
+
};
|
|
153
|
+
|
|
154
|
+
/** Fixed menu width instead of matching the field. */
|
|
155
|
+
export const FixedMenuWidth = {
|
|
156
|
+
render: () => /*#__PURE__*/_jsx(Frame, {
|
|
157
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
158
|
+
options: OPTIONS,
|
|
159
|
+
label: "Order type",
|
|
160
|
+
matchTriggerWidth: false,
|
|
161
|
+
menuWidth: 300,
|
|
162
|
+
onChange: () => {}
|
|
163
|
+
})
|
|
164
|
+
})
|
|
165
|
+
};
|
|
166
|
+
|
|
167
|
+
/** Fixed field width (default is full width, the Figma behavior). */
|
|
168
|
+
export const CustomWidth = {
|
|
169
|
+
render: () => /*#__PURE__*/_jsx(Frame, {
|
|
170
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
171
|
+
options: OPTIONS,
|
|
172
|
+
label: "Order type",
|
|
173
|
+
width: 260,
|
|
174
|
+
leftIcon: "shopping-bag",
|
|
175
|
+
onChange: () => {}
|
|
176
|
+
})
|
|
177
|
+
})
|
|
178
|
+
};
|
|
179
|
+
|
|
180
|
+
/**
|
|
181
|
+
* Inside a Dialog — the two modals coexist: the menu positions over the dialog,
|
|
182
|
+
* tapping outside the menu closes only the menu (not the dialog), and back closes
|
|
183
|
+
* the menu first.
|
|
184
|
+
*/
|
|
185
|
+
export const InsideDialog = {
|
|
186
|
+
render: () => {
|
|
187
|
+
const [open, setOpen] = useState(false);
|
|
188
|
+
const [value, setValue] = useState('dine-in');
|
|
189
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
190
|
+
style: {
|
|
191
|
+
padding: 24
|
|
192
|
+
},
|
|
193
|
+
children: [/*#__PURE__*/_jsx(Button, {
|
|
194
|
+
label: "Open dialog",
|
|
195
|
+
onPress: () => setOpen(true)
|
|
196
|
+
}), /*#__PURE__*/_jsx(Dialog, {
|
|
197
|
+
visible: open,
|
|
198
|
+
onClose: () => setOpen(false),
|
|
199
|
+
title: "Order details",
|
|
200
|
+
subtitle: "Pick the order type",
|
|
201
|
+
cancel: {},
|
|
202
|
+
actions: [{
|
|
203
|
+
label: 'Save',
|
|
204
|
+
onPress: () => setOpen(false)
|
|
205
|
+
}],
|
|
206
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
207
|
+
options: OPTIONS,
|
|
208
|
+
label: "Order type",
|
|
209
|
+
leftIcon: "shopping-bag",
|
|
210
|
+
value: value,
|
|
211
|
+
onChange: setValue
|
|
212
|
+
})
|
|
213
|
+
})]
|
|
214
|
+
});
|
|
215
|
+
}
|
|
216
|
+
};
|
|
217
|
+
//# sourceMappingURL=Select.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useState","View","Select","Button","Dialog","Text","jsx","_jsx","jsxs","_jsxs","meta","title","component","OPTIONS","key","label","icon","Frame","children","style","padding","width","height","Default","render","options","helperText","leftIcon","onChange","SingleSelect","value","setValue","variant","color","marginTop","String","MultiSelect","multiple","Array","isArray","join","Error","error","Disabled","disabled","defaultValue","Scrollable","many","from","length","map","_","i","maxHeight","FixedMenuWidth","matchTriggerWidth","menuWidth","CustomWidth","InsideDialog","open","setOpen","onPress","visible","onClose","subtitle","cancel","actions"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.stories.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { render, fireEvent, screen } from '@testing-library/react-native';
|
|
5
|
+
import { ThemeProvider } from "../../theme/index.js";
|
|
6
|
+
import { Select } from "./Select.js";
|
|
7
|
+
import { Dialog } from "../Dialog/Dialog.js";
|
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
+
function wrap(ui) {
|
|
10
|
+
return render(/*#__PURE__*/_jsx(ThemeProvider, {
|
|
11
|
+
children: ui
|
|
12
|
+
}));
|
|
13
|
+
}
|
|
14
|
+
const OPTIONS = [{
|
|
15
|
+
key: 'dine-in',
|
|
16
|
+
label: 'Dine in'
|
|
17
|
+
}, {
|
|
18
|
+
key: 'take-out',
|
|
19
|
+
label: 'Take out'
|
|
20
|
+
}, {
|
|
21
|
+
key: 'delivery',
|
|
22
|
+
label: 'Delivery'
|
|
23
|
+
}];
|
|
24
|
+
describe('Select (single)', () => {
|
|
25
|
+
it('shows the placeholder when empty', () => {
|
|
26
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
27
|
+
options: OPTIONS,
|
|
28
|
+
placeholder: "Select option"
|
|
29
|
+
}));
|
|
30
|
+
expect(screen.getByText('Select option')).toBeTruthy();
|
|
31
|
+
});
|
|
32
|
+
it('shows the selected label', () => {
|
|
33
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
34
|
+
options: OPTIONS,
|
|
35
|
+
value: "take-out"
|
|
36
|
+
}));
|
|
37
|
+
expect(screen.getByText('Take out')).toBeTruthy();
|
|
38
|
+
});
|
|
39
|
+
it('opens, selects an option, calls onChange and closes', () => {
|
|
40
|
+
const onChange = jest.fn();
|
|
41
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
42
|
+
options: OPTIONS,
|
|
43
|
+
placeholder: "Select option",
|
|
44
|
+
onChange: onChange
|
|
45
|
+
}));
|
|
46
|
+
fireEvent.press(screen.getByText('Select option'));
|
|
47
|
+
fireEvent.press(screen.getByText('Delivery'));
|
|
48
|
+
expect(onChange).toHaveBeenCalledWith('delivery');
|
|
49
|
+
// Menu closed → the other option is gone.
|
|
50
|
+
expect(screen.queryByText('Take out')).toBeNull();
|
|
51
|
+
});
|
|
52
|
+
it('renders the error message', () => {
|
|
53
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
54
|
+
options: OPTIONS,
|
|
55
|
+
error: "Required"
|
|
56
|
+
}));
|
|
57
|
+
expect(screen.getByText('Required')).toBeTruthy();
|
|
58
|
+
});
|
|
59
|
+
it('does not open when disabled', () => {
|
|
60
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
61
|
+
options: OPTIONS,
|
|
62
|
+
placeholder: "Select option",
|
|
63
|
+
disabled: true
|
|
64
|
+
}));
|
|
65
|
+
fireEvent.press(screen.getByText('Select option'));
|
|
66
|
+
expect(screen.queryByText('Delivery')).toBeNull();
|
|
67
|
+
});
|
|
68
|
+
});
|
|
69
|
+
describe('Select (multiple)', () => {
|
|
70
|
+
function MultiControlled() {
|
|
71
|
+
const [value, setValue] = useState([]);
|
|
72
|
+
return /*#__PURE__*/_jsx(Select, {
|
|
73
|
+
options: OPTIONS,
|
|
74
|
+
multiple: true,
|
|
75
|
+
value: value,
|
|
76
|
+
onChange: setValue,
|
|
77
|
+
placeholder: "Pick"
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
it('adds keys to the array and stays open', () => {
|
|
81
|
+
const onChange = jest.fn();
|
|
82
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
83
|
+
options: OPTIONS,
|
|
84
|
+
multiple: true,
|
|
85
|
+
value: [],
|
|
86
|
+
onChange: onChange,
|
|
87
|
+
placeholder: "Pick"
|
|
88
|
+
}));
|
|
89
|
+
fireEvent.press(screen.getByText('Pick'));
|
|
90
|
+
fireEvent.press(screen.getByText('Dine in'));
|
|
91
|
+
expect(onChange).toHaveBeenCalledWith(['dine-in']);
|
|
92
|
+
// Still open — other rows remain visible.
|
|
93
|
+
expect(screen.getByText('Delivery')).toBeTruthy();
|
|
94
|
+
});
|
|
95
|
+
it('toggles selected keys off', () => {
|
|
96
|
+
const onChange = jest.fn();
|
|
97
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
98
|
+
options: OPTIONS,
|
|
99
|
+
multiple: true,
|
|
100
|
+
value: ['dine-in'],
|
|
101
|
+
onChange: onChange,
|
|
102
|
+
placeholder: "Pick"
|
|
103
|
+
}));
|
|
104
|
+
// Before opening, only the trigger shows "Dine in".
|
|
105
|
+
fireEvent.press(screen.getByText('Dine in')); // opens the menu
|
|
106
|
+
// Now there are two: trigger + row. Press the row (last).
|
|
107
|
+
const matches = screen.getAllByText('Dine in');
|
|
108
|
+
fireEvent.press(matches[matches.length - 1]);
|
|
109
|
+
expect(onChange).toHaveBeenCalledWith([]);
|
|
110
|
+
});
|
|
111
|
+
it('joins multiple labels in the trigger', () => {
|
|
112
|
+
wrap(/*#__PURE__*/_jsx(Select, {
|
|
113
|
+
options: OPTIONS,
|
|
114
|
+
multiple: true,
|
|
115
|
+
value: ['dine-in', 'delivery']
|
|
116
|
+
}));
|
|
117
|
+
expect(screen.getByText('Dine in, Delivery')).toBeTruthy();
|
|
118
|
+
});
|
|
119
|
+
it('reflects new picks (controlled loop)', () => {
|
|
120
|
+
wrap(/*#__PURE__*/_jsx(MultiControlled, {}));
|
|
121
|
+
fireEvent.press(screen.getByText('Pick'));
|
|
122
|
+
fireEvent.press(screen.getByText('Take out'));
|
|
123
|
+
// Menu stays open, so the label now appears on both the trigger and the row.
|
|
124
|
+
expect(screen.getAllByText('Take out').length).toBe(2);
|
|
125
|
+
});
|
|
126
|
+
});
|
|
127
|
+
describe('Select inside Dialog', () => {
|
|
128
|
+
function DialogWithSelect() {
|
|
129
|
+
const [value, setValue] = useState('dine-in');
|
|
130
|
+
return /*#__PURE__*/_jsx(Dialog, {
|
|
131
|
+
visible: true,
|
|
132
|
+
onClose: () => {},
|
|
133
|
+
title: "Order",
|
|
134
|
+
actions: [{
|
|
135
|
+
label: 'Save'
|
|
136
|
+
}],
|
|
137
|
+
children: /*#__PURE__*/_jsx(Select, {
|
|
138
|
+
options: OPTIONS,
|
|
139
|
+
label: "Order type",
|
|
140
|
+
value: value,
|
|
141
|
+
onChange: setValue
|
|
142
|
+
})
|
|
143
|
+
});
|
|
144
|
+
}
|
|
145
|
+
it('opens the select menu over the dialog without closing it', () => {
|
|
146
|
+
wrap(/*#__PURE__*/_jsx(DialogWithSelect, {}));
|
|
147
|
+
// Dialog is visible.
|
|
148
|
+
expect(screen.getByText('Order')).toBeTruthy();
|
|
149
|
+
// Open the select (trigger shows "Dine in").
|
|
150
|
+
fireEvent.press(screen.getByText('Dine in'));
|
|
151
|
+
// Menu rows appear...
|
|
152
|
+
expect(screen.getByText('Delivery')).toBeTruthy();
|
|
153
|
+
// ...and the dialog is still there.
|
|
154
|
+
expect(screen.getByText('Order')).toBeTruthy();
|
|
155
|
+
});
|
|
156
|
+
it('selecting in the menu updates the field and keeps the dialog open', () => {
|
|
157
|
+
wrap(/*#__PURE__*/_jsx(DialogWithSelect, {}));
|
|
158
|
+
fireEvent.press(screen.getByText('Dine in'));
|
|
159
|
+
fireEvent.press(screen.getByText('Delivery'));
|
|
160
|
+
// Field now shows Delivery; dialog title still present.
|
|
161
|
+
expect(screen.getByText('Delivery')).toBeTruthy();
|
|
162
|
+
expect(screen.getByText('Order')).toBeTruthy();
|
|
163
|
+
});
|
|
164
|
+
});
|
|
165
|
+
//# sourceMappingURL=Select.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useState","render","fireEvent","screen","ThemeProvider","Select","Dialog","jsx","_jsx","wrap","ui","children","OPTIONS","key","label","describe","it","options","placeholder","expect","getByText","toBeTruthy","value","onChange","jest","fn","press","toHaveBeenCalledWith","queryByText","toBeNull","error","disabled","MultiControlled","setValue","multiple","matches","getAllByText","length","toBe","DialogWithSelect","visible","onClose","title","actions"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.test.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Select"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/index.ts"],"mappings":";;AAAA,SAASA,MAAM,QAAQ,aAAU","ignoreList":[]}
|