jaci-ui 0.8.0 → 0.9.1
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/CHANGELOG.md +12 -0
- package/README.md +62 -0
- package/dist/_virtual/_rolldown/runtime.cjs +23 -0
- package/dist/components/carousel/carousel.cjs +342 -0
- package/dist/components/carousel/carousel.cjs.map +1 -0
- package/dist/components/carousel/carousel.d.cts +44 -0
- package/dist/components/carousel/carousel.d.ts +44 -0
- package/dist/components/carousel/carousel.js +330 -0
- package/dist/components/carousel/carousel.js.map +1 -0
- package/dist/components/carousel/index.d.cts +2 -0
- package/dist/components/carousel/index.d.ts +2 -0
- package/dist/components/code/code.cjs +32 -5
- package/dist/components/code/code.cjs.map +1 -1
- package/dist/components/code/code.d.cts +1 -0
- package/dist/components/code/code.d.ts +1 -0
- package/dist/components/code/code.js +34 -7
- package/dist/components/code/code.js.map +1 -1
- package/dist/components/color-swatch/color-swatch.cjs +33 -0
- package/dist/components/color-swatch/color-swatch.cjs.map +1 -0
- package/dist/components/color-swatch/color-swatch.d.cts +13 -0
- package/dist/components/color-swatch/color-swatch.d.ts +13 -0
- package/dist/components/color-swatch/color-swatch.js +33 -0
- package/dist/components/color-swatch/color-swatch.js.map +1 -0
- package/dist/components/color-swatch/index.d.cts +2 -0
- package/dist/components/color-swatch/index.d.ts +2 -0
- package/dist/components/command/command.cjs +3 -1
- package/dist/components/command/command.cjs.map +1 -1
- package/dist/components/command/command.js +3 -1
- package/dist/components/command/command.js.map +1 -1
- package/dist/components/download-trigger/download-trigger.cjs +25 -0
- package/dist/components/download-trigger/download-trigger.cjs.map +1 -0
- package/dist/components/download-trigger/download-trigger.d.cts +12 -0
- package/dist/components/download-trigger/download-trigger.d.ts +12 -0
- package/dist/components/download-trigger/download-trigger.js +25 -0
- package/dist/components/download-trigger/download-trigger.js.map +1 -0
- package/dist/components/download-trigger/index.d.cts +2 -0
- package/dist/components/download-trigger/index.d.ts +2 -0
- package/dist/components/qr-code/index.d.cts +2 -0
- package/dist/components/qr-code/index.d.ts +2 -0
- package/dist/components/qr-code/qr-code.cjs +118 -0
- package/dist/components/qr-code/qr-code.cjs.map +1 -0
- package/dist/components/qr-code/qr-code.d.cts +17 -0
- package/dist/components/qr-code/qr-code.d.ts +17 -0
- package/dist/components/qr-code/qr-code.js +116 -0
- package/dist/components/qr-code/qr-code.js.map +1 -0
- package/dist/components/spacer/index.d.cts +2 -0
- package/dist/components/spacer/index.d.ts +2 -0
- package/dist/components/spacer/spacer.cjs +24 -0
- package/dist/components/spacer/spacer.cjs.map +1 -0
- package/dist/components/spacer/spacer.d.cts +10 -0
- package/dist/components/spacer/spacer.d.ts +10 -0
- package/dist/components/spacer/spacer.js +24 -0
- package/dist/components/spacer/spacer.js.map +1 -0
- package/dist/index.cjs +10 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +11 -1
- package/dist/index.d.ts +11 -1
- package/dist/index.js +6 -1
- package/dist/index.js.map +1 -1
- package/dist/styled-system/recipes/carousel.cjs +48 -0
- package/dist/styled-system/recipes/carousel.cjs.map +1 -0
- package/dist/styled-system/recipes/carousel.js +48 -0
- package/dist/styled-system/recipes/carousel.js.map +1 -0
- package/dist/styled-system/recipes/code.cjs +4 -2
- package/dist/styled-system/recipes/code.cjs.map +1 -1
- package/dist/styled-system/recipes/code.js +4 -2
- package/dist/styled-system/recipes/code.js.map +1 -1
- package/dist/styled-system/recipes/color-swatch.cjs +37 -0
- package/dist/styled-system/recipes/color-swatch.cjs.map +1 -0
- package/dist/styled-system/recipes/color-swatch.js +37 -0
- package/dist/styled-system/recipes/color-swatch.js.map +1 -0
- package/dist/styled-system/recipes/download-trigger.cjs +39 -0
- package/dist/styled-system/recipes/download-trigger.cjs.map +1 -0
- package/dist/styled-system/recipes/download-trigger.js +39 -0
- package/dist/styled-system/recipes/download-trigger.js.map +1 -0
- package/dist/styled-system/recipes/layout-spacer.cjs +88 -0
- package/dist/styled-system/recipes/layout-spacer.cjs.map +1 -0
- package/dist/styled-system/recipes/layout-spacer.js +88 -0
- package/dist/styled-system/recipes/layout-spacer.js.map +1 -0
- package/dist/styled-system/recipes/qr-code.cjs +25 -0
- package/dist/styled-system/recipes/qr-code.cjs.map +1 -0
- package/dist/styled-system/recipes/qr-code.js +25 -0
- package/dist/styled-system/recipes/qr-code.js.map +1 -0
- package/dist/styles.css +794 -116
- package/dist/theme/theme-provider.cjs +29 -1
- package/dist/theme/theme-provider.cjs.map +1 -1
- package/dist/theme/theme-provider.js +29 -1
- package/dist/theme/theme-provider.js.map +1 -1
- package/package.json +7 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 0.9.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 8588c34: Fix production backdrop blur declarations and restore blur in the Command dropdown.
|
|
8
|
+
|
|
9
|
+
## 0.9.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- d06e214: Add Carousel, ColorSwatch, DownloadTrigger, QRCode and Spacer components, and consolidate the Separator utilities.
|
|
14
|
+
|
|
3
15
|
## 0.8.0
|
|
4
16
|
|
|
5
17
|
### Minor Changes
|
package/README.md
CHANGED
|
@@ -84,6 +84,64 @@ import { AspectRatio, Code, Figure, Image, Kbd, Quote, Stat, StatGroup } from "j
|
|
|
84
84
|
</StatGroup.Root>;
|
|
85
85
|
```
|
|
86
86
|
|
|
87
|
+
### Mídia e utilitários visuais
|
|
88
|
+
|
|
89
|
+
`Carousel` oferece slides acessíveis com navegação por teclado, indicadores, swipe e autoplay
|
|
90
|
+
opcional. Sempre forneça um `aria-label` no root e texto alternativo nas imagens:
|
|
91
|
+
|
|
92
|
+
```tsx
|
|
93
|
+
<Carousel.Root aria-label="Featured projects" loop>
|
|
94
|
+
<Carousel.Viewport>
|
|
95
|
+
<Carousel.Track>
|
|
96
|
+
<Carousel.Item index={0}>
|
|
97
|
+
<Carousel.Media><Image src="/project.jpg" alt="Project preview" /></Carousel.Media>
|
|
98
|
+
<Carousel.Caption>
|
|
99
|
+
<Carousel.Title>Project title</Carousel.Title>
|
|
100
|
+
<Carousel.Description>Project description</Carousel.Description>
|
|
101
|
+
</Carousel.Caption>
|
|
102
|
+
</Carousel.Item>
|
|
103
|
+
</Carousel.Track>
|
|
104
|
+
</Carousel.Viewport>
|
|
105
|
+
<Carousel.Previous />
|
|
106
|
+
<Carousel.Next />
|
|
107
|
+
<Carousel.Indicators />
|
|
108
|
+
</Carousel.Root>
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
`QRCode` gera SVG no servidor e no cliente, com módulos circulares e olhos quadrados
|
|
112
|
+
arredondados. O valor pode ser controlado diretamente pela aplicação:
|
|
113
|
+
|
|
114
|
+
```tsx
|
|
115
|
+
<QRCode
|
|
116
|
+
value="https://jaci-ui.dev"
|
|
117
|
+
size={240}
|
|
118
|
+
errorCorrectionLevel="Q"
|
|
119
|
+
label="Jaci UI website"
|
|
120
|
+
/>
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
Para downloads, `DownloadTrigger` é um link HTML comum e não faz fetch nem cria `Blob`:
|
|
124
|
+
|
|
125
|
+
```tsx
|
|
126
|
+
<DownloadTrigger href="/files/report.pdf" download="report.pdf">
|
|
127
|
+
Download report
|
|
128
|
+
</DownloadTrigger>
|
|
129
|
+
```
|
|
130
|
+
|
|
131
|
+
Em URLs cross-origin, o nome e a própria autorização do download continuam sujeitos às regras
|
|
132
|
+
do navegador e aos headers do servidor.
|
|
133
|
+
|
|
134
|
+
Use `Separator` para uma linha semântica ou decorativa entre seções e `Spacer` quando precisar
|
|
135
|
+
apenas de espaço, sem linha:
|
|
136
|
+
|
|
137
|
+
```tsx
|
|
138
|
+
<Separator orientation="horizontal" />
|
|
139
|
+
<Spacer axis="vertical" size="lg" />
|
|
140
|
+
```
|
|
141
|
+
|
|
142
|
+
Todos esses componentes continuam compatíveis com SSR e React 18/19. `Carousel` é o único novo
|
|
143
|
+
módulo interativo; os demais não acessam APIs do navegador durante importação ou renderização.
|
|
144
|
+
|
|
87
145
|
`AspectRatio` fills the available inline size of its parent. In shrink-to-fit or flex
|
|
88
146
|
layouts, give the parent an explicit `width`/`max-width` so the ratio has a measurable
|
|
89
147
|
size.
|
|
@@ -382,6 +440,10 @@ for the component recipes.
|
|
|
382
440
|
|
|
383
441
|
## Development
|
|
384
442
|
|
|
443
|
+
The public API contract is generated from the package entrypoint and declaration files. Run
|
|
444
|
+
`pnpm api:contract` from the workspace to detect unreviewed changes to exports, callbacks,
|
|
445
|
+
compound slots, aliases and client boundaries.
|
|
446
|
+
|
|
385
447
|
This repository uses pnpm, Turborepo, Panda CSS and Storybook. From the repository root:
|
|
386
448
|
|
|
387
449
|
```sh
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
//#region \0rolldown/runtime.js
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __copyProps = (to, from, except, desc) => {
|
|
9
|
+
if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
|
|
10
|
+
key = keys[i];
|
|
11
|
+
if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
12
|
+
get: ((k) => from[k]).bind(null, key),
|
|
13
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
19
|
+
value: mod,
|
|
20
|
+
enumerable: true
|
|
21
|
+
}) : target, mod));
|
|
22
|
+
//#endregion
|
|
23
|
+
exports.__toESM = __toESM;
|
|
@@ -0,0 +1,342 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
const require_cx = require("../../styled-system/css/cx.cjs");
|
|
3
|
+
const require_carousel = require("../../styled-system/recipes/carousel.cjs");
|
|
4
|
+
let react = require("react");
|
|
5
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
6
|
+
//#region src/components/carousel/carousel.tsx
|
|
7
|
+
const CarouselContext = (0, react.createContext)(null);
|
|
8
|
+
function useCarouselContext() {
|
|
9
|
+
const context = (0, react.useContext)(CarouselContext);
|
|
10
|
+
if (!context) throw new Error("Carousel parts must be rendered inside Carousel.Root.");
|
|
11
|
+
return context;
|
|
12
|
+
}
|
|
13
|
+
const CarouselRoot = (0, react.forwardRef)(function CarouselRoot({ autoplay = false, autoplayInterval = 5e3, children, className, defaultIndex = 0, disabled = false, index, onBlur, onFocus, loop = true, onIndexChange, onKeyDown, onPointerEnter, onPointerLeave, orientation = "horizontal", pauseOnFocus = true, pauseOnHover = true, style, swipeable = true, ...props }, ref) {
|
|
14
|
+
const [uncontrolledIndex, setUncontrolledIndex] = (0, react.useState)(Math.max(0, defaultIndex));
|
|
15
|
+
const [registered, setRegistered] = (0, react.useState)(() => /* @__PURE__ */ new Set());
|
|
16
|
+
const [paused, setPaused] = (0, react.useState)(false);
|
|
17
|
+
const [focusWithin, setFocusWithin] = (0, react.useState)(false);
|
|
18
|
+
const swipeRef = (0, react.useRef)(null);
|
|
19
|
+
const isControlled = index !== void 0;
|
|
20
|
+
const indexCount = registered.size ? Math.max(...registered) + 1 : 0;
|
|
21
|
+
const currentIndex = Math.max(0, Math.min(indexCount ? indexCount - 1 : 0, index ?? uncontrolledIndex));
|
|
22
|
+
const styles = require_carousel.carousel({
|
|
23
|
+
orientation,
|
|
24
|
+
active: true
|
|
25
|
+
});
|
|
26
|
+
const setIndex = (0, react.useCallback)((nextIndex) => {
|
|
27
|
+
if (disabled || !indexCount) return;
|
|
28
|
+
const next = loop ? (nextIndex + indexCount) % indexCount : Math.max(0, Math.min(indexCount - 1, nextIndex));
|
|
29
|
+
if (!isControlled) setUncontrolledIndex(next);
|
|
30
|
+
if (next !== currentIndex) onIndexChange?.(next);
|
|
31
|
+
}, [
|
|
32
|
+
currentIndex,
|
|
33
|
+
disabled,
|
|
34
|
+
indexCount,
|
|
35
|
+
isControlled,
|
|
36
|
+
loop,
|
|
37
|
+
onIndexChange
|
|
38
|
+
]);
|
|
39
|
+
const getNextIndex = (0, react.useCallback)((direction) => currentIndex + direction, [currentIndex]);
|
|
40
|
+
const registerIndex = (0, react.useCallback)((itemIndex) => {
|
|
41
|
+
setRegistered((previous) => {
|
|
42
|
+
if (previous.has(itemIndex)) return previous;
|
|
43
|
+
const next = new Set(previous);
|
|
44
|
+
next.add(itemIndex);
|
|
45
|
+
return next;
|
|
46
|
+
});
|
|
47
|
+
return () => setRegistered((previous) => {
|
|
48
|
+
if (!previous.has(itemIndex)) return previous;
|
|
49
|
+
const next = new Set(previous);
|
|
50
|
+
next.delete(itemIndex);
|
|
51
|
+
return next;
|
|
52
|
+
});
|
|
53
|
+
}, []);
|
|
54
|
+
const onRootKeyDown = (0, react.useCallback)((event) => {
|
|
55
|
+
if (disabled) return;
|
|
56
|
+
const forward = orientation === "horizontal" ? event.key === "ArrowRight" : event.key === "ArrowDown";
|
|
57
|
+
const backward = orientation === "horizontal" ? event.key === "ArrowLeft" : event.key === "ArrowUp";
|
|
58
|
+
if (forward || backward) {
|
|
59
|
+
event.preventDefault();
|
|
60
|
+
setIndex(getNextIndex(forward ? 1 : -1));
|
|
61
|
+
} else if (event.key === "Home") {
|
|
62
|
+
event.preventDefault();
|
|
63
|
+
setIndex(0);
|
|
64
|
+
} else if (event.key === "End") {
|
|
65
|
+
event.preventDefault();
|
|
66
|
+
setIndex(indexCount - 1);
|
|
67
|
+
}
|
|
68
|
+
onKeyDown?.(event);
|
|
69
|
+
}, [
|
|
70
|
+
disabled,
|
|
71
|
+
getNextIndex,
|
|
72
|
+
indexCount,
|
|
73
|
+
onKeyDown,
|
|
74
|
+
orientation,
|
|
75
|
+
setIndex
|
|
76
|
+
]);
|
|
77
|
+
const startSwipe = (0, react.useCallback)((event) => {
|
|
78
|
+
if (!swipeable || disabled || event.pointerType === "mouse") return;
|
|
79
|
+
swipeRef.current = {
|
|
80
|
+
pointerId: event.pointerId,
|
|
81
|
+
startX: event.clientX,
|
|
82
|
+
startY: event.clientY
|
|
83
|
+
};
|
|
84
|
+
event.currentTarget.setPointerCapture?.(event.pointerId);
|
|
85
|
+
}, [disabled, swipeable]);
|
|
86
|
+
const moveSwipe = (0, react.useCallback)(() => void 0, []);
|
|
87
|
+
const endSwipe = (0, react.useCallback)((event) => {
|
|
88
|
+
const start = swipeRef.current;
|
|
89
|
+
swipeRef.current = null;
|
|
90
|
+
if (!start || start.pointerId !== event.pointerId) return;
|
|
91
|
+
const delta = orientation === "horizontal" ? event.clientX - start.startX : event.clientY - start.startY;
|
|
92
|
+
if (Math.abs(delta) < 40) return;
|
|
93
|
+
setIndex(getNextIndex(delta < 0 ? 1 : -1));
|
|
94
|
+
}, [
|
|
95
|
+
getNextIndex,
|
|
96
|
+
orientation,
|
|
97
|
+
setIndex
|
|
98
|
+
]);
|
|
99
|
+
(0, react.useEffect)(() => {
|
|
100
|
+
if (!autoplay || paused || disabled || indexCount < 2) return;
|
|
101
|
+
const interval = Number.isFinite(autoplayInterval) && autoplayInterval > 0 ? autoplayInterval : 5e3;
|
|
102
|
+
const timer = window.setInterval(() => setIndex(getNextIndex(1)), interval);
|
|
103
|
+
return () => window.clearInterval(timer);
|
|
104
|
+
}, [
|
|
105
|
+
autoplay,
|
|
106
|
+
autoplayInterval,
|
|
107
|
+
disabled,
|
|
108
|
+
getNextIndex,
|
|
109
|
+
indexCount,
|
|
110
|
+
paused,
|
|
111
|
+
setIndex
|
|
112
|
+
]);
|
|
113
|
+
const value = (0, react.useMemo)(() => ({
|
|
114
|
+
currentIndex,
|
|
115
|
+
disabled,
|
|
116
|
+
endSwipe,
|
|
117
|
+
getNextIndex,
|
|
118
|
+
indexCount,
|
|
119
|
+
loop,
|
|
120
|
+
moveSwipe,
|
|
121
|
+
onKeyDown: onRootKeyDown,
|
|
122
|
+
orientation,
|
|
123
|
+
registerIndex,
|
|
124
|
+
setIndex,
|
|
125
|
+
startSwipe,
|
|
126
|
+
styles
|
|
127
|
+
}), [
|
|
128
|
+
currentIndex,
|
|
129
|
+
disabled,
|
|
130
|
+
endSwipe,
|
|
131
|
+
getNextIndex,
|
|
132
|
+
indexCount,
|
|
133
|
+
loop,
|
|
134
|
+
moveSwipe,
|
|
135
|
+
onRootKeyDown,
|
|
136
|
+
orientation,
|
|
137
|
+
registerIndex,
|
|
138
|
+
setIndex,
|
|
139
|
+
startSwipe,
|
|
140
|
+
styles
|
|
141
|
+
]);
|
|
142
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CarouselContext.Provider, {
|
|
143
|
+
value,
|
|
144
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
|
|
145
|
+
...props,
|
|
146
|
+
ref,
|
|
147
|
+
"aria-roledescription": "carousel",
|
|
148
|
+
className: require_cx.cx(styles.root, className),
|
|
149
|
+
"data-jaci-component": "carousel",
|
|
150
|
+
"data-orientation": orientation,
|
|
151
|
+
"data-slot": "carousel",
|
|
152
|
+
"data-state": paused ? "paused" : "running",
|
|
153
|
+
role: "region",
|
|
154
|
+
tabIndex: disabled ? -1 : 0,
|
|
155
|
+
onBlur: (event) => {
|
|
156
|
+
if (!event.currentTarget.contains(event.relatedTarget)) {
|
|
157
|
+
setFocusWithin(false);
|
|
158
|
+
if (pauseOnFocus) setPaused(false);
|
|
159
|
+
}
|
|
160
|
+
onBlur?.(event);
|
|
161
|
+
},
|
|
162
|
+
onFocus: (event) => {
|
|
163
|
+
setFocusWithin(true);
|
|
164
|
+
if (pauseOnFocus) setPaused(true);
|
|
165
|
+
onFocus?.(event);
|
|
166
|
+
},
|
|
167
|
+
onKeyDown: onRootKeyDown,
|
|
168
|
+
onPointerCancel: endSwipe,
|
|
169
|
+
onPointerDown: startSwipe,
|
|
170
|
+
onPointerEnter: (event) => {
|
|
171
|
+
if (pauseOnHover) setPaused(true);
|
|
172
|
+
onPointerEnter?.(event);
|
|
173
|
+
},
|
|
174
|
+
onPointerLeave: (event) => {
|
|
175
|
+
if (pauseOnHover && !(pauseOnFocus && focusWithin)) setPaused(false);
|
|
176
|
+
onPointerLeave?.(event);
|
|
177
|
+
},
|
|
178
|
+
onPointerMove: moveSwipe,
|
|
179
|
+
onPointerUp: endSwipe,
|
|
180
|
+
style: {
|
|
181
|
+
"--jaci-carousel-index": currentIndex,
|
|
182
|
+
...style
|
|
183
|
+
},
|
|
184
|
+
children
|
|
185
|
+
})
|
|
186
|
+
});
|
|
187
|
+
});
|
|
188
|
+
const CarouselViewport = (0, react.forwardRef)(function CarouselViewport({ className, ...props }, ref) {
|
|
189
|
+
const { styles } = useCarouselContext();
|
|
190
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
191
|
+
...props,
|
|
192
|
+
ref,
|
|
193
|
+
className: require_cx.cx(styles.viewport, className),
|
|
194
|
+
"data-slot": "carousel-viewport"
|
|
195
|
+
});
|
|
196
|
+
});
|
|
197
|
+
const CarouselTrack = (0, react.forwardRef)(function CarouselTrack({ className, style, ...props }, ref) {
|
|
198
|
+
const { currentIndex, orientation, styles } = useCarouselContext();
|
|
199
|
+
const transform = orientation === "horizontal" ? `translateX(-${currentIndex * 100}%)` : `translateY(-${currentIndex * 100}%)`;
|
|
200
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
201
|
+
...props,
|
|
202
|
+
ref,
|
|
203
|
+
className: require_cx.cx(styles.track, className),
|
|
204
|
+
"data-slot": "carousel-track",
|
|
205
|
+
style: {
|
|
206
|
+
transform,
|
|
207
|
+
...style
|
|
208
|
+
}
|
|
209
|
+
});
|
|
210
|
+
});
|
|
211
|
+
const CarouselItem = (0, react.forwardRef)(function CarouselItem({ children, className, index, ...props }, ref) {
|
|
212
|
+
const { currentIndex, registerIndex, styles } = useCarouselContext();
|
|
213
|
+
(0, react.useEffect)(() => registerIndex(index), [index, registerIndex]);
|
|
214
|
+
const active = currentIndex === index;
|
|
215
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
216
|
+
...props,
|
|
217
|
+
ref,
|
|
218
|
+
"aria-hidden": !active,
|
|
219
|
+
"aria-roledescription": "slide",
|
|
220
|
+
className: require_cx.cx(styles.item, className),
|
|
221
|
+
"data-index": index,
|
|
222
|
+
"data-jaci-component": "carousel-item",
|
|
223
|
+
"data-selected": active || void 0,
|
|
224
|
+
"data-slot": "carousel-item",
|
|
225
|
+
role: "group",
|
|
226
|
+
tabIndex: active ? 0 : -1,
|
|
227
|
+
children
|
|
228
|
+
});
|
|
229
|
+
});
|
|
230
|
+
function createSimpleSlot(slot) {
|
|
231
|
+
return (0, react.forwardRef)(function CarouselSlot({ className, ...props }, ref) {
|
|
232
|
+
const { styles } = useCarouselContext();
|
|
233
|
+
if (slot === "title") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
|
|
234
|
+
...props,
|
|
235
|
+
ref,
|
|
236
|
+
className: require_cx.cx(styles.title, className),
|
|
237
|
+
"data-slot": `carousel-${slot}`
|
|
238
|
+
});
|
|
239
|
+
if (slot === "description") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
240
|
+
...props,
|
|
241
|
+
ref,
|
|
242
|
+
className: require_cx.cx(styles.description, className),
|
|
243
|
+
"data-slot": `carousel-${slot}`
|
|
244
|
+
});
|
|
245
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
246
|
+
...props,
|
|
247
|
+
ref,
|
|
248
|
+
className: require_cx.cx(styles[slot], className),
|
|
249
|
+
"data-slot": `carousel-${slot}`
|
|
250
|
+
});
|
|
251
|
+
});
|
|
252
|
+
}
|
|
253
|
+
const CarouselMedia = createSimpleSlot("media");
|
|
254
|
+
const CarouselCaption = createSimpleSlot("caption");
|
|
255
|
+
const CarouselTitle = createSimpleSlot("title");
|
|
256
|
+
const CarouselDescription = createSimpleSlot("description");
|
|
257
|
+
const CarouselPrevious = (0, react.forwardRef)(function CarouselPrevious({ "aria-label": ariaLabel = "Previous slide", children, className, disabled, ...props }, ref) {
|
|
258
|
+
const { disabled: contextDisabled, getNextIndex, orientation, setIndex, styles } = useCarouselContext();
|
|
259
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
260
|
+
...props,
|
|
261
|
+
ref,
|
|
262
|
+
"aria-label": ariaLabel,
|
|
263
|
+
className: require_cx.cx(styles.control, className),
|
|
264
|
+
"data-slot": "carousel-previous",
|
|
265
|
+
disabled: disabled ?? contextDisabled,
|
|
266
|
+
onClick: () => setIndex(getNextIndex(-1)),
|
|
267
|
+
type: "button",
|
|
268
|
+
children: children ?? (orientation === "vertical" ? "↑" : "‹")
|
|
269
|
+
});
|
|
270
|
+
});
|
|
271
|
+
const CarouselNext = (0, react.forwardRef)(function CarouselNext({ "aria-label": ariaLabel = "Next slide", children, className, disabled, ...props }, ref) {
|
|
272
|
+
const { disabled: contextDisabled, getNextIndex, orientation, setIndex, styles } = useCarouselContext();
|
|
273
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
274
|
+
...props,
|
|
275
|
+
ref,
|
|
276
|
+
"aria-label": ariaLabel,
|
|
277
|
+
className: require_cx.cx(styles.control, className),
|
|
278
|
+
"data-slot": "carousel-next",
|
|
279
|
+
disabled: disabled ?? contextDisabled,
|
|
280
|
+
onClick: () => setIndex(getNextIndex(1)),
|
|
281
|
+
type: "button",
|
|
282
|
+
children: children ?? (orientation === "vertical" ? "↓" : "›")
|
|
283
|
+
});
|
|
284
|
+
});
|
|
285
|
+
const CarouselIndicator = (0, react.forwardRef)(function CarouselIndicator({ "aria-label": ariaLabel, className, index, ...props }, ref) {
|
|
286
|
+
const { currentIndex, disabled, setIndex, styles } = useCarouselContext();
|
|
287
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
288
|
+
...props,
|
|
289
|
+
ref,
|
|
290
|
+
"aria-label": ariaLabel ?? `Go to slide ${index + 1}`,
|
|
291
|
+
"aria-selected": currentIndex === index,
|
|
292
|
+
className: require_cx.cx(styles.indicator, className),
|
|
293
|
+
"data-selected": currentIndex === index || void 0,
|
|
294
|
+
"data-slot": "carousel-indicator",
|
|
295
|
+
disabled,
|
|
296
|
+
onClick: () => setIndex(index),
|
|
297
|
+
role: "tab",
|
|
298
|
+
type: "button"
|
|
299
|
+
});
|
|
300
|
+
});
|
|
301
|
+
const CarouselIndicators = (0, react.forwardRef)(function CarouselIndicators({ children, className, ...props }, ref) {
|
|
302
|
+
const { indexCount, styles } = useCarouselContext();
|
|
303
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
304
|
+
...props,
|
|
305
|
+
ref,
|
|
306
|
+
"aria-label": "Slides",
|
|
307
|
+
className: require_cx.cx(styles.indicators, className),
|
|
308
|
+
"data-slot": "carousel-indicators",
|
|
309
|
+
role: "tablist",
|
|
310
|
+
children: children ?? Array.from({ length: indexCount }, (_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CarouselIndicator, { index }, `indicator-${index}`))
|
|
311
|
+
});
|
|
312
|
+
});
|
|
313
|
+
const Carousel = {
|
|
314
|
+
Root: CarouselRoot,
|
|
315
|
+
Viewport: CarouselViewport,
|
|
316
|
+
Track: CarouselTrack,
|
|
317
|
+
Item: CarouselItem,
|
|
318
|
+
Media: CarouselMedia,
|
|
319
|
+
Caption: CarouselCaption,
|
|
320
|
+
Title: CarouselTitle,
|
|
321
|
+
Description: CarouselDescription,
|
|
322
|
+
Previous: CarouselPrevious,
|
|
323
|
+
Next: CarouselNext,
|
|
324
|
+
Indicators: CarouselIndicators,
|
|
325
|
+
Indicator: CarouselIndicator
|
|
326
|
+
};
|
|
327
|
+
//#endregion
|
|
328
|
+
exports.Carousel = Carousel;
|
|
329
|
+
exports.CarouselCaption = CarouselCaption;
|
|
330
|
+
exports.CarouselDescription = CarouselDescription;
|
|
331
|
+
exports.CarouselIndicator = CarouselIndicator;
|
|
332
|
+
exports.CarouselIndicators = CarouselIndicators;
|
|
333
|
+
exports.CarouselItem = CarouselItem;
|
|
334
|
+
exports.CarouselMedia = CarouselMedia;
|
|
335
|
+
exports.CarouselNext = CarouselNext;
|
|
336
|
+
exports.CarouselPrevious = CarouselPrevious;
|
|
337
|
+
exports.CarouselRoot = CarouselRoot;
|
|
338
|
+
exports.CarouselTitle = CarouselTitle;
|
|
339
|
+
exports.CarouselTrack = CarouselTrack;
|
|
340
|
+
exports.CarouselViewport = CarouselViewport;
|
|
341
|
+
|
|
342
|
+
//# sourceMappingURL=carousel.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"carousel.cjs","names":["carousel","cx"],"sources":["../../../src/components/carousel/carousel.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport type {\n ComponentPropsWithoutRef,\n CSSProperties,\n FocusEvent,\n KeyboardEvent,\n PointerEvent,\n ReactNode,\n Ref,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { carousel } from \"../../styled-system/recipes\";\n\nexport type CarouselOrientation = \"horizontal\" | \"vertical\";\n\ninterface CarouselContextValue {\n currentIndex: number;\n disabled: boolean;\n getNextIndex: (direction: -1 | 1) => number;\n indexCount: number;\n loop: boolean;\n onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;\n registerIndex: (index: number) => () => void;\n setIndex: (index: number) => void;\n startSwipe: (event: PointerEvent<HTMLElement>) => void;\n moveSwipe: (event: PointerEvent<HTMLElement>) => void;\n endSwipe: (event: PointerEvent<HTMLElement>) => void;\n orientation: CarouselOrientation;\n styles: ReturnType<typeof carousel>;\n}\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nfunction useCarouselContext() {\n const context = useContext(CarouselContext);\n if (!context) throw new Error(\"Carousel parts must be rendered inside Carousel.Root.\");\n return context;\n}\n\nexport interface CarouselRootProps extends ComponentPropsWithoutRef<\"section\"> {\n index?: number;\n defaultIndex?: number;\n onIndexChange?: (index: number) => void;\n orientation?: CarouselOrientation;\n loop?: boolean;\n swipeable?: boolean;\n autoplay?: boolean;\n autoplayInterval?: number;\n pauseOnHover?: boolean;\n pauseOnFocus?: boolean;\n disabled?: boolean;\n}\n\nexport const CarouselRoot = forwardRef<HTMLElement, CarouselRootProps>(function CarouselRoot(\n {\n autoplay = false,\n autoplayInterval = 5000,\n children,\n className,\n defaultIndex = 0,\n disabled = false,\n index,\n onBlur,\n onFocus,\n loop = true,\n onIndexChange,\n onKeyDown,\n onPointerEnter,\n onPointerLeave,\n orientation = \"horizontal\",\n pauseOnFocus = true,\n pauseOnHover = true,\n style,\n swipeable = true,\n ...props\n },\n ref,\n) {\n const [uncontrolledIndex, setUncontrolledIndex] = useState(Math.max(0, defaultIndex));\n const [registered, setRegistered] = useState<Set<number>>(() => new Set());\n const [paused, setPaused] = useState(false);\n const [focusWithin, setFocusWithin] = useState(false);\n const swipeRef = useRef<{ pointerId: number; startX: number; startY: number } | null>(null);\n const isControlled = index !== undefined;\n const indexCount = registered.size ? Math.max(...registered) + 1 : 0;\n const currentIndex = Math.max(\n 0,\n Math.min(indexCount ? indexCount - 1 : 0, index ?? uncontrolledIndex),\n );\n const styles = carousel({ orientation, active: true });\n\n const setIndex = useCallback(\n (nextIndex: number) => {\n if (disabled || !indexCount) return;\n const next = loop\n ? (nextIndex + indexCount) % indexCount\n : Math.max(0, Math.min(indexCount - 1, nextIndex));\n if (!isControlled) setUncontrolledIndex(next);\n if (next !== currentIndex) onIndexChange?.(next);\n },\n [currentIndex, disabled, indexCount, isControlled, loop, onIndexChange],\n );\n\n const getNextIndex = useCallback((direction: -1 | 1) => currentIndex + direction, [currentIndex]);\n\n const registerIndex = useCallback((itemIndex: number) => {\n setRegistered((previous) => {\n if (previous.has(itemIndex)) return previous;\n const next = new Set(previous);\n next.add(itemIndex);\n return next;\n });\n return () =>\n setRegistered((previous) => {\n if (!previous.has(itemIndex)) return previous;\n const next = new Set(previous);\n next.delete(itemIndex);\n return next;\n });\n }, []);\n\n const onRootKeyDown = useCallback(\n (event: KeyboardEvent<HTMLElement>) => {\n if (disabled) return;\n const forward =\n orientation === \"horizontal\" ? event.key === \"ArrowRight\" : event.key === \"ArrowDown\";\n const backward =\n orientation === \"horizontal\" ? event.key === \"ArrowLeft\" : event.key === \"ArrowUp\";\n if (forward || backward) {\n event.preventDefault();\n setIndex(getNextIndex(forward ? 1 : -1));\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setIndex(0);\n } else if (event.key === \"End\") {\n event.preventDefault();\n setIndex(indexCount - 1);\n }\n onKeyDown?.(event);\n },\n [disabled, getNextIndex, indexCount, onKeyDown, orientation, setIndex],\n );\n\n const startSwipe = useCallback(\n (event: PointerEvent<HTMLElement>) => {\n if (!swipeable || disabled || event.pointerType === \"mouse\") return;\n swipeRef.current = {\n pointerId: event.pointerId,\n startX: event.clientX,\n startY: event.clientY,\n };\n event.currentTarget.setPointerCapture?.(event.pointerId);\n },\n [disabled, swipeable],\n );\n\n const moveSwipe = useCallback(() => undefined, []);\n\n const endSwipe = useCallback(\n (event: PointerEvent<HTMLElement>) => {\n const start = swipeRef.current;\n swipeRef.current = null;\n if (!start || start.pointerId !== event.pointerId) return;\n const delta =\n orientation === \"horizontal\" ? event.clientX - start.startX : event.clientY - start.startY;\n if (Math.abs(delta) < 40) return;\n setIndex(getNextIndex(delta < 0 ? 1 : -1));\n },\n [getNextIndex, orientation, setIndex],\n );\n\n useEffect(() => {\n if (!autoplay || paused || disabled || indexCount < 2) return;\n const interval =\n Number.isFinite(autoplayInterval) && autoplayInterval > 0 ? autoplayInterval : 5000;\n const timer = window.setInterval(() => setIndex(getNextIndex(1)), interval);\n return () => window.clearInterval(timer);\n }, [autoplay, autoplayInterval, disabled, getNextIndex, indexCount, paused, setIndex]);\n\n const value = useMemo<CarouselContextValue>(\n () => ({\n currentIndex,\n disabled,\n endSwipe,\n getNextIndex,\n indexCount,\n loop,\n moveSwipe,\n onKeyDown: onRootKeyDown,\n orientation,\n registerIndex,\n setIndex,\n startSwipe,\n styles,\n }),\n [\n currentIndex,\n disabled,\n endSwipe,\n getNextIndex,\n indexCount,\n loop,\n moveSwipe,\n onRootKeyDown,\n orientation,\n registerIndex,\n setIndex,\n startSwipe,\n styles,\n ],\n );\n\n return (\n <CarouselContext.Provider value={value}>\n <section\n {...props}\n ref={ref}\n aria-roledescription=\"carousel\"\n className={cx(styles.root, className)}\n data-jaci-component=\"carousel\"\n data-orientation={orientation}\n data-slot=\"carousel\"\n data-state={paused ? \"paused\" : \"running\"}\n role=\"region\"\n tabIndex={disabled ? -1 : 0}\n onBlur={(event: FocusEvent<HTMLElement>) => {\n if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n setFocusWithin(false);\n if (pauseOnFocus) setPaused(false);\n }\n onBlur?.(event);\n }}\n onFocus={(event: FocusEvent<HTMLElement>) => {\n setFocusWithin(true);\n if (pauseOnFocus) {\n setPaused(true);\n }\n onFocus?.(event);\n }}\n onKeyDown={onRootKeyDown}\n onPointerCancel={endSwipe}\n onPointerDown={startSwipe}\n onPointerEnter={(event) => {\n if (pauseOnHover) setPaused(true);\n onPointerEnter?.(event);\n }}\n onPointerLeave={(event) => {\n if (pauseOnHover && !(pauseOnFocus && focusWithin)) setPaused(false);\n onPointerLeave?.(event);\n }}\n onPointerMove={moveSwipe}\n onPointerUp={endSwipe}\n style={{ \"--jaci-carousel-index\": currentIndex, ...style } as CSSProperties}\n >\n {children}\n </section>\n </CarouselContext.Provider>\n );\n});\n\nexport type CarouselViewportProps = ComponentPropsWithoutRef<\"div\">;\nexport const CarouselViewport = forwardRef<HTMLDivElement, CarouselViewportProps>(\n function CarouselViewport({ className, ...props }, ref) {\n const { styles } = useCarouselContext();\n return (\n <div\n {...props}\n ref={ref}\n className={cx(styles.viewport, className)}\n data-slot=\"carousel-viewport\"\n />\n );\n },\n);\n\nexport type CarouselTrackProps = ComponentPropsWithoutRef<\"div\">;\nexport const CarouselTrack = forwardRef<HTMLDivElement, CarouselTrackProps>(function CarouselTrack(\n { className, style, ...props },\n ref,\n) {\n const { currentIndex, orientation, styles } = useCarouselContext();\n const transform =\n orientation === \"horizontal\"\n ? `translateX(-${currentIndex * 100}%)`\n : `translateY(-${currentIndex * 100}%)`;\n return (\n <div\n {...props}\n ref={ref}\n className={cx(styles.track, className)}\n data-slot=\"carousel-track\"\n style={{ transform, ...style }}\n />\n );\n});\n\nexport interface CarouselItemProps extends ComponentPropsWithoutRef<\"div\"> {\n index: number;\n}\nexport const CarouselItem = forwardRef<HTMLDivElement, CarouselItemProps>(function CarouselItem(\n { children, className, index, ...props },\n ref,\n) {\n const { currentIndex, registerIndex, styles } = useCarouselContext();\n useEffect(() => registerIndex(index), [index, registerIndex]);\n const active = currentIndex === index;\n return (\n // biome-ignore lint/a11y/useSemanticElements: carousel slides use the ARIA group role.\n <div\n {...props}\n ref={ref}\n aria-hidden={!active}\n aria-roledescription=\"slide\"\n className={cx(styles.item, className)}\n data-index={index}\n data-jaci-component=\"carousel-item\"\n data-selected={active || undefined}\n data-slot=\"carousel-item\"\n role=\"group\"\n tabIndex={active ? 0 : -1}\n >\n {children}\n </div>\n );\n});\n\nfunction createSimpleSlot(slot: \"media\" | \"caption\" | \"title\" | \"description\") {\n return forwardRef<HTMLElement, ComponentPropsWithoutRef<\"div\">>(function CarouselSlot(\n { className, ...props },\n ref,\n ) {\n const { styles } = useCarouselContext();\n if (slot === \"title\")\n return (\n <h3\n {...props}\n ref={ref as Ref<HTMLHeadingElement>}\n className={cx(styles.title, className)}\n data-slot={`carousel-${slot}`}\n />\n );\n if (slot === \"description\")\n return (\n <p\n {...props}\n ref={ref as Ref<HTMLParagraphElement>}\n className={cx(styles.description, className)}\n data-slot={`carousel-${slot}`}\n />\n );\n return (\n <div\n {...props}\n ref={ref as Ref<HTMLDivElement>}\n className={cx(styles[slot], className)}\n data-slot={`carousel-${slot}`}\n />\n );\n });\n}\n\nexport const CarouselMedia = createSimpleSlot(\"media\");\nexport const CarouselCaption = createSimpleSlot(\"caption\");\nexport const CarouselTitle = createSimpleSlot(\"title\");\nexport const CarouselDescription = createSimpleSlot(\"description\");\n\nexport interface CarouselControlProps extends ComponentPropsWithoutRef<\"button\"> {\n children?: ReactNode;\n}\nexport const CarouselPrevious = forwardRef<HTMLButtonElement, CarouselControlProps>(\n function CarouselPrevious(\n { \"aria-label\": ariaLabel = \"Previous slide\", children, className, disabled, ...props },\n ref,\n ) {\n const {\n disabled: contextDisabled,\n getNextIndex,\n orientation,\n setIndex,\n styles,\n } = useCarouselContext();\n return (\n <button\n {...props}\n ref={ref}\n aria-label={ariaLabel}\n className={cx(styles.control, className)}\n data-slot=\"carousel-previous\"\n disabled={disabled ?? contextDisabled}\n onClick={() => setIndex(getNextIndex(-1))}\n type=\"button\"\n >\n {children ?? (orientation === \"vertical\" ? \"↑\" : \"‹\")}\n </button>\n );\n },\n);\n\nexport const CarouselNext = forwardRef<HTMLButtonElement, CarouselControlProps>(\n function CarouselNext(\n { \"aria-label\": ariaLabel = \"Next slide\", children, className, disabled, ...props },\n ref,\n ) {\n const {\n disabled: contextDisabled,\n getNextIndex,\n orientation,\n setIndex,\n styles,\n } = useCarouselContext();\n return (\n <button\n {...props}\n ref={ref}\n aria-label={ariaLabel}\n className={cx(styles.control, className)}\n data-slot=\"carousel-next\"\n disabled={disabled ?? contextDisabled}\n onClick={() => setIndex(getNextIndex(1))}\n type=\"button\"\n >\n {children ?? (orientation === \"vertical\" ? \"↓\" : \"›\")}\n </button>\n );\n },\n);\n\nexport interface CarouselIndicatorProps extends ComponentPropsWithoutRef<\"button\"> {\n index: number;\n}\nexport const CarouselIndicator = forwardRef<HTMLButtonElement, CarouselIndicatorProps>(\n function CarouselIndicator({ \"aria-label\": ariaLabel, className, index, ...props }, ref) {\n const { currentIndex, disabled, setIndex, styles } = useCarouselContext();\n return (\n <button\n {...props}\n ref={ref}\n aria-label={ariaLabel ?? `Go to slide ${index + 1}`}\n aria-selected={currentIndex === index}\n className={cx(styles.indicator, className)}\n data-selected={currentIndex === index || undefined}\n data-slot=\"carousel-indicator\"\n disabled={disabled}\n onClick={() => setIndex(index)}\n role=\"tab\"\n type=\"button\"\n />\n );\n },\n);\n\nexport const CarouselIndicators = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<\"div\">>(\n function CarouselIndicators({ children, className, ...props }, ref) {\n const { indexCount, styles } = useCarouselContext();\n return (\n <div\n {...props}\n ref={ref}\n aria-label=\"Slides\"\n className={cx(styles.indicators, className)}\n data-slot=\"carousel-indicators\"\n role=\"tablist\"\n >\n {children ??\n Array.from({ length: indexCount }, (_, index) => (\n // biome-ignore lint/suspicious/noArrayIndexKey: indicators are stable by slide index.\n <CarouselIndicator index={index} key={`indicator-${index}`} />\n ))}\n </div>\n );\n },\n);\n\nexport const Carousel = {\n Root: CarouselRoot,\n Viewport: CarouselViewport,\n Track: CarouselTrack,\n Item: CarouselItem,\n Media: CarouselMedia,\n Caption: CarouselCaption,\n Title: CarouselTitle,\n Description: CarouselDescription,\n Previous: CarouselPrevious,\n Next: CarouselNext,\n Indicators: CarouselIndicators,\n Indicator: CarouselIndicator,\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, ReactNode } from "react";
|
|
2
|
+
//#region src/components/carousel/carousel.d.ts
|
|
3
|
+
type CarouselOrientation = "horizontal" | "vertical";
|
|
4
|
+
interface CarouselRootProps extends ComponentPropsWithoutRef<"section"> {
|
|
5
|
+
index?: number;
|
|
6
|
+
defaultIndex?: number;
|
|
7
|
+
onIndexChange?: (index: number) => void;
|
|
8
|
+
orientation?: CarouselOrientation;
|
|
9
|
+
loop?: boolean;
|
|
10
|
+
swipeable?: boolean;
|
|
11
|
+
autoplay?: boolean;
|
|
12
|
+
autoplayInterval?: number;
|
|
13
|
+
pauseOnHover?: boolean;
|
|
14
|
+
pauseOnFocus?: boolean;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
}
|
|
17
|
+
type CarouselViewportProps = ComponentPropsWithoutRef<"div">;
|
|
18
|
+
type CarouselTrackProps = ComponentPropsWithoutRef<"div">;
|
|
19
|
+
interface CarouselItemProps extends ComponentPropsWithoutRef<"div"> {
|
|
20
|
+
index: number;
|
|
21
|
+
}
|
|
22
|
+
interface CarouselControlProps extends ComponentPropsWithoutRef<"button"> {
|
|
23
|
+
children?: ReactNode;
|
|
24
|
+
}
|
|
25
|
+
interface CarouselIndicatorProps extends ComponentPropsWithoutRef<"button"> {
|
|
26
|
+
index: number;
|
|
27
|
+
}
|
|
28
|
+
declare const Carousel: {
|
|
29
|
+
Root: import("react").ForwardRefExoticComponent<CarouselRootProps & import("react").RefAttributes<HTMLElement>>;
|
|
30
|
+
Viewport: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
31
|
+
Track: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
32
|
+
Item: import("react").ForwardRefExoticComponent<CarouselItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
33
|
+
Media: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
34
|
+
Caption: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
35
|
+
Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
36
|
+
Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
37
|
+
Previous: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
38
|
+
Next: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
39
|
+
Indicators: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
40
|
+
Indicator: import("react").ForwardRefExoticComponent<CarouselIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
41
|
+
};
|
|
42
|
+
//#endregion
|
|
43
|
+
export { Carousel, CarouselControlProps, CarouselIndicatorProps, CarouselItemProps, CarouselOrientation, CarouselRootProps, CarouselTrackProps, CarouselViewportProps };
|
|
44
|
+
//# sourceMappingURL=carousel.d.cts.map
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, ReactNode } from "react";
|
|
2
|
+
//#region src/components/carousel/carousel.d.ts
|
|
3
|
+
type CarouselOrientation = "horizontal" | "vertical";
|
|
4
|
+
interface CarouselRootProps extends ComponentPropsWithoutRef<"section"> {
|
|
5
|
+
index?: number;
|
|
6
|
+
defaultIndex?: number;
|
|
7
|
+
onIndexChange?: (index: number) => void;
|
|
8
|
+
orientation?: CarouselOrientation;
|
|
9
|
+
loop?: boolean;
|
|
10
|
+
swipeable?: boolean;
|
|
11
|
+
autoplay?: boolean;
|
|
12
|
+
autoplayInterval?: number;
|
|
13
|
+
pauseOnHover?: boolean;
|
|
14
|
+
pauseOnFocus?: boolean;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
}
|
|
17
|
+
type CarouselViewportProps = ComponentPropsWithoutRef<"div">;
|
|
18
|
+
type CarouselTrackProps = ComponentPropsWithoutRef<"div">;
|
|
19
|
+
interface CarouselItemProps extends ComponentPropsWithoutRef<"div"> {
|
|
20
|
+
index: number;
|
|
21
|
+
}
|
|
22
|
+
interface CarouselControlProps extends ComponentPropsWithoutRef<"button"> {
|
|
23
|
+
children?: ReactNode;
|
|
24
|
+
}
|
|
25
|
+
interface CarouselIndicatorProps extends ComponentPropsWithoutRef<"button"> {
|
|
26
|
+
index: number;
|
|
27
|
+
}
|
|
28
|
+
declare const Carousel: {
|
|
29
|
+
Root: import("react").ForwardRefExoticComponent<CarouselRootProps & import("react").RefAttributes<HTMLElement>>;
|
|
30
|
+
Viewport: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
31
|
+
Track: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
32
|
+
Item: import("react").ForwardRefExoticComponent<CarouselItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
33
|
+
Media: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
34
|
+
Caption: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
35
|
+
Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
36
|
+
Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
37
|
+
Previous: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
38
|
+
Next: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
39
|
+
Indicators: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
40
|
+
Indicator: import("react").ForwardRefExoticComponent<CarouselIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
41
|
+
};
|
|
42
|
+
//#endregion
|
|
43
|
+
export { Carousel, CarouselControlProps, CarouselIndicatorProps, CarouselItemProps, CarouselOrientation, CarouselRootProps, CarouselTrackProps, CarouselViewportProps };
|
|
44
|
+
//# sourceMappingURL=carousel.d.ts.map
|