@fox-dls/carousels 1.0.3 → 1.0.4

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/index.js CHANGED
@@ -1,10 +1,17 @@
1
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
- import React, { useRef, useState } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import SwiperCore, { Navigation, Pagination } from 'swiper';
5
- import { Swiper, SwiperSlide } from 'swiper/react';
6
- import ButtonUnstyled from '@mui/core/ButtonUnstyled';
7
- import { Container } from '@fox-dls/layout';
1
+ var jsxRuntime = require('react/jsx-runtime');
2
+ var React = require('react');
3
+ var styled = require('styled-components');
4
+ var SwiperCore = require('swiper');
5
+ var react = require('swiper/react');
6
+ var ButtonUnstyled = require('@mui/core/ButtonUnstyled');
7
+ var layout = require('@fox-dls/layout');
8
+
9
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
+
11
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
+ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
+ var SwiperCore__default = /*#__PURE__*/_interopDefaultLegacy(SwiperCore);
14
+ var ButtonUnstyled__default = /*#__PURE__*/_interopDefaultLegacy(ButtonUnstyled);
8
15
 
9
16
  function _extends() {
10
17
  _extends = Object.assign || function (target) {
@@ -48,15 +55,15 @@ function _taggedTemplateLiteralLoose(strings, raw) {
48
55
  return strings;
49
56
  }
50
57
 
51
- var CarouselSwiper$3 = /*#__PURE__*/styled(Swiper).withConfig({
58
+ var CarouselSwiper$3 = /*#__PURE__*/styled__default["default"](react.Swiper).withConfig({
52
59
  displayName: "styles__CarouselSwiper",
53
60
  componentId: "sc-1sue7gh-1"
54
61
  })(["margin:0px !important;.swiper-wrapper{.swiper-slide{scroll-snap-align:start !important;width:auto !important;}}"]);
55
- var CarouselPillContainer = /*#__PURE__*/styled.div.withConfig({
62
+ var CarouselPillContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
56
63
  displayName: "styles__CarouselPillContainer",
57
64
  componentId: "sc-1sue7gh-2"
58
65
  })(["display:inline-block !important;padding-right:8px !important;padding-top:4px !important;padding-bottom:4px !important;"]);
59
- var CarouselPill$1 = /*#__PURE__*/styled(ButtonUnstyled).withConfig({
66
+ var CarouselPill$1 = /*#__PURE__*/styled__default["default"](ButtonUnstyled__default["default"]).withConfig({
60
67
  displayName: "styles__CarouselPill",
61
68
  componentId: "sc-1sue7gh-3"
62
69
  })(["-webkit-box-pack:center !important;-webkit-box-align:center !important;appearance:none !important;display:inline-flex !important;border-radius:50% !important;border:1px solid rgb(221,221,221) !important;outline:none !important;margin:0px !important;padding:0px !important;color:rgb(34,34,34) !important;cursor:pointer !important;touch-action:manipulation !important;position:relative !important;background:transparent !important;transition:-ms-transform 0.25s ease 0s,-webkit-transform 0.25s ease 0s,transform 0.25s ease 0s !important;align-items:center !important;justify-content:center !important;width:36px !important;height:36px !important;::before{content:'' !important;display:block !important;position:absolute !important;top:50% !important;left:50% !important;transform:translate(-50%,-50%) !important;width:36px !important;height:36px !important;border-radius:50% !important;border:1px solid rgb(221,221,221) !important;}"]);
@@ -64,16 +71,16 @@ var CarouselPill$1 = /*#__PURE__*/styled(ButtonUnstyled).withConfig({
64
71
  var _templateObject, _templateObject2;
65
72
 
66
73
  var _excluded$3 = ["children", "navigation", "title", "controls", "arrows"];
67
- SwiperCore.use([Navigation]);
74
+ SwiperCore__default["default"].use([SwiperCore.Navigation]);
68
75
  var PillsCarousel = function PillsCarousel(_ref) {
69
76
  var children = _ref.children,
70
77
  arrows = _ref.arrows,
71
78
  props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
72
79
 
73
- var prevRef = useRef(null);
74
- var nextRef = useRef(null);
80
+ var prevRef = React.useRef(null);
81
+ var nextRef = React.useRef(null);
75
82
 
76
- var _useState = useState({
83
+ var _useState = React.useState({
77
84
  progress: 0,
78
85
  isBeginning: true,
79
86
  isEnd: false
@@ -81,16 +88,16 @@ var PillsCarousel = function PillsCarousel(_ref) {
81
88
  swiperSlides = _useState[0],
82
89
  setSwiperSlides = _useState[1];
83
90
 
84
- var _useState2 = useState(null),
91
+ var _useState2 = React.useState(null),
85
92
  swiper = _useState2[0],
86
93
  setSwiper = _useState2[1];
87
94
 
88
- return jsxs("div", {
95
+ return jsxRuntime.jsxs("div", {
89
96
  css: "\n display: flex !important;\n position: relative !important;\n min-width: 0px !important;\n ",
90
- children: [jsx("div", {
91
- css: "\n position: absolute !important;\n left: 0px !important;\n z-index: 3 !important;\n width: 65px !important;\n background: linear-gradient(\n to right,\n rgb(255, 255, 255) 56.77%,\n rgba(255, 255, 255, 0) 94.47%\n ) !important;\n " + (swiperSlides.isBeginning && css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: none !important;\n visibility: hidden !important;\n "])))) + "\n ",
92
- children: arrows && jsx(CarouselPillContainer, {
93
- children: jsx(CarouselPill$1, {
97
+ children: [jsxRuntime.jsx("div", {
98
+ css: "\n position: absolute !important;\n left: 0px !important;\n z-index: 3 !important;\n width: 65px !important;\n background: linear-gradient(\n to right,\n rgb(255, 255, 255) 56.77%,\n rgba(255, 255, 255, 0) 94.47%\n ) !important;\n " + (swiperSlides.isBeginning && styled.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: none !important;\n visibility: hidden !important;\n "])))) + "\n ",
99
+ children: arrows && jsxRuntime.jsx(CarouselPillContainer, {
100
+ children: jsxRuntime.jsx(CarouselPill$1, {
94
101
  left: +true,
95
102
  ref: prevRef,
96
103
  "aria-label": "Previous",
@@ -98,18 +105,18 @@ var PillsCarousel = function PillsCarousel(_ref) {
98
105
  onClick: function onClick() {
99
106
  return swiper.slidePrev();
100
107
  },
101
- children: jsx("span", {
108
+ children: jsxRuntime.jsx("span", {
102
109
  css: "\n position: relative !important;\n ",
103
- children: jsx("svg", {
110
+ children: jsxRuntime.jsx("svg", {
104
111
  viewBox: "0 0 32 32",
105
112
  xmlns: "http://www.w3.org/2000/svg",
106
113
  "aria-hidden": "true",
107
114
  role: "presentation",
108
115
  focusable: "false",
109
116
  css: "\n display: block;\n fill: none;\n height: 12px;\n width: 12px;\n stroke: currentcolor;\n stroke-width: 5.33333;\n overflow: visible;\n ",
110
- children: jsx("g", {
117
+ children: jsxRuntime.jsx("g", {
111
118
  fill: "none",
112
- children: jsx("path", {
119
+ children: jsxRuntime.jsx("path", {
113
120
  d: "m20 28-11.29289322-11.2928932c-.39052429-.3905243-.39052429-1.0236893 0-1.4142136l11.29289322-11.2928932"
114
121
  }, void 0)
115
122
  }, void 0)
@@ -117,7 +124,7 @@ var PillsCarousel = function PillsCarousel(_ref) {
117
124
  }, void 0)
118
125
  }, void 0)
119
126
  }, void 0)
120
- }, void 0), jsx(CarouselSwiper$3, _extends({}, props, {
127
+ }, void 0), jsxRuntime.jsx(CarouselSwiper$3, _extends({}, props, {
121
128
  cssMode: false,
122
129
  slidesPerView: "auto",
123
130
  onInit: function onInit(swiper) {
@@ -146,18 +153,18 @@ var PillsCarousel = function PillsCarousel(_ref) {
146
153
  isEnd: swiper.isEnd
147
154
  });
148
155
  },
149
- children: React.Children.map(children, function (child) {
150
- return jsx(SwiperSlide, {
151
- children: jsx("div", {
156
+ children: React__default["default"].Children.map(children, function (child) {
157
+ return jsxRuntime.jsx(react.SwiperSlide, {
158
+ children: jsxRuntime.jsx("div", {
152
159
  css: "\n display: inline-block !important;\n white-space: nowrap !important;\n padding-right: 8px !important;\n padding-top: 4px !important;\n padding-bottom: 4px !important;\n ",
153
160
  children: child
154
161
  }, void 0)
155
162
  }, void 0);
156
163
  })
157
- }), void 0), jsx("div", {
158
- css: "\n -webkit-box-pack: end !important;\n position: absolute !important;\n right: 0px !important;\n z-index: 3 !important;\n width: 75px !important;\n display: flex !important;\n justify-content: flex-end !important;\n background: linear-gradient(\n to left,\n rgb(255, 255, 255) 56.77%,\n rgba(255, 255, 255, 0) 94.47%\n ) !important;\n " + (swiperSlides.isEnd && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n display: none !important;\n visibility: hidden !important;\n "])))) + "\n ",
159
- children: arrows && jsx(CarouselPillContainer, {
160
- children: jsx(CarouselPill$1, {
164
+ }), void 0), jsxRuntime.jsx("div", {
165
+ css: "\n -webkit-box-pack: end !important;\n position: absolute !important;\n right: 0px !important;\n z-index: 3 !important;\n width: 75px !important;\n display: flex !important;\n justify-content: flex-end !important;\n background: linear-gradient(\n to left,\n rgb(255, 255, 255) 56.77%,\n rgba(255, 255, 255, 0) 94.47%\n ) !important;\n " + (swiperSlides.isEnd && styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n display: none !important;\n visibility: hidden !important;\n "])))) + "\n ",
166
+ children: arrows && jsxRuntime.jsx(CarouselPillContainer, {
167
+ children: jsxRuntime.jsx(CarouselPill$1, {
161
168
  right: +true,
162
169
  "aria-label": "Next",
163
170
  type: "button",
@@ -165,18 +172,18 @@ var PillsCarousel = function PillsCarousel(_ref) {
165
172
  onClick: function onClick() {
166
173
  return swiper.slideNext();
167
174
  },
168
- children: jsx("span", {
175
+ children: jsxRuntime.jsx("span", {
169
176
  css: "\n position: relative !important;\n ",
170
- children: jsx("svg", {
177
+ children: jsxRuntime.jsx("svg", {
171
178
  viewBox: "0 0 32 32",
172
179
  xmlns: "http://www.w3.org/2000/svg",
173
180
  "aria-hidden": "true",
174
181
  role: "presentation",
175
182
  focusable: "false",
176
183
  css: "\n display: block;\n fill: none;\n height: 12px;\n width: 12px;\n stroke: currentcolor;\n stroke-width: 5.33333;\n overflow: visible;\n ",
177
- children: jsx("g", {
184
+ children: jsxRuntime.jsx("g", {
178
185
  fill: "none",
179
- children: jsx("path", {
186
+ children: jsxRuntime.jsx("path", {
180
187
  d: "m12 4 11.2928932 11.2928932c.3905243.3905243.3905243 1.0236893 0 1.4142136l-11.2928932 11.2928932"
181
188
  }, void 0)
182
189
  }, void 0)
@@ -188,62 +195,62 @@ var PillsCarousel = function PillsCarousel(_ref) {
188
195
  }, void 0);
189
196
  };
190
197
 
191
- var CarouselContainer = /*#__PURE__*/styled.div.withConfig({
198
+ var CarouselContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
192
199
  displayName: "styles__CarouselContainer",
193
200
  componentId: "sc-dwepxh-0"
194
201
  })(["position:relative !important;z-index:0 !important;"]);
195
- var CarouselNavbar = /*#__PURE__*/styled.div.withConfig({
202
+ var CarouselNavbar = /*#__PURE__*/styled__default["default"].div.withConfig({
196
203
  displayName: "styles__CarouselNavbar",
197
204
  componentId: "sc-dwepxh-1"
198
205
  })(["-webkit-box-pack:justify !important;-ms-flex-pack:justify !important;-webkit-box-align:center !important;-ms-flex-align:center !important;color:#222222 !important;display:-webkit-box !important;display:-moz-box !important;display:-ms-flexbox !important;display:-webkit-flex !important;display:flex !important;-webkit-align-items:center !important;align-items:center !important;-webkit-justify-content:space-between !important;justify-content:space-between !important;margin-bottom:16px !important;"]);
199
- var NavbarTitleContainer = /*#__PURE__*/styled.div.withConfig({
206
+ var NavbarTitleContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
200
207
  displayName: "styles__NavbarTitleContainer",
201
208
  componentId: "sc-dwepxh-2"
202
209
  })(["margin-right:24px !important;width:auto !important;"]);
203
- var NavbarControlsContainer = /*#__PURE__*/styled.div.withConfig({
210
+ var NavbarControlsContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
204
211
  displayName: "styles__NavbarControlsContainer",
205
212
  componentId: "sc-dwepxh-4"
206
213
  })(["display:flex !important;align-items:center !important;margin-left:auto !important;"]);
207
- var NavbarControlsQuick = /*#__PURE__*/styled.a.withConfig({
214
+ var NavbarControlsQuick = /*#__PURE__*/styled__default["default"].a.withConfig({
208
215
  displayName: "styles__NavbarControlsQuick",
209
216
  componentId: "sc-dwepxh-5"
210
217
  })(["@media (max-width:744px){display:none !important;}font-size:inherit !important;font-family:inherit !important;font-style:inherit !important;font-variant:inherit !important;line-height:inherit !important;color:#222222 !important;text-decoration:underline !important;border-radius:4px !important;font-weight:600 !important;outline:none !important;"]);
211
- var NavbarControlsSpace = /*#__PURE__*/styled.span.withConfig({
218
+ var NavbarControlsSpace = /*#__PURE__*/styled__default["default"].span.withConfig({
212
219
  displayName: "styles__NavbarControlsSpace",
213
220
  componentId: "sc-dwepxh-6"
214
221
  })(["display:inline-block !important;height:32px !important;width:1px !important;margin-right:16px !important;padding:0px !important;border:none !important;"]);
215
- var ArrowsContainer = /*#__PURE__*/styled.div.withConfig({
222
+ var ArrowsContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
216
223
  displayName: "styles__ArrowsContainer",
217
224
  componentId: "sc-dwepxh-7"
218
225
  })(["-webkit-box-align:center !important;color:rgb(34,34,34) !important;display:flex !important;align-items:center !important;margin-left:auto !important;"]);
219
- var ArrowsFlex = /*#__PURE__*/styled.div.withConfig({
226
+ var ArrowsFlex = /*#__PURE__*/styled__default["default"].div.withConfig({
220
227
  displayName: "styles__ArrowsFlex",
221
228
  componentId: "sc-dwepxh-8"
222
229
  })(["display:-webkit-box !important;display:-moz-box !important;display:-ms-flexbox !important;display:-webkit-flex !important;display:flex !important;"]);
223
- var ArrowsButton = /*#__PURE__*/styled(ButtonUnstyled).withConfig({
230
+ var ArrowsButton = /*#__PURE__*/styled__default["default"](ButtonUnstyled__default["default"]).withConfig({
224
231
  displayName: "styles__ArrowsButton",
225
232
  componentId: "sc-dwepxh-9"
226
233
  })(["-webkit-box-pack:center !important;-webkit-box-align:center !important;appearance:none !important;display:inline-flex !important;border-radius:50% !important;border:none !important;outline:none !important;margin:0px !important;padding:0px !important;color:rgb(34,34,34) !important;cursor:pointer !important;touch-action:manipulation !important;position:relative !important;background:transparent !important;transition:-ms-transform 0.25s ease 0s,-webkit-transform 0.25s ease 0s,transform 0.25s ease 0s !important;align-items:center !important;justify-content:center !important;width:32px !important;height:32px !important;:focus{box-shadow:none !important;}::before{content:'' !important;display:block !important;position:absolute !important;top:50% !important;left:50% !important;transform:translate(-50%,-50%) !important;width:32px !important;height:32px !important;border-radius:50% !important;background:rgb(255,255,255) !important;border:1px solid rgb(221,221,221) !important;}:disabled{opacity:0.5 !important;cursor:not-allowed !important;color:rgb(221,221,221) !important;transform:scale(1) !important;}:hover:not([disabled]){color:rgb(0,0,0) !important;transform:scale(1.04) !important;}"]);
227
- var ArrowsDivider = /*#__PURE__*/styled.span.withConfig({
234
+ var ArrowsDivider = /*#__PURE__*/styled__default["default"].span.withConfig({
228
235
  displayName: "styles__ArrowsDivider",
229
236
  componentId: "sc-dwepxh-10"
230
237
  })(["margin-left:8px !important;"]);
231
- var ArrowsIconClip = /*#__PURE__*/styled.span.withConfig({
238
+ var ArrowsIconClip = /*#__PURE__*/styled__default["default"].span.withConfig({
232
239
  displayName: "styles__ArrowsIconClip",
233
240
  componentId: "sc-dwepxh-11"
234
241
  })(["border:0px !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(100%) !important;clip-path:inset(100%) !important;height:1px !important;overflow:hidden !important;padding:0px !important;position:absolute !important;white-space:nowrap !important;width:1px !important;"]);
235
- var ArrowsSvg = /*#__PURE__*/styled.svg.withConfig({
242
+ var ArrowsSvg = /*#__PURE__*/styled__default["default"].svg.withConfig({
236
243
  displayName: "styles__ArrowsSvg",
237
244
  componentId: "sc-dwepxh-12"
238
245
  })(["display:block;fill:none;height:12px;width:12px;stroke:currentcolor;stroke-width:4;overflow:visible;"]);
239
246
 
240
- var CarouselSwiper$2 = /*#__PURE__*/styled(Swiper).withConfig({
247
+ var CarouselSwiper$2 = /*#__PURE__*/styled__default["default"](react.Swiper).withConfig({
241
248
  displayName: "styles__CarouselSwiper",
242
249
  componentId: "sc-1ja5jv1-0"
243
250
  })([""]);
244
251
 
245
252
  var _excluded$2 = ["children", "navigation", "title", "controls", "onShowMore"];
246
- SwiperCore.use([Navigation]);
253
+ SwiperCore__default["default"].use([SwiperCore.Navigation]);
247
254
  var CardCarousel = function CardCarousel(_ref) {
248
255
  var children = _ref.children,
249
256
  navigation = _ref.navigation,
@@ -252,54 +259,54 @@ var CardCarousel = function CardCarousel(_ref) {
252
259
  onShowMore = _ref.onShowMore,
253
260
  props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
254
261
 
255
- var prevRef = useRef(null);
256
- var nextRef = useRef(null);
257
- return jsxs(CarouselContainer, {
258
- children: [navigation && jsxs(CarouselNavbar, {
259
- children: [title && jsx(NavbarTitleContainer, {
262
+ var prevRef = React.useRef(null);
263
+ var nextRef = React.useRef(null);
264
+ return jsxRuntime.jsxs(CarouselContainer, {
265
+ children: [navigation && jsxRuntime.jsxs(CarouselNavbar, {
266
+ children: [title && jsxRuntime.jsx(NavbarTitleContainer, {
260
267
  children: title
261
- }, void 0), controls && jsxs(NavbarControlsContainer, {
262
- children: [onShowMore && jsx(NavbarControlsQuick, {
268
+ }, void 0), controls && jsxRuntime.jsxs(NavbarControlsContainer, {
269
+ children: [onShowMore && jsxRuntime.jsx(NavbarControlsQuick, {
263
270
  onClick: onShowMore,
264
271
  children: "Show More"
265
- }, void 0), jsx(NavbarControlsSpace, {}, void 0), jsx(ArrowsContainer, {
272
+ }, void 0), jsxRuntime.jsx(NavbarControlsSpace, {}, void 0), jsxRuntime.jsx(ArrowsContainer, {
266
273
  "aria-hidden": "false",
267
- children: jsxs(ArrowsFlex, {
268
- children: [jsx(ArrowsButton, {
274
+ children: jsxRuntime.jsxs(ArrowsFlex, {
275
+ children: [jsxRuntime.jsx(ArrowsButton, {
269
276
  ref: prevRef,
270
277
  "aria-label": "Previous",
271
278
  type: "button",
272
- children: jsxs("span", {
279
+ children: jsxRuntime.jsxs("span", {
273
280
  css: "\n position: relative;\n ",
274
- children: [jsx(ArrowsIconClip, {}, void 0), jsx(ArrowsSvg, {
281
+ children: [jsxRuntime.jsx(ArrowsIconClip, {}, void 0), jsxRuntime.jsx(ArrowsSvg, {
275
282
  viewBox: "0 0 32 32",
276
283
  xmlns: "http://www.w3.org/2000/svg",
277
284
  "aria-hidden": "true",
278
285
  role: "presentation",
279
286
  focusable: "false",
280
- children: jsx("g", {
287
+ children: jsxRuntime.jsx("g", {
281
288
  fill: "none",
282
- children: jsx("path", {
289
+ children: jsxRuntime.jsx("path", {
283
290
  d: "m20 28-11.29289322-11.2928932c-.39052429-.3905243-.39052429-1.0236893 0-1.4142136l11.29289322-11.2928932"
284
291
  }, void 0)
285
292
  }, void 0)
286
293
  }, void 0)]
287
294
  }, void 0)
288
- }, void 0), jsx(ArrowsDivider, {}, void 0), jsx(ArrowsButton, {
295
+ }, void 0), jsxRuntime.jsx(ArrowsDivider, {}, void 0), jsxRuntime.jsx(ArrowsButton, {
289
296
  "aria-label": "Next",
290
297
  type: "button",
291
298
  ref: nextRef,
292
- children: jsxs("span", {
299
+ children: jsxRuntime.jsxs("span", {
293
300
  css: "\n position: relative;\n ",
294
- children: [jsx(ArrowsIconClip, {}, void 0), jsx(ArrowsSvg, {
301
+ children: [jsxRuntime.jsx(ArrowsIconClip, {}, void 0), jsxRuntime.jsx(ArrowsSvg, {
295
302
  viewBox: "0 0 32 32",
296
303
  xmlns: "http://www.w3.org/2000/svg",
297
304
  "aria-hidden": "true",
298
305
  role: "presentation",
299
306
  focusable: "false",
300
- children: jsx("g", {
307
+ children: jsxRuntime.jsx("g", {
301
308
  fill: "none",
302
- children: jsx("path", {
309
+ children: jsxRuntime.jsx("path", {
303
310
  d: "m12 4 11.2928932 11.2928932c.3905243.3905243.3905243 1.0236893 0 1.4142136l-11.2928932 11.2928932"
304
311
  }, void 0)
305
312
  }, void 0)
@@ -309,7 +316,7 @@ var CardCarousel = function CardCarousel(_ref) {
309
316
  }, void 0)
310
317
  }, void 0)]
311
318
  }, void 0)]
312
- }, void 0), jsx(CarouselSwiper$2, _extends({}, props, {
319
+ }, void 0), jsxRuntime.jsx(CarouselSwiper$2, _extends({}, props, {
313
320
  onInit: function onInit(swiper) {
314
321
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
315
322
  // @ts-ignore
@@ -322,8 +329,8 @@ var CardCarousel = function CardCarousel(_ref) {
322
329
  swiper.navigation.init();
323
330
  swiper.navigation.update(); // console.log("Swiper", swiper);
324
331
  },
325
- children: React.Children.map(children, function (child) {
326
- return jsx(SwiperSlide, {
332
+ children: React__default["default"].Children.map(children, function (child) {
333
+ return jsxRuntime.jsx(react.SwiperSlide, {
327
334
  children: child
328
335
  }, void 0);
329
336
  })
@@ -331,13 +338,13 @@ var CardCarousel = function CardCarousel(_ref) {
331
338
  }, void 0);
332
339
  };
333
340
 
334
- var CarouselSwiper$1 = /*#__PURE__*/styled(Swiper).withConfig({
341
+ var CarouselSwiper$1 = /*#__PURE__*/styled__default["default"](react.Swiper).withConfig({
335
342
  displayName: "styles__CarouselSwiper",
336
343
  componentId: "sc-y1spms-0"
337
344
  })([".swiper-wrapper{box-sizing:inherit !important;@media (min-width:744px){scroll-padding:40px !important;}@media (min-width:1128px){--scroll-padding:max(80px,calc((100vw - 1600px) / 2)) !important;scroll-padding:var(--scroll-padding) !important;}scroll-snap-type:x mandatory !important;overflow-x:auto !important;display:flex !important;scroll-padding:24px !important;.swiper-slide{@media (min-width:744px){min-width:476px !important;max-width:588px !important;flex:1 0 calc((100% - 80px) * 0.75) !important;}@media (min-width:1128px){flex:1 0 calc(50% - 88px) !important;}margin-left:16px !important;flex:1 0 calc(100% - 84px) !important;scroll-snap-align:start !important;scroll-snap-stop:always !important;}.swiper-slide:first-of-type{@media (min-width:744px){padding-left:40px !important;min-width:calc(516px) !important;max-width:calc(628px) !important;flex:1 0 calc((100% - 80px) * 0.75 + 40px) !important;}@media (min-width:1128px){max-width:calc(588px + max(80px,(100vw - 1600px) / 2)) !important;flex:1 0 calc(50% - 8px) !important;padding-left:max(80px,(100vw - 1600px) / 2) !important;}@media (min-width:2080px){max-width:calc(588px + max(80px,(100vw - 1930px) / 2)) !important;flex:1 0 calc(50% - 8px) !important;padding-left:max(80px,(100vw - 1930px) / 2) !important;}flex:1 0 calc(100% - 84px) !important;scroll-snap-align:start !important;scroll-snap-stop:always !important;margin-left:0px !important;padding-left:24px !important;}.swiper-slide:last-of-type{@media (min-width:744px){padding-right:40px !important;min-width:calc(516px) !important;max-width:calc(628px) !important;flex:1 0 calc((100% - 80px) * 0.75 + 40px) !important;}@media (min-width:1128px){max-width:calc(588px + max(80px,(100vw - 1600px) / 2)) !important;flex:1 0 calc(50% - 8px) !important;padding-right:max(80px,(100vw - 1600px) / 2) !important;}@media (min-width:2080px){max-width:calc(588px + max(80px,(100vw - 1930px) / 2)) !important;flex:1 0 calc(50% - 8px) !important;padding-right:max(80px,(100vw - 1930px) / 2) !important;}margin-left:16px !important;flex:1 0 calc(100% - 84px) !important;scroll-snap-align:start !important;scroll-snap-stop:always !important;padding-right:24px !important;}}"]);
338
345
 
339
346
  var _excluded$1 = ["children", "navigation", "title", "controls", "quickLink", "onShowMore"];
340
- SwiperCore.use([Navigation]);
347
+ SwiperCore__default["default"].use([SwiperCore.Navigation]);
341
348
  var FreeCarousel = function FreeCarousel(_ref) {
342
349
  var children = _ref.children,
343
350
  navigation = _ref.navigation,
@@ -346,57 +353,57 @@ var FreeCarousel = function FreeCarousel(_ref) {
346
353
  onShowMore = _ref.onShowMore,
347
354
  props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
348
355
 
349
- var prevRef = useRef(null);
350
- var nextRef = useRef(null);
351
- return jsxs(CarouselContainer, {
352
- children: [jsx("div", {
356
+ var prevRef = React.useRef(null);
357
+ var nextRef = React.useRef(null);
358
+ return jsxRuntime.jsxs(CarouselContainer, {
359
+ children: [jsxRuntime.jsx("div", {
353
360
  css: "\n @media (max-width: 744px) {\n display: none !important;\n }\n ",
354
- children: jsx(Container, {
355
- children: navigation && jsxs(CarouselNavbar, {
356
- children: [title && jsx(NavbarTitleContainer, {
361
+ children: jsxRuntime.jsx(layout.Container, {
362
+ children: navigation && jsxRuntime.jsxs(CarouselNavbar, {
363
+ children: [title && jsxRuntime.jsx(NavbarTitleContainer, {
357
364
  children: title
358
- }, void 0), controls && jsxs(NavbarControlsContainer, {
359
- children: [onShowMore && jsx(NavbarControlsQuick, {
365
+ }, void 0), controls && jsxRuntime.jsxs(NavbarControlsContainer, {
366
+ children: [onShowMore && jsxRuntime.jsx(NavbarControlsQuick, {
360
367
  onClick: onShowMore,
361
368
  children: "Show More"
362
- }, void 0), jsx(NavbarControlsSpace, {}, void 0), jsx(ArrowsContainer, {
369
+ }, void 0), jsxRuntime.jsx(NavbarControlsSpace, {}, void 0), jsxRuntime.jsx(ArrowsContainer, {
363
370
  "aria-hidden": "false",
364
- children: jsxs(ArrowsFlex, {
365
- children: [jsx(ArrowsButton, {
371
+ children: jsxRuntime.jsxs(ArrowsFlex, {
372
+ children: [jsxRuntime.jsx(ArrowsButton, {
366
373
  ref: prevRef,
367
374
  "aria-label": "Previous",
368
375
  type: "button",
369
- children: jsxs("span", {
376
+ children: jsxRuntime.jsxs("span", {
370
377
  css: "\n position: relative;\n ",
371
- children: [jsx(ArrowsIconClip, {}, void 0), jsx(ArrowsSvg, {
378
+ children: [jsxRuntime.jsx(ArrowsIconClip, {}, void 0), jsxRuntime.jsx(ArrowsSvg, {
372
379
  viewBox: "0 0 32 32",
373
380
  xmlns: "http://www.w3.org/2000/svg",
374
381
  "aria-hidden": "true",
375
382
  role: "presentation",
376
383
  focusable: "false",
377
- children: jsx("g", {
384
+ children: jsxRuntime.jsx("g", {
378
385
  fill: "none",
379
- children: jsx("path", {
386
+ children: jsxRuntime.jsx("path", {
380
387
  d: "m20 28-11.29289322-11.2928932c-.39052429-.3905243-.39052429-1.0236893 0-1.4142136l11.29289322-11.2928932"
381
388
  }, void 0)
382
389
  }, void 0)
383
390
  }, void 0)]
384
391
  }, void 0)
385
- }, void 0), jsx(ArrowsDivider, {}, void 0), jsx(ArrowsButton, {
392
+ }, void 0), jsxRuntime.jsx(ArrowsDivider, {}, void 0), jsxRuntime.jsx(ArrowsButton, {
386
393
  "aria-label": "Next",
387
394
  type: "button",
388
395
  ref: nextRef,
389
- children: jsxs("span", {
396
+ children: jsxRuntime.jsxs("span", {
390
397
  css: "\n position: relative;\n ",
391
- children: [jsx(ArrowsIconClip, {}, void 0), jsx(ArrowsSvg, {
398
+ children: [jsxRuntime.jsx(ArrowsIconClip, {}, void 0), jsxRuntime.jsx(ArrowsSvg, {
392
399
  viewBox: "0 0 32 32",
393
400
  xmlns: "http://www.w3.org/2000/svg",
394
401
  "aria-hidden": "true",
395
402
  role: "presentation",
396
403
  focusable: "false",
397
- children: jsx("g", {
404
+ children: jsxRuntime.jsx("g", {
398
405
  fill: "none",
399
- children: jsx("path", {
406
+ children: jsxRuntime.jsx("path", {
400
407
  d: "m12 4 11.2928932 11.2928932c.3905243.3905243.3905243 1.0236893 0 1.4142136l-11.2928932 11.2928932"
401
408
  }, void 0)
402
409
  }, void 0)
@@ -408,7 +415,7 @@ var FreeCarousel = function FreeCarousel(_ref) {
408
415
  }, void 0)]
409
416
  }, void 0)
410
417
  }, void 0)
411
- }, void 0), jsx(CarouselSwiper$1, _extends({}, props, {
418
+ }, void 0), jsxRuntime.jsx(CarouselSwiper$1, _extends({}, props, {
412
419
  cssMode: true,
413
420
  onInit: function onInit(swiper) {
414
421
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -422,8 +429,8 @@ var FreeCarousel = function FreeCarousel(_ref) {
422
429
  swiper.navigation.init();
423
430
  swiper.navigation.update(); // console.log("Swiper", swiper);
424
431
  },
425
- children: React.Children.map(children, function (child) {
426
- return jsx(SwiperSlide, {
432
+ children: React__default["default"].Children.map(children, function (child) {
433
+ return jsxRuntime.jsx(react.SwiperSlide, {
427
434
  children: child
428
435
  }, void 0);
429
436
  })
@@ -431,63 +438,63 @@ var FreeCarousel = function FreeCarousel(_ref) {
431
438
  }, void 0);
432
439
  };
433
440
 
434
- var CarouselSwiper = /*#__PURE__*/styled(Swiper).withConfig({
441
+ var CarouselSwiper = /*#__PURE__*/styled__default["default"](react.Swiper).withConfig({
435
442
  displayName: "styles__CarouselSwiper",
436
443
  componentId: "sc-jtjv4e-1"
437
444
  })(["height:100%;.swiper-pagination{.swiper-pagination-bullet-active{background-color:#fff;}.swiper-pagination-bullet-active-next{background-color:#ffffff;}.swiper-pagination-bullet{background-color:#ffffff;}}"]);
438
- var CarouselPill = /*#__PURE__*/styled(ButtonUnstyled).withConfig({
445
+ var CarouselPill = /*#__PURE__*/styled__default["default"](ButtonUnstyled__default["default"]).withConfig({
439
446
  displayName: "styles__CarouselPill",
440
447
  componentId: "sc-jtjv4e-2"
441
448
  })([":hover{border-color:rgba(0,0,0,0.08) !important;background-color:#ffffff !important;color:#000000 !important;box-shadow:0px 0px 0px 1px transparent,0px 0px 0px 4px transparent,0px 6px 16px rgb(0 0 0 / 12%) !important;-webkit-transform:scale(1.04) !important;-ms-transform:scale(1.04) !important;transform:scale(1.04) !important;}-webkit-box-pack:center !important;-ms-flex-pack:center !important;-webkit-box-align:center !important;-ms-flex-align:center !important;-webkit-appearance:none !important;-moz-appearance:none !important;appearance:none !important;display:-webkit-inline-box !important;display:-moz-inline-box !important;display:-ms-inline-flexbox !important;display:-webkit-inline-flex !important;display:inline-flex !important;border-radius:50% !important;border:0px !important;outline:none !important;margin:0px !important;padding:0px !important;color:#222222 !important;background-color:rgba(255,255,255,0.9) !important;cursor:pointer !important;-ms-touch-action:manipulation !important;touch-action:manipulation !important;-webkit-align-items:center !important;align-items:center !important;-webkit-justify-content:center !important;justify-content:center !important;border-style:solid !important;border-width:1px !important;background-clip:padding-box !important;border-color:rgba(0,0,0,0.08) !important;box-shadow:0px 0px 0px 1px transparent,0px 0px 0px 4px transparent,0px 2px 4px rgb(0 0 0 / 18%) !important;-webkit-transition:-webkit-transform 0.25s ease,transform 0.25s ease !important;-moz-transition:transform 0.25s ease !important;transition:-ms-transform 0.25s ease,-webkit-transform 0.25s ease,transform 0.25s ease !important;width:32px !important;height:32px !important;"]);
442
- var CarouselPillSvg = /*#__PURE__*/styled.svg.withConfig({
449
+ var CarouselPillSvg = /*#__PURE__*/styled__default["default"].svg.withConfig({
443
450
  displayName: "styles__CarouselPillSvg",
444
451
  componentId: "sc-jtjv4e-3"
445
452
  })(["height:10px;width:10px;display:block;fill:currentcolor;"]);
446
453
 
447
454
  var _excluded = ["children", "navigation", "title", "controls"];
448
- SwiperCore.use([Navigation, Pagination]);
455
+ SwiperCore__default["default"].use([SwiperCore.Navigation, SwiperCore.Pagination]);
449
456
  var PaginationCarousel = function PaginationCarousel(_ref) {
450
457
  var children = _ref.children,
451
458
  props = _objectWithoutPropertiesLoose(_ref, _excluded);
452
459
 
453
- var prevRef = useRef(null);
454
- var nextRef = useRef(null);
455
- return jsxs(Fragment, {
456
- children: [jsx("div", {
460
+ var prevRef = React.useRef(null);
461
+ var nextRef = React.useRef(null);
462
+ return jsxRuntime.jsxs(jsxRuntime.Fragment, {
463
+ children: [jsxRuntime.jsx("div", {
457
464
  css: "\n @keyframes fadein {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n }\n position: absolute !important;\n top: 50% !important;\n pointer-events: auto !important;\n transform: translateY(-50%) !important;\n left: 8px !important;\n animation-duration: 0.3s !important;\n animation-name: fadein !important;\n z-index: 180 !important;\n opacity: 0 !important;\n :hover {\n opacity: 1 !important;\n }\n ",
458
- children: jsx(CarouselPill, {
465
+ children: jsxRuntime.jsx(CarouselPill, {
459
466
  ref: prevRef,
460
- children: jsx("span", {
467
+ children: jsxRuntime.jsx("span", {
461
468
  css: "\n position: relative !important;\n ",
462
- children: jsx(CarouselPillSvg, {
469
+ children: jsxRuntime.jsx(CarouselPillSvg, {
463
470
  viewBox: "0 0 16 16",
464
471
  role: "presentation",
465
472
  "aria-hidden": "true",
466
473
  focusable: "false",
467
- children: jsx("path", {
474
+ children: jsxRuntime.jsx("path", {
468
475
  d: "m10.8 16c-.4 0-.7-.1-.9-.4l-6.8-6.7c-.5-.5-.5-1.3 0-1.8l6.8-6.7c.5-.5 1.2-.5 1.7 0s .5 1.2 0 1.7l-5.8 5.9 5.8 5.9c.5.5.5 1.2 0 1.7-.2.3-.5.4-.8.4"
469
476
  }, void 0)
470
477
  }, void 0)
471
478
  }, void 0)
472
479
  }, void 0)
473
- }, void 0), jsx("div", {
480
+ }, void 0), jsxRuntime.jsx("div", {
474
481
  css: "\n @keyframes fadein {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n }\n position: absolute !important;\n top: 50% !important;\n pointer-events: auto !important;\n transform: translateY(-50%) !important;\n right: 8px !important;\n animation-duration: 0.3s !important;\n animation-name: fadein !important;\n z-index: 180 !important;\n opacity: 0 !important;\n :hover {\n opacity: 1 !important;\n }\n ",
475
- children: jsx(CarouselPill, {
482
+ children: jsxRuntime.jsx(CarouselPill, {
476
483
  ref: nextRef,
477
- children: jsx("span", {
484
+ children: jsxRuntime.jsx("span", {
478
485
  css: "\n position: relative !important;\n ",
479
- children: jsx(CarouselPillSvg, {
486
+ children: jsxRuntime.jsx(CarouselPillSvg, {
480
487
  viewBox: "0 0 16 16",
481
488
  role: "presentation",
482
489
  "aria-hidden": "true",
483
490
  focusable: "false",
484
- children: jsx("path", {
491
+ children: jsxRuntime.jsx("path", {
485
492
  d: "m5.3 16c .3 0 .6-.1.8-.4l6.8-6.7c.5-.5.5-1.3 0-1.8l-6.8-6.7c-.5-.5-1.2-.5-1.7 0s-.5 1.2 0 1.7l5.8 5.9-5.8 5.9c-.5.5-.5 1.2 0 1.7.2.3.5.4.9.4"
486
493
  }, void 0)
487
494
  }, void 0)
488
495
  }, void 0)
489
496
  }, void 0)
490
- }, void 0), jsx(CarouselSwiper, _extends({}, props, {
497
+ }, void 0), jsxRuntime.jsx(CarouselSwiper, _extends({}, props, {
491
498
  pagination: {
492
499
  dynamicBullets: true
493
500
  },
@@ -503,8 +510,8 @@ var PaginationCarousel = function PaginationCarousel(_ref) {
503
510
  swiper.navigation.init();
504
511
  swiper.navigation.update(); // console.log("Swiper", swiper);
505
512
  },
506
- children: React.Children.map(children, function (child) {
507
- return React.cloneElement(jsx(SwiperSlide, {
513
+ children: React__default["default"].Children.map(children, function (child) {
514
+ return React__default["default"].cloneElement(jsxRuntime.jsx(react.SwiperSlide, {
508
515
  children: child
509
516
  }, void 0), _extends({}, props));
510
517
  })
@@ -512,5 +519,8 @@ var PaginationCarousel = function PaginationCarousel(_ref) {
512
519
  }, void 0);
513
520
  };
514
521
 
515
- export { CardCarousel, FreeCarousel, PaginationCarousel, PillsCarousel };
522
+ exports.CardCarousel = CardCarousel;
523
+ exports.FreeCarousel = FreeCarousel;
524
+ exports.PaginationCarousel = PaginationCarousel;
525
+ exports.PillsCarousel = PillsCarousel;
516
526
  //# sourceMappingURL=index.js.map