npm - @ahrowe/ui - Versions diffs - 0.34.0 → 0.36.0 - Mend

@ahrowe/ui 0.34.0 → 0.36.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 (1172) hide show

package/dist/esm/common/slider/slider.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.mjs","names":[],"sources":["../../../../package/common/slider/slider.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\nimport styles from './slider.module.pcss';\nimport type { RangeSliderProps, SingleSliderProps, SliderProps } from './slider.types';\n\n/*\n Every prop of both variants, optional. Destructuring the union directly cannot reach the\n * range-only props, and leaving them in `...rest` spreads them onto the DOM node.\n /\ntype AnySliderProps = Omit<SingleSliderProps, 'onChange' \| 'onChangeEnd' \| 'value' \| 'defaultValue' \| 'range'> &\n Partial<Pick<RangeSliderProps, 'minRange' \| 'thumbLabels'>> & {\n range?: boolean;\n value?: number \| [number, number];\n defaultValue?: number \| [number, number];\n onChange?: (value: never) => void;\n onChangeEnd?: (value: never) => void;\n };\n\n/* Count decimal places in a step so snapped values don't accumulate float error. /\nfunction decimalsOf(step: number): number {\n const s = String(step);\n const dot = s.indexOf('.');\n return dot === -1 ? 0 : s.length - dot - 1;\n}\n\nexport default function Slider(props: SliderProps): ReactElement {\n const {\n min = 0,\n max = 100,\n step = 1,\n disabled = false,\n marks,\n showValue = false,\n formatValue,\n size,\n tabIndex = 0,\n className,\n style,\n classNames,\n styles: slotStyles,\n 'aria-label': ariaLabel,\n range,\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n minRange = 0,\n thumbLabels,\n ...rest\n } = props as AnySliderProps;\n\n // The union guarantees each handler matches `range`, but that link does not survive\n // destructuring, so the pair is widened once here rather than cast at every call.\n const emitChange = onChange as ((v: number \| [number, number]) => void) \| undefined;\n const emitEnd = onChangeEnd as ((v: number \| [number, number]) => void) \| undefined;\n\n const isRange = range === true;\n\n const trackRef = useRef<HTMLDivElement>(null);\n const rootRef = useRef<HTMLDivElement>(null);\n const thumbRefs = useRef<(HTMLDivElement \| null)[]>([]);\n const draggingIndexRef = useRef<number \| null>(null);\n const [dragging, setDragging] = useState(false);\n\n const decimals = decimalsOf(step);\n\n function clamp(v: number): number {\n return Math.min(max, Math.max(min, v));\n }\n\n function snap(v: number): number {\n const snapped = Math.round((v - min) / step) step + min;\n return Number(clamp(snapped).toFixed(decimals));\n }\n\n /** Both modes run on an array internally; only the edges of the component know the difference. /\n function toValues(raw: number \| [number, number] \| undefined): number[] {\n if (isRange) {\n const pair = (raw as [number, number] \| undefined) ?? [min, max];\n return [clamp(pair[0]), clamp(pair[1])];\n }\n return [clamp((raw as number \| undefined) ?? min)];\n }\n\n /* Reshapes a stored pair or single if `range` is flipped after mount. /\n function fitToMode(values: number[]): number[] {\n const expected = isRange ? 2 : 1;\n if (values.length === expected) return values;\n return isRange ? [values[0], max] : [values[0]];\n }\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = useState<number[]>(() => toValues(defaultValue));\n const current = isControlled ? toValues(value) : fitToMode(internal);\n\n // Latest committed values, for reading inside pointer handlers without stale closures. Synced\n // after render (never written during render) and optimistically in commit() so a drag burst\n // dedupes before the next render lands.\n const currentRef = useRef(current);\n useEffect(() => {\n currentRef.current = current;\n }, [current]);\n\n function payloadOf(next: number[]): number \| [number, number] {\n return isRange ? [next[0], next[1]] : next[0];\n }\n\n /* How far this thumb may travel: the track, narrowed by its neighbour and `minRange`. /\n function boundsFor(index: number, values: number[]): [number, number] {\n if (!isRange) return [min, max];\n return index === 0 ? [min, values[1] - minRange] : [values[0] + minRange, max];\n }\n\n function commit(index: number, raw: number, ended: boolean) {\n const previous = currentRef.current;\n const [lower, upper] = boundsFor(index, previous);\n\n // Clamped after snapping, and rounded again: a bound derived from a neighbour plus `minRange`\n // is off the step grid and carries float error (0.3 - 0.1 is 0.19999999999999998).\n let snapped = snap(raw);\n if (snapped < lower) snapped = Number(Math.max(min, lower).toFixed(decimals));\n if (snapped > upper) snapped = Number(Math.min(max, upper).toFixed(decimals));\n\n // A keyboard step that lands on the same value still ends a gesture, but nothing changed,\n // so only onChangeEnd fires.\n if (snapped === previous[index]) {\n if (ended) emitEnd?.(payloadOf(previous));\n return;\n }\n\n const next = [...previous];\n next[index] = snapped;\n currentRef.current = next;\n if (!isControlled) setInternal(next);\n emitChange?.(payloadOf(next));\n if (ended) emitEnd?.(payloadOf(next));\n }\n\n function valueFromClientX(clientX: number): number {\n const track = trackRef.current;\n if (!track) return currentRef.current[0];\n const rect = track.getBoundingClientRect();\n const ratio = rect.width ? (clientX - rect.left) / rect.width : 0;\n return min + Math.min(1, Math.max(0, ratio)) (max - min);\n }\n\n /*\n The thumb closest to the press. On a tie the press direction decides, which is what keeps the\n * upper thumb reachable when the two sit on the same value and every distance ties.\n /\n function nearestThumb(target: number): number {\n if (!isRange) return 0;\n const [lo, hi] = currentRef.current;\n const toLo = Math.abs(target - lo);\n const toHi = Math.abs(target - hi);\n if (toLo === toHi) return target > hi ? 1 : 0;\n return toLo < toHi ? 0 : 1;\n }\n\n function handlePointerDown(e: React.PointerEvent<HTMLDivElement>) {\n if (disabled) return;\n e.preventDefault();\n const target = valueFromClientX(e.clientX);\n const index = nearestThumb(target);\n\n (isRange ? thumbRefs.current[index] : rootRef.current)?.focus();\n rootRef.current?.setPointerCapture?.(e.pointerId);\n draggingIndexRef.current = index;\n setDragging(true);\n commit(index, target, false);\n }\n\n function handlePointerMove(e: React.PointerEvent<HTMLDivElement>) {\n const index = draggingIndexRef.current;\n if (index === null) return;\n commit(index, valueFromClientX(e.clientX), false);\n }\n\n function handlePointerUp(e: React.PointerEvent<HTMLDivElement>) {\n if (draggingIndexRef.current === null) return;\n draggingIndexRef.current = null;\n setDragging(false);\n rootRef.current?.releasePointerCapture?.(e.pointerId);\n emitEnd?.(payloadOf(currentRef.current));\n }\n\n function handleKeyDown(e: React.KeyboardEvent<HTMLDivElement>, index: number) {\n if (disabled) return;\n const page = step 10;\n const from = current[index];\n let next: number \| null = null;\n\n switch (e.key) {\n case 'ArrowRight':\n case 'ArrowUp':\n next = from + step;\n break;\n case 'ArrowLeft':\n case 'ArrowDown':\n next = from - step;\n break;\n case 'PageUp':\n next = from + page;\n break;\n case 'PageDown':\n next = from - page;\n break;\n case 'Home':\n next = min;\n break;\n case 'End':\n next = max;\n break;\n default:\n return;\n }\n e.preventDefault();\n commit(index, next, true);\n }\n\n const fractionOf = (v: number) => (max > min ? (clamp(v) - min) / (max - min) : 0);\n const percentOf = (v: number) => `${fractionOf(v) * 100}%`;\n\n const rangeStyle = isRange\n ? { left: percentOf(current[0]), width: `${(fractionOf(current[1]) - fractionOf(current[0])) * 100}%` }\n : { width: percentOf(current[0]) };\n\n const hasMarkLabels = !!marks?.some((m) => m.label != null);\n const textOf = (v: number) => (formatValue ? formatValue(v) : v);\n\n function thumbAriaProps(index: number) {\n const v = current[index];\n const text = textOf(v);\n const [lower, upper] = boundsFor(index, current);\n return {\n role: 'slider' as const,\n 'aria-valuemin': Number(Math.max(min, lower).toFixed(decimals)),\n 'aria-valuemax': Number(Math.min(max, upper).toFixed(decimals)),\n 'aria-valuenow': v,\n 'aria-valuetext': typeof text === 'string' \|\| typeof text === 'number' ? String(text) : undefined,\n 'aria-orientation': 'horizontal' as const,\n 'aria-disabled': disabled \|\| undefined,\n };\n }\n\n // A single-thumb slider is the slider; a two-thumb one is a group of two, each its own slider.\n const rootAria = isRange\n ? { role: 'group' as const, 'aria-label': ariaLabel, 'aria-disabled': disabled \|\| undefined }\n : { ...thumbAriaProps(0), 'aria-label': ariaLabel, tabIndex: disabled ? -1 : tabIndex };\n\n return (\n <div\n {...rest}\n {...rootAria}\n ref={rootRef}\n className={cx(\n styles.slider,\n disabled && styles.sliderDisabled,\n dragging && styles.sliderDragging,\n hasMarkLabels && styles.sliderHasMarkLabels,\n className,\n classNames?.root,\n )}\n style={\n { ...(size ? { '--slider-thumb-size': size } : null), ...style, ...slotStyles?.root } as React.CSSProperties\n }\n onPointerDown={handlePointerDown}\n onPointerMove={handlePointerMove}\n onPointerUp={handlePointerUp}\n onKeyDown={isRange ? undefined : (e) => handleKeyDown(e, 0)}\n >\n <div ref={trackRef} className={cx(styles.sliderTrack, classNames?.track)} style={slotStyles?.track}>\n <div className={cx(styles.sliderRange, classNames?.range)} style={{ ...rangeStyle, ...slotStyles?.range }} />\n {marks?.map((mark) => {\n const left = percentOf(mark.value);\n return (\n <React.Fragment key={mark.value}>\n <span className={cx(styles.sliderMark, classNames?.mark)} style={{ left, ...slotStyles?.mark }} />\n {mark.label != null && (\n <span\n className={cx(styles.sliderMarkLabel, classNames?.markLabel)}\n style={{ left, ...slotStyles?.markLabel }}\n >\n {mark.label}\n </span>\n )}\n </React.Fragment>\n );\n })}\n {current.map((v, index) => (\n <div\n key={index}\n ref={(el) => {\n thumbRefs.current[index] = el;\n }}\n className={cx(styles.sliderThumb, classNames?.thumb)}\n style={{ left: percentOf(v), ...slotStyles?.thumb }}\n {...(isRange\n ? {\n ...thumbAriaProps(index),\n 'aria-label': thumbLabels?.[index] ?? (index === 0 ? 'From' : 'To'),\n tabIndex: disabled ? -1 : tabIndex,\n onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => handleKeyDown(e, index),\n }\n : {})}\n >\n {showValue && (\n <span className={cx(styles.sliderValue, classNames?.value)} style={slotStyles?.value}>\n {textOf(v)}\n </span>\n )}\n </div>\n ))}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"slider.mjs","names":[],"sources":["../../../../package/common/slider/slider.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\nimport styles from './slider.module.pcss';\nimport type { RangeSliderProps, SingleSliderProps, SliderProps } from './slider.types';\n\n/*\n Every prop of both variants, optional. Destructuring the union directly cannot reach the\n * range-only props, and leaving them in `...rest` spreads them onto the DOM node.\n /\ntype AnySliderProps = Omit<SingleSliderProps, 'onChange' \| 'onChangeEnd' \| 'value' \| 'defaultValue' \| 'range'> &\n Partial<Pick<RangeSliderProps, 'minRange' \| 'thumbLabels'>> & {\n range?: boolean;\n value?: number \| [number, number];\n defaultValue?: number \| [number, number];\n onChange?: (value: never) => void;\n onChangeEnd?: (value: never) => void;\n };\n\n/* Count decimal places in a step so snapped values don't accumulate float error. /\nfunction decimalsOf(step: number): number {\n const s = String(step);\n const dot = s.indexOf('.');\n return dot === -1 ? 0 : s.length - dot - 1;\n}\n\nexport default function Slider(props: SliderProps): ReactElement {\n const {\n min = 0,\n max = 100,\n step = 1,\n disabled = false,\n marks,\n showValue = false,\n formatValue,\n size,\n tabIndex = 0,\n className,\n style,\n classNames,\n styles: slotStyles,\n 'aria-label': ariaLabel,\n range,\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n minRange = 0,\n thumbLabels,\n ...rest\n } = props as AnySliderProps;\n\n // The union guarantees each handler matches `range`, but that link does not survive\n // destructuring, so the pair is widened once here rather than cast at every call.\n const emitChange = onChange as ((v: number \| [number, number]) => void) \| undefined;\n const emitEnd = onChangeEnd as ((v: number \| [number, number]) => void) \| undefined;\n\n const isRange = range === true;\n\n const trackRef = useRef<HTMLDivElement>(null);\n const rootRef = useRef<HTMLDivElement>(null);\n const thumbRefs = useRef<(HTMLDivElement \| null)[]>([]);\n const draggingIndexRef = useRef<number \| null>(null);\n const [dragging, setDragging] = useState(false);\n\n const decimals = decimalsOf(step);\n\n function clamp(v: number): number {\n return Math.min(max, Math.max(min, v));\n }\n\n function snap(v: number): number {\n const snapped = Math.round((v - min) / step) step + min;\n return Number(clamp(snapped).toFixed(decimals));\n }\n\n /** Both modes run on an array internally; only the edges of the component know the difference. /\n function toValues(raw: number \| [number, number] \| undefined): number[] {\n if (isRange) {\n const pair = (raw as [number, number] \| undefined) ?? [min, max];\n return [clamp(pair[0]), clamp(pair[1])];\n }\n return [clamp((raw as number \| undefined) ?? min)];\n }\n\n /* Reshapes a stored pair or single if `range` is flipped after mount. /\n function fitToMode(values: number[]): number[] {\n const expected = isRange ? 2 : 1;\n if (values.length === expected) return values;\n return isRange ? [values[0], max] : [values[0]];\n }\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = useState<number[]>(() => toValues(defaultValue));\n const current = isControlled ? toValues(value) : fitToMode(internal);\n\n // Latest committed values, for reading inside pointer handlers without stale closures. Synced\n // after render (never written during render) and optimistically in commit() so a drag burst\n // dedupes before the next render lands.\n const currentRef = useRef(current);\n useEffect(() => {\n currentRef.current = current;\n }, [current]);\n\n function payloadOf(next: number[]): number \| [number, number] {\n return isRange ? [next[0], next[1]] : next[0];\n }\n\n /* How far this thumb may travel: the track, narrowed by its neighbour and `minRange`. /\n function boundsFor(index: number, values: number[]): [number, number] {\n if (!isRange) return [min, max];\n return index === 0 ? [min, values[1] - minRange] : [values[0] + minRange, max];\n }\n\n function commit(index: number, raw: number, ended: boolean) {\n const previous = currentRef.current;\n const [lower, upper] = boundsFor(index, previous);\n\n // Clamped after snapping, and rounded again: a bound derived from a neighbour plus `minRange`\n // is off the step grid and carries float error (0.3 - 0.1 is 0.19999999999999998).\n let snapped = snap(raw);\n if (snapped < lower) snapped = Number(Math.max(min, lower).toFixed(decimals));\n if (snapped > upper) snapped = Number(Math.min(max, upper).toFixed(decimals));\n\n // A keyboard step that lands on the same value still ends a gesture, but nothing changed,\n // so only onChangeEnd fires.\n if (snapped === previous[index]) {\n if (ended) emitEnd?.(payloadOf(previous));\n return;\n }\n\n const next = [...previous];\n next[index] = snapped;\n currentRef.current = next;\n if (!isControlled) setInternal(next);\n emitChange?.(payloadOf(next));\n if (ended) emitEnd?.(payloadOf(next));\n }\n\n function valueFromClientX(clientX: number): number {\n const track = trackRef.current;\n if (!track) return currentRef.current[0];\n const rect = track.getBoundingClientRect();\n const ratio = rect.width ? (clientX - rect.left) / rect.width : 0;\n return min + Math.min(1, Math.max(0, ratio)) (max - min);\n }\n\n /*\n The thumb closest to the press. On a tie the press direction decides, which is what keeps the\n * upper thumb reachable when the two sit on the same value and every distance ties.\n /\n function nearestThumb(target: number): number {\n if (!isRange) return 0;\n const [lo, hi] = currentRef.current;\n const toLo = Math.abs(target - lo);\n const toHi = Math.abs(target - hi);\n if (toLo === toHi) return target > hi ? 1 : 0;\n return toLo < toHi ? 0 : 1;\n }\n\n function handlePointerDown(e: React.PointerEvent<HTMLDivElement>) {\n if (disabled) return;\n e.preventDefault();\n const target = valueFromClientX(e.clientX);\n const index = nearestThumb(target);\n\n (isRange ? thumbRefs.current[index] : rootRef.current)?.focus();\n rootRef.current?.setPointerCapture?.(e.pointerId);\n draggingIndexRef.current = index;\n setDragging(true);\n commit(index, target, false);\n }\n\n function handlePointerMove(e: React.PointerEvent<HTMLDivElement>) {\n const index = draggingIndexRef.current;\n if (index === null) return;\n commit(index, valueFromClientX(e.clientX), false);\n }\n\n function handlePointerUp(e: React.PointerEvent<HTMLDivElement>) {\n if (draggingIndexRef.current === null) return;\n draggingIndexRef.current = null;\n setDragging(false);\n rootRef.current?.releasePointerCapture?.(e.pointerId);\n emitEnd?.(payloadOf(currentRef.current));\n }\n\n function handleKeyDown(e: React.KeyboardEvent<HTMLDivElement>, index: number) {\n if (disabled) return;\n const page = step 10;\n const from = current[index];\n let next: number \| null = null;\n\n switch (e.key) {\n case 'ArrowRight':\n case 'ArrowUp':\n next = from + step;\n break;\n case 'ArrowLeft':\n case 'ArrowDown':\n next = from - step;\n break;\n case 'PageUp':\n next = from + page;\n break;\n case 'PageDown':\n next = from - page;\n break;\n case 'Home':\n next = min;\n break;\n case 'End':\n next = max;\n break;\n default:\n return;\n }\n e.preventDefault();\n commit(index, next, true);\n }\n\n const fractionOf = (v: number) => (max > min ? (clamp(v) - min) / (max - min) : 0);\n const percentOf = (v: number) => `${fractionOf(v) * 100}%`;\n\n const rangeStyle = isRange\n ? { left: percentOf(current[0]), width: `${(fractionOf(current[1]) - fractionOf(current[0])) * 100}%` }\n : { width: percentOf(current[0]) };\n\n const hasMarkLabels = !!marks?.some((m) => m.label != null);\n const textOf = (v: number) => (formatValue ? formatValue(v) : v);\n\n function thumbAriaProps(index: number) {\n const v = current[index];\n const text = textOf(v);\n const [lower, upper] = boundsFor(index, current);\n return {\n role: 'slider' as const,\n 'aria-valuemin': Number(Math.max(min, lower).toFixed(decimals)),\n 'aria-valuemax': Number(Math.min(max, upper).toFixed(decimals)),\n 'aria-valuenow': v,\n 'aria-valuetext': typeof text === 'string' \|\| typeof text === 'number' ? String(text) : undefined,\n 'aria-orientation': 'horizontal' as const,\n 'aria-disabled': disabled \|\| undefined,\n };\n }\n\n // A single-thumb slider is the slider; a two-thumb one is a group of two, each its own slider.\n const rootAria = isRange\n ? { role: 'group' as const, 'aria-label': ariaLabel, 'aria-disabled': disabled \|\| undefined }\n : { ...thumbAriaProps(0), 'aria-label': ariaLabel, tabIndex: disabled ? -1 : tabIndex };\n\n return (\n <div\n {...rest}\n {...rootAria}\n ref={rootRef}\n className={cx(\n styles.slider,\n disabled && styles.sliderDisabled,\n dragging && styles.sliderDragging,\n hasMarkLabels && styles.sliderHasMarkLabels,\n className,\n classNames?.root,\n )}\n style={\n { ...(size ? { '--slider-thumb-size': size } : null), ...style, ...slotStyles?.root } as React.CSSProperties\n }\n onPointerDown={handlePointerDown}\n onPointerMove={handlePointerMove}\n onPointerUp={handlePointerUp}\n onKeyDown={isRange ? undefined : (e) => handleKeyDown(e, 0)}\n >\n <div ref={trackRef} className={cx(styles.sliderTrack, classNames?.track)} style={slotStyles?.track}>\n <div className={cx(styles.sliderRange, classNames?.range)} style={{ ...rangeStyle, ...slotStyles?.range }} />\n {marks?.map((mark) => {\n const left = percentOf(mark.value);\n return (\n <React.Fragment key={mark.value}>\n <span className={cx(styles.sliderMark, classNames?.mark)} style={{ left, ...slotStyles?.mark }} />\n {mark.label != null && (\n <span\n className={cx(styles.sliderMarkLabel, classNames?.markLabel)}\n style={{ left, ...slotStyles?.markLabel }}\n >\n {mark.label}\n </span>\n )}\n </React.Fragment>\n );\n })}\n {current.map((v, index) => (\n <div\n key={index}\n ref={(el) => {\n thumbRefs.current[index] = el;\n }}\n className={cx(styles.sliderThumb, classNames?.thumb)}\n style={{ left: percentOf(v), ...slotStyles?.thumb }}\n {...(isRange\n ? {\n ...thumbAriaProps(index),\n 'aria-label': thumbLabels?.[index] ?? (index === 0 ? 'From' : 'To'),\n tabIndex: disabled ? -1 : tabIndex,\n onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => handleKeyDown(e, index),\n }\n : {})}\n >\n {showValue && (\n <span className={cx(styles.sliderValue, classNames?.value)} style={slotStyles?.value}>\n {textOf(v)}\n </span>\n )}\n </div>\n ))}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/esm/common/slider/slider.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`slider_qmg2W`,t=`slider-thumb_CHuJN`,n=`slider-disabled_T0o2S`,r=`slider-has-mark-labels_Xw6ZJ`,i=`slider-track_UyKYc`,a=`slider-range_exAs9`,o=`slider-dragging_htPFH`,s=`slider-mark_fvw-n`,c=`slider-mark-label_iDtU2`,l=`slider-value_3rQgd`,u={slider:e,"slider-thumb":`slider-thumb_CHuJN`,sliderThumb:t,"slider-disabled":`slider-disabled_T0o2S`,sliderDisabled:n,"slider-has-mark-labels":`slider-has-mark-labels_Xw6ZJ`,sliderHasMarkLabels:r,"slider-track":`slider-track_UyKYc`,sliderTrack:i,"slider-range":`slider-range_exAs9`,sliderRange:a,"slider-dragging":`slider-dragging_htPFH`,sliderDragging:o,"slider-mark":`slider-mark_fvw-n`,sliderMark:s,"slider-mark-label":`slider-mark-label_iDtU2`,sliderMarkLabel:c,"slider-value":`slider-value_3rQgd`,sliderValue:l};export{u as default,e as slider,n as sliderDisabled,o as sliderDragging,r as sliderHasMarkLabels,s as sliderMark,c as sliderMarkLabel,a as sliderRange,t as sliderThumb,i as sliderTrack,l as sliderValue};
+"use client";var e=`slider_qmg2W`,t=`slider-thumb_CHuJN`,n=`slider-disabled_T0o2S`,r=`slider-has-mark-labels_Xw6ZJ`,i=`slider-track_UyKYc`,a=`slider-range_exAs9`,o=`slider-dragging_htPFH`,s=`slider-mark_fvw-n`,c=`slider-mark-label_iDtU2`,l=`slider-value_3rQgd`,u={slider:e,"slider-thumb":`slider-thumb_CHuJN`,sliderThumb:t,"slider-disabled":`slider-disabled_T0o2S`,sliderDisabled:n,"slider-has-mark-labels":`slider-has-mark-labels_Xw6ZJ`,sliderHasMarkLabels:r,"slider-track":`slider-track_UyKYc`,sliderTrack:i,"slider-range":`slider-range_exAs9`,sliderRange:a,"slider-dragging":`slider-dragging_htPFH`,sliderDragging:o,"slider-mark":`slider-mark_fvw-n`,sliderMark:s,"slider-mark-label":`slider-mark-label_iDtU2`,sliderMarkLabel:c,"slider-value":`slider-value_3rQgd`,sliderValue:l};export{u as default,e as slider,n as sliderDisabled,o as sliderDragging,r as sliderHasMarkLabels,s as sliderMark,c as sliderMarkLabel,a as sliderRange,t as sliderThumb,i as sliderTrack,l as sliderValue};
 //# sourceMappingURL=slider.module.mjs.map

package/dist/esm/common/splitButton/splitButton.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{ButtonSize as n,ButtonStyleType as r}from"../button/button.types.mjs";import i from"../button/button.mjs";import{PopoverAlign as a,PopoverPlacement as o}from"../popover/popover.types.mjs";import s from"../buttonGroup/buttonGroup.mjs";import c from"../menu/menu.mjs";import l from"./splitButton.module.mjs";import{useState as u}from"react";import d from"classnames";import{faChevronDown as f}from"@fortawesome/free-solid-svg-icons";import{jsx as p,jsxs as m}from"react/jsx-runtime";var h={moreActions:`More actions`};function g(g){let{children:_,onClick:v=()=>{},actions:y=[],styleType:b=r.Primary,size:x=n.Default,disabled:S=!1,isLoading:C=!1,align:w=a.End,className:T,style:E,classNames:D,styles:O,labels:k,...A}=e(`SplitButton`,g),j=t(`SplitButton`,k,h),[M,N]=u(!1),[P,F]=u(S);return S!==P&&(F(S),S&&N(!1)),m(s,{...A,className:d(l.splitButton,D?.root,T),style:{...E,...O?.root},children:[p(i,{styleType:b,size:x,disabled:S,isLoading:C,onClick:v,className:d(l.splitButtonPrimary,D?.primaryButton),style:O?.primaryButton,children:_}),p(c,{items:y,isOpen:M,onOpenChange:N,placement:o.Bottom,align:w,classNames:{menu:D?.menu,item:D?.menuItem},styles:{menu:O?.menu,item:O?.menuItem},children:p(i,{styleType:b,size:x,disabled:S,icon:f,"aria-label":j.moreActions,className:d(l.splitButtonTrigger,D?.triggerButton),style:O?.triggerButton})})]})}export{g as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{ButtonSize as n,ButtonStyleType as r}from"../button/button.types.mjs";import i from"../button/button.mjs";import{PopoverAlign as a,PopoverPlacement as o}from"../popover/popover.types.mjs";import s from"../buttonGroup/buttonGroup.mjs";import c from"../menu/menu.mjs";import l from"./splitButton.module.mjs";import{useState as u}from"react";import d from"classnames";import{faChevronDown as f}from"@fortawesome/free-solid-svg-icons";import{jsx as p,jsxs as m}from"react/jsx-runtime";var h={moreActions:`More actions`};function g(g){let{children:_,onClick:v=()=>{},actions:y=[],styleType:b=r.Primary,size:x=n.Default,disabled:S=!1,isLoading:C=!1,align:w=a.End,className:T,style:E,classNames:D,styles:O,labels:k,...A}=e(`SplitButton`,g),j=t(`SplitButton`,k,h),[M,N]=u(!1),[P,F]=u(S);return S!==P&&(F(S),S&&N(!1)),m(s,{...A,className:d(l.splitButton,D?.root,T),style:{...E,...O?.root},children:[p(i,{styleType:b,size:x,disabled:S,isLoading:C,onClick:v,className:d(l.splitButtonPrimary,D?.primaryButton),style:O?.primaryButton,children:_}),p(c,{items:y,isOpen:M,onOpenChange:N,placement:o.Bottom,align:w,classNames:{menu:D?.menu,item:D?.menuItem},styles:{menu:O?.menu,item:O?.menuItem},children:p(i,{styleType:b,size:x,disabled:S,icon:f,"aria-label":j.moreActions,className:d(l.splitButtonTrigger,D?.triggerButton),style:O?.triggerButton})})]})}export{g as default};
 //# sourceMappingURL=splitButton.mjs.map

package/dist/esm/common/splitButton/splitButton.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"splitButton.mjs","names":[],"sources":["../../../../package/common/splitButton/splitButton.tsx"],"sourcesContent":["import { useState } from 'react';\nimport cx from 'classnames';\nimport { faChevronDown } from '@fortawesome/free-solid-svg-icons';\n\nimport Button from '../button';\nimport { ButtonStyleType, ButtonSize } from '../button/button.types';\nimport ButtonGroup from '../buttonGroup';\nimport Menu from '../menu';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { SplitButtonLabels, SplitButtonProps } from './splitButton.types';\n\nimport styles from './splitButton.module.pcss';\n\nconst DEFAULT_LABELS: Required<SplitButtonLabels> = {\n moreActions: 'More actions',\n};\n\nfunction SplitButton(props: SplitButtonProps) {\n const {\n children,\n onClick = () => {},\n actions = [],\n styleType = ButtonStyleType.Primary,\n size = ButtonSize.Default,\n disabled = false,\n isLoading = false,\n align = PopoverAlign.End,\n className,\n style,\n classNames,\n styles: slotStyles,\n labels,\n ...rest\n } = useComponentDefaults('SplitButton', props);\n const text = useLabels('SplitButton', labels, DEFAULT_LABELS);\n\n const [isOpen, setIsOpen] = useState(false);\n\n // Adjusting state during render (not in an effect) on a prop change is the documented React\n // pattern for this: closing the menu as soon as `disabled` becomes true, without an extra\n // render tick or a setState-in-effect lint violation.\n const [prevDisabled, setPrevDisabled] = useState(disabled);\n if (disabled !== prevDisabled) {\n setPrevDisabled(disabled);\n if (disabled) setIsOpen(false);\n }\n\n return (\n <ButtonGroup\n {...rest}\n className={cx(styles.splitButton, classNames?.root, className)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <Button\n styleType={styleType}\n size={size}\n disabled={disabled}\n isLoading={isLoading}\n onClick={onClick}\n className={cx(styles.splitButtonPrimary, classNames?.primaryButton)}\n style={slotStyles?.primaryButton}\n >\n {children}\n </Button>\n\n {/* The list, its keys, its focus and its menu semantics are Menu's; this\n component only welds a second button to the first. */}\n <Menu\n items={actions}\n isOpen={isOpen}\n onOpenChange={setIsOpen}\n placement={PopoverPlacement.Bottom}\n align={align}\n classNames={{ menu: classNames?.menu, item: classNames?.menuItem }}\n styles={{ menu: slotStyles?.menu, item: slotStyles?.menuItem }}\n >\n <Button\n styleType={styleType}\n size={size}\n disabled={disabled}\n icon={faChevronDown}\n aria-label={text.moreActions}\n className={cx(styles.splitButtonTrigger, classNames?.triggerButton)}\n style={slotStyles?.triggerButton}\n />\n </Menu>\n </ButtonGroup>\n );\n}\n\nexport default SplitButton;\n"],"mappings":"~~snBAcA~~,IAAM,EAA8C,CAClD,YAAa,cACf,EAEA,SAAS,EAAY,EAAyB,CAC5C,GAAM,CACJ,WACA,cAAgB,CAAC,EACjB,UAAU,CAAC,EACX,YAAY,EAAgB,QAC5B,OAAO,EAAW,QAClB,WAAW,GACX,YAAY,GACZ,QAAQ,EAAa,IACrB,YACA,QACA,aACA,OAAQ,EACR,SACA,GAAG,GACD,EAAqB,cAAe,CAAK,EACvC,EAAO,EAAU,cAAe,EAAQ,CAAc,EAEtD,CAAC,EAAQ,GAAa,EAAS,EAAK,EAKpC,CAAC,EAAc,GAAmB,EAAS,CAAQ,EAMzD,OALI,IAAa,IACf,EAAgB,CAAQ,EACpB,GAAU,EAAU,EAAK,GAI7B,EAAC,EAAD,CACE,GAAI,EACJ,UAAW,EAAG,EAAO,YAAa,GAAY,KAAM,CAAS,EAC7D,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,EAHzC,SAAA,CAKE,EAAC,EAAD,CACa,YACL,OACI,WACC,YACF,UACT,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,cAElB,UACK,CAAA,EAIR,EAAC,EAAD,CACE,MAAO,EACC,SACR,aAAc,EACd,UAAW,EAAiB,OACrB,QACP,WAAY,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EACjE,OAAQ,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EAE7D,SAAA,EAAC,EAAD,CACa,YACL,OACI,WACV,KAAM,EACN,aAAY,EAAK,YACjB,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,aACpB,CAAA,CACG,CAAA,CACK,GAEjB"}
1	+ {"version":3,"file":"splitButton.mjs","names":[],"sources":["../../../../package/common/splitButton/splitButton.tsx"],"sourcesContent":["import { useState } from 'react';\nimport cx from 'classnames';\nimport { faChevronDown } from '@fortawesome/free-solid-svg-icons';\n\nimport Button from '../button';\nimport { ButtonStyleType, ButtonSize } from '../button/button.types';\nimport ButtonGroup from '../buttonGroup';\nimport Menu from '../menu';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { SplitButtonLabels, SplitButtonProps } from './splitButton.types';\n\nimport styles from './splitButton.module.pcss';\n\nconst DEFAULT_LABELS: Required<SplitButtonLabels> = {\n moreActions: 'More actions',\n};\n\nfunction SplitButton(props: SplitButtonProps) {\n const {\n children,\n onClick = () => {},\n actions = [],\n styleType = ButtonStyleType.Primary,\n size = ButtonSize.Default,\n disabled = false,\n isLoading = false,\n align = PopoverAlign.End,\n className,\n style,\n classNames,\n styles: slotStyles,\n labels,\n ...rest\n } = useComponentDefaults('SplitButton', props);\n const text = useLabels('SplitButton', labels, DEFAULT_LABELS);\n\n const [isOpen, setIsOpen] = useState(false);\n\n // Adjusting state during render (not in an effect) on a prop change is the documented React\n // pattern for this: closing the menu as soon as `disabled` becomes true, without an extra\n // render tick or a setState-in-effect lint violation.\n const [prevDisabled, setPrevDisabled] = useState(disabled);\n if (disabled !== prevDisabled) {\n setPrevDisabled(disabled);\n if (disabled) setIsOpen(false);\n }\n\n return (\n <ButtonGroup\n {...rest}\n className={cx(styles.splitButton, classNames?.root, className)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <Button\n styleType={styleType}\n size={size}\n disabled={disabled}\n isLoading={isLoading}\n onClick={onClick}\n className={cx(styles.splitButtonPrimary, classNames?.primaryButton)}\n style={slotStyles?.primaryButton}\n >\n {children}\n </Button>\n\n {/* The list, its keys, its focus and its menu semantics are Menu's; this\n component only welds a second button to the first. */}\n <Menu\n items={actions}\n isOpen={isOpen}\n onOpenChange={setIsOpen}\n placement={PopoverPlacement.Bottom}\n align={align}\n classNames={{ menu: classNames?.menu, item: classNames?.menuItem }}\n styles={{ menu: slotStyles?.menu, item: slotStyles?.menuItem }}\n >\n <Button\n styleType={styleType}\n size={size}\n disabled={disabled}\n icon={faChevronDown}\n aria-label={text.moreActions}\n className={cx(styles.splitButtonTrigger, classNames?.triggerButton)}\n style={slotStyles?.triggerButton}\n />\n </Menu>\n </ButtonGroup>\n );\n}\n\nexport default SplitButton;\n"],"mappings":"moBAcA,IAAM,EAA8C,CAClD,YAAa,cACf,EAEA,SAAS,EAAY,EAAyB,CAC5C,GAAM,CACJ,WACA,cAAgB,CAAC,EACjB,UAAU,CAAC,EACX,YAAY,EAAgB,QAC5B,OAAO,EAAW,QAClB,WAAW,GACX,YAAY,GACZ,QAAQ,EAAa,IACrB,YACA,QACA,aACA,OAAQ,EACR,SACA,GAAG,GACD,EAAqB,cAAe,CAAK,EACvC,EAAO,EAAU,cAAe,EAAQ,CAAc,EAEtD,CAAC,EAAQ,GAAa,EAAS,EAAK,EAKpC,CAAC,EAAc,GAAmB,EAAS,CAAQ,EAMzD,OALI,IAAa,IACf,EAAgB,CAAQ,EACpB,GAAU,EAAU,EAAK,GAI7B,EAAC,EAAD,CACE,GAAI,EACJ,UAAW,EAAG,EAAO,YAAa,GAAY,KAAM,CAAS,EAC7D,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,EAHzC,SAAA,CAKE,EAAC,EAAD,CACa,YACL,OACI,WACC,YACF,UACT,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,cAElB,UACK,CAAA,EAIR,EAAC,EAAD,CACE,MAAO,EACC,SACR,aAAc,EACd,UAAW,EAAiB,OACrB,QACP,WAAY,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EACjE,OAAQ,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EAE7D,SAAA,EAAC,EAAD,CACa,YACL,OACI,WACV,KAAM,EACN,aAAY,EAAK,YACjB,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,aACpB,CAAA,CACG,CAAA,CACK,GAEjB"}

