@tribepad/themis 1.0.0

package/dist/chunk-X25TNRSD.mjs

@@ -0,0 +1,364 @@
+import { Button } from './chunk-BDXKKMBZ.mjs';
+import { cn } from './chunk-E2KQFV3O.mjs';
+import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
+import { ChevronUpIcon, ChevronDownIcon, PlayIcon, PauseIcon } from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var MIN_ITEM_DURATION_MS = 1e3;
+var TIMER_CHECK_INTERVAL_MS = 1e3;
+function buildManifest(durations) {
+  let cumulative = 0;
+  return durations.map((duration, index) => {
+    const start = cumulative;
+    const safeDuration = Math.max(duration, MIN_ITEM_DURATION_MS);
+    cumulative += safeDuration;
+    return { index, startTime: start, endTime: cumulative };
+  });
+}
+function getCurrentItemIndex(manifest, elapsed) {
+  if (manifest.length === 0) return 0;
+  const totalDuration = manifest[manifest.length - 1]?.endTime ?? 0;
+  if (totalDuration === 0) return 0;
+  const normalizedElapsed = elapsed % totalDuration;
+  const item = manifest.find(
+    (m) => normalizedElapsed >= m.startTime && normalizedElapsed < m.endTime
+  );
+  return item?.index ?? 0;
+}
+function shouldUsePerItemTiming(itemsLength, itemDurations, autoRotateInterval) {
+  if (autoRotateInterval === 0) return false;
+  if (!itemDurations || itemDurations.length === 0) return false;
+  if (itemDurations.length !== itemsLength) {
+    console.warn(
+      "Carousel: itemDurations length does not match items length. Falling back to autoRotateInterval."
+    );
+    return false;
+  }
+  return true;
+}
+function Carousel({
+  items,
+  autoRotateInterval = 5e3,
+  defaultIndex = 0,
+  currentIndex: controlledIndex,
+  onIndexChange,
+  isPaused: controlledIsPaused,
+  onPauseChange,
+  collapsible = false,
+  defaultMinimized = false,
+  isMinimized: controlledIsMinimized,
+  onMinimizeChange,
+  minimizedLabel = "Carousel (minimized)",
+  label = "Carousel",
+  slideLabel,
+  showNavigation = true,
+  showPlayPause = true,
+  respectReducedMotion = true,
+  className,
+  slideClassName,
+  navigationClassName,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  // Per-item timing props
+  itemDurations,
+  elapsedTime: controlledElapsedTime,
+  onElapsedTimeChange,
+  ...props
+}) {
+  const isControlled = controlledIndex !== void 0;
+  const isPauseControlled = controlledIsPaused !== void 0;
+  const isMinimizedControlled = controlledIsMinimized !== void 0;
+  const isElapsedTimeControlled = controlledElapsedTime !== void 0;
+  const [internalIndex, setInternalIndex] = useState(defaultIndex);
+  const [internalIsPaused, setInternalIsPaused] = useState(false);
+  const [internalIsMinimized, setInternalIsMinimized] = useState(defaultMinimized);
+  const [_internalElapsedTime, setInternalElapsedTime] = useState(() => {
+    if (!itemDurations || itemDurations.length === 0) return 0;
+    if (itemDurations.length !== items.length) return 0;
+    if (defaultIndex === 0) return 0;
+    const tempManifest = buildManifest(itemDurations);
+    return tempManifest[defaultIndex]?.startTime ?? 0;
+  });
+  const wasPlayingBeforeMinimize = useRef(false);
+  const currentIndex = isControlled ? controlledIndex : internalIndex;
+  const isPaused = isPauseControlled ? controlledIsPaused : internalIsPaused;
+  const isMinimized = isMinimizedControlled ? controlledIsMinimized : internalIsMinimized;
+  const usePerItemTiming = useMemo(
+    () => shouldUsePerItemTiming(items.length, itemDurations, autoRotateInterval),
+    [items.length, itemDurations, autoRotateInterval]
+  );
+  const manifest = useMemo(() => {
+    if (!usePerItemTiming || !itemDurations) return [];
+    return buildManifest(itemDurations);
+  }, [usePerItemTiming, itemDurations]);
+  const totalDuration = useMemo(() => {
+    if (manifest.length === 0) return 0;
+    return manifest[manifest.length - 1]?.endTime ?? 0;
+  }, [manifest]);
+  const goToSlide = useCallback(
+    (index) => {
+      if (isControlled) {
+        onIndexChange?.(index);
+      } else {
+        setInternalIndex(index);
+      }
+      if (usePerItemTiming && manifest[index]) {
+        const newElapsed = manifest[index].startTime;
+        if (!isElapsedTimeControlled) {
+          setInternalElapsedTime(newElapsed);
+        }
+        onElapsedTimeChange?.(newElapsed);
+      }
+      if (isPauseControlled) {
+        onPauseChange?.(true);
+      } else {
+        setInternalIsPaused(true);
+      }
+    },
+    [
+      isControlled,
+      isPauseControlled,
+      isElapsedTimeControlled,
+      onIndexChange,
+      onPauseChange,
+      onElapsedTimeChange,
+      usePerItemTiming,
+      manifest
+    ]
+  );
+  const togglePause = useCallback(() => {
+    const newPauseState = !isPaused;
+    if (isPauseControlled) {
+      onPauseChange?.(newPauseState);
+    } else {
+      setInternalIsPaused(newPauseState);
+    }
+  }, [isPaused, isPauseControlled, onPauseChange]);
+  const toggleMinimize = useCallback(() => {
+    const newMinimizedState = !isMinimized;
+    if (newMinimizedState) {
+      wasPlayingBeforeMinimize.current = !isPaused;
+    } else {
+      if (wasPlayingBeforeMinimize.current && isPaused) {
+        if (isPauseControlled) {
+          onPauseChange?.(false);
+        } else {
+          setInternalIsPaused(false);
+        }
+      }
+      wasPlayingBeforeMinimize.current = false;
+    }
+    if (isMinimizedControlled) {
+      onMinimizeChange?.(newMinimizedState);
+    } else {
+      setInternalIsMinimized(newMinimizedState);
+    }
+  }, [isMinimized, isMinimizedControlled, onMinimizeChange, isPaused, isPauseControlled, onPauseChange]);
+  useEffect(() => {
+    if (autoRotateInterval === 0) return;
+    if (respectReducedMotion) {
+      if (typeof window !== "undefined" && window.matchMedia) {
+        const prefersReducedMotion = window.matchMedia(
+          "(prefers-reduced-motion: reduce)"
+        ).matches;
+        if (prefersReducedMotion) {
+          if (isPauseControlled) {
+            onPauseChange?.(true);
+          } else {
+            setInternalIsPaused(true);
+          }
+        }
+      }
+    }
+  }, [autoRotateInterval, respectReducedMotion, isPauseControlled, onPauseChange]);
+  const currentIndexRef = useRef(currentIndex);
+  currentIndexRef.current = currentIndex;
+  useEffect(() => {
+    if (!usePerItemTiming) return;
+    if (autoRotateInterval === 0) return;
+    if (isPaused || isMinimized) return;
+    if (isElapsedTimeControlled) return;
+    const interval = setInterval(() => {
+      setInternalElapsedTime((prevElapsed) => {
+        let newElapsed = prevElapsed + TIMER_CHECK_INTERVAL_MS;
+        if (totalDuration > 0 && newElapsed >= totalDuration) {
+          newElapsed = 0;
+        }
+        onElapsedTimeChange?.(newElapsed);
+        const newIndex = getCurrentItemIndex(manifest, newElapsed);
+        if (newIndex !== currentIndexRef.current) {
+          if (isControlled) {
+            onIndexChange?.(newIndex);
+          } else {
+            setInternalIndex(newIndex);
+          }
+        }
+        return newElapsed;
+      });
+    }, TIMER_CHECK_INTERVAL_MS);
+    return () => clearInterval(interval);
+  }, [
+    usePerItemTiming,
+    autoRotateInterval,
+    isPaused,
+    isMinimized,
+    isElapsedTimeControlled,
+    totalDuration,
+    manifest,
+    isControlled,
+    onIndexChange,
+    onElapsedTimeChange
+  ]);
+  useEffect(() => {
+    if (usePerItemTiming) return;
+    if (autoRotateInterval === 0) return;
+    if (isPaused || isMinimized) return;
+    const interval = setInterval(() => {
+      const nextIndex = (currentIndex + 1) % items.length;
+      if (isControlled) {
+        onIndexChange?.(nextIndex);
+      } else {
+        setInternalIndex(nextIndex);
+      }
+    }, autoRotateInterval);
+    return () => clearInterval(interval);
+  }, [
+    usePerItemTiming,
+    autoRotateInterval,
+    currentIndex,
+    isPaused,
+    isMinimized,
+    items.length,
+    isControlled,
+    onIndexChange
+  ]);
+  useEffect(() => {
+    if (!usePerItemTiming || !isElapsedTimeControlled) return;
+    const newIndex = getCurrentItemIndex(manifest, controlledElapsedTime);
+    if (newIndex !== currentIndex) {
+      if (isControlled) {
+        onIndexChange?.(newIndex);
+      } else {
+        setInternalIndex(newIndex);
+      }
+    }
+  }, [
+    usePerItemTiming,
+    isElapsedTimeControlled,
+    controlledElapsedTime,
+    manifest,
+    currentIndex,
+    isControlled,
+    onIndexChange
+  ]);
+  const currentSlideLabel = slideLabel ? slideLabel(currentIndex, items.length) : `Slide ${currentIndex + 1} of ${items.length}`;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "flex flex-col mb-4 transition-all duration-300",
+        !isMinimized && "space-y-4",
+        className
+      ),
+      role: "region",
+      "aria-roledescription": "carousel",
+      "aria-label": isMinimized ? minimizedLabel : ariaLabel || label,
+      "aria-labelledby": ariaLabelledBy,
+      ...props,
+      children: isMinimized && collapsible ? /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "bg-[var(--primary)] rounded-lg px-4 py-2 shadow-md",
+            "flex items-center justify-between gap-4"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-[var(--primary-foreground)] text-sm", children: [
+              minimizedLabel,
+              " - ",
+              currentSlideLabel
+            ] }),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                visualSize: "icon",
+                onPress: toggleMinimize,
+                "aria-label": "Expand carousel",
+                "aria-expanded": false,
+                children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "w-5 h-5" })
+              }
+            )
+          ]
+        }
+      ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "bg-[var(--primary)] rounded-lg p-4 overflow-hidden shadow-md",
+              "slide-in-animation",
+              slideClassName
+            ),
+            role: "group",
+            "aria-roledescription": "slide",
+            "aria-label": currentSlideLabel,
+            "aria-live": "polite",
+            "aria-atomic": "true",
+            children: /* @__PURE__ */ jsx("div", { className: "text-[var(--primary-foreground)] min-h-[2rem] flex items-center", children: items[currentIndex] })
+          },
+          currentIndex
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+          showNavigation && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn("flex items-center", navigationClassName),
+              role: "group",
+              "aria-label": "Slide navigation",
+              children: items.map((_, index) => /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: index === currentIndex ? "default" : "outline",
+                  visualSize: "dot",
+                  onPress: () => goToSlide(index),
+                  "aria-label": `Go to slide ${index + 1}`,
+                  "aria-current": index === currentIndex ? true : void 0
+                },
+                index
+              ))
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            collapsible && /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "default",
+                visualSize: "icon",
+                onPress: toggleMinimize,
+                "aria-label": "Minimize carousel",
+                "aria-expanded": true,
+                children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "w-5 h-5" })
+              }
+            ),
+            showPlayPause && autoRotateInterval > 0 && /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "default",
+                visualSize: "icon",
+                onPress: togglePause,
+                "aria-label": isPaused ? "Play carousel" : "Pause carousel",
+                children: isPaused ? /* @__PURE__ */ jsx(PlayIcon, { className: "w-5 h-5" }) : /* @__PURE__ */ jsx(PauseIcon, { className: "w-5 h-5" })
+              }
+            )
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+Carousel.displayName = "Carousel";
+
+export { Carousel };
+//# sourceMappingURL=chunk-X25TNRSD.mjs.map
+//# sourceMappingURL=chunk-X25TNRSD.mjs.map

