@zag-js/auto-resize 1.34.1 → 1.35.0

package/dist/autoresize-input.d.mts

@@ -0,0 +1,3 @@
+declare function autoResizeInput(input: HTMLInputElement | null): (() => void) | undefined;
+
+export { autoResizeInput };

package/dist/autoresize-input.d.ts

@@ -0,0 +1,3 @@
+declare function autoResizeInput(input: HTMLInputElement | null): (() => void) | undefined;
+
+export { autoResizeInput };

package/dist/autoresize-input.js

@@ -0,0 +1,61 @@
+"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/autoresize-input.ts
+var autoresize_input_exports = {};
+__export(autoresize_input_exports, {
+  autoResizeInput: () => autoResizeInput
+});
+module.exports = __toCommonJS(autoresize_input_exports);
+var import_dom_query = require("@zag-js/dom-query");
+var import_visual_style = require("./visual-style.cjs");
+function createGhostElement(doc) {
+  const el = doc.createElement("div");
+  el.id = "ghost";
+  el.style.cssText = "display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;";
+  doc.body.appendChild(el);
+  return el;
+}
+function autoResizeInput(input) {
+  if (!input) return;
+  const doc = (0, import_dom_query.getDocument)(input);
+  const win = (0, import_dom_query.getWindow)(input);
+  const ghost = createGhostElement(doc);
+  const cssText = (0, import_visual_style.getVisualStyles)(input);
+  if (cssText) ghost.style.cssText += cssText;
+  function resize() {
+    win.requestAnimationFrame(() => {
+      ghost.innerHTML = input.value;
+      const rect = win.getComputedStyle(ghost);
+      input?.style.setProperty("width", rect.width);
+    });
+  }
+  resize();
+  input?.addEventListener("input", resize);
+  input?.addEventListener("change", resize);
+  return () => {
+    doc.body.removeChild(ghost);
+    input?.removeEventListener("input", resize);
+    input?.removeEventListener("change", resize);
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  autoResizeInput
+});

package/dist/autoresize-input.mjs

@@ -0,0 +1,36 @@
+// src/autoresize-input.ts
+import { getDocument, getWindow } from "@zag-js/dom-query";
+import { getVisualStyles } from "./visual-style.mjs";
+function createGhostElement(doc) {
+  const el = doc.createElement("div");
+  el.id = "ghost";
+  el.style.cssText = "display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;";
+  doc.body.appendChild(el);
+  return el;
+}
+function autoResizeInput(input) {
+  if (!input) return;
+  const doc = getDocument(input);
+  const win = getWindow(input);
+  const ghost = createGhostElement(doc);
+  const cssText = getVisualStyles(input);
+  if (cssText) ghost.style.cssText += cssText;
+  function resize() {
+    win.requestAnimationFrame(() => {
+      ghost.innerHTML = input.value;
+      const rect = win.getComputedStyle(ghost);
+      input?.style.setProperty("width", rect.width);
+    });
+  }
+  resize();
+  input?.addEventListener("input", resize);
+  input?.addEventListener("change", resize);
+  return () => {
+    doc.body.removeChild(ghost);
+    input?.removeEventListener("input", resize);
+    input?.removeEventListener("change", resize);
+  };
+}
+export {
+  autoResizeInput
+};

package/dist/autoresize-textarea.d.mts

@@ -0,0 +1,3 @@
+declare const autoresizeTextarea: (el: HTMLTextAreaElement | null) => (() => void) | undefined;
+
+export { autoresizeTextarea };

package/dist/autoresize-textarea.d.ts

@@ -0,0 +1,3 @@
+declare const autoresizeTextarea: (el: HTMLTextAreaElement | null) => (() => void) | undefined;
+
+export { autoresizeTextarea };

package/dist/autoresize-textarea.js