package/dist/esm/common/splitButton/splitButton.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`splitButton_5ak5W`,t=`splitButtonPrimary_4mVy8`,n=`splitButtonTrigger_32cQA`,r={splitButton:e,splitButtonPrimary:t,splitButtonTrigger:n};export{r as default,e as splitButton,t as splitButtonPrimary,n as splitButtonTrigger};
+"use client";var e=`splitButton_5ak5W`,t=`splitButtonPrimary_4mVy8`,n=`splitButtonTrigger_32cQA`,r={splitButton:e,splitButtonPrimary:t,splitButtonTrigger:n};export{r as default,e as splitButton,t as splitButtonPrimary,n as splitButtonTrigger};
 //# sourceMappingURL=splitButton.module.mjs.map

package/dist/esm/common/stepper/stepper.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{renderIcon as e}from"../utils/renderIcon.mjs";import t from"./stepper.module.mjs";import{StepperAlignment as n,StepperCollapse as r,StepperLabelPlacement as i,StepperStyleType as a}from"./stepper.types.mjs";import o,{useEffect as s,useRef as c,useState as l}from"react";import u from"classnames";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";var m={[a.Default]:t.stepperDefault,[a.Outlined]:t.stepperOutlined,[a.Dots]:t.stepperDots},h={[i.Top]:t.stepperLabelTop,[i.Bottom]:t.stepperLabelBottom,[i.Left]:t.stepperLabelLeft,[i.Right]:t.stepperLabelRight};function g(){return f(`svg`,{className:t.stepperCheckmark,strokeLinejoin:`round`,strokeLinecap:`round`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`-0.2 -1.2 3.4 2`,height:`20px`,width:`20px`,children:f(`path`,{d:`M 0 0 l 1 1 l 2 -2`,strokeWidth:`0.4`,fill:`none`})})}function _({open:e,className:n,style:r,children:i}){let a=c(null),[o,d]=l(null);return s(()=>{let e=a.current;if(!e)return;let t=new ResizeObserver(()=>d(e.offsetHeight));return t.observe(e),()=>t.disconnect()},[]),f(`div`,{className:u(t.stepperContent,n),style:{...r,height:e?o??`auto`:0},"aria-hidden":!e,children:f(`div`,{ref:a,className:t.stepperContentInner,children:i})})}function v(e,t){let n=[i.Left,i.Right];return t?e&&n.includes(e)?e:i.Right:e&&!n.includes(e)?e:i.Bottom}function y({steps:i=[],currentStep:s=0,alignment:c=n.Horizontal,onStepClicked:l=null,nonLinear:y=!1,hideLabels:b=!1,styleType:x=a.Default,collapse:S=r.None,labelPlacement:C,className:w,style:T,classNames:E,styles:D,...O}){let k=c===n.Vertical,A=v(C,k);return f(`div`,{...O,className:u(t.stepper,m[x],h[A],{[t.stepperVertical]:k},E?.root,w),style:{...D?.root,...T},children:i.map((n,a)=>{let c=a<s,m=a<=s,h=!!n.error,v=!!l&&!n.disabled&&(y?a!==s:c),x=u(t.stepperEntry,{[t.stepperEntryActive]:m},{[t.stepperEntryDone]:c&&!h},{[t.stepperEntryError]:h},{[t.stepperEntryDisabled]:n.disabled},{[t.stepperClickable]:v},E?.entry),C=n.icon?e(n.icon,{className:E?.icon,style:D?.icon}):c&&!h?f(g,{}):a+1,w=f(`div`,{className:u(t.stepperEntryNumber,{[t.stepperEntryNumberDone]:c&&!h},E?.entryNumber),style:D?.entryNumber,children:C}),T=n.optional===!0?`Optional`:n.optional===!1?null:n.optional,O=!b&&p(`div`,{className:t.stepperEntryLabels,children:[f(`div`,{className:u(t.stepperEntryLabel,E?.entryLabel),style:D?.entryLabel,children:n.label}),n.description!=null&&f(`div`,{className:u(t.stepperDescription,E?.description),style:D?.description,children:n.description}),T!=null&&f(`div`,{className:u(t.stepperOptional,E?.optional),style:D?.optional,children:T})]}),A=v?{role:`button`,tabIndex:0,onClick:()=>l?.(a),onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),l?.(a))}}:{},j=e=>f(`div`,{className:x,style:D?.entry,"aria-current":a===s?`step`:void 0,"aria-invalid":h||void 0,...A,children:e}),M=a<i.length-1&&f(`div`,{className:u(t.stepperConnector,{[t.stepperConnectorFilled]:c},E?.connector),style:D?.connector});if(k){let e=a===0,o=a===i.length-1,l=S===r.None?!0:S===r.ActiveOnly?a===s:!c,h=n=>{let r=n===`lead`?e:o,i=n===`lead`?m:c;return f(`div`,{className:u(t.stepperRailSegment,{[t.stepperRailFilled]:!r&&i,[t.stepperRailHidden]:r})})},g=p(`div`,{className:t.stepperMarkerCell,children:[h(`lead`),w,h(`trail`)]});return p(`div`,{className:t.stepperStep,children:[j(p(d,{children:[g,O]})),M,n.content!=null&&!b&&f(_,{open:l,className:E?.content,style:D?.content,children:n.content})]},a)}return p(o.Fragment,{children:[j(p(d,{children:[w,O]})),M]},a)})})}export{y as default};
+"use client";import{renderIcon as e}from"../utils/renderIcon.mjs";import t from"./stepper.module.mjs";import{StepperAlignment as n,StepperCollapse as r,StepperLabelPlacement as i,StepperStyleType as a}from"./stepper.types.mjs";import o,{useEffect as s,useRef as c,useState as l}from"react";import u from"classnames";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";var m={[a.Default]:t.stepperDefault,[a.Outlined]:t.stepperOutlined,[a.Dots]:t.stepperDots},h={[i.Top]:t.stepperLabelTop,[i.Bottom]:t.stepperLabelBottom,[i.Left]:t.stepperLabelLeft,[i.Right]:t.stepperLabelRight};function g(){return f(`svg`,{className:t.stepperCheckmark,strokeLinejoin:`round`,strokeLinecap:`round`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`-0.2 -1.2 3.4 2`,height:`20px`,width:`20px`,children:f(`path`,{d:`M 0 0 l 1 1 l 2 -2`,strokeWidth:`0.4`,fill:`none`})})}function _({open:e,className:n,style:r,children:i}){let a=c(null),[o,d]=l(null);return s(()=>{let e=a.current;if(!e)return;let t=new ResizeObserver(()=>d(e.offsetHeight));return t.observe(e),()=>t.disconnect()},[]),f(`div`,{className:u(t.stepperContent,n),style:{...r,height:e?o??`auto`:0},"aria-hidden":!e,children:f(`div`,{ref:a,className:t.stepperContentInner,children:i})})}function v(e,t){let n=[i.Left,i.Right];return t?e&&n.includes(e)?e:i.Right:e&&!n.includes(e)?e:i.Bottom}function y({steps:i=[],currentStep:s=0,alignment:c=n.Horizontal,onStepClicked:l=null,nonLinear:y=!1,hideLabels:b=!1,styleType:x=a.Default,collapse:S=r.None,labelPlacement:C,className:w,style:T,classNames:E,styles:D,...O}){let k=c===n.Vertical,A=v(C,k);return f(`div`,{...O,className:u(t.stepper,m[x],h[A],{[t.stepperVertical]:k},E?.root,w),style:{...D?.root,...T},children:i.map((n,a)=>{let c=a<s,m=a<=s,h=!!n.error,v=!!l&&!n.disabled&&(y?a!==s:c),x=u(t.stepperEntry,{[t.stepperEntryActive]:m},{[t.stepperEntryDone]:c&&!h},{[t.stepperEntryError]:h},{[t.stepperEntryDisabled]:n.disabled},{[t.stepperClickable]:v},E?.entry),C=n.icon?e(n.icon,{className:E?.icon,style:D?.icon}):c&&!h?f(g,{}):a+1,w=f(`div`,{className:u(t.stepperEntryNumber,{[t.stepperEntryNumberDone]:c&&!h},E?.entryNumber),style:D?.entryNumber,children:C}),T=n.optional===!0?`Optional`:n.optional===!1?null:n.optional,O=!b&&p(`div`,{className:t.stepperEntryLabels,children:[f(`div`,{className:u(t.stepperEntryLabel,E?.entryLabel),style:D?.entryLabel,children:n.label}),n.description!=null&&f(`div`,{className:u(t.stepperDescription,E?.description),style:D?.description,children:n.description}),T!=null&&f(`div`,{className:u(t.stepperOptional,E?.optional),style:D?.optional,children:T})]}),A=v?{role:`button`,tabIndex:0,onClick:()=>l?.(a),onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),l?.(a))}}:{},j=e=>f(`div`,{className:x,style:D?.entry,"aria-current":a===s?`step`:void 0,"aria-invalid":h||void 0,...A,children:e}),M=a<i.length-1&&f(`div`,{className:u(t.stepperConnector,{[t.stepperConnectorFilled]:c},E?.connector),style:D?.connector});if(k){let e=a===0,o=a===i.length-1,l=S===r.None?!0:S===r.ActiveOnly?a===s:!c,h=n=>{let r=n===`lead`?e:o,i=n===`lead`?m:c;return f(`div`,{className:u(t.stepperRailSegment,{[t.stepperRailFilled]:!r&&i,[t.stepperRailHidden]:r})})},g=p(`div`,{className:t.stepperMarkerCell,children:[h(`lead`),w,h(`trail`)]});return p(`div`,{className:t.stepperStep,children:[j(p(d,{children:[g,O]})),M,n.content!=null&&!b&&f(_,{open:l,className:E?.content,style:D?.content,children:n.content})]},a)}return p(o.Fragment,{children:[j(p(d,{children:[w,O]})),M]},a)})})}export{y as default};
 //# sourceMappingURL=stepper.mjs.map

