@weasel-js/ui 1.8.0 → 1.8.1

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["isDebugEnabled","ICON_PATHS","ICON_GROUPS","isFillable","ICON_FILLS","Icon","ModeLightIcon","FilterIcon","UngroupIcon","InfoIcon","DistributeVerticalIcon","StepBackIcon","ExpandIcon","TextIcon","ErrorIcon","StopIcon","GridIcon","ZoomInIcon","LayoutRowsIcon","LayersIcon","GroupIcon","ZoomOutIcon","LockIcon","LineIcon","HandIcon","FlipXIcon","UnlockIcon","FlipYIcon","VisibleIcon","ExportIcon","TuneIcon","FullscreenIcon","WarningIcon","ModeDarkIcon","HiddenIcon","DistributeHorizontalIcon","StarIcon","EllipseIcon","StepIcon","LayoutColumnsIcon","LassoIcon","LayoutGridIcon","MeasureIcon","LoupeIcon","ModeAutoIcon","CompareIcon","SendBackwardIcon","AlignLeftIcon","PencilIcon","CutIcon","SnapshotIcon","ArrowIcon","PolygonIcon","BusyIcon","RedoIcon","PageIcon","CheckIcon","RefreshIcon","CollapseIcon","SelectIcon","CloseIcon","SearchIcon","AlignCenterYIcon","PenIcon","FitIcon","UnknownIcon","EyedropperIcon","UndoIcon","BringForwardIcon","RandomizeIcon","CloneIcon","ResetIcon","AlignBottomIcon","PasteIcon","AlignRightIcon","PinIcon","ChevronIcon","RemoveIcon","LinkIcon","AlignCenterXIcon","PauseIcon","AlignTopIcon","PlayIcon","AddIcon","PanIcon","BringToFrontIcon","RectIcon","CopyIcon","SendToBackIcon","DuplicateIcon","StepForwardIcon","DeleteIcon","SortIcon","CrosshairIcon","SnapIcon","ImageIcon","solidColorOf","strokeColorOf","useOverlayPortal","nearestPortalHost","useAssignedPortalContainer","OverlayPortalProvider","Tooltip","TooltipTrigger","Focusable","keyGlyph","formatShortcutParts","formatShortcut","ActionBar","EDGE_PROFILES","Badge","useStance","BADGE_STATUS_ICONS","Button","CloseButton","Code","useReorderDragList","DisclosureMark","DisclosureRow","Disclosure","DataGrid","DetailRow","DetailList","DragGhost","DragGrip","detectPlatform","inferKeycapKind","KeySequence","keySpecFromKey","KeyCap","keySpecsFromMods","keySpecsFromShortcut","stepDecimals","plotToModel","niceTicks","formatTick","tickDecimals","niceStep","modelToPlot","Plot2D","sampleByInterpolation","functionLayerState","CurveEditor","createFunctionLayer","createSetCurveOp","LayeredCurveEditor","createKeyframeLayer","keyframeLayerState","applyKeyframeDrag","handleHalf","handleSize","HANDLE_SIZE_TOKENS","snapToNearest","CurveField","PropertyGroup","DialogRow","Subpanel","Dialog","PropertyList","PropertyRow","PropertyHelp","PropertySpan","PropertyField","PropertyNote","PropertyPanel","PropertyControl","createRecentColorsStore","useRecordRecentColor","useRecentColors","normalizeRecentColor","useRecentColorsStore","RecentColorsProvider","InlineRange","ColorField","SelectItem","SelectSection","Select","FontFamilySelect","fontWeightLabel","FontWeightSelect","Input","paintPreviewCss","Slider","ToggleBar","useRovingTabIndex","useFitScope","FitScope","labelForms","FitLabel","MeshEditor","isMeshPaint","MeshHandles","paintGradientTrack","GradientHandles","GradientEditor","SceneGradientHandles","NumberField","UnitField","seedPattern","PatternPicker","PaintInput","PaintField","fieldClasses","Field","RadioGroup","Radio","Switch","LayerList","moveLayers","useSceneLayerList","ItemList","ListEditor","ColorModeControl","ThemeSwitcher","COLOR_MODE_OPTIONS","OptionsBar","ButtonBar","prefRailItems","prefDisplayBounds","filterPrefSubtree","prefValueAtPath","isPrefLeaf","visiblePrefSubtree","prefFieldProps","effectiveSections","setAtPath","aggregateValue","kindBreakdown","classifyKind","nodeValueAt","MIXED","ToolOptionsBar","FillStrokeSwatch","SwatchGrid","STANDARD_PALETTE","BUILTIN_PALETTES","describeColor","BASIC_PALETTE","SwatchStrip","Powerline","gestureRouteSegments","GestureRoute","FallthroughDiagram","pickActiveSection","PrefsPane","PrefsForm","useScrollSpy","PrefsRail","PrefsDialog","SelectionPanel","ResizeHandle","Sidebar","SidebarPanel","StatusBarItem","StatusBarSpacer","StatusBar","ToolButton","ToolGroup","ToolPalette","Checkbox","Tabs","TabList","TabPanel","Tab","filterTree","treeBranchIds","Tree","MenuButton","ComboBoxItem","ComboBox","RangeSlider","DetentSlider","DialogTrigger","Callout","toast","defaultToastQueue","ToastQueue","createToastQueue","ToastRegion","PointPlotter","tokenCategory","refitScale","TOKEN_CATEGORIES","inferTokenType","TokenPanel","linearScale","logScale","BandEditor","Jog","EasingPicker","easingLabel","Transport","sampleEasing","Timeline","EASING_NAMES","samePath","easingBezier","AnimatedTimeline","oklchToHex","oklchDegToHex","chromaAt","lo","hi","curve","L","rgb","r","g","b","hexToRgba","hex","rampColor","options","a","from","to","rgbaToHex","interpolateSrgb","t","space","hue","chroma","s","hexToOklchDeg","H","colorRamp","steps","i","useAsyncOptions","inputValue","setInputValue","useState","setOptions","isLoading","setIsLoading","loadError","setLoadError","loadRef","useLatest","load","issued","useRef","applied","inFlight","useEffect","minLength","timer","mine","controller","next","error","debounceMs","useCallback","dlog"],"sources":["../src/color/oklch.ts","../src/color/ramp.ts","../src/useAsyncOptions.ts"],"sourcesContent":["// OKLCH math from Björn Ottosson: https://bottosson.github.io/posts/oklab/\nimport { oklchDegToHex } from '@weasel-js/core';\n\n/**\n * A chroma envelope over lightness, as three linear segments: flat at `cBot`\n * below `lRange[0]`, rising to `cPeak` at `midL`, falling to `cTop` at\n * `lRange[1]`, flat beyond. Keeps a color ramp inside gamut at the light and\n * dark ends while staying saturated through the middle.\n */\nexport type ChromaCurve = {\n  lRange: [number, number];\n  midL: number;\n  cBot: number;\n  cPeak: number;\n  cTop: number;\n};\n\n/** A single lightness/chroma sample. */\nexport type ChromaCurvePoint = { L: number; C: number };\n\n/**\n * Converts an OKLCH color to a gamut-clipped `#rrggbb` string. Hue is in\n * degrees, unlike the kit's OKLab helpers which take radians.\n */\nexport const oklchToHex = oklchDegToHex;\n\n/** Evaluates a {@link ChromaCurve} at a lightness, clamping outside its range. */\nexport function chromaAt(L: number, curve: ChromaCurve): number {\n  const [lo, hi] = curve.lRange;\n  if (L <= lo) return curve.cBot;\n  if (L >= hi) return curve.cTop;\n  if (L <= curve.midL) return curve.cBot + (curve.cPeak - curve.cBot) * ((L - lo) / (curve.midL - lo));\n  return curve.cPeak + (curve.cTop - curve.cPeak) * ((L - curve.midL) / (hi - curve.midL));\n}\n","import {\n  hexToOklchDeg,\n  hexToRgba,\n  interpolateSrgb,\n  rgbaToHex,\n  type ColorInterpolationSpace,\n  type HueInterpolation,\n} from '@weasel-js/core';\nimport { chromaAt, oklchToHex, type ChromaCurve } from './oklch';\n\n/**\n * How {@link rampColor} and {@link colorRamp} travel between two endpoints.\n *\n * What each space interpolates:\n *\n * | `space`         | components lerped            | hue                  |\n * | --------------- | ---------------------------- | -------------------- |\n * | `'oklch'`       | L, C, H                      | around the wheel     |\n * | `'hsl'`         | H, S, L                      | around the wheel     |\n * | `'oklab'`       | L, a, b                      | through the wheel    |\n * | `'srgb'`        | gamma-encoded R, G, B        | through the wheel    |\n * | `'srgb-linear'` | linear-light R, G, B         | through the wheel    |\n *\n * A lightness ramp is two endpoints that differ in lightness, and a hue ramp\n * two that differ in hue: the polar spaces keep chroma or saturation fixed\n * while they move, and the others cut a straight line between the two colors,\n * which for a hue ramp passes through gray.\n *\n * `chroma` is an OKLCH envelope in every space, since {@link ChromaCurve}'s\n * numbers are OKLCH chroma over OKLCH lightness. It runs after the\n * interpolation: each sample keeps its lightness and hue, and its chroma is\n * replaced with the curve's value at that lightness. A sample left with no\n * hue (a gray midpoint) takes the hue an OKLCH ramp would have had there.\n */\nexport interface ColorRampOptions {\n  /** Default `'oklch'`. */\n  space?: ColorInterpolationSpace;\n  /** Polar spaces only. Default `'shorter'`. */\n  hue?: HueInterpolation;\n  chroma?: ChromaCurve;\n}\n\nconst rgb = (hex: string): [number, number, number] => {\n  const [r, g, b] = hexToRgba(hex);\n  return [r, g, b];\n};\n\n/** One sample of a ramp from `from` to `to` (`#rrggbb`), `t` in 0..1. */\nexport function rampColor(from: string, to: string, t: number, options: ColorRampOptions = {}): string {\n  const { space = 'oklch', hue = 'shorter', chroma } = options;\n  const a = rgb(from);\n  const b = rgb(to);\n  const hex = rgbaToHex(interpolateSrgb(a, b, t, space, hue));\n  if (!chroma) return hex;\n  const s = hexToOklchDeg(hex);\n  const H = s.C > 1e-4 ? s.H : hexToOklchDeg(rgbaToHex(interpolateSrgb(a, b, t, 'oklch', hue))).H;\n  return oklchToHex(s.L, chromaAt(s.L, chroma), H);\n}\n\n/** `steps` evenly spaced samples from `from` to `to`, both ends included. */\nexport function colorRamp(from: string, to: string, steps: number, options: ColorRampOptions = {}): string[] {\n  if (steps <= 1) return steps === 1 ? [rampColor(from, to, 0, options)] : [];\n  return Array.from({ length: steps }, (_, i) => rampColor(from, to, i / (steps - 1), options));\n}\n","import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useLatest } from '@weasel-js/core';\nimport type { ComboBoxOption } from './components/ComboBox/ComboBox';\n\ntype Key = string | number;\n\n/** An option list keyed to the value type its combo box commits. */\nexport type AsyncOption<T extends Key> = ComboBoxOption & { value: T };\n\n/** Options for {@link useAsyncOptions}. */\nexport type UseAsyncOptionsProps<T extends Key> = {\n  /**\n   * Fetches the options for a query. The signal aborts when a later keystroke\n   * supersedes this call, so a `fetch` should forward it.\n   */\n  load: (query: string, signal: AbortSignal) => Promise<ReadonlyArray<AsyncOption<T>>>;\n  /** Quiet period before a query is sent. */\n  debounceMs?: number;\n  /** Shorter queries are not sent, and empty the options. */\n  minLength?: number;\n};\n\n/** What {@link useAsyncOptions} returns, shaped to spread into a `ComboBox`. */\nexport type AsyncOptionsResult<T extends Key> = {\n  options: ReadonlyArray<AsyncOption<T>>;\n  isLoading: boolean;\n  loadError: unknown | null;\n  inputValue: string;\n  onInputChange: (next: string) => void;\n};\n\n/**\n * Drives a combo box whose options come from a server: debounces the query,\n * discards responses overtaken by a later one, and reports a failed load\n * separately from an empty result.\n *\n * `options` holds the last *resolved* list and is never emptied to mean\n * \"working\", so the previous results stay on screen — and stay arrowable —\n * while the next request is in flight.\n */\nexport function useAsyncOptions<T extends Key = string>({\n  load,\n  debounceMs = 150,\n  minLength = 0,\n}: UseAsyncOptionsProps<T>): AsyncOptionsResult<T> {\n  const [inputValue, setInputValue] = useState('');\n  const [options, setOptions] = useState<ReadonlyArray<AsyncOption<T>>>([]);\n  const [isLoading, setIsLoading] = useState(false);\n  const [loadError, setLoadError] = useState<unknown | null>(null);\n\n  // Read through a ref: a consumer passing an inline arrow re-creates `load`\n  // every render, and depending on it directly would refire the request.\n  const loadRef = useLatest(load);\n\n  // A monotonic id per request, and the highest one whose result has been\n  // applied. A liveness flag cannot do this job: two requests from adjacent\n  // keystrokes are both live, so the slower one overwrites the newer result\n  // if it lands second.\n  const issued = useRef(0);\n  const applied = useRef(0);\n  const inFlight = useRef<AbortController | null>(null);\n\n  useEffect(() => {\n    if (inputValue.length < minLength) {\n      inFlight.current?.abort();\n      inFlight.current = null;\n      applied.current = issued.current;\n      setOptions([]);\n      setIsLoading(false);\n      setLoadError(null);\n      return;\n    }\n\n    const timer = setTimeout(() => {\n      const mine = ++issued.current;\n      const controller = new AbortController();\n      inFlight.current?.abort();\n      inFlight.current = controller;\n      setIsLoading(true);\n\n      loadRef.current(inputValue, controller.signal).then(\n        (next) => {\n          if (mine <= applied.current) return;\n          applied.current = mine;\n          setOptions(next);\n          setLoadError(null);\n          setIsLoading(false);\n        },\n        (error: unknown) => {\n          if (controller.signal.aborted || mine <= applied.current) return;\n          applied.current = mine;\n          setLoadError(error);\n          setIsLoading(false);\n        },\n      );\n    }, debounceMs);\n\n    return () => clearTimeout(timer);\n  }, [inputValue, debounceMs, minLength, loadRef]);\n\n  useEffect(() => () => inFlight.current?.abort(), []);\n\n  const onInputChange = useCallback((next: string) => setInputValue(next), []);\n\n  return { options, isLoading, loadError, inputValue, onInputChange };\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["isDebugEnabled","ICON_PATHS","ICON_GROUPS","isFillable","ICON_FILLS","Icon","MeasureIcon","FilterIcon","TextIcon","HandIcon","DistributeVerticalIcon","SnapshotIcon","ExpandIcon","StepForwardIcon","ErrorIcon","StepBackIcon","FlipXIcon","UnlockIcon","LayersIcon","ImageIcon","FlipYIcon","VisibleIcon","LayoutRowsIcon","LayoutColumnsIcon","FullscreenIcon","WarningIcon","FitFillIcon","UndoIcon","FitIcon","UngroupIcon","ExportIcon","StepIcon","FitStretchIcon","UnknownIcon","LoupeIcon","GridIcon","ZoomInIcon","DistributeHorizontalIcon","SnapIcon","EllipseIcon","StarIcon","InfoIcon","HiddenIcon","LassoIcon","LinkIcon","LineIcon","LockIcon","CompareIcon","ResetIcon","AlignLeftIcon","PasteIcon","CutIcon","SendBackwardIcon","ArrowIcon","PencilIcon","BusyIcon","PolygonIcon","ModeAutoIcon","CheckIcon","RandomizeIcon","CollapseIcon","RemoveIcon","CloseIcon","RefreshIcon","AlignCenterYIcon","PanIcon","FitContainIcon","TuneIcon","EyedropperIcon","StopIcon","BringForwardIcon","PinIcon","CloneIcon","RedoIcon","AlignBottomIcon","ModeLightIcon","AlignRightIcon","PauseIcon","ChevronIcon","RectIcon","LayoutGridIcon","AlignCenterXIcon","PageIcon","AlignTopIcon","PenIcon","AddIcon","ModeDarkIcon","BringToFrontIcon","PlayIcon","CopyIcon","SearchIcon","DuplicateIcon","SortIcon","DeleteIcon","SendToBackIcon","CrosshairIcon","SelectIcon","GroupIcon","ZoomOutIcon","solidColorOf","strokeColorOf","useOverlayPortal","nearestPortalHost","useAssignedPortalContainer","OverlayPortalProvider","Tooltip","TooltipTrigger","Focusable","keyGlyph","formatShortcutParts","formatShortcut","ActionBar","EDGE_PROFILES","Badge","useStance","BADGE_STATUS_ICONS","BADGE_VARIANT_ICONS","Button","BUTTON_VARIANT_ICONS","CloseButton","Code","CODE_VARIANT_ICONS","useReorderDragList","DisclosureMark","DisclosureRow","Disclosure","DataGrid","DetailRow","DetailList","DragGhost","DragGrip","inferKeycapKind","keySpecsFromMods","KeyCap","keySpecsFromShortcut","detectPlatform","KeySequence","keySpecFromKey","KEYCAP_VARIANT_ICONS","stepDecimals","plotToModel","niceTicks","formatTick","tickDecimals","niceStep","modelToPlot","Plot2D","sampleByInterpolation","functionLayerState","CurveEditor","createFunctionLayer","createSetCurveOp","LayeredCurveEditor","createKeyframeLayer","keyframeLayerState","applyKeyframeDrag","handleHalf","handleSize","HANDLE_SIZE_TOKENS","snapToNearest","CurveField","PropertyGroup","DialogRow","Subpanel","Dialog","PropertyList","PropertyRow","PropertyHelp","PropertySpan","PropertyField","PropertyNote","PropertyPanel","PropertyControl","createRecentColorsStore","useRecordRecentColor","useRecentColors","normalizeRecentColor","useRecentColorsStore","RecentColorsProvider","InlineRange","ColorField","SelectItem","SelectSection","Select","FontFamilySelect","fontWeightLabel","FontWeightSelect","Input","paintPreviewCss","Slider","ToggleBar","useRovingTabIndex","useFitScope","FitScope","labelForms","FitLabel","TOGGLE_BAR_VARIANT_ICONS","MeshEditor","isMeshPaint","MeshHandles","paintGradientTrack","GradientHandles","GradientEditor","SceneGradientHandles","NumberField","UnitField","seedPattern","PatternPicker","PaintInput","PaintField","fieldClasses","Field","RadioGroup","Radio","Switch","LayerList","moveLayers","useSceneLayerList","ItemList","ListEditor","ColorModeControl","ThemeSwitcher","COLOR_MODE_OPTIONS","OptionsBar","OPTIONS_BAR_VARIANT_ICONS","ButtonBar","BUTTON_BAR_VARIANT_ICONS","prefRailItems","prefDisplayBounds","filterPrefSubtree","prefValueAtPath","isPrefLeaf","visiblePrefSubtree","prefFieldProps","effectiveSections","setAtPath","aggregateValue","kindBreakdown","classifyKind","nodeValueAt","MIXED","ToolOptionsBar","FillStrokeSwatch","SwatchGrid","STANDARD_PALETTE","BUILTIN_PALETTES","describeColor","BASIC_PALETTE","SwatchStrip","Powerline","gestureRouteSegments","GestureRoute","FallthroughDiagram","pickActiveSection","PrefsPane","PrefsForm","useScrollSpy","PrefsRail","PrefsDialog","SelectionPanel","ResizeHandle","Sidebar","SidebarPanel","StatusBarItem","StatusBarSpacer","StatusBar","ToolButton","ToolGroup","ToolPalette","Checkbox","Tabs","TabList","TabPanel","Tab","filterTree","treeBranchIds","Tree","MenuButton","ComboBoxItem","ComboBox","RangeSlider","DetentSlider","DialogTrigger","Callout","toast","defaultToastQueue","ToastQueue","createToastQueue","ToastRegion","PointPlotter","tokenCategory","refitScale","TOKEN_CATEGORIES","inferTokenType","TokenPanel","linearScale","logScale","BandEditor","Jog","EasingPicker","easingLabel","Transport","sampleEasing","Timeline","EASING_NAMES","samePath","easingBezier","AnimatedTimeline","oklchToHex","oklchDegToHex","chromaAt","lo","hi","curve","L","rgb","r","g","b","hexToRgba","hex","rampColor","options","a","from","to","rgbaToHex","interpolateSrgb","t","space","hue","chroma","s","hexToOklchDeg","H","colorRamp","steps","i","useAsyncOptions","inputValue","setInputValue","useState","setOptions","isLoading","setIsLoading","loadError","setLoadError","loadRef","useLatest","load","issued","useRef","applied","inFlight","useEffect","minLength","timer","mine","controller","next","error","debounceMs","useCallback","dlog"],"sources":["../src/color/oklch.ts","../src/color/ramp.ts","../src/useAsyncOptions.ts"],"sourcesContent":["// OKLCH math from Björn Ottosson: https://bottosson.github.io/posts/oklab/\nimport { oklchDegToHex } from '@weasel-js/core';\n\n/**\n * A chroma envelope over lightness, as three linear segments: flat at `cBot`\n * below `lRange[0]`, rising to `cPeak` at `midL`, falling to `cTop` at\n * `lRange[1]`, flat beyond. Keeps a color ramp inside gamut at the light and\n * dark ends while staying saturated through the middle.\n */\nexport type ChromaCurve = {\n  lRange: [number, number];\n  midL: number;\n  cBot: number;\n  cPeak: number;\n  cTop: number;\n};\n\n/** A single lightness/chroma sample. */\nexport type ChromaCurvePoint = { L: number; C: number };\n\n/**\n * Converts an OKLCH color to a gamut-clipped `#rrggbb` string. Hue is in\n * degrees, unlike the kit's OKLab helpers which take radians.\n */\nexport const oklchToHex = oklchDegToHex;\n\n/** Evaluates a {@link ChromaCurve} at a lightness, clamping outside its range. */\nexport function chromaAt(L: number, curve: ChromaCurve): number {\n  const [lo, hi] = curve.lRange;\n  if (L <= lo) return curve.cBot;\n  if (L >= hi) return curve.cTop;\n  if (L <= curve.midL) return curve.cBot + (curve.cPeak - curve.cBot) * ((L - lo) / (curve.midL - lo));\n  return curve.cPeak + (curve.cTop - curve.cPeak) * ((L - curve.midL) / (hi - curve.midL));\n}\n","import {\n  hexToOklchDeg,\n  hexToRgba,\n  interpolateSrgb,\n  rgbaToHex,\n  type ColorInterpolationSpace,\n  type HueInterpolation,\n} from '@weasel-js/core';\nimport { chromaAt, oklchToHex, type ChromaCurve } from './oklch';\n\n/**\n * How {@link rampColor} and {@link colorRamp} travel between two endpoints.\n *\n * What each space interpolates:\n *\n * | `space`         | components lerped            | hue                  |\n * | --------------- | ---------------------------- | -------------------- |\n * | `'oklch'`       | L, C, H                      | around the wheel     |\n * | `'hsl'`         | H, S, L                      | around the wheel     |\n * | `'oklab'`       | L, a, b                      | through the wheel    |\n * | `'srgb'`        | gamma-encoded R, G, B        | through the wheel    |\n * | `'srgb-linear'` | linear-light R, G, B         | through the wheel    |\n *\n * A lightness ramp is two endpoints that differ in lightness, and a hue ramp\n * two that differ in hue: the polar spaces keep chroma or saturation fixed\n * while they move, and the others cut a straight line between the two colors,\n * which for a hue ramp passes through gray.\n *\n * `chroma` is an OKLCH envelope in every space, since {@link ChromaCurve}'s\n * numbers are OKLCH chroma over OKLCH lightness. It runs after the\n * interpolation: each sample keeps its lightness and hue, and its chroma is\n * replaced with the curve's value at that lightness. A sample left with no\n * hue (a gray midpoint) takes the hue an OKLCH ramp would have had there.\n */\nexport interface ColorRampOptions {\n  /** Default `'oklch'`. */\n  space?: ColorInterpolationSpace;\n  /** Polar spaces only. Default `'shorter'`. */\n  hue?: HueInterpolation;\n  chroma?: ChromaCurve;\n}\n\nconst rgb = (hex: string): [number, number, number] => {\n  const [r, g, b] = hexToRgba(hex);\n  return [r, g, b];\n};\n\n/** One sample of a ramp from `from` to `to` (`#rrggbb`), `t` in 0..1. */\nexport function rampColor(from: string, to: string, t: number, options: ColorRampOptions = {}): string {\n  const { space = 'oklch', hue = 'shorter', chroma } = options;\n  const a = rgb(from);\n  const b = rgb(to);\n  const hex = rgbaToHex(interpolateSrgb(a, b, t, space, hue));\n  if (!chroma) return hex;\n  const s = hexToOklchDeg(hex);\n  const H = s.C > 1e-4 ? s.H : hexToOklchDeg(rgbaToHex(interpolateSrgb(a, b, t, 'oklch', hue))).H;\n  return oklchToHex(s.L, chromaAt(s.L, chroma), H);\n}\n\n/** `steps` evenly spaced samples from `from` to `to`, both ends included. */\nexport function colorRamp(from: string, to: string, steps: number, options: ColorRampOptions = {}): string[] {\n  if (steps <= 1) return steps === 1 ? [rampColor(from, to, 0, options)] : [];\n  return Array.from({ length: steps }, (_, i) => rampColor(from, to, i / (steps - 1), options));\n}\n","import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useLatest } from '@weasel-js/core';\nimport type { ComboBoxOption } from './components/ComboBox/ComboBox';\n\ntype Key = string | number;\n\n/** An option list keyed to the value type its combo box commits. */\nexport type AsyncOption<T extends Key> = ComboBoxOption & { value: T };\n\n/** Options for {@link useAsyncOptions}. */\nexport type UseAsyncOptionsProps<T extends Key> = {\n  /**\n   * Fetches the options for a query. The signal aborts when a later keystroke\n   * supersedes this call, so a `fetch` should forward it.\n   */\n  load: (query: string, signal: AbortSignal) => Promise<ReadonlyArray<AsyncOption<T>>>;\n  /** Quiet period before a query is sent. */\n  debounceMs?: number;\n  /** Shorter queries are not sent, and empty the options. */\n  minLength?: number;\n};\n\n/** What {@link useAsyncOptions} returns, shaped to spread into a `ComboBox`. */\nexport type AsyncOptionsResult<T extends Key> = {\n  options: ReadonlyArray<AsyncOption<T>>;\n  isLoading: boolean;\n  loadError: unknown | null;\n  inputValue: string;\n  onInputChange: (next: string) => void;\n};\n\n/**\n * Drives a combo box whose options come from a server: debounces the query,\n * discards responses overtaken by a later one, and reports a failed load\n * separately from an empty result.\n *\n * `options` holds the last *resolved* list and is never emptied to mean\n * \"working\", so the previous results stay on screen — and stay arrowable —\n * while the next request is in flight.\n */\nexport function useAsyncOptions<T extends Key = string>({\n  load,\n  debounceMs = 150,\n  minLength = 0,\n}: UseAsyncOptionsProps<T>): AsyncOptionsResult<T> {\n  const [inputValue, setInputValue] = useState('');\n  const [options, setOptions] = useState<ReadonlyArray<AsyncOption<T>>>([]);\n  const [isLoading, setIsLoading] = useState(false);\n  const [loadError, setLoadError] = useState<unknown | null>(null);\n\n  // Read through a ref: a consumer passing an inline arrow re-creates `load`\n  // every render, and depending on it directly would refire the request.\n  const loadRef = useLatest(load);\n\n  // A monotonic id per request, and the highest one whose result has been\n  // applied. A liveness flag cannot do this job: two requests from adjacent\n  // keystrokes are both live, so the slower one overwrites the newer result\n  // if it lands second.\n  const issued = useRef(0);\n  const applied = useRef(0);\n  const inFlight = useRef<AbortController | null>(null);\n\n  useEffect(() => {\n    if (inputValue.length < minLength) {\n      inFlight.current?.abort();\n      inFlight.current = null;\n      applied.current = issued.current;\n      setOptions([]);\n      setIsLoading(false);\n      setLoadError(null);\n      return;\n    }\n\n    const timer = setTimeout(() => {\n      const mine = ++issued.current;\n      const controller = new AbortController();\n      inFlight.current?.abort();\n      inFlight.current = controller;\n      setIsLoading(true);\n\n      loadRef.current(inputValue, controller.signal).then(\n        (next) => {\n          if (mine <= applied.current) return;\n          applied.current = mine;\n          setOptions(next);\n          setLoadError(null);\n          setIsLoading(false);\n        },\n        (error: unknown) => {\n          if (controller.signal.aborted || mine <= applied.current) return;\n          applied.current = mine;\n          setLoadError(error);\n          setIsLoading(false);\n        },\n      );\n    }, debounceMs);\n\n    return () => clearTimeout(timer);\n  }, [inputValue, debounceMs, minLength, loadRef]);\n\n  useEffect(() => () => inFlight.current?.abort(), []);\n\n  const onInputChange = useCallback((next: string) => setInputValue(next), []);\n\n  return { options, isLoading, loadError, inputValue, onInputChange };\n}\n"],"mappings":"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"}

package/dist/overlays/portalHost.d.ts

@@ -49,13 +49,19 @@ export interface OverlayPortalTarget {
  * never read — a failure that shows up as an unthemed overlay, not an error.
  *
  * Render `anchor` at the component's own position in the tree — outside the
- * portal — and spread `portalProps` onto the React Aria overlay. The anchor
- * is what "nearest themed ancestor" is measured from; the first render has
- * none yet, so an overlay that mounts already open lands in its host on the
- * following render, before paint.
+ * portal — and spread `portalProps` onto the React Aria overlay. Render the
+ * overlay only once `ready` is true.
+ *
+ * The anchor is what "nearest themed ancestor" is measured from, and the
+ * first render has none yet. An overlay rendered then would portal into the
+ * body and move on the next render, but React Aria hides everything outside
+ * it on the first mount — so a modal that mounted open left the app root
+ * `inert` with itself now inside it. `ready` turns true on that next render,
+ * still before paint.
  */
 export declare function useOverlayPortal(explicit?: Element | null): {
     anchor: ReactElement;
     portalProps: OverlayPortalTarget;
+    ready: boolean;
 };
 //# sourceMappingURL=portalHost.d.ts.map

package/dist/overlays/portalHost.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"portalHost.d.ts","sourceRoot":"","sources":["../../src/overlays/portalHost.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAW/F;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,WAAW,GAAG,IAAI,CAEtF;AAKD,+CAA+C;AAC/C,MAAM,WAAW,0BAA0B;IACzC,2EAA2E;IAC3E,SAAS,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,0BAA0B,+BAIxF;AAED;;;;GAIG;AACH,wBAAgB,0BAA0B,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,CAGhG;AAED,+DAA+D;AAC/D,MAAM,WAAW,kBAAkB;IACjC;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;CAClC;AAED,mEAAmE;AACnE,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,0BAA0B,CAAC,CAAC;AAEzE;4EAC4E;AAC5E,MAAM,WAAW,mBAAmB;IAClC,wBAAwB,EAAE,OAAO,GAAG,SAAS,CAAC;CAC/C;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,GAAG;IAC3D,MAAM,EAAE,YAAY,CAAC;IACrB,WAAW,EAAE,mBAAmB,CAAC;CAClC,CASA"}
+{"version":3,"file":"portalHost.d.ts","sourceRoot":"","sources":["../../src/overlays/portalHost.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAW/F;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,WAAW,GAAG,IAAI,CAEtF;AAKD,+CAA+C;AAC/C,MAAM,WAAW,0BAA0B;IACzC,2EAA2E;IAC3E,SAAS,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,0BAA0B,+BAIxF;AAED;;;;GAIG;AACH,wBAAgB,0BAA0B,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,CAGhG;AAED,+DAA+D;AAC/D,MAAM,WAAW,kBAAkB;IACjC;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;CAClC;AAED,mEAAmE;AACnE,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,0BAA0B,CAAC,CAAC;AAEzE;4EAC4E;AAC5E,MAAM,WAAW,mBAAmB;IAClC,wBAAwB,EAAE,OAAO,GAAG,SAAS,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,GAAG;IAC3D,MAAM,EAAE,YAAY,CAAC;IACrB,WAAW,EAAE,mBAAmB,CAAC;IACjC,KAAK,EAAE,OAAO,CAAC;CAChB,CAUA"}