@@ -0,0 +1,89 @@
+"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/autoresize-textarea.ts
+var autoresize_textarea_exports = {};
+__export(autoresize_textarea_exports, {
+  autoresizeTextarea: () => autoresizeTextarea
+});
+module.exports = __toCommonJS(autoresize_textarea_exports);
+var import_dom_query = require("@zag-js/dom-query");
+var autoresizeTextarea = (el) => {
+  if (!el) return;
+  const style = (0, import_dom_query.getComputedStyle)(el);
+  const win = (0, import_dom_query.getWindow)(el);
+  const doc = (0, import_dom_query.getDocument)(el);
+  const resize = () => {
+    requestAnimationFrame(() => {
+      el.style.height = "auto";
+      let newHeight;
+      if (style.boxSizing === "content-box") {
+        newHeight = el.scrollHeight - (parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
+      } else {
+        newHeight = el.scrollHeight + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
+      }
+      if (style.maxHeight !== "none" && newHeight > parseFloat(style.maxHeight)) {
+        if (style.overflowY === "hidden") {
+          el.style.overflowY = "scroll";
+        }
+        newHeight = parseFloat(style.maxHeight);
+      } else if (style.overflowY !== "hidden") {
+        el.style.overflowY = "hidden";
+      }
+      el.style.height = `${newHeight}px`;
+    });
+  };
+  el.addEventListener("input", resize);
+  el.form?.addEventListener("reset", resize);
+  const elementPrototype = Object.getPrototypeOf(el);
+  const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, "value");
+  if (descriptor) {
+    Object.defineProperty(el, "value", {
+      ...descriptor,
+      set(newValue) {
+        const prevValue = descriptor.get?.call(this);
+        descriptor.set?.call(this, newValue);
+        resize();
+        if (prevValue !== newValue) {
+          queueMicrotask(() => {
+            el.dispatchEvent(new win.InputEvent("input", { bubbles: true }));
+          });
+        }
+      }
+    });
+  }
+  const resizeObserver = new win.ResizeObserver(() => {
+    requestAnimationFrame(() => resize());
+  });
+  resizeObserver.observe(el);
+  const attrObserver = new win.MutationObserver(() => resize());
+  attrObserver.observe(el, { attributes: true, attributeFilter: ["rows", "placeholder"] });
+  doc.fonts?.addEventListener("loadingdone", resize);
+  return () => {
+    el.removeEventListener("input", resize);
+    el.form?.removeEventListener("reset", resize);
+    doc.fonts?.removeEventListener("loadingdone", resize);
+    resizeObserver.disconnect();
+    attrObserver.disconnect();
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  autoresizeTextarea
+});

package/dist/autoresize-textarea.mjs

@@ -0,0 +1,64 @@
+// src/autoresize-textarea.ts
+import { getComputedStyle, getDocument, getWindow } from "@zag-js/dom-query";
+var autoresizeTextarea = (el) => {
+  if (!el) return;
+  const style = getComputedStyle(el);
+  const win = getWindow(el);
+  const doc = getDocument(el);
+  const resize = () => {
+    requestAnimationFrame(() => {
+      el.style.height = "auto";
+      let newHeight;
+      if (style.boxSizing === "content-box") {
+        newHeight = el.scrollHeight - (parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
+      } else {
+        newHeight = el.scrollHeight + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
+      }
+      if (style.maxHeight !== "none" && newHeight > parseFloat(style.maxHeight)) {
+        if (style.overflowY === "hidden") {
+          el.style.overflowY = "scroll";
+        }
+        newHeight = parseFloat(style.maxHeight);
+      } else if (style.overflowY !== "hidden") {
+        el.style.overflowY = "hidden";
+      }
+      el.style.height = `${newHeight}px`;
+    });
+  };
+  el.addEventListener("input", resize);
+  el.form?.addEventListener("reset", resize);
+  const elementPrototype = Object.getPrototypeOf(el);
+  const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, "value");
+  if (descriptor) {
+    Object.defineProperty(el, "value", {
+      ...descriptor,
+      set(newValue) {
+        const prevValue = descriptor.get?.call(this);
+        descriptor.set?.call(this, newValue);
+        resize();
+        if (prevValue !== newValue) {
+          queueMicrotask(() => {
+            el.dispatchEvent(new win.InputEvent("input", { bubbles: true }));
+          });
+        }
+      }
+    });
+  }
+  const resizeObserver = new win.ResizeObserver(() => {
+    requestAnimationFrame(() => resize());
+  });
+  resizeObserver.observe(el);
+  const attrObserver = new win.MutationObserver(() => resize());
+  attrObserver.observe(el, { attributes: true, attributeFilter: ["rows", "placeholder"] });
+  doc.fonts?.addEventListener("loadingdone", resize);
+  return () => {
+    el.removeEventListener("input", resize);
+    el.form?.removeEventListener("reset", resize);
+    doc.fonts?.removeEventListener("loadingdone", resize);
+    resizeObserver.disconnect();
+    attrObserver.disconnect();
+  };
+};
+export {
+  autoresizeTextarea
+};

