@window-splitter/interface 0.7.0

package/.tshy/build.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "../src",
+    "module": "nodenext",
+    "moduleResolution": "nodenext"
+  }
+}

package/.tshy/commonjs.json

@@ -0,0 +1,18 @@
+{
+  "extends": "./build.json",
+  "include": [
+    "../src/**/*.ts",
+    "../src/**/*.cts",
+    "../src/**/*.tsx",
+    "../src/**/*.json"
+  ],
+  "exclude": [
+    "../src/**/*.test.ts",
+    "../node_modules",
+    "../src/**/*.mts",
+    "../src/package.json"
+  ],
+  "compilerOptions": {
+    "outDir": "../.tshy-build/commonjs"
+  }
+}

package/.tshy/esm.json

@@ -0,0 +1,17 @@
+{
+  "extends": "./build.json",
+  "include": [
+    "../src/**/*.ts",
+    "../src/**/*.mts",
+    "../src/**/*.tsx",
+    "../src/**/*.json"
+  ],
+  "exclude": [
+    "../src/**/*.test.ts",
+    "../node_modules",
+    "../src/package.json"
+  ],
+  "compilerOptions": {
+    "outDir": "../.tshy-build/esm"
+  }
+}

package/.turbo/turbo-build.log

@@ -0,0 +1,5 @@
+
+
+> @window-splitter/interface@0.6.5 build /Users/andrew/Documents/react-window-splitter/packages/interface
+> tshy
+

package/.turbo/turbo-lint.log

@@ -0,0 +1,5 @@
+
+
+> @window-splitter/interface@0.6.5 lint /Users/andrew/Documents/react-window-splitter/packages/interface
+> eslint .
+

package/CHANGELOG.md

