@bacon-pos/ui 0.5.0 → 0.6.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/CodeField/CodeField.js +10 -2
- package/lib/commonjs/components/CodeField/CodeField.js.map +1 -1
- package/lib/commonjs/components/CodeField/CodeField.stories.js +15 -2
- package/lib/commonjs/components/CodeField/CodeField.stories.js.map +1 -1
- 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 +421 -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/index.js +27 -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/CodeField/CodeField.js +10 -2
- package/lib/module/components/CodeField/CodeField.js.map +1 -1
- package/lib/module/components/CodeField/CodeField.stories.js +14 -1
- package/lib/module/components/CodeField/CodeField.stories.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 +417 -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/index.js +6 -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/CodeField/CodeField.d.ts +4 -2
- package/lib/typescript/commonjs/components/CodeField/CodeField.d.ts.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/index.d.ts +7 -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/CodeField/CodeField.d.ts +4 -2
- package/lib/typescript/module/components/CodeField/CodeField.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/index.d.ts +7 -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/CodeField/CodeField.tsx +6 -3
- 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/index.ts +12 -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,421 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = exports.TwoLine = exports.Toggles = exports.TextOnly = exports.Select = exports.Scrollable = exports.MultiSelect = exports.Grouped = exports.Ellipsis = exports.Default = exports.CustomWidth = exports.CustomAndBothSides = exports.ActionMenu = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _Dropdown = require("./Dropdown.js");
|
|
10
|
+
var _index = require("../../theme/index.js");
|
|
11
|
+
var _Text = require("../Text/Text.js");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
const meta = {
|
|
14
|
+
title: 'Components/Dropdown',
|
|
15
|
+
component: _Dropdown.Dropdown
|
|
16
|
+
};
|
|
17
|
+
var _default = exports.default = meta;
|
|
18
|
+
/** Faithful Figma replica: star leading, label, green check trailing (default 350 width). */
|
|
19
|
+
const Default = exports.Default = {
|
|
20
|
+
render: () => {
|
|
21
|
+
const theme = (0, _index.useTheme)();
|
|
22
|
+
const options = Array.from({
|
|
23
|
+
length: 6
|
|
24
|
+
}).map((_, i) => ({
|
|
25
|
+
key: String(i),
|
|
26
|
+
label: 'Option',
|
|
27
|
+
leading: {
|
|
28
|
+
kind: 'icon',
|
|
29
|
+
name: 'star'
|
|
30
|
+
},
|
|
31
|
+
trailing: {
|
|
32
|
+
kind: 'icon',
|
|
33
|
+
name: 'check',
|
|
34
|
+
color: theme.colors.feedback.success
|
|
35
|
+
}
|
|
36
|
+
}));
|
|
37
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
38
|
+
style: {
|
|
39
|
+
padding: 24
|
|
40
|
+
},
|
|
41
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
42
|
+
options: options
|
|
43
|
+
})
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
/** Select menu (e.g. opened from an Input select): tapping sets the checked row. */
|
|
49
|
+
const Select = exports.Select = {
|
|
50
|
+
render: () => {
|
|
51
|
+
const theme = (0, _index.useTheme)();
|
|
52
|
+
const items = ['Small', 'Medium', 'Large', 'Extra large'];
|
|
53
|
+
const [sel, setSel] = (0, _react.useState)('Medium');
|
|
54
|
+
const options = items.map(label => ({
|
|
55
|
+
key: label,
|
|
56
|
+
label,
|
|
57
|
+
selected: label === sel,
|
|
58
|
+
trailing: label === sel ? {
|
|
59
|
+
kind: 'icon',
|
|
60
|
+
name: 'check',
|
|
61
|
+
color: theme.colors.feedback.success
|
|
62
|
+
} : undefined
|
|
63
|
+
}));
|
|
64
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
65
|
+
style: {
|
|
66
|
+
padding: 24
|
|
67
|
+
},
|
|
68
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
69
|
+
options: options,
|
|
70
|
+
onSelect: setSel
|
|
71
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Text.Text, {
|
|
72
|
+
variant: "caption",
|
|
73
|
+
color: "secondary",
|
|
74
|
+
style: {
|
|
75
|
+
marginTop: 8
|
|
76
|
+
},
|
|
77
|
+
children: ["selected: ", sel]
|
|
78
|
+
})]
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
/** Multi-select: trailing checkbox; tapping anywhere on the row toggles it. */
|
|
84
|
+
const MultiSelect = exports.MultiSelect = {
|
|
85
|
+
render: () => {
|
|
86
|
+
const items = ['Cheese', 'Bacon', 'Egg', 'Avocado'];
|
|
87
|
+
const [checked, setChecked] = (0, _react.useState)({
|
|
88
|
+
Bacon: true
|
|
89
|
+
});
|
|
90
|
+
const options = items.map(label => ({
|
|
91
|
+
key: label,
|
|
92
|
+
label,
|
|
93
|
+
trailing: {
|
|
94
|
+
kind: 'checkbox',
|
|
95
|
+
checked: Boolean(checked[label]),
|
|
96
|
+
onChange: v => setChecked(c => ({
|
|
97
|
+
...c,
|
|
98
|
+
[label]: v
|
|
99
|
+
}))
|
|
100
|
+
}
|
|
101
|
+
}));
|
|
102
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
103
|
+
style: {
|
|
104
|
+
padding: 24
|
|
105
|
+
},
|
|
106
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
107
|
+
options: options
|
|
108
|
+
})
|
|
109
|
+
});
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
/** Settings menu: trailing switch per row. */
|
|
114
|
+
const Toggles = exports.Toggles = {
|
|
115
|
+
render: () => {
|
|
116
|
+
const items = ['Notifications', 'Sound', 'Auto-print receipt'];
|
|
117
|
+
const [on, setOn] = (0, _react.useState)({
|
|
118
|
+
Notifications: true
|
|
119
|
+
});
|
|
120
|
+
const options = items.map(label => ({
|
|
121
|
+
key: label,
|
|
122
|
+
label,
|
|
123
|
+
trailing: {
|
|
124
|
+
kind: 'switch',
|
|
125
|
+
value: Boolean(on[label]),
|
|
126
|
+
onChange: v => setOn(s => ({
|
|
127
|
+
...s,
|
|
128
|
+
[label]: v
|
|
129
|
+
}))
|
|
130
|
+
}
|
|
131
|
+
}));
|
|
132
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
133
|
+
style: {
|
|
134
|
+
padding: 24
|
|
135
|
+
},
|
|
136
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
137
|
+
options: options
|
|
138
|
+
})
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
};
|
|
142
|
+
|
|
143
|
+
/** Custom width via param. */
|
|
144
|
+
const CustomWidth = exports.CustomWidth = {
|
|
145
|
+
render: () => {
|
|
146
|
+
const options = ['Profile', 'Billing', 'Log out'].map(label => ({
|
|
147
|
+
key: label,
|
|
148
|
+
label
|
|
149
|
+
}));
|
|
150
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
151
|
+
style: {
|
|
152
|
+
padding: 24
|
|
153
|
+
},
|
|
154
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
155
|
+
options: options,
|
|
156
|
+
width: 240,
|
|
157
|
+
onSelect: () => {}
|
|
158
|
+
})
|
|
159
|
+
});
|
|
160
|
+
}
|
|
161
|
+
};
|
|
162
|
+
|
|
163
|
+
/** Long labels truncate with an ellipsis (single line). */
|
|
164
|
+
const Ellipsis = exports.Ellipsis = {
|
|
165
|
+
render: () => {
|
|
166
|
+
const theme = (0, _index.useTheme)();
|
|
167
|
+
const options = [{
|
|
168
|
+
key: '1',
|
|
169
|
+
label: 'This is a really long option label that will not fit',
|
|
170
|
+
leading: {
|
|
171
|
+
kind: 'icon',
|
|
172
|
+
name: 'star'
|
|
173
|
+
},
|
|
174
|
+
trailing: {
|
|
175
|
+
kind: 'icon',
|
|
176
|
+
name: 'check',
|
|
177
|
+
color: theme.colors.feedback.success
|
|
178
|
+
}
|
|
179
|
+
}, {
|
|
180
|
+
key: '2',
|
|
181
|
+
label: 'Another very very very long option that overflows the row',
|
|
182
|
+
trailing: {
|
|
183
|
+
kind: 'checkbox',
|
|
184
|
+
checked: false,
|
|
185
|
+
onChange: () => {}
|
|
186
|
+
}
|
|
187
|
+
}];
|
|
188
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
189
|
+
style: {
|
|
190
|
+
padding: 24
|
|
191
|
+
},
|
|
192
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
193
|
+
options: options,
|
|
194
|
+
width: 260
|
|
195
|
+
})
|
|
196
|
+
});
|
|
197
|
+
}
|
|
198
|
+
};
|
|
199
|
+
|
|
200
|
+
/** Action menu (e.g. from an IconButton): leading icons + a destructive row. */
|
|
201
|
+
const ActionMenu = exports.ActionMenu = {
|
|
202
|
+
render: () => {
|
|
203
|
+
const options = [{
|
|
204
|
+
key: 'edit',
|
|
205
|
+
label: 'Edit',
|
|
206
|
+
leading: {
|
|
207
|
+
kind: 'icon',
|
|
208
|
+
name: 'edit'
|
|
209
|
+
}
|
|
210
|
+
}, {
|
|
211
|
+
key: 'duplicate',
|
|
212
|
+
label: 'Duplicate',
|
|
213
|
+
leading: {
|
|
214
|
+
kind: 'icon',
|
|
215
|
+
name: 'copy-01'
|
|
216
|
+
}
|
|
217
|
+
}, {
|
|
218
|
+
key: 'settings',
|
|
219
|
+
label: 'Settings',
|
|
220
|
+
leading: {
|
|
221
|
+
kind: 'icon',
|
|
222
|
+
name: 'settings'
|
|
223
|
+
}
|
|
224
|
+
}, {
|
|
225
|
+
key: 'div',
|
|
226
|
+
type: 'divider'
|
|
227
|
+
}, {
|
|
228
|
+
key: 'delete',
|
|
229
|
+
label: 'Delete',
|
|
230
|
+
leading: {
|
|
231
|
+
kind: 'icon',
|
|
232
|
+
name: 'trash'
|
|
233
|
+
},
|
|
234
|
+
destructive: true
|
|
235
|
+
}];
|
|
236
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
237
|
+
style: {
|
|
238
|
+
padding: 24
|
|
239
|
+
},
|
|
240
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
241
|
+
options: options,
|
|
242
|
+
width: 260,
|
|
243
|
+
onSelect: () => {}
|
|
244
|
+
})
|
|
245
|
+
});
|
|
246
|
+
}
|
|
247
|
+
};
|
|
248
|
+
|
|
249
|
+
/** Text only — no slots. */
|
|
250
|
+
const TextOnly = exports.TextOnly = {
|
|
251
|
+
render: () => {
|
|
252
|
+
const options = ['Profile', 'Billing', 'Log out'].map(label => ({
|
|
253
|
+
key: label,
|
|
254
|
+
label
|
|
255
|
+
}));
|
|
256
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
257
|
+
style: {
|
|
258
|
+
padding: 24
|
|
259
|
+
},
|
|
260
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
261
|
+
options: options,
|
|
262
|
+
width: 240,
|
|
263
|
+
onSelect: () => {}
|
|
264
|
+
})
|
|
265
|
+
});
|
|
266
|
+
}
|
|
267
|
+
};
|
|
268
|
+
|
|
269
|
+
/** Grouped with section headers and a divider. */
|
|
270
|
+
const Grouped = exports.Grouped = {
|
|
271
|
+
render: () => {
|
|
272
|
+
const options = [{
|
|
273
|
+
key: 'h1',
|
|
274
|
+
type: 'header',
|
|
275
|
+
label: 'ACCOUNT'
|
|
276
|
+
}, {
|
|
277
|
+
key: 'profile',
|
|
278
|
+
label: 'Profile',
|
|
279
|
+
leading: {
|
|
280
|
+
kind: 'icon',
|
|
281
|
+
name: 'user'
|
|
282
|
+
}
|
|
283
|
+
}, {
|
|
284
|
+
key: 'settings',
|
|
285
|
+
label: 'Settings',
|
|
286
|
+
leading: {
|
|
287
|
+
kind: 'icon',
|
|
288
|
+
name: 'settings'
|
|
289
|
+
}
|
|
290
|
+
}, {
|
|
291
|
+
key: 'div',
|
|
292
|
+
type: 'divider'
|
|
293
|
+
}, {
|
|
294
|
+
key: 'h2',
|
|
295
|
+
type: 'header',
|
|
296
|
+
label: 'SESSION'
|
|
297
|
+
}, {
|
|
298
|
+
key: 'logout',
|
|
299
|
+
label: 'Log out',
|
|
300
|
+
destructive: true
|
|
301
|
+
}];
|
|
302
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
303
|
+
style: {
|
|
304
|
+
padding: 24
|
|
305
|
+
},
|
|
306
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
307
|
+
options: options,
|
|
308
|
+
width: 280,
|
|
309
|
+
showDividers: false,
|
|
310
|
+
onSelect: () => {}
|
|
311
|
+
})
|
|
312
|
+
});
|
|
313
|
+
}
|
|
314
|
+
};
|
|
315
|
+
|
|
316
|
+
/** Two-line rows (label + description). */
|
|
317
|
+
const TwoLine = exports.TwoLine = {
|
|
318
|
+
render: () => {
|
|
319
|
+
const options = [{
|
|
320
|
+
key: 'card',
|
|
321
|
+
label: 'Credit card',
|
|
322
|
+
description: 'Visa ending in 4242',
|
|
323
|
+
leading: {
|
|
324
|
+
kind: 'icon',
|
|
325
|
+
name: 'star'
|
|
326
|
+
}
|
|
327
|
+
}, {
|
|
328
|
+
key: 'cash',
|
|
329
|
+
label: 'Cash',
|
|
330
|
+
description: 'Pay at the counter',
|
|
331
|
+
leading: {
|
|
332
|
+
kind: 'icon',
|
|
333
|
+
name: 'star'
|
|
334
|
+
}
|
|
335
|
+
}];
|
|
336
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
337
|
+
style: {
|
|
338
|
+
padding: 24
|
|
339
|
+
},
|
|
340
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
341
|
+
options: options,
|
|
342
|
+
onSelect: () => {}
|
|
343
|
+
})
|
|
344
|
+
});
|
|
345
|
+
}
|
|
346
|
+
};
|
|
347
|
+
|
|
348
|
+
/** Long list — scrolls beyond maxHeight. */
|
|
349
|
+
const Scrollable = exports.Scrollable = {
|
|
350
|
+
render: () => {
|
|
351
|
+
const options = Array.from({
|
|
352
|
+
length: 20
|
|
353
|
+
}).map((_, i) => ({
|
|
354
|
+
key: String(i),
|
|
355
|
+
label: `Option ${i + 1}`
|
|
356
|
+
}));
|
|
357
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
358
|
+
style: {
|
|
359
|
+
padding: 24
|
|
360
|
+
},
|
|
361
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
362
|
+
options: options,
|
|
363
|
+
width: 300,
|
|
364
|
+
maxHeight: 280,
|
|
365
|
+
onSelect: () => {}
|
|
366
|
+
})
|
|
367
|
+
});
|
|
368
|
+
}
|
|
369
|
+
};
|
|
370
|
+
|
|
371
|
+
/** Icon + actionable on both sides, and a custom leading node. */
|
|
372
|
+
const CustomAndBothSides = exports.CustomAndBothSides = {
|
|
373
|
+
render: () => {
|
|
374
|
+
const [fav, setFav] = (0, _react.useState)({});
|
|
375
|
+
const options = [{
|
|
376
|
+
key: 'a',
|
|
377
|
+
label: 'Table 1',
|
|
378
|
+
leading: {
|
|
379
|
+
kind: 'custom',
|
|
380
|
+
node: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
381
|
+
style: {
|
|
382
|
+
width: 12,
|
|
383
|
+
height: 12,
|
|
384
|
+
borderRadius: 6,
|
|
385
|
+
backgroundColor: '#008C57'
|
|
386
|
+
}
|
|
387
|
+
})
|
|
388
|
+
},
|
|
389
|
+
trailing: {
|
|
390
|
+
kind: 'checkbox',
|
|
391
|
+
checked: Boolean(fav.a),
|
|
392
|
+
onChange: v => setFav(f => ({
|
|
393
|
+
...f,
|
|
394
|
+
a: v
|
|
395
|
+
}))
|
|
396
|
+
}
|
|
397
|
+
}, {
|
|
398
|
+
key: 'b',
|
|
399
|
+
label: 'Table 2',
|
|
400
|
+
leading: {
|
|
401
|
+
kind: 'icon',
|
|
402
|
+
name: 'star'
|
|
403
|
+
},
|
|
404
|
+
trailing: {
|
|
405
|
+
kind: 'iconButton',
|
|
406
|
+
name: 'edit',
|
|
407
|
+
onPress: () => {},
|
|
408
|
+
accessibilityLabel: 'Edit table 2'
|
|
409
|
+
}
|
|
410
|
+
}];
|
|
411
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
412
|
+
style: {
|
|
413
|
+
padding: 24
|
|
414
|
+
},
|
|
415
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
416
|
+
options: options
|
|
417
|
+
})
|
|
418
|
+
});
|
|
419
|
+
}
|
|
420
|
+
};
|
|
421
|
+
//# sourceMappingURL=Dropdown.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_Dropdown","_index","_Text","_jsxRuntime","meta","title","component","Dropdown","_default","exports","default","Default","render","theme","useTheme","options","Array","from","length","map","_","i","key","String","label","leading","kind","name","trailing","color","colors","feedback","success","jsx","View","style","padding","children","Select","items","sel","setSel","useState","selected","undefined","jsxs","onSelect","Text","variant","marginTop","MultiSelect","checked","setChecked","Bacon","Boolean","onChange","v","c","Toggles","on","setOn","Notifications","value","s","CustomWidth","width","Ellipsis","ActionMenu","type","destructive","TextOnly","Grouped","showDividers","TwoLine","description","Scrollable","maxHeight","CustomAndBothSides","fav","setFav","node","height","borderRadius","backgroundColor","a","f","onPress","accessibilityLabel"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Dropdown/Dropdown.stories.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _reactNative = require("@testing-library/react-native");
|
|
4
|
+
var _index = require("../../theme/index.js");
|
|
5
|
+
var _Dropdown = require("./Dropdown.js");
|
|
6
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
|
+
function wrap(ui) {
|
|
8
|
+
return (0, _reactNative.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ThemeProvider, {
|
|
9
|
+
children: ui
|
|
10
|
+
}));
|
|
11
|
+
}
|
|
12
|
+
describe('DropdownItem', () => {
|
|
13
|
+
it('renders the label and fires onPress', () => {
|
|
14
|
+
const onPress = jest.fn();
|
|
15
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItem, {
|
|
16
|
+
label: "Edit",
|
|
17
|
+
onPress: onPress
|
|
18
|
+
}));
|
|
19
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('Edit'));
|
|
20
|
+
expect(onPress).toHaveBeenCalledTimes(1);
|
|
21
|
+
});
|
|
22
|
+
it('renders a description as a second line', () => {
|
|
23
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItem, {
|
|
24
|
+
label: "Credit card",
|
|
25
|
+
description: "Visa ending in 4242"
|
|
26
|
+
}));
|
|
27
|
+
expect(_reactNative.screen.getByText('Visa ending in 4242')).toBeTruthy();
|
|
28
|
+
});
|
|
29
|
+
it('row press toggles a trailing checkbox when no onPress is given', () => {
|
|
30
|
+
const onChange = jest.fn();
|
|
31
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItem, {
|
|
32
|
+
label: "Bacon",
|
|
33
|
+
trailing: {
|
|
34
|
+
kind: 'checkbox',
|
|
35
|
+
checked: false,
|
|
36
|
+
onChange
|
|
37
|
+
}
|
|
38
|
+
}));
|
|
39
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('Bacon'));
|
|
40
|
+
expect(onChange).toHaveBeenCalledWith(true);
|
|
41
|
+
});
|
|
42
|
+
it('row press toggles a trailing switch when no onPress is given', () => {
|
|
43
|
+
const onChange = jest.fn();
|
|
44
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItem, {
|
|
45
|
+
label: "Sound",
|
|
46
|
+
trailing: {
|
|
47
|
+
kind: 'switch',
|
|
48
|
+
value: true,
|
|
49
|
+
onChange
|
|
50
|
+
}
|
|
51
|
+
}));
|
|
52
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('Sound'));
|
|
53
|
+
expect(onChange).toHaveBeenCalledWith(false);
|
|
54
|
+
});
|
|
55
|
+
it('does not fire when disabled', () => {
|
|
56
|
+
const onPress = jest.fn();
|
|
57
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItem, {
|
|
58
|
+
label: "Edit",
|
|
59
|
+
onPress: onPress,
|
|
60
|
+
disabled: true
|
|
61
|
+
}));
|
|
62
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('Edit'));
|
|
63
|
+
expect(onPress).not.toHaveBeenCalled();
|
|
64
|
+
});
|
|
65
|
+
});
|
|
66
|
+
describe('Dropdown', () => {
|
|
67
|
+
const options = [{
|
|
68
|
+
key: 'a',
|
|
69
|
+
label: 'Alpha'
|
|
70
|
+
}, {
|
|
71
|
+
key: 'b',
|
|
72
|
+
label: 'Beta'
|
|
73
|
+
}, {
|
|
74
|
+
key: 'c',
|
|
75
|
+
label: 'Gamma'
|
|
76
|
+
}];
|
|
77
|
+
it('renders every item', () => {
|
|
78
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
79
|
+
options: options
|
|
80
|
+
}));
|
|
81
|
+
expect(_reactNative.screen.getByText('Alpha')).toBeTruthy();
|
|
82
|
+
expect(_reactNative.screen.getByText('Beta')).toBeTruthy();
|
|
83
|
+
expect(_reactNative.screen.getByText('Gamma')).toBeTruthy();
|
|
84
|
+
});
|
|
85
|
+
it('calls onSelect with the pressed key', () => {
|
|
86
|
+
const onSelect = jest.fn();
|
|
87
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
88
|
+
options: options,
|
|
89
|
+
onSelect: onSelect
|
|
90
|
+
}));
|
|
91
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('Beta'));
|
|
92
|
+
expect(onSelect).toHaveBeenCalledWith('b');
|
|
93
|
+
});
|
|
94
|
+
it('renders section headers and does not treat them as items', () => {
|
|
95
|
+
const withHeader = [{
|
|
96
|
+
key: 'h',
|
|
97
|
+
type: 'header',
|
|
98
|
+
label: 'GROUP'
|
|
99
|
+
}, {
|
|
100
|
+
key: 'x',
|
|
101
|
+
label: 'Item X'
|
|
102
|
+
}];
|
|
103
|
+
const onSelect = jest.fn();
|
|
104
|
+
wrap(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.Dropdown, {
|
|
105
|
+
options: withHeader,
|
|
106
|
+
onSelect: onSelect
|
|
107
|
+
}));
|
|
108
|
+
expect(_reactNative.screen.getByText('GROUP')).toBeTruthy();
|
|
109
|
+
_reactNative.fireEvent.press(_reactNative.screen.getByText('GROUP'));
|
|
110
|
+
expect(onSelect).not.toHaveBeenCalled();
|
|
111
|
+
});
|
|
112
|
+
});
|
|
113
|
+
//# sourceMappingURL=Dropdown.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_index","_Dropdown","_jsxRuntime","wrap","ui","render","jsx","ThemeProvider","children","describe","it","onPress","jest","fn","DropdownItem","label","fireEvent","press","screen","getByText","expect","toHaveBeenCalledTimes","description","toBeTruthy","onChange","trailing","kind","checked","toHaveBeenCalledWith","value","disabled","not","toHaveBeenCalled","options","key","Dropdown","onSelect","withHeader","type"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Dropdown/Dropdown.test.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "Dropdown", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _Dropdown.Dropdown;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "DropdownItem", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _Dropdown.DropdownItem;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
var _Dropdown = require("./Dropdown.js");
|
|
19
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_Dropdown","require"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Dropdown/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA","ignoreList":[]}
|