package/dist/index.d.mts

@@ -1,5 +1,2 @@
-declare function autoResizeInput(input: HTMLInputElement | null): (() => void) | undefined;
-
-declare const autoresizeTextarea: (el: HTMLTextAreaElement | null) => (() => void) | undefined;
-
-export { autoResizeInput, autoresizeTextarea };
+export { autoResizeInput } from './autoresize-input.mjs';
+export { autoresizeTextarea } from './autoresize-textarea.mjs';

package/dist/index.d.ts

@@ -1,5 +1,2 @@
-declare function autoResizeInput(input: HTMLInputElement | null): (() => void) | undefined;
-
-declare const autoresizeTextarea: (el: HTMLTextAreaElement | null) => (() => void) | undefined;
-
-export { autoResizeInput, autoresizeTextarea };
+export { autoResizeInput } from './autoresize-input.js';
+export { autoresizeTextarea } from './autoresize-textarea.js';

package/dist/index.js

@@ -1,104 +1,26 @@
-'use strict';
-
-var domQuery = require('@zag-js/dom-query');
-
-// src/autoresize-input.ts
-function getVisualStyles(node) {
-  if (!node) return;
-  const style = domQuery.getComputedStyle(node);
-  return "box-sizing:" + style.boxSizing + ";border-left:" + style.borderLeftWidth + " solid red;border-right:" + style.borderRightWidth + " solid red;font-family:" + style.fontFamily + ";font-feature-settings:" + style.fontFeatureSettings + ";font-kerning:" + style.fontKerning + ";font-size:" + style.fontSize + ";font-stretch:" + style.fontStretch + ";font-style:" + style.fontStyle + ";font-variant:" + style.fontVariant + ";font-variant-caps:" + style.fontVariantCaps + ";font-variant-ligatures:" + style.fontVariantLigatures + ";font-variant-numeric:" + style.fontVariantNumeric + ";font-weight:" + style.fontWeight + ";letter-spacing:" + style.letterSpacing + ";margin-left:" + style.marginLeft + ";margin-right:" + style.marginRight + ";padding-left:" + style.paddingLeft + ";padding-right:" + style.paddingRight + ";text-indent:" + style.textIndent + ";text-transform:" + style.textTransform;
-}
-
-// src/autoresize-input.ts
-function createGhostElement(doc) {
-  var el = doc.createElement("div");
-  el.id = "ghost";
-  el.style.cssText = "display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;";
-  doc.body.appendChild(el);
-  return el;
-}
-function autoResizeInput(input) {
-  if (!input) return;
-  const doc = domQuery.getDocument(input);
-  const win = domQuery.getWindow(input);
-  const ghost = createGhostElement(doc);
-  const cssText = getVisualStyles(input);
-  if (cssText) ghost.style.cssText += cssText;
-  function resize() {
-    win.requestAnimationFrame(() => {
-      ghost.innerHTML = input.value;
-      const rect = win.getComputedStyle(ghost);
-      input?.style.setProperty("width", rect.width);
-    });
-  }
-  resize();
-  input?.addEventListener("input", resize);
-  input?.addEventListener("change", resize);
-  return () => {
-    doc.body.removeChild(ghost);
-    input?.removeEventListener("input", resize);
-    input?.removeEventListener("change", resize);
-  };
-}
-var autoresizeTextarea = (el) => {
-  if (!el) return;
-  const style = domQuery.getComputedStyle(el);
-  const win = domQuery.getWindow(el);
-  const doc = domQuery.getDocument(el);
-  const resize = () => {
-    requestAnimationFrame(() => {
-      el.style.height = "auto";
-      let newHeight;
-      if (style.boxSizing === "content-box") {
-        newHeight = el.scrollHeight - (parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
-      } else {
-        newHeight = el.scrollHeight + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
-      }
-      if (style.maxHeight !== "none" && newHeight > parseFloat(style.maxHeight)) {
-        if (style.overflowY === "hidden") {
-          el.style.overflowY = "scroll";
-        }
-        newHeight = parseFloat(style.maxHeight);
-      } else if (style.overflowY !== "hidden") {
-        el.style.overflowY = "hidden";
-      }
-      el.style.height = `${newHeight}px`;
-    });
-  };
-  el.addEventListener("input", resize);
-  el.form?.addEventListener("reset", resize);
-  const elementPrototype = Object.getPrototypeOf(el);
-  const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, "value");
-  if (descriptor) {
-    Object.defineProperty(el, "value", {
-      ...descriptor,
-      set(newValue) {
-        const prevValue = descriptor.get?.call(this);
-        descriptor.set?.call(this, newValue);
-        resize();
-        if (prevValue !== newValue) {
-          queueMicrotask(() => {
-            el.dispatchEvent(new win.InputEvent("input", { bubbles: true }));
-          });
-        }
-      }
-    });
+"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 });
   }
-  const resizeObserver = new win.ResizeObserver(() => {
-    requestAnimationFrame(() => resize());
-  });
-  resizeObserver.observe(el);
-  const attrObserver = new win.MutationObserver(() => resize());
-  attrObserver.observe(el, { attributes: true, attributeFilter: ["rows", "placeholder"] });
-  doc.fonts?.addEventListener("loadingdone", resize);
-  return () => {
-    el.removeEventListener("input", resize);
-    el.form?.removeEventListener("reset", resize);
-    doc.fonts?.removeEventListener("loadingdone", resize);
-    resizeObserver.disconnect();
-    attrObserver.disconnect();
-  };
+  return to;
 };
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-exports.autoResizeInput = autoResizeInput;
-exports.autoresizeTextarea = autoresizeTextarea;
+// src/index.ts
+var index_exports = {};
+module.exports = __toCommonJS(index_exports);
+__reExport(index_exports, require("./autoresize-input.cjs"), module.exports);
+__reExport(index_exports, require("./autoresize-textarea.cjs"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./autoresize-input.cjs"),
+  ...require("./autoresize-textarea.cjs")
+});

