@wirekyt/dom 0.0.1 → 0.0.2

package/dist/machines/splitter/index.d.cts

@@ -0,0 +1,282 @@
+import { n as AnatomyInstance } from "../../anatomy-DMuSMbOP.cjs";
+import { M as Service, S as EventObject, T as Machine } from "../../index-BKgxIVbE.cjs";
+import { b as PropTypes, d as Orientation, g as RequiredBy, p as Point, r as DirectionProperty, t as CommonProperties, y as NormalizeProps } from "../../index-BXfunVyD.cjs";
+import "../../index-BF6G2RiC.cjs";
+//#region src/machines/splitter/anatomy.d.ts
+declare const anatomy: AnatomyInstance<"root" | "resizeTrigger" | "panel" | "resizeTriggerIndicator">;
+//#endregion
+//#region src/machines/splitter/utils/registry.d.ts
+interface ResizeHandleData {
+  id: string;
+  element: HTMLElement;
+  orientation: Orientation;
+  onActivate: (point: Point) => void;
+  onDeactivate: VoidFunction;
+}
+interface HitAreaMargins {
+  /**
+   * The margin for coarse pointers (touch, pen)
+   * @default 15
+   */
+  coarse?: number;
+  /**
+   * The margin for fine pointers (mouse)
+   * @default 5
+   */
+  fine?: number;
+}
+interface SplitterRegistryOptions {
+  /**
+   * The nonce for the injected cursor stylesheet (for CSP compliance).
+   */
+  nonce?: string;
+  /**
+   * The hit area margins for resize handles.
+   * Larger margins make it easier to grab handles, especially on touch devices.
+   */
+  hitAreaMargins?: HitAreaMargins;
+}
+declare class SplitterRegistry {
+  private handles;
+  private state;
+  private listenerAttached;
+  private options;
+  constructor(options?: SplitterRegistryOptions);
+  register(data: ResizeHandleData): VoidFunction;
+  private attachGlobalListeners;
+  private detachGlobalListeners;
+  private getPointerType;
+  private get doc();
+  /**
+   * Fast hit-test: only checks pointer proximity to handles (no stacking order).
+   * Used for pointermove cursor feedback.
+   */
+  private findHitHandles;
+  /**
+   * Full intersection check: hit-test + stacking order verification.
+   * Used for pointerdown activation where correctness matters.
+   */
+  private findIntersectingHandles;
+  private handlePointerMove;
+  private handlePointerDown;
+  private handlePointerUp;
+  private updateCursor;
+  private globalCursorId;
+  private setGlobalCursor;
+  private clearGlobalCursor;
+}
+declare const registry: (opts?: SplitterRegistryOptions) => SplitterRegistry;
+//#endregion
+//#region src/machines/splitter/types.d.ts
+type ResizeEvent = PointerEvent | KeyboardEvent;
+type PanelId = string;
+type ResizeTriggerId = `${PanelId}:${PanelId}` | `${PanelId}:` | `:${PanelId}`;
+type PanelSize = number | string;
+type PanelResizeBehavior = "preserve-relative-size" | "preserve-pixel-size";
+interface PanelData {
+  id: PanelId;
+  order?: number | undefined;
+  minSize?: PanelSize | undefined;
+  maxSize?: PanelSize | undefined;
+  collapsible?: boolean | undefined;
+  resizeBehavior?: PanelResizeBehavior | undefined;
+  collapsedSize?: PanelSize | undefined;
+}
+type NormalizedPanelData = Omit<PanelData, "minSize" | "maxSize" | "collapsedSize"> & {
+  minSize?: number | undefined;
+  maxSize?: number | undefined;
+  collapsedSize?: number | undefined;
+};
+interface CursorState {
+  isAtMin: boolean;
+  isAtMax: boolean;
+}
+interface ResizeDetails {
+  size: number[];
+  resizeTriggerId: string | null;
+  layout: string;
+  expandToSizes: Record<string, number>;
+}
+interface ResizeEndDetails {
+  size: number[];
+  resizeTriggerId: string | null;
+}
+interface ExpandCollapseDetails {
+  panelId: string;
+  size: number;
+}
+type ElementIds = Partial<{
+  root: string;
+  resizeTrigger: (id: string) => string;
+  label: (id: string) => string;
+  panel: (id: string | number) => string;
+}>;
+interface SplitterProps extends DirectionProperty, CommonProperties {
+  orientation?: "horizontal" | "vertical" | undefined;
+  size?: PanelSize[] | undefined;
+  defaultSize?: PanelSize[] | undefined;
+  panels: PanelData[];
+  onResize?: ((details: ResizeDetails) => void) | undefined;
+  onResizeStart?: (() => void) | undefined;
+  onResizeEnd?: ((details: ResizeEndDetails) => void) | undefined;
+  ids?: ElementIds | undefined;
+  keyboardResizeBy?: number | null | undefined;
+  nonce?: string | undefined;
+  onCollapse?: ((details: ExpandCollapseDetails) => void) | undefined;
+  onExpand?: ((details: ExpandCollapseDetails) => void) | undefined;
+  registry?: SplitterRegistry | undefined;
+}
+type PropsWithDefault = "orientation" | "panels";
+interface DragState {
+  resizeTriggerId: string;
+  resolvedResizeTriggerId: `${PanelId}:${PanelId}`;
+  resizeTriggerRect: DOMRect;
+  initialCursorPosition: number;
+  initialSize: number[];
+}
+interface KeyboardState {
+  resizeTriggerId: string;
+  resolvedResizeTriggerId: `${PanelId}:${PanelId}` | null;
+}
+interface Context {
+  dragState: DragState | null;
+  keyboardState: KeyboardState | null;
+  size: number[];
+  panels: NormalizedPanelData[];
+}
+interface Refs {
+  panelSizeBeforeCollapse: Map<string, number>;
+  panelIdToLastNotifiedSizeMap: Map<string, number>;
+  prevDelta: number;
+  initialSize: number[] | null;
+  prevInitialLayout: string | null;
+  prevGroupSize: number | null;
+  lastRequestedSize: number[] | null;
+  suppressOnResize: boolean;
+}
+interface SplitterSchema {
+  state: "idle" | "hover:temp" | "hover" | "dragging" | "focused";
+  tag: "focus";
+  props: RequiredBy<SplitterProps, PropsWithDefault>;
+  context: Context;
+  computed: {
+    horizontal: boolean;
+  };
+  refs: Refs;
+  action: string;
+  event: EventObject;
+  effect: string;
+  guard: string;
+}
+type SplitterService = Service<SplitterSchema>;
+type SplitterMachine = Machine<SplitterSchema>;
+interface PanelProps {
+  id: PanelId;
+}
+interface ResizeTriggerProps {
+  id: ResizeTriggerId;
+  disabled?: boolean | undefined;
+}
+interface ResizeTriggerState {
+  dragging: boolean;
+  focused: boolean;
+  disabled: boolean;
+}
+interface PanelItem {
+  type: "panel";
+  id: PanelId;
+}
+interface ResizeTriggerItem {
+  type: "handle";
+  id: ResizeTriggerId;
+}
+type SplitterItem = PanelItem | ResizeTriggerItem;
+interface SplitterApi<T extends PropTypes = PropTypes> {
+  /**
+   * Whether the splitter is currently being resized.
+   */
+  dragging: boolean;
+  /**
+   * The orientation of the splitter.
+   */
+  orientation: "horizontal" | "vertical";
+  /**
+   * Returns the current sizes of the panels.
+   */
+  getSizes: () => number[];
+  /**
+   * Sets the sizes of the panels.
+   */
+  setSizes: (size: PanelSize[]) => void;
+  /**
+   * Returns the items of the splitter.
+   */
+  getItems: () => SplitterItem[];
+  /**
+   * Returns the panels of the splitter.
+   */
+  getPanels: () => PanelData[];
+  /**
+   * Returns the panel with the specified id.
+   */
+  getPanelById: (id: PanelId) => PanelData;
+  /**
+   * Returns the size of the specified panel.
+   */
+  getPanelSize: (id: PanelId) => number;
+  /**
+   * Returns whether the specified panel is collapsed.
+   */
+  isPanelCollapsed: (id: PanelId) => boolean;
+  /**
+   * Returns whether the specified panel is expanded.
+   */
+  isPanelExpanded: (id: PanelId) => boolean;
+  /**
+   * Collapses the specified panel.
+   */
+  collapsePanel: (id: PanelId) => void;
+  /**
+   * Expands the specified panel.
+   */
+  expandPanel: (id: PanelId, minSize?: number) => void;
+  /**
+   * Resizes the specified panel.
+   */
+  resizePanel: (id: PanelId, unsafePanelSize: number) => void;
+  /**
+   * Returns the layout of the splitter.
+   */
+  getLayout: () => string;
+  /**
+   * Resets the splitter to its initial state.
+   */
+  resetSizes: VoidFunction;
+  /**
+   * Returns the state of the resize trigger.
+   */
+  getResizeTriggerState: (props: ResizeTriggerProps) => ResizeTriggerState;
+  getRootProps: () => T["element"];
+  getPanelProps: (props: PanelProps) => T["element"];
+  getResizeTriggerProps: (props: ResizeTriggerProps) => T["element"];
+  getResizeTriggerIndicator: (props: ResizeTriggerProps) => T["element"];
+}
+//#endregion
+//#region src/machines/splitter/connect.d.ts
+declare function connect<T extends PropTypes>(service: SplitterService, normalize: NormalizeProps<T>): SplitterApi<T>;
+//#endregion
+//#region src/machines/splitter/machine.d.ts
+declare const machine: Machine<SplitterSchema>;
+//#endregion
+//#region src/machines/splitter/props.d.ts
+declare const props: (keyof SplitterProps)[];
+declare const splitProps: <Props extends Partial<SplitterProps>>(props: Props) => [Partial<SplitterProps>, Omit<Props, keyof SplitterProps>];
+declare const panelProps: "id"[];
+declare const splitPanelProps: <Props extends PanelProps>(props: Props) => [PanelProps, Omit<Props, "id">];
+declare const resizeTriggerProps: (keyof ResizeTriggerProps)[];
+declare const splitResizeTriggerProps: <Props extends ResizeTriggerProps>(props: Props) => [ResizeTriggerProps, Omit<Props, keyof ResizeTriggerProps>];
+//#endregion
+//#region src/machines/splitter/utils/panel.d.ts
+declare function getPanelLayout(panels: PanelData[]): string;
+//#endregion
+export { type SplitterApi as Api, type CursorState, type DragState, type ElementIds, type ExpandCollapseDetails, type HitAreaMargins, type SplitterItem as Item, type KeyboardState, type SplitterMachine as Machine, type PanelData, type PanelId, type PanelItem, type PanelProps, type PanelResizeBehavior, type PanelSize, type SplitterProps as Props, type ResizeDetails, type ResizeEndDetails, type ResizeEvent, type ResizeTriggerId, type ResizeTriggerItem, type ResizeTriggerProps, type ResizeTriggerState, type SplitterService as Service, type SplitterRegistry, type SplitterRegistryOptions, anatomy, connect, getPanelLayout as layout, machine, panelProps, props, registry, resizeTriggerProps, splitPanelProps, splitProps, splitResizeTriggerProps };

