@window-splitter/svelte 0.8.4 → 0.8.6

package/.storybook/main.ts

@@ -15,16 +15,7 @@ const config: StorybookConfig = {
     "../src/**/*.stories.@(js|ts|svelte)",
     "../stories/**/*.stories.@(js|ts|svelte)",
   ],
-  addons: [
-    {
-      name: getAbsolutePath("@storybook/addon-essentials"),
-      options: {
-        docs: false,
-      },
-    },
-    getAbsolutePath("@storybook/addon-svelte-csf"),
-    getAbsolutePath("@storybook/addon-interactions"),
-  ],
+  addons: [getAbsolutePath("@storybook/addon-svelte-csf")],
   framework: {
     name: getAbsolutePath("@storybook/svelte-vite"),
     options: {},

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
 
 
-> @window-splitter/svelte@0.8.3 build /Users/andrew/Documents/react-window-splitter/packages/svelte
+> @window-splitter/svelte@0.8.5 build /Users/andrew/Documents/react-window-splitter/packages/svelte
 > svelte-package
 
 src/lib -> dist

package/.turbo/turbo-lint.log

@@ -0,0 +1,18 @@
+
+
+> @window-splitter/svelte@0.8.4 lint /Users/andrew/Documents/react-window-splitter/packages/svelte
+> eslint .
+
+=============
+
+WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.
+
+You may find that it works just fine, or you may not.
+
+SUPPORTED TYPESCRIPT VERSIONS: >=4.7.4 <5.6.0
+
+YOUR TYPESCRIPT VERSION: 5.8.3
+
+Please only submit bug reports when using the officially supported version.
+
+=============

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+# v0.8.5 (Sun May 04 2025)
+
+#### 🐛 Bug Fix
+
+- Vue Adapter [#56](https://github.com/hipstersmoothie/window-splitter/pull/56) ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- fix unmount not running ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- get builds working ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- catalogs ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- linting ([@hipstersmoothie](https://github.com/hipstersmoothie))
+- starting to work ([@hipstersmoothie](https://github.com/hipstersmoothie))
+
+#### ⚠️ Pushed to `main`
+
+- add link ([@hipstersmoothie](https://github.com/hipstersmoothie))
+
+#### Authors: 1
+
+- Andrew Lisowski ([@hipstersmoothie](https://github.com/hipstersmoothie))
+
+---
+
 # v0.8.4 (Sat May 03 2025)
 
 #### 🐛 Bug Fix

package/dist/Panel.svelte

@@ -19,7 +19,7 @@
 
   export { PanelHandle } from "@window-splitter/interface";
 
-  interface Props
+  export interface PanelProps
     extends SharedPanelProps<boolean>,
       HTMLAttributes<HTMLDivElement> {}
 
@@ -38,7 +38,7 @@
     default: defaultSize,
     isStaticAtRest,
     ...attrs
-  }: Props = $props();
+  }: PanelProps = $props();
 
   const defaultId = $props.id();
   const id = _id || defaultId;
@@ -119,9 +119,7 @@
   });
 
   $effect(() => () => {
-    requestAnimationFrame(() => {
-      send({ type: "unregisterPanel", id });
-    });
+    requestAnimationFrame(() => send({ type: "unregisterPanel", id }));
   });
 
   const isControlledCollapse = $derived(panelData()?.collapseIsControlled);

package/dist/Panel.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { SharedPanelProps } from "@window-splitter/interface";
 import type { Unit } from "@window-splitter/state";
 import type { HTMLAttributes } from "svelte/elements";
-interface Props extends SharedPanelProps<boolean>, HTMLAttributes<HTMLDivElement> {
+export interface PanelProps extends SharedPanelProps<boolean>, HTMLAttributes<HTMLDivElement> {
 }
-declare const Panel: import("svelte").Component<Props, {
+declare const Panel: import("svelte").Component<PanelProps, {
     PanelHandle: typeof PanelHandle;
     getId: () => string;
     collapse: () => void;

package/dist/Panel.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Panel.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AASnE,OAAO,KAAK,EAIR,IAAI,EACL,MAAM,wBAAwB,CAAC;AAElC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,UAAU,KACR,SAAQ,gBAAgB,CAAC,OAAO,CAAC,EAC/B,cAAc,CAAC,cAAc,CAAC;CAAG;AAkKvC,QAAA,MAAM,KAAK;iBADsQ,OAAO,WAAW;;;;;;;oBAXzQ,IAAI;;MAYqB,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Panel.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Panel.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AASnE,OAAO,KAAK,EAIR,IAAI,EACL,MAAM,wBAAwB,CAAC;AAElC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,WAAW,UACf,SAAQ,gBAAgB,CAAC,OAAO,CAAC,EAC/B,cAAc,CAAC,cAAc,CAAC;CAAG;AAgKvC,QAAA,MAAM,KAAK;iBAD2Q,OAAO,WAAW;;;;;;;oBAX9Q,IAAI;;MAYqB,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}

package/dist/PanelGroup.svelte

@@ -16,7 +16,7 @@
 
   export { PanelGroupHandle } from "@window-splitter/interface";
 
-  interface Props
+  export interface PanelGroupProps
     extends SharedPanelGroupProps,
       HTMLAttributes<HTMLDivElement> {
     id: string;
@@ -29,7 +29,7 @@
     autosaveId,
     snapshot,
     ...attrs
-  }: Props = $props();
+  }: PanelGroupProps = $props();
 
   if (
     !snapshot &&
@@ -54,10 +54,7 @@
       autosaveStrategy,
       ...(snapshot ? prepareSnapshot(snapshot) : undefined),
     },
-    (s) => {
-      if (!context) return;
-      updateContext(s);
-    }
+    (s) => updateContext(s)
   );
 
   const context = $state<GroupMachineContextValue>(initialState);
@@ -101,7 +98,8 @@
     // re-render when the childIds change
     // eslint-disable-next-line @typescript-eslint/no-unused-expressions
     childIds;
-    measureGroupChildren(id, (childrenSizes) => {
+
+    return measureGroupChildren(id, (childrenSizes) => {
       send({ type: "setActualItemsSize", childrenSizes });
     });
   });

package/dist/PanelGroup.svelte.d.ts

@@ -1,10 +1,10 @@
 import type { SharedPanelGroupProps } from "@window-splitter/interface";
 import type { Unit } from "@window-splitter/state";
 import type { HTMLAttributes } from "svelte/elements";
-interface Props extends SharedPanelGroupProps, HTMLAttributes<HTMLDivElement> {
+export interface PanelGroupProps extends SharedPanelGroupProps, HTMLAttributes<HTMLDivElement> {
     id: string;
 }
-declare const PanelGroup: import("svelte").Component<Props, {
+declare const PanelGroup: import("svelte").Component<PanelGroupProps, {
     PanelGroupHandle: typeof PanelGroupHandle;
     getId: () => string;
     getPixelSizes: () => number[];

package/dist/PanelGroup.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelGroup.svelte.d.ts","sourceRoot":"","sources":["../src/lib/PanelGroup.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAWxE,OAAO,KAAK,EAA4B,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE7E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,UAAU,KACR,SAAQ,qBAAqB,EAC3B,cAAc,CAAC,cAAc,CAAC;IAChC,EAAE,EAAE,MAAM,CAAC;CACZ;AA0IH,QAAA,MAAM,UAAU;sBADgP,OAAO,gBAAgB;;;;;;wBA3BzP,KAAK,CAAC,IAAI,CAAC;MA4Be,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"PanelGroup.svelte.d.ts","sourceRoot":"","sources":["../src/lib/PanelGroup.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAWxE,OAAO,KAAK,EAA4B,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE7E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,WAAW,eACf,SAAQ,qBAAqB,EAC3B,cAAc,CAAC,cAAc,CAAC;IAChC,EAAE,EAAE,MAAM,CAAC;CACZ;AAwIH,QAAA,MAAM,UAAU;sBAD0P,OAAO,gBAAgB;;;;;;wBA3BnQ,KAAK,CAAC,IAAI,CAAC;MA4Be,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/PanelResizer.svelte

@@ -20,7 +20,7 @@
   } from "@window-splitter/interface";
   import type { HTMLAttributes } from "svelte/elements";
 
-  interface Props
+  export interface PanelResizerProps
     extends SharedPanelResizerProps,
       HTMLAttributes<HTMLDivElement> {}
 
@@ -32,7 +32,7 @@
     onDragEnd,
     disabled,
     ...attrs
-  }: Props = $props();
+  }: PanelResizerProps = $props();
 
   const defaultId = $props.id();
   const id = _id || defaultId;
@@ -87,9 +87,7 @@
   });
 
   $effect(() => () => {
-    requestAnimationFrame(() => {
-      send({ type: "unregisterPanelHandle", id });
-    });
+    requestAnimationFrame(() => send({ type: "unregisterPanelHandle", id }));
   });
 
   const { moveProps } = move({
@@ -109,8 +107,8 @@
     },
   });
 
-  const itemIndex = 1;
   const panelAttributes = () => {
+    const itemIndex = state.items.findIndex((item) => item.id === id);
     const panelBeforeHandle = state?.items[itemIndex - 1];
 
     if (!panelBeforeHandle || !isPanelData(panelBeforeHandle)) return { id };

package/dist/PanelResizer.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { SharedPanelResizerProps } from "@window-splitter/interface";
 import type { HTMLAttributes } from "svelte/elements";
-interface Props extends SharedPanelResizerProps, HTMLAttributes<HTMLDivElement> {
+export interface PanelResizerProps extends SharedPanelResizerProps, HTMLAttributes<HTMLDivElement> {
 }
-declare const PanelResizer: import("svelte").Component<Props, {}, "">;
+declare const PanelResizer: import("svelte").Component<PanelResizerProps, {}, "">;
 type PanelResizer = ReturnType<typeof PanelResizer>;
 export default PanelResizer;
 //# sourceMappingURL=PanelResizer.svelte.d.ts.map

package/dist/PanelResizer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelResizer.svelte.d.ts","sourceRoot":"","sources":["../src/lib/PanelResizer.svelte.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AAK1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,UAAU,KACR,SAAQ,uBAAuB,EAC7B,cAAc,CAAC,cAAc,CAAC;CAAG;AAqJvC,QAAA,MAAM,YAAY,2CAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"PanelResizer.svelte.d.ts","sourceRoot":"","sources":["../src/lib/PanelResizer.svelte.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AAK1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,WAAW,iBACf,SAAQ,uBAAuB,EAC7B,cAAc,CAAC,cAAc,CAAC;CAAG;AAmJvC,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/eslint.config.js

@@ -6,6 +6,7 @@ import svelteConfig from "./svelte.config.js";
 
 export default [
   ...base,
+  { ignores: [".svelte-kit/**"] },
   ...svelte.configs["flat/recommended"],
   {
     files: ["**/*.svelte", "**/*.svelte.ts", "**/*.svelte.js"],

package/package.json

@@ -2,7 +2,7 @@
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@window-splitter/svelte",
   "sideEffects": false,
-  "version": "0.8.4",
+  "version": "0.8.6",
   "description": "A WAI-ARIA compliant window splitter for Svelte.",
   "repository": {
     "url": "https://github.com/hipstersmoothie/window-splitter",
@@ -30,43 +30,38 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@internal/eslint-config": "0.8.4",
+    "@internal/eslint-config": "0.8.6",
     "@rsbuild/core": "^1.3.12",
     "@rsdoctor/rspack-plugin": "^1.0.2",
-    "@storybook/addon-essentials": "^8.6.12",
-    "@storybook/addon-interactions": "^8.6.12",
     "@storybook/addon-svelte-csf": "^5.0.0-next.0",
-    "@storybook/blocks": "^8.6.12",
     "@storybook/svelte": "^8.6.12",
     "@storybook/svelte-vite": "^8.6.12",
-    "@storybook/test": "^8.6.12",
     "@sveltejs/package": "^2.3.11",
     "@sveltejs/vite-plugin-svelte": "^5.0.3",
-    "@testing-library/jest-dom": "^6.4.8",
+    "@testing-library/jest-dom": "catalog:",
     "@testing-library/svelte": "^5.2.7",
     "@types/node": "^20.14.10",
-    "@vitest/browser": "^3.1.2",
-    "@vitest/coverage-istanbul": "^3.1.2",
-    "@vitest/coverage-v8": "^3.1.2",
-    "eslint": "^9.9.0",
-    "eslint-plugin-storybook": "^0.12.0",
+    "@vitest/browser": "catalog:",
+    "@vitest/coverage-istanbul": "catalog:",
+    "@vitest/coverage-v8": "catalog:",
+    "eslint": "catalog:",
     "eslint-plugin-svelte": "^2.35.1",
     "framer-motion": "^11.3.28",
     "jsdom": "^24.1.1",
-    "playwright": "^1.46.0",
+    "playwright": "catalog:",
     "storybook": "^8.6.12",
     "svelte": "^5.28.2",
     "tiny-cookie": "^2.5.1",
-    "typescript": "^5.5.4",
+    "typescript": "catalog:",
     "vite": "^6.3.3",
-    "vitest": "^3.1.2"
+    "vitest": "catalog:"
   },
   "peerDependencies": {
     "svelte": ">=5.x"
   },
   "dependencies": {
-    "@window-splitter/interface": "0.8.4",
-    "@window-splitter/state": "0.8.4"
+    "@window-splitter/interface": "0.8.6",
+    "@window-splitter/state": "0.8.6"
   },
   "type": "module",
   "exports": {
@@ -83,10 +78,5 @@
     "resizable",
     "window"
   ],
-  "eslintConfig": {
-    "extends": [
-      "plugin:storybook/recommended"
-    ]
-  },
-  "gitHead": "b71dcbded56d12a3e78294802e56d97d179b0bf6"
+  "gitHead": "7bdd351ea9e9a209d4a8db3a66f7742ee8e2db1b"
 }

package/src/lib/Panel.svelte

@@ -19,7 +19,7 @@
 
   export { PanelHandle } from "@window-splitter/interface";
 
-  interface Props
+  export interface PanelProps
     extends SharedPanelProps<boolean>,
       HTMLAttributes<HTMLDivElement> {}
 
@@ -38,7 +38,7 @@
     default: defaultSize,
     isStaticAtRest,
     ...attrs
-  }: Props = $props();
+  }: PanelProps = $props();
 
   const defaultId = $props.id();
   const id = _id || defaultId;
@@ -119,9 +119,7 @@
   });
 
   $effect(() => () => {
-    requestAnimationFrame(() => {
-      send({ type: "unregisterPanel", id });
-    });
+    requestAnimationFrame(() => send({ type: "unregisterPanel", id }));
   });
 
   const isControlledCollapse = $derived(panelData()?.collapseIsControlled);

package/src/lib/PanelGroup.svelte

@@ -16,7 +16,7 @@
 
   export { PanelGroupHandle } from "@window-splitter/interface";
 
-  interface Props
+  export interface PanelGroupProps
     extends SharedPanelGroupProps,
       HTMLAttributes<HTMLDivElement> {
     id: string;
@@ -29,7 +29,7 @@
     autosaveId,
     snapshot,
     ...attrs
-  }: Props = $props();
+  }: PanelGroupProps = $props();
 
   if (
     !snapshot &&
@@ -54,10 +54,7 @@
       autosaveStrategy,
       ...(snapshot ? prepareSnapshot(snapshot) : undefined),
     },
-    (s) => {
-      if (!context) return;
-      updateContext(s);
-    }
+    (s) => updateContext(s)
   );
 
   const context = $state<GroupMachineContextValue>(initialState);