package/dist/index.mjs

@@ -1,101 +1,3 @@
-import { getDocument, getWindow, getComputedStyle } from '@zag-js/dom-query';
-
-// src/autoresize-input.ts
-function getVisualStyles(node) {
-  if (!node) return;
-  const style = getComputedStyle(node);
-  return "box-sizing:" + style.boxSizing + ";border-left:" + style.borderLeftWidth + " solid red;border-right:" + style.borderRightWidth + " solid red;font-family:" + style.fontFamily + ";font-feature-settings:" + style.fontFeatureSettings + ";font-kerning:" + style.fontKerning + ";font-size:" + style.fontSize + ";font-stretch:" + style.fontStretch + ";font-style:" + style.fontStyle + ";font-variant:" + style.fontVariant + ";font-variant-caps:" + style.fontVariantCaps + ";font-variant-ligatures:" + style.fontVariantLigatures + ";font-variant-numeric:" + style.fontVariantNumeric + ";font-weight:" + style.fontWeight + ";letter-spacing:" + style.letterSpacing + ";margin-left:" + style.marginLeft + ";margin-right:" + style.marginRight + ";padding-left:" + style.paddingLeft + ";padding-right:" + style.paddingRight + ";text-indent:" + style.textIndent + ";text-transform:" + style.textTransform;
-}
-
-// src/autoresize-input.ts
-function createGhostElement(doc) {
-  var el = doc.createElement("div");
-  el.id = "ghost";
-  el.style.cssText = "display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;";
-  doc.body.appendChild(el);
-  return el;
-}
-function autoResizeInput(input) {
-  if (!input) return;
-  const doc = getDocument(input);
-  const win = getWindow(input);
-  const ghost = createGhostElement(doc);
-  const cssText = getVisualStyles(input);
-  if (cssText) ghost.style.cssText += cssText;
-  function resize() {
-    win.requestAnimationFrame(() => {
-      ghost.innerHTML = input.value;
-      const rect = win.getComputedStyle(ghost);
-      input?.style.setProperty("width", rect.width);
-    });
-  }
-  resize();
-  input?.addEventListener("input", resize);
-  input?.addEventListener("change", resize);
-  return () => {
-    doc.body.removeChild(ghost);
-    input?.removeEventListener("input", resize);
-    input?.removeEventListener("change", resize);
-  };
-}
-var autoresizeTextarea = (el) => {
-  if (!el) return;
-  const style = getComputedStyle(el);
-  const win = getWindow(el);
-  const doc = getDocument(el);
-  const resize = () => {
-    requestAnimationFrame(() => {
-      el.style.height = "auto";
-      let newHeight;
-      if (style.boxSizing === "content-box") {
-        newHeight = el.scrollHeight - (parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
-      } else {
-        newHeight = el.scrollHeight + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
-      }
-      if (style.maxHeight !== "none" && newHeight > parseFloat(style.maxHeight)) {
-        if (style.overflowY === "hidden") {
-          el.style.overflowY = "scroll";
-        }
-        newHeight = parseFloat(style.maxHeight);
-      } else if (style.overflowY !== "hidden") {
-        el.style.overflowY = "hidden";
-      }
-      el.style.height = `${newHeight}px`;
-    });
-  };
-  el.addEventListener("input", resize);
-  el.form?.addEventListener("reset", resize);
-  const elementPrototype = Object.getPrototypeOf(el);
-  const descriptor = Object.getOwnPropertyDescriptor(elementPrototype, "value");
-  if (descriptor) {
-    Object.defineProperty(el, "value", {
-      ...descriptor,
-      set(newValue) {
-        const prevValue = descriptor.get?.call(this);
-        descriptor.set?.call(this, newValue);
-        resize();
-        if (prevValue !== newValue) {
-          queueMicrotask(() => {
-            el.dispatchEvent(new win.InputEvent("input", { bubbles: true }));
-          });
-        }
-      }
-    });
-  }
-  const resizeObserver = new win.ResizeObserver(() => {
-    requestAnimationFrame(() => resize());
-  });
-  resizeObserver.observe(el);
-  const attrObserver = new win.MutationObserver(() => resize());
-  attrObserver.observe(el, { attributes: true, attributeFilter: ["rows", "placeholder"] });
-  doc.fonts?.addEventListener("loadingdone", resize);
-  return () => {
-    el.removeEventListener("input", resize);
-    el.form?.removeEventListener("reset", resize);
-    doc.fonts?.removeEventListener("loadingdone", resize);
-    resizeObserver.disconnect();
-    attrObserver.disconnect();
-  };
-};
-
-export { autoResizeInput, autoresizeTextarea };
+// src/index.ts
+export * from "./autoresize-input.mjs";
+export * from "./autoresize-textarea.mjs";

package/dist/visual-style.d.mts

@@ -0,0 +1,4 @@
+declare function getVisualStyles(node: HTMLElement | null): string | undefined;
+declare function getLayoutStyles(node: HTMLElement | null): string | undefined;
+
+export { getLayoutStyles, getVisualStyles };

package/dist/visual-style.d.ts

@@ -0,0 +1,4 @@
+declare function getVisualStyles(node: HTMLElement | null): string | undefined;
+declare function getLayoutStyles(node: HTMLElement | null): string | undefined;
+
+export { getLayoutStyles, getVisualStyles };

package/dist/visual-style.js

@@ -0,0 +1,42 @@
+"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/visual-style.ts
+var visual_style_exports = {};
+__export(visual_style_exports, {
+  getLayoutStyles: () => getLayoutStyles,
+  getVisualStyles: () => getVisualStyles
+});
+module.exports = __toCommonJS(visual_style_exports);
+var import_dom_query = require("@zag-js/dom-query");
+function getVisualStyles(node) {
+  if (!node) return;
+  const style = (0, import_dom_query.getComputedStyle)(node);
+  return "box-sizing:" + style.boxSizing + ";border-left:" + style.borderLeftWidth + " solid red;border-right:" + style.borderRightWidth + " solid red;font-family:" + style.fontFamily + ";font-feature-settings:" + style.fontFeatureSettings + ";font-kerning:" + style.fontKerning + ";font-size:" + style.fontSize + ";font-stretch:" + style.fontStretch + ";font-style:" + style.fontStyle + ";font-variant:" + style.fontVariant + ";font-variant-caps:" + style.fontVariantCaps + ";font-variant-ligatures:" + style.fontVariantLigatures + ";font-variant-numeric:" + style.fontVariantNumeric + ";font-weight:" + style.fontWeight + ";letter-spacing:" + style.letterSpacing + ";margin-left:" + style.marginLeft + ";margin-right:" + style.marginRight + ";padding-left:" + style.paddingLeft + ";padding-right:" + style.paddingRight + ";text-indent:" + style.textIndent + ";text-transform:" + style.textTransform;
+}
+function getLayoutStyles(node) {
+  if (!node) return;
+  const style = (0, import_dom_query.getComputedStyle)(node);
+  return "width:" + style.width + ";max-width:" + style.maxWidth + ";min-width:" + style.minWidth + ";height:" + style.height + ";max-height:" + style.maxHeight + ";min-height:" + style.minHeight + ";box-sizing:" + style.boxSizing;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getLayoutStyles,
+  getVisualStyles
+});

