npm - @plexui/ui - Versions diffs - 0.19.0 → 0.20.0 - Mend

@plexui/ui 0.19.0 → 0.20.0

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

Files changed (401) hide show

package/dist/es/components/Slider/Slider.js CHANGED Viewed

@@ -1,25 +1,29 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
-import clamp from "lodash/clamp";
-import round from "lodash/round";
+import clamp from "lodash/clamp.js";
+import round from "lodash/round.js";
 import { Slider as RadixSlider } from "radix-ui";
 import { memo, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, } from "react";
 import { useDebounceCallback, useResizeObserver } from "usehooks-ts";
-import { useBreakpoint } from "../../hooks/useBreakpoints";
-import { useIsMounted } from "../../hooks/useIsMounted";
-import { useLatestValue } from "../../hooks/useLatestValue";
-import { usePrevious } from "../../hooks/usePrevious";
-import { toCssVariables } from "../../lib/helpers";
-import { Button } from "../Button";
-import { Reload } from "../Icon";
-import { Tooltip } from "../Tooltip";
-import s from "./Slider.module.css";
+import { useBreakpoint } from "../../hooks/useBreakpoints.js";
+import { useIsMounted } from "../../hooks/useIsMounted.js";
+import { useLatestValue } from "../../hooks/useLatestValue.js";
+import { usePrevious } from "../../hooks/usePrevious.js";
+import { useStableCallback } from "../../hooks/useStableCallback.js";
+import { toCssVariables } from "../../lib/helpers.js";
+import { Button } from "../Button/index.js";
+import { Reload } from "../Icon/index.js";
+import { Tooltip } from "../Tooltip/index.js";
+import s from "@plexui/styles/components/Slider/Slider.module.css";
 export const Slider = memo((props) => {
-    const { className, onChange, min, max, step, disabled, value, onBlur, onFocus, unit, prefixUnit, label, marks: propMarks = [], trackColor, rangeColor, orientation = "horizontal", ref: forwardedRef, } = props;
+    const { className, onChange, min, max, step, disabled, value, onBlur, onFocus, unit, prefixUnit, label, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, marks: propMarks = [], trackColor, rangeColor, orientation = "horizontal", ref: forwardedRef, } = props;
     const isRange = props.range === true;
     const isVertical = orientation === "vertical";
     const id = useId();
+    const labelId = `${id}-label`;
+    // What names the thumbs: an explicit labelledby, else the visible label
+    const nameId = ariaLabelledBy ?? (label ? labelId : undefined);
     const precision = useMemo(() => String(step).split(".")[1]?.length ?? 0, [step]);
     // Single-mode state for editable input
     const singleValue = isRange ? 0 : value;
@@ -29,7 +33,9 @@ export const Slider = memo((props) => {
     }, [precision]);
     // prevents input from jumping around while the user is typing
     const singleOnChange = isRange ? undefined : onChange;
-    const debouncedOnChange = useDebounceCallback(singleOnChange ?? (() => { }), 250);
+    // One debounced function for the slider's lifetime (calling the latest
+    // onChange), so an immediate change can cancel the pending typed one
+    const debouncedOnChange = useDebounceCallback(useStableCallback((nextValue) => singleOnChange?.(nextValue)), 250);
     const [pointerDown, setPointerDown] = useState(false);
     const isMounted = useIsMounted();
     // Used to position the input over the thumb
@@ -46,10 +52,11 @@ export const Slider = memo((props) => {
         : Math.max(Math.abs(percent - previousPercent) * 300, 100);
     // We assume that the width of the thumb does not change from render to render
     const thumbRef = useRef(null);
-    // Sort marks for collision detection
+    // Sort marks for collision detection, again only when a value or label changes
+    const marksKey = JSON.stringify(propMarks.map(({ value, label }) => [value, label]));
     const marks = useMemo(() => [...propMarks].sort((a, b) => a.value - b.value),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [propMarks.length]);
+    [marksKey]);
     // Validate marks
     useEffect(() => {
         if (!marks)
@@ -86,17 +93,19 @@ export const Slider = memo((props) => {
             setInputValueNumber(value);
         }
     }, [value, setInputValueNumber, isRange]);
-    // Single-mode keyboard handler
+    // Single-mode keyboard handler: a key's change replaces a pending typed one
     const handleKeyDown = (evt) => {
         if (isRange || !singleOnChange)
             return;
         if (evt.key === "Home") {
             evt.preventDefault();
+            debouncedOnChange.cancel();
             singleOnChange(min);
             setInputValueNumber(min);
         }
         if (evt.key === "End") {
             evt.preventDefault();
+            debouncedOnChange.cancel();
             singleOnChange(max);
             setInputValueNumber(max);
         }
@@ -104,6 +113,7 @@ export const Slider = memo((props) => {
             evt.preventDefault();
             const multiplier = evt.shiftKey ? 10 : 1;
             const next = clamp(singleValue + step * multiplier, min, max);
+            debouncedOnChange.cancel();
             singleOnChange(next);
             setInputValueNumber(next);
         }
@@ -111,6 +121,7 @@ export const Slider = memo((props) => {
             evt.preventDefault();
             const multiplier = evt.shiftKey ? 10 : 1;
             const next = clamp(singleValue - step * multiplier, min, max);
+            debouncedOnChange.cancel();
             singleOnChange(next);
             setInputValueNumber(next);
         }
@@ -122,8 +133,14 @@ export const Slider = memo((props) => {
     const handleInputChange = (evt) => {
         if (isRange || !singleOnChange)
             return;
-        const nextValue = evt.currentTarget.value.replace(/[^\d.]/, "").trim();
+        // Digits and dots, plus a leading minus when the slider goes below zero
+        const nextValue = evt.currentTarget.value.replace(min < 0 ? /(?!^-)[^\d.]/g : /[^\d.]/g, "").trim();
         let parsed = parseFloat(nextValue || "0");
+        if (Number.isNaN(parsed)) {
+            // A lone "-" or "." is a number still being typed: nothing to report yet
+            setInputValue(nextValue);
+            return;
+        }
         parsed = clamp(parsed, min, max);
         if (step >= 1) {
             parsed = Math.floor(parsed);
@@ -134,6 +151,8 @@ export const Slider = memo((props) => {
     const handleInputBlur = (evt) => {
         if (isRange || !singleOnChange)
             return;
+        // Blur commits the typed text, so its pending debounced change is dropped
+        debouncedOnChange.cancel();
         let parsed = parseFloat(evt.target.value.trim()) || 0;
         if (step >= 1) {
             parsed = Math.floor(parsed);
@@ -170,15 +189,24 @@ export const Slider = memo((props) => {
             .map((v) => `${prefixUnit ?? ""}${v.toFixed(precision)}${unit ?? ""}`)
             .join(" – ")
         : "";
-    return (_jsxs("div", { className: clsx(s.SliderWrap, className), "data-orientation": orientation, children: [label && (_jsxs("div", { className: s.SliderLabel, children: [_jsx("label", { htmlFor: id, className: "flex-1", children: label }), !isRange && resetValue !== undefined && (_jsx(Tooltip, { content: resetTooltip, compact: true, children: _jsx(Button, { size: "2xs", variant: "ghost", color: "secondary", className: s.Reset, "data-hide": disabled || (resetValue === singleValue && !pointerDown), onClick: () => singleOnChange(resetValue), children: _jsx(Reload, {}) }) })), isRange ? (_jsx("span", { className: s.RangeDisplay, children: rangeDisplayText })) : (_jsxs("div", { className: s.SliderValue, onClick: () => inputRef.current?.focus(), children: [prefixUnit && _jsx("span", { className: s.ValueUnit, children: prefixUnit }), _jsx("input", { id: id, className: s.ValueInput, ref: inputRef, style: { width: `${Math.ceil(inputWidth)}px` }, onKeyDown: handleKeyDown, value: inputValue, type: "text", onClick: (e) => e.stopPropagation(), onBlur: handleInputBlur, onFocus: (e) => {
+    return (_jsxs("div", { className: clsx(s.SliderWrap, className), "data-orientation": orientation, children: [label && (_jsxs("div", { className: s.SliderLabel, children: [_jsx("label", { htmlFor: isRange ? undefined : id, id: labelId, className: "flex-1", children: label }), !isRange && resetValue !== undefined && (_jsx(Tooltip, { content: resetTooltip, compact: true, children: _jsx(Button, { size: "2xs", variant: "ghost", color: "secondary", className: s.Reset, "aria-label": resetTooltip, "data-hide": disabled || (resetValue === singleValue && !pointerDown), onClick: () => singleOnChange(resetValue), children: _jsx(Reload, {}) }) })), isRange ? (_jsx("span", { className: s.RangeDisplay, children: rangeDisplayText })) : (_jsxs("div", { className: s.SliderValue, onClick: () => inputRef.current?.focus(), children: [prefixUnit && _jsx("span", { className: s.ValueUnit, children: prefixUnit }), _jsx("input", { id: id, className: s.ValueInput, ref: inputRef, style: { width: `${Math.ceil(inputWidth)}px` }, onKeyDown: handleKeyDown, value: inputValue, type: "text", onClick: (e) => e.stopPropagation(), onBlur: handleInputBlur, onFocus: (e) => {
                                     e.currentTarget.setSelectionRange(0, e.currentTarget.value.length);
                                     onFocus?.(e);
                                 }, onChange: handleInputChange, disabled: disabled }), unit && _jsx("span", { className: s.ValueUnit, children: unit })] }))] })), _jsxs("div", { className: s.SliderContainer, children: [_jsxs(RadixSlider.Root, { ref: forwardedRef, className: s.Slider, onValueChange: handleValueChange, min: min, max: max, step: step, disabled: disabled, value: radixValue, orientation: orientation, minStepsBetweenThumbs: minStepsBetweenThumbs, onBlur: onBlur, onFocus: onFocus, onPointerDown: () => setPointerDown(true), onPointerUp: () => setPointerDown(false), style: toCssVariables({
                             "slider-duration": `${animationDurationMS}ms`,
                             "slider-track-color": trackColor,
                             "slider-range-color": rangeColor,
-                        }), children: [_jsx(RadixSlider.Track, { className: s.Track, children: _jsx(RadixSlider.Range, { className: s.Range }) }), isRange ? (value.map((_, i) => (_jsx(RadixSlider.Thumb, { className: s.Thumb }, i)))) : (_jsx(RadixSlider.Thumb, { className: s.Thumb, ref: thumbRef }))] }), showMarks && _jsx(SliderMarks, { marks: marks, thumbRef: thumbRef, min: min, max: max })] })] }));
+                        }), children: [_jsx(RadixSlider.Track, { className: s.Track, children: _jsx(RadixSlider.Range, { className: s.Range }) }), isRange ? (value.map((_, i) => (_jsx(RadixSlider.Thumb, { id: `${id}-thumb-${i}`, className: s.Thumb,
+                                // The marks measure the first thumb (all thumbs are the same size)
+                                ref: i === 0 ? thumbRef : undefined, "aria-labelledby": nameId ? `${nameId} ${id}-thumb-${i}` : undefined, ...(!nameId && ariaLabel
+                                    ? {
+                                        "aria-label": `${ariaLabel} ${rangeThumbName(i, value.length)}`.trim(),
+                                    }
+                                    : {}) }, i)))) : (_jsx(RadixSlider.Thumb, { className: s.Thumb, ref: thumbRef, "aria-labelledby": nameId, ...(!nameId && ariaLabel ? { "aria-label": ariaLabel } : {}) }))] }), showMarks && _jsx(SliderMarks, { marks: marks, thumbRef: thumbRef, min: min, max: max })] })] }));
 });
+Slider.displayName = "Slider";
+// Matches the names Radix gives range thumbs on its own
+const rangeThumbName = (index, count) => count === 2 ? (index === 0 ? "Minimum" : "Maximum") : count > 2 ? `Value ${index + 1} of ${count}` : "";
 // The minimum difference we enforce between marks, in pixels
 const MINIMUM_MARK_SPACING_PX = 16;
 const SliderMarks = memo(({ marks, thumbRef, min, max }) => {
@@ -255,4 +283,5 @@ const SliderMarks = memo(({ marks, thumbRef, min, max }) => {
     }, [marks, thumbRef, marksContainerRef, min, max, sliderWidth]);
     return (_jsx("div", { className: s.MarksContainer, ref: marksContainerRef, children: _jsx("div", { ref: measureRef, children: marks.map((mark) => (_jsx("div", { className: s.Mark, "data-mark": true, children: _jsx("span", { className: s.MarkLabel, children: mark.label }) }, mark.value))) }) }));
 });
+SliderMarks.displayName = "SliderMarks";
 //# sourceMappingURL=Slider.js.map

package/dist/es/components/Slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport clamp from \"lodash/clamp\"\nimport round from \"lodash/round\"\nimport { Slider as RadixSlider } from \"radix-ui\"\nimport {\n type ChangeEventHandler,\n type ElementRef,\n type FocusEventHandler,\n type KeyboardEventHandler,\n memo,\n type ReactNode,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { useDebounceCallback, useResizeObserver } from \"usehooks-ts\"\nimport { useBreakpoint } from \"../../hooks/useBreakpoints\"\nimport { useIsMounted } from \"../../hooks/useIsMounted\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { usePrevious } from \"../../hooks/usePrevious\"\nimport { toCssVariables } from \"../../lib/helpers\"\nimport { Button } from \"../Button\"\nimport { Reload } from \"../Icon\"\nimport { Tooltip } from \"../Tooltip\"\nimport s from \"./Slider.module.css\"\n\nexport type SliderMark = {\n value: number\n label: string\n}\n\ntype SliderBaseProps = {\n /*\n The minimum value the slider can have\n /\n min: number\n /\n The maximum value the slider can have\n /\n max: number\n /\n The step increment between slider values\n /\n step: number\n /\n Unit to display next to the slider value (e.g., ms, px)\n /\n unit?: string\n /\n Unit to display to the right of the slider value (e.g., $)\n /\n prefixUnit?: string\n /\n Optional label for the slider, which can be a string or React node.\n /\n label?: ReactNode\n /\n List of marks to display below the slider track\n /\n marks?: SliderMark[]\n /\n Color of the slider track\n /\n trackColor?: string\n /\n Color of the slider progress along the track\n /\n rangeColor?: string\n className?: string\n disabled?: boolean\n /\n Orientation of the slider\n * @default \"horizontal\"\n /\n orientation?: \"horizontal\" \| \"vertical\"\n onBlur?: FocusEventHandler<HTMLInputElement>\n onFocus?: FocusEventHandler<HTMLInputElement>\n ref?: React.Ref<ElementRef<typeof RadixSlider.Root> \| null>\n}\n\ntype SingleSliderProps = SliderBaseProps & {\n /\n When false or omitted, the slider has a single thumb\n /\n range?: false\n /\n The current value of the slider\n /\n value: number\n /\n Callback function invoked when the slider value changes.\n /\n onChange: (value: number) => void\n /\n Value that will be offered as a \"reset to default\" option\n /\n resetValue?: number\n /\n String that will be displayed in the tooltip\n * @default Reset to default\n /\n resetTooltip?: string\n}\n\ntype RangeSliderProps = SliderBaseProps & {\n /\n When true, the slider supports multiple thumbs\n /\n range: true\n /\n Array of values, one per thumb\n /\n value: number[]\n /\n Callback function invoked when slider values change.\n /\n onChange: (value: number[]) => void\n /\n Minimum number of steps between thumbs\n /\n minStepsBetweenThumbs?: number\n}\n\nexport type SliderProps = SingleSliderProps \| RangeSliderProps\n\nexport const Slider = memo((props: SliderProps) => {\n const {\n className,\n onChange,\n min,\n max,\n step,\n disabled,\n value,\n onBlur,\n onFocus,\n unit,\n prefixUnit,\n label,\n marks: propMarks = [],\n trackColor,\n rangeColor,\n orientation = \"horizontal\",\n ref: forwardedRef,\n } = props\n\n const isRange = props.range === true\n const isVertical = orientation === \"vertical\"\n\n const id = useId()\n const precision = useMemo(() => String(step).split(\".\")[1]?.length ?? 0, [step])\n\n // Single-mode state for editable input\n const singleValue = isRange ? 0 : (value as number)\n const [inputValue, setInputValue] = useState<string>(\n isRange ? \"\" : String((value as number).toFixed(precision)),\n )\n const setInputValueNumber = useCallback(\n (nextValue: number) => {\n setInputValue(nextValue.toFixed(precision))\n },\n [precision],\n )\n\n // prevents input from jumping around while the user is typing\n const singleOnChange = isRange ? undefined : (onChange as (v: number) => void)\n const debouncedOnChange = useDebounceCallback(singleOnChange ?? (() => {}), 250)\n const [pointerDown, setPointerDown] = useState(false)\n const isMounted = useIsMounted()\n\n // Used to position the input over the thumb\n const isTabletAndUp = useBreakpoint(\"md\")\n const inputRef = useRef<HTMLInputElement>(null)\n\n // The input width is based on the number of characters in the input / font size\n const inputWidth = Math.max(inputValue.length, 1) (isTabletAndUp ? 7.8 : 9.5)\n\n // Calculate animation duration based on the distance the thumb needs to move\n // Skip custom animation for range mode — let Radix handle it\n const percent = isRange ? 0 : ((value as number) - min) / (max - min)\n const previousPercent = usePrevious(percent)\n const animationDurationMS =\n isRange \|\| !isMounted \|\| pointerDown\n ? 0\n : Math.max(Math.abs(percent - previousPercent) * 300, 100)\n\n // We assume that the width of the thumb does not change from render to render\n const thumbRef = useRef<HTMLDivElement>(null)\n\n // Sort marks for collision detection\n const marks = useMemo<SliderMark[]>(\n () => [...propMarks].sort((a, b) => a.value - b.value),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [propMarks.length],\n )\n\n // Validate marks\n useEffect(() => {\n if (!marks) return\n const markValues = new Set<number>()\n for (const mark of marks) {\n if (mark.value < min \|\| mark.value > max) {\n throw new Error(`Slider mark value ${mark.value} is out of bounds [${min}, ${max}]`)\n }\n if (markValues.has(mark.value)) {\n throw new Error(\"Slider marks must have unique values\")\n }\n markValues.add(mark.value)\n }\n }, [marks, max, min])\n\n // Update value if out of bounds (single mode only)\n const latestValue = useLatestValue(value)\n const latestOnChange = useLatestValue(onChange)\n useEffect(() => {\n if (isRange) return\n const v = latestValue.current as number\n const clamped = clamp(v, min, max)\n if (clamped !== v) {\n ;(latestOnChange.current as (v: number) => void)(clamped)\n setInputValueNumber(clamped)\n }\n }, [max, min, latestValue, latestOnChange, setInputValueNumber, isRange])\n\n useEffect(() => {\n if (isRange) return\n if (inputRef.current !== document.activeElement) {\n setInputValueNumber(value as number)\n }\n }, [value, setInputValueNumber, isRange])\n\n // Single-mode keyboard handler\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n if (evt.key === \"Home\") {\n evt.preventDefault()\n singleOnChange(min)\n setInputValueNumber(min)\n }\n if (evt.key === \"End\") {\n evt.preventDefault()\n singleOnChange(max)\n setInputValueNumber(max)\n }\n if (evt.key === \"ArrowUp\") {\n evt.preventDefault()\n const multiplier = evt.shiftKey ? 10 : 1\n const next = clamp(singleValue + step * multiplier, min, max)\n singleOnChange(next)\n setInputValueNumber(next)\n }\n if (evt.key === \"ArrowDown\") {\n evt.preventDefault()\n const multiplier = evt.shiftKey ? 10 : 1\n const next = clamp(singleValue - step * multiplier, min, max)\n singleOnChange(next)\n setInputValueNumber(next)\n }\n if (evt.key === \"Enter\" \|\| evt.key === \"Escape\") {\n evt.preventDefault()\n evt.currentTarget.blur()\n }\n }\n\n const handleInputChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n const nextValue = evt.currentTarget.value.replace(/[^\\d.]/, \"\").trim()\n let parsed = parseFloat(nextValue \|\| \"0\")\n parsed = clamp(parsed, min, max)\n if (step >= 1) {\n parsed = Math.floor(parsed)\n }\n debouncedOnChange(parsed)\n setInputValue(nextValue)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n let parsed = parseFloat(evt.target.value.trim()) \|\| 0\n if (step >= 1) {\n parsed = Math.floor(parsed)\n } else {\n parsed = round(parsed, precision)\n }\n parsed = clamp(parsed, min, max)\n if (parsed !== singleValue) {\n singleOnChange(parsed)\n }\n setInputValueNumber(parsed)\n onBlur?.(evt)\n }\n\n // Radix value/onChange wiring\n const radixValue = isRange ? (value as number[]) : [value as number]\n const handleValueChange = isRange\n ? (values: number[]) => (onChange as (v: number[]) => void)(values)\n : (values: number[]) => (onChange as (v: number) => void)(values[0])\n\n // Single-mode props\n const resetValue = !isRange ? (props as SingleSliderProps).resetValue : undefined\n const resetTooltip = !isRange\n ? (props as SingleSliderProps).resetTooltip ?? \"Reset to default\"\n : undefined\n\n // Range-mode props\n const minStepsBetweenThumbs = isRange\n ? (props as RangeSliderProps).minStepsBetweenThumbs\n : undefined\n\n // Show marks only in horizontal orientation\n const showMarks = marks.length > 0 && !isVertical\n\n // Format range display text\n const rangeDisplayText = isRange\n ? (value as number[])\n .map((v) => `${prefixUnit ?? \"\"}${v.toFixed(precision)}${unit ?? \"\"}`)\n .join(\" – \")\n : \"\"\n\n return (\n <div\n className={clsx(s.SliderWrap, className)}\n data-orientation={orientation}\n >\n {label && (\n <div className={s.SliderLabel}>\n <label htmlFor={id} className=\"flex-1\">\n {label}\n </label>\n {!isRange && resetValue !== undefined && (\n <Tooltip content={resetTooltip!} compact>\n <Button\n size=\"2xs\"\n variant=\"ghost\"\n color=\"secondary\"\n className={s.Reset}\n data-hide={disabled \|\| (resetValue === singleValue && !pointerDown)}\n onClick={() => singleOnChange!(resetValue)}\n >\n <Reload />\n </Button>\n </Tooltip>\n )}\n {isRange ? (\n <span className={s.RangeDisplay}>{rangeDisplayText}</span>\n ) : (\n <div className={s.SliderValue} onClick={() => inputRef.current?.focus()}>\n {prefixUnit && <span className={s.ValueUnit}>{prefixUnit}</span>}\n <input\n id={id}\n className={s.ValueInput}\n ref={inputRef}\n style={{ width: `${Math.ceil(inputWidth)}px` }}\n onKeyDown={handleKeyDown}\n value={inputValue}\n type=\"text\"\n onClick={(e) => e.stopPropagation()}\n onBlur={handleInputBlur}\n onFocus={(e) => {\n e.currentTarget.setSelectionRange(0, e.currentTarget.value.length)\n onFocus?.(e)\n }}\n onChange={handleInputChange}\n disabled={disabled}\n />\n {unit && <span className={s.ValueUnit}>{unit}</span>}\n </div>\n )}\n </div>\n )}\n <div className={s.SliderContainer}>\n <RadixSlider.Root\n ref={forwardedRef}\n className={s.Slider}\n onValueChange={handleValueChange}\n min={min}\n max={max}\n step={step}\n disabled={disabled}\n value={radixValue}\n orientation={orientation}\n minStepsBetweenThumbs={minStepsBetweenThumbs}\n onBlur={onBlur}\n onFocus={onFocus}\n onPointerDown={() => setPointerDown(true)}\n onPointerUp={() => setPointerDown(false)}\n style={toCssVariables({\n \"slider-duration\": `${animationDurationMS}ms`,\n \"slider-track-color\": trackColor,\n \"slider-range-color\": rangeColor,\n })}\n >\n <RadixSlider.Track className={s.Track}>\n <RadixSlider.Range className={s.Range} />\n </RadixSlider.Track>\n {isRange ? (\n (value as number[]).map((_, i) => (\n <RadixSlider.Thumb key={i} className={s.Thumb} />\n ))\n ) : (\n <RadixSlider.Thumb className={s.Thumb} ref={thumbRef} />\n )}\n </RadixSlider.Root>\n {showMarks && <SliderMarks marks={marks} thumbRef={thumbRef} min={min} max={max} />}\n </div>\n </div>\n )\n})\n\ntype MarksProps = {\n marks: SliderMark[]\n thumbRef: React.RefObject<HTMLDivElement \| null>\n min: number\n max: number\n}\n\n// The minimum difference we enforce between marks, in pixels\nconst MINIMUM_MARK_SPACING_PX = 16\n\nconst SliderMarks = memo(({ marks, thumbRef, min, max }: MarksProps) => {\n // We seperate the container and measure divs so that our resize observer\n // does not fire when we adjust the height of the marks container.\n const marksContainerRef = useRef<HTMLDivElement>(null)\n const measureRef = useRef<HTMLDivElement>(null)\n\n // We measure the width of the slider within this component so that sliders\n // without marks do not pay a performance penalty.\n // @ts-expect-error(2322) -- bug in types: https://github.com/juliencrn/usehooks-ts/issues/663\n const { width: sliderWidth } = useResizeObserver({ ref: measureRef })\n\n useLayoutEffect(() => {\n // Impossible\n if (!thumbRef.current \|\| !marksContainerRef.current) {\n return\n }\n\n const markElements = Array.from(\n marksContainerRef.current.querySelectorAll(\"[data-mark]\"),\n ) as HTMLDivElement[]\n\n const thumbHalfWidth = thumbRef.current.getBoundingClientRect().width / 2\n\n // Wipe all styles so we can accurately determine the positions of the marks\n markElements.forEach((markEl) => {\n markEl.style.width = \"\"\n markEl.style.display = \"\"\n })\n\n const positionMarks = () => {\n if (!sliderWidth) {\n return\n }\n\n markElements.forEach((markEl, index) => {\n const markValue = marks[index].value\n const valuePercent = (markValue - min) / (max - min)\n const markWidth = markEl.getBoundingClientRect().width\n const markHalfWidth = markWidth / 2\n\n // Radix smoothes the width of the thumb over the entire track so\n // that the thumb is always within bounds. We need to duplicate\n // this smoothing so that the marks match the observed breakpoints.\n const smoothedThumb = thumbHalfWidth - valuePercent * (thumbHalfWidth / 0.5)\n\n // Calculate where we would naively put the mark based on the value\n const naiveLeftOffset = valuePercent * sliderWidth\n\n // Add the thumb smoothing, and account for the width of the mark itself\n let left = naiveLeftOffset + smoothedThumb - markHalfWidth\n\n // Clamp to the left and right bounds of the container\n left = Math.max(0, Math.min(left, sliderWidth - markWidth))\n\n markEl.style.left = `${left}px`\n })\n }\n\n const marksHaveCollisions = () => {\n for (let i = 0; i < markElements.length - 1; i++) {\n const currentRect = markElements[i].getBoundingClientRect()\n const nextRect = markElements[i + 1].getBoundingClientRect()\n\n if (currentRect.right + MINIMUM_MARK_SPACING_PX > nextRect.left) {\n return true\n }\n }\n return false\n }\n\n positionMarks()\n\n // If we have collisions, try to wrap the content\n if (marksHaveCollisions()) {\n markElements.forEach((markEl) => {\n markEl.style.width = \"min-content\"\n })\n\n positionMarks()\n\n // Hide all marks if we still have collisions\n if (marksHaveCollisions()) {\n markElements.forEach((markEl) => {\n markEl.style.display = \"none\"\n })\n }\n }\n\n const tallestHeight = Math.max(\n ...markElements.map((markEl) => markEl.getBoundingClientRect().height),\n )\n\n // Give our container a height so that we allocate space on the page\n // for the marks and push down other content when we have to wrap\n marksContainerRef.current.style.height = tallestHeight > 0 ? `${tallestHeight}px` : \"\"\n }, [marks, thumbRef, marksContainerRef, min, max, sliderWidth])\n\n return (\n <div className={s.MarksContainer} ref={marksContainerRef}>\n <div ref={measureRef}>\n {marks.map((mark) => (\n <div key={mark.value} className={s.Mark} data-mark>\n <span className={s.MarkLabel}>{mark.label}</span>\n </div>\n ))}\n </div>\n </div>\n )\n})\n"]}
1	+ {"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport clamp from \"lodash/clamp\"\nimport round from \"lodash/round\"\nimport { Slider as RadixSlider } from \"radix-ui\"\nimport {\n type ChangeEventHandler,\n type ElementRef,\n type FocusEventHandler,\n type KeyboardEventHandler,\n memo,\n type ReactNode,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { useDebounceCallback, useResizeObserver } from \"usehooks-ts\"\nimport { useBreakpoint } from \"../../hooks/useBreakpoints\"\nimport { useIsMounted } from \"../../hooks/useIsMounted\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { usePrevious } from \"../../hooks/usePrevious\"\nimport { useStableCallback } from \"../../hooks/useStableCallback\"\nimport { toCssVariables } from \"../../lib/helpers\"\nimport { Button } from \"../Button\"\nimport { Reload } from \"../Icon\"\nimport { Tooltip } from \"../Tooltip\"\nimport s from \"@plexui/styles/components/Slider/Slider.module.css\"\n\nexport type SliderMark = {\n value: number\n label: string\n}\n\ntype SliderBaseProps = {\n /*\n The minimum value the slider can have\n /\n min: number\n /\n The maximum value the slider can have\n /\n max: number\n /\n The step increment between slider values\n /\n step: number\n /\n Unit to display next to the slider value (e.g., ms, px)\n /\n unit?: string\n /\n Unit to display to the right of the slider value (e.g., $)\n /\n prefixUnit?: string\n /\n Optional label for the slider, which can be a string or React node.\n /\n label?: ReactNode\n /\n Accessible name for the slider when there is no visible `label`\n /\n \"aria-label\"?: string\n /\n Id of an element that names the slider; takes precedence over `label`\n /\n \"aria-labelledby\"?: string\n /\n List of marks to display below the slider track\n /\n marks?: SliderMark[]\n /\n Color of the slider track\n /\n trackColor?: string\n /\n Color of the slider progress along the track\n /\n rangeColor?: string\n className?: string\n disabled?: boolean\n /\n Orientation of the slider\n * @default \"horizontal\"\n /\n orientation?: \"horizontal\" \| \"vertical\"\n onBlur?: FocusEventHandler<HTMLInputElement>\n onFocus?: FocusEventHandler<HTMLInputElement>\n ref?: React.Ref<ElementRef<typeof RadixSlider.Root> \| null>\n}\n\ntype SingleSliderProps = SliderBaseProps & {\n /\n When false or omitted, the slider has a single thumb\n /\n range?: false\n /\n The current value of the slider\n /\n value: number\n /\n Callback function invoked when the slider value changes.\n /\n onChange: (value: number) => void\n /\n Value that will be offered as a \"reset to default\" option\n /\n resetValue?: number\n /\n String that will be displayed in the tooltip\n * @default Reset to default\n /\n resetTooltip?: string\n}\n\ntype RangeSliderProps = SliderBaseProps & {\n /\n When true, the slider supports multiple thumbs\n /\n range: true\n /\n Array of values, one per thumb\n /\n value: number[]\n /\n Callback function invoked when slider values change.\n /\n onChange: (value: number[]) => void\n /\n Minimum number of steps between thumbs\n /\n minStepsBetweenThumbs?: number\n}\n\nexport type SliderProps = SingleSliderProps \| RangeSliderProps\n\nexport const Slider = memo((props: SliderProps) => {\n const {\n className,\n onChange,\n min,\n max,\n step,\n disabled,\n value,\n onBlur,\n onFocus,\n unit,\n prefixUnit,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n marks: propMarks = [],\n trackColor,\n rangeColor,\n orientation = \"horizontal\",\n ref: forwardedRef,\n } = props\n\n const isRange = props.range === true\n const isVertical = orientation === \"vertical\"\n\n const id = useId()\n const labelId = `${id}-label`\n // What names the thumbs: an explicit labelledby, else the visible label\n const nameId = ariaLabelledBy ?? (label ? labelId : undefined)\n const precision = useMemo(() => String(step).split(\".\")[1]?.length ?? 0, [step])\n\n // Single-mode state for editable input\n const singleValue = isRange ? 0 : (value as number)\n const [inputValue, setInputValue] = useState<string>(\n isRange ? \"\" : String((value as number).toFixed(precision)),\n )\n const setInputValueNumber = useCallback(\n (nextValue: number) => {\n setInputValue(nextValue.toFixed(precision))\n },\n [precision],\n )\n\n // prevents input from jumping around while the user is typing\n const singleOnChange = isRange ? undefined : (onChange as (v: number) => void)\n // One debounced function for the slider's lifetime (calling the latest\n // onChange), so an immediate change can cancel the pending typed one\n const debouncedOnChange = useDebounceCallback(\n useStableCallback((nextValue: number) => singleOnChange?.(nextValue)),\n 250,\n )\n const [pointerDown, setPointerDown] = useState(false)\n const isMounted = useIsMounted()\n\n // Used to position the input over the thumb\n const isTabletAndUp = useBreakpoint(\"md\")\n const inputRef = useRef<HTMLInputElement>(null)\n\n // The input width is based on the number of characters in the input / font size\n const inputWidth = Math.max(inputValue.length, 1) (isTabletAndUp ? 7.8 : 9.5)\n\n // Calculate animation duration based on the distance the thumb needs to move\n // Skip custom animation for range mode — let Radix handle it\n const percent = isRange ? 0 : ((value as number) - min) / (max - min)\n const previousPercent = usePrevious(percent)\n const animationDurationMS =\n isRange \|\| !isMounted \|\| pointerDown\n ? 0\n : Math.max(Math.abs(percent - previousPercent) * 300, 100)\n\n // We assume that the width of the thumb does not change from render to render\n const thumbRef = useRef<HTMLDivElement>(null)\n\n // Sort marks for collision detection, again only when a value or label changes\n const marksKey = JSON.stringify(propMarks.map(({ value, label }) => [value, label]))\n const marks = useMemo<SliderMark[]>(\n () => [...propMarks].sort((a, b) => a.value - b.value),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [marksKey],\n )\n\n // Validate marks\n useEffect(() => {\n if (!marks) return\n const markValues = new Set<number>()\n for (const mark of marks) {\n if (mark.value < min \|\| mark.value > max) {\n throw new Error(`Slider mark value ${mark.value} is out of bounds [${min}, ${max}]`)\n }\n if (markValues.has(mark.value)) {\n throw new Error(\"Slider marks must have unique values\")\n }\n markValues.add(mark.value)\n }\n }, [marks, max, min])\n\n // Update value if out of bounds (single mode only)\n const latestValue = useLatestValue(value)\n const latestOnChange = useLatestValue(onChange)\n useEffect(() => {\n if (isRange) return\n const v = latestValue.current as number\n const clamped = clamp(v, min, max)\n if (clamped !== v) {\n ;(latestOnChange.current as (v: number) => void)(clamped)\n setInputValueNumber(clamped)\n }\n }, [max, min, latestValue, latestOnChange, setInputValueNumber, isRange])\n\n useEffect(() => {\n if (isRange) return\n if (inputRef.current !== document.activeElement) {\n setInputValueNumber(value as number)\n }\n }, [value, setInputValueNumber, isRange])\n\n // Single-mode keyboard handler: a key's change replaces a pending typed one\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n if (evt.key === \"Home\") {\n evt.preventDefault()\n debouncedOnChange.cancel()\n singleOnChange(min)\n setInputValueNumber(min)\n }\n if (evt.key === \"End\") {\n evt.preventDefault()\n debouncedOnChange.cancel()\n singleOnChange(max)\n setInputValueNumber(max)\n }\n if (evt.key === \"ArrowUp\") {\n evt.preventDefault()\n const multiplier = evt.shiftKey ? 10 : 1\n const next = clamp(singleValue + step * multiplier, min, max)\n debouncedOnChange.cancel()\n singleOnChange(next)\n setInputValueNumber(next)\n }\n if (evt.key === \"ArrowDown\") {\n evt.preventDefault()\n const multiplier = evt.shiftKey ? 10 : 1\n const next = clamp(singleValue - step * multiplier, min, max)\n debouncedOnChange.cancel()\n singleOnChange(next)\n setInputValueNumber(next)\n }\n if (evt.key === \"Enter\" \|\| evt.key === \"Escape\") {\n evt.preventDefault()\n evt.currentTarget.blur()\n }\n }\n\n const handleInputChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n // Digits and dots, plus a leading minus when the slider goes below zero\n const nextValue = evt.currentTarget.value.replace(min < 0 ? /(?!^-)[^\\d.]/g : /[^\\d.]/g, \"\").trim()\n let parsed = parseFloat(nextValue \|\| \"0\")\n if (Number.isNaN(parsed)) {\n // A lone \"-\" or \".\" is a number still being typed: nothing to report yet\n setInputValue(nextValue)\n return\n }\n parsed = clamp(parsed, min, max)\n if (step >= 1) {\n parsed = Math.floor(parsed)\n }\n debouncedOnChange(parsed)\n setInputValue(nextValue)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (evt) => {\n if (isRange \|\| !singleOnChange) return\n // Blur commits the typed text, so its pending debounced change is dropped\n debouncedOnChange.cancel()\n let parsed = parseFloat(evt.target.value.trim()) \|\| 0\n if (step >= 1) {\n parsed = Math.floor(parsed)\n } else {\n parsed = round(parsed, precision)\n }\n parsed = clamp(parsed, min, max)\n if (parsed !== singleValue) {\n singleOnChange(parsed)\n }\n setInputValueNumber(parsed)\n onBlur?.(evt)\n }\n\n // Radix value/onChange wiring\n const radixValue = isRange ? (value as number[]) : [value as number]\n const handleValueChange = isRange\n ? (values: number[]) => (onChange as (v: number[]) => void)(values)\n : (values: number[]) => (onChange as (v: number) => void)(values[0])\n\n // Single-mode props\n const resetValue = !isRange ? (props as SingleSliderProps).resetValue : undefined\n const resetTooltip = !isRange\n ? (props as SingleSliderProps).resetTooltip ?? \"Reset to default\"\n : undefined\n\n // Range-mode props\n const minStepsBetweenThumbs = isRange\n ? (props as RangeSliderProps).minStepsBetweenThumbs\n : undefined\n\n // Show marks only in horizontal orientation\n const showMarks = marks.length > 0 && !isVertical\n\n // Format range display text\n const rangeDisplayText = isRange\n ? (value as number[])\n .map((v) => `${prefixUnit ?? \"\"}${v.toFixed(precision)}${unit ?? \"\"}`)\n .join(\" – \")\n : \"\"\n\n return (\n <div\n className={clsx(s.SliderWrap, className)}\n data-orientation={orientation}\n >\n {label && (\n <div className={s.SliderLabel}>\n {/* Range mode renders no value input, so the label only names the thumbs /}\n <label htmlFor={isRange ? undefined : id} id={labelId} className=\"flex-1\">\n {label}\n </label>\n {!isRange && resetValue !== undefined && (\n <Tooltip content={resetTooltip!} compact>\n <Button\n size=\"2xs\"\n variant=\"ghost\"\n color=\"secondary\"\n className={s.Reset}\n aria-label={resetTooltip}\n data-hide={disabled \|\| (resetValue === singleValue && !pointerDown)}\n onClick={() => singleOnChange!(resetValue)}\n >\n <Reload />\n </Button>\n </Tooltip>\n )}\n {isRange ? (\n <span className={s.RangeDisplay}>{rangeDisplayText}</span>\n ) : (\n <div className={s.SliderValue} onClick={() => inputRef.current?.focus()}>\n {prefixUnit && <span className={s.ValueUnit}>{prefixUnit}</span>}\n <input\n id={id}\n className={s.ValueInput}\n ref={inputRef}\n style={{ width: `${Math.ceil(inputWidth)}px` }}\n onKeyDown={handleKeyDown}\n value={inputValue}\n type=\"text\"\n onClick={(e) => e.stopPropagation()}\n onBlur={handleInputBlur}\n onFocus={(e) => {\n e.currentTarget.setSelectionRange(0, e.currentTarget.value.length)\n onFocus?.(e)\n }}\n onChange={handleInputChange}\n disabled={disabled}\n />\n {unit && <span className={s.ValueUnit}>{unit}</span>}\n </div>\n )}\n </div>\n )}\n <div className={s.SliderContainer}>\n <RadixSlider.Root\n ref={forwardedRef}\n className={s.Slider}\n onValueChange={handleValueChange}\n min={min}\n max={max}\n step={step}\n disabled={disabled}\n value={radixValue}\n orientation={orientation}\n minStepsBetweenThumbs={minStepsBetweenThumbs}\n onBlur={onBlur}\n onFocus={onFocus}\n onPointerDown={() => setPointerDown(true)}\n onPointerUp={() => setPointerDown(false)}\n style={toCssVariables({\n \"slider-duration\": `${animationDurationMS}ms`,\n \"slider-track-color\": trackColor,\n \"slider-range-color\": rangeColor,\n })}\n >\n <RadixSlider.Track className={s.Track}>\n <RadixSlider.Range className={s.Range} />\n </RadixSlider.Track>\n {isRange ? (\n (value as number[]).map((_, i) => (\n <RadixSlider.Thumb\n key={i}\n id={`${id}-thumb-${i}`}\n className={s.Thumb}\n // The marks measure the first thumb (all thumbs are the same size)\n ref={i === 0 ? thumbRef : undefined}\n // Name plus the thumb's own Radix name (\"Minimum\" / \"Maximum\"),\n // so the endpoints stay distinguishable\n aria-labelledby={nameId ? `${nameId} ${id}-thumb-${i}` : undefined}\n // Only pass aria-label when set: an explicit undefined would\n // replace the name Radix gives the thumb\n {...(!nameId && ariaLabel\n ? {\n \"aria-label\":\n `${ariaLabel} ${rangeThumbName(i, (value as number[]).length)}`.trim(),\n }\n : {})}\n />\n ))\n ) : (\n <RadixSlider.Thumb\n className={s.Thumb}\n ref={thumbRef}\n aria-labelledby={nameId}\n {...(!nameId && ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n />\n )}\n </RadixSlider.Root>\n {showMarks && <SliderMarks marks={marks} thumbRef={thumbRef} min={min} max={max} />}\n </div>\n </div>\n )\n})\nSlider.displayName = \"Slider\"\n\n// Matches the names Radix gives range thumbs on its own\nconst rangeThumbName = (index: number, count: number) =>\n count === 2 ? (index === 0 ? \"Minimum\" : \"Maximum\") : count > 2 ? `Value ${index + 1} of ${count}` : \"\"\n\ntype MarksProps = {\n marks: SliderMark[]\n thumbRef: React.RefObject<HTMLDivElement \| null>\n min: number\n max: number\n}\n\n// The minimum difference we enforce between marks, in pixels\nconst MINIMUM_MARK_SPACING_PX = 16\n\nconst SliderMarks = memo(({ marks, thumbRef, min, max }: MarksProps) => {\n // We seperate the container and measure divs so that our resize observer\n // does not fire when we adjust the height of the marks container.\n const marksContainerRef = useRef<HTMLDivElement>(null)\n const measureRef = useRef<HTMLDivElement>(null)\n\n // We measure the width of the slider within this component so that sliders\n // without marks do not pay a performance penalty.\n // @ts-expect-error(2322) -- bug in types: https://github.com/juliencrn/usehooks-ts/issues/663\n const { width: sliderWidth } = useResizeObserver({ ref: measureRef })\n\n useLayoutEffect(() => {\n // Impossible\n if (!thumbRef.current \|\| !marksContainerRef.current) {\n return\n }\n\n const markElements = Array.from(\n marksContainerRef.current.querySelectorAll(\"[data-mark]\"),\n ) as HTMLDivElement[]\n\n const thumbHalfWidth = thumbRef.current.getBoundingClientRect().width / 2\n\n // Wipe all styles so we can accurately determine the positions of the marks\n markElements.forEach((markEl) => {\n markEl.style.width = \"\"\n markEl.style.display = \"\"\n })\n\n const positionMarks = () => {\n if (!sliderWidth) {\n return\n }\n\n markElements.forEach((markEl, index) => {\n const markValue = marks[index].value\n const valuePercent = (markValue - min) / (max - min)\n const markWidth = markEl.getBoundingClientRect().width\n const markHalfWidth = markWidth / 2\n\n // Radix smoothes the width of the thumb over the entire track so\n // that the thumb is always within bounds. We need to duplicate\n // this smoothing so that the marks match the observed breakpoints.\n const smoothedThumb = thumbHalfWidth - valuePercent (thumbHalfWidth / 0.5)\n\n // Calculate where we would naively put the mark based on the value\n const naiveLeftOffset = valuePercent * sliderWidth\n\n // Add the thumb smoothing, and account for the width of the mark itself\n let left = naiveLeftOffset + smoothedThumb - markHalfWidth\n\n // Clamp to the left and right bounds of the container\n left = Math.max(0, Math.min(left, sliderWidth - markWidth))\n\n markEl.style.left = `${left}px`\n })\n }\n\n const marksHaveCollisions = () => {\n for (let i = 0; i < markElements.length - 1; i++) {\n const currentRect = markElements[i].getBoundingClientRect()\n const nextRect = markElements[i + 1].getBoundingClientRect()\n\n if (currentRect.right + MINIMUM_MARK_SPACING_PX > nextRect.left) {\n return true\n }\n }\n return false\n }\n\n positionMarks()\n\n // If we have collisions, try to wrap the content\n if (marksHaveCollisions()) {\n markElements.forEach((markEl) => {\n markEl.style.width = \"min-content\"\n })\n\n positionMarks()\n\n // Hide all marks if we still have collisions\n if (marksHaveCollisions()) {\n markElements.forEach((markEl) => {\n markEl.style.display = \"none\"\n })\n }\n }\n\n const tallestHeight = Math.max(\n ...markElements.map((markEl) => markEl.getBoundingClientRect().height),\n )\n\n // Give our container a height so that we allocate space on the page\n // for the marks and push down other content when we have to wrap\n marksContainerRef.current.style.height = tallestHeight > 0 ? `${tallestHeight}px` : \"\"\n }, [marks, thumbRef, marksContainerRef, min, max, sliderWidth])\n\n return (\n <div className={s.MarksContainer} ref={marksContainerRef}>\n <div ref={measureRef}>\n {marks.map((mark) => (\n <div key={mark.value} className={s.Mark} data-mark>\n <span className={s.MarkLabel}>{mark.label}</span>\n </div>\n ))}\n </div>\n </div>\n )\n})\nSliderMarks.displayName = \"SliderMarks\"\n"]}

package/dist/es/components/Slider/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { Slider } from "./Slider";
+export { Slider } from "./Slider.js";
 //# sourceMappingURL=index.js.map

package/dist/es/components/StatCard/StatCard.js CHANGED Viewed

@@ -2,10 +2,10 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import clsx from "clsx";
 import {} from "react";
-import { Badge } from "../Badge";
-import { InfoCircle } from "../Icon";
-import { Tooltip } from "../Tooltip";
-import s from "./StatCard.module.css";
+import { Badge } from "../Badge/index.js";
+import { InfoCircle } from "../Icon/index.js";
+import { Tooltip } from "../Tooltip/index.js";
+import s from "@plexui/styles/components/StatCard/StatCard.module.css";
 export const StatCard = ({ label, value, description, trend, invertTrend, icon, sparkline, progress, progressLabel, tooltip, trendPosition = "value", trendVariant = "text", size = "default", variant = "default", accentColor = "primary", className, ref, ...restProps }) => {
     const trendValue = trend?.value ?? 0;
     const trendClassName = trendValue === 0
@@ -29,7 +29,7 @@ export const StatCard = ({ label, value, description, trend, invertTrend, icon,
                 ? "success"
                 : "danger";
     const trendEl = trend != null && (trendVariant === "badge" ? (_jsx(Badge, { size: "sm", color: trendBadgeColor, children: trendText })) : (_jsx("div", { className: clsx(s.Trend, trendClassName), children: trendText })));
-    const headerEl = (_jsxs("div", { className: s.Header, children: [_jsxs("div", { className: s.LabelRow, children: [_jsx("div", { className: s.Label, children: label }), tooltip && (_jsx(Tooltip, { content: tooltip, children: _jsx("span", { className: s.InfoIcon, children: _jsx(InfoCircle, {}) }) }))] }), trendPosition === "header" && trendEl && (_jsx("div", { className: s.HeaderEnd, children: trendEl }))] }));
+    const headerEl = (_jsxs("div", { className: s.Header, children: [_jsxs("div", { className: s.LabelRow, children: [_jsx("div", { className: s.Label, children: label }), tooltip && (_jsx(Tooltip, { content: tooltip, children: _jsx("span", { className: s.InfoIcon, tabIndex: 0, role: "img", "aria-label": "More information", children: _jsx(InfoCircle, {}) }) }))] }), trendPosition === "header" && trendEl && (_jsx("div", { className: s.HeaderEnd, children: trendEl }))] }));
     const valueRowEl = (_jsxs("div", { className: s.ValueRow, children: [_jsx("div", { className: s.Value, children: value }), trendPosition === "value" && trendEl, description && _jsx("div", { className: s.Description, children: description })] }));
     const footerEl = trend?.label ? (_jsx("div", { className: s.Footer, children: _jsx("div", { className: s.TrendLabel, children: trend.label }) })) : null;
     const progressEl = (progressValue !== undefined || progressLabel) ? (_jsxs("div", { className: s.Progress, children: [_jsx("div", { className: s.ProgressTrack, children: _jsx("div", { className: s.ProgressBar, style: { width: `${progressValue ?? 0}%` }, "aria-hidden": true }) }), progressLabel && _jsx("div", { className: s.ProgressLabel, children: progressLabel })] })) : null;

package/dist/es/components/StatCard/StatCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatCard.js","sourceRoot":"","sources":["../../../../src/components/StatCard/StatCard.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,CAAC,MAAM,~~uBAAuB~~,CAAA;~~AAiErC~~,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,KAAK,EACL,KAAK,EACL,WAAW,EACX,KAAK,EACL,WAAW,EACX,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,aAAa,EACb,OAAO,EACP,aAAa,GAAG,OAAO,EACvB,YAAY,GAAG,MAAM,EACrB,IAAI,GAAG,SAAS,EAChB,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,SAAS,EACvB,SAAS,EACT,GAAG,EACH,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,MAAM,UAAU,GAAG,KAAK,EAAE,KAAK,IAAI,CAAC,CAAA;IACpC,MAAM,cAAc,GAClB,UAAU,KAAK,CAAC;QACd,CAAC,CAAC,CAAC,CAAC,YAAY;QAChB,CAAC,CAAC,UAAU,GAAG,CAAC;YACd,CAAC,CAAC,WAAW;gBACX,CAAC,CAAC,CAAC,CAAC,aAAa;gBACjB,CAAC,CAAC,CAAC,CAAC,aAAa;YACnB,CAAC,CAAC,WAAW;gBACX,CAAC,CAAC,CAAC,CAAC,aAAa;gBACjB,CAAC,CAAC,CAAC,CAAC,aAAa,CAAA;IAEzB,MAAM,SAAS,GAAG,GAAG,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,UAAU,GAAG,CAAA;IAC9D,MAAM,aAAa,GACjB,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAA;IAE3E,MAAM,eAAe,GACnB,UAAU,KAAK,CAAC;QACd,CAAC,CAAC,WAAW;QACb,CAAC,CAAC,UAAU,GAAG,CAAC;YACd,CAAC,CAAC,WAAW;gBACX,CAAC,CAAC,QAAQ;gBACV,CAAC,CAAC,SAAS;YACb,CAAC,CAAC,WAAW;gBACX,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,QAAQ,CAAA;IAElB,MAAM,OAAO,GAAG,KAAK,IAAI,IAAI,IAAI,CAC/B,YAAY,KAAK,OAAO,CAAC,CAAC,CAAC,CACzB,KAAC,KAAK,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,eAAqD,YAC1E,SAAS,GACJ,CACT,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,cAAc,CAAC,YAC1C,SAAS,GACN,CACP,CACF,CAAA;IAED,MAAM,QAAQ,GAAG,CACf,eAAK,SAAS,EAAE,CAAC,CAAC,MAAM,aACtB,eAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,aACxB,cAAK,SAAS,EAAE,CAAC,CAAC,KAAK,YAAG,KAAK,GAAO,EACrC,OAAO,IAAI,CACV,KAAC,OAAO,IAAC,OAAO,EAAE,OAAO,~~YACvB~~,eAAM,SAAS,EAAE,CAAC,CAAC,QAAQ,~~YACzB~~,KAAC,UAAU,KAAG,GACT,GACC,CACX,IACG,EACL,aAAa,KAAK,QAAQ,IAAI,OAAO,IAAI,CACxC,cAAK,SAAS,EAAE,CAAC,CAAC,SAAS,YAAG,OAAO,GAAO,CAC7C,IACG,CACP,CAAA;IAED,MAAM,UAAU,GAAG,CACjB,eAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,aACxB,cAAK,SAAS,EAAE,CAAC,CAAC,KAAK,YAAG,KAAK,GAAO,EACrC,aAAa,KAAK,OAAO,IAAI,OAAO,EACpC,WAAW,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,YAAG,WAAW,GAAO,IAC9D,CACP,CAAA;IAED,MAAM,QAAQ,GAAG,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAC9B,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,YACtB,cAAK,SAAS,EAAE,CAAC,CAAC,UAAU,YAAG,KAAK,CAAC,KAAK,GAAO,GAC7C,CACP,CAAC,CAAC,CAAC,IAAI,CAAA;IAER,MAAM,UAAU,GAAG,CAAC,aAAa,KAAK,SAAS,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,CAClE,eAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,aACxB,cAAK,SAAS,EAAE,CAAC,CAAC,aAAa,YAC7B,cACE,SAAS,EAAE,CAAC,CAAC,WAAW,EACxB,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,aAAa,IAAI,CAAC,GAAG,EAAE,wBAE1C,GACE,EACL,aAAa,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,aAAa,YAAG,aAAa,GAAO,IACpE,CACP,CAAC,CAAC,CAAC,IAAI,CAAA;IAER,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,CAAC,CAAC,SAAS,YAAG,SAAS,GAAO,CAAC,CAAC,CAAC,IAAI,CAAA;IAErF,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,SAAS,CAAC,kBACxB,OAAO,eACV,IAAI,uBACI,WAAW,KAC1B,SAAS,YAEZ,IAAI,CAAC,CAAC,CAAC,CACN,eAAK,SAAS,EAAE,CAAC,CAAC,IAAI,aACpB,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,YAAG,IAAI,GAAO,EAC3C,eAAK,SAAS,EAAE,CAAC,CAAC,OAAO,aACtB,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,IACR,IACF,CACP,CAAC,CAAC,CAAC,CACF,8BACG,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,IACX,CACJ,GACG,CACP,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ReactNode, type Ref } from \"react\"\nimport { Badge } from \"../Badge\"\nimport { InfoCircle } from \"../Icon\"\nimport { Tooltip } from \"../Tooltip\"\nimport s from \"./StatCard.module.css\"\n\nexport type StatCardProps = {\n /** Label describing the metric /\n label: string\n /* The primary metric value (e.g. \"1,234\" or \"$50K\") /\n value: ReactNode\n /* Optional description or subtitle below the value /\n description?: string\n /* Trend indicator with percentage change /\n trend?: {\n /* The percentage change value (e.g. 12.5 for +12.5%) /\n value: number\n /* Optional label for the trend (e.g. \"vs last month\") /\n label?: string\n }\n /* When true, a positive trend is bad (red) and negative is good (green). Use for metrics like \"Error Rate\" or \"Avg Completion Time\". /\n invertTrend?: boolean\n /* Icon displayed on the left side with a soft background /\n icon?: ReactNode\n /* Optional ReactNode for a sparkline/chart rendered at the bottom /\n sparkline?: ReactNode\n /* Progress value from 0 to 100. Shows a progress bar at the bottom. /\n progress?: number\n /* Label displayed next to the progress bar /\n progressLabel?: string\n /* Tooltip text — renders an (i) icon next to the label with a tooltip on hover /\n tooltip?: string\n /\n Where the trend indicator is positioned\n * - `\"value\"` — next to the value (default)\n * - `\"header\"` — right-aligned in the header row\n * @default \"value\"\n /\n trendPosition?: \"value\" \| \"header\"\n /\n Visual style of the trend indicator\n * - `\"text\"` — plain colored text (default)\n * - `\"badge\"` — wrapped in a Badge component\n * @default \"text\"\n /\n trendVariant?: \"text\" \| \"badge\"\n /\n Size of the card\n * - `\"default\"` — standard dashboard card\n * - `\"sm\"` — compact card for dense layouts\n * @default \"default\"\n /\n size?: \"default\" \| \"sm\"\n /\n Visual variant of the card\n * @default \"default\"\n /\n variant?: \"default\" \| \"accent\"\n /\n Accent border color for the \"accent\" variant\n * @default \"primary\"\n /\n accentColor?: \"primary\" \| \"secondary\" \| \"info\" \| \"success\" \| \"warning\" \| \"danger\" \| \"discovery\" \| \"caution\"\n /* Class applied to the card container /\n className?: string\n /* Ref applied to the card container */\n ref?: Ref<HTMLDivElement>\n}\n\nexport const StatCard = ({\n label,\n value,\n description,\n trend,\n invertTrend,\n icon,\n sparkline,\n progress,\n progressLabel,\n tooltip,\n trendPosition = \"value\",\n trendVariant = \"text\",\n size = \"default\",\n variant = \"default\",\n accentColor = \"primary\",\n className,\n ref,\n ...restProps\n}: StatCardProps) => {\n const trendValue = trend?.value ?? 0\n const trendClassName =\n trendValue === 0\n ? s.TrendNeutral\n : trendValue > 0\n ? invertTrend\n ? s.TrendNegative\n : s.TrendPositive\n : invertTrend\n ? s.TrendPositive\n : s.TrendNegative\n\n const trendText = `${trendValue > 0 ? \"+\" : \"\"}${trendValue}%`\n const progressValue =\n progress === undefined ? undefined : Math.min(100, Math.max(0, progress))\n\n const trendBadgeColor =\n trendValue === 0\n ? \"secondary\"\n : trendValue > 0\n ? invertTrend\n ? \"danger\"\n : \"success\"\n : invertTrend\n ? \"success\"\n : \"danger\"\n\n const trendEl = trend != null && (\n trendVariant === \"badge\" ? (\n <Badge size=\"sm\" color={trendBadgeColor as \"secondary\" \| \"success\" \| \"danger\"}>\n {trendText}\n </Badge>\n ) : (\n <div className={clsx(s.Trend, trendClassName)}>\n {trendText}\n </div>\n )\n )\n\n const headerEl = (\n <div className={s.Header}>\n <div className={s.LabelRow}>\n <div className={s.Label}>{label}</div>\n {tooltip && (\n <Tooltip content={tooltip}>\n <span className={s.InfoIcon}>\n <InfoCircle />\n </span>\n </Tooltip>\n )}\n </div>\n {trendPosition === \"header\" && trendEl && (\n <div className={s.HeaderEnd}>{trendEl}</div>\n )}\n </div>\n )\n\n const valueRowEl = (\n <div className={s.ValueRow}>\n <div className={s.Value}>{value}</div>\n {trendPosition === \"value\" && trendEl}\n {description && <div className={s.Description}>{description}</div>}\n </div>\n )\n\n const footerEl = trend?.label ? (\n <div className={s.Footer}>\n <div className={s.TrendLabel}>{trend.label}</div>\n </div>\n ) : null\n\n const progressEl = (progressValue !== undefined \|\| progressLabel) ? (\n <div className={s.Progress}>\n <div className={s.ProgressTrack}>\n <div\n className={s.ProgressBar}\n style={{ width: `${progressValue ?? 0}%` }}\n aria-hidden\n />\n </div>\n {progressLabel && <div className={s.ProgressLabel}>{progressLabel}</div>}\n </div>\n ) : null\n\n const sparklineEl = sparkline ? <div className={s.Sparkline}>{sparkline}</div> : null\n\n return (\n <div\n ref={ref}\n className={clsx(s.StatCard, className)}\n data-variant={variant}\n data-size={size}\n data-accent-color={accentColor}\n {...restProps}\n >\n {icon ? (\n <div className={s.Body}>\n <div className={s.IconWrapper}>{icon}</div>\n <div className={s.Content}>\n {headerEl}\n {valueRowEl}\n {footerEl}\n {progressEl}\n {sparklineEl}\n </div>\n </div>\n ) : (\n <>\n {headerEl}\n {valueRowEl}\n {footerEl}\n {progressEl}\n {sparklineEl}\n </>\n )}\n </div>\n )\n}\n"]}
1	+ {"version":3,"file":"StatCard.js","sourceRoot":"","sources":["../../../../src/components/StatCard/StatCard.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ReactNode, type Ref } from \"react\"\nimport { Badge } from \"../Badge\"\nimport { InfoCircle } from \"../Icon\"\nimport { Tooltip } from \"../Tooltip\"\nimport s from \"@plexui/styles/components/StatCard/StatCard.module.css\"\n\nexport type StatCardProps = {\n /** Label describing the metric /\n label: string\n /* The primary metric value (e.g. \"1,234\" or \"$50K\") /\n value: ReactNode\n /* Optional description or subtitle below the value /\n description?: string\n /* Trend indicator with percentage change /\n trend?: {\n /* The percentage change value (e.g. 12.5 for +12.5%) /\n value: number\n /* Optional label for the trend (e.g. \"vs last month\") /\n label?: string\n }\n /* When true, a positive trend is bad (red) and negative is good (green). Use for metrics like \"Error Rate\" or \"Avg Completion Time\". /\n invertTrend?: boolean\n /* Icon displayed on the left side with a soft background /\n icon?: ReactNode\n /* Optional ReactNode for a sparkline/chart rendered at the bottom /\n sparkline?: ReactNode\n /* Progress value from 0 to 100. Shows a progress bar at the bottom. /\n progress?: number\n /* Label displayed next to the progress bar /\n progressLabel?: string\n /* Tooltip text — renders an (i) icon next to the label with a tooltip on hover /\n tooltip?: string\n /\n Where the trend indicator is positioned\n * - `\"value\"` — next to the value (default)\n * - `\"header\"` — right-aligned in the header row\n * @default \"value\"\n /\n trendPosition?: \"value\" \| \"header\"\n /\n Visual style of the trend indicator\n * - `\"text\"` — plain colored text (default)\n * - `\"badge\"` — wrapped in a Badge component\n * @default \"text\"\n /\n trendVariant?: \"text\" \| \"badge\"\n /\n Size of the card\n * - `\"default\"` — standard dashboard card\n * - `\"sm\"` — compact card for dense layouts\n * @default \"default\"\n /\n size?: \"default\" \| \"sm\"\n /\n Visual variant of the card\n * @default \"default\"\n /\n variant?: \"default\" \| \"accent\"\n /\n Accent border color for the \"accent\" variant\n * @default \"primary\"\n /\n accentColor?: \"primary\" \| \"secondary\" \| \"info\" \| \"success\" \| \"warning\" \| \"danger\" \| \"discovery\" \| \"caution\"\n /* Class applied to the card container /\n className?: string\n /* Ref applied to the card container /\n ref?: Ref<HTMLDivElement>\n}\n\nexport const StatCard = ({\n label,\n value,\n description,\n trend,\n invertTrend,\n icon,\n sparkline,\n progress,\n progressLabel,\n tooltip,\n trendPosition = \"value\",\n trendVariant = \"text\",\n size = \"default\",\n variant = \"default\",\n accentColor = \"primary\",\n className,\n ref,\n ...restProps\n}: StatCardProps) => {\n const trendValue = trend?.value ?? 0\n const trendClassName =\n trendValue === 0\n ? s.TrendNeutral\n : trendValue > 0\n ? invertTrend\n ? s.TrendNegative\n : s.TrendPositive\n : invertTrend\n ? s.TrendPositive\n : s.TrendNegative\n\n const trendText = `${trendValue > 0 ? \"+\" : \"\"}${trendValue}%`\n const progressValue =\n progress === undefined ? undefined : Math.min(100, Math.max(0, progress))\n\n const trendBadgeColor =\n trendValue === 0\n ? \"secondary\"\n : trendValue > 0\n ? invertTrend\n ? \"danger\"\n : \"success\"\n : invertTrend\n ? \"success\"\n : \"danger\"\n\n const trendEl = trend != null && (\n trendVariant === \"badge\" ? (\n <Badge size=\"sm\" color={trendBadgeColor as \"secondary\" \| \"success\" \| \"danger\"}>\n {trendText}\n </Badge>\n ) : (\n <div className={clsx(s.Trend, trendClassName)}>\n {trendText}\n </div>\n )\n )\n\n const headerEl = (\n <div className={s.Header}>\n <div className={s.LabelRow}>\n <div className={s.Label}>{label}</div>\n {tooltip && (\n <Tooltip content={tooltip}>\n {/ Focusable and named so keyboard and screen-reader users reach the tooltip */}\n <span className={s.InfoIcon} tabIndex={0} role=\"img\" aria-label=\"More information\">\n <InfoCircle />\n </span>\n </Tooltip>\n )}\n </div>\n {trendPosition === \"header\" && trendEl && (\n <div className={s.HeaderEnd}>{trendEl}</div>\n )}\n </div>\n )\n\n const valueRowEl = (\n <div className={s.ValueRow}>\n <div className={s.Value}>{value}</div>\n {trendPosition === \"value\" && trendEl}\n {description && <div className={s.Description}>{description}</div>}\n </div>\n )\n\n const footerEl = trend?.label ? (\n <div className={s.Footer}>\n <div className={s.TrendLabel}>{trend.label}</div>\n </div>\n ) : null\n\n const progressEl = (progressValue !== undefined \|\| progressLabel) ? (\n <div className={s.Progress}>\n <div className={s.ProgressTrack}>\n <div\n className={s.ProgressBar}\n style={{ width: `${progressValue ?? 0}%` }}\n aria-hidden\n />\n </div>\n {progressLabel && <div className={s.ProgressLabel}>{progressLabel}</div>}\n </div>\n ) : null\n\n const sparklineEl = sparkline ? <div className={s.Sparkline}>{sparkline}</div> : null\n\n return (\n <div\n ref={ref}\n className={clsx(s.StatCard, className)}\n data-variant={variant}\n data-size={size}\n data-accent-color={accentColor}\n {...restProps}\n >\n {icon ? (\n <div className={s.Body}>\n <div className={s.IconWrapper}>{icon}</div>\n <div className={s.Content}>\n {headerEl}\n {valueRowEl}\n {footerEl}\n {progressEl}\n {sparklineEl}\n </div>\n </div>\n ) : (\n <>\n {headerEl}\n {valueRowEl}\n {footerEl}\n {progressEl}\n {sparklineEl}\n </>\n )}\n </div>\n )\n}\n"]}

package/dist/es/components/StatCard/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { StatCard } from "./StatCard";
+export { StatCard } from "./StatCard.js";
 //# sourceMappingURL=index.js.map

package/dist/es/components/Switch/Switch.js CHANGED Viewed

@@ -3,11 +3,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
 import { Switch as RadixSwitch } from "radix-ui";
 import { useId } from "react";
-import s from "./Switch.module.css";
+import s from "@plexui/styles/components/Switch/Switch.module.css";
 export const Switch = ({ className, label, description, id: propsId, disabled, labelPosition = "end", ...restProps }) => {
     const reactId = useId();
     const id = propsId ?? reactId;
-    const descriptionId = description ? `${id}-description` : undefined;
-    return (_jsxs("div", { className: clsx(s.Container, className), "data-disabled": disabled ? "" : undefined, "data-has-label": label ? "" : undefined, "data-label-position": labelPosition, children: [_jsx(RadixSwitch.Root, { id: id, className: s.Track, disabled: disabled, "aria-describedby": descriptionId, ...restProps, children: _jsx(RadixSwitch.Thumb, { className: s.Thumb }) }), label && (description ? (_jsxs("div", { className: s.LabelGroup, children: [_jsx("label", { htmlFor: id, className: s.Label, children: label }), _jsx("span", { id: descriptionId, className: s.Description, children: description })] })) : (_jsx("label", { htmlFor: id, className: s.Label, children: label })))] }));
+    // The description only renders next to a label; it comes before any ids
+    // the caller (a Field, say) passes
+    const descriptionId = label && description ? `${id}-label-description` : undefined;
+    const ariaDescribedBy = [descriptionId, restProps["aria-describedby"]].filter(Boolean).join(" ") ||
+        undefined;
+    return (_jsxs("div", { className: clsx(s.Container, className), "data-disabled": disabled ? "" : undefined, "data-has-label": label ? "" : undefined, "data-label-position": labelPosition, children: [_jsx(RadixSwitch.Root, { id: id, className: s.Track, disabled: disabled, ...restProps, "aria-describedby": ariaDescribedBy, children: _jsx(RadixSwitch.Thumb, { className: s.Thumb }) }), label && (description ? (_jsxs("div", { className: s.LabelGroup, children: [_jsx("label", { htmlFor: id, className: s.Label, children: label }), _jsx("span", { id: descriptionId, className: s.Description, children: description })] })) : (_jsx("label", { htmlFor: id, className: s.Label, children: label })))] }));
 };
 //# sourceMappingURL=Switch.js.map

package/dist/es/components/Switch/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAA;AAChD,OAAO,EAA0C,KAAK,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,CAAC,MAAM,~~qBAAqB~~,CAAA;~~AAoCnC~~,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,KAAK,EACL,WAAW,EACX,EAAE,EAAE,OAAO,EACX,QAAQ,EACR,aAAa,GAAG,KAAK,EACrB,GAAG,SAAS,EACA,EAAE,EAAE;IAChB,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IACvB,MAAM,EAAE,GAAG,OAAO,IAAI,OAAO,CAAA;IAC7B,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,~~cAAc~~,CAAC,CAAC,CAAC,SAAS,CAAA;~~IAEnE~~,OAAO,CACL,eACE,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,mBACxB,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,oBACxB,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,yBACjB,aAAa,aAElC,KAAC,WAAW,CAAC,IAAI,IACf,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,CAAC,CAAC,KAAK,EAClB,QAAQ,EAAE,QAAQ,~~sBACA~~,~~aAAa~~,~~KAC3B~~,~~SAAS~~,~~YAEb~~,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAE,CAAC,CAAC,KAAK,GAAI,GACxB,EAElB,KAAK,IAAI,CACR,WAAW,CAAC,CAAC,CAAC,CACZ,eAAK,SAAS,EAAE,CAAC,CAAC,UAAU,aAC1B,gBAAO,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,YACnC,KAAK,GACA,EACR,eAAM,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,CAAC,WAAW,YAC9C,WAAW,GACP,IACH,CACP,CAAC,CAAC,CAAC,CACF,gBAAO,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,YACnC,KAAK,GACA,CACT,CACF,IACG,CACP,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { Switch as RadixSwitch } from \"radix-ui\"\nimport { type FocusEventHandler, type ReactNode, useId } from \"react\"\nimport s from \"./Switch.module.css\"\n\nexport type SwitchProps = {\n /** The `id` of the switch. /\n id?: string\n /* The state of the switch when it is initially rendered. Use when you do not need to control its state. /\n defaultChecked?: boolean\n /* The controlled state of the switch. Must be used in conjunction with `onCheckedChange`. /\n checked?: boolean\n /* Optional accessible label rendered next to the switch. /\n label?: ReactNode\n /* Optional description rendered below the label. Linked via `aria-describedby`. /\n description?: ReactNode\n /* Event handler called when the state of the switch changes. /\n onCheckedChange?: (nextState: boolean) => void\n /* Event handler called when the checkbox looses focus. /\n onBlur?: FocusEventHandler<HTMLButtonElement>\n /* Event handler called when the checkbox gains focus. /\n onFocus?: FocusEventHandler<HTMLButtonElement>\n /* When `true`, prevents the user from interacting with the switch. /\n disabled?: boolean\n /* When `true`, indicates that the user must check the switch before the owning form can be submitted. /\n required?: boolean\n /* The name of the switch. Submitted with its owning form as part of a name/value pair. /\n name?: string\n /* The value given as data when submitted with a `name`. /\n value?: string\n /* CSS classes applied to wrapper node /\n className?: string\n /\n The position of the label relative to the switch.\n * @default end\n */\n labelPosition?: \"start\" \| \"end\"\n}\n\nexport const Switch = ({\n className,\n label,\n description,\n id: propsId,\n disabled,\n labelPosition = \"end\",\n ...restProps\n}: SwitchProps) => {\n const reactId = useId()\n const id = propsId ?? reactId\n const descriptionId = description ? `${id}-description` : undefined\n\n return (\n <div\n className={clsx(s.Container, className)}\n data-disabled={disabled ? \"\" : undefined}\n data-has-label={label ? \"\" : undefined}\n data-label-position={labelPosition}\n >\n <RadixSwitch.Root\n id={id}\n className={s.Track}\n disabled={disabled}\n ~~aria-describedby=~~{~~descriptionId~~}\n {~~...restProps~~}\n >\n <RadixSwitch.Thumb className={s.Thumb} />\n </RadixSwitch.Root>\n\n {label && (\n description ? (\n <div className={s.LabelGroup}>\n <label htmlFor={id} className={s.Label}>\n {label}\n </label>\n <span id={descriptionId} className={s.Description}>\n {description}\n </span>\n </div>\n ) : (\n <label htmlFor={id} className={s.Label}>\n {label}\n </label>\n )\n )}\n </div>\n )\n}\n"]}
1	+ {"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAA;AAChD,OAAO,EAA0C,KAAK,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,CAAC,MAAM,oDAAoD,CAAA;AAoClE,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,KAAK,EACL,WAAW,EACX,EAAE,EAAE,OAAO,EACX,QAAQ,EACR,aAAa,GAAG,KAAK,EACrB,GAAG,SAAS,EACA,EAAE,EAAE;IAChB,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IACvB,MAAM,EAAE,GAAG,OAAO,IAAI,OAAO,CAAA;IAC7B,wEAAwE;IACxE,mCAAmC;IACnC,MAAM,aAAa,GAAG,KAAK,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAA;IAClF,MAAM,eAAe,GACnB,CAAC,aAAa,EAAG,SAA6C,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QAC7G,SAAS,CAAA;IAEX,OAAO,CACL,eACE,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,mBACxB,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,oBACxB,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,yBACjB,aAAa,aAElC,KAAC,WAAW,CAAC,IAAI,IACf,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,CAAC,CAAC,KAAK,EAClB,QAAQ,EAAE,QAAQ,KACd,SAAS,sBACK,eAAe,YAEjC,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAE,CAAC,CAAC,KAAK,GAAI,GACxB,EAElB,KAAK,IAAI,CACR,WAAW,CAAC,CAAC,CAAC,CACZ,eAAK,SAAS,EAAE,CAAC,CAAC,UAAU,aAC1B,gBAAO,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,YACnC,KAAK,GACA,EACR,eAAM,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,CAAC,WAAW,YAC9C,WAAW,GACP,IACH,CACP,CAAC,CAAC,CAAC,CACF,gBAAO,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,YACnC,KAAK,GACA,CACT,CACF,IACG,CACP,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { Switch as RadixSwitch } from \"radix-ui\"\nimport { type FocusEventHandler, type ReactNode, useId } from \"react\"\nimport s from \"@plexui/styles/components/Switch/Switch.module.css\"\n\nexport type SwitchProps = {\n /** The `id` of the switch. /\n id?: string\n /* The state of the switch when it is initially rendered. Use when you do not need to control its state. /\n defaultChecked?: boolean\n /* The controlled state of the switch. Must be used in conjunction with `onCheckedChange`. /\n checked?: boolean\n /* Optional accessible label rendered next to the switch. /\n label?: ReactNode\n /* Optional description rendered below the label. Linked via `aria-describedby`. /\n description?: ReactNode\n /* Event handler called when the state of the switch changes. /\n onCheckedChange?: (nextState: boolean) => void\n /* Event handler called when the checkbox looses focus. /\n onBlur?: FocusEventHandler<HTMLButtonElement>\n /* Event handler called when the checkbox gains focus. /\n onFocus?: FocusEventHandler<HTMLButtonElement>\n /* When `true`, prevents the user from interacting with the switch. /\n disabled?: boolean\n /* When `true`, indicates that the user must check the switch before the owning form can be submitted. /\n required?: boolean\n /* The name of the switch. Submitted with its owning form as part of a name/value pair. /\n name?: string\n /* The value given as data when submitted with a `name`. /\n value?: string\n /* CSS classes applied to wrapper node /\n className?: string\n /\n The position of the label relative to the switch.\n * @default end\n */\n labelPosition?: \"start\" \| \"end\"\n}\n\nexport const Switch = ({\n className,\n label,\n description,\n id: propsId,\n disabled,\n labelPosition = \"end\",\n ...restProps\n}: SwitchProps) => {\n const reactId = useId()\n const id = propsId ?? reactId\n // The description only renders next to a label; it comes before any ids\n // the caller (a Field, say) passes\n const descriptionId = label && description ? `${id}-label-description` : undefined\n const ariaDescribedBy =\n [descriptionId, (restProps as { \"aria-describedby\"?: string })[\"aria-describedby\"]].filter(Boolean).join(\" \") \|\|\n undefined\n\n return (\n <div\n className={clsx(s.Container, className)}\n data-disabled={disabled ? \"\" : undefined}\n data-has-label={label ? \"\" : undefined}\n data-label-position={labelPosition}\n >\n <RadixSwitch.Root\n id={id}\n className={s.Track}\n disabled={disabled}\n {...restProps}\n aria-describedby={ariaDescribedBy}\n >\n <RadixSwitch.Thumb className={s.Thumb} />\n </RadixSwitch.Root>\n\n {label && (\n description ? (\n <div className={s.LabelGroup}>\n <label htmlFor={id} className={s.Label}>\n {label}\n </label>\n <span id={descriptionId} className={s.Description}>\n {description}\n </span>\n </div>\n ) : (\n <label htmlFor={id} className={s.Label}>\n {label}\n </label>\n )\n )}\n </div>\n )\n}\n"]}

package/dist/es/components/Switch/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { Switch } from "./Switch";
+export { Switch } from "./Switch.js";
 //# sourceMappingURL=index.js.map

package/dist/es/components/Table/Table.js CHANGED Viewed

@@ -2,7 +2,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import clsx from "clsx";
 import {} from "react";
-import s from "./Table.module.css";
+import s from "@plexui/styles/components/Table/Table.module.css";
 export const Table = ({ className, ...props }) => (_jsx("div", { className: s.TableWrapper, children: _jsx("table", { className: clsx(s.Table, className), ...props }) }));
 export const TableHeader = ({ className, ...props }) => (_jsx("thead", { className: clsx(s.TableHeader, className), ...props }));
 export const TableBody = ({ className, ...props }) => (_jsx("tbody", { className: clsx(s.TableBody, className), ...props }));

package/dist/es/components/Table/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAA8B,MAAM,OAAO,CAAA;AAClD,OAAO,CAAC,MAAM,~~oBAAoB~~,CAAA;~~AAGlC~~,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAc,EAAE,EAAE,CAAC,CAC5D,cAAK,SAAS,EAAE,CAAC,CAAC,YAAY,YAC5B,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,GACrD,CACP,CAAA;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACxE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAChE,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC9D,CAAA;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACxE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAChE,CAAA;AAGD,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiB,EAAE,EAAE,CAAC,CAClE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC1D,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC3D,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC3D,CAAA;AAGD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAqB,EAAE,EAAE,CAAC,CAC1E,kBAAS,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,YAAY,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CACnE,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ComponentPropsWithRef } from \"react\"\nimport s from \"./Table.module.css\"\n\nexport type TableProps = ComponentPropsWithRef<\"table\">\nexport const Table = ({ className, ...props }: TableProps) => (\n <div className={s.TableWrapper}>\n <table className={clsx(s.Table, className)} {...props} />\n </div>\n)\n\nexport type TableHeaderProps = ComponentPropsWithRef<\"thead\">\nexport const TableHeader = ({ className, ...props }: TableHeaderProps) => (\n <thead className={clsx(s.TableHeader, className)} {...props} />\n)\n\nexport type TableBodyProps = ComponentPropsWithRef<\"tbody\">\nexport const TableBody = ({ className, ...props }: TableBodyProps) => (\n <tbody className={clsx(s.TableBody, className)} {...props} />\n)\n\nexport type TableFooterProps = ComponentPropsWithRef<\"tfoot\">\nexport const TableFooter = ({ className, ...props }: TableFooterProps) => (\n <tfoot className={clsx(s.TableFooter, className)} {...props} />\n)\n\nexport type TableRowProps = ComponentPropsWithRef<\"tr\">\nexport const TableRow = ({ className, ...props }: TableRowProps) => (\n <tr className={clsx(s.TableRow, className)} {...props} />\n)\n\nexport type TableHeadProps = ComponentPropsWithRef<\"th\">\nexport const TableHead = ({ className, ...props }: TableHeadProps) => (\n <th className={clsx(s.TableHead, className)} {...props} />\n)\n\nexport type TableCellProps = ComponentPropsWithRef<\"td\">\nexport const TableCell = ({ className, ...props }: TableCellProps) => (\n <td className={clsx(s.TableCell, className)} {...props} />\n)\n\nexport type TableCaptionProps = ComponentPropsWithRef<\"caption\">\nexport const TableCaption = ({ className, ...props }: TableCaptionProps) => (\n <caption className={clsx(s.TableCaption, className)} {...props} />\n)\n"]}
1	+ {"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAA8B,MAAM,OAAO,CAAA;AAClD,OAAO,CAAC,MAAM,kDAAkD,CAAA;AAGhE,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAc,EAAE,EAAE,CAAC,CAC5D,cAAK,SAAS,EAAE,CAAC,CAAC,YAAY,YAC5B,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,GACrD,CACP,CAAA;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACxE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAChE,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC9D,CAAA;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACxE,gBAAO,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAChE,CAAA;AAGD,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiB,EAAE,EAAE,CAAC,CAClE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC1D,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC3D,CAAA;AAGD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACpE,aAAI,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC3D,CAAA;AAGD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAqB,EAAE,EAAE,CAAC,CAC1E,kBAAS,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,YAAY,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CACnE,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ComponentPropsWithRef } from \"react\"\nimport s from \"@plexui/styles/components/Table/Table.module.css\"\n\nexport type TableProps = ComponentPropsWithRef<\"table\">\nexport const Table = ({ className, ...props }: TableProps) => (\n <div className={s.TableWrapper}>\n <table className={clsx(s.Table, className)} {...props} />\n </div>\n)\n\nexport type TableHeaderProps = ComponentPropsWithRef<\"thead\">\nexport const TableHeader = ({ className, ...props }: TableHeaderProps) => (\n <thead className={clsx(s.TableHeader, className)} {...props} />\n)\n\nexport type TableBodyProps = ComponentPropsWithRef<\"tbody\">\nexport const TableBody = ({ className, ...props }: TableBodyProps) => (\n <tbody className={clsx(s.TableBody, className)} {...props} />\n)\n\nexport type TableFooterProps = ComponentPropsWithRef<\"tfoot\">\nexport const TableFooter = ({ className, ...props }: TableFooterProps) => (\n <tfoot className={clsx(s.TableFooter, className)} {...props} />\n)\n\nexport type TableRowProps = ComponentPropsWithRef<\"tr\">\nexport const TableRow = ({ className, ...props }: TableRowProps) => (\n <tr className={clsx(s.TableRow, className)} {...props} />\n)\n\nexport type TableHeadProps = ComponentPropsWithRef<\"th\">\nexport const TableHead = ({ className, ...props }: TableHeadProps) => (\n <th className={clsx(s.TableHead, className)} {...props} />\n)\n\nexport type TableCellProps = ComponentPropsWithRef<\"td\">\nexport const TableCell = ({ className, ...props }: TableCellProps) => (\n <td className={clsx(s.TableCell, className)} {...props} />\n)\n\nexport type TableCaptionProps = ComponentPropsWithRef<\"caption\">\nexport const TableCaption = ({ className, ...props }: TableCaptionProps) => (\n <caption className={clsx(s.TableCaption, className)} {...props} />\n)\n"]}

package/dist/es/components/Table/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { Table, TableHeader, TableBody, TableFooter, TableRow, TableHead, TableCell, TableCaption, } from "./Table";
+export { Table, TableHeader, TableBody, TableFooter, TableRow, TableHead, TableCell, TableCaption, } from "./Table.js";
 //# sourceMappingURL=index.js.map