@robert-stackflow/oneui 0.0.0-stage → 0.2.0

package/components/index.d.ts

@@ -0,0 +1,152 @@
+export { Badge } from "./Badge";
+export { Button } from "./Button";
+export { Checkbox } from "./Checkbox";
+export { ColorField } from "./ColorField";
+export { DatePicker } from "./DatePicker";
+export { Dialog } from "./Dialog";
+export { EmptyState } from "./EmptyState";
+export { FileDropZone } from "./FileDropZone";
+export { FilePicker } from "./FilePicker";
+export { IconButton } from "./IconButton";
+export { Input } from "./Input";
+export { MultiSelect } from "./MultiSelect";
+export { NumberInput } from "./NumberInput";
+export { Page } from "./Page";
+export { Popover } from "./Popover";
+export { Progress } from "./Progress";
+export { SearchField } from "./SearchField";
+export { Section } from "./Section";
+export { Segmented } from "./Segmented";
+export { Select } from "./Select";
+export { SettingRow } from "./SettingRow";
+export { Skeleton } from "./Skeleton";
+export { SkeletonRows } from "./SkeletonRows";
+export { Switch } from "./Switch";
+export { ToastProvider } from "./ToastProvider";
+export { Tooltip } from "./Tooltip";
+export type { SelectOption } from "./types";
+export { FileDropOverlay } from "./FileDropOverlay";
+export { DisclosureChevron } from "./DisclosureChevron";
+export { ColorPicker } from "./ColorPicker";
+export { Textarea } from "./Textarea";
+export { ThemePicker } from "./ThemePicker";
+export { Toast } from "./Toast";
+export { SplitButton } from "./SplitButton";
+export { Calendar } from "./Calendar";
+export { TimeColumns } from "./TimeColumns";
+export { RadioGroup } from "./RadioGroup";
+export { Slider } from "./Slider";
+export { Accordion } from "./Accordion";
+export type { ToastOptions, ToastAction, ToastTone, ToastMessage, } from "./ToastProvider";
+export { useToast } from "./ToastProvider";
+export type { DatePickerMode } from "./DatePicker";
+export type { SplitButtonItem } from "./SplitButton";
+export { Divider } from "./Divider";
+export { CatalogIcon } from "./CatalogIcon";
+export { CharacterPicker } from "./CharacterPicker";
+export { DataTable } from "./DataTable";
+export { EmojiPicker } from "./EmojiPicker";
+export { FileTree } from "./FileTree";
+export { IconPicker } from "./IconPicker";
+export { LoadingOverlay } from "./LoadingOverlay";
+export { LoadingState } from "./LoadingState";
+export { Pagination } from "./Pagination";
+export { Placeholder } from "./Placeholder";
+export { ShortcutInput } from "./ShortcutInput";
+export { Spinner } from "./Spinner";
+export { SymbolPicker } from "./SymbolPicker";
+export { TableColumnFilter } from "./TableColumnFilter";
+export type { FileTreeNode } from "./FileTree";
+export type { TableColumn } from "./DataTable";
+export type { CharacterGroup } from "./CharacterPicker";
+export { SelectTrigger } from "./SelectTrigger";
+export { BlockedTab } from "./BlockedTab";
+export { UnderlinedTab } from "./UnderlinedTab";
+export { Indicator } from "./Indicator";
+export type { IndicatorItem, IndicatorGroup } from "./Indicator";
+export type { TabOption } from "./useTabIndicator";
+export { VirtualPickerList } from "./VirtualPickerList";
+export { SkinTonePicker } from "./SkinTonePicker";
+export type { PickerCatalogItem, PickerCatalogGroup, } from "./VirtualPickerList";
+export { ContextMenu } from "./ContextMenu";
+export { ContextMenuPanel } from "./ContextMenuPanel";
+export { SelectOptionContent } from "./SelectOptionContent";
+export type { ContextMenuItem, MenuAction } from "./menuTypes";
+export { MenuItem } from "./MenuItem";
+export type { MenuItemProps } from "./MenuItem";
+export { Form } from "./Form";
+export { FormField } from "./FormField";
+export { FieldLabel } from "./FieldLabel";
+export { FormGroup } from "./FormGroup";
+export { FormErrorSummary } from "./FormErrorSummary";
+export { useFormState } from "./useFormState";
+export type { FormController, FormRules, FieldRule } from "./useFormState";
+export { PinInput } from "./PinInput";
+export { ContributionCalendar } from "./ContributionCalendar";
+export type { ContributionDay } from "./contribution";
+export { Combobox, type ComboboxProps } from "./Combobox";
+export { TagInput } from "./TagInput";
+export { PasswordField } from "./PasswordField";
+export { Alert } from "./Alert";
+export { Drawer } from "./Drawer";
+export type { DrawerProps, DrawerPlacement } from "./Drawer";
+export { Steps } from "./Steps";
+export type { StepsProps, StepItem, StepStatus } from "./Steps";
+export { Breadcrumb } from "./Breadcrumb";
+export type { BreadcrumbProps, BreadcrumbItem } from "./Breadcrumb";
+export { Avatar } from "./Avatar";
+export type { AvatarProps, AvatarStatus } from "./Avatar";
+export { AvatarGroup } from "./AvatarGroup";
+export type { AvatarGroupProps, AvatarGroupItem } from "./AvatarGroup";
+export { CommandPalette } from "./CommandPalette";
+export type { CommandPaletteProps, CommandPaletteItem } from "./CommandPalette";
+export { ResizablePanel } from "./ResizablePanel";
+export type { ResizablePanelProps } from "./ResizablePanel";
+export { DateRangePicker } from "./DateRangePicker";
+export type { DateRangePickerProps } from "./DateRangePicker";
+export type { DatePickerProps, SingleDatePickerProps } from "./DatePicker";
+export type { DateRange, DateConstraints } from "./dateConstraints";
+export { validateFiles, formatFileSize } from "./fileSelection";
+export type { FileConstraints, FileRejection, FileSelectionResult, } from "./fileSelection";
+export type { FilePickerProps } from "./FilePicker";
+export type { FileDropZoneProps } from "./FileDropZone";
+export { TableColumnVisibility } from "./TableColumnVisibility";
+export { TreeSelect } from "./TreeSelect";
+export { Upload } from "./Upload";
+export type { UploadProps } from "./Upload";
+export { UploadList } from "./UploadList";
+export type { UploadListProps } from "./UploadList";
+export type { UploadFile, UploadStatus, UploadRequest, UploadResult, } from "./uploadTypes";
+export { Timeline } from "./Timeline";
+export type { TimelineProps, TimelineItem } from "./Timeline";
+export { RangeSlider } from "./RangeSlider";
+export type { RangeSliderProps } from "./RangeSlider";
+export type { RangeValue } from "./rangeMath";
+export type { TreeSelectProps } from "./TreeSelect";
+export { Cascader } from "./Cascader";
+export type { CascaderProps } from "./Cascader";
+export type { HierarchyOption, HierarchyLoader } from "./hierarchy";
+export { Popconfirm } from "./Popconfirm";
+export type { PopconfirmProps } from "./Popconfirm";
+export { Descriptions } from "./Descriptions";
+export type { DescriptionsProps, DescriptionItem } from "./Descriptions";
+export { Statistic } from "./Statistic";
+export type { StatisticProps } from "./Statistic";
+export type { DataTableProps, TableSort, TableFilters, TablePagination, } from "./DataTable";
+export { Card } from "./Card";
+export { Tabs } from "./Tabs";
+export { Table } from "./Table";
+export { Menu } from "./Menu";
+export { UIProvider, useUIConfig } from "./UIProvider";
+export type { UIConfig } from "./UIProvider";
+export { ThemeProvider } from "./ThemeProvider";
+export type { UITheme, ColorMode } from "./ThemeProvider";
+export { ThemeStylePicker } from "./ThemeStylePicker";
+export { AppShell, ShellHeader } from "./AppShell";
+export type { NavigationItem } from "./AppShell";
+export { SettingsLayout, SettingsCard } from "./SettingsLayout";
+export { AppearanceSettings } from "./AppearanceSettings";
+export { appearanceDefaults, normalizeAppearance } from "./appearance";
+export type { AppearancePreferences } from "./appearance";
+export { MessageDialog, ConfirmDialog, FormDialog } from "./DialogVariants";
+export { TreeTable, type TreeTableProps } from "./TreeTable";