package/dist/esm/common/stepper/stepper.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport styles from './stepper.module.pcss';\nimport {\n StepperAlignment,\n StepperCollapse,\n StepperLabelPlacement,\n StepperStyleType,\n type StepperProps,\n type StepperStep,\n} from './stepper.types';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst STYLE_CLASS: Record<StepperStyleType, string> = {\n [StepperStyleType.Default]: styles.stepperDefault,\n [StepperStyleType.Outlined]: styles.stepperOutlined,\n [StepperStyleType.Dots]: styles.stepperDots,\n};\n\nconst PLACEMENT_CLASS: Record<StepperLabelPlacement, string> = {\n [StepperLabelPlacement.Top]: styles.stepperLabelTop,\n [StepperLabelPlacement.Bottom]: styles.stepperLabelBottom,\n [StepperLabelPlacement.Left]: styles.stepperLabelLeft,\n [StepperLabelPlacement.Right]: styles.stepperLabelRight,\n};\n\nfunction Checkmark() {\n return (\n <svg\n className={styles.stepperCheckmark}\n strokeLinejoin='round'\n strokeLinecap='round'\n xmlns='http://www.w3.org/2000/svg'\n viewBox='-0.2 -1.2 3.4 2'\n height='20px'\n width='20px'\n >\n <path d='M 0 0 l 1 1 l 2 -2' strokeWidth='0.4' fill='none' />\n </svg>\n );\n}\n\nfunction StepBody({\n open,\n className,\n style,\n children,\n}: {\n open: boolean;\n className?: string;\n style?: React.CSSProperties;\n children: React.ReactNode;\n}) {\n const innerRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<number \| null>(null);\n\n useEffect(() => {\n const el = innerRef.current;\n if (!el) return;\n const observer = new ResizeObserver(() => setHeight(el.offsetHeight));\n observer.observe(el);\n return () => observer.disconnect();\n }, []);\n\n return (\n <div\n className={cx(styles.stepperContent, className)}\n style={{ ...style, height: open ? (height ?? 'auto') : 0 }}\n aria-hidden={!open}\n >\n <div ref={innerRef} className={styles.stepperContentInner}>\n {children}\n </div>\n </div>\n );\n}\n\nfunction resolvePlacement(placement: StepperLabelPlacement \| undefined, isVertical: boolean): StepperLabelPlacement {\n const verticalValues = [StepperLabelPlacement.Left, StepperLabelPlacement.Right];\n if (isVertical) {\n return placement && verticalValues.includes(placement) ? placement : StepperLabelPlacement.Right;\n }\n return placement && !verticalValues.includes(placement) ? placement : StepperLabelPlacement.Bottom;\n}\n\nexport default function Stepper({\n steps = [],\n currentStep = 0,\n alignment = StepperAlignment.Horizontal,\n onStepClicked = null,\n nonLinear = false,\n hideLabels = false,\n styleType = StepperStyleType.Default,\n collapse = StepperCollapse.None,\n labelPlacement,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: StepperProps) {\n const isVertical = alignment === StepperAlignment.Vertical;\n const placement = resolvePlacement(labelPlacement, isVertical);\n\n return (\n <div\n {...rest}\n className={cx(\n styles.stepper,\n STYLE_CLASS[styleType],\n PLACEMENT_CLASS[placement],\n { [styles.stepperVertical]: isVertical },\n classNames?.root,\n className,\n )}\n style={{ ...slotStyles?.root, ...style }}\n >\n {steps.map((step: StepperStep, index: number) => {\n const isDone = index < currentStep;\n const isActive = index <= currentStep;\n const hasError = !!step.error;\n // nonLinear: every enabled step except the current one is clickable.\n // linear: only completed steps are clickable.\n const isClickable = !!onStepClicked && !step.disabled && (nonLinear ? index !== currentStep : isDone);\n\n const entryClassName = cx(\n styles.stepperEntry,\n { [styles.stepperEntryActive]: isActive },\n { [styles.stepperEntryDone]: isDone && !hasError },\n { [styles.stepperEntryError]: hasError },\n { [styles.stepperEntryDisabled]: step.disabled },\n { [styles.stepperClickable]: isClickable },\n classNames?.entry,\n );\n\n const markerContent = step.icon ? (\n renderIcon(step.icon, { className: classNames?.icon, style: slotStyles?.icon })\n ) : isDone && !hasError ? (\n <Checkmark />\n ) : (\n index + 1\n );\n\n const marker = (\n <div\n className={cx(\n styles.stepperEntryNumber,\n { [styles.stepperEntryNumberDone]: isDone && !hasError },\n classNames?.entryNumber,\n )}\n style={slotStyles?.entryNumber}\n >\n {markerContent}\n </div>\n );\n\n const optionalNode = step.optional === true ? 'Optional' : step.optional !== false ? step.optional : null;\n\n const labels = !hideLabels && (\n <div className={styles.stepperEntryLabels}>\n <div className={cx(styles.stepperEntryLabel, classNames?.entryLabel)} style={slotStyles?.entryLabel}>\n {step.label}\n </div>\n {step.description != null && (\n <div className={cx(styles.stepperDescription, classNames?.description)} style={slotStyles?.description}>\n {step.description}\n </div>\n )}\n {optionalNode != null && (\n <div className={cx(styles.stepperOptional, classNames?.optional)} style={slotStyles?.optional}>\n {optionalNode}\n </div>\n )}\n </div>\n );\n\n const interactiveProps: React.HTMLAttributes<HTMLDivElement> = isClickable\n ? {\n role: 'button',\n tabIndex: 0,\n onClick: () => onStepClicked?.(index),\n onKeyDown: (e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onStepClicked?.(index);\n }\n },\n }\n : {};\n\n const wrapHeader = (inner: React.ReactNode) => (\n <div\n className={entryClassName}\n style={slotStyles?.entry}\n aria-current={index === currentStep ? 'step' : undefined}\n aria-invalid={hasError \|\| undefined}\n {...interactiveProps}\n >\n {inner}\n </div>\n );\n\n const connector = index < steps.length - 1 && (\n <div\n className={cx(styles.stepperConnector, { [styles.stepperConnectorFilled]: isDone }, classNames?.connector)}\n style={slotStyles?.connector}\n />\n );\n\n if (isVertical) {\n const isFirst = index === 0;\n const isLast = index === steps.length - 1;\n const bodyOpen =\n collapse === StepperCollapse.None\n ? true\n : collapse === StepperCollapse.ActiveOnly\n ? index === currentStep\n : !isDone;\n\n const railSegment = (variant: 'lead' \| 'trail') => {\n const hidden = variant === 'lead' ? isFirst : isLast;\n const filled = variant === 'lead' ? isActive : isDone;\n return (\n <div\n className={cx(styles.stepperRailSegment, {\n [styles.stepperRailFilled]: !hidden && filled,\n [styles.stepperRailHidden]: hidden,\n })}\n />\n );\n };\n\n const markerCell = (\n <div className={styles.stepperMarkerCell}>\n {railSegment('lead')}\n {marker}\n {railSegment('trail')}\n </div>\n );\n\n return (\n <div key={index} className={styles.stepperStep}>\n {wrapHeader(\n <>\n {markerCell}\n {labels}\n </>,\n )}\n {connector}\n {step.content != null && !hideLabels && (\n <StepBody open={bodyOpen} className={classNames?.content} style={slotStyles?.content}>\n {step.content}\n </StepBody>\n )}\n </div>\n );\n }\n\n return (\n <React.Fragment key={index}>\n {wrapHeader(\n <>\n {marker}\n {labels}\n </>,\n )}\n {connector}\n </React.Fragment>\n );\n })}\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"stepper.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport styles from './stepper.module.pcss';\nimport {\n StepperAlignment,\n StepperCollapse,\n StepperLabelPlacement,\n StepperStyleType,\n type StepperProps,\n type StepperStep,\n} from './stepper.types';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst STYLE_CLASS: Record<StepperStyleType, string> = {\n [StepperStyleType.Default]: styles.stepperDefault,\n [StepperStyleType.Outlined]: styles.stepperOutlined,\n [StepperStyleType.Dots]: styles.stepperDots,\n};\n\nconst PLACEMENT_CLASS: Record<StepperLabelPlacement, string> = {\n [StepperLabelPlacement.Top]: styles.stepperLabelTop,\n [StepperLabelPlacement.Bottom]: styles.stepperLabelBottom,\n [StepperLabelPlacement.Left]: styles.stepperLabelLeft,\n [StepperLabelPlacement.Right]: styles.stepperLabelRight,\n};\n\nfunction Checkmark() {\n return (\n <svg\n className={styles.stepperCheckmark}\n strokeLinejoin='round'\n strokeLinecap='round'\n xmlns='http://www.w3.org/2000/svg'\n viewBox='-0.2 -1.2 3.4 2'\n height='20px'\n width='20px'\n >\n <path d='M 0 0 l 1 1 l 2 -2' strokeWidth='0.4' fill='none' />\n </svg>\n );\n}\n\nfunction StepBody({\n open,\n className,\n style,\n children,\n}: {\n open: boolean;\n className?: string;\n style?: React.CSSProperties;\n children: React.ReactNode;\n}) {\n const innerRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<number \| null>(null);\n\n useEffect(() => {\n const el = innerRef.current;\n if (!el) return;\n const observer = new ResizeObserver(() => setHeight(el.offsetHeight));\n observer.observe(el);\n return () => observer.disconnect();\n }, []);\n\n return (\n <div\n className={cx(styles.stepperContent, className)}\n style={{ ...style, height: open ? (height ?? 'auto') : 0 }}\n aria-hidden={!open}\n >\n <div ref={innerRef} className={styles.stepperContentInner}>\n {children}\n </div>\n </div>\n );\n}\n\nfunction resolvePlacement(placement: StepperLabelPlacement \| undefined, isVertical: boolean): StepperLabelPlacement {\n const verticalValues = [StepperLabelPlacement.Left, StepperLabelPlacement.Right];\n if (isVertical) {\n return placement && verticalValues.includes(placement) ? placement : StepperLabelPlacement.Right;\n }\n return placement && !verticalValues.includes(placement) ? placement : StepperLabelPlacement.Bottom;\n}\n\nexport default function Stepper({\n steps = [],\n currentStep = 0,\n alignment = StepperAlignment.Horizontal,\n onStepClicked = null,\n nonLinear = false,\n hideLabels = false,\n styleType = StepperStyleType.Default,\n collapse = StepperCollapse.None,\n labelPlacement,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: StepperProps) {\n const isVertical = alignment === StepperAlignment.Vertical;\n const placement = resolvePlacement(labelPlacement, isVertical);\n\n return (\n <div\n {...rest}\n className={cx(\n styles.stepper,\n STYLE_CLASS[styleType],\n PLACEMENT_CLASS[placement],\n { [styles.stepperVertical]: isVertical },\n classNames?.root,\n className,\n )}\n style={{ ...slotStyles?.root, ...style }}\n >\n {steps.map((step: StepperStep, index: number) => {\n const isDone = index < currentStep;\n const isActive = index <= currentStep;\n const hasError = !!step.error;\n // nonLinear: every enabled step except the current one is clickable.\n // linear: only completed steps are clickable.\n const isClickable = !!onStepClicked && !step.disabled && (nonLinear ? index !== currentStep : isDone);\n\n const entryClassName = cx(\n styles.stepperEntry,\n { [styles.stepperEntryActive]: isActive },\n { [styles.stepperEntryDone]: isDone && !hasError },\n { [styles.stepperEntryError]: hasError },\n { [styles.stepperEntryDisabled]: step.disabled },\n { [styles.stepperClickable]: isClickable },\n classNames?.entry,\n );\n\n const markerContent = step.icon ? (\n renderIcon(step.icon, { className: classNames?.icon, style: slotStyles?.icon })\n ) : isDone && !hasError ? (\n <Checkmark />\n ) : (\n index + 1\n );\n\n const marker = (\n <div\n className={cx(\n styles.stepperEntryNumber,\n { [styles.stepperEntryNumberDone]: isDone && !hasError },\n classNames?.entryNumber,\n )}\n style={slotStyles?.entryNumber}\n >\n {markerContent}\n </div>\n );\n\n const optionalNode = step.optional === true ? 'Optional' : step.optional !== false ? step.optional : null;\n\n const labels = !hideLabels && (\n <div className={styles.stepperEntryLabels}>\n <div className={cx(styles.stepperEntryLabel, classNames?.entryLabel)} style={slotStyles?.entryLabel}>\n {step.label}\n </div>\n {step.description != null && (\n <div className={cx(styles.stepperDescription, classNames?.description)} style={slotStyles?.description}>\n {step.description}\n </div>\n )}\n {optionalNode != null && (\n <div className={cx(styles.stepperOptional, classNames?.optional)} style={slotStyles?.optional}>\n {optionalNode}\n </div>\n )}\n </div>\n );\n\n const interactiveProps: React.HTMLAttributes<HTMLDivElement> = isClickable\n ? {\n role: 'button',\n tabIndex: 0,\n onClick: () => onStepClicked?.(index),\n onKeyDown: (e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onStepClicked?.(index);\n }\n },\n }\n : {};\n\n const wrapHeader = (inner: React.ReactNode) => (\n <div\n className={entryClassName}\n style={slotStyles?.entry}\n aria-current={index === currentStep ? 'step' : undefined}\n aria-invalid={hasError \|\| undefined}\n {...interactiveProps}\n >\n {inner}\n </div>\n );\n\n const connector = index < steps.length - 1 && (\n <div\n className={cx(styles.stepperConnector, { [styles.stepperConnectorFilled]: isDone }, classNames?.connector)}\n style={slotStyles?.connector}\n />\n );\n\n if (isVertical) {\n const isFirst = index === 0;\n const isLast = index === steps.length - 1;\n const bodyOpen =\n collapse === StepperCollapse.None\n ? true\n : collapse === StepperCollapse.ActiveOnly\n ? index === currentStep\n : !isDone;\n\n const railSegment = (variant: 'lead' \| 'trail') => {\n const hidden = variant === 'lead' ? isFirst : isLast;\n const filled = variant === 'lead' ? isActive : isDone;\n return (\n <div\n className={cx(styles.stepperRailSegment, {\n [styles.stepperRailFilled]: !hidden && filled,\n [styles.stepperRailHidden]: hidden,\n })}\n />\n );\n };\n\n const markerCell = (\n <div className={styles.stepperMarkerCell}>\n {railSegment('lead')}\n {marker}\n {railSegment('trail')}\n </div>\n );\n\n return (\n <div key={index} className={styles.stepperStep}>\n {wrapHeader(\n <>\n {markerCell}\n {labels}\n </>,\n )}\n {connector}\n {step.content != null && !hideLabels && (\n <StepBody open={bodyOpen} className={classNames?.content} style={slotStyles?.content}>\n {step.content}\n </StepBody>\n )}\n </div>\n );\n }\n\n return (\n <React.Fragment key={index}>\n {wrapHeader(\n <>\n {marker}\n {labels}\n </>,\n )}\n {connector}\n </React.Fragment>\n );\n })}\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/esm/common/stepper/stepper.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`stepper_kiS2A`,t=`stepper-vertical_2y9rg`,n=`stepper-label-bottom_lDfhy`,r=`stepper-label-top_sBw4-`,i=`stepper-entry_KD4JJ`,a=`stepper-clickable_Nm6fP`,o=`stepper-entry-disabled_T9S5R`,s=`stepper-entry-number_J168Q`,c=`stepper-entry-active_V1aRt`,l=`stepper-entry-done_M3wb5`,u=`stepper-entry-error_xjGSr`,d=`stepper-checkmark_iKCap`,f=`showCheckmark_Rd0oW`,p=`stepper-marker-cell_reOS7`,m=`stepper-rail-segment_U-ZgF`,h=`stepper-rail-filled_wCImi`,g=`stepper-rail-hidden_l17t6`,_=`stepper-entry-labels_nQT8D`,v=`stepper-entry-label_b94eg`,y=`stepper-description_5Q0YP`,b=`stepper-optional_N8mkW`,x=`stepper-connector_J2FwZ`,S=`stepper-connector-filled_W8UZS`,C=`stepper-step_nUfsV`,w=`stepper-content_yjlFH`,T=`stepper-label-left_yGbjC`,E=`stepper-content-inner_0w2wP`,D=`stepper-outlined_V7UjP`,O=`stepper-dots_s4cgN`,k={stepper:e,"stepper-vertical":`stepper-vertical_2y9rg`,stepperVertical:t,"stepper-label-bottom":`stepper-label-bottom_lDfhy`,stepperLabelBottom:n,"stepper-label-top":`stepper-label-top_sBw4-`,stepperLabelTop:r,"stepper-entry":`stepper-entry_KD4JJ`,stepperEntry:i,"stepper-clickable":`stepper-clickable_Nm6fP`,stepperClickable:a,"stepper-entry-disabled":`stepper-entry-disabled_T9S5R`,stepperEntryDisabled:o,"stepper-entry-number":`stepper-entry-number_J168Q`,stepperEntryNumber:s,"stepper-entry-active":`stepper-entry-active_V1aRt`,stepperEntryActive:c,"stepper-entry-done":`stepper-entry-done_M3wb5`,stepperEntryDone:l,"stepper-entry-error":`stepper-entry-error_xjGSr`,stepperEntryError:u,"stepper-checkmark":`stepper-checkmark_iKCap`,stepperCheckmark:d,showCheckmark:f,"stepper-marker-cell":`stepper-marker-cell_reOS7`,stepperMarkerCell:p,"stepper-rail-segment":`stepper-rail-segment_U-ZgF`,stepperRailSegment:m,"stepper-rail-filled":`stepper-rail-filled_wCImi`,stepperRailFilled:h,"stepper-rail-hidden":`stepper-rail-hidden_l17t6`,stepperRailHidden:g,"stepper-entry-labels":`stepper-entry-labels_nQT8D`,stepperEntryLabels:_,"stepper-entry-label":`stepper-entry-label_b94eg`,stepperEntryLabel:v,"stepper-description":`stepper-description_5Q0YP`,stepperDescription:y,"stepper-optional":`stepper-optional_N8mkW`,stepperOptional:b,"stepper-connector":`stepper-connector_J2FwZ`,stepperConnector:x,"stepper-connector-filled":`stepper-connector-filled_W8UZS`,stepperConnectorFilled:S,"stepper-step":`stepper-step_nUfsV`,stepperStep:C,"stepper-content":`stepper-content_yjlFH`,stepperContent:w,"stepper-label-left":`stepper-label-left_yGbjC`,stepperLabelLeft:T,"stepper-content-inner":`stepper-content-inner_0w2wP`,stepperContentInner:E,"stepper-outlined":`stepper-outlined_V7UjP`,stepperOutlined:D,"stepper-dots":`stepper-dots_s4cgN`,stepperDots:O};export{k as default,f as showCheckmark,e as stepper,d as stepperCheckmark,a as stepperClickable,x as stepperConnector,S as stepperConnectorFilled,w as stepperContent,E as stepperContentInner,y as stepperDescription,O as stepperDots,i as stepperEntry,c as stepperEntryActive,o as stepperEntryDisabled,l as stepperEntryDone,u as stepperEntryError,v as stepperEntryLabel,_ as stepperEntryLabels,s as stepperEntryNumber,n as stepperLabelBottom,T as stepperLabelLeft,r as stepperLabelTop,p as stepperMarkerCell,b as stepperOptional,D as stepperOutlined,h as stepperRailFilled,g as stepperRailHidden,m as stepperRailSegment,C as stepperStep,t as stepperVertical};
+"use client";var e=`stepper_kiS2A`,t=`stepper-vertical_2y9rg`,n=`stepper-label-bottom_lDfhy`,r=`stepper-label-top_sBw4-`,i=`stepper-entry_KD4JJ`,a=`stepper-clickable_Nm6fP`,o=`stepper-entry-disabled_T9S5R`,s=`stepper-entry-number_J168Q`,c=`stepper-entry-active_V1aRt`,l=`stepper-entry-done_M3wb5`,u=`stepper-entry-error_xjGSr`,d=`stepper-checkmark_iKCap`,f=`showCheckmark_Rd0oW`,p=`stepper-marker-cell_reOS7`,m=`stepper-rail-segment_U-ZgF`,h=`stepper-rail-filled_wCImi`,g=`stepper-rail-hidden_l17t6`,_=`stepper-entry-labels_nQT8D`,v=`stepper-entry-label_b94eg`,y=`stepper-description_5Q0YP`,b=`stepper-optional_N8mkW`,x=`stepper-connector_J2FwZ`,S=`stepper-connector-filled_W8UZS`,C=`stepper-step_nUfsV`,w=`stepper-content_yjlFH`,T=`stepper-label-left_yGbjC`,E=`stepper-content-inner_0w2wP`,D=`stepper-outlined_V7UjP`,O=`stepper-dots_s4cgN`,k={stepper:e,"stepper-vertical":`stepper-vertical_2y9rg`,stepperVertical:t,"stepper-label-bottom":`stepper-label-bottom_lDfhy`,stepperLabelBottom:n,"stepper-label-top":`stepper-label-top_sBw4-`,stepperLabelTop:r,"stepper-entry":`stepper-entry_KD4JJ`,stepperEntry:i,"stepper-clickable":`stepper-clickable_Nm6fP`,stepperClickable:a,"stepper-entry-disabled":`stepper-entry-disabled_T9S5R`,stepperEntryDisabled:o,"stepper-entry-number":`stepper-entry-number_J168Q`,stepperEntryNumber:s,"stepper-entry-active":`stepper-entry-active_V1aRt`,stepperEntryActive:c,"stepper-entry-done":`stepper-entry-done_M3wb5`,stepperEntryDone:l,"stepper-entry-error":`stepper-entry-error_xjGSr`,stepperEntryError:u,"stepper-checkmark":`stepper-checkmark_iKCap`,stepperCheckmark:d,showCheckmark:f,"stepper-marker-cell":`stepper-marker-cell_reOS7`,stepperMarkerCell:p,"stepper-rail-segment":`stepper-rail-segment_U-ZgF`,stepperRailSegment:m,"stepper-rail-filled":`stepper-rail-filled_wCImi`,stepperRailFilled:h,"stepper-rail-hidden":`stepper-rail-hidden_l17t6`,stepperRailHidden:g,"stepper-entry-labels":`stepper-entry-labels_nQT8D`,stepperEntryLabels:_,"stepper-entry-label":`stepper-entry-label_b94eg`,stepperEntryLabel:v,"stepper-description":`stepper-description_5Q0YP`,stepperDescription:y,"stepper-optional":`stepper-optional_N8mkW`,stepperOptional:b,"stepper-connector":`stepper-connector_J2FwZ`,stepperConnector:x,"stepper-connector-filled":`stepper-connector-filled_W8UZS`,stepperConnectorFilled:S,"stepper-step":`stepper-step_nUfsV`,stepperStep:C,"stepper-content":`stepper-content_yjlFH`,stepperContent:w,"stepper-label-left":`stepper-label-left_yGbjC`,stepperLabelLeft:T,"stepper-content-inner":`stepper-content-inner_0w2wP`,stepperContentInner:E,"stepper-outlined":`stepper-outlined_V7UjP`,stepperOutlined:D,"stepper-dots":`stepper-dots_s4cgN`,stepperDots:O};export{k as default,f as showCheckmark,e as stepper,d as stepperCheckmark,a as stepperClickable,x as stepperConnector,S as stepperConnectorFilled,w as stepperContent,E as stepperContentInner,y as stepperDescription,O as stepperDots,i as stepperEntry,c as stepperEntryActive,o as stepperEntryDisabled,l as stepperEntryDone,u as stepperEntryError,v as stepperEntryLabel,_ as stepperEntryLabels,s as stepperEntryNumber,n as stepperLabelBottom,T as stepperLabelLeft,r as stepperLabelTop,p as stepperMarkerCell,b as stepperOptional,D as stepperOutlined,h as stepperRailFilled,g as stepperRailHidden,m as stepperRailSegment,C as stepperStep,t as stepperVertical};
 //# sourceMappingURL=stepper.module.mjs.map

package/dist/esm/common/stepper/stepper.types.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=function(e){return e.Horizontal=`horizontal`,e.Vertical=`vertical`,e}({}),t=function(e){return e.Default=`default`,e.Outlined=`outlined`,e.Dots=`dots`,e}({}),n=function(e){return e.None=`none`,e.ActiveOnly=`activeOnly`,e.Completed=`completed`,e}({}),r=function(e){return e.Top=`top`,e.Bottom=`bottom`,e.Left=`left`,e.Right=`right`,e}({});export{e as StepperAlignment,n as StepperCollapse,r as StepperLabelPlacement,t as StepperStyleType};
+"use client";var e=function(e){return e.Horizontal=`horizontal`,e.Vertical=`vertical`,e}({}),t=function(e){return e.Default=`default`,e.Outlined=`outlined`,e.Dots=`dots`,e}({}),n=function(e){return e.None=`none`,e.ActiveOnly=`activeOnly`,e.Completed=`completed`,e}({}),r=function(e){return e.Top=`top`,e.Bottom=`bottom`,e.Left=`left`,e.Right=`right`,e}({});export{e as StepperAlignment,n as StepperCollapse,r as StepperLabelPlacement,t as StepperStyleType};
 //# sourceMappingURL=stepper.types.mjs.map

package/dist/esm/common/stepper/stepper.types.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper.types.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { IconContent } from '../types/icon.types';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\n/** Layout direction of the stepper. /\nexport enum StepperAlignment {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\n/* Visual preset for the step markers and connectors. /\nexport enum StepperStyleType {\n /* Numbered markers, filled solid on completion (the default look). /\n Default = 'default',\n /* Numbered markers that stay ringed when completed (a coloured check, no solid fill). /\n Outlined = 'outlined',\n /* Minimal dots without numbers, for a compact onboarding or carousel style. /\n Dots = 'dots',\n}\n\n/\n Which step bodies (`step.content`) are expanded. Only affects vertical\n * steppers with per-step `content`; ignored otherwise.\n /\nexport enum StepperCollapse {\n /* Every step body stays expanded. /\n None = 'none',\n /* Only the current step's body is expanded (classic vertical wizard). /\n ActiveOnly = 'activeOnly',\n /* Completed (past) step bodies collapse; current and upcoming stay expanded. /\n Completed = 'completed',\n}\n\n/\n Where the label block sits relative to the marker. Horizontal steppers use\n * `Top`/`Bottom`; vertical steppers use `Left`/`Right`. An out-of-orientation\n * value falls back to that orientation's default.\n /\nexport enum StepperLabelPlacement {\n Top = 'top',\n Bottom = 'bottom',\n Left = 'left',\n Right = 'right',\n}\n\nexport type StepperSlots =\n \| 'root'\n \| 'entry'\n \| 'entryNumber'\n \| 'entryLabel'\n \| 'connector'\n \| 'description'\n \| 'content'\n \| 'optional'\n \| 'icon';\n\nexport interface StepperStep {\n /* Primary label for the step. /\n label: React.ReactNode;\n /* Secondary line shown under the label. /\n description?: React.ReactNode;\n /* Collapsible body content, rendered under the label (vertical only). /\n content?: React.ReactNode;\n /* Icon shown in the marker instead of the step number — a FontAwesome icon or any node. /\n icon?: IconContent;\n /* Marks the step as errored, recolouring the marker with `--stepper-error-color`. /\n error?: boolean;\n /* `true` renders an \"Optional\" hint; a node renders custom hint text. /\n optional?: boolean \| React.ReactNode;\n /* Disables this step: never clickable, dimmed. /\n disabled?: boolean;\n}\n\nexport interface StepperProps extends HtmlProps {\n steps?: StepperStep[];\n currentStep?: number;\n alignment?: StepperAlignment \| 'horizontal' \| 'vertical';\n onStepClicked?: ((index: number) => void) \| null;\n /* Allow clicking any step, not just completed ones. /\n nonLinear?: boolean;\n /* Hide the label text (and description) beneath each step entry. /\n hideLabels?: boolean;\n /* Visual preset for markers and connectors (default `Default`). /\n styleType?: StepperStyleType;\n /* Which step bodies are expanded. Vertical `content` only (default `None`). /\n collapse?: StepperCollapse;\n /* Label position relative to the marker (default: horizontal `Bottom`, vertical `Right`). */\n labelPlacement?: StepperLabelPlacement;\n className?: string;\n style?: React.CSSProperties;\n classNames?: SlotClassNames<StepperSlots>;\n styles?: SlotStyles<StepperSlots>;\n}\n"],"mappings":"~~AAKA~~,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,WAAA,aACA,EAAA,SAAA,YACF,EAAA,CAAA,CAAA,EAGY,EAAL,SAAA,EAAA,OAEL,GAAA,QAAA,UAEA,EAAA,SAAA,WAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA,EAMY,EAAL,SAAA,EAAA,OAEL,GAAA,KAAA,OAEA,EAAA,WAAA,aAEA,EAAA,UAAA,aACF,EAAA,CAAA,CAAA,EAOY,EAAL,SAAA,EAAA,OACL,GAAA,IAAA,MACA,EAAA,OAAA,SACA,EAAA,KAAA,OACA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"stepper.types.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { IconContent } from '../types/icon.types';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\n/** Layout direction of the stepper. /\nexport enum StepperAlignment {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\n/* Visual preset for the step markers and connectors. /\nexport enum StepperStyleType {\n /* Numbered markers, filled solid on completion (the default look). /\n Default = 'default',\n /* Numbered markers that stay ringed when completed (a coloured check, no solid fill). /\n Outlined = 'outlined',\n /* Minimal dots without numbers, for a compact onboarding or carousel style. /\n Dots = 'dots',\n}\n\n/\n Which step bodies (`step.content`) are expanded. Only affects vertical\n * steppers with per-step `content`; ignored otherwise.\n /\nexport enum StepperCollapse {\n /* Every step body stays expanded. /\n None = 'none',\n /* Only the current step's body is expanded (classic vertical wizard). /\n ActiveOnly = 'activeOnly',\n /* Completed (past) step bodies collapse; current and upcoming stay expanded. /\n Completed = 'completed',\n}\n\n/\n Where the label block sits relative to the marker. Horizontal steppers use\n * `Top`/`Bottom`; vertical steppers use `Left`/`Right`. An out-of-orientation\n * value falls back to that orientation's default.\n /\nexport enum StepperLabelPlacement {\n Top = 'top',\n Bottom = 'bottom',\n Left = 'left',\n Right = 'right',\n}\n\nexport type StepperSlots =\n \| 'root'\n \| 'entry'\n \| 'entryNumber'\n \| 'entryLabel'\n \| 'connector'\n \| 'description'\n \| 'content'\n \| 'optional'\n \| 'icon';\n\nexport interface StepperStep {\n /* Primary label for the step. /\n label: React.ReactNode;\n /* Secondary line shown under the label. /\n description?: React.ReactNode;\n /* Collapsible body content, rendered under the label (vertical only). /\n content?: React.ReactNode;\n /* Icon shown in the marker instead of the step number — a FontAwesome icon or any node. /\n icon?: IconContent;\n /* Marks the step as errored, recolouring the marker with `--stepper-error-color`. /\n error?: boolean;\n /* `true` renders an \"Optional\" hint; a node renders custom hint text. /\n optional?: boolean \| React.ReactNode;\n /* Disables this step: never clickable, dimmed. /\n disabled?: boolean;\n}\n\nexport interface StepperProps extends HtmlProps {\n steps?: StepperStep[];\n currentStep?: number;\n alignment?: StepperAlignment \| 'horizontal' \| 'vertical';\n onStepClicked?: ((index: number) => void) \| null;\n /* Allow clicking any step, not just completed ones. /\n nonLinear?: boolean;\n /* Hide the label text (and description) beneath each step entry. /\n hideLabels?: boolean;\n /* Visual preset for markers and connectors (default `Default`). /\n styleType?: StepperStyleType;\n /* Which step bodies are expanded. Vertical `content` only (default `None`). /\n collapse?: StepperCollapse;\n /* Label position relative to the marker (default: horizontal `Bottom`, vertical `Right`). */\n labelPlacement?: StepperLabelPlacement;\n className?: string;\n style?: React.CSSProperties;\n classNames?: SlotClassNames<StepperSlots>;\n styles?: SlotStyles<StepperSlots>;\n}\n"],"mappings":"aAKA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,WAAA,aACA,EAAA,SAAA,YACF,EAAA,CAAA,CAAA,EAGY,EAAL,SAAA,EAAA,OAEL,GAAA,QAAA,UAEA,EAAA,SAAA,WAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA,EAMY,EAAL,SAAA,EAAA,OAEL,GAAA,KAAA,OAEA,EAAA,WAAA,aAEA,EAAA,UAAA,aACF,EAAA,CAAA,CAAA,EAOY,EAAL,SAAA,EAAA,OACL,GAAA,IAAA,MACA,EAAA,OAAA,SACA,EAAA,KAAA,OACA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/sticky/sticky.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{stickyStack as e}from"./stickyStack.mjs";import t from"./sticky.module.mjs";import{useCallback as n,useEffect as r,useLayoutEffect as i,useRef as a,useState as o}from"react";import s from"classnames";import{jsx as c,jsxs as l}from"react/jsx-runtime";function u(e){let t=e?.parentElement??null;for(;t&&t!==document.body;){let{overflowY:e}=getComputedStyle(t);if(e===`auto`||e===`scroll`||e===`overlay`)return t;t=t.parentElement}return null}function d({children:d,offsetTop:f=0,offsetElement:p,stickToScrollParent:m=!1,zIndex:h=20,disabled:g=!1,onStuckChange:_,className:v,style:y,classNames:b,styles:x,...S}){let C=a(null),w=a(null),T=a(null),E=a(null),[D,O]=o({width:0,left:0,height:0}),[k,A]=o(null),[j,M]=o(0),N=p?.current?k??p.current.offsetHeight:f,[P,F]=o({isStuck:!1,top:N}),I=a(_);r(()=>{I.current=_},[_]);let L=n(()=>{let t=C.current,n=w.current;if(!t||!n)return;let r=t.getBoundingClientRect();O({width:t.clientWidth,left:r.left,height:n.offsetHeight}),e.schedule()},[]);r(()=>{let e=p?.current;if(!e)return;let t=()=>A(e.offsetHeight);t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[p]),i(()=>{E.current=m?u(C.current):null},[m]),i(()=>{let t=e.register({node:C.current,offsetTop:N,disabled:g,getMetrics:()=>{let e=C.current,t=w.current;if(!e||!t)return null;let n=e.getBoundingClientRect(),r=E.current?.getBoundingClientRect(),i=r?.top??0;return M(e=>e===i?e:i),{top:r?n.top-r.top:n.top,left:r?n.left-r.left:n.left,width:e.clientWidth,contentHeight:t.offsetHeight,container:E.current}}},F);return T.current=t,()=>{e.unregister(t),T.current=null}},[]),r(()=>{T.current&&e.updateEntry(T.current,{offsetTop:N,disabled:g}),e.schedule()},[N,g]),i(()=>{L()},[L,d]),r(()=>{let e=new ResizeObserver(L);return C.current&&e.observe(C.current),w.current&&e.observe(w.current),E.current&&e.observe(E.current),()=>e.disconnect()},[L,m]);let R=a(!0);r(()=>{if(R.current){R.current=!1;return}I.current?.(P.isStuck)},[P.isStuck]);let z=P.isStuck?{position:`fixed`,top:j+P.top,left:D.left,width:D.width,zIndex:h,...x?.content}:x?.content;return l(`div`,{ref:C,className:s(t.sticky,v,b?.root),style:{...x?.root,...y},...S,children:[P.isStuck&&c(`div`,{"aria-hidden":!0,className:s(t.stickyPlaceholder,b?.placeholder),style:{height:D.height,...x?.placeholder}}),c(`div`,{ref:w,className:s(t.stickyContent,P.isStuck&&t.stickyContentStuck,b?.content),style:z,children:d})]})}export{d as default};
+"use client";import{stickyStack as e}from"./stickyStack.mjs";import t from"./sticky.module.mjs";import{useCallback as n,useEffect as r,useLayoutEffect as i,useRef as a,useState as o}from"react";import s from"classnames";import{jsx as c,jsxs as l}from"react/jsx-runtime";function u(e){let t=e?.parentElement??null;for(;t&&t!==document.body;){let{overflowY:e}=getComputedStyle(t);if(e===`auto`||e===`scroll`||e===`overlay`)return t;t=t.parentElement}return null}function d({children:d,offsetTop:f=0,offsetElement:p,stickToScrollParent:m=!1,zIndex:h=20,disabled:g=!1,onStuckChange:_,className:v,style:y,classNames:b,styles:x,...S}){let C=a(null),w=a(null),T=a(null),E=a(null),[D,O]=o({width:0,left:0,height:0}),[k,A]=o(null),[j,M]=o(0),N=p?.current?k??p.current.offsetHeight:f,[P,F]=o({isStuck:!1,top:N}),I=a(_);r(()=>{I.current=_},[_]);let L=n(()=>{let t=C.current,n=w.current;if(!t||!n)return;let r=t.getBoundingClientRect();O({width:t.clientWidth,left:r.left,height:n.offsetHeight}),e.schedule()},[]);r(()=>{let e=p?.current;if(!e)return;let t=()=>A(e.offsetHeight);t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[p]),i(()=>{E.current=m?u(C.current):null},[m]),i(()=>{let t=e.register({node:C.current,offsetTop:N,disabled:g,getMetrics:()=>{let e=C.current,t=w.current;if(!e||!t)return null;let n=e.getBoundingClientRect(),r=E.current?.getBoundingClientRect(),i=r?.top??0;return M(e=>e===i?e:i),{top:r?n.top-r.top:n.top,left:r?n.left-r.left:n.left,width:e.clientWidth,contentHeight:t.offsetHeight,container:E.current}}},F);return T.current=t,()=>{e.unregister(t),T.current=null}},[]),r(()=>{T.current&&e.updateEntry(T.current,{offsetTop:N,disabled:g}),e.schedule()},[N,g]),i(()=>{L()},[L,d]),r(()=>{let e=new ResizeObserver(L);return C.current&&e.observe(C.current),w.current&&e.observe(w.current),E.current&&e.observe(E.current),()=>e.disconnect()},[L,m]);let R=a(!0);r(()=>{if(R.current){R.current=!1;return}I.current?.(P.isStuck)},[P.isStuck]);let z=P.isStuck?{position:`fixed`,top:j+P.top,left:D.left,width:D.width,zIndex:h,...x?.content}:x?.content;return l(`div`,{ref:C,className:s(t.sticky,v,b?.root),style:{...x?.root,...y},...S,children:[P.isStuck&&c(`div`,{"aria-hidden":!0,className:s(t.stickyPlaceholder,b?.placeholder),style:{height:D.height,...x?.placeholder}}),c(`div`,{ref:w,className:s(t.stickyContent,P.isStuck&&t.stickyContentStuck,b?.content),style:z,children:d})]})}export{d as default};
 //# sourceMappingURL=sticky.mjs.map

package/dist/esm/common/sticky/sticky.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sticky.mjs","names":[],"sources":["../../../../package/common/sticky/sticky.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport type { StickyProps } from './sticky.types';\nimport { stickyStack } from './stickyStack';\nimport type { StickyStackResult } from './stickyStack';\n\nimport styles from './sticky.module.pcss';\n\ninterface Metrics {\n width: number;\n left: number;\n height: number;\n}\n\n// Nearest ancestor whose own scrollbar would carry the sticky's scroll — used so\n// `stickToScrollParent` can pin relative to that container's box instead of the viewport.\nfunction getScrollParent(el: HTMLElement \| null): HTMLElement \| null {\n let node = el?.parentElement ?? null;\n while (node && node !== document.body) {\n const { overflowY } = getComputedStyle(node);\n if (overflowY === 'auto' \|\| overflowY === 'scroll' \|\| overflowY === 'overlay') return node;\n node = node.parentElement;\n }\n return null;\n}\n\nexport default function Sticky({\n children,\n offsetTop = 0,\n offsetElement,\n stickToScrollParent = false,\n zIndex = 20,\n disabled = false,\n onStuckChange,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: StickyProps) {\n const rootRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const stackIdRef = useRef<symbol \| null>(null);\n const scrollParentRef = useRef<HTMLElement \| null>(null);\n const [metrics, setMetrics] = useState<Metrics>({ width: 0, left: 0, height: 0 });\n const [measuredOffset, setMeasuredOffset] = useState<number \| null>(null);\n const [scrollParentTop, setScrollParentTop] = useState(0);\n const effectiveOffsetTop = offsetElement?.current\n ? (measuredOffset ?? offsetElement.current.offsetHeight)\n : offsetTop;\n const [stackResult, setStackResult] = useState<StickyStackResult>({ isStuck: false, top: effectiveOffsetTop });\n\n const onStuckChangeRef = useRef(onStuckChange);\n useEffect(() => {\n onStuckChangeRef.current = onStuckChange;\n }, [onStuckChange]);\n\n // Local geometry (width/left/height) doesn't depend on other Stickies — only the\n // effective `top` and `isStuck` (from the stack coordinator) do.\n const measure = useCallback(() => {\n const root = rootRef.current;\n const content = contentRef.current;\n if (!root \|\| !content) return;\n const rootRect = root.getBoundingClientRect();\n setMetrics({ width: root.clientWidth, left: rootRect.left, height: content.offsetHeight });\n stickyStack.schedule();\n }, []);\n\n useEffect(() => {\n const el = offsetElement?.current;\n if (!el) return;\n const updateFromElement = () => setMeasuredOffset(el.offsetHeight);\n updateFromElement();\n const ro = new ResizeObserver(updateFromElement);\n ro.observe(el);\n return () => ro.disconnect();\n }, [offsetElement]);\n\n useLayoutEffect(() => {\n scrollParentRef.current = stickToScrollParent ? getScrollParent(rootRef.current) : null;\n }, [stickToScrollParent]);\n\n useLayoutEffect(() => {\n const id = stickyStack.register(\n {\n node: rootRef.current as HTMLElement,\n offsetTop: effectiveOffsetTop,\n disabled,\n getMetrics: () => {\n const root = rootRef.current;\n const content = contentRef.current;\n if (!root \|\| !content) return null;\n const rect = root.getBoundingClientRect();\n const parentRect = scrollParentRef.current?.getBoundingClientRect();\n const newParentTop = parentRect?.top ?? 0;\n setScrollParentTop((prev) => (prev === newParentTop ? prev : newParentTop));\n // Report top/left relative to the scroll parent's box so the stack's stuck/stacking\n // math stays in the same coordinate space regardless of what it's pinned relative to.\n const top = parentRect ? rect.top - parentRect.top : rect.top;\n const left = parentRect ? rect.left - parentRect.left : rect.left;\n return {\n top,\n left,\n width: root.clientWidth,\n contentHeight: content.offsetHeight,\n container: scrollParentRef.current,\n };\n },\n },\n setStackResult,\n );\n stackIdRef.current = id;\n return () => {\n stickyStack.unregister(id);\n stackIdRef.current = null;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n if (stackIdRef.current) {\n stickyStack.updateEntry(stackIdRef.current, { offsetTop: effectiveOffsetTop, disabled });\n }\n stickyStack.schedule();\n }, [effectiveOffsetTop, disabled]);\n\n useLayoutEffect(() => {\n measure();\n }, [measure, children]);\n\n useEffect(() => {\n const ro = new ResizeObserver(measure);\n if (rootRef.current) ro.observe(rootRef.current);\n if (contentRef.current) ro.observe(contentRef.current);\n if (scrollParentRef.current) ro.observe(scrollParentRef.current);\n return () => ro.disconnect();\n }, [measure, stickToScrollParent]);\n\n const firstRun = useRef(true);\n useEffect(() => {\n if (firstRun.current) {\n firstRun.current = false;\n return;\n }\n onStuckChangeRef.current?.(stackResult.isStuck);\n }, [stackResult.isStuck]);\n\n // stackResult.top is relative to the scroll parent's box (or the viewport if there isn't\n // one) — convert back to a viewport-absolute value for the fixed `top`.\n const contentStyle: React.CSSProperties \| undefined = stackResult.isStuck\n ? {\n position: 'fixed',\n top: scrollParentTop + stackResult.top,\n left: metrics.left,\n width: metrics.width,\n zIndex,\n ...slotStyles?.content,\n }\n : slotStyles?.content;\n\n return (\n <div\n ref={rootRef}\n className={cx(styles.sticky, className, classNames?.root)}\n style={{ ...slotStyles?.root, ...style }}\n {...rest}\n >\n {stackResult.isStuck && (\n <div\n aria-hidden\n className={cx(styles.stickyPlaceholder, classNames?.placeholder)}\n style={{ height: metrics.height, ...slotStyles?.placeholder }}\n />\n )}\n <div\n ref={contentRef}\n className={cx(styles.stickyContent, stackResult.isStuck && styles.stickyContentStuck, classNames?.content)}\n style={contentStyle}\n >\n {children}\n </div>\n </div>\n );\n}\n"],"mappings":"~~iQAgBA~~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"}
1	+ {"version":3,"file":"sticky.mjs","names":[],"sources":["../../../../package/common/sticky/sticky.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport type { StickyProps } from './sticky.types';\nimport { stickyStack } from './stickyStack';\nimport type { StickyStackResult } from './stickyStack';\n\nimport styles from './sticky.module.pcss';\n\ninterface Metrics {\n width: number;\n left: number;\n height: number;\n}\n\n// Nearest ancestor whose own scrollbar would carry the sticky's scroll — used so\n// `stickToScrollParent` can pin relative to that container's box instead of the viewport.\nfunction getScrollParent(el: HTMLElement \| null): HTMLElement \| null {\n let node = el?.parentElement ?? null;\n while (node && node !== document.body) {\n const { overflowY } = getComputedStyle(node);\n if (overflowY === 'auto' \|\| overflowY === 'scroll' \|\| overflowY === 'overlay') return node;\n node = node.parentElement;\n }\n return null;\n}\n\nexport default function Sticky({\n children,\n offsetTop = 0,\n offsetElement,\n stickToScrollParent = false,\n zIndex = 20,\n disabled = false,\n onStuckChange,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: StickyProps) {\n const rootRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const stackIdRef = useRef<symbol \| null>(null);\n const scrollParentRef = useRef<HTMLElement \| null>(null);\n const [metrics, setMetrics] = useState<Metrics>({ width: 0, left: 0, height: 0 });\n const [measuredOffset, setMeasuredOffset] = useState<number \| null>(null);\n const [scrollParentTop, setScrollParentTop] = useState(0);\n const effectiveOffsetTop = offsetElement?.current\n ? (measuredOffset ?? offsetElement.current.offsetHeight)\n : offsetTop;\n const [stackResult, setStackResult] = useState<StickyStackResult>({ isStuck: false, top: effectiveOffsetTop });\n\n const onStuckChangeRef = useRef(onStuckChange);\n useEffect(() => {\n onStuckChangeRef.current = onStuckChange;\n }, [onStuckChange]);\n\n // Local geometry (width/left/height) doesn't depend on other Stickies — only the\n // effective `top` and `isStuck` (from the stack coordinator) do.\n const measure = useCallback(() => {\n const root = rootRef.current;\n const content = contentRef.current;\n if (!root \|\| !content) return;\n const rootRect = root.getBoundingClientRect();\n setMetrics({ width: root.clientWidth, left: rootRect.left, height: content.offsetHeight });\n stickyStack.schedule();\n }, []);\n\n useEffect(() => {\n const el = offsetElement?.current;\n if (!el) return;\n const updateFromElement = () => setMeasuredOffset(el.offsetHeight);\n updateFromElement();\n const ro = new ResizeObserver(updateFromElement);\n ro.observe(el);\n return () => ro.disconnect();\n }, [offsetElement]);\n\n useLayoutEffect(() => {\n scrollParentRef.current = stickToScrollParent ? getScrollParent(rootRef.current) : null;\n }, [stickToScrollParent]);\n\n useLayoutEffect(() => {\n const id = stickyStack.register(\n {\n node: rootRef.current as HTMLElement,\n offsetTop: effectiveOffsetTop,\n disabled,\n getMetrics: () => {\n const root = rootRef.current;\n const content = contentRef.current;\n if (!root \|\| !content) return null;\n const rect = root.getBoundingClientRect();\n const parentRect = scrollParentRef.current?.getBoundingClientRect();\n const newParentTop = parentRect?.top ?? 0;\n setScrollParentTop((prev) => (prev === newParentTop ? prev : newParentTop));\n // Report top/left relative to the scroll parent's box so the stack's stuck/stacking\n // math stays in the same coordinate space regardless of what it's pinned relative to.\n const top = parentRect ? rect.top - parentRect.top : rect.top;\n const left = parentRect ? rect.left - parentRect.left : rect.left;\n return {\n top,\n left,\n width: root.clientWidth,\n contentHeight: content.offsetHeight,\n container: scrollParentRef.current,\n };\n },\n },\n setStackResult,\n );\n stackIdRef.current = id;\n return () => {\n stickyStack.unregister(id);\n stackIdRef.current = null;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n if (stackIdRef.current) {\n stickyStack.updateEntry(stackIdRef.current, { offsetTop: effectiveOffsetTop, disabled });\n }\n stickyStack.schedule();\n }, [effectiveOffsetTop, disabled]);\n\n useLayoutEffect(() => {\n measure();\n }, [measure, children]);\n\n useEffect(() => {\n const ro = new ResizeObserver(measure);\n if (rootRef.current) ro.observe(rootRef.current);\n if (contentRef.current) ro.observe(contentRef.current);\n if (scrollParentRef.current) ro.observe(scrollParentRef.current);\n return () => ro.disconnect();\n }, [measure, stickToScrollParent]);\n\n const firstRun = useRef(true);\n useEffect(() => {\n if (firstRun.current) {\n firstRun.current = false;\n return;\n }\n onStuckChangeRef.current?.(stackResult.isStuck);\n }, [stackResult.isStuck]);\n\n // stackResult.top is relative to the scroll parent's box (or the viewport if there isn't\n // one) — convert back to a viewport-absolute value for the fixed `top`.\n const contentStyle: React.CSSProperties \| undefined = stackResult.isStuck\n ? {\n position: 'fixed',\n top: scrollParentTop + stackResult.top,\n left: metrics.left,\n width: metrics.width,\n zIndex,\n ...slotStyles?.content,\n }\n : slotStyles?.content;\n\n return (\n <div\n ref={rootRef}\n className={cx(styles.sticky, className, classNames?.root)}\n style={{ ...slotStyles?.root, ...style }}\n {...rest}\n >\n {stackResult.isStuck && (\n <div\n aria-hidden\n className={cx(styles.stickyPlaceholder, classNames?.placeholder)}\n style={{ height: metrics.height, ...slotStyles?.placeholder }}\n />\n )}\n <div\n ref={contentRef}\n className={cx(styles.stickyContent, stackResult.isStuck && styles.stickyContentStuck, classNames?.content)}\n style={contentStyle}\n >\n {children}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/esm/common/sticky/sticky.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`sticky_L6zO2`,t=`sticky-content_ZaXTD`,n=`sticky-content-stuck_w-gRW`,r=`sticky-placeholder_aJ3Sb`,i={sticky:e,"sticky-content":`sticky-content_ZaXTD`,stickyContent:t,"sticky-content-stuck":`sticky-content-stuck_w-gRW`,stickyContentStuck:n,"sticky-placeholder":`sticky-placeholder_aJ3Sb`,stickyPlaceholder:r};export{i as default,e as sticky,t as stickyContent,n as stickyContentStuck,r as stickyPlaceholder};
+"use client";var e=`sticky_L6zO2`,t=`sticky-content_ZaXTD`,n=`sticky-content-stuck_w-gRW`,r=`sticky-placeholder_aJ3Sb`,i={sticky:e,"sticky-content":`sticky-content_ZaXTD`,stickyContent:t,"sticky-content-stuck":`sticky-content-stuck_w-gRW`,stickyContentStuck:n,"sticky-placeholder":`sticky-placeholder_aJ3Sb`,stickyPlaceholder:r};export{i as default,e as sticky,t as stickyContent,n as stickyContentStuck,r as stickyPlaceholder};
 //# sourceMappingURL=sticky.module.mjs.map

package/dist/esm/common/sticky/stickyStack.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-function e(e,t,n,r){return e<r&&n<t}function t(e,t){if(e===t)return 0;let n=e.compareDocumentPosition(t);return n&Node.DOCUMENT_POSITION_FOLLOWING?-1:n&Node.DOCUMENT_POSITION_PRECEDING?1:0}var n=new class{constructor(){this.entries=new Map,this.listeners=new Map,this.results=new Map,this.rafId=0,this.listenerCount=0,this.schedule=()=>{cancelAnimationFrame(this.rafId),this.rafId=requestAnimationFrame(this.recompute)},this.recompute=()=>{let n=[...this.entries.entries()].sort(([,e],[,n])=>t(e.node,n.node)),r=new Map;for(let[t,i]of n){let n=i.getMetrics();if(!n)continue;let a=r.get(n.container);a||(a=[],r.set(n.container,a));let o=a.filter(t=>e(t.left,t.right,n.left,n.left+n.width)).reduce((e,t)=>Math.max(e,t.bottom),i.offsetTop),s=!i.disabled&&n.top<=o,c={isStuck:s,top:s?o:i.offsetTop};s&&a.push({left:n.left,right:n.left+n.width,bottom:o+n.contentHeight});let l=this.results.get(t);(!l||l.isStuck!==c.isStuck||l.top!==c.top)&&(this.results.set(t,c),this.listeners.get(t)?.(c))}}}register(e,t){let n=Symbol(`sticky`);return this.entries.set(n,e),this.listeners.set(n,t),this.startListening(),n}updateEntry(e,t){let n=this.entries.get(e);n&&Object.assign(n,t)}unregister(e){this.entries.has(e)&&(this.entries.delete(e),this.listeners.delete(e),this.results.delete(e),this.stopListening())}startListening(){this.listenerCount===0&&(window.addEventListener(`scroll`,this.schedule,{passive:!0,capture:!0}),window.addEventListener(`resize`,this.schedule)),this.listenerCount++}stopListening(){this.listenerCount--,this.listenerCount===0&&(window.removeEventListener(`scroll`,this.schedule,{capture:!0}),window.removeEventListener(`resize`,this.schedule))}};export{n as stickyStack};
+"use client";function e(e,t,n,r){return e<r&&n<t}function t(e,t){if(e===t)return 0;let n=e.compareDocumentPosition(t);return n&Node.DOCUMENT_POSITION_FOLLOWING?-1:n&Node.DOCUMENT_POSITION_PRECEDING?1:0}var n=new class{constructor(){this.entries=new Map,this.listeners=new Map,this.results=new Map,this.rafId=0,this.listenerCount=0,this.schedule=()=>{cancelAnimationFrame(this.rafId),this.rafId=requestAnimationFrame(this.recompute)},this.recompute=()=>{let n=[...this.entries.entries()].sort(([,e],[,n])=>t(e.node,n.node)),r=new Map;for(let[t,i]of n){let n=i.getMetrics();if(!n)continue;let a=r.get(n.container);a||(a=[],r.set(n.container,a));let o=a.filter(t=>e(t.left,t.right,n.left,n.left+n.width)).reduce((e,t)=>Math.max(e,t.bottom),i.offsetTop),s=!i.disabled&&n.top<=o,c={isStuck:s,top:s?o:i.offsetTop};s&&a.push({left:n.left,right:n.left+n.width,bottom:o+n.contentHeight});let l=this.results.get(t);(!l||l.isStuck!==c.isStuck||l.top!==c.top)&&(this.results.set(t,c),this.listeners.get(t)?.(c))}}}register(e,t){let n=Symbol(`sticky`);return this.entries.set(n,e),this.listeners.set(n,t),this.startListening(),n}updateEntry(e,t){let n=this.entries.get(e);n&&Object.assign(n,t)}unregister(e){this.entries.has(e)&&(this.entries.delete(e),this.listeners.delete(e),this.results.delete(e),this.stopListening())}startListening(){this.listenerCount===0&&(window.addEventListener(`scroll`,this.schedule,{passive:!0,capture:!0}),window.addEventListener(`resize`,this.schedule)),this.listenerCount++}stopListening(){this.listenerCount--,this.listenerCount===0&&(window.removeEventListener(`scroll`,this.schedule,{capture:!0}),window.removeEventListener(`resize`,this.schedule))}};export{n as stickyStack};
 //# sourceMappingURL=stickyStack.mjs.map

package/dist/esm/common/sticky/stickyStack.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stickyStack.mjs","names":[],"sources":["../../../../package/common/sticky/stickyStack.ts"],"sourcesContent":["/*\n Coordinates every mounted `Sticky` so ones that overlap horizontally stack\n * underneath each other (in DOM order) instead of pinning to the same spot.\n * Non-overlapping ones (e.g. side-by-side halves under a full-width one) land\n * at the same top instead of being pushed down by each other.\n /\n\nexport interface StickyStackMetrics {\n /* Current (unstuck-flow) top of the root element, from getBoundingClientRect. /\n top: number;\n left: number;\n width: number;\n contentHeight: number;\n /* The element this entry sticks relative to (its scroll parent), or null for the viewport.\n * Stacking only considers overlap between entries sharing the same container — two Stickies\n * in unrelated scroll panels should never push each other down just because they happen to\n * share horizontal DOM coordinates. /\n container: HTMLElement \| null;\n}\n\nexport interface StickyStackEntry {\n node: HTMLElement;\n offsetTop: number;\n disabled: boolean;\n getMetrics: () => StickyStackMetrics \| null;\n}\n\nexport interface StickyStackResult {\n isStuck: boolean;\n /* Effective `top` to pin at while stuck — offsetTop plus the height of any stuck, overlapping entries above it. */\n top: number;\n}\n\ntype ResultListener = (result: StickyStackResult) => void;\n\nfunction rangesOverlap(aLeft: number, aRight: number, bLeft: number, bRight: number): boolean {\n return aLeft < bRight && bLeft < aRight;\n}\n\nfunction compareDomOrder(a: HTMLElement, b: HTMLElement): number {\n if (a === b) return 0;\n const position = a.compareDocumentPosition(b);\n if (position & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\n if (position & Node.DOCUMENT_POSITION_PRECEDING) return 1;\n return 0;\n}\n\nclass StickyStack {\n private entries = new Map<symbol, StickyStackEntry>();\n private listeners = new Map<symbol, ResultListener>();\n private results = new Map<symbol, StickyStackResult>();\n private rafId = 0;\n private listenerCount = 0;\n\n schedule = (): void => {\n cancelAnimationFrame(this.rafId);\n this.rafId = requestAnimationFrame(this.recompute);\n };\n\n register(entry: StickyStackEntry, onChange: ResultListener): symbol {\n const id = Symbol('sticky');\n this.entries.set(id, entry);\n this.listeners.set(id, onChange);\n this.startListening();\n return id;\n }\n\n updateEntry(id: symbol, patch: Partial<Pick<StickyStackEntry, 'offsetTop' \| 'disabled'>>): void {\n const entry = this.entries.get(id);\n if (entry) Object.assign(entry, patch);\n }\n\n unregister(id: symbol): void {\n if (!this.entries.has(id)) return;\n this.entries.delete(id);\n this.listeners.delete(id);\n this.results.delete(id);\n this.stopListening();\n }\n\n recompute = (): void => {\n const ordered = [...this.entries.entries()].sort(([, a], [, b]) => compareDomOrder(a.node, b.node));\n const placedByContainer = new Map<HTMLElement \| null, { left: number; right: number; bottom: number }[]>();\n\n for (const [id, entry] of ordered) {\n const metrics = entry.getMetrics();\n if (!metrics) continue;\n\n let placed = placedByContainer.get(metrics.container);\n if (!placed) {\n placed = [];\n placedByContainer.set(metrics.container, placed);\n }\n\n const overlapping = placed.filter((p) =>\n rangesOverlap(p.left, p.right, metrics.left, metrics.left + metrics.width),\n );\n const baseTop = overlapping.reduce((max, p) => Math.max(max, p.bottom), entry.offsetTop);\n const isStuck = !entry.disabled && metrics.top <= baseTop;\n const result: StickyStackResult = { isStuck, top: isStuck ? baseTop : entry.offsetTop };\n\n if (isStuck) {\n placed.push({\n left: metrics.left,\n right: metrics.left + metrics.width,\n bottom: baseTop + metrics.contentHeight,\n });\n }\n\n const prev = this.results.get(id);\n if (!prev \|\| prev.isStuck !== result.isStuck \|\| prev.top !== result.top) {\n this.results.set(id, result);\n this.listeners.get(id)?.(result);\n }\n }\n };\n\n private startListening(): void {\n if (this.listenerCount === 0) {\n window.addEventListener('scroll', this.schedule, { passive: true, capture: true });\n window.addEventListener('resize', this.schedule);\n }\n this.listenerCount++;\n }\n\n private stopListening(): void {\n this.listenerCount--;\n if (this.listenerCount === 0) {\n window.removeEventListener('scroll', this.schedule, { capture: true } as EventListenerOptions);\n window.removeEventListener('resize', this.schedule);\n }\n }\n}\n\nexport const stickyStack = new StickyStack();\n"],"mappings":"~~AAmCA~~,SAAS,EAAc,EAAe,EAAgB,EAAe,EAAyB,CAC5F,OAAO,EAAQ,GAAU,EAAQ,CACnC,CAEA,SAAS,EAAgB,EAAgB,EAAwB,CAC/D,GAAI,IAAM,EAAG,MAAO,GACpB,IAAM,EAAW,EAAE,wBAAwB,CAAC,EAG5C,OAFI,EAAW,KAAK,4BAAoC,GACpD,EAAW,KAAK,4BAAoC,EACjD,CACT,CAyFA,IAAa,EAAc,IAAI,KAvFb,eACE,KAAA,QAAA,IAAI,IACF,KAAA,UAAA,IAAI,IACN,KAAA,QAAA,IAAI,IACN,KAAA,MAAA,EACQ,KAAA,cAAA,EAED,KAAA,aAAA,CACrB,qBAAqB,KAAK,KAAK,EAC/B,KAAK,MAAQ,sBAAsB,KAAK,SAAS,CACnD,EAuBwB,KAAA,cAAA,CACtB,IAAM,EAAU,CAAC,GAAG,KAAK,QAAQ,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAG,GAAI,EAAG,KAAO,EAAgB,EAAE,KAAM,EAAE,IAAI,CAAC,EAC5F,EAAoB,IAAI,IAE9B,IAAK,GAAM,CAAC,EAAI,KAAU,EAAS,CACjC,IAAM,EAAU,EAAM,WAAW,EACjC,GAAI,CAAC,EAAS,SAEd,IAAI,EAAS,EAAkB,IAAI,EAAQ,SAAS,EAC/C,IACH,EAAS,CAAC,EACV,EAAkB,IAAI,EAAQ,UAAW,CAAM,GAMjD,IAAM,EAHc,EAAO,OAAQ,GACjC,EAAc,EAAE,KAAM,EAAE,MAAO,EAAQ,KAAM,EAAQ,KAAO,EAAQ,KAAK,CAE3D,CAAA,CAAY,QAAQ,EAAK,IAAM,KAAK,IAAI,EAAK,EAAE,MAAM,EAAG,EAAM,SAAS,EACjF,EAAU,CAAC,EAAM,UAAY,EAAQ,KAAO,EAC5C,EAA4B,CAAE,UAAS,IAAK,EAAU,EAAU,EAAM,SAAU,EAElF,GACF,EAAO,KAAK,CACV,KAAM,EAAQ,KACd,MAAO,EAAQ,KAAO,EAAQ,MAC9B,OAAQ,EAAU,EAAQ,aAC5B,CAAC,EAGH,IAAM,EAAO,KAAK,QAAQ,IAAI,CAAE,GAC5B,CAAC,GAAQ,EAAK,UAAY,EAAO,SAAW,EAAK,MAAQ,EAAO,OAClE,KAAK,QAAQ,IAAI,EAAI,CAAM,EAC3B,KAAK,UAAU,IAAI,CAAE,CAAC,GAAG,CAAM,EAEnC,CACF,EAxDA,SAAS,EAAyB,EAAkC,CAClE,IAAM,EAAK,OAAO,QAAQ,EAI1B,OAHA,KAAK,QAAQ,IAAI,EAAI,CAAK,EAC1B,KAAK,UAAU,IAAI,EAAI,CAAQ,EAC/B,KAAK,eAAe,EACb,CACT,CAEA,YAAY,EAAY,EAAwE,CAC9F,IAAM,EAAQ,KAAK,QAAQ,IAAI,CAAE,EAC7B,GAAO,OAAO,OAAO,EAAO,CAAK,CACvC,CAEA,WAAW,EAAkB,CACtB,KAAK,QAAQ,IAAI,CAAE,IACxB,KAAK,QAAQ,OAAO,CAAE,EACtB,KAAK,UAAU,OAAO,CAAE,EACxB,KAAK,QAAQ,OAAO,CAAE,EACtB,KAAK,cAAc,EACrB,CAuCA,gBAA+B,CACzB,KAAK,gBAAkB,IACzB,OAAO,iBAAiB,SAAU,KAAK,SAAU,CAAE,QAAS,GAAM,QAAS,EAAK,CAAC,EACjF,OAAO,iBAAiB,SAAU,KAAK,QAAQ,GAEjD,KAAK,eACP,CAEA,eAA8B,CAC5B,KAAK,gBACD,KAAK,gBAAkB,IACzB,OAAO,oBAAoB,SAAU,KAAK,SAAU,CAAE,QAAS,EAAK,CAAyB,EAC7F,OAAO,oBAAoB,SAAU,KAAK,QAAQ,EAEtD,CACF"}
1	+ {"version":3,"file":"stickyStack.mjs","names":[],"sources":["../../../../package/common/sticky/stickyStack.ts"],"sourcesContent":["/*\n Coordinates every mounted `Sticky` so ones that overlap horizontally stack\n * underneath each other (in DOM order) instead of pinning to the same spot.\n * Non-overlapping ones (e.g. side-by-side halves under a full-width one) land\n * at the same top instead of being pushed down by each other.\n /\n\nexport interface StickyStackMetrics {\n /* Current (unstuck-flow) top of the root element, from getBoundingClientRect. /\n top: number;\n left: number;\n width: number;\n contentHeight: number;\n /* The element this entry sticks relative to (its scroll parent), or null for the viewport.\n * Stacking only considers overlap between entries sharing the same container — two Stickies\n * in unrelated scroll panels should never push each other down just because they happen to\n * share horizontal DOM coordinates. /\n container: HTMLElement \| null;\n}\n\nexport interface StickyStackEntry {\n node: HTMLElement;\n offsetTop: number;\n disabled: boolean;\n getMetrics: () => StickyStackMetrics \| null;\n}\n\nexport interface StickyStackResult {\n isStuck: boolean;\n /* Effective `top` to pin at while stuck — offsetTop plus the height of any stuck, overlapping entries above it. */\n top: number;\n}\n\ntype ResultListener = (result: StickyStackResult) => void;\n\nfunction rangesOverlap(aLeft: number, aRight: number, bLeft: number, bRight: number): boolean {\n return aLeft < bRight && bLeft < aRight;\n}\n\nfunction compareDomOrder(a: HTMLElement, b: HTMLElement): number {\n if (a === b) return 0;\n const position = a.compareDocumentPosition(b);\n if (position & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\n if (position & Node.DOCUMENT_POSITION_PRECEDING) return 1;\n return 0;\n}\n\nclass StickyStack {\n private entries = new Map<symbol, StickyStackEntry>();\n private listeners = new Map<symbol, ResultListener>();\n private results = new Map<symbol, StickyStackResult>();\n private rafId = 0;\n private listenerCount = 0;\n\n schedule = (): void => {\n cancelAnimationFrame(this.rafId);\n this.rafId = requestAnimationFrame(this.recompute);\n };\n\n register(entry: StickyStackEntry, onChange: ResultListener): symbol {\n const id = Symbol('sticky');\n this.entries.set(id, entry);\n this.listeners.set(id, onChange);\n this.startListening();\n return id;\n }\n\n updateEntry(id: symbol, patch: Partial<Pick<StickyStackEntry, 'offsetTop' \| 'disabled'>>): void {\n const entry = this.entries.get(id);\n if (entry) Object.assign(entry, patch);\n }\n\n unregister(id: symbol): void {\n if (!this.entries.has(id)) return;\n this.entries.delete(id);\n this.listeners.delete(id);\n this.results.delete(id);\n this.stopListening();\n }\n\n recompute = (): void => {\n const ordered = [...this.entries.entries()].sort(([, a], [, b]) => compareDomOrder(a.node, b.node));\n const placedByContainer = new Map<HTMLElement \| null, { left: number; right: number; bottom: number }[]>();\n\n for (const [id, entry] of ordered) {\n const metrics = entry.getMetrics();\n if (!metrics) continue;\n\n let placed = placedByContainer.get(metrics.container);\n if (!placed) {\n placed = [];\n placedByContainer.set(metrics.container, placed);\n }\n\n const overlapping = placed.filter((p) =>\n rangesOverlap(p.left, p.right, metrics.left, metrics.left + metrics.width),\n );\n const baseTop = overlapping.reduce((max, p) => Math.max(max, p.bottom), entry.offsetTop);\n const isStuck = !entry.disabled && metrics.top <= baseTop;\n const result: StickyStackResult = { isStuck, top: isStuck ? baseTop : entry.offsetTop };\n\n if (isStuck) {\n placed.push({\n left: metrics.left,\n right: metrics.left + metrics.width,\n bottom: baseTop + metrics.contentHeight,\n });\n }\n\n const prev = this.results.get(id);\n if (!prev \|\| prev.isStuck !== result.isStuck \|\| prev.top !== result.top) {\n this.results.set(id, result);\n this.listeners.get(id)?.(result);\n }\n }\n };\n\n private startListening(): void {\n if (this.listenerCount === 0) {\n window.addEventListener('scroll', this.schedule, { passive: true, capture: true });\n window.addEventListener('resize', this.schedule);\n }\n this.listenerCount++;\n }\n\n private stopListening(): void {\n this.listenerCount--;\n if (this.listenerCount === 0) {\n window.removeEventListener('scroll', this.schedule, { capture: true } as EventListenerOptions);\n window.removeEventListener('resize', this.schedule);\n }\n }\n}\n\nexport const stickyStack = new StickyStack();\n"],"mappings":"aAmCA,SAAS,EAAc,EAAe,EAAgB,EAAe,EAAyB,CAC5F,OAAO,EAAQ,GAAU,EAAQ,CACnC,CAEA,SAAS,EAAgB,EAAgB,EAAwB,CAC/D,GAAI,IAAM,EAAG,MAAO,GACpB,IAAM,EAAW,EAAE,wBAAwB,CAAC,EAG5C,OAFI,EAAW,KAAK,4BAAoC,GACpD,EAAW,KAAK,4BAAoC,EACjD,CACT,CAyFA,IAAa,EAAc,IAAI,KAvFb,eACE,KAAA,QAAA,IAAI,IACF,KAAA,UAAA,IAAI,IACN,KAAA,QAAA,IAAI,IACN,KAAA,MAAA,EACQ,KAAA,cAAA,EAED,KAAA,aAAA,CACrB,qBAAqB,KAAK,KAAK,EAC/B,KAAK,MAAQ,sBAAsB,KAAK,SAAS,CACnD,EAuBwB,KAAA,cAAA,CACtB,IAAM,EAAU,CAAC,GAAG,KAAK,QAAQ,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAG,GAAI,EAAG,KAAO,EAAgB,EAAE,KAAM,EAAE,IAAI,CAAC,EAC5F,EAAoB,IAAI,IAE9B,IAAK,GAAM,CAAC,EAAI,KAAU,EAAS,CACjC,IAAM,EAAU,EAAM,WAAW,EACjC,GAAI,CAAC,EAAS,SAEd,IAAI,EAAS,EAAkB,IAAI,EAAQ,SAAS,EAC/C,IACH,EAAS,CAAC,EACV,EAAkB,IAAI,EAAQ,UAAW,CAAM,GAMjD,IAAM,EAHc,EAAO,OAAQ,GACjC,EAAc,EAAE,KAAM,EAAE,MAAO,EAAQ,KAAM,EAAQ,KAAO,EAAQ,KAAK,CAE3D,CAAA,CAAY,QAAQ,EAAK,IAAM,KAAK,IAAI,EAAK,EAAE,MAAM,EAAG,EAAM,SAAS,EACjF,EAAU,CAAC,EAAM,UAAY,EAAQ,KAAO,EAC5C,EAA4B,CAAE,UAAS,IAAK,EAAU,EAAU,EAAM,SAAU,EAElF,GACF,EAAO,KAAK,CACV,KAAM,EAAQ,KACd,MAAO,EAAQ,KAAO,EAAQ,MAC9B,OAAQ,EAAU,EAAQ,aAC5B,CAAC,EAGH,IAAM,EAAO,KAAK,QAAQ,IAAI,CAAE,GAC5B,CAAC,GAAQ,EAAK,UAAY,EAAO,SAAW,EAAK,MAAQ,EAAO,OAClE,KAAK,QAAQ,IAAI,EAAI,CAAM,EAC3B,KAAK,UAAU,IAAI,CAAE,CAAC,GAAG,CAAM,EAEnC,CACF,EAxDA,SAAS,EAAyB,EAAkC,CAClE,IAAM,EAAK,OAAO,QAAQ,EAI1B,OAHA,KAAK,QAAQ,IAAI,EAAI,CAAK,EAC1B,KAAK,UAAU,IAAI,EAAI,CAAQ,EAC/B,KAAK,eAAe,EACb,CACT,CAEA,YAAY,EAAY,EAAwE,CAC9F,IAAM,EAAQ,KAAK,QAAQ,IAAI,CAAE,EAC7B,GAAO,OAAO,OAAO,EAAO,CAAK,CACvC,CAEA,WAAW,EAAkB,CACtB,KAAK,QAAQ,IAAI,CAAE,IACxB,KAAK,QAAQ,OAAO,CAAE,EACtB,KAAK,UAAU,OAAO,CAAE,EACxB,KAAK,QAAQ,OAAO,CAAE,EACtB,KAAK,cAAc,EACrB,CAuCA,gBAA+B,CACzB,KAAK,gBAAkB,IACzB,OAAO,iBAAiB,SAAU,KAAK,SAAU,CAAE,QAAS,GAAM,QAAS,EAAK,CAAC,EACjF,OAAO,iBAAiB,SAAU,KAAK,QAAQ,GAEjD,KAAK,eACP,CAEA,eAA8B,CAC5B,KAAK,gBACD,KAAK,gBAAkB,IACzB,OAAO,oBAAoB,SAAU,KAAK,SAAU,CAAE,QAAS,EAAK,CAAyB,EAC7F,OAAO,oBAAoB,SAAU,KAAK,QAAQ,EAEtD,CACF"}

package/dist/esm/common/styles/scrollFade.module.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use client";var e=`scroll-fade_owdg4`,t=`scroll-fade-y_wJ1fr`,n=`scroll-fade-x_WoTqS`,r=`scroll-fade-faded-start_x28G6`,i=`scroll-fade-faded-end_buuWg`,a={"scroll-fade":`scroll-fade_owdg4`,scrollFade:e,"scroll-fade-y":`scroll-fade-y_wJ1fr`,scrollFadeY:t,"scroll-fade-x":`scroll-fade-x_WoTqS`,scrollFadeX:n,"scroll-fade-faded-start":`scroll-fade-faded-start_x28G6`,scrollFadeFadedStart:r,"scroll-fade-faded-end":`scroll-fade-faded-end_buuWg`,scrollFadeFadedEnd:i};export{a as default,e as scrollFade,i as scrollFadeFadedEnd,r as scrollFadeFadedStart,n as scrollFadeX,t as scrollFadeY};
2	+ //# sourceMappingURL=scrollFade.module.mjs.map

package/dist/esm/common/styles/scrollFade.module.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"scrollFade.module.mjs","names":[],"sources":["../../../../package/common/styles/scrollFade.module.pcss"],"sourcesContent":["/*\n * The scroll-fade mask, shared by `ScrollFade` and by anything with a scroll port of its own\n * (Modal's body, Carousel's dot strip). Why a mask rather than an overlay, and what that costs:\n * `docs/ScrollFade.md`.\n */\n\n/* Registered so the two alphas can be transitioned: an unregistered custom property has no type\n for the browser to interpolate, so the fade would snap in and out at each edge. A browser\n without `@property` keeps them working and simply lands on the old instant switch. */\n@property --custom-scroll-fade-start {\n syntax: '<number>';\n inherits: false;\n initial-value: 1;\n}\n\n@property --custom-scroll-fade-end {\n syntax: '<number>';\n inherits: false;\n initial-value: 1;\n}\n\n/* `inherits: false` so a host setting a length of its own doesn't hand it to a nested\n `ScrollFade`, and typed so a bare `0` is read as a length instead of voiding the `calc()`\n below, which would drop the whole mask rather than shorten the fade. */\n@property --custom-scroll-fade-length {\n syntax: '<length>';\n inherits: false;\n initial-value: 24px;\n}\n\n/* Zero specificity, so a host that sets its own length on the same element wins whichever order\n the bundler emits the two modules in. The `24px` repeats the initial value above for a browser\n without `@property`, where there is none. */\n:where(.scroll-fade) {\n --custom-scroll-fade-length: var(--scroll-fade-length, 24px);\n}\n\n.scroll-fade {\n --custom-scroll-fade-start: 1;\n --custom-scroll-fade-end: 1;\n\n /* A fade is not motion, so this stays under `prefers-reduced-motion`. */\n transition:\n --custom-scroll-fade-start 0.2s ease,\n --custom-scroll-fade-end 0.2s ease;\n}\n\n/* One gradient covering the whole port with only its end stops changing, so the four states are\n two alpha switches rather than four gradients. */\n.scroll-fade-y {\n -webkit-mask-image: linear-gradient(\n to bottom,\n rgb(0 0 0 / var(--custom-scroll-fade-start)) 0,\n rgb(0 0 0 / 100%) var(--custom-scroll-fade-length),\n rgb(0 0 0 / 100%) calc(100% - var(--custom-scroll-fade-length)),\n rgb(0 0 0 / var(--custom-scroll-fade-end)) 100%\n );\n mask-image: linear-gradient(\n to bottom,\n rgb(0 0 0 / var(--custom-scroll-fade-start)) 0,\n rgb(0 0 0 / 100%) var(--custom-scroll-fade-length),\n rgb(0 0 0 / 100%) calc(100% - var(--custom-scroll-fade-length)),\n rgb(0 0 0 / var(--custom-scroll-fade-end)) 100%\n );\n}\n\n.scroll-fade-x {\n -webkit-mask-image: linear-gradient(\n to right,\n rgb(0 0 0 / var(--custom-scroll-fade-start)) 0,\n rgb(0 0 0 / 100%) var(--custom-scroll-fade-length),\n rgb(0 0 0 / 100%) calc(100% - var(--custom-scroll-fade-length)),\n rgb(0 0 0 / var(--custom-scroll-fade-end)) 100%\n );\n mask-image: linear-gradient(\n to right,\n rgb(0 0 0 / var(--custom-scroll-fade-start)) 0,\n rgb(0 0 0 / 100%) var(--custom-scroll-fade-length),\n rgb(0 0 0 / 100%) calc(100% - var(--custom-scroll-fade-length)),\n rgb(0 0 0 / var(--custom-scroll-fade-end)) 100%\n );\n}\n\n.scroll-fade-faded-start {\n --custom-scroll-fade-start: 0;\n}\n\n.scroll-fade-faded-end {\n --custom-scroll-fade-end: 0;\n}\n\n/* Fading text costs contrast at exactly the edge someone may be reading. Anyone who has asked for\n more of it gets the hard edge back instead — legibility beats the nicer boundary. */\n@media (prefers-contrast: more) {\n .scroll-fade {\n --custom-scroll-fade-start: 1;\n --custom-scroll-fade-end: 1;\n }\n}\n"],"mappings":""}

package/dist/esm/common/styles/sheet.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`sheet_cfS92`,t=`sheetSlideIn_wF6l0`,n=`sheet-surface_-vvdd`,r=`sheet-panel_HPJjL sheet-surface_-vvdd`,i=`sheet-scroll_nda2p`,a=`sheet-backdrop_B-S70`,o=`sheetBackdropFadeIn_MJUJq`,s={sheet:e,sheetSlideIn:t,"sheet-surface":`sheet-surface_-vvdd`,sheetSurface:n,"sheet-panel":`sheet-panel_HPJjL sheet-surface_-vvdd`,sheetPanel:r,"sheet-scroll":`sheet-scroll_nda2p`,sheetScroll:i,"sheet-backdrop":`sheet-backdrop_B-S70`,sheetBackdrop:a,sheetBackdropFadeIn:o};export{s as default,e as sheet,a as sheetBackdrop,o as sheetBackdropFadeIn,r as sheetPanel,i as sheetScroll,t as sheetSlideIn,n as sheetSurface};
+"use client";var e=`sheet_cfS92`,t=`sheetSlideIn_wF6l0`,n=`sheet-surface_-vvdd`,r=`sheet-panel_HPJjL sheet-surface_-vvdd`,i=`sheet-scroll_nda2p`,a=`sheet-backdrop_B-S70`,o=`sheetBackdropFadeIn_MJUJq`,s={sheet:e,sheetSlideIn:t,"sheet-surface":`sheet-surface_-vvdd`,sheetSurface:n,"sheet-panel":`sheet-panel_HPJjL sheet-surface_-vvdd`,sheetPanel:r,"sheet-scroll":`sheet-scroll_nda2p`,sheetScroll:i,"sheet-backdrop":`sheet-backdrop_B-S70`,sheetBackdrop:a,sheetBackdropFadeIn:o};export{s as default,e as sheet,a as sheetBackdrop,o as sheetBackdropFadeIn,r as sheetPanel,i as sheetScroll,t as sheetSlideIn,n as sheetSurface};
 //# sourceMappingURL=sheet.module.mjs.map

package/dist/esm/common/styles/sheet.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sheet.module.mjs","names":[],"sources":["../../../../package/common/styles/sheet.module.pcss"],"sourcesContent":["/\n Bottom-sheet presentation, shared by every popup that can switch away from being anchored to\n * its trigger (see `useSheet`).\n \n Every selector is doubled (`.sheet.sheet`) on purpose: these classes land on the same elements\n * as a component's own single-class panel styles and have to win over them. Which of two\n * equal-specificity rules wins otherwise depends on the order the bundler happens to emit the\n * two CSS modules in, which is not something a component should have to depend on.\n /\n\n.sheet.sheet {\n position: fixed;\n left: 0;\n right: 0;\n margin: 0 auto;\n width: 100%;\n\n / Wide enough for a comfortable list on a phone, narrow enough not to span a tablet. /\n max-width: 560px;\n\n / Two separate caps: how much of the screen a sheet may take at most, and how much screen\n there actually is — the latter set inline by `useSheet` from the visual viewport, since no\n viewport unit shrinks when the on-screen keyboard opens. /\n max-height: min(var(--sheet-max-height, 70vh), var(--sheet-available-height, 100vh));\n max-height: min(var(--sheet-max-height, 70dvh), var(--sheet-available-height, 100dvh));\n display: flex;\n flex-direction: column;\n z-index: 1;\n animation: sheetSlideIn 0.2s ease-out;\n}\n\n/ What a sheet looks like where it meets the screen, split out from `.sheet-panel` because a\n component whose own root is the surface (Modal) needs the look without the fill-the-root\n layout below it. /\n.sheet-surface.sheet-surface {\n overscroll-behavior: contain;\n border-radius: calc(var(--default-border-radius) + 4px) calc(var(--default-border-radius) + 4px) 0 0;\n\n / Clears the home indicator on a phone without leaving a gap on a device that has none. /\n padding-bottom: max(var(--sheet-safe-padding, 8px), env(safe-area-inset-bottom));\n}\n\n.sheet-panel {\n composes: sheet-surface;\n}\n\n.sheet-panel.sheet-panel {\n position: static;\n width: 100%;\n box-sizing: border-box;\n margin: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n max-height: 100%;\n\n / Overrides a panel that caps its own width when anchored, e.g. Popover's 320px. /\n max-width: 100%;\n\n / The sheet root owns the entrance animation; a panel that scales itself in when anchored\n (Popover) would otherwise play a second, conflicting one on top of the slide-up. /\n animation: none;\n overflow-y: auto;\n}\n\n/ For an inner list that caps its own height when anchored: the sheet caps the height instead. */\n.sheet-scroll.sheet-scroll {\n max-height: none;\n flex: 1 1 auto;\n min-height: 0;\n}\n\n.sheet-backdrop.sheet-backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: #00000052;\n z-index: 1;\n animation: sheetBackdropFadeIn 0.2s ease-out;\n}\n\n@keyframes sheetSlideIn {\n from {\n transform: translateY(100%);\n }\n\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes sheetBackdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"sheet.module.mjs","names":[],"sources":["../../../../package/common/styles/sheet.module.pcss"],"sourcesContent":["/\n Bottom-sheet presentation, shared by every popup that can switch away from being anchored to\n * its trigger (see `useSheet`).\n \n Every selector is doubled (`.sheet.sheet`) on purpose: these classes land on the same elements\n * as a component's own single-class panel styles and have to win over them. Which of two\n * equal-specificity rules wins otherwise depends on the order the bundler happens to emit the\n * two CSS modules in, which is not something a component should have to depend on.\n /\n\n.sheet.sheet {\n position: fixed;\n left: 0;\n right: 0;\n margin: 0 auto;\n width: 100%;\n\n / Wide enough for a comfortable list on a phone, narrow enough not to span a tablet —\n `Presentation.Auto` reaches a 744px one, where full width would be a banner rather than a\n sheet. A token like the other two sheet dimensions, since this selector is doubled and a\n consumer could otherwise only beat it with an inline style. /\n max-width: var(--sheet-max-width, 560px);\n\n / Two separate caps: how much of the screen a sheet may take at most, and how much screen\n there actually is — the latter set inline by `useSheet` from the visual viewport, since no\n viewport unit shrinks when the on-screen keyboard opens. /\n max-height: min(var(--sheet-max-height, 70vh), var(--sheet-available-height, 100vh));\n max-height: min(var(--sheet-max-height, 70dvh), var(--sheet-available-height, 100dvh));\n display: flex;\n flex-direction: column;\n z-index: 1;\n animation: sheetSlideIn 0.2s ease-out;\n}\n\n/ What a sheet looks like where it meets the screen, split out from `.sheet-panel` because a\n component whose own root is the surface (Modal) needs the look without the fill-the-root\n layout below it. /\n.sheet-surface.sheet-surface {\n overscroll-behavior: contain;\n border-radius: calc(var(--default-border-radius) + 4px) calc(var(--default-border-radius) + 4px) 0 0;\n\n / Clears the home indicator on a phone without leaving a gap on a device that has none. /\n padding-bottom: max(var(--sheet-safe-padding, 8px), env(safe-area-inset-bottom));\n}\n\n.sheet-panel {\n composes: sheet-surface;\n}\n\n.sheet-panel.sheet-panel {\n position: static;\n width: 100%;\n box-sizing: border-box;\n margin: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n max-height: 100%;\n\n / Overrides a panel that caps its own width when anchored, e.g. Popover's 320px. /\n max-width: 100%;\n\n / The sheet root owns the entrance animation; a panel that scales itself in when anchored\n (Popover) would otherwise play a second, conflicting one on top of the slide-up. /\n animation: none;\n overflow-y: auto;\n}\n\n/ For an inner list that caps its own height when anchored: the sheet caps the height instead. /\n.sheet-scroll.sheet-scroll {\n max-height: none;\n flex: 1 1 auto;\n min-height: 0;\n}\n\n.sheet-backdrop.sheet-backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: #00000052;\n z-index: 1;\n animation: sheetBackdropFadeIn 0.2s ease-out;\n}\n\n@keyframes sheetSlideIn {\n from {\n transform: translateY(100%);\n }\n\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes sheetBackdropFadeIn {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n/ Neither animation has a fill mode, so removing them lands both at their natural state: the\n panel already at translateY(0), the backdrop already opaque. */\n@media (prefers-reduced-motion: reduce) {\n .sheet-panel,\n .sheet-backdrop.sheet-backdrop {\n animation: none;\n }\n}\n"],"mappings":""}

package/dist/esm/common/switch/switch.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"./switch.module.mjs";import{useEffect as n,useState as r}from"react";import i from"classnames";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(s){let{label:c=``,selected:l=!1,onToggle:u=()=>{},className:d=``,style:f,disabled:p=!1,title:m=``,tabIndex:h=0,formValidator:g=null,children:_=null,classNames:v,styles:y,...b}=e(`Switch`,s),[,x]=r(0);n(()=>{if(!g)return;let e=()=>x(e=>e+1);return g.registerOnUpdateListener(e),()=>g.removeOnUpdateListener(e)},[g]);function S(e){p||(g&&g.set(!g.value),u(!C,e))}let C=g?g.value:l;return o(`div`,{...b,title:m,className:i(t.switch,{[t.switchDisabled]:p},d),style:f,onClick:S,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),S(e))},role:`switch`,"aria-checked":C,tabIndex:p?-1:h,children:[a(`div`,{className:i(t.switchTrack,C&&t.switchTrackChecked,v?.track),style:y?.track,children:a(`div`,{className:i(t.switchThumb,C&&t.switchThumbChecked,v?.thumb),style:y?.thumb})}),(_||c)&&a(`div`,{className:i(t.switchLabel,v?.label),style:y?.label,children:_||c})]})}export{s as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"./switch.module.mjs";import{useEffect as n,useState as r}from"react";import i from"classnames";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(s){let{label:c=``,selected:l=!1,onToggle:u=()=>{},className:d=``,style:f,disabled:p=!1,title:m=``,tabIndex:h=0,formValidator:g=null,children:_=null,classNames:v,styles:y,...b}=e(`Switch`,s),[,x]=r(0);n(()=>{if(!g)return;let e=()=>x(e=>e+1);return g.registerOnUpdateListener(e),()=>g.removeOnUpdateListener(e)},[g]);function S(e){p||(g&&g.set(!g.value),u(!C,e))}let C=g?g.value:l;return o(`div`,{...b,title:m,className:i(t.switch,{[t.switchDisabled]:p},d),style:f,onClick:S,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),S(e))},role:`switch`,"aria-checked":C,tabIndex:p?-1:h,children:[a(`div`,{className:i(t.switchTrack,C&&t.switchTrackChecked,v?.track),style:y?.track,children:a(`div`,{className:i(t.switchThumb,C&&t.switchThumbChecked,v?.thumb),style:y?.thumb})}),(_||c)&&a(`div`,{className:i(t.switchLabel,v?.label),style:y?.label,children:_||c})]})}export{s as default};
 //# sourceMappingURL=switch.mjs.map

