@consumidor-positivo/aurora 0.0.190 → 0.0.192
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/README.md +29 -0
- package/dist/{BadgeWhiteStrokeDefault-o7yeEPdK.js → BadgeWhiteStrokeDefault-DWfsp2x-.js} +117 -4
- package/dist/BadgeWhiteStrokeDefault-DWfsp2x-.js.map +1 -0
- package/dist/components/Card/Root/index.d.ts +3 -2
- package/dist/components/Carousel/index.es.js +467 -0
- package/dist/components/Carousel/index.es.js.map +1 -0
- package/dist/components/Carousel/styles.css +1 -0
- package/dist/components/Container/index.d.ts +7 -0
- package/dist/components/Container/index.es.js +3 -19
- package/dist/components/Container/index.es.js.map +1 -1
- package/dist/components/Container/styles.css +1 -0
- package/dist/components/Logo/ac/TertiaryWhite.d.ts +1 -0
- package/dist/components/Logo/index.d.ts +1 -0
- package/dist/components/Logo/index.es.js +6 -5
- package/dist/components/Prototype/Carousel/Pagination.d.ts +7 -0
- package/dist/components/Prototype/Carousel/Scrollbar.d.ts +6 -0
- package/dist/components/Prototype/Carousel/helpers.d.ts +1 -0
- package/dist/components/Prototype/Carousel/index.d.ts +3 -0
- package/dist/components/Prototype/Carousel/types.d.ts +7 -0
- package/dist/components/Prototype/Carousel/useCarouselDrag.d.ts +9 -0
- package/dist/main.d.ts +2 -0
- package/dist/main.es.js +35 -10
- package/dist/main.es.js.map +1 -1
- package/package.json +4 -2
- package/dist/BadgeWhiteStrokeDefault-o7yeEPdK.js.map +0 -1
|
@@ -0,0 +1,467 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
+
import { useRef, useEffect, useState, useCallback, useMemo, useLayoutEffect } from "react";
|
|
4
|
+
import { Conditional } from "../Conditional/index.es.js";
|
|
5
|
+
import { Text } from "../Text/index.es.js";
|
|
6
|
+
import { Button } from "../Button/index.es.js";
|
|
7
|
+
import "../Icon/index.es.js";
|
|
8
|
+
import { IconChevronLeft } from "../icons/IconChevronLeft/index.es.js";
|
|
9
|
+
import { IconChevronRight } from "../icons/IconChevronRight/index.es.js";
|
|
10
|
+
import './styles.css';const Scrollbar = ({ pageToEnterIndex, pages }) => {
|
|
11
|
+
const scrollTrail = useRef(null);
|
|
12
|
+
const scrollbar = useRef(null);
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
if (!scrollTrail.current || !scrollbar.current) return;
|
|
15
|
+
const trailSize = scrollTrail.current.offsetWidth;
|
|
16
|
+
const barSize = scrollbar.current.offsetWidth;
|
|
17
|
+
const availableScrollSpace = trailSize - barSize;
|
|
18
|
+
const currentPercentage = (pageToEnterIndex + 1) / pages.length;
|
|
19
|
+
const scrollDistance = currentPercentage * availableScrollSpace;
|
|
20
|
+
const barTranslate = pageToEnterIndex === 0 ? 0 : scrollDistance;
|
|
21
|
+
scrollbar.current.style.transform = `translateX(${barTranslate}px)`;
|
|
22
|
+
}, [pages, pageToEnterIndex]);
|
|
23
|
+
return /* @__PURE__ */ jsx("div", { className: "au-carousel__scrollbar", ref: scrollTrail, children: /* @__PURE__ */ jsx("div", { className: "au-carousel__scrollbar-scroll", ref: scrollbar }) });
|
|
24
|
+
};
|
|
25
|
+
const isClient = () => !!(typeof window !== "undefined" && window.document && window.document.createElement);
|
|
26
|
+
function isMobile() {
|
|
27
|
+
if (!isClient()) return;
|
|
28
|
+
return !!window.matchMedia("screen and (max-width:767px)").matches;
|
|
29
|
+
}
|
|
30
|
+
const Pagination = ({
|
|
31
|
+
pageToEnterIndex,
|
|
32
|
+
pages,
|
|
33
|
+
mobileText
|
|
34
|
+
}) => {
|
|
35
|
+
return /* @__PURE__ */ jsx("div", { className: "au-carousel__pagination", children: /* @__PURE__ */ jsxs(Text, { color: "secondary", weight: "regular", children: [
|
|
36
|
+
/* @__PURE__ */ jsx(
|
|
37
|
+
Conditional,
|
|
38
|
+
{
|
|
39
|
+
condition: !isMobile(),
|
|
40
|
+
renderIf: "Página",
|
|
41
|
+
renderElse: mobileText
|
|
42
|
+
}
|
|
43
|
+
),
|
|
44
|
+
" ",
|
|
45
|
+
/* @__PURE__ */ jsxs("b", { children: [
|
|
46
|
+
pageToEnterIndex + 1,
|
|
47
|
+
" de ",
|
|
48
|
+
pages.length
|
|
49
|
+
] })
|
|
50
|
+
] }) });
|
|
51
|
+
};
|
|
52
|
+
var useIsomorphicLayoutEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect;
|
|
53
|
+
var useSnapCarousel = ({
|
|
54
|
+
axis = "x",
|
|
55
|
+
initialPages = []
|
|
56
|
+
} = {}) => {
|
|
57
|
+
const dimension = axis === "x" ? "width" : "height";
|
|
58
|
+
const scrollDimension = axis === "x" ? "scrollWidth" : "scrollHeight";
|
|
59
|
+
const clientDimension = axis === "x" ? "clientWidth" : "clientHeight";
|
|
60
|
+
const nearSidePos = axis === "x" ? "left" : "top";
|
|
61
|
+
const farSidePos = axis === "x" ? "right" : "bottom";
|
|
62
|
+
const scrollPos = axis === "x" ? "scrollLeft" : "scrollTop";
|
|
63
|
+
const [scrollEl, setScrollEl] = useState(null);
|
|
64
|
+
const [{ pages, activePageIndex }, setCarouselState] = useState({
|
|
65
|
+
pages: initialPages,
|
|
66
|
+
activePageIndex: 0
|
|
67
|
+
});
|
|
68
|
+
const refreshActivePage = useCallback(
|
|
69
|
+
(pages2) => {
|
|
70
|
+
if (!scrollEl) {
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
73
|
+
const hasScrolledToEnd = Math.floor(scrollEl[scrollDimension] - scrollEl[scrollPos]) <= scrollEl[clientDimension];
|
|
74
|
+
if (hasScrolledToEnd) {
|
|
75
|
+
setCarouselState({ pages: pages2, activePageIndex: pages2.length - 1 });
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
const items = Array.from(scrollEl.children);
|
|
79
|
+
const scrollPort = scrollEl.getBoundingClientRect();
|
|
80
|
+
const offsets = pages2.map((page) => {
|
|
81
|
+
const leadIndex = page[0];
|
|
82
|
+
const leadEl = items[leadIndex];
|
|
83
|
+
assert(leadEl instanceof HTMLElement, "Expected HTMLElement");
|
|
84
|
+
const scrollSpacing = getEffectiveScrollSpacing(
|
|
85
|
+
scrollEl,
|
|
86
|
+
leadEl,
|
|
87
|
+
nearSidePos
|
|
88
|
+
);
|
|
89
|
+
const rect = leadEl.getBoundingClientRect();
|
|
90
|
+
const offset = rect[nearSidePos] - scrollPort[nearSidePos] - scrollSpacing;
|
|
91
|
+
return Math.abs(offset);
|
|
92
|
+
});
|
|
93
|
+
const minOffset = Math.min(...offsets);
|
|
94
|
+
const nextActivePageIndex = offsets.indexOf(minOffset);
|
|
95
|
+
setCarouselState({ pages: pages2, activePageIndex: nextActivePageIndex });
|
|
96
|
+
},
|
|
97
|
+
[scrollEl, clientDimension, nearSidePos, scrollDimension, scrollPos]
|
|
98
|
+
);
|
|
99
|
+
const refresh = useCallback(() => {
|
|
100
|
+
if (!scrollEl) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
const items = Array.from(scrollEl.children);
|
|
104
|
+
const scrollPort = scrollEl.getBoundingClientRect();
|
|
105
|
+
let currPageStartPos;
|
|
106
|
+
const pages2 = items.reduce((acc, item, i) => {
|
|
107
|
+
assert(item instanceof HTMLElement, "Expected HTMLElement");
|
|
108
|
+
const currPage = acc[acc.length - 1];
|
|
109
|
+
const rect = getOffsetRect(item, item.parentElement);
|
|
110
|
+
if (!currPage || item.dataset.shouldSnap === "true" || rect[farSidePos] - currPageStartPos > Math.ceil(scrollPort[dimension])) {
|
|
111
|
+
acc.push([i]);
|
|
112
|
+
const scrollSpacing = getEffectiveScrollSpacing(
|
|
113
|
+
scrollEl,
|
|
114
|
+
item,
|
|
115
|
+
nearSidePos
|
|
116
|
+
);
|
|
117
|
+
currPageStartPos = rect[nearSidePos] - scrollSpacing;
|
|
118
|
+
} else {
|
|
119
|
+
currPage.push(i);
|
|
120
|
+
}
|
|
121
|
+
return acc;
|
|
122
|
+
}, []);
|
|
123
|
+
refreshActivePage(pages2);
|
|
124
|
+
}, [refreshActivePage, scrollEl, dimension, farSidePos, nearSidePos]);
|
|
125
|
+
useIsomorphicLayoutEffect(() => {
|
|
126
|
+
refresh();
|
|
127
|
+
}, [refresh]);
|
|
128
|
+
useEffect(() => {
|
|
129
|
+
const handle = () => {
|
|
130
|
+
refresh();
|
|
131
|
+
};
|
|
132
|
+
window.addEventListener("resize", handle);
|
|
133
|
+
window.addEventListener("orientationchange", handle);
|
|
134
|
+
return () => {
|
|
135
|
+
window.removeEventListener("resize", handle);
|
|
136
|
+
window.removeEventListener("orientationchange", handle);
|
|
137
|
+
};
|
|
138
|
+
}, [refresh]);
|
|
139
|
+
useEffect(() => {
|
|
140
|
+
if (!scrollEl) {
|
|
141
|
+
return;
|
|
142
|
+
}
|
|
143
|
+
const handle = () => {
|
|
144
|
+
refreshActivePage(pages);
|
|
145
|
+
};
|
|
146
|
+
scrollEl.addEventListener("scroll", handle);
|
|
147
|
+
return () => {
|
|
148
|
+
scrollEl.removeEventListener("scroll", handle);
|
|
149
|
+
};
|
|
150
|
+
}, [refreshActivePage, pages, scrollEl]);
|
|
151
|
+
const handleGoTo = (index, opts) => {
|
|
152
|
+
if (!scrollEl) {
|
|
153
|
+
return;
|
|
154
|
+
}
|
|
155
|
+
const page = pages[index];
|
|
156
|
+
if (!page) {
|
|
157
|
+
return;
|
|
158
|
+
}
|
|
159
|
+
const items = Array.from(scrollEl.children);
|
|
160
|
+
const leadIndex = page[0];
|
|
161
|
+
const leadEl = items[leadIndex];
|
|
162
|
+
if (!(leadEl instanceof HTMLElement)) {
|
|
163
|
+
return;
|
|
164
|
+
}
|
|
165
|
+
const scrollSpacing = getEffectiveScrollSpacing(
|
|
166
|
+
scrollEl,
|
|
167
|
+
leadEl,
|
|
168
|
+
nearSidePos
|
|
169
|
+
);
|
|
170
|
+
const behavior = (opts == null ? void 0 : opts.behavior) || "smooth";
|
|
171
|
+
scrollEl.scrollTo({
|
|
172
|
+
behavior,
|
|
173
|
+
[nearSidePos]: getOffsetRect(leadEl, leadEl.parentElement)[nearSidePos] - scrollSpacing
|
|
174
|
+
});
|
|
175
|
+
};
|
|
176
|
+
const handlePrev = (opts) => {
|
|
177
|
+
handleGoTo(activePageIndex - 1, opts);
|
|
178
|
+
};
|
|
179
|
+
const handleNext = (opts) => {
|
|
180
|
+
handleGoTo(activePageIndex + 1, opts);
|
|
181
|
+
};
|
|
182
|
+
const snapPointIndexes = useMemo(
|
|
183
|
+
() => new Set(pages.map((page) => page[0])),
|
|
184
|
+
[pages]
|
|
185
|
+
);
|
|
186
|
+
const hasPrevPage = activePageIndex > 0;
|
|
187
|
+
const hasNextPage = activePageIndex < pages.length - 1;
|
|
188
|
+
return {
|
|
189
|
+
hasPrevPage,
|
|
190
|
+
hasNextPage,
|
|
191
|
+
prev: handlePrev,
|
|
192
|
+
next: handleNext,
|
|
193
|
+
goTo: handleGoTo,
|
|
194
|
+
refresh,
|
|
195
|
+
pages,
|
|
196
|
+
activePageIndex,
|
|
197
|
+
snapPointIndexes,
|
|
198
|
+
scrollRef: setScrollEl
|
|
199
|
+
};
|
|
200
|
+
};
|
|
201
|
+
var getOffsetRect = (el, relativeTo) => {
|
|
202
|
+
const rect = _getOffsetRect(el);
|
|
203
|
+
if (!relativeTo) {
|
|
204
|
+
return rect;
|
|
205
|
+
}
|
|
206
|
+
const relativeRect = _getOffsetRect(relativeTo);
|
|
207
|
+
return {
|
|
208
|
+
left: rect.left - relativeRect.left,
|
|
209
|
+
top: rect.top - relativeRect.top,
|
|
210
|
+
right: rect.right - relativeRect.left,
|
|
211
|
+
bottom: rect.bottom - relativeRect.top,
|
|
212
|
+
width: rect.width,
|
|
213
|
+
height: rect.height
|
|
214
|
+
};
|
|
215
|
+
};
|
|
216
|
+
var _getOffsetRect = (el) => {
|
|
217
|
+
const rect = el.getBoundingClientRect();
|
|
218
|
+
let scrollLeft = 0;
|
|
219
|
+
let scrollTop = 0;
|
|
220
|
+
let parentEl = el.parentElement;
|
|
221
|
+
while (parentEl) {
|
|
222
|
+
scrollLeft += parentEl.scrollLeft;
|
|
223
|
+
scrollTop += parentEl.scrollTop;
|
|
224
|
+
parentEl = parentEl.parentElement;
|
|
225
|
+
}
|
|
226
|
+
const left = rect.left + scrollLeft;
|
|
227
|
+
const top = rect.top + scrollTop;
|
|
228
|
+
return {
|
|
229
|
+
left,
|
|
230
|
+
top,
|
|
231
|
+
right: left + rect.width,
|
|
232
|
+
bottom: top + rect.height,
|
|
233
|
+
width: rect.width,
|
|
234
|
+
height: rect.height
|
|
235
|
+
};
|
|
236
|
+
};
|
|
237
|
+
var getScrollPaddingUsedValue = (el, pos) => {
|
|
238
|
+
const style = window.getComputedStyle(el);
|
|
239
|
+
const scrollPadding = style.getPropertyValue(`scroll-padding-${pos}`) || "0px";
|
|
240
|
+
if (scrollPadding === "auto") {
|
|
241
|
+
return 0;
|
|
242
|
+
}
|
|
243
|
+
const invalidMsg = `Unsupported scroll padding value, expected <length> or <percentage> value, received ${scrollPadding}`;
|
|
244
|
+
if (scrollPadding.endsWith("px")) {
|
|
245
|
+
const value = parseInt(scrollPadding);
|
|
246
|
+
assert(!Number.isNaN(value), invalidMsg);
|
|
247
|
+
return value;
|
|
248
|
+
}
|
|
249
|
+
if (scrollPadding.endsWith("%")) {
|
|
250
|
+
const value = parseInt(scrollPadding);
|
|
251
|
+
assert(!Number.isNaN(value), invalidMsg);
|
|
252
|
+
return el.clientWidth / 100 * value;
|
|
253
|
+
}
|
|
254
|
+
throw new RSCError(invalidMsg);
|
|
255
|
+
};
|
|
256
|
+
var getScrollMarginUsedValue = (el, pos) => {
|
|
257
|
+
const style = window.getComputedStyle(el);
|
|
258
|
+
const scrollMargin = style.getPropertyValue(`scroll-margin-${pos}`) || "0px";
|
|
259
|
+
const invalidMsg = `Unsupported scroll margin value, expected <length> value, received ${scrollMargin}`;
|
|
260
|
+
assert(scrollMargin.endsWith("px"), invalidMsg);
|
|
261
|
+
const value = parseInt(scrollMargin);
|
|
262
|
+
assert(!Number.isNaN(value), invalidMsg);
|
|
263
|
+
return value;
|
|
264
|
+
};
|
|
265
|
+
var getEffectiveScrollSpacing = (scrollEl, itemEl, pos) => {
|
|
266
|
+
const scrollPadding = getScrollPaddingUsedValue(scrollEl, pos);
|
|
267
|
+
const scrollMargin = getScrollMarginUsedValue(itemEl, pos);
|
|
268
|
+
const rect = getOffsetRect(itemEl, itemEl.parentElement);
|
|
269
|
+
return Math.min(scrollPadding + scrollMargin, rect[pos]);
|
|
270
|
+
};
|
|
271
|
+
function assert(value, message) {
|
|
272
|
+
if (value) {
|
|
273
|
+
return;
|
|
274
|
+
}
|
|
275
|
+
throw new RSCError(message);
|
|
276
|
+
}
|
|
277
|
+
var RSCError = class extends Error {
|
|
278
|
+
constructor(message) {
|
|
279
|
+
super(`[react-snap-carousel]: ${message}`);
|
|
280
|
+
}
|
|
281
|
+
};
|
|
282
|
+
function useCarouselDrag({ goPrevious, goNext }) {
|
|
283
|
+
const [isPressing, setIsPressing] = useState(false);
|
|
284
|
+
const [dragStartPosition, setDragStartPosition] = useState(0);
|
|
285
|
+
function handleStartDrag(e) {
|
|
286
|
+
if (isMobile()) return;
|
|
287
|
+
setIsPressing(true);
|
|
288
|
+
document.addEventListener("mouseup", handleRelease);
|
|
289
|
+
setDragStartPosition(e.clientX);
|
|
290
|
+
}
|
|
291
|
+
function handleRelease() {
|
|
292
|
+
document.removeEventListener("mouseup", handleRelease);
|
|
293
|
+
setIsPressing(false);
|
|
294
|
+
setDragStartPosition(0);
|
|
295
|
+
}
|
|
296
|
+
function handleMouseMove(e) {
|
|
297
|
+
if (isMobile() || !isMobile() && !isPressing) return;
|
|
298
|
+
const currentX = e.clientX;
|
|
299
|
+
if (currentX > dragStartPosition) {
|
|
300
|
+
goPrevious();
|
|
301
|
+
} else if (currentX < dragStartPosition) {
|
|
302
|
+
goNext();
|
|
303
|
+
}
|
|
304
|
+
}
|
|
305
|
+
return {
|
|
306
|
+
handleMouseMove,
|
|
307
|
+
handleStartDrag
|
|
308
|
+
};
|
|
309
|
+
}
|
|
310
|
+
function useCarousel({ items }) {
|
|
311
|
+
const {
|
|
312
|
+
scrollRef,
|
|
313
|
+
pages,
|
|
314
|
+
activePageIndex,
|
|
315
|
+
hasPrevPage,
|
|
316
|
+
hasNextPage,
|
|
317
|
+
prev,
|
|
318
|
+
next,
|
|
319
|
+
snapPointIndexes,
|
|
320
|
+
refresh
|
|
321
|
+
} = useSnapCarousel({ axis: "x" });
|
|
322
|
+
const showControls = snapPointIndexes.size > 1;
|
|
323
|
+
const [numberOfItems, setNumberOfItems] = useState(items.length);
|
|
324
|
+
const [nextPage, setNextPage] = useState(0);
|
|
325
|
+
const railRef = useRef(null);
|
|
326
|
+
const rootRef = useRef(null);
|
|
327
|
+
const { handleMouseMove, handleStartDrag } = useCarouselDrag({
|
|
328
|
+
goNext,
|
|
329
|
+
goPrevious
|
|
330
|
+
});
|
|
331
|
+
useEffect(() => {
|
|
332
|
+
if (items.length !== numberOfItems) {
|
|
333
|
+
refresh();
|
|
334
|
+
setNumberOfItems(items.length);
|
|
335
|
+
}
|
|
336
|
+
}, [items]);
|
|
337
|
+
function setRef(el) {
|
|
338
|
+
scrollRef(el);
|
|
339
|
+
railRef.current = el;
|
|
340
|
+
}
|
|
341
|
+
function goNext() {
|
|
342
|
+
const nextIndex = activePageIndex + 1;
|
|
343
|
+
setNextPage(nextIndex);
|
|
344
|
+
next();
|
|
345
|
+
}
|
|
346
|
+
function goPrevious() {
|
|
347
|
+
setNextPage(activePageIndex === 0 ? activePageIndex : activePageIndex - 1);
|
|
348
|
+
prev();
|
|
349
|
+
}
|
|
350
|
+
return {
|
|
351
|
+
rootRef,
|
|
352
|
+
setRef,
|
|
353
|
+
nextPage,
|
|
354
|
+
pages,
|
|
355
|
+
railRef,
|
|
356
|
+
hasPrevPage,
|
|
357
|
+
hasNextPage,
|
|
358
|
+
goPrevious,
|
|
359
|
+
next,
|
|
360
|
+
goNext,
|
|
361
|
+
snapPointIndexes,
|
|
362
|
+
activePageIndex,
|
|
363
|
+
handleMouseMove,
|
|
364
|
+
handleStartDrag,
|
|
365
|
+
showControls
|
|
366
|
+
};
|
|
367
|
+
}
|
|
368
|
+
const Carousel = ({
|
|
369
|
+
items,
|
|
370
|
+
type,
|
|
371
|
+
mobileText = "",
|
|
372
|
+
draggable = true
|
|
373
|
+
}) => {
|
|
374
|
+
const {
|
|
375
|
+
rootRef,
|
|
376
|
+
setRef,
|
|
377
|
+
snapPointIndexes,
|
|
378
|
+
activePageIndex,
|
|
379
|
+
pages,
|
|
380
|
+
hasPrevPage,
|
|
381
|
+
goPrevious,
|
|
382
|
+
hasNextPage,
|
|
383
|
+
goNext,
|
|
384
|
+
handleStartDrag,
|
|
385
|
+
handleMouseMove,
|
|
386
|
+
showControls
|
|
387
|
+
} = useCarousel({
|
|
388
|
+
items
|
|
389
|
+
});
|
|
390
|
+
const cl = classNames("au-carousel", { "au-carousel--draggable": draggable });
|
|
391
|
+
return /* @__PURE__ */ jsxs("div", { className: cl, ref: rootRef, children: [
|
|
392
|
+
/* @__PURE__ */ jsx(
|
|
393
|
+
"ul",
|
|
394
|
+
{
|
|
395
|
+
className: "au-carousel__rail",
|
|
396
|
+
ref: setRef,
|
|
397
|
+
onMouseDown: draggable ? handleStartDrag : void 0,
|
|
398
|
+
onMouseMove: draggable ? handleMouseMove : void 0,
|
|
399
|
+
children: items.map((item, i) => {
|
|
400
|
+
const key = `au-${item.key || i}`;
|
|
401
|
+
return /* @__PURE__ */ jsx(
|
|
402
|
+
"li",
|
|
403
|
+
{
|
|
404
|
+
className: classNames("au-carousel__item", {
|
|
405
|
+
"au-carousel__item--snap": snapPointIndexes.has(i)
|
|
406
|
+
}),
|
|
407
|
+
"data-key": key,
|
|
408
|
+
children: item
|
|
409
|
+
},
|
|
410
|
+
key
|
|
411
|
+
);
|
|
412
|
+
})
|
|
413
|
+
}
|
|
414
|
+
),
|
|
415
|
+
/* @__PURE__ */ jsx(
|
|
416
|
+
Conditional,
|
|
417
|
+
{
|
|
418
|
+
condition: showControls,
|
|
419
|
+
renderIf: /* @__PURE__ */ jsxs("div", { className: "au-carousel__actions", children: [
|
|
420
|
+
type === "scrollbar" && /* @__PURE__ */ jsx(Scrollbar, { pageToEnterIndex: activePageIndex, pages }),
|
|
421
|
+
type === "pages" && /* @__PURE__ */ jsx(
|
|
422
|
+
Pagination,
|
|
423
|
+
{
|
|
424
|
+
pageToEnterIndex: activePageIndex,
|
|
425
|
+
pages,
|
|
426
|
+
mobileText
|
|
427
|
+
}
|
|
428
|
+
),
|
|
429
|
+
/* @__PURE__ */ jsxs(
|
|
430
|
+
"div",
|
|
431
|
+
{
|
|
432
|
+
className: classNames("au-carousel__btns", {
|
|
433
|
+
"au-carousel__btns--pages": type === "pages"
|
|
434
|
+
}),
|
|
435
|
+
children: [
|
|
436
|
+
/* @__PURE__ */ jsx(
|
|
437
|
+
Button,
|
|
438
|
+
{
|
|
439
|
+
round: true,
|
|
440
|
+
type: "outlined",
|
|
441
|
+
disabled: !hasPrevPage,
|
|
442
|
+
onClick: goPrevious,
|
|
443
|
+
children: /* @__PURE__ */ jsx(IconChevronLeft, {})
|
|
444
|
+
}
|
|
445
|
+
),
|
|
446
|
+
/* @__PURE__ */ jsx(
|
|
447
|
+
Button,
|
|
448
|
+
{
|
|
449
|
+
round: true,
|
|
450
|
+
type: "outlined",
|
|
451
|
+
disabled: !hasNextPage,
|
|
452
|
+
onClick: goNext,
|
|
453
|
+
children: /* @__PURE__ */ jsx(IconChevronRight, {})
|
|
454
|
+
}
|
|
455
|
+
)
|
|
456
|
+
]
|
|
457
|
+
}
|
|
458
|
+
)
|
|
459
|
+
] })
|
|
460
|
+
}
|
|
461
|
+
)
|
|
462
|
+
] });
|
|
463
|
+
};
|
|
464
|
+
export {
|
|
465
|
+
Carousel
|
|
466
|
+
};
|
|
467
|
+
//# sourceMappingURL=index.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../../lib/components/Prototype/Carousel/Scrollbar.tsx","../../../lib/components/Prototype/Carousel/helpers.ts","../../../lib/components/Prototype/Carousel/Pagination.tsx","../../../node_modules/react-snap-carousel/dist/use-snap-carousel.mjs","../../../lib/components/Prototype/Carousel/useCarouselDrag.ts","../../../lib/components/Prototype/Carousel/useCarousel.ts","../../../lib/components/Prototype/Carousel/index.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\ntype ScrollbarProps = {\n pages: number[][];\n pageToEnterIndex: number;\n};\n\nexport const Scrollbar = ({ pageToEnterIndex, pages }: ScrollbarProps) => {\n const scrollTrail = useRef<HTMLDivElement>(null);\n const scrollbar = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!scrollTrail.current || !scrollbar.current) return;\n const trailSize = scrollTrail.current.offsetWidth;\n const barSize = scrollbar.current.offsetWidth;\n const availableScrollSpace = trailSize - barSize;\n\n const currentPercentage = (pageToEnterIndex + 1) / pages.length;\n const scrollDistance = currentPercentage * availableScrollSpace;\n\n const barTranslate = pageToEnterIndex === 0 ? 0 : scrollDistance;\n scrollbar.current.style.transform = `translateX(${barTranslate}px)`;\n }, [pages, pageToEnterIndex]);\n\n return (\n <div className=\"au-carousel__scrollbar\" ref={scrollTrail}>\n <div className=\"au-carousel__scrollbar-scroll\" ref={scrollbar}></div>\n </div>\n );\n};\n","//TODO remove\n\nconst isClient = () =>\n !!(\n typeof window !== 'undefined' &&\n window.document &&\n window.document.createElement\n )\n\nexport function isMobile() {\n if (!isClient()) return\n return !!window.matchMedia('screen and (max-width:767px)').matches\n}\n","import { Conditional } from '@components/misc'\nimport { isMobile } from './helpers'\nimport { Text } from '@components/Text'\n\ntype PaginationProps = {\n pages: number[][]\n pageToEnterIndex: number\n mobileText: string\n}\n\nexport const Pagination = ({\n pageToEnterIndex,\n pages,\n mobileText,\n}: PaginationProps) => {\n return (\n <div className=\"au-carousel__pagination\">\n <Text color=\"secondary\" weight=\"regular\">\n <Conditional\n condition={!isMobile()}\n renderIf={'Página'}\n renderElse={mobileText}\n />{' '}\n <b>\n {pageToEnterIndex + 1} de {pages.length}\n </b>\n </Text>\n </div>\n )\n}\n","// src/use-snap-carousel.tsx\nimport { useState, useCallback, useEffect as useEffect2, useMemo } from \"react\";\n\n// src/use-isomorphic-layout-effect.tsx\nimport { useEffect, useLayoutEffect } from \"react\";\nvar useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\n// src/use-snap-carousel.tsx\nvar useSnapCarousel = ({\n axis = \"x\",\n initialPages = []\n} = {}) => {\n const dimension = axis === \"x\" ? \"width\" : \"height\";\n const scrollDimension = axis === \"x\" ? \"scrollWidth\" : \"scrollHeight\";\n const clientDimension = axis === \"x\" ? \"clientWidth\" : \"clientHeight\";\n const nearSidePos = axis === \"x\" ? \"left\" : \"top\";\n const farSidePos = axis === \"x\" ? \"right\" : \"bottom\";\n const scrollPos = axis === \"x\" ? \"scrollLeft\" : \"scrollTop\";\n const [scrollEl, setScrollEl] = useState(null);\n const [{ pages, activePageIndex }, setCarouselState] = useState({\n pages: initialPages,\n activePageIndex: 0\n });\n const refreshActivePage = useCallback(\n (pages2) => {\n if (!scrollEl) {\n return;\n }\n const hasScrolledToEnd = Math.floor(scrollEl[scrollDimension] - scrollEl[scrollPos]) <= scrollEl[clientDimension];\n if (hasScrolledToEnd) {\n setCarouselState({ pages: pages2, activePageIndex: pages2.length - 1 });\n return;\n }\n const items = Array.from(scrollEl.children);\n const scrollPort = scrollEl.getBoundingClientRect();\n const offsets = pages2.map((page) => {\n const leadIndex = page[0];\n const leadEl = items[leadIndex];\n assert(leadEl instanceof HTMLElement, \"Expected HTMLElement\");\n const scrollSpacing = getEffectiveScrollSpacing(\n scrollEl,\n leadEl,\n nearSidePos\n );\n const rect = leadEl.getBoundingClientRect();\n const offset = rect[nearSidePos] - scrollPort[nearSidePos] - scrollSpacing;\n return Math.abs(offset);\n });\n const minOffset = Math.min(...offsets);\n const nextActivePageIndex = offsets.indexOf(minOffset);\n setCarouselState({ pages: pages2, activePageIndex: nextActivePageIndex });\n },\n [scrollEl, clientDimension, nearSidePos, scrollDimension, scrollPos]\n );\n const refresh = useCallback(() => {\n if (!scrollEl) {\n return;\n }\n const items = Array.from(scrollEl.children);\n const scrollPort = scrollEl.getBoundingClientRect();\n let currPageStartPos;\n const pages2 = items.reduce((acc, item, i) => {\n assert(item instanceof HTMLElement, \"Expected HTMLElement\");\n const currPage = acc[acc.length - 1];\n const rect = getOffsetRect(item, item.parentElement);\n if (!currPage || item.dataset.shouldSnap === \"true\" || rect[farSidePos] - currPageStartPos > Math.ceil(scrollPort[dimension])) {\n acc.push([i]);\n const scrollSpacing = getEffectiveScrollSpacing(\n scrollEl,\n item,\n nearSidePos\n );\n currPageStartPos = rect[nearSidePos] - scrollSpacing;\n } else {\n currPage.push(i);\n }\n return acc;\n }, []);\n refreshActivePage(pages2);\n }, [refreshActivePage, scrollEl, dimension, farSidePos, nearSidePos]);\n useIsomorphicLayoutEffect(() => {\n refresh();\n }, [refresh]);\n useEffect2(() => {\n const handle = () => {\n refresh();\n };\n window.addEventListener(\"resize\", handle);\n window.addEventListener(\"orientationchange\", handle);\n return () => {\n window.removeEventListener(\"resize\", handle);\n window.removeEventListener(\"orientationchange\", handle);\n };\n }, [refresh]);\n useEffect2(() => {\n if (!scrollEl) {\n return;\n }\n const handle = () => {\n refreshActivePage(pages);\n };\n scrollEl.addEventListener(\"scroll\", handle);\n return () => {\n scrollEl.removeEventListener(\"scroll\", handle);\n };\n }, [refreshActivePage, pages, scrollEl]);\n const handleGoTo = (index, opts) => {\n if (!scrollEl) {\n return;\n }\n const page = pages[index];\n if (!page) {\n return;\n }\n const items = Array.from(scrollEl.children);\n const leadIndex = page[0];\n const leadEl = items[leadIndex];\n if (!(leadEl instanceof HTMLElement)) {\n return;\n }\n const scrollSpacing = getEffectiveScrollSpacing(\n scrollEl,\n leadEl,\n nearSidePos\n );\n const behavior = (opts == null ? void 0 : opts.behavior) || \"smooth\";\n scrollEl.scrollTo({\n behavior,\n [nearSidePos]: getOffsetRect(leadEl, leadEl.parentElement)[nearSidePos] - scrollSpacing\n });\n };\n const handlePrev = (opts) => {\n handleGoTo(activePageIndex - 1, opts);\n };\n const handleNext = (opts) => {\n handleGoTo(activePageIndex + 1, opts);\n };\n const snapPointIndexes = useMemo(\n () => new Set(pages.map((page) => page[0])),\n [pages]\n );\n const hasPrevPage = activePageIndex > 0;\n const hasNextPage = activePageIndex < pages.length - 1;\n return {\n hasPrevPage,\n hasNextPage,\n prev: handlePrev,\n next: handleNext,\n goTo: handleGoTo,\n refresh,\n pages,\n activePageIndex,\n snapPointIndexes,\n scrollRef: setScrollEl\n };\n};\nvar getOffsetRect = (el, relativeTo) => {\n const rect = _getOffsetRect(el);\n if (!relativeTo) {\n return rect;\n }\n const relativeRect = _getOffsetRect(relativeTo);\n return {\n left: rect.left - relativeRect.left,\n top: rect.top - relativeRect.top,\n right: rect.right - relativeRect.left,\n bottom: rect.bottom - relativeRect.top,\n width: rect.width,\n height: rect.height\n };\n};\nvar _getOffsetRect = (el) => {\n const rect = el.getBoundingClientRect();\n let scrollLeft = 0;\n let scrollTop = 0;\n let parentEl = el.parentElement;\n while (parentEl) {\n scrollLeft += parentEl.scrollLeft;\n scrollTop += parentEl.scrollTop;\n parentEl = parentEl.parentElement;\n }\n const left = rect.left + scrollLeft;\n const top = rect.top + scrollTop;\n return {\n left,\n top,\n right: left + rect.width,\n bottom: top + rect.height,\n width: rect.width,\n height: rect.height\n };\n};\nvar getScrollPaddingUsedValue = (el, pos) => {\n const style = window.getComputedStyle(el);\n const scrollPadding = style.getPropertyValue(`scroll-padding-${pos}`) || \"0px\";\n if (scrollPadding === \"auto\") {\n return 0;\n }\n const invalidMsg = `Unsupported scroll padding value, expected <length> or <percentage> value, received ${scrollPadding}`;\n if (scrollPadding.endsWith(\"px\")) {\n const value = parseInt(scrollPadding);\n assert(!Number.isNaN(value), invalidMsg);\n return value;\n }\n if (scrollPadding.endsWith(\"%\")) {\n const value = parseInt(scrollPadding);\n assert(!Number.isNaN(value), invalidMsg);\n return el.clientWidth / 100 * value;\n }\n throw new RSCError(invalidMsg);\n};\nvar getScrollMarginUsedValue = (el, pos) => {\n const style = window.getComputedStyle(el);\n const scrollMargin = style.getPropertyValue(`scroll-margin-${pos}`) || \"0px\";\n const invalidMsg = `Unsupported scroll margin value, expected <length> value, received ${scrollMargin}`;\n assert(scrollMargin.endsWith(\"px\"), invalidMsg);\n const value = parseInt(scrollMargin);\n assert(!Number.isNaN(value), invalidMsg);\n return value;\n};\nvar getEffectiveScrollSpacing = (scrollEl, itemEl, pos) => {\n const scrollPadding = getScrollPaddingUsedValue(scrollEl, pos);\n const scrollMargin = getScrollMarginUsedValue(itemEl, pos);\n const rect = getOffsetRect(itemEl, itemEl.parentElement);\n return Math.min(scrollPadding + scrollMargin, rect[pos]);\n};\nfunction assert(value, message) {\n if (value) {\n return;\n }\n throw new RSCError(message);\n}\nvar RSCError = class extends Error {\n constructor(message) {\n super(`[react-snap-carousel]: ${message}`);\n }\n};\nexport {\n useSnapCarousel\n};\n","import { isMobile } from './helpers'\nimport { useState } from 'react'\n\ntype UseCarouselDragArgs = {\n goPrevious: () => void\n goNext: () => void\n}\n\nexport function useCarouselDrag({ goPrevious, goNext }: UseCarouselDragArgs) {\n const [isPressing, setIsPressing] = useState(false)\n const [dragStartPosition, setDragStartPosition] = useState(0)\n\n function handleStartDrag(e: React.MouseEvent<HTMLUListElement, MouseEvent>) {\n if (isMobile()) return\n setIsPressing(true)\n document.addEventListener('mouseup', handleRelease)\n setDragStartPosition(e.clientX)\n }\n\n function handleRelease() {\n document.removeEventListener('mouseup', handleRelease)\n setIsPressing(false)\n setDragStartPosition(0)\n }\n\n function handleMouseMove(e: React.MouseEvent<HTMLUListElement, MouseEvent>) {\n if (isMobile() || (!isMobile() && !isPressing)) return\n\n const currentX = e.clientX\n if (currentX > dragStartPosition) {\n goPrevious()\n } else if (currentX < dragStartPosition) {\n goNext()\n }\n }\n\n return {\n handleMouseMove,\n handleStartDrag,\n }\n}\n","import { useEffect, useRef, useState } from 'react'\nimport { useSnapCarousel } from 'react-snap-carousel'\nimport { useCarouselDrag } from './useCarouselDrag'\n\ntype UseCarouselArgs = {\n items: unknown[]\n}\n\nexport default function useCarousel({ items }: UseCarouselArgs) {\n const {\n scrollRef,\n pages,\n activePageIndex,\n hasPrevPage,\n hasNextPage,\n prev,\n next,\n snapPointIndexes,\n refresh,\n } = useSnapCarousel({ axis: 'x' })\n const showControls = snapPointIndexes.size > 1\n const [numberOfItems, setNumberOfItems] = useState(items.length)\n const [nextPage, setNextPage] = useState(0)\n const railRef = useRef<HTMLElement | null>(null)\n const rootRef = useRef<HTMLDivElement | null>(null)\n const { handleMouseMove, handleStartDrag } = useCarouselDrag({\n goNext,\n goPrevious,\n })\n\n useEffect(() => {\n if (items.length !== numberOfItems) {\n refresh()\n setNumberOfItems(items.length)\n }\n }, [items])\n\n function setRef(el: HTMLElement | null) {\n scrollRef(el)\n railRef.current = el\n }\n\n function goNext() {\n const nextIndex = activePageIndex + 1\n setNextPage(nextIndex)\n next()\n }\n\n function goPrevious() {\n setNextPage(activePageIndex === 0 ? activePageIndex : activePageIndex - 1)\n prev()\n }\n\n return {\n rootRef,\n setRef,\n nextPage,\n pages,\n railRef,\n hasPrevPage,\n hasNextPage,\n goPrevious,\n next,\n goNext,\n snapPointIndexes,\n activePageIndex,\n handleMouseMove,\n handleStartDrag,\n showControls,\n }\n}\n","/**\n * Carousel Component\n * \n * @requires react-snap-carousel\n * This component requires the 'react-snap-carousel' package to be installed.\n * Install it using: npm install react-snap-carousel\n */\n\nimport classNames from 'classnames'\nimport { Scrollbar } from './Scrollbar'\nimport { Pagination } from './Pagination'\nimport useCarousel from './useCarousel'\nimport { CarouselProps } from './types'\n\nimport { Button } from '@components/Button'\nimport { Conditional } from '@components/misc'\nimport { IconChevronLeft, IconChevronRight } from '@components/icons'\n\nimport './styles.scss'\n\nexport const Carousel = ({\n items,\n type,\n mobileText = '',\n draggable = true,\n}: CarouselProps) => {\n const {\n rootRef,\n setRef,\n snapPointIndexes,\n activePageIndex,\n pages,\n hasPrevPage,\n goPrevious,\n hasNextPage,\n goNext,\n handleStartDrag,\n handleMouseMove,\n showControls,\n } = useCarousel({\n items,\n })\n\n const cl = classNames('au-carousel', { 'au-carousel--draggable': draggable })\n return (\n <div className={cl} ref={rootRef}>\n <ul\n className=\"au-carousel__rail\"\n ref={setRef}\n onMouseDown={draggable ? handleStartDrag : undefined}\n onMouseMove={draggable ? handleMouseMove : undefined}>\n {items.map((item, i) => {\n const key = `au-${item.key || i}`\n return (\n <li\n className={classNames('au-carousel__item', {\n 'au-carousel__item--snap': snapPointIndexes.has(i),\n })}\n data-key={key}\n key={key}>\n {item}\n </li>\n )\n })}\n </ul>\n\n <Conditional\n condition={showControls}\n renderIf={\n <div className=\"au-carousel__actions\">\n {type === 'scrollbar' && (\n <Scrollbar pageToEnterIndex={activePageIndex} pages={pages} />\n )}\n\n {type === 'pages' && (\n <Pagination\n pageToEnterIndex={activePageIndex}\n pages={pages}\n mobileText={mobileText}\n />\n )}\n\n <div\n className={classNames('au-carousel__btns', {\n 'au-carousel__btns--pages': type === 'pages',\n })}>\n <Button\n round\n type=\"outlined\"\n disabled={!hasPrevPage}\n onClick={goPrevious}>\n <IconChevronLeft />\n </Button>\n <Button\n round\n type=\"outlined\"\n disabled={!hasNextPage}\n onClick={goNext}>\n <IconChevronRight />\n </Button>\n </div>\n </div>\n }\n />\n </div>\n )\n}\n"],"names":["useEffect2"],"mappings":"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","x_google_ignoreList":[3]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.au-carousel{overflow-x:hidden}.au-carousel--draggable .au-carousel__rail{cursor:grab}.au-carousel__rail{position:relative;display:flex;overflow:auto;scroll-snap-type:x mandatory;list-style-type:none}@media (max-width: 599px){.au-carousel__rail{width:calc(100% + 24px)}}.au-carousel__rail::-webkit-scrollbar{display:none}.au-carousel__item{flex-shrink:0;-webkit-user-select:none;user-select:none}.au-carousel__item--snap{scroll-snap-align:start}.au-carousel__actions{display:flex;align-items:center;justify-content:space-between;margin-top:32px;position:relative}@media (max-width: 599px){.au-carousel__actions{margin-top:24px}}.au-carousel__scrollbar{width:calc(100% - 114px);background:#e2e4e9;height:8px;border-radius:500px;flex-grow:0}.au-carousel__scrollbar-scroll{height:100%;width:272px;background-color:#0048db;-webkit-transition:-webkit-transform .5s ease-out;transition:transform .5s ease-out;border-radius:500px}@media (max-width: 599px){.au-carousel__pagination{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;width:fit-content;display:flex;align-items:center}}.au-carousel__btns{display:flex;gap:16px}@media (max-width: 599px){.au-carousel__btns--pages{width:100%;justify-content:space-between}}
|
|
@@ -1,25 +1,9 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
alignItems,
|
|
6
|
-
justifyContent,
|
|
7
|
-
gap,
|
|
8
|
-
width,
|
|
9
|
-
children
|
|
10
|
-
}) => {
|
|
11
|
-
const containerClasses = classNames("au-card__container", {
|
|
12
|
-
[`au-card__container--direction-${direction}`]: direction,
|
|
13
|
-
[`au-card__container--align-items-${alignItems}`]: alignItems,
|
|
14
|
-
[`au-card__container--justify-content-${justifyContent}`]: justifyContent
|
|
15
|
-
});
|
|
16
|
-
const containerStyle = {
|
|
17
|
-
gap: `${gap}px`,
|
|
18
|
-
width: `${width}px`
|
|
19
|
-
};
|
|
20
|
-
return /* @__PURE__ */ jsx("div", { style: containerStyle, className: containerClasses, children });
|
|
3
|
+
import './styles.css';const Container = ({ customClass, children }) => {
|
|
4
|
+
return /* @__PURE__ */ jsx("div", { className: classNames("au-container", { [`${customClass}`]: !!customClass }), children });
|
|
21
5
|
};
|
|
22
6
|
export {
|
|
23
|
-
|
|
7
|
+
Container
|
|
24
8
|
};
|
|
25
9
|
//# sourceMappingURL=index.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../../lib/components/
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../../lib/components/Container/index.tsx"],"sourcesContent":["import cn from 'classnames'\n\nimport './styles.scss'\n\ntype ContainerProps = {\n customClass?: string\n children: React.ReactNode\n}\n\nexport const Container = ({ customClass, children }: ContainerProps) => {\n return (\n <div className={cn('au-container', { [`${customClass}`]: !!customClass })}>\n {children}\n </div>\n )\n}\n"],"names":["cn"],"mappings":";;AASO,MAAM,YAAY,CAAC,EAAE,aAAa,eAA+B;AACtE,6BACG,OAAI,EAAA,WAAWA,WAAG,gBAAgB,EAAE,CAAC,GAAG,WAAW,EAAE,GAAG,CAAC,CAAC,YAAY,CAAC,GACrE,SACH,CAAA;AAEJ;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.au-container{width:100%;max-width:1232px;margin:0 auto;padding:0 24px}@media (min-width: 1024px){.au-container{padding:0 16px}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const LogoTertiaryWhiteAC: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -12,6 +12,7 @@ export { LogoPrimaryNegativeCP } from './cp/PrimaryNegative';
|
|
|
12
12
|
export { LogoPrimaryWhiteAC } from './ac/PrimaryWhite';
|
|
13
13
|
export { LogoPrimaryWhiteCP } from './cp/PrimaryWhite';
|
|
14
14
|
export { LogoTertiaryAC } from './ac/Tertiary';
|
|
15
|
+
export { LogoTertiaryWhiteAC } from './ac/TertiaryWhite';
|
|
15
16
|
export { LogoBadgeWhiteStrokeCP } from './cp/BadgeWhiteStroke';
|
|
16
17
|
export { LogoBadgeWhiteStrokeAC } from './ac/BadgeWhiteStroke';
|
|
17
18
|
export { LogoBadgeWhiteStrokeDefaultAC } from './ac/BadgeWhiteStrokeDefault';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { p, o, q, L, a, b, c, d, e, f, g, h, i, j, k, l, m, n } from "../../BadgeWhiteStrokeDefault-DWfsp2x-.js";
|
|
2
2
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
p as LogoBadgeWhiteStrokeAC,
|
|
4
|
+
o as LogoBadgeWhiteStrokeCP,
|
|
5
|
+
q as LogoBadgeWhiteStrokeDefaultAC,
|
|
6
6
|
L as LogoBadgetAC,
|
|
7
7
|
a as LogoBadgetCP,
|
|
8
8
|
b as LogoPrimaryAC,
|
|
@@ -16,6 +16,7 @@ export {
|
|
|
16
16
|
j as LogoPrimaryNegativeCP,
|
|
17
17
|
k as LogoPrimaryWhiteAC,
|
|
18
18
|
l as LogoPrimaryWhiteCP,
|
|
19
|
-
m as LogoTertiaryAC
|
|
19
|
+
m as LogoTertiaryAC,
|
|
20
|
+
n as LogoTertiaryWhiteAC
|
|
20
21
|
};
|
|
21
22
|
//# sourceMappingURL=index.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function isMobile(): boolean | undefined;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type UseCarouselDragArgs = {
|
|
2
|
+
goPrevious: () => void;
|
|
3
|
+
goNext: () => void;
|
|
4
|
+
};
|
|
5
|
+
export declare function useCarouselDrag({ goPrevious, goNext }: UseCarouselDragArgs): {
|
|
6
|
+
handleMouseMove: (e: React.MouseEvent<HTMLUListElement, MouseEvent>) => void;
|
|
7
|
+
handleStartDrag: (e: React.MouseEvent<HTMLUListElement, MouseEvent>) => void;
|
|
8
|
+
};
|
|
9
|
+
export {};
|