@@ -101,7 +98,8 @@
     // re-render when the childIds change
     // eslint-disable-next-line @typescript-eslint/no-unused-expressions
     childIds;
-    measureGroupChildren(id, (childrenSizes) => {
+
+    return measureGroupChildren(id, (childrenSizes) => {
       send({ type: "setActualItemsSize", childrenSizes });
     });
   });

package/src/lib/PanelResizer.svelte

@@ -20,7 +20,7 @@
   } from "@window-splitter/interface";
   import type { HTMLAttributes } from "svelte/elements";
 
-  interface Props
+  export interface PanelResizerProps
     extends SharedPanelResizerProps,
       HTMLAttributes<HTMLDivElement> {}
 
@@ -32,7 +32,7 @@
     onDragEnd,
     disabled,
     ...attrs
-  }: Props = $props();
+  }: PanelResizerProps = $props();
 
   const defaultId = $props.id();
   const id = _id || defaultId;
@@ -87,9 +87,7 @@
   });
 
   $effect(() => () => {
-    requestAnimationFrame(() => {
-      send({ type: "unregisterPanelHandle", id });
-    });
+    requestAnimationFrame(() => send({ type: "unregisterPanelHandle", id }));
   });
 
   const { moveProps } = move({
@@ -109,8 +107,8 @@
     },
   });
 
-  const itemIndex = 1;
   const panelAttributes = () => {
+    const itemIndex = state.items.findIndex((item) => item.id === id);
     const panelBeforeHandle = state?.items[itemIndex - 1];
 
     if (!panelBeforeHandle || !isPanelData(panelBeforeHandle)) return { id };