@spark-ui/components 14.0.0-beta.1 → 14.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../node_modules/react-snap-carousel/dist/use-snap-carousel.mjs","../../src/scrolling-list/ScrollingList.tsx","../../src/scrolling-list/ScrollingListControls.tsx","../../src/scrolling-list/useFocusWithinScroll.tsx","../../src/scrolling-list/ScrollingListItem.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":["// src/use-snap-carousel.tsx\nimport { useState, useCallback, useEffect as useEffect2, useMemo } from \"react\";\n\n// src/use-isomorphic-layout-effect.tsx\nimport { useEffect, useLayoutEffect } from \"react\";\nvar useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\n// src/use-snap-carousel.tsx\nvar useSnapCarousel = ({\n  axis = \"x\",\n  initialPages = []\n} = {}) => {\n  const dimension = axis === \"x\" ? \"width\" : \"height\";\n  const scrollDimension = axis === \"x\" ? \"scrollWidth\" : \"scrollHeight\";\n  const clientDimension = axis === \"x\" ? \"clientWidth\" : \"clientHeight\";\n  const nearSidePos = axis === \"x\" ? \"left\" : \"top\";\n  const farSidePos = axis === \"x\" ? \"right\" : \"bottom\";\n  const scrollPos = axis === \"x\" ? \"scrollLeft\" : \"scrollTop\";\n  const [scrollEl, setScrollEl] = useState(null);\n  const [{ pages, activePageIndex }, setCarouselState] = useState({\n    pages: initialPages,\n    activePageIndex: 0\n  });\n  const refreshActivePage = useCallback(\n    (pages2) => {\n      if (!scrollEl) {\n        return;\n      }\n      const hasScrolledToEnd = Math.floor(scrollEl[scrollDimension] - scrollEl[scrollPos]) <= scrollEl[clientDimension];\n      if (hasScrolledToEnd) {\n        setCarouselState({ pages: pages2, activePageIndex: pages2.length - 1 });\n        return;\n      }\n      const items = Array.from(scrollEl.children);\n      const scrollPort = scrollEl.getBoundingClientRect();\n      const offsets = pages2.map((page) => {\n        const leadIndex = page[0];\n        const leadEl = items[leadIndex];\n        assert(leadEl instanceof HTMLElement, \"Expected HTMLElement\");\n        const scrollSpacing = getEffectiveScrollSpacing(\n          scrollEl,\n          leadEl,\n          nearSidePos\n        );\n        const rect = leadEl.getBoundingClientRect();\n        const offset = rect[nearSidePos] - scrollPort[nearSidePos] - scrollSpacing;\n        return Math.abs(offset);\n      });\n      const minOffset = Math.min(...offsets);\n      const nextActivePageIndex = offsets.indexOf(minOffset);\n      setCarouselState({ pages: pages2, activePageIndex: nextActivePageIndex });\n    },\n    [scrollEl, clientDimension, nearSidePos, scrollDimension, scrollPos]\n  );\n  const refresh = useCallback(() => {\n    if (!scrollEl) {\n      return;\n    }\n    const items = Array.from(scrollEl.children);\n    const scrollPort = scrollEl.getBoundingClientRect();\n    let currPageStartPos;\n    const pages2 = items.reduce((acc, item, i) => {\n      assert(item instanceof HTMLElement, \"Expected HTMLElement\");\n      const currPage = acc[acc.length - 1];\n      const rect = getOffsetRect(item, item.parentElement);\n      if (!currPage || item.dataset.shouldSnap === \"true\" || rect[farSidePos] - currPageStartPos > Math.ceil(scrollPort[dimension])) {\n        acc.push([i]);\n        const scrollSpacing = getEffectiveScrollSpacing(\n          scrollEl,\n          item,\n          nearSidePos\n        );\n        currPageStartPos = rect[nearSidePos] - scrollSpacing;\n      } else {\n        currPage.push(i);\n      }\n      return acc;\n    }, []);\n    refreshActivePage(pages2);\n  }, [refreshActivePage, scrollEl, dimension, farSidePos, nearSidePos]);\n  useIsomorphicLayoutEffect(() => {\n    refresh();\n  }, [refresh]);\n  useEffect2(() => {\n    const handle = () => {\n      refresh();\n    };\n    window.addEventListener(\"resize\", handle);\n    window.addEventListener(\"orientationchange\", handle);\n    return () => {\n      window.removeEventListener(\"resize\", handle);\n      window.removeEventListener(\"orientationchange\", handle);\n    };\n  }, [refresh]);\n  useEffect2(() => {\n    if (!scrollEl) {\n      return;\n    }\n    const handle = () => {\n      refreshActivePage(pages);\n    };\n    scrollEl.addEventListener(\"scroll\", handle);\n    return () => {\n      scrollEl.removeEventListener(\"scroll\", handle);\n    };\n  }, [refreshActivePage, pages, scrollEl]);\n  const handleGoTo = (index, opts) => {\n    if (!scrollEl) {\n      return;\n    }\n    const page = pages[index];\n    if (!page) {\n      return;\n    }\n    const items = Array.from(scrollEl.children);\n    const leadIndex = page[0];\n    const leadEl = items[leadIndex];\n    if (!(leadEl instanceof HTMLElement)) {\n      return;\n    }\n    const scrollSpacing = getEffectiveScrollSpacing(\n      scrollEl,\n      leadEl,\n      nearSidePos\n    );\n    const behavior = (opts == null ? void 0 : opts.behavior) || \"smooth\";\n    scrollEl.scrollTo({\n      behavior,\n      [nearSidePos]: getOffsetRect(leadEl, leadEl.parentElement)[nearSidePos] - scrollSpacing\n    });\n  };\n  const handlePrev = (opts) => {\n    handleGoTo(activePageIndex - 1, opts);\n  };\n  const handleNext = (opts) => {\n    handleGoTo(activePageIndex + 1, opts);\n  };\n  const snapPointIndexes = useMemo(\n    () => new Set(pages.map((page) => page[0])),\n    [pages]\n  );\n  const hasPrevPage = activePageIndex > 0;\n  const hasNextPage = activePageIndex < pages.length - 1;\n  return {\n    hasPrevPage,\n    hasNextPage,\n    prev: handlePrev,\n    next: handleNext,\n    goTo: handleGoTo,\n    refresh,\n    pages,\n    activePageIndex,\n    snapPointIndexes,\n    scrollRef: setScrollEl\n  };\n};\nvar getOffsetRect = (el, relativeTo) => {\n  const rect = _getOffsetRect(el);\n  if (!relativeTo) {\n    return rect;\n  }\n  const relativeRect = _getOffsetRect(relativeTo);\n  return {\n    left: rect.left - relativeRect.left,\n    top: rect.top - relativeRect.top,\n    right: rect.right - relativeRect.left,\n    bottom: rect.bottom - relativeRect.top,\n    width: rect.width,\n    height: rect.height\n  };\n};\nvar _getOffsetRect = (el) => {\n  const rect = el.getBoundingClientRect();\n  let scrollLeft = 0;\n  let scrollTop = 0;\n  let parentEl = el.parentElement;\n  while (parentEl) {\n    scrollLeft += parentEl.scrollLeft;\n    scrollTop += parentEl.scrollTop;\n    parentEl = parentEl.parentElement;\n  }\n  const left = rect.left + scrollLeft;\n  const top = rect.top + scrollTop;\n  return {\n    left,\n    top,\n    right: left + rect.width,\n    bottom: top + rect.height,\n    width: rect.width,\n    height: rect.height\n  };\n};\nvar getScrollPaddingUsedValue = (el, pos) => {\n  const style = window.getComputedStyle(el);\n  const scrollPadding = style.getPropertyValue(`scroll-padding-${pos}`) || \"0px\";\n  if (scrollPadding === \"auto\") {\n    return 0;\n  }\n  const invalidMsg = `Unsupported scroll padding value, expected <length> or <percentage> value, received ${scrollPadding}`;\n  if (scrollPadding.endsWith(\"px\")) {\n    const value = parseInt(scrollPadding);\n    assert(!Number.isNaN(value), invalidMsg);\n    return value;\n  }\n  if (scrollPadding.endsWith(\"%\")) {\n    const value = parseInt(scrollPadding);\n    assert(!Number.isNaN(value), invalidMsg);\n    return el.clientWidth / 100 * value;\n  }\n  throw new RSCError(invalidMsg);\n};\nvar getScrollMarginUsedValue = (el, pos) => {\n  const style = window.getComputedStyle(el);\n  const scrollMargin = style.getPropertyValue(`scroll-margin-${pos}`) || \"0px\";\n  const invalidMsg = `Unsupported scroll margin value, expected <length> value, received ${scrollMargin}`;\n  assert(scrollMargin.endsWith(\"px\"), invalidMsg);\n  const value = parseInt(scrollMargin);\n  assert(!Number.isNaN(value), invalidMsg);\n  return value;\n};\nvar getEffectiveScrollSpacing = (scrollEl, itemEl, pos) => {\n  const scrollPadding = getScrollPaddingUsedValue(scrollEl, pos);\n  const scrollMargin = getScrollMarginUsedValue(itemEl, pos);\n  const rect = getOffsetRect(itemEl, itemEl.parentElement);\n  return Math.min(scrollPadding + scrollMargin, rect[pos]);\n};\nfunction assert(value, message) {\n  if (value) {\n    return;\n  }\n  throw new RSCError(message);\n}\nvar RSCError = class extends Error {\n  constructor(message) {\n    super(`[react-snap-carousel]: ${message}`);\n  }\n};\nexport {\n  useSnapCarousel\n};\n","import { ScrollOverflow, useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport {\n  ComponentPropsWithRef,\n  createContext,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\nimport { SnapCarouselResult, useSnapCarousel } from 'react-snap-carousel'\n\ntype SnapType = 'mandatory' | 'proximity' | 'none'\ntype ScrollBehavior = 'smooth' | 'instant'\ntype SnapStop = 'normal' | 'always'\n\ninterface Props extends ComponentPropsWithRef<'div'> {\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  withFade?: 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  className?: string\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  withFade: 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  withFade = false,\n  scrollPadding = 0,\n  children,\n  className,\n  ...rest\n}: Props) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const skipAnchorRef = useRef<HTMLButtonElement>(null)\n\n  const snapCarouselAPI = useSnapCarousel()\n\n  const { overflow, refresh: refreshOverflow } = useScrollOverflow(scrollAreaRef, {\n    precisionTreshold: 1,\n  })\n\n  const { activePageIndex, pages, refresh } = 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  // Force refresh of the carousel API when children change\n  const forceRefresh = useCallback(() => {\n    if (refresh && scrollAreaRef.current) {\n      // Small delay to ensure DOM is updated\n      setTimeout(() => {\n        refresh()\n      }, 0)\n    }\n  }, [refresh])\n\n  useEffect(() => {\n    forceRefresh()\n  }, [children, forceRefresh])\n\n  useLayoutEffect(() => {\n    if (scrollAreaRef.current) {\n      // Use requestAnimationFrame to ensure proper timing with the render cycle\n      // This prevents race conditions that occur when the console is closed\n      requestAnimationFrame(() => {\n        refreshOverflow()\n      })\n    }\n  }, [children, refreshOverflow])\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    withFade,\n    scrollPadding,\n    scrollAreaRef,\n    overflow,\n  }\n\n  return (\n    <ScrollingListContext.Provider value={ctxValue}>\n      <div\n        data-spark-component=\"scrolling-list\"\n        className={cx(\n          'gap-lg group/scrolling-list relative flex flex-col default:w-full',\n          className\n        )}\n        {...rest}\n      >\n        {children}\n      </div>\n      <span ref={skipAnchorRef} className=\"size-0 overflow-hidden\" tabIndex={-1} />\n    </ScrollingListContext.Provider>\n  )\n}\n\nScrollingList.displayName = 'ScrollingList'\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      data-spark-component=\"scrolling-list-controls\"\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 { 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 { 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      data-spark-component=\"scrolling-list-item\"\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 { cx } from 'class-variance-authority'\nimport {\n  Children,\n  cloneElement,\n  ComponentPropsWithRef,\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 ComponentPropsWithRef<'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, ref, 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.withFade && {\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      data-spark-component=\"scrolling-list-items\"\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',\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, ref)}\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      data-spark-component=\"scrolling-list-next-button\"\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      data-spark-component=\"scrolling-list-prev-button\"\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"],"names":["useIsomorphicLayoutEffect","useLayoutEffect","useEffect","useSnapCarousel","axis","initialPages","dimension","scrollDimension","clientDimension","nearSidePos","farSidePos","scrollPos","scrollEl","setScrollEl","useState","pages","activePageIndex","setCarouselState","refreshActivePage","useCallback","pages2","items","scrollPort","offsets","page","leadIndex","leadEl","assert","scrollSpacing","getEffectiveScrollSpacing","offset","minOffset","nextActivePageIndex","refresh","currPageStartPos","acc","item","i","currPage","rect","getOffsetRect","useEffect2","handle","handleGoTo","index","opts","behavior","handlePrev","handleNext","snapPointIndexes","useMemo","hasPrevPage","hasNextPage","el","relativeTo","_getOffsetRect","relativeRect","scrollLeft","scrollTop","parentEl","left","top","getScrollPaddingUsedValue","pos","scrollPadding","invalidMsg","value","RSCError","getScrollMarginUsedValue","scrollMargin","itemEl","message","ScrollingListContext","createContext","ScrollingList","snapType","snapStop","scrollBehavior","loop","gap","withFade","children","className","rest","scrollAreaRef","useRef","skipAnchorRef","snapCarouselAPI","overflow","refreshOverflow","useScrollOverflow","visibleItems","visibleItemsRange","forceRefresh","ctxValue","jsxs","jsx","cx","ScrollingListControls","visibility","useFocusWithinScroll","ref","scrollRef","isFocusWithin","setIsFocusWithin","handleFocusIn","event","focusedElement","scrollContainer","focusRect","scrollRect","handleFocusOut","node","ScrollingListItem","asChild","ctx","useContext","itemRef","isSnapPoint","Slot","mergeRefs","refs","ScrollingListItems","snapConfig","handleLeftArrow","handleRightArrow","handleKeyDown","inlineStyles","Children","child","isValidElement","cloneElement","ScrollingListNextButton","ariaLabel","handleNextPage","isDisabled","IconButton","Icon","ArrowVerticalRight","ScrollingListPrevButton","handlePrevPage","ArrowVerticalLeft","ScrollingListSkipButton","Button","Root","Controls","NextButton","PrevButton","Item","Items","SkipButton"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"index.mjs","sources":["../../src/scrolling-list/ScrollingList.tsx","../../src/scrolling-list/ScrollingListControls.tsx","../../src/scrolling-list/useFocusWithinScroll.tsx","../../src/scrolling-list/ScrollingListItem.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 { ScrollOverflow, useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport {\n  ComponentPropsWithRef,\n  createContext,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\nimport { SnapCarouselResult, useSnapCarousel } from 'react-snap-carousel'\n\ntype SnapType = 'mandatory' | 'proximity' | 'none'\ntype ScrollBehavior = 'smooth' | 'instant'\ntype SnapStop = 'normal' | 'always'\n\ninterface Props extends ComponentPropsWithRef<'div'> {\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  withFade?: 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  className?: string\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  withFade: 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  withFade = false,\n  scrollPadding = 0,\n  children,\n  className,\n  ...rest\n}: Props) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const skipAnchorRef = useRef<HTMLButtonElement>(null)\n\n  const snapCarouselAPI = useSnapCarousel()\n\n  const { overflow, refresh: refreshOverflow } = useScrollOverflow(scrollAreaRef, {\n    precisionTreshold: 1,\n  })\n\n  const { activePageIndex, pages, refresh } = 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  // Force refresh of the carousel API when children change\n  const forceRefresh = useCallback(() => {\n    if (refresh && scrollAreaRef.current) {\n      // Small delay to ensure DOM is updated\n      setTimeout(() => {\n        refresh()\n      }, 0)\n    }\n  }, [refresh])\n\n  useEffect(() => {\n    forceRefresh()\n  }, [children, forceRefresh])\n\n  useLayoutEffect(() => {\n    if (scrollAreaRef.current) {\n      // Use requestAnimationFrame to ensure proper timing with the render cycle\n      // This prevents race conditions that occur when the console is closed\n      requestAnimationFrame(() => {\n        refreshOverflow()\n      })\n    }\n  }, [children, refreshOverflow])\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    withFade,\n    scrollPadding,\n    scrollAreaRef,\n    overflow,\n  }\n\n  return (\n    <ScrollingListContext.Provider value={ctxValue}>\n      <div\n        data-spark-component=\"scrolling-list\"\n        className={cx(\n          'gap-lg group/scrolling-list relative flex flex-col default:w-full',\n          className\n        )}\n        {...rest}\n      >\n        {children}\n      </div>\n      <span ref={skipAnchorRef} className=\"size-0 overflow-hidden\" tabIndex={-1} />\n    </ScrollingListContext.Provider>\n  )\n}\n\nScrollingList.displayName = 'ScrollingList'\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      data-spark-component=\"scrolling-list-controls\"\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 { 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 { 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      data-spark-component=\"scrolling-list-item\"\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 { cx } from 'class-variance-authority'\nimport {\n  Children,\n  cloneElement,\n  ComponentPropsWithRef,\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 ComponentPropsWithRef<'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, ref, 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.withFade && {\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      data-spark-component=\"scrolling-list-items\"\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',\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, ref)}\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      data-spark-component=\"scrolling-list-next-button\"\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      data-spark-component=\"scrolling-list-prev-button\"\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"],"names":["ScrollingListContext","createContext","ScrollingList","snapType","snapStop","scrollBehavior","loop","gap","withFade","scrollPadding","children","className","rest","scrollAreaRef","useRef","skipAnchorRef","snapCarouselAPI","useSnapCarousel","overflow","refreshOverflow","useScrollOverflow","activePageIndex","pages","refresh","visibleItems","visibleItemsRange","forceRefresh","useCallback","useEffect","useLayoutEffect","ctxValue","jsxs","jsx","cx","ScrollingListControls","visibility","useFocusWithinScroll","ref","scrollRef","isFocusWithin","setIsFocusWithin","useState","handleFocusIn","event","focusedElement","scrollContainer","focusRect","scrollRect","handleFocusOut","node","ScrollingListItem","asChild","index","ctx","useContext","itemRef","isSnapPoint","Slot","mergeRefs","refs","value","ScrollingListItems","snapConfig","handleLeftArrow","handleRightArrow","handleKeyDown","inlineStyles","Children","child","isValidElement","cloneElement","ScrollingListNextButton","ariaLabel","handleNextPage","isDisabled","IconButton","Icon","ArrowVerticalRight","ScrollingListPrevButton","handlePrevPage","ArrowVerticalLeft","ScrollingListSkipButton","Button","Root","Controls","NextButton","PrevButton","Item","Items","SkipButton"],"mappings":";;;;;;;;;;;AAiEO,MAAMA,IAAuBC;AAAA,EAClC;AACF,GAEaC,IAAgB,CAAC;AAAA,EAC5B,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,gBAAAC,IAAiB;AAAA,EACjB,MAAAC,IAAO;AAAA,EACP,KAAAC,IAAM;AAAA,EACN,UAAAC,IAAW;AAAA,EACX,eAAAC,IAAgB;AAAA,EAChB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAAa;AACX,QAAMC,IAAgBC,EAAuB,IAAI,GAC3CC,IAAgBD,EAA0B,IAAI,GAE9CE,IAAkBC,EAAA,GAElB,EAAE,UAAAC,GAAU,SAASC,EAAA,IAAoBC,EAAkBP,GAAe;AAAA,IAC9E,mBAAmB;AAAA,EAAA,CACpB,GAEK,EAAE,iBAAAQ,GAAiB,OAAAC,GAAO,SAAAC,EAAA,IAAYP,GAEtCQ,IAAeF,EAAMD,CAAe,GAEpCI,IAAoBD,IACrB,CAACA,EAAa,CAAC,IAAK,GAAGA,EAAaA,EAAa,SAAS,CAAC,IAAK,CAAC,IACjE,CAAC,GAAG,CAAC,GAGJE,IAAeC,EAAY,MAAM;AACrC,IAAIJ,KAAWV,EAAc,WAE3B,WAAW,MAAM;AACf,MAAAU,EAAA;AAAA,IACF,GAAG,CAAC;AAAA,EAER,GAAG,CAACA,CAAO,CAAC;AAEZ,EAAAK,EAAU,MAAM;AACd,IAAAF,EAAA;AAAA,EACF,GAAG,CAAChB,GAAUgB,CAAY,CAAC,GAE3BG,EAAgB,MAAM;AACpB,IAAIhB,EAAc,WAGhB,sBAAsB,MAAM;AAC1B,MAAAM,EAAA;AAAA,IACF,CAAC;AAAA,EAEL,GAAG,CAACT,GAAUS,CAAe,CAAC;AAM9B,QAAMW,IAAsC;AAAA,IAC1C,GAAGd;AAAA,IACH,UAAAb;AAAA,IACA,UAAAC;AAAA,IACA,wBAR6B,MAAM;AACnC,MAAAW,EAAc,SAAS,MAAA;AAAA,IACzB;AAAA,IAOE,gBAAAV;AAAA,IACA,mBAAAoB;AAAA,IACA,MAAAnB;AAAA,IACA,KAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAI;AAAA,IACA,UAAAK;AAAA,EAAA;AAGF,SACE,gBAAAa,EAAC/B,EAAqB,UAArB,EAA8B,OAAO8B,GACpC,UAAA;AAAA,IAAA,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,wBAAqB;AAAA,QACrB,WAAWC;AAAA,UACT;AAAA,UACAtB;AAAA,QAAA;AAAA,QAED,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,sBAEF,QAAA,EAAK,KAAKK,GAAe,WAAU,0BAAyB,UAAU,GAAA,CAAI;AAAA,EAAA,GAC7E;AAEJ;AAEAb,EAAc,cAAc;AC9IrB,MAAMgC,IAAwB,CAAC;AAAA,EACpC,UAAAxB;AAAA,EACA,YAAAyB,IAAa;AAAA,EACb,WAAAxB;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAoB;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,wBAAqB;AAAA,IACrB,WAAWC;AAAA,MACT;AAAA,MACAtB;AAAA,IAAA;AAAA,IAEF,OACE;AAAA,MACE,qCAAqCwB,MAAe,UAAU,MAAM;AAAA,IAAA;AAAA,IAGxE,oBAAiB;AAAA,IAChB,GAAGvB;AAAA,IAEH,UAAAF;AAAA,EAAA;AAAA;AAKPwB,EAAsB,cAAc;ACxC7B,SAASE,EACdC,GACAC,GACA;AACA,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,EAAK;AAExD,SAAAb,EAAU,MAAM;AACd,UAAMc,IAAgB,CAACC,MAAsB;AAC3C,MAAAH,EAAiB,EAAI;AAErB,YAAMI,IAAiBD,EAAM,QACvBE,IAAkBP,EAAU;AAElC,UAAIM,KAAkBC,GAAiB;AACrC,cAAMC,IAAYF,EAAe,sBAAA,GAC3BG,IAAaF,EAAgB,sBAAA;AASnC,QALEC,EAAU,QAAQC,EAAW,QAC7BD,EAAU,SAASC,EAAW,SAC9BD,EAAU,OAAOC,EAAW,OAC5BD,EAAU,UAAUC,EAAW,UAG/BH,EAAe,eAAe,EAAE,UAAU,UAAU,QAAQ,UAAU,OAAO,WAAW;AAAA,MAE5F;AAAA,IACF,GAEMI,IAAiB,CAACL,MAAsB;AAC5C,MAAIN,EAAI,WAAW,CAACA,EAAI,QAAQ,SAASM,EAAM,aAAqB,KAClEH,EAAiB,EAAK;AAAA,IAE1B,GAEMS,IAAOZ,EAAI;AACjB,WAAIY,MACFA,EAAK,iBAAiB,WAAWP,CAAa,GAC9CO,EAAK,iBAAiB,YAAYD,CAAc,IAG3C,MAAM;AACX,MAAIC,MACFA,EAAK,oBAAoB,WAAWP,CAAa,GACjDO,EAAK,oBAAoB,YAAYD,CAAc;AAAA,IAEvD;AAAA,EACF,GAAG,CAACX,GAAKC,CAAS,CAAC,GAEZC;AACT;ACjCO,MAAMW,IAAoB,CAAC;AAAA,EAChC,SAAAC,IAAU;AAAA,EACV,UAAAzC;AAAA,EACA,OAAA0C,IAAQ;AAAA,EACR,WAAAzC,IAAY;AAAA,EACZ,GAAGC;AACL,MAA8B;AAC5B,QAAMyC,IAAMC,EAAWtD,CAAoB,GACrCuD,IAAUzC,EAAuB,IAAI,GAErC0C,IAAcH,EAAI,iBAAiB,IAAID,CAAK;AAElD,SAAAhB,EAAqBmB,GAASF,EAAI,aAAa,GAK7C,gBAAArB;AAAA,IAHgBmB,IAAUM,IAAO;AAAA,IAGhC;AAAA,MACC,wBAAqB;AAAA,MACrB,MAAK;AAAA,MACL,KAAKF;AAAA,MACL,WAAWtB;AAAA,QACT;AAAA,QACA;AAAA,UACE,cAAcuB;AAAA,UACd,eAAeA,KAAeH,EAAI,aAAa;AAAA,UAC/C,eAAeG,KAAeH,EAAI,aAAa;AAAA,QAAA;AAAA,QAEjD1C;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAwC,EAAkB,cAAc;ACnCzB,SAASQ,KAAgBC,GAA6C;AAC3E,SAAO,CAACC,MAAoB;AAC1B,IAAAD,EAAK,QAAQ,CAAAtB,MAAO;AAClB,MAAI,OAAOA,KAAQ,aACjBA,EAAIuB,CAAK,IACAvB,KAAO,OAAOA,KAAQ,YAAY,aAAaA,MACtDA,EAA4B,UAAUuB;AAAA,IAE5C,CAAC;AAAA,EACH;AACF;AAEO,MAAMC,IAAqB,CAAC,EAAE,UAAAnD,GAAU,KAAA2B,GAAK,WAAA1B,IAAY,IAAI,GAAGC,QAAkB;AACvF,QAAMyC,IAAMC,EAAWtD,CAAoB,GAErC8D,IAAa;AAAA,IACjB,WAAW;AAAA,IACX,WAAW;AAAA,IACX,MAAM;AAAA,EAAA,GAGFC,IAAkB,CAACpB,MAAyC;AAChE,IAAI,CAACU,EAAI,QAAQ,CAACA,EAAI,gBAEtBV,EAAM,eAAA,GACNU,EAAI,KAAKA,EAAI,cAAcA,EAAI,kBAAkB,IAAIA,EAAI,MAAM,SAAS,GAAG;AAAA,MACzE,UAAUA,EAAI;AAAA,IAAA,CACf;AAAA,EACH,GAEMW,IAAmB,CAACrB,MAAyC;AACjE,IAAI,CAACU,EAAI,QAAQ,CAACA,EAAI,gBAEtBV,EAAM,eAAA,GACNU,EAAI,KAAKA,EAAI,cAAcA,EAAI,kBAAkB,IAAI,GAAG,EAAE,UAAUA,EAAI,eAAA,CAAgB;AAAA,EAC1F,GAEMY,IAAgB,CAACtB,MAAyC;AAC9D,IAAIA,EAAM,QAAQ,eAChBoB,EAAgBpB,CAAK,GAGnBA,EAAM,QAAQ,gBAChBqB,EAAiBrB,CAAK;AAAA,EAE1B,GAOMuB,IAAoC;AAAA,IACxC,gBAAgBJ,EAAWT,EAAI,QAAQ;AAAA,IACvC,qBAAqB;AAAA,IACrB,uBAAuB,GAAGA,EAAI,aAAa;AAAA,IAC3C,wBAAwB,GAAGA,EAAI,GAAG;AAAA,IAClC,GAAIA,EAAI,YAAY;AAAA,MAClB,WACE;AAAA,MACF,UAAU,eAAeA,EAAI,SAAS,OAAO,QAAQ,MAAM,MAAMA,EAAI,SAAS,QAAQ,QAAQ,MAAM;AAAA,MACpG,cAAc,GAAGA,EAAI,SAAS,OAAO,QAAQ,OAAO;AAAA,IAAA;AAAA,EACtD;AAGF,SACE,gBAAArB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,IAAG;AAAA,MACH,MAAK;AAAA,MACL,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAtB;AAAA,MAAA;AAAA,MAEF,KAAK+C,EAA0BL,EAAI,eAAeA,EAAI,WAAWhB,CAAG;AAAA,MACpE,OAAO6B;AAAA,MACP,WAAWD;AAAA,MACV,GAAGrD;AAAA,MAEH,UAAAuD,EAAS;AAAA,QAAIzD;AAAA,QAAU,CAAC0D,GAAOhB,MAC9BiB,EAAuCD,CAAK,IAAIE,EAAaF,GAAO,EAAE,OAAAhB,EAAA,CAAO,IAAIgB;AAAA,MAAA;AAAA,IACnF;AAAA,EAAA;AAGN;AAEAP,EAAmB,cAAc;ACvG1B,MAAMU,IAA0B,CAAC,EAAE,cAAcC,GAAW,GAAG5D,QAA4B;AAChG,QAAMyC,IAAMC,EAAWtD,CAAoB,GAErCyE,IAAiB,MAAM;AAC3B,IAAIpB,EAAI,cACNA,EAAI,KAAK,EAAE,UAAUA,EAAI,gBAAgB,IAEzCA,EAAI,KAAK,GAAG,EAAE,UAAUA,EAAI,gBAAgB;AAAA,EAEhD,GAGMqB,IAAa,EADKrB,EAAI,SAAS,QAAQA,EAAI,SAAS,UAClB,CAACA,EAAI,QAAQ,CAACA,EAAI,SAAS;AAEnE,SACE,gBAAArB;AAAA,IAAC2C;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,MAAK;AAAA,MACL,QAAO;AAAA,MACP,QAAO;AAAA,MACP,WAAW1C;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,SAASwC;AAAA,MACT,UAAUC;AAAA,MACV,cAAYF;AAAA,MACZ,iBAAc;AAAA,MACb,GAAG5D;AAAA,MAEJ,UAAA,gBAAAoB,EAAC4C,GAAA,EACC,UAAA,gBAAA5C,EAAC6C,GAAA,CAAA,CAAmB,EAAA,CACtB;AAAA,IAAA;AAAA,EAAA;AAGN;AAEAN,EAAwB,cAAc;ACrC/B,MAAMO,IAA0B,CAAC;AAAA,EACtC,cAAcN;AAAA,EAEd,GAAG5D;AACL,MAAuB;AACrB,QAAMyC,IAAMC,EAAWtD,CAAoB,GAErC+E,IAAiB,MAAM;AAI3B,IAFE1B,EAAI,oBAAoB,MAAMA,EAAI,cAAc,SAAS,cAAc,KAAK,IAG5EA,EAAI,KAAK,GAAG,EAAE,UAAUA,EAAI,gBAAgB,IACnCA,EAAI,cACbA,EAAI,KAAK,EAAE,UAAUA,EAAI,gBAAgB,IAEzCA,EAAI,KAAKA,EAAI,MAAM,SAAS,GAAG,EAAE,UAAUA,EAAI,gBAAgB;AAAA,EAEnE,GAGMqB,IAAa,EADKrB,EAAI,SAAS,QAAQA,EAAI,SAAS,UAClB,CAACA,EAAI,QAAQ,CAACA,EAAI,SAAS;AAEnE,SACE,gBAAArB;AAAA,IAAC2C;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,MAAK;AAAA,MACL,QAAO;AAAA,MACP,QAAO;AAAA,MACP,WAAW1C;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,SAAS8C;AAAA,MACT,UAAUL;AAAA,MACV,cAAYF;AAAA,MACZ,iBAAc;AAAA,MACb,GAAG5D;AAAA,MAEJ,UAAA,gBAAAoB,EAAC4C,GAAA,EACC,UAAA,gBAAA5C,EAACgD,GAAA,CAAA,CAAkB,EAAA,CACrB;AAAA,IAAA;AAAA,EAAA;AAGN;AAEAF,EAAwB,cAAc;AC5C/B,MAAMG,IAA0B,CAAC,EAAE,UAAAvE,GAAU,GAAGE,QAAkB;AACvE,QAAMyC,IAAMC,EAAWtD,CAAoB;AAE3C,SACE,gBAAAgC;AAAA,IAACkD;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,QAAO;AAAA,MACP,QAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAWjD;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,SAASoB,EAAI;AAAA,MACZ,GAAGzC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAuE,EAAwB,cAAc;ACvB/B,MAAM/E,IAOT,OAAO,OAAOiF,GAAM;AAAA,EAAA,UACtBC;AAAAA,EAAA,YACAC;AAAAA,EAAA,YACAC;AAAAA,EAAA,MACAC;AAAAA,EAAA,OACAC;AAAAA,EAAA,YACAC;AACF,CAAC;AAEDvF,EAAc,cAAc;"}