package/dist/machines/splitter/index.d.ts

@@ -0,0 +1,282 @@
+import { n as AnatomyInstance } from "../../anatomy-DMuSMbOP.js";
+import { M as Service, S as EventObject, T as Machine } from "../../index-CFoN0L3C.js";
+import { b as PropTypes, d as Orientation, g as RequiredBy, p as Point, r as DirectionProperty, t as CommonProperties, y as NormalizeProps } from "../../index-BXfunVyD.js";
+import "../../index-BdeZuSX6.js";
+//#region src/machines/splitter/anatomy.d.ts
+declare const anatomy: AnatomyInstance<"root" | "resizeTrigger" | "panel" | "resizeTriggerIndicator">;
+//#endregion
+//#region src/machines/splitter/utils/registry.d.ts
+interface ResizeHandleData {
+  id: string;
+  element: HTMLElement;
+  orientation: Orientation;
+  onActivate: (point: Point) => void;
+  onDeactivate: VoidFunction;
+}
+interface HitAreaMargins {
+  /**
+   * The margin for coarse pointers (touch, pen)
+   * @default 15
+   */
+  coarse?: number;
+  /**
+   * The margin for fine pointers (mouse)
+   * @default 5
+   */
+  fine?: number;
+}
+interface SplitterRegistryOptions {
+  /**
+   * The nonce for the injected cursor stylesheet (for CSP compliance).
+   */
+  nonce?: string;
+  /**
+   * The hit area margins for resize handles.
+   * Larger margins make it easier to grab handles, especially on touch devices.
+   */
+  hitAreaMargins?: HitAreaMargins;
+}
+declare class SplitterRegistry {
+  private handles;
+  private state;
+  private listenerAttached;
+  private options;
+  constructor(options?: SplitterRegistryOptions);
+  register(data: ResizeHandleData): VoidFunction;
+  private attachGlobalListeners;
+  private detachGlobalListeners;
+  private getPointerType;
+  private get doc();
+  /**
+   * Fast hit-test: only checks pointer proximity to handles (no stacking order).
+   * Used for pointermove cursor feedback.
+   */
+  private findHitHandles;
+  /**
+   * Full intersection check: hit-test + stacking order verification.
+   * Used for pointerdown activation where correctness matters.
+   */
+  private findIntersectingHandles;
+  private handlePointerMove;
+  private handlePointerDown;
+  private handlePointerUp;
+  private updateCursor;
+  private globalCursorId;
+  private setGlobalCursor;
+  private clearGlobalCursor;
+}
+declare const registry: (opts?: SplitterRegistryOptions) => SplitterRegistry;
+//#endregion
+//#region src/machines/splitter/types.d.ts
+type ResizeEvent = PointerEvent | KeyboardEvent;
+type PanelId = string;
+type ResizeTriggerId = `${PanelId}:${PanelId}` | `${PanelId}:` | `:${PanelId}`;
+type PanelSize = number | string;
+type PanelResizeBehavior = "preserve-relative-size" | "preserve-pixel-size";
+interface PanelData {
+  id: PanelId;
+  order?: number | undefined;
+  minSize?: PanelSize | undefined;
+  maxSize?: PanelSize | undefined;
+  collapsible?: boolean | undefined;
+  resizeBehavior?: PanelResizeBehavior | undefined;
+  collapsedSize?: PanelSize | undefined;
+}
+type NormalizedPanelData = Omit<PanelData, "minSize" | "maxSize" | "collapsedSize"> & {
+  minSize?: number | undefined;
+  maxSize?: number | undefined;
+  collapsedSize?: number | undefined;
+};
+interface CursorState {
+  isAtMin: boolean;
+  isAtMax: boolean;
+}
+interface ResizeDetails {
+  size: number[];
+  resizeTriggerId: string | null;
+  layout: string;
+  expandToSizes: Record<string, number>;
+}
+interface ResizeEndDetails {
+  size: number[];
+  resizeTriggerId: string | null;
+}
+interface ExpandCollapseDetails {
+  panelId: string;
+  size: number;
+}
+type ElementIds = Partial<{
+  root: string;
+  resizeTrigger: (id: string) => string;
+  label: (id: string) => string;
+  panel: (id: string | number) => string;
+}>;
+interface SplitterProps extends DirectionProperty, CommonProperties {
+  orientation?: "horizontal" | "vertical" | undefined;
+  size?: PanelSize[] | undefined;
+  defaultSize?: PanelSize[] | undefined;
+  panels: PanelData[];
+  onResize?: ((details: ResizeDetails) => void) | undefined;
+  onResizeStart?: (() => void) | undefined;
+  onResizeEnd?: ((details: ResizeEndDetails) => void) | undefined;
+  ids?: ElementIds | undefined;
+  keyboardResizeBy?: number | null | undefined;
+  nonce?: string | undefined;
+  onCollapse?: ((details: ExpandCollapseDetails) => void) | undefined;
+  onExpand?: ((details: ExpandCollapseDetails) => void) | undefined;
+  registry?: SplitterRegistry | undefined;
+}
+type PropsWithDefault = "orientation" | "panels";
+interface DragState {
+  resizeTriggerId: string;
+  resolvedResizeTriggerId: `${PanelId}:${PanelId}`;
+  resizeTriggerRect: DOMRect;
+  initialCursorPosition: number;
+  initialSize: number[];
+}
+interface KeyboardState {
+  resizeTriggerId: string;
+  resolvedResizeTriggerId: `${PanelId}:${PanelId}` | null;
+}
+interface Context {
+  dragState: DragState | null;
+  keyboardState: KeyboardState | null;
+  size: number[];
+  panels: NormalizedPanelData[];
+}
+interface Refs {
+  panelSizeBeforeCollapse: Map<string, number>;
+  panelIdToLastNotifiedSizeMap: Map<string, number>;
+  prevDelta: number;
+  initialSize: number[] | null;
+  prevInitialLayout: string | null;
+  prevGroupSize: number | null;
+  lastRequestedSize: number[] | null;
+  suppressOnResize: boolean;
+}
+interface SplitterSchema {
+  state: "idle" | "hover:temp" | "hover" | "dragging" | "focused";
+  tag: "focus";
+  props: RequiredBy<SplitterProps, PropsWithDefault>;
+  context: Context;
+  computed: {
+    horizontal: boolean;
+  };
+  refs: Refs;
+  action: string;
+  event: EventObject;
+  effect: string;
+  guard: string;
+}
+type SplitterService = Service<SplitterSchema>;
+type SplitterMachine = Machine<SplitterSchema>;
+interface PanelProps {
+  id: PanelId;
+}
+interface ResizeTriggerProps {
+  id: ResizeTriggerId;
+  disabled?: boolean | undefined;
+}
+interface ResizeTriggerState {
+  dragging: boolean;
+  focused: boolean;
+  disabled: boolean;
+}
+interface PanelItem {
+  type: "panel";
+  id: PanelId;
+}
+interface ResizeTriggerItem {
+  type: "handle";
+  id: ResizeTriggerId;
+}
+type SplitterItem = PanelItem | ResizeTriggerItem;
+interface SplitterApi<T extends PropTypes = PropTypes> {
+  /**
+   * Whether the splitter is currently being resized.
+   */
+  dragging: boolean;
+  /**
+   * The orientation of the splitter.
+   */
+  orientation: "horizontal" | "vertical";
+  /**
+   * Returns the current sizes of the panels.
+   */
+  getSizes: () => number[];
+  /**
+   * Sets the sizes of the panels.
+   */
+  setSizes: (size: PanelSize[]) => void;
+  /**
+   * Returns the items of the splitter.
+   */
+  getItems: () => SplitterItem[];
+  /**
+   * Returns the panels of the splitter.
+   */
+  getPanels: () => PanelData[];
+  /**
+   * Returns the panel with the specified id.
+   */
+  getPanelById: (id: PanelId) => PanelData;
+  /**
+   * Returns the size of the specified panel.
+   */
+  getPanelSize: (id: PanelId) => number;
+  /**
+   * Returns whether the specified panel is collapsed.
+   */
+  isPanelCollapsed: (id: PanelId) => boolean;
+  /**
+   * Returns whether the specified panel is expanded.
+   */
+  isPanelExpanded: (id: PanelId) => boolean;
+  /**
+   * Collapses the specified panel.
+   */
+  collapsePanel: (id: PanelId) => void;
+  /**
+   * Expands the specified panel.
+   */
+  expandPanel: (id: PanelId, minSize?: number) => void;
+  /**
+   * Resizes the specified panel.
+   */
+  resizePanel: (id: PanelId, unsafePanelSize: number) => void;
+  /**
+   * Returns the layout of the splitter.
+   */
+  getLayout: () => string;
+  /**
+   * Resets the splitter to its initial state.
+   */
+  resetSizes: VoidFunction;
+  /**
+   * Returns the state of the resize trigger.
+   */
+  getResizeTriggerState: (props: ResizeTriggerProps) => ResizeTriggerState;
+  getRootProps: () => T["element"];
+  getPanelProps: (props: PanelProps) => T["element"];
+  getResizeTriggerProps: (props: ResizeTriggerProps) => T["element"];
+  getResizeTriggerIndicator: (props: ResizeTriggerProps) => T["element"];
+}
+//#endregion
+//#region src/machines/splitter/connect.d.ts
+declare function connect<T extends PropTypes>(service: SplitterService, normalize: NormalizeProps<T>): SplitterApi<T>;
+//#endregion
+//#region src/machines/splitter/machine.d.ts
+declare const machine: Machine<SplitterSchema>;
+//#endregion
+//#region src/machines/splitter/props.d.ts
+declare const props: (keyof SplitterProps)[];
+declare const splitProps: <Props extends Partial<SplitterProps>>(props: Props) => [Partial<SplitterProps>, Omit<Props, keyof SplitterProps>];
+declare const panelProps: "id"[];
+declare const splitPanelProps: <Props extends PanelProps>(props: Props) => [PanelProps, Omit<Props, "id">];
+declare const resizeTriggerProps: (keyof ResizeTriggerProps)[];
+declare const splitResizeTriggerProps: <Props extends ResizeTriggerProps>(props: Props) => [ResizeTriggerProps, Omit<Props, keyof ResizeTriggerProps>];
+//#endregion
+//#region src/machines/splitter/utils/panel.d.ts
+declare function getPanelLayout(panels: PanelData[]): string;
+//#endregion
+export { type SplitterApi as Api, type CursorState, type DragState, type ElementIds, type ExpandCollapseDetails, type HitAreaMargins, type SplitterItem as Item, type KeyboardState, type SplitterMachine as Machine, type PanelData, type PanelId, type PanelItem, type PanelProps, type PanelResizeBehavior, type PanelSize, type SplitterProps as Props, type ResizeDetails, type ResizeEndDetails, type ResizeEvent, type ResizeTriggerId, type ResizeTriggerItem, type ResizeTriggerProps, type ResizeTriggerState, type SplitterService as Service, type SplitterRegistry, type SplitterRegistryOptions, anatomy, connect, getPanelLayout as layout, machine, panelProps, props, registry, resizeTriggerProps, splitPanelProps, splitProps, splitResizeTriggerProps };