npm - @mortenbrudvik/waveui - Versions diffs - 0.12.0 → 0.13.0 - Mend

@mortenbrudvik/waveui 0.12.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (104) hide show

package/dist/components/layout/Carousel.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Carousel.cjs","names":["focusRing","disabledStyles","useControllable","useId","React","useMergedRefs","useDirection","usePrefersReducedMotion","flattenChildren","isElementOfType","slotRendersContent","useEventCallback","composeEventHandlers","cn","carouselClassNames","focusableDisabledProps","preventIfDisabled","ChevronLeftIcon","ChevronRightIcon","forcedColors","carouselItemClassNames","require_runtime","require_cn","require_children","require_dev","require_slot","require_composeEventHandlers","require_classNames","require_useEventCallback","require_useControllable","require_useId","require_useMergedRefs","require_aria","require_usePrefersReducedMotion","require_useDirection","require_styles","require_icons","react","react_jsx_runtime","DEFAULT_PAUSE_LABEL","DEFAULT_PLAY_LABEL","DEFAULT_PREVIOUS_LABEL","DEFAULT_NEXT_LABEL","DEFAULT_PICKER_LABEL","defaultSlideLabel","index","total","DEFAULT_CAROUSEL_ROLE_DESCRIPTION","DEFAULT_SLIDE_ROLE_DESCRIPTION","clampIndex","isRotationControl","target","controlButton","PauseGlyph","PlayGlyph","CarouselRoot","controlledValue","rest","storedIndex","setActiveIndex","defaultValue","onValueChange","trackId","rootEl","setRootEl","rootRef","ref","renderedDir","dir","prefersReducedMotion","userPaused","setUserPaused","endedAt","setEndedAt","hovered","setHovered","pointerOnControl","setPointerOnControl","focusWithin","setFocusWithin","startedFromControl","setStartedFromControl","items","droppedChildren","child","children","CarouselItem","atStart","atEnd","prevDisabled","loop","nextDisabled","ended","stopped","hasRotation","autoPlay","rotating","goTo","goPrev","goNext","advance","current","prev","id","autoPlayInterval","toggleRotation","rootHandlers","onMouseEnter","onMouseLeave","onFocus","from","event","entering","onBlur","next","className","offset","chevronClass","pauseLabel","autoPlayLabels","playLabel","previousLabel","labels","nextLabel","pickerLabel","slideLabel","carouselRoleDescription","slideRoleDescription","active","i","node","key","Carousel"],"sources":["../../../src/components/layout/Carousel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { carouselClassNames, carouselItemClassNames } from '../../lib/classNames';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { cn } from '../../lib/cn';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnOnce } from '../../lib/dev';\nimport { slotRendersContent } from '../../lib/slot';\nimport { focusableDisabledProps, preventIfDisabled } from '../../lib/aria';\nimport { disabledStyles, focusRing, forcedColors } from '../../lib/styles';\nimport { ChevronLeftIcon, ChevronRightIcon } from '../../lib/icons';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useId } from '../../hooks/useId';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\n\n/** Accessible names of the rotation control shown while `autoPlay` is on. /\nexport interface CarouselAutoPlayLabels {\n /* Name of the control while slides rotate (activating it stops the rotation).\n * @default 'Pause slide rotation'\n /\n pause?: string;\n /* Name of the control while rotation is stopped (activating it starts the rotation).\n * @default 'Start slide rotation'\n /\n play?: string;\n}\n\n/\n Accessible names of the Carousel's built-in controls and slides, and the role descriptions of\n * the carousel and its slides, for localization. Each member is optional and falls back to its\n * English default. The rotation control has its own `autoPlayLabels`; the region's name comes\n * from `aria-label` or `aria-labelledby`.\n /\nexport interface CarouselLabels {\n /* Name of the Previous button.\n * @default 'Previous slide'\n /\n previous?: string;\n /* Name of the Next button.\n * @default 'Next slide'\n /\n next?: string;\n /* Name of the group that holds the slide picker buttons.\n * @default 'Choose slide'\n /\n picker?: string;\n /\n Name of the slide at `index` (zero-based, like `value`) out of `total` slides. It names the\n * slide itself and its picker button, and is announced by the live region when that slide is\n * shown.\n * @default (index, total) => `Slide ${index + 1} of ${total}`\n /\n slide?: (index: number, total: number) => string;\n /* How assistive technology announces the carousel region (`aria-roledescription`).\n * @default 'carousel'\n /\n carouselRoleDescription?: string;\n /* How assistive technology announces each slide (`aria-roledescription`).\n * @default 'slide'\n /\n slideRoleDescription?: string;\n}\n\n/* Properties for the Carousel component. /\nexport interface CarouselProps extends React.HTMLAttributes<HTMLDivElement> {\n /* Controlled index of the currently active slide. Out-of-range values show the nearest slide. /\n value?: number;\n /* Default active slide index for uncontrolled usage.\n * @default 0\n /\n defaultValue?: number;\n /* Called with the new index when the active slide changes (not when it stays the same). /\n onValueChange?: (index: number) => void;\n /\n Rotates the slides automatically. A Pause/Start control is rendered as the first focusable\n * element. Rotation pauses while focus is anywhere inside the carousel (the control included;\n * clicking a control also moves focus there in most browsers) or the pointer is over it (except\n * over the control), and resumes when they leave, unless rotation is stopped. Activating Start\n * rotates at once, also while focus stays on the control; moving focus on to other content\n * pauses again. It starts stopped when the user prefers reduced motion. Without `loop`, rotation\n * ends at the last slide: the control shows Start, and rotation stays stopped (also after the\n * user moves back to an earlier slide) until Start is activated, which continues from the shown\n * slide, or from the first one while the last is shown. The end is tied to its cause: when the\n * number of slides changes (slides loaded later) or `loop` is turned on, rotation continues on\n * its own, unless the user stopped it with Pause.\n * @default false\n /\n autoPlay?: boolean;\n /* Interval in milliseconds between auto-play transitions.\n * @default 5000\n /\n autoPlayInterval?: number;\n /* Accessible names of the rotation control. /\n autoPlayLabels?: CarouselAutoPlayLabels;\n /\n Accessible names of the Previous and Next buttons, the slide picker and the slides (also\n * announced by the live region), and the role descriptions of the carousel and its slides, for\n * localization. Unset members keep their English defaults.\n /\n labels?: CarouselLabels;\n /* Whether the carousel loops back to the first slide after the last.\n * @default false\n /\n loop?: boolean;\n ref?: React.Ref<HTMLDivElement>;\n}\n\n/* Properties for the CarouselItem sub-component. /\nexport interface CarouselItemProps extends React.HTMLAttributes<HTMLDivElement> {\n ref?: React.Ref<HTMLDivElement>;\n}\n\nconst DEFAULT_PAUSE_LABEL = 'Pause slide rotation';\nconst DEFAULT_PLAY_LABEL = 'Start slide rotation';\nconst DEFAULT_PREVIOUS_LABEL = 'Previous slide';\nconst DEFAULT_NEXT_LABEL = 'Next slide';\nconst DEFAULT_PICKER_LABEL = 'Choose slide';\nconst defaultSlideLabel = (index: number, total: number) => `Slide ${index + 1} of ${total}`;\nconst DEFAULT_CAROUSEL_ROLE_DESCRIPTION = 'carousel';\nconst DEFAULT_SLIDE_ROLE_DESCRIPTION = 'slide';\n\nfunction clampIndex(index: number, total: number): number {\n if (total <= 0 \|\| !Number.isFinite(index)) return 0;\n return Math.min(Math.max(Math.trunc(index), 0), total - 1);\n}\n\nfunction isRotationControl(target: EventTarget \| null): boolean {\n return target instanceof Element && target.closest('[data-carousel-rotation]') !== null;\n}\n\nconst controlButton = [\n 'absolute z-10 inline-flex h-8 w-8 items-center justify-center rounded-full border border-border bg-background text-foreground shadow-2',\n 'not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:active:bg-subtle-pressed',\n focusRing,\n disabledStyles,\n].join(' ');\n\nconst PauseGlyph = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n <rect x=\"4\" y=\"3\" width=\"3\" height=\"10\" rx=\"1\" />\n <rect x=\"9\" y=\"3\" width=\"3\" height=\"10\" rx=\"1\" />\n </svg>\n);\n\nconst PlayGlyph = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n <path d=\"M5 3.5v9a.5.5 0 0 0 .77.42l7-4.5a.5.5 0 0 0 0-.84l-7-4.5A.5.5 0 0 0 5 3.5Z\" />\n </svg>\n);\n\n// The Carousel root, documented on the exported `Carousel` const.\nconst CarouselRoot = ({\n value: controlledValue,\n defaultValue = 0,\n onValueChange,\n autoPlay = false,\n autoPlayInterval = 5000,\n autoPlayLabels,\n labels,\n loop = false,\n className,\n children,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onBlur,\n ref,\n ...rest\n}: CarouselProps) => {\n const [storedIndex, setActiveIndex] = useControllable(\n controlledValue,\n defaultValue,\n onValueChange,\n );\n const trackId = useId('carousel-slides');\n const [rootEl, setRootEl] = React.useState<HTMLDivElement \| null>(null);\n const rootRef = useMergedRefs<HTMLDivElement>(ref, setRootEl);\n // The direction that applies to the rendered root (its own or an ancestor's `dir`, e.g. an RTL\n // section inside an LTR WaveProvider); before mount and on the server, the provider's/document's.\n const renderedDir = useDirection(rootEl);\n const dir = rest.dir === 'rtl' \|\| rest.dir === 'ltr' ? rest.dir : renderedDir;\n const prefersReducedMotion = usePrefersReducedMotion();\n\n // Rotation state: stopped or not (the user's choice, stopped by default under reduced motion, or\n // ended at the last slide without loop) and the temporary pauses while the pointer is over the\n // content or focus is inside. An explicit Start overrides the focus pause while focus stays on\n // the rotation control (APG `hasUserActivatedPlay`), so pressing Start visibly starts the\n // rotation.\n const [userPaused, setUserPaused] = React.useState<boolean \| null>(null);\n // The slide count at which rotation ended at the last slide (null while it has not ended), kept\n // apart from the user's choice so the end lasts only while its cause does.\n const [endedAt, setEndedAt] = React.useState<number \| null>(null);\n const [hovered, setHovered] = React.useState(false);\n const [pointerOnControl, setPointerOnControl] = React.useState(false);\n const [focusWithin, setFocusWithin] = React.useState(false);\n const [startedFromControl, setStartedFromControl] = React.useState(false);\n\n // Slides are the `CarouselItem` children, Fragments flattened; the element type is unwrapped, so\n // slides written in a Server Component (lazy client references) count too (C-COMPOUND).\n const items: Array<{ key: string; node: React.ReactNode }> = [];\n let droppedChildren = false;\n for (const child of flattenChildren(children)) {\n if (isElementOfType(child.node, CarouselItem)) items.push(child);\n else if (slotRendersContent(child.node)) droppedChildren = true;\n }\n const total = items.length;\n\n React.useEffect(() => {\n if (droppedChildren) {\n warnOnce(\n 'Carousel:non-item-children',\n 'Carousel: only `Carousel.Item` (`CarouselItem`) children are slides, directly or in ' +\n 'Fragments; other children are not rendered. A component that renders `Carousel.Item` ' +\n 'itself is not recognised: render the `Carousel.Item` in the Carousel and put the ' +\n 'component inside it.',\n );\n }\n }, [droppedChildren]);\n\n // Derived during render (C-HOOKS): removed slides or an out-of-range value show the nearest one.\n const index = clampIndex(storedIndex, total);\n const atStart = index <= 0;\n const atEnd = index >= total - 1;\n const prevDisabled = total <= 1 \|\| (!loop && atStart);\n const nextDisabled = total <= 1 \|\| (!loop && atEnd);\n\n // Without loop, rotation ends at the last slide (however it got there) and stays stopped: moving\n // back to an earlier slide does not restart it, only Start does. The end applies to the slide\n // count it happened at: once slides are added or removed, or loop is turned on, it is dropped\n // and rotation continues unless the user stopped it (adjusting state during render, C-HOOKS).\n const ended = endedAt === total && !loop;\n const stopped = (userPaused ?? prefersReducedMotion) \|\| ended;\n const hasRotation = autoPlay && total > 1;\n if (hasRotation && !loop && atEnd && !stopped) setEndedAt(total);\n else if (endedAt !== null && !ended) setEndedAt(null);\n const pausedByPointer = hovered && !pointerOnControl;\n const pausedByFocus = focusWithin && !startedFromControl;\n const rotating = hasRotation && !stopped && !pausedByPointer && !pausedByFocus;\n\n // Compares with the shown (clamped) index, so re-picking the visible slide reports nothing.\n const goTo = (target: number) => {\n if (target >= 0 && target < total && target !== index) setActiveIndex(target);\n };\n const goPrev = () => goTo(atStart ? total - 1 : index - 1);\n const goNext = () => goTo(atEnd ? 0 : index + 1);\n\n // Reads the latest index at tick time (the updater's base), so the interval does not restart on\n // every slide or parent render and consecutive ticks chain even before a re-render.\n const advance = useEventCallback(() => {\n setActiveIndex((prev) => {\n const current = clampIndex(prev, total);\n if (current < total - 1) return current + 1;\n return loop ? 0 : prev;\n });\n });\n\n React.useEffect(() => {\n if (!rotating) return;\n const id = setInterval(advance, autoPlayInterval);\n return () => clearInterval(id);\n }, [rotating, autoPlayInterval, advance]);\n\n const toggleRotation = () => {\n if (stopped) {\n // Start: from the first slide when rotation had ended at the last one.\n if (!loop && atEnd) goTo(0);\n setEndedAt(null);\n setUserPaused(false);\n setStartedFromControl(true);\n } else {\n setUserPaused(true);\n setStartedFromControl(false);\n }\n };\n\n // The consumer's pointer and focus handlers composed with the pause tracking (C-COMPOSE). The\n // empty root gets them too: the consumer's handlers still run, and a pointer or focus that leaves\n // while there are no slides (slides being reloaded) does not keep rotation paused afterwards.\n const rootHandlers = {\n onMouseEnter: composeEventHandlers(onMouseEnter, () => setHovered(true)),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => setHovered(false)),\n onFocus: composeEventHandlers(onFocus, (event: React.FocusEvent<HTMLDivElement>) => {\n // Any focus inside pauses (APG), the rotation control included. Focus that enters from\n // outside or moves on to other content ends the exemption of an explicit Start.\n const from = event.relatedTarget;\n const entering = !(from instanceof Node && event.currentTarget.contains(from));\n setFocusWithin(true);\n if (entering \|\| !isRotationControl(event.target)) setStartedFromControl(false);\n }),\n onBlur: composeEventHandlers(onBlur, (event: React.FocusEvent<HTMLDivElement>) => {\n const next = event.relatedTarget;\n if (!(next instanceof Node && event.currentTarget.contains(next))) {\n setFocusWithin(false);\n setStartedFromControl(false);\n }\n }),\n };\n\n if (total === 0) {\n return (\n <div\n ref={rootRef}\n className={cn(carouselClassNames.root, 'relative', className)}\n {...rootHandlers}\n {...rest}\n />\n );\n }\n\n const offset = (dir === 'rtl' ? 1 : -1) index * 100;\n // The chevrons mirror by the same resolved direction as the track. A CSS `rtl:` variant would\n // also match `[dir=rtl] `, so an LTR carousel inside an RTL ancestor got mirrored chevrons.\n const chevronClass = dir === 'rtl' ? '-scale-x-100' : undefined;\n const pauseLabel = autoPlayLabels?.pause ?? DEFAULT_PAUSE_LABEL;\n const playLabel = autoPlayLabels?.play ?? DEFAULT_PLAY_LABEL;\n const previousLabel = labels?.previous ?? DEFAULT_PREVIOUS_LABEL;\n const nextLabel = labels?.next ?? DEFAULT_NEXT_LABEL;\n const pickerLabel = labels?.picker ?? DEFAULT_PICKER_LABEL;\n const slideLabel = labels?.slide ?? defaultSlideLabel;\n const carouselRoleDescription =\n labels?.carouselRoleDescription ?? DEFAULT_CAROUSEL_ROLE_DESCRIPTION;\n const slideRoleDescription = labels?.slideRoleDescription ?? DEFAULT_SLIDE_ROLE_DESCRIPTION;\n\n return (\n <div\n ref={rootRef}\n role=\"region\"\n aria-roledescription={carouselRoleDescription}\n aria-label=\"Carousel\"\n // A stacking context of its own: the controls' z-index cannot lift them over page headers.\n className={cn(carouselClassNames.root, 'relative isolate overflow-hidden', className)}\n {...rootHandlers}\n {...rest}\n >\n {hasRotation && (\n <button\n type=\"button\"\n data-carousel-rotation=\"\"\n aria-label={stopped ? playLabel : pauseLabel}\n aria-controls={trackId}\n onClick={toggleRotation}\n // The pointer over the control does not pause (APG): the user is operating it.\n onMouseEnter={() => setPointerOnControl(true)}\n onMouseLeave={() => setPointerOnControl(false)}\n className={cn(carouselClassNames.autoPlayButton, controlButton, 'top-2 start-2')}\n >\n {stopped ? <PlayGlyph /> : <PauseGlyph />}\n </button>\n )}\n <div\n id={trackId}\n className={cn(\n carouselClassNames.track,\n 'flex transition-transform duration-300 ease-in-out motion-reduce:transition-none',\n )}\n style={{ transform: `translateX(${offset}%)` }}\n >\n {items.map(({ key, node }, i) => {\n const active = i === index;\n return (\n <div\n key={key}\n role=\"group\"\n aria-roledescription={slideRoleDescription}\n aria-label={slideLabel(i, total)}\n aria-hidden={active ? undefined : true}\n inert={!active}\n className={cn(carouselClassNames.slide, 'w-full shrink-0')}\n >\n {node}\n </div>\n );\n })}\n </div>\n {/ Announces the current slide, except while slides rotate on their own. /}\n <div aria-live={rotating ? 'off' : 'polite'} aria-atomic=\"true\" className=\"sr-only\">\n {slideLabel(index, total)}\n </div>\n <button\n type=\"button\"\n aria-label={previousLabel}\n aria-controls={trackId}\n {...focusableDisabledProps(prevDisabled)}\n onClick={preventIfDisabled(prevDisabled, goPrev)}\n className={cn(\n carouselClassNames.previousButton,\n controlButton,\n 'top-1/2 start-2 -translate-y-1/2',\n )}\n >\n <ChevronLeftIcon size={16} className={chevronClass} />\n </button>\n <button\n type=\"button\"\n aria-label={nextLabel}\n aria-controls={trackId}\n {...focusableDisabledProps(nextDisabled)}\n onClick={preventIfDisabled(nextDisabled, goNext)}\n className={cn(\n carouselClassNames.nextButton,\n controlButton,\n 'top-1/2 end-2 -translate-y-1/2',\n )}\n >\n <ChevronRightIcon size={16} className={chevronClass} />\n </button>\n <div\n role=\"group\"\n aria-label={pickerLabel}\n className={cn(\n carouselClassNames.picker,\n 'absolute inset-x-0 bottom-1 z-10 mx-auto flex w-fit',\n )}\n >\n {items.map(({ key }, i) => {\n const active = i === index;\n return (\n <button\n key={key}\n type=\"button\"\n aria-label={slideLabel(i, total)}\n aria-current={active ? 'true' : undefined}\n onClick={() => goTo(i)}\n className={cn(\n carouselClassNames.pickerButton,\n 'group inline-flex h-6 min-w-6 items-center justify-center',\n focusRing,\n )}\n >\n <span\n aria-hidden=\"true\"\n className={cn(\n carouselClassNames.pickerIndicator,\n 'block h-2 rounded-full transition-[width,background-color] duration-200 motion-reduce:transition-none',\n active\n ? cn('w-5 bg-primary', forcedColors.selectedLeaf)\n : 'w-2 bg-stroke-accessible group-hover:bg-foreground forced-colors:bg-[ButtonText] forced-colors:forced-color-adjust-none',\n )}\n />\n </button>\n );\n })}\n </div>\n </div>\n );\n};\nCarouselRoot.displayName = 'Carousel';\n\n/\n One slide of a {@link Carousel}. Write it in the Carousel, directly or in a Fragment: a component\n * that renders `Carousel.Item` itself is not recognised as a slide (put that component inside the\n * `Carousel.Item` instead).\n /\nexport const CarouselItem = ({ className, children, ref, ...rest }: CarouselItemProps) => {\n return (\n <div ref={ref} className={cn(carouselItemClassNames.root, 'p-4', className)} {...rest}>\n {children}\n </div>\n );\n};\nCarouselItem.displayName = 'CarouselItem';\n\n/\n A slideshow that shows one slide at a time (WAI-ARIA APG carousel with previous/next buttons\n * and a slide picker).\n \n - Slides are the `Carousel.Item` (`CarouselItem`) children, written directly in the Carousel or\n * in Fragments. Other children are not rendered (a development warning says so). A component\n * that renders `Carousel.Item` itself is not recognised: write the `Carousel.Item` in the\n * Carousel and put the component inside it.\n * - Previous/Next stay focusable at the ends (`aria-disabled`), so keyboard focus is not lost.\n * - The slide picker is a group of buttons named \"Slide n of m\"; the active one has\n * `aria-current=\"true\"`.\n * - Inactive slides are `aria-hidden` and `inert`, so neither Tab nor a screen reader reaches\n * their content.\n * - With `autoPlay`, a Pause/Start control comes first (WAI-ARIA APG): rotation pauses while\n * focus is inside the carousel (in most browsers also after a click on one of its controls) or\n * the pointer is over its content, activating Start rotates at once, and the live region is\n * silent (`aria-live=\"off\"`) while slides rotate. Without `loop` rotation ends at the last slide\n * and stays stopped until the control's Start is activated (or the number of slides changes, or\n * `loop` is turned on).\n * - Right-to-left layouts slide the other way and mirror the Previous/Next chevrons: the direction\n * is read from the rendered element (its `dir` prop, the nearest ancestor's `dir`, WaveProvider\n * `dir` or the document's), so an LTR section inside an RTL page stays LTR throughout.\n * - Name the carousel with `aria-label` or `aria-labelledby` (the fallback name is \"Carousel\").\n * The built-in names and role descriptions are English: `labels` and `autoPlayLabels`\n * translate them.\n * - The controls are layered over the slides inside the carousel's own stacking context, so they\n * never paint over page headers that stay in view while the page scrolls.\n \n Compound access (`Carousel.Item`) needs a client module; React Server Components import the\n * flat name `CarouselItem` instead.\n /\nexport const Carousel = / @__PURE__ */ Object.assign(CarouselRoot, {\n Item: CarouselItem,\n});\n"],"mappings":"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"}
1	+ {"version":3,"file":"Carousel.cjs","names":["React","useControllable","useId","useMergedRefs","useDirection","usePrefersReducedMotion","flattenChildren","isElementOfType","CarouselButton","slotRendersContent","clampToPage","pageCount","lastPageStart","useCarouselDrag","useEventCallback","composeEventHandlers","useRovingTabIndex","getArrowIntent","cn","carouselClassNames","CAROUSEL_CONTROL_LAYOUT","focusableDisabledProps","preventIfDisabled","CAROUSEL_CONTROL_BASE","ChevronLeftIcon","ChevronRightIcon","CarouselContext","focusRing","renderSlot","carouselItemClassNames","forcedColors","require_runtime","require_cn","require_children","require_dev","require_slot","require_composeEventHandlers","require_classNames","require_useEventCallback","require_useControllable","require_useId","require_direction","require_useRovingTabIndex","require_useMergedRefs","require_aria","require_usePrefersReducedMotion","require_useDirection","require_styles","require_icons","require_Carousel_context","require_Carousel_styles","require_Carousel_button","require_Carousel_drag","require_Carousel_groups","react","react_jsx_runtime","DEFAULT_PAUSE_LABEL","DEFAULT_PLAY_LABEL","DEFAULT_PREVIOUS_LABEL","DEFAULT_NEXT_LABEL","DEFAULT_PICKER_LABEL","defaultSlideLabel","index","total","DEFAULT_CAROUSEL_ROLE_DESCRIPTION","DEFAULT_SLIDE_ROLE_DESCRIPTION","defaultSlidesLabel","start","end","useAutoPageSize","subscribe","enabled","root","observer","notify","slide","perPage","slideWidth","rootWidth","isRotationControl","target","thumbnailSlot","thumbnail","PauseGlyph","PlayGlyph","CarouselRoot","controlledValue","rest","storedIndex","setActiveIndex","defaultValue","onValueChange","trackId","rootEl","setRootEl","rootRef","ref","renderedDir","dir","prefersReducedMotion","firstSlideEl","setFirstSlideEl","trackEl","setTrackEl","viewportEl","setViewportEl","auto","groupSize","measured","size","userPaused","setUserPaused","endedAt","setEndedAt","hovered","setHovered","pointerOnControl","setPointerOnControl","focusWithin","setFocusWithin","startedFromControl","setStartedFromControl","items","customButtons","droppedChildren","child","children","CarouselItem","direction","hasThumbnails","item","pages","lastStart","atStart","atEnd","prevDisabled","loop","nextDisabled","ended","stopped","hasRotation","autoPlay","drag","draggable","delta","goTo","pausedByPointer","rotating","goPrev","goNext","advance","current","prev","id","autoPlayInterval","toggleRotation","rootHandlers","onMouseEnter","onMouseLeave","onFocus","from","event","entering","onBlur","next","grouped","pageEnd","visibleValues","k","roving","trackRef","pendingFocus","pending","handleTrackKeyDown","slideIndex","intent","previousLabel","labels","nextLabel","goPrevious","goToNext","context","controlsLayout","appearance","className","sign","transform","leftover","alignShift","align","slidesLabel","pageLabel","slideLabel","chevronClass","pauseLabel","autoPlayLabels","playLabel","pickerLabel","carouselRoleDescription","slideRoleDescription","inline","layoutClasses","previousControl","nextControl","viewport","active","i","node","key","page","_thumbnail","Carousel"],"sources":["../../../src/components/layout/Carousel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { carouselClassNames, carouselItemClassNames } from '../../lib/classNames';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { cn } from '../../lib/cn';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnOnce } from '../../lib/dev';\nimport { getArrowIntent } from '../../lib/direction';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport type { Slot } from '../../lib/types';\nimport { focusableDisabledProps, preventIfDisabled } from '../../lib/aria';\nimport { focusRing, forcedColors } from '../../lib/styles';\nimport { ChevronLeftIcon, ChevronRightIcon } from '../../lib/icons';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useId } from '../../hooks/useId';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\nimport { CarouselButton } from './Carousel.button';\nimport { CarouselContext } from './Carousel.context';\nimport type { CarouselContextValue, CarouselControlsLayout } from './Carousel.context';\nimport { useCarouselDrag } from './Carousel.drag';\nimport { clampToPage, lastPageStart, pageCount } from './Carousel.groups';\nimport { CAROUSEL_CONTROL_BASE, CAROUSEL_CONTROL_LAYOUT } from './Carousel.styles';\n\nexport type { CarouselControlsLayout };\n\n/** How a Carousel is drawn: `flat`, or `elevated` with rounded corners and a shadow. /\nexport type CarouselAppearance = 'flat' \| 'elevated';\n\n/* Accessible names of the rotation control shown while `autoPlay` is on. /\nexport interface CarouselAutoPlayLabels {\n /* Name of the control while slides rotate (activating it stops the rotation).\n * @default 'Pause slide rotation'\n /\n pause?: string;\n /* Name of the control while rotation is stopped (activating it starts the rotation).\n * @default 'Start slide rotation'\n /\n play?: string;\n}\n\n/\n Accessible names of the Carousel's built-in controls and slides, and the role descriptions of\n * the carousel and its slides, for localization. Each member is optional and falls back to its\n * English default. The rotation control has its own `autoPlayLabels`; the region's name comes\n * from `aria-label` or `aria-labelledby`.\n /\nexport interface CarouselLabels {\n /* Name of the Previous button.\n * @default 'Previous slide'\n /\n previous?: string;\n /* Name of the Next button.\n * @default 'Next slide'\n /\n next?: string;\n /* Name of the group that holds the slide picker buttons.\n * @default 'Choose slide'\n /\n picker?: string;\n /\n Name of the slide at `index` (zero-based, like `value`) out of `total` slides. It names the\n * slide itself and its picker button, and is announced by the live region when that slide is\n * shown.\n * @default (index, total) => `Slide ${index + 1} of ${total}`\n /\n slide?: (index: number, total: number) => string;\n /\n Name of a page of several slides, from the one-based number of its first and last slide, out\n * of `total` slides (`groupSize` above 1). It names the page's picker button and is announced\n * by the live region when the page is shown. A page of one slide uses `slide`.\n * @default (start, end, total) => `Slides ${start} to ${end} of ${total}`\n /\n slides?: (start: number, end: number, total: number) => string;\n /* How assistive technology announces the carousel region (`aria-roledescription`).\n * @default 'carousel'\n /\n carouselRoleDescription?: string;\n /* How assistive technology announces each slide (`aria-roledescription`).\n * @default 'slide'\n /\n slideRoleDescription?: string;\n}\n\n/* Properties for the Carousel component. /\nexport interface CarouselProps extends React.HTMLAttributes<HTMLDivElement> {\n /\n Controlled index of the active slide: with `groupSize` above 1, the first slide of the shown\n * page. A value in the middle of a page shows that page and out-of-range values show the\n * nearest one.\n /\n value?: number;\n /* Default active slide index for uncontrolled usage.\n * @default 0\n /\n defaultValue?: number;\n /\n Called with the new index when the active slide changes (not when it stays the same): the\n * first slide of the new page when `groupSize` is above 1.\n /\n onValueChange?: (index: number) => void;\n /\n How many slides one page shows: a number, or `'auto'` to show as many as fit the width of the\n * carousel (the slides keep their own width, which must be equal). Previous, Next, the picker\n * (one button per page), looping and autoplay move by page, and the slides of the shown page\n * form one arrow-key focus group. With `1` each slide fills the width, as before.\n * @default 1\n /\n groupSize?: number \| 'auto';\n /\n With `groupSize=\"auto\"`, where the shown page sits when its slides do not fill the width.\n * @default 'start'\n /\n align?: 'start' \| 'center' \| 'end';\n /\n Lets the pointer drag the slides (mouse, touch and pen). The track follows the pointer and,\n * on release, the page changes when the drag passed a quarter of the width or left fast, else\n * it snaps back; the direction follows the carousel's. The click that ends a drag is not\n * delivered to the slide, and a vertical swipe still scrolls the page. Dragging pauses\n * autoplay like the pointer over the carousel does. The buttons and the keyboard stay the way\n * to operate the carousel without a pointer.\n * @default false\n /\n draggable?: boolean;\n /\n Where the Previous and Next buttons go. `overlay` floats round buttons over the slides;\n * `overlay-wide` makes them full-height strips at the edges; `inline` puts them in a row with\n * the slides, outside them; `inline-wide` is `inline` with full-height buttons. The rotation\n * control stays the first focusable element at the start corner in every layout.\n * @default 'overlay'\n /\n controlsLayout?: CarouselControlsLayout;\n /\n `elevated` rounds the corners and adds a shadow.\n * @default 'flat'\n /\n appearance?: CarouselAppearance;\n /\n Rotates the slides automatically. A Pause/Start control is rendered as the first focusable\n * element. Rotation pauses while focus is anywhere inside the carousel (the control included;\n * clicking a control also moves focus there in most browsers) or the pointer is over it (except\n * over the control), and resumes when they leave, unless rotation is stopped. Activating Start\n * rotates at once, also while focus stays on the control; moving focus on to other content\n * pauses again. It starts stopped when the user prefers reduced motion. Without `loop`, rotation\n * ends at the last slide: the control shows Start, and rotation stays stopped (also after the\n * user moves back to an earlier slide) until Start is activated, which continues from the shown\n * slide, or from the first one while the last is shown. The end is tied to its cause: when the\n * number of slides changes (slides loaded later) or `loop` is turned on, rotation continues on\n * its own, unless the user stopped it with Pause.\n * @default false\n /\n autoPlay?: boolean;\n /* Interval in milliseconds between auto-play transitions.\n * @default 5000\n /\n autoPlayInterval?: number;\n /* Accessible names of the rotation control. /\n autoPlayLabels?: CarouselAutoPlayLabels;\n /\n Accessible names of the Previous and Next buttons, the slide picker and the slides (also\n * announced by the live region), and the role descriptions of the carousel and its slides, for\n * localization. Unset members keep their English defaults.\n /\n labels?: CarouselLabels;\n /* Whether the carousel loops back to the first slide after the last.\n * @default false\n /\n loop?: boolean;\n ref?: React.Ref<HTMLDivElement>;\n}\n\n/* Properties for the CarouselItem sub-component. /\nexport interface CarouselItemProps extends React.HTMLAttributes<HTMLDivElement> {\n /\n An image for this slide's button in the picker, in place of the dot. A string is the image\n * `src`; an object sets the `<img>`'s attributes. The button keeps its slide-label name, so the\n * image is decorative (`alt=\"\"`). When any slide has one, the picker becomes a row of\n * thumbnails below the slides; a slide without one keeps its dot. With `groupSize` above 1, a\n * page shows the thumbnail of its first slide.\n /\n thumbnail?: Slot<'img'>;\n ref?: React.Ref<HTMLDivElement>;\n}\n\nconst DEFAULT_PAUSE_LABEL = 'Pause slide rotation';\nconst DEFAULT_PLAY_LABEL = 'Start slide rotation';\nconst DEFAULT_PREVIOUS_LABEL = 'Previous slide';\nconst DEFAULT_NEXT_LABEL = 'Next slide';\nconst DEFAULT_PICKER_LABEL = 'Choose slide';\nconst defaultSlideLabel = (index: number, total: number) => `Slide ${index + 1} of ${total}`;\nconst DEFAULT_CAROUSEL_ROLE_DESCRIPTION = 'carousel';\nconst DEFAULT_SLIDE_ROLE_DESCRIPTION = 'slide';\n\nconst defaultSlidesLabel = (start: number, end: number, total: number) =>\n `Slides ${start} to ${end} of ${total}`;\n\n/\n With `groupSize=\"auto\"`: how many slides fit the width of the carousel, from the width of the\n * first slide, and the two widths. A snapshot string (`perPage:slideWidth:rootWidth`) so that\n * `useSyncExternalStore` compares it by value; one slide per page before anything is measured.\n /\nfunction useAutoPageSize(\n enabled: boolean,\n root: HTMLElement \| null,\n slide: HTMLElement \| null,\n): { perPage: number; slideWidth: number; rootWidth: number } {\n const subscribe = React.useCallback(\n (notify: () => void) => {\n if (!enabled \|\| !root \|\| typeof ResizeObserver === 'undefined') return () => {};\n const observer = new ResizeObserver(notify);\n observer.observe(root);\n if (slide) observer.observe(slide);\n return () => observer.disconnect();\n },\n [enabled, root, slide],\n );\n const getSnapshot = () => {\n if (!enabled \|\| !root \|\| !slide) return '1:0:0';\n const slideWidth = slide.offsetWidth;\n const rootWidth = root.clientWidth;\n const perPage = slideWidth > 0 ? Math.max(1, Math.floor(rootWidth / slideWidth)) : 1;\n return `${perPage}:${slideWidth}:${rootWidth}`;\n };\n const snapshot = React.useSyncExternalStore(subscribe, getSnapshot, () => '1:0:0');\n const [perPage, slideWidth, rootWidth] = snapshot.split(':').map(Number) as [\n number,\n number,\n number,\n ];\n return { perPage, slideWidth, rootWidth };\n}\n\nfunction isRotationControl(target: EventTarget \| null): boolean {\n return target instanceof Element && target.closest('[data-carousel-rotation]') !== null;\n}\n\n/* The `<img>` slot of a thumbnail: a string is its `src`. /\nfunction thumbnailSlot(thumbnail: Slot<'img'>): Slot<'img'> {\n return typeof thumbnail === 'string' ? { src: thumbnail } : thumbnail;\n}\n\nconst PauseGlyph = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n <rect x=\"4\" y=\"3\" width=\"3\" height=\"10\" rx=\"1\" />\n <rect x=\"9\" y=\"3\" width=\"3\" height=\"10\" rx=\"1\" />\n </svg>\n);\n\nconst PlayGlyph = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n <path d=\"M5 3.5v9a.5.5 0 0 0 .77.42l7-4.5a.5.5 0 0 0 0-.84l-7-4.5A.5.5 0 0 0 5 3.5Z\" />\n </svg>\n);\n\n// The Carousel root, documented on the exported `Carousel` const.\nconst CarouselRoot = ({\n value: controlledValue,\n defaultValue = 0,\n onValueChange,\n autoPlay = false,\n autoPlayInterval = 5000,\n autoPlayLabels,\n labels,\n loop = false,\n groupSize = 1,\n align = 'start',\n draggable = false,\n controlsLayout = 'overlay',\n appearance = 'flat',\n className,\n children,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onBlur,\n ref,\n ...rest\n}: CarouselProps) => {\n const [storedIndex, setActiveIndex] = useControllable(\n controlledValue,\n defaultValue,\n onValueChange,\n );\n const trackId = useId('carousel-slides');\n const [rootEl, setRootEl] = React.useState<HTMLDivElement \| null>(null);\n const rootRef = useMergedRefs<HTMLDivElement>(ref, setRootEl);\n // The direction that applies to the rendered root (its own or an ancestor's `dir`, e.g. an RTL\n // section inside an LTR WaveProvider); before mount and on the server, the provider's/document's.\n const renderedDir = useDirection(rootEl);\n const dir = rest.dir === 'rtl' \|\| rest.dir === 'ltr' ? rest.dir : renderedDir;\n const prefersReducedMotion = usePrefersReducedMotion();\n const [firstSlideEl, setFirstSlideEl] = React.useState<HTMLElement \| null>(null);\n const [trackEl, setTrackEl] = React.useState<HTMLElement \| null>(null);\n const [viewportEl, setViewportEl] = React.useState<HTMLElement \| null>(null);\n const auto = groupSize === 'auto';\n const measured = useAutoPageSize(auto, viewportEl, firstSlideEl);\n const size = auto ? measured.perPage : Math.max(1, Math.floor(groupSize) \|\| 1);\n\n // Rotation state: stopped or not (the user's choice, stopped by default under reduced motion, or\n // ended at the last slide without loop) and the temporary pauses while the pointer is over the\n // content or focus is inside. An explicit Start overrides the focus pause while focus stays on\n // the rotation control (APG `hasUserActivatedPlay`), so pressing Start visibly starts the\n // rotation.\n const [userPaused, setUserPaused] = React.useState<boolean \| null>(null);\n // The slide count at which rotation ended at the last slide (null while it has not ended), kept\n // apart from the user's choice so the end lasts only while its cause does.\n const [endedAt, setEndedAt] = React.useState<number \| null>(null);\n const [hovered, setHovered] = React.useState(false);\n const [pointerOnControl, setPointerOnControl] = React.useState(false);\n const [focusWithin, setFocusWithin] = React.useState(false);\n const [startedFromControl, setStartedFromControl] = React.useState(false);\n\n // Slides are the `CarouselItem` children, Fragments flattened; the element type is unwrapped, so\n // slides written in a Server Component (lazy client references) count too (C-COMPOUND).\n const items: Array<{ key: string; node: React.ReactNode; thumbnail?: Slot<'img'> }> = [];\n // A `Carousel.Button` of each direction replaces the built-in button; a second one of the same\n // direction is not rendered.\n const customButtons: { previous?: React.ReactElement; next?: React.ReactElement } = {};\n let droppedChildren = false;\n for (const child of flattenChildren(children)) {\n if (isElementOfType<CarouselItemProps>(child.node, CarouselItem)) {\n items.push({ ...child, thumbnail: child.node.props.thumbnail });\n } else if (isElementOfType<{ direction?: 'previous' \| 'next' }>(child.node, CarouselButton)) {\n const direction = child.node.props.direction === 'next' ? 'next' : 'previous';\n if (customButtons[direction]) droppedChildren = true;\n else customButtons[direction] = React.cloneElement(child.node, { key: child.key });\n } else if (slotRendersContent(child.node)) droppedChildren = true;\n }\n const hasThumbnails = items.some((item) => item.thumbnail !== undefined);\n const total = items.length;\n\n React.useEffect(() => {\n if (droppedChildren) {\n warnOnce(\n 'Carousel:non-item-children',\n 'Carousel: only `Carousel.Item` (`CarouselItem`) children are slides, directly or in ' +\n 'Fragments; other children are not rendered. A component that renders `Carousel.Item` ' +\n 'itself is not recognised: render the `Carousel.Item` in the Carousel and put the ' +\n 'component inside it.',\n );\n }\n }, [droppedChildren]);\n\n // Derived during render (C-HOOKS): removed slides or an out-of-range value show the nearest one.\n const index = clampToPage(storedIndex, size, total);\n const pages = pageCount(total, size);\n const lastStart = lastPageStart(total, size);\n const atStart = index <= 0;\n const atEnd = index >= lastStart;\n const prevDisabled = pages <= 1 \|\| (!loop && atStart);\n const nextDisabled = pages <= 1 \|\| (!loop && atEnd);\n\n // Without loop, rotation ends at the last slide (however it got there) and stays stopped: moving\n // back to an earlier slide does not restart it, only Start does. The end applies to the slide\n // count it happened at: once slides are added or removed, or loop is turned on, it is dropped\n // and rotation continues unless the user stopped it (adjusting state during render, C-HOOKS).\n const ended = endedAt === total && !loop;\n const stopped = (userPaused ?? prefersReducedMotion) \|\| ended;\n const hasRotation = autoPlay && pages > 1;\n if (hasRotation && !loop && atEnd && !stopped) setEndedAt(total);\n else if (endedAt !== null && !ended) setEndedAt(null);\n // A release moves one page towards the drag; past the ends it only loops with `loop`.\n const drag = useCarouselDrag({\n enabled: draggable && pages > 1,\n dir,\n onCommit: (delta) => {\n if (delta === 1) {\n if (!atEnd) goTo(index + size);\n else if (loop) goTo(0);\n } else if (delta === -1) {\n if (!atStart) goTo(index - size);\n else if (loop) goTo(lastStart);\n }\n },\n });\n const pausedByPointer = (hovered && !pointerOnControl) \|\| drag.dragging;\n const pausedByFocus = focusWithin && !startedFromControl;\n const rotating = hasRotation && !stopped && !pausedByPointer && !pausedByFocus;\n\n // Compares with the shown (clamped) index, so re-picking the visible slide reports nothing.\n const goTo = (target: number) => {\n if (target >= 0 && target < total && target !== index) setActiveIndex(target);\n };\n const goPrev = () => goTo(atStart ? lastStart : index - size);\n const goNext = () => goTo(atEnd ? 0 : index + size);\n\n // Reads the latest index at tick time (the updater's base), so the interval does not restart on\n // every slide or parent render and consecutive ticks chain even before a re-render.\n const advance = useEventCallback(() => {\n setActiveIndex((prev) => {\n const current = clampToPage(prev, size, total);\n if (current < lastStart) return current + size;\n return loop ? 0 : prev;\n });\n });\n\n React.useEffect(() => {\n if (!rotating) return;\n const id = setInterval(advance, autoPlayInterval);\n return () => clearInterval(id);\n }, [rotating, autoPlayInterval, advance]);\n\n const toggleRotation = () => {\n if (stopped) {\n // Start: from the first slide when rotation had ended at the last one.\n if (!loop && atEnd) goTo(0);\n setEndedAt(null);\n setUserPaused(false);\n setStartedFromControl(true);\n } else {\n setUserPaused(true);\n setStartedFromControl(false);\n }\n };\n\n // The consumer's pointer and focus handlers composed with the pause tracking (C-COMPOSE). The\n // empty root gets them too: the consumer's handlers still run, and a pointer or focus that leaves\n // while there are no slides (slides being reloaded) does not keep rotation paused afterwards.\n const rootHandlers = {\n onMouseEnter: composeEventHandlers(onMouseEnter, () => setHovered(true)),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => setHovered(false)),\n onFocus: composeEventHandlers(onFocus, (event: React.FocusEvent<HTMLDivElement>) => {\n // Any focus inside pauses (APG), the rotation control included. Focus that enters from\n // outside or moves on to other content ends the exemption of an explicit Start.\n const from = event.relatedTarget;\n const entering = !(from instanceof Node && event.currentTarget.contains(from));\n setFocusWithin(true);\n if (entering \|\| !isRotationControl(event.target)) setStartedFromControl(false);\n }),\n onBlur: composeEventHandlers(onBlur, (event: React.FocusEvent<HTMLDivElement>) => {\n const next = event.relatedTarget;\n if (!(next instanceof Node && event.currentTarget.contains(next))) {\n setFocusWithin(false);\n setStartedFromControl(false);\n }\n }),\n };\n\n // The slides of the shown page form one arrow-key focus group (groupSize above 1). Only they\n // carry a roving value; the others are inert.\n const grouped = size > 1;\n const pageEnd = Math.min(index + size, total);\n const visibleValues = React.useMemo(\n () => (grouped ? Array.from({ length: pageEnd - index }, (_, k) => String(index + k)) : []),\n [grouped, index, pageEnd],\n );\n const roving = useRovingTabIndex({\n items: visibleValues,\n activeValue: String(index),\n orientation: 'horizontal',\n loop: false,\n dir,\n tabStop: 'last-focused',\n });\n const trackRef = useMergedRefs<HTMLDivElement>(roving.containerProps.ref, setTrackEl);\n // Which slide of the new page takes focus after an arrow past the end of a page.\n const pendingFocus = React.useRef<'first' \| 'last' \| null>(null);\n React.useLayoutEffect(() => {\n const pending = pendingFocus.current;\n if (!pending \|\| !trackEl) return;\n pendingFocus.current = null;\n const target = pending === 'first' ? index : pageEnd - 1;\n trackEl.querySelector<HTMLElement>(`[data-roving-value=\"${target}\"]`)?.focus();\n }, [index, pageEnd, trackEl]);\n const handleTrackKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n const slideIndex = (event.target as HTMLElement).getAttribute('data-roving-value');\n const intent = getArrowIntent(event.key, { orientation: 'horizontal', dir });\n if (\n slideIndex !== null &&\n intent &&\n !event.defaultPrevented &&\n !event.altKey &&\n !event.ctrlKey &&\n !event.metaKey\n ) {\n const current = Number(slideIndex);\n if (intent === 'next' && current === pageEnd - 1) {\n event.preventDefault();\n if (!nextDisabled) {\n pendingFocus.current = 'first';\n goNext();\n }\n return;\n }\n if (intent === 'prev' && current === index) {\n event.preventDefault();\n if (!prevDisabled) {\n pendingFocus.current = 'last';\n goPrev();\n }\n return;\n }\n }\n roving.containerProps.onKeyDown(event);\n };\n\n const previousLabel = labels?.previous ?? DEFAULT_PREVIOUS_LABEL;\n const nextLabel = labels?.next ?? DEFAULT_NEXT_LABEL;\n const goPrevious = useEventCallback(() => goPrev());\n const goToNext = useEventCallback(() => goNext());\n // What `Carousel.Button` reads (C-MEMO).\n const context = React.useMemo<CarouselContextValue>(\n () => ({\n trackId,\n previousLabel,\n nextLabel,\n previousDisabled: prevDisabled,\n nextDisabled,\n goPrevious,\n goNext: goToNext,\n controlsLayout,\n dir,\n }),\n [\n trackId,\n previousLabel,\n nextLabel,\n prevDisabled,\n nextDisabled,\n goPrevious,\n goToNext,\n controlsLayout,\n dir,\n ],\n );\n\n if (total === 0) {\n return (\n <div\n ref={rootRef}\n data-controls-layout={controlsLayout}\n data-appearance={appearance}\n className={cn(carouselClassNames.root, 'relative', className)}\n {...rootHandlers}\n {...rest}\n />\n );\n }\n\n const sign = dir === 'rtl' ? 1 : -1;\n // A page is as wide as the carousel: the track moves by pages. With `auto` the slides keep their\n // own width and the track moves by whole slides, in pixels, plus the alignment of the page.\n let transform = `translateX(${sign (index / size) * 100}%)`;\n if (drag.offsetPx !== 0) {\n transform = `translateX(calc(${sign * (index / size) * 100}% + ${drag.offsetPx}px))`;\n }\n if (auto) {\n const leftover = Math.max(0, measured.rootWidth - size * measured.slideWidth);\n const alignShift = align === 'center' ? leftover / 2 : align === 'end' ? leftover : 0;\n const px = sign * index * measured.slideWidth + (dir === 'rtl' ? -alignShift : alignShift);\n transform = `translateX(${px + drag.offsetPx + 0}px)`;\n }\n const slidesLabel = labels?.slides ?? defaultSlidesLabel;\n /** The name of the page that starts at `start`: its slides, or the one slide it holds. /\n const pageLabel = (start: number) => {\n const end = Math.min(start + size, total);\n return end - start === 1 ? slideLabel(start, total) : slidesLabel(start + 1, end, total);\n };\n // The chevrons mirror by the same resolved direction as the track. A CSS `rtl:` variant would\n // also match `[dir=rtl] `, so an LTR carousel inside an RTL ancestor got mirrored chevrons.\n const chevronClass = dir === 'rtl' ? '-scale-x-100' : undefined;\n const pauseLabel = autoPlayLabels?.pause ?? DEFAULT_PAUSE_LABEL;\n const playLabel = autoPlayLabels?.play ?? DEFAULT_PLAY_LABEL;\n const pickerLabel = labels?.picker ?? DEFAULT_PICKER_LABEL;\n const slideLabel = labels?.slide ?? defaultSlideLabel;\n const carouselRoleDescription =\n labels?.carouselRoleDescription ?? DEFAULT_CAROUSEL_ROLE_DESCRIPTION;\n const slideRoleDescription = labels?.slideRoleDescription ?? DEFAULT_SLIDE_ROLE_DESCRIPTION;\n\n const inline = controlsLayout === 'inline' \|\| controlsLayout === 'inline-wide';\n const layoutClasses = CAROUSEL_CONTROL_LAYOUT[controlsLayout];\n const previousControl = customButtons.previous ?? (\n <button\n key=\"previous\"\n type=\"button\"\n aria-label={previousLabel}\n aria-controls={trackId}\n {...focusableDisabledProps(prevDisabled)}\n onClick={preventIfDisabled(prevDisabled, goPrev)}\n className={cn(\n carouselClassNames.previousButton,\n CAROUSEL_CONTROL_BASE,\n layoutClasses.previous,\n )}\n >\n <ChevronLeftIcon size={16} className={chevronClass} />\n </button>\n );\n const nextControl = customButtons.next ?? (\n <button\n key=\"next\"\n type=\"button\"\n aria-label={nextLabel}\n aria-controls={trackId}\n {...focusableDisabledProps(nextDisabled)}\n onClick={preventIfDisabled(nextDisabled, goNext)}\n className={cn(carouselClassNames.nextButton, CAROUSEL_CONTROL_BASE, layoutClasses.next)}\n >\n <ChevronRightIcon size={16} className={chevronClass} />\n </button>\n );\n\n const viewport = (\n <div\n ref={setViewportEl}\n className={cn(carouselClassNames.viewport, 'relative min-w-0 flex-1 overflow-hidden')}\n >\n <div\n id={trackId}\n className={cn(\n carouselClassNames.track,\n drag.dragging\n ? 'flex'\n : 'flex transition-transform duration-300 ease-in-out motion-reduce:transition-none',\n // Horizontal pointer moves belong to the drag; a vertical swipe still scrolls the page.\n draggable && 'touch-pan-y',\n )}\n style={{ transform }}\n data-dragging={drag.dragging ? '' : undefined}\n {...drag.handlers}\n {...(grouped ? roving.containerProps : null)}\n ref={grouped ? trackRef : setTrackEl}\n onKeyDown={grouped ? handleTrackKeyDown : undefined}\n >\n {items.map(({ key, node }, i) => {\n const active = i >= index && i < index + size;\n return (\n <div\n key={key}\n ref={i === 0 ? setFirstSlideEl : undefined}\n role=\"group\"\n aria-roledescription={slideRoleDescription}\n aria-label={slideLabel(i, total)}\n aria-hidden={active ? undefined : true}\n inert={!active}\n data-roving-value={grouped && active ? String(i) : undefined}\n tabIndex={grouped && active ? roving.getTabIndex(String(i)) : undefined}\n className={cn(\n carouselClassNames.slide,\n auto ? 'w-auto shrink-0' : size === 1 ? 'w-full shrink-0' : 'shrink-0',\n grouped &&\n 'focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring',\n )}\n style={!auto && size > 1 ? { width: `calc(100% / ${size})` } : undefined}\n >\n {node}\n </div>\n );\n })}\n </div>\n {/* Overlaid on the slides, after them in the tab order, like before the layouts. /}\n {!inline && previousControl}\n {!inline && nextControl}\n </div>\n );\n\n return (\n <CarouselContext.Provider value={context}>\n <div\n ref={rootRef}\n role=\"region\"\n aria-roledescription={carouselRoleDescription}\n aria-label=\"Carousel\"\n data-controls-layout={controlsLayout}\n data-appearance={appearance}\n // A stacking context of its own: the controls' z-index cannot lift them over page headers.\n className={cn(\n carouselClassNames.root,\n 'relative isolate overflow-hidden',\n appearance === 'elevated' && 'rounded-md shadow-4',\n className,\n )}\n {...rootHandlers}\n {...rest}\n >\n {hasRotation && (\n <button\n type=\"button\"\n data-carousel-rotation=\"\"\n aria-label={stopped ? playLabel : pauseLabel}\n aria-controls={trackId}\n onClick={toggleRotation}\n // The pointer over the control does not pause (APG): the user is operating it.\n onMouseEnter={() => setPointerOnControl(true)}\n onMouseLeave={() => setPointerOnControl(false)}\n className={cn(\n carouselClassNames.autoPlayButton,\n CAROUSEL_CONTROL_BASE,\n // Above the edge strips of the wide layouts, which would dim and cover it.\n 'absolute z-20 h-8 w-8 rounded-full border border-border bg-background shadow-2 top-2',\n // Over the viewport's corner: past the Previous button of an inline layout.\n inline ? 'start-12' : 'start-2',\n )}\n >\n {stopped ? <PlayGlyph /> : <PauseGlyph />}\n </button>\n )}\n {inline ? (\n <div className=\"flex items-stretch\">\n {previousControl}\n {viewport}\n {nextControl}\n </div>\n ) : (\n viewport\n )}\n {/ Announces the current slide, except while slides rotate on their own. /}\n <div aria-live={rotating ? 'off' : 'polite'} aria-atomic=\"true\" className=\"sr-only\">\n {pageLabel(index)}\n </div>\n <div\n role=\"group\"\n aria-label={pickerLabel}\n className={cn(\n carouselClassNames.picker,\n hasThumbnails\n ? 'relative mx-auto flex w-fit flex-wrap justify-center gap-2 p-2'\n : 'absolute inset-x-0 bottom-1 z-10 mx-auto flex w-fit',\n )}\n >\n {items\n .filter((_, i) => i % size === 0)\n .map(({ key, thumbnail }, page) => {\n const start = page size;\n const active = start === index;\n return (\n <button\n key={key}\n type=\"button\"\n aria-label={pageLabel(start)}\n aria-current={active ? 'true' : undefined}\n onClick={() => goTo(start)}\n className={cn(\n carouselClassNames.pickerButton,\n 'group inline-flex items-center justify-center',\n thumbnail !== undefined ? 'rounded-md p-0.5' : 'h-6 min-w-6',\n focusRing,\n )}\n >\n {thumbnail !== undefined ? (\n renderSlot(\n thumbnailSlot(thumbnail),\n 'img',\n cn(\n carouselItemClassNames.thumbnail,\n 'block h-12 w-16 rounded object-cover',\n active\n ? cn('outline-2 outline-primary', forcedColors.selectedContainer)\n : 'opacity-70 group-hover:opacity-100',\n ),\n { alt: '', draggable: false },\n )\n ) : (\n <span\n aria-hidden=\"true\"\n className={cn(\n carouselClassNames.pickerIndicator,\n 'block h-2 rounded-full transition-[width,background-color] duration-200 motion-reduce:transition-none',\n active\n ? cn('w-5 bg-primary', forcedColors.selectedLeaf)\n : 'w-2 bg-stroke-accessible group-hover:bg-foreground forced-colors:bg-[ButtonText] forced-colors:forced-color-adjust-none',\n )}\n />\n )}\n </button>\n );\n })}\n </div>\n </div>\n </CarouselContext.Provider>\n );\n};\nCarouselRoot.displayName = 'Carousel';\n\n/*\n One slide of a {@link Carousel}. Write it in the Carousel, directly or in a Fragment: a component\n * that renders `Carousel.Item` itself is not recognised as a slide (put that component inside the\n * `Carousel.Item` instead).\n /\nexport const CarouselItem = ({\n thumbnail: _thumbnail,\n className,\n children,\n ref,\n ...rest\n}: CarouselItemProps) => {\n return (\n <div ref={ref} className={cn(carouselItemClassNames.root, 'p-4', className)} {...rest}>\n {children}\n </div>\n );\n};\nCarouselItem.displayName = 'CarouselItem';\n\n/\n A slideshow that shows one slide at a time (WAI-ARIA APG carousel with previous/next buttons\n * and a slide picker).\n \n - Slides are the `Carousel.Item` (`CarouselItem`) children, written directly in the Carousel or\n * in Fragments. Other children are not rendered (a development warning says so). A component\n * that renders `Carousel.Item` itself is not recognised: write the `Carousel.Item` in the\n * Carousel and put the component inside it.\n * - Previous/Next stay focusable at the ends (`aria-disabled`), so keyboard focus is not lost.\n * - The slide picker is a group of buttons named \"Slide n of m\"; the active one has\n * `aria-current=\"true\"`.\n * - Inactive slides are `aria-hidden` and `inert`, so neither Tab nor a screen reader reaches\n * their content.\n * - With `autoPlay`, a Pause/Start control comes first (WAI-ARIA APG): rotation pauses while\n * focus is inside the carousel (in most browsers also after a click on one of its controls) or\n * the pointer is over its content, activating Start rotates at once, and the live region is\n * silent (`aria-live=\"off\"`) while slides rotate. Without `loop` rotation ends at the last slide\n * and stays stopped until the control's Start is activated (or the number of slides changes, or\n * `loop` is turned on).\n * - Right-to-left layouts slide the other way and mirror the Previous/Next chevrons: the direction\n * is read from the rendered element (its `dir` prop, the nearest ancestor's `dir`, WaveProvider\n * `dir` or the document's), so an LTR section inside an RTL page stays LTR throughout.\n * - Name the carousel with `aria-label` or `aria-labelledby` (the fallback name is \"Carousel\").\n * The built-in names and role descriptions are English: `labels` and `autoPlayLabels`\n * translate them.\n * - The controls are layered over the slides inside the carousel's own stacking context, so they\n * never paint over page headers that stay in view while the page scrolls.\n \n - `groupSize` shows several slides per page, `draggable` lets the pointer drag them, and a\n * `thumbnail` on a `Carousel.Item` turns the picker into a row of thumbnails.\n * - `controlsLayout` places the Previous and Next buttons over the slides (`overlay`,\n * `overlay-wide`) or beside them (`inline`, `inline-wide`); `Carousel.Button` replaces the\n * built-in button of its `direction` with one of your own glyph.\n \n Compound access (`Carousel.Item`, `Carousel.Button`) needs a client module; React Server\n * Components import the flat names `CarouselItem` and `CarouselButton` instead.\n /\nexport const Carousel = / @__PURE__ */ Object.assign(CarouselRoot, {\n Item: CarouselItem,\n Button: CarouselButton,\n});\n"],"mappings":"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"}