package/dist/segmented-gauge/index.d.mts

@@ -0,0 +1,13 @@
+import { SegmentedGauge as Root } from './SegmentedGauge';
+import { SegmentedGaugeLabel } from './SegmentedGaugeLabel';
+import { SegmentedGaugeSegment } from './SegmentedGaugeSegment';
+import { SegmentedGaugeTrack } from './SegmentedGaugeTrack';
+export declare const SegmentedGauge: typeof Root & {
+    Track: typeof SegmentedGaugeTrack;
+    Segment: typeof SegmentedGaugeSegment;
+    Label: typeof SegmentedGaugeLabel;
+};
+export { type SegmentedGaugeProps } from './SegmentedGauge';
+export { type SegmentedGaugeTrackProps } from './SegmentedGaugeTrack';
+export { type SegmentedGaugeSegmentProps } from './SegmentedGaugeSegment';
+export { type SegmentedGaugeLabelProps } from './SegmentedGaugeLabel';

package/dist/segmented-gauge/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),x=require("../index-DnaHaH_0.js"),d=require("react"),C=d.createContext(null),I=()=>{const e=d.useContext(C);if(!e)throw new Error("useSegmentedGaugeContext must be used within a SegmentedGauge provider");return e},G=({className:e,children:a,ref:t,id:r,...c})=>{const{labelId:n}=I();return s.jsx("span",{"data-spark-component":"segmented-gauge-label","data-testid":"segmented-gauge-label",ref:t,id:r||n,className:x.cx("default:text-on-surface default:text-body-2",e),...c,children:a})};G.displayName="SegmentedGauge.Label";const h=({index:e=0,className:a,children:t,ref:r,...c})=>{const{size:n,intent:g,customColor:o,currentIndex:m}=I(),i=m!==-1&&e<=m,p=m!==-1&&e===m,S=d.useMemo(()=>{if(o)return o;switch(g){case"main":return"var(--color-main)";case"support":return"var(--color-support)";case"basic":return"var(--color-basic)";case"accent":return"var(--color-accent)";case"success":return"var(--color-success)";case"alert":return"var(--color-alert)";case"danger":return"var(--color-error)";case"info":return"var(--color-info)";case"neutral":return"var(--color-neutral)";default:return"var(--color-neutral)"}},[g,o]),j=x.cx("border-outline relative rounded-full",{"h-sz-8 w-sz-24":n==="sm","h-sz-12 w-sz-36":n==="md","default:bg-[var(--gauge-color)]":i,"border-sm bg-surface":!i},a),u=x.cx("absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2","default:bg-surface default:rounded-full","border-[var(--gauge-color)]",{"size-sz-12 border-md":n==="sm","size-sz-20 border-lg":n==="md"});return s.jsxs("div",{"data-spark-component":"segmented-gauge-segment","data-testid":"segmented-gauge-segment","data-active":i,"data-current":p,ref:r,style:{"--gauge-color":S},className:j,...c,children:[t,p&&s.jsx("div",{className:u,"aria-hidden":"true"})]})};h.displayName="SegmentedGauge.Segment";const y=({className:e,children:a,ref:t,...r})=>s.jsx("div",{"data-spark-component":"segmented-gauge-track",ref:t,className:x.cx("gap-sm relative flex rounded-full",e),...r,children:a});y.displayName="SegmentedGauge.Track";const q=(e,a,t,r)=>{if(e==null)return-1;const c=Math.max(a,Math.min(t,e)),g=(t-a)/(r-1),o=(c-a)/g;return Math.max(0,Math.min(r-1,Math.round(o)))},z=({value:e,min:a,max:t,description:r,size:c="md",intent:n="neutral",customColor:g,id:o,"aria-label":m,className:i,ref:p,children:S,...j})=>{const u=t-a+1,l=d.useMemo(()=>q(e,a,t,u),[e,a,t,u]),v=d.useId(),k=d.useId(),f=o||k,N=d.useMemo(()=>Array.from({length:u},(T,b)=>({isActive:l!==-1&&b<=l,isCurrent:l!==-1&&b===l})),[u,l]),w=d.useMemo(()=>({value:e,min:a,max:t,segments:u,currentIndex:l,size:c,intent:n,customColor:g,labelId:v,gaugeId:f}),[e,a,t,u,l,c,n,g,v,f]),L=e!=null?{role:"meter","aria-valuenow":e,"aria-valuemin":a,"aria-valuemax":t}:{role:"status"};return s.jsx(C.Provider,{value:w,children:s.jsx("div",{id:f,"data-spark-component":"segmented-gauge",ref:p,className:x.cx("gap-md flex flex-wrap items-center",i),...L,"aria-labelledby":o?`${f}-label`:void 0,"aria-label":o?void 0:m,"aria-describedby":v,...j,children:S?S({segments:N,currentIndex:l}):s.jsxs(s.Fragment,{children:[s.jsx(y,{children:N.map((T,b)=>s.jsx(h,{index:b},b))}),r&&s.jsx(G,{id:v,children:r})]})})})};z.displayName="SegmentedGauge";const M=Object.assign(z,{Track:y,Segment:h,Label:G});M.displayName="SegmentedGauge";y.displayName="SegmentedGauge.Track";h.displayName="SegmentedGauge.Segment";G.displayName="SegmentedGauge.Label";exports.SegmentedGauge=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),p=require("class-variance-authority"),d=require("react"),C=d.createContext(null),I=()=>{const e=d.useContext(C);if(!e)throw new Error("useSegmentedGaugeContext must be used within a SegmentedGauge provider");return e},h=({className:e,children:a,ref:t,id:r,...c})=>{const{labelId:n}=I();return s.jsx("span",{"data-spark-component":"segmented-gauge-label","data-testid":"segmented-gauge-label",ref:t,id:r||n,className:p.cx("default:text-on-surface default:text-body-2",e),...c,children:a})};h.displayName="SegmentedGauge.Label";const G=({index:e=0,className:a,children:t,ref:r,...c})=>{const{size:n,intent:g,customColor:o,currentIndex:m}=I(),i=m!==-1&&e<=m,x=m!==-1&&e===m,S=d.useMemo(()=>{if(o)return o;switch(g){case"main":return"var(--color-main)";case"support":return"var(--color-support)";case"basic":return"var(--color-basic)";case"accent":return"var(--color-accent)";case"success":return"var(--color-success)";case"alert":return"var(--color-alert)";case"danger":return"var(--color-error)";case"info":return"var(--color-info)";case"neutral":return"var(--color-neutral)";default:return"var(--color-neutral)"}},[g,o]),j=p.cx("border-outline relative rounded-full",{"h-sz-8 w-sz-24":n==="sm","h-sz-12 w-sz-36":n==="md","default:bg-[var(--gauge-color)]":i,"border-sm bg-surface":!i},a),u=p.cx("absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2","default:bg-surface default:rounded-full","border-[var(--gauge-color)]",{"size-sz-12 border-md":n==="sm","size-sz-20 border-lg":n==="md"});return s.jsxs("div",{"data-spark-component":"segmented-gauge-segment","data-testid":"segmented-gauge-segment","data-active":i,"data-current":x,ref:r,style:{"--gauge-color":S},className:j,...c,children:[t,x&&s.jsx("div",{className:u,"aria-hidden":"true"})]})};G.displayName="SegmentedGauge.Segment";const y=({className:e,children:a,ref:t,...r})=>s.jsx("div",{"data-spark-component":"segmented-gauge-track",ref:t,className:p.cx("gap-sm relative flex rounded-full",e),...r,children:a});y.displayName="SegmentedGauge.Track";const A=(e,a,t,r)=>{if(e==null)return-1;const c=Math.max(a,Math.min(t,e)),g=(t-a)/(r-1),o=(c-a)/g;return Math.max(0,Math.min(r-1,Math.round(o)))},z=({value:e,min:a,max:t,description:r,size:c="md",intent:n="neutral",customColor:g,id:o,"aria-label":m,className:i,ref:x,children:S,...j})=>{const u=t-a+1,l=d.useMemo(()=>A(e,a,t,u),[e,a,t,u]),v=d.useId(),k=d.useId(),f=o||k,N=d.useMemo(()=>Array.from({length:u},(T,b)=>({isActive:l!==-1&&b<=l,isCurrent:l!==-1&&b===l})),[u,l]),w=d.useMemo(()=>({value:e,min:a,max:t,segments:u,currentIndex:l,size:c,intent:n,customColor:g,labelId:v,gaugeId:f}),[e,a,t,u,l,c,n,g,v,f]),L=e!=null?{role:"meter","aria-valuenow":e,"aria-valuemin":a,"aria-valuemax":t}:{role:"status"};return s.jsx(C.Provider,{value:w,children:s.jsx("div",{id:f,"data-spark-component":"segmented-gauge",ref:x,className:p.cx("gap-md flex flex-wrap items-center",i),...L,"aria-labelledby":o?`${f}-label`:void 0,"aria-label":o?void 0:m,"aria-describedby":v,...j,children:S?S({segments:N,currentIndex:l}):s.jsxs(s.Fragment,{children:[s.jsx(y,{children:N.map((T,b)=>s.jsx(G,{index:b},b))}),r&&s.jsx(h,{id:v,children:r})]})})})};z.displayName="SegmentedGauge";const M=Object.assign(z,{Track:y,Segment:G,Label:h});M.displayName="SegmentedGauge";y.displayName="SegmentedGauge.Track";G.displayName="SegmentedGauge.Segment";h.displayName="SegmentedGauge.Label";exports.SegmentedGauge=M;
 //# sourceMappingURL=index.js.map