package/components/index.js

@@ -0,0 +1,225 @@
+import { Badge } from "./Badge.js";
+import { Button } from "./Button.js";
+import { Checkbox } from "./Checkbox.js";
+import { ColorField } from "./ColorField.js";
+import { DatePicker } from "./DatePicker.js";
+import { Dialog } from "./Dialog.js";
+import { EmptyState } from "./EmptyState.js";
+import { FileDropZone } from "./FileDropZone.js";
+import { FilePicker } from "./FilePicker.js";
+import { IconButton } from "./IconButton.js";
+import { Input } from "./Input.js";
+import { MultiSelect } from "./MultiSelect.js";
+import { NumberInput } from "./NumberInput.js";
+import { Page } from "./Page.js";
+import { Popover } from "./Popover.js";
+import { Progress } from "./Progress.js";
+import { SearchField } from "./SearchField.js";
+import { Section } from "./Section.js";
+import { Segmented } from "./Segmented.js";
+import { Select } from "./Select.js";
+import { SettingRow } from "./SettingRow.js";
+import { Skeleton } from "./Skeleton.js";
+import { SkeletonRows } from "./SkeletonRows.js";
+import { Switch } from "./Switch.js";
+import { ToastProvider } from "./ToastProvider.js";
+import { Tooltip } from "./Tooltip.js";
+import { FileDropOverlay } from "./FileDropOverlay.js";
+import { DisclosureChevron } from "./DisclosureChevron.js";
+import { ColorPicker } from "./ColorPicker.js";
+import { Textarea } from "./Textarea.js";
+import { ThemePicker } from "./ThemePicker.js";
+import { Toast } from "./Toast.js";
+import { SplitButton } from "./SplitButton.js";
+import { Calendar } from "./Calendar.js";
+import { TimeColumns } from "./TimeColumns.js";
+import { RadioGroup } from "./RadioGroup.js";
+import { Slider } from "./Slider.js";
+import { Accordion } from "./Accordion.js";
+import { useToast } from "./ToastProvider.js";
+import { Divider } from "./Divider.js";
+import { CatalogIcon } from "./CatalogIcon.js";
+import { CharacterPicker } from "./CharacterPicker.js";
+import { DataTable } from "./DataTable.js";
+import { EmojiPicker } from "./EmojiPicker.js";
+import { FileTree } from "./FileTree.js";
+import { IconPicker } from "./IconPicker.js";
+import { LoadingOverlay } from "./LoadingOverlay.js";
+import { LoadingState } from "./LoadingState.js";
+import { Pagination } from "./Pagination.js";
+import { Placeholder } from "./Placeholder.js";
+import { ShortcutInput } from "./ShortcutInput.js";
+import { Spinner } from "./Spinner.js";
+import { SymbolPicker } from "./SymbolPicker.js";
+import { TableColumnFilter } from "./TableColumnFilter.js";
+import { SelectTrigger } from "./SelectTrigger.js";
+import { BlockedTab } from "./BlockedTab.js";
+import { UnderlinedTab } from "./UnderlinedTab.js";
+import { Indicator } from "./Indicator.js";
+import { VirtualPickerList } from "./VirtualPickerList.js";
+import { SkinTonePicker } from "./SkinTonePicker.js";
+import { ContextMenu } from "./ContextMenu.js";
+import { ContextMenuPanel } from "./ContextMenuPanel.js";
+import { SelectOptionContent } from "./SelectOptionContent.js";
+import { MenuItem } from "./MenuItem.js";
+import { Form } from "./Form.js";
+import { FormField } from "./FormField.js";
+import { FieldLabel } from "./FieldLabel.js";
+import { FormGroup } from "./FormGroup.js";
+import { FormErrorSummary } from "./FormErrorSummary.js";
+import { useFormState } from "./useFormState.js";
+import { PinInput } from "./PinInput.js";
+import { ContributionCalendar } from "./ContributionCalendar.js";
+import { Combobox } from "./Combobox.js";
+import { TagInput } from "./TagInput.js";
+import { PasswordField } from "./PasswordField.js";
+import { Alert } from "./Alert.js";
+import { Drawer } from "./Drawer.js";
+import { Steps } from "./Steps.js";
+import { Breadcrumb } from "./Breadcrumb.js";
+import { Avatar } from "./Avatar.js";
+import { AvatarGroup } from "./AvatarGroup.js";
+import { CommandPalette } from "./CommandPalette.js";
+import { ResizablePanel } from "./ResizablePanel.js";
+import { DateRangePicker } from "./DateRangePicker.js";
+import { validateFiles, formatFileSize } from "./fileSelection.js";
+import { TableColumnVisibility } from "./TableColumnVisibility.js";
+import { TreeSelect } from "./TreeSelect.js";
+import { Upload } from "./Upload.js";
+import { UploadList } from "./UploadList.js";
+import { Timeline } from "./Timeline.js";
+import { RangeSlider } from "./RangeSlider.js";
+import { Cascader } from "./Cascader.js";
+import { Popconfirm } from "./Popconfirm.js";
+import { Descriptions } from "./Descriptions.js";
+import { Statistic } from "./Statistic.js";
+import { Card } from "./Card.js";
+import { Tabs } from "./Tabs.js";
+import { Table } from "./Table.js";
+import { Menu } from "./Menu.js";
+import { UIProvider, useUIConfig } from "./UIProvider.js";
+import { ThemeProvider } from "./ThemeProvider.js";
+import { ThemeStylePicker } from "./ThemeStylePicker.js";
+import { AppShell, ShellHeader } from "./AppShell.js";
+import { SettingsLayout, SettingsCard } from "./SettingsLayout.js";
+import { AppearanceSettings } from "./AppearanceSettings.js";
+import { appearanceDefaults, normalizeAppearance } from "./appearance.js";
+import { MessageDialog, ConfirmDialog, FormDialog } from "./DialogVariants.js";
+import { TreeTable } from "./TreeTable.js";
+export {
+  Accordion,
+  Alert,
+  AppShell,
+  AppearanceSettings,
+  Avatar,
+  AvatarGroup,
+  Badge,
+  BlockedTab,
+  Breadcrumb,
+  Button,
+  Calendar,
+  Card,
+  Cascader,
+  CatalogIcon,
+  CharacterPicker,
+  Checkbox,
+  ColorField,
+  ColorPicker,
+  Combobox,
+  CommandPalette,
+  ConfirmDialog,
+  ContextMenu,
+  ContextMenuPanel,
+  ContributionCalendar,
+  DataTable,
+  DatePicker,
+  DateRangePicker,
+  Descriptions,
+  Dialog,
+  DisclosureChevron,
+  Divider,
+  Drawer,
+  EmojiPicker,
+  EmptyState,
+  FieldLabel,
+  FileDropOverlay,
+  FileDropZone,
+  FilePicker,
+  FileTree,
+  Form,
+  FormDialog,
+  FormErrorSummary,
+  FormField,
+  FormGroup,
+  IconButton,
+  IconPicker,
+  Indicator,
+  Input,
+  LoadingOverlay,
+  LoadingState,
+  Menu,
+  MenuItem,
+  MessageDialog,
+  MultiSelect,
+  NumberInput,
+  Page,
+  Pagination,
+  PasswordField,
+  PinInput,
+  Placeholder,
+  Popconfirm,
+  Popover,
+  Progress,
+  RadioGroup,
+  RangeSlider,
+  ResizablePanel,
+  SearchField,
+  Section,
+  Segmented,
+  Select,
+  SelectOptionContent,
+  SelectTrigger,
+  SettingRow,
+  SettingsCard,
+  SettingsLayout,
+  ShellHeader,
+  ShortcutInput,
+  Skeleton,
+  SkeletonRows,
+  SkinTonePicker,
+  Slider,
+  Spinner,
+  SplitButton,
+  Statistic,
+  Steps,
+  Switch,
+  SymbolPicker,
+  Table,
+  TableColumnFilter,
+  TableColumnVisibility,
+  Tabs,
+  TagInput,
+  Textarea,
+  ThemePicker,
+  ThemeProvider,
+  ThemeStylePicker,
+  TimeColumns,
+  Timeline,
+  Toast,
+  ToastProvider,
+  Tooltip,
+  TreeSelect,
+  TreeTable,
+  UIProvider,
+  UnderlinedTab,
+  Upload,
+  UploadList,
+  VirtualPickerList,
+  appearanceDefaults,
+  formatFileSize,
+  normalizeAppearance,
+  useFormState,
+  useToast,
+  useUIConfig,
+  validateFiles
+};