package/dist/chunk-X25TNRSD.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/elements/Carousel/Carousel.tsx"],"names":[],"mappings":"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","file":"chunk-X25TNRSD.mjs","sourcesContent":["'use client';\n\n/**\n * Carousel Component\n * Accessible carousel for displaying rotating content with React Node support\n *\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AA minimum)\n */\n\nimport { useState, useEffect, useCallback, useMemo, useRef, type ReactNode } from 'react';\nimport { Button } from '../Button';\nimport { PauseIcon, PlayIcon, ChevronUpIcon, ChevronDownIcon } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport type { CarouselProps, ItemManifest } from './Carousel.types';\n\n/**\n * Minimum duration for any item in milliseconds.\n * Prevents disorienting rapid transitions and allows screen readers time to announce.\n */\nconst MIN_ITEM_DURATION_MS = 1000;\n\n/**\n * Timer check interval in milliseconds.\n * Used for per-item timing mode to check if item should transition.\n */\nconst TIMER_CHECK_INTERVAL_MS = 1000;\n\n/**\n * Builds a manifest mapping cumulative time thresholds to item indices.\n * @param durations - Array of durations in milliseconds for each item\n * @returns Array of ItemManifest entries with startTime and endTime\n */\nfunction buildManifest(durations: number[]): ItemManifest[] {\n  let cumulative = 0;\n  return durations.map((duration, index) => {\n    const start = cumulative;\n    // Enforce minimum duration\n    const safeDuration = Math.max(duration, MIN_ITEM_DURATION_MS);\n    cumulative += safeDuration;\n    return { index, startTime: start, endTime: cumulative };\n  });\n}\n\n/**\n * Gets the item index that should be displayed for a given elapsed time.\n * @param manifest - Array of ItemManifest entries\n * @param elapsed - Current elapsed time in milliseconds\n * @returns The index of the item that should be displayed\n */\nfunction getCurrentItemIndex(manifest: ItemManifest[], elapsed: number): number {\n  if (manifest.length === 0) return 0;\n\n  const totalDuration = manifest[manifest.length - 1]?.endTime ?? 0;\n  if (totalDuration === 0) return 0;\n\n  // Normalize elapsed time to handle wraparound\n  const normalizedElapsed = elapsed % totalDuration;\n\n  const item = manifest.find(\n    (m) => normalizedElapsed >= m.startTime && normalizedElapsed < m.endTime\n  );\n  return item?.index ?? 0;\n}\n\n/**\n * Validates whether per-item timing should be used.\n * @param itemsLength - Number of items in the carousel\n * @param itemDurations - Optional array of durations\n * @param autoRotateInterval - The autoRotateInterval setting\n * @returns true if per-item timing should be used\n */\nfunction shouldUsePerItemTiming(\n  itemsLength: number,\n  itemDurations: number[] | undefined,\n  autoRotateInterval: number\n): boolean {\n  // Disabled if autoRotateInterval is 0\n  if (autoRotateInterval === 0) return false;\n\n  // Must have itemDurations array\n  if (!itemDurations || itemDurations.length === 0) return false;\n\n  // Array length must match items length\n  if (itemDurations.length !== itemsLength) {\n    console.warn(\n      'Carousel: itemDurations length does not match items length. ' +\n        'Falling back to autoRotateInterval.'\n    );\n    return false;\n  }\n\n  return true;\n}\n\nexport function Carousel({\n  items,\n  autoRotateInterval = 5000,\n  defaultIndex = 0,\n  currentIndex: controlledIndex,\n  onIndexChange,\n  isPaused: controlledIsPaused,\n  onPauseChange,\n  collapsible = false,\n  defaultMinimized = false,\n  isMinimized: controlledIsMinimized,\n  onMinimizeChange,\n  minimizedLabel = 'Carousel (minimized)',\n  label = 'Carousel',\n  slideLabel,\n  showNavigation = true,\n  showPlayPause = true,\n  respectReducedMotion = true,\n  className,\n  slideClassName,\n  navigationClassName,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  // Per-item timing props\n  itemDurations,\n  elapsedTime: controlledElapsedTime,\n  onElapsedTimeChange,\n  ...props\n}: CarouselProps): ReactNode {\n  // Determine if component is controlled or uncontrolled\n  const isControlled = controlledIndex !== undefined;\n  const isPauseControlled = controlledIsPaused !== undefined;\n  const isMinimizedControlled = controlledIsMinimized !== undefined;\n  const isElapsedTimeControlled = controlledElapsedTime !== undefined;\n\n  // Internal state for uncontrolled mode\n  const [internalIndex, setInternalIndex] = useState(defaultIndex);\n  const [internalIsPaused, setInternalIsPaused] = useState(false);\n  const [internalIsMinimized, setInternalIsMinimized] = useState(defaultMinimized);\n\n  // Calculate initial elapsed time based on defaultIndex if itemDurations is provided\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const [_internalElapsedTime, setInternalElapsedTime] = useState(() => {\n    if (!itemDurations || itemDurations.length === 0) return 0;\n    if (itemDurations.length !== items.length) return 0;\n    if (defaultIndex === 0) return 0;\n\n    // Build manifest to find the startTime for the default index\n    const tempManifest = buildManifest(itemDurations);\n    return tempManifest[defaultIndex]?.startTime ?? 0;\n  });\n\n  // Ref to track if carousel was playing before minimize\n  const wasPlayingBeforeMinimize = useRef(false);\n\n  // Use controlled value if provided, otherwise use internal state\n  const currentIndex = isControlled ? controlledIndex : internalIndex;\n  const isPaused = isPauseControlled ? controlledIsPaused : internalIsPaused;\n  const isMinimized = isMinimizedControlled\n    ? controlledIsMinimized\n    : internalIsMinimized;\n  // Determine if per-item timing should be used\n  const usePerItemTiming = useMemo(\n    () => shouldUsePerItemTiming(items.length, itemDurations, autoRotateInterval),\n    [items.length, itemDurations, autoRotateInterval]\n  );\n\n  // Build the manifest for per-item timing (memoized)\n  const manifest = useMemo(() => {\n    if (!usePerItemTiming || !itemDurations) return [];\n    return buildManifest(itemDurations);\n  }, [usePerItemTiming, itemDurations]);\n\n  // Calculate total duration (memoized)\n  const totalDuration = useMemo(() => {\n    if (manifest.length === 0) return 0;\n    return manifest[manifest.length - 1]?.endTime ?? 0;\n  }, [manifest]);\n\n  // Navigation handler\n  const goToSlide = useCallback(\n    (index: number) => {\n      if (isControlled) {\n        onIndexChange?.(index);\n      } else {\n        setInternalIndex(index);\n      }\n\n      // For per-item timing, jump elapsed time to item's startTime\n      if (usePerItemTiming && manifest[index]) {\n        const newElapsed = manifest[index].startTime;\n        if (!isElapsedTimeControlled) {\n          setInternalElapsedTime(newElapsed);\n        }\n        onElapsedTimeChange?.(newElapsed);\n      }\n\n      // Pause when user manually navigates\n      if (isPauseControlled) {\n        onPauseChange?.(true);\n      } else {\n        setInternalIsPaused(true);\n      }\n    },\n    [\n      isControlled,\n      isPauseControlled,\n      isElapsedTimeControlled,\n      onIndexChange,\n      onPauseChange,\n      onElapsedTimeChange,\n      usePerItemTiming,\n      manifest,\n    ]\n  );\n\n  // Pause toggle handler\n  const togglePause = useCallback(() => {\n    const newPauseState = !isPaused;\n\n    if (isPauseControlled) {\n      onPauseChange?.(newPauseState);\n    } else {\n      setInternalIsPaused(newPauseState);\n    }\n  }, [isPaused, isPauseControlled, onPauseChange]);\n\n  // Minimize toggle handler\n  const toggleMinimize = useCallback(() => {\n    const newMinimizedState = !isMinimized;\n\n    if (newMinimizedState) {\n      // Minimizing - track if we were playing\n      wasPlayingBeforeMinimize.current = !isPaused;\n    } else {\n      // Expanding - resume if we were playing before\n      if (wasPlayingBeforeMinimize.current && isPaused) {\n        if (isPauseControlled) {\n          onPauseChange?.(false);\n        } else {\n          setInternalIsPaused(false);\n        }\n      }\n      wasPlayingBeforeMinimize.current = false;\n    }\n\n    if (isMinimizedControlled) {\n      onMinimizeChange?.(newMinimizedState);\n    } else {\n      setInternalIsMinimized(newMinimizedState);\n    }\n  }, [isMinimized, isMinimizedControlled, onMinimizeChange, isPaused, isPauseControlled, onPauseChange]);\n\n  // Reduced motion preference check effect\n  useEffect(() => {\n    // Check if auto-rotation is disabled\n    if (autoRotateInterval === 0) return;\n\n    // Respect user's motion preferences\n    if (respectReducedMotion) {\n      // Check if matchMedia is available (not available in all test environments)\n      if (typeof window !== 'undefined' && window.matchMedia) {\n        const prefersReducedMotion = window.matchMedia(\n          '(prefers-reduced-motion: reduce)'\n        ).matches;\n\n        if (prefersReducedMotion) {\n          if (isPauseControlled) {\n            onPauseChange?.(true);\n          } else {\n            setInternalIsPaused(true);\n          }\n        }\n      }\n    }\n  }, [autoRotateInterval, respectReducedMotion, isPauseControlled, onPauseChange]);\n\n  // Ref to track current index for the interval callback\n  const currentIndexRef = useRef(currentIndex);\n  currentIndexRef.current = currentIndex;\n\n  // Per-item timing effect (uncontrolled elapsed time)\n  useEffect(() => {\n    // Skip if not using per-item timing\n    if (!usePerItemTiming) return;\n\n    // Don't run if auto-rotation is disabled\n    if (autoRotateInterval === 0) return;\n\n    // Don't run if paused or minimized\n    if (isPaused || isMinimized) return;\n\n    // Don't run if elapsed time is controlled externally\n    if (isElapsedTimeControlled) return;\n\n    // Set up 1-second interval for timer ticks\n    const interval = setInterval(() => {\n      // Use functional update to get the latest elapsed time\n      setInternalElapsedTime((prevElapsed) => {\n        // Calculate new elapsed time\n        let newElapsed = prevElapsed + TIMER_CHECK_INTERVAL_MS;\n\n        // Handle wraparound\n        if (totalDuration > 0 && newElapsed >= totalDuration) {\n          newElapsed = 0;\n        }\n\n        // Fire callback (using the new elapsed value)\n        onElapsedTimeChange?.(newElapsed);\n\n        // Calculate current item from manifest\n        const newIndex = getCurrentItemIndex(manifest, newElapsed);\n\n        // Update index if changed (using ref for latest value)\n        if (newIndex !== currentIndexRef.current) {\n          if (isControlled) {\n            onIndexChange?.(newIndex);\n          } else {\n            setInternalIndex(newIndex);\n          }\n        }\n\n        return newElapsed;\n      });\n    }, TIMER_CHECK_INTERVAL_MS);\n\n    return () => clearInterval(interval);\n  }, [\n    usePerItemTiming,\n    autoRotateInterval,\n    isPaused,\n    isMinimized,\n    isElapsedTimeControlled,\n    totalDuration,\n    manifest,\n    isControlled,\n    onIndexChange,\n    onElapsedTimeChange,\n  ]);\n\n  // Standard auto-rotation effect (fallback when not using per-item timing)\n  useEffect(() => {\n    // Skip if using per-item timing\n    if (usePerItemTiming) return;\n\n    // Check if auto-rotation is disabled\n    if (autoRotateInterval === 0) return;\n\n    // Don't auto-rotate if paused or minimized\n    if (isPaused || isMinimized) return;\n\n    const interval = setInterval(() => {\n      const nextIndex = (currentIndex + 1) % items.length;\n\n      if (isControlled) {\n        onIndexChange?.(nextIndex);\n      } else {\n        setInternalIndex(nextIndex);\n      }\n    }, autoRotateInterval);\n\n    return () => clearInterval(interval);\n  }, [\n    usePerItemTiming,\n    autoRotateInterval,\n    currentIndex,\n    isPaused,\n    isMinimized,\n    items.length,\n    isControlled,\n    onIndexChange,\n  ]);\n\n  // Effect to sync controlled elapsedTime to displayed index\n  useEffect(() => {\n    if (!usePerItemTiming || !isElapsedTimeControlled) return;\n\n    const newIndex = getCurrentItemIndex(manifest, controlledElapsedTime);\n    if (newIndex !== currentIndex) {\n      if (isControlled) {\n        onIndexChange?.(newIndex);\n      } else {\n        setInternalIndex(newIndex);\n      }\n    }\n  }, [\n    usePerItemTiming,\n    isElapsedTimeControlled,\n    controlledElapsedTime,\n    manifest,\n    currentIndex,\n    isControlled,\n    onIndexChange,\n  ]);\n\n  // Generate slide label\n  const currentSlideLabel = slideLabel\n    ? slideLabel(currentIndex, items.length)\n    : `Slide ${currentIndex + 1} of ${items.length}`;\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col mb-4 transition-all duration-300',\n        !isMinimized && 'space-y-4',\n        className\n      )}\n      role=\"region\"\n      aria-roledescription=\"carousel\"\n      aria-label={isMinimized ? minimizedLabel : ariaLabel || label}\n      aria-labelledby={ariaLabelledBy}\n      {...props}\n    >\n      {/* Minimized State */}\n      {isMinimized && collapsible ? (\n        <div\n          className={cn(\n            'bg-[var(--primary)] rounded-lg px-4 py-2 shadow-md',\n            'flex items-center justify-between gap-4'\n          )}\n        >\n          <span className=\"text-[var(--primary-foreground)] text-sm\">\n            {minimizedLabel} - {currentSlideLabel}\n          </span>\n          <Button\n            variant=\"outline\"\n            visualSize=\"icon\"\n            onPress={toggleMinimize}\n            aria-label=\"Expand carousel\"\n            aria-expanded={false}\n          >\n            <ChevronUpIcon className=\"w-5 h-5\" />\n          </Button>\n        </div>\n      ) : (\n        <>\n          {/* Current Slide */}\n          <div\n            key={currentIndex}\n            className={cn(\n              'bg-[var(--primary)] rounded-lg p-4 overflow-hidden shadow-md',\n              'slide-in-animation',\n              slideClassName\n            )}\n            role=\"group\"\n            aria-roledescription=\"slide\"\n            aria-label={currentSlideLabel}\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n          >\n            <div className=\"text-[var(--primary-foreground)] min-h-[2rem] flex items-center\">\n              {items[currentIndex]}\n            </div>\n          </div>\n\n          {/* Controls Container */}\n          <div className=\"flex items-center justify-between gap-4\">\n            {/* Navigation Dots */}\n            {showNavigation && (\n              <div\n                className={cn('flex items-center', navigationClassName)}\n                role=\"group\"\n                aria-label=\"Slide navigation\"\n              >\n                {items.map((_, index) => (\n                  <Button\n                    key={index}\n                    variant={index === currentIndex ? 'default' : 'outline'}\n                    visualSize=\"dot\"\n                    onPress={() => goToSlide(index)}\n                    aria-label={`Go to slide ${index + 1}`}\n                    aria-current={index === currentIndex ? true : undefined}\n                  />\n                ))}\n              </div>\n            )}\n\n            {/* Right Controls Group */}\n            <div className=\"flex items-center gap-2\">\n              {/* Minimize Button */}\n              {collapsible && (\n                <Button\n                  variant=\"default\"\n                  visualSize=\"icon\"\n                  onPress={toggleMinimize}\n                  aria-label=\"Minimize carousel\"\n                  aria-expanded={true}\n                >\n                  <ChevronDownIcon className=\"w-5 h-5\" />\n                </Button>\n              )}\n            \n              {/* Play/Pause Button */}\n              {showPlayPause && autoRotateInterval > 0 && (\n                <Button\n                  variant=\"default\"\n                  visualSize=\"icon\"\n                  onPress={togglePause}\n                  aria-label={isPaused ? 'Play carousel' : 'Pause carousel'}\n                >\n                  {isPaused ? (\n                    <PlayIcon className=\"w-5 h-5\" />\n                  ) : (\n                    <PauseIcon className=\"w-5 h-5\" />\n                  )}\n                </Button>\n              )}\n            </div>\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n\nCarousel.displayName = 'Carousel';\n"]}

package/dist/chunk-Y3GT7ETK.js

@@ -0,0 +1,108 @@
+'use strict';
+
+var react = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+
+var ButtonGroupContext = react.createContext(null);
+ButtonGroupContext.displayName = "ButtonGroupContext";
+function useButtonGroupContext() {
+  return react.useContext(ButtonGroupContext);
+}
+var ButtonGroupItemContext = react.createContext(null);
+ButtonGroupItemContext.displayName = "ButtonGroupItemContext";
+function useButtonGroupItemContext() {
+  return react.useContext(ButtonGroupItemContext);
+}
+var buttonGroupVariants = classVarianceAuthority.cva("inline-flex items-center gap-0", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col w-full"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal"
+  }
+});
+var buttonGroupItemVariants = classVarianceAuthority.cva("", {
+  variants: {
+    orientation: {
+      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)
+      horizontal: "min-w-[44px]",
+      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,
+      // eliminating gaps between stacked buttons in vertical orientation
+      vertical: "flex min-h-[44px]"
+    },
+    position: {
+      first: "",
+      middle: "",
+      last: "",
+      only: ""
+      // Single button - no modifications needed
+    }
+  },
+  compoundVariants: [
+    // ==========================================================================
+    // Horizontal Orientation
+    // ==========================================================================
+    {
+      orientation: "horizontal",
+      position: "first",
+      className: "rounded-r-none border-r-0"
+    },
+    {
+      orientation: "horizontal",
+      position: "middle",
+      className: "rounded-none border-r-0"
+    },
+    {
+      orientation: "horizontal",
+      position: "last",
+      className: "rounded-l-none"
+    },
+    // ==========================================================================
+    // Vertical Orientation
+    // Note: w-full is handled by Button's effectiveFullWidth for both layers
+    // ==========================================================================
+    {
+      orientation: "vertical",
+      position: "first",
+      className: "rounded-b-none border-b-0"
+    },
+    {
+      orientation: "vertical",
+      position: "middle",
+      className: "rounded-none border-b-0"
+    },
+    {
+      orientation: "vertical",
+      position: "last",
+      className: "rounded-t-none"
+    }
+  ],
+  defaultVariants: {
+    orientation: "horizontal",
+    position: "only"
+  }
+});
+var buttonGroupSeparatorVariants = classVarianceAuthority.cva("bg-[var(--border)]", {
+  variants: {
+    orientation: {
+      horizontal: "w-px h-6 mx-1",
+      vertical: "h-px w-full my-1"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal"
+  }
+});
+
+exports.ButtonGroupContext = ButtonGroupContext;
+exports.ButtonGroupItemContext = ButtonGroupItemContext;
+exports.buttonGroupItemVariants = buttonGroupItemVariants;
+exports.buttonGroupSeparatorVariants = buttonGroupSeparatorVariants;
+exports.buttonGroupVariants = buttonGroupVariants;
+exports.useButtonGroupContext = useButtonGroupContext;
+exports.useButtonGroupItemContext = useButtonGroupItemContext;
+//# sourceMappingURL=chunk-Y3GT7ETK.js.map
+//# sourceMappingURL=chunk-Y3GT7ETK.js.map

package/dist/chunk-Y3GT7ETK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/elements/ButtonGroup/ButtonGroupContext.tsx","../src/elements/ButtonGroup/ButtonGroup.variants.ts"],"names":["createContext","useContext","cva"],"mappings":";;;;;AAoCA,IAAM,kBAAA,GAAqBA,oBAA8C,IAAI;AAE7E,kBAAA,CAAmB,WAAA,GAAc,oBAAA;AAM1B,SAAS,qBAAA,GAAwD;AACtE,EAAA,OAAOC,iBAAW,kBAAkB,CAAA;AACtC;AAUA,IAAM,sBAAA,GACJD,oBAAkD,IAAI;AAExD,sBAAA,CAAuB,WAAA,GAAc,wBAAA;AAM9B,SAAS,yBAAA,GAAgE;AAC9E,EAAA,OAAOC,iBAAW,sBAAsB,CAAA;AAC1C;AC5CO,IAAM,mBAAA,GAAsBC,2BAAI,gCAAA,EAAkC;AAAA,EACvE,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA,MACX,UAAA,EAAY,UAAA;AAAA,MACZ,QAAA,EAAU;AAAA;AACZ,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa;AAAA;AAEjB,CAAC;AAcM,IAAM,uBAAA,GAA0BA,2BAAI,EAAA,EAAI;AAAA,EAC7C,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA;AAAA,MAEX,UAAA,EAAY,cAAA;AAAA;AAAA;AAAA,MAGZ,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,QAAA,EAAU;AAAA,MACR,KAAA,EAAO,EAAA;AAAA,MACP,MAAA,EAAQ,EAAA;AAAA,MACR,IAAA,EAAM,EAAA;AAAA,MACN,IAAA,EAAM;AAAA;AAAA;AACR,GACF;AAAA,EACA,gBAAA,EAAkB;AAAA;AAAA;AAAA;AAAA,IAIhB;AAAA,MACE,WAAA,EAAa,YAAA;AAAA,MACb,QAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA;AAAA,MACE,WAAA,EAAa,YAAA;AAAA,MACb,QAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA;AAAA,MACE,WAAA,EAAa,YAAA;AAAA,MACb,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA;AAAA,MACE,WAAA,EAAa,UAAA;AAAA,MACb,QAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA;AAAA,MACE,WAAA,EAAa,UAAA;AAAA,MACb,QAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA;AAAA,MACE,WAAA,EAAa,UAAA;AAAA,MACb,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW;AAAA;AACb,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa,YAAA;AAAA,IACb,QAAA,EAAU;AAAA;AAEd,CAAC;AAUM,IAAM,4BAAA,GAA+BA,2BAAI,oBAAA,EAAsB;AAAA,EACpE,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA,MACX,UAAA,EAAY,eAAA;AAAA,MACZ,QAAA,EAAU;AAAA;AACZ,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa;AAAA;AAEjB,CAAC","file":"chunk-Y3GT7ETK.js","sourcesContent":["\"use client\";\n\nimport { createContext, useContext } from 'react';\nimport type {\n  ButtonGroupContextValue,\n  ButtonGroupItemContextValue,\n} from './ButtonGroup.types';\n\n/**\n * ButtonGroup Context System (Two-Level)\n *\n * Provides a two-level context pattern for ButtonGroup:\n *\n * 1. ButtonGroupContext (group-level):\n *    - Provides: orientation, variant, size, isDisabled\n *    - Consumed by: Button (for prop inheritance), Separator (for orientation)\n *\n * 2. ButtonGroupItemContext (item-level):\n *    - Provides: position ('first' | 'middle' | 'last' | 'only')\n *    - Consumed by: Button (for border-radius styling)\n *\n * Both contexts return null when not in a provider, allowing Button\n * to work standalone without any group context.\n *\n * @see plan.md for architecture details\n * @see ButtonGroup.tsx for Provider implementation\n */\n\n// =============================================================================\n// Group-Level Context\n// =============================================================================\n\n/**\n * Context for group-level props (orientation, variant, size, isDisabled)\n * Default value is null to indicate \"not in a group\"\n */\nconst ButtonGroupContext = createContext<ButtonGroupContextValue | null>(null);\n\nButtonGroupContext.displayName = 'ButtonGroupContext';\n\n/**\n * Hook to access group-level context\n * @returns ButtonGroupContextValue if inside a ButtonGroup, null otherwise\n */\nexport function useButtonGroupContext(): ButtonGroupContextValue | null {\n  return useContext(ButtonGroupContext);\n}\n\n// =============================================================================\n// Item-Level Context\n// =============================================================================\n\n/**\n * Context for per-button position information\n * Default value is null to indicate \"not wrapped with position context\"\n */\nconst ButtonGroupItemContext =\n  createContext<ButtonGroupItemContextValue | null>(null);\n\nButtonGroupItemContext.displayName = 'ButtonGroupItemContext';\n\n/**\n * Hook to access item-level context (position)\n * @returns ButtonGroupItemContextValue if wrapped with position context, null otherwise\n */\nexport function useButtonGroupItemContext(): ButtonGroupItemContextValue | null {\n  return useContext(ButtonGroupItemContext);\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport { ButtonGroupContext, ButtonGroupItemContext };\n","import { cva } from 'class-variance-authority';\n\n/**\n * ButtonGroup CVA Variants\n *\n * Defines Class Variance Authority (CVA) variants for:\n * - ButtonGroup container (orientation-based layout)\n * - ButtonGroupItem (position-based border-radius)\n * - ButtonGroupSeparator (orientation-based styling)\n *\n * @see plan.md Phase 1: Design & Contracts - CVA Variants\n * @see constitution.md Principle V (Component Quality Standards)\n */\n\n// =============================================================================\n// Container Variants\n// =============================================================================\n\n/**\n * ButtonGroup container variants\n * Controls the layout direction based on orientation\n * Uses gap-0 to ensure buttons are connected (share borders)\n */\nexport const buttonGroupVariants = cva('inline-flex items-center gap-0', {\n  variants: {\n    orientation: {\n      horizontal: 'flex-row',\n      vertical: 'flex-col w-full',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n\n// =============================================================================\n// Item Position Variants\n// =============================================================================\n\n/**\n * ButtonGroupItem position variants\n * Applied to Button's visual layer (Layer 2) for position-aware border-radius\n *\n * Compound variants handle both orientation and position combinations:\n * - Horizontal: left/right borders and radii\n * - Vertical: top/bottom borders and radii\n */\nexport const buttonGroupItemVariants = cva('', {\n  variants: {\n    orientation: {\n      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)\n      horizontal: 'min-w-[44px]',\n      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,\n      // eliminating gaps between stacked buttons in vertical orientation\n      vertical: 'flex min-h-[44px]',\n    },\n    position: {\n      first: '',\n      middle: '',\n      last: '',\n      only: '', // Single button - no modifications needed\n    },\n  },\n  compoundVariants: [\n    // ==========================================================================\n    // Horizontal Orientation\n    // ==========================================================================\n    {\n      orientation: 'horizontal',\n      position: 'first',\n      className: 'rounded-r-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'middle',\n      className: 'rounded-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'last',\n      className: 'rounded-l-none',\n    },\n    // ==========================================================================\n    // Vertical Orientation\n    // Note: w-full is handled by Button's effectiveFullWidth for both layers\n    // ==========================================================================\n    {\n      orientation: 'vertical',\n      position: 'first',\n      className: 'rounded-b-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'middle',\n      className: 'rounded-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'last',\n      className: 'rounded-t-none',\n    },\n  ],\n  defaultVariants: {\n    orientation: 'horizontal',\n    position: 'only',\n  },\n});\n\n// =============================================================================\n// Separator Variants\n// =============================================================================\n\n/**\n * ButtonGroupSeparator variants\n * Orientation-aware visual divider between button groups\n */\nexport const buttonGroupSeparatorVariants = cva('bg-[var(--border)]', {\n  variants: {\n    orientation: {\n      horizontal: 'w-px h-6 mx-1',\n      vertical: 'h-px w-full my-1',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n"]}