package/dist/esm/common/switch/switch.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch.mjs","names":[],"sources":["../../../../package/common/switch/switch.tsx"],"sourcesContent":["import { useEffect, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults } from '../configProvider';\nimport type { SwitchProps } from './switch.types';\nimport styles from './switch.module.pcss';\n\nfunction Switch(props: SwitchProps): ReactElement {\n const {\n label = '',\n selected = false,\n onToggle = () => {},\n className = '',\n style,\n disabled = false,\n title = '',\n tabIndex = 0,\n formValidator = null,\n children = null,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Switch', props);\n const [, forceUpdate] = useState(0);\n\n useEffect(() => {\n if (!formValidator) return;\n const listener = () => forceUpdate((n) => n + 1);\n formValidator.registerOnUpdateListener(listener);\n return () => formValidator.removeOnUpdateListener(listener);\n }, [formValidator]);\n\n function handleToggle(event?: React.MouseEvent \| React.KeyboardEvent) {\n if (disabled) return;\n if (formValidator) {\n formValidator.set(!formValidator.value);\n }\n onToggle(!currSelected, event);\n }\n\n const currSelected = (formValidator ? formValidator.value : selected) as boolean;\n\n return (\n <div\n {...rest}\n title={title}\n className={cx(\n styles.switch,\n {\n [styles.switchDisabled]: disabled,\n },\n className,\n )}\n style={style}\n onClick={handleToggle}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n handleToggle(e);\n }\n }}\n role='switch'\n aria-checked={currSelected}\n tabIndex={disabled ? -1 : tabIndex}\n >\n <div\n className={cx(styles.switchTrack, currSelected && styles.switchTrackChecked, classNames?.track)}\n style={slotStyles?.track}\n >\n <div\n className={cx(styles.switchThumb, currSelected && styles.switchThumbChecked, classNames?.thumb)}\n style={slotStyles?.thumb}\n />\n </div>\n {(children \|\| label) && (\n <div className={cx(styles.switchLabel, classNames?.label)} style={slotStyles?.label}>\n {children \|\| label}\n </div>\n )}\n </div>\n );\n}\n\nexport default Switch;\n"],"mappings":"~~iPAOA~~,SAAS,EAAO,EAAkC,CAChD,GAAM,CACJ,QAAQ,GACR,WAAW,GACX,eAAiB,CAAC,EAClB,YAAY,GACZ,QACA,WAAW,GACX,QAAQ,GACR,WAAW,EACX,gBAAgB,KAChB,WAAW,KACX,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,SAAU,CAAK,EAClC,EAAG,GAAe,EAAS,CAAC,EAElC,MAAgB,CACd,GAAI,CAAC,EAAe,OACpB,IAAM,MAAiB,EAAa,GAAM,EAAI,CAAC,EAE/C,OADA,EAAc,yBAAyB,CAAQ,MAClC,EAAc,uBAAuB,CAAQ,CAC5D,EAAG,CAAC,CAAa,CAAC,EAElB,SAAS,EAAa,EAAgD,CAChE,IACA,GACF,EAAc,IAAI,CAAC,EAAc,KAAK,EAExC,EAAS,CAAC,EAAc,CAAK,EAC/B,CAEA,IAAM,EAAgB,EAAgB,EAAc,MAAQ,EAE5D,OACE,EAAC,MAAD,CACE,GAAI,EACG,QACP,UAAW,EACT,EAAO,OACP,EACG,EAAO,gBAAiB,CAC3B,EACA,CACF,EACO,QACP,QAAS,EACT,UAAY,GAAM,EACZ,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjB,EAAa,CAAC,EAElB,EACA,KAAK,SACL,eAAc,EACd,SAAU,EAAW,GAAK,EApB5B,SAAA,CAsBE,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAgB,EAAO,mBAAoB,GAAY,KAAK,EAC9F,MAAO,GAAY,MAEnB,SAAA,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAgB,EAAO,mBAAoB,GAAY,KAAK,EAC9F,MAAO,GAAY,KACpB,CAAA,CACE,CAAA,GACH,GAAY,IACZ,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,YAAa,GAAY,KAAK,EAAG,MAAO,GAAY,MAC3E,SAAA,GAAY,CACV,CAAA,CAEJ,GAET"}
1	+ {"version":3,"file":"switch.mjs","names":[],"sources":["../../../../package/common/switch/switch.tsx"],"sourcesContent":["import { useEffect, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults } from '../configProvider';\nimport type { SwitchProps } from './switch.types';\nimport styles from './switch.module.pcss';\n\nfunction Switch(props: SwitchProps): ReactElement {\n const {\n label = '',\n selected = false,\n onToggle = () => {},\n className = '',\n style,\n disabled = false,\n title = '',\n tabIndex = 0,\n formValidator = null,\n children = null,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Switch', props);\n const [, forceUpdate] = useState(0);\n\n useEffect(() => {\n if (!formValidator) return;\n const listener = () => forceUpdate((n) => n + 1);\n formValidator.registerOnUpdateListener(listener);\n return () => formValidator.removeOnUpdateListener(listener);\n }, [formValidator]);\n\n function handleToggle(event?: React.MouseEvent \| React.KeyboardEvent) {\n if (disabled) return;\n if (formValidator) {\n formValidator.set(!formValidator.value);\n }\n onToggle(!currSelected, event);\n }\n\n const currSelected = (formValidator ? formValidator.value : selected) as boolean;\n\n return (\n <div\n {...rest}\n title={title}\n className={cx(\n styles.switch,\n {\n [styles.switchDisabled]: disabled,\n },\n className,\n )}\n style={style}\n onClick={handleToggle}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n handleToggle(e);\n }\n }}\n role='switch'\n aria-checked={currSelected}\n tabIndex={disabled ? -1 : tabIndex}\n >\n <div\n className={cx(styles.switchTrack, currSelected && styles.switchTrackChecked, classNames?.track)}\n style={slotStyles?.track}\n >\n <div\n className={cx(styles.switchThumb, currSelected && styles.switchThumbChecked, classNames?.thumb)}\n style={slotStyles?.thumb}\n />\n </div>\n {(children \|\| label) && (\n <div className={cx(styles.switchLabel, classNames?.label)} style={slotStyles?.label}>\n {children \|\| label}\n </div>\n )}\n </div>\n );\n}\n\nexport default Switch;\n"],"mappings":"8PAOA,SAAS,EAAO,EAAkC,CAChD,GAAM,CACJ,QAAQ,GACR,WAAW,GACX,eAAiB,CAAC,EAClB,YAAY,GACZ,QACA,WAAW,GACX,QAAQ,GACR,WAAW,EACX,gBAAgB,KAChB,WAAW,KACX,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,SAAU,CAAK,EAClC,EAAG,GAAe,EAAS,CAAC,EAElC,MAAgB,CACd,GAAI,CAAC,EAAe,OACpB,IAAM,MAAiB,EAAa,GAAM,EAAI,CAAC,EAE/C,OADA,EAAc,yBAAyB,CAAQ,MAClC,EAAc,uBAAuB,CAAQ,CAC5D,EAAG,CAAC,CAAa,CAAC,EAElB,SAAS,EAAa,EAAgD,CAChE,IACA,GACF,EAAc,IAAI,CAAC,EAAc,KAAK,EAExC,EAAS,CAAC,EAAc,CAAK,EAC/B,CAEA,IAAM,EAAgB,EAAgB,EAAc,MAAQ,EAE5D,OACE,EAAC,MAAD,CACE,GAAI,EACG,QACP,UAAW,EACT,EAAO,OACP,EACG,EAAO,gBAAiB,CAC3B,EACA,CACF,EACO,QACP,QAAS,EACT,UAAY,GAAM,EACZ,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjB,EAAa,CAAC,EAElB,EACA,KAAK,SACL,eAAc,EACd,SAAU,EAAW,GAAK,EApB5B,SAAA,CAsBE,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAgB,EAAO,mBAAoB,GAAY,KAAK,EAC9F,MAAO,GAAY,MAEnB,SAAA,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAgB,EAAO,mBAAoB,GAAY,KAAK,EAC9F,MAAO,GAAY,KACpB,CAAA,CACE,CAAA,GACH,GAAY,IACZ,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,YAAa,GAAY,KAAK,EAAG,MAAO,GAAY,MAC3E,SAAA,GAAY,CACV,CAAA,CAEJ,GAET"}

package/dist/esm/common/switch/switch.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`switch-disabled_UL-F-`,t=`switch-track_awA-t`,n=`switch-track-checked_boZKe`,r=`switch-thumb_4fUTo`,i=`switch-thumb-checked_GU--w`,a=`switch-label_3pLBQ`,o={switch:`switch_9TG2Y`,"switch-disabled":`switch-disabled_UL-F-`,switchDisabled:e,"switch-track":`switch-track_awA-t`,switchTrack:t,"switch-track-checked":`switch-track-checked_boZKe`,switchTrackChecked:n,"switch-thumb":`switch-thumb_4fUTo`,switchThumb:r,"switch-thumb-checked":`switch-thumb-checked_GU--w`,switchThumbChecked:i,"switch-label":`switch-label_3pLBQ`,switchLabel:a};export{o as default,e as switchDisabled,a as switchLabel,r as switchThumb,i as switchThumbChecked,t as switchTrack,n as switchTrackChecked};
+"use client";var e=`switch-disabled_UL-F-`,t=`switch-track_awA-t`,n=`switch-track-checked_boZKe`,r=`switch-thumb_4fUTo`,i=`switch-thumb-checked_GU--w`,a=`switch-label_3pLBQ`,o={switch:`switch_9TG2Y`,"switch-disabled":`switch-disabled_UL-F-`,switchDisabled:e,"switch-track":`switch-track_awA-t`,switchTrack:t,"switch-track-checked":`switch-track-checked_boZKe`,switchTrackChecked:n,"switch-thumb":`switch-thumb_4fUTo`,switchThumb:r,"switch-thumb-checked":`switch-thumb-checked_GU--w`,switchThumbChecked:i,"switch-label":`switch-label_3pLBQ`,switchLabel:a};export{o as default,e as switchDisabled,a as switchLabel,r as switchThumb,i as switchThumbChecked,t as switchTrack,n as switchTrackChecked};
 //# sourceMappingURL=switch.module.mjs.map

package/dist/esm/common/switch/switch.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch.module.mjs","names":[],"sources":["../../../../package/common/switch/switch.module.pcss"],"sourcesContent":[".switch {\n user-select: none;\n display: flex;\n align-items: center;\n column-gap: 0.625em;\n width: fit-content;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n border: 1px solid transparent;\n margin: -1px;\n\n &:focus-visible {\n outline: none;\n border: 1px solid var(--focus-border-color, var(--primary-color));\n border-radius: var(--default-border-radius);\n }\n\n &-disabled {\n filter: brightness(0.8);\n cursor: not-allowed;\n }\n\n &-track {\n width: 2.25em;\n height: 1.25em;\n flex-shrink: 0;\n border-radius: var(--default-border-radius);\n background-color: var(--border-color);\n position: relative;\n transition: background-color 0.2s;\n box-sizing: border-box;\n padding: 0.125em;\n\n &-checked {\n background-color: var(--primary-color);\n background-image: var(--primary-gradient, none);\n }\n }\n\n &-thumb {\n width: 1em;\n height: 1em;\n border-radius: var(--default-border-radius);\n background-color: var(--background);\n box-shadow: var(--card-shadow);\n transform: translateX(0);\n transition: transform 0.2s;\n\n &-checked {\n transform: translateX(1em);\n }\n }\n\n &-label {\n line-height: 100%;\n color: var(--text-color);\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"switch.module.mjs","names":[],"sources":["../../../../package/common/switch/switch.module.pcss"],"sourcesContent":[".switch {\n user-select: none;\n display: flex;\n align-items: center;\n column-gap: 0.625em;\n width: fit-content;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n border: 1px solid transparent;\n margin: -1px;\n\n &:focus-visible {\n outline: none;\n border: 1px solid var(--focus-border-color, var(--primary-color));\n border-radius: var(--default-border-radius);\n }\n\n &-disabled {\n filter: brightness(0.8);\n cursor: not-allowed;\n }\n\n &-track {\n width: 2.25em;\n height: 1.25em;\n flex-shrink: 0;\n border-radius: var(--default-border-radius);\n background-color: var(--border-color);\n position: relative;\n transition: background-color 0.2s;\n box-sizing: border-box;\n padding: 0.125em;\n\n &-checked {\n background-color: var(--primary-color);\n background-image: var(--primary-gradient, none);\n }\n }\n\n &-thumb {\n width: 1em;\n height: 1em;\n border-radius: var(--default-border-radius);\n background-color: var(--background);\n box-shadow: var(--card-shadow);\n transform: translateX(0);\n transition: transform 0.2s;\n\n &-checked {\n transform: translateX(1em);\n }\n }\n\n &-label {\n line-height: 100%;\n color: var(--text-color);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .switch-thumb {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/esm/common/tabHeader/tabHeader.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{renderIcon as e}from"../utils/renderIcon.mjs";import t from"../interactableDiv/index.mjs";import n from"./tabHeader.module.mjs";import"react";import r from"classnames";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o({tabs:o=[],currentTab:s,onChange:c,className:l,style:u,classNames:d,styles:f,...p}){return i(`div`,{...p,role:`tablist`,className:r(n.tabHeader,d?.root,l),style:{...f?.root,...u},children:o.map(o=>{let l=o.id===s,u=!!o.title||!!o.subtitle;return a(t,{role:`tab`,"aria-selected":l,"aria-disabled":o.disabled||void 0,tabIndex:o.disabled?-1:0,className:r(n.tabHeaderTab,{[n.tabHeaderTabActive]:l},{[n.tabHeaderTabDisabled]:o.disabled},d?.tab),style:f?.tab,onClick:()=>{o.disabled||l||c(o.id)},children:[e(o.icon,{className:r(n.tabHeaderIcon,d?.icon),style:f?.icon}),u&&a(`div`,{className:r(n.tabHeaderLabels,d?.labels),style:f?.labels,children:[o.title&&i(`span`,{className:r(n.tabHeaderTitle,d?.title),style:f?.title,children:o.title}),o.subtitle&&i(`span`,{className:r(n.tabHeaderSubtitle,d?.subtitle),style:f?.subtitle,children:o.subtitle})]})]},o.id)})})}export{o as default};
+"use client";import{renderIcon as e}from"../utils/renderIcon.mjs";import t from"../interactableDiv/index.mjs";import n from"./tabHeader.module.mjs";import"react";import r from"classnames";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o({tabs:o=[],currentTab:s,onChange:c,className:l,style:u,classNames:d,styles:f,...p}){return i(`div`,{...p,role:`tablist`,className:r(n.tabHeader,d?.root,l),style:{...f?.root,...u},children:o.map(o=>{let l=o.id===s,u=!!o.title||!!o.subtitle;return a(t,{role:`tab`,"aria-selected":l,"aria-disabled":o.disabled||void 0,tabIndex:o.disabled?-1:0,className:r(n.tabHeaderTab,{[n.tabHeaderTabActive]:l},{[n.tabHeaderTabDisabled]:o.disabled},d?.tab),style:f?.tab,onClick:()=>{o.disabled||l||c(o.id)},children:[e(o.icon,{className:r(n.tabHeaderIcon,d?.icon),style:f?.icon}),u&&a(`div`,{className:r(n.tabHeaderLabels,d?.labels),style:f?.labels,children:[o.title&&i(`span`,{className:r(n.tabHeaderTitle,d?.title),style:f?.title,children:o.title}),o.subtitle&&i(`span`,{className:r(n.tabHeaderSubtitle,d?.subtitle),style:f?.subtitle,children:o.subtitle})]})]},o.id)})})}export{o as default};
 //# sourceMappingURL=tabHeader.mjs.map

package/dist/esm/common/tabHeader/tabHeader.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabHeader.mjs","names":[],"sources":["../../../../package/common/tabHeader/tabHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\nimport InteractableDiv from '../interactableDiv';\nimport type { TabHeaderProps, TabHeaderTab } from './tabHeader.types';\n\nimport styles from './tabHeader.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\nfunction TabHeader({\n tabs = [],\n currentTab,\n onChange,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: TabHeaderProps) {\n return (\n <div\n {...rest}\n role='tablist'\n className={cx(styles.tabHeader, classNames?.root, className)}\n style={{ ...slotStyles?.root, ...style }}\n >\n {tabs.map((tab: TabHeaderTab) => {\n const isActive = tab.id === currentTab;\n const hasLabels = !!tab.title \|\| !!tab.subtitle;\n\n return (\n <InteractableDiv\n key={tab.id}\n role='tab'\n aria-selected={isActive}\n aria-disabled={tab.disabled \|\| undefined}\n tabIndex={tab.disabled ? -1 : 0}\n className={cx(\n styles.tabHeaderTab,\n { [styles.tabHeaderTabActive]: isActive },\n { [styles.tabHeaderTabDisabled]: tab.disabled },\n classNames?.tab,\n )}\n style={slotStyles?.tab}\n onClick={() => {\n if (tab.disabled \|\| isActive) return;\n onChange(tab.id);\n }}\n >\n {renderIcon(tab.icon, {\n className: cx(styles.tabHeaderIcon, classNames?.icon),\n style: slotStyles?.icon,\n })}\n {hasLabels && (\n <div className={cx(styles.tabHeaderLabels, classNames?.labels)} style={slotStyles?.labels}>\n {tab.title && (\n <span className={cx(styles.tabHeaderTitle, classNames?.title)} style={slotStyles?.title}>\n {tab.title}\n </span>\n )}\n {tab.subtitle && (\n <span className={cx(styles.tabHeaderSubtitle, classNames?.subtitle)} style={slotStyles?.subtitle}>\n {tab.subtitle}\n </span>\n )}\n </div>\n )}\n </InteractableDiv>\n );\n })}\n </div>\n );\n}\n\nexport default TabHeader;\n"],"mappings":"~~iOASA~~,SAAS,EAAU,CACjB,OAAO,CAAC,EACR,aACA,WACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACc,CACjB,OACE,EAAC,MAAD,CACE,GAAI,EACJ,KAAK,UACL,UAAW,EAAG,EAAO,UAAW,GAAY,KAAM,CAAS,EAC3D,MAAO,CAAE,GAAG,GAAY,KAAM,GAAG,CAAM,EAEtC,SAAA,EAAK,IAAK,GAAsB,CAC/B,IAAM,EAAW,EAAI,KAAO,EACtB,EAAY,CAAC,CAAC,EAAI,OAAS,CAAC,CAAC,EAAI,SAEvC,OACE,EAAC,EAAD,CAEE,KAAK,MACL,gBAAe,EACf,gBAAe,EAAI,UAAY,IAAA,GAC/B,SAAU,EAAI,SAAW,GAAK,EAC9B,UAAW,EACT,EAAO,aACP,EAAG,EAAO,oBAAqB,CAAS,EACxC,EAAG,EAAO,sBAAuB,EAAI,QAAS,EAC9C,GAAY,GACd,EACA,MAAO,GAAY,IACnB,YAAe,CACT,EAAI,UAAY,GACpB,EAAS,EAAI,EAAE,CACjB,EAhBF,SAAA,CAkBG,EAAW,EAAI,KAAM,CACpB,UAAW,EAAG,EAAO,cAAe,GAAY,IAAI,EACpD,MAAO,GAAY,IACrB,CAAC,EACA,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,gBAAiB,GAAY,MAAM,EAAG,MAAO,GAAY,OAAnF,SAAA,CACG,EAAI,OACH,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,eAAgB,GAAY,KAAK,EAAG,MAAO,GAAY,MAC/E,SAAA,EAAI,KACD,CAAA,EAEP,EAAI,UACH,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,kBAAmB,GAAY,QAAQ,EAAG,MAAO,GAAY,SACrF,SAAA,EAAI,QACD,CAAA,CAEL,CAEQ,CAAA,CAAA,CAnCV,EAAA,EAAI,EAmCM,CAErB,CAAC,CACE,CAAA,CAET"}
1	+ {"version":3,"file":"tabHeader.mjs","names":[],"sources":["../../../../package/common/tabHeader/tabHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\nimport InteractableDiv from '../interactableDiv';\nimport type { TabHeaderProps, TabHeaderTab } from './tabHeader.types';\n\nimport styles from './tabHeader.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\nfunction TabHeader({\n tabs = [],\n currentTab,\n onChange,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: TabHeaderProps) {\n return (\n <div\n {...rest}\n role='tablist'\n className={cx(styles.tabHeader, classNames?.root, className)}\n style={{ ...slotStyles?.root, ...style }}\n >\n {tabs.map((tab: TabHeaderTab) => {\n const isActive = tab.id === currentTab;\n const hasLabels = !!tab.title \|\| !!tab.subtitle;\n\n return (\n <InteractableDiv\n key={tab.id}\n role='tab'\n aria-selected={isActive}\n aria-disabled={tab.disabled \|\| undefined}\n tabIndex={tab.disabled ? -1 : 0}\n className={cx(\n styles.tabHeaderTab,\n { [styles.tabHeaderTabActive]: isActive },\n { [styles.tabHeaderTabDisabled]: tab.disabled },\n classNames?.tab,\n )}\n style={slotStyles?.tab}\n onClick={() => {\n if (tab.disabled \|\| isActive) return;\n onChange(tab.id);\n }}\n >\n {renderIcon(tab.icon, {\n className: cx(styles.tabHeaderIcon, classNames?.icon),\n style: slotStyles?.icon,\n })}\n {hasLabels && (\n <div className={cx(styles.tabHeaderLabels, classNames?.labels)} style={slotStyles?.labels}>\n {tab.title && (\n <span className={cx(styles.tabHeaderTitle, classNames?.title)} style={slotStyles?.title}>\n {tab.title}\n </span>\n )}\n {tab.subtitle && (\n <span className={cx(styles.tabHeaderSubtitle, classNames?.subtitle)} style={slotStyles?.subtitle}>\n {tab.subtitle}\n </span>\n )}\n </div>\n )}\n </InteractableDiv>\n );\n })}\n </div>\n );\n}\n\nexport default TabHeader;\n"],"mappings":"8OASA,SAAS,EAAU,CACjB,OAAO,CAAC,EACR,aACA,WACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACc,CACjB,OACE,EAAC,MAAD,CACE,GAAI,EACJ,KAAK,UACL,UAAW,EAAG,EAAO,UAAW,GAAY,KAAM,CAAS,EAC3D,MAAO,CAAE,GAAG,GAAY,KAAM,GAAG,CAAM,EAEtC,SAAA,EAAK,IAAK,GAAsB,CAC/B,IAAM,EAAW,EAAI,KAAO,EACtB,EAAY,CAAC,CAAC,EAAI,OAAS,CAAC,CAAC,EAAI,SAEvC,OACE,EAAC,EAAD,CAEE,KAAK,MACL,gBAAe,EACf,gBAAe,EAAI,UAAY,IAAA,GAC/B,SAAU,EAAI,SAAW,GAAK,EAC9B,UAAW,EACT,EAAO,aACP,EAAG,EAAO,oBAAqB,CAAS,EACxC,EAAG,EAAO,sBAAuB,EAAI,QAAS,EAC9C,GAAY,GACd,EACA,MAAO,GAAY,IACnB,YAAe,CACT,EAAI,UAAY,GACpB,EAAS,EAAI,EAAE,CACjB,EAhBF,SAAA,CAkBG,EAAW,EAAI,KAAM,CACpB,UAAW,EAAG,EAAO,cAAe,GAAY,IAAI,EACpD,MAAO,GAAY,IACrB,CAAC,EACA,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,gBAAiB,GAAY,MAAM,EAAG,MAAO,GAAY,OAAnF,SAAA,CACG,EAAI,OACH,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,eAAgB,GAAY,KAAK,EAAG,MAAO,GAAY,MAC/E,SAAA,EAAI,KACD,CAAA,EAEP,EAAI,UACH,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,kBAAmB,GAAY,QAAQ,EAAG,MAAO,GAAY,SACrF,SAAA,EAAI,QACD,CAAA,CAEL,CAEQ,CAAA,CAAA,CAnCV,EAAA,EAAI,EAmCM,CAErB,CAAC,CACE,CAAA,CAET"}

package/dist/esm/common/tabHeader/tabHeader.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e=`tabHeader_C-b9d`,t=`tabHeader-tab_Wbyt-`,n=`tabHeader-tab-active_IExSo`,r=`tabHeader-tab-disabled_yWJxS`,i=`tabHeader-icon_ryEHB`,a=`tabHeader-labels_q5Af5`,o=`tabHeader-title_Jq2Vy`,s=`tabHeader-subtitle_4lhSa`,c={tabHeader:e,"tabHeader-tab":`tabHeader-tab_Wbyt-`,tabHeaderTab:t,"tabHeader-tab-active":`tabHeader-tab-active_IExSo`,tabHeaderTabActive:n,"tabHeader-tab-disabled":`tabHeader-tab-disabled_yWJxS`,tabHeaderTabDisabled:r,"tabHeader-icon":`tabHeader-icon_ryEHB`,tabHeaderIcon:i,"tabHeader-labels":`tabHeader-labels_q5Af5`,tabHeaderLabels:a,"tabHeader-title":`tabHeader-title_Jq2Vy`,tabHeaderTitle:o,"tabHeader-subtitle":`tabHeader-subtitle_4lhSa`,tabHeaderSubtitle:s};export{c as default,e as tabHeader,i as tabHeaderIcon,a as tabHeaderLabels,s as tabHeaderSubtitle,t as tabHeaderTab,n as tabHeaderTabActive,r as tabHeaderTabDisabled,o as tabHeaderTitle};
+"use client";var e=`tabHeader_C-b9d`,t=`tabHeader-tab_Wbyt-`,n=`tabHeader-tab-active_IExSo`,r=`tabHeader-tab-disabled_yWJxS`,i=`tabHeader-icon_ryEHB`,a=`tabHeader-labels_q5Af5`,o=`tabHeader-title_Jq2Vy`,s=`tabHeader-subtitle_4lhSa`,c={tabHeader:e,"tabHeader-tab":`tabHeader-tab_Wbyt-`,tabHeaderTab:t,"tabHeader-tab-active":`tabHeader-tab-active_IExSo`,tabHeaderTabActive:n,"tabHeader-tab-disabled":`tabHeader-tab-disabled_yWJxS`,tabHeaderTabDisabled:r,"tabHeader-icon":`tabHeader-icon_ryEHB`,tabHeaderIcon:i,"tabHeader-labels":`tabHeader-labels_q5Af5`,tabHeaderLabels:a,"tabHeader-title":`tabHeader-title_Jq2Vy`,tabHeaderTitle:o,"tabHeader-subtitle":`tabHeader-subtitle_4lhSa`,tabHeaderSubtitle:s};export{c as default,e as tabHeader,i as tabHeaderIcon,a as tabHeaderLabels,s as tabHeaderSubtitle,t as tabHeaderTab,n as tabHeaderTabActive,r as tabHeaderTabDisabled,o as tabHeaderTitle};
 //# sourceMappingURL=tabHeader.module.mjs.map

package/dist/esm/common/textarea/textarea.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../input/input.mjs";import"react";import{jsx as n}from"react/jsx-runtime";function r(r){return n(t,{...e(`Textarea`,r),multiline:!0})}export{r as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../input/input.mjs";import"react";import{jsx as n}from"react/jsx-runtime";function r(r){return n(t,{...e(`Textarea`,r),multiline:!0})}export{r as default};
 //# sourceMappingURL=textarea.mjs.map

package/dist/esm/common/textarea/textarea.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textarea.mjs","names":[],"sources":["../../../../package/common/textarea/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport Input from 'components/common/input';\nimport { useComponentDefaults } from 'components/common/configProvider';\nimport type { TextareaProps } from './textarea.types';\n\nexport default function Textarea(props: TextareaProps) {\n return <Input {...useComponentDefaults('Textarea', props)} multiline />;\n}\n"],"mappings":"~~0KAKA~~,SAAwB,EAAS,EAAsB,CACrD,OAAO,EAAC,EAAD,CAAO,GAAI,EAAqB,WAAY,CAAK,EAAG,UAAA,EAAW,CAAA,CACxE"}
1	+ {"version":3,"file":"textarea.mjs","names":[],"sources":["../../../../package/common/textarea/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport Input from 'components/common/input';\nimport { useComponentDefaults } from 'components/common/configProvider';\nimport type { TextareaProps } from './textarea.types';\n\nexport default function Textarea(props: TextareaProps) {\n return <Input {...useComponentDefaults('Textarea', props)} multiline />;\n}\n"],"mappings":"uLAKA,SAAwB,EAAS,EAAsB,CACrD,OAAO,EAAC,EAAD,CAAO,GAAI,EAAqB,WAAY,CAAK,EAAG,UAAA,EAAW,CAAA,CACxE"}

package/dist/esm/common/themeProvider/defaultTheme.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={id:`default`,variables:{"--grey":`#8A8A8A`,"--lightgrey":`#e0e0e0`,"--lightergrey":`#B1B1B1`,"--white":`#FFFFFF`,"--red":`#D6002A`,"--lighter-red":`#ffeae9`,"--green":`#287626`,"--lighter-green":`#C4FFC9`,"--blue":`#5873d5`,"--lighter-blue":`#C6DBFF`,"--black":`black`,"--orange":`#ff7f50`,"--lighter-orange":`#ffe5d9`,"--primary-color":`#8184d6`,"--primary-accent":`#90CAF9`,"--primary-lighter":`#9a9ce4`,"--accent-color":`var(--grey)`,"--accent-color-light":`var(--lightgrey)`,"--text-color":`var(--white)`,"--text-dark":`var(--lightergrey)`,"--text-light":`var(--lightergrey)`,"--text-on-primary":`var(--white)`,"--text-on-delete":`var(--white)`,"--border-color":`#656574`,"--focus-border-color":`var(--primary-color)`,"--background":`#393945`,"--background-accent":`#33333c`,"--background-accent-dark":`var(--grey)`,"--background-accent-light":`#484856`,"--background-modal":`#484856`,"--success-color":`var(--green)`,"--success-lighter":`var(--lighter-green)`,"--error-color":`var(--red)`,"--error-lighter":`var(--lighter-red)`,"--required-mark-color":`var(--error-color)`,"--info-color":`var(--blue)`,"--info-lighter":`var(--lighter-blue)`,"--warn-color":`var(--orange)`,"--warn-lighter":`var(--lighter-orange)`,"--default-font-size":`16px`,"--text-small-font-size":`14px`,"--header-font-size":`24px`,"--header-medium-font-size":`18px`,"--header-small-font-size":`16px`,"--default-font-weight":`400`,"--header-font-weight":`600`,"--input-background":`transparent`,"--input-icon-color":`var(--text-color)`,"--error-border-color":`var(--red)`,"--button-default-color":`var(--primary-color)`,"--button-default-border":`1px solid var(--primary-color)`,"--default-border-radius":`8px`,"--padding-sides":`15px`,"--margin-top":`10px`,"--default-font":`'Inter', sans-serif`,"--themed-font":`'Inter', sans-serif`,"--card-shadow":`0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)`,"--background-card-elevated":`var(--background-accent-light)`,"--background-card-outlined":`transparent`,"--background-card-filled":`var(--background-accent)`,"--spacing-s":`4px`,"--spacing-m":`8px`,"--spacing-l":`16px`}};export{e as defaultTheme};
+"use client";var e={id:`default`,variables:{"--grey":`#8A8A8A`,"--lightgrey":`#e0e0e0`,"--lightergrey":`#B1B1B1`,"--white":`#FFFFFF`,"--red":`#D6002A`,"--lighter-red":`#ffeae9`,"--green":`#287626`,"--lighter-green":`#C4FFC9`,"--blue":`#5873d5`,"--lighter-blue":`#C6DBFF`,"--black":`black`,"--orange":`#ff7f50`,"--lighter-orange":`#ffe5d9`,"--primary-color":`#8184d6`,"--primary-accent":`#90CAF9`,"--primary-lighter":`#9a9ce4`,"--accent-color":`var(--grey)`,"--accent-color-light":`var(--lightgrey)`,"--text-color":`var(--white)`,"--text-dark":`var(--lightergrey)`,"--text-light":`var(--lightergrey)`,"--text-on-primary":`var(--white)`,"--text-on-delete":`var(--white)`,"--border-color":`#656574`,"--focus-border-color":`var(--primary-color)`,"--background":`#393945`,"--background-accent":`#33333c`,"--background-accent-dark":`var(--grey)`,"--background-accent-light":`#484856`,"--background-modal":`#484856`,"--success-color":`var(--green)`,"--success-lighter":`var(--lighter-green)`,"--error-color":`var(--red)`,"--error-lighter":`var(--lighter-red)`,"--required-mark-color":`var(--error-color)`,"--info-color":`var(--blue)`,"--info-lighter":`var(--lighter-blue)`,"--warn-color":`var(--orange)`,"--warn-lighter":`var(--lighter-orange)`,"--default-font-size":`16px`,"--text-small-font-size":`14px`,"--header-font-size":`24px`,"--header-medium-font-size":`18px`,"--header-small-font-size":`16px`,"--default-font-weight":`400`,"--header-font-weight":`600`,"--input-background":`transparent`,"--input-icon-color":`var(--text-color)`,"--error-border-color":`var(--red)`,"--button-default-color":`var(--primary-color)`,"--button-default-border":`1px solid var(--primary-color)`,"--default-border-radius":`8px`,"--padding-sides":`15px`,"--margin-top":`10px`,"--default-font":`'Inter', sans-serif`,"--themed-font":`'Inter', sans-serif`,"--card-shadow":`0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)`,"--background-card-elevated":`var(--background-accent-light)`,"--background-card-outlined":`transparent`,"--background-card-filled":`var(--background-accent)`,"--spacing-s":`4px`,"--spacing-m":`8px`,"--spacing-l":`16px`}};export{e as defaultTheme};
 //# sourceMappingURL=defaultTheme.mjs.map