package/components/menuFocus.d.ts

@@ -0,0 +1,7 @@
+type MenuKeyEvent = {
+    key: string;
+    defaultPrevented?: boolean;
+    preventDefault(): void;
+};
+export declare function moveMenuFocus(event: MenuKeyEvent, root: HTMLElement | null): boolean;
+export {};

package/components/menuFocus.js

@@ -0,0 +1,21 @@
+function moveMenuFocus(event, root) {
+  if (!root || event.defaultPrevented || !["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key))
+    return false;
+  if ((event.key === "Home" || event.key === "End") && !root.contains(document.activeElement))
+    return false;
+  const items = [
+    ...root.querySelectorAll(
+      '[data-menu-item],a[role="menuitem"]'
+    )
+  ].filter(
+    (node) => node.matches("button,a[href],[tabindex]") && !node.matches(':disabled,[aria-disabled="true"]')
+  );
+  if (!items.length) return false;
+  const active = items.indexOf(document.activeElement), next = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : event.key === "ArrowDown" ? (active + 1) % items.length : active < 0 ? items.length - 1 : (active - 1 + items.length) % items.length;
+  event.preventDefault();
+  items[next].focus();
+  return true;
+}
+export {
+  moveMenuFocus
+};

package/components/menuPointer.d.ts

@@ -0,0 +1,6 @@
+export type MenuPoint = {
+    x: number;
+    y: number;
+    time: number;
+};
+export declare function movingTowardSubmenu(origin: MenuPoint | undefined, point: MenuPoint, rect: DOMRect): boolean;

package/components/menuPointer.js

@@ -0,0 +1,13 @@
+function movingTowardSubmenu(origin, point, rect) {
+  if (!origin || point.time - origin.time > 400) return false;
+  const edge = rect.left >= origin.x ? rect.left : rect.right <= origin.x ? rect.right : void 0;
+  if (edge === void 0 || Math.abs(edge - point.x) >= Math.abs(edge - origin.x))
+    return false;
+  const a = origin, b = { x: edge, y: rect.top - 10 }, c = { x: edge, y: rect.bottom + 10 };
+  const cross = (p, q, r) => (p.x - r.x) * (q.y - r.y) - (q.x - r.x) * (p.y - r.y);
+  const d1 = cross(point, a, b), d2 = cross(point, b, c), d3 = cross(point, c, a);
+  return !([d1, d2, d3].some((d) => d < 0) && [d1, d2, d3].some((d) => d > 0));
+}
+export {
+  movingTowardSubmenu
+};

package/components/menuTypes.d.ts

@@ -0,0 +1,24 @@
+import type { CSSProperties, ReactNode } from "react";
+export type ContextMenuItem = {
+    id: string;
+    type: "separator";
+} | {
+    id: string;
+    type?: "item" | "checkbox" | "radio";
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+    shortcut?: string;
+    color?: string;
+    tone?: "default" | "danger";
+    style?: CSSProperties;
+    className?: string;
+    disabled?: boolean;
+    checked?: boolean;
+    children?: ContextMenuItem[];
+    onSelect?(): void | Promise<void>;
+    closeOnSelect?: boolean;
+};
+export type MenuAction = Extract<ContextMenuItem, {
+    label: string;
+}>;

package/components/motion.d.ts

@@ -0,0 +1,9 @@
+type Phase = "enter" | "update" | "exit";
+export declare const reducedMotion: () => boolean;
+export declare function motionDuration(token: string, fallback?: number): number;
+export declare const popupExitDuration: () => number;
+export declare function cancelMotion(node: HTMLElement): void;
+export declare function surfaceMotion(node: HTMLElement, phase: Phase, offset?: string, token?: string): Promise<boolean>;
+export type MenuSide = "top" | "bottom" | "left" | "right";
+export declare function menuSurfaceMotion(node: HTMLElement, phase: "enter" | "exit", side?: MenuSide): Promise<boolean>;
+export {};

package/components/motion.js

@@ -0,0 +1,82 @@
+const runs = /* @__PURE__ */ new WeakMap();
+const reducedMotion = () => ["false", "off"].includes(document.documentElement.dataset.motion || "") || matchMedia("(prefers-reduced-motion: reduce)").matches;
+function motionDuration(token, fallback = 180) {
+  if (reducedMotion()) return 0;
+  const raw = getComputedStyle(document.documentElement).getPropertyValue(token).trim();
+  const value = parseFloat(raw);
+  return Number.isFinite(value) ? value * (raw.endsWith("ms") ? 1 : 1e3) : fallback;
+}
+const popupExitDuration = () => motionDuration("--popup-exit", 120);
+function cancelMotion(node) {
+  const state = runs.get(node);
+  if (state) {
+    state.revision++;
+    state.animation?.cancel();
+    state.animation = void 0;
+  }
+}
+function surfaceMotion(node, phase, offset = "0 -4px", token) {
+  const state = runs.get(node) || { revision: 0 };
+  runs.set(node, state);
+  const revision = ++state.revision, interrupted = !!state.animation, style = getComputedStyle(node);
+  const from = {
+    opacity: interrupted ? style.opacity : phase === "enter" ? "0" : phase === "update" ? ".78" : "1",
+    translate: interrupted ? style.translate : phase === "enter" ? offset : phase === "update" ? "0 2px" : "0 0"
+  };
+  state.animation?.cancel();
+  const to = {
+    opacity: phase === "exit" ? "0" : "1",
+    translate: phase === "exit" ? offset : "0 0"
+  };
+  node.dataset.motionPhase = phase;
+  const finish = () => {
+    if (revision !== state.revision) return false;
+    Object.assign(node.style, to);
+    state.animation?.cancel();
+    state.animation = void 0;
+    node.dataset.motionPhase = phase === "exit" ? "hidden" : "visible";
+    return true;
+  };
+  const duration = motionDuration(
+    token || (phase === "enter" ? "--popup-enter" : "--popup-exit")
+  );
+  if (!duration || !node.isConnected) return Promise.resolve(finish());
+  const animation = node.animate([from, to], {
+    duration,
+    easing: getComputedStyle(document.documentElement).getPropertyValue("--ease").trim() || "ease-out",
+    fill: "both"
+  });
+  state.animation = animation;
+  const policy = matchMedia("(prefers-reduced-motion: reduce)");
+  const stop = () => {
+    if (reducedMotion() && animation.playState !== "finished")
+      animation.finish();
+  };
+  const observer = new MutationObserver(stop);
+  observer.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter: ["data-motion"]
+  });
+  policy.addEventListener("change", stop);
+  return animation.finished.then(finish, () => false).finally(() => {
+    observer.disconnect();
+    policy.removeEventListener("change", stop);
+  });
+}
+function menuSurfaceMotion(node, phase, side = "bottom") {
+  const offset = {
+    top: "0 4px",
+    bottom: "0 -4px",
+    left: "4px 0",
+    right: "-4px 0"
+  }[side];
+  return surfaceMotion(node, phase, offset);
+}
+export {
+  cancelMotion,
+  menuSurfaceMotion,
+  motionDuration,
+  popupExitDuration,
+  reducedMotion,
+  surfaceMotion
+};