package/dist/chunk-Z4FRNOF6.mjs

@@ -0,0 +1,115 @@
+// src/styles/shared-variants.ts
+var FOCUS_WITHIN_RING = [
+  "focus-within:outline-none",
+  "focus-within:ring-2",
+  "focus-within:ring-[var(--ring)]",
+  "focus-within:ring-offset-2"
+];
+var FOCUS_VISIBLE_RING = [
+  "focus-visible:outline-none",
+  "focus-visible:ring-2",
+  "focus-visible:ring-[var(--ring)]",
+  "focus-visible:ring-offset-2"
+];
+var FOCUS_RING = [
+  "focus:outline-none",
+  "focus:ring-2",
+  "focus:ring-[var(--ring)]"
+];
+var FOCUS_HIGHLIGHT = [
+  "focus:outline-none",
+  "focus:bg-[var(--accent)]",
+  "focus:text-[var(--accent-foreground)]"
+];
+var DISABLED_STANDARD = [
+  "disabled:pointer-events-none",
+  "disabled:opacity-50"
+];
+var DISABLED_DATA_ATTR = [
+  "data-[disabled]:pointer-events-none",
+  "data-[disabled]:opacity-50",
+  "data-[disabled]:cursor-not-allowed"
+];
+var TEXT_SIZE_SMALL_SCALE = {
+  sm: "text-xs",
+  default: "text-sm",
+  lg: "text-base"
+};
+var TEXT_SIZE_MEDIUM_SCALE = {
+  sm: "text-sm",
+  default: "text-base",
+  lg: "text-lg"
+};
+var TOUCH_TARGET_MIN = [
+  "min-h-[44px]",
+  "min-w-[44px]"
+];
+var INTERACTIVE_SIZES = {
+  sm: "h-9 w-9",
+  // 36px - desktop only, NOT AAA compliant
+  default: "h-11 w-11",
+  // 44px - AAA compliant
+  lg: "h-14 w-14"
+  // 56px - AAA compliant, enhanced
+};
+var FIELD_HEIGHTS = {
+  sm: "h-9",
+  // 36px
+  default: "h-11",
+  // 44px
+  lg: "h-14"
+  // 56px
+};
+var ERROR_MESSAGE_BASE = [
+  "flex",
+  "items-center",
+  "gap-1.5",
+  "text-[var(--destructive)]"
+];
+var SUCCESS_MESSAGE_BASE = [
+  "flex",
+  "items-center",
+  "gap-1.5",
+  "text-[var(--success)]"
+];
+var DESCRIPTION_BASE = [
+  "text-[var(--menu-muted)]"
+];
+var LABEL_BASE = [
+  "font-medium",
+  "text-[var(--content-foreground)]"
+];
+var REQUIRED_INDICATOR = "after:content-['*'] after:ml-0.5 after:text-[var(--destructive)]";
+var POPOVER_ANIMATION_IN = [
+  "data-[entering]:animate-in",
+  "data-[entering]:fade-in-0",
+  "data-[entering]:zoom-in-95"
+];
+var POPOVER_ANIMATION_OUT = [
+  "data-[exiting]:animate-out",
+  "data-[exiting]:fade-out-0",
+  "data-[exiting]:zoom-out-95"
+];
+var REDUCED_MOTION = [
+  "motion-reduce:transition-none",
+  "motion-reduce:animate-none"
+];
+var TRANSITION_COLORS = [
+  "transition-colors",
+  "duration-200"
+];
+var TRANSITION_FAST = [
+  "transition-colors",
+  "duration-150"
+];
+var HOVER_ACCENT = [
+  "hover:bg-[var(--accent)]",
+  "hover:text-[var(--accent-foreground)]"
+];
+function combineStyles(...styles) {
+  return styles.flatMap((s) => Array.isArray(s) ? [...s] : [s]);
+}
+
+export { DESCRIPTION_BASE, DISABLED_DATA_ATTR, DISABLED_STANDARD, ERROR_MESSAGE_BASE, FIELD_HEIGHTS, FOCUS_HIGHLIGHT, FOCUS_RING, FOCUS_VISIBLE_RING, FOCUS_WITHIN_RING, HOVER_ACCENT, INTERACTIVE_SIZES, LABEL_BASE, POPOVER_ANIMATION_IN, POPOVER_ANIMATION_OUT, REDUCED_MOTION, REQUIRED_INDICATOR, SUCCESS_MESSAGE_BASE, TEXT_SIZE_MEDIUM_SCALE, TEXT_SIZE_SMALL_SCALE, TOUCH_TARGET_MIN, TRANSITION_COLORS, TRANSITION_FAST, combineStyles };
+//# sourceMappingURL=chunk-Z4FRNOF6.mjs.map
+//# sourceMappingURL=chunk-Z4FRNOF6.mjs.map