@driveflux/beam 3.0.1 → 3.0.3
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/accordion/Accordion.js +7 -133
- package/dist/accordion/Accordion.stories.js +11 -31
- package/dist/alert/Alert.d.ts +1 -1
- package/dist/alert/Alert.d.ts.map +1 -1
- package/dist/alert/Alert.js +19 -120
- package/dist/alert/Alert.js.map +1 -1
- package/dist/alert/Alert.stories.d.ts +1 -1
- package/dist/alert/Alert.stories.js +15 -50
- package/dist/animations/LoadingAnimation.js +21 -34
- package/dist/badge/Badge.d.ts +1 -1
- package/dist/badge/Badge.d.ts.map +1 -1
- package/dist/badge/Badge.js +8 -96
- package/dist/badge/Badge.js.map +1 -1
- package/dist/badge/Badge.stories.js +7 -28
- package/dist/box/Box.js +3 -87
- package/dist/box/Box.stories.js +7 -8
- package/dist/breadcrumbs/Breadcrumbs.js +28 -288
- package/dist/breadcrumbs/Breadcrumbs.stories.js +27 -51
- package/dist/button/Button.d.ts +1 -1
- package/dist/button/Button.js +12 -124
- package/dist/button/Button.stories.js +7 -35
- package/dist/card/Card.js +7 -109
- package/dist/card/Card.stories.js +7 -10
- package/dist/carousel/Carousel.js +58 -281
- package/dist/carousel/Carousel.stories.js +7 -39
- package/dist/carousel/CarouselButton.js +7 -68
- package/dist/center/Center.js +3 -63
- package/dist/center/Center.stories.js +7 -19
- package/dist/checkbox/Checkbox.js +4 -124
- package/dist/checkbox/Checkbox.stories.js +8 -10
- package/dist/chip/Chip.js +3 -104
- package/dist/chip/Chip.stories.js +7 -19
- package/dist/circular-progress/CircularProgress.js +11 -150
- package/dist/circular-progress/CircularProgress.stories.js +14 -54
- package/dist/command/command.d.ts +1 -1
- package/dist/command/command.js +13 -170
- package/dist/datepicker/DatePicker.d.ts +6 -6
- package/dist/datepicker/DatePicker.d.ts.map +1 -1
- package/dist/datepicker/DatePicker.js +145 -131
- package/dist/datepicker/DatePicker.js.map +1 -1
- package/dist/datepicker/DatePicker.stories.js +58 -163
- package/dist/datepicker/DatePickerDrawer.d.ts +1 -1
- package/dist/datepicker/DatePickerDrawer.d.ts.map +1 -1
- package/dist/datepicker/DatePickerDrawer.js +19 -110
- package/dist/datepicker/DatePickerDrawer.js.map +1 -1
- package/dist/datepicker/DatePickerPopover.d.ts.map +1 -1
- package/dist/datepicker/DatePickerPopover.js +35 -207
- package/dist/datepicker/DatePickerPopover.js.map +1 -1
- package/dist/datepicker/constants.js +4 -3
- package/dist/datepicker/utils.js +11 -4
- package/dist/dialog/index.d.ts.map +1 -1
- package/dist/dialog/index.js +33 -180
- package/dist/dialog/index.js.map +1 -1
- package/dist/divider/Divider.js +3 -63
- package/dist/divider/Divider.stories.js +7 -13
- package/dist/drawer/index.js +12 -157
- package/dist/dropdown/Dropdown.js +26 -212
- package/dist/dropdown/Dropdown.stories.js +22 -109
- package/dist/field-wrapper/FieldWrapper.js +3 -139
- package/dist/field-wrapper/FieldWrapper.stories.js +28 -124
- package/dist/flex/Flex.js +3 -63
- package/dist/flex/Flex.stories.js +7 -19
- package/dist/grid/Grid.js +3 -63
- package/dist/grid/Grid.stories.js +7 -28
- package/dist/hooks/use-breakpoint-value.js +14 -77
- package/dist/hooks/use-media-query.js +12 -61
- package/dist/hstack/HStack.js +3 -63
- package/dist/hstack/HStack.stories.js +7 -19
- package/dist/icons/FluxLogo.js +9 -213
- package/dist/icons/FluxLogoTable.js +5 -109
- package/dist/icons/Icon.js +7 -108
- package/dist/icons/Icon.stories.js +7 -12
- package/dist/icons/Icon24Hours.js +5 -83
- package/dist/icons/IconAcceleration.js +4 -72
- package/dist/icons/IconAccount.js +4 -72
- package/dist/icons/IconApplicant.js +5 -78
- package/dist/icons/IconArrow.js +6 -78
- package/dist/icons/IconArrowBack.js +4 -72
- package/dist/icons/IconArrowForward.js +4 -72
- package/dist/icons/IconArrowTopLeft.js +4 -70
- package/dist/icons/IconBluesharkProductGuide.js +5 -80
- package/dist/icons/IconBolt.js +4 -72
- package/dist/icons/IconBriefcase.js +4 -72
- package/dist/icons/IconBulb.js +4 -72
- package/dist/icons/IconCalendar.js +4 -72
- package/dist/icons/IconCalendarArrowBack.js +4 -72
- package/dist/icons/IconCalendarArrowForward.js +4 -72
- package/dist/icons/IconCalendarDoubleArrowBack.js +4 -72
- package/dist/icons/IconCalendarDoubleArrowForward.js +4 -72
- package/dist/icons/IconCancel.js +5 -77
- package/dist/icons/IconCancelMark.js +4 -72
- package/dist/icons/IconCarSUV.js +4 -72
- package/dist/icons/IconCarSedan.js +7 -147
- package/dist/icons/IconChain.js +5 -79
- package/dist/icons/IconCheckmark.js +4 -72
- package/dist/icons/IconChevronRight.js +4 -72
- package/dist/icons/IconCircle.js +11 -114
- package/dist/icons/IconCircleCheckmark.js +5 -77
- package/dist/icons/IconCircleError.js +4 -72
- package/dist/icons/IconCircleExclamation.js +6 -104
- package/dist/icons/IconCircleMark.js +5 -78
- package/dist/icons/IconCircleOutline.js +5 -139
- package/dist/icons/IconClock.js +5 -80
- package/dist/icons/IconClose.js +4 -72
- package/dist/icons/IconCollapseAll.js +5 -94
- package/dist/icons/IconConcierge.js +5 -79
- package/dist/icons/IconConciergeService.js +5 -87
- package/dist/icons/IconCreditCard.js +5 -78
- package/dist/icons/IconDash.js +4 -72
- package/dist/icons/IconDeliver.js +4 -72
- package/dist/icons/IconDelivery.js +5 -87
- package/dist/icons/IconDetails.js +4 -72
- package/dist/icons/IconDot.js +6 -87
- package/dist/icons/IconDownload.js +5 -79
- package/dist/icons/IconEVCharging.js +5 -79
- package/dist/icons/IconElectricCarFuel.js +5 -80
- package/dist/icons/IconEllipsis.js +5 -78
- package/dist/icons/IconEnvelope.js +4 -72
- package/dist/icons/IconExpandAll.js +5 -94
- package/dist/icons/IconEye.js +5 -79
- package/dist/icons/IconFacebook.js +6 -94
- package/dist/icons/IconFilter.js +5 -83
- package/dist/icons/IconFlagMalaysia.js +5 -141
- package/dist/icons/IconGiveKey.js +5 -79
- package/dist/icons/IconGlobe.js +4 -70
- package/dist/icons/IconGoogle.js +5 -87
- package/dist/icons/IconHome.js +5 -78
- package/dist/icons/IconHostAdvertise.js +4 -72
- package/dist/icons/IconHostCar.js +4 -75
- package/dist/icons/IconHostCash.js +5 -91
- package/dist/icons/IconHostHandle.js +4 -70
- package/dist/icons/IconHostLocation.js +4 -70
- package/dist/icons/IconHostPayment.js +5 -91
- package/dist/icons/IconHostService.js +5 -79
- package/dist/icons/IconHotDeals.js +4 -72
- package/dist/icons/IconInfo.js +5 -77
- package/dist/icons/IconInstagram.js +4 -72
- package/dist/icons/IconInsurance.js +5 -99
- package/dist/icons/IconInternet.js +4 -73
- package/dist/icons/IconInventory.js +5 -78
- package/dist/icons/IconLaurel.js +5 -101
- package/dist/icons/IconLinkedIn.js +4 -72
- package/dist/icons/IconLoading.js +4 -78
- package/dist/icons/IconLocation.js +5 -80
- package/dist/icons/IconLock.js +4 -73
- package/dist/icons/IconLogistics.js +4 -72
- package/dist/icons/IconMail.js +5 -94
- package/dist/icons/IconMember.js +5 -78
- package/dist/icons/IconMobilePen.js +5 -83
- package/dist/icons/IconMotorcycleMoped.js +5 -78
- package/dist/icons/IconNoCost.js +5 -92
- package/dist/icons/IconPDF.js +5 -80
- package/dist/icons/IconPencil.js +4 -70
- package/dist/icons/IconPhone.js +4 -70
- package/dist/icons/IconPlus.js +4 -72
- package/dist/icons/IconPricing.js +4 -72
- package/dist/icons/IconProtected.js +4 -71
- package/dist/icons/IconPsychology.js +4 -72
- package/dist/icons/IconQuestionTooltip.js +4 -73
- package/dist/icons/IconQuote.js +4 -72
- package/dist/icons/IconRate.js +4 -71
- package/dist/icons/IconRegister.js +5 -99
- package/dist/icons/IconReport.js +6 -89
- package/dist/icons/IconReturn.js +4 -72
- package/dist/icons/IconSearch.js +4 -70
- package/dist/icons/IconSecure.js +4 -71
- package/dist/icons/IconSecurity.js +4 -73
- package/dist/icons/IconSedanOutline.js +5 -159
- package/dist/icons/IconSelectArrow.js +6 -78
- package/dist/icons/IconSort.js +5 -79
- package/dist/icons/IconSortListed.js +5 -95
- package/dist/icons/IconSortPriceAscending.js +5 -83
- package/dist/icons/IconSortPriceDescending.js +5 -83
- package/dist/icons/IconSortYear.js +5 -79
- package/dist/icons/IconSpan.js +4 -71
- package/dist/icons/IconSpeaker.js +4 -79
- package/dist/icons/IconSpecialCar.js +5 -95
- package/dist/icons/IconStar.js +7 -92
- package/dist/icons/IconStockPhoto.js +5 -95
- package/dist/icons/IconSubscription.js +6 -113
- package/dist/icons/IconSubscriptions.js +6 -113
- package/dist/icons/IconSwap.js +5 -79
- package/dist/icons/IconTax.js +4 -72
- package/dist/icons/IconThinArrow.js +6 -78
- package/dist/icons/IconThumbsdown.js +5 -78
- package/dist/icons/IconThumbsup.js +5 -78
- package/dist/icons/IconTool.js +4 -72
- package/dist/icons/IconTooltip.js +4 -73
- package/dist/icons/IconTrash.js +4 -72
- package/dist/icons/IconTriangleExclamation.js +4 -72
- package/dist/icons/IconTyersBrakes.js +5 -83
- package/dist/icons/IconTyre.js +5 -83
- package/dist/icons/IconVacancy.js +5 -78
- package/dist/icons/IconVolunteer.js +4 -72
- package/dist/icons/IconWhatsapp.js +4 -73
- package/dist/icons/IconXPlatform.js +4 -72
- package/dist/icons/IconZeroEffort.js +5 -77
- package/dist/icons/Logo.js +3 -99
- package/dist/input/Input.js +11 -125
- package/dist/input/Input.stories.js +18 -17
- package/dist/input-mask/InputMask.js +11 -149
- package/dist/input-mask/InputMask.stories.js +6 -5
- package/dist/input-mask/mask-trackers.js +5 -4
- package/dist/input-select/InputSelect.js +68 -357
- package/dist/input-select/InputSelect.stories.js +25 -98
- package/dist/popover/popover.js +4 -72
- package/dist/progress/Progress.js +2 -96
- package/dist/progress/Progress.stories.js +14 -13
- package/dist/radio/Radio.js +4 -163
- package/dist/scroll-area/scroll-area.js +5 -113
- package/dist/search-input-select/SearchInputSelect.js +69 -346
- package/dist/select/Select.js +29 -315
- package/dist/select/Select.stories.js +19 -55
- package/dist/skeleton/Skeleton.js +3 -62
- package/dist/skeleton/Skeleton.stories.js +7 -8
- package/dist/slider/Slider.js +5 -106
- package/dist/slider/Slider.stories.js +11 -12
- package/dist/stack/Stack.js +3 -63
- package/dist/stack/Stack.stories.js +7 -19
- package/dist/table/Table.js +10 -131
- package/dist/table/Table.stories.js +8 -84
- package/dist/tabs/Tabs.js +9 -128
- package/dist/tabs/Tabs.stories.js +13 -46
- package/dist/text/Text.js +6 -88
- package/dist/text/Text.stories.js +7 -44
- package/dist/toast/Toast.stories.js +14 -66
- package/dist/toast/ToastBox.d.ts.map +1 -1
- package/dist/toast/ToastBox.js +29 -77
- package/dist/toast/ToastBox.js.map +1 -1
- package/dist/toast/index.js +1 -0
- package/dist/toast/sonner.js +6 -66
- package/dist/toggle/Toggle.js +7 -116
- package/dist/toggle/Toggle.stories.js +8 -10
- package/dist/tooltip/Tooltip.js +12 -151
- package/dist/tooltip/Tooltip.stories.js +13 -71
- package/dist/utils.js +2 -4
- package/dist/vstack/VStack.js +3 -63
- package/dist/vstack/VStack.stories.js +7 -19
- package/package.json +1 -1
|
@@ -1,141 +1,4 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
function _array_like_to_array(arr, len) {
|
|
3
|
-
if (len == null || len > arr.length) len = arr.length;
|
|
4
|
-
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
5
|
-
return arr2;
|
|
6
|
-
}
|
|
7
|
-
function _array_with_holes(arr) {
|
|
8
|
-
if (Array.isArray(arr)) return arr;
|
|
9
|
-
}
|
|
10
|
-
function _array_without_holes(arr) {
|
|
11
|
-
if (Array.isArray(arr)) return _array_like_to_array(arr);
|
|
12
|
-
}
|
|
13
|
-
function _define_property(obj, key, value) {
|
|
14
|
-
if (key in obj) {
|
|
15
|
-
Object.defineProperty(obj, key, {
|
|
16
|
-
value: value,
|
|
17
|
-
enumerable: true,
|
|
18
|
-
configurable: true,
|
|
19
|
-
writable: true
|
|
20
|
-
});
|
|
21
|
-
} else {
|
|
22
|
-
obj[key] = value;
|
|
23
|
-
}
|
|
24
|
-
return obj;
|
|
25
|
-
}
|
|
26
|
-
function _iterable_to_array(iter) {
|
|
27
|
-
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
28
|
-
}
|
|
29
|
-
function _iterable_to_array_limit(arr, i) {
|
|
30
|
-
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
31
|
-
if (_i == null) return;
|
|
32
|
-
var _arr = [];
|
|
33
|
-
var _n = true;
|
|
34
|
-
var _d = false;
|
|
35
|
-
var _s, _e;
|
|
36
|
-
try {
|
|
37
|
-
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
38
|
-
_arr.push(_s.value);
|
|
39
|
-
if (i && _arr.length === i) break;
|
|
40
|
-
}
|
|
41
|
-
} catch (err) {
|
|
42
|
-
_d = true;
|
|
43
|
-
_e = err;
|
|
44
|
-
} finally{
|
|
45
|
-
try {
|
|
46
|
-
if (!_n && _i["return"] != null) _i["return"]();
|
|
47
|
-
} finally{
|
|
48
|
-
if (_d) throw _e;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
return _arr;
|
|
52
|
-
}
|
|
53
|
-
function _non_iterable_rest() {
|
|
54
|
-
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
55
|
-
}
|
|
56
|
-
function _non_iterable_spread() {
|
|
57
|
-
throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
58
|
-
}
|
|
59
|
-
function _object_spread(target) {
|
|
60
|
-
for(var i = 1; i < arguments.length; i++){
|
|
61
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
62
|
-
var ownKeys = Object.keys(source);
|
|
63
|
-
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
64
|
-
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
65
|
-
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
66
|
-
}));
|
|
67
|
-
}
|
|
68
|
-
ownKeys.forEach(function(key) {
|
|
69
|
-
_define_property(target, key, source[key]);
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
return target;
|
|
73
|
-
}
|
|
74
|
-
function ownKeys(object, enumerableOnly) {
|
|
75
|
-
var keys = Object.keys(object);
|
|
76
|
-
if (Object.getOwnPropertySymbols) {
|
|
77
|
-
var symbols = Object.getOwnPropertySymbols(object);
|
|
78
|
-
if (enumerableOnly) {
|
|
79
|
-
symbols = symbols.filter(function(sym) {
|
|
80
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
keys.push.apply(keys, symbols);
|
|
84
|
-
}
|
|
85
|
-
return keys;
|
|
86
|
-
}
|
|
87
|
-
function _object_spread_props(target, source) {
|
|
88
|
-
source = source != null ? source : {};
|
|
89
|
-
if (Object.getOwnPropertyDescriptors) {
|
|
90
|
-
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
91
|
-
} else {
|
|
92
|
-
ownKeys(Object(source)).forEach(function(key) {
|
|
93
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
94
|
-
});
|
|
95
|
-
}
|
|
96
|
-
return target;
|
|
97
|
-
}
|
|
98
|
-
function _object_without_properties(source, excluded) {
|
|
99
|
-
if (source == null) return {};
|
|
100
|
-
var target = _object_without_properties_loose(source, excluded);
|
|
101
|
-
var key, i;
|
|
102
|
-
if (Object.getOwnPropertySymbols) {
|
|
103
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
104
|
-
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
105
|
-
key = sourceSymbolKeys[i];
|
|
106
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
107
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
108
|
-
target[key] = source[key];
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
return target;
|
|
112
|
-
}
|
|
113
|
-
function _object_without_properties_loose(source, excluded) {
|
|
114
|
-
if (source == null) return {};
|
|
115
|
-
var target = {};
|
|
116
|
-
var sourceKeys = Object.keys(source);
|
|
117
|
-
var key, i;
|
|
118
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
119
|
-
key = sourceKeys[i];
|
|
120
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
121
|
-
target[key] = source[key];
|
|
122
|
-
}
|
|
123
|
-
return target;
|
|
124
|
-
}
|
|
125
|
-
function _sliced_to_array(arr, i) {
|
|
126
|
-
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
127
|
-
}
|
|
128
|
-
function _to_consumable_array(arr) {
|
|
129
|
-
return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
|
|
130
|
-
}
|
|
131
|
-
function _unsupported_iterable_to_array(o, minLen) {
|
|
132
|
-
if (!o) return;
|
|
133
|
-
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
134
|
-
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
135
|
-
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
136
|
-
if (n === "Map" || n === "Set") return Array.from(n);
|
|
137
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
138
|
-
}
|
|
139
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
140
3
|
import useEmblaCarousel from 'embla-carousel-react';
|
|
141
4
|
import { WheelGesturesPlugin } from 'embla-carousel-wheel-gestures';
|
|
@@ -145,31 +8,18 @@ import IconArrowForward from '../icons/IconArrowForward.js';
|
|
|
145
8
|
import { cn } from '../utils.js';
|
|
146
9
|
import VStack from '../vstack/VStack.js';
|
|
147
10
|
import { CarouselButton } from './CarouselButton.js';
|
|
148
|
-
|
|
11
|
+
const CarouselContext = React.createContext(null);
|
|
149
12
|
function useCarousel() {
|
|
150
|
-
|
|
13
|
+
const context = React.useContext(CarouselContext);
|
|
151
14
|
if (!context) {
|
|
152
15
|
throw new Error('useCarousel must be used within a <Carousel />');
|
|
153
16
|
}
|
|
154
17
|
return context;
|
|
155
18
|
}
|
|
156
|
-
export
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
"plugins",
|
|
161
|
-
"className",
|
|
162
|
-
"children",
|
|
163
|
-
"showButtons",
|
|
164
|
-
"useWheelGestures",
|
|
165
|
-
"isMobile",
|
|
166
|
-
"autoplay",
|
|
167
|
-
"autoplayInterval",
|
|
168
|
-
"forceSnap"
|
|
169
|
-
]);
|
|
170
|
-
var emblaPlugins = useWheelGestures ? [
|
|
171
|
-
WheelGesturesPlugin()
|
|
172
|
-
].concat(_to_consumable_array(plugins)) : plugins;
|
|
19
|
+
export const Carousel = React.forwardRef(({ opts, setApi, plugins = [], className, children, showButtons = false, useWheelGestures = false, isMobile = false, autoplay = false, autoplayInterval = 3000, forceSnap = false, ...props }, ref) => {
|
|
20
|
+
const emblaPlugins = useWheelGestures
|
|
21
|
+
? [WheelGesturesPlugin(), ...plugins]
|
|
22
|
+
: plugins;
|
|
173
23
|
// const [carouselRef, api] = useEmblaCarousel(
|
|
174
24
|
// {
|
|
175
25
|
// ...opts,
|
|
@@ -180,171 +30,98 @@ export var Carousel = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
|
|
|
180
30
|
// },
|
|
181
31
|
// emblaPlugins,
|
|
182
32
|
// )
|
|
183
|
-
|
|
33
|
+
const [carouselRef, api] = useEmblaCarousel({
|
|
34
|
+
...opts,
|
|
184
35
|
axis: 'x',
|
|
185
36
|
dragFree: forceSnap ? false : !isMobile,
|
|
186
37
|
containScroll: 'trimSnaps',
|
|
187
|
-
skipSnaps: forceSnap ? false : !isMobile
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
38
|
+
skipSnaps: forceSnap ? false : !isMobile,
|
|
39
|
+
}, emblaPlugins);
|
|
40
|
+
const [canScrollPrev, setCanScrollPrev] = React.useState(false);
|
|
41
|
+
const [canScrollNext, setCanScrollNext] = React.useState(false);
|
|
42
|
+
const [isPaused, setIsPaused] = React.useState(false);
|
|
43
|
+
const onSelect = React.useCallback((api) => {
|
|
193
44
|
if (!api) {
|
|
194
45
|
return;
|
|
195
46
|
}
|
|
196
47
|
setCanScrollPrev(api.canScrollPrev() && api.scrollProgress() !== 100);
|
|
197
48
|
setCanScrollNext(api.canScrollNext());
|
|
198
49
|
}, []);
|
|
199
|
-
|
|
50
|
+
const scrollPrev = React.useCallback(() => {
|
|
200
51
|
if (canScrollPrev) {
|
|
201
|
-
api
|
|
52
|
+
api?.scrollPrev();
|
|
202
53
|
}
|
|
203
|
-
}, [
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
]);
|
|
207
|
-
|
|
208
|
-
api === null || api === void 0 ? void 0 : api.scrollNext();
|
|
209
|
-
}, [
|
|
210
|
-
api
|
|
211
|
-
]);
|
|
212
|
-
React.useEffect(function() {
|
|
54
|
+
}, [api, canScrollPrev]);
|
|
55
|
+
const scrollNext = React.useCallback(() => {
|
|
56
|
+
api?.scrollNext();
|
|
57
|
+
}, [api]);
|
|
58
|
+
React.useEffect(() => {
|
|
213
59
|
if (!api || !setApi) {
|
|
214
60
|
return;
|
|
215
61
|
}
|
|
216
62
|
setApi(api);
|
|
217
|
-
}, [
|
|
218
|
-
|
|
219
|
-
setApi
|
|
220
|
-
]);
|
|
221
|
-
React.useEffect(function() {
|
|
63
|
+
}, [api, setApi]);
|
|
64
|
+
React.useEffect(() => {
|
|
222
65
|
if (!api) {
|
|
223
66
|
return;
|
|
224
67
|
}
|
|
225
68
|
onSelect(api);
|
|
226
69
|
api.on('reInit', onSelect);
|
|
227
70
|
api.on('select', onSelect);
|
|
228
|
-
return
|
|
229
|
-
api
|
|
71
|
+
return () => {
|
|
72
|
+
api?.off('select', onSelect);
|
|
230
73
|
};
|
|
231
|
-
}, [
|
|
232
|
-
|
|
233
|
-
onSelect
|
|
234
|
-
]);
|
|
235
|
-
React.useEffect(function() {
|
|
74
|
+
}, [api, onSelect]);
|
|
75
|
+
React.useEffect(() => {
|
|
236
76
|
if (!autoplay || !api || isPaused) {
|
|
237
77
|
return;
|
|
238
78
|
}
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
79
|
+
const intervalId = setInterval(() => {
|
|
80
|
+
const currentSlide = api.selectedScrollSnap();
|
|
81
|
+
const totalSlides = api.scrollSnapList().length;
|
|
242
82
|
if (currentSlide >= totalSlides - 1) {
|
|
243
83
|
api.scrollTo(0);
|
|
244
|
-
}
|
|
84
|
+
}
|
|
85
|
+
else {
|
|
245
86
|
api.scrollNext();
|
|
246
87
|
}
|
|
247
88
|
}, autoplayInterval);
|
|
248
|
-
return
|
|
89
|
+
return () => {
|
|
249
90
|
clearInterval(intervalId);
|
|
250
91
|
};
|
|
251
|
-
}, [
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
autoplayInterval,
|
|
255
|
-
isPaused
|
|
256
|
-
]);
|
|
257
|
-
return /*#__PURE__*/ _jsx(CarouselContext.Provider, {
|
|
258
|
-
value: {
|
|
259
|
-
carouselRef: carouselRef,
|
|
92
|
+
}, [autoplay, api, autoplayInterval, isPaused]);
|
|
93
|
+
return (_jsx(CarouselContext.Provider, { value: {
|
|
94
|
+
carouselRef,
|
|
260
95
|
api: api,
|
|
261
|
-
opts
|
|
262
|
-
scrollPrev
|
|
263
|
-
scrollNext
|
|
264
|
-
canScrollPrev
|
|
265
|
-
canScrollNext
|
|
266
|
-
autoplay
|
|
267
|
-
autoplayInterval
|
|
268
|
-
},
|
|
269
|
-
children: /*#__PURE__*/ _jsx("section", _object_spread_props(_object_spread({
|
|
270
|
-
ref: ref,
|
|
271
|
-
className: cn('w-full gap-8', className),
|
|
272
|
-
"aria-roledescription": "carousel",
|
|
273
|
-
onPointerDown: function() {
|
|
274
|
-
return setIsPaused(true);
|
|
275
|
-
},
|
|
276
|
-
onPointerUp: function() {
|
|
277
|
-
return setIsPaused(false);
|
|
278
|
-
},
|
|
279
|
-
onPointerLeave: function() {
|
|
280
|
-
return setIsPaused(false);
|
|
281
|
-
}
|
|
282
|
-
}, props), {
|
|
283
|
-
children: children
|
|
284
|
-
}))
|
|
285
|
-
});
|
|
96
|
+
opts,
|
|
97
|
+
scrollPrev,
|
|
98
|
+
scrollNext,
|
|
99
|
+
canScrollPrev,
|
|
100
|
+
canScrollNext,
|
|
101
|
+
autoplay,
|
|
102
|
+
autoplayInterval,
|
|
103
|
+
}, children: _jsx("section", { ref: ref, className: cn('w-full gap-8', className), "aria-roledescription": "carousel", onPointerDown: () => setIsPaused(true), onPointerUp: () => setIsPaused(false), onPointerLeave: () => setIsPaused(false), ...props, children: children }) }));
|
|
286
104
|
});
|
|
287
105
|
Carousel.displayName = 'Carousel';
|
|
288
|
-
export
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
]);
|
|
292
|
-
var carouselRef = useCarousel().carouselRef;
|
|
293
|
-
return /*#__PURE__*/ _jsx("div", {
|
|
294
|
-
ref: carouselRef,
|
|
295
|
-
className: "overflow-hidden w-full max-w-screen",
|
|
296
|
-
children: /*#__PURE__*/ _jsx("div", _object_spread({
|
|
297
|
-
ref: ref,
|
|
298
|
-
className: cn('flex', 'gap-4', className)
|
|
299
|
-
}, props))
|
|
300
|
-
});
|
|
106
|
+
export const CarouselContent = React.forwardRef(({ className, ...props }, ref) => {
|
|
107
|
+
const { carouselRef } = useCarousel();
|
|
108
|
+
return (_jsx("div", { ref: carouselRef, className: "overflow-hidden w-full max-w-screen", children: _jsx("div", { ref: ref, className: cn('flex', 'gap-4', className), ...props }) }));
|
|
301
109
|
});
|
|
302
110
|
CarouselContent.displayName = 'CarouselContent';
|
|
303
|
-
export
|
|
304
|
-
|
|
305
|
-
"className"
|
|
306
|
-
]);
|
|
307
|
-
return /*#__PURE__*/ _jsx(VStack, _object_spread({
|
|
308
|
-
ref: ref,
|
|
309
|
-
role: "group",
|
|
310
|
-
"aria-roledescription": "slide",
|
|
311
|
-
className: cn('min-w-0 shrink-0 grow-0 ', 'text-center justify-center', className)
|
|
312
|
-
}, props));
|
|
111
|
+
export const CarouselItem = React.forwardRef(({ className, ...props }, ref) => {
|
|
112
|
+
return (_jsx(VStack, { ref: ref, role: "group", "aria-roledescription": "slide", className: cn('min-w-0 shrink-0 grow-0 ', 'text-center justify-center', className), ...props }));
|
|
313
113
|
});
|
|
314
114
|
CarouselItem.displayName = 'CarouselItem';
|
|
315
|
-
export
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
]);
|
|
320
|
-
var _useCarousel = useCarousel(), scrollPrev = _useCarousel.scrollPrev, canScrollPrev = _useCarousel.canScrollPrev;
|
|
321
|
-
return /*#__PURE__*/ _jsx(CarouselButton, _object_spread_props(_object_spread({
|
|
322
|
-
ref: ref,
|
|
323
|
-
className: cn('absolute h-8 w-8 flex items-center justify-center left-20 top-1/2 -translate-y-1/2 z-10', 'md:left-10', className),
|
|
324
|
-
disabled: !canScrollPrev,
|
|
325
|
-
onClick: scrollPrev
|
|
326
|
-
}, props), {
|
|
327
|
-
children: /*#__PURE__*/ _jsx(IconArrowBack, {
|
|
328
|
-
size: iconSize
|
|
329
|
-
})
|
|
330
|
-
}));
|
|
115
|
+
export const CarouselPrevious = React.forwardRef(({ iconSize = 32, className, ...props }, ref) => {
|
|
116
|
+
const { scrollPrev, canScrollPrev } = useCarousel();
|
|
117
|
+
return (_jsx(CarouselButton, { ref: ref, className: cn('absolute h-8 w-8 flex items-center justify-center left-20 top-1/2 -translate-y-1/2 z-10', // Adjusted for smaller screens
|
|
118
|
+
'md:left-10', className), disabled: !canScrollPrev, onClick: scrollPrev, ...props, children: _jsx(IconArrowBack, { size: iconSize }) }));
|
|
331
119
|
});
|
|
332
120
|
CarouselPrevious.displayName = 'CarouselPrevious';
|
|
333
|
-
export
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
]);
|
|
338
|
-
var _useCarousel = useCarousel(), scrollNext = _useCarousel.scrollNext, canScrollNext = _useCarousel.canScrollNext;
|
|
339
|
-
return /*#__PURE__*/ _jsx(CarouselButton, _object_spread_props(_object_spread({
|
|
340
|
-
ref: ref,
|
|
341
|
-
className: cn('absolute h-8 w-8 flex items-center justify-center right-20 top-1/2 -translate-y-1/2 z-10', 'md:right-10', className),
|
|
342
|
-
disabled: !canScrollNext,
|
|
343
|
-
onClick: scrollNext
|
|
344
|
-
}, props), {
|
|
345
|
-
children: /*#__PURE__*/ _jsx(IconArrowForward, {
|
|
346
|
-
size: iconSize
|
|
347
|
-
})
|
|
348
|
-
}));
|
|
121
|
+
export const CarouselNext = React.forwardRef(({ iconSize = 32, className, ...props }, ref) => {
|
|
122
|
+
const { scrollNext, canScrollNext } = useCarousel();
|
|
123
|
+
return (_jsx(CarouselButton, { ref: ref, className: cn('absolute h-8 w-8 flex items-center justify-center right-20 top-1/2 -translate-y-1/2 z-10', // Adjusted for smaller screens
|
|
124
|
+
'md:right-10', className), disabled: !canScrollNext, onClick: scrollNext, ...props, children: _jsx(IconArrowForward, { size: iconSize }) }));
|
|
349
125
|
});
|
|
350
126
|
CarouselNext.displayName = 'CarouselNext';
|
|
127
|
+
//# sourceMappingURL=Carousel.js.map
|
|
@@ -1,46 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Box from '../box/Box';
|
|
3
3
|
import { Carousel, CarouselContent, CarouselItem } from './Carousel';
|
|
4
|
-
|
|
4
|
+
const meta = {
|
|
5
5
|
title: ' Carousel',
|
|
6
|
-
component: Carousel
|
|
6
|
+
component: Carousel,
|
|
7
7
|
};
|
|
8
8
|
export default meta;
|
|
9
|
-
export
|
|
10
|
-
render:
|
|
11
|
-
return
|
|
12
|
-
|
|
13
|
-
children: /*#__PURE__*/ _jsx(Carousel, {
|
|
14
|
-
showButtons: true,
|
|
15
|
-
children: /*#__PURE__*/ _jsxs(CarouselContent, {
|
|
16
|
-
children: [
|
|
17
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
18
|
-
className: "border p-10 items-center border-success4",
|
|
19
|
-
children: "first item"
|
|
20
|
-
}),
|
|
21
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
22
|
-
className: "border p-10 items-center border-success4",
|
|
23
|
-
children: "second item"
|
|
24
|
-
}),
|
|
25
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
26
|
-
className: "border p-10 items-center border-success4",
|
|
27
|
-
children: "third item"
|
|
28
|
-
}),
|
|
29
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
30
|
-
className: "border p-10 items-center border-success4",
|
|
31
|
-
children: "fourth item"
|
|
32
|
-
}),
|
|
33
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
34
|
-
className: "border p-10 items-center border-success4",
|
|
35
|
-
children: "fifth item"
|
|
36
|
-
}),
|
|
37
|
-
/*#__PURE__*/ _jsx(CarouselItem, {
|
|
38
|
-
className: "border p-10 items-center border-success4",
|
|
39
|
-
children: "sixth item"
|
|
40
|
-
})
|
|
41
|
-
]
|
|
42
|
-
})
|
|
43
|
-
})
|
|
44
|
-
});
|
|
45
|
-
}
|
|
9
|
+
export const FirstStory = {
|
|
10
|
+
render: () => {
|
|
11
|
+
return (_jsx(Box, { className: "p-10 border", children: _jsx(Carousel, { showButtons: true, children: _jsxs(CarouselContent, { children: [_jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "first item" }), _jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "second item" }), _jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "third item" }), _jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "fourth item" }), _jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "fifth item" }), _jsx(CarouselItem, { className: "border p-10 items-center border-success4", children: "sixth item" })] }) }) }));
|
|
12
|
+
},
|
|
46
13
|
};
|
|
14
|
+
//# sourceMappingURL=Carousel.stories.js.map
|
|
@@ -1,76 +1,15 @@
|
|
|
1
|
-
function _define_property(obj, key, value) {
|
|
2
|
-
if (key in obj) {
|
|
3
|
-
Object.defineProperty(obj, key, {
|
|
4
|
-
value: value,
|
|
5
|
-
enumerable: true,
|
|
6
|
-
configurable: true,
|
|
7
|
-
writable: true
|
|
8
|
-
});
|
|
9
|
-
} else {
|
|
10
|
-
obj[key] = value;
|
|
11
|
-
}
|
|
12
|
-
return obj;
|
|
13
|
-
}
|
|
14
|
-
function _object_spread(target) {
|
|
15
|
-
for(var i = 1; i < arguments.length; i++){
|
|
16
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
-
var ownKeys = Object.keys(source);
|
|
18
|
-
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
-
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
-
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
-
}));
|
|
22
|
-
}
|
|
23
|
-
ownKeys.forEach(function(key) {
|
|
24
|
-
_define_property(target, key, source[key]);
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
return target;
|
|
28
|
-
}
|
|
29
|
-
function _object_without_properties(source, excluded) {
|
|
30
|
-
if (source == null) return {};
|
|
31
|
-
var target = _object_without_properties_loose(source, excluded);
|
|
32
|
-
var key, i;
|
|
33
|
-
if (Object.getOwnPropertySymbols) {
|
|
34
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
35
|
-
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
36
|
-
key = sourceSymbolKeys[i];
|
|
37
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
39
|
-
target[key] = source[key];
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
return target;
|
|
43
|
-
}
|
|
44
|
-
function _object_without_properties_loose(source, excluded) {
|
|
45
|
-
if (source == null) return {};
|
|
46
|
-
var target = {};
|
|
47
|
-
var sourceKeys = Object.keys(source);
|
|
48
|
-
var key, i;
|
|
49
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
50
|
-
key = sourceKeys[i];
|
|
51
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
52
|
-
target[key] = source[key];
|
|
53
|
-
}
|
|
54
|
-
return target;
|
|
55
|
-
}
|
|
56
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
57
2
|
import { Slot } from '@radix-ui/react-slot';
|
|
58
3
|
import { cva } from 'class-variance-authority';
|
|
59
4
|
import * as React from 'react';
|
|
60
5
|
import { cn } from '../utils.js';
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
var Comp = asChild ? Slot : 'button';
|
|
68
|
-
return /*#__PURE__*/ _jsx(Comp, _object_spread({
|
|
69
|
-
className: cn(carouselButtonVariants({
|
|
70
|
-
className: className
|
|
71
|
-
})),
|
|
72
|
-
ref: ref
|
|
73
|
-
}, props));
|
|
6
|
+
const carouselButtonVariants = cva(`inline-flex items-center justify-center whitespace-nowrap text-white font-medium disabled:pointer-events-none disabled:opacity-50
|
|
7
|
+
h-10 sm:h-9 lg:h-11
|
|
8
|
+
`);
|
|
9
|
+
const CarouselButton = React.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
10
|
+
const Comp = asChild ? Slot : 'button';
|
|
11
|
+
return (_jsx(Comp, { className: cn(carouselButtonVariants({ className })), ref: ref, ...props }));
|
|
74
12
|
});
|
|
75
13
|
CarouselButton.displayName = 'CarouselButton';
|
|
76
14
|
export { CarouselButton, carouselButtonVariants };
|
|
15
|
+
//# sourceMappingURL=CarouselButton.js.map
|
package/dist/center/Center.js
CHANGED
|
@@ -1,70 +1,10 @@
|
|
|
1
|
-
function _define_property(obj, key, value) {
|
|
2
|
-
if (key in obj) {
|
|
3
|
-
Object.defineProperty(obj, key, {
|
|
4
|
-
value: value,
|
|
5
|
-
enumerable: true,
|
|
6
|
-
configurable: true,
|
|
7
|
-
writable: true
|
|
8
|
-
});
|
|
9
|
-
} else {
|
|
10
|
-
obj[key] = value;
|
|
11
|
-
}
|
|
12
|
-
return obj;
|
|
13
|
-
}
|
|
14
|
-
function _object_spread(target) {
|
|
15
|
-
for(var i = 1; i < arguments.length; i++){
|
|
16
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
-
var ownKeys = Object.keys(source);
|
|
18
|
-
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
-
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
-
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
-
}));
|
|
22
|
-
}
|
|
23
|
-
ownKeys.forEach(function(key) {
|
|
24
|
-
_define_property(target, key, source[key]);
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
return target;
|
|
28
|
-
}
|
|
29
|
-
function _object_without_properties(source, excluded) {
|
|
30
|
-
if (source == null) return {};
|
|
31
|
-
var target = _object_without_properties_loose(source, excluded);
|
|
32
|
-
var key, i;
|
|
33
|
-
if (Object.getOwnPropertySymbols) {
|
|
34
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
35
|
-
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
36
|
-
key = sourceSymbolKeys[i];
|
|
37
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
39
|
-
target[key] = source[key];
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
return target;
|
|
43
|
-
}
|
|
44
|
-
function _object_without_properties_loose(source, excluded) {
|
|
45
|
-
if (source == null) return {};
|
|
46
|
-
var target = {};
|
|
47
|
-
var sourceKeys = Object.keys(source);
|
|
48
|
-
var key, i;
|
|
49
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
50
|
-
key = sourceKeys[i];
|
|
51
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
52
|
-
target[key] = source[key];
|
|
53
|
-
}
|
|
54
|
-
return target;
|
|
55
|
-
}
|
|
56
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
57
2
|
import * as React from 'react';
|
|
58
3
|
import Box from '../box/Box';
|
|
59
4
|
import { cn } from '../utils';
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
"className"
|
|
63
|
-
]);
|
|
64
|
-
return /*#__PURE__*/ _jsx(Box, _object_spread({
|
|
65
|
-
className: cn('flex gap-4 justify-center items-center', className),
|
|
66
|
-
ref: ref
|
|
67
|
-
}, props));
|
|
5
|
+
const Center = React.forwardRef(({ className, ...props }, ref) => {
|
|
6
|
+
return (_jsx(Box, { className: cn('flex gap-4 justify-center items-center', className), ref: ref, ...props }));
|
|
68
7
|
});
|
|
69
8
|
Center.displayName = 'Center';
|
|
70
9
|
export default Center;
|
|
10
|
+
//# sourceMappingURL=Center.js.map
|
|
@@ -1,25 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Box from '../box/Box.js';
|
|
3
3
|
import Center from './Center.js';
|
|
4
|
-
|
|
5
|
-
component: Center
|
|
4
|
+
const meta = {
|
|
5
|
+
component: Center,
|
|
6
6
|
};
|
|
7
7
|
export default meta;
|
|
8
|
-
export
|
|
9
|
-
render:
|
|
10
|
-
return
|
|
11
|
-
|
|
12
|
-
children: [
|
|
13
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
14
|
-
className: "h-16 w-16 border border-primary2"
|
|
15
|
-
}),
|
|
16
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
17
|
-
className: "h-16 w-16 border border-primary2"
|
|
18
|
-
}),
|
|
19
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
20
|
-
className: "h-16 w-16 border border-primary2"
|
|
21
|
-
})
|
|
22
|
-
]
|
|
23
|
-
});
|
|
24
|
-
}
|
|
8
|
+
export const FirstStory = {
|
|
9
|
+
render: () => {
|
|
10
|
+
return (_jsxs(Center, { className: "h-64 w-64 border border-black p-4", children: [_jsx(Box, { className: "h-16 w-16 border border-primary2" }), _jsx(Box, { className: "h-16 w-16 border border-primary2" }), _jsx(Box, { className: "h-16 w-16 border border-primary2" })] }));
|
|
11
|
+
},
|
|
25
12
|
};
|
|
13
|
+
//# sourceMappingURL=Center.stories.js.map
|