@shipfox/react-ui 0.25.0 → 0.27.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.
Files changed (56) hide show
  1. package/dist/components/dot-grid/dot-grid.js +8 -2
  2. package/dist/components/index.d.ts +1 -0
  3. package/dist/components/index.js +1 -0
  4. package/dist/components/slider/index.d.ts +2 -0
  5. package/dist/components/slider/index.js +3 -0
  6. package/dist/components/slider/slider.d.ts +10 -0
  7. package/dist/components/slider/slider.js +38 -0
  8. package/dist/components/table/data-table.js +7 -6
  9. package/dist/components/table/table.stories.data.js +1 -1
  10. package/dist/styles.css +1 -1
  11. package/package.json +17 -5
  12. package/dist/colors.stories.js +0 -61
  13. package/dist/components/alert/alert.stories.js +0 -227
  14. package/dist/components/avatar/avatar.stories.js +0 -267
  15. package/dist/components/badge/badge.stories.js +0 -802
  16. package/dist/components/button/button-link.stories.js +0 -127
  17. package/dist/components/button/button.stories.js +0 -187
  18. package/dist/components/button/icon-button.stories.js +0 -344
  19. package/dist/components/button-group/button-group.stories.js +0 -644
  20. package/dist/components/card/card.stories.js +0 -216
  21. package/dist/components/checkbox/checkbox.stories.js +0 -566
  22. package/dist/components/code-block/code-block.stories.js +0 -341
  23. package/dist/components/combobox/combobox.stories.js +0 -191
  24. package/dist/components/command/command.stories.js +0 -228
  25. package/dist/components/confetti/confetti.stories.js +0 -41
  26. package/dist/components/count-up/count-up.stories.js +0 -568
  27. package/dist/components/dashboard/components/charts/bar-chart.stories.js +0 -287
  28. package/dist/components/dashboard/components/charts/line-chart.stories.js +0 -257
  29. package/dist/components/dashboard/dashboard.stories.js +0 -23
  30. package/dist/components/date-picker/date-picker.stories.js +0 -349
  31. package/dist/components/dropdown-input/dropdown-input.stories.js +0 -240
  32. package/dist/components/dropdown-menu/dropdown-menu.stories.js +0 -462
  33. package/dist/components/dynamic-item/dynamic-item.stories.js +0 -385
  34. package/dist/components/empty-state/empty-state.stories.js +0 -74
  35. package/dist/components/form/form.stories.js +0 -587
  36. package/dist/components/icon/icon.stories.js +0 -38
  37. package/dist/components/inline-tips/inline-tips.stories.js +0 -219
  38. package/dist/components/input/input.stories.js +0 -265
  39. package/dist/components/interval-selector/interval-selector.stories.js +0 -232
  40. package/dist/components/item/item.stories.js +0 -239
  41. package/dist/components/kbd/kbd.stories.js +0 -119
  42. package/dist/components/label/label.stories.js +0 -105
  43. package/dist/components/modal/modal.stories.js +0 -566
  44. package/dist/components/search/search.stories.js +0 -630
  45. package/dist/components/select/select.stories.js +0 -393
  46. package/dist/components/sheet/sheet.stories.js +0 -368
  47. package/dist/components/skeleton/skeleton.stories.js +0 -345
  48. package/dist/components/table/table.stories.js +0 -302
  49. package/dist/components/tabs/tabs.stories.js +0 -179
  50. package/dist/components/textarea/textarea.stories.js +0 -339
  51. package/dist/components/toast/toast.stories.js +0 -326
  52. package/dist/components/tooltip/tooltip.stories.js +0 -560
  53. package/dist/components/typography/code.stories.js +0 -54
  54. package/dist/components/typography/header.stories.js +0 -34
  55. package/dist/components/typography/text.stories.js +0 -105
  56. package/dist/onboarding/sign-in.stories.js +0 -101
