@window-splitter/vue 1.0.2 → 1.1.1--canary.9d2f98a.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@window-splitter/vue",
-  "version": "1.0.2",
+  "version": "1.1.1--canary.9d2f98a.0",
   "sideEffects": false,
   "homepage": "https://react-window-splitter-six.vercel.app",
   "repository": {
@@ -38,7 +38,7 @@
   "license": "MIT",
   "description": "A WAI-ARIA compliant window splitter for Vue.",
   "devDependencies": {
-    "@internal/eslint-config": "1.0.2",
+    "@internal/eslint-config": "1.1.1--canary.9d2f98a.0",
     "@storybook/vue3": "^8.6.12",
     "@storybook/vue3-vite": "^8.6.12",
     "@testing-library/dom": "^10.4.0",
@@ -60,8 +60,8 @@
     "vue": "^3.5.13"
   },
   "dependencies": {
-    "@window-splitter/interface": "1.0.2",
-    "@window-splitter/state": "1.0.2"
+    "@window-splitter/interface": "1.1.1--canary.9d2f98a.0",
+    "@window-splitter/state": "1.1.1--canary.9d2f98a.0"
   },
   "peerDependencies": {
     "vue": ">=3.x"
@@ -80,5 +80,5 @@
   },
   "types": "./dist/index.d.ts",
   "module": "./dist/index.mjs",
-  "gitHead": "c9d2802d3c8ff3df8d7911b417130ab118ada6c1"
+  "gitHead": "9d2f98a3d6226018c598018cea829d6412b60cd0"
 }

package/src/Panel.vue

