@accelint/design-toolkit 9.3.0 → 9.4.0

package/dist/components/slider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["AriaSlider","AriaSliderTrack","TooltipTrigger","Tooltip"],"sources":["../../../src/components/slider/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport {\n  type CSSProperties,\n  Fragment,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  Slider as AriaSlider,\n  SliderTrack as AriaSliderTrack,\n  composeRenderProps,\n  Input,\n  Label,\n  SliderThumb,\n  Text,\n} from 'react-aria-components';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport styles from './styles.module.css';\nimport type { SliderMarker, SliderMarkersConfig, SliderProps } from './types';\n\nconst DEBOUNCE_MS = 500;\n\n/**\n * SliderInput - Internal component for debounced numeric input\n */\nfunction SliderInput({\n  className,\n  value,\n  min,\n  max,\n  disabled,\n  onChange,\n}: {\n  className?: string;\n  value: number;\n  min: number;\n  max: number;\n  disabled?: boolean;\n  onChange: (value: number) => void;\n}) {\n  const [localValue, setLocalValue] = useState(String(value));\n  const timeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  // Sync local value when external value changes (e.g., from slider drag)\n  useEffect(() => {\n    setLocalValue(String(value));\n  }, [value]);\n\n  // Cleanup timeout on unmount\n  useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  const commitValue = (inputValue: string) => {\n    const parsed = Number.parseFloat(inputValue);\n    if (Number.isNaN(parsed)) {\n      // Reset to min if invalid\n      setLocalValue(String(min));\n      onChange(min);\n    } else {\n      // Clamp to valid range\n      const clamped = Math.min(Math.max(parsed, min), max);\n      setLocalValue(String(clamped));\n      onChange(clamped);\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = event.target.value;\n    setLocalValue(newValue);\n\n    // Clear existing timeout\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n    }\n\n    // Debounce the commit\n    timeoutRef.current = setTimeout(() => {\n      commitValue(newValue);\n    }, DEBOUNCE_MS);\n  };\n\n  const handleBlur = () => {\n    // Clear pending timeout and commit immediately\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n    }\n    commitValue(localValue);\n  };\n\n  return (\n    <Input\n      className={className}\n      value={localValue}\n      disabled={disabled}\n      data-disabled={disabled || undefined}\n      onChange={handleChange}\n      onBlur={handleBlur}\n    />\n  );\n}\n\n/**\n * Normalizes the markers configuration into a consistent sorted array format\n */\nfunction normalizeMarkers(\n  markersConfig: SliderMarkersConfig | undefined,\n  min: number,\n  max: number,\n): SliderMarker[] {\n  if (markersConfig === undefined) {\n    return [];\n  }\n\n  // Number of evenly spaced markers\n  if (typeof markersConfig === 'number') {\n    if (markersConfig < 2) {\n      return [];\n    }\n    const step = (max - min) / (markersConfig - 1);\n    return Array.from({ length: markersConfig }, (_, i) => ({\n      value: min + step * i,\n    }));\n  }\n\n  // Array of numbers or marker objects - sort by value\n  return markersConfig\n    .map((item) => (typeof item === 'number' ? { value: item } : item))\n    .sort((a, b) => a.value - b.value);\n}\n\n/**\n * Snaps a value to the nearest marker (curried for use with map)\n * Assumes markers are sorted by value for early exit optimization\n */\nfunction snapToNearestMarker(markers: SliderMarker[]) {\n  return (value: number): number => {\n    const firstMarker = markers[0];\n    if (!firstMarker) {\n      return value;\n    }\n\n    let nearestValue = firstMarker.value;\n    let minDistance = Number.POSITIVE_INFINITY;\n\n    for (const marker of markers) {\n      const distance = Math.abs(value - marker.value);\n      if (distance < minDistance) {\n        minDistance = distance;\n        nearestValue = marker.value;\n      } else {\n        // Since markers are sorted, if distance increases we've passed the nearest\n        break;\n      }\n    }\n\n    return nearestValue;\n  };\n}\n\n/**\n * Checks if a marker with a label exists at the given value\n */\nfunction hasLabeledMarkerAtValue(\n  markers: SliderMarker[],\n  value: number,\n): boolean {\n  return markers.some(\n    (marker) =>\n      marker.value === value &&\n      marker.label !== undefined &&\n      marker.label !== '',\n  );\n}\n\n/**\n * Normalizes value to array format\n */\nfunction normalizeValue(\n  value: number | number[] | undefined,\n): number[] | undefined {\n  if (value === undefined) {\n    return undefined;\n  }\n  return Array.isArray(value) ? value : [value];\n}\n\n/**\n * Slider - An interactive range input component for numeric value selection\n *\n * Provides accessible slider functionality with optional input field integration,\n * flexible layouts, and comprehensive keyboard and mouse interaction support.\n * Perfect for settings, filters, or any numeric input requiring visual feedback.\n *\n * @example\n * // Basic slider\n * <Slider label=\"Volume\" defaultValue={50} />\n *\n * @example\n * // Slider with input field\n * <Slider label=\"Opacity\" defaultValue={50} showInput />\n *\n * @example\n * // Slider with labeled markers\n * <Slider\n *   label=\"Quality\"\n *   markers={[\n *     { value: 0, label: 'Low' },\n *     { value: 50, label: 'Medium' },\n *     { value: 100, label: 'High' },\n *   ]}\n *   showMarkerLabels\n * />\n *\n * @example\n * // Slider that snaps to marker values only\n * <Slider\n *   label=\"Rating\"\n *   markers={[0, 25, 50, 75, 100]}\n *   snapToMarkers\n * />\n */\nexport function Slider({\n  classNames,\n  defaultValue,\n  label: labelProp,\n  layout = 'grid',\n  markers: markersProp,\n  maxValue: maxValueProp = 100,\n  minValue: minValueProp = 0,\n  onChange,\n  onChangeEnd,\n  orientation = 'horizontal',\n  showInput,\n  showLabel = true,\n  showMarkerLabels = false,\n  showValueLabels = true,\n  snapToMarkers = false,\n  step: stepProp,\n  value: valueProp,\n  ...rest\n}: SliderProps) {\n  const normalizedMarkers = useMemo(\n    () => normalizeMarkers(markersProp, minValueProp, maxValueProp),\n    [markersProp, minValueProp, maxValueProp],\n  );\n\n  const shouldSnap = snapToMarkers && normalizedMarkers.length > 0;\n\n  // Normalize default value, applying snap if needed\n  const normalizedDefaultValue = useMemo(() => {\n    const normalized = normalizeValue(defaultValue);\n    if (shouldSnap && normalized) {\n      return normalized.map(snapToNearestMarker(normalizedMarkers));\n    }\n    return normalized ?? [minValueProp];\n  }, [defaultValue, shouldSnap, normalizedMarkers, minValueProp]);\n\n  // Use controlled state for value management\n  const [value, setValue] = useControlledState(\n    normalizeValue(valueProp),\n    normalizedDefaultValue,\n    onChange,\n  );\n\n  // Memoize marker percent calculations\n  const markerPercents = useMemo(() => {\n    const percents = new Map<number, number>();\n    const range = maxValueProp - minValueProp;\n    for (const marker of normalizedMarkers) {\n      percents.set(marker.value, ((marker.value - minValueProp) / range) * 100);\n    }\n    return percents;\n  }, [normalizedMarkers, minValueProp, maxValueProp]);\n\n  // Determine if min/max labels should be hidden\n  const hideMinValue =\n    !showValueLabels ||\n    (showMarkerLabels &&\n      hasLabeledMarkerAtValue(normalizedMarkers, minValueProp));\n  const hideMaxValue =\n    !showValueLabels ||\n    (showMarkerLabels &&\n      hasLabeledMarkerAtValue(normalizedMarkers, maxValueProp));\n\n  // Handle onChange - snap values when snapToMarkers is enabled\n  const handleChange = (values: number[]) => {\n    if (shouldSnap) {\n      setValue(values.map(snapToNearestMarker(normalizedMarkers)));\n    } else {\n      setValue(values);\n    }\n  };\n\n  // Handle onChangeEnd\n  const handleChangeEnd = (values: number[]) => {\n    if (shouldSnap) {\n      onChangeEnd?.(values.map(snapToNearestMarker(normalizedMarkers)));\n    } else {\n      onChangeEnd?.(values);\n    }\n  };\n\n  return (\n    <AriaSlider\n      {...rest}\n      className={composeRenderProps(classNames?.slider, (className) =>\n        clsx('group/slider', styles.slider, className),\n      )}\n      maxValue={maxValueProp}\n      minValue={minValueProp}\n      onChange={handleChange}\n      onChangeEnd={handleChangeEnd}\n      orientation={orientation}\n      step={stepProp}\n      value={value}\n      aria-label={showLabel ? undefined : labelProp}\n      data-layout={layout}\n    >\n      {({ state }) => (\n        <>\n          {showLabel && (\n            <Label className={clsx(styles.label, classNames?.label)}>\n              {labelProp}\n            </Label>\n          )}\n          {showInput && (\n            <div className={clsx(styles.inputs, classNames?.inputs)}>\n              {state.values.map((val, index) => (\n                <SliderInput\n                  key={`number-field-${index === 0 ? 'min' : 'max'}`}\n                  className={clsx(styles.input, classNames?.input)}\n                  value={val}\n                  min={minValueProp}\n                  max={maxValueProp}\n                  disabled={state.isDisabled}\n                  onChange={(newValue) => state.setThumbValue(index, newValue)}\n                />\n              ))}\n            </div>\n          )}\n          <AriaSliderTrack\n            className={composeRenderProps(classNames?.track, (className) =>\n              clsx(styles.track, className),\n            )}\n          >\n            <div\n              className={clsx(\n                styles.trackBackground,\n                classNames?.trackBackground,\n              )}\n            />\n            {/* Markers */}\n            {normalizedMarkers.length > 0 && (\n              <div className={clsx(styles.markers, classNames?.markers)}>\n                {normalizedMarkers.map((marker) => (\n                  <div\n                    key={`marker-${marker.value}`}\n                    className={clsx(styles.marker, classNames?.marker)}\n                    data-percent={markerPercents.get(marker.value)}\n                    aria-hidden='true'\n                  >\n                    <div\n                      className={clsx(styles.markerDot, classNames?.markerDot)}\n                    />\n                    {showMarkerLabels && marker.label && (\n                      <span\n                        className={clsx(\n                          styles.markerLabel,\n                          classNames?.markerLabel,\n                        )}\n                      >\n                        {marker.label}\n                      </span>\n                    )}\n                  </div>\n                ))}\n              </div>\n            )}\n            {state.values.map((_, index) => (\n              <Fragment key={`slider-${index === 0 ? 'min' : 'max'}`}>\n                <div\n                  className={clsx(styles.trackValue, classNames?.trackValue)}\n                  style={\n                    {\n                      '--track-value-start':\n                        state.values.length === 1\n                          ? 0\n                          : state.getThumbPercent(0),\n                      '--track-value-end': state.getThumbPercent(\n                        state.values.length === 1 ? 0 : 1,\n                      ),\n                    } as CSSProperties\n                  }\n                />\n                <TooltipTrigger\n                  isDisabled={showInput || state.isThumbDragging(index)}\n                >\n                  <SliderThumb\n                    index={index}\n                    className={composeRenderProps(\n                      classNames?.thumb,\n                      (className) => clsx(styles.thumb, className),\n                    )}\n                  />\n                  <Tooltip placement='top'>\n                    {state.getThumbValue(index)}\n                  </Tooltip>\n                </TooltipTrigger>\n              </Fragment>\n            ))}\n          </AriaSliderTrack>\n          <Text\n            slot='min'\n            className={clsx(styles.minValue, classNames?.minValue)}\n            hidden={hideMinValue}\n          >\n            {minValueProp}\n          </Text>\n          <Text\n            slot='max'\n            className={clsx(styles.maxValue, classNames?.maxValue)}\n            hidden={hideMaxValue}\n          >\n            {maxValueProp}\n          </Text>\n        </>\n      )}\n    </AriaSlider>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["AriaSlider","AriaSliderTrack","TooltipTrigger","Tooltip"],"sources":["../../../src/components/slider/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport {\n  type CSSProperties,\n  Fragment,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  Slider as AriaSlider,\n  SliderTrack as AriaSliderTrack,\n  composeRenderProps,\n  Input,\n  Label,\n  SliderThumb,\n  Text,\n} from 'react-aria-components';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport styles from './styles.module.css';\nimport type { SliderMarker, SliderMarkersConfig, SliderProps } from './types';\n\nconst DEBOUNCE_MS = 500;\n\n/**\n * SliderInput - Internal component for debounced numeric input\n */\nfunction SliderInput({\n  className,\n  value,\n  min,\n  max,\n  disabled,\n  onChange,\n}: {\n  className?: string;\n  value: number;\n  min: number;\n  max: number;\n  disabled?: boolean;\n  onChange: (value: number) => void;\n}) {\n  const [localValue, setLocalValue] = useState(String(value));\n  const timeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  // Sync local value when external value changes (e.g., from slider drag)\n  useEffect(() => {\n    setLocalValue(String(value));\n  }, [value]);\n\n  // Cleanup timeout on unmount\n  useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  const commitValue = (inputValue: string) => {\n    const parsed = Number.parseFloat(inputValue);\n    if (Number.isNaN(parsed)) {\n      // Reset to min if invalid\n      setLocalValue(String(min));\n      onChange(min);\n    } else {\n      // Clamp to valid range\n      const clamped = Math.min(Math.max(parsed, min), max);\n      setLocalValue(String(clamped));\n      onChange(clamped);\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = event.target.value;\n    setLocalValue(newValue);\n\n    // Clear existing timeout\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n    }\n\n    // Debounce the commit\n    timeoutRef.current = setTimeout(() => {\n      commitValue(newValue);\n    }, DEBOUNCE_MS);\n  };\n\n  const handleBlur = () => {\n    // Clear pending timeout and commit immediately\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n    }\n    commitValue(localValue);\n  };\n\n  return (\n    <Input\n      className={className}\n      value={localValue}\n      disabled={disabled}\n      data-disabled={disabled || undefined}\n      onChange={handleChange}\n      onBlur={handleBlur}\n    />\n  );\n}\n\n/**\n * Normalizes the markers configuration into a consistent sorted array format\n */\nfunction normalizeMarkers(\n  markersConfig: SliderMarkersConfig | undefined,\n  min: number,\n  max: number,\n): SliderMarker[] {\n  if (markersConfig === undefined) {\n    return [];\n  }\n\n  // Number of evenly spaced markers\n  if (typeof markersConfig === 'number') {\n    if (markersConfig < 2) {\n      return [];\n    }\n    const step = (max - min) / (markersConfig - 1);\n    return Array.from({ length: markersConfig }, (_, i) => ({\n      value: min + step * i,\n    }));\n  }\n\n  // Array of numbers or marker objects - sort by value\n  return markersConfig\n    .map((item) => (typeof item === 'number' ? { value: item } : item))\n    .sort((a, b) => a.value - b.value);\n}\n\n/**\n * Snaps a value to the nearest marker (curried for use with map)\n * Assumes markers are sorted by value for early exit optimization\n */\nfunction snapToNearestMarker(markers: SliderMarker[]) {\n  return (value: number): number => {\n    const firstMarker = markers[0];\n    if (!firstMarker) {\n      return value;\n    }\n\n    let nearestValue = firstMarker.value;\n    let minDistance = Number.POSITIVE_INFINITY;\n\n    for (const marker of markers) {\n      const distance = Math.abs(value - marker.value);\n      if (distance < minDistance) {\n        minDistance = distance;\n        nearestValue = marker.value;\n      } else {\n        // Since markers are sorted, if distance increases we've passed the nearest\n        break;\n      }\n    }\n\n    return nearestValue;\n  };\n}\n\n/**\n * Checks if a marker with a label exists at the given value\n */\nfunction hasLabeledMarkerAtValue(\n  markers: SliderMarker[],\n  value: number,\n): boolean {\n  return markers.some(\n    (marker) =>\n      marker.value === value &&\n      marker.label !== undefined &&\n      marker.label !== '',\n  );\n}\n\n/**\n * Normalizes value to array format\n */\nfunction normalizeValue(\n  value: number | number[] | undefined,\n): number[] | undefined {\n  if (value === undefined) {\n    return undefined;\n  }\n  return Array.isArray(value) ? value : [value];\n}\n\n/**\n * Slider - Range input for numeric value selection\n *\n * Supports single values or ranges, optional input fields, markers, and snap-to-markers behavior.\n *\n * @param props - {@link SliderProps}\n * @param props.classNames - Custom CSS class names for slider elements.\n * @param props.defaultValue - Default value(s) for uncontrolled mode.\n * @param props.label - Label text for the slider.\n * @param props.layout - Layout variant for the slider.\n * @param props.markers - Marker configuration for discrete points.\n * @param props.maxValue - Maximum value of the slider range.\n * @param props.minValue - Minimum value of the slider range.\n * @param props.onChange - Callback when value changes.\n * @param props.onChangeEnd - Callback when user finishes dragging.\n * @param props.orientation - Slider orientation.\n * @param props.showInput - Whether to show numeric input fields.\n * @param props.showLabel - Whether to display the label.\n * @param props.showMarkerLabels - Whether to show labels on markers.\n * @param props.showValueLabels - Whether to show min/max value labels.\n * @param props.snapToMarkers - Whether to snap to marker values only.\n * @param props.step - Step increment for value changes.\n * @param props.value - Controlled value(s).\n * @returns The rendered Slider component.\n *\n * @example\n * ```tsx\n * <Slider\n *   label=\"Volume\"\n *   defaultValue={50}\n *   minValue={0}\n *   maxValue={100}\n *   onChange={setVolume}\n * />\n * ```\n */\nexport function Slider({\n  classNames,\n  defaultValue,\n  label: labelProp,\n  layout = 'grid',\n  markers: markersProp,\n  maxValue: maxValueProp = 100,\n  minValue: minValueProp = 0,\n  onChange,\n  onChangeEnd,\n  orientation = 'horizontal',\n  showInput,\n  showLabel = true,\n  showMarkerLabels = false,\n  showValueLabels = true,\n  snapToMarkers = false,\n  step: stepProp,\n  value: valueProp,\n  ...rest\n}: SliderProps) {\n  const normalizedMarkers = useMemo(\n    () => normalizeMarkers(markersProp, minValueProp, maxValueProp),\n    [markersProp, minValueProp, maxValueProp],\n  );\n\n  const shouldSnap = snapToMarkers && normalizedMarkers.length > 0;\n\n  // Normalize default value, applying snap if needed\n  const normalizedDefaultValue = useMemo(() => {\n    const normalized = normalizeValue(defaultValue);\n    if (shouldSnap && normalized) {\n      return normalized.map(snapToNearestMarker(normalizedMarkers));\n    }\n    return normalized ?? [minValueProp];\n  }, [defaultValue, shouldSnap, normalizedMarkers, minValueProp]);\n\n  // Use controlled state for value management\n  const [value, setValue] = useControlledState(\n    normalizeValue(valueProp),\n    normalizedDefaultValue,\n    onChange,\n  );\n\n  // Memoize marker percent calculations\n  const markerPercents = useMemo(() => {\n    const percents = new Map<number, number>();\n    const range = maxValueProp - minValueProp;\n    for (const marker of normalizedMarkers) {\n      percents.set(marker.value, ((marker.value - minValueProp) / range) * 100);\n    }\n    return percents;\n  }, [normalizedMarkers, minValueProp, maxValueProp]);\n\n  // Determine if min/max labels should be hidden\n  const hideMinValue =\n    !showValueLabels ||\n    (showMarkerLabels &&\n      hasLabeledMarkerAtValue(normalizedMarkers, minValueProp));\n  const hideMaxValue =\n    !showValueLabels ||\n    (showMarkerLabels &&\n      hasLabeledMarkerAtValue(normalizedMarkers, maxValueProp));\n\n  // Handle onChange - snap values when snapToMarkers is enabled\n  const handleChange = (values: number[]) => {\n    if (shouldSnap) {\n      setValue(values.map(snapToNearestMarker(normalizedMarkers)));\n    } else {\n      setValue(values);\n    }\n  };\n\n  // Handle onChangeEnd\n  const handleChangeEnd = (values: number[]) => {\n    if (shouldSnap) {\n      onChangeEnd?.(values.map(snapToNearestMarker(normalizedMarkers)));\n    } else {\n      onChangeEnd?.(values);\n    }\n  };\n\n  return (\n    <AriaSlider\n      {...rest}\n      className={composeRenderProps(classNames?.slider, (className) =>\n        clsx('group/slider', styles.slider, className),\n      )}\n      maxValue={maxValueProp}\n      minValue={minValueProp}\n      onChange={handleChange}\n      onChangeEnd={handleChangeEnd}\n      orientation={orientation}\n      step={stepProp}\n      value={value}\n      aria-label={showLabel ? undefined : labelProp}\n      data-layout={layout}\n    >\n      {({ state }) => (\n        <>\n          {showLabel && (\n            <Label className={clsx(styles.label, classNames?.label)}>\n              {labelProp}\n            </Label>\n          )}\n          {showInput && (\n            <div className={clsx(styles.inputs, classNames?.inputs)}>\n              {state.values.map((val, index) => (\n                <SliderInput\n                  key={`number-field-${index === 0 ? 'min' : 'max'}`}\n                  className={clsx(styles.input, classNames?.input)}\n                  value={val}\n                  min={minValueProp}\n                  max={maxValueProp}\n                  disabled={state.isDisabled}\n                  onChange={(newValue) => state.setThumbValue(index, newValue)}\n                />\n              ))}\n            </div>\n          )}\n          <AriaSliderTrack\n            className={composeRenderProps(classNames?.track, (className) =>\n              clsx(styles.track, className),\n            )}\n          >\n            <div\n              className={clsx(\n                styles.trackBackground,\n                classNames?.trackBackground,\n              )}\n            />\n            {/* Markers */}\n            {normalizedMarkers.length > 0 && (\n              <div className={clsx(styles.markers, classNames?.markers)}>\n                {normalizedMarkers.map((marker) => (\n                  <div\n                    key={`marker-${marker.value}`}\n                    className={clsx(styles.marker, classNames?.marker)}\n                    data-percent={markerPercents.get(marker.value)}\n                    aria-hidden='true'\n                  >\n                    <div\n                      className={clsx(styles.markerDot, classNames?.markerDot)}\n                    />\n                    {showMarkerLabels && marker.label && (\n                      <span\n                        className={clsx(\n                          styles.markerLabel,\n                          classNames?.markerLabel,\n                        )}\n                      >\n                        {marker.label}\n                      </span>\n                    )}\n                  </div>\n                ))}\n              </div>\n            )}\n            {state.values.map((_, index) => (\n              <Fragment key={`slider-${index === 0 ? 'min' : 'max'}`}>\n                <div\n                  className={clsx(styles.trackValue, classNames?.trackValue)}\n                  style={\n                    {\n                      '--track-value-start':\n                        state.values.length === 1\n                          ? 0\n                          : state.getThumbPercent(0),\n                      '--track-value-end': state.getThumbPercent(\n                        state.values.length === 1 ? 0 : 1,\n                      ),\n                    } as CSSProperties\n                  }\n                />\n                <TooltipTrigger\n                  isDisabled={showInput || state.isThumbDragging(index)}\n                >\n                  <SliderThumb\n                    index={index}\n                    className={composeRenderProps(\n                      classNames?.thumb,\n                      (className) => clsx(styles.thumb, className),\n                    )}\n                  />\n                  <Tooltip placement='top'>\n                    {state.getThumbValue(index)}\n                  </Tooltip>\n                </TooltipTrigger>\n              </Fragment>\n            ))}\n          </AriaSliderTrack>\n          <Text\n            slot='min'\n            className={clsx(styles.minValue, classNames?.minValue)}\n            hidden={hideMinValue}\n          >\n            {minValueProp}\n          </Text>\n          <Text\n            slot='max'\n            className={clsx(styles.maxValue, classNames?.maxValue)}\n            hidden={hideMaxValue}\n          >\n            {maxValueProp}\n          </Text>\n        </>\n      )}\n    </AriaSlider>\n  );\n}\n"],"mappings":"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"}

package/dist/components/slider/types.d.ts

@@ -13,12 +13,27 @@
 import { LabelProps, SliderProps as SliderProps$1, SliderThumbProps, SliderTrackProps } from "react-aria-components";
 
 //#region src/components/slider/types.d.ts
+/**
+ * Marker configuration for a single slider marker.
+ */
 type SliderMarker = {
+  /** Numeric value where the marker is placed. */
   value: number;
+  /** Optional label displayed at the marker position. */
   label?: string;
 };
+/**
+ * Configuration for slider markers.
+ *
+ * Can be a number (evenly spaced markers including min/max),
+ * an array of SliderMarker objects, or an array of numeric values.
+ */
 type SliderMarkersConfig = number | SliderMarker[] | number[];
+/**
+ * Props for the Slider component.
+ */
 type SliderProps = Omit<SliderProps$1, 'children' | 'className'> & {
+  /** Custom CSS class names for slider elements. */
   classNames?: {
     slider?: SliderProps$1['className'];
     label?: LabelProps['className'];
@@ -35,7 +50,9 @@ type SliderProps = Omit<SliderProps$1, 'children' | 'className'> & {
     markerDot?: string;
     markerLabel?: string;
   };
+  /** Label text for the slider. */
   label: string;
+  /** Layout variant for the slider. */
   layout?: 'grid' | 'stack';
   /**
    * Configure discrete marker points on the slider track.
@@ -48,6 +65,7 @@ type SliderProps = Omit<SliderProps$1, 'children' | 'className'> & {
    * Whether to display numeric input fields for direct value entry
    */
   showInput?: boolean;
+  /** Whether to display the label. */
   showLabel?: boolean;
   /**
    * Whether to show labels on markers (only applies when markers have labels)

package/dist/components/switch/context.d.ts

@@ -13,26 +13,32 @@
 import { ProviderProps } from "../../lib/types.js";
 import { SwitchProps as SwitchProps$1 } from "./types.js";
 import "client-only";
-import * as react41 from "react";
+import * as react35 from "react";
 import { ContextValue } from "react-aria-components";
-import * as react_jsx_runtime160 from "react/jsx-runtime";
+import * as react_jsx_runtime156 from "react/jsx-runtime";
 
 //#region src/components/switch/context.d.ts
+/** Context for sharing props across Switch components */
+declare const SwitchContext: react35.Context<ContextValue<SwitchProps$1, HTMLLabelElement>>;
 /**
- * Context for Switch component
+ * Sets default props for all Switch components within.
  *
- * Provides context for Switch component to share props
- */
-declare const SwitchContext: react41.Context<ContextValue<SwitchProps$1, HTMLLabelElement>>;
-/**
- * Provider for Switch component
+ * @example
+ * ```tsx
+ * <SwitchProvider isDisabled={true}>
+ *   <Switch>Option 1</Switch>
+ *   <Switch>Option 2</Switch>
+ * </SwitchProvider>
+ * ```
  *
- * Allows setting default props for all Switch components within
+ * @param props - ProviderProps with SwitchProps.
+ * @param props.children - Child components that receive the context.
+ * @returns The SwitchContext provider wrapping children.
  */
 declare function SwitchProvider({
   children,
   ...props
-}: ProviderProps<SwitchProps$1>): react_jsx_runtime160.JSX.Element;
+}: ProviderProps<SwitchProps$1>): react_jsx_runtime156.JSX.Element;
 //#endregion
 export { SwitchContext, SwitchProvider };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/switch/context.js

@@ -18,16 +18,22 @@ import { createContext } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/switch/context.tsx
-/**
-* Context for Switch component
-*
-* Provides context for Switch component to share props
-*/
+/** Context for sharing props across Switch components */
 const SwitchContext = createContext(null);
 /**
-* Provider for Switch component
+* Sets default props for all Switch components within.
+*
+* @example
+* ```tsx
+* <SwitchProvider isDisabled={true}>
+*   <Switch>Option 1</Switch>
+*   <Switch>Option 2</Switch>
+* </SwitchProvider>
+* ```
 *
-* Allows setting default props for all Switch components within
+* @param props - ProviderProps with SwitchProps.
+* @param props.children - Child components that receive the context.
+* @returns The SwitchContext provider wrapping children.
 */
 function SwitchProvider({ children, ...props }) {
 	return /* @__PURE__ */ jsx(SwitchContext.Provider, {

package/dist/components/switch/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/switch/context.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { createContext } from 'react';\nimport type { ContextValue } from 'react-aria-components';\nimport type { ProviderProps } from '@/lib/types';\nimport type { SwitchProps } from './types';\n\n/**\n * Context for Switch component\n *\n * Provides context for Switch component to share props\n */\nexport const SwitchContext =\n  createContext<ContextValue<SwitchProps, HTMLLabelElement>>(null);\n\n/**\n * Provider for Switch component\n *\n * Allows setting default props for all Switch components within\n */\nexport function SwitchProvider({\n  children,\n  ...props\n}: ProviderProps<SwitchProps>) {\n  return (\n    <SwitchContext.Provider value={props}>{children}</SwitchContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,gBACX,cAA2D,KAAK;;;;;;AAOlE,SAAgB,eAAe,EAC7B,UACA,GAAG,SAC0B;AAC7B,QACE,oBAAC,cAAc;EAAS,OAAO;EAAQ;GAAkC"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/switch/context.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { createContext } from 'react';\nimport type { ContextValue } from 'react-aria-components';\nimport type { ProviderProps } from '@/lib/types';\nimport type { SwitchProps } from './types';\n\n/** Context for sharing props across Switch components */\nexport const SwitchContext =\n  createContext<ContextValue<SwitchProps, HTMLLabelElement>>(null);\n\n/**\n * Sets default props for all Switch components within.\n *\n * @example\n * ```tsx\n * <SwitchProvider isDisabled={true}>\n *   <Switch>Option 1</Switch>\n *   <Switch>Option 2</Switch>\n * </SwitchProvider>\n * ```\n *\n * @param props - ProviderProps with SwitchProps.\n * @param props.children - Child components that receive the context.\n * @returns The SwitchContext provider wrapping children.\n */\nexport function SwitchProvider({\n  children,\n  ...props\n}: ProviderProps<SwitchProps>) {\n  return (\n    <SwitchContext.Provider value={props}>{children}</SwitchContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoBA,MAAa,gBACX,cAA2D,KAAK;;;;;;;;;;;;;;;;AAiBlE,SAAgB,eAAe,EAC7B,UACA,GAAG,SAC0B;AAC7B,QACE,oBAAC,cAAc;EAAS,OAAO;EAAQ;GAAkC"}

package/dist/components/switch/index.d.ts

@@ -12,50 +12,33 @@
 
 import { SwitchProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime162 from "react/jsx-runtime";
+import * as react_jsx_runtime158 from "react/jsx-runtime";
 
 //#region src/components/switch/index.d.ts
 
 /**
- * Switch - A toggle control for binary state changes
+ * Switch - Toggle control for binary on/off states
  *
- * Provides an accessible toggle switch component for enabling/disabling features
- * or settings. Offers clear visual feedback for on/off states with smooth transitions
- * and proper keyboard and screen reader support.
+ * Provides visual feedback with smooth transitions and accessible keyboard/screen reader support.
  *
- * @example
- * // Basic switch
- * <Switch>Enable notifications</Switch>
+ * @param props - {@link SwitchProps}
+ * @param props.ref - Ref to the switch label element.
+ * @param props.children - Label content for the switch.
+ * @param props.classNames - Custom CSS class names for switch elements.
+ * @param props.labelPosition - Position of the label relative to the switch control.
+ * @returns The rendered Switch component.
  *
  * @example
- * // Controlled switch
- * <Switch
- *   isSelected={isEnabled}
- *   onChange={setIsEnabled}
- * >
- *   Dark mode
+ * ```tsx
+ * <Switch isSelected={enabled} onChange={setEnabled}>
+ *   Enable notifications
  * </Switch>
- *
- * @example
- * // Switch with default state
- * <Switch defaultSelected>
- *   Auto-save documents
- * </Switch>
- *
- * @example
- * // Disabled switch
- * <Switch isDisabled>
- *   Premium feature (upgrade required)
- * </Switch>
- *
- * @example
- * // Switch without label (icon-only)
- * <Switch aria-label="Toggle sidebar" />
+ * ```
  */
 declare function Switch({
   ref,
   ...props
-}: SwitchProps): react_jsx_runtime162.JSX.Element;
+}: SwitchProps): react_jsx_runtime158.JSX.Element;
 //#endregion
 export { Switch };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/switch/index.js

@@ -22,40 +22,23 @@ import styles from "./styles.module.css";
 
 //#region src/components/switch/index.tsx
 /**
-* Switch - A toggle control for binary state changes
+* Switch - Toggle control for binary on/off states
 *
-* Provides an accessible toggle switch component for enabling/disabling features
-* or settings. Offers clear visual feedback for on/off states with smooth transitions
-* and proper keyboard and screen reader support.
+* Provides visual feedback with smooth transitions and accessible keyboard/screen reader support.
 *
-* @example
-* // Basic switch
-* <Switch>Enable notifications</Switch>
+* @param props - {@link SwitchProps}
+* @param props.ref - Ref to the switch label element.
+* @param props.children - Label content for the switch.
+* @param props.classNames - Custom CSS class names for switch elements.
+* @param props.labelPosition - Position of the label relative to the switch control.
+* @returns The rendered Switch component.
 *
 * @example
-* // Controlled switch
-* <Switch
-*   isSelected={isEnabled}
-*   onChange={setIsEnabled}
-* >
-*   Dark mode
+* ```tsx
+* <Switch isSelected={enabled} onChange={setEnabled}>
+*   Enable notifications
 * </Switch>
-*
-* @example
-* // Switch with default state
-* <Switch defaultSelected>
-*   Auto-save documents
-* </Switch>
-*
-* @example
-* // Disabled switch
-* <Switch isDisabled>
-*   Premium feature (upgrade required)
-* </Switch>
-*
-* @example
-* // Switch without label (icon-only)
-* <Switch aria-label="Toggle sidebar" />
+* ```
 */
 function Switch({ ref, ...props }) {
 	[props, ref] = useContextProps(props, ref ?? null, SwitchContext);

package/dist/components/switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["AriaSwitch","children"],"sources":["../../../src/components/switch/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport {\n  Switch as AriaSwitch,\n  composeRenderProps,\n  useContextProps,\n} from 'react-aria-components';\nimport { SwitchContext } from './context';\nimport styles from './styles.module.css';\nimport type { SwitchProps } from './types';\n\n/**\n * Switch - A toggle control for binary state changes\n *\n * Provides an accessible toggle switch component for enabling/disabling features\n * or settings. Offers clear visual feedback for on/off states with smooth transitions\n * and proper keyboard and screen reader support.\n *\n * @example\n * // Basic switch\n * <Switch>Enable notifications</Switch>\n *\n * @example\n * // Controlled switch\n * <Switch\n *   isSelected={isEnabled}\n *   onChange={setIsEnabled}\n * >\n *   Dark mode\n * </Switch>\n *\n * @example\n * // Switch with default state\n * <Switch defaultSelected>\n *   Auto-save documents\n * </Switch>\n *\n * @example\n * // Disabled switch\n * <Switch isDisabled>\n *   Premium feature (upgrade required)\n * </Switch>\n *\n * @example\n * // Switch without label (icon-only)\n * <Switch aria-label=\"Toggle sidebar\" />\n */\nexport function Switch({ ref, ...props }: SwitchProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SwitchContext);\n\n  const { children, classNames, labelPosition = 'end', ...rest } = props;\n\n  return (\n    <AriaSwitch\n      {...rest}\n      ref={ref}\n      className={composeRenderProps(classNames?.switch, (className) =>\n        clsx('group/switch', styles.switch, styles[labelPosition], className),\n      )}\n    >\n      {composeRenderProps(children, (children) => (\n        <>\n          <span className={clsx(styles.control, classNames?.control)} />\n          {children != null && (\n            <span className={clsx(styles.label, classNames?.label)}>\n              {children}\n            </span>\n          )}\n        </>\n      ))}\n    </AriaSwitch>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,SAAgB,OAAO,EAAE,KAAK,GAAG,SAAsB;AACrD,EAAC,OAAO,OAAO,gBAAgB,OAAO,OAAO,MAAM,cAAc;CAEjE,MAAM,EAAE,UAAU,YAAY,gBAAgB,OAAO,GAAG,SAAS;AAEjE,QACE,oBAACA;EACC,GAAI;EACC;EACL,WAAW,mBAAmB,YAAY,SAAS,cACjD,KAAK,gBAAgB,OAAO,QAAQ,OAAO,gBAAgB,UAAU,CACtE;YAEA,mBAAmB,WAAW,eAC7B,4CACE,oBAAC,UAAK,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ,GAAI,EAC7DC,cAAY,QACX,oBAAC;GAAK,WAAW,KAAK,OAAO,OAAO,YAAY,MAAM;aACnDA;IACI,IAER,CACH;GACS"}
+{"version":3,"file":"index.js","names":["AriaSwitch","children"],"sources":["../../../src/components/switch/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport {\n  Switch as AriaSwitch,\n  composeRenderProps,\n  useContextProps,\n} from 'react-aria-components';\nimport { SwitchContext } from './context';\nimport styles from './styles.module.css';\nimport type { SwitchProps } from './types';\n\n/**\n * Switch - Toggle control for binary on/off states\n *\n * Provides visual feedback with smooth transitions and accessible keyboard/screen reader support.\n *\n * @param props - {@link SwitchProps}\n * @param props.ref - Ref to the switch label element.\n * @param props.children - Label content for the switch.\n * @param props.classNames - Custom CSS class names for switch elements.\n * @param props.labelPosition - Position of the label relative to the switch control.\n * @returns The rendered Switch component.\n *\n * @example\n * ```tsx\n * <Switch isSelected={enabled} onChange={setEnabled}>\n *   Enable notifications\n * </Switch>\n * ```\n */\nexport function Switch({ ref, ...props }: SwitchProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SwitchContext);\n\n  const { children, classNames, labelPosition = 'end', ...rest } = props;\n\n  return (\n    <AriaSwitch\n      {...rest}\n      ref={ref}\n      className={composeRenderProps(classNames?.switch, (className) =>\n        clsx('group/switch', styles.switch, styles[labelPosition], className),\n      )}\n    >\n      {composeRenderProps(children, (children) => (\n        <>\n          <span className={clsx(styles.control, classNames?.control)} />\n          {children != null && (\n            <span className={clsx(styles.label, classNames?.label)}>\n              {children}\n            </span>\n          )}\n        </>\n      ))}\n    </AriaSwitch>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,SAAgB,OAAO,EAAE,KAAK,GAAG,SAAsB;AACrD,EAAC,OAAO,OAAO,gBAAgB,OAAO,OAAO,MAAM,cAAc;CAEjE,MAAM,EAAE,UAAU,YAAY,gBAAgB,OAAO,GAAG,SAAS;AAEjE,QACE,oBAACA;EACC,GAAI;EACC;EACL,WAAW,mBAAmB,YAAY,SAAS,cACjD,KAAK,gBAAgB,OAAO,QAAQ,OAAO,gBAAgB,UAAU,CACtE;YAEA,mBAAmB,WAAW,eAC7B,4CACE,oBAAC,UAAK,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ,GAAI,EAC7DC,cAAY,QACX,oBAAC;GAAK,WAAW,KAAK,OAAO,OAAO,YAAY,MAAM;aACnDA;IACI,IAER,CACH;GACS"}

package/dist/components/switch/types.d.ts

@@ -14,12 +14,17 @@ import { RefAttributes } from "react";
 import { SwitchProps as SwitchProps$1 } from "react-aria-components";
 
 //#region src/components/switch/types.d.ts
+/**
+ * Props for the Switch component.
+ */
 type SwitchProps = Omit<SwitchProps$1, 'className'> & RefAttributes<HTMLLabelElement> & {
+  /** Custom CSS class names for switch elements. */
   classNames?: {
     switch?: SwitchProps$1['className'];
     control?: string;
     label?: string;
   };
+  /** Position of the label relative to the switch control. */
   labelPosition?: 'start' | 'end';
 };
 //#endregion

package/dist/components/table/body.d.ts

@@ -11,16 +11,35 @@
  */
 
 import { TableBodyProps } from "./types.js";
-import * as react_jsx_runtime163 from "react/jsx-runtime";
+import * as react_jsx_runtime145 from "react/jsx-runtime";
 
 //#region src/components/table/body.d.ts
+
+/**
+ * TableBody - Renders the table body section (`<tbody>`).
+ *
+ * @example
+ * ```tsx
+ * <Table>
+ *   <TableHeader headerGroups={table.getHeaderGroups()} />
+ *   <TableBody rows={table.getRowModel().rows} />
+ * </Table>
+ * ```
+ *
+ * @param props - {@link TableBodyProps}
+ * @param props.children - Custom children content.
+ * @param props.className - CSS class for the tbody element.
+ * @param props.ref - Ref to the tbody element.
+ * @param props.rows - Array of TanStack table rows to render.
+ * @returns The rendered TableBody component.
+ */
 declare function TableBody<T>({
   children,
   className,
   ref,
   rows,
   ...rest
-}: TableBodyProps<T>): react_jsx_runtime163.JSX.Element;
+}: TableBodyProps<T>): react_jsx_runtime145.JSX.Element;
 //#endregion
 export { TableBody };
 //# sourceMappingURL=body.d.ts.map

package/dist/components/table/body.js

@@ -16,6 +16,24 @@ import { clsx } from "@accelint/design-foundation/lib/utils";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/table/body.tsx
+/**
+* TableBody - Renders the table body section (`<tbody>`).
+*
+* @example
+* ```tsx
+* <Table>
+*   <TableHeader headerGroups={table.getHeaderGroups()} />
+*   <TableBody rows={table.getRowModel().rows} />
+* </Table>
+* ```
+*
+* @param props - {@link TableBodyProps}
+* @param props.children - Custom children content.
+* @param props.className - CSS class for the tbody element.
+* @param props.ref - Ref to the tbody element.
+* @param props.rows - Array of TanStack table rows to render.
+* @returns The rendered TableBody component.
+*/
 function TableBody({ children, className, ref, rows, ...rest }) {
 	return /* @__PURE__ */ jsx("tbody", {
 		...rest,

package/dist/components/table/body.js.map

@@ -1 +1 @@
-{"version":3,"file":"body.js","names":[],"sources":["../../../src/components/table/body.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { TableRow } from './row';\nimport type { TableBodyProps } from './types';\n\nexport function TableBody<T>({\n  children,\n  className,\n  ref,\n  rows,\n  ...rest\n}: TableBodyProps<T>) {\n  return (\n    <tbody {...rest} ref={ref} className={clsx('group/tbody', className)}>\n      {children || rows?.map((row) => <TableRow key={row.id} row={row} />)}\n    </tbody>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,SAAgB,UAAa,EAC3B,UACA,WACA,KACA,MACA,GAAG,QACiB;AACpB,QACE,oBAAC;EAAM,GAAI;EAAW;EAAK,WAAW,KAAK,eAAe,UAAU;YACjE,YAAY,MAAM,KAAK,QAAQ,oBAAC,YAA2B,OAAb,IAAI,GAAgB,CAAC;GAC9D"}
+{"version":3,"file":"body.js","names":[],"sources":["../../../src/components/table/body.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { TableRow } from './row';\nimport type { TableBodyProps } from './types';\n\n/**\n * TableBody - Renders the table body section (`<tbody>`).\n *\n * @example\n * ```tsx\n * <Table>\n *   <TableHeader headerGroups={table.getHeaderGroups()} />\n *   <TableBody rows={table.getRowModel().rows} />\n * </Table>\n * ```\n *\n * @param props - {@link TableBodyProps}\n * @param props.children - Custom children content.\n * @param props.className - CSS class for the tbody element.\n * @param props.ref - Ref to the tbody element.\n * @param props.rows - Array of TanStack table rows to render.\n * @returns The rendered TableBody component.\n */\nexport function TableBody<T>({\n  children,\n  className,\n  ref,\n  rows,\n  ...rest\n}: TableBodyProps<T>) {\n  return (\n    <tbody {...rest} ref={ref} className={clsx('group/tbody', className)}>\n      {children || rows?.map((row) => <TableRow key={row.id} row={row} />)}\n    </tbody>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,SAAgB,UAAa,EAC3B,UACA,WACA,KACA,MACA,GAAG,QACiB;AACpB,QACE,oBAAC;EAAM,GAAI;EAAW;EAAK,WAAW,KAAK,eAAe,UAAU;YACjE,YAAY,MAAM,KAAK,QAAQ,oBAAC,YAA2B,OAAb,IAAI,GAAgB,CAAC;GAC9D"}

package/dist/components/table/cell.d.ts

@@ -11,16 +11,36 @@
  */
 
 import { TableCellProps } from "./types.js";
-import * as react_jsx_runtime164 from "react/jsx-runtime";
+import * as react_jsx_runtime147 from "react/jsx-runtime";
 
 //#region src/components/table/cell.d.ts
+
+/**
+ * TableCell - Data cell (`<td>`) within a table row.
+ *
+ * @example
+ * ```tsx
+ * <TableRow row={row}>
+ *   {row.getAllCells().map(cell => (
+ *     <TableCell key={cell.id} cell={cell} />
+ *   ))}
+ * </TableRow>
+ * ```
+ *
+ * @param props - {@link TableCellProps}
+ * @param props.children - Custom children content.
+ * @param props.ref - Ref to the td element.
+ * @param props.className - CSS class for the td element.
+ * @param props.cell - TanStack table cell object.
+ * @returns The rendered TableCell component.
+ */
 declare function TableCell<T>({
   children,
   ref,
   className,
   cell,
   ...rest
-}: TableCellProps<T>): react_jsx_runtime164.JSX.Element;
+}: TableCellProps<T>): react_jsx_runtime147.JSX.Element;
 //#endregion
 export { TableCell };
 //# sourceMappingURL=cell.d.ts.map

package/dist/components/table/cell.js

@@ -20,6 +20,25 @@ import { flexRender } from "@tanstack/react-table";
 import styles from "./styles.module.css";
 
 //#region src/components/table/cell.tsx
+/**
+* TableCell - Data cell (`<td>`) within a table row.
+*
+* @example
+* ```tsx
+* <TableRow row={row}>
+*   {row.getAllCells().map(cell => (
+*     <TableCell key={cell.id} cell={cell} />
+*   ))}
+* </TableRow>
+* ```
+*
+* @param props - {@link TableCellProps}
+* @param props.children - Custom children content.
+* @param props.ref - Ref to the td element.
+* @param props.className - CSS class for the td element.
+* @param props.cell - TanStack table cell object.
+* @returns The rendered TableCell component.
+*/
 function TableCell({ children, ref, className, cell, ...rest }) {
 	const { columnSelection, persistNumerals } = useContext(TableContext);
 	const isNumeral = cell?.column.id === HeaderColumnAction.NUMERAL;

package/dist/components/table/cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"cell.js","names":[],"sources":["../../../src/components/table/cell.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { flexRender } from '@tanstack/react-table';\nimport { useContext } from 'react';\nimport { HeaderColumnAction } from './constants/table';\nimport { TableContext } from './context';\nimport styles from './styles.module.css';\nimport type { TableCellProps } from './types';\n\nexport function TableCell<T>({\n  children,\n  ref,\n  className,\n  cell,\n  ...rest\n}: TableCellProps<T>) {\n  const { columnSelection, persistNumerals } = useContext(TableContext);\n  const isNumeral = cell?.column.id === HeaderColumnAction.NUMERAL;\n  const isSelected = cell?.column.id === columnSelection;\n  const notPersistNums = isNumeral && !persistNumerals;\n\n  return (\n    <td\n      {...rest}\n      ref={ref}\n      className={clsx(\n        styles.cell,\n        notPersistNums && styles.hideInRow,\n        className,\n      )}\n      data-selected={isSelected || null}\n      style={{ width: cell?.column.getSize() }}\n    >\n      {children ||\n        (cell && flexRender(cell.column.columnDef.cell, cell.getContext()))}\n    </td>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,SAAgB,UAAa,EAC3B,UACA,KACA,WACA,MACA,GAAG,QACiB;CACpB,MAAM,EAAE,iBAAiB,oBAAoB,WAAW,aAAa;CACrE,MAAM,YAAY,MAAM,OAAO,OAAO,mBAAmB;CACzD,MAAM,aAAa,MAAM,OAAO,OAAO;CACvC,MAAM,iBAAiB,aAAa,CAAC;AAErC,QACE,oBAAC;EACC,GAAI;EACC;EACL,WAAW,KACT,OAAO,MACP,kBAAkB,OAAO,WACzB,UACD;EACD,iBAAe,cAAc;EAC7B,OAAO,EAAE,OAAO,MAAM,OAAO,SAAS,EAAE;YAEvC,YACE,QAAQ,WAAW,KAAK,OAAO,UAAU,MAAM,KAAK,YAAY,CAAC;GACjE"}
+{"version":3,"file":"cell.js","names":[],"sources":["../../../src/components/table/cell.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { flexRender } from '@tanstack/react-table';\nimport { useContext } from 'react';\nimport { HeaderColumnAction } from './constants/table';\nimport { TableContext } from './context';\nimport styles from './styles.module.css';\nimport type { TableCellProps } from './types';\n\n/**\n * TableCell - Data cell (`<td>`) within a table row.\n *\n * @example\n * ```tsx\n * <TableRow row={row}>\n *   {row.getAllCells().map(cell => (\n *     <TableCell key={cell.id} cell={cell} />\n *   ))}\n * </TableRow>\n * ```\n *\n * @param props - {@link TableCellProps}\n * @param props.children - Custom children content.\n * @param props.ref - Ref to the td element.\n * @param props.className - CSS class for the td element.\n * @param props.cell - TanStack table cell object.\n * @returns The rendered TableCell component.\n */\nexport function TableCell<T>({\n  children,\n  ref,\n  className,\n  cell,\n  ...rest\n}: TableCellProps<T>) {\n  const { columnSelection, persistNumerals } = useContext(TableContext);\n  const isNumeral = cell?.column.id === HeaderColumnAction.NUMERAL;\n  const isSelected = cell?.column.id === columnSelection;\n  const notPersistNums = isNumeral && !persistNumerals;\n\n  return (\n    <td\n      {...rest}\n      ref={ref}\n      className={clsx(\n        styles.cell,\n        notPersistNums && styles.hideInRow,\n        className,\n      )}\n      data-selected={isSelected || null}\n      style={{ width: cell?.column.getSize() }}\n    >\n      {children ||\n        (cell && flexRender(cell.column.columnDef.cell, cell.getContext()))}\n    </td>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,SAAgB,UAAa,EAC3B,UACA,KACA,WACA,MACA,GAAG,QACiB;CACpB,MAAM,EAAE,iBAAiB,oBAAoB,WAAW,aAAa;CACrE,MAAM,YAAY,MAAM,OAAO,OAAO,mBAAmB;CACzD,MAAM,aAAa,MAAM,OAAO,OAAO;CACvC,MAAM,iBAAiB,aAAa,CAAC;AAErC,QACE,oBAAC;EACC,GAAI;EACC;EACL,WAAW,KACT,OAAO,MACP,kBAAkB,OAAO,WACzB,UACD;EACD,iBAAe,cAAc;EAC7B,OAAO,EAAE,OAAO,MAAM,OAAO,SAAS,EAAE;YAEvC,YACE,QAAQ,WAAW,KAAK,OAAO,UAAU,MAAM,KAAK,YAAY,CAAC;GACjE"}

package/dist/components/table/constants/table.d.ts

@@ -13,18 +13,24 @@
 import { SafeEnum } from "@accelint/core";
 
 //#region src/components/table/constants/table.d.ts
+/** Sort direction options for table columns. */
 declare const SortDirection: Readonly<{
   readonly ASC: "asc";
   readonly DESC: "desc";
 }>;
+/** Special header column action types. */
 declare const HeaderColumnAction: Readonly<{
   readonly NUMERAL: "numeral";
   readonly KEBAB: "kebab";
   readonly SELECTION: "selection";
 }>;
+/** Type representing a valid sort direction value. */
 type SortDirectionState = SafeEnum<typeof SortDirection>;
+/** Array of valid sort direction values. */
 declare const sortDirectionValues: readonly ["desc" | "asc", ...("desc" | "asc")[]];
+/** Type representing a valid header column action key. */
 type HeaderColumnActionKey = SafeEnum<typeof HeaderColumnAction>;
+/** Array of valid header column action values. */
 declare const headerColumnActionValues: readonly ["numeral" | "kebab" | "selection", ...("numeral" | "kebab" | "selection")[]];
 //#endregion
 export { HeaderColumnAction, HeaderColumnActionKey, SortDirection, SortDirectionState, headerColumnActionValues, sortDirectionValues };

package/dist/components/table/constants/table.js

@@ -14,16 +14,20 @@
 import { getSafeEnumValues } from "@accelint/core";
 
 //#region src/components/table/constants/table.ts
+/** Sort direction options for table columns. */
 const SortDirection = Object.freeze({
 	ASC: "asc",
 	DESC: "desc"
 });
+/** Special header column action types. */
 const HeaderColumnAction = Object.freeze({
 	NUMERAL: "numeral",
 	KEBAB: "kebab",
 	SELECTION: "selection"
 });
+/** Array of valid sort direction values. */
 const sortDirectionValues = getSafeEnumValues(SortDirection);
+/** Array of valid header column action values. */
 const headerColumnActionValues = getSafeEnumValues(HeaderColumnAction);
 
 //#endregion

package/dist/components/table/constants/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","names":[],"sources":["../../../../src/components/table/constants/table.ts"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { getSafeEnumValues, type SafeEnum } from '@accelint/core';\n\nexport const SortDirection = Object.freeze({\n  ASC: 'asc',\n  DESC: 'desc',\n} as const);\n\nexport const HeaderColumnAction = Object.freeze({\n  NUMERAL: 'numeral',\n  KEBAB: 'kebab',\n  SELECTION: 'selection',\n} as const);\n\nexport type SortDirectionState = SafeEnum<typeof SortDirection>;\nexport const sortDirectionValues = getSafeEnumValues(SortDirection);\n\nexport type HeaderColumnActionKey = SafeEnum<typeof HeaderColumnAction>;\nexport const headerColumnActionValues = getSafeEnumValues(HeaderColumnAction);\n"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAa,gBAAgB,OAAO,OAAO;CACzC,KAAK;CACL,MAAM;CACP,CAAU;AAEX,MAAa,qBAAqB,OAAO,OAAO;CAC9C,SAAS;CACT,OAAO;CACP,WAAW;CACZ,CAAU;AAGX,MAAa,sBAAsB,kBAAkB,cAAc;AAGnE,MAAa,2BAA2B,kBAAkB,mBAAmB"}
+{"version":3,"file":"table.js","names":[],"sources":["../../../../src/components/table/constants/table.ts"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { getSafeEnumValues, type SafeEnum } from '@accelint/core';\n\n/** Sort direction options for table columns. */\nexport const SortDirection = Object.freeze({\n  ASC: 'asc',\n  DESC: 'desc',\n} as const);\n\n/** Special header column action types. */\nexport const HeaderColumnAction = Object.freeze({\n  NUMERAL: 'numeral',\n  KEBAB: 'kebab',\n  SELECTION: 'selection',\n} as const);\n\n/** Type representing a valid sort direction value. */\nexport type SortDirectionState = SafeEnum<typeof SortDirection>;\n\n/** Array of valid sort direction values. */\nexport const sortDirectionValues = getSafeEnumValues(SortDirection);\n\n/** Type representing a valid header column action key. */\nexport type HeaderColumnActionKey = SafeEnum<typeof HeaderColumnAction>;\n\n/** Array of valid header column action values. */\nexport const headerColumnActionValues = getSafeEnumValues(HeaderColumnAction);\n"],"mappings":";;;;;;;;;;;;;;;;;AAeA,MAAa,gBAAgB,OAAO,OAAO;CACzC,KAAK;CACL,MAAM;CACP,CAAU;;AAGX,MAAa,qBAAqB,OAAO,OAAO;CAC9C,SAAS;CACT,OAAO;CACP,WAAW;CACZ,CAAU;;AAMX,MAAa,sBAAsB,kBAAkB,cAAc;;AAMnE,MAAa,2BAA2B,kBAAkB,mBAAmB"}

package/dist/components/table/context.d.ts

@@ -11,10 +11,11 @@
  */
 
 import { TableContextValue } from "./types.js";
-import * as react42 from "react";
+import * as react34 from "react";
 
 //#region src/components/table/context.d.ts
-declare const TableContext: react42.Context<TableContextValue>;
+/** Context for sharing table configuration across subcomponents */
+declare const TableContext: react34.Context<TableContextValue>;
 //#endregion
 export { TableContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/table/context.js

@@ -14,6 +14,7 @@
 import { createContext } from "react";
 
 //#region src/components/table/context.tsx
+/** Context for sharing table configuration across subcomponents */
 const TableContext = createContext({
 	moveColumnLeft: () => void 0,
 	moveColumnRight: () => void 0,