@@ -0,0 +1,44 @@
+# v0.7.0 (Mon Apr 28 2025)
+
+### Release Notes
+
+#### `@window-splitter/solid` ([#54](https://github.com/hipstersmoothie/window-splitter/pull/54))
+
+The second framework adapter for `window-splitter` is live!
+
+Things of note:
+
+- `react-window-splitter` is deprecated in favor of `@window-splitter/react`
+- `@window-splitter/solid` is feature complete and passes the test full test suite
+- `@window-splitter/interface` was created to house the shared component types and some help functions
+
+In creating the solid adapter we had to make vanilla JS versions of some functions we previously got from a dependency. This resulted in a 7.4% bundle size reduction for the react package 🎉 
+
+### Breaking Change
+
+The API for registering panel handles changed a little bit. If you're using the `@window-splitter/state` package directly you will have to update your code (if you exist send me a message!)
+
+---
+
+#### 🚀 Enhancement
+
+- `@window-splitter/solid` [#54](https://github.com/hipstersmoothie/window-splitter/pull/54) ([@hipstersmoothie](https://github.com/hipstersmoothie))
+
+#### 🐛 Bug Fix
+
+- lint ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- fix attr merging ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- fix unmount ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- ugh ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- update names ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- build ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- use shared move ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- fix lint ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- fix build ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- move move ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- move shared stuff ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- move shared types out ([@hipstersmoothie](https://github.com/hipstersmoothie))
+
+#### Authors: 1
+
+- Andrew Lisowski ([@hipstersmoothie](https://github.com/hipstersmoothie))

package/README.md

@@ -0,0 +1,3 @@
+# `@window-splitter/interface`
+
+Shared component interface for window splitter components.

package/dist/commonjs/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./interface.js";
+export * from "./move.js";
+export * from "./mergeAttributes.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,sBAAsB,CAAC"}

package/dist/commonjs/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./interface.js"), exports);
+__exportStar(require("./move.js"), exports);
+__exportStar(require("./mergeAttributes.js"), exports);
+//# sourceMappingURL=index.js.map

package/dist/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,iDAA+B;AAC/B,4CAA0B;AAC1B,uDAAqC","sourcesContent":["export * from \"./interface.js\";\nexport * from \"./move.js\";\nexport * from \"./mergeAttributes.js\";\n"]}

package/dist/commonjs/interface.d.ts

@@ -0,0 +1,128 @@
+import { Constraints, GroupMachineContextValue, OnResizeCallback, PanelData, ParsedUnit, PixelUnit, Rect, Unit } from "@window-splitter/state";
+export interface PanelGroupHandle {
+    /** The id of the group */
+    getId: () => string;
+    /** Get the sizes of all the items in the layout as pixels */
+    getPixelSizes: () => Array<number>;
+    /** Get the sizes of all the items in the layout as percentages of the group size */
+    getPercentageSizes: () => Array<number>;
+    /**
+     * Set the size of all the items in the layout.
+     * This just calls `setSize` on each item. It is up to
+     * you to make sure the sizes make sense.
+     *
+     * NOTE: Setting handle sizes will do nothing.
+     */
+    setSizes: (items: Array<Unit>) => void;
+    /** Get the template for the group in pixels. Useful for testing */
+    getTemplate: () => string;
+    getState: () => "idle" | "dragging";
+}
+export interface SharedPanelGroupProps extends Partial<Pick<GroupMachineContextValue, "orientation" | "autosaveStrategy">> {
+    /** Persisted state to initialized the machine with */
+    snapshot?: GroupMachineContextValue;
+    /** An id to use for autosaving the layout */
+    autosaveId?: string;
+}
+export interface PanelHandle {
+    /** Collapse the panel */
+    collapse: () => void;
+    /** Returns true if the panel is collapsed */
+    isCollapsed: () => boolean;
+    /** Expand the panel */
+    expand: () => void;
+    /** Returns true if the panel is expanded */
+    isExpanded: () => boolean;
+    /** The id of the panel */
+    getId: () => string;
+    /** Get the size of the panel in pixels */
+    getPixelSize: () => number;
+    /** Get percentage of the panel relative to the group */
+    getPercentageSize: () => number;
+    /**
+     * Set the size of the panel in pixels.
+     *
+     * This will be clamped to the min/max values of the panel.
+     * If you want the panel to collapse/expand you should use the
+     * expand/collapse methods.
+     */
+    setSize: (size: Unit) => void;
+}
+export interface SharedPanelProps<CollapsValue> extends Constraints<Unit>, Pick<PanelData, "collapseAnimation"> {
+    /** Callback called when the panel is resized */
+    onResize?: OnResizeCallback;
+    /**
+     * __CONTROLLED COMPONENT__
+     *
+     * If this prop is used it will be used as the source of truth for the collapsed state.
+     * It should be used in conjunction with the `onCollapseChange` prop.
+     *
+     * Use this if you want full control over the collapsed state. When trying to
+     * collapse a panel it will defer to onCollapseChange to determine if it should
+     * be collapsed.
+     */
+    collapsed?: CollapsValue;
+    /**
+     * __CONTROLLED COMPONENT__
+     *
+     * A callback called with the new desired collapsed state. If paired w
+     * with the `collapsed` prop this will be used to control the collapsed state.
+     *
+     * Otherwise this will just be called with the new collapsed state so you can
+     * use it to update your own state.
+     */
+    onCollapseChange?: (isCollapsed: boolean) => void;
+}
+export declare function getPanelDomAttributes({ groupId, id, collapsible, collapsed, }: {
+    groupId: string | undefined;
+    id: string;
+    collapsible: boolean | undefined;
+    collapsed: boolean | undefined;
+}): {
+    id: string;
+    "data-splitter-group-id": string | undefined;
+    "data-splitter-type": string;
+    "data-splitter-id": string;
+    "data-collapsed": boolean | undefined;
+};
+export interface SharedPanelResizerProps extends Partial<Pick<PanelHandle, "setSize">> {
+    /** If the handle is disabled */
+    disabled?: boolean;
+    /** The size of the handle */
+    size?: PixelUnit;
+    /** Called when the user starts dragging the handle */
+    onDragStart?: () => void;
+    /** Called when the user drags the handle */
+    onDrag?: () => void;
+    /** Called when the user stops dragging the handle */
+    onDragEnd?: () => void;
+}
+export declare function getPanelResizerDomAttributes({ groupId, id, orientation, isDragging, activeDragHandleId, disabled, controlsId, min, max, currentValue, groupSize, }: {
+    groupId: string | undefined;
+    id: string;
+    orientation: "horizontal" | "vertical";
+    isDragging: boolean;
+    activeDragHandleId: string | undefined;
+    disabled: boolean | undefined;
+    controlsId: string | undefined;
+    min: ParsedUnit | undefined;
+    max: ParsedUnit | "1fr" | undefined;
+    currentValue: ParsedUnit | undefined;
+    groupSize: number;
+}): {
+    id: string;
+    role: "separator";
+    "data-splitter-type": string;
+    "data-splitter-id": string;
+    "data-splitter-group-id": string | undefined;
+    "data-handle-orientation": "horizontal" | "vertical";
+    "data-state": string;
+    "aria-label": string;
+    "aria-disabled": boolean | undefined;
+    "aria-controls": string | undefined;
+    "aria-valuemin": number | undefined;
+    "aria-valuemax": number | undefined;
+    "aria-valuenow": number | undefined;
+};
+export declare function measureGroupChildren(groupId: string, cb: (childrenSizes: Record<string, Rect>) => void): () => void;
+//# sourceMappingURL=interface.d.ts.map

package/dist/commonjs/interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../src/interface.ts"],"names":[],"mappings":"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"}

package/dist/commonjs/interface.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPanelDomAttributes = getPanelDomAttributes;
+exports.getPanelResizerDomAttributes = getPanelResizerDomAttributes;
+exports.measureGroupChildren = measureGroupChildren;
+const state_1 = require("@window-splitter/state");
+function getPanelDomAttributes({ groupId, id, collapsible, collapsed, }) {
+    return {
+        id: id,
+        "data-splitter-group-id": groupId,
+        "data-splitter-type": "panel",
+        "data-splitter-id": id,
+        "data-collapsed": collapsible ? collapsed : undefined,
+    };
+}
+function getPanelResizerDomAttributes({ groupId, id, orientation, isDragging, activeDragHandleId, disabled, controlsId, min, max, currentValue, groupSize, }) {
+    return {
+        id: id,
+        role: "separator",
+        "data-splitter-type": "handle",
+        "data-splitter-id": id,
+        "data-splitter-group-id": groupId,
+        "data-handle-orientation": orientation,
+        "data-state": isDragging
+            ? "dragging"
+            : activeDragHandleId
+                ? "inactive"
+                : "idle",
+        "aria-label": "Resize Handle",
+        "aria-disabled": disabled,
+        "aria-controls": controlsId,
+        "aria-valuemin": min ? (0, state_1.getUnitPercentageValue)(groupSize, min) : undefined,
+        "aria-valuemax": max === "1fr"
+            ? 100
+            : max
+                ? (0, state_1.getUnitPercentageValue)(groupSize, max)
+                : undefined,
+        "aria-valuenow": currentValue
+            ? (0, state_1.getUnitPercentageValue)(groupSize, currentValue)
+            : undefined,
+    };
+}
+function measureGroupChildren(groupId, cb) {
+    const childrenObserver = new ResizeObserver((childrenEntries) => {
+        const childrenSizes = {};
+        for (const childEntry of childrenEntries) {
+            const child = childEntry.target;
+            const childId = child.getAttribute("data-splitter-id");
+            const childSize = childEntry.borderBoxSize[0];
+            if (childId && childSize) {
+                childrenSizes[childId] = {
+                    width: childSize.inlineSize,
+                    height: childSize.blockSize,
+                };
+            }
+        }
+        cb(childrenSizes);
+    });
+    const c = document.querySelectorAll(`[data-splitter-group-id="${groupId}"]`);
+    for (const child of c) {
+        childrenObserver.observe(child);
+    }
+    return () => {
+        childrenObserver.disconnect();
+    };
+}
+//# sourceMappingURL=interface.js.map

package/dist/commonjs/interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interface.js","sourceRoot":"","sources":["../../src/interface.ts"],"names":[],"mappings":";;AA8FA,sDAkBC;AAgBD,oEAmDC;AAED,oDAgCC;AArND,kDAUgC;AAoFhC,SAAgB,qBAAqB,CAAC,EACpC,OAAO,EACP,EAAE,EACF,WAAW,EACX,SAAS,GAMV;IACC,OAAO;QACL,EAAE,EAAE,EAAE;QACN,wBAAwB,EAAE,OAAO;QACjC,oBAAoB,EAAE,OAAO;QAC7B,kBAAkB,EAAE,EAAE;QACtB,gBAAgB,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;KACtD,CAAC;AACJ,CAAC;AAgBD,SAAgB,4BAA4B,CAAC,EAC3C,OAAO,EACP,EAAE,EACF,WAAW,EACX,UAAU,EACV,kBAAkB,EAClB,QAAQ,EACR,UAAU,EACV,GAAG,EACH,GAAG,EACH,YAAY,EACZ,SAAS,GAaV;IACC,OAAO;QACL,EAAE,EAAE,EAAE;QACN,IAAI,EAAE,WAAoB;QAC1B,oBAAoB,EAAE,QAAQ;QAC9B,kBAAkB,EAAE,EAAE;QACtB,wBAAwB,EAAE,OAAO;QACjC,yBAAyB,EAAE,WAAW;QACtC,YAAY,EAAE,UAAU;YACtB,CAAC,CAAC,UAAU;YACZ,CAAC,CAAC,kBAAkB;gBAClB,CAAC,CAAC,UAAU;gBACZ,CAAC,CAAC,MAAM;QACZ,YAAY,EAAE,eAAe;QAC7B,eAAe,EAAE,QAAQ;QACzB,eAAe,EAAE,UAAU;QAC3B,eAAe,EAAE,GAAG,CAAC,CAAC,CAAC,IAAA,8BAAsB,EAAC,SAAS,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS;QACzE,eAAe,EACb,GAAG,KAAK,KAAK;YACX,CAAC,CAAC,GAAG;YACL,CAAC,CAAC,GAAG;gBACH,CAAC,CAAC,IAAA,8BAAsB,EAAC,SAAS,EAAE,GAAG,CAAC;gBACxC,CAAC,CAAC,SAAS;QACjB,eAAe,EAAE,YAAY;YAC3B,CAAC,CAAC,IAAA,8BAAsB,EAAC,SAAS,EAAE,YAAY,CAAC;YACjD,CAAC,CAAC,SAAS;KACd,CAAC;AACJ,CAAC;AAED,SAAgB,oBAAoB,CAClC,OAAe,EACf,EAAiD;IAEjD,MAAM,gBAAgB,GAAG,IAAI,cAAc,CAAC,CAAC,eAAe,EAAE,EAAE;QAC9D,MAAM,aAAa,GAAsD,EAAE,CAAC;QAE5E,KAAK,MAAM,UAAU,IAAI,eAAe,EAAE,CAAC;YACzC,MAAM,KAAK,GAAG,UAAU,CAAC,MAAqB,CAAC;YAC/C,MAAM,OAAO,GAAG,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;YACvD,MAAM,SAAS,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YAE9C,IAAI,OAAO,IAAI,SAAS,EAAE,CAAC;gBACzB,aAAa,CAAC,OAAO,CAAC,GAAG;oBACvB,KAAK,EAAE,SAAS,CAAC,UAAU;oBAC3B,MAAM,EAAE,SAAS,CAAC,SAAS;iBAC5B,CAAC;YACJ,CAAC;QACH,CAAC;QAED,EAAE,CAAC,aAAa,CAAC,CAAC;IACpB,CAAC,CAAC,CAAC;IAEH,MAAM,CAAC,GAAG,QAAQ,CAAC,gBAAgB,CAAC,4BAA4B,OAAO,IAAI,CAAC,CAAC;IAE7E,KAAK,MAAM,KAAK,IAAI,CAAC,EAAE,CAAC;QACtB,gBAAgB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC;IAED,OAAO,GAAG,EAAE;QACV,gBAAgB,CAAC,UAAU,EAAE,CAAC;IAChC,CAAC,CAAC;AACJ,CAAC","sourcesContent":["import {\n  Constraints,\n  getUnitPercentageValue,\n  GroupMachineContextValue,\n  OnResizeCallback,\n  PanelData,\n  ParsedUnit,\n  PixelUnit,\n  Rect,\n  Unit,\n} from \"@window-splitter/state\";\n\nexport interface PanelGroupHandle {\n  /** The id of the group */\n  getId: () => string;\n  /** Get the sizes of all the items in the layout as pixels */\n  getPixelSizes: () => Array<number>;\n  /** Get the sizes of all the items in the layout as percentages of the group size */\n  getPercentageSizes: () => Array<number>;\n  /**\n   * Set the size of all the items in the layout.\n   * This just calls `setSize` on each item. It is up to\n   * you to make sure the sizes make sense.\n   *\n   * NOTE: Setting handle sizes will do nothing.\n   */\n  setSizes: (items: Array<Unit>) => void;\n  /** Get the template for the group in pixels. Useful for testing */\n  getTemplate: () => string;\n  getState: () => \"idle\" | \"dragging\";\n}\n\nexport interface SharedPanelGroupProps\n  extends Partial<\n    Pick<GroupMachineContextValue, \"orientation\" | \"autosaveStrategy\">\n  > {\n  /** Persisted state to initialized the machine with */\n  snapshot?: GroupMachineContextValue;\n  /** An id to use for autosaving the layout */\n  autosaveId?: string;\n}\n\nexport interface PanelHandle {\n  /** Collapse the panel */\n  collapse: () => void;\n  /** Returns true if the panel is collapsed */\n  isCollapsed: () => boolean;\n  /** Expand the panel */\n  expand: () => void;\n  /** Returns true if the panel is expanded */\n  isExpanded: () => boolean;\n  /** The id of the panel */\n  getId: () => string;\n  /** Get the size of the panel in pixels */\n  getPixelSize: () => number;\n  /** Get percentage of the panel relative to the group */\n  getPercentageSize: () => number;\n  /**\n   * Set the size of the panel in pixels.\n   *\n   * This will be clamped to the min/max values of the panel.\n   * If you want the panel to collapse/expand you should use the\n   * expand/collapse methods.\n   */\n  setSize: (size: Unit) => void;\n}\nexport interface SharedPanelProps<CollapsValue>\n  extends Constraints<Unit>,\n    Pick<PanelData, \"collapseAnimation\"> {\n  /** Callback called when the panel is resized */\n  onResize?: OnResizeCallback;\n  /**\n   * __CONTROLLED COMPONENT__\n   *\n   * If this prop is used it will be used as the source of truth for the collapsed state.\n   * It should be used in conjunction with the `onCollapseChange` prop.\n   *\n   * Use this if you want full control over the collapsed state. When trying to\n   * collapse a panel it will defer to onCollapseChange to determine if it should\n   * be collapsed.\n   */\n  collapsed?: CollapsValue;\n  /**\n   * __CONTROLLED COMPONENT__\n   *\n   * A callback called with the new desired collapsed state. If paired w\n   * with the `collapsed` prop this will be used to control the collapsed state.\n   *\n   * Otherwise this will just be called with the new collapsed state so you can\n   * use it to update your own state.\n   */\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nexport function getPanelDomAttributes({\n  groupId,\n  id,\n  collapsible,\n  collapsed,\n}: {\n  groupId: string | undefined;\n  id: string;\n  collapsible: boolean | undefined;\n  collapsed: boolean | undefined;\n}) {\n  return {\n    id: id,\n    \"data-splitter-group-id\": groupId,\n    \"data-splitter-type\": \"panel\",\n    \"data-splitter-id\": id,\n    \"data-collapsed\": collapsible ? collapsed : undefined,\n  };\n}\n\nexport interface SharedPanelResizerProps\n  extends Partial<Pick<PanelHandle, \"setSize\">> {\n  /** If the handle is disabled */\n  disabled?: boolean;\n  /** The size of the handle */\n  size?: PixelUnit;\n  /** Called when the user starts dragging the handle */\n  onDragStart?: () => void;\n  /** Called when the user drags the handle */\n  onDrag?: () => void;\n  /** Called when the user stops dragging the handle */\n  onDragEnd?: () => void;\n}\n\nexport function getPanelResizerDomAttributes({\n  groupId,\n  id,\n  orientation,\n  isDragging,\n  activeDragHandleId,\n  disabled,\n  controlsId,\n  min,\n  max,\n  currentValue,\n  groupSize,\n}: {\n  groupId: string | undefined;\n  id: string;\n  orientation: \"horizontal\" | \"vertical\";\n  isDragging: boolean;\n  activeDragHandleId: string | undefined;\n  disabled: boolean | undefined;\n  controlsId: string | undefined;\n  min: ParsedUnit | undefined;\n  max: ParsedUnit | \"1fr\" | undefined;\n  currentValue: ParsedUnit | undefined;\n  groupSize: number;\n}) {\n  return {\n    id: id,\n    role: \"separator\" as const,\n    \"data-splitter-type\": \"handle\",\n    \"data-splitter-id\": id,\n    \"data-splitter-group-id\": groupId,\n    \"data-handle-orientation\": orientation,\n    \"data-state\": isDragging\n      ? \"dragging\"\n      : activeDragHandleId\n        ? \"inactive\"\n        : \"idle\",\n    \"aria-label\": \"Resize Handle\",\n    \"aria-disabled\": disabled,\n    \"aria-controls\": controlsId,\n    \"aria-valuemin\": min ? getUnitPercentageValue(groupSize, min) : undefined,\n    \"aria-valuemax\":\n      max === \"1fr\"\n        ? 100\n        : max\n          ? getUnitPercentageValue(groupSize, max)\n          : undefined,\n    \"aria-valuenow\": currentValue\n      ? getUnitPercentageValue(groupSize, currentValue)\n      : undefined,\n  };\n}\n\nexport function measureGroupChildren(\n  groupId: string,\n  cb: (childrenSizes: Record<string, Rect>) => void\n) {\n  const childrenObserver = new ResizeObserver((childrenEntries) => {\n    const childrenSizes: Record<string, { width: number; height: number }> = {};\n\n    for (const childEntry of childrenEntries) {\n      const child = childEntry.target as HTMLElement;\n      const childId = child.getAttribute(\"data-splitter-id\");\n      const childSize = childEntry.borderBoxSize[0];\n\n      if (childId && childSize) {\n        childrenSizes[childId] = {\n          width: childSize.inlineSize,\n          height: childSize.blockSize,\n        };\n      }\n    }\n\n    cb(childrenSizes);\n  });\n\n  const c = document.querySelectorAll(`[data-splitter-group-id=\"${groupId}\"]`);\n\n  for (const child of c) {\n    childrenObserver.observe(child);\n  }\n\n  return () => {\n    childrenObserver.disconnect();\n  };\n}\n"]}

package/dist/commonjs/mergeAttributes.d.ts

@@ -0,0 +1,19 @@
+type Props = Record<string, any>;
+type PropsArg = Props | null | undefined;
+type TupleTypes<T> = {
+    [P in keyof T]: T[P];
+} extends {
+    [key: number]: infer V;
+} ? NullToObject<V> : never;
+type NullToObject<T> = T extends null | undefined ? object : T;
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+/**
+ * Merges multiple props objects together. Event handlers are chained,
+ * classNames are combined, and ids are deduplicated - different ids
+ * will trigger a side-effect and re-render components hooked up with `useId`.
+ * For all other props, the last prop object overrides all previous ones.
+ * @param args - Multiple sets of props to merge together.
+ */
+export declare function mergeAttributes<T extends PropsArg[]>(...args: T): UnionToIntersection<TupleTypes<T>>;
+export {};
+//# sourceMappingURL=mergeAttributes.d.ts.map

package/dist/commonjs/mergeAttributes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeAttributes.d.ts","sourceRoot":"","sources":["../../src/mergeAttributes.ts"],"names":[],"mappings":"AAwBA,KAAK,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAEjC,KAAK,QAAQ,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC;AAGzC,KAAK,UAAU,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAE,SAAS;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;CAAE,GAC5E,YAAY,CAAC,CAAC,CAAC,GACf,KAAK,CAAC;AACV,KAAK,YAAY,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,GAAG,SAAS,GAAG,MAAM,GAAG,CAAC,CAAC;AAE/D,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,GAAG,KAAK,CAAC,SAAS,CAC7E,CAAC,EAAE,MAAM,CAAC,KACP,IAAI,GACL,CAAC,GACD,KAAK,CAAC;AAEV;;;;;;GAMG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,QAAQ,EAAE,EAClD,GAAG,IAAI,EAAE,CAAC,GACT,mBAAmB,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAkCpC"}

package/dist/commonjs/mergeAttributes.js

@@ -0,0 +1,63 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergeAttributes = mergeAttributes;
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+function chain(...callbacks) {
+    return (...args) => {
+        for (const callback of callbacks) {
+            if (typeof callback === "function") {
+                callback(...args);
+            }
+        }
+    };
+}
+/**
+ * Merges multiple props objects together. Event handlers are chained,
+ * classNames are combined, and ids are deduplicated - different ids
+ * will trigger a side-effect and re-render components hooked up with `useId`.
+ * For all other props, the last prop object overrides all previous ones.
+ * @param args - Multiple sets of props to merge together.
+ */
+function mergeAttributes(...args) {
+    // Start with a base clone of the first argument. This is a lot faster than starting
+    // with an empty object and adding properties as we go.
+    const result = { ...args[0] };
+    for (let i = 1; i < args.length; i++) {
+        const props = args[i];
+        for (const key in props) {
+            const a = result[key];
+            const b = props[key];
+            // Chain events
+            if (typeof a === "function" &&
+                typeof b === "function" &&
+                // This is a lot faster than a regex.
+                key[0] === "o" &&
+                key[1] === "n" &&
+                key.charCodeAt(2) >= /* 'A' */ 65 &&
+                key.charCodeAt(2) <= /* 'Z' */ 90) {
+                result[key] = chain(a, b);
+            }
+            else if (key === "style" &&
+                typeof a === "object" &&
+                typeof b === "object") {
+                result[key] = { ...b, ...a };
+            }
+            else {
+                result[key] = b !== undefined ? b : a;
+            }
+        }
+    }
+    return result;
+}
+//# sourceMappingURL=mergeAttributes.js.map

package/dist/commonjs/mergeAttributes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeAttributes.js","sourceRoot":"","sources":["../../src/mergeAttributes.ts"],"names":[],"mappings":";AAAA,uDAAuD;;AA+CvD,0CAoCC;AAjFD;;;;;;;;;;GAUG;AAEH,SAAS,KAAK,CAAC,GAAG,SAAgB;IAChC,OAAO,CAAC,GAAG,IAAW,EAAE,EAAE;QACxB,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;YACjC,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;gBACnC,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;YACpB,CAAC;QACH,CAAC;IACH,CAAC,CAAC;AACJ,CAAC;AAkBD;;;;;;GAMG;AACH,SAAgB,eAAe,CAC7B,GAAG,IAAO;IAEV,oFAAoF;IACpF,uDAAuD;IACvD,MAAM,MAAM,GAAU,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACrC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACrC,MAAM,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;QACtB,KAAK,MAAM,GAAG,IAAI,KAAK,EAAE,CAAC;YACxB,MAAM,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;YACtB,MAAM,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;YAErB,eAAe;YACf,IACE,OAAO,CAAC,KAAK,UAAU;gBACvB,OAAO,CAAC,KAAK,UAAU;gBACvB,qCAAqC;gBACrC,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG;gBACd,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG;gBACd,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,EAAE;gBACjC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,EAAE,EACjC,CAAC;gBACD,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YAC5B,CAAC;iBAAM,IACL,GAAG,KAAK,OAAO;gBACf,OAAO,CAAC,KAAK,QAAQ;gBACrB,OAAO,CAAC,KAAK,QAAQ,EACrB,CAAC;gBACD,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACxC,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,MAA4C,CAAC;AACtD,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nfunction chain(...callbacks: any[]): (...args: any[]) => void {\n  return (...args: any[]) => {\n    for (const callback of callbacks) {\n      if (typeof callback === \"function\") {\n        callback(...args);\n      }\n    }\n  };\n}\n\ntype Props = Record<string, any>;\n\ntype PropsArg = Props | null | undefined;\n\n// taken from: https://stackoverflow.com/questions/51603250/typescript-3-parameter-list-intersection-type/51604379#51604379\ntype TupleTypes<T> = { [P in keyof T]: T[P] } extends { [key: number]: infer V }\n  ? NullToObject<V>\n  : never;\ntype NullToObject<T> = T extends null | undefined ? object : T;\n\ntype UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (\n  k: infer I\n) => void\n  ? I\n  : never;\n\n/**\n * Merges multiple props objects together. Event handlers are chained,\n * classNames are combined, and ids are deduplicated - different ids\n * will trigger a side-effect and re-render components hooked up with `useId`.\n * For all other props, the last prop object overrides all previous ones.\n * @param args - Multiple sets of props to merge together.\n */\nexport function mergeAttributes<T extends PropsArg[]>(\n  ...args: T\n): UnionToIntersection<TupleTypes<T>> {\n  // Start with a base clone of the first argument. This is a lot faster than starting\n  // with an empty object and adding properties as we go.\n  const result: Props = { ...args[0] };\n  for (let i = 1; i < args.length; i++) {\n    const props = args[i];\n    for (const key in props) {\n      const a = result[key];\n      const b = props[key];\n\n      // Chain events\n      if (\n        typeof a === \"function\" &&\n        typeof b === \"function\" &&\n        // This is a lot faster than a regex.\n        key[0] === \"o\" &&\n        key[1] === \"n\" &&\n        key.charCodeAt(2) >= /* 'A' */ 65 &&\n        key.charCodeAt(2) <= /* 'Z' */ 90\n      ) {\n        result[key] = chain(a, b);\n      } else if (\n        key === \"style\" &&\n        typeof a === \"object\" &&\n        typeof b === \"object\"\n      ) {\n        result[key] = { ...b, ...a };\n      } else {\n        result[key] = b !== undefined ? b : a;\n      }\n    }\n  }\n\n  return result as UnionToIntersection<TupleTypes<T>>;\n}\n"]}

package/dist/commonjs/move.d.ts

@@ -0,0 +1,52 @@
+export interface MoveResult {
+    /** Props to spread on the target element. */
+    moveProps: {
+        onPointerDown: (e: PointerEvent) => void;
+        onKeyDown: (e: KeyboardEvent) => void;
+    };
+}
+type PointerType = "mouse" | "pen" | "touch" | "keyboard" | "virtual";
+interface BaseMoveEvent {
+    /** The pointer type that triggered the move event. */
+    pointerType: PointerType;
+    /** Whether the shift keyboard modifier was held during the move event. */
+    shiftKey: boolean;
+    /** Whether the ctrl keyboard modifier was held during the move event. */
+    ctrlKey: boolean;
+    /** Whether the meta keyboard modifier was held during the move event. */
+    metaKey: boolean;
+    /** Whether the alt keyboard modifier was held during the move event. */
+    altKey: boolean;
+}
+interface MoveStartEvent extends BaseMoveEvent {
+    /** The type of move event being fired. */
+    type: "movestart";
+}
+interface MoveMoveEvent extends BaseMoveEvent {
+    /** The type of move event being fired. */
+    type: "move";
+    /** The amount moved in the X direction since the last event. */
+    deltaX: number;
+    /** The amount moved in the Y direction since the last event. */
+    deltaY: number;
+}
+interface MoveEndEvent extends BaseMoveEvent {
+    /** The type of move event being fired. */
+    type: "moveend";
+}
+export interface MoveEvents {
+    /** Handler that is called when a move interaction starts. */
+    onMoveStart?: (e: MoveStartEvent) => void;
+    /** Handler that is called when the element is moved. */
+    onMove?: (e: MoveMoveEvent) => void;
+    /** Handler that is called when a move interaction ends. */
+    onMoveEnd?: (e: MoveEndEvent) => void;
+}
+/**
+ * Handles move interactions across mouse, touch, and keyboard, including dragging with
+ * the mouse or touch, and using the arrow keys. Normalizes behavior across browsers and
+ * platforms, and ignores emulated mouse events on touch devices.
+ */
+export declare function move(props: MoveEvents): MoveResult;
+export {};
+//# sourceMappingURL=move.d.ts.map

package/dist/commonjs/move.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"move.d.ts","sourceRoot":"","sources":["../../src/move.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,UAAU;IACzB,6CAA6C;IAC7C,SAAS,EAAE;QACT,aAAa,EAAE,CAAC,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;QACzC,SAAS,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;KACvC,CAAC;CACH;AASD,KAAK,WAAW,GAAG,OAAO,GAAG,KAAK,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AAEtE,UAAU,aAAa;IACrB,sDAAsD;IACtD,WAAW,EAAE,WAAW,CAAC;IACzB,0EAA0E;IAC1E,QAAQ,EAAE,OAAO,CAAC;IAClB,yEAAyE;IACzE,OAAO,EAAE,OAAO,CAAC;IACjB,yEAAyE;IACzE,OAAO,EAAE,OAAO,CAAC;IACjB,wEAAwE;IACxE,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,UAAU,cAAe,SAAQ,aAAa;IAC5C,0CAA0C;IAC1C,IAAI,EAAE,WAAW,CAAC;CACnB;AAED,UAAU,aAAc,SAAQ,aAAa;IAC3C,0CAA0C;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,gEAAgE;IAChE,MAAM,EAAE,MAAM,CAAC;IACf,gEAAgE;IAChE,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,YAAa,SAAQ,aAAa;IAC1C,0CAA0C;IAC1C,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,WAAW,UAAU;IACzB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAC1C,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IACpC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;CACvC;AAED;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,UAAU,GAAG,UAAU,CAgJlD"}

package/dist/commonjs/move.js

@@ -0,0 +1,124 @@
+"use strict";
+// import {disableTextSelection, restoreTextSelection}  from './textSelection';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.move = move;
+/**
+ * Handles move interactions across mouse, touch, and keyboard, including dragging with
+ * the mouse or touch, and using the arrow keys. Normalizes behavior across browsers and
+ * platforms, and ignores emulated mouse events on touch devices.
+ */
+function move(props) {
+    const { onMoveStart, onMove: onMoveProp, onMoveEnd } = props;
+    const state = { didMove: false, lastPosition: null, id: null };
+    const onMove = (originalEvent, pointerType, deltaX, deltaY) => {
+        if (deltaX === 0 && deltaY === 0) {
+            return;
+        }
+        if (!state.didMove) {
+            state.didMove = true;
+            onMoveStart?.({
+                type: "movestart",
+                pointerType,
+                shiftKey: originalEvent.shiftKey,
+                metaKey: originalEvent.metaKey,
+                ctrlKey: originalEvent.ctrlKey,
+                altKey: originalEvent.altKey,
+            });
+        }
+        onMoveProp?.({
+            type: "move",
+            pointerType,
+            deltaX: deltaX,
+            deltaY: deltaY,
+            shiftKey: originalEvent.shiftKey,
+            metaKey: originalEvent.metaKey,
+            ctrlKey: originalEvent.ctrlKey,
+            altKey: originalEvent.altKey,
+        });
+    };
+    const end = (originalEvent, pointerType) => {
+        // restoreTextSelection();
+        if (state.didMove) {
+            onMoveEnd?.({
+                type: "moveend",
+                pointerType,
+                shiftKey: originalEvent.shiftKey,
+                metaKey: originalEvent.metaKey,
+                ctrlKey: originalEvent.ctrlKey,
+                altKey: originalEvent.altKey,
+            });
+        }
+    };
+    const moveProps = {};
+    const start = () => {
+        // disableTextSelection();
+        state.didMove = false;
+    };
+    const onPointerMove = (e) => {
+        if (e.pointerId === state.id) {
+            const pointerType = (e.pointerType || "mouse");
+            // Problems with PointerEvent#movementX/movementY:
+            // 1. it is always 0 on macOS Safari.
+            // 2. On Chrome Android, it's scaled by devicePixelRatio, but not on Chrome macOS
+            onMove(e, pointerType, e.pageX - (state.lastPosition?.pageX ?? 0), e.pageY - (state.lastPosition?.pageY ?? 0));
+            state.lastPosition = { pageX: e.pageX, pageY: e.pageY };
+        }
+    };
+    const onPointerUp = (e) => {
+        if (e.pointerId === state.id) {
+            const pointerType = (e.pointerType || "mouse");
+            end(e, pointerType);
+            state.id = null;
+            window.removeEventListener("pointermove", onPointerMove, false);
+            window.removeEventListener("pointerup", onPointerUp, false);
+            window.removeEventListener("pointercancel", onPointerUp, false);
+        }
+    };
+    moveProps.onPointerDown = (e) => {
+        if (e.button === 0 && state.id == null) {
+            start();
+            e.stopPropagation();
+            e.preventDefault();
+            state.lastPosition = { pageX: e.pageX, pageY: e.pageY };
+            state.id = e.pointerId;
+            window.addEventListener("pointermove", onPointerMove, false);
+            window.addEventListener("pointerup", onPointerUp, false);
+            window.addEventListener("pointercancel", onPointerUp, false);
+        }
+    };
+    const triggerKeyboardMove = (e, deltaX, deltaY) => {
+        start();
+        onMove(e, "keyboard", deltaX, deltaY);
+        end(e, "keyboard");
+    };
+    moveProps.onKeyDown = (e) => {
+        switch (e.key) {
+            case "Left":
+            case "ArrowLeft":
+                e.preventDefault();
+                e.stopPropagation();
+                triggerKeyboardMove(e, -1, 0);
+                break;
+            case "Right":
+            case "ArrowRight":
+                e.preventDefault();
+                e.stopPropagation();
+                triggerKeyboardMove(e, 1, 0);
+                break;
+            case "Up":
+            case "ArrowUp":
+                e.preventDefault();
+                e.stopPropagation();
+                triggerKeyboardMove(e, 0, -1);
+                break;
+            case "Down":
+            case "ArrowDown":
+                e.preventDefault();
+                e.stopPropagation();
+                triggerKeyboardMove(e, 0, 1);
+                break;
+        }
+    };
+    return { moveProps: moveProps };
+}
+//# sourceMappingURL=move.js.map