package/dist/components/layout/Carousel.context.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/dev.cjs");let n=require("react");n=e.__toESM(n,1);var r=n.createContext(null);r.displayName=`CarouselContext`;var i=()=>{},a={trackId:``,previousLabel:``,nextLabel:``,previousDisabled:!0,nextDisabled:!0,goPrevious:i,goNext:i,controlsLayout:`overlay`,dir:`ltr`};function o(e){return n.useContext(r)\|\|(t.reportMissingContext(e,`Carousel`),a)}exports.CarouselContext=r,exports.useCarouselContext=o;
2	+ //# sourceMappingURL=Carousel.context.cjs.map

package/dist/components/layout/Carousel.context.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.context.cjs","names":["React","require_runtime","require_dev","react","CarouselContext","noop","INERT_CONTEXT","useCarouselContext","component"],"sources":["../../../src/components/layout/Carousel.context.ts"],"sourcesContent":["import * as React from 'react';\nimport { reportMissingContext } from '../../lib/dev';\n\n/** Where a Carousel puts its Previous and Next buttons. */\nexport type CarouselControlsLayout = 'overlay' | 'inline' | 'overlay-wide' | 'inline-wide';\n\n/** What `Carousel.Button` reads from the Carousel it is written in. */\nexport interface CarouselContextValue {\n /** The id of the track the buttons control. */\n trackId: string;\n /** The built-in accessible names, from `labels` or their English defaults. */\n previousLabel: string;\n nextLabel: string;\n /** Whether the button is at the end of the slides without `loop` (kept focusable, `aria-disabled`). */\n previousDisabled: boolean;\n nextDisabled: boolean;\n goPrevious: () => void;\n goNext: () => void;\n controlsLayout: CarouselControlsLayout;\n /** The resolved direction, for mirroring the chevrons. */\n dir: 'ltr' | 'rtl';\n}\n\nexport const CarouselContext = React.createContext<CarouselContextValue | null>(null);\nCarouselContext.displayName = 'CarouselContext';\n\nconst noop = () => {};\n\n/** The value outside a Carousel in production, where the missing context is logged once. */\nconst INERT_CONTEXT: CarouselContextValue = {\n trackId: '',\n previousLabel: '',\n nextLabel: '',\n previousDisabled: true,\n nextDisabled: true,\n goPrevious: noop,\n goNext: noop,\n controlsLayout: 'overlay',\n dir: 'ltr',\n};\n\n/** The Carousel context of a part: throws in development, logs once in production, outside one. */\nexport function useCarouselContext(component: string): CarouselContextValue {\n const context = React.useContext(CarouselContext);\n if (context) return context;\n reportMissingContext(component, 'Carousel');\n return INERT_CONTEXT;\n}\n"],"mappings":"4IAuBA,IAAaI,EAAkBJ,EAAM,cAA2C,IAAI,EACpF,EAAgB,YAAc,kBAE9B,IAAMK,MAAa,CAAC,EAGdC,EAAsC,CAC1C,QAAS,GACT,cAAe,GACf,UAAW,GACX,iBAAkB,GAClB,aAAc,GACd,WAAYD,EACZ,OAAQA,EACR,eAAgB,UAChB,IAAK,KACP,EAGA,SAAgBE,EAAmB,EAAyC,CAI1E,OAHgBP,EAAM,WAAWI,CAC7B,IACJF,EAAA,qBAAqBM,EAAW,UAAU,EACnCF,EACT"}

