@mantine/carousel 7.0.0-alpha.21 → 7.0.0-beta.0
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/package.json +3 -3
- package/cjs/Carousel.errors.js +0 -10
- package/cjs/Carousel.errors.js.map +0 -1
- package/cjs/Carousel.styles.js +0 -132
- package/cjs/Carousel.styles.js.map +0 -1
- package/cjs/CarouselSlide/CarouselSlide.styles.js +0 -59
- package/cjs/CarouselSlide/CarouselSlide.styles.js.map +0 -1
- package/esm/Carousel.errors.js +0 -6
- package/esm/Carousel.errors.js.map +0 -1
- package/esm/Carousel.styles.js +0 -128
- package/esm/Carousel.styles.js.map +0 -1
- package/esm/CarouselSlide/CarouselSlide.styles.js +0 -55
- package/esm/CarouselSlide/CarouselSlide.styles.js.map +0 -1
- package/lib/Carousel.errors.d.ts +0 -4
- package/lib/Carousel.errors.d.ts.map +0 -1
- package/lib/Carousel.styles.d.ts +0 -27
- package/lib/Carousel.styles.d.ts.map +0 -1
- package/lib/CarouselSlide/CarouselSlide.styles.d.ts +0 -18
- package/lib/CarouselSlide/CarouselSlide.styles.d.ts.map +0 -1
- package/lib/types.d.ts +0 -11
- package/lib/types.d.ts.map +0 -1
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mantine/carousel",
|
|
3
3
|
"description": "Embla based carousel",
|
|
4
|
-
"version": "7.0.0-
|
|
4
|
+
"version": "7.0.0-beta.0",
|
|
5
5
|
"types": "./lib/index.d.ts",
|
|
6
6
|
"exports": {
|
|
7
7
|
".": {
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"slick"
|
|
38
38
|
],
|
|
39
39
|
"peerDependencies": {
|
|
40
|
-
"@mantine/core": "7.0.0-
|
|
41
|
-
"@mantine/hooks": "7.0.0-
|
|
40
|
+
"@mantine/core": "7.0.0-beta.0",
|
|
41
|
+
"@mantine/hooks": "7.0.0-beta.0",
|
|
42
42
|
"embla-carousel-react": "^7.0.0",
|
|
43
43
|
"react": "^18.2.0"
|
|
44
44
|
},
|
package/cjs/Carousel.errors.js
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const CAROUSEL_ERRORS = {
|
|
6
|
-
context: "[@mantine/carousel] Carousel.Slide was rendered outside of Carousel context"
|
|
7
|
-
};
|
|
8
|
-
|
|
9
|
-
exports.CAROUSEL_ERRORS = CAROUSEL_ERRORS;
|
|
10
|
-
//# sourceMappingURL=Carousel.errors.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.errors.js","sources":["../src/Carousel.errors.ts"],"sourcesContent":["export const CAROUSEL_ERRORS = {\n context: '[@mantine/carousel] Carousel.Slide was rendered outside of Carousel context',\n};\n"],"names":[],"mappings":";;;;AAAY,MAAC,eAAe,GAAG;AAC/B,EAAE,OAAO,EAAE,6EAA6E;AACxF;;;;"}
|
package/cjs/Carousel.styles.js
DELETED
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var core = require('@mantine/core');
|
|
6
|
-
|
|
7
|
-
var __defProp = Object.defineProperty;
|
|
8
|
-
var __defProps = Object.defineProperties;
|
|
9
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
10
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
11
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
12
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
13
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
14
|
-
var __spreadValues = (a, b) => {
|
|
15
|
-
for (var prop in b || (b = {}))
|
|
16
|
-
if (__hasOwnProp.call(b, prop))
|
|
17
|
-
__defNormalProp(a, prop, b[prop]);
|
|
18
|
-
if (__getOwnPropSymbols)
|
|
19
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
20
|
-
if (__propIsEnum.call(b, prop))
|
|
21
|
-
__defNormalProp(a, prop, b[prop]);
|
|
22
|
-
}
|
|
23
|
-
return a;
|
|
24
|
-
};
|
|
25
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
26
|
-
var useStyles = core.createStyles((theme, {
|
|
27
|
-
controlSize,
|
|
28
|
-
controlsOffset,
|
|
29
|
-
orientation,
|
|
30
|
-
height,
|
|
31
|
-
includeGapInSize,
|
|
32
|
-
breakpoints = [],
|
|
33
|
-
slideGap
|
|
34
|
-
}) => {
|
|
35
|
-
const horizontal = orientation === "horizontal";
|
|
36
|
-
const getContainerStyles = (gap) => {
|
|
37
|
-
if (!includeGapInSize)
|
|
38
|
-
return {};
|
|
39
|
-
const slideGapValue = core.getSize({ size: gap, sizes: theme.spacing });
|
|
40
|
-
return {
|
|
41
|
-
[orientation === "horizontal" ? "marginRight" : "marginBottom"]: `calc(${slideGapValue} * -1)`
|
|
42
|
-
};
|
|
43
|
-
};
|
|
44
|
-
const hasDiff = breakpoints.some((v) => typeof v.slideGap !== "undefined" || typeof v.slideSize !== "undefined");
|
|
45
|
-
const containerBreakpoints = !hasDiff ? null : core.getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {
|
|
46
|
-
const property = "maxWidth" in breakpoint ? "max-width" : "min-width";
|
|
47
|
-
const breakpointSize = core.getSize({
|
|
48
|
-
size: property === "max-width" ? breakpoint.maxWidth : breakpoint.minWidth,
|
|
49
|
-
sizes: theme.breakpoints
|
|
50
|
-
});
|
|
51
|
-
const breakpointSlideGap = typeof breakpoint.slideGap === "undefined" ? void 0 : core.rem(breakpoint.slideGap);
|
|
52
|
-
const breakpointValue = core.getBreakpointValue(breakpointSize) - (property === "max-width" ? 1 : 0);
|
|
53
|
-
acc[`@media (${property}: ${core.rem(breakpointValue)})`] = getContainerStyles(breakpointSlideGap);
|
|
54
|
-
return acc;
|
|
55
|
-
}, {});
|
|
56
|
-
return {
|
|
57
|
-
root: {
|
|
58
|
-
position: "relative"
|
|
59
|
-
},
|
|
60
|
-
viewport: {
|
|
61
|
-
height: core.rem(height),
|
|
62
|
-
overflow: "hidden"
|
|
63
|
-
},
|
|
64
|
-
container: __spreadValues(__spreadValues({
|
|
65
|
-
display: "flex",
|
|
66
|
-
flexDirection: horizontal ? "row" : "column",
|
|
67
|
-
height: core.rem(height)
|
|
68
|
-
}, getContainerStyles(slideGap)), containerBreakpoints),
|
|
69
|
-
controls: {
|
|
70
|
-
position: "absolute",
|
|
71
|
-
zIndex: 1,
|
|
72
|
-
left: horizontal ? 0 : `calc(50% - ${core.rem(controlSize)} / 2)`,
|
|
73
|
-
right: horizontal ? 0 : void 0,
|
|
74
|
-
top: horizontal ? `calc(50% - ${core.rem(controlSize)} / 2)` : 0,
|
|
75
|
-
bottom: horizontal ? void 0 : 0,
|
|
76
|
-
display: "flex",
|
|
77
|
-
flexDirection: horizontal ? "row" : "column",
|
|
78
|
-
alignItems: "center",
|
|
79
|
-
justifyContent: "space-between",
|
|
80
|
-
paddingLeft: horizontal ? core.getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
81
|
-
paddingRight: horizontal ? core.getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
82
|
-
paddingTop: !horizontal ? core.getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
83
|
-
paddingBottom: !horizontal ? core.getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
84
|
-
pointerEvents: "none"
|
|
85
|
-
},
|
|
86
|
-
control: __spreadProps(__spreadValues({
|
|
87
|
-
display: "flex",
|
|
88
|
-
justifyContent: "center",
|
|
89
|
-
alignItems: "center",
|
|
90
|
-
minWidth: core.rem(controlSize),
|
|
91
|
-
minHeight: core.rem(controlSize),
|
|
92
|
-
borderRadius: core.rem(controlSize),
|
|
93
|
-
pointerEvents: "all",
|
|
94
|
-
backgroundColor: theme.white,
|
|
95
|
-
color: theme.black,
|
|
96
|
-
boxShadow: theme.shadows.md,
|
|
97
|
-
opacity: theme.colorScheme === "dark" ? 0.65 : 0.85,
|
|
98
|
-
border: `${core.rem(1)} solid ${theme.colors.gray[3]}`,
|
|
99
|
-
transition: `opacity 150ms ${theme.transitionTimingFunction}`
|
|
100
|
-
}, theme.fn.hover({ opacity: 1 })), {
|
|
101
|
-
"&:active": theme.activeStyles
|
|
102
|
-
}),
|
|
103
|
-
indicators: {
|
|
104
|
-
position: "absolute",
|
|
105
|
-
bottom: horizontal ? theme.spacing.md : 0,
|
|
106
|
-
top: horizontal ? void 0 : 0,
|
|
107
|
-
left: horizontal ? 0 : void 0,
|
|
108
|
-
right: horizontal ? 0 : theme.spacing.md,
|
|
109
|
-
display: "flex",
|
|
110
|
-
flexDirection: horizontal ? "row" : "column",
|
|
111
|
-
justifyContent: "center",
|
|
112
|
-
gap: core.rem(8),
|
|
113
|
-
pointerEvents: "none"
|
|
114
|
-
},
|
|
115
|
-
indicator: {
|
|
116
|
-
pointerEvents: "all",
|
|
117
|
-
width: horizontal ? core.rem(25) : core.rem(5),
|
|
118
|
-
height: horizontal ? core.rem(5) : core.rem(25),
|
|
119
|
-
borderRadius: theme.radius.xl,
|
|
120
|
-
backgroundColor: theme.white,
|
|
121
|
-
boxShadow: theme.shadows.sm,
|
|
122
|
-
opacity: 0.6,
|
|
123
|
-
transition: `opacity 150ms ${theme.transitionTimingFunction}`,
|
|
124
|
-
"&[data-active]": {
|
|
125
|
-
opacity: 1
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
};
|
|
129
|
-
});
|
|
130
|
-
|
|
131
|
-
exports.default = useStyles;
|
|
132
|
-
//# sourceMappingURL=Carousel.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.styles.js","sources":["../src/Carousel.styles.ts"],"sourcesContent":["import {\n createStyles,\n getSortedBreakpoints,\n MantineNumberSize,\n rem,\n getBreakpointValue,\n getSize,\n} from '@mantine/core';\nimport { CarouselBreakpoint } from './types';\n\nexport interface CarouselStylesParams {\n controlSize: number | string;\n controlsOffset: MantineNumberSize;\n orientation: 'vertical' | 'horizontal';\n height: React.CSSProperties['height'];\n includeGapInSize: boolean;\n breakpoints: CarouselBreakpoint[];\n slideGap: MantineNumberSize;\n}\n\nexport default createStyles(\n (\n theme,\n {\n controlSize,\n controlsOffset,\n orientation,\n height,\n includeGapInSize,\n breakpoints = [],\n slideGap,\n }: CarouselStylesParams\n ) => {\n const horizontal = orientation === 'horizontal';\n\n // Container styles by slideGap (for includeGapInSize case)\n const getContainerStyles = (gap: MantineNumberSize) => {\n if (!includeGapInSize) return {};\n\n const slideGapValue = getSize({ size: gap, sizes: theme.spacing });\n\n return {\n [orientation === 'horizontal'\n ? 'marginRight'\n : 'marginBottom']: `calc(${slideGapValue} * -1)`,\n };\n };\n\n const hasDiff = breakpoints.some(\n (v) => typeof v.slideGap !== 'undefined' || typeof v.slideSize !== 'undefined'\n );\n\n // Apply styles for breakpoints only if has different gap or size\n const containerBreakpoints = !hasDiff\n ? null\n : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {\n const property = 'maxWidth' in breakpoint ? 'max-width' : 'min-width';\n const breakpointSize = getSize({\n size: (property === 'max-width' ? breakpoint.maxWidth : breakpoint.minWidth)!,\n sizes: theme.breakpoints,\n });\n\n const breakpointSlideGap =\n typeof breakpoint.slideGap === 'undefined' ? undefined : rem(breakpoint.slideGap);\n\n const breakpointValue =\n getBreakpointValue(breakpointSize) - (property === 'max-width' ? 1 : 0);\n\n acc[`@media (${property}: ${rem(breakpointValue)})`] =\n getContainerStyles(breakpointSlideGap);\n\n return acc;\n }, {} as any);\n\n return {\n root: {\n position: 'relative',\n },\n\n viewport: {\n height: rem(height),\n overflow: 'hidden',\n },\n\n container: {\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n height: rem(height),\n ...getContainerStyles(slideGap),\n ...containerBreakpoints,\n },\n\n controls: {\n position: 'absolute',\n zIndex: 1,\n left: horizontal ? 0 : `calc(50% - ${rem(controlSize)} / 2)`,\n right: horizontal ? 0 : undefined,\n top: horizontal ? `calc(50% - ${rem(controlSize)} / 2)` : 0,\n bottom: horizontal ? undefined : 0,\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n alignItems: 'center',\n justifyContent: 'space-between',\n paddingLeft: horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingRight: horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingTop: !horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingBottom: !horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n pointerEvents: 'none',\n },\n\n control: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n minWidth: rem(controlSize),\n minHeight: rem(controlSize),\n borderRadius: rem(controlSize),\n pointerEvents: 'all',\n backgroundColor: theme.white,\n color: theme.black,\n boxShadow: theme.shadows.md,\n opacity: theme.colorScheme === 'dark' ? 0.65 : 0.85,\n border: `${rem(1)} solid ${theme.colors.gray[3]}`,\n transition: `opacity 150ms ${theme.transitionTimingFunction}`,\n ...theme.fn.hover({ opacity: 1 }),\n '&:active': theme.activeStyles,\n },\n\n indicators: {\n position: 'absolute',\n bottom: horizontal ? theme.spacing.md : 0,\n top: horizontal ? undefined : 0,\n left: horizontal ? 0 : undefined,\n right: horizontal ? 0 : theme.spacing.md,\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n justifyContent: 'center',\n gap: rem(8),\n pointerEvents: 'none',\n },\n\n indicator: {\n pointerEvents: 'all',\n width: horizontal ? rem(25) : rem(5),\n height: horizontal ? rem(5) : rem(25),\n borderRadius: theme.radius.xl,\n backgroundColor: theme.white,\n boxShadow: theme.shadows.sm,\n opacity: 0.6,\n transition: `opacity 150ms ${theme.transitionTimingFunction}`,\n\n '&[data-active]': {\n opacity: 1,\n },\n },\n };\n }\n);\n"],"names":["createStyles","getSize","getSortedBreakpoints","rem","getBreakpointValue"],"mappings":"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"}
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var core = require('@mantine/core');
|
|
6
|
-
|
|
7
|
-
var __defProp = Object.defineProperty;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
-
var __spreadValues = (a, b) => {
|
|
13
|
-
for (var prop in b || (b = {}))
|
|
14
|
-
if (__hasOwnProp.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
if (__getOwnPropSymbols)
|
|
17
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
-
if (__propIsEnum.call(b, prop))
|
|
19
|
-
__defNormalProp(a, prop, b[prop]);
|
|
20
|
-
}
|
|
21
|
-
return a;
|
|
22
|
-
};
|
|
23
|
-
var useStyles = core.createStyles((theme, { size, gap, orientation, includeGapInSize, breakpoints = [] }) => {
|
|
24
|
-
const getSlideStyles = (slideGap, slideSize) => {
|
|
25
|
-
const slideGapValue = core.getSize({
|
|
26
|
-
size: slideGap,
|
|
27
|
-
sizes: theme.spacing
|
|
28
|
-
});
|
|
29
|
-
const flexBasisValue = core.rem(slideSize);
|
|
30
|
-
const marginStyles = includeGapInSize ? {
|
|
31
|
-
[orientation === "horizontal" ? "paddingRight" : "paddingBottom"]: slideGapValue
|
|
32
|
-
} : {
|
|
33
|
-
[orientation === "horizontal" ? "marginRight" : "marginBottom"]: slideGapValue
|
|
34
|
-
};
|
|
35
|
-
return __spreadValues({
|
|
36
|
-
flex: `0 0 ${flexBasisValue}`
|
|
37
|
-
}, marginStyles);
|
|
38
|
-
};
|
|
39
|
-
const hasDiff = breakpoints.some((v) => typeof v.slideGap !== "undefined" || typeof v.slideSize !== "undefined");
|
|
40
|
-
const slideBreakpoints = !hasDiff ? null : core.getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {
|
|
41
|
-
const property = "maxWidth" in breakpoint ? "max-width" : "min-width";
|
|
42
|
-
const breakpointSize = core.getSize({
|
|
43
|
-
size: property === "max-width" ? breakpoint.maxWidth : breakpoint.minWidth,
|
|
44
|
-
sizes: theme.breakpoints
|
|
45
|
-
});
|
|
46
|
-
const breakpointGap = typeof breakpoint.slideGap === "undefined" ? gap : breakpoint.slideGap;
|
|
47
|
-
const breakpointValue = core.getBreakpointValue(breakpointSize) - (property === "max-width" ? 1 : 0);
|
|
48
|
-
acc[`@media (${property}: ${core.rem(breakpointValue)})`] = getSlideStyles(breakpointGap, breakpoint.slideSize);
|
|
49
|
-
return acc;
|
|
50
|
-
}, {});
|
|
51
|
-
return {
|
|
52
|
-
slide: __spreadValues(__spreadValues({
|
|
53
|
-
position: "relative"
|
|
54
|
-
}, getSlideStyles(gap, size)), slideBreakpoints)
|
|
55
|
-
};
|
|
56
|
-
});
|
|
57
|
-
|
|
58
|
-
exports.default = useStyles;
|
|
59
|
-
//# sourceMappingURL=CarouselSlide.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselSlide.styles.js","sources":["../../src/CarouselSlide/CarouselSlide.styles.ts"],"sourcesContent":["import {\n createStyles,\n MantineNumberSize,\n getSortedBreakpoints,\n rem,\n getBreakpointValue,\n getSize,\n} from '@mantine/core';\nimport { CarouselOrientation, CarouselBreakpoint } from '../types';\n\nexport interface CarouselSlideStylesParams {\n size: string | number;\n gap: MantineNumberSize;\n orientation: CarouselOrientation;\n includeGapInSize: boolean;\n breakpoints: CarouselBreakpoint[];\n}\n\nexport default createStyles(\n (\n theme,\n { size, gap, orientation, includeGapInSize, breakpoints = [] }: CarouselSlideStylesParams\n ) => {\n // Slide styles by slideGap and slideSize\n const getSlideStyles = (slideGap: MantineNumberSize, slideSize: string | number) => {\n const slideGapValue = getSize({\n size: slideGap,\n sizes: theme.spacing,\n });\n\n const flexBasisValue = rem(slideSize);\n\n const marginStyles = includeGapInSize\n ? {\n [orientation === 'horizontal' ? 'paddingRight' : 'paddingBottom']: slideGapValue,\n }\n : {\n [orientation === 'horizontal' ? 'marginRight' : 'marginBottom']: slideGapValue,\n };\n\n return {\n flex: `0 0 ${flexBasisValue}`,\n ...marginStyles,\n };\n };\n\n const hasDiff = breakpoints.some(\n (v) => typeof v.slideGap !== 'undefined' || typeof v.slideSize !== 'undefined'\n );\n\n // Apply styles for breakpoints only if has different gap or size\n const slideBreakpoints = !hasDiff\n ? null\n : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {\n const property = 'maxWidth' in breakpoint ? 'max-width' : 'min-width';\n const breakpointSize = getSize({\n size: property === 'max-width' ? breakpoint.maxWidth : breakpoint.minWidth,\n sizes: theme.breakpoints,\n });\n\n const breakpointGap =\n typeof breakpoint.slideGap === 'undefined' ? gap : breakpoint.slideGap;\n\n const breakpointValue =\n getBreakpointValue(breakpointSize) - (property === 'max-width' ? 1 : 0);\n\n acc[`@media (${property}: ${rem(breakpointValue)})`] = getSlideStyles(\n breakpointGap,\n breakpoint.slideSize\n );\n\n return acc;\n }, {});\n\n return {\n slide: {\n position: 'relative',\n ...getSlideStyles(gap, size),\n ...slideBreakpoints,\n },\n };\n }\n);\n"],"names":["createStyles","getSize","rem","getSortedBreakpoints","getBreakpointValue"],"mappings":"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"}
|
package/esm/Carousel.errors.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.errors.js","sources":["../src/Carousel.errors.ts"],"sourcesContent":["export const CAROUSEL_ERRORS = {\n context: '[@mantine/carousel] Carousel.Slide was rendered outside of Carousel context',\n};\n"],"names":[],"mappings":"AAAY,MAAC,eAAe,GAAG;AAC/B,EAAE,OAAO,EAAE,6EAA6E;AACxF;;;;"}
|
package/esm/Carousel.styles.js
DELETED
|
@@ -1,128 +0,0 @@
|
|
|
1
|
-
import { createStyles, getSortedBreakpoints, getSize, rem, getBreakpointValue } from '@mantine/core';
|
|
2
|
-
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
-
var __spreadValues = (a, b) => {
|
|
11
|
-
for (var prop in b || (b = {}))
|
|
12
|
-
if (__hasOwnProp.call(b, prop))
|
|
13
|
-
__defNormalProp(a, prop, b[prop]);
|
|
14
|
-
if (__getOwnPropSymbols)
|
|
15
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
-
if (__propIsEnum.call(b, prop))
|
|
17
|
-
__defNormalProp(a, prop, b[prop]);
|
|
18
|
-
}
|
|
19
|
-
return a;
|
|
20
|
-
};
|
|
21
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
22
|
-
var useStyles = createStyles((theme, {
|
|
23
|
-
controlSize,
|
|
24
|
-
controlsOffset,
|
|
25
|
-
orientation,
|
|
26
|
-
height,
|
|
27
|
-
includeGapInSize,
|
|
28
|
-
breakpoints = [],
|
|
29
|
-
slideGap
|
|
30
|
-
}) => {
|
|
31
|
-
const horizontal = orientation === "horizontal";
|
|
32
|
-
const getContainerStyles = (gap) => {
|
|
33
|
-
if (!includeGapInSize)
|
|
34
|
-
return {};
|
|
35
|
-
const slideGapValue = getSize({ size: gap, sizes: theme.spacing });
|
|
36
|
-
return {
|
|
37
|
-
[orientation === "horizontal" ? "marginRight" : "marginBottom"]: `calc(${slideGapValue} * -1)`
|
|
38
|
-
};
|
|
39
|
-
};
|
|
40
|
-
const hasDiff = breakpoints.some((v) => typeof v.slideGap !== "undefined" || typeof v.slideSize !== "undefined");
|
|
41
|
-
const containerBreakpoints = !hasDiff ? null : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {
|
|
42
|
-
const property = "maxWidth" in breakpoint ? "max-width" : "min-width";
|
|
43
|
-
const breakpointSize = getSize({
|
|
44
|
-
size: property === "max-width" ? breakpoint.maxWidth : breakpoint.minWidth,
|
|
45
|
-
sizes: theme.breakpoints
|
|
46
|
-
});
|
|
47
|
-
const breakpointSlideGap = typeof breakpoint.slideGap === "undefined" ? void 0 : rem(breakpoint.slideGap);
|
|
48
|
-
const breakpointValue = getBreakpointValue(breakpointSize) - (property === "max-width" ? 1 : 0);
|
|
49
|
-
acc[`@media (${property}: ${rem(breakpointValue)})`] = getContainerStyles(breakpointSlideGap);
|
|
50
|
-
return acc;
|
|
51
|
-
}, {});
|
|
52
|
-
return {
|
|
53
|
-
root: {
|
|
54
|
-
position: "relative"
|
|
55
|
-
},
|
|
56
|
-
viewport: {
|
|
57
|
-
height: rem(height),
|
|
58
|
-
overflow: "hidden"
|
|
59
|
-
},
|
|
60
|
-
container: __spreadValues(__spreadValues({
|
|
61
|
-
display: "flex",
|
|
62
|
-
flexDirection: horizontal ? "row" : "column",
|
|
63
|
-
height: rem(height)
|
|
64
|
-
}, getContainerStyles(slideGap)), containerBreakpoints),
|
|
65
|
-
controls: {
|
|
66
|
-
position: "absolute",
|
|
67
|
-
zIndex: 1,
|
|
68
|
-
left: horizontal ? 0 : `calc(50% - ${rem(controlSize)} / 2)`,
|
|
69
|
-
right: horizontal ? 0 : void 0,
|
|
70
|
-
top: horizontal ? `calc(50% - ${rem(controlSize)} / 2)` : 0,
|
|
71
|
-
bottom: horizontal ? void 0 : 0,
|
|
72
|
-
display: "flex",
|
|
73
|
-
flexDirection: horizontal ? "row" : "column",
|
|
74
|
-
alignItems: "center",
|
|
75
|
-
justifyContent: "space-between",
|
|
76
|
-
paddingLeft: horizontal ? getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
77
|
-
paddingRight: horizontal ? getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
78
|
-
paddingTop: !horizontal ? getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
79
|
-
paddingBottom: !horizontal ? getSize({ size: controlsOffset, sizes: theme.spacing }) : void 0,
|
|
80
|
-
pointerEvents: "none"
|
|
81
|
-
},
|
|
82
|
-
control: __spreadProps(__spreadValues({
|
|
83
|
-
display: "flex",
|
|
84
|
-
justifyContent: "center",
|
|
85
|
-
alignItems: "center",
|
|
86
|
-
minWidth: rem(controlSize),
|
|
87
|
-
minHeight: rem(controlSize),
|
|
88
|
-
borderRadius: rem(controlSize),
|
|
89
|
-
pointerEvents: "all",
|
|
90
|
-
backgroundColor: theme.white,
|
|
91
|
-
color: theme.black,
|
|
92
|
-
boxShadow: theme.shadows.md,
|
|
93
|
-
opacity: theme.colorScheme === "dark" ? 0.65 : 0.85,
|
|
94
|
-
border: `${rem(1)} solid ${theme.colors.gray[3]}`,
|
|
95
|
-
transition: `opacity 150ms ${theme.transitionTimingFunction}`
|
|
96
|
-
}, theme.fn.hover({ opacity: 1 })), {
|
|
97
|
-
"&:active": theme.activeStyles
|
|
98
|
-
}),
|
|
99
|
-
indicators: {
|
|
100
|
-
position: "absolute",
|
|
101
|
-
bottom: horizontal ? theme.spacing.md : 0,
|
|
102
|
-
top: horizontal ? void 0 : 0,
|
|
103
|
-
left: horizontal ? 0 : void 0,
|
|
104
|
-
right: horizontal ? 0 : theme.spacing.md,
|
|
105
|
-
display: "flex",
|
|
106
|
-
flexDirection: horizontal ? "row" : "column",
|
|
107
|
-
justifyContent: "center",
|
|
108
|
-
gap: rem(8),
|
|
109
|
-
pointerEvents: "none"
|
|
110
|
-
},
|
|
111
|
-
indicator: {
|
|
112
|
-
pointerEvents: "all",
|
|
113
|
-
width: horizontal ? rem(25) : rem(5),
|
|
114
|
-
height: horizontal ? rem(5) : rem(25),
|
|
115
|
-
borderRadius: theme.radius.xl,
|
|
116
|
-
backgroundColor: theme.white,
|
|
117
|
-
boxShadow: theme.shadows.sm,
|
|
118
|
-
opacity: 0.6,
|
|
119
|
-
transition: `opacity 150ms ${theme.transitionTimingFunction}`,
|
|
120
|
-
"&[data-active]": {
|
|
121
|
-
opacity: 1
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
};
|
|
125
|
-
});
|
|
126
|
-
|
|
127
|
-
export default useStyles;
|
|
128
|
-
//# sourceMappingURL=Carousel.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.styles.js","sources":["../src/Carousel.styles.ts"],"sourcesContent":["import {\n createStyles,\n getSortedBreakpoints,\n MantineNumberSize,\n rem,\n getBreakpointValue,\n getSize,\n} from '@mantine/core';\nimport { CarouselBreakpoint } from './types';\n\nexport interface CarouselStylesParams {\n controlSize: number | string;\n controlsOffset: MantineNumberSize;\n orientation: 'vertical' | 'horizontal';\n height: React.CSSProperties['height'];\n includeGapInSize: boolean;\n breakpoints: CarouselBreakpoint[];\n slideGap: MantineNumberSize;\n}\n\nexport default createStyles(\n (\n theme,\n {\n controlSize,\n controlsOffset,\n orientation,\n height,\n includeGapInSize,\n breakpoints = [],\n slideGap,\n }: CarouselStylesParams\n ) => {\n const horizontal = orientation === 'horizontal';\n\n // Container styles by slideGap (for includeGapInSize case)\n const getContainerStyles = (gap: MantineNumberSize) => {\n if (!includeGapInSize) return {};\n\n const slideGapValue = getSize({ size: gap, sizes: theme.spacing });\n\n return {\n [orientation === 'horizontal'\n ? 'marginRight'\n : 'marginBottom']: `calc(${slideGapValue} * -1)`,\n };\n };\n\n const hasDiff = breakpoints.some(\n (v) => typeof v.slideGap !== 'undefined' || typeof v.slideSize !== 'undefined'\n );\n\n // Apply styles for breakpoints only if has different gap or size\n const containerBreakpoints = !hasDiff\n ? null\n : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {\n const property = 'maxWidth' in breakpoint ? 'max-width' : 'min-width';\n const breakpointSize = getSize({\n size: (property === 'max-width' ? breakpoint.maxWidth : breakpoint.minWidth)!,\n sizes: theme.breakpoints,\n });\n\n const breakpointSlideGap =\n typeof breakpoint.slideGap === 'undefined' ? undefined : rem(breakpoint.slideGap);\n\n const breakpointValue =\n getBreakpointValue(breakpointSize) - (property === 'max-width' ? 1 : 0);\n\n acc[`@media (${property}: ${rem(breakpointValue)})`] =\n getContainerStyles(breakpointSlideGap);\n\n return acc;\n }, {} as any);\n\n return {\n root: {\n position: 'relative',\n },\n\n viewport: {\n height: rem(height),\n overflow: 'hidden',\n },\n\n container: {\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n height: rem(height),\n ...getContainerStyles(slideGap),\n ...containerBreakpoints,\n },\n\n controls: {\n position: 'absolute',\n zIndex: 1,\n left: horizontal ? 0 : `calc(50% - ${rem(controlSize)} / 2)`,\n right: horizontal ? 0 : undefined,\n top: horizontal ? `calc(50% - ${rem(controlSize)} / 2)` : 0,\n bottom: horizontal ? undefined : 0,\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n alignItems: 'center',\n justifyContent: 'space-between',\n paddingLeft: horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingRight: horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingTop: !horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n paddingBottom: !horizontal\n ? getSize({ size: controlsOffset, sizes: theme.spacing })\n : undefined,\n pointerEvents: 'none',\n },\n\n control: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n minWidth: rem(controlSize),\n minHeight: rem(controlSize),\n borderRadius: rem(controlSize),\n pointerEvents: 'all',\n backgroundColor: theme.white,\n color: theme.black,\n boxShadow: theme.shadows.md,\n opacity: theme.colorScheme === 'dark' ? 0.65 : 0.85,\n border: `${rem(1)} solid ${theme.colors.gray[3]}`,\n transition: `opacity 150ms ${theme.transitionTimingFunction}`,\n ...theme.fn.hover({ opacity: 1 }),\n '&:active': theme.activeStyles,\n },\n\n indicators: {\n position: 'absolute',\n bottom: horizontal ? theme.spacing.md : 0,\n top: horizontal ? undefined : 0,\n left: horizontal ? 0 : undefined,\n right: horizontal ? 0 : theme.spacing.md,\n display: 'flex',\n flexDirection: horizontal ? 'row' : 'column',\n justifyContent: 'center',\n gap: rem(8),\n pointerEvents: 'none',\n },\n\n indicator: {\n pointerEvents: 'all',\n width: horizontal ? rem(25) : rem(5),\n height: horizontal ? rem(5) : rem(25),\n borderRadius: theme.radius.xl,\n backgroundColor: theme.white,\n boxShadow: theme.shadows.sm,\n opacity: 0.6,\n transition: `opacity 150ms ${theme.transitionTimingFunction}`,\n\n '&[data-active]': {\n opacity: 1,\n },\n },\n };\n }\n);\n"],"names":[],"mappings":"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"}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import { createStyles, getSortedBreakpoints, getSize, getBreakpointValue, rem } from '@mantine/core';
|
|
2
|
-
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var useStyles = createStyles((theme, { size, gap, orientation, includeGapInSize, breakpoints = [] }) => {
|
|
20
|
-
const getSlideStyles = (slideGap, slideSize) => {
|
|
21
|
-
const slideGapValue = getSize({
|
|
22
|
-
size: slideGap,
|
|
23
|
-
sizes: theme.spacing
|
|
24
|
-
});
|
|
25
|
-
const flexBasisValue = rem(slideSize);
|
|
26
|
-
const marginStyles = includeGapInSize ? {
|
|
27
|
-
[orientation === "horizontal" ? "paddingRight" : "paddingBottom"]: slideGapValue
|
|
28
|
-
} : {
|
|
29
|
-
[orientation === "horizontal" ? "marginRight" : "marginBottom"]: slideGapValue
|
|
30
|
-
};
|
|
31
|
-
return __spreadValues({
|
|
32
|
-
flex: `0 0 ${flexBasisValue}`
|
|
33
|
-
}, marginStyles);
|
|
34
|
-
};
|
|
35
|
-
const hasDiff = breakpoints.some((v) => typeof v.slideGap !== "undefined" || typeof v.slideSize !== "undefined");
|
|
36
|
-
const slideBreakpoints = !hasDiff ? null : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {
|
|
37
|
-
const property = "maxWidth" in breakpoint ? "max-width" : "min-width";
|
|
38
|
-
const breakpointSize = getSize({
|
|
39
|
-
size: property === "max-width" ? breakpoint.maxWidth : breakpoint.minWidth,
|
|
40
|
-
sizes: theme.breakpoints
|
|
41
|
-
});
|
|
42
|
-
const breakpointGap = typeof breakpoint.slideGap === "undefined" ? gap : breakpoint.slideGap;
|
|
43
|
-
const breakpointValue = getBreakpointValue(breakpointSize) - (property === "max-width" ? 1 : 0);
|
|
44
|
-
acc[`@media (${property}: ${rem(breakpointValue)})`] = getSlideStyles(breakpointGap, breakpoint.slideSize);
|
|
45
|
-
return acc;
|
|
46
|
-
}, {});
|
|
47
|
-
return {
|
|
48
|
-
slide: __spreadValues(__spreadValues({
|
|
49
|
-
position: "relative"
|
|
50
|
-
}, getSlideStyles(gap, size)), slideBreakpoints)
|
|
51
|
-
};
|
|
52
|
-
});
|
|
53
|
-
|
|
54
|
-
export default useStyles;
|
|
55
|
-
//# sourceMappingURL=CarouselSlide.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselSlide.styles.js","sources":["../../src/CarouselSlide/CarouselSlide.styles.ts"],"sourcesContent":["import {\n createStyles,\n MantineNumberSize,\n getSortedBreakpoints,\n rem,\n getBreakpointValue,\n getSize,\n} from '@mantine/core';\nimport { CarouselOrientation, CarouselBreakpoint } from '../types';\n\nexport interface CarouselSlideStylesParams {\n size: string | number;\n gap: MantineNumberSize;\n orientation: CarouselOrientation;\n includeGapInSize: boolean;\n breakpoints: CarouselBreakpoint[];\n}\n\nexport default createStyles(\n (\n theme,\n { size, gap, orientation, includeGapInSize, breakpoints = [] }: CarouselSlideStylesParams\n ) => {\n // Slide styles by slideGap and slideSize\n const getSlideStyles = (slideGap: MantineNumberSize, slideSize: string | number) => {\n const slideGapValue = getSize({\n size: slideGap,\n sizes: theme.spacing,\n });\n\n const flexBasisValue = rem(slideSize);\n\n const marginStyles = includeGapInSize\n ? {\n [orientation === 'horizontal' ? 'paddingRight' : 'paddingBottom']: slideGapValue,\n }\n : {\n [orientation === 'horizontal' ? 'marginRight' : 'marginBottom']: slideGapValue,\n };\n\n return {\n flex: `0 0 ${flexBasisValue}`,\n ...marginStyles,\n };\n };\n\n const hasDiff = breakpoints.some(\n (v) => typeof v.slideGap !== 'undefined' || typeof v.slideSize !== 'undefined'\n );\n\n // Apply styles for breakpoints only if has different gap or size\n const slideBreakpoints = !hasDiff\n ? null\n : getSortedBreakpoints(theme, breakpoints).reduce((acc, breakpoint) => {\n const property = 'maxWidth' in breakpoint ? 'max-width' : 'min-width';\n const breakpointSize = getSize({\n size: property === 'max-width' ? breakpoint.maxWidth : breakpoint.minWidth,\n sizes: theme.breakpoints,\n });\n\n const breakpointGap =\n typeof breakpoint.slideGap === 'undefined' ? gap : breakpoint.slideGap;\n\n const breakpointValue =\n getBreakpointValue(breakpointSize) - (property === 'max-width' ? 1 : 0);\n\n acc[`@media (${property}: ${rem(breakpointValue)})`] = getSlideStyles(\n breakpointGap,\n breakpoint.slideSize\n );\n\n return acc;\n }, {});\n\n return {\n slide: {\n position: 'relative',\n ...getSlideStyles(gap, size),\n ...slideBreakpoints,\n },\n };\n }\n);\n"],"names":[],"mappings":"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"}
|
package/lib/Carousel.errors.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.errors.d.ts","sourceRoot":"","sources":["../src/Carousel.errors.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;CAE3B,CAAC"}
|
package/lib/Carousel.styles.d.ts
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { MantineNumberSize } from '@mantine/core';
|
|
3
|
-
import { CarouselBreakpoint } from './types';
|
|
4
|
-
export interface CarouselStylesParams {
|
|
5
|
-
controlSize: number | string;
|
|
6
|
-
controlsOffset: MantineNumberSize;
|
|
7
|
-
orientation: 'vertical' | 'horizontal';
|
|
8
|
-
height: React.CSSProperties['height'];
|
|
9
|
-
includeGapInSize: boolean;
|
|
10
|
-
breakpoints: CarouselBreakpoint[];
|
|
11
|
-
slideGap: MantineNumberSize;
|
|
12
|
-
}
|
|
13
|
-
declare const _default: (params: CarouselStylesParams, options?: import("@mantine/core").UseStylesOptions<string>) => {
|
|
14
|
-
classes: {
|
|
15
|
-
root: string;
|
|
16
|
-
viewport: string;
|
|
17
|
-
container: string;
|
|
18
|
-
controls: string;
|
|
19
|
-
control: string;
|
|
20
|
-
indicators: string;
|
|
21
|
-
indicator: string;
|
|
22
|
-
};
|
|
23
|
-
cx: (...args: any) => string;
|
|
24
|
-
theme: import("@mantine/core").MantineTheme;
|
|
25
|
-
};
|
|
26
|
-
export default _default;
|
|
27
|
-
//# sourceMappingURL=Carousel.styles.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.styles.d.ts","sourceRoot":"","sources":["../src/Carousel.styles.ts"],"names":[],"mappings":";AAAA,OAAO,EAGL,iBAAiB,EAIlB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,cAAc,EAAE,iBAAiB,CAAC;IAClC,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;IACvC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACtC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,kBAAkB,EAAE,CAAC;IAClC,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;;;;;;;;;;;;;;AAED,wBAiJE"}
|
|
@@ -1,18 +0,0 @@
|
|
|
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<string>) => {
|
|
11
|
-
classes: {
|
|
12
|
-
slide: string;
|
|
13
|
-
};
|
|
14
|
-
cx: (...args: any) => string;
|
|
15
|
-
theme: import("@mantine/core").MantineTheme;
|
|
16
|
-
};
|
|
17
|
-
export default _default;
|
|
18
|
-
//# sourceMappingURL=CarouselSlide.styles.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselSlide.styles.d.ts","sourceRoot":"","sources":["../../src/CarouselSlide/CarouselSlide.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAKlB,MAAM,eAAe,CAAC;AACvB,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,wBAgEE"}
|
package/lib/types.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { MantineNumberSize } from '@mantine/core';
|
|
2
|
-
import type { EmblaCarouselType } from 'embla-carousel-react';
|
|
3
|
-
export type Embla = EmblaCarouselType;
|
|
4
|
-
export 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
|
package/lib/types.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
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,MAAM,MAAM,KAAK,GAAG,iBAAiB,CAAC;AACtC,MAAM,MAAM,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"}
|