npm - @helpwave/hightide - Versions diffs - 0.1.17 → 0.1.19 - Mend

@helpwave/hightide 0.1.17 → 0.1.19

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.

Files changed (261) hide show

package/dist/components/layout-and-navigation/Carousel.js CHANGED Viewed

@@ -32,7 +32,7 @@ __export(Carousel_exports, {
   Carousel: () => Carousel
 });
 module.exports = __toCommonJS(Carousel_exports);
-var import_react = require("react");
+var import_react2 = require("react");
 var import_clsx2 = __toESM(require("clsx"));
 var import_lucide_react = require("lucide-react");
@@ -189,6 +189,7 @@ var LoopingArrayCalculator = class _LoopingArrayCalculator {
 };
 // src/components/user-action/Button.tsx
+var import_react = require("react");
 var import_clsx = __toESM(require("clsx"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var ButtonColorUtil = {
@@ -214,14 +215,83 @@ var ButtonUtil = {
   paddingMapping,
   iconPaddingMapping
 };
-var IconButton = ({
+var SolidButton = (0, import_react.forwardRef)(function SolidButton2({
   children,
   disabled = false,
   color = "primary",
   size = "medium",
+  startIcon,
+  endIcon,
   onClick,
   className,
   ...restProps
+}, ref) {
+  const colorClasses = {
+    primary: "bg-button-solid-primary-background text-button-solid-primary-text",
+    secondary: "bg-button-solid-secondary-background text-button-solid-secondary-text",
+    tertiary: "bg-button-solid-tertiary-background text-button-solid-tertiary-text",
+    positive: "bg-button-solid-positive-background text-button-solid-positive-text",
+    warning: "bg-button-solid-warning-background text-button-solid-warning-text",
+    negative: "bg-button-solid-negative-background text-button-solid-negative-text",
+    neutral: "bg-button-solid-neutral-background text-button-solid-neutral-text"
+  }[color];
+  const iconColorClasses = {
+    primary: "text-button-solid-primary-icon",
+    secondary: "text-button-solid-secondary-icon",
+    tertiary: "text-button-solid-tertiary-icon",
+    positive: "text-button-solid-positive-icon",
+    warning: "text-button-solid-warning-icon",
+    negative: "text-button-solid-negative-icon",
+    neutral: "text-button-solid-neutral-icon"
+  }[color];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "button",
+    {
+      ref,
+      onClick,
+      disabled,
+      className: (0, import_clsx.default)(
+        {
+          "text-disabled-text bg-disabled-background cursor-not-allowed": disabled,
+          [(0, import_clsx.default)(colorClasses, "hover:brightness-90")]: !disabled
+        },
+        ButtonUtil.paddingMapping[size],
+        className
+      ),
+      ...restProps,
+      children: [
+        startIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            className: (0, import_clsx.default)({
+              [iconColorClasses]: !disabled,
+              [`text-disabled-icon`]: disabled
+            }),
+            children: startIcon
+          }
+        ),
+        children,
+        endIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            className: (0, import_clsx.default)({
+              [iconColorClasses]: !disabled,
+              [`text-disabled-icon`]: disabled
+            }),
+            children: endIcon
+          }
+        )
+      ]
+    }
+  );
+});
+var IconButton = ({
+  children,
+  disabled = false,
+  color = "primary",
+  size = "medium",
+  className,
+  ...restProps
 }) => {
   const colorClasses = {
     primary: "bg-button-solid-primary-background text-button-solid-primary-text",
@@ -236,8 +306,7 @@ var IconButton = ({
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "button",
     {
-      onClick: disabled ? void 0 : onClick,
-      disabled: disabled || onClick === void 0,
+      disabled,
       className: (0, import_clsx.default)(
         {
           "text-disabled-text bg-disabled-background cursor-not-allowed": disabled && color !== "transparent",
@@ -280,15 +349,15 @@ var Carousel = ({
     currentPosition,
     dragState,
     animationState
-  }, setCarouselInformation] = (0, import_react.useState)({
+  }, setCarouselInformation] = (0, import_react2.useState)({
     currentPosition: 0
   });
-  const animationId = (0, import_react.useRef)(void 0);
-  const timeOut = (0, import_react.useRef)(void 0);
+  const animationId = (0, import_react2.useRef)(void 0);
+  const timeOut = (0, import_react2.useRef)(void 0);
   autoLoopingTimeOut = Math.max(0, autoLoopingTimeOut);
   const length = children.length;
   const paddingItemCount = 3;
-  const util = (0, import_react.useMemo)(() => new LoopingArrayCalculator(length, isLooping, overScrollThreshold), [length, isLooping, overScrollThreshold]);
+  const util = (0, import_react2.useMemo)(() => new LoopingArrayCalculator(length, isLooping, overScrollThreshold), [length, isLooping, overScrollThreshold]);
   const currentIndex = util.getCorrectedPosition(LoopingArrayCalculator.withoutOffset(currentPosition));
   animationTime = Math.max(200, animationTime);
   autoLoopAnimationTime = Math.max(200, autoLoopAnimationTime);
@@ -296,7 +365,7 @@ var Carousel = ({
     const baseOffset = -50 + (index - currentPosition) * 100;
     return `${baseOffset}%`;
   };
-  const animation = (0, import_react.useCallback)((time) => {
+  const animation = (0, import_react2.useCallback)((time) => {
     let keepAnimating = true;
     setCarouselInformation((state) => {
       const {
@@ -341,7 +410,7 @@ var Carousel = ({
       animationId.current = requestAnimationFrame((time1) => animation(time1));
     }
   }, [animationTime, autoLoopAnimationTime, util]);
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     if (animationState) {
       animationId.current = requestAnimationFrame(animation);
     }
@@ -363,7 +432,7 @@ var Carousel = ({
       isAutoLooping: true
     }
   }));
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     if (!animationId.current && !animationState && !dragState && !timeOut.current) {
       if (autoLoopingTimeOut > 0) {
         timeOut.current = setTimeout(() => {
@@ -495,7 +564,7 @@ var Carousel = ({
     onTouchEnd: (event) => onDragEnd(event.changedTouches[0].clientX, event.target.getBoundingClientRect().width),
     onTouchCancel: (event) => onDragEnd(event.changedTouches[0].clientX, event.target.getBoundingClientRect().width)
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "col items-center w-full gap-y-2", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex-col-2 items-center w-full", children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx2.default)(`relative w-full overflow-hidden`, heightClassName, className), children: [
       arrows && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
@@ -519,8 +588,8 @@ var Carousel = ({
           }
         )
       ] }),
-      hintNext ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx2.default)(`relative row h-full`, heightClassName), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "relative row h-full w-full px-2 overflow-hidden", children: items.map(({
+      hintNext ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx2.default)(`flex-row-2 relative h-full`, heightClassName), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex-row-2 relative h-full w-full px-2 overflow-hidden", children: items.map(({
           item,
           index
         }, listIndex) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
@@ -551,7 +620,7 @@ var Carousel = ({
     dots && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
       "div",
       {
-        className: "row items-center justify-center w-full my-2",
+        className: "flex-row-2 items-center justify-center w-full my-2",
         children: range(length).map((index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "button",
           {

package/dist/components/layout-and-navigation/Carousel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/layout-and-navigation/Carousel.tsx","../../../src/util/array.ts","../../../src/util/math.ts","../../../src/util/easeFunctions.ts","../../../src/util/loopingArray.ts","../../../src/components/user-action/Button.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport clsx from 'clsx'\nimport { ChevronLeft, ChevronRight } from 'lucide-react'\nimport { createLoopingListWithIndex, range } from '../../util/array'\nimport { clamp } from '../../util/math'\nimport { EaseFunctions } from '../../util/easeFunctions'\nimport type { Direction } from '../../util/loopingArray'\nimport { LoopingArrayCalculator } from '../../util/loopingArray'\nimport { IconButton } from '../user-action/Button'\n\n\nexport type CarouselProps = {\n children: ReactNode[],\n animationTime?: number,\n isLooping?: boolean,\n isAutoLooping?: boolean,\n autoLoopingTimeOut?: number,\n autoLoopAnimationTime?: number,\n hintNext?: boolean,\n arrows?: boolean,\n dots?: boolean,\n /*\n Percentage that is allowed to be scrolled further\n /\n overScrollThreshold?: number,\n blurColor?: string,\n className?: string,\n heightClassName?: string,\n widthClassName?: string,\n}\n\ntype ItemType = {\n item: ReactNode,\n index: number,\n}\n\ntype CarouselAnimationState = {\n targetPosition: number,\n /\n Value of either 1 or -1, 1 is forwards -1 is backwards\n /\n direction: Direction,\n startPosition: number,\n startTime?: number,\n lastUpdateTime?: number,\n isAutoLooping: boolean,\n}\n\ntype DragState = {\n startX: number,\n startTime: number,\n lastX: number,\n startIndex: number,\n}\n\ntype CarouselInformation = {\n currentPosition: number,\n dragState?: DragState,\n animationState?: CarouselAnimationState,\n}\n\nexport const Carousel = ({\n children,\n animationTime = 200,\n isLooping = false,\n isAutoLooping = false,\n autoLoopingTimeOut = 5000,\n autoLoopAnimationTime = 500,\n hintNext = false,\n arrows = false,\n dots = true,\n overScrollThreshold = 0.1,\n blurColor = 'from-background',\n className = '',\n heightClassName = 'h-96',\n widthClassName = 'w-[70%] desktop:w-1/2',\n }: CarouselProps) => {\n if (isAutoLooping && !isLooping) {\n console.error('When isAutoLooping is true, isLooping should also be true')\n isLooping = true\n }\n\n const [{\n currentPosition,\n dragState,\n animationState,\n }, setCarouselInformation] = useState<CarouselInformation>({\n currentPosition: 0,\n })\n const animationId = useRef<number \| undefined>(undefined)\n const timeOut = useRef<NodeJS.Timeout \| undefined>(undefined)\n autoLoopingTimeOut = Math.max(0, autoLoopingTimeOut)\n\n const length = children.length\n const paddingItemCount = 3 // The number of items to append left and right of the list to allow for clean transition when looping\n\n const util = useMemo(() => new LoopingArrayCalculator(length, isLooping, overScrollThreshold), [length, isLooping, overScrollThreshold])\n const currentIndex = util.getCorrectedPosition(LoopingArrayCalculator.withoutOffset(currentPosition))\n animationTime = Math.max(200, animationTime) // in ms, must be > 0\n autoLoopAnimationTime = Math.max(200, autoLoopAnimationTime)\n\n const getStyleOffset = (index: number) => {\n const baseOffset = -50 + (index - currentPosition) 100\n return `${baseOffset}%`\n }\n\n const animation = useCallback((time: number) => {\n let keepAnimating: boolean = true\n\n // Other calculation in the setState call to avoid updating the useCallback to often\n setCarouselInformation((state) => {\n const {\n animationState,\n dragState\n } = state\n if (animationState === undefined \|\| dragState !== undefined) {\n keepAnimating = false\n return state\n }\n if (!animationState.startTime \|\| !animationState.lastUpdateTime) {\n return {\n ...state,\n animationState: {\n ...animationState,\n startTime: time,\n lastUpdateTime: time\n }\n }\n }\n const useAnimationTime = animationState.isAutoLooping ? autoLoopAnimationTime : animationTime\n const progress = clamp((time - animationState.startTime) / useAnimationTime) // progress\n const easedProgress = EaseFunctions.easeInEaseOut(progress)\n const distance = util.getDistanceDirectional(animationState.startPosition, animationState.targetPosition, animationState.direction)\n const newPosition = util.getCorrectedPosition(easedProgress * distance * animationState.direction + animationState.startPosition)\n\n if (animationState.targetPosition === newPosition \|\| progress === 1) {\n keepAnimating = false\n return ({\n currentPosition: LoopingArrayCalculator.withoutOffset(newPosition),\n animationState: undefined\n })\n }\n return ({\n currentPosition: newPosition,\n animationState: {\n ...animationState!,\n lastUpdateTime: time\n }\n })\n })\n if (keepAnimating) {\n animationId.current = requestAnimationFrame(time1 => animation(time1))\n }\n }, [animationTime, autoLoopAnimationTime, util])\n\n useEffect(() => {\n if (animationState) {\n animationId.current = requestAnimationFrame(animation)\n }\n return () => {\n if (animationId.current) {\n cancelAnimationFrame(animationId.current)\n animationId.current = 0\n }\n }\n }, [animationState]) // eslint-disable-line react-hooks/exhaustive-deps\n\n const startAutoLoop = () => setCarouselInformation(prevState => ({\n ...prevState,\n dragState: prevState.dragState,\n animationState: prevState.animationState \|\| prevState.dragState ? prevState.animationState : {\n startPosition: currentPosition,\n targetPosition: (currentPosition + 1) % length,\n direction: 1, // always move forward\n isAutoLooping: true\n }\n }))\n\n useEffect(() => {\n if (!animationId.current && !animationState && !dragState && !timeOut.current) {\n if (autoLoopingTimeOut > 0) {\n timeOut.current = setTimeout(() => {\n startAutoLoop()\n timeOut.current = undefined\n }, autoLoopingTimeOut)\n } else {\n startAutoLoop()\n }\n }\n }, [animationState, dragState, animationId.current, timeOut.current]) // eslint-disable-line react-hooks/exhaustive-deps\n\n const startAnimation = (targetPosition?: number) => {\n if (targetPosition === undefined) {\n targetPosition = LoopingArrayCalculator.withoutOffset(currentPosition)\n }\n if (targetPosition === currentPosition) {\n return // we are exactly where we want to be\n }\n\n // find target index and fastest path to it\n const direction = util.getBestDirection(currentPosition, targetPosition)\n clearTimeout(timeOut.current)\n timeOut.current = undefined\n if (animationId.current) {\n cancelAnimationFrame(animationId.current)\n animationId.current = undefined\n }\n\n setCarouselInformation(prevState => ({\n ...prevState,\n dragState: undefined,\n animationState: {\n targetPosition: targetPosition!,\n direction,\n startPosition: currentPosition,\n isAutoLooping: false\n },\n timeOut: undefined\n }))\n }\n\n const canGoLeft = () => {\n return isLooping \|\| currentPosition !== 0\n }\n\n const canGoRight = () => {\n return isLooping \|\| currentPosition !== length - 1\n }\n\n const left = () => {\n if (canGoLeft()) {\n startAnimation(currentPosition === 0 ? length - 1 : LoopingArrayCalculator.withoutOffset(currentPosition - 1))\n }\n }\n\n const right = () => {\n if (canGoRight()) {\n startAnimation(LoopingArrayCalculator.withoutOffset((currentPosition + 1) % length))\n }\n }\n\n let items: ItemType[] = children.map((item, index) => ({\n index,\n item\n }))\n\n if (isLooping) {\n const before = createLoopingListWithIndex(children, length - 1, paddingItemCount, false).reverse().map(([index, item]) => ({\n index,\n item\n }))\n const after = createLoopingListWithIndex(children, 0, paddingItemCount).map(([index, item]) => ({\n index,\n item\n }))\n items = [\n ...before,\n ...items,\n ...after\n ]\n }\n\n const onDragStart = (x: number) => setCarouselInformation(prevState => ({\n ...prevState,\n dragState: {\n lastX: x,\n startX: x,\n startTime: Date.now(),\n startIndex: currentPosition,\n },\n animationState: undefined // cancel animation\n }))\n\n const onDrag = (x: number, width: number) => {\n // For some weird reason the clientX is 0 on the last dragUpdate before drag end causing issues\n if (!dragState \|\| x === 0) {\n return\n }\n const offsetUpdate = (dragState.lastX - x) / width\n const newPosition = util.getCorrectedPosition(currentPosition + offsetUpdate)\n\n setCarouselInformation(prevState => ({\n ...prevState,\n currentPosition: newPosition,\n dragState: {\n ...dragState,\n lastX: x\n },\n }))\n }\n\n const onDragEnd = (x: number, width: number) => {\n if (!dragState) {\n return\n }\n const distance = dragState.startX - x\n const relativeDistance = distance / width\n const duration = (Date.now() - dragState.startTime) // in milliseconds\n const velocity = distance / (Date.now() - dragState.startTime)\n\n const isSlide = Math.abs(velocity) > 2 \|\| (duration < 200 && (Math.abs(relativeDistance) > 0.2 \|\| Math.abs(distance) > 50))\n if (isSlide) {\n if (distance > 0 && canGoRight()) {\n right()\n return\n } else if (distance < 0 && canGoLeft()) {\n left()\n return\n }\n }\n startAnimation()\n }\n\n const dragHandlers = {\n draggable: true,\n onDragStart: (event: React.DragEvent<HTMLDivElement>) => {\n onDragStart(event.clientX)\n event.dataTransfer.setDragImage(document.createElement('div'), 0, 0)\n },\n onDrag: (event: React.DragEvent<HTMLDivElement>) => onDrag(event.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onDragEnd: (event: React.DragEvent<HTMLDivElement>) => onDragEnd(event.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchStart: (event: React.TouchEvent<HTMLDivElement>) => onDragStart(event.touches[0]!.clientX),\n onTouchMove: (event: React.TouchEvent<HTMLDivElement>) => onDrag(event.touches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchEnd: (event: React.TouchEvent<HTMLDivElement>) => onDragEnd(event.changedTouches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchCancel: (event: React.TouchEvent<HTMLDivElement>) => onDragEnd(event.changedTouches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n }\n\n return (\n <div className=\"col items-center w-full gap-y-2\">\n <div className={clsx(`relative w-full overflow-hidden`, heightClassName, className)}>\n {arrows && (\n <>\n <IconButton\n color=\"neutral\"\n className={clsx('absolute z-10 left-0 top-1/2 -translate-y-1/2 shadow-md', { hidden: !canGoLeft() })}\n disabled={!canGoLeft()}\n onClick={() => left()}\n >\n <ChevronLeft size={24}/>\n </IconButton>\n <IconButton\n color=\"neutral\"\n className={clsx('absolute z-10 right-0 top-1/2 -translate-y-1/2 shadow-md', { hidden: !canGoRight() })}\n disabled={!canGoRight()}\n onClick={() => right()}\n >\n <ChevronRight size={24}/>\n </IconButton>\n </>\n )}\n {hintNext ? (\n <div className={clsx(`relative row h-full`, heightClassName)}>\n <div className=\"relative row h-full w-full px-2 overflow-hidden\">\n {items.map(({\n item,\n index\n }, listIndex) => (\n <div\n key={listIndex}\n className={clsx(`absolute left-[50%] h-full overflow-hidden`, widthClassName, { '!cursor-grabbing': !!dragState })}\n style={{ translate: getStyleOffset(listIndex - (isLooping ? paddingItemCount : 0)) }}\n {...dragHandlers}\n onClick={() => startAnimation(index)}\n >\n {item}\n </div>\n ))}\n </div>\n <div\n className={clsx(`hidden pointer-events-none desktop:block absolute left-0 h-full w-[20%] bg-gradient-to-r to-transparent`, blurColor)}\n />\n <div\n className={clsx(`hidden pointer-events-none desktop:block absolute right-0 h-full w-[20%] bg-gradient-to-l to-transparent`, blurColor)}\n />\n </div>\n ) : (\n <div className={clsx('px-16 h-full', { '!cursor-grabbing': !!dragState })} {...dragHandlers}>\n {children[currentIndex]}\n </div>\n )}\n </div>\n {dots && (\n <div\n className=\"row items-center justify-center w-full my-2\">\n {range(length).map(index => (\n <button\n key={index}\n className={clsx('w-8 min-w-8 h-3 min-h-3 first:rounded-l-md last:rounded-r-md', {\n 'bg-carousel-dot-disabled hover:bg-carousel-dot-active': currentIndex !== index,\n 'bg-carousel-dot-active hover:brightness-90': currentIndex === index\n })}\n onClick={() => startAnimation(index)}\n />\n ))}\n </div>\n )}\n </div>\n )\n}\n","export const equalSizeGroups = <T>(array: T[], groupSize: number): T[][] => {\n if (groupSize <= 0) {\n console.warn(`group size should be greater than 0: groupSize = ${groupSize}`)\n return [[...array]]\n }\n\n const groups = []\n for (let i = 0; i < array.length; i += groupSize) {\n groups.push(array.slice(i, Math.min(i + groupSize, array.length)))\n }\n return groups\n}\n\nexport type RangeOptions = {\n /** Whether the range can be defined empty via end < start without a warning /\n allowEmptyRange: boolean,\n stepSize: number,\n exclusiveStart: boolean,\n exclusiveEnd: boolean,\n}\n\nconst defaultRangeOptions: RangeOptions = {\n allowEmptyRange: false,\n stepSize: 1,\n exclusiveStart: false,\n exclusiveEnd: true,\n}\n\n/\n @param endOrRange The end value or a range [start, end], end is exclusive\n * @param options the options for defining the range\n /\nexport const range = (endOrRange: number \| [number, number], options?: Partial<RangeOptions>): number[] => {\n const { allowEmptyRange, stepSize, exclusiveStart, exclusiveEnd } = { ...defaultRangeOptions, ...options }\n let start = 0\n let end: number\n if (typeof endOrRange === 'number') {\n end = endOrRange\n } else {\n start = endOrRange[0]\n end = endOrRange[1]\n }\n if (!exclusiveEnd) {\n end -= 1\n }\n if (exclusiveStart) {\n start += 1\n }\n\n if (end - 1 < start) {\n if (!allowEmptyRange) {\n console.warn(`range: end (${end}) < start (${start}) should be allowed explicitly, set options.allowEmptyRange to true`)\n }\n return []\n }\n return Array.from({ length: end - start }, (_, index) => index stepSize + start)\n}\n\n/** Finds the closest match\n * @param list The list of all possible matches\n * @param firstCloser Return whether item1 is closer than item2\n /\nexport const closestMatch = <T>(list: T[], firstCloser: (item1: T, item2: T) => boolean) => {\n return list.reduce((item1, item2) => {\n return firstCloser(item1, item2) ? item1 : item2\n })\n}\n\n/\n returns the item in middle of a list and its neighbours before and after\n * e.g. [1,2,3,4,5,6] for item = 1 would return [5,6,1,2,3]\n /\nexport const getNeighbours = <T>(list: T[], item: T, neighbourDistance: number = 2) => {\n const index = list.indexOf(item)\n const totalItems = neighbourDistance 2 + 1\n if (list.length < totalItems) {\n console.warn('List is to short')\n return list\n }\n\n if (index === -1) {\n console.error('item not found in list')\n return list.splice(0, totalItems)\n }\n\n let start = index - neighbourDistance\n if (start < 0) {\n start += list.length\n }\n const end = (index + neighbourDistance + 1) % list.length\n\n const result: T[] = []\n let ignoreOnce = list.length === totalItems\n for (let i = start; i !== end \|\| ignoreOnce; i = (i + 1) % list.length) {\n result.push(list[i]!)\n if (end === i && ignoreOnce) {\n ignoreOnce = false\n }\n }\n return result\n}\n\nexport const createLoopingListWithIndex = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n if (length < 0) {\n console.warn(`createLoopingList: length must be >= 0, given ${length}`)\n } else if (length === 0) {\n length = list.length\n }\n\n const returnList: [number, T][] = []\n\n if (forwards) {\n for (let i = startIndex; returnList.length < length; i = (i + 1) % list.length) {\n returnList.push([i, list[i]!])\n }\n } else {\n for (let i = startIndex; returnList.length < length; i = i === 0 ? i = list.length - 1 : i - 1) {\n returnList.push([i, list[i]!])\n }\n }\n\n return returnList\n}\n\nexport const createLoopingList = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n return createLoopingListWithIndex(list, startIndex, length, forwards).map(([_, item]) => item)\n}\n\nexport const ArrayUtil = {\n unique: <T>(list: T[]): T[] => {\n const seen = new Set<T>()\n return list.filter((item) => {\n if (seen.has(item)) {\n return false\n }\n seen.add(item)\n return true\n })\n },\n\n difference: <T>(list: T[], removeList: T[]): T[] => {\n const remove = new Set<T>(removeList)\n return list.filter((item) => !remove.has(item))\n }\n}\n","export const clamp = (value: number, min: number = 0, max: number = 1): number => {\n return Math.min(Math.max(value, min), max)\n}\n","import { clamp } from './math'\n\nexport type EaseFunction = (t: number) => number\n\nexport class EaseFunctions {\n static cubicBezierGeneric(x1: number, y1: number, x2: number, y2: number): { x: EaseFunction, y: EaseFunction } {\n // Calculate the x and y coordinates using the cubic Bézier formula\n const cx = 3 * x1\n const bx = 3 * (x2 - x1) - cx\n const ax = 1 - cx - bx\n\n const cy = 3 * y1\n const by = 3 * (y2 - y1) - cy\n const ay = 1 - cy - by\n\n // Compute x and y values at parameter t\n const x = (t: number) => ((ax * t + bx) * t + cx) * t\n const y = (t: number) => ((ay * t + by) * t + cy) * t\n\n return {\n x,\n y\n }\n }\n\n static cubicBezier(x1: number, y1: number, x2: number, y2: number): EaseFunction {\n const { y } = EaseFunctions.cubicBezierGeneric(x1, y1, x2, y2)\n return (t: number) => {\n t = clamp(t)\n return y(t) // <= equal to x(t) * 0 + y(t) * 1\n }\n }\n\n static easeInEaseOut(t: number): number {\n return EaseFunctions.cubicBezier(0.65, 0, 0.35, 1)(t)\n };\n}\n","/*\n 1 is forwards\n \n -1 is backwards\n /\nexport type Direction = 1 \| -1\n\nexport class LoopingArrayCalculator {\n length: number\n isLooping: boolean\n allowedOverScroll: number\n\n constructor(length: number, isLooping: boolean = true, allowedOverScroll: number = 0.1) {\n if (allowedOverScroll < 0 \|\| length < 1) {\n throw new Error('Invalid parameters: allowedOverScroll >= 0 and length >= 1 must be true')\n }\n\n this.length = length\n this.isLooping = isLooping\n this.allowedOverScroll = allowedOverScroll\n }\n\n getCorrectedPosition(position: number): number {\n if (!this.isLooping) {\n return Math.max(-this.allowedOverScroll, Math.min(this.allowedOverScroll + this.length - 1, position))\n }\n if (position >= this.length) {\n return position % this.length\n }\n if (position < 0) {\n return this.length - (Math.abs(position) % this.length)\n }\n return position\n }\n\n static withoutOffset(position: number): number {\n return position + LoopingArrayCalculator.getOffset(position)\n }\n\n static getOffset(position: number): number {\n return Math.round(position) - position // For example: 45.5 => 46 - 45.5 = 0.5\n }\n\n /\n @return absolute distance forwards or Infinity when the target cannot be reached (only possible when not isLooping)\n /\n getDistanceDirectional(position: number, target: number, direction: Direction): number {\n if (!this.isLooping && (position < -this.allowedOverScroll \|\| position > this.allowedOverScroll + this.length - 1)) {\n throw new Error('Invalid parameters: position is out of bounds.')\n }\n\n const isForwardInvalid = (direction === 1 && position > target)\n const isBackwardInvalid = (direction === -1 && target < position)\n\n if (!this.isLooping && (isForwardInvalid \|\| isBackwardInvalid)) {\n return Infinity\n }\n\n if (direction === -1) {\n return this.getDistanceDirectional(target, position, 1)\n }\n\n position = this.getCorrectedPosition(position)\n target = this.getCorrectedPosition(target)\n\n let distance = (target - position) direction\n if (distance < 0) {\n distance = this.length - (Math.abs(position) % this.length) + target\n }\n\n return distance\n }\n\n getDistanceForward(position: number, target: number): number {\n return this.getDistanceDirectional(position, target, 1)\n }\n\n getDistanceBackward(position: number, target: number): number {\n return this.getDistanceDirectional(position, target, -1)\n }\n\n getDistance(position: number, target: number): number {\n const forwardDistance = this.getDistanceForward(position, target)\n const backwardDistance = this.getDistanceBackward(position, target)\n\n return Math.min(forwardDistance, backwardDistance)\n }\n\n getBestDirection(position: number, target: number): Direction {\n const forwardDistance = this.getDistanceForward(position, target)\n const backwardDistance = this.getDistanceBackward(position, target)\n return forwardDistance < backwardDistance ? 1 : -1\n }\n}\n","import type { ButtonHTMLAttributes, PropsWithChildren, ReactNode } from 'react'\nimport clsx from 'clsx'\n\n\nexport const ButtonColorUtil = {\n solid: ['primary', 'secondary', 'tertiary', 'positive', 'warning', 'negative', 'neutral'] as const,\n text: ['primary', 'negative', 'neutral'] as const,\n outline: ['primary'] as const,\n}\n\nexport const IconButtonUtil = {\n icon: [...ButtonColorUtil.solid, 'transparent'] as const,\n}\n\n\n/*\n The allowed colors for the SolidButton and IconButton\n /\nexport type SolidButtonColor = typeof ButtonColorUtil.solid[number]\n/\n The allowed colors for the OutlineButton\n /\nexport type OutlineButtonColor = typeof ButtonColorUtil.outline[number]\n/\n The allowed colors for the TextButton\n /\nexport type TextButtonColor = typeof ButtonColorUtil.text[number]\n/\n The allowed colors for the IconButton\n /\nexport type IconButtonColor = typeof IconButtonUtil.icon[number]\n\n\n/\n The different sizes for a button\n /\ntype ButtonSizes = 'small' \| 'medium' \| 'large'\n\ntype IconButtonSize = 'tiny' \| 'small' \| 'medium' \| 'large'\n\n/\n The shard properties between all button types\n /\nexport type ButtonProps = PropsWithChildren<{\n /\n @default 'medium'\n /\n size?: ButtonSizes,\n}> & ButtonHTMLAttributes<Element>\n\nconst paddingMapping: Record<ButtonSizes, string> = {\n small: 'btn-sm',\n medium: 'btn-md',\n large: 'btn-lg'\n}\n\nconst iconPaddingMapping: Record<IconButtonSize, string> = {\n tiny: 'icon-btn-xs',\n small: 'icon-btn-sm',\n medium: 'icon-btn-md',\n large: 'icon-btn-lg'\n}\n\nexport const ButtonUtil = {\n paddingMapping,\n iconPaddingMapping\n}\n\ntype ButtonWithIconsProps = ButtonProps & {\n startIcon?: ReactNode,\n endIcon?: ReactNode,\n}\n\nexport type SolidButtonProps = ButtonWithIconsProps & {\n color?: SolidButtonColor,\n}\n\nexport type OutlineButtonProps = ButtonWithIconsProps & {\n color?: OutlineButtonColor,\n}\n\nexport type TextButtonProps = ButtonWithIconsProps & {\n color?: TextButtonColor,\n}\n\n/\n The shard properties between all button types\n /\nexport type IconButtonProps = PropsWithChildren<{\n /\n @default 'medium'\n /\n size?: IconButtonSize,\n color?: IconButtonColor,\n}> & ButtonHTMLAttributes<Element>\n\n/\n A button with a solid background and different sizes\n /\nconst SolidButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: SolidButtonProps) => {\n const colorClasses = {\n primary: 'bg-button-solid-primary-background text-button-solid-primary-text',\n secondary: 'bg-button-solid-secondary-background text-button-solid-secondary-text',\n tertiary: 'bg-button-solid-tertiary-background text-button-solid-tertiary-text',\n positive: 'bg-button-solid-positive-background text-button-solid-positive-text',\n warning: 'bg-button-solid-warning-background text-button-solid-warning-text',\n negative: 'bg-button-solid-negative-background text-button-solid-negative-text',\n neutral: 'bg-button-solid-neutral-background text-button-solid-neutral-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-solid-primary-icon',\n secondary: 'text-button-solid-secondary-icon',\n tertiary: 'text-button-solid-tertiary-icon',\n positive: 'text-button-solid-positive-icon',\n warning: 'text-button-solid-warning-icon',\n negative: 'text-button-solid-negative-icon',\n neutral: 'text-button-solid-neutral-icon',\n }[color]\n\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled \|\| onClick === undefined}\n className={clsx(\n {\n 'text-disabled-text bg-disabled-background cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:brightness-90')]: !disabled\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n/\n A button with an outline border and different sizes\n /\nconst OutlineButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: OutlineButtonProps) => {\n const colorClasses = {\n primary: 'bg-transparent border-2 border-button-outline-primary-text text-button-outline-primary-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-outline-primary-icon',\n }[color]\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled \|\| onClick === undefined}\n className={clsx(\n {\n 'text-disabled-text border-disabled-outline cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:brightness-80')]: !disabled,\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n/\n A text that is a button that can have different sizes\n /\nconst TextButton = ({\n children,\n disabled = false,\n color = 'neutral',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: TextButtonProps) => {\n const colorClasses = {\n primary: 'bg-transparent text-button-text-primary-text',\n negative: 'bg-transparent text-button-text-negative-text',\n neutral: 'bg-transparent text-button-text-neutral-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-text-primary-icon',\n negative: 'text-button-text-negative-icon',\n neutral: 'text-button-text-neutral-icon',\n }[color]\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled \|\| onClick === undefined}\n className={clsx(\n {\n 'text-disabled-text cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:bg-button-text-hover-background')]: !disabled,\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n\n/\n A button for icons with a solid background and different sizes\n */\nconst IconButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n onClick,\n className,\n ...restProps\n }: IconButtonProps) => {\n const colorClasses = {\n primary: 'bg-button-solid-primary-background text-button-solid-primary-text',\n secondary: 'bg-button-solid-secondary-background text-button-solid-secondary-text',\n tertiary: 'bg-button-solid-tertiary-background text-button-solid-tertiary-text',\n positive: 'bg-button-solid-positive-background text-button-solid-positive-text',\n warning: 'bg-button-solid-warning-background text-button-solid-warning-text',\n negative: 'bg-button-solid-negative-background text-button-solid-negative-text',\n neutral: 'bg-button-solid-neutral-background text-button-solid-neutral-text',\n transparent: 'bg-transparent',\n }[color]\n\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled \|\| onClick === undefined}\n className={clsx(\n {\n 'text-disabled-text bg-disabled-background cursor-not-allowed': disabled && color !== 'transparent',\n 'text-disabled-text cursor-not-allowed opacity-70': disabled && color === 'transparent',\n 'hover:bg-button-text-hover-background': !disabled && color === 'transparent',\n [clsx(colorClasses, 'hover:brightness-90')]: !disabled,\n },\n ButtonUtil.iconPaddingMapping[size],\n className\n )}\n {...restProps}\n >\n {children}\n </button>\n )\n}\n\nexport { SolidButton, OutlineButton, TextButton, IconButton }\n"],"mappings":"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","names":["import_clsx","clsx","import_jsx_runtime","animationState","dragState","clsx"]}
1	+ {"version":3,"sources":["../../../src/components/layout-and-navigation/Carousel.tsx","../../../src/util/array.ts","../../../src/util/math.ts","../../../src/util/easeFunctions.ts","../../../src/util/loopingArray.ts","../../../src/components/user-action/Button.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport clsx from 'clsx'\nimport { ChevronLeft, ChevronRight } from 'lucide-react'\nimport { createLoopingListWithIndex, range } from '../../util/array'\nimport { clamp } from '../../util/math'\nimport { EaseFunctions } from '../../util/easeFunctions'\nimport type { Direction } from '../../util/loopingArray'\nimport { LoopingArrayCalculator } from '../../util/loopingArray'\nimport { IconButton } from '../user-action/Button'\n\n\nexport type CarouselProps = {\n children: ReactNode[],\n animationTime?: number,\n isLooping?: boolean,\n isAutoLooping?: boolean,\n autoLoopingTimeOut?: number,\n autoLoopAnimationTime?: number,\n hintNext?: boolean,\n arrows?: boolean,\n dots?: boolean,\n /*\n Percentage that is allowed to be scrolled further\n /\n overScrollThreshold?: number,\n blurColor?: string,\n className?: string,\n heightClassName?: string,\n widthClassName?: string,\n}\n\ntype ItemType = {\n item: ReactNode,\n index: number,\n}\n\ntype CarouselAnimationState = {\n targetPosition: number,\n /\n Value of either 1 or -1, 1 is forwards -1 is backwards\n /\n direction: Direction,\n startPosition: number,\n startTime?: number,\n lastUpdateTime?: number,\n isAutoLooping: boolean,\n}\n\ntype DragState = {\n startX: number,\n startTime: number,\n lastX: number,\n startIndex: number,\n}\n\ntype CarouselInformation = {\n currentPosition: number,\n dragState?: DragState,\n animationState?: CarouselAnimationState,\n}\n\nexport const Carousel = ({\n children,\n animationTime = 200,\n isLooping = false,\n isAutoLooping = false,\n autoLoopingTimeOut = 5000,\n autoLoopAnimationTime = 500,\n hintNext = false,\n arrows = false,\n dots = true,\n overScrollThreshold = 0.1,\n blurColor = 'from-background',\n className = '',\n heightClassName = 'h-96',\n widthClassName = 'w-[70%] desktop:w-1/2',\n }: CarouselProps) => {\n if (isAutoLooping && !isLooping) {\n console.error('When isAutoLooping is true, isLooping should also be true')\n isLooping = true\n }\n\n const [{\n currentPosition,\n dragState,\n animationState,\n }, setCarouselInformation] = useState<CarouselInformation>({\n currentPosition: 0,\n })\n const animationId = useRef<number \| undefined>(undefined)\n const timeOut = useRef<NodeJS.Timeout \| undefined>(undefined)\n autoLoopingTimeOut = Math.max(0, autoLoopingTimeOut)\n\n const length = children.length\n const paddingItemCount = 3 // The number of items to append left and right of the list to allow for clean transition when looping\n\n const util = useMemo(() => new LoopingArrayCalculator(length, isLooping, overScrollThreshold), [length, isLooping, overScrollThreshold])\n const currentIndex = util.getCorrectedPosition(LoopingArrayCalculator.withoutOffset(currentPosition))\n animationTime = Math.max(200, animationTime) // in ms, must be > 0\n autoLoopAnimationTime = Math.max(200, autoLoopAnimationTime)\n\n const getStyleOffset = (index: number) => {\n const baseOffset = -50 + (index - currentPosition) 100\n return `${baseOffset}%`\n }\n\n const animation = useCallback((time: number) => {\n let keepAnimating: boolean = true\n\n // Other calculation in the setState call to avoid updating the useCallback to often\n setCarouselInformation((state) => {\n const {\n animationState,\n dragState\n } = state\n if (animationState === undefined \|\| dragState !== undefined) {\n keepAnimating = false\n return state\n }\n if (!animationState.startTime \|\| !animationState.lastUpdateTime) {\n return {\n ...state,\n animationState: {\n ...animationState,\n startTime: time,\n lastUpdateTime: time\n }\n }\n }\n const useAnimationTime = animationState.isAutoLooping ? autoLoopAnimationTime : animationTime\n const progress = clamp((time - animationState.startTime) / useAnimationTime) // progress\n const easedProgress = EaseFunctions.easeInEaseOut(progress)\n const distance = util.getDistanceDirectional(animationState.startPosition, animationState.targetPosition, animationState.direction)\n const newPosition = util.getCorrectedPosition(easedProgress * distance * animationState.direction + animationState.startPosition)\n\n if (animationState.targetPosition === newPosition \|\| progress === 1) {\n keepAnimating = false\n return ({\n currentPosition: LoopingArrayCalculator.withoutOffset(newPosition),\n animationState: undefined\n })\n }\n return ({\n currentPosition: newPosition,\n animationState: {\n ...animationState!,\n lastUpdateTime: time\n }\n })\n })\n if (keepAnimating) {\n animationId.current = requestAnimationFrame(time1 => animation(time1))\n }\n }, [animationTime, autoLoopAnimationTime, util])\n\n useEffect(() => {\n if (animationState) {\n animationId.current = requestAnimationFrame(animation)\n }\n return () => {\n if (animationId.current) {\n cancelAnimationFrame(animationId.current)\n animationId.current = 0\n }\n }\n }, [animationState]) // eslint-disable-line react-hooks/exhaustive-deps\n\n const startAutoLoop = () => setCarouselInformation(prevState => ({\n ...prevState,\n dragState: prevState.dragState,\n animationState: prevState.animationState \|\| prevState.dragState ? prevState.animationState : {\n startPosition: currentPosition,\n targetPosition: (currentPosition + 1) % length,\n direction: 1, // always move forward\n isAutoLooping: true\n }\n }))\n\n useEffect(() => {\n if (!animationId.current && !animationState && !dragState && !timeOut.current) {\n if (autoLoopingTimeOut > 0) {\n timeOut.current = setTimeout(() => {\n startAutoLoop()\n timeOut.current = undefined\n }, autoLoopingTimeOut)\n } else {\n startAutoLoop()\n }\n }\n }, [animationState, dragState, animationId.current, timeOut.current]) // eslint-disable-line react-hooks/exhaustive-deps\n\n const startAnimation = (targetPosition?: number) => {\n if (targetPosition === undefined) {\n targetPosition = LoopingArrayCalculator.withoutOffset(currentPosition)\n }\n if (targetPosition === currentPosition) {\n return // we are exactly where we want to be\n }\n\n // find target index and fastest path to it\n const direction = util.getBestDirection(currentPosition, targetPosition)\n clearTimeout(timeOut.current)\n timeOut.current = undefined\n if (animationId.current) {\n cancelAnimationFrame(animationId.current)\n animationId.current = undefined\n }\n\n setCarouselInformation(prevState => ({\n ...prevState,\n dragState: undefined,\n animationState: {\n targetPosition: targetPosition!,\n direction,\n startPosition: currentPosition,\n isAutoLooping: false\n },\n timeOut: undefined\n }))\n }\n\n const canGoLeft = () => {\n return isLooping \|\| currentPosition !== 0\n }\n\n const canGoRight = () => {\n return isLooping \|\| currentPosition !== length - 1\n }\n\n const left = () => {\n if (canGoLeft()) {\n startAnimation(currentPosition === 0 ? length - 1 : LoopingArrayCalculator.withoutOffset(currentPosition - 1))\n }\n }\n\n const right = () => {\n if (canGoRight()) {\n startAnimation(LoopingArrayCalculator.withoutOffset((currentPosition + 1) % length))\n }\n }\n\n let items: ItemType[] = children.map((item, index) => ({\n index,\n item\n }))\n\n if (isLooping) {\n const before = createLoopingListWithIndex(children, length - 1, paddingItemCount, false).reverse().map(([index, item]) => ({\n index,\n item\n }))\n const after = createLoopingListWithIndex(children, 0, paddingItemCount).map(([index, item]) => ({\n index,\n item\n }))\n items = [\n ...before,\n ...items,\n ...after\n ]\n }\n\n const onDragStart = (x: number) => setCarouselInformation(prevState => ({\n ...prevState,\n dragState: {\n lastX: x,\n startX: x,\n startTime: Date.now(),\n startIndex: currentPosition,\n },\n animationState: undefined // cancel animation\n }))\n\n const onDrag = (x: number, width: number) => {\n // For some weird reason the clientX is 0 on the last dragUpdate before drag end causing issues\n if (!dragState \|\| x === 0) {\n return\n }\n const offsetUpdate = (dragState.lastX - x) / width\n const newPosition = util.getCorrectedPosition(currentPosition + offsetUpdate)\n\n setCarouselInformation(prevState => ({\n ...prevState,\n currentPosition: newPosition,\n dragState: {\n ...dragState,\n lastX: x\n },\n }))\n }\n\n const onDragEnd = (x: number, width: number) => {\n if (!dragState) {\n return\n }\n const distance = dragState.startX - x\n const relativeDistance = distance / width\n const duration = (Date.now() - dragState.startTime) // in milliseconds\n const velocity = distance / (Date.now() - dragState.startTime)\n\n const isSlide = Math.abs(velocity) > 2 \|\| (duration < 200 && (Math.abs(relativeDistance) > 0.2 \|\| Math.abs(distance) > 50))\n if (isSlide) {\n if (distance > 0 && canGoRight()) {\n right()\n return\n } else if (distance < 0 && canGoLeft()) {\n left()\n return\n }\n }\n startAnimation()\n }\n\n const dragHandlers = {\n draggable: true,\n onDragStart: (event: React.DragEvent<HTMLDivElement>) => {\n onDragStart(event.clientX)\n event.dataTransfer.setDragImage(document.createElement('div'), 0, 0)\n },\n onDrag: (event: React.DragEvent<HTMLDivElement>) => onDrag(event.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onDragEnd: (event: React.DragEvent<HTMLDivElement>) => onDragEnd(event.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchStart: (event: React.TouchEvent<HTMLDivElement>) => onDragStart(event.touches[0]!.clientX),\n onTouchMove: (event: React.TouchEvent<HTMLDivElement>) => onDrag(event.touches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchEnd: (event: React.TouchEvent<HTMLDivElement>) => onDragEnd(event.changedTouches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n onTouchCancel: (event: React.TouchEvent<HTMLDivElement>) => onDragEnd(event.changedTouches[0]!.clientX, (event.target as HTMLDivElement).getBoundingClientRect().width),\n }\n\n return (\n <div className=\"flex-col-2 items-center w-full\">\n <div className={clsx(`relative w-full overflow-hidden`, heightClassName, className)}>\n {arrows && (\n <>\n <IconButton\n color=\"neutral\"\n className={clsx('absolute z-10 left-0 top-1/2 -translate-y-1/2 shadow-md', { hidden: !canGoLeft() })}\n disabled={!canGoLeft()}\n onClick={() => left()}\n >\n <ChevronLeft size={24}/>\n </IconButton>\n <IconButton\n color=\"neutral\"\n className={clsx('absolute z-10 right-0 top-1/2 -translate-y-1/2 shadow-md', { hidden: !canGoRight() })}\n disabled={!canGoRight()}\n onClick={() => right()}\n >\n <ChevronRight size={24}/>\n </IconButton>\n </>\n )}\n {hintNext ? (\n <div className={clsx(`flex-row-2 relative h-full`, heightClassName)}>\n <div className=\"flex-row-2 relative h-full w-full px-2 overflow-hidden\">\n {items.map(({\n item,\n index\n }, listIndex) => (\n <div\n key={listIndex}\n className={clsx(`absolute left-[50%] h-full overflow-hidden`, widthClassName, { '!cursor-grabbing': !!dragState })}\n style={{ translate: getStyleOffset(listIndex - (isLooping ? paddingItemCount : 0)) }}\n {...dragHandlers}\n onClick={() => startAnimation(index)}\n >\n {item}\n </div>\n ))}\n </div>\n <div\n className={clsx(`hidden pointer-events-none desktop:block absolute left-0 h-full w-[20%] bg-gradient-to-r to-transparent`, blurColor)}\n />\n <div\n className={clsx(`hidden pointer-events-none desktop:block absolute right-0 h-full w-[20%] bg-gradient-to-l to-transparent`, blurColor)}\n />\n </div>\n ) : (\n <div className={clsx('px-16 h-full', { '!cursor-grabbing': !!dragState })} {...dragHandlers}>\n {children[currentIndex]}\n </div>\n )}\n </div>\n {dots && (\n <div\n className=\"flex-row-2 items-center justify-center w-full my-2\">\n {range(length).map(index => (\n <button\n key={index}\n className={clsx('w-8 min-w-8 h-3 min-h-3 first:rounded-l-md last:rounded-r-md', {\n 'bg-carousel-dot-disabled hover:bg-carousel-dot-active': currentIndex !== index,\n 'bg-carousel-dot-active hover:brightness-90': currentIndex === index\n })}\n onClick={() => startAnimation(index)}\n />\n ))}\n </div>\n )}\n </div>\n )\n}\n","export const equalSizeGroups = <T>(array: T[], groupSize: number): T[][] => {\n if (groupSize <= 0) {\n console.warn(`group size should be greater than 0: groupSize = ${groupSize}`)\n return [[...array]]\n }\n\n const groups = []\n for (let i = 0; i < array.length; i += groupSize) {\n groups.push(array.slice(i, Math.min(i + groupSize, array.length)))\n }\n return groups\n}\n\nexport type RangeOptions = {\n /** Whether the range can be defined empty via end < start without a warning /\n allowEmptyRange: boolean,\n stepSize: number,\n exclusiveStart: boolean,\n exclusiveEnd: boolean,\n}\n\nconst defaultRangeOptions: RangeOptions = {\n allowEmptyRange: false,\n stepSize: 1,\n exclusiveStart: false,\n exclusiveEnd: true,\n}\n\n/\n @param endOrRange The end value or a range [start, end], end is exclusive\n * @param options the options for defining the range\n /\nexport const range = (endOrRange: number \| [number, number], options?: Partial<RangeOptions>): number[] => {\n const { allowEmptyRange, stepSize, exclusiveStart, exclusiveEnd } = { ...defaultRangeOptions, ...options }\n let start = 0\n let end: number\n if (typeof endOrRange === 'number') {\n end = endOrRange\n } else {\n start = endOrRange[0]\n end = endOrRange[1]\n }\n if (!exclusiveEnd) {\n end -= 1\n }\n if (exclusiveStart) {\n start += 1\n }\n\n if (end - 1 < start) {\n if (!allowEmptyRange) {\n console.warn(`range: end (${end}) < start (${start}) should be allowed explicitly, set options.allowEmptyRange to true`)\n }\n return []\n }\n return Array.from({ length: end - start }, (_, index) => index stepSize + start)\n}\n\n/** Finds the closest match\n * @param list The list of all possible matches\n * @param firstCloser Return whether item1 is closer than item2\n /\nexport const closestMatch = <T>(list: T[], firstCloser: (item1: T, item2: T) => boolean) => {\n return list.reduce((item1, item2) => {\n return firstCloser(item1, item2) ? item1 : item2\n })\n}\n\n/\n returns the item in middle of a list and its neighbours before and after\n * e.g. [1,2,3,4,5,6] for item = 1 would return [5,6,1,2,3]\n /\nexport const getNeighbours = <T>(list: T[], item: T, neighbourDistance: number = 2) => {\n const index = list.indexOf(item)\n const totalItems = neighbourDistance 2 + 1\n if (list.length < totalItems) {\n console.warn('List is to short')\n return list\n }\n\n if (index === -1) {\n console.error('item not found in list')\n return list.splice(0, totalItems)\n }\n\n let start = index - neighbourDistance\n if (start < 0) {\n start += list.length\n }\n const end = (index + neighbourDistance + 1) % list.length\n\n const result: T[] = []\n let ignoreOnce = list.length === totalItems\n for (let i = start; i !== end \|\| ignoreOnce; i = (i + 1) % list.length) {\n result.push(list[i]!)\n if (end === i && ignoreOnce) {\n ignoreOnce = false\n }\n }\n return result\n}\n\nexport const createLoopingListWithIndex = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n if (length < 0) {\n console.warn(`createLoopingList: length must be >= 0, given ${length}`)\n } else if (length === 0) {\n length = list.length\n }\n\n const returnList: [number, T][] = []\n\n if (forwards) {\n for (let i = startIndex; returnList.length < length; i = (i + 1) % list.length) {\n returnList.push([i, list[i]!])\n }\n } else {\n for (let i = startIndex; returnList.length < length; i = i === 0 ? i = list.length - 1 : i - 1) {\n returnList.push([i, list[i]!])\n }\n }\n\n return returnList\n}\n\nexport const createLoopingList = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n return createLoopingListWithIndex(list, startIndex, length, forwards).map(([_, item]) => item)\n}\n\nexport const ArrayUtil = {\n unique: <T>(list: T[]): T[] => {\n const seen = new Set<T>()\n return list.filter((item) => {\n if (seen.has(item)) {\n return false\n }\n seen.add(item)\n return true\n })\n },\n\n difference: <T>(list: T[], removeList: T[]): T[] => {\n const remove = new Set<T>(removeList)\n return list.filter((item) => !remove.has(item))\n }\n}\n","export const clamp = (value: number, min: number = 0, max: number = 1): number => {\n return Math.min(Math.max(value, min), max)\n}\n","import { clamp } from './math'\n\nexport type EaseFunction = (t: number) => number\n\nexport class EaseFunctions {\n static cubicBezierGeneric(x1: number, y1: number, x2: number, y2: number): { x: EaseFunction, y: EaseFunction } {\n // Calculate the x and y coordinates using the cubic Bézier formula\n const cx = 3 * x1\n const bx = 3 * (x2 - x1) - cx\n const ax = 1 - cx - bx\n\n const cy = 3 * y1\n const by = 3 * (y2 - y1) - cy\n const ay = 1 - cy - by\n\n // Compute x and y values at parameter t\n const x = (t: number) => ((ax * t + bx) * t + cx) * t\n const y = (t: number) => ((ay * t + by) * t + cy) * t\n\n return {\n x,\n y\n }\n }\n\n static cubicBezier(x1: number, y1: number, x2: number, y2: number): EaseFunction {\n const { y } = EaseFunctions.cubicBezierGeneric(x1, y1, x2, y2)\n return (t: number) => {\n t = clamp(t)\n return y(t) // <= equal to x(t) * 0 + y(t) * 1\n }\n }\n\n static easeInEaseOut(t: number): number {\n return EaseFunctions.cubicBezier(0.65, 0, 0.35, 1)(t)\n };\n}\n","/*\n 1 is forwards\n \n -1 is backwards\n /\nexport type Direction = 1 \| -1\n\nexport class LoopingArrayCalculator {\n length: number\n isLooping: boolean\n allowedOverScroll: number\n\n constructor(length: number, isLooping: boolean = true, allowedOverScroll: number = 0.1) {\n if (allowedOverScroll < 0 \|\| length < 1) {\n throw new Error('Invalid parameters: allowedOverScroll >= 0 and length >= 1 must be true')\n }\n\n this.length = length\n this.isLooping = isLooping\n this.allowedOverScroll = allowedOverScroll\n }\n\n getCorrectedPosition(position: number): number {\n if (!this.isLooping) {\n return Math.max(-this.allowedOverScroll, Math.min(this.allowedOverScroll + this.length - 1, position))\n }\n if (position >= this.length) {\n return position % this.length\n }\n if (position < 0) {\n return this.length - (Math.abs(position) % this.length)\n }\n return position\n }\n\n static withoutOffset(position: number): number {\n return position + LoopingArrayCalculator.getOffset(position)\n }\n\n static getOffset(position: number): number {\n return Math.round(position) - position // For example: 45.5 => 46 - 45.5 = 0.5\n }\n\n /\n @return absolute distance forwards or Infinity when the target cannot be reached (only possible when not isLooping)\n /\n getDistanceDirectional(position: number, target: number, direction: Direction): number {\n if (!this.isLooping && (position < -this.allowedOverScroll \|\| position > this.allowedOverScroll + this.length - 1)) {\n throw new Error('Invalid parameters: position is out of bounds.')\n }\n\n const isForwardInvalid = (direction === 1 && position > target)\n const isBackwardInvalid = (direction === -1 && target < position)\n\n if (!this.isLooping && (isForwardInvalid \|\| isBackwardInvalid)) {\n return Infinity\n }\n\n if (direction === -1) {\n return this.getDistanceDirectional(target, position, 1)\n }\n\n position = this.getCorrectedPosition(position)\n target = this.getCorrectedPosition(target)\n\n let distance = (target - position) direction\n if (distance < 0) {\n distance = this.length - (Math.abs(position) % this.length) + target\n }\n\n return distance\n }\n\n getDistanceForward(position: number, target: number): number {\n return this.getDistanceDirectional(position, target, 1)\n }\n\n getDistanceBackward(position: number, target: number): number {\n return this.getDistanceDirectional(position, target, -1)\n }\n\n getDistance(position: number, target: number): number {\n const forwardDistance = this.getDistanceForward(position, target)\n const backwardDistance = this.getDistanceBackward(position, target)\n\n return Math.min(forwardDistance, backwardDistance)\n }\n\n getBestDirection(position: number, target: number): Direction {\n const forwardDistance = this.getDistanceForward(position, target)\n const backwardDistance = this.getDistanceBackward(position, target)\n return forwardDistance < backwardDistance ? 1 : -1\n }\n}\n","import type { ButtonHTMLAttributes, PropsWithChildren, ReactNode } from 'react'\nimport { forwardRef } from 'react'\nimport clsx from 'clsx'\n\n\nexport const ButtonColorUtil = {\n solid: ['primary', 'secondary', 'tertiary', 'positive', 'warning', 'negative', 'neutral'] as const,\n text: ['primary', 'negative', 'neutral'] as const,\n outline: ['primary'] as const,\n}\n\nexport const IconButtonUtil = {\n icon: [...ButtonColorUtil.solid, 'transparent'] as const,\n}\n\n\n/*\n The allowed colors for the SolidButton and IconButton\n /\nexport type SolidButtonColor = typeof ButtonColorUtil.solid[number]\n/\n The allowed colors for the OutlineButton\n /\nexport type OutlineButtonColor = typeof ButtonColorUtil.outline[number]\n/\n The allowed colors for the TextButton\n /\nexport type TextButtonColor = typeof ButtonColorUtil.text[number]\n/\n The allowed colors for the IconButton\n /\nexport type IconButtonColor = typeof IconButtonUtil.icon[number]\n\n\n/\n The different sizes for a button\n /\ntype ButtonSizes = 'small' \| 'medium' \| 'large'\n\ntype IconButtonSize = 'tiny' \| 'small' \| 'medium' \| 'large'\n\n/\n The shard properties between all button types\n /\nexport type ButtonProps = PropsWithChildren<{\n /\n @default 'medium'\n /\n size?: ButtonSizes,\n}> & ButtonHTMLAttributes<Element>\n\nconst paddingMapping: Record<ButtonSizes, string> = {\n small: 'btn-sm',\n medium: 'btn-md',\n large: 'btn-lg'\n}\n\nconst iconPaddingMapping: Record<IconButtonSize, string> = {\n tiny: 'icon-btn-xs',\n small: 'icon-btn-sm',\n medium: 'icon-btn-md',\n large: 'icon-btn-lg'\n}\n\nexport const ButtonUtil = {\n paddingMapping,\n iconPaddingMapping\n}\n\ntype ButtonWithIconsProps = ButtonProps & {\n startIcon?: ReactNode,\n endIcon?: ReactNode,\n}\n\nexport type SolidButtonProps = ButtonWithIconsProps & {\n color?: SolidButtonColor,\n}\n\nexport type OutlineButtonProps = ButtonWithIconsProps & {\n color?: OutlineButtonColor,\n}\n\nexport type TextButtonProps = ButtonWithIconsProps & {\n color?: TextButtonColor,\n}\n\n/\n The shard properties between all button types\n /\nexport type IconButtonProps = PropsWithChildren<{\n /\n @default 'medium'\n /\n size?: IconButtonSize,\n color?: IconButtonColor,\n}> & ButtonHTMLAttributes<Element>\n\n/\n A button with a solid background and different sizes\n /\nconst SolidButton = forwardRef<HTMLButtonElement, SolidButtonProps>(function SolidButton({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }, ref) {\n const colorClasses = {\n primary: 'bg-button-solid-primary-background text-button-solid-primary-text',\n secondary: 'bg-button-solid-secondary-background text-button-solid-secondary-text',\n tertiary: 'bg-button-solid-tertiary-background text-button-solid-tertiary-text',\n positive: 'bg-button-solid-positive-background text-button-solid-positive-text',\n warning: 'bg-button-solid-warning-background text-button-solid-warning-text',\n negative: 'bg-button-solid-negative-background text-button-solid-negative-text',\n neutral: 'bg-button-solid-neutral-background text-button-solid-neutral-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-solid-primary-icon',\n secondary: 'text-button-solid-secondary-icon',\n tertiary: 'text-button-solid-tertiary-icon',\n positive: 'text-button-solid-positive-icon',\n warning: 'text-button-solid-warning-icon',\n negative: 'text-button-solid-negative-icon',\n neutral: 'text-button-solid-neutral-icon',\n }[color]\n\n return (\n <button\n ref={ref}\n onClick={onClick}\n disabled={disabled}\n className={clsx(\n {\n 'text-disabled-text bg-disabled-background cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:brightness-90')]: !disabled\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n})\n\n/\n A button with an outline border and different sizes\n /\nconst OutlineButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: OutlineButtonProps) => {\n const colorClasses = {\n primary: 'bg-transparent border-2 border-button-outline-primary-text text-button-outline-primary-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-outline-primary-icon',\n }[color]\n return (\n <button\n onClick={onClick}\n disabled={disabled}\n className={clsx(\n {\n 'text-disabled-text border-disabled-outline cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:brightness-80')]: !disabled,\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n/\n A text that is a button that can have different sizes\n /\nconst TextButton = ({\n children,\n disabled = false,\n color = 'neutral',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: TextButtonProps) => {\n const colorClasses = {\n primary: 'bg-transparent text-button-text-primary-text',\n negative: 'bg-transparent text-button-text-negative-text',\n neutral: 'bg-transparent text-button-text-neutral-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-text-primary-icon',\n negative: 'text-button-text-negative-icon',\n neutral: 'text-button-text-neutral-icon',\n }[color]\n return (\n <button\n onClick={onClick}\n disabled={disabled}\n className={clsx(\n {\n 'text-disabled-text cursor-not-allowed': disabled,\n [clsx(colorClasses, 'hover:bg-button-text-hover-background')]: !disabled,\n },\n ButtonUtil.paddingMapping[size],\n className\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n\n/\n A button for icons with a solid background and different sizes\n */\nconst IconButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n className,\n ...restProps\n }: IconButtonProps) => {\n const colorClasses = {\n primary: 'bg-button-solid-primary-background text-button-solid-primary-text',\n secondary: 'bg-button-solid-secondary-background text-button-solid-secondary-text',\n tertiary: 'bg-button-solid-tertiary-background text-button-solid-tertiary-text',\n positive: 'bg-button-solid-positive-background text-button-solid-positive-text',\n warning: 'bg-button-solid-warning-background text-button-solid-warning-text',\n negative: 'bg-button-solid-negative-background text-button-solid-negative-text',\n neutral: 'bg-button-solid-neutral-background text-button-solid-neutral-text',\n transparent: 'bg-transparent',\n }[color]\n\n return (\n <button\n disabled={disabled}\n className={clsx(\n {\n 'text-disabled-text bg-disabled-background cursor-not-allowed': disabled && color !== 'transparent',\n 'text-disabled-text cursor-not-allowed opacity-70': disabled && color === 'transparent',\n 'hover:bg-button-text-hover-background': !disabled && color === 'transparent',\n [clsx(colorClasses, 'hover:brightness-90')]: !disabled,\n },\n ButtonUtil.iconPaddingMapping[size],\n className\n )}\n {...restProps}\n >\n {children}\n </button>\n )\n}\n\nexport { SolidButton, OutlineButton, TextButton, IconButton }\n"],"mappings":"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","names":["import_react","import_clsx","SolidButton","clsx","clsx","import_jsx_runtime","animationState","dragState","clsx"]}

package/dist/components/layout-and-navigation/Carousel.mjs CHANGED Viewed

@@ -156,6 +156,7 @@ var LoopingArrayCalculator = class _LoopingArrayCalculator {
 };
 // src/components/user-action/Button.tsx
+import { forwardRef } from "react";
 import clsx from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
 var ButtonColorUtil = {
@@ -181,14 +182,83 @@ var ButtonUtil = {
   paddingMapping,
   iconPaddingMapping
 };
-var IconButton = ({
+var SolidButton = forwardRef(function SolidButton2({
   children,
   disabled = false,
   color = "primary",
   size = "medium",
+  startIcon,
+  endIcon,
   onClick,
   className,
   ...restProps
+}, ref) {
+  const colorClasses = {
+    primary: "bg-button-solid-primary-background text-button-solid-primary-text",
+    secondary: "bg-button-solid-secondary-background text-button-solid-secondary-text",
+    tertiary: "bg-button-solid-tertiary-background text-button-solid-tertiary-text",
+    positive: "bg-button-solid-positive-background text-button-solid-positive-text",
+    warning: "bg-button-solid-warning-background text-button-solid-warning-text",
+    negative: "bg-button-solid-negative-background text-button-solid-negative-text",
+    neutral: "bg-button-solid-neutral-background text-button-solid-neutral-text"
+  }[color];
+  const iconColorClasses = {
+    primary: "text-button-solid-primary-icon",
+    secondary: "text-button-solid-secondary-icon",
+    tertiary: "text-button-solid-tertiary-icon",
+    positive: "text-button-solid-positive-icon",
+    warning: "text-button-solid-warning-icon",
+    negative: "text-button-solid-negative-icon",
+    neutral: "text-button-solid-neutral-icon"
+  }[color];
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      onClick,
+      disabled,
+      className: clsx(
+        {
+          "text-disabled-text bg-disabled-background cursor-not-allowed": disabled,
+          [clsx(colorClasses, "hover:brightness-90")]: !disabled
+        },
+        ButtonUtil.paddingMapping[size],
+        className
+      ),
+      ...restProps,
+      children: [
+        startIcon && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: clsx({
+              [iconColorClasses]: !disabled,
+              [`text-disabled-icon`]: disabled
+            }),
+            children: startIcon
+          }
+        ),
+        children,
+        endIcon && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: clsx({
+              [iconColorClasses]: !disabled,
+              [`text-disabled-icon`]: disabled
+            }),
+            children: endIcon
+          }
+        )
+      ]
+    }
+  );
+});
+var IconButton = ({
+  children,
+  disabled = false,
+  color = "primary",
+  size = "medium",
+  className,
+  ...restProps
 }) => {
   const colorClasses = {
     primary: "bg-button-solid-primary-background text-button-solid-primary-text",
@@ -203,8 +273,7 @@ var IconButton = ({
   return /* @__PURE__ */ jsx(
     "button",
     {
-      onClick: disabled ? void 0 : onClick,
-      disabled: disabled || onClick === void 0,
+      disabled,
       className: clsx(
         {
           "text-disabled-text bg-disabled-background cursor-not-allowed": disabled && color !== "transparent",
@@ -462,7 +531,7 @@ var Carousel = ({
     onTouchEnd: (event) => onDragEnd(event.changedTouches[0].clientX, event.target.getBoundingClientRect().width),
     onTouchCancel: (event) => onDragEnd(event.changedTouches[0].clientX, event.target.getBoundingClientRect().width)
   };
-  return /* @__PURE__ */ jsxs2("div", { className: "col items-center w-full gap-y-2", children: [
+  return /* @__PURE__ */ jsxs2("div", { className: "flex-col-2 items-center w-full", children: [
     /* @__PURE__ */ jsxs2("div", { className: clsx2(`relative w-full overflow-hidden`, heightClassName, className), children: [
       arrows && /* @__PURE__ */ jsxs2(Fragment, { children: [
         /* @__PURE__ */ jsx2(
@@ -486,8 +555,8 @@ var Carousel = ({
           }
         )
       ] }),
-      hintNext ? /* @__PURE__ */ jsxs2("div", { className: clsx2(`relative row h-full`, heightClassName), children: [
-        /* @__PURE__ */ jsx2("div", { className: "relative row h-full w-full px-2 overflow-hidden", children: items.map(({
+      hintNext ? /* @__PURE__ */ jsxs2("div", { className: clsx2(`flex-row-2 relative h-full`, heightClassName), children: [
+        /* @__PURE__ */ jsx2("div", { className: "flex-row-2 relative h-full w-full px-2 overflow-hidden", children: items.map(({
           item,
           index
         }, listIndex) => /* @__PURE__ */ jsx2(
@@ -518,7 +587,7 @@ var Carousel = ({
     dots && /* @__PURE__ */ jsx2(
       "div",
       {
-        className: "row items-center justify-center w-full my-2",
+        className: "flex-row-2 items-center justify-center w-full my-2",
         children: range(length).map((index) => /* @__PURE__ */ jsx2(
           "button",
           {