package/dist/visual-style.mjs

@@ -0,0 +1,16 @@
+// src/visual-style.ts
+import { getComputedStyle } from "@zag-js/dom-query";
+function getVisualStyles(node) {
+  if (!node) return;
+  const style = getComputedStyle(node);
+  return "box-sizing:" + style.boxSizing + ";border-left:" + style.borderLeftWidth + " solid red;border-right:" + style.borderRightWidth + " solid red;font-family:" + style.fontFamily + ";font-feature-settings:" + style.fontFeatureSettings + ";font-kerning:" + style.fontKerning + ";font-size:" + style.fontSize + ";font-stretch:" + style.fontStretch + ";font-style:" + style.fontStyle + ";font-variant:" + style.fontVariant + ";font-variant-caps:" + style.fontVariantCaps + ";font-variant-ligatures:" + style.fontVariantLigatures + ";font-variant-numeric:" + style.fontVariantNumeric + ";font-weight:" + style.fontWeight + ";letter-spacing:" + style.letterSpacing + ";margin-left:" + style.marginLeft + ";margin-right:" + style.marginRight + ";padding-left:" + style.paddingLeft + ";padding-right:" + style.paddingRight + ";text-indent:" + style.textIndent + ";text-transform:" + style.textTransform;
+}
+function getLayoutStyles(node) {
+  if (!node) return;
+  const style = getComputedStyle(node);
+  return "width:" + style.width + ";max-width:" + style.maxWidth + ";min-width:" + style.minWidth + ";height:" + style.height + ";max-height:" + style.maxHeight + ";min-height:" + style.minHeight + ";box-sizing:" + style.boxSizing;
+}
+export {
+  getLayoutStyles,
+  getVisualStyles
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/auto-resize",
-  "version": "1.34.1",
+  "version": "1.35.0",
   "description": "Autoresize utilities for the web",
   "keywords": [
     "js",
@@ -22,7 +22,7 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/dom-query": "1.34.1"
+    "@zag-js/dom-query": "1.35.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"