package/dist/components/layout/Carousel.context.mjs ADDED Viewed

@@ -0,0 +1,24 @@
+"use client";
+import { reportMissingContext as e } from "../../lib/dev.mjs";
+import * as t from "react";
+//#region src/components/layout/Carousel.context.ts
+var n = t.createContext(null);
+n.displayName = "CarouselContext";
+var r = () => {}, i = {
+	trackId: "",
+	previousLabel: "",
+	nextLabel: "",
+	previousDisabled: !0,
+	nextDisabled: !0,
+	goPrevious: r,
+	goNext: r,
+	controlsLayout: "overlay",
+	dir: "ltr"
+};
+function a(r) {
+	return t.useContext(n) || (e(r, "Carousel"), i);
+}
+//#endregion
+export { n as CarouselContext, a as useCarouselContext };
+//# sourceMappingURL=Carousel.context.mjs.map

package/dist/components/layout/Carousel.context.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.context.mjs","names":["React","CarouselContext","noop","INERT_CONTEXT","useCarouselContext","reportMissingContext","component"],"sources":["../../../src/components/layout/Carousel.context.ts"],"sourcesContent":["import * as React from 'react';\nimport { reportMissingContext } from '../../lib/dev';\n\n/** Where a Carousel puts its Previous and Next buttons. */\nexport type CarouselControlsLayout = 'overlay' | 'inline' | 'overlay-wide' | 'inline-wide';\n\n/** What `Carousel.Button` reads from the Carousel it is written in. */\nexport interface CarouselContextValue {\n /** The id of the track the buttons control. */\n trackId: string;\n /** The built-in accessible names, from `labels` or their English defaults. */\n previousLabel: string;\n nextLabel: string;\n /** Whether the button is at the end of the slides without `loop` (kept focusable, `aria-disabled`). */\n previousDisabled: boolean;\n nextDisabled: boolean;\n goPrevious: () => void;\n goNext: () => void;\n controlsLayout: CarouselControlsLayout;\n /** The resolved direction, for mirroring the chevrons. */\n dir: 'ltr' | 'rtl';\n}\n\nexport const CarouselContext = React.createContext<CarouselContextValue | null>(null);\nCarouselContext.displayName = 'CarouselContext';\n\nconst noop = () => {};\n\n/** The value outside a Carousel in production, where the missing context is logged once. */\nconst INERT_CONTEXT: CarouselContextValue = {\n trackId: '',\n previousLabel: '',\n nextLabel: '',\n previousDisabled: true,\n nextDisabled: true,\n goPrevious: noop,\n goNext: noop,\n controlsLayout: 'overlay',\n dir: 'ltr',\n};\n\n/** The Carousel context of a part: throws in development, logs once in production, outside one. */\nexport function useCarouselContext(component: string): CarouselContextValue {\n const context = React.useContext(CarouselContext);\n if (context) return context;\n reportMissingContext(component, 'Carousel');\n return INERT_CONTEXT;\n}\n"],"mappings":";;;;AAuBA,IAAaC,IAAkBD,EAAM,cAA2C,IAAI;AACpF,EAAgB,cAAc;AAE9B,IAAME,UAAa,CAAC,GAGdC,IAAsC;CAC1C,SAAS;CACT,eAAe;CACf,WAAW;CACX,kBAAkB;CAClB,cAAc;CACd,YAAYD;CACZ,QAAQA;CACR,gBAAgB;CAChB,KAAK;AACP;AAGA,SAAgBE,EAAmB,GAAyC;CAI1E,OAHgBJ,EAAM,WAAWC,CAC7B,MACJI,EAAqBC,GAAW,UAAU,GACnCH;AACT"}

