@mantine/carousel 5.0.0-alpha.6
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 +19 -0
- package/cjs/Carousel.context.js +12 -0
- package/cjs/Carousel.context.js.map +1 -0
- package/cjs/Carousel.errors.js +10 -0
- package/cjs/Carousel.errors.js.map +1 -0
- package/cjs/Carousel.js +235 -0
- package/cjs/Carousel.js.map +1 -0
- package/cjs/Carousel.styles.js +102 -0
- package/cjs/Carousel.styles.js.map +1 -0
- package/cjs/CarouselSlide/CarouselSlide.js +68 -0
- package/cjs/CarouselSlide/CarouselSlide.js.map +1 -0
- package/cjs/CarouselSlide/CarouselSlide.styles.js +59 -0
- package/cjs/CarouselSlide/CarouselSlide.styles.js.map +1 -0
- package/cjs/get-chevron-rotation.js +13 -0
- package/cjs/get-chevron-rotation.js.map +1 -0
- package/cjs/index.js +10 -0
- package/cjs/index.js.map +1 -0
- package/esm/Carousel.context.js +7 -0
- package/esm/Carousel.context.js.map +1 -0
- package/esm/Carousel.errors.js +6 -0
- package/esm/Carousel.errors.js.map +1 -0
- package/esm/Carousel.js +225 -0
- package/esm/Carousel.js.map +1 -0
- package/esm/Carousel.styles.js +98 -0
- package/esm/Carousel.styles.js.map +1 -0
- package/esm/CarouselSlide/CarouselSlide.js +60 -0
- package/esm/CarouselSlide/CarouselSlide.js.map +1 -0
- package/esm/CarouselSlide/CarouselSlide.styles.js +55 -0
- package/esm/CarouselSlide/CarouselSlide.styles.js.map +1 -0
- package/esm/get-chevron-rotation.js +9 -0
- package/esm/get-chevron-rotation.js.map +1 -0
- package/esm/index.js +2 -0
- package/esm/index.js.map +1 -0
- package/lib/Carousel.context.d.ts +16 -0
- package/lib/Carousel.context.d.ts.map +1 -0
- package/lib/Carousel.d.ts +69 -0
- package/lib/Carousel.d.ts.map +1 -0
- package/lib/Carousel.errors.d.ts +4 -0
- package/lib/Carousel.errors.d.ts.map +1 -0
- package/lib/Carousel.styles.d.ts +15 -0
- package/lib/Carousel.styles.d.ts.map +1 -0
- package/lib/CarouselSlide/CarouselSlide.d.ts +14 -0
- package/lib/CarouselSlide/CarouselSlide.d.ts.map +1 -0
- package/lib/CarouselSlide/CarouselSlide.styles.d.ts +16 -0
- package/lib/CarouselSlide/CarouselSlide.styles.d.ts.map +1 -0
- package/lib/get-chevron-rotation.d.ts +9 -0
- package/lib/get-chevron-rotation.d.ts.map +1 -0
- package/lib/index.d.ts +4 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/types.d.ts +11 -0
- package/lib/types.d.ts.map +1 -0
- package/package.json +33 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../src/Carousel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EAGL,YAAY,EAGZ,iBAAiB,EAEjB,SAAS,EACV,MAAM,eAAe,CAAC;AACvB,OAAyB,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACzE,OAAO,EAAE,8BAA8B,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAExF,OAAO,EAAE,mBAAmB,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAEzE,OAAO,SAAS,EAAE,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAEpE,oBAAY,mBAAmB,GAAG,wBAAwB,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAEzF,MAAM,WAAW,aACf,SAAQ,YAAY,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,EAC7D,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IACvC,oCAAoC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,0CAA0C;IAC1C,WAAW,CAAC,IAAI,IAAI,CAAC;IAErB,8CAA8C;IAC9C,eAAe,CAAC,IAAI,IAAI,CAAC;IAEzB,2BAA2B;IAC3B,WAAW,CAAC,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAEjC,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,kCAAkC;IAClC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,sGAAsG;IACtG,cAAc,CAAC,EAAE,iBAAiB,CAAC;IAEnC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B,qEAAqE;IACrE,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAE7B,iEAAiE;IACjE,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAEnC,kDAAkD;IAClD,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAElC,iEAAiE;IACjE,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAEvC,wJAAwJ;IACxJ,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE5C,0EAA0E;IAC1E,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,0FAA0F;IAC1F,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,qGAAqG;IACrG,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,yGAAyG;IACzG,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,0GAA0G;IAC1G,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,gKAAgK;IAChK,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,qFAAqF;IACrF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,0EAA0E;IAC1E,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,gCAAgC;IAChC,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAE5B,2BAA2B;IAC3B,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAElC,4BAA4B;IAC5B,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACvC;AAqBD,eAAO,MAAM,SAAS,KA2Kb,CAAC;AAKV,eAAO,MAAM,QAAQ,EAAE,8BAA8B,CACnD,aAAa,EACb;IAAE,KAAK,EAAE,OAAO,aAAa,CAAA;CAAE,CACpB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Carousel.errors.d.ts","sourceRoot":"","sources":["../src/Carousel.errors.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;CAE3B,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { MantineNumberSize } from '@mantine/core';
|
|
3
|
+
export interface CarouselStylesParams {
|
|
4
|
+
controlSize: number;
|
|
5
|
+
controlsOffset: MantineNumberSize;
|
|
6
|
+
orientation: 'vertical' | 'horizontal';
|
|
7
|
+
height: React.CSSProperties['height'];
|
|
8
|
+
}
|
|
9
|
+
declare const _default: (params: CarouselStylesParams, options?: import("@mantine/core").UseStylesOptions<"root" | "container" | "viewport" | "controls" | "control" | "indicators" | "indicator">) => {
|
|
10
|
+
classes: Record<"root" | "container" | "viewport" | "controls" | "control" | "indicators" | "indicator", string>;
|
|
11
|
+
cx: (...args: any) => string;
|
|
12
|
+
theme: import("@mantine/core").MantineTheme;
|
|
13
|
+
};
|
|
14
|
+
export default _default;
|
|
15
|
+
//# sourceMappingURL=Carousel.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Carousel.styles.d.ts","sourceRoot":"","sources":["../src/Carousel.styles.ts"],"names":[],"mappings":";AAAA,OAAO,EAAgB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEhE,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,iBAAiB,CAAC;IAClC,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;IACvC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;CACvC;;;;;;AAED,wBA0FE"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DefaultProps, Selectors, MantineNumberSize } from '@mantine/core';
|
|
3
|
+
import useStyles from './CarouselSlide.styles';
|
|
4
|
+
export declare type CarouselSlideStylesNames = Selectors<typeof useStyles>;
|
|
5
|
+
export interface CarouselSlideProps extends DefaultProps, React.ComponentPropsWithoutRef<'div'> {
|
|
6
|
+
/** Slide content */
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
/** Slide width, defaults to 100%, examples: 200px, 50% */
|
|
9
|
+
size?: string | number;
|
|
10
|
+
/** Key of theme.spacing or number to set gap between slides in px */
|
|
11
|
+
gap?: MantineNumberSize;
|
|
12
|
+
}
|
|
13
|
+
export declare const CarouselSlide: React.ForwardRefExoticComponent<CarouselSlideProps & React.RefAttributes<HTMLDivElement>>;
|
|
14
|
+
//# sourceMappingURL=CarouselSlide.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CarouselSlide.d.ts","sourceRoot":"","sources":["../../src/CarouselSlide/CarouselSlide.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAC;AACvD,OAAO,EAEL,YAAY,EACZ,SAAS,EACT,iBAAiB,EAElB,MAAM,eAAe,CAAC;AAEvB,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAE/C,oBAAY,wBAAwB,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAEnE,MAAM,WAAW,kBAAmB,SAAQ,YAAY,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC7F,oBAAoB;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,0DAA0D;IAC1D,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,qEAAqE;IACrE,GAAG,CAAC,EAAE,iBAAiB,CAAC;CACzB;AAED,eAAO,MAAM,aAAa,2FA8BzB,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { MantineNumberSize } from '@mantine/core';
|
|
2
|
+
import { CarouselOrientation, CarouselBreakpoint } from '../types';
|
|
3
|
+
export interface CarouselSlideStylesParams {
|
|
4
|
+
size: string | number;
|
|
5
|
+
gap: MantineNumberSize;
|
|
6
|
+
orientation: CarouselOrientation;
|
|
7
|
+
includeGapInSize: boolean;
|
|
8
|
+
breakpoints: CarouselBreakpoint[];
|
|
9
|
+
}
|
|
10
|
+
declare const _default: (params: CarouselSlideStylesParams, options?: import("@mantine/core").UseStylesOptions<"slide">) => {
|
|
11
|
+
classes: Record<"slide", string>;
|
|
12
|
+
cx: (...args: any) => string;
|
|
13
|
+
theme: import("@mantine/core").MantineTheme;
|
|
14
|
+
};
|
|
15
|
+
export default _default;
|
|
16
|
+
//# sourceMappingURL=CarouselSlide.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CarouselSlide.styles.d.ts","sourceRoot":"","sources":["../../src/CarouselSlide/CarouselSlide.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,iBAAiB,EAAwB,MAAM,eAAe,CAAC;AACtF,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnE,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,GAAG,EAAE,iBAAiB,CAAC;IACvB,WAAW,EAAE,mBAAmB,CAAC;IACjC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,kBAAkB,EAAE,CAAC;CACnC;;;;;;AAED,wBAyDE"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { CarouselOrientation } from './types';
|
|
2
|
+
interface Options {
|
|
3
|
+
dir: 'rtl' | 'ltr';
|
|
4
|
+
orientation: CarouselOrientation;
|
|
5
|
+
direction: 'next' | 'previous';
|
|
6
|
+
}
|
|
7
|
+
export declare function getChevronRotation({ dir, orientation, direction }: Options): number;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=get-chevron-rotation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-chevron-rotation.d.ts","sourceRoot":"","sources":["../src/get-chevron-rotation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,UAAU,OAAO;IACf,GAAG,EAAE,KAAK,GAAG,KAAK,CAAC;IACnB,WAAW,EAAE,mBAAmB,CAAC;IACjC,SAAS,EAAE,MAAM,GAAG,UAAU,CAAC;CAChC;AAED,wBAAgB,kBAAkB,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,OAAO,UAM1E"}
|
package/lib/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AACrE,YAAY,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|
package/lib/types.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { MantineNumberSize } from '@mantine/core';
|
|
2
|
+
import type { EmblaCarouselType } from 'embla-carousel-react';
|
|
3
|
+
export declare type Embla = EmblaCarouselType;
|
|
4
|
+
export declare type CarouselOrientation = 'vertical' | 'horizontal';
|
|
5
|
+
export interface CarouselBreakpoint {
|
|
6
|
+
maxWidth?: MantineNumberSize;
|
|
7
|
+
minWidth?: MantineNumberSize;
|
|
8
|
+
slideSize: string | number;
|
|
9
|
+
slideGap?: MantineNumberSize;
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,oBAAY,KAAK,GAAG,iBAAiB,CAAC;AACtC,oBAAY,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAC;AAC5D,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,SAAS,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;CAC9B"}
|
package/package.json
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@mantine/carousel",
|
|
3
|
+
"description": "Embla based carousel",
|
|
4
|
+
"version": "5.0.0-alpha.6",
|
|
5
|
+
"main": "cjs/index.js",
|
|
6
|
+
"module": "esm/index.js",
|
|
7
|
+
"types": "lib/index.d.ts",
|
|
8
|
+
"license": "MIT",
|
|
9
|
+
"author": "Vitaly Rtishchev <rtivital@gmail.com>",
|
|
10
|
+
"homepage": "https://mantine.dev/dates/getting-started/",
|
|
11
|
+
"keywords": [
|
|
12
|
+
"react",
|
|
13
|
+
"next",
|
|
14
|
+
"nextjs",
|
|
15
|
+
"ui",
|
|
16
|
+
"components",
|
|
17
|
+
"ui-kit",
|
|
18
|
+
"library",
|
|
19
|
+
"frontend",
|
|
20
|
+
"carousel",
|
|
21
|
+
"slider",
|
|
22
|
+
"slick"
|
|
23
|
+
],
|
|
24
|
+
"peerDependencies": {
|
|
25
|
+
"@mantine/core": "5.0.0-alpha.6",
|
|
26
|
+
"@mantine/utils": "5.0.0-alpha.6",
|
|
27
|
+
"@mantine/hooks": "5.0.0-alpha.6",
|
|
28
|
+
"embla-carousel-react": "6.2.0",
|
|
29
|
+
"react": ">=16.8.0"
|
|
30
|
+
},
|
|
31
|
+
"dependencies": {},
|
|
32
|
+
"devDependencies": {}
|
|
33
|
+
}
|