package/components/rangeMath.d.ts

@@ -0,0 +1,12 @@
+export type RangeValue = [number, number];
+export declare function rangeSettings(minimum?: number, maximum?: number, increment?: number, minDistance?: number): {
+    min: number;
+    max: number;
+    step: number;
+    count: number;
+    gap: number;
+    indexOf: (value: number) => number;
+    toValue: (index: number) => number;
+    normalize: (value: RangeValue) => RangeValue;
+};
+export declare function moveRange(value: RangeValue, index: 0 | 1, target: number, settings: ReturnType<typeof rangeSettings>): RangeValue;

package/components/rangeMath.js

@@ -0,0 +1,30 @@
+const finite = (n, fallback) => typeof n === "number" && Number.isFinite(n) ? n : fallback;
+const round = (n) => Number(n.toFixed(10));
+function rangeSettings(minimum = 0, maximum = 100, increment = 1, minDistance = 0) {
+  const min = finite(minimum, 0), requestedMax = Math.max(min, finite(maximum, min + 100)), span = Number.isFinite(requestedMax - min) ? requestedMax - min : 0, safeStep = finite(increment, 1), step = span ? Math.min(span, Math.max(1e-8, safeStep > 0 ? safeStep : 1)) : 1, count = Math.max(0, Math.floor(span / step + 1e-8)), max = round(min + count * step), gap = Math.min(
+    count,
+    Math.max(0, Math.ceil(finite(minDistance, 0) / step - 1e-8))
+  );
+  const indexOf = (value) => Math.min(
+    count,
+    Math.max(0, Math.round((finite(value, min) - min) / step))
+  ), toValue = (index) => round(min + index * step);
+  const normalize = (value) => {
+    const a = indexOf(value[0]), b = indexOf(value[1]);
+    let low = Math.min(a, b), high = Math.max(a, b);
+    if (high - low < gap) {
+      high = Math.min(count, low + gap);
+      low = Math.min(low, high - gap);
+    }
+    return [toValue(low), toValue(high)];
+  };
+  return { min, max, step, count, gap, indexOf, toValue, normalize };
+}
+function moveRange(value, index, target, settings) {
+  const current = settings.normalize(value), low = settings.indexOf(current[0]), high = settings.indexOf(current[1]), next = settings.indexOf(target);
+  return index === 0 ? [settings.toValue(Math.min(next, high - settings.gap)), current[1]] : [current[0], settings.toValue(Math.max(next, low + settings.gap))];
+}
+export {
+  moveRange,
+  rangeSettings
+};