package/dist/components/layout/Carousel.drag.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/events.cjs");let n=require("react");n=e.__toESM(n,1);var r=4,i=.25,a=.5,o=100;function s({enabled:e,dir:s,onCommit:c}){let[l,u]=n.useState(0),[d,f]=n.useState(!1),p=n.useRef(null),m=n.useRef(!1),h=e=>{let t=p.current;if(p.current=null,!t?.active)return;if(f(!1),u(0),!e){c(0);return}let n=t.last.x-t.startX,r=t.last.t-t.prev.t,l=performance.now()-t.last.t>o,d=r>0&&!l?(t.last.x-t.prev.x)/r:0,m=s===`rtl`?1:-1,h=0;Math.abs(d)>a?h=Math.sign(d)===m?1:-1:t.width>0&&Math.abs(n)>t.width*i&&(h=Math.sign(n)===m?1:-1),c(h)};return e?{dragging:d,offsetPx:l,handlers:{onPointerDown:e=>{if(e.button!==0\|\|!e.isPrimary\|\|!t.isOwnEvent(e)\|\|t.isEditableTarget(e.target)\|\|e.target.closest?.(`select`))return;m.current=!1,e.currentTarget.ownerDocument.addEventListener(`pointerup`,()=>{p.current&&!p.current.active&&(p.current=null)},{capture:!0,once:!0});let n=e.clientX,r=performance.now();p.current={pointerId:e.pointerId,startX:n,prev:{x:n,t:r},last:{x:n,t:r},width:e.currentTarget.parentElement?.getBoundingClientRect().width??0,active:!1}},onPointerMove:e=>{let t=p.current;if(t&&e.pointerId===t.pointerId){if(!t.active){if(Math.abs(e.clientX-t.startX)<r)return;t.active=!0,e.currentTarget.setPointerCapture(e.pointerId),f(!0)}t.prev=t.last,t.last={x:e.clientX,t:performance.now()},u(e.clientX-t.startX)}},onPointerUp:e=>{let t=p.current;t&&e.pointerId===t.pointerId&&(t.active&&(m.current=!0),h(!0))},onPointerCancel:e=>{let t=p.current;t&&e.pointerId===t.pointerId&&h(!1)},onClickCapture:e=>{m.current&&e.detail!==0&&(m.current=!1,e.preventDefault(),e.stopPropagation())}}}:{dragging:!1,offsetPx:0,handlers:{}}}exports.useCarouselDrag=s;
2	+ //# sourceMappingURL=Carousel.drag.cjs.map