@@ -1,393 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Kbd } from '../kbd/index.js';
3
- import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue } from './select.js';
4
- const meta = {
5
- title: 'Components/Select',
6
- component: Select,
7
- tags: [
8
- 'autodocs'
9
- ]
10
- };
11
- export default meta;
12
- export const Default = {
13
- render: ()=>/*#__PURE__*/ _jsxs(Select, {
14
- children: [
15
- /*#__PURE__*/ _jsx(SelectTrigger, {
16
- className: "w-200",
17
- children: /*#__PURE__*/ _jsx(SelectValue, {
18
- placeholder: "Select an option"
19
- })
20
- }),
21
- /*#__PURE__*/ _jsxs(SelectContent, {
22
- children: [
23
- /*#__PURE__*/ _jsx(SelectItem, {
24
- value: "option1",
25
- children: "Option 1"
26
- }),
27
- /*#__PURE__*/ _jsx(SelectItem, {
28
- value: "option2",
29
- children: "Option 2"
30
- }),
31
- /*#__PURE__*/ _jsx(SelectItem, {
32
- value: "option3",
33
- children: "Option 3"
34
- })
35
- ]
36
- })
37
- ]
38
- })
39
- };
40
- export const WithGroups = {
41
- render: ()=>/*#__PURE__*/ _jsxs(Select, {
42
- defaultValue: "typescript",
43
- children: [
44
- /*#__PURE__*/ _jsx(SelectTrigger, {
45
- className: "w-280",
46
- children: /*#__PURE__*/ _jsx(SelectValue, {
47
- placeholder: "Select a technology"
48
- })
49
- }),
50
- /*#__PURE__*/ _jsxs(SelectContent, {
51
- children: [
52
- /*#__PURE__*/ _jsxs(SelectGroup, {
53
- children: [
54
- /*#__PURE__*/ _jsx(SelectLabel, {
55
- children: "Frontend"
56
- }),
57
- /*#__PURE__*/ _jsx(SelectItem, {
58
- value: "react",
59
- children: "React"
60
- }),
61
- /*#__PURE__*/ _jsx(SelectItem, {
62
- value: "vue",
63
- children: "Vue"
64
- }),
65
- /*#__PURE__*/ _jsx(SelectItem, {
66
- value: "angular",
67
- children: "Angular"
68
- }),
69
- /*#__PURE__*/ _jsx(SelectItem, {
70
- value: "svelte",
71
- children: "Svelte"
72
- })
73
- ]
74
- }),
75
- /*#__PURE__*/ _jsx(SelectSeparator, {}),
76
- /*#__PURE__*/ _jsxs(SelectGroup, {
77
- children: [
78
- /*#__PURE__*/ _jsx(SelectLabel, {
79
- children: "Backend"
80
- }),
81
- /*#__PURE__*/ _jsx(SelectItem, {
82
- value: "nodejs",
83
- children: "Node.js"
84
- }),
85
- /*#__PURE__*/ _jsx(SelectItem, {
86
- value: "python",
87
- children: "Python"
88
- }),
89
- /*#__PURE__*/ _jsx(SelectItem, {
90
- value: "ruby",
91
- children: "Ruby"
92
- }),
93
- /*#__PURE__*/ _jsx(SelectItem, {
94
- value: "go",
95
- children: "Go"
96
- })
97
- ]
98
- }),
99
- /*#__PURE__*/ _jsx(SelectSeparator, {}),
100
- /*#__PURE__*/ _jsxs(SelectGroup, {
101
- children: [
102
- /*#__PURE__*/ _jsx(SelectLabel, {
103
- children: "Languages"
104
- }),
105
- /*#__PURE__*/ _jsx(SelectItem, {
106
- value: "typescript",
107
- children: "TypeScript"
108
- }),
109
- /*#__PURE__*/ _jsx(SelectItem, {
110
- value: "javascript",
111
- children: "JavaScript"
112
- }),
113
- /*#__PURE__*/ _jsx(SelectItem, {
114
- value: "rust",
115
- children: "Rust"
116
- })
117
- ]
118
- })
119
- ]
120
- })
121
- ]
122
- })
123
- };
124
- export const WithIcons = {
125
- render: ()=>/*#__PURE__*/ _jsxs("div", {
126
- className: "flex flex-col gap-12",
127
- children: [
128
- /*#__PURE__*/ _jsxs(Select, {
129
- defaultValue: "active",
130
- children: [
131
- /*#__PURE__*/ _jsx(SelectTrigger, {
132
- className: "w-200",
133
- children: /*#__PURE__*/ _jsx(SelectValue, {
134
- placeholder: "Select status"
135
- })
136
- }),
137
- /*#__PURE__*/ _jsxs(SelectContent, {
138
- children: [
139
- /*#__PURE__*/ _jsx(SelectItem, {
140
- value: "active",
141
- icon: "checkboxCircleLine",
142
- children: "Active"
143
- }),
144
- /*#__PURE__*/ _jsx(SelectItem, {
145
- value: "pending",
146
- icon: "timeLine",
147
- children: "Pending"
148
- }),
149
- /*#__PURE__*/ _jsx(SelectItem, {
150
- value: "inactive",
151
- icon: "closeLine",
152
- children: "Inactive"
153
- })
154
- ]
155
- })
156
- ]
157
- }),
158
- /*#__PURE__*/ _jsxs(Select, {
159
- defaultValue: "medium",
160
- children: [
161
- /*#__PURE__*/ _jsx(SelectTrigger, {
162
- className: "w-200",
163
- children: /*#__PURE__*/ _jsx(SelectValue, {
164
- placeholder: "Select priority"
165
- })
166
- }),
167
- /*#__PURE__*/ _jsxs(SelectContent, {
168
- children: [
169
- /*#__PURE__*/ _jsx(SelectItem, {
170
- value: "high",
171
- icon: "arrowUpLine",
172
- children: "High"
173
- }),
174
- /*#__PURE__*/ _jsx(SelectItem, {
175
- value: "medium",
176
- icon: "equalLine",
177
- children: "Medium"
178
- }),
179
- /*#__PURE__*/ _jsx(SelectItem, {
180
- value: "low",
181
- icon: "arrowDownLine",
182
- children: "Low"
183
- })
184
- ]
185
- })
186
- ]
187
- })
188
- ]
189
- })
190
- };
191
- export const Sizes = {
192
- render: ()=>/*#__PURE__*/ _jsxs("div", {
193
- className: "flex flex-col gap-12",
194
- children: [
195
- /*#__PURE__*/ _jsxs(Select, {
196
- children: [
197
- /*#__PURE__*/ _jsx(SelectTrigger, {
198
- size: "small",
199
- className: "w-200",
200
- children: /*#__PURE__*/ _jsx(SelectValue, {
201
- placeholder: "Small"
202
- })
203
- }),
204
- /*#__PURE__*/ _jsxs(SelectContent, {
205
- children: [
206
- /*#__PURE__*/ _jsx(SelectItem, {
207
- value: "option1",
208
- children: "Option 1"
209
- }),
210
- /*#__PURE__*/ _jsx(SelectItem, {
211
- value: "option2",
212
- children: "Option 2"
213
- })
214
- ]
215
- })
216
- ]
217
- }),
218
- /*#__PURE__*/ _jsxs(Select, {
219
- children: [
220
- /*#__PURE__*/ _jsx(SelectTrigger, {
221
- size: "base",
222
- className: "w-200",
223
- children: /*#__PURE__*/ _jsx(SelectValue, {
224
- placeholder: "Base (default)"
225
- })
226
- }),
227
- /*#__PURE__*/ _jsxs(SelectContent, {
228
- children: [
229
- /*#__PURE__*/ _jsx(SelectItem, {
230
- value: "option1",
231
- children: "Option 1"
232
- }),
233
- /*#__PURE__*/ _jsx(SelectItem, {
234
- value: "option2",
235
- children: "Option 2"
236
- })
237
- ]
238
- })
239
- ]
240
- })
241
- ]
242
- })
243
- };
244
- export const Variants = {
245
- render: ()=>/*#__PURE__*/ _jsxs("div", {
246
- className: "flex flex-col gap-12",
247
- children: [
248
- /*#__PURE__*/ _jsxs(Select, {
249
- children: [
250
- /*#__PURE__*/ _jsx(SelectTrigger, {
251
- variant: "base",
252
- className: "w-200",
253
- children: /*#__PURE__*/ _jsx(SelectValue, {
254
- placeholder: "Base variant"
255
- })
256
- }),
257
- /*#__PURE__*/ _jsxs(SelectContent, {
258
- children: [
259
- /*#__PURE__*/ _jsx(SelectItem, {
260
- value: "option1",
261
- children: "Option 1"
262
- }),
263
- /*#__PURE__*/ _jsx(SelectItem, {
264
- value: "option2",
265
- children: "Option 2"
266
- })
267
- ]
268
- })
269
- ]
270
- }),
271
- /*#__PURE__*/ _jsxs(Select, {
272
- children: [
273
- /*#__PURE__*/ _jsx(SelectTrigger, {
274
- variant: "component",
275
- className: "w-200",
276
- children: /*#__PURE__*/ _jsx(SelectValue, {
277
- placeholder: "Component variant"
278
- })
279
- }),
280
- /*#__PURE__*/ _jsxs(SelectContent, {
281
- children: [
282
- /*#__PURE__*/ _jsx(SelectItem, {
283
- value: "option1",
284
- children: "Option 1"
285
- }),
286
- /*#__PURE__*/ _jsx(SelectItem, {
287
- value: "option2",
288
- children: "Option 2"
289
- })
290
- ]
291
- })
292
- ]
293
- })
294
- ]
295
- })
296
- };
297
- export const TimeSelector = {
298
- render: ()=>/*#__PURE__*/ _jsxs(Select, {
299
- defaultValue: "2days",
300
- children: [
301
- /*#__PURE__*/ _jsx(SelectTrigger, {
302
- className: "w-280",
303
- children: /*#__PURE__*/ _jsx("div", {
304
- className: "flex items-center gap-8 flex-1 min-w-0",
305
- children: /*#__PURE__*/ _jsx(SelectValue, {
306
- placeholder: "Select time range"
307
- })
308
- })
309
- }),
310
- /*#__PURE__*/ _jsxs(SelectContent, {
311
- children: [
312
- /*#__PURE__*/ _jsx(SelectItem, {
313
- value: "1hour",
314
- children: /*#__PURE__*/ _jsxs("div", {
315
- className: "flex items-center gap-8",
316
- children: [
317
- /*#__PURE__*/ _jsx(Kbd, {
318
- className: "h-16",
319
- children: "1h"
320
- }),
321
- /*#__PURE__*/ _jsx("span", {
322
- children: "Past 1 Hour"
323
- })
324
- ]
325
- })
326
- }),
327
- /*#__PURE__*/ _jsx(SelectItem, {
328
- value: "1day",
329
- children: /*#__PURE__*/ _jsxs("div", {
330
- className: "flex items-center gap-8",
331
- children: [
332
- /*#__PURE__*/ _jsx(Kbd, {
333
- className: "h-16",
334
- children: "1d"
335
- }),
336
- /*#__PURE__*/ _jsx("span", {
337
- children: "Past 1 Day"
338
- })
339
- ]
340
- })
341
- }),
342
- /*#__PURE__*/ _jsx(SelectItem, {
343
- value: "2days",
344
- children: /*#__PURE__*/ _jsxs("div", {
345
- className: "flex items-center gap-8",
346
- children: [
347
- /*#__PURE__*/ _jsx(Kbd, {
348
- className: "h-16",
349
- children: "2d"
350
- }),
351
- /*#__PURE__*/ _jsx("span", {
352
- children: "Past 2 Days"
353
- })
354
- ]
355
- })
356
- }),
357
- /*#__PURE__*/ _jsx(SelectItem, {
358
- value: "7days",
359
- children: /*#__PURE__*/ _jsxs("div", {
360
- className: "flex items-center gap-8",
361
- children: [
362
- /*#__PURE__*/ _jsx(Kbd, {
363
- className: "h-16",
364
- children: "7d"
365
- }),
366
- /*#__PURE__*/ _jsx("span", {
367
- children: "Past 7 Days"
368
- })
369
- ]
370
- })
371
- }),
372
- /*#__PURE__*/ _jsx(SelectItem, {
373
- value: "30days",
374
- children: /*#__PURE__*/ _jsxs("div", {
375
- className: "flex items-center gap-8",
376
- children: [
377
- /*#__PURE__*/ _jsx(Kbd, {
378
- className: "h-16",
379
- children: "30d"
380
- }),
381
- /*#__PURE__*/ _jsx("span", {
382
- children: "Past 30 Days"
383
- })
384
- ]
385
- })
386
- })
387
- ]
388
- })
389
- ]
390
- })
391
- };
392
-
393
- //# sourceMappingURL=select.stories.js.map