@@ -131,15 +131,19 @@ onUnmounted(() => {
 
 defineExpose<PanelHandle>({
   getId: () => panelId,
-  collapse: () => {
+  collapse: async () => {
     if (!panelData.value?.collapsible) return;
-    send?.({ type: "collapsePanel", panelId: panelId, controlled: true });
+    return await new Promise<void>((resolve) => {
+      send?.({ type: "collapsePanel", panelId: panelId, controlled: true, resolve });
+    });
   },
   isCollapsed: () =>
     Boolean(panelData.value?.collapsible && panelData.value?.collapsed),
-  expand: () => {
+  expand: async () => {
     if (!panelData.value?.collapsible) return;
-    send?.({ type: "expandPanel", panelId: panelId, controlled: true });
+    return await new Promise<void>((resolve) => {
+      send?.({ type: "expandPanel", panelId: panelId, controlled: true, resolve });
+    });
   },
   isExpanded: () =>
     Boolean(panelData.value?.collapsible && !panelData.value?.collapsed),

package/src/PanelGroup.vue

@@ -33,6 +33,7 @@ const {
   snapshot: snapshotProp,
   autosaveId,
   id,
+  shiftAmount,
   ...attrs
 } = defineProps<PanelGroupProps>();
 
@@ -60,6 +61,7 @@ const [initialState, send, machineState] = groupMachine(
     orientation: orientation,
     groupId,
     autosaveStrategy: autosaveStrategy,
+    shiftAmount,
     ...(snapshot ? prepareSnapshot(snapshot) : undefined),
   },
   (s) => {

package/src/VueWindowSplitter.test.ts

@@ -101,10 +101,10 @@ describe("Autosave", () => {
     await expectTemplate(handle.value!, "342px 10px 146px");
 
     await waitForCondition(() =>
-      Boolean(localStorage.getItem("autosave-example-vue")),
+      Boolean(localStorage.getItem("autosave-example-vue"))
     );
     const obj = JSON.parse(
-      localStorage.getItem("autosave-example-vue") || "{}",
+      localStorage.getItem("autosave-example-vue") || "{}"
     );
     expect(obj.items).toMatchSnapshot();
   });
@@ -145,7 +145,7 @@ describe("Autosave", () => {
     await expectTemplate(handle.value!, "343px 10px 147px");
 
     await waitForCondition(() =>
-      document.cookie.includes("autosave-cookie-vue"),
+      document.cookie.includes("autosave-cookie-vue")
     );
 
     expect(document.cookie).toMatchSnapshot();
@@ -172,18 +172,24 @@ test("Keyboard interactions with collapsed panels", async () => {
 
   const resizer2 = document.getElementById("resizer-2")!;
   fireEvent.keyDown(resizer2, { key: "Enter" });
-  await expectTemplate(handle.value!, "209px 10px 169px 10px 100px");
+  await expectTemplate(
+    handle.value!,
+    "209.015625px 10px 167px 10px 101.984375px"
+  );
 
   fireEvent.keyDown(resizer2, { key: "ArrowLeft" });
   fireEvent.keyDown(resizer2, { key: "ArrowLeft" });
   fireEvent.keyDown(resizer2, { key: "ArrowLeft" });
   fireEvent.keyDown(resizer2, { key: "ArrowLeft" });
-  await expectTemplate(handle.value!, "209px 10px 165px 10px 104px");
+  await expectTemplate(
+    handle.value!,
+    "209.015625px 10px 163px 10px 105.984375px"
+  );
 
   fireEvent.keyDown(resizer2, { key: "ArrowLeft", shiftKey: true });
   await expectTemplate(
     handle.value!,
-    "209.03125px 10px 149.984375px 10px 118.984375px",
+    "209.03125px 10px 147.984375px 10px 120.984375px"
   );
 
   fireEvent.keyDown(resizer2, { key: "Enter" });
@@ -192,7 +198,7 @@ test("Keyboard interactions with collapsed panels", async () => {
   fireEvent.keyDown(resizer2, { key: "Enter" });
   await expectTemplate(
     handle.value!,
-    "209.0625px 10px 149.96875px 10px 118.96875px",
+    "209.046875px 10px 144.9375px 10px 124.015625px"
   );
 });
 
@@ -260,10 +266,10 @@ describe("imperative panel API", async () => {
     expect(leftHandle.value!.isCollapsed()).toBe(true);
     expect(leftHandle.value!.isExpanded()).toBe(false);
     expect(rightHandle.value!.getPercentageSize()).toBe(
-      leftHandle.value!.getPercentageSize(),
+      leftHandle.value!.getPercentageSize()
     );
     expect(rightHandle.value!.getPixelSize()).toBe(
-      leftHandle.value!.getPixelSize(),
+      leftHandle.value!.getPixelSize()
     );
 
     leftHandle.value!.expand();

package/src/__snapshots__/VueWindowSplitter.test.ts.snap

@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Autosave > cookie 1`] = `"autosave-cookie-vue=%7B%22size%22%3A%7B%22x%22%3A0%2C%22y%22%3A0%2C%22width%22%3A500%2C%22height%22%3A198%2C%22top%22%3A0%2C%22right%22%3A500%2C%22bottom%22%3A198%2C%22left%22%3A0%7D%2C%22items%22%3A%5B%7B%22type%22%3A%22panel%22%2C%22currentValue%22%3A%7B%22type%22%3A%22percent%22%2C%22value%22%3A%220.7%22%7D%2C%22min%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22max%22%3A%221fr%22%2C%22collapsible%22%3Afalse%2C%22collapsedSize%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22onResize%22%3A%7B%7D%2C%22collapseIsControlled%22%3Afalse%2C%22id%22%3A%22panel-1%22%2C%22isStaticAtRest%22%3Afalse%7D%2C%7B%22type%22%3A%22handle%22%2C%22size%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%2210%22%7D%2C%22id%22%3A%22resizer1%22%7D%2C%7B%22type%22%3A%22panel%22%2C%22currentValue%22%3A%7B%22type%22%3A%22percent%22%2C%22value%22%3A%220.3%22%7D%2C%22min%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22max%22%3A%221fr%22%2C%22collapsible%22%3Afalse%2C%22collapsedSize%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22onResize%22%3A%7B%7D%2C%22collapseIsControlled%22%3Afalse%2C%22id%22%3A%22panel-2%22%2C%22isStaticAtRest%22%3Afalse%7D%5D%2C%22orientation%22%3A%22horizontal%22%2C%22dragOvershoot%22%3A%220%22%2C%22groupId%22%3A%22autosave-cookie-vue%22%2C%22autosaveStrategy%22%3A%22cookie%22%7D"`;
+exports[`Autosave > cookie 1`] = `"autosave-cookie-vue=%7B%22size%22%3A%7B%22x%22%3A0%2C%22y%22%3A0%2C%22width%22%3A500%2C%22height%22%3A198%2C%22top%22%3A0%2C%22right%22%3A500%2C%22bottom%22%3A198%2C%22left%22%3A0%7D%2C%22items%22%3A%5B%7B%22type%22%3A%22panel%22%2C%22currentValue%22%3A%7B%22type%22%3A%22percent%22%2C%22value%22%3A%220.7%22%7D%2C%22min%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22max%22%3A%221fr%22%2C%22collapsible%22%3Afalse%2C%22collapsedSize%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22onResize%22%3A%7B%7D%2C%22collapseIsControlled%22%3Afalse%2C%22id%22%3A%22panel-1%22%2C%22isStaticAtRest%22%3Afalse%7D%2C%7B%22type%22%3A%22handle%22%2C%22size%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%2210%22%7D%2C%22id%22%3A%22resizer1%22%7D%2C%7B%22type%22%3A%22panel%22%2C%22currentValue%22%3A%7B%22type%22%3A%22percent%22%2C%22value%22%3A%220.3%22%7D%2C%22min%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22max%22%3A%221fr%22%2C%22collapsible%22%3Afalse%2C%22collapsedSize%22%3A%7B%22type%22%3A%22pixel%22%2C%22value%22%3A%220%22%7D%2C%22onResize%22%3A%7B%7D%2C%22collapseIsControlled%22%3Afalse%2C%22id%22%3A%22panel-2%22%2C%22isStaticAtRest%22%3Afalse%7D%5D%2C%22orientation%22%3A%22horizontal%22%2C%22dragOvershoot%22%3A%220%22%2C%22groupId%22%3A%22autosave-cookie-vue%22%2C%22autosaveStrategy%22%3A%22cookie%22%2C%22shiftAmount%22%3A15%7D"`;
 
 exports[`Autosave > localStorage 1`] = `
 [