package/dist/components/layout/Carousel.drag.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.drag.cjs","names":["React","isOwnEvent","isEditableTarget","require_runtime","require_events","react","DRAG_START_DISTANCE","COMMIT_DISTANCE_RATIO","COMMIT_VELOCITY","STALE_SAMPLE","useCarouselDrag","offsetPx","setOffsetPx","dragging","setDragging","session","swallowClick","finish","current","commit","onCommit","distance","elapsed","resting","velocity","forward","dir","delta","enabled","event","x","t"],"sources":["../../../src/components/layout/Carousel.drag.ts"],"sourcesContent":["import * as React from 'react';\nimport { isEditableTarget, isOwnEvent } from '../../lib/events';\n\n/** The pointer has to move this far (px) before a press becomes a drag: a click stays a click. */\nconst DRAG_START_DISTANCE = 4;\n/** A drag past this share of the viewport width changes the page. */\nconst COMMIT_DISTANCE_RATIO = 0.25;\n/** A release faster than this (px/ms) changes the page whatever the distance. */\nconst COMMIT_VELOCITY = 0.5;\n/** A last move older than this (ms) at the release does not count as speed. */\nconst STALE_SAMPLE = 100;\n\nexport interface UseCarouselDragOptions {\n /** Whether the track can be dragged at all; `false` attaches nothing. */\n enabled: boolean;\n /** The resolved direction: dragging towards the start of the page order shows the next page. */\n dir: 'ltr' | 'rtl';\n /** Called once when a drag ends: `1` shows the next page, `-1` the previous, `0` snaps back. */\n onCommit: (delta: -1 | 0 | 1) => void;\n}\n\nexport interface UseCarouselDragResult {\n /** Whether a drag is in progress (the track follows the pointer, without a transition). */\n dragging: boolean;\n /** The horizontal pixels the track is displaced by while dragging, else 0. */\n offsetPx: number;\n /** Handlers for the track; empty when the drag is disabled. */\n handlers: {\n onPointerDown?: React.PointerEventHandler<HTMLElement>;\n onPointerMove?: React.PointerEventHandler<HTMLElement>;\n onPointerUp?: React.PointerEventHandler<HTMLElement>;\n onPointerCancel?: React.PointerEventHandler<HTMLElement>;\n onClickCapture?: React.MouseEventHandler<HTMLElement>;\n };\n}\n\ninterface Session {\n pointerId: number;\n startX: number;\n /** The last two samples, for the release velocity. */\n prev: { x: number; t: number };\n last: { x: number; t: number };\n /** The viewport width at the press. */\n width: number;\n /** Past the start distance: the pointer is captured and the track follows. */\n active: boolean;\n}\n\n/**\n * Pointer dragging of a Carousel track. A press becomes a drag after a few pixels; the track then\n * follows the pointer and, on release, the page changes when the drag passed a quarter of the\n * viewport or left fast, else it snaps back. The click that ends a drag is swallowed once, so a\n * slide's link or button is not activated by the drag that started on it.\n */\nexport function useCarouselDrag({\n enabled,\n dir,\n onCommit,\n}: UseCarouselDragOptions): UseCarouselDragResult {\n const [offsetPx, setOffsetPx] = React.useState(0);\n const [dragging, setDragging] = React.useState(false);\n const session = React.useRef<Session | null>(null);\n const swallowClick = React.useRef(false);\n\n const finish = (commit: boolean) => {\n const current = session.current;\n session.current = null;\n if (!current?.active) return;\n setDragging(false);\n setOffsetPx(0);\n if (!commit) {\n onCommit(0);\n return;\n }\n const distance = current.last.x - current.startX;\n const elapsed = current.last.t - current.prev.t;\n // A pointer that rested before the release has no speed.\n const resting = performance.now() - current.last.t > STALE_SAMPLE;\n const velocity = elapsed > 0 && !resting ? (current.last.x - current.prev.x) / elapsed : 0;\n // Towards the start edge (left in LTR) shows the next page; RTL mirrors it.\n const forward = dir === 'rtl' ? 1 : -1;\n let delta: -1 | 0 | 1 = 0;\n if (Math.abs(velocity) > COMMIT_VELOCITY) delta = Math.sign(velocity) === forward ? 1 : -1;\n else if (current.width > 0 && Math.abs(distance) > current.width * COMMIT_DISTANCE_RATIO) {\n delta = Math.sign(distance) === forward ? 1 : -1;\n }\n onCommit(delta);\n };\n\n if (!enabled) return { dragging: false, offsetPx: 0, handlers: {} };\n\n const handlers: UseCarouselDragResult['handlers'] = {\n onPointerDown: (event) => {\n if (event.button !== 0 || !event.isPrimary || !isOwnEvent(event)) return;\n // A text field inside a slide keeps its own pointer behaviour (selecting text).\n if (isEditableTarget(event.target) || (event.target as Element).closest?.('select')) return;\n swallowClick.current = false;\n // A release that never reaches the track (the pointer left before the drag began) must not\n // leave the press open: the next move would start a drag with no button held.\n event.currentTarget.ownerDocument.addEventListener(\n 'pointerup',\n () => {\n if (session.current && !session.current.active) session.current = null;\n },\n { capture: true, once: true },\n );\n const x = event.clientX;\n const t = performance.now();\n session.current = {\n pointerId: event.pointerId,\n startX: x,\n prev: { x, t },\n last: { x, t },\n width: event.currentTarget.parentElement?.getBoundingClientRect().width ?? 0,\n active: false,\n };\n },\n onPointerMove: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n if (!current.active) {\n if (Math.abs(event.clientX - current.startX) < DRAG_START_DISTANCE) return;\n current.active = true;\n // Captured only now, so a plain click still reaches the slide's own button or link.\n event.currentTarget.setPointerCapture(event.pointerId);\n setDragging(true);\n }\n current.prev = current.last;\n current.last = { x: event.clientX, t: performance.now() };\n setOffsetPx(event.clientX - current.startX);\n },\n onPointerUp: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n if (current.active) swallowClick.current = true;\n finish(true);\n },\n onPointerCancel: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n finish(false);\n },\n onClickCapture: (event) => {\n // The click a browser sends after a mouse drag has a detail; a keyboard or programmatic\n // click (detail 0) is never that click, and a touch drag sends none.\n if (!swallowClick.current || event.detail === 0) return;\n swallowClick.current = false;\n event.preventDefault();\n event.stopPropagation();\n },\n };\n\n return { dragging, offsetPx, handlers };\n}\n"],"mappings":"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"}

package/dist/components/layout/Carousel.drag.mjs ADDED Viewed

@@ -0,0 +1,79 @@
+"use client";
+import { isEditableTarget as e, isOwnEvent as t } from "../../lib/events.mjs";
+import * as n from "react";
+//#region src/components/layout/Carousel.drag.ts
+var r = 4, i = .25, a = .5, o = 100;
+function s({ enabled: s, dir: c, onCommit: l }) {
+	let [u, d] = n.useState(0), [f, p] = n.useState(!1), m = n.useRef(null), h = n.useRef(!1), g = (e) => {
+		let t = m.current;
+		if (m.current = null, !t?.active) return;
+		if (p(!1), d(0), !e) {
+			l(0);
+			return;
+		}
+		let n = t.last.x - t.startX, r = t.last.t - t.prev.t, s = performance.now() - t.last.t > o, u = r > 0 && !s ? (t.last.x - t.prev.x) / r : 0, f = c === "rtl" ? 1 : -1, h = 0;
+		Math.abs(u) > a ? h = Math.sign(u) === f ? 1 : -1 : t.width > 0 && Math.abs(n) > t.width * i && (h = Math.sign(n) === f ? 1 : -1), l(h);
+	};
+	return s ? {
+		dragging: f,
+		offsetPx: u,
+		handlers: {
+			onPointerDown: (n) => {
+				if (n.button !== 0 || !n.isPrimary || !t(n) || e(n.target) || n.target.closest?.("select")) return;
+				h.current = !1, n.currentTarget.ownerDocument.addEventListener("pointerup", () => {
+					m.current && !m.current.active && (m.current = null);
+				}, {
+					capture: !0,
+					once: !0
+				});
+				let r = n.clientX, i = performance.now();
+				m.current = {
+					pointerId: n.pointerId,
+					startX: r,
+					prev: {
+						x: r,
+						t: i
+					},
+					last: {
+						x: r,
+						t: i
+					},
+					width: n.currentTarget.parentElement?.getBoundingClientRect().width ?? 0,
+					active: !1
+				};
+			},
+			onPointerMove: (e) => {
+				let t = m.current;
+				if (t && e.pointerId === t.pointerId) {
+					if (!t.active) {
+						if (Math.abs(e.clientX - t.startX) < r) return;
+						t.active = !0, e.currentTarget.setPointerCapture(e.pointerId), p(!0);
+					}
+					t.prev = t.last, t.last = {
+						x: e.clientX,
+						t: performance.now()
+					}, d(e.clientX - t.startX);
+				}
+			},
+			onPointerUp: (e) => {
+				let t = m.current;
+				t && e.pointerId === t.pointerId && (t.active && (h.current = !0), g(!0));
+			},
+			onPointerCancel: (e) => {
+				let t = m.current;
+				t && e.pointerId === t.pointerId && g(!1);
+			},
+			onClickCapture: (e) => {
+				h.current && e.detail !== 0 && (h.current = !1, e.preventDefault(), e.stopPropagation());
+			}
+		}
+	} : {
+		dragging: !1,
+		offsetPx: 0,
+		handlers: {}
+	};
+}
+//#endregion
+export { s as useCarouselDrag };
+//# sourceMappingURL=Carousel.drag.mjs.map

package/dist/components/layout/Carousel.drag.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.drag.mjs","names":["React","DRAG_START_DISTANCE","COMMIT_DISTANCE_RATIO","COMMIT_VELOCITY","STALE_SAMPLE","useCarouselDrag","offsetPx","setOffsetPx","dragging","setDragging","session","swallowClick","finish","current","commit","distance","elapsed","resting","velocity","forward","dir","delta","onCommit","enabled","event","isOwnEvent","isEditableTarget","x","t"],"sources":["../../../src/components/layout/Carousel.drag.ts"],"sourcesContent":["import * as React from 'react';\nimport { isEditableTarget, isOwnEvent } from '../../lib/events';\n\n/** The pointer has to move this far (px) before a press becomes a drag: a click stays a click. */\nconst DRAG_START_DISTANCE = 4;\n/** A drag past this share of the viewport width changes the page. */\nconst COMMIT_DISTANCE_RATIO = 0.25;\n/** A release faster than this (px/ms) changes the page whatever the distance. */\nconst COMMIT_VELOCITY = 0.5;\n/** A last move older than this (ms) at the release does not count as speed. */\nconst STALE_SAMPLE = 100;\n\nexport interface UseCarouselDragOptions {\n /** Whether the track can be dragged at all; `false` attaches nothing. */\n enabled: boolean;\n /** The resolved direction: dragging towards the start of the page order shows the next page. */\n dir: 'ltr' | 'rtl';\n /** Called once when a drag ends: `1` shows the next page, `-1` the previous, `0` snaps back. */\n onCommit: (delta: -1 | 0 | 1) => void;\n}\n\nexport interface UseCarouselDragResult {\n /** Whether a drag is in progress (the track follows the pointer, without a transition). */\n dragging: boolean;\n /** The horizontal pixels the track is displaced by while dragging, else 0. */\n offsetPx: number;\n /** Handlers for the track; empty when the drag is disabled. */\n handlers: {\n onPointerDown?: React.PointerEventHandler<HTMLElement>;\n onPointerMove?: React.PointerEventHandler<HTMLElement>;\n onPointerUp?: React.PointerEventHandler<HTMLElement>;\n onPointerCancel?: React.PointerEventHandler<HTMLElement>;\n onClickCapture?: React.MouseEventHandler<HTMLElement>;\n };\n}\n\ninterface Session {\n pointerId: number;\n startX: number;\n /** The last two samples, for the release velocity. */\n prev: { x: number; t: number };\n last: { x: number; t: number };\n /** The viewport width at the press. */\n width: number;\n /** Past the start distance: the pointer is captured and the track follows. */\n active: boolean;\n}\n\n/**\n * Pointer dragging of a Carousel track. A press becomes a drag after a few pixels; the track then\n * follows the pointer and, on release, the page changes when the drag passed a quarter of the\n * viewport or left fast, else it snaps back. The click that ends a drag is swallowed once, so a\n * slide's link or button is not activated by the drag that started on it.\n */\nexport function useCarouselDrag({\n enabled,\n dir,\n onCommit,\n}: UseCarouselDragOptions): UseCarouselDragResult {\n const [offsetPx, setOffsetPx] = React.useState(0);\n const [dragging, setDragging] = React.useState(false);\n const session = React.useRef<Session | null>(null);\n const swallowClick = React.useRef(false);\n\n const finish = (commit: boolean) => {\n const current = session.current;\n session.current = null;\n if (!current?.active) return;\n setDragging(false);\n setOffsetPx(0);\n if (!commit) {\n onCommit(0);\n return;\n }\n const distance = current.last.x - current.startX;\n const elapsed = current.last.t - current.prev.t;\n // A pointer that rested before the release has no speed.\n const resting = performance.now() - current.last.t > STALE_SAMPLE;\n const velocity = elapsed > 0 && !resting ? (current.last.x - current.prev.x) / elapsed : 0;\n // Towards the start edge (left in LTR) shows the next page; RTL mirrors it.\n const forward = dir === 'rtl' ? 1 : -1;\n let delta: -1 | 0 | 1 = 0;\n if (Math.abs(velocity) > COMMIT_VELOCITY) delta = Math.sign(velocity) === forward ? 1 : -1;\n else if (current.width > 0 && Math.abs(distance) > current.width * COMMIT_DISTANCE_RATIO) {\n delta = Math.sign(distance) === forward ? 1 : -1;\n }\n onCommit(delta);\n };\n\n if (!enabled) return { dragging: false, offsetPx: 0, handlers: {} };\n\n const handlers: UseCarouselDragResult['handlers'] = {\n onPointerDown: (event) => {\n if (event.button !== 0 || !event.isPrimary || !isOwnEvent(event)) return;\n // A text field inside a slide keeps its own pointer behaviour (selecting text).\n if (isEditableTarget(event.target) || (event.target as Element).closest?.('select')) return;\n swallowClick.current = false;\n // A release that never reaches the track (the pointer left before the drag began) must not\n // leave the press open: the next move would start a drag with no button held.\n event.currentTarget.ownerDocument.addEventListener(\n 'pointerup',\n () => {\n if (session.current && !session.current.active) session.current = null;\n },\n { capture: true, once: true },\n );\n const x = event.clientX;\n const t = performance.now();\n session.current = {\n pointerId: event.pointerId,\n startX: x,\n prev: { x, t },\n last: { x, t },\n width: event.currentTarget.parentElement?.getBoundingClientRect().width ?? 0,\n active: false,\n };\n },\n onPointerMove: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n if (!current.active) {\n if (Math.abs(event.clientX - current.startX) < DRAG_START_DISTANCE) return;\n current.active = true;\n // Captured only now, so a plain click still reaches the slide's own button or link.\n event.currentTarget.setPointerCapture(event.pointerId);\n setDragging(true);\n }\n current.prev = current.last;\n current.last = { x: event.clientX, t: performance.now() };\n setOffsetPx(event.clientX - current.startX);\n },\n onPointerUp: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n if (current.active) swallowClick.current = true;\n finish(true);\n },\n onPointerCancel: (event) => {\n const current = session.current;\n if (!current || event.pointerId !== current.pointerId) return;\n finish(false);\n },\n onClickCapture: (event) => {\n // The click a browser sends after a mouse drag has a detail; a keyboard or programmatic\n // click (detail 0) is never that click, and a touch drag sends none.\n if (!swallowClick.current || event.detail === 0) return;\n swallowClick.current = false;\n event.preventDefault();\n event.stopPropagation();\n },\n };\n\n return { dragging, offsetPx, handlers };\n}\n"],"mappings":"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"}

package/dist/components/layout/Carousel.groups.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use client";function e(e){return Number.isFinite(e)&&e>=1?Math.floor(e):1}function t(t,n){return t<=0?0:Math.ceil(t/e(n))}function n(n,r){let i=t(n,r);return i===0?0:(i-1)e(r)}function r(t,n){let r=e(n);return Math.floor(t/r)r}function i(e,t,n){return n<=0?0:r(Math.min(Math.max(Number.isNaN(e)?0:e,0),n-1),t)}exports.clampToPage=i,exports.lastPageStart=n,exports.pageCount=t,exports.pageStartOf=r;
2	+ //# sourceMappingURL=Carousel.groups.cjs.map

package/dist/components/layout/Carousel.groups.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.groups.cjs","names":["normalise","size","pageCount","total","lastPageStart","pages","pageStartOf","group","index","clampToPage"],"sources":["../../../src/components/layout/Carousel.groups.ts"],"sourcesContent":["/*\n * Page maths of a Carousel that shows several slides at once. The index of a Carousel is the\n * index of the first slide of the shown page; a page starts at a multiple of the group size. Pure\n * and server-safe.\n */\n\n/** A group size as a usable whole number: below 1 or not a number is 1, a fraction rounds down. */\nfunction normalise(size: number): number {\n return Number.isFinite(size) && size >= 1 ? Math.floor(size) : 1;\n}\n\n/** The number of pages of `total` slides shown `size` at a time. */\nexport function pageCount(total: number, size: number): number {\n return total <= 0 ? 0 : Math.ceil(total / normalise(size));\n}\n\n/** The index of the first slide of the last page. */\nexport function lastPageStart(total: number, size: number): number {\n const pages = pageCount(total, size);\n return pages === 0 ? 0 : (pages - 1) * normalise(size);\n}\n\n/** The first slide of the page that slide `index` is on. */\nexport function pageStartOf(index: number, size: number): number {\n const group = normalise(size);\n return Math.floor(index / group) * group;\n}\n\n/**\n * The shown index for a stored one: clamped to the slides, then snapped down to the start of its\n * page (a removed slide, a larger group size or an out-of-range value shows the nearest page).\n */\nexport function clampToPage(index: number, size: number, total: number): number {\n if (total <= 0) return 0;\n const clamped = Math.min(Math.max(Number.isNaN(index) ? 0 : index, 0), total - 1);\n return pageStartOf(clamped, size);\n}\n"],"mappings":"aAOA,SAASA,EAAU,EAAsB,CACvC,OAAO,OAAO,SAASC,CAAI,GAAKA,GAAQ,EAAI,KAAK,MAAMA,CAAI,EAAI,CACjE,CAGA,SAAgBC,EAAU,EAAe,EAAsB,CAC7D,OAAOC,GAAS,EAAI,EAAI,KAAK,KAAKA,EAAQH,EAAUC,CAAI,CAAC,CAC3D,CAGA,SAAgBG,EAAc,EAAe,EAAsB,CACjE,IAAMC,EAAQH,EAAUC,EAAOF,CAAI,EACnC,OAAOI,IAAU,EAAI,GAAKA,EAAQ,GAAKL,EAAUC,CAAI,CACvD,CAGA,SAAgBK,EAAY,EAAe,EAAsB,CAC/D,IAAMC,EAAQP,EAAUC,CAAI,EAC5B,OAAO,KAAK,MAAMO,EAAQD,CAAK,EAAIA,CACrC,CAMA,SAAgBE,EAAY,EAAe,EAAc,EAAuB,CAG9E,OAFIN,GAAS,EAAU,EAEhBG,EADS,KAAK,IAAI,KAAK,IAAI,OAAO,MAAME,CAAK,EAAI,EAAIA,EAAO,CAAC,EAAGL,EAAQ,CAC5D,EAASF,CAAI,CAClC"}

package/dist/components/layout/Carousel.groups.mjs ADDED Viewed

@@ -0,0 +1,23 @@
+"use client";
+//#region src/components/layout/Carousel.groups.ts
+function e(e) {
+	return Number.isFinite(e) && e >= 1 ? Math.floor(e) : 1;
+}
+function t(t, n) {
+	return t <= 0 ? 0 : Math.ceil(t / e(n));
+}
+function n(n, r) {
+	let i = t(n, r);
+	return i === 0 ? 0 : (i - 1) * e(r);
+}
+function r(t, n) {
+	let r = e(n);
+	return Math.floor(t / r) * r;
+}
+function i(e, t, n) {
+	return n <= 0 ? 0 : r(Math.min(Math.max(Number.isNaN(e) ? 0 : e, 0), n - 1), t);
+}
+//#endregion
+export { i as clampToPage, n as lastPageStart, t as pageCount, r as pageStartOf };
+//# sourceMappingURL=Carousel.groups.mjs.map

package/dist/components/layout/Carousel.groups.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Carousel.groups.mjs","names":["normalise","size","pageCount","total","lastPageStart","pages","pageStartOf","group","index","clampToPage"],"sources":["../../../src/components/layout/Carousel.groups.ts"],"sourcesContent":["/*\n * Page maths of a Carousel that shows several slides at once. The index of a Carousel is the\n * index of the first slide of the shown page; a page starts at a multiple of the group size. Pure\n * and server-safe.\n */\n\n/** A group size as a usable whole number: below 1 or not a number is 1, a fraction rounds down. */\nfunction normalise(size: number): number {\n return Number.isFinite(size) && size >= 1 ? Math.floor(size) : 1;\n}\n\n/** The number of pages of `total` slides shown `size` at a time. */\nexport function pageCount(total: number, size: number): number {\n return total <= 0 ? 0 : Math.ceil(total / normalise(size));\n}\n\n/** The index of the first slide of the last page. */\nexport function lastPageStart(total: number, size: number): number {\n const pages = pageCount(total, size);\n return pages === 0 ? 0 : (pages - 1) * normalise(size);\n}\n\n/** The first slide of the page that slide `index` is on. */\nexport function pageStartOf(index: number, size: number): number {\n const group = normalise(size);\n return Math.floor(index / group) * group;\n}\n\n/**\n * The shown index for a stored one: clamped to the slides, then snapped down to the start of its\n * page (a removed slide, a larger group size or an out-of-range value shows the nearest page).\n */\nexport function clampToPage(index: number, size: number, total: number): number {\n if (total <= 0) return 0;\n const clamped = Math.min(Math.max(Number.isNaN(index) ? 0 : index, 0), total - 1);\n return pageStartOf(clamped, size);\n}\n"],"mappings":";;AAOA,SAASA,EAAU,GAAsB;CACvC,OAAO,OAAO,SAASC,CAAI,KAAKA,KAAQ,IAAI,KAAK,MAAMA,CAAI,IAAI;AACjE;AAGA,SAAgBC,EAAU,GAAe,GAAsB;CAC7D,OAAOC,KAAS,IAAI,IAAI,KAAK,KAAKA,IAAQH,EAAUC,CAAI,CAAC;AAC3D;AAGA,SAAgBG,EAAc,GAAe,GAAsB;CACjE,IAAMC,IAAQH,EAAUC,GAAOF,CAAI;CACnC,OAAOI,MAAU,IAAI,KAAKA,IAAQ,KAAKL,EAAUC,CAAI;AACvD;AAGA,SAAgBK,EAAY,GAAe,GAAsB;CAC/D,IAAMC,IAAQP,EAAUC,CAAI;CAC5B,OAAO,KAAK,MAAMO,IAAQD,CAAK,IAAIA;AACrC;AAMA,SAAgBE,EAAY,GAAe,GAAc,GAAuB;CAG9E,OAFIN,KAAS,IAAU,IAEhBG,EADS,KAAK,IAAI,KAAK,IAAI,OAAO,MAAME,CAAK,IAAI,IAAIA,GAAO,CAAC,GAAGL,IAAQ,CAC5D,GAASF,CAAI;AAClC"}