@spark-ui/components 10.0.0

package/dist/scrolling-list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/scrolling-list/index.ts","../../src/scrolling-list/ScrollingList.tsx","../../src/scrolling-list/useScrollOverflow.ts","../../src/scrolling-list/ScrollingListControls.tsx","../../src/scrolling-list/ScrollingListItem.tsx","../../src/slot/Slot.tsx","../../src/scrolling-list/useFocusWithinScroll.tsx","../../src/scrolling-list/ScrollingListItems.tsx","../../src/scrolling-list/ScrollingListNextButton.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/button/Button.tsx","../../src/spinner/Spinner.styles.tsx","../../src/spinner/Spinner.tsx","../../src/button/Button.styles.tsx","../../src/button/variants/filled.ts","../../src/button/variants/ghost.ts","../../src/button/variants/outlined.ts","../../src/button/variants/tinted.ts","../../src/button/variants/contrast.ts","../../src/icon-button/IconButton.styles.tsx","../../src/icon-button/IconButton.tsx","../../src/scrolling-list/ScrollingListPrevButton.tsx","../../src/scrolling-list/ScrollingListSkipButton.tsx"],"sourcesContent":["import { ScrollingList as Root } from './ScrollingList'\nimport { ScrollingListControls as Controls } from './ScrollingListControls'\nimport { ScrollingListItem as Item } from './ScrollingListItem'\nimport { ScrollingListItems as Items } from './ScrollingListItems'\nimport { ScrollingListNextButton as NextButton } from './ScrollingListNextButton'\nimport { ScrollingListPrevButton as PrevButton } from './ScrollingListPrevButton'\nimport { ScrollingListSkipButton as SkipButton } from './ScrollingListSkipButton'\n\nexport const ScrollingList: typeof Root & {\n  Controls: typeof Controls\n  NextButton: typeof NextButton\n  PrevButton: typeof PrevButton\n  Item: typeof Item\n  Items: typeof Items\n  SkipButton: typeof SkipButton\n} = Object.assign(Root, {\n  Controls,\n  NextButton,\n  PrevButton,\n  Item,\n  Items,\n  SkipButton,\n})\n\nScrollingList.displayName = 'ScrollingList'\n","import { createContext, ReactNode, RefObject, useRef } from 'react'\nimport { SnapCarouselResult, useSnapCarousel } from 'react-snap-carousel'\n\nimport { ScrollOverflow, useScrollOverflow } from './useScrollOverflow'\n\ntype SnapType = 'mandatory' | 'proximity' | 'none'\ntype ScrollBehavior = 'smooth' | 'instant'\ntype SnapStop = 'normal' | 'always'\n\ninterface Props {\n  /**\n   * CSS scroll snap behavior.\n   * - `mandatory` to force snapping on each \"page\".\n   * - `proximity` to force snapping only when scroll position is near the edge of a \"page\". Behavior can change depending on each browser.\n   * - `none` to disabled scroll snapping.\n   */\n  snapType?: SnapType\n  /**\n   * Defines whether or not the scroll container is allowed to \"pass over\" possible snap positions.\n   */\n  snapStop?: SnapStop\n  scrollBehavior?: ScrollBehavior\n  /**\n   * Add a fade effect to indicate content overflow.\n   */\n  widthFade?: boolean\n  children?: ReactNode\n  /**\n   * When `true`, allow previous and next buttons to be used when reaching the edges of the list.\n   */\n  loop?: boolean\n  /**\n   * Space (in pixels) between items.\n   */\n  gap?: number\n  /**\n   * Offset (in pixels) of the left of the optimal viewing region of the list.\n   */\n  scrollPadding?: number\n}\n\ninterface ScrollingListContextState extends SnapCarouselResult {\n  snapType: SnapType\n  snapStop: SnapStop\n  scrollBehavior: ScrollBehavior\n  visibleItemsRange: readonly [number, number]\n  loop: boolean\n  gap: number\n  widthFade: boolean\n  scrollPadding: number\n  scrollAreaRef: RefObject<HTMLDivElement | null>\n  overflow: ScrollOverflow\n  skipKeyboardNavigation: () => void\n}\n\nexport const ScrollingListContext = createContext<ScrollingListContextState>(\n  null as unknown as ScrollingListContextState\n)\n\nexport const ScrollingList = ({\n  snapType = 'none',\n  snapStop = 'normal',\n  scrollBehavior = 'smooth',\n  loop = false,\n  gap = 16,\n  widthFade = false, // TODO: ask for default value + why it has been removed from specs\n  scrollPadding = 0,\n  children,\n}: Props) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const skipAnchorRef = useRef<HTMLButtonElement>(null)\n\n  const snapCarouselAPI = useSnapCarousel()\n\n  const overflow = useScrollOverflow(scrollAreaRef)\n\n  const { activePageIndex, pages } = snapCarouselAPI\n\n  const visibleItems = pages[activePageIndex] as number[]\n\n  const visibleItemsRange = visibleItems\n    ? ([visibleItems[0]! + 1, visibleItems[visibleItems.length - 1]! + 1] as const)\n    : ([0, 0] as const)\n\n  const skipKeyboardNavigation = () => {\n    skipAnchorRef.current?.focus()\n  }\n\n  const ctxValue: ScrollingListContextState = {\n    ...snapCarouselAPI,\n    snapType,\n    snapStop,\n    skipKeyboardNavigation,\n    scrollBehavior,\n    visibleItemsRange,\n    loop,\n    gap,\n    widthFade,\n    scrollPadding,\n    scrollAreaRef,\n    overflow,\n  }\n\n  return (\n    <ScrollingListContext.Provider value={ctxValue}>\n      <div className=\"gap-lg group/scrolling-list relative flex w-full flex-col\">{children}</div>\n      <span ref={skipAnchorRef} className=\"size-0 overflow-hidden\" tabIndex={-1} />\n    </ScrollingListContext.Provider>\n  )\n}\n\nScrollingList.displayName = 'ScrollingList'\n","import { useEffect, useState, RefObject } from 'react'\n\nexport interface ScrollOverflow {\n  left: number\n  right: number\n}\n\nexport function useScrollOverflow(scrollRef: RefObject<HTMLElement | null>): ScrollOverflow {\n  const [overflow, setOverflow] = useState<ScrollOverflow>({\n    left: 0,\n    right: 0,\n  })\n\n  useEffect(() => {\n    const checkScrollContent = () => {\n      const scrollElement = scrollRef.current\n\n      if (scrollElement) {\n        const { scrollLeft, scrollWidth, clientWidth } = scrollElement\n\n        setOverflow({\n          left: scrollLeft,\n          right: scrollWidth - (scrollLeft + clientWidth),\n        })\n      }\n    }\n\n    checkScrollContent()\n\n    const scrollElement = scrollRef.current\n    if (scrollElement) {\n      scrollElement.addEventListener('scroll', checkScrollContent)\n      window.addEventListener('resize', checkScrollContent)\n    }\n\n    return () => {\n      if (scrollElement) {\n        scrollElement.removeEventListener('scroll', checkScrollContent)\n        window.addEventListener('resize', checkScrollContent)\n      }\n    }\n  }, [scrollRef])\n\n  return overflow\n}\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactNode } from 'react'\n\ninterface ScrollingListControls extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * Visibility behavior of the control buttons:\n   * - `always`: buttons are always visible.\n   * - `hover`: buttons only appear on hover.\n   *\n   * a11y: `hover` is dangerous for accessibility as it disabled controls for touch screen users.\n   * When using it, you must provide an alternative control outside of the list to replace them.\n   */\n  visibility?: 'hover' | 'always'\n  children: ReactNode\n}\n\nexport const ScrollingListControls = ({\n  children,\n  visibility = 'always',\n  className,\n  ...rest\n}: ScrollingListControls) => {\n  return (\n    <div\n      className={cx(\n        'default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden',\n        className\n      )}\n      style={\n        {\n          '--scrolling-list-controls-opacity': visibility === 'hover' ? '0' : '1',\n        } as CSSProperties\n      }\n      data-orientation=\"horizontal\"\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nScrollingListControls.displayName = 'ScrollingList.Controls'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, ReactNode, useContext, useRef } from 'react'\n\nimport { Slot } from '../slot'\nimport { ScrollingListContext } from './ScrollingList'\nimport { useFocusWithinScroll } from './useFocusWithinScroll'\n\nexport interface ScrollingListItemProps extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  children?: ReactNode\n  /**\n   * DO NOT USE. This prop is automatically managed by the parent ScrollingList.ListItems\n   */\n  index?: number\n  className?: string\n}\n\nexport const ScrollingListItem = ({\n  asChild = false,\n  children,\n  index = 0,\n  className = '',\n  ...rest\n}: ScrollingListItemProps) => {\n  const ctx = useContext(ScrollingListContext)\n  const itemRef = useRef<HTMLDivElement>(null)\n\n  const isSnapPoint = ctx.snapPointIndexes.has(index)\n\n  useFocusWithinScroll(itemRef, ctx.scrollAreaRef)\n\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <Component\n      role=\"listitem\"\n      ref={itemRef}\n      className={cx(\n        'default:w-auto default:shrink-0',\n        {\n          'snap-start': isSnapPoint,\n          'snap-normal': isSnapPoint && ctx.snapStop === 'normal',\n          'snap-always': isSnapPoint && ctx.snapStop === 'always',\n        },\n        className\n      )}\n      {...rest}\n    >\n      {children}\n    </Component>\n  )\n}\n\nScrollingListItem.displayName = 'ScrollingList.Item'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n  cloneElement,\n  HTMLAttributes,\n  isValidElement,\n  PropsWithChildren,\n  ReactNode,\n  Ref,\n} from 'react'\n\nexport const Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n  return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n  asChild: boolean | undefined,\n  children: ReactNode,\n  callback: (children: ReactNode) => ReactNode\n) => {\n  if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n  return isValidElement(children)\n    ? cloneElement(\n        children,\n        undefined,\n        callback((children.props as { children: ReactNode }).children)\n      )\n    : null\n}\n","import { RefObject, useEffect, useState } from 'react'\n\nexport function useFocusWithinScroll<T extends HTMLElement | null>(\n  ref: RefObject<T>, // The container to detect focus within\n  scrollRef: RefObject<HTMLDivElement | null> // The scrollable container\n) {\n  const [isFocusWithin, setIsFocusWithin] = useState(false)\n\n  useEffect(() => {\n    const handleFocusIn = (event: FocusEvent) => {\n      setIsFocusWithin(true)\n\n      const focusedElement = event.target as HTMLElement\n      const scrollContainer = scrollRef.current\n\n      if (focusedElement && scrollContainer) {\n        const focusRect = focusedElement.getBoundingClientRect()\n        const scrollRect = scrollContainer.getBoundingClientRect()\n\n        // Check if the focused element is fully visible inside the scroll container\n        const isFullyVisible =\n          focusRect.left >= scrollRect.left &&\n          focusRect.right <= scrollRect.right &&\n          focusRect.top >= scrollRect.top &&\n          focusRect.bottom <= scrollRect.bottom\n\n        if (!isFullyVisible) {\n          focusedElement.scrollIntoView({ behavior: 'smooth', inline: 'center', block: 'nearest' })\n        }\n      }\n    }\n\n    const handleFocusOut = (event: FocusEvent) => {\n      if (ref.current && !ref.current.contains(event.relatedTarget as Node)) {\n        setIsFocusWithin(false)\n      }\n    }\n\n    const node = ref.current\n    if (node) {\n      node.addEventListener('focusin', handleFocusIn)\n      node.addEventListener('focusout', handleFocusOut)\n    }\n\n    return () => {\n      if (node) {\n        node.removeEventListener('focusin', handleFocusIn)\n        node.removeEventListener('focusout', handleFocusOut)\n      }\n    }\n  }, [ref, scrollRef])\n\n  return isFocusWithin\n}\n","import { cx } from 'class-variance-authority'\nimport {\n  Children,\n  cloneElement,\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  isValidElement,\n  KeyboardEvent,\n  ReactNode,\n  Ref,\n  RefObject,\n  useContext,\n} from 'react'\n\nimport { ScrollingListContext } from './ScrollingList'\nimport { ScrollingListItemProps } from './ScrollingListItem'\n\ninterface Props extends ComponentPropsWithoutRef<'div'> {\n  children?: ReactNode\n  className?: string\n}\n\nexport function mergeRefs<T>(...refs: (Ref<T> | undefined | null)[]): Ref<T> {\n  return (value: T | null) => {\n    refs.forEach(ref => {\n      if (typeof ref === 'function') {\n        ref(value)\n      } else if (ref && typeof ref === 'object' && 'current' in ref) {\n        ;(ref as RefObject<T | null>).current = value\n      }\n    })\n  }\n}\n\nexport const ScrollingListItems = ({ children, className = '', ...rest }: Props) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const snapConfig = {\n    mandatory: 'x mandatory',\n    proximity: 'x proximity',\n    none: 'none',\n  }\n\n  const handleLeftArrow = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!ctx.loop && !ctx.hasPrevPage) return\n\n    event.preventDefault()\n    ctx.goTo(ctx.hasPrevPage ? ctx.activePageIndex - 1 : ctx.pages.length - 1, {\n      behavior: ctx.scrollBehavior,\n    })\n  }\n\n  const handleRightArrow = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!ctx.loop && !ctx.hasNextPage) return\n\n    event.preventDefault()\n    ctx.goTo(ctx.hasNextPage ? ctx.activePageIndex + 1 : 0, { behavior: ctx.scrollBehavior })\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'ArrowLeft') {\n      handleLeftArrow(event)\n    }\n\n    if (event.key === 'ArrowRight') {\n      handleRightArrow(event)\n    }\n  }\n\n  interface CustomCSSProperties extends CSSProperties {\n    '--scrolling-list-gap'?: string\n    '--scrolling-list-px'?: string\n  }\n\n  const inlineStyles: CustomCSSProperties = {\n    scrollSnapType: snapConfig[ctx.snapType],\n    scrollPaddingInline: 'var(--scrolling-list-px)',\n    '--scrolling-list-px': `${ctx.scrollPadding}px`,\n    '--scrolling-list-gap': `${ctx.gap}px`,\n    ...(ctx.widthFade && {\n      maskImage:\n        'linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n      maskSize: `calc(100% + ${ctx.overflow.left ? '0px' : '44px'} + ${ctx.overflow.right ? '0px' : '44px'}) 100%`,\n      maskPosition: `${ctx.overflow.left ? '0px' : '-44px'} 0`,\n    }),\n  }\n\n  return (\n    <div\n      id=\"scrolling-list-items\"\n      role=\"list\"\n      className={cx(\n        'relative transition-all duration-300',\n        'u-no-scrollbar overflow-x-auto scroll-smooth default:overscroll-contain',\n        'w-full gap-(--scrolling-list-gap) default:flex default:flex-row',\n        'focus-visible:u-outline',\n        className\n      )}\n      ref={mergeRefs<HTMLDivElement>(ctx.scrollAreaRef, ctx.scrollRef)}\n      style={inlineStyles}\n      onKeyDown={handleKeyDown}\n      {...rest}\n    >\n      {Children.map(children, (child, index) =>\n        isValidElement<ScrollingListItemProps>(child) ? cloneElement(child, { index }) : child\n      )}\n    </div>\n  )\n}\n\nScrollingListItems.displayName = 'ScrollingList.Items'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { cx } from 'class-variance-authority'\nimport { useContext } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton, IconButtonProps } from '../icon-button'\nimport { ScrollingListContext } from './ScrollingList'\n\nexport const ScrollingListNextButton = ({ 'aria-label': ariaLabel, ...rest }: IconButtonProps) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const handleNextPage = () => {\n    if (ctx.hasNextPage) {\n      ctx.next({ behavior: ctx.scrollBehavior })\n    } else {\n      ctx.goTo(0, { behavior: ctx.scrollBehavior })\n    }\n  }\n\n  const listHasOverflow = ctx.overflow.left || ctx.overflow.right\n  const isDisabled = !listHasOverflow || (!ctx.loop && !ctx.overflow.right)\n\n  return (\n    <IconButton\n      size=\"sm\"\n      intent=\"surface\"\n      design=\"filled\"\n      className={cx(\n        'pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible',\n        'group-hover/scrolling-list:opacity-none focus-visible:opacity-none'\n      )}\n      onClick={handleNextPage}\n      disabled={isDisabled}\n      aria-label={ariaLabel}\n      aria-controls=\"scrolling-list-items\"\n      {...rest}\n    >\n      <Icon>\n        <ArrowVerticalRight />\n      </Icon>\n    </IconButton>\n  )\n}\n\nScrollingListNextButton.displayName = 'ScrollingList.NextButton'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n  /**\n   * The svg icon that will be wrapped\n   */\n  children: ReactNode\n  /**\n   * The accessible label for the icon. This label will be visually hidden but announced to screen\n   * reader users, similar to `alt` text for `img` tags.\n   */\n  label?: string\n}\n\nexport const Icon = ({\n  label,\n  className,\n  size = 'current',\n  intent = 'current',\n  children,\n  ...others\n}: IconProps) => {\n  const child = Children.only(children)\n\n  return (\n    <>\n      {cloneElement(child as ReactElement<Record<string, any>>, {\n        className: iconStyles({ className, size, intent }),\n        'data-spark-component': 'icon',\n        'aria-hidden': 'true',\n        focusable: 'false',\n        ...others,\n      })}\n\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n    </>\n  )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      {...props}\n      ref={ref}\n      style={{\n        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n        position: 'absolute',\n        border: 0,\n        width: 1,\n        height: 1,\n        padding: 0,\n        margin: -1,\n        overflow: 'hidden',\n        clip: 'rect(0, 0, 0, 0)',\n        whiteSpace: 'nowrap',\n        wordWrap: 'normal',\n        ...props.style,\n      }}\n    />\n  )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n  variants: {\n    /**\n     * Color scheme of the icon.\n     */\n    intent: makeVariants<\n      'intent',\n      [\n        'current',\n        'main',\n        'support',\n        'accent',\n        'basic',\n        'success',\n        'alert',\n        'error',\n        'info',\n        'neutral',\n      ]\n    >({\n      current: ['text-current'],\n      main: ['text-main'],\n      support: ['text-support'],\n      accent: ['text-accent'],\n      basic: ['text-basic'],\n      success: ['text-success'],\n      alert: ['text-alert'],\n      error: ['text-error'],\n      info: ['text-info'],\n      neutral: ['text-neutral'],\n    }),\n    /**\n     * Sets the size of the icon.\n     */\n    size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n      current: ['u-current-font-size'],\n      sm: ['w-sz-16', 'h-sz-16'],\n      md: ['w-sz-24', 'h-sz-24'],\n      lg: ['w-sz-32', 'h-sz-32'],\n      xl: ['w-sz-40', 'h-sz-40'],\n    }),\n  },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type DOMAttributes, Ref, useMemo } from 'react'\n\nimport { Slot, wrapPolymorphicSlot } from '../slot'\nimport { Spinner, type SpinnerProps } from '../spinner'\nimport { buttonStyles, type ButtonStylesProps } from './Button.styles'\n\nexport interface ButtonProps\n  extends Omit<ComponentPropsWithoutRef<'button'>, 'disabled'>,\n    ButtonStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Display a spinner to indicate to the user that the button is loading something after they interacted with it.\n   */\n  isLoading?: boolean\n  /**\n   * If your loading state should only display a spinner, it's better to specify a label for it (a11y).\n   */\n  loadingLabel?: string\n  /**\n   * If your loading state should also display a label, you can use this prop instead of `loadingLabel`.\n   * **Please note that using this can result in layout shifting when the Button goes from loading state to normal state.**\n   */\n  loadingText?: string\n  ref?: Ref<HTMLButtonElement>\n}\n\ntype DOMAttributesEventHandler = keyof Omit<\n  DOMAttributes<HTMLButtonElement>,\n  'children' | 'dangerouslySetInnerHTML'\n>\n\nconst blockedEventHandlers: DOMAttributesEventHandler[] = [\n  'onClick',\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onMouseOver',\n  'onMouseOut',\n  'onKeyDown',\n  'onKeyPress',\n  'onKeyUp',\n  'onSubmit',\n]\n\nexport const Button = ({\n  children,\n  design = 'filled',\n  disabled = false,\n  intent = 'main',\n  isLoading = false,\n  loadingLabel,\n  loadingText,\n  shape = 'rounded',\n  size = 'md',\n  asChild,\n  className,\n  ref,\n  ...others\n}: ButtonProps) => {\n  const Component = asChild ? Slot : 'button'\n\n  const shouldNotInteract = !!disabled || isLoading\n\n  const disabledEventHandlers = useMemo(() => {\n    const result: Partial<Record<DOMAttributesEventHandler, () => void>> = {}\n\n    if (shouldNotInteract) {\n      blockedEventHandlers.forEach(eventHandler => (result[eventHandler] = undefined))\n    }\n\n    return result\n  }, [shouldNotInteract])\n\n  const spinnerProps = {\n    size: 'current' as SpinnerProps['size'],\n    className: loadingText ? 'inline-block' : 'absolute',\n    ...(loadingLabel && { 'aria-label': loadingLabel }),\n  }\n\n  return (\n    <Component\n      data-spark-component=\"button\"\n      {...(Component === 'button' && { type: 'button' })}\n      ref={ref}\n      className={buttonStyles({\n        className,\n        design,\n        disabled: shouldNotInteract,\n        intent,\n        shape,\n        size,\n      })}\n      disabled={!!disabled}\n      aria-busy={isLoading}\n      aria-live={isLoading ? 'assertive' : 'off'}\n      {...others}\n      {...disabledEventHandlers}\n    >\n      {wrapPolymorphicSlot(asChild, children, slotted =>\n        isLoading ? (\n          <>\n            <Spinner {...spinnerProps} />\n            {loadingText && loadingText}\n\n            <div\n              aria-hidden\n              className={cx('gap-md', loadingText ? 'hidden' : 'inline-flex opacity-0')}\n            >\n              {slotted}\n            </div>\n          </>\n        ) : (\n          slotted\n        )\n      )}\n    </Component>\n  )\n}\n\nButton.displayName = 'Button'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nconst defaultVariants = {\n  intent: 'current',\n  size: 'current',\n  isBackgroundVisible: false,\n} as const\n\nexport const spinnerStyles = cva(\n  ['inline-block', 'border-solid', 'rounded-full', 'border-md', 'animate-spin'],\n  {\n    variants: {\n      /**\n       * Use `size` prop to set the size of the spinner. If you want to set the full size for the spinner, don't forget to add a wrapping container with its own size.\n       */\n      size: {\n        current: ['u-current-font-size'],\n        sm: ['w-sz-20', 'h-sz-20'],\n        md: ['w-sz-28', 'h-sz-28'],\n        full: ['w-full', 'h-full'],\n      },\n      /**\n       * Color scheme of the spinner.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'current',\n          'main',\n          'support',\n          'accent',\n          'basic',\n          'success',\n          'alert',\n          'error',\n          'info',\n          'neutral',\n        ]\n      >({\n        current: ['border-current'],\n        main: ['border-main'],\n        support: ['border-support'],\n        accent: ['border-accent'],\n        basic: ['border-basic'],\n        success: ['border-success'],\n        alert: ['border-alert'],\n        error: ['border-error'],\n        info: ['border-info'],\n        neutral: ['border-neutral'],\n      }),\n      /**\n       * Size of the button.\n       */\n      isBackgroundVisible: {\n        true: ['border-b-neutral-container', 'border-l-neutral-container'],\n        false: ['border-b-transparent', 'border-l-transparent'],\n      },\n    },\n    defaultVariants,\n  }\n)\n\nexport type SpinnerStylesProps = VariantProps<typeof spinnerStyles>\n","import { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { spinnerStyles, SpinnerStylesProps } from './Spinner.styles'\n\nexport interface SpinnerProps extends ComponentPropsWithRef<'div'>, SpinnerStylesProps {\n  /**\n   * Use `label` prop for accessibility, it is important to add a fallback loading text. This text will be visible to screen readers.\n   */\n  label?: string\n}\n\nexport const Spinner = ({\n  className,\n  size = 'current',\n  intent = 'current',\n  label,\n  isBackgroundVisible,\n  ref,\n  ...others\n}: PropsWithChildren<SpinnerProps>) => {\n  return (\n    <span\n      role=\"status\"\n      data-spark-component=\"spinner\"\n      ref={ref}\n      className={spinnerStyles({ className, size, intent, isBackgroundVisible })}\n      {...others}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n    </span>\n  )\n}\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport {\n  contrastVariants,\n  filledVariants,\n  ghostVariants,\n  outlinedVariants,\n  tintedVariants,\n} from './variants'\n\nexport const buttonStyles = cva(\n  [\n    'u-shadow-border-transition',\n    'box-border inline-flex items-center justify-center gap-md whitespace-nowrap',\n    'px-lg',\n    'text-body-1 font-bold',\n    'focus-visible:u-outline',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the button.\n       *\n       * - `filled`: Button will be plain.\n       *\n       * - `outlined`: Button will be transparent with an outline.\n       *\n       * - `tinted`: Button will be filled but using a lighter color scheme.\n       *\n       * - `ghost`: Button will look like a link. No borders, plain text.\n       *\n       * - `contrast`: Button will be surface filled. No borders, plain text.\n       *\n       */\n      design: makeVariants<'design', ['filled', 'outlined', 'tinted', 'ghost', 'contrast']>({\n        filled: [],\n        outlined: ['bg-transparent', 'border-sm', 'border-current'],\n        tinted: [],\n        ghost: [],\n        contrast: ['bg-surface'],\n      }),\n      /**\n       * Color scheme of the button.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'basic',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        basic: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n      /**\n       * Size of the button.\n       */\n      size: makeVariants<'size', ['sm', 'md', 'lg']>({\n        sm: ['min-w-sz-32', 'h-sz-32'],\n        md: ['min-w-sz-44', 'h-sz-44'],\n        lg: ['min-w-sz-56', 'h-sz-56'],\n      }),\n      /**\n       * Shape of the button.\n       */\n      shape: makeVariants<'shape', ['rounded', 'square', 'pill']>({\n        rounded: ['rounded-lg'],\n        square: ['rounded-0'],\n        pill: ['rounded-full'],\n      }),\n      /**\n       * Disable the button, preventing user interaction and adding opacity.\n       */\n      disabled: {\n        true: ['cursor-not-allowed', 'opacity-dim-3'],\n        false: ['cursor-pointer'],\n      },\n    },\n    compoundVariants: [\n      ...filledVariants,\n      ...outlinedVariants,\n      ...tintedVariants,\n      ...ghostVariants,\n      ...contrastVariants,\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'main',\n      size: 'md',\n      shape: 'rounded',\n    },\n  }\n)\n\nexport type ButtonStylesProps = VariantProps<typeof buttonStyles>\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n  // Main\n  {\n    intent: 'main',\n    design: 'filled',\n    class: tw([\n      'bg-main',\n      'text-on-main',\n      'hover:bg-main-hovered',\n      'enabled:active:bg-main-hovered',\n      'focus-visible:bg-main-hovered',\n    ]),\n  },\n  // Support\n  {\n    intent: 'support',\n    design: 'filled',\n    class: tw([\n      'bg-support',\n      'text-on-support',\n      'hover:bg-support-hovered',\n      'enabled:active:bg-support-hovered',\n      'focus-visible:bg-support-hovered',\n    ]),\n  },\n  // Accent\n  {\n    intent: 'accent',\n    design: 'filled',\n    class: tw([\n      'bg-accent',\n      'text-on-accent',\n      'hover:bg-accent-hovered',\n      'enabled:active:bg-accent-hovered',\n      'focus-visible:bg-accent-hovered',\n    ]),\n  },\n  // Basic\n  {\n    intent: 'basic',\n    design: 'filled',\n    class: tw([\n      'bg-basic',\n      'text-on-basic',\n      'hover:bg-basic-hovered',\n      'enabled:active:bg-basic-hovered',\n      'focus-visible:bg-basic-hovered',\n    ]),\n  },\n  // Success\n  {\n    intent: 'success',\n    design: 'filled',\n    class: tw([\n      'bg-success',\n      'text-on-success',\n      'hover:bg-success-hovered',\n      'enabled:active:bg-success-hovered',\n      'focus-visible:bg-success-hovered',\n    ]),\n  },\n  // Alert\n  {\n    intent: 'alert',\n    design: 'filled',\n    class: tw([\n      'bg-alert',\n      'text-on-alert',\n      'hover:bg-alert-hovered',\n      'enabled:active:bg-alert-hovered',\n      'focus-visible:bg-alert-hovered',\n    ]),\n  },\n  // Danger\n  {\n    intent: 'danger',\n    design: 'filled',\n    class: tw([\n      'text-on-error bg-error',\n      'hover:bg-error-hovered enabled:active:bg-error-hovered',\n      'focus-visible:bg-error-hovered',\n    ]),\n  },\n  // Info\n  {\n    intent: 'info',\n    design: 'filled',\n    class: tw([\n      'text-on-error bg-info',\n      'hover:bg-info-hovered enabled:active:bg-info-hovered',\n      'focus-visible:bg-info-hovered',\n    ]),\n  },\n  // Neutral\n  {\n    intent: 'neutral',\n    design: 'filled',\n    class: tw([\n      'bg-neutral',\n      'text-on-neutral',\n      'hover:bg-neutral-hovered',\n      'enabled:active:bg-neutral-hovered',\n      'focus-visible:bg-neutral-hovered',\n    ]),\n  },\n  // Surface\n  {\n    intent: 'surface',\n    design: 'filled',\n    class: tw([\n      'bg-surface',\n      'text-on-surface',\n      'hover:bg-surface-hovered',\n      'enabled:active:bg-surface-hovered',\n      'focus-visible:bg-surface-hovered',\n    ]),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const ghostVariants = [\n  {\n    intent: 'main',\n    design: 'ghost',\n    class: tw([\n      'text-main',\n      'hover:bg-main/dim-5',\n      'enabled:active:bg-main/dim-5',\n      'focus-visible:bg-main/dim-5',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'ghost',\n    class: tw([\n      'text-support',\n      'hover:bg-support/dim-5',\n      'enabled:active:bg-support/dim-5',\n      'focus-visible:bg-support/dim-5',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'ghost',\n    class: tw([\n      'text-accent',\n      'hover:bg-accent/dim-5',\n      'enabled:active:bg-accent/dim-5',\n      'focus-visible:bg-accent/dim-5',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'ghost',\n    class: tw([\n      'text-basic',\n      'hover:bg-basic/dim-5',\n      'enabled:active:bg-basic/dim-5',\n      'focus-visible:bg-basic/dim-5',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'ghost',\n    class: tw([\n      'text-success',\n      'hover:bg-success/dim-5',\n      'enabled:active:bg-success/dim-5',\n      'focus-visible:bg-success/dim-5',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'ghost',\n    class: tw([\n      'text-alert',\n      'hover:bg-alert/dim-5',\n      'enabled:active:bg-alert/dim-5',\n      'focus-visible:bg-alert/dim-5',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'ghost',\n    class: tw([\n      'text-error',\n      'hover:bg-error/dim-5',\n      'enabled:active:bg-error/dim-5',\n      'focus-visible:bg-error/dim-5',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'ghost',\n    class: tw([\n      'text-info',\n      'hover:bg-info/dim-5',\n      'enabled:active:bg-info/dim-5',\n      'focus-visible:bg-info/dim-5',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'ghost',\n    class: tw([\n      'text-neutral',\n      'hover:bg-neutral/dim-5',\n      'enabled:active:bg-neutral/dim-5',\n      'focus-visible:bg-neutral/dim-5',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'ghost',\n    class: tw([\n      'text-surface',\n      'hover:bg-surface/dim-5',\n      'enabled:active:bg-surface/dim-5',\n      'focus-visible:bg-surface/dim-5',\n    ]),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  {\n    intent: 'main',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-main/dim-5',\n      'enabled:active:bg-main/dim-5',\n      'focus-visible:bg-main/dim-5',\n      'text-main',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-support/dim-5',\n      'enabled:active:bg-support/dim-5',\n      'focus-visible:bg-support/dim-5',\n      'text-support',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-accent/dim-5',\n      'enabled:active:bg-accent/dim-5',\n      'focus-visible:bg-accent/dim-5',\n      'text-accent',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-basic/dim-5',\n      'enabled:active:bg-basic/dim-5',\n      'focus-visible:bg-basic/dim-5',\n      'text-basic',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-success/dim-5',\n      'enabled:active:bg-success/dim-5',\n      'focus-visible:bg-success/dim-5',\n      'text-success',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-alert/dim-5',\n      'enabled:active:bg-alert/dim-5',\n      'focus-visible:bg-alert/dim-5',\n      'text-alert',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-error/dim-5',\n      'enabled:active:bg-error/dim-5',\n      'focus-visible:bg-error/dim-5',\n      'text-error',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-info/dim-5',\n      'enabled:active:bg-info/dim-5',\n      'focus-visible:bg-info/dim-5',\n      'text-info',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-neutral/dim-5',\n      'enabled:active:bg-neutral/dim-5',\n      'focus-visible:bg-neutral/dim-5',\n      'text-neutral',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'outlined',\n    class: tw([\n      'hover:bg-surface/dim-5',\n      'enabled:active:bg-surface/dim-5',\n      'focus-visible:bg-surface/dim-5',\n      'text-surface',\n    ]),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw([\n      'bg-main-container',\n      'text-on-main-container',\n      'hover:bg-main-container-hovered',\n      'enabled:active:bg-main-container-hovered',\n      'focus-visible:bg-main-container-hovered',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw([\n      'bg-support-container',\n      'text-on-support-container',\n      'hover:bg-support-container-hovered',\n      'enabled:active:bg-support-container-hovered',\n      'focus-visible:bg-support-container-hovered',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw([\n      'bg-accent-container',\n      'text-on-accent-container',\n      'hover:bg-accent-container-hovered',\n      'enabled:active:bg-accent-container-hovered',\n      'focus-visible:bg-accent-container-hovered',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'tinted',\n    class: tw([\n      'bg-basic-container',\n      'text-on-basic-container',\n      'hover:bg-basic-container-hovered',\n      'enabled:active:bg-basic-container-hovered',\n      'focus-visible:bg-basic-container-hovered',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw([\n      'bg-success-container',\n      'text-on-success-container',\n      'hover:bg-success-container-hovered',\n      'enabled:active:bg-success-container-hovered',\n      'focus-visible:bg-success-container-hovered',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw([\n      'bg-alert-container',\n      'text-on-alert-container',\n      'hover:bg-alert-container-hovered',\n      'enabled:active:bg-alert-container-hovered',\n      'focus-visible:bg-alert-container-hovered',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw([\n      'bg-error-container',\n      'text-on-error-container',\n      'hover:bg-error-container-hovered',\n      'enabled:active:bg-error-container-hovered',\n      'focus-visible:bg-error-container-hovered',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw([\n      'bg-info-container',\n      'text-on-info-container',\n      'hover:bg-info-container-hovered',\n      'enabled:active:bg-info-container-hovered',\n      'focus-visible:bg-info-container-hovered',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw([\n      'bg-neutral-container',\n      'text-on-neutral-container',\n      'hover:bg-neutral-container-hovered',\n      'enabled:active:bg-neutral-container-hovered',\n      'focus-visible:bg-neutral-container-hovered',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'tinted',\n    class: tw([\n      'bg-surface',\n      'text-on-surface',\n      'hover:bg-surface-hovered',\n      'enabled:active:bg-surface-hovered',\n      'focus-visible:bg-surface-hovered',\n    ]),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const contrastVariants = [\n  {\n    intent: 'main',\n    design: 'contrast',\n    class: tw([\n      'text-main',\n      'hover:bg-main-container-hovered',\n      'enabled:active:bg-main-container-hovered',\n      'focus-visible:bg-main-container-hovered',\n    ]),\n  },\n  {\n    intent: 'support',\n    design: 'contrast',\n    class: tw([\n      'text-support',\n      'hover:bg-support-container-hovered',\n      'enabled:active:bg-support-container-hovered',\n      'focus-visible:bg-support-container-hovered',\n    ]),\n  },\n  {\n    intent: 'accent',\n    design: 'contrast',\n    class: tw([\n      'text-accent',\n      'hover:bg-accent-container-hovered',\n      'enabled:active:bg-accent-container-hovered',\n      'focus-visible:bg-accent-container-hovered',\n    ]),\n  },\n  {\n    intent: 'basic',\n    design: 'contrast',\n    class: tw([\n      'text-basic',\n      'hover:bg-basic-container-hovered',\n      'enabled:active:bg-basic-container-hovered',\n      'focus-visible:bg-basic-container-hovered',\n    ]),\n  },\n  {\n    intent: 'success',\n    design: 'contrast',\n    class: tw([\n      'text-success',\n      'hover:bg-success-container-hovered',\n      'enabled:active:bg-success-container-hovered',\n      'focus-visible:bg-success-container-hovered',\n    ]),\n  },\n  {\n    intent: 'alert',\n    design: 'contrast',\n    class: tw([\n      'text-alert',\n      'hover:bg-alert-container-hovered',\n      'enabled:active:bg-alert-container-hovered',\n      'focus-visible:bg-alert-container-hovered',\n    ]),\n  },\n  {\n    intent: 'danger',\n    design: 'contrast',\n    class: tw([\n      'text-error',\n      'hover:bg-error-container-hovered',\n      'enabled:active:bg-error-container-hovered',\n      'focus-visible:bg-error-container-hovered',\n    ]),\n  },\n  {\n    intent: 'info',\n    design: 'contrast',\n    class: tw([\n      'text-info',\n      'hover:bg-info-container-hovered',\n      'enabled:active:bg-info-container-hovered',\n      'focus-visible:bg-info-container-hovered',\n    ]),\n  },\n  {\n    intent: 'neutral',\n    design: 'contrast',\n    class: tw([\n      'text-neutral',\n      'hover:bg-neutral-container-hovered',\n      'enabled:active:bg-neutral-container-hovered',\n      'focus-visible:bg-neutral-container-hovered',\n    ]),\n  },\n  {\n    intent: 'surface',\n    design: 'contrast',\n    class: tw([\n      'text-on-surface',\n      'hover:bg-surface-hovered',\n      'enabled:active:bg-surface-hovered',\n      'focus-visible:bg-surface-hovered',\n    ]),\n  },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\n// override the Button component's px-lg padding by using a more specific class selector (pl-0 pr-0)\nexport const iconButtonStyles = cva(['pl-0 pr-0'], {\n  variants: {\n    /**\n     * Sets the size of the icon.\n     */\n    size: makeVariants<'size', ['sm', 'md', 'lg']>({\n      sm: ['text-body-1'],\n      md: ['text-body-1'],\n      lg: ['text-display-3'],\n    }),\n  },\n})\n\nexport type IconButtonStylesProps = VariantProps<typeof iconButtonStyles>\n","import { Ref } from 'react'\n\nimport { Button, ButtonProps } from '../button'\nimport { iconButtonStyles } from './IconButton.styles'\n\nexport interface IconButtonProps extends Omit<ButtonProps, 'loadingText'> {\n  'aria-label': string\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const IconButton = ({\n  design = 'filled',\n  disabled = false,\n  intent = 'main',\n  shape = 'rounded',\n  size = 'md',\n  className,\n  ref,\n  ...others\n}: IconButtonProps) => {\n  return (\n    <Button\n      ref={ref}\n      className={iconButtonStyles({ size, className })}\n      design={design}\n      disabled={disabled}\n      intent={intent}\n      shape={shape}\n      size={size}\n      {...others}\n    />\n  )\n}\n\nIconButton.displayName = 'IconButton'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { cx } from 'class-variance-authority'\nimport { useContext } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton, IconButtonProps } from '../icon-button'\nimport { ScrollingListContext } from './ScrollingList'\n\nexport const ScrollingListPrevButton = ({\n  'aria-label': ariaLabel,\n\n  ...rest\n}: IconButtonProps) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const handlePrevPage = () => {\n    const shouldSnapFirstPage =\n      ctx.activePageIndex === 0 && (ctx.scrollAreaRef.current?.scrollLeft || 0) > 0\n\n    if (shouldSnapFirstPage) {\n      ctx.goTo(0, { behavior: ctx.scrollBehavior })\n    } else if (ctx.hasPrevPage) {\n      ctx.prev({ behavior: ctx.scrollBehavior })\n    } else {\n      ctx.goTo(ctx.pages.length - 1, { behavior: ctx.scrollBehavior })\n    }\n  }\n\n  const listHasOverflow = ctx.overflow.left || ctx.overflow.right\n  const isDisabled = !listHasOverflow || (!ctx.loop && !ctx.overflow.left)\n\n  return (\n    <IconButton\n      size=\"sm\"\n      intent=\"surface\"\n      design=\"filled\"\n      className={cx(\n        'pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible',\n        'group-hover/scrolling-list:opacity-none focus-visible:opacity-none'\n      )}\n      onClick={handlePrevPage}\n      disabled={isDisabled}\n      aria-label={ariaLabel}\n      aria-controls=\"scrolling-list-items\"\n      {...rest}\n    >\n      <Icon>\n        <ArrowVerticalLeft />\n      </Icon>\n    </IconButton>\n  )\n}\n\nScrollingListPrevButton.displayName = 'ScrollingList.PrevButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, useContext } from 'react'\n\nimport { Button } from '../button'\nimport { ScrollingListContext } from './ScrollingList'\n\ninterface Props extends ComponentPropsWithoutRef<'button'> {\n  children: string\n}\n\nexport const ScrollingListSkipButton = ({ children, ...rest }: Props) => {\n  const ctx = useContext(ScrollingListContext)\n\n  return (\n    <Button\n      type=\"button\"\n      design=\"tinted\"\n      intent=\"surface\"\n      tabIndex={0}\n      className={cx(\n        'z-raised absolute top-1/2 left-0 -translate-y-1/2',\n        'not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0'\n      )}\n      onClick={ctx.skipKeyboardNavigation}\n      {...rest}\n    >\n      {children}\n    </Button>\n  )\n}\n\nScrollingListSkipButton.displayName = 'ScrollingList.SkipButton'\n"],"mappings":"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","names":["ScrollingList","import_react","scrollElement","import_jsx_runtime","import_class_variance_authority","import_react","import_react","import_jsx_runtime","RadixSlot","import_react","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_react","import_react","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_react","import_internal_utils","import_class_variance_authority","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_internal_utils","import_internal_utils","import_internal_utils","import_internal_utils","import_internal_utils","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","ScrollingList"]}

package/dist/scrolling-list/index.mjs

@@ -0,0 +1,407 @@
+import {
+  IconButton
+} from "../chunk-2KPFQEAA.mjs";
+import {
+  Button
+} from "../chunk-6JOA37TZ.mjs";
+import "../chunk-MUNDKRAE.mjs";
+import {
+  Icon
+} from "../chunk-AESXFMCC.mjs";
+import "../chunk-NBZKMCHF.mjs";
+import {
+  Slot
+} from "../chunk-4F5DOL57.mjs";
+
+// src/scrolling-list/ScrollingList.tsx
+import { createContext, useRef } from "react";
+import { useSnapCarousel } from "react-snap-carousel";
+
+// src/scrolling-list/useScrollOverflow.ts
+import { useEffect, useState } from "react";
+function useScrollOverflow(scrollRef) {
+  const [overflow, setOverflow] = useState({
+    left: 0,
+    right: 0
+  });
+  useEffect(() => {
+    const checkScrollContent = () => {
+      const scrollElement2 = scrollRef.current;
+      if (scrollElement2) {
+        const { scrollLeft, scrollWidth, clientWidth } = scrollElement2;
+        setOverflow({
+          left: scrollLeft,
+          right: scrollWidth - (scrollLeft + clientWidth)
+        });
+      }
+    };
+    checkScrollContent();
+    const scrollElement = scrollRef.current;
+    if (scrollElement) {
+      scrollElement.addEventListener("scroll", checkScrollContent);
+      window.addEventListener("resize", checkScrollContent);
+    }
+    return () => {
+      if (scrollElement) {
+        scrollElement.removeEventListener("scroll", checkScrollContent);
+        window.addEventListener("resize", checkScrollContent);
+      }
+    };
+  }, [scrollRef]);
+  return overflow;
+}
+
+// src/scrolling-list/ScrollingList.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var ScrollingListContext = createContext(
+  null
+);
+var ScrollingList = ({
+  snapType = "none",
+  snapStop = "normal",
+  scrollBehavior = "smooth",
+  loop = false,
+  gap = 16,
+  widthFade = false,
+  // TODO: ask for default value + why it has been removed from specs
+  scrollPadding = 0,
+  children
+}) => {
+  const scrollAreaRef = useRef(null);
+  const skipAnchorRef = useRef(null);
+  const snapCarouselAPI = useSnapCarousel();
+  const overflow = useScrollOverflow(scrollAreaRef);
+  const { activePageIndex, pages } = snapCarouselAPI;
+  const visibleItems = pages[activePageIndex];
+  const visibleItemsRange = visibleItems ? [visibleItems[0] + 1, visibleItems[visibleItems.length - 1] + 1] : [0, 0];
+  const skipKeyboardNavigation = () => {
+    skipAnchorRef.current?.focus();
+  };
+  const ctxValue = {
+    ...snapCarouselAPI,
+    snapType,
+    snapStop,
+    skipKeyboardNavigation,
+    scrollBehavior,
+    visibleItemsRange,
+    loop,
+    gap,
+    widthFade,
+    scrollPadding,
+    scrollAreaRef,
+    overflow
+  };
+  return /* @__PURE__ */ jsxs(ScrollingListContext.Provider, { value: ctxValue, children: [
+    /* @__PURE__ */ jsx("div", { className: "gap-lg group/scrolling-list relative flex w-full flex-col", children }),
+    /* @__PURE__ */ jsx("span", { ref: skipAnchorRef, className: "size-0 overflow-hidden", tabIndex: -1 })
+  ] });
+};
+ScrollingList.displayName = "ScrollingList";
+
+// src/scrolling-list/ScrollingListControls.tsx
+import { cx } from "class-variance-authority";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var ScrollingListControls = ({
+  children,
+  visibility = "always",
+  className,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      className: cx(
+        "default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden",
+        className
+      ),
+      style: {
+        "--scrolling-list-controls-opacity": visibility === "hover" ? "0" : "1"
+      },
+      "data-orientation": "horizontal",
+      ...rest,
+      children
+    }
+  );
+};
+ScrollingListControls.displayName = "ScrollingList.Controls";
+
+// src/scrolling-list/ScrollingListItem.tsx
+import { cx as cx2 } from "class-variance-authority";
+import { useContext, useRef as useRef2 } from "react";
+
+// src/scrolling-list/useFocusWithinScroll.tsx
+import { useEffect as useEffect2, useState as useState2 } from "react";
+function useFocusWithinScroll(ref, scrollRef) {
+  const [isFocusWithin, setIsFocusWithin] = useState2(false);
+  useEffect2(() => {
+    const handleFocusIn = (event) => {
+      setIsFocusWithin(true);
+      const focusedElement = event.target;
+      const scrollContainer = scrollRef.current;
+      if (focusedElement && scrollContainer) {
+        const focusRect = focusedElement.getBoundingClientRect();
+        const scrollRect = scrollContainer.getBoundingClientRect();
+        const isFullyVisible = focusRect.left >= scrollRect.left && focusRect.right <= scrollRect.right && focusRect.top >= scrollRect.top && focusRect.bottom <= scrollRect.bottom;
+        if (!isFullyVisible) {
+          focusedElement.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" });
+        }
+      }
+    };
+    const handleFocusOut = (event) => {
+      if (ref.current && !ref.current.contains(event.relatedTarget)) {
+        setIsFocusWithin(false);
+      }
+    };
+    const node = ref.current;
+    if (node) {
+      node.addEventListener("focusin", handleFocusIn);
+      node.addEventListener("focusout", handleFocusOut);
+    }
+    return () => {
+      if (node) {
+        node.removeEventListener("focusin", handleFocusIn);
+        node.removeEventListener("focusout", handleFocusOut);
+      }
+    };
+  }, [ref, scrollRef]);
+  return isFocusWithin;
+}
+
+// src/scrolling-list/ScrollingListItem.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var ScrollingListItem = ({
+  asChild = false,
+  children,
+  index = 0,
+  className = "",
+  ...rest
+}) => {
+  const ctx = useContext(ScrollingListContext);
+  const itemRef = useRef2(null);
+  const isSnapPoint = ctx.snapPointIndexes.has(index);
+  useFocusWithinScroll(itemRef, ctx.scrollAreaRef);
+  const Component = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(
+    Component,
+    {
+      role: "listitem",
+      ref: itemRef,
+      className: cx2(
+        "default:w-auto default:shrink-0",
+        {
+          "snap-start": isSnapPoint,
+          "snap-normal": isSnapPoint && ctx.snapStop === "normal",
+          "snap-always": isSnapPoint && ctx.snapStop === "always"
+        },
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+ScrollingListItem.displayName = "ScrollingList.Item";
+
+// src/scrolling-list/ScrollingListItems.tsx
+import { cx as cx3 } from "class-variance-authority";
+import {
+  Children,
+  cloneElement,
+  isValidElement,
+  useContext as useContext2
+} from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+function mergeRefs(...refs) {
+  return (value) => {
+    refs.forEach((ref) => {
+      if (typeof ref === "function") {
+        ref(value);
+      } else if (ref && typeof ref === "object" && "current" in ref) {
+        ;
+        ref.current = value;
+      }
+    });
+  };
+}
+var ScrollingListItems = ({ children, className = "", ...rest }) => {
+  const ctx = useContext2(ScrollingListContext);
+  const snapConfig = {
+    mandatory: "x mandatory",
+    proximity: "x proximity",
+    none: "none"
+  };
+  const handleLeftArrow = (event) => {
+    if (!ctx.loop && !ctx.hasPrevPage) return;
+    event.preventDefault();
+    ctx.goTo(ctx.hasPrevPage ? ctx.activePageIndex - 1 : ctx.pages.length - 1, {
+      behavior: ctx.scrollBehavior
+    });
+  };
+  const handleRightArrow = (event) => {
+    if (!ctx.loop && !ctx.hasNextPage) return;
+    event.preventDefault();
+    ctx.goTo(ctx.hasNextPage ? ctx.activePageIndex + 1 : 0, { behavior: ctx.scrollBehavior });
+  };
+  const handleKeyDown = (event) => {
+    if (event.key === "ArrowLeft") {
+      handleLeftArrow(event);
+    }
+    if (event.key === "ArrowRight") {
+      handleRightArrow(event);
+    }
+  };
+  const inlineStyles = {
+    scrollSnapType: snapConfig[ctx.snapType],
+    scrollPaddingInline: "var(--scrolling-list-px)",
+    "--scrolling-list-px": `${ctx.scrollPadding}px`,
+    "--scrolling-list-gap": `${ctx.gap}px`,
+    ...ctx.widthFade && {
+      maskImage: "linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",
+      maskSize: `calc(100% + ${ctx.overflow.left ? "0px" : "44px"} + ${ctx.overflow.right ? "0px" : "44px"}) 100%`,
+      maskPosition: `${ctx.overflow.left ? "0px" : "-44px"} 0`
+    }
+  };
+  return /* @__PURE__ */ jsx4(
+    "div",
+    {
+      id: "scrolling-list-items",
+      role: "list",
+      className: cx3(
+        "relative transition-all duration-300",
+        "u-no-scrollbar overflow-x-auto scroll-smooth default:overscroll-contain",
+        "w-full gap-(--scrolling-list-gap) default:flex default:flex-row",
+        "focus-visible:u-outline",
+        className
+      ),
+      ref: mergeRefs(ctx.scrollAreaRef, ctx.scrollRef),
+      style: inlineStyles,
+      onKeyDown: handleKeyDown,
+      ...rest,
+      children: Children.map(
+        children,
+        (child, index) => isValidElement(child) ? cloneElement(child, { index }) : child
+      )
+    }
+  );
+};
+ScrollingListItems.displayName = "ScrollingList.Items";
+
+// src/scrolling-list/ScrollingListNextButton.tsx
+import { ArrowVerticalRight } from "@spark-ui/icons/ArrowVerticalRight";
+import { cx as cx4 } from "class-variance-authority";
+import { useContext as useContext3 } from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var ScrollingListNextButton = ({ "aria-label": ariaLabel, ...rest }) => {
+  const ctx = useContext3(ScrollingListContext);
+  const handleNextPage = () => {
+    if (ctx.hasNextPage) {
+      ctx.next({ behavior: ctx.scrollBehavior });
+    } else {
+      ctx.goTo(0, { behavior: ctx.scrollBehavior });
+    }
+  };
+  const listHasOverflow = ctx.overflow.left || ctx.overflow.right;
+  const isDisabled = !listHasOverflow || !ctx.loop && !ctx.overflow.right;
+  return /* @__PURE__ */ jsx5(
+    IconButton,
+    {
+      size: "sm",
+      intent: "surface",
+      design: "filled",
+      className: cx4(
+        "pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible",
+        "group-hover/scrolling-list:opacity-none focus-visible:opacity-none"
+      ),
+      onClick: handleNextPage,
+      disabled: isDisabled,
+      "aria-label": ariaLabel,
+      "aria-controls": "scrolling-list-items",
+      ...rest,
+      children: /* @__PURE__ */ jsx5(Icon, { children: /* @__PURE__ */ jsx5(ArrowVerticalRight, {}) })
+    }
+  );
+};
+ScrollingListNextButton.displayName = "ScrollingList.NextButton";
+
+// src/scrolling-list/ScrollingListPrevButton.tsx
+import { ArrowVerticalLeft } from "@spark-ui/icons/ArrowVerticalLeft";
+import { cx as cx5 } from "class-variance-authority";
+import { useContext as useContext4 } from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var ScrollingListPrevButton = ({
+  "aria-label": ariaLabel,
+  ...rest
+}) => {
+  const ctx = useContext4(ScrollingListContext);
+  const handlePrevPage = () => {
+    const shouldSnapFirstPage = ctx.activePageIndex === 0 && (ctx.scrollAreaRef.current?.scrollLeft || 0) > 0;
+    if (shouldSnapFirstPage) {
+      ctx.goTo(0, { behavior: ctx.scrollBehavior });
+    } else if (ctx.hasPrevPage) {
+      ctx.prev({ behavior: ctx.scrollBehavior });
+    } else {
+      ctx.goTo(ctx.pages.length - 1, { behavior: ctx.scrollBehavior });
+    }
+  };
+  const listHasOverflow = ctx.overflow.left || ctx.overflow.right;
+  const isDisabled = !listHasOverflow || !ctx.loop && !ctx.overflow.left;
+  return /* @__PURE__ */ jsx6(
+    IconButton,
+    {
+      size: "sm",
+      intent: "surface",
+      design: "filled",
+      className: cx5(
+        "pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible",
+        "group-hover/scrolling-list:opacity-none focus-visible:opacity-none"
+      ),
+      onClick: handlePrevPage,
+      disabled: isDisabled,
+      "aria-label": ariaLabel,
+      "aria-controls": "scrolling-list-items",
+      ...rest,
+      children: /* @__PURE__ */ jsx6(Icon, { children: /* @__PURE__ */ jsx6(ArrowVerticalLeft, {}) })
+    }
+  );
+};
+ScrollingListPrevButton.displayName = "ScrollingList.PrevButton";
+
+// src/scrolling-list/ScrollingListSkipButton.tsx
+import { cx as cx6 } from "class-variance-authority";
+import { useContext as useContext5 } from "react";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var ScrollingListSkipButton = ({ children, ...rest }) => {
+  const ctx = useContext5(ScrollingListContext);
+  return /* @__PURE__ */ jsx7(
+    Button,
+    {
+      type: "button",
+      design: "tinted",
+      intent: "surface",
+      tabIndex: 0,
+      className: cx6(
+        "z-raised absolute top-1/2 left-0 -translate-y-1/2",
+        "not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0"
+      ),
+      onClick: ctx.skipKeyboardNavigation,
+      ...rest,
+      children
+    }
+  );
+};
+ScrollingListSkipButton.displayName = "ScrollingList.SkipButton";
+
+// src/scrolling-list/index.ts
+var ScrollingList2 = Object.assign(ScrollingList, {
+  Controls: ScrollingListControls,
+  NextButton: ScrollingListNextButton,
+  PrevButton: ScrollingListPrevButton,
+  Item: ScrollingListItem,
+  Items: ScrollingListItems,
+  SkipButton: ScrollingListSkipButton
+});
+ScrollingList2.displayName = "ScrollingList";
+export {
+  ScrollingList2 as ScrollingList
+};
+//# sourceMappingURL=index.mjs.map

package/dist/scrolling-list/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/scrolling-list/ScrollingList.tsx","../../src/scrolling-list/useScrollOverflow.ts","../../src/scrolling-list/ScrollingListControls.tsx","../../src/scrolling-list/ScrollingListItem.tsx","../../src/scrolling-list/useFocusWithinScroll.tsx","../../src/scrolling-list/ScrollingListItems.tsx","../../src/scrolling-list/ScrollingListNextButton.tsx","../../src/scrolling-list/ScrollingListPrevButton.tsx","../../src/scrolling-list/ScrollingListSkipButton.tsx","../../src/scrolling-list/index.ts"],"sourcesContent":["import { createContext, ReactNode, RefObject, useRef } from 'react'\nimport { SnapCarouselResult, useSnapCarousel } from 'react-snap-carousel'\n\nimport { ScrollOverflow, useScrollOverflow } from './useScrollOverflow'\n\ntype SnapType = 'mandatory' | 'proximity' | 'none'\ntype ScrollBehavior = 'smooth' | 'instant'\ntype SnapStop = 'normal' | 'always'\n\ninterface Props {\n  /**\n   * CSS scroll snap behavior.\n   * - `mandatory` to force snapping on each \"page\".\n   * - `proximity` to force snapping only when scroll position is near the edge of a \"page\". Behavior can change depending on each browser.\n   * - `none` to disabled scroll snapping.\n   */\n  snapType?: SnapType\n  /**\n   * Defines whether or not the scroll container is allowed to \"pass over\" possible snap positions.\n   */\n  snapStop?: SnapStop\n  scrollBehavior?: ScrollBehavior\n  /**\n   * Add a fade effect to indicate content overflow.\n   */\n  widthFade?: boolean\n  children?: ReactNode\n  /**\n   * When `true`, allow previous and next buttons to be used when reaching the edges of the list.\n   */\n  loop?: boolean\n  /**\n   * Space (in pixels) between items.\n   */\n  gap?: number\n  /**\n   * Offset (in pixels) of the left of the optimal viewing region of the list.\n   */\n  scrollPadding?: number\n}\n\ninterface ScrollingListContextState extends SnapCarouselResult {\n  snapType: SnapType\n  snapStop: SnapStop\n  scrollBehavior: ScrollBehavior\n  visibleItemsRange: readonly [number, number]\n  loop: boolean\n  gap: number\n  widthFade: boolean\n  scrollPadding: number\n  scrollAreaRef: RefObject<HTMLDivElement | null>\n  overflow: ScrollOverflow\n  skipKeyboardNavigation: () => void\n}\n\nexport const ScrollingListContext = createContext<ScrollingListContextState>(\n  null as unknown as ScrollingListContextState\n)\n\nexport const ScrollingList = ({\n  snapType = 'none',\n  snapStop = 'normal',\n  scrollBehavior = 'smooth',\n  loop = false,\n  gap = 16,\n  widthFade = false, // TODO: ask for default value + why it has been removed from specs\n  scrollPadding = 0,\n  children,\n}: Props) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const skipAnchorRef = useRef<HTMLButtonElement>(null)\n\n  const snapCarouselAPI = useSnapCarousel()\n\n  const overflow = useScrollOverflow(scrollAreaRef)\n\n  const { activePageIndex, pages } = snapCarouselAPI\n\n  const visibleItems = pages[activePageIndex] as number[]\n\n  const visibleItemsRange = visibleItems\n    ? ([visibleItems[0]! + 1, visibleItems[visibleItems.length - 1]! + 1] as const)\n    : ([0, 0] as const)\n\n  const skipKeyboardNavigation = () => {\n    skipAnchorRef.current?.focus()\n  }\n\n  const ctxValue: ScrollingListContextState = {\n    ...snapCarouselAPI,\n    snapType,\n    snapStop,\n    skipKeyboardNavigation,\n    scrollBehavior,\n    visibleItemsRange,\n    loop,\n    gap,\n    widthFade,\n    scrollPadding,\n    scrollAreaRef,\n    overflow,\n  }\n\n  return (\n    <ScrollingListContext.Provider value={ctxValue}>\n      <div className=\"gap-lg group/scrolling-list relative flex w-full flex-col\">{children}</div>\n      <span ref={skipAnchorRef} className=\"size-0 overflow-hidden\" tabIndex={-1} />\n    </ScrollingListContext.Provider>\n  )\n}\n\nScrollingList.displayName = 'ScrollingList'\n","import { useEffect, useState, RefObject } from 'react'\n\nexport interface ScrollOverflow {\n  left: number\n  right: number\n}\n\nexport function useScrollOverflow(scrollRef: RefObject<HTMLElement | null>): ScrollOverflow {\n  const [overflow, setOverflow] = useState<ScrollOverflow>({\n    left: 0,\n    right: 0,\n  })\n\n  useEffect(() => {\n    const checkScrollContent = () => {\n      const scrollElement = scrollRef.current\n\n      if (scrollElement) {\n        const { scrollLeft, scrollWidth, clientWidth } = scrollElement\n\n        setOverflow({\n          left: scrollLeft,\n          right: scrollWidth - (scrollLeft + clientWidth),\n        })\n      }\n    }\n\n    checkScrollContent()\n\n    const scrollElement = scrollRef.current\n    if (scrollElement) {\n      scrollElement.addEventListener('scroll', checkScrollContent)\n      window.addEventListener('resize', checkScrollContent)\n    }\n\n    return () => {\n      if (scrollElement) {\n        scrollElement.removeEventListener('scroll', checkScrollContent)\n        window.addEventListener('resize', checkScrollContent)\n      }\n    }\n  }, [scrollRef])\n\n  return overflow\n}\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactNode } from 'react'\n\ninterface ScrollingListControls extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * Visibility behavior of the control buttons:\n   * - `always`: buttons are always visible.\n   * - `hover`: buttons only appear on hover.\n   *\n   * a11y: `hover` is dangerous for accessibility as it disabled controls for touch screen users.\n   * When using it, you must provide an alternative control outside of the list to replace them.\n   */\n  visibility?: 'hover' | 'always'\n  children: ReactNode\n}\n\nexport const ScrollingListControls = ({\n  children,\n  visibility = 'always',\n  className,\n  ...rest\n}: ScrollingListControls) => {\n  return (\n    <div\n      className={cx(\n        'default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden',\n        className\n      )}\n      style={\n        {\n          '--scrolling-list-controls-opacity': visibility === 'hover' ? '0' : '1',\n        } as CSSProperties\n      }\n      data-orientation=\"horizontal\"\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nScrollingListControls.displayName = 'ScrollingList.Controls'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, ReactNode, useContext, useRef } from 'react'\n\nimport { Slot } from '../slot'\nimport { ScrollingListContext } from './ScrollingList'\nimport { useFocusWithinScroll } from './useFocusWithinScroll'\n\nexport interface ScrollingListItemProps extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  children?: ReactNode\n  /**\n   * DO NOT USE. This prop is automatically managed by the parent ScrollingList.ListItems\n   */\n  index?: number\n  className?: string\n}\n\nexport const ScrollingListItem = ({\n  asChild = false,\n  children,\n  index = 0,\n  className = '',\n  ...rest\n}: ScrollingListItemProps) => {\n  const ctx = useContext(ScrollingListContext)\n  const itemRef = useRef<HTMLDivElement>(null)\n\n  const isSnapPoint = ctx.snapPointIndexes.has(index)\n\n  useFocusWithinScroll(itemRef, ctx.scrollAreaRef)\n\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <Component\n      role=\"listitem\"\n      ref={itemRef}\n      className={cx(\n        'default:w-auto default:shrink-0',\n        {\n          'snap-start': isSnapPoint,\n          'snap-normal': isSnapPoint && ctx.snapStop === 'normal',\n          'snap-always': isSnapPoint && ctx.snapStop === 'always',\n        },\n        className\n      )}\n      {...rest}\n    >\n      {children}\n    </Component>\n  )\n}\n\nScrollingListItem.displayName = 'ScrollingList.Item'\n","import { RefObject, useEffect, useState } from 'react'\n\nexport function useFocusWithinScroll<T extends HTMLElement | null>(\n  ref: RefObject<T>, // The container to detect focus within\n  scrollRef: RefObject<HTMLDivElement | null> // The scrollable container\n) {\n  const [isFocusWithin, setIsFocusWithin] = useState(false)\n\n  useEffect(() => {\n    const handleFocusIn = (event: FocusEvent) => {\n      setIsFocusWithin(true)\n\n      const focusedElement = event.target as HTMLElement\n      const scrollContainer = scrollRef.current\n\n      if (focusedElement && scrollContainer) {\n        const focusRect = focusedElement.getBoundingClientRect()\n        const scrollRect = scrollContainer.getBoundingClientRect()\n\n        // Check if the focused element is fully visible inside the scroll container\n        const isFullyVisible =\n          focusRect.left >= scrollRect.left &&\n          focusRect.right <= scrollRect.right &&\n          focusRect.top >= scrollRect.top &&\n          focusRect.bottom <= scrollRect.bottom\n\n        if (!isFullyVisible) {\n          focusedElement.scrollIntoView({ behavior: 'smooth', inline: 'center', block: 'nearest' })\n        }\n      }\n    }\n\n    const handleFocusOut = (event: FocusEvent) => {\n      if (ref.current && !ref.current.contains(event.relatedTarget as Node)) {\n        setIsFocusWithin(false)\n      }\n    }\n\n    const node = ref.current\n    if (node) {\n      node.addEventListener('focusin', handleFocusIn)\n      node.addEventListener('focusout', handleFocusOut)\n    }\n\n    return () => {\n      if (node) {\n        node.removeEventListener('focusin', handleFocusIn)\n        node.removeEventListener('focusout', handleFocusOut)\n      }\n    }\n  }, [ref, scrollRef])\n\n  return isFocusWithin\n}\n","import { cx } from 'class-variance-authority'\nimport {\n  Children,\n  cloneElement,\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  isValidElement,\n  KeyboardEvent,\n  ReactNode,\n  Ref,\n  RefObject,\n  useContext,\n} from 'react'\n\nimport { ScrollingListContext } from './ScrollingList'\nimport { ScrollingListItemProps } from './ScrollingListItem'\n\ninterface Props extends ComponentPropsWithoutRef<'div'> {\n  children?: ReactNode\n  className?: string\n}\n\nexport function mergeRefs<T>(...refs: (Ref<T> | undefined | null)[]): Ref<T> {\n  return (value: T | null) => {\n    refs.forEach(ref => {\n      if (typeof ref === 'function') {\n        ref(value)\n      } else if (ref && typeof ref === 'object' && 'current' in ref) {\n        ;(ref as RefObject<T | null>).current = value\n      }\n    })\n  }\n}\n\nexport const ScrollingListItems = ({ children, className = '', ...rest }: Props) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const snapConfig = {\n    mandatory: 'x mandatory',\n    proximity: 'x proximity',\n    none: 'none',\n  }\n\n  const handleLeftArrow = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!ctx.loop && !ctx.hasPrevPage) return\n\n    event.preventDefault()\n    ctx.goTo(ctx.hasPrevPage ? ctx.activePageIndex - 1 : ctx.pages.length - 1, {\n      behavior: ctx.scrollBehavior,\n    })\n  }\n\n  const handleRightArrow = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (!ctx.loop && !ctx.hasNextPage) return\n\n    event.preventDefault()\n    ctx.goTo(ctx.hasNextPage ? ctx.activePageIndex + 1 : 0, { behavior: ctx.scrollBehavior })\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'ArrowLeft') {\n      handleLeftArrow(event)\n    }\n\n    if (event.key === 'ArrowRight') {\n      handleRightArrow(event)\n    }\n  }\n\n  interface CustomCSSProperties extends CSSProperties {\n    '--scrolling-list-gap'?: string\n    '--scrolling-list-px'?: string\n  }\n\n  const inlineStyles: CustomCSSProperties = {\n    scrollSnapType: snapConfig[ctx.snapType],\n    scrollPaddingInline: 'var(--scrolling-list-px)',\n    '--scrolling-list-px': `${ctx.scrollPadding}px`,\n    '--scrolling-list-gap': `${ctx.gap}px`,\n    ...(ctx.widthFade && {\n      maskImage:\n        'linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n      maskSize: `calc(100% + ${ctx.overflow.left ? '0px' : '44px'} + ${ctx.overflow.right ? '0px' : '44px'}) 100%`,\n      maskPosition: `${ctx.overflow.left ? '0px' : '-44px'} 0`,\n    }),\n  }\n\n  return (\n    <div\n      id=\"scrolling-list-items\"\n      role=\"list\"\n      className={cx(\n        'relative transition-all duration-300',\n        'u-no-scrollbar overflow-x-auto scroll-smooth default:overscroll-contain',\n        'w-full gap-(--scrolling-list-gap) default:flex default:flex-row',\n        'focus-visible:u-outline',\n        className\n      )}\n      ref={mergeRefs<HTMLDivElement>(ctx.scrollAreaRef, ctx.scrollRef)}\n      style={inlineStyles}\n      onKeyDown={handleKeyDown}\n      {...rest}\n    >\n      {Children.map(children, (child, index) =>\n        isValidElement<ScrollingListItemProps>(child) ? cloneElement(child, { index }) : child\n      )}\n    </div>\n  )\n}\n\nScrollingListItems.displayName = 'ScrollingList.Items'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { cx } from 'class-variance-authority'\nimport { useContext } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton, IconButtonProps } from '../icon-button'\nimport { ScrollingListContext } from './ScrollingList'\n\nexport const ScrollingListNextButton = ({ 'aria-label': ariaLabel, ...rest }: IconButtonProps) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const handleNextPage = () => {\n    if (ctx.hasNextPage) {\n      ctx.next({ behavior: ctx.scrollBehavior })\n    } else {\n      ctx.goTo(0, { behavior: ctx.scrollBehavior })\n    }\n  }\n\n  const listHasOverflow = ctx.overflow.left || ctx.overflow.right\n  const isDisabled = !listHasOverflow || (!ctx.loop && !ctx.overflow.right)\n\n  return (\n    <IconButton\n      size=\"sm\"\n      intent=\"surface\"\n      design=\"filled\"\n      className={cx(\n        'pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible',\n        'group-hover/scrolling-list:opacity-none focus-visible:opacity-none'\n      )}\n      onClick={handleNextPage}\n      disabled={isDisabled}\n      aria-label={ariaLabel}\n      aria-controls=\"scrolling-list-items\"\n      {...rest}\n    >\n      <Icon>\n        <ArrowVerticalRight />\n      </Icon>\n    </IconButton>\n  )\n}\n\nScrollingListNextButton.displayName = 'ScrollingList.NextButton'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { cx } from 'class-variance-authority'\nimport { useContext } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton, IconButtonProps } from '../icon-button'\nimport { ScrollingListContext } from './ScrollingList'\n\nexport const ScrollingListPrevButton = ({\n  'aria-label': ariaLabel,\n\n  ...rest\n}: IconButtonProps) => {\n  const ctx = useContext(ScrollingListContext)\n\n  const handlePrevPage = () => {\n    const shouldSnapFirstPage =\n      ctx.activePageIndex === 0 && (ctx.scrollAreaRef.current?.scrollLeft || 0) > 0\n\n    if (shouldSnapFirstPage) {\n      ctx.goTo(0, { behavior: ctx.scrollBehavior })\n    } else if (ctx.hasPrevPage) {\n      ctx.prev({ behavior: ctx.scrollBehavior })\n    } else {\n      ctx.goTo(ctx.pages.length - 1, { behavior: ctx.scrollBehavior })\n    }\n  }\n\n  const listHasOverflow = ctx.overflow.left || ctx.overflow.right\n  const isDisabled = !listHasOverflow || (!ctx.loop && !ctx.overflow.left)\n\n  return (\n    <IconButton\n      size=\"sm\"\n      intent=\"surface\"\n      design=\"filled\"\n      className={cx(\n        'pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible',\n        'group-hover/scrolling-list:opacity-none focus-visible:opacity-none'\n      )}\n      onClick={handlePrevPage}\n      disabled={isDisabled}\n      aria-label={ariaLabel}\n      aria-controls=\"scrolling-list-items\"\n      {...rest}\n    >\n      <Icon>\n        <ArrowVerticalLeft />\n      </Icon>\n    </IconButton>\n  )\n}\n\nScrollingListPrevButton.displayName = 'ScrollingList.PrevButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, useContext } from 'react'\n\nimport { Button } from '../button'\nimport { ScrollingListContext } from './ScrollingList'\n\ninterface Props extends ComponentPropsWithoutRef<'button'> {\n  children: string\n}\n\nexport const ScrollingListSkipButton = ({ children, ...rest }: Props) => {\n  const ctx = useContext(ScrollingListContext)\n\n  return (\n    <Button\n      type=\"button\"\n      design=\"tinted\"\n      intent=\"surface\"\n      tabIndex={0}\n      className={cx(\n        'z-raised absolute top-1/2 left-0 -translate-y-1/2',\n        'not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0'\n      )}\n      onClick={ctx.skipKeyboardNavigation}\n      {...rest}\n    >\n      {children}\n    </Button>\n  )\n}\n\nScrollingListSkipButton.displayName = 'ScrollingList.SkipButton'\n","import { ScrollingList as Root } from './ScrollingList'\nimport { ScrollingListControls as Controls } from './ScrollingListControls'\nimport { ScrollingListItem as Item } from './ScrollingListItem'\nimport { ScrollingListItems as Items } from './ScrollingListItems'\nimport { ScrollingListNextButton as NextButton } from './ScrollingListNextButton'\nimport { ScrollingListPrevButton as PrevButton } from './ScrollingListPrevButton'\nimport { ScrollingListSkipButton as SkipButton } from './ScrollingListSkipButton'\n\nexport const ScrollingList: typeof Root & {\n  Controls: typeof Controls\n  NextButton: typeof NextButton\n  PrevButton: typeof PrevButton\n  Item: typeof Item\n  Items: typeof Items\n  SkipButton: typeof SkipButton\n} = Object.assign(Root, {\n  Controls,\n  NextButton,\n  PrevButton,\n  Item,\n  Items,\n  SkipButton,\n})\n\nScrollingList.displayName = 'ScrollingList'\n"],"mappings":"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","names":["scrollElement","jsx","cx","useRef","useEffect","useState","jsx","useRef","cx","cx","useContext","jsx","useContext","cx","cx","useContext","jsx","useContext","cx","cx","useContext","jsx","useContext","cx","cx","useContext","jsx","useContext","cx","ScrollingList"]}