@fluixi-ui/carousel 0.1.0-alpha.0 → 0.1.0-alpha.10
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/carousel.d.ts +55 -12
- package/dist/carousel.d.ts.map +1 -1
- package/dist/carousel.js +456 -374
- package/dist/index.js +2 -10
- package/dist/tsconfig.lib.tsbuildinfo +1 -1
- package/package.json +6 -6
package/dist/carousel.d.ts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import { type FxProp } from '@fluixi-ui/fx';
|
|
1
2
|
import { type Accessor } from '@fluixi/reactive/signal';
|
|
2
3
|
import { type Orientation } from '@fluixi-ui/kit';
|
|
3
4
|
import { type Collection, type CollectionItem } from '@fluixi-ui/primitives';
|
|
4
|
-
import type {
|
|
5
|
+
import type { ComponentChild } from '@fluixi/dom';
|
|
6
|
+
import type { ButtonHTMLAttributes, HTMLAttributes } from '@fluixi/dom/attributes';
|
|
5
7
|
interface CarouselContextValue {
|
|
6
8
|
index: Accessor<number>;
|
|
7
9
|
count: Accessor<number>;
|
|
@@ -22,7 +24,7 @@ interface CarouselContextValue {
|
|
|
22
24
|
}
|
|
23
25
|
declare const useCarouselContext: () => CarouselContextValue;
|
|
24
26
|
export { useCarouselContext };
|
|
25
|
-
export interface CarouselProps extends Omit<
|
|
27
|
+
export interface CarouselProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
26
28
|
/** Controlled active slide index. */
|
|
27
29
|
index?: number;
|
|
28
30
|
/** Uncontrolled initial slide index. Default `0`. */
|
|
@@ -41,6 +43,16 @@ export interface CarouselProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>,
|
|
|
41
43
|
pauseOnHover?: boolean;
|
|
42
44
|
/** Allow dragging/swiping the viewport to change slides. Default `true`. */
|
|
43
45
|
draggable?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Lay the controls over the slides instead of below them.
|
|
48
|
+
*
|
|
49
|
+
* The arrows sit against the viewport's edges and the dots along its bottom,
|
|
50
|
+
* so the carousel occupies only the height of its slides. Controls get a
|
|
51
|
+
* translucent scrim so they stay legible over an arbitrary image.
|
|
52
|
+
*/
|
|
53
|
+
overlay?: boolean;
|
|
54
|
+
/** Token-aware style object. See `@fluixi-ui/fx`. */
|
|
55
|
+
fx?: FxProp;
|
|
44
56
|
}
|
|
45
57
|
/**
|
|
46
58
|
* Root of a carousel. Owns the active slide index (controlled `index` or
|
|
@@ -64,23 +76,54 @@ export interface CarouselProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>,
|
|
|
64
76
|
* </Carousel>
|
|
65
77
|
* ```
|
|
66
78
|
*/
|
|
67
|
-
export declare function Carousel(props: CarouselProps):
|
|
68
|
-
export interface CarouselViewportProps extends
|
|
79
|
+
export declare function Carousel(props: CarouselProps): ComponentChild;
|
|
80
|
+
export interface CarouselViewportProps extends HTMLAttributes<HTMLDivElement> {
|
|
81
|
+
/** Token-aware style object. See `@fluixi-ui/fx`. */
|
|
82
|
+
fx?: FxProp;
|
|
69
83
|
}
|
|
70
84
|
/** Clips the slides and translates the track to the active slide. */
|
|
71
|
-
export declare function CarouselViewport(props: CarouselViewportProps):
|
|
72
|
-
export interface CarouselSlideProps extends
|
|
85
|
+
export declare function CarouselViewport(props: CarouselViewportProps): ComponentChild;
|
|
86
|
+
export interface CarouselSlideProps extends HTMLAttributes<HTMLDivElement> {
|
|
87
|
+
/** Token-aware style object. See `@fluixi-ui/fx`. */
|
|
88
|
+
fx?: FxProp;
|
|
73
89
|
}
|
|
74
90
|
/** A single slide; registers with the carousel so counts and dots stay in sync. */
|
|
75
|
-
export declare function CarouselSlide(props: CarouselSlideProps):
|
|
76
|
-
export interface
|
|
91
|
+
export declare function CarouselSlide(props: CarouselSlideProps): ComponentChild;
|
|
92
|
+
export interface CarouselControlsProps extends HTMLAttributes<HTMLDivElement> {
|
|
93
|
+
/** Token-aware style object. See `@fluixi-ui/fx`. */
|
|
94
|
+
fx?: FxProp;
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* Lays out the carousel's controls: previous, dots, next.
|
|
98
|
+
*
|
|
99
|
+
* Without it every consumer hand-rolls a flex row, and they tend to end up flush
|
|
100
|
+
* against the carousel's edges. In `overlay` mode this becomes a transparent
|
|
101
|
+
* layer over the slides — it stops reserving height, and only the controls
|
|
102
|
+
* themselves take pointer events, so a drag still starts on the slide beneath.
|
|
103
|
+
*
|
|
104
|
+
* @example
|
|
105
|
+
* ```tsx
|
|
106
|
+
* <Carousel overlay>
|
|
107
|
+
* <CarouselViewport>…</CarouselViewport>
|
|
108
|
+
* <CarouselControls>
|
|
109
|
+
* <CarouselPrevious />
|
|
110
|
+
* <CarouselDots />
|
|
111
|
+
* <CarouselNext />
|
|
112
|
+
* </CarouselControls>
|
|
113
|
+
* </Carousel>
|
|
114
|
+
* ```
|
|
115
|
+
*/
|
|
116
|
+
export declare function CarouselControls(props: CarouselControlsProps): ComponentChild;
|
|
117
|
+
export interface CarouselButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
118
|
+
/** Token-aware style object. See `@fluixi-ui/fx`. */
|
|
119
|
+
fx?: FxProp;
|
|
77
120
|
}
|
|
78
121
|
/** Moves to the previous slide; disabled at the start unless the carousel loops. */
|
|
79
|
-
export declare function CarouselPrevious(props: CarouselButtonProps):
|
|
122
|
+
export declare function CarouselPrevious(props: CarouselButtonProps): ComponentChild;
|
|
80
123
|
/** Moves to the next slide; disabled at the end unless the carousel loops. */
|
|
81
|
-
export declare function CarouselNext(props: CarouselButtonProps):
|
|
82
|
-
export interface CarouselDotsProps extends Omit<
|
|
124
|
+
export declare function CarouselNext(props: CarouselButtonProps): ComponentChild;
|
|
125
|
+
export interface CarouselDotsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
83
126
|
}
|
|
84
127
|
/** One clickable dot per slide, reflecting and setting the active index. */
|
|
85
|
-
export declare function CarouselDots(props: CarouselDotsProps):
|
|
128
|
+
export declare function CarouselDots(props: CarouselDotsProps): ComponentChild;
|
|
86
129
|
//# sourceMappingURL=carousel.d.ts.map
|
package/dist/carousel.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../src/carousel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../src/carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,MAAM,EAAE,MAAM,eAAe,CAAC;AAErD,OAAO,EAAE,KAAK,QAAQ,EAAyC,MAAM,yBAAyB,CAAC;AAE/F,OAAO,EAQL,KAAK,WAAW,EACjB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAoB,KAAK,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAC/F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEnF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACxB,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACxB,WAAW,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC;IACnC,IAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IACxB,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC/B,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC3B,UAAU,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IACvC,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC9B,WAAW,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,GAAG,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CACvB;AAED,QAAA,MAAyB,kBAAkB,4BAAuD,CAAC;AAEnG,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAE9B,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACrF,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qDAAqD;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,2CAA2C;IAC3C,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,uDAAuD;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC5B,oEAAoE;IACpE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+EAA+E;IAC/E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,cAAc,CA4K7D;AAED,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,qEAAqE;AACrE,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,cAAc,CAkG7E;AAED,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,mFAAmF;AACnF,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,cAAc,CAmDvE;AAED,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,cAAc,CAY7E;AAED,MAAM,WAAW,mBAAoB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAClF,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,oFAAoF;AACpF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,mBAAmB,GAAG,cAAc,CAyB3E;AAED,8EAA8E;AAC9E,wBAAgB,YAAY,CAAC,KAAK,EAAE,mBAAmB,GAAG,cAAc,CAsBvE;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;CAAG;AAE9F,4EAA4E;AAC5E,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,cAAc,CAmBrE"}
|