package/dist/segmented-gauge/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/segmented-gauge/SegmentedGaugeContext.tsx","../../src/segmented-gauge/SegmentedGaugeLabel.tsx","../../src/segmented-gauge/SegmentedGaugeSegment.tsx","../../src/segmented-gauge/SegmentedGaugeTrack.tsx","../../src/segmented-gauge/SegmentedGauge.tsx","../../src/segmented-gauge/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport interface SegmentedGaugeContextValue {\n  value?: number\n  min: number\n  max: number\n  segments: number\n  currentIndex: number\n  size: 'sm' | 'md'\n  intent:\n    | 'main'\n    | 'support'\n    | 'basic'\n    | 'accent'\n    | 'success'\n    | 'alert'\n    | 'danger'\n    | 'info'\n    | 'neutral'\n  customColor?: string\n  labelId: string\n  gaugeId: string\n}\n\nexport const SegmentedGaugeContext = createContext<SegmentedGaugeContextValue | null>(null)\n\nexport const useSegmentedGaugeContext = () => {\n  const context = useContext(SegmentedGaugeContext)\n\n  if (!context) {\n    throw new Error('useSegmentedGaugeContext must be used within a SegmentedGauge provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useSegmentedGaugeContext } from './SegmentedGaugeContext'\n\nexport interface SegmentedGaugeLabelProps extends ComponentProps<'span'> {\n  ref?: Ref<HTMLSpanElement>\n  id?: string\n}\n\nexport const SegmentedGaugeLabel = ({\n  className,\n  children,\n  ref,\n  id,\n  ...props\n}: SegmentedGaugeLabelProps) => {\n  const { labelId } = useSegmentedGaugeContext()\n\n  return (\n    <span\n      data-spark-component=\"segmented-gauge-label\"\n      data-testid=\"segmented-gauge-label\"\n      ref={ref}\n      id={id || labelId}\n      className={cx('default:text-on-surface default:text-body-2', className)}\n      {...props}\n    >\n      {children}\n    </span>\n  )\n}\n\nSegmentedGaugeLabel.displayName = 'SegmentedGauge.Label'\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref, useMemo } from 'react'\n\nimport { useSegmentedGaugeContext } from './SegmentedGaugeContext'\n\nexport interface SegmentedGaugeSegmentProps extends ComponentProps<'div'> {\n  /**\n   * Index of this segment (0-based)\n   */\n  index?: number\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SegmentedGaugeSegment = ({\n  index = 0,\n  className,\n  children,\n  ref,\n  ...props\n}: SegmentedGaugeSegmentProps) => {\n  const { size, intent, customColor, currentIndex } = useSegmentedGaugeContext()\n\n  // Calculate isActive and isCurrent from context and index\n  const isActive = currentIndex !== -1 && index <= currentIndex\n  const isCurrent = currentIndex !== -1 && index === currentIndex\n\n  const gaugeColor = useMemo(() => {\n    // If customColor is provided, use it\n    if (customColor) {\n      return customColor\n    }\n\n    // Handle predefined intents\n    switch (intent) {\n      case 'main':\n        return 'var(--color-main)'\n      case 'support':\n        return 'var(--color-support)'\n      case 'basic':\n        return 'var(--color-basic)'\n      case 'accent':\n        return 'var(--color-accent)'\n      case 'success':\n        return 'var(--color-success)'\n      case 'alert':\n        return 'var(--color-alert)'\n      case 'danger':\n        return 'var(--color-error)'\n      case 'info':\n        return 'var(--color-info)'\n      case 'neutral':\n        return 'var(--color-neutral)'\n      default:\n        return 'var(--color-neutral)'\n    }\n  }, [intent, customColor])\n\n  const segmentClasses = cx(\n    'border-outline relative rounded-full',\n    {\n      'h-sz-8 w-sz-24': size === 'sm',\n      'h-sz-12 w-sz-36': size === 'md',\n      'default:bg-[var(--gauge-color)]': isActive,\n      'border-sm bg-surface': !isActive,\n    },\n    className\n  )\n\n  const indicatorClasses = cx(\n    'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n    'default:bg-surface default:rounded-full',\n    'border-[var(--gauge-color)]',\n    {\n      'size-sz-12 border-md': size === 'sm',\n      'size-sz-20 border-lg': size === 'md',\n    }\n  )\n\n  return (\n    <div\n      data-spark-component=\"segmented-gauge-segment\"\n      data-testid=\"segmented-gauge-segment\"\n      data-active={isActive}\n      data-current={isCurrent}\n      ref={ref}\n      style={\n        {\n          '--gauge-color': gaugeColor,\n        } as React.CSSProperties\n      }\n      className={segmentClasses}\n      {...props}\n    >\n      {children}\n      {isCurrent && <div className={indicatorClasses} aria-hidden=\"true\" />}\n    </div>\n  )\n}\n\nSegmentedGaugeSegment.displayName = 'SegmentedGauge.Segment'\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface SegmentedGaugeTrackProps extends ComponentProps<'div'> {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SegmentedGaugeTrack = ({\n  className,\n  children,\n  ref,\n  ...props\n}: SegmentedGaugeTrackProps) => {\n  return (\n    <div\n      data-spark-component=\"segmented-gauge-track\"\n      ref={ref}\n      className={cx('gap-sm relative flex rounded-full', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nSegmentedGaugeTrack.displayName = 'SegmentedGauge.Track'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId, useMemo } from 'react'\n\nimport { SegmentedGaugeContext } from './SegmentedGaugeContext'\nimport { SegmentedGaugeLabel } from './SegmentedGaugeLabel'\nimport { SegmentedGaugeSegment } from './SegmentedGaugeSegment'\nimport { SegmentedGaugeTrack } from './SegmentedGaugeTrack'\n\nconst calculateCurrentIndex = (\n  value: number | undefined,\n  min: number,\n  max: number,\n  segments: number\n) => {\n  // If value is undefined or null, no segment is active\n  if (value == null) {\n    return -1\n  }\n  const normalizedValue = Math.max(min, Math.min(max, value))\n  const range = max - min\n  const segmentSize = range / (segments - 1)\n  const rawIndex = (normalizedValue - min) / segmentSize\n\n  // Clamp the index to valid range\n  return Math.max(0, Math.min(segments - 1, Math.round(rawIndex)))\n}\n\nexport interface SegmentedGaugeProps {\n  /**\n   * The current value of the gauge\n   */\n  value?: number\n  /**\n   * Minimum value of the gauge (aria-valuemin)\n   */\n  min: number\n  /**\n   * Maximum value of the gauge (aria-valuemax)\n   */\n  max: number\n  /**\n   * Description text for the gauge (aria-describedby)\n   */\n  description?: string\n  /**\n   * Size of the gauge\n   */\n  size?: 'sm' | 'md'\n  /**\n   * Intent of the gauge - predefined color intent\n   */\n  intent?:\n    | 'main'\n    | 'support'\n    | 'basic'\n    | 'accent'\n    | 'success'\n    | 'alert'\n    | 'danger'\n    | 'info'\n    | 'neutral'\n  /**\n   * Custom color for the gauge (hex, CSS variable, etc.)\n   */\n  customColor?: string\n  /**\n   * ID of the gauge element\n   */\n  id?: string\n  /**\n   * Accessible label for the gauge (required if no id is provided)\n   */\n  'aria-label'?: string\n  /**\n   * Textual representation of the current value (aria-valuetext)\n   * By default, percentage is used (e.g. \"33%\")\n   */\n  'aria-valuetext'?: string\n  /**\n   * Additional CSS classes\n   */\n  className?: string\n  /**\n   * Ref to the root element\n   */\n  ref?: Ref<HTMLDivElement>\n  /**\n   * Children render prop for custom rendering\n   */\n  children?: (props: {\n    segments: {\n      isActive: boolean\n      isCurrent: boolean\n    }[]\n    currentIndex: number\n  }) => React.ReactNode\n}\n\nexport const SegmentedGauge = ({\n  value,\n  min,\n  max,\n  description,\n  size = 'md',\n  intent = 'neutral',\n  customColor,\n  id,\n  'aria-label': ariaLabel,\n  className,\n  ref,\n  children,\n  ...props\n}: SegmentedGaugeProps) => {\n  // Calculate segments from min and max\n  const segments = max - min + 1\n  const currentIndex = useMemo(\n    () => calculateCurrentIndex(value, min, max, segments),\n    [value, min, max, segments]\n  )\n\n  // Generate unique IDs\n  const internalLabelId = useId()\n  const generatedId = useId()\n  // Use provided id or generated one for the gauge element\n  const gaugeId = id || generatedId\n\n  const segmentsData = useMemo(() => {\n    return Array.from({ length: segments }, (_, index) => ({\n      isActive: currentIndex !== -1 && index <= currentIndex,\n      isCurrent: currentIndex !== -1 && index === currentIndex,\n    }))\n  }, [segments, currentIndex])\n\n  const contextValue = useMemo(\n    () => ({\n      value,\n      min,\n      max,\n      segments,\n      currentIndex,\n      size,\n      intent,\n      customColor,\n      labelId: internalLabelId,\n      gaugeId,\n    }),\n    [value, min, max, segments, currentIndex, size, intent, customColor, internalLabelId, gaugeId]\n  )\n\n  /**\n   * A `meter` role MUST have a value. If the value is not available, the component uses a `status` role instead.\n   */\n  const roleProps =\n    value != null\n      ? {\n          role: 'meter',\n          'aria-valuenow': value,\n          'aria-valuemin': min,\n          'aria-valuemax': max,\n        }\n      : {\n          role: 'status',\n        }\n\n  return (\n    <SegmentedGaugeContext.Provider value={contextValue}>\n      <div\n        id={gaugeId}\n        data-spark-component=\"segmented-gauge\"\n        ref={ref}\n        className={cx('gap-md flex flex-wrap items-center', className)}\n        {...roleProps}\n        aria-labelledby={id ? `${gaugeId}-label` : undefined}\n        aria-label={!id ? ariaLabel : undefined}\n        aria-describedby={internalLabelId}\n        {...props}\n      >\n        {children ? (\n          children({\n            segments: segmentsData,\n            currentIndex,\n          })\n        ) : (\n          <>\n            <SegmentedGaugeTrack>\n              {segmentsData.map((_, index) => (\n                <SegmentedGaugeSegment key={index} index={index} />\n              ))}\n            </SegmentedGaugeTrack>\n\n            {description && (\n              <SegmentedGaugeLabel id={internalLabelId}>{description}</SegmentedGaugeLabel>\n            )}\n          </>\n        )}\n      </div>\n    </SegmentedGaugeContext.Provider>\n  )\n}\n\nSegmentedGauge.displayName = 'SegmentedGauge'\n","import { SegmentedGauge as Root } from './SegmentedGauge'\nimport { SegmentedGaugeLabel } from './SegmentedGaugeLabel'\nimport { SegmentedGaugeSegment } from './SegmentedGaugeSegment'\nimport { SegmentedGaugeTrack } from './SegmentedGaugeTrack'\n\nexport const SegmentedGauge: typeof Root & {\n  Track: typeof SegmentedGaugeTrack\n  Segment: typeof SegmentedGaugeSegment\n  Label: typeof SegmentedGaugeLabel\n} = Object.assign(Root, {\n  Track: SegmentedGaugeTrack,\n  Segment: SegmentedGaugeSegment,\n  Label: SegmentedGaugeLabel,\n})\n\nSegmentedGauge.displayName = 'SegmentedGauge'\nSegmentedGaugeTrack.displayName = 'SegmentedGauge.Track'\nSegmentedGaugeSegment.displayName = 'SegmentedGauge.Segment'\nSegmentedGaugeLabel.displayName = 'SegmentedGauge.Label'\n\nexport { type SegmentedGaugeProps } from './SegmentedGauge'\nexport { type SegmentedGaugeTrackProps } from './SegmentedGaugeTrack'\nexport { type SegmentedGaugeSegmentProps } from './SegmentedGaugeSegment'\nexport { type SegmentedGaugeLabelProps } from './SegmentedGaugeLabel'\n"],"names":["SegmentedGaugeContext","createContext","useSegmentedGaugeContext","context","useContext","SegmentedGaugeLabel","className","children","ref","id","props","labelId","jsx","cx","SegmentedGaugeSegment","index","size","intent","customColor","currentIndex","isActive","isCurrent","gaugeColor","useMemo","segmentClasses","indicatorClasses","jsxs","SegmentedGaugeTrack","calculateCurrentIndex","value","min","max","segments","normalizedValue","segmentSize","rawIndex","SegmentedGauge","description","ariaLabel","internalLabelId","useId","generatedId","gaugeId","segmentsData","_","contextValue","roleProps","Fragment","Root"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/segmented-gauge/SegmentedGaugeContext.tsx","../../src/segmented-gauge/SegmentedGaugeLabel.tsx","../../src/segmented-gauge/SegmentedGaugeSegment.tsx","../../src/segmented-gauge/SegmentedGaugeTrack.tsx","../../src/segmented-gauge/SegmentedGauge.tsx","../../src/segmented-gauge/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport interface SegmentedGaugeContextValue {\n  value?: number\n  min: number\n  max: number\n  segments: number\n  currentIndex: number\n  size: 'sm' | 'md'\n  intent:\n    | 'main'\n    | 'support'\n    | 'basic'\n    | 'accent'\n    | 'success'\n    | 'alert'\n    | 'danger'\n    | 'info'\n    | 'neutral'\n  customColor?: string\n  labelId: string\n  gaugeId: string\n}\n\nexport const SegmentedGaugeContext = createContext<SegmentedGaugeContextValue | null>(null)\n\nexport const useSegmentedGaugeContext = () => {\n  const context = useContext(SegmentedGaugeContext)\n\n  if (!context) {\n    throw new Error('useSegmentedGaugeContext must be used within a SegmentedGauge provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useSegmentedGaugeContext } from './SegmentedGaugeContext'\n\nexport interface SegmentedGaugeLabelProps extends ComponentProps<'span'> {\n  ref?: Ref<HTMLSpanElement>\n  id?: string\n}\n\nexport const SegmentedGaugeLabel = ({\n  className,\n  children,\n  ref,\n  id,\n  ...props\n}: SegmentedGaugeLabelProps) => {\n  const { labelId } = useSegmentedGaugeContext()\n\n  return (\n    <span\n      data-spark-component=\"segmented-gauge-label\"\n      data-testid=\"segmented-gauge-label\"\n      ref={ref}\n      id={id || labelId}\n      className={cx('default:text-on-surface default:text-body-2', className)}\n      {...props}\n    >\n      {children}\n    </span>\n  )\n}\n\nSegmentedGaugeLabel.displayName = 'SegmentedGauge.Label'\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref, useMemo } from 'react'\n\nimport { useSegmentedGaugeContext } from './SegmentedGaugeContext'\n\nexport interface SegmentedGaugeSegmentProps extends ComponentProps<'div'> {\n  /**\n   * Index of this segment (0-based)\n   */\n  index?: number\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SegmentedGaugeSegment = ({\n  index = 0,\n  className,\n  children,\n  ref,\n  ...props\n}: SegmentedGaugeSegmentProps) => {\n  const { size, intent, customColor, currentIndex } = useSegmentedGaugeContext()\n\n  // Calculate isActive and isCurrent from context and index\n  const isActive = currentIndex !== -1 && index <= currentIndex\n  const isCurrent = currentIndex !== -1 && index === currentIndex\n\n  const gaugeColor = useMemo(() => {\n    // If customColor is provided, use it\n    if (customColor) {\n      return customColor\n    }\n\n    // Handle predefined intents\n    switch (intent) {\n      case 'main':\n        return 'var(--color-main)'\n      case 'support':\n        return 'var(--color-support)'\n      case 'basic':\n        return 'var(--color-basic)'\n      case 'accent':\n        return 'var(--color-accent)'\n      case 'success':\n        return 'var(--color-success)'\n      case 'alert':\n        return 'var(--color-alert)'\n      case 'danger':\n        return 'var(--color-error)'\n      case 'info':\n        return 'var(--color-info)'\n      case 'neutral':\n        return 'var(--color-neutral)'\n      default:\n        return 'var(--color-neutral)'\n    }\n  }, [intent, customColor])\n\n  const segmentClasses = cx(\n    'border-outline relative rounded-full',\n    {\n      'h-sz-8 w-sz-24': size === 'sm',\n      'h-sz-12 w-sz-36': size === 'md',\n      'default:bg-[var(--gauge-color)]': isActive,\n      'border-sm bg-surface': !isActive,\n    },\n    className\n  )\n\n  const indicatorClasses = cx(\n    'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n    'default:bg-surface default:rounded-full',\n    'border-[var(--gauge-color)]',\n    {\n      'size-sz-12 border-md': size === 'sm',\n      'size-sz-20 border-lg': size === 'md',\n    }\n  )\n\n  return (\n    <div\n      data-spark-component=\"segmented-gauge-segment\"\n      data-testid=\"segmented-gauge-segment\"\n      data-active={isActive}\n      data-current={isCurrent}\n      ref={ref}\n      style={\n        {\n          '--gauge-color': gaugeColor,\n        } as React.CSSProperties\n      }\n      className={segmentClasses}\n      {...props}\n    >\n      {children}\n      {isCurrent && <div className={indicatorClasses} aria-hidden=\"true\" />}\n    </div>\n  )\n}\n\nSegmentedGaugeSegment.displayName = 'SegmentedGauge.Segment'\n","import { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface SegmentedGaugeTrackProps extends ComponentProps<'div'> {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SegmentedGaugeTrack = ({\n  className,\n  children,\n  ref,\n  ...props\n}: SegmentedGaugeTrackProps) => {\n  return (\n    <div\n      data-spark-component=\"segmented-gauge-track\"\n      ref={ref}\n      className={cx('gap-sm relative flex rounded-full', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nSegmentedGaugeTrack.displayName = 'SegmentedGauge.Track'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId, useMemo } from 'react'\n\nimport { SegmentedGaugeContext } from './SegmentedGaugeContext'\nimport { SegmentedGaugeLabel } from './SegmentedGaugeLabel'\nimport { SegmentedGaugeSegment } from './SegmentedGaugeSegment'\nimport { SegmentedGaugeTrack } from './SegmentedGaugeTrack'\n\nconst calculateCurrentIndex = (\n  value: number | undefined,\n  min: number,\n  max: number,\n  segments: number\n) => {\n  // If value is undefined or null, no segment is active\n  if (value == null) {\n    return -1\n  }\n  const normalizedValue = Math.max(min, Math.min(max, value))\n  const range = max - min\n  const segmentSize = range / (segments - 1)\n  const rawIndex = (normalizedValue - min) / segmentSize\n\n  // Clamp the index to valid range\n  return Math.max(0, Math.min(segments - 1, Math.round(rawIndex)))\n}\n\nexport interface SegmentedGaugeProps {\n  /**\n   * The current value of the gauge\n   */\n  value?: number\n  /**\n   * Minimum value of the gauge (aria-valuemin)\n   */\n  min: number\n  /**\n   * Maximum value of the gauge (aria-valuemax)\n   */\n  max: number\n  /**\n   * Description text for the gauge (aria-describedby)\n   */\n  description?: string\n  /**\n   * Size of the gauge\n   */\n  size?: 'sm' | 'md'\n  /**\n   * Intent of the gauge - predefined color intent\n   */\n  intent?:\n    | 'main'\n    | 'support'\n    | 'basic'\n    | 'accent'\n    | 'success'\n    | 'alert'\n    | 'danger'\n    | 'info'\n    | 'neutral'\n  /**\n   * Custom color for the gauge (hex, CSS variable, etc.)\n   */\n  customColor?: string\n  /**\n   * ID of the gauge element\n   */\n  id?: string\n  /**\n   * Accessible label for the gauge (required if no id is provided)\n   */\n  'aria-label'?: string\n  /**\n   * Textual representation of the current value (aria-valuetext)\n   * By default, percentage is used (e.g. \"33%\")\n   */\n  'aria-valuetext'?: string\n  /**\n   * Additional CSS classes\n   */\n  className?: string\n  /**\n   * Ref to the root element\n   */\n  ref?: Ref<HTMLDivElement>\n  /**\n   * Children render prop for custom rendering\n   */\n  children?: (props: {\n    segments: {\n      isActive: boolean\n      isCurrent: boolean\n    }[]\n    currentIndex: number\n  }) => React.ReactNode\n}\n\nexport const SegmentedGauge = ({\n  value,\n  min,\n  max,\n  description,\n  size = 'md',\n  intent = 'neutral',\n  customColor,\n  id,\n  'aria-label': ariaLabel,\n  className,\n  ref,\n  children,\n  ...props\n}: SegmentedGaugeProps) => {\n  // Calculate segments from min and max\n  const segments = max - min + 1\n  const currentIndex = useMemo(\n    () => calculateCurrentIndex(value, min, max, segments),\n    [value, min, max, segments]\n  )\n\n  // Generate unique IDs\n  const internalLabelId = useId()\n  const generatedId = useId()\n  // Use provided id or generated one for the gauge element\n  const gaugeId = id || generatedId\n\n  const segmentsData = useMemo(() => {\n    return Array.from({ length: segments }, (_, index) => ({\n      isActive: currentIndex !== -1 && index <= currentIndex,\n      isCurrent: currentIndex !== -1 && index === currentIndex,\n    }))\n  }, [segments, currentIndex])\n\n  const contextValue = useMemo(\n    () => ({\n      value,\n      min,\n      max,\n      segments,\n      currentIndex,\n      size,\n      intent,\n      customColor,\n      labelId: internalLabelId,\n      gaugeId,\n    }),\n    [value, min, max, segments, currentIndex, size, intent, customColor, internalLabelId, gaugeId]\n  )\n\n  /**\n   * A `meter` role MUST have a value. If the value is not available, the component uses a `status` role instead.\n   */\n  const roleProps =\n    value != null\n      ? {\n          role: 'meter',\n          'aria-valuenow': value,\n          'aria-valuemin': min,\n          'aria-valuemax': max,\n        }\n      : {\n          role: 'status',\n        }\n\n  return (\n    <SegmentedGaugeContext.Provider value={contextValue}>\n      <div\n        id={gaugeId}\n        data-spark-component=\"segmented-gauge\"\n        ref={ref}\n        className={cx('gap-md flex flex-wrap items-center', className)}\n        {...roleProps}\n        aria-labelledby={id ? `${gaugeId}-label` : undefined}\n        aria-label={!id ? ariaLabel : undefined}\n        aria-describedby={internalLabelId}\n        {...props}\n      >\n        {children ? (\n          children({\n            segments: segmentsData,\n            currentIndex,\n          })\n        ) : (\n          <>\n            <SegmentedGaugeTrack>\n              {segmentsData.map((_, index) => (\n                <SegmentedGaugeSegment key={index} index={index} />\n              ))}\n            </SegmentedGaugeTrack>\n\n            {description && (\n              <SegmentedGaugeLabel id={internalLabelId}>{description}</SegmentedGaugeLabel>\n            )}\n          </>\n        )}\n      </div>\n    </SegmentedGaugeContext.Provider>\n  )\n}\n\nSegmentedGauge.displayName = 'SegmentedGauge'\n","import { SegmentedGauge as Root } from './SegmentedGauge'\nimport { SegmentedGaugeLabel } from './SegmentedGaugeLabel'\nimport { SegmentedGaugeSegment } from './SegmentedGaugeSegment'\nimport { SegmentedGaugeTrack } from './SegmentedGaugeTrack'\n\nexport const SegmentedGauge: typeof Root & {\n  Track: typeof SegmentedGaugeTrack\n  Segment: typeof SegmentedGaugeSegment\n  Label: typeof SegmentedGaugeLabel\n} = Object.assign(Root, {\n  Track: SegmentedGaugeTrack,\n  Segment: SegmentedGaugeSegment,\n  Label: SegmentedGaugeLabel,\n})\n\nSegmentedGauge.displayName = 'SegmentedGauge'\nSegmentedGaugeTrack.displayName = 'SegmentedGauge.Track'\nSegmentedGaugeSegment.displayName = 'SegmentedGauge.Segment'\nSegmentedGaugeLabel.displayName = 'SegmentedGauge.Label'\n\nexport { type SegmentedGaugeProps } from './SegmentedGauge'\nexport { type SegmentedGaugeTrackProps } from './SegmentedGaugeTrack'\nexport { type SegmentedGaugeSegmentProps } from './SegmentedGaugeSegment'\nexport { type SegmentedGaugeLabelProps } from './SegmentedGaugeLabel'\n"],"names":["SegmentedGaugeContext","createContext","useSegmentedGaugeContext","context","useContext","SegmentedGaugeLabel","className","children","ref","id","props","labelId","jsx","cx","SegmentedGaugeSegment","index","size","intent","customColor","currentIndex","isActive","isCurrent","gaugeColor","useMemo","segmentClasses","indicatorClasses","jsxs","SegmentedGaugeTrack","calculateCurrentIndex","value","min","max","segments","normalizedValue","segmentSize","rawIndex","SegmentedGauge","description","ariaLabel","internalLabelId","useId","generatedId","gaugeId","segmentsData","_","contextValue","roleProps","Fragment","Root"],"mappings":"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"}

package/dist/segmented-gauge/index.mjs

@@ -1,5 +1,5 @@
 import { jsx as d, jsxs as I, Fragment as P } from "react/jsx-runtime";
-import { a as p } from "../index-BmAFn37q.mjs";
+import { cx as p } from "class-variance-authority";
 import { createContext as V, useContext as _, useMemo as h, useId as z } from "react";
 const k = V(null), w = () => {
   const e = _(k);

package/dist/select/index.d.mts

@@ -0,0 +1,21 @@
+import { Select as Root } from './Select';
+import { SelectProvider, useSelectContext } from './SelectContext';
+import { Group } from './SelectGroup';
+import { Item } from './SelectItem';
+import { Items } from './SelectItems';
+import { Label } from './SelectLabel';
+import { LeadingIcon } from './SelectLeadingIcon';
+import { Placeholder } from './SelectPlaceholder';
+import { Trigger } from './SelectTrigger';
+import { Value } from './SelectValue';
+export { useSelectContext, SelectProvider };
+export declare const Select: typeof Root & {
+    Group: typeof Group;
+    Item: typeof Item;
+    Items: typeof Items;
+    Placeholder: typeof Placeholder;
+    Label: typeof Label;
+    Trigger: typeof Trigger;
+    Value: typeof Value;
+    LeadingIcon: typeof LeadingIcon;
+};

package/dist/select/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),ae=require("../form-field/index.js"),ne=require("@spark-ui/hooks/use-combined-state"),r=require("react"),f=require("../index-DnaHaH_0.js"),T=require("../Icon-Bf0XrmiR.js"),oe=require("@spark-ui/icons/ArrowHorizontalDown"),ce=e=>t=>r.Children.toArray(e).filter(r.isValidElement).find(l=>C(l)?.includes(t)),C=e=>e?e.type.displayName:"",A=(e,t=[])=>(r.Children.forEach(e,s=>{if(r.isValidElement(s)){if(C(s)==="Select.Item"||C(s)==="Select.Placeholder"){const l=s.props;t.push({value:l.value,disabled:!!l.disabled,text:l.children})}s.props.children&&A(s.props.children,t)}}),t),M=e=>{const t=new Map;return A(e).forEach(s=>{t.set(s.value,s)}),t},D=r.createContext(null),ie=":select",R=({children:e,defaultValue:t,value:s,onValueChange:l,disabled:o=!1,readOnly:c=!1,state:i,itemsComponent:n,name:d,required:x})=>{const[h,b]=ne.useCombinedState(s,t,l),[S,y]=r.useState(void 0),[m,v]=r.useState(M(n)),[I,p]=r.useState(),_=m.entries().next()?.value?.[1],B=typeof h=="string"?m.get(h):_,J=s!=null,u=ae.useFormFieldControl(),K=u.state||i,Q=`${ie}-field-${r.useId()}`,W=u.id||Q,Y=u.labelId,Z=u.disabled??o,ee=u.readOnly??c,te=u.name??d,se=!!(u.isRequired??x);return r.useEffect(()=>{const k=M(n),V=[...m.values()],N=[...k.values()];(V.length!==N.length||V.some((z,F)=>{const le=z.value!==N[F]?.value,re=z.text!==N[F]?.text;return le||re}))&&v(k)},[e]),a.jsx(D.Provider,{value:{disabled:Z,readOnly:ee,itemsMap:m,state:K,itemsComponent:n,selectedItem:B,setValue:b,isControlled:J,onValueChange:l,ariaLabel:I,setAriaLabel:p,fieldId:W,fieldLabelId:Y,name:te,required:se,placeholder:S,setPlaceholder:y},children:e})},g=()=>{const e=r.useContext(D);if(!e)throw Error("useSelectContext must be used within a Select provider");return e},$=({children:e,...t})=>{const s=ce(e),l=s("Trigger"),o=s("Items");return a.jsx(R,{...t,itemsComponent:o,children:l})};$.displayName="Select";const H=r.createContext(null),de=({children:e})=>{const[t,s]=r.useState("");return a.jsx(H.Provider,{value:{groupLabel:t,setGroupLabel:s},children:e})},U=()=>{const e=r.useContext(H);if(!e)throw Error("useSelectGroupContext must be used within a SelectGroup provider");return e},j=({children:e,ref:t,...s})=>a.jsx(de,{children:a.jsx(ue,{ref:t,...s,children:e})}),ue=({children:e,className:t,ref:s})=>{const{groupLabel:l}=U();return a.jsx("optgroup",{"data-spark-component":"select-group",ref:s,className:f.cx(t),label:l,children:e})};j.displayName="Select.Group";const w=({disabled:e=!1,value:t,children:s,ref:l})=>a.jsx("option",{"data-spark-component":"select-item",ref:l,value:t,disabled:e,children:s},t);w.displayName="Select.Item";const me=f.cva(["absolute left-0 top-0 size-full rounded-lg opacity-0","min-h-sz-44","ring-1 outline-hidden ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"cursor-not-allowed"},readOnly:{true:"cursor-default"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),P=({children:e,className:t,ref:s,...l})=>{const{state:o,disabled:c,readOnly:i,ariaLabel:n,fieldLabelId:d,isControlled:x,onValueChange:h,selectedItem:b,setValue:S,name:y,required:m,fieldId:v}=g(),I=p=>{x?(p.preventDefault(),h?.(p.target.value)):S(p.target.value)};return a.jsx("select",{"data-spark-component":"select-items",ref:s,disabled:c||i,name:y,required:m,"aria-labelledby":d,...n&&{"aria-label":n},className:me({className:t,state:o,disabled:c,readOnly:i}),value:b?.value,onChange:I,id:v,...l,children:e})};P.displayName="Select.Items";const L=({children:e})=>{const{setGroupLabel:t}=U();return r.useEffect(()=>{t(e)},[e]),null};L.displayName="Select.Label";const E=({children:e})=>a.jsx(T.Icon,{size:"sm",className:"shrink-0",children:e});E.displayName="Select.LeadingIcon";const O=({disabled:e=!1,children:t,ref:s})=>{const{setPlaceholder:l}=g();return r.useEffect(()=>{l(t)},[t]),a.jsx("option",{"data-spark-component":"select-placeholder",ref:s,value:"",disabled:e,children:t},"placeholder")};O.displayName="Select.Placeholder";const pe=f.cva(["relative flex w-full items-center justify-between","min-h-sz-44 rounded-lg px-lg","text-body-1","ring-1 outline-hidden ring-inset focus-within:ring-focus"],{variants:{state:{undefined:"ring-outline",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{false:"focus-within:ring-2"},readOnly:{true:""}},compoundVariants:[{readOnly:!1,disabled:!1,class:"bg-surface text-on-surface"},{readOnly:!0,class:"bg-on-surface/dim-5 text-on-surface cursor-default"},{disabled:!0,class:["bg-on-surface/dim-5 text-on-surface/dim-3","cursor-not-allowed"]},{disabled:!1,state:void 0,class:"default:hover:ring-outline-high"}]}),q=({"aria-label":e,children:t,className:s,ref:l})=>{const{disabled:o,readOnly:c,state:i,setAriaLabel:n,itemsComponent:d}=g();return r.useEffect(()=>{e&&n(e)},[e]),a.jsxs("div",{"data-spark-component":"select-trigger",ref:l,className:pe({className:s,state:i,disabled:o,readOnly:c}),children:[a.jsx("span",{className:"gap-md flex items-center justify-start",children:t}),a.jsx(T.Icon,{className:"ml-md shrink-0",size:"sm",children:a.jsx(oe.ArrowHorizontalDown,{})}),d]})};q.displayName="Select.Trigger";const G=({children:e,className:t,placeholder:s,ref:l})=>{const{selectedItem:o,placeholder:c,disabled:i}=g(),n=o?.value==null,d=s||c;return a.jsx("span",{role:"presentation","data-spark-component":"select-value",ref:l,className:f.cx("flex shrink items-center text-left",t),children:a.jsx("span",{className:f.cx("line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis",n&&!i&&"text-on-surface/dim-1"),children:n?d:e||o?.text})})};G.displayName="Select.Value";const X=Object.assign($,{Group:j,Item:w,Items:P,Placeholder:O,Label:L,Trigger:q,Value:G,LeadingIcon:E});X.displayName="Select";j.displayName="Select.Group";P.displayName="Select.Items";w.displayName="Select.Item";O.displayName="Select.Placeholder";L.displayName="Select.Label";q.displayName="Select.Trigger";G.displayName="Select.Value";E.displayName="Select.LeadingIcon";exports.Select=X;exports.SelectProvider=R;exports.useSelectContext=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),ae=require("@spark-ui/components/form-field"),ne=require("@spark-ui/hooks/use-combined-state"),r=require("react"),f=require("class-variance-authority"),M=require("../Icon-CF0W0LKr.js"),oe=require("@spark-ui/icons/ArrowHorizontalDown"),ce=e=>t=>r.Children.toArray(e).filter(r.isValidElement).find(l=>C(l)?.includes(t)),C=e=>e?e.type.displayName:"",T=(e,t=[])=>(r.Children.forEach(e,s=>{if(r.isValidElement(s)){if(C(s)==="Select.Item"||C(s)==="Select.Placeholder"){const l=s.props;t.push({value:l.value,disabled:!!l.disabled,text:l.children})}s.props.children&&T(s.props.children,t)}}),t),F=e=>{const t=new Map;return T(e).forEach(s=>{t.set(s.value,s)}),t},D=r.createContext(null),ie=":select",R=({children:e,defaultValue:t,value:s,onValueChange:l,disabled:o=!1,readOnly:c=!1,state:i,itemsComponent:n,name:d,required:x})=>{const[h,b]=ne.useCombinedState(s,t,l),[S,y]=r.useState(void 0),[m,v]=r.useState(F(n)),[I,p]=r.useState(),_=m.entries().next()?.value?.[1],B=typeof h=="string"?m.get(h):_,J=s!=null,u=ae.useFormFieldControl(),K=u.state||i,Q=`${ie}-field-${r.useId()}`,W=u.id||Q,Y=u.labelId,Z=u.disabled??o,ee=u.readOnly??c,te=u.name??d,se=!!(u.isRequired??x);return r.useEffect(()=>{const V=F(n),k=[...m.values()],N=[...V.values()];(k.length!==N.length||k.some((z,A)=>{const le=z.value!==N[A]?.value,re=z.text!==N[A]?.text;return le||re}))&&v(V)},[e]),a.jsx(D.Provider,{value:{disabled:Z,readOnly:ee,itemsMap:m,state:K,itemsComponent:n,selectedItem:B,setValue:b,isControlled:J,onValueChange:l,ariaLabel:I,setAriaLabel:p,fieldId:W,fieldLabelId:Y,name:te,required:se,placeholder:S,setPlaceholder:y},children:e})},g=()=>{const e=r.useContext(D);if(!e)throw Error("useSelectContext must be used within a Select provider");return e},$=({children:e,...t})=>{const s=ce(e),l=s("Trigger"),o=s("Items");return a.jsx(R,{...t,itemsComponent:o,children:l})};$.displayName="Select";const H=r.createContext(null),de=({children:e})=>{const[t,s]=r.useState("");return a.jsx(H.Provider,{value:{groupLabel:t,setGroupLabel:s},children:e})},U=()=>{const e=r.useContext(H);if(!e)throw Error("useSelectGroupContext must be used within a SelectGroup provider");return e},j=({children:e,ref:t,...s})=>a.jsx(de,{children:a.jsx(ue,{ref:t,...s,children:e})}),ue=({children:e,className:t,ref:s})=>{const{groupLabel:l}=U();return a.jsx("optgroup",{"data-spark-component":"select-group",ref:s,className:f.cx(t),label:l,children:e})};j.displayName="Select.Group";const w=({disabled:e=!1,value:t,children:s,ref:l})=>a.jsx("option",{"data-spark-component":"select-item",ref:l,value:t,disabled:e,children:s},t);w.displayName="Select.Item";const me=f.cva(["absolute left-0 top-0 size-full rounded-lg opacity-0","min-h-sz-44","ring-1 outline-hidden ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"cursor-not-allowed"},readOnly:{true:"cursor-default"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),P=({children:e,className:t,ref:s,...l})=>{const{state:o,disabled:c,readOnly:i,ariaLabel:n,fieldLabelId:d,isControlled:x,onValueChange:h,selectedItem:b,setValue:S,name:y,required:m,fieldId:v}=g(),I=p=>{x?(p.preventDefault(),h?.(p.target.value)):S(p.target.value)};return a.jsx("select",{"data-spark-component":"select-items",ref:s,disabled:c||i,name:y,required:m,"aria-labelledby":d,...n&&{"aria-label":n},className:me({className:t,state:o,disabled:c,readOnly:i}),value:b?.value,onChange:I,id:v,...l,children:e})};P.displayName="Select.Items";const L=({children:e})=>{const{setGroupLabel:t}=U();return r.useEffect(()=>{t(e)},[e]),null};L.displayName="Select.Label";const E=({children:e})=>a.jsx(M.Icon,{size:"sm",className:"shrink-0",children:e});E.displayName="Select.LeadingIcon";const O=({disabled:e=!1,children:t,ref:s})=>{const{setPlaceholder:l}=g();return r.useEffect(()=>{l(t)},[t]),a.jsx("option",{"data-spark-component":"select-placeholder",ref:s,value:"",disabled:e,children:t},"placeholder")};O.displayName="Select.Placeholder";const pe=f.cva(["relative flex w-full items-center justify-between","min-h-sz-44 rounded-lg px-lg","text-body-1","ring-1 outline-hidden ring-inset focus-within:ring-focus"],{variants:{state:{undefined:"ring-outline",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{false:"focus-within:ring-2"},readOnly:{true:""}},compoundVariants:[{readOnly:!1,disabled:!1,class:"bg-surface text-on-surface"},{readOnly:!0,class:"bg-on-surface/dim-5 text-on-surface cursor-default"},{disabled:!0,class:["bg-on-surface/dim-5 text-on-surface/dim-3","cursor-not-allowed"]},{disabled:!1,state:void 0,class:"default:hover:ring-outline-high"}]}),q=({"aria-label":e,children:t,className:s,ref:l})=>{const{disabled:o,readOnly:c,state:i,setAriaLabel:n,itemsComponent:d}=g();return r.useEffect(()=>{e&&n(e)},[e]),a.jsxs("div",{"data-spark-component":"select-trigger",ref:l,className:pe({className:s,state:i,disabled:o,readOnly:c}),children:[a.jsx("span",{className:"gap-md flex items-center justify-start",children:t}),a.jsx(M.Icon,{className:"ml-md shrink-0",size:"sm",children:a.jsx(oe.ArrowHorizontalDown,{})}),d]})};q.displayName="Select.Trigger";const G=({children:e,className:t,placeholder:s,ref:l})=>{const{selectedItem:o,placeholder:c,disabled:i}=g(),n=o?.value==null,d=s||c;return a.jsx("span",{role:"presentation","data-spark-component":"select-value",ref:l,className:f.cx("flex shrink items-center text-left",t),children:a.jsx("span",{className:f.cx("line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis",n&&!i&&"text-on-surface/dim-1"),children:n?d:e||o?.text})})};G.displayName="Select.Value";const X=Object.assign($,{Group:j,Item:w,Items:P,Placeholder:O,Label:L,Trigger:q,Value:G,LeadingIcon:E});X.displayName="Select";j.displayName="Select.Group";P.displayName="Select.Items";w.displayName="Select.Item";O.displayName="Select.Placeholder";L.displayName="Select.Label";q.displayName="Select.Trigger";G.displayName="Select.Value";E.displayName="Select.LeadingIcon";exports.Select=X;exports.SelectProvider=R;exports.useSelectContext=g;
 //# sourceMappingURL=index.js.map

package/dist/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-lg px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"mVAKaA,GAAeC,GAAyBC,GAC7BC,EAAAA,SAAS,QAAQF,CAAQ,EAAE,OAAOG,gBAAc,EAEjD,KAAKC,GACjBC,EAAsBD,CAAK,GAAG,SAASH,CAAI,CACnD,EAGGI,EAAyBC,GACtBA,EAAWA,EAAQ,KAAuC,YAAc,GAG3EC,EAAkB,CAACP,EAAqBQ,EAAuB,MACnEN,EAAAA,SAAS,QAAQF,EAAUI,GAAS,CAClC,GAAKD,EAAAA,eAAeC,CAAK,EAEzB,IACEC,EAAsBD,CAAK,IAAM,eACjCC,EAAsBD,CAAK,IAAM,qBACjC,CACA,MAAMK,EAAaL,EAAM,MACzBI,EAAO,KAAK,CACV,MAAOC,EAAW,MAClB,SAAU,CAAC,CAACA,EAAW,SACvB,KAAMA,EAAW,QAAA,CAClB,CACH,CAEKL,EAAM,MAAkC,UAC3CG,EAAiBH,EAAM,MAAkC,SAAUI,CAAM,EAE7E,CAAC,EAEMA,GAGIE,EAAwBV,GAAkC,CACrE,MAAMW,MAAuB,IAE7B,OAAAJ,EAAgBP,CAAQ,EAAE,QAAQY,GAAY,CAC5CD,EAAO,IAAIC,EAAS,MAAOA,CAAQ,CACrC,CAAC,EAEMD,CACT,EC0BME,EAAgBC,EAAAA,cAAyC,IAAI,EAE7DC,GAAY,UAELC,EAAiB,CAAC,CAC7B,SAAAhB,EACA,aAAAiB,EACA,MAAOC,EACP,cAAAC,EACA,SAAUC,EAAe,GACzB,SAAUC,EAAe,GACzB,MAAOC,EACP,eAAAC,EACA,KAAMC,EACN,SAAUC,CACZ,IAA0B,CACxB,KAAM,CAACC,EAAOC,CAAQ,EAAIC,GAAAA,iBAAiBV,EAAWD,EAAcE,CAAa,EAC3E,CAACU,EAAaC,CAAc,EAAIC,EAAAA,SAA6B,MAAS,EACtE,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAAmBrB,EAAqBa,CAAc,CAAC,EACjF,CAACW,EAAWC,CAAY,EAAIJ,WAAA,EAG5BK,EAAYJ,EAAS,QAAA,EAAU,KAAA,GAAQ,QAAQ,CAAC,EAChDK,EAAe,OAAOX,GAAU,SAAWM,EAAS,IAAIN,CAAK,EAAIU,EACjEE,EAAepB,GAAa,KAG5BqB,EAAQC,GAAAA,oBAAA,EACRC,EAAQF,EAAM,OAASjB,EAEvBoB,EAAkB,GAAG3B,EAAS,UAAU4B,EAAAA,OAAO,GAC/CC,EAAUL,EAAM,IAAMG,EACtBG,EAAeN,EAAM,QACrBO,EAAWP,EAAM,UAAYnB,EAC7B2B,GAAWR,EAAM,UAAYlB,EAC7BpB,GAAOsC,EAAM,MAAQf,EACrBwB,GAAW,CAAC,EAAET,EAAM,YAAcd,GAYxCwB,OAAAA,EAAAA,UAAU,IAAM,CACd,MAAMtC,EAASD,EAAqBa,CAAc,EAE5C2B,EAAgB,CAAC,GAAGlB,EAAS,QAAQ,EACrCmB,EAAW,CAAC,GAAGxC,EAAO,QAAQ,GAGlCuC,EAAc,SAAWC,EAAS,QAClCD,EAAc,KAAK,CAACE,EAAMC,IAAU,CAClC,MAAMC,GAAkBF,EAAK,QAAUD,EAASE,CAAK,GAAG,MAClDE,GAAiBH,EAAK,OAASD,EAASE,CAAK,GAAG,KAEtD,OAAOC,IAAmBC,EAC5B,CAAC,IAGDtB,EAAYtB,CAAM,CAEtB,EAAG,CAACX,CAAQ,CAAC,EAGXwD,EAAAA,IAAC3C,EAAc,SAAd,CACC,MAAO,CACL,SAAAiC,EACA,SAAAC,GACA,SAAAf,EACA,MAAAS,EACA,eAAAlB,EACA,aAAAc,EACA,SAAAV,EACA,aAAAW,EACA,cAAAnB,EACA,UAAAe,EACA,aAAAC,EACA,QAAAS,EACA,aAAAC,EACA,KAAA5C,GACA,SAAA+C,GACA,YAAAnB,EACA,eAAAC,CAAA,EAGD,SAAA9B,CAAA,CAAA,CAGP,EAEayD,EAAmB,IAAM,CACpC,MAAMC,EAAUC,EAAAA,WAAW9C,CAAa,EAExC,GAAI,CAAC6C,EACH,MAAM,MAAM,wDAAwD,EAGtE,OAAOA,CACT,EC7KaE,EAAS,CAAC,CAAE,SAAA5D,EAAU,GAAG6D,KAAyB,CAC7D,MAAMC,EAAS/D,GAAYC,CAAQ,EAC7B+D,EAAUD,EAAO,SAAS,EAC1BE,EAAQF,EAAO,OAAO,EAE5B,aACG9C,EAAA,CAAgB,GAAG6C,EAAO,eAAgBG,EACxC,SAAAD,EACH,CAEJ,EAEAH,EAAO,YAAc,SCRrB,MAAMK,EAAqBnD,EAAAA,cAAyC,IAAI,EAE3DoD,GAAsB,CAAC,CAAE,SAAAlE,KAAmC,CACvE,KAAM,CAACmE,EAAYC,CAAa,EAAIrC,EAAAA,SAAS,EAAE,EAE/C,OACEyB,EAAAA,IAACS,EAAmB,SAAnB,CAA4B,MAAO,CAAE,WAAAE,EAAY,cAAAC,GAC/C,SAAApE,EACH,CAEJ,EAEaqE,EAAwB,IAAM,CACzC,MAAMX,EAAUC,EAAAA,WAAWM,CAAkB,EAE7C,GAAI,CAACP,EACH,MAAM,MAAM,kEAAkE,EAGhF,OAAOA,CACT,EClBaY,EAAQ,CAAC,CAAE,SAAAtE,EAAU,IAAKuE,EAAc,GAAGV,KAEpDL,EAAAA,IAACU,IACC,SAAAV,EAAAA,IAACgB,GAAA,CAAa,IAAKD,EAAe,GAAGV,EAClC,SAAA7D,CAAA,CACH,CAAA,CACF,EAIEwE,GAAe,CAAC,CAAE,SAAAxE,EAAU,UAAAyE,EAAW,IAAKF,KAA+B,CAC/E,KAAM,CAAE,WAAAJ,CAAA,EAAeE,EAAA,EAEvB,OACEb,EAAAA,IAAC,WAAA,CACC,uBAAqB,eACrB,IAAKe,EACL,UAAWG,EAAAA,GAAGD,CAAS,EACvB,MAAON,EAEN,SAAAnE,CAAA,CAAA,CAGP,EAEAsE,EAAM,YAAc,eC3Bb,MAAMK,EAAO,CAAC,CAAE,SAAA7B,EAAW,GAAO,MAAApB,EAAO,SAAA1B,EAAU,IAAKuE,KAE3Df,EAAAA,IAAC,SAAA,CACC,uBAAqB,cACrB,IAAKe,EAEL,MAAA7C,EACA,SAAAoB,EAGC,SAAA9C,CAAA,EALI0B,CAAA,EAUXiD,EAAK,YAAc,cCnBZ,MAAMC,GAASC,EAAAA,IACpB,CACE,uDACA,cAEA,+CAAA,EAEF,CACE,SAAU,CACR,MAAO,CACL,UAAW,uCACX,MAAO,aACP,MAAO,aACP,QAAS,cAAA,EAEX,SAAU,CACR,KAAM,oBAAA,EAER,SAAU,CACR,KAAM,gBAAA,CACR,EAEF,iBAAkB,CAChB,CACE,SAAU,GACV,MAAO,OACP,MAAO,yBAAA,CACT,CACF,CAEJ,EAEaC,EAAQ,CAAC,CACpB,SAAA9E,EACA,UAAAyE,EACA,IAAAM,EACA,GAAGC,CACL,IAA0D,CACxD,KAAM,CACJ,MAAAvC,EACA,SAAAK,EACA,SAAAC,EACA,UAAAb,EACA,aAAAW,EACA,aAAAP,EACA,cAAAnB,EACA,aAAAkB,EACA,SAAAV,EACA,KAAA1B,EACA,SAAA+C,EACA,QAAAJ,CAAA,EACEa,EAAA,EAEEwB,EAAgBC,GAA0C,CAC1D5C,GACF4C,EAAM,eAAA,EACN/D,IAAgB+D,EAAM,OAAO,KAAK,GAElCvD,EAASuD,EAAM,OAAO,KAAK,CAE/B,EAEA,OACE1B,EAAAA,IAAC,SAAA,CACC,uBAAqB,eACrB,IAAAuB,EACA,SAAUjC,GAAYC,EACtB,KAAA9C,EACA,SAAA+C,EACA,kBAAiBH,EAChB,GAAIX,GAAa,CAAE,aAAcA,CAAA,EAClC,UAAW0C,GAAO,CAAE,UAAAH,EAAW,MAAAhC,EAAO,SAAAK,EAAU,SAAAC,EAAU,EAC1D,MAAOV,GAAc,MACrB,SAAU4C,EACV,GAAIrC,EACH,GAAGoC,EAEH,SAAAhF,CAAA,CAAA,CAGP,EAEA8E,EAAM,YAAc,eC/Eb,MAAMK,EAAQ,CAAC,CAAE,SAAAnF,KAA2B,CACjD,KAAM,CAAE,cAAAoE,CAAA,EAAkBC,EAAA,EAE1BpB,OAAAA,EAAAA,UAAU,IAAM,CACdmB,EAAcpE,CAAQ,CACxB,EAAG,CAACA,CAAQ,CAAC,EAEN,IACT,EAEAmF,EAAM,YAAc,eCdb,MAAMC,EAAc,CAAC,CAAE,SAAApF,WAEzBqF,EAAAA,KAAA,CAAK,KAAM,KAAM,UAAU,WACzB,SAAArF,EACH,EAIJoF,EAAY,YAAc,qBCFnB,MAAME,EAAc,CAAC,CAC1B,SAAAxC,EAAW,GACX,SAAA9C,EACA,IAAKuE,CACP,IAAwB,CACtB,KAAM,CAAE,eAAAzC,CAAA,EAAmB2B,EAAA,EAE3BR,OAAAA,EAAAA,UAAU,IAAM,CACdnB,EAAe9B,CAAQ,CACzB,EAAG,CAACA,CAAQ,CAAC,EAGXwD,EAAAA,IAAC,SAAA,CACC,uBAAqB,qBACrB,IAAKe,EAEL,MAAM,GACN,SAAAzB,EAEC,SAAA9C,CAAA,EAJG,aAAA,CAOV,EAEAsF,EAAY,YAAc,qBChCnB,MAAMV,GAASC,EAAAA,IACpB,CACE,oDACA,+BACA,cAEA,0DAAA,EAEF,CACE,SAAU,CACR,MAAO,CACL,UAAW,eACX,MAAO,aACP,MAAO,aACP,QAAS,cAAA,EAEX,SAAU,CACR,MAAO,qBAAA,EAET,SAAU,CACR,KAAM,EAAA,CACR,EAEF,iBAAkB,CAChB,CACE,SAAU,GACV,SAAU,GACV,MAAO,4BAAA,EAET,CACE,SAAU,GACV,MAAO,oDAAA,EAET,CACE,SAAU,GACV,MAAO,CAAC,4CAA6C,oBAAoB,CAAA,EAE3E,CACE,SAAU,GACV,MAAO,OACP,MAAO,iCAAA,CACT,CACF,CAEJ,EC5BaU,EAAU,CAAC,CACtB,aAAcrD,EACd,SAAAlC,EACA,UAAAyE,EACA,IAAKF,CACP,IAAoB,CAClB,KAAM,CAAE,SAAAzB,EAAU,SAAAC,EAAU,MAAAN,EAAO,aAAAN,EAAc,eAAAZ,CAAA,EAAmBkC,EAAA,EAEpER,OAAAA,EAAAA,UAAU,IAAM,CACVf,GACFC,EAAaD,CAAS,CAE1B,EAAG,CAACA,CAAS,CAAC,EAGZsD,EAAAA,KAAC,MAAA,CACC,uBAAqB,iBACrB,IAAKjB,EACL,UAAWK,GAAO,CAAE,UAAAH,EAAW,MAAAhC,EAAO,SAAAK,EAAU,SAAAC,EAAU,EAE1D,SAAA,CAAAS,EAAAA,IAAC,OAAA,CAAK,UAAU,yCAA0C,SAAAxD,CAAA,CAAS,EAEnEwD,EAAAA,IAAC6B,EAAAA,MAAK,UAAU,iBAAiB,KAAK,KACpC,SAAA7B,EAAAA,IAACiC,yBAAoB,CAAA,CACvB,EAEClE,CAAA,CAAA,CAAA,CAGP,EAEAgE,EAAQ,YAAc,iBCjCf,MAAMG,EAAQ,CAAC,CACpB,SAAA1F,EACA,UAAAyE,EACA,YAAakB,EACb,IAAKpB,CACP,IAAkB,CAChB,KAAM,CAAE,aAAAlC,EAAc,YAAAR,EAAa,SAAAiB,CAAA,EAAaW,EAAA,EAE1CmC,EAAwBvD,GAAc,OAAS,KAC/CwD,EAAmBF,GAAqB9D,EAE9C,OACE2B,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,uBAAqB,eACrB,IAAKe,EACL,UAAWG,EAAAA,GAAG,qCAAsCD,CAAS,EAE7D,SAAAjB,EAAAA,IAAC,OAAA,CACC,UAAWkB,EAAAA,GACT,8DACAkB,GAAyB,CAAC9C,GAAY,uBAAA,EAGvC,SAAA8C,EAAwBC,EAAmB7F,GAAYqC,GAAc,IAAA,CAAA,CACxE,CAAA,CAGN,EAEAqD,EAAM,YAAc,eCjCb,MAAM9B,EAST,OAAO,OAAOkC,EAAM,CACtB,MAAAxB,EACA,KAAAK,EACA,MAAAG,EACA,YAAAQ,EACA,MAAAH,EACA,QAAAI,EACA,MAAAG,EACA,YAAAN,CACF,CAAC,EAEDxB,EAAO,YAAc,SACrBU,EAAM,YAAc,eACpBQ,EAAM,YAAc,eACpBH,EAAK,YAAc,cACnBW,EAAY,YAAc,qBAC1BH,EAAM,YAAc,eACpBI,EAAQ,YAAc,iBACtBG,EAAM,YAAc,eACpBN,EAAY,YAAc"}
+{"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n  const validChildren = Children.toArray(children).filter(isValidElement)\n\n  return validChildren.find(child => {\n    return getElementDisplayName(child)?.includes(name)\n  })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n  return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n  Children.forEach(children, child => {\n    if (!isValidElement(child)) return\n\n    if (\n      getElementDisplayName(child) === 'Select.Item' ||\n      getElementDisplayName(child) === 'Select.Placeholder'\n    ) {\n      const childProps = child.props as ItemProps\n      result.push({\n        value: childProps.value,\n        disabled: !!childProps.disabled,\n        text: childProps.children,\n      })\n    }\n\n    if ((child.props as { children: ReactNode }).children) {\n      getOrderedItems((child.props as { children: ReactNode }).children, result)\n    }\n  })\n\n  return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n  const newMap: ItemsMap = new Map()\n\n  getOrderedItems(children).forEach(itemData => {\n    newMap.set(itemData.value, itemData)\n  })\n\n  return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n  createContext,\n  Dispatch,\n  PropsWithChildren,\n  ReactElement,\n  SetStateAction,\n  useContext,\n  useEffect,\n  useId,\n  useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n  itemsMap: ItemsMap\n  disabled: boolean\n  readOnly: boolean\n  state?: 'error' | 'alert' | 'success'\n  itemsComponent: ReactElement | undefined\n  selectedItem: SelectItem | undefined\n  setValue: (value: string) => void\n  isControlled: boolean\n  onValueChange?: (value: string) => void\n  ariaLabel: string | undefined\n  setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n  fieldId: string\n  fieldLabelId: string | undefined\n  name: string | undefined\n  required: boolean\n  placeholder: string | undefined\n  setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n  /**\n   * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n   */\n  state?: 'error' | 'alert' | 'success'\n  /**\n   * When true, prevents the user from interacting with the select.\n   */\n  disabled?: boolean\n  /**\n   * Sets the select as interactive or not.\n   */\n  readOnly?: boolean\n  /**\n   * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n   */\n  defaultValue?: string\n  /**\n   * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n   */\n  value?: string\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: string) => void\n\n  itemsComponent: ReactElement | undefined\n  /**\n   * This attribute is used to specify the name of the control.\n   * If wrapped with a FormField with a name, will be inherited from it.\n   */\n  name?: string\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n   */\n  required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n  children,\n  defaultValue,\n  value: valueProp,\n  onValueChange,\n  disabled: disabledProp = false,\n  readOnly: readOnlyProp = false,\n  state: stateProp,\n  itemsComponent,\n  name: nameProp,\n  required: requiredProp,\n}: SelectContextProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n  const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n  const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n  const [ariaLabel, setAriaLabel] = useState<string>()\n\n  // Computed state\n  const firstItem = itemsMap.entries().next()?.value?.[1]\n  const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n  const isControlled = valueProp != null\n\n  // Derivated from FormField context\n  const field = useFormFieldControl()\n  const state = field.state || stateProp\n\n  const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n  const fieldId = field.id || internalFieldID\n  const fieldLabelId = field.labelId\n  const disabled = field.disabled ?? disabledProp\n  const readOnly = field.readOnly ?? readOnlyProp\n  const name = field.name ?? nameProp\n  const required = !!(field.isRequired ?? requiredProp)\n\n  /**\n   * Indices in a Map are set when an element is added to the Map.\n   * If for some reason, in the Select:\n   * - items order changes\n   * - items are added\n   * - items are removed\n   *\n   * The Map must be rebuilt from the new children in order to preserve logical indices.\n   *\n   */\n  useEffect(() => {\n    const newMap = getItemsFromChildren(itemsComponent)\n\n    const previousItems = [...itemsMap.values()]\n    const newItems = [...newMap.values()]\n\n    const hasItemsChanges =\n      previousItems.length !== newItems.length ||\n      previousItems.some((item, index) => {\n        const hasUpdatedValue = item.value !== newItems[index]?.value\n        const hasUpdatedText = item.text !== newItems[index]?.text\n\n        return hasUpdatedValue || hasUpdatedText\n      })\n\n    if (hasItemsChanges) {\n      setItemsMap(newMap)\n    }\n  }, [children])\n\n  return (\n    <SelectContext.Provider\n      value={{\n        disabled,\n        readOnly,\n        itemsMap,\n        state,\n        itemsComponent,\n        selectedItem,\n        setValue,\n        isControlled,\n        onValueChange,\n        ariaLabel,\n        setAriaLabel,\n        fieldId,\n        fieldLabelId,\n        name,\n        required,\n        placeholder,\n        setPlaceholder,\n      }}\n    >\n      {children}\n    </SelectContext.Provider>\n  )\n}\n\nexport const useSelectContext = () => {\n  const context = useContext(SelectContext)\n\n  if (!context) {\n    throw Error('useSelectContext must be used within a Select provider')\n  }\n\n  return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n  const finder = findElement(children)\n  const trigger = finder('Trigger')\n  const items = finder('Items')\n\n  return (\n    <SelectProvider {...props} itemsComponent={items}>\n      {trigger}\n    </SelectProvider>\n  )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n  groupLabel: string\n  setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n  const [groupLabel, setGroupLabel] = useState('')\n\n  return (\n    <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n      {children}\n    </SelectGroupContext.Provider>\n  )\n}\n\nexport const useSelectGroupContext = () => {\n  const context = useContext(SelectGroupContext)\n\n  if (!context) {\n    throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n  }\n\n  return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n  return (\n    <SelectGroupProvider>\n      <GroupContent ref={forwardedRef} {...props}>\n        {children}\n      </GroupContent>\n    </SelectGroupProvider>\n  )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n  const { groupLabel } = useSelectGroupContext()\n\n  return (\n    <optgroup\n      data-spark-component=\"select-group\"\n      ref={forwardedRef}\n      className={cx(className)}\n      label={groupLabel}\n    >\n      {children}\n    </optgroup>\n  )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n  disabled?: boolean\n  value: string\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n  return (\n    <option\n      data-spark-component=\"select-item\"\n      ref={forwardedRef}\n      key={value}\n      value={value}\n      disabled={disabled}\n      // label\n    >\n      {children}\n    </option>\n  )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n  [\n    'absolute left-0 top-0 size-full rounded-lg opacity-0',\n    'min-h-sz-44',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus:ring-2',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline focus:ring-outline-high',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        true: 'cursor-not-allowed',\n      },\n      readOnly: {\n        true: 'cursor-default',\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        state: undefined,\n        class: 'hover:ring-outline-high',\n      },\n    ],\n  }\n)\n\nexport const Items = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n  const {\n    state,\n    disabled,\n    readOnly,\n    ariaLabel,\n    fieldLabelId,\n    isControlled,\n    onValueChange,\n    selectedItem,\n    setValue,\n    name,\n    required,\n    fieldId,\n  } = useSelectContext()\n\n  const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n    if (isControlled) {\n      event.preventDefault()\n      onValueChange?.(event.target.value)\n    } else {\n      setValue(event.target.value)\n    }\n  }\n\n  return (\n    <select\n      data-spark-component=\"select-items\"\n      ref={ref}\n      disabled={disabled || readOnly}\n      name={name}\n      required={required}\n      aria-labelledby={fieldLabelId}\n      {...(ariaLabel && { 'aria-label': ariaLabel })}\n      className={styles({ className, state, disabled, readOnly })}\n      value={selectedItem?.value}\n      onChange={handleChange}\n      id={fieldId}\n      {...rest}\n    >\n      {children}\n    </select>\n  )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n  children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n  const { setGroupLabel } = useSelectGroupContext()\n\n  useEffect(() => {\n    setGroupLabel(children)\n  }, [children])\n\n  return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n  return (\n    <Icon size={'sm'} className=\"shrink-0\">\n      {children}\n    </Icon>\n  )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n  disabled?: boolean\n  children: string\n  ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n  disabled = false,\n  children,\n  ref: forwardedRef,\n}: PlaceholderProps) => {\n  const { setPlaceholder } = useSelectContext()\n\n  useEffect(() => {\n    setPlaceholder(children)\n  }, [children])\n\n  return (\n    <option\n      data-spark-component=\"select-placeholder\"\n      ref={forwardedRef}\n      key=\"placeholder\"\n      value=\"\"\n      disabled={disabled}\n    >\n      {children}\n    </option>\n  )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n  [\n    'relative flex w-full items-center justify-between',\n    'min-h-sz-44 rounded-lg px-lg',\n    'text-body-1',\n    // outline styles\n    'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n  ],\n  {\n    variants: {\n      state: {\n        undefined: 'ring-outline',\n        error: 'ring-error',\n        alert: 'ring-alert',\n        success: 'ring-success',\n      },\n      disabled: {\n        false: 'focus-within:ring-2',\n      },\n      readOnly: {\n        true: '',\n      },\n    },\n    compoundVariants: [\n      {\n        readOnly: false,\n        disabled: false,\n        class: 'bg-surface text-on-surface',\n      },\n      {\n        readOnly: true,\n        class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n      },\n      {\n        disabled: true,\n        class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n      },\n      {\n        disabled: false,\n        state: undefined,\n        class: 'default:hover:ring-outline-high',\n      },\n    ],\n  }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n  'aria-label'?: string\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n  'aria-label': ariaLabel,\n  children,\n  className,\n  ref: forwardedRef,\n}: TriggerProps) => {\n  const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n  useEffect(() => {\n    if (ariaLabel) {\n      setAriaLabel(ariaLabel)\n    }\n  }, [ariaLabel])\n\n  return (\n    <div\n      data-spark-component=\"select-trigger\"\n      ref={forwardedRef}\n      className={styles({ className, state, disabled, readOnly })}\n    >\n      <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n      <Icon className=\"ml-md shrink-0\" size=\"sm\">\n        <ArrowHorizontalDown />\n      </Icon>\n\n      {itemsComponent}\n    </div>\n  )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n  children?: ReactNode\n  className?: string\n  /**\n   * Optional placeholder value for the trigger.\n   * If not specified, the value inside `Select.Placeholder` item will be used.\n   */\n  placeholder?: string\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n  children,\n  className,\n  placeholder: customPlaceholder,\n  ref: forwardedRef,\n}: ValueProps) => {\n  const { selectedItem, placeholder, disabled } = useSelectContext()\n\n  const isPlaceholderSelected = selectedItem?.value == null\n  const valuePlaceholder = customPlaceholder || placeholder\n\n  return (\n    <span\n      role=\"presentation\"\n      data-spark-component=\"select-value\"\n      ref={forwardedRef}\n      className={cx('flex shrink items-center text-left', className)}\n    >\n      <span\n        className={cx(\n          'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n          isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n        )}\n      >\n        {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n      </span>\n    </span>\n  )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n  Group: typeof Group\n  Item: typeof Item\n  Items: typeof Items\n  Placeholder: typeof Placeholder\n  Label: typeof Label\n  Trigger: typeof Trigger\n  Value: typeof Value\n  LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n  Group,\n  Item,\n  Items,\n  Placeholder,\n  Label,\n  Trigger,\n  Value,\n  LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}