package/components/surfacePortal.d.ts

@@ -0,0 +1,13 @@
+export declare const SurfacePortalContext: import("react").Context<{
+    host: HTMLElement | null;
+    active: boolean;
+} | null>;
+export declare const useSurfacePortal: () => {
+    host: HTMLElement | null;
+    active: boolean;
+} | null;
+export declare function useSurfaceHost<T extends HTMLElement>(): {
+    ref: import("react").RefObject<T | null>;
+    host: T | null;
+    setRef: (node: T | null) => void;
+};

package/components/surfacePortal.js

@@ -0,0 +1,22 @@
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useRef,
+  useState
+} from "react";
+const SurfacePortalContext = createContext(null);
+const useSurfacePortal = () => useContext(SurfacePortalContext);
+function useSurfaceHost() {
+  const ref = useRef(null), [host, setHost] = useState(null);
+  const setRef = useCallback((node) => {
+    ref.current = node;
+    setHost(node);
+  }, []);
+  return { ref, host, setRef };
+}
+export {
+  SurfacePortalContext,
+  useSurfaceHost,
+  useSurfacePortal
+};

package/components/tooltipState.d.ts

@@ -0,0 +1,5 @@
+export declare const keyboardTooltip: () => boolean;
+export declare const tooltipDelay: () => 90 | 380;
+export declare function claimTooltip(hide: (immediate?: boolean) => void): void;
+export declare function releaseTooltip(hide: (immediate?: boolean) => void, visible: boolean): void;
+export declare function retainTooltipEvents(): () => void;