@rio-cloud/rio-uikit 2.5.1 → 3.0.0-beta.1

package/components/calendarStripe/CalendarStripe.js

@@ -1,117 +1,101 @@
-import { jsxs as Z, jsx as n } from "react/jsx-runtime";
-import { forwardRef as ee, useState as h, useRef as se, useEffect as te } from "react";
-import { AnimatePresence as ae, motion as ne } from "motion/react";
-import { noop as E } from "es-toolkit/compat";
-import f from "../../utils/classNames.js";
-import re from "../../hooks/useAfterMount.js";
-import oe from "../../hooks/useElementSize.js";
-import le from "../../hooks/usePrevious.js";
-import { hasRoundedClass as ie, hasBorderClass as ce, hasBgClass as me, hasOverflowClass as de, hasAlignItemsClass as k, hasDisplayClass as y, hasAlignSelfClass as pe, hasTextSizeClass as ue, hasTextColorClass as he, hasCursorClass as fe, hasPaddingClass as Ce, hasHoverTextColorClass as ge, hasHoverScaleClass as De, hasUserSelectClass as F, hasSpaceClass as M, hasFlexClass as Ne } from "../../utils/hasUtilityClass.js";
-const ye = 200, ve = 1, xe = 7, Ae = 0.2, _ = "page", we = "pageBack", B = "ColumnItem", Se = {
-  pageEnter: (t) => ({
-    x: t === _ ? "60%" : "-60%",
-    opacity: 0
-  }),
-  pageCenter: () => ({ x: 0, opacity: 1 })
-}, l = (t) => t.toISOString().split("T").at(0), O = (t) => [...t.classList].includes(B) ? t : O(t.children[0]), be = ee((t, b) => {
-  const {
-    minDayWith: v = ye,
-    minDays: P = ve,
-    maxDays: R = xe,
-    renderDay: x,
-    skipWeekends: L = !1,
-    startDate: i = /* @__PURE__ */ new Date(),
-    onNextClick: U = E,
-    onPreviousClick: z = E,
-    buttonClassName: s = "",
-    className: o = "",
-    daysWrapperClassName: m = "",
-    dayWrapperClassName: d = ""
-  } = t, [r, C] = h(i), [a, A] = h(1), [H, j] = h(!1), c = se(null), [w] = oe(c), V = le(l(r)), S = l(r) > V ? _ : we, [X, Y] = h(i);
-  l(i) !== l(X) && (C(i), Y(i)), re(() => {
-    j(!0);
-  }, []), te(() => {
-    if (!c.current)
-      return;
-    const e = O(c.current.children[0]);
-    if (!e)
-      return;
-    const g = e.getBoundingClientRect().width, D = a - 1 >= P, u = a + 1 <= R, Q = D && g <= v;
-    if (u && (a + 1) * v <= w) {
-      const N = a + 1;
-      A(N);
-      return;
-    }
-    if (Q) {
-      const N = a - 1;
-      A(N);
-      return;
-    }
-  }, [w, c.current, a, r]);
-  const K = () => {
-    const e = new Date(r);
-    e.setDate(e.getDate() + a), C(e), U(e);
-  }, $ = () => {
-    const e = new Date(r);
-    e.setDate(e.getDate() - a), C(e), z(e);
-  }, p = [];
-  let I = !0, T = 1;
-  for (; I; ) {
-    const e = new Date(r);
-    e.setDate(r.getDate() + T);
-    const g = e.getDay() === 6, D = e.getDay() === 0, u = g || D;
-    u && !L ? p.push(e) : u || p.push(e), T++, p.length === a && (I = !1);
-  }
-  const q = f(
-    "CalenderStripe",
-    !y(o) && "display-flex",
-    !k(o) && "align-items-center",
-    !de(o) && "overflow-hidden",
-    !me(o) && "bg-white",
-    !ce(o) && "border",
-    !ie(o) && "rounded",
-    o
-  ), W = f(
-    !k(s) && "align-items-center",
-    !y(s) && "display-flex",
-    !De(s) && "hover-scale-105",
-    !ge(s) && "hover-text-color-darkest",
-    !Ce(s) && "padding-10",
-    !fe(s) && "cursor-pointer",
-    !he(s) && "text-color-darker",
-    !ue(s) && "text-size-12",
-    !pe(s) && "align-self-stretch",
-    s
-  ), G = f(
-    !y(m) && "display-flex",
-    !M(m) && "space-x--1",
-    !F(m) && "user-select-none",
-    m
-  ), J = f(
-    B,
-    !Ne(d) && "flex-1-1-0",
-    !M(d) && "space-x--1",
-    !F(d) && "user-select-none",
-    d
-  );
-  return /* @__PURE__ */ Z("div", { ref: b, className: q, children: [
-    /* @__PURE__ */ n("div", { className: W, onClick: $, children: /* @__PURE__ */ n("span", { className: "rioglyph rioglyph-chevron-left" }) }),
-    /* @__PURE__ */ n("div", { className: "flex-1-1 overflow-hidden", ref: c, children: /* @__PURE__ */ n(ae, { mode: "wait", custom: S, children: /* @__PURE__ */ n(
-      ne.div,
-      {
-        variants: Se,
-        initial: H ? "pageEnter" : !1,
-        animate: "pageCenter",
-        custom: S,
-        transition: { duration: Ae },
-        children: /* @__PURE__ */ n("div", { className: G, children: p.map((e) => /* @__PURE__ */ n("div", { className: J, children: x ? x(e) : null }, `${l(e)}`)) })
-      },
-      l(r)
-    ) }) }),
-    /* @__PURE__ */ n("div", { className: W, onClick: K, children: /* @__PURE__ */ n("span", { className: "rioglyph rioglyph-chevron-right" }) })
-  ] });
+import e from "../../hooks/useAfterMount.js";
+import t from "../../hooks/usePrevious.js";
+import n from "../../hooks/useElementSize.js";
+import r from "../../utils/classNames.js";
+import { hasAlignItemsClass as i, hasAlignSelfClass as a, hasBgClass as ee, hasBorderClass as o, hasCursorClass as s, hasDisplayClass as c, hasFlexClass as l, hasHoverScaleClass as u, hasHoverTextColorClass as d, hasOverflowClass as f, hasPaddingClass as te, hasRoundedClass as p, hasSpaceClass as m, hasTextColorClass as ne, hasTextSizeClass as re, hasUserSelectClass as h } from "../../utils/hasUtilityClass.js";
+import { forwardRef as g, useEffect as _, useRef as ie, useState as v } from "react";
+import { noop as y } from "es-toolkit/compat";
+import { AnimatePresence as b, motion as x } from "motion/react";
+import { jsx as S, jsxs as C } from "react/jsx-runtime";
+//#region src/components/calendarStripe/CalendarStripe.tsx
+var w = 200, ae = 1, oe = 7, se = .2, T = "page", ce = "pageBack", E = "ColumnItem", le = {
+	pageEnter: (e) => ({
+		x: e === T ? "60%" : "-60%",
+		opacity: 0
+	}),
+	pageCenter: () => ({
+		x: 0,
+		opacity: 1
+	})
+}, D = (e) => e.toISOString().split("T").at(0), O = (e) => [...e.classList].includes(E) ? e : O(e.children[0]), k = g((g, k) => {
+	let { minDayWith: A = w, minDays: j = ae, maxDays: M = oe, renderDay: N, skipWeekends: P = !1, startDate: F = /* @__PURE__ */ new Date(), onNextClick: I = y, onPreviousClick: L = y, buttonClassName: R = "", className: z = "", daysWrapperClassName: B = "", dayWrapperClassName: V = "" } = g, [H, U] = v(F), [W, G] = v(1), [ue, de] = v(!1), K = ie(null), [q] = n(K), fe = t(D(H)), J = D(H) > fe ? T : ce, [Y, pe] = v(F);
+	D(F) !== D(Y) && (U(F), pe(F)), e(() => {
+		de(!0);
+	}, []), _(() => {
+		if (!K.current) return;
+		let e = O(K.current.children[0]);
+		if (!e) return;
+		let t = e.getBoundingClientRect().width, n = W - 1 >= j, r = W + 1 <= M, i = n && t <= A;
+		if (r && (W + 1) * A <= q) {
+			let e = W + 1;
+			G(e);
+			return;
+		}
+		if (i) {
+			let e = W - 1;
+			G(e);
+			return;
+		}
+	}, [
+		q,
+		K.current,
+		W,
+		H
+	]);
+	let me = () => {
+		let e = new Date(H);
+		e.setDate(e.getDate() + W), U(e), I(e);
+	}, he = () => {
+		let e = new Date(H);
+		e.setDate(e.getDate() - W), U(e), L(e);
+	}, X = [], Z = !0, Q = 1;
+	for (; Z;) {
+		let e = new Date(H);
+		e.setDate(H.getDate() + Q);
+		let t = e.getDay() === 6, n = e.getDay() === 0, r = t || n;
+		r && !P ? X.push(e) : r || X.push(e), Q++, X.length === W && (Z = !1);
+	}
+	let ge = r("CalenderStripe", !c(z) && "display-flex", !i(z) && "align-items-center", !f(z) && "overflow-hidden", !ee(z) && "bg-white", !o(z) && "border", !p(z) && "rounded", z), $ = r(!i(R) && "align-items-center", !c(R) && "display-flex", !u(R) && "hover-scale-105", !d(R) && "hover-text-color-darkest", !te(R) && "padding-10", !s(R) && "cursor-pointer", !ne(R) && "text-color-darker", !re(R) && "text-size-12", !a(R) && "align-self-stretch", R), _e = r(!c(B) && "display-flex", !m(B) && "space-x--1", !h(B) && "user-select-none", B), ve = r(E, !l(V) && "flex-1-1-0", !m(V) && "space-x--1", !h(V) && "user-select-none", V);
+	return /* @__PURE__ */ C("div", {
+		ref: k,
+		className: ge,
+		children: [
+			/* @__PURE__ */ S("div", {
+				className: $,
+				onClick: he,
+				children: /* @__PURE__ */ S("span", { className: "uikit-icon icon-chevron-left" })
+			}),
+			/* @__PURE__ */ S("div", {
+				className: "flex-1-1 overflow-hidden",
+				ref: K,
+				children: /* @__PURE__ */ S(b, {
+					mode: "wait",
+					custom: J,
+					children: /* @__PURE__ */ S(x.div, {
+						variants: le,
+						initial: ue ? "pageEnter" : !1,
+						animate: "pageCenter",
+						custom: J,
+						transition: { duration: se },
+						children: /* @__PURE__ */ S("div", {
+							className: _e,
+							children: X.map((e) => /* @__PURE__ */ S("div", {
+								className: ve,
+								children: N ? N(e) : null
+							}, `${D(e)}`))
+						})
+					}, D(H))
+				})
+			}),
+			/* @__PURE__ */ S("div", {
+				className: $,
+				onClick: me,
+				children: /* @__PURE__ */ S("span", { className: "uikit-icon icon-chevron-right" })
+			})
+		]
+	});
 });
-export {
-  be as default
-};
-//# sourceMappingURL=CalendarStripe.js.map
+//#endregion
+export { k as default };
+
+//# sourceMappingURL=CalendarStripe.js.map

package/components/calendarStripe/CalendarStripe.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarStripe.js","sources":["../../../src/components/calendarStripe/CalendarStripe.tsx"],"sourcesContent":["import type React from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport useAfterMount from '../../hooks/useAfterMount';\nimport useElementSize from '../../hooks/useElementSize';\nimport usePrevious from '../../hooks/usePrevious';\nimport {\n    hasAlignItemsClass,\n    hasAlignSelfClass,\n    hasBgClass,\n    hasBorderClass,\n    hasCursorClass,\n    hasDisplayClass,\n    hasFlexClass,\n    hasHoverScaleClass,\n    hasHoverTextColorClass,\n    hasOverflowClass,\n    hasPaddingClass,\n    hasRoundedClass,\n    hasSpaceClass,\n    hasTextColorClass,\n    hasTextSizeClass,\n    hasUserSelectClass,\n} from '../../utils/hasUtilityClass';\n\nconst DEFAULT_MIN_WITH = 200;\nconst DEFAULT_MIN_DAYS = 1;\nconst DEFAULT_MAX_DAYS = 7;\n\nconst ANIMATION_DURATION = 0.2;\nconst ANIMATION_NEXT = 'page';\nconst ANIMATION_BACK = 'pageBack';\n\nconst ITEM_NAME = 'ColumnItem';\n\nconst variants = {\n    pageEnter: (pageDirection: typeof ANIMATION_NEXT | typeof ANIMATION_BACK) => ({\n        x: pageDirection === ANIMATION_NEXT ? '60%' : '-60%',\n        opacity: 0,\n    }),\n    pageCenter: () => ({ x: 0, opacity: 1 }),\n};\n\nconst getDateString = (date: Date) => date.toISOString().split('T').at(0) as string;\n\nconst getFirstColumnItem = (node: Element): Element => {\n    if ([...node.classList].includes(ITEM_NAME)) {\n        return node;\n    }\n    return getFirstColumnItem(node.children[0]);\n};\n\nexport type CalendarStripeProps = {\n    /**\n     * The minimum width in pixel of a single day column\n     *\n     * This value determines how many days are shown per page depending on the parent width.\n     *\n     * @default 200\n     */\n    minDayWith?: number;\n\n    /**\n     * The minimum amount of days that should be shown per page.\n     *\n     * @default 1\n     */\n    minDays?: number;\n\n    /**\n     * The maximum amount of days that should be shown per page.\n     *\n     * @default 7\n     */\n    maxDays?: number;\n\n    /**\n     * A function that renders each individual day to be displayed.\n     *\n     * @param date The day to render\n     */\n    renderDay: (date: Date) => React.JSX.Element;\n\n    /**\n     * Defines whether the days for the weekends are included.\n     *\n     * @default false\n     */\n    skipWeekends?: boolean;\n\n    /**\n     * The date of the first day that are rendered.\n     *\n     * @default the current date\n     */\n    startDate?: Date;\n\n    /**\n     * Callback function for when the next button is clicked.\n     *\n     * @param newStartDate Date value that is now the start of the stripe.\n     */\n    onNextClick?: (newStartDate: Date) => void;\n\n    /**\n     * Callback function for when the previous button is clicked.\n     *\n     * @param newStartDate Date value that is now the start of the stripe.\n     */\n    onPreviousClick?: (newStartDate: Date) => void;\n\n    /**\n     * Additional classes set to the navigation buttons.\n     */\n    buttonClassName?: string;\n\n    /**\n     * Additional classes set to the calendar element.\n     */\n    className?: string;\n\n    /**\n     * Additional classes set to the days wrapper element.\n     */\n    daysWrapperClassName?: string;\n\n    /**\n     * Additional classes set to the days wrapper element.\n     */\n    dayWrapperClassName?: string;\n};\n\nconst CalendarStripe = forwardRef<HTMLDivElement, CalendarStripeProps>((props: CalendarStripeProps, ref) => {\n    const {\n        minDayWith = DEFAULT_MIN_WITH,\n        minDays = DEFAULT_MIN_DAYS,\n        maxDays = DEFAULT_MAX_DAYS,\n        renderDay,\n        skipWeekends = false,\n        startDate = new Date(),\n        onNextClick = noop,\n        onPreviousClick = noop,\n        buttonClassName = '',\n        className = '',\n        daysWrapperClassName = '',\n        dayWrapperClassName = '',\n    } = props;\n\n    const [firstDate, setFirstDate] = useState(startDate);\n    const [amountOfDaysToShow, setAmountOfDaysToShow] = useState(1);\n    const [enableInitialAnimation, setEnableInitialAnimation] = useState(false);\n\n    // The base for reacting on changing width of the wrapping element.\n    // It uses a ResizeObserver under the hood.\n    const columnWrapperRef = useRef<HTMLDivElement>(null);\n    const [columnWrapperWidth] = useElementSize(columnWrapperRef);\n\n    const previous = usePrevious(getDateString(firstDate));\n    const animationDirection = getDateString(firstDate) > (previous as string) ? ANIMATION_NEXT : ANIMATION_BACK;\n\n    // Update startDate from outside\n    const [previousStartDate, setPreviousStartDate] = useState(startDate);\n    if (getDateString(startDate) !== getDateString(previousStartDate)) {\n        setFirstDate(startDate);\n        setPreviousStartDate(startDate);\n    }\n\n    useAfterMount(() => {\n        setEnableInitialAnimation(true);\n    }, []);\n\n    useEffect(() => {\n        if (!columnWrapperRef.current) {\n            return;\n        }\n\n        const firstItem = getFirstColumnItem(columnWrapperRef.current.children[0]);\n        if (!firstItem) {\n            return;\n        }\n\n        // Get the width of the first column to calculate how many columns fit on one page\n        // according to the given minWidth per column\n        const columnWidth = firstItem.getBoundingClientRect().width;\n\n        // Limit columns per page for given min and max values\n        const allowForLessColumns = amountOfDaysToShow - 1 >= minDays;\n        const allowForMoreColumns = amountOfDaysToShow + 1 <= maxDays;\n\n        const goSmaller = allowForLessColumns && columnWidth <= minDayWith;\n        const goBigger =\n            allowForMoreColumns && (amountOfDaysToShow + 1) * minDayWith <= (columnWrapperWidth as unknown as number);\n\n        if (goBigger) {\n            const newValue = amountOfDaysToShow + 1;\n            setAmountOfDaysToShow(newValue);\n            return;\n        }\n\n        if (goSmaller) {\n            const newValue = amountOfDaysToShow - 1;\n            setAmountOfDaysToShow(newValue);\n            return;\n        }\n    }, [columnWrapperWidth, columnWrapperRef.current, amountOfDaysToShow, firstDate]);\n\n    const handleNext = () => {\n        const newFirstDate = new Date(firstDate);\n        newFirstDate.setDate(newFirstDate.getDate() + amountOfDaysToShow);\n        setFirstDate(newFirstDate);\n\n        onNextClick(newFirstDate);\n    };\n\n    const handlePrev = () => {\n        const newFirstDate = new Date(firstDate);\n        newFirstDate.setDate(newFirstDate.getDate() - amountOfDaysToShow);\n        setFirstDate(newFirstDate);\n\n        onPreviousClick(newFirstDate);\n    };\n\n    // Re-calculate the dates to show depending on the amount of days to show\n    const dates = [];\n\n    let addDays = true;\n    let index = 1;\n\n    while (addDays) {\n        const currentDate = new Date(firstDate);\n        currentDate.setDate(firstDate.getDate() + index);\n\n        const isSaturday = currentDate.getDay() === 6;\n        const isSunday = currentDate.getDay() === 0;\n        const isWeekend = isSaturday || isSunday;\n\n        if (isWeekend && !skipWeekends) {\n            dates.push(currentDate);\n        } else if (!isWeekend) {\n            dates.push(currentDate);\n        }\n\n        index++;\n\n        if (dates.length === amountOfDaysToShow) {\n            addDays = false;\n        }\n    }\n\n    const wrapperClassNames = classNames(\n        'CalenderStripe',\n        !hasDisplayClass(className) && 'display-flex',\n        !hasAlignItemsClass(className) && 'align-items-center',\n        !hasOverflowClass(className) && 'overflow-hidden',\n        !hasBgClass(className) && 'bg-white',\n        !hasBorderClass(className) && 'border',\n        !hasRoundedClass(className) && 'rounded',\n        className\n    );\n\n    const baseButtonClassNames = classNames(\n        !hasAlignItemsClass(buttonClassName) && 'align-items-center',\n        !hasDisplayClass(buttonClassName) && 'display-flex',\n        !hasHoverScaleClass(buttonClassName) && 'hover-scale-105',\n        !hasHoverTextColorClass(buttonClassName) && 'hover-text-color-darkest',\n        !hasPaddingClass(buttonClassName) && 'padding-10',\n        !hasCursorClass(buttonClassName) && 'cursor-pointer',\n        !hasTextColorClass(buttonClassName) && 'text-color-darker',\n        !hasTextSizeClass(buttonClassName) && 'text-size-12',\n        !hasAlignSelfClass(buttonClassName) && 'align-self-stretch',\n        buttonClassName\n    );\n\n    const daysWrapperClassNames = classNames(\n        !hasDisplayClass(daysWrapperClassName) && 'display-flex',\n        !hasSpaceClass(daysWrapperClassName) && 'space-x--1',\n        !hasUserSelectClass(daysWrapperClassName) && 'user-select-none',\n        daysWrapperClassName\n    );\n\n    const dayWrapperClassNames = classNames(\n        ITEM_NAME,\n        !hasFlexClass(dayWrapperClassName) && 'flex-1-1-0',\n        !hasSpaceClass(dayWrapperClassName) && 'space-x--1',\n        !hasUserSelectClass(dayWrapperClassName) && 'user-select-none',\n        dayWrapperClassName\n    );\n\n    return (\n        <div ref={ref} className={wrapperClassNames}>\n            <div className={baseButtonClassNames} onClick={handlePrev}>\n                <span className='rioglyph rioglyph-chevron-left' />\n            </div>\n            <div className='flex-1-1 overflow-hidden' ref={columnWrapperRef}>\n                <AnimatePresence mode='wait' custom={animationDirection}>\n                    <motion.div\n                        key={getDateString(firstDate)}\n                        variants={variants}\n                        initial={enableInitialAnimation ? 'pageEnter' : false}\n                        animate='pageCenter'\n                        custom={animationDirection}\n                        transition={{ duration: ANIMATION_DURATION }}\n                    >\n                        <div className={daysWrapperClassNames}>\n                            {dates.map(date => (\n                                <div className={dayWrapperClassNames} key={`${getDateString(date)}`}>\n                                    {renderDay ? renderDay(date) : null}\n                                </div>\n                            ))}\n                        </div>\n                    </motion.div>\n                </AnimatePresence>\n            </div>\n            <div className={baseButtonClassNames} onClick={handleNext}>\n                <span className='rioglyph rioglyph-chevron-right' />\n            </div>\n        </div>\n    );\n});\n\nexport default CalendarStripe;\n"],"names":["DEFAULT_MIN_WITH","DEFAULT_MIN_DAYS","DEFAULT_MAX_DAYS","ANIMATION_DURATION","ANIMATION_NEXT","ANIMATION_BACK","ITEM_NAME","variants","pageDirection","getDateString","date","getFirstColumnItem","node","CalendarStripe","forwardRef","props","ref","minDayWith","minDays","maxDays","renderDay","skipWeekends","startDate","onNextClick","noop","onPreviousClick","buttonClassName","className","daysWrapperClassName","dayWrapperClassName","firstDate","setFirstDate","useState","amountOfDaysToShow","setAmountOfDaysToShow","enableInitialAnimation","setEnableInitialAnimation","columnWrapperRef","useRef","columnWrapperWidth","useElementSize","previous","usePrevious","animationDirection","previousStartDate","setPreviousStartDate","useAfterMount","useEffect","firstItem","columnWidth","allowForLessColumns","allowForMoreColumns","goSmaller","newValue","handleNext","newFirstDate","handlePrev","dates","addDays","index","currentDate","isSaturday","isSunday","isWeekend","wrapperClassNames","classNames","hasDisplayClass","hasAlignItemsClass","hasOverflowClass","hasBgClass","hasBorderClass","hasRoundedClass","baseButtonClassNames","hasHoverScaleClass","hasHoverTextColorClass","hasPaddingClass","hasCursorClass","hasTextColorClass","hasTextSizeClass","hasAlignSelfClass","daysWrapperClassNames","hasSpaceClass","hasUserSelectClass","dayWrapperClassNames","hasFlexClass","jsxs","jsx","AnimatePresence","motion"],"mappings":"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"}
+{"version":3,"file":"CalendarStripe.js","names":[],"sources":["../../../src/components/calendarStripe/CalendarStripe.tsx"],"sourcesContent":["import type React from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport useAfterMount from '../../hooks/useAfterMount';\nimport useElementSize from '../../hooks/useElementSize';\nimport usePrevious from '../../hooks/usePrevious';\nimport {\n    hasAlignItemsClass,\n    hasAlignSelfClass,\n    hasBgClass,\n    hasBorderClass,\n    hasCursorClass,\n    hasDisplayClass,\n    hasFlexClass,\n    hasHoverScaleClass,\n    hasHoverTextColorClass,\n    hasOverflowClass,\n    hasPaddingClass,\n    hasRoundedClass,\n    hasSpaceClass,\n    hasTextColorClass,\n    hasTextSizeClass,\n    hasUserSelectClass,\n} from '../../utils/hasUtilityClass';\n\nconst DEFAULT_MIN_WITH = 200;\nconst DEFAULT_MIN_DAYS = 1;\nconst DEFAULT_MAX_DAYS = 7;\n\nconst ANIMATION_DURATION = 0.2;\nconst ANIMATION_NEXT = 'page';\nconst ANIMATION_BACK = 'pageBack';\n\nconst ITEM_NAME = 'ColumnItem';\n\nconst variants = {\n    pageEnter: (pageDirection: typeof ANIMATION_NEXT | typeof ANIMATION_BACK) => ({\n        x: pageDirection === ANIMATION_NEXT ? '60%' : '-60%',\n        opacity: 0,\n    }),\n    pageCenter: () => ({ x: 0, opacity: 1 }),\n};\n\nconst getDateString = (date: Date) => date.toISOString().split('T').at(0) as string;\n\nconst getFirstColumnItem = (node: Element): Element => {\n    if ([...node.classList].includes(ITEM_NAME)) {\n        return node;\n    }\n    return getFirstColumnItem(node.children[0]);\n};\n\nexport type CalendarStripeProps = {\n    /**\n     * The minimum width in pixel of a single day column\n     *\n     * This value determines how many days are shown per page depending on the parent width.\n     *\n     * @default 200\n     */\n    minDayWith?: number;\n\n    /**\n     * The minimum amount of days that should be shown per page.\n     *\n     * @default 1\n     */\n    minDays?: number;\n\n    /**\n     * The maximum amount of days that should be shown per page.\n     *\n     * @default 7\n     */\n    maxDays?: number;\n\n    /**\n     * A function that renders each individual day to be displayed.\n     *\n     * @param date The day to render\n     */\n    renderDay: (date: Date) => React.JSX.Element;\n\n    /**\n     * Defines whether the days for the weekends are included.\n     *\n     * @default false\n     */\n    skipWeekends?: boolean;\n\n    /**\n     * The date of the first day that are rendered.\n     *\n     * @default the current date\n     */\n    startDate?: Date;\n\n    /**\n     * Callback function for when the next button is clicked.\n     *\n     * @param newStartDate Date value that is now the start of the stripe.\n     */\n    onNextClick?: (newStartDate: Date) => void;\n\n    /**\n     * Callback function for when the previous button is clicked.\n     *\n     * @param newStartDate Date value that is now the start of the stripe.\n     */\n    onPreviousClick?: (newStartDate: Date) => void;\n\n    /**\n     * Additional classes set to the navigation buttons.\n     */\n    buttonClassName?: string;\n\n    /**\n     * Additional classes set to the calendar element.\n     */\n    className?: string;\n\n    /**\n     * Additional classes set to the days wrapper element.\n     */\n    daysWrapperClassName?: string;\n\n    /**\n     * Additional classes set to the days wrapper element.\n     */\n    dayWrapperClassName?: string;\n};\n\nconst CalendarStripe = forwardRef<HTMLDivElement, CalendarStripeProps>((props: CalendarStripeProps, ref) => {\n    const {\n        minDayWith = DEFAULT_MIN_WITH,\n        minDays = DEFAULT_MIN_DAYS,\n        maxDays = DEFAULT_MAX_DAYS,\n        renderDay,\n        skipWeekends = false,\n        startDate = new Date(),\n        onNextClick = noop,\n        onPreviousClick = noop,\n        buttonClassName = '',\n        className = '',\n        daysWrapperClassName = '',\n        dayWrapperClassName = '',\n    } = props;\n\n    const [firstDate, setFirstDate] = useState(startDate);\n    const [amountOfDaysToShow, setAmountOfDaysToShow] = useState(1);\n    const [enableInitialAnimation, setEnableInitialAnimation] = useState(false);\n\n    // The base for reacting on changing width of the wrapping element.\n    // It uses a ResizeObserver under the hood.\n    const columnWrapperRef = useRef<HTMLDivElement>(null);\n    const [columnWrapperWidth] = useElementSize(columnWrapperRef);\n\n    const previous = usePrevious(getDateString(firstDate));\n    const animationDirection = getDateString(firstDate) > (previous as string) ? ANIMATION_NEXT : ANIMATION_BACK;\n\n    // Update startDate from outside\n    const [previousStartDate, setPreviousStartDate] = useState(startDate);\n    if (getDateString(startDate) !== getDateString(previousStartDate)) {\n        setFirstDate(startDate);\n        setPreviousStartDate(startDate);\n    }\n\n    useAfterMount(() => {\n        setEnableInitialAnimation(true);\n    }, []);\n\n    useEffect(() => {\n        if (!columnWrapperRef.current) {\n            return;\n        }\n\n        const firstItem = getFirstColumnItem(columnWrapperRef.current.children[0]);\n        if (!firstItem) {\n            return;\n        }\n\n        // Get the width of the first column to calculate how many columns fit on one page\n        // according to the given minWidth per column\n        const columnWidth = firstItem.getBoundingClientRect().width;\n\n        // Limit columns per page for given min and max values\n        const allowForLessColumns = amountOfDaysToShow - 1 >= minDays;\n        const allowForMoreColumns = amountOfDaysToShow + 1 <= maxDays;\n\n        const goSmaller = allowForLessColumns && columnWidth <= minDayWith;\n        const goBigger =\n            allowForMoreColumns && (amountOfDaysToShow + 1) * minDayWith <= (columnWrapperWidth as unknown as number);\n\n        if (goBigger) {\n            const newValue = amountOfDaysToShow + 1;\n            setAmountOfDaysToShow(newValue);\n            return;\n        }\n\n        if (goSmaller) {\n            const newValue = amountOfDaysToShow - 1;\n            setAmountOfDaysToShow(newValue);\n            return;\n        }\n    }, [columnWrapperWidth, columnWrapperRef.current, amountOfDaysToShow, firstDate]);\n\n    const handleNext = () => {\n        const newFirstDate = new Date(firstDate);\n        newFirstDate.setDate(newFirstDate.getDate() + amountOfDaysToShow);\n        setFirstDate(newFirstDate);\n\n        onNextClick(newFirstDate);\n    };\n\n    const handlePrev = () => {\n        const newFirstDate = new Date(firstDate);\n        newFirstDate.setDate(newFirstDate.getDate() - amountOfDaysToShow);\n        setFirstDate(newFirstDate);\n\n        onPreviousClick(newFirstDate);\n    };\n\n    // Re-calculate the dates to show depending on the amount of days to show\n    const dates = [];\n\n    let addDays = true;\n    let index = 1;\n\n    while (addDays) {\n        const currentDate = new Date(firstDate);\n        currentDate.setDate(firstDate.getDate() + index);\n\n        const isSaturday = currentDate.getDay() === 6;\n        const isSunday = currentDate.getDay() === 0;\n        const isWeekend = isSaturday || isSunday;\n\n        if (isWeekend && !skipWeekends) {\n            dates.push(currentDate);\n        } else if (!isWeekend) {\n            dates.push(currentDate);\n        }\n\n        index++;\n\n        if (dates.length === amountOfDaysToShow) {\n            addDays = false;\n        }\n    }\n\n    const wrapperClassNames = classNames(\n        'CalenderStripe',\n        !hasDisplayClass(className) && 'display-flex',\n        !hasAlignItemsClass(className) && 'align-items-center',\n        !hasOverflowClass(className) && 'overflow-hidden',\n        !hasBgClass(className) && 'bg-white',\n        !hasBorderClass(className) && 'border',\n        !hasRoundedClass(className) && 'rounded',\n        className\n    );\n\n    const baseButtonClassNames = classNames(\n        !hasAlignItemsClass(buttonClassName) && 'align-items-center',\n        !hasDisplayClass(buttonClassName) && 'display-flex',\n        !hasHoverScaleClass(buttonClassName) && 'hover-scale-105',\n        !hasHoverTextColorClass(buttonClassName) && 'hover-text-color-darkest',\n        !hasPaddingClass(buttonClassName) && 'padding-10',\n        !hasCursorClass(buttonClassName) && 'cursor-pointer',\n        !hasTextColorClass(buttonClassName) && 'text-color-darker',\n        !hasTextSizeClass(buttonClassName) && 'text-size-12',\n        !hasAlignSelfClass(buttonClassName) && 'align-self-stretch',\n        buttonClassName\n    );\n\n    const daysWrapperClassNames = classNames(\n        !hasDisplayClass(daysWrapperClassName) && 'display-flex',\n        !hasSpaceClass(daysWrapperClassName) && 'space-x--1',\n        !hasUserSelectClass(daysWrapperClassName) && 'user-select-none',\n        daysWrapperClassName\n    );\n\n    const dayWrapperClassNames = classNames(\n        ITEM_NAME,\n        !hasFlexClass(dayWrapperClassName) && 'flex-1-1-0',\n        !hasSpaceClass(dayWrapperClassName) && 'space-x--1',\n        !hasUserSelectClass(dayWrapperClassName) && 'user-select-none',\n        dayWrapperClassName\n    );\n\n    return (\n        <div ref={ref} className={wrapperClassNames}>\n            <div className={baseButtonClassNames} onClick={handlePrev}>\n                <span className='uikit-icon icon-chevron-left' />\n            </div>\n            <div className='flex-1-1 overflow-hidden' ref={columnWrapperRef}>\n                <AnimatePresence mode='wait' custom={animationDirection}>\n                    <motion.div\n                        key={getDateString(firstDate)}\n                        variants={variants}\n                        initial={enableInitialAnimation ? 'pageEnter' : false}\n                        animate='pageCenter'\n                        custom={animationDirection}\n                        transition={{ duration: ANIMATION_DURATION }}\n                    >\n                        <div className={daysWrapperClassNames}>\n                            {dates.map(date => (\n                                <div className={dayWrapperClassNames} key={`${getDateString(date)}`}>\n                                    {renderDay ? renderDay(date) : null}\n                                </div>\n                            ))}\n                        </div>\n                    </motion.div>\n                </AnimatePresence>\n            </div>\n            <div className={baseButtonClassNames} onClick={handleNext}>\n                <span className='uikit-icon icon-chevron-right' />\n            </div>\n        </div>\n    );\n});\n\nexport default CalendarStripe;\n"],"mappings":"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"}

package/components/card/Card.js

@@ -1,10 +1,15 @@
+import e from "../../utils/classNames.js";
 import { jsx as t } from "react/jsx-runtime";
-import i from "../../utils/classNames.js";
-const l = (s) => {
-  const { className: a = "", shadow: d = "default", padding: r = 15, children: e, ...o } = s, n = i("bg-white", "rounded", "border", `shadow-${d}`, `padding-${r}`, a);
-  return /* @__PURE__ */ t("div", { ...o, className: n, children: e });
+//#region src/components/card/Card.tsx
+var n = (n) => {
+	let { className: r = "", shadow: i = "default", padding: a = 15, children: o, ...s } = n, c = e("bg-white", "rounded", "border", `shadow-${i}`, `padding-${a}`, r);
+	return /* @__PURE__ */ t("div", {
+		...s,
+		className: c,
+		children: o
+	});
 };
-export {
-  l as default
-};
-//# sourceMappingURL=Card.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=Card.js.map

package/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type CardProps = ComponentProps<'div'> & {\n    /**\n     * Shadow classes.\n     *\n     * @default 'default'\n     */\n    shadow?: 'subtle' | 'muted' | 'accent' | 'default' | 'smooth' | 'muted-down' | 'default-down' | 'none';\n\n    /**\n     * Card padding.\n     *\n     * @default 15\n     */\n    padding?: 0 | 5 | 10 | 15 | 20 | 25 | 50;\n\n    /**\n     * Additional classes set to the outer element.\n     */\n    className?: string;\n};\n\nconst Card = (props: PropsWithChildren<CardProps>) => {\n    const { className = '', shadow = 'default', padding = 15, children, ...remainingProps } = props;\n\n    const classes = classNames('bg-white', 'rounded', 'border', `shadow-${shadow}`, `padding-${padding}`, className);\n\n    return (\n        <div {...remainingProps} className={classes}>\n            {children}\n        </div>\n    );\n};\n\nexport default Card;\n"],"names":["Card","props","className","shadow","padding","children","remainingProps","classes","classNames"],"mappings":";;AAyBA,MAAMA,IAAO,CAACC,MAAwC;AAClD,QAAM,EAAE,WAAAC,IAAY,IAAI,QAAAC,IAAS,WAAW,SAAAC,IAAU,IAAI,UAAAC,GAAU,GAAGC,EAAA,IAAmBL,GAEpFM,IAAUC,EAAW,YAAY,WAAW,UAAU,UAAUL,CAAM,IAAI,WAAWC,CAAO,IAAIF,CAAS;AAE/G,2BACK,OAAA,EAAK,GAAGI,GAAgB,WAAWC,GAC/B,UAAAF,GACL;AAER;"}
+{"version":3,"file":"Card.js","names":[],"sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type CardProps = ComponentProps<'div'> & {\n    /**\n     * Shadow classes.\n     *\n     * @default 'default'\n     */\n    shadow?: 'subtle' | 'muted' | 'accent' | 'default' | 'smooth' | 'muted-down' | 'default-down' | 'none';\n\n    /**\n     * Card padding.\n     *\n     * @default 15\n     */\n    padding?: 0 | 5 | 10 | 15 | 20 | 25 | 50;\n\n    /**\n     * Additional classes set to the outer element.\n     */\n    className?: string;\n};\n\nconst Card = (props: PropsWithChildren<CardProps>) => {\n    const { className = '', shadow = 'default', padding = 15, children, ...remainingProps } = props;\n\n    const classes = classNames('bg-white', 'rounded', 'border', `shadow-${shadow}`, `padding-${padding}`, className);\n\n    return (\n        <div {...remainingProps} className={classes}>\n            {children}\n        </div>\n    );\n};\n\nexport default Card;\n"],"mappings":";;;AAyBA,IAAM,KAAQ,MAAwC;CAClD,IAAM,EAAE,eAAY,IAAI,YAAS,WAAW,aAAU,IAAI,aAAU,GAAG,MAAmB,GAEpF,IAAU,EAAW,YAAY,WAAW,UAAU,UAAU,KAAU,WAAW,KAAW,CAAS;CAE/G,OACI,kBAAC,OAAD;EAAK,GAAI;EAAgB,WAAW;EAC/B;CACA,CAAA;AAEb"}

package/components/carousel/Carousel.d.ts

@@ -1,6 +1,40 @@
-import { default as OriginalCarousel } from 'react-bootstrap/Carousel';
-declare const Carousel: typeof OriginalCarousel & {
-    PREV: "prev";
-    NEXT: "next";
+import { FocusEvent, KeyboardEvent, MouseEvent, SyntheticEvent, TouchEvent } from 'react';
+import { default as CarouselCaption } from './CarouselCaption';
+import { default as CarouselItem } from './CarouselItem';
+import { CarouselRef } from './Carousel.types';
+declare const CarouselRoot: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "className" | "children" | "onFocus" | "onBlur" | "onKeyDown" | "onMouseOut" | "onMouseOver" | "onSelect" | "onTouchEnd" | "onTouchMove" | "onTouchStart"> & import('./Carousel.types').CarouselCommonDivProps & {
+    slide?: boolean;
+    fade?: boolean;
+    controls?: boolean;
+    indicators?: boolean;
+    activeIndex?: number;
+    defaultActiveIndex?: number;
+    onSelect?: (eventKey: number, event: SyntheticEvent | null) => void;
+    onSlide?: (eventKey: number, direction: import('./Carousel.types').SlideDirection) => void;
+    onSlid?: (eventKey: number, direction: import('./Carousel.types').SlideDirection) => void;
+    interval?: number | null;
+    keyboard?: boolean;
+    onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void;
+    onFocus?: (event: FocusEvent<HTMLDivElement>) => void;
+    onBlur?: (event: FocusEvent<HTMLDivElement>) => void;
+    pause?: "hover" | false;
+    onMouseOver?: (event: MouseEvent<HTMLDivElement>) => void;
+    onMouseOut?: (event: MouseEvent<HTMLDivElement>) => void;
+    wrap?: boolean;
+    touch?: boolean;
+    onTouchStart?: (event: TouchEvent<HTMLDivElement>) => void;
+    onTouchMove?: (event: TouchEvent<HTMLDivElement>) => void;
+    onTouchEnd?: (event: TouchEvent<HTMLDivElement>) => void;
+    prevIcon?: import('react').ReactNode;
+    prevLabel?: import('react').ReactNode;
+    nextIcon?: import('react').ReactNode;
+    nextLabel?: import('react').ReactNode;
+} & import('react').RefAttributes<CarouselRef>>;
+type CarouselComponent = typeof CarouselRoot & {
+    Caption: typeof CarouselCaption;
+    Item: typeof CarouselItem;
+    PREV: 'prev';
+    NEXT: 'next';
 };
+declare const Carousel: CarouselComponent;
 export default Carousel;

package/components/carousel/Carousel.js

@@ -1,8 +1,167 @@
-import e from "react-bootstrap/Carousel";
-const r = e;
-r.PREV = "prev";
-r.NEXT = "next";
-export {
-  r as default
-};
-//# sourceMappingURL=Carousel.js.map
+import e from "../../utils/classNames.js";
+import { CAROUSEL_CLASS_NAME as t, getChildren as n, getSlideDirection as r, isVisible as i, scheduleCarouselAnimationFrame as ee } from "./carouselUtils.js";
+import a from "./CarouselCaption.js";
+import te, { defaultNextIcon as ne, defaultPrevIcon as re } from "./CarouselControls.js";
+import ie from "./CarouselIndicators.js";
+import o from "./CarouselItem.js";
+import s from "./CarouselItems.js";
+import { forwardRef as c, useCallback as l, useEffect as u, useImperativeHandle as ae, useRef as d, useState as f } from "react";
+import { useReducedMotion as oe } from "motion/react";
+import { jsx as p, jsxs as se } from "react/jsx-runtime";
+//#region src/components/carousel/Carousel.tsx
+var ce = {
+	duration: 600 / 1e3,
+	ease: "easeInOut"
+}, m = c((a, o) => {
+	let { slide: c = !0, fade: m = !1, controls: h = !0, indicators: le = !0, activeIndex: g, defaultActiveIndex: ue = 0, onSelect: _, onSlide: v, onSlid: y, interval: b = 5e3, keyboard: de = !0, onKeyDown: fe, pause: x = "hover", onFocus: pe, onBlur: me, onMouseOver: he, onMouseOut: ge, wrap: S = !0, touch: _e = !0, onTouchStart: ve, onTouchMove: ye, onTouchEnd: be, prevIcon: xe = re, prevLabel: Se = "Previous", nextIcon: Ce = ne, nextLabel: we = "Next", className: C, children: Te, ...Ee } = a, w = n(Te), T = g !== void 0, E = g ?? ue, [D, De] = f(E), O = T ? E : D, [k, A] = f(O), [Oe, j] = f(null), [M, ke] = f("next"), [Ae, N] = f("initial"), [P, F] = f(!1), [I, L] = f(!1), R = oe(), z = d(null), B = d(null), V = d(null), H = d(0), U = d(0), W = d(null), G = d(M), K = d(O), q = d(k), J = d(P), Y = w.length, X = c && !m && !R;
+	u(() => {
+		G.current = M;
+	}, [M]), u(() => {
+		K.current = O;
+	}, [O]), u(() => {
+		q.current = k;
+	}, [k]), u(() => {
+		J.current = P;
+	}, [P]), u(() => () => {
+		V.current !== null && clearTimeout(V.current), W.current !== null && clearTimeout(W.current);
+	}, []), u(() => {
+		if (O === k || P || Y === 0) return;
+		let e = B.current ?? (O > k ? "next" : "prev"), t = r(e);
+		if (B.current = null, ke(e), !c || R) {
+			A(O), v?.(O, t), y?.(O, t);
+			return;
+		}
+		j(k), A(O), F(!0), N("initial"), v?.(O, t), X || ee(() => {
+			N("sliding");
+		}), V.current = window.setTimeout(() => {
+			j(null), F(!1), N("initial"), y?.(K.current, r(G.current));
+		}, 600);
+	}, [
+		Y,
+		P,
+		y,
+		v,
+		k,
+		O,
+		R,
+		c,
+		X
+	]);
+	let Z = l((e, t, n) => {
+		J.current || e === K.current || (B.current = n, T || De(e), _?.(e, t));
+	}, [T, _]), Q = l((e) => {
+		if (J.current || Y === 0) return;
+		let t = q.current - 1;
+		if (t < 0) {
+			if (!S) return;
+			t = Y - 1;
+		}
+		Z(t, e ?? null, "prev");
+	}, [
+		Y,
+		Z,
+		S
+	]), $ = l((e) => {
+		if (J.current || Y === 0) return;
+		let t = q.current + 1;
+		if (t >= Y) {
+			if (!S) return;
+			t = 0;
+		}
+		Z(t, e ?? null, "next");
+	}, [
+		Y,
+		Z,
+		S
+	]);
+	ae(o, () => ({
+		element: z.current,
+		prev: Q,
+		next: $
+	}), [$, Q]), u(() => {
+		let e = w[k]?.props.interval ?? b;
+		if (e == null || I || P || Y <= 1) return;
+		let t = window.setInterval(() => {
+			!document.hidden && i(z.current) && $();
+		}, e);
+		return () => clearInterval(t);
+	}, [
+		Y,
+		w,
+		b,
+		P,
+		$,
+		I,
+		k
+	]);
+	let je = (e) => {
+		de && !/input|textarea/i.test(e.target.tagName) && (e.key === "ArrowLeft" ? (e.preventDefault(), Q(e)) : e.key === "ArrowRight" && (e.preventDefault(), $(e))), fe?.(e);
+	}, Me = (e) => {
+		x === "hover" && L(!0), he?.(e);
+	}, Ne = (e) => {
+		L(!1), ge?.(e);
+	}, Pe = (e) => {
+		x === "hover" && L(!0), pe?.(e);
+	}, Fe = (e) => {
+		L(!1), me?.(e);
+	}, Ie = (e) => {
+		H.current = e.touches[0]?.clientX ?? 0, U.current = 0, x === "hover" && L(!0), ve?.(e);
+	}, Le = (e) => {
+		U.current = e.touches.length > 1 ? 0 : (e.touches[0]?.clientX ?? 0) - H.current, ye?.(e);
+	}, Re = (e) => {
+		if (_e) {
+			let t = U.current;
+			Math.abs(t) > 40 && (t > 0 ? Q(e) : $(e));
+		}
+		x === "hover" && (W.current !== null && clearTimeout(W.current), W.current = window.setTimeout(() => L(!1), b ?? void 0)), be?.(e);
+	};
+	return /* @__PURE__ */ se("div", {
+		...Ee,
+		ref: z,
+		onKeyDown: je,
+		onFocus: Pe,
+		onBlur: Fe,
+		onMouseOver: Me,
+		onMouseOut: Ne,
+		onTouchStart: Ie,
+		onTouchMove: Le,
+		onTouchEnd: Re,
+		className: e(C, t, c && "slide", m && "carousel-fade"),
+		children: [
+			le && /* @__PURE__ */ p(ie, {
+				childCount: Y,
+				renderedActiveIndex: k,
+				select: Z
+			}),
+			/* @__PURE__ */ p(s, {
+				childrenArray: w,
+				renderedActiveIndex: k,
+				previousActiveIndex: Oe,
+				direction: M,
+				animationPhase: Ae,
+				isSliding: P,
+				slide: c,
+				useMotionSlide: X,
+				transition: ce
+			}),
+			h && /* @__PURE__ */ p(te, {
+				renderedActiveIndex: k,
+				childCount: Y,
+				wrap: S,
+				prev: Q,
+				next: $,
+				prevIcon: xe,
+				prevLabel: Se,
+				nextIcon: Ce,
+				nextLabel: we
+			})
+		]
+	});
+});
+m.displayName = "Carousel";
+var h = m;
+h.Caption = a, h.Item = o, h.PREV = "prev", h.NEXT = "next";
+//#endregion
+export { h as default };
+
+//# sourceMappingURL=Carousel.js.map

package/components/carousel/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.js","sources":["../../../src/components/carousel/Carousel.tsx"],"sourcesContent":["import OriginalCarousel from 'react-bootstrap/Carousel';\n\nconst Carousel = OriginalCarousel as typeof OriginalCarousel & { PREV: 'prev'; NEXT: 'next' };\n\nCarousel.PREV = 'prev';\nCarousel.NEXT = 'next';\n\nexport default Carousel;\n"],"names":["Carousel","OriginalCarousel"],"mappings":";AAEA,MAAMA,IAAWC;AAEjBD,EAAS,OAAO;AAChBA,EAAS,OAAO;"}
+{"version":3,"file":"Carousel.js","names":[],"sources":["../../../src/components/carousel/Carousel.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type FocusEvent,\n    type KeyboardEvent,\n    type MouseEvent,\n    type SyntheticEvent,\n    type TouchEvent,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from 'react';\nimport { useReducedMotion, type Transition } from 'motion/react';\n\nimport classNames from '../../utils/classNames';\nimport CarouselCaption from './CarouselCaption';\nimport CarouselControls, { defaultNextIcon, defaultPrevIcon } from './CarouselControls';\nimport CarouselIndicators from './CarouselIndicators';\nimport CarouselItem from './CarouselItem';\nimport CarouselItems from './CarouselItems';\nimport type { AnimationPhase, CarouselProps, CarouselRef, Direction } from './Carousel.types';\nimport {\n    CAROUSEL_CLASS_NAME,\n    getChildren,\n    getSlideDirection,\n    isVisible,\n    scheduleCarouselAnimationFrame,\n    SWIPE_THRESHOLD,\n    TRANSITION_DURATION,\n} from './carouselUtils';\n\nconst slideTransition: Transition = {\n    duration: TRANSITION_DURATION / 1000,\n    ease: 'easeInOut',\n};\n\nconst CarouselRoot = forwardRef<CarouselRef, CarouselProps>((props, ref) => {\n    const {\n        slide = true,\n        fade = false,\n        controls = true,\n        indicators = true,\n        activeIndex: activeIndexProp,\n        defaultActiveIndex = 0,\n        onSelect,\n        onSlide,\n        onSlid,\n        interval = 5000,\n        keyboard = true,\n        onKeyDown,\n        pause = 'hover',\n        onFocus,\n        onBlur,\n        onMouseOver,\n        onMouseOut,\n        wrap = true,\n        touch = true,\n        onTouchStart,\n        onTouchMove,\n        onTouchEnd,\n        prevIcon = defaultPrevIcon,\n        prevLabel = 'Previous',\n        nextIcon = defaultNextIcon,\n        nextLabel = 'Next',\n        className,\n        children,\n        ...remainingProps\n    } = props;\n\n    const childrenArray = getChildren(children);\n    const controlled = activeIndexProp !== undefined;\n    const activeIndex = activeIndexProp ?? defaultActiveIndex;\n    const [uncontrolledActiveIndex, setUncontrolledActiveIndex] = useState(activeIndex);\n    const selectedIndex = controlled ? activeIndex : uncontrolledActiveIndex;\n    const [renderedActiveIndex, setRenderedActiveIndex] = useState(selectedIndex);\n    const [previousActiveIndex, setPreviousActiveIndex] = useState<number | null>(null);\n    const [direction, setDirection] = useState<Direction>('next');\n    const [animationPhase, setAnimationPhase] = useState<AnimationPhase>('initial');\n    const [isSliding, setIsSliding] = useState(false);\n    const [paused, setPaused] = useState(false);\n    const shouldReduceMotion = useReducedMotion();\n    const elementRef = useRef<HTMLDivElement | null>(null);\n    const nextDirectionRef = useRef<Direction | null>(null);\n    const slideTimeoutRef = useRef<number | null>(null);\n    const touchStartXRef = useRef(0);\n    const touchDeltaXRef = useRef(0);\n    const touchUnpauseTimeoutRef = useRef<number | null>(null);\n\n    const directionRef = useRef(direction);\n    const selectedIndexRef = useRef(selectedIndex);\n    const renderedActiveIndexRef = useRef(renderedActiveIndex);\n    const isSlidingRef = useRef(isSliding);\n\n    const childCount = childrenArray.length;\n    const useMotionSlide = slide && !fade && !shouldReduceMotion;\n\n    useEffect(() => {\n        directionRef.current = direction;\n    }, [direction]);\n\n    useEffect(() => {\n        selectedIndexRef.current = selectedIndex;\n    }, [selectedIndex]);\n\n    useEffect(() => {\n        renderedActiveIndexRef.current = renderedActiveIndex;\n    }, [renderedActiveIndex]);\n\n    useEffect(() => {\n        isSlidingRef.current = isSliding;\n    }, [isSliding]);\n\n    useEffect(\n        () => () => {\n            if (slideTimeoutRef.current !== null) {\n                clearTimeout(slideTimeoutRef.current);\n            }\n\n            if (touchUnpauseTimeoutRef.current !== null) {\n                clearTimeout(touchUnpauseTimeoutRef.current);\n            }\n        },\n        []\n    );\n\n    useEffect(() => {\n        if (selectedIndex === renderedActiveIndex || isSliding || childCount === 0) {\n            return;\n        }\n\n        const nextDirection = nextDirectionRef.current ?? (selectedIndex > renderedActiveIndex ? 'next' : 'prev');\n        const nextSlideDirection = getSlideDirection(nextDirection);\n\n        nextDirectionRef.current = null;\n        setDirection(nextDirection);\n\n        if (!slide || shouldReduceMotion) {\n            setRenderedActiveIndex(selectedIndex);\n            onSlide?.(selectedIndex, nextSlideDirection);\n            onSlid?.(selectedIndex, nextSlideDirection);\n            return;\n        }\n\n        setPreviousActiveIndex(renderedActiveIndex);\n        setRenderedActiveIndex(selectedIndex);\n        setIsSliding(true);\n        setAnimationPhase('initial');\n        onSlide?.(selectedIndex, nextSlideDirection);\n\n        if (!useMotionSlide) {\n            scheduleCarouselAnimationFrame(() => {\n                setAnimationPhase('sliding');\n            });\n        }\n\n        slideTimeoutRef.current = window.setTimeout(() => {\n            setPreviousActiveIndex(null);\n            setIsSliding(false);\n            setAnimationPhase('initial');\n            onSlid?.(selectedIndexRef.current, getSlideDirection(directionRef.current));\n        }, TRANSITION_DURATION);\n    }, [\n        childCount,\n        isSliding,\n        onSlid,\n        onSlide,\n        renderedActiveIndex,\n        selectedIndex,\n        shouldReduceMotion,\n        slide,\n        useMotionSlide,\n    ]);\n\n    const select = useCallback(\n        (nextIndex: number, event: SyntheticEvent | null, nextDirection: Direction) => {\n            if (isSlidingRef.current || nextIndex === selectedIndexRef.current) {\n                return;\n            }\n\n            nextDirectionRef.current = nextDirection;\n\n            if (!controlled) {\n                setUncontrolledActiveIndex(nextIndex);\n            }\n\n            onSelect?.(nextIndex, event);\n        },\n        [controlled, onSelect]\n    );\n\n    const prev = useCallback(\n        (event?: SyntheticEvent) => {\n            if (isSlidingRef.current || childCount === 0) {\n                return;\n            }\n\n            const currentIndex = renderedActiveIndexRef.current;\n            let nextIndex = currentIndex - 1;\n\n            if (nextIndex < 0) {\n                if (!wrap) {\n                    return;\n                }\n\n                nextIndex = childCount - 1;\n            }\n\n            select(nextIndex, event ?? null, 'prev');\n        },\n        [childCount, select, wrap]\n    );\n\n    const next = useCallback(\n        (event?: SyntheticEvent) => {\n            if (isSlidingRef.current || childCount === 0) {\n                return;\n            }\n\n            const currentIndex = renderedActiveIndexRef.current;\n            let nextIndex = currentIndex + 1;\n\n            if (nextIndex >= childCount) {\n                if (!wrap) {\n                    return;\n                }\n\n                nextIndex = 0;\n            }\n\n            select(nextIndex, event ?? null, 'next');\n        },\n        [childCount, select, wrap]\n    );\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            element: elementRef.current,\n            prev,\n            next,\n        }),\n        [next, prev]\n    );\n\n    useEffect(() => {\n        const activeChildInterval = childrenArray[renderedActiveIndex]?.props.interval;\n        const autoplayInterval = activeChildInterval ?? interval;\n\n        if (autoplayInterval == null || paused || isSliding || childCount <= 1) {\n            return;\n        }\n\n        const intervalId = window.setInterval(() => {\n            if (!document.hidden && isVisible(elementRef.current)) {\n                next();\n            }\n        }, autoplayInterval);\n\n        return () => clearInterval(intervalId);\n    }, [childCount, childrenArray, interval, isSliding, next, paused, renderedActiveIndex]);\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n        if (keyboard && !/input|textarea/i.test((event.target as HTMLElement).tagName)) {\n            if (event.key === 'ArrowLeft') {\n                event.preventDefault();\n                prev(event);\n            } else if (event.key === 'ArrowRight') {\n                event.preventDefault();\n                next(event);\n            }\n        }\n\n        onKeyDown?.(event);\n    };\n\n    const handleMouseOver = (event: MouseEvent<HTMLDivElement>) => {\n        if (pause === 'hover') {\n            setPaused(true);\n        }\n\n        onMouseOver?.(event);\n    };\n\n    const handleMouseOut = (event: MouseEvent<HTMLDivElement>) => {\n        setPaused(false);\n        onMouseOut?.(event);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n        if (pause === 'hover') {\n            setPaused(true);\n        }\n\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n        setPaused(false);\n        onBlur?.(event);\n    };\n\n    const handleTouchStart = (event: TouchEvent<HTMLDivElement>) => {\n        touchStartXRef.current = event.touches[0]?.clientX ?? 0;\n        touchDeltaXRef.current = 0;\n\n        if (pause === 'hover') {\n            setPaused(true);\n        }\n\n        onTouchStart?.(event);\n    };\n\n    const handleTouchMove = (event: TouchEvent<HTMLDivElement>) => {\n        touchDeltaXRef.current =\n            event.touches.length > 1 ? 0 : (event.touches[0]?.clientX ?? 0) - touchStartXRef.current;\n        onTouchMove?.(event);\n    };\n\n    const handleTouchEnd = (event: TouchEvent<HTMLDivElement>) => {\n        if (touch) {\n            const touchDeltaX = touchDeltaXRef.current;\n\n            if (Math.abs(touchDeltaX) > SWIPE_THRESHOLD) {\n                if (touchDeltaX > 0) {\n                    prev(event);\n                } else {\n                    next(event);\n                }\n            }\n        }\n\n        if (pause === 'hover') {\n            if (touchUnpauseTimeoutRef.current !== null) {\n                clearTimeout(touchUnpauseTimeoutRef.current);\n            }\n\n            touchUnpauseTimeoutRef.current = window.setTimeout(() => setPaused(false), interval ?? undefined);\n        }\n\n        onTouchEnd?.(event);\n    };\n\n    return (\n        <div\n            {...remainingProps}\n            ref={elementRef}\n            onKeyDown={handleKeyDown}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onMouseOver={handleMouseOver}\n            onMouseOut={handleMouseOut}\n            onTouchStart={handleTouchStart}\n            onTouchMove={handleTouchMove}\n            onTouchEnd={handleTouchEnd}\n            className={classNames(\n                className,\n                CAROUSEL_CLASS_NAME,\n                slide && 'slide',\n                fade && `${CAROUSEL_CLASS_NAME}-fade`\n            )}\n        >\n            {indicators && (\n                <CarouselIndicators childCount={childCount} renderedActiveIndex={renderedActiveIndex} select={select} />\n            )}\n            <CarouselItems\n                childrenArray={childrenArray}\n                renderedActiveIndex={renderedActiveIndex}\n                previousActiveIndex={previousActiveIndex}\n                direction={direction}\n                animationPhase={animationPhase}\n                isSliding={isSliding}\n                slide={slide}\n                useMotionSlide={useMotionSlide}\n                transition={slideTransition}\n            />\n            {controls && (\n                <CarouselControls\n                    renderedActiveIndex={renderedActiveIndex}\n                    childCount={childCount}\n                    wrap={wrap}\n                    prev={prev}\n                    next={next}\n                    prevIcon={prevIcon}\n                    prevLabel={prevLabel}\n                    nextIcon={nextIcon}\n                    nextLabel={nextLabel}\n                />\n            )}\n        </div>\n    );\n});\n\nCarouselRoot.displayName = 'Carousel';\n\ntype CarouselComponent = typeof CarouselRoot & {\n    Caption: typeof CarouselCaption;\n    Item: typeof CarouselItem;\n    PREV: 'prev';\n    NEXT: 'next';\n};\n\nconst Carousel = CarouselRoot as CarouselComponent;\n\nCarousel.Caption = CarouselCaption;\nCarousel.Item = CarouselItem;\nCarousel.PREV = 'prev';\nCarousel.NEXT = 'next';\n\nexport default Carousel;\n"],"mappings":";;;;;;;;;;;AAgCA,IAAM,KAA8B;CAChC,UAAA,MAAgC;CAChC,MAAM;AACV,GAEM,IAAe,GAAwC,GAAO,MAAQ;CACxE,IAAM,EACF,WAAQ,IACR,UAAO,IACP,cAAW,IACX,iBAAa,IACb,aAAa,GACb,yBAAqB,GACrB,aACA,YACA,WACA,cAAW,KACX,eAAW,IACX,eACA,WAAQ,SACR,aACA,YACA,iBACA,gBACA,UAAO,IACP,YAAQ,IACR,kBACA,iBACA,gBACA,eAAW,IACX,gBAAY,YACZ,eAAW,IACX,gBAAY,QACZ,cACA,cACA,GAAG,OACH,GAEE,IAAgB,EAAY,EAAQ,GACpC,IAAa,MAAoB,KAAA,GACjC,IAAc,KAAmB,IACjC,CAAC,GAAyB,MAA8B,EAAS,CAAW,GAC5E,IAAgB,IAAa,IAAc,GAC3C,CAAC,GAAqB,KAA0B,EAAS,CAAa,GACtE,CAAC,IAAqB,KAA0B,EAAwB,IAAI,GAC5E,CAAC,GAAW,MAAgB,EAAoB,MAAM,GACtD,CAAC,IAAgB,KAAqB,EAAyB,SAAS,GACxE,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,CAAC,GAAQ,KAAa,EAAS,EAAK,GACpC,IAAqB,GAAiB,GACtC,IAAa,EAA8B,IAAI,GAC/C,IAAmB,EAAyB,IAAI,GAChD,IAAkB,EAAsB,IAAI,GAC5C,IAAiB,EAAO,CAAC,GACzB,IAAiB,EAAO,CAAC,GACzB,IAAyB,EAAsB,IAAI,GAEnD,IAAe,EAAO,CAAS,GAC/B,IAAmB,EAAO,CAAa,GACvC,IAAyB,EAAO,CAAmB,GACnD,IAAe,EAAO,CAAS,GAE/B,IAAa,EAAc,QAC3B,IAAiB,KAAS,CAAC,KAAQ,CAAC;CA+B1C,AA7BA,QAAgB;EACZ,EAAa,UAAU;CAC3B,GAAG,CAAC,CAAS,CAAC,GAEd,QAAgB;EACZ,EAAiB,UAAU;CAC/B,GAAG,CAAC,CAAa,CAAC,GAElB,QAAgB;EACZ,EAAuB,UAAU;CACrC,GAAG,CAAC,CAAmB,CAAC,GAExB,QAAgB;EACZ,EAAa,UAAU;CAC3B,GAAG,CAAC,CAAS,CAAC,GAEd,cACgB;EAKR,AAJI,EAAgB,YAAY,QAC5B,aAAa,EAAgB,OAAO,GAGpC,EAAuB,YAAY,QACnC,aAAa,EAAuB,OAAO;CAEnD,GACA,CAAC,CACL,GAEA,QAAgB;EACZ,IAAI,MAAkB,KAAuB,KAAa,MAAe,GACrE;EAGJ,IAAM,IAAgB,EAAiB,YAAY,IAAgB,IAAsB,SAAS,SAC5F,IAAqB,EAAkB,CAAa;EAK1D,IAHA,EAAiB,UAAU,MAC3B,GAAa,CAAa,GAEtB,CAAC,KAAS,GAAoB;GAG9B,AAFA,EAAuB,CAAa,GACpC,IAAU,GAAe,CAAkB,GAC3C,IAAS,GAAe,CAAkB;GAC1C;EACJ;EAcA,AAZA,EAAuB,CAAmB,GAC1C,EAAuB,CAAa,GACpC,EAAa,EAAI,GACjB,EAAkB,SAAS,GAC3B,IAAU,GAAe,CAAkB,GAEtC,KACD,SAAqC;GACjC,EAAkB,SAAS;EAC/B,CAAC,GAGL,EAAgB,UAAU,OAAO,iBAAiB;GAI9C,AAHA,EAAuB,IAAI,GAC3B,EAAa,EAAK,GAClB,EAAkB,SAAS,GAC3B,IAAS,EAAiB,SAAS,EAAkB,EAAa,OAAO,CAAC;EAC9E,GAAA,GAAsB;CAC1B,GAAG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACJ,CAAC;CAED,IAAM,IAAS,GACV,GAAmB,GAA8B,MAA6B;EACvE,EAAa,WAAW,MAAc,EAAiB,YAI3D,EAAiB,UAAU,GAEtB,KACD,GAA2B,CAAS,GAGxC,IAAW,GAAW,CAAK;CAC/B,GACA,CAAC,GAAY,CAAQ,CACzB,GAEM,IAAO,GACR,MAA2B;EACxB,IAAI,EAAa,WAAW,MAAe,GACvC;EAIJ,IAAI,IADiB,EAAuB,UACb;EAE/B,IAAI,IAAY,GAAG;GACf,IAAI,CAAC,GACD;GAGJ,IAAY,IAAa;EAC7B;EAEA,EAAO,GAAW,KAAS,MAAM,MAAM;CAC3C,GACA;EAAC;EAAY;EAAQ;CAAI,CAC7B,GAEM,IAAO,GACR,MAA2B;EACxB,IAAI,EAAa,WAAW,MAAe,GACvC;EAIJ,IAAI,IADiB,EAAuB,UACb;EAE/B,IAAI,KAAa,GAAY;GACzB,IAAI,CAAC,GACD;GAGJ,IAAY;EAChB;EAEA,EAAO,GAAW,KAAS,MAAM,MAAM;CAC3C,GACA;EAAC;EAAY;EAAQ;CAAI,CAC7B;CAYA,AAVA,GACI,UACO;EACH,SAAS,EAAW;EACpB;EACA;CACJ,IACA,CAAC,GAAM,CAAI,CACf,GAEA,QAAgB;EAEZ,IAAM,IADsB,EAAc,EAAoB,EAAE,MAAM,YACtB;EAEhD,IAAI,KAAoB,QAAQ,KAAU,KAAa,KAAc,GACjE;EAGJ,IAAM,IAAa,OAAO,kBAAkB;GACxC,AAAI,CAAC,SAAS,UAAU,EAAU,EAAW,OAAO,KAChD,EAAK;EAEb,GAAG,CAAgB;EAEnB,aAAa,cAAc,CAAU;CACzC,GAAG;EAAC;EAAY;EAAe;EAAU;EAAW;EAAM;EAAQ;CAAmB,CAAC;CAEtF,IAAM,MAAiB,MAAyC;EAW5D,AAVI,MAAY,CAAC,kBAAkB,KAAM,EAAM,OAAuB,OAAO,MACrE,EAAM,QAAQ,eACd,EAAM,eAAe,GACrB,EAAK,CAAK,KACH,EAAM,QAAQ,iBACrB,EAAM,eAAe,GACrB,EAAK,CAAK,KAIlB,KAAY,CAAK;CACrB,GAEM,MAAmB,MAAsC;EAK3D,AAJI,MAAU,WACV,EAAU,EAAI,GAGlB,KAAc,CAAK;CACvB,GAEM,MAAkB,MAAsC;EAE1D,AADA,EAAU,EAAK,GACf,KAAa,CAAK;CACtB,GAEM,MAAe,MAAsC;EAKvD,AAJI,MAAU,WACV,EAAU,EAAI,GAGlB,KAAU,CAAK;CACnB,GAEM,MAAc,MAAsC;EAEtD,AADA,EAAU,EAAK,GACf,KAAS,CAAK;CAClB,GAEM,MAAoB,MAAsC;EAQ5D,AAPA,EAAe,UAAU,EAAM,QAAQ,EAAE,EAAE,WAAW,GACtD,EAAe,UAAU,GAErB,MAAU,WACV,EAAU,EAAI,GAGlB,KAAe,CAAK;CACxB,GAEM,MAAmB,MAAsC;EAG3D,AAFA,EAAe,UACX,EAAM,QAAQ,SAAS,IAAI,KAAK,EAAM,QAAQ,EAAE,EAAE,WAAW,KAAK,EAAe,SACrF,KAAc,CAAK;CACvB,GAEM,MAAkB,MAAsC;EAC1D,IAAI,IAAO;GACP,IAAM,IAAc,EAAe;GAEnC,AAAI,KAAK,IAAI,CAAW,IAAA,OAChB,IAAc,IACd,EAAK,CAAK,IAEV,EAAK,CAAK;EAGtB;EAUA,AARI,MAAU,YACN,EAAuB,YAAY,QACnC,aAAa,EAAuB,OAAO,GAG/C,EAAuB,UAAU,OAAO,iBAAiB,EAAU,EAAK,GAAG,KAAY,KAAA,CAAS,IAGpG,KAAa,CAAK;CACtB;CAEA,OACI,mBAAC,OAAD;EACI,GAAI;EACJ,KAAK;EACL,WAAW;EACX,SAAS;EACT,QAAQ;EACR,aAAa;EACb,YAAY;EACZ,cAAc;EACd,aAAa;EACb,YAAY;EACZ,WAAW,EACP,GACA,GACA,KAAS,SACT,KAAQ,eACZ;YAhBJ;GAkBK,MACG,kBAAC,IAAD;IAAgC;IAAiC;IAA6B;GAAS,CAAA;GAE3G,kBAAC,GAAD;IACmB;IACM;IACA;IACV;IACK;IACL;IACJ;IACS;IAChB,YAAY;GACf,CAAA;GACA,KACG,kBAAC,IAAD;IACyB;IACT;IACN;IACA;IACA;IACI;IACC;IACD;IACC;GACd,CAAA;EAEJ;;AAEb,CAAC;AAED,EAAa,cAAc;AAS3B,IAAM,IAAW;AAEjB,EAAS,UAAU,GACnB,EAAS,OAAO,GAChB,EAAS,OAAO,QAChB,EAAS,OAAO"}