@zag-js/splitter 0.2.5 → 0.2.7

package/dist/splitter.machine.mjs

@@ -0,0 +1,8 @@
+import {
+  machine
+} from "./chunk-IOEWCDUH.mjs";
+import "./chunk-T56NFB6E.mjs";
+import "./chunk-SQ3UMXCZ.mjs";
+export {
+  machine
+};

package/dist/splitter.types.d.ts

@@ -0,0 +1,68 @@
+import { StateMachine } from '@zag-js/core';
+import { RequiredBy, DirectionProperty, CommonProperties, Context } from '@zag-js/types';
+
+type PanelId = string | number;
+type PanelSizeData = {
+    id: PanelId;
+    size?: number;
+    minSize?: number;
+    maxSize?: number;
+};
+type ResizeDetails = {
+    size: PanelSizeData[];
+    activeHandleId: string | null;
+};
+type PublicContext = DirectionProperty & CommonProperties & {
+    orientation: "horizontal" | "vertical";
+    size: PanelSizeData[];
+    onResize?: (details: ResizeDetails) => void;
+    onResizeStart?: (details: ResizeDetails) => void;
+    onResizeEnd?: (details: ResizeDetails) => void;
+};
+type UserDefinedContext = RequiredBy<PublicContext, "id">;
+type NormalizedPanelData = Array<Required<PanelSizeData> & {
+    remainingSize: number;
+    minSize: number;
+    maxSize: number;
+    start: number;
+    end: number;
+}>;
+type ComputedContext = Readonly<{
+    isHorizontal: boolean;
+    panels: NormalizedPanelData;
+    activeResizeBounds?: {
+        min: number;
+        max: number;
+    };
+    activeResizePanels?: {
+        before: PanelSizeData;
+        after: PanelSizeData;
+    };
+}>;
+type PrivateContext = Context<{
+    activeResizeId: string | null;
+    previousPanels: NormalizedPanelData;
+    activeResizeState: {
+        isAtMin: boolean;
+        isAtMax: boolean;
+    };
+    initialSize: Array<Required<Pick<PanelSizeData, "id" | "size">>>;
+}>;
+type MachineContext = PublicContext & ComputedContext & PrivateContext;
+type MachineState = {
+    value: "unknown" | "idle" | "hover:temp" | "hover" | "dragging" | "focused";
+    tags: "focus";
+};
+type State = StateMachine.State<MachineContext, MachineState>;
+type Send = StateMachine.Send<StateMachine.AnyEventObject>;
+type PanelProps = {
+    id: PanelId;
+    snapSize?: number;
+};
+type ResizeTriggerProps = {
+    id: `${PanelId}:${PanelId}`;
+    step?: number;
+    disabled?: boolean;
+};
+
+export { MachineContext, MachineState, NormalizedPanelData, PanelId, PanelProps, ResizeTriggerProps, Send, State, UserDefinedContext };

package/dist/splitter.types.js

@@ -0,0 +1,18 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/splitter.types.ts
+var splitter_types_exports = {};
+module.exports = __toCommonJS(splitter_types_exports);

package/dist/splitter.utils.d.ts

@@ -0,0 +1,54 @@
+import { MachineContext, NormalizedPanelData, PanelId } from './splitter.types.js';
+import '@zag-js/core';
+import '@zag-js/types';
+
+declare function getNormalizedPanels(ctx: MachineContext): NormalizedPanelData;
+declare function getHandlePanels(ctx: MachineContext, id?: string | null): {
+    before: {
+        index: number;
+        id: PanelId;
+        size: number;
+        minSize: number;
+        maxSize: number;
+        remainingSize: number;
+        start: number;
+        end: number;
+    };
+    after: {
+        index: number;
+        id: PanelId;
+        size: number;
+        minSize: number;
+        maxSize: number;
+        remainingSize: number;
+        start: number;
+        end: number;
+    };
+} | undefined;
+declare function getHandleBounds(ctx: MachineContext, id?: string | null): {
+    min: number;
+    max: number;
+} | undefined;
+declare function getPanelBounds(ctx: MachineContext, id?: string | null): {
+    before: {
+        index: number;
+        min: number;
+        max: number;
+        isAtMin: boolean;
+        isAtMax: boolean;
+        up(step: number): number;
+        down(step: number): number;
+    };
+    after: {
+        index: number;
+        min: number;
+        max: number;
+        isAtMin: boolean;
+        isAtMax: boolean;
+        up(step: number): number;
+        down(step: number): number;
+    };
+} | undefined;
+declare function clamp(value: number, min: number, max: number): number;
+
+export { clamp, getHandleBounds, getHandlePanels, getNormalizedPanels, getPanelBounds };

package/dist/splitter.utils.js

@@ -0,0 +1,159 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/splitter.utils.ts
+var splitter_utils_exports = {};
+__export(splitter_utils_exports, {
+  clamp: () => clamp,
+  getHandleBounds: () => getHandleBounds,
+  getHandlePanels: () => getHandlePanels,
+  getNormalizedPanels: () => getNormalizedPanels,
+  getPanelBounds: () => getPanelBounds
+});
+module.exports = __toCommonJS(splitter_utils_exports);
+function validateSize(key, size) {
+  if (Math.floor(size) > 100) {
+    throw new Error(`Total ${key} of panels cannot be greater than 100`);
+  }
+}
+function getNormalizedPanels(ctx) {
+  let numOfPanelsWithoutSize = 0;
+  let totalSize = 0;
+  let totalMinSize = 0;
+  const panels = ctx.size.map((panel) => {
+    var _a, _b;
+    const minSize = (_a = panel.minSize) != null ? _a : 10;
+    const maxSize = (_b = panel.maxSize) != null ? _b : 100;
+    totalMinSize += minSize;
+    if (panel.size == null) {
+      numOfPanelsWithoutSize++;
+    } else {
+      totalSize += panel.size;
+    }
+    return {
+      ...panel,
+      minSize,
+      maxSize
+    };
+  });
+  validateSize("minSize", totalMinSize);
+  validateSize("size", totalSize);
+  let end = 0;
+  let remainingSize = 0;
+  const result = panels.map((panel) => {
+    let start = end;
+    if (panel.size != null) {
+      end += panel.size;
+      remainingSize = panel.size - panel.minSize;
+      return {
+        ...panel,
+        start,
+        end,
+        remainingSize
+      };
+    }
+    const size = (100 - totalSize) / numOfPanelsWithoutSize;
+    end += size;
+    remainingSize = size - panel.minSize;
+    return { ...panel, size, start, end, remainingSize };
+  });
+  return result;
+}
+function getHandlePanels(ctx, id = ctx.activeResizeId) {
+  var _a;
+  const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
+  if (!beforeId || !afterId)
+    return;
+  const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
+  const afterIndex = ctx.previousPanels.findIndex((panel) => panel.id === afterId);
+  if (beforeIndex === -1 || afterIndex === -1)
+    return;
+  const before = ctx.previousPanels[beforeIndex];
+  const after = ctx.previousPanels[afterIndex];
+  return {
+    before: {
+      ...before,
+      index: beforeIndex
+    },
+    after: {
+      ...after,
+      index: afterIndex
+    }
+  };
+}
+function getHandleBounds(ctx, id = ctx.activeResizeId) {
+  const panels = getHandlePanels(ctx, id);
+  if (!panels)
+    return;
+  const { before, after } = panels;
+  return {
+    min: Math.max(before.start + before.minSize, after.end - after.maxSize),
+    max: Math.min(after.end - after.minSize, before.maxSize + before.start)
+  };
+}
+function getPanelBounds(ctx, id) {
+  const bounds = getHandleBounds(ctx, id);
+  const panels = getHandlePanels(ctx, id);
+  if (!bounds || !panels)
+    return;
+  const { before, after } = panels;
+  const beforeMin = Math.abs(before.start - bounds.min);
+  const afterMin = after.size + (before.size - beforeMin);
+  const beforeMax = Math.abs(before.start - bounds.max);
+  const afterMax = after.size - (beforeMax - before.size);
+  return {
+    before: {
+      index: before.index,
+      min: beforeMin,
+      max: beforeMax,
+      isAtMin: beforeMin === before.size,
+      isAtMax: beforeMax === before.size,
+      up(step) {
+        return Math.min(before.size + step, beforeMax);
+      },
+      down(step) {
+        return Math.max(before.size - step, beforeMin);
+      }
+    },
+    after: {
+      index: after.index,
+      min: afterMin,
+      max: afterMax,
+      isAtMin: afterMin === after.size,
+      isAtMax: afterMax === after.size,
+      up(step) {
+        return Math.min(after.size + step, afterMin);
+      },
+      down(step) {
+        return Math.max(after.size - step, afterMax);
+      }
+    }
+  };
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  clamp,
+  getHandleBounds,
+  getHandlePanels,
+  getNormalizedPanels,
+  getPanelBounds
+});

package/dist/splitter.utils.mjs

@@ -0,0 +1,14 @@
+import {
+  clamp,
+  getHandleBounds,
+  getHandlePanels,
+  getNormalizedPanels,
+  getPanelBounds
+} from "./chunk-SQ3UMXCZ.mjs";
+export {
+  clamp,
+  getHandleBounds,
+  getHandlePanels,
+  getNormalizedPanels,
+  getPanelBounds
+};

package/package.json

@@ -1,10 +1,7 @@
 {
   "name": "@zag-js/splitter",
-  "version": "0.2.5",
+  "version": "0.2.7",
   "description": "Core logic for the splitter widget implemented as a state machine",
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
-  "types": "dist/index.d.ts",
   "keywords": [
     "js",
     "machine",
@@ -30,19 +27,32 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "0.1.2",
-    "@zag-js/core": "0.2.3",
-    "@zag-js/types": "0.3.1"
+    "@zag-js/anatomy": "0.1.3",
+    "@zag-js/core": "0.2.5",
+    "@zag-js/types": "0.3.3"
   },
   "devDependencies": {
-    "@zag-js/dom-utils": "0.2.1",
-    "@zag-js/number-utils": "0.2.1",
-    "@zag-js/utils": "0.3.1"
+    "clean-package": "2.2.0",
+    "@zag-js/dom-utils": "0.2.3",
+    "@zag-js/number-utils": "0.2.2",
+    "@zag-js/utils": "0.3.2"
+  },
+  "clean-package": "../../../clean-package.config.json",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
   },
   "scripts": {
-    "build-fast": "tsup src/index.ts --format=esm,cjs",
+    "build-fast": "tsup src",
     "start": "pnpm build --watch",
-    "build": "tsup src/index.ts --format=esm,cjs --dts",
+    "build": "tsup src --dts",
     "test": "jest --config ../../../jest.config.js --rootDir . --passWithNoTests",
     "lint": "eslint src --ext .ts,.tsx",
     "test-ci": "pnpm test --ci --runInBand",