@zag-js/auto-resize 0.56.0 → 0.56.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +2 -4
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -4
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -25,8 +25,7 @@ __export(src_exports, {
|
|
|
25
25
|
module.exports = __toCommonJS(src_exports);
|
|
26
26
|
var import_dom_query = require("@zag-js/dom-query");
|
|
27
27
|
function copyVisualStyles(fromEl, toEl) {
|
|
28
|
-
if (!fromEl)
|
|
29
|
-
return;
|
|
28
|
+
if (!fromEl) return;
|
|
30
29
|
const win = (0, import_dom_query.getWindow)(fromEl);
|
|
31
30
|
const el = win.getComputedStyle(fromEl);
|
|
32
31
|
const cssText = "box-sizing:" + el.boxSizing + ";border-left:" + el.borderLeftWidth + " solid red;border-right:" + el.borderRightWidth + " solid red;font-family:" + el.fontFamily + ";font-feature-settings:" + el.fontFeatureSettings + ";font-kerning:" + el.fontKerning + ";font-size:" + el.fontSize + ";font-stretch:" + el.fontStretch + ";font-style:" + el.fontStyle + ";font-variant:" + el.fontVariant + ";font-variant-caps:" + el.fontVariantCaps + ";font-variant-ligatures:" + el.fontVariantLigatures + ";font-variant-numeric:" + el.fontVariantNumeric + ";font-weight:" + el.fontWeight + ";letter-spacing:" + el.letterSpacing + ";margin-left:" + el.marginLeft + ";margin-right:" + el.marginRight + ";padding-left:" + el.paddingLeft + ";padding-right:" + el.paddingRight + ";text-indent:" + el.textIndent + ";text-transform:" + el.textTransform;
|
|
@@ -40,8 +39,7 @@ function createGhostElement(doc) {
|
|
|
40
39
|
return el;
|
|
41
40
|
}
|
|
42
41
|
function autoResizeInput(input) {
|
|
43
|
-
if (!input)
|
|
44
|
-
return;
|
|
42
|
+
if (!input) return;
|
|
45
43
|
const doc = (0, import_dom_query.getDocument)(input);
|
|
46
44
|
const win = (0, import_dom_query.getWindow)(input);
|
|
47
45
|
const ghost = createGhostElement(doc);
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { getDocument, getWindow } from \"@zag-js/dom-query\"\n\nfunction copyVisualStyles(fromEl: HTMLElement | null, toEl: HTMLElement) {\n if (!fromEl) return\n\n const win = getWindow(fromEl)\n const el = win.getComputedStyle(fromEl)\n\n // prettier-ignore\n const cssText = 'box-sizing:' + el.boxSizing +\n ';border-left:' + el.borderLeftWidth + ' solid red' +\n ';border-right:' + el.borderRightWidth + ' solid red' +\n ';font-family:' + el.fontFamily +\n ';font-feature-settings:' + el.fontFeatureSettings +\n ';font-kerning:' + el.fontKerning +\n ';font-size:' + el.fontSize +\n ';font-stretch:' + el.fontStretch +\n ';font-style:' + el.fontStyle +\n ';font-variant:' + el.fontVariant +\n ';font-variant-caps:' + el.fontVariantCaps +\n ';font-variant-ligatures:' + el.fontVariantLigatures +\n ';font-variant-numeric:' + el.fontVariantNumeric +\n ';font-weight:' + el.fontWeight +\n ';letter-spacing:' + el.letterSpacing +\n ';margin-left:' + el.marginLeft +\n ';margin-right:' + el.marginRight +\n ';padding-left:' + el.paddingLeft +\n ';padding-right:' + el.paddingRight +\n ';text-indent:' + el.textIndent +\n ';text-transform:' + el.textTransform\n\n toEl.style.cssText += cssText\n}\n\nfunction createGhostElement(doc: Document) {\n var el = doc.createElement(\"div\")\n el.id = \"ghost\"\n el.style.cssText =\n \"display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;\"\n doc.body.appendChild(el)\n return el\n}\n\nexport function autoResizeInput(input: HTMLInputElement | null) {\n if (!input) return\n const doc = getDocument(input)\n const win = getWindow(input)\n\n const ghost = createGhostElement(doc)\n\n copyVisualStyles(input, ghost)\n\n function resize() {\n win.requestAnimationFrame(() => {\n ghost.innerHTML = input!.value\n const rect = win.getComputedStyle(ghost)\n input?.style.setProperty(\"width\", rect.width)\n })\n }\n\n resize()\n\n input?.addEventListener(\"input\", resize)\n input?.addEventListener(\"change\", resize)\n\n return () => {\n doc.body.removeChild(ghost)\n input?.removeEventListener(\"input\", resize)\n input?.removeEventListener(\"change\", resize)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAuC;AAEvC,SAAS,iBAAiB,QAA4B,MAAmB;AACvE,MAAI,CAAC;
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { getDocument, getWindow } from \"@zag-js/dom-query\"\n\nfunction copyVisualStyles(fromEl: HTMLElement | null, toEl: HTMLElement) {\n if (!fromEl) return\n\n const win = getWindow(fromEl)\n const el = win.getComputedStyle(fromEl)\n\n // prettier-ignore\n const cssText = 'box-sizing:' + el.boxSizing +\n ';border-left:' + el.borderLeftWidth + ' solid red' +\n ';border-right:' + el.borderRightWidth + ' solid red' +\n ';font-family:' + el.fontFamily +\n ';font-feature-settings:' + el.fontFeatureSettings +\n ';font-kerning:' + el.fontKerning +\n ';font-size:' + el.fontSize +\n ';font-stretch:' + el.fontStretch +\n ';font-style:' + el.fontStyle +\n ';font-variant:' + el.fontVariant +\n ';font-variant-caps:' + el.fontVariantCaps +\n ';font-variant-ligatures:' + el.fontVariantLigatures +\n ';font-variant-numeric:' + el.fontVariantNumeric +\n ';font-weight:' + el.fontWeight +\n ';letter-spacing:' + el.letterSpacing +\n ';margin-left:' + el.marginLeft +\n ';margin-right:' + el.marginRight +\n ';padding-left:' + el.paddingLeft +\n ';padding-right:' + el.paddingRight +\n ';text-indent:' + el.textIndent +\n ';text-transform:' + el.textTransform\n\n toEl.style.cssText += cssText\n}\n\nfunction createGhostElement(doc: Document) {\n var el = doc.createElement(\"div\")\n el.id = \"ghost\"\n el.style.cssText =\n \"display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;\"\n doc.body.appendChild(el)\n return el\n}\n\nexport function autoResizeInput(input: HTMLInputElement | null) {\n if (!input) return\n const doc = getDocument(input)\n const win = getWindow(input)\n\n const ghost = createGhostElement(doc)\n\n copyVisualStyles(input, ghost)\n\n function resize() {\n win.requestAnimationFrame(() => {\n ghost.innerHTML = input!.value\n const rect = win.getComputedStyle(ghost)\n input?.style.setProperty(\"width\", rect.width)\n })\n }\n\n resize()\n\n input?.addEventListener(\"input\", resize)\n input?.addEventListener(\"change\", resize)\n\n return () => {\n doc.body.removeChild(ghost)\n input?.removeEventListener(\"input\", resize)\n input?.removeEventListener(\"change\", resize)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAuC;AAEvC,SAAS,iBAAiB,QAA4B,MAAmB;AACvE,MAAI,CAAC,OAAQ;AAEb,QAAM,UAAM,4BAAU,MAAM;AAC5B,QAAM,KAAK,IAAI,iBAAiB,MAAM;AAGtC,QAAM,UAAU,gBAAgB,GAAG,YACf,kBAAkB,GAAG,kBAAkB,6BACpB,GAAG,mBAAmB,4BACvB,GAAG,aACrB,4BAA4B,GAAG,sBAC/B,mBAAmB,GAAG,cACtB,gBAAgB,GAAG,WACnB,mBAAmB,GAAG,cACtB,iBAAiB,GAAG,YACpB,mBAAmB,GAAG,cACtB,wBAAwB,GAAG,kBAC3B,6BAA6B,GAAG,uBAChC,2BAA2B,GAAG,qBAC9B,kBAAkB,GAAG,aACrB,qBAAqB,GAAG,gBACxB,kBAAkB,GAAG,aACrB,mBAAmB,GAAG,cACtB,mBAAmB,GAAG,cACtB,oBAAoB,GAAG,eACvB,kBAAkB,GAAG,aACrB,qBAAqB,GAAG;AAE5C,OAAK,MAAM,WAAW;AACxB;AAEA,SAAS,mBAAmB,KAAe;AACzC,MAAI,KAAK,IAAI,cAAc,KAAK;AAChC,KAAG,KAAK;AACR,KAAG,MAAM,UACP;AACF,MAAI,KAAK,YAAY,EAAE;AACvB,SAAO;AACT;AAEO,SAAS,gBAAgB,OAAgC;AAC9D,MAAI,CAAC,MAAO;AACZ,QAAM,UAAM,8BAAY,KAAK;AAC7B,QAAM,UAAM,4BAAU,KAAK;AAE3B,QAAM,QAAQ,mBAAmB,GAAG;AAEpC,mBAAiB,OAAO,KAAK;AAE7B,WAAS,SAAS;AAChB,QAAI,sBAAsB,MAAM;AAC9B,YAAM,YAAY,MAAO;AACzB,YAAM,OAAO,IAAI,iBAAiB,KAAK;AACvC,aAAO,MAAM,YAAY,SAAS,KAAK,KAAK;AAAA,IAC9C,CAAC;AAAA,EACH;AAEA,SAAO;AAEP,SAAO,iBAAiB,SAAS,MAAM;AACvC,SAAO,iBAAiB,UAAU,MAAM;AAExC,SAAO,MAAM;AACX,QAAI,KAAK,YAAY,KAAK;AAC1B,WAAO,oBAAoB,SAAS,MAAM;AAC1C,WAAO,oBAAoB,UAAU,MAAM;AAAA,EAC7C;AACF;","names":[]}
|
package/dist/index.mjs
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
// src/index.ts
|
|
2
2
|
import { getDocument, getWindow } from "@zag-js/dom-query";
|
|
3
3
|
function copyVisualStyles(fromEl, toEl) {
|
|
4
|
-
if (!fromEl)
|
|
5
|
-
return;
|
|
4
|
+
if (!fromEl) return;
|
|
6
5
|
const win = getWindow(fromEl);
|
|
7
6
|
const el = win.getComputedStyle(fromEl);
|
|
8
7
|
const cssText = "box-sizing:" + el.boxSizing + ";border-left:" + el.borderLeftWidth + " solid red;border-right:" + el.borderRightWidth + " solid red;font-family:" + el.fontFamily + ";font-feature-settings:" + el.fontFeatureSettings + ";font-kerning:" + el.fontKerning + ";font-size:" + el.fontSize + ";font-stretch:" + el.fontStretch + ";font-style:" + el.fontStyle + ";font-variant:" + el.fontVariant + ";font-variant-caps:" + el.fontVariantCaps + ";font-variant-ligatures:" + el.fontVariantLigatures + ";font-variant-numeric:" + el.fontVariantNumeric + ";font-weight:" + el.fontWeight + ";letter-spacing:" + el.letterSpacing + ";margin-left:" + el.marginLeft + ";margin-right:" + el.marginRight + ";padding-left:" + el.paddingLeft + ";padding-right:" + el.paddingRight + ";text-indent:" + el.textIndent + ";text-transform:" + el.textTransform;
|
|
@@ -16,8 +15,7 @@ function createGhostElement(doc) {
|
|
|
16
15
|
return el;
|
|
17
16
|
}
|
|
18
17
|
function autoResizeInput(input) {
|
|
19
|
-
if (!input)
|
|
20
|
-
return;
|
|
18
|
+
if (!input) return;
|
|
21
19
|
const doc = getDocument(input);
|
|
22
20
|
const win = getWindow(input);
|
|
23
21
|
const ghost = createGhostElement(doc);
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { getDocument, getWindow } from \"@zag-js/dom-query\"\n\nfunction copyVisualStyles(fromEl: HTMLElement | null, toEl: HTMLElement) {\n if (!fromEl) return\n\n const win = getWindow(fromEl)\n const el = win.getComputedStyle(fromEl)\n\n // prettier-ignore\n const cssText = 'box-sizing:' + el.boxSizing +\n ';border-left:' + el.borderLeftWidth + ' solid red' +\n ';border-right:' + el.borderRightWidth + ' solid red' +\n ';font-family:' + el.fontFamily +\n ';font-feature-settings:' + el.fontFeatureSettings +\n ';font-kerning:' + el.fontKerning +\n ';font-size:' + el.fontSize +\n ';font-stretch:' + el.fontStretch +\n ';font-style:' + el.fontStyle +\n ';font-variant:' + el.fontVariant +\n ';font-variant-caps:' + el.fontVariantCaps +\n ';font-variant-ligatures:' + el.fontVariantLigatures +\n ';font-variant-numeric:' + el.fontVariantNumeric +\n ';font-weight:' + el.fontWeight +\n ';letter-spacing:' + el.letterSpacing +\n ';margin-left:' + el.marginLeft +\n ';margin-right:' + el.marginRight +\n ';padding-left:' + el.paddingLeft +\n ';padding-right:' + el.paddingRight +\n ';text-indent:' + el.textIndent +\n ';text-transform:' + el.textTransform\n\n toEl.style.cssText += cssText\n}\n\nfunction createGhostElement(doc: Document) {\n var el = doc.createElement(\"div\")\n el.id = \"ghost\"\n el.style.cssText =\n \"display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;\"\n doc.body.appendChild(el)\n return el\n}\n\nexport function autoResizeInput(input: HTMLInputElement | null) {\n if (!input) return\n const doc = getDocument(input)\n const win = getWindow(input)\n\n const ghost = createGhostElement(doc)\n\n copyVisualStyles(input, ghost)\n\n function resize() {\n win.requestAnimationFrame(() => {\n ghost.innerHTML = input!.value\n const rect = win.getComputedStyle(ghost)\n input?.style.setProperty(\"width\", rect.width)\n })\n }\n\n resize()\n\n input?.addEventListener(\"input\", resize)\n input?.addEventListener(\"change\", resize)\n\n return () => {\n doc.body.removeChild(ghost)\n input?.removeEventListener(\"input\", resize)\n input?.removeEventListener(\"change\", resize)\n }\n}\n"],"mappings":";AAAA,SAAS,aAAa,iBAAiB;AAEvC,SAAS,iBAAiB,QAA4B,MAAmB;AACvE,MAAI,CAAC;
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { getDocument, getWindow } from \"@zag-js/dom-query\"\n\nfunction copyVisualStyles(fromEl: HTMLElement | null, toEl: HTMLElement) {\n if (!fromEl) return\n\n const win = getWindow(fromEl)\n const el = win.getComputedStyle(fromEl)\n\n // prettier-ignore\n const cssText = 'box-sizing:' + el.boxSizing +\n ';border-left:' + el.borderLeftWidth + ' solid red' +\n ';border-right:' + el.borderRightWidth + ' solid red' +\n ';font-family:' + el.fontFamily +\n ';font-feature-settings:' + el.fontFeatureSettings +\n ';font-kerning:' + el.fontKerning +\n ';font-size:' + el.fontSize +\n ';font-stretch:' + el.fontStretch +\n ';font-style:' + el.fontStyle +\n ';font-variant:' + el.fontVariant +\n ';font-variant-caps:' + el.fontVariantCaps +\n ';font-variant-ligatures:' + el.fontVariantLigatures +\n ';font-variant-numeric:' + el.fontVariantNumeric +\n ';font-weight:' + el.fontWeight +\n ';letter-spacing:' + el.letterSpacing +\n ';margin-left:' + el.marginLeft +\n ';margin-right:' + el.marginRight +\n ';padding-left:' + el.paddingLeft +\n ';padding-right:' + el.paddingRight +\n ';text-indent:' + el.textIndent +\n ';text-transform:' + el.textTransform\n\n toEl.style.cssText += cssText\n}\n\nfunction createGhostElement(doc: Document) {\n var el = doc.createElement(\"div\")\n el.id = \"ghost\"\n el.style.cssText =\n \"display:inline-block;height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap;\"\n doc.body.appendChild(el)\n return el\n}\n\nexport function autoResizeInput(input: HTMLInputElement | null) {\n if (!input) return\n const doc = getDocument(input)\n const win = getWindow(input)\n\n const ghost = createGhostElement(doc)\n\n copyVisualStyles(input, ghost)\n\n function resize() {\n win.requestAnimationFrame(() => {\n ghost.innerHTML = input!.value\n const rect = win.getComputedStyle(ghost)\n input?.style.setProperty(\"width\", rect.width)\n })\n }\n\n resize()\n\n input?.addEventListener(\"input\", resize)\n input?.addEventListener(\"change\", resize)\n\n return () => {\n doc.body.removeChild(ghost)\n input?.removeEventListener(\"input\", resize)\n input?.removeEventListener(\"change\", resize)\n }\n}\n"],"mappings":";AAAA,SAAS,aAAa,iBAAiB;AAEvC,SAAS,iBAAiB,QAA4B,MAAmB;AACvE,MAAI,CAAC,OAAQ;AAEb,QAAM,MAAM,UAAU,MAAM;AAC5B,QAAM,KAAK,IAAI,iBAAiB,MAAM;AAGtC,QAAM,UAAU,gBAAgB,GAAG,YACf,kBAAkB,GAAG,kBAAkB,6BACpB,GAAG,mBAAmB,4BACvB,GAAG,aACrB,4BAA4B,GAAG,sBAC/B,mBAAmB,GAAG,cACtB,gBAAgB,GAAG,WACnB,mBAAmB,GAAG,cACtB,iBAAiB,GAAG,YACpB,mBAAmB,GAAG,cACtB,wBAAwB,GAAG,kBAC3B,6BAA6B,GAAG,uBAChC,2BAA2B,GAAG,qBAC9B,kBAAkB,GAAG,aACrB,qBAAqB,GAAG,gBACxB,kBAAkB,GAAG,aACrB,mBAAmB,GAAG,cACtB,mBAAmB,GAAG,cACtB,oBAAoB,GAAG,eACvB,kBAAkB,GAAG,aACrB,qBAAqB,GAAG;AAE5C,OAAK,MAAM,WAAW;AACxB;AAEA,SAAS,mBAAmB,KAAe;AACzC,MAAI,KAAK,IAAI,cAAc,KAAK;AAChC,KAAG,KAAK;AACR,KAAG,MAAM,UACP;AACF,MAAI,KAAK,YAAY,EAAE;AACvB,SAAO;AACT;AAEO,SAAS,gBAAgB,OAAgC;AAC9D,MAAI,CAAC,MAAO;AACZ,QAAM,MAAM,YAAY,KAAK;AAC7B,QAAM,MAAM,UAAU,KAAK;AAE3B,QAAM,QAAQ,mBAAmB,GAAG;AAEpC,mBAAiB,OAAO,KAAK;AAE7B,WAAS,SAAS;AAChB,QAAI,sBAAsB,MAAM;AAC9B,YAAM,YAAY,MAAO;AACzB,YAAM,OAAO,IAAI,iBAAiB,KAAK;AACvC,aAAO,MAAM,YAAY,SAAS,KAAK,KAAK;AAAA,IAC9C,CAAC;AAAA,EACH;AAEA,SAAO;AAEP,SAAO,iBAAiB,SAAS,MAAM;AACvC,SAAO,iBAAiB,UAAU,MAAM;AAExC,SAAO,MAAM;AACX,QAAI,KAAK,YAAY,KAAK;AAC1B,WAAO,oBAAoB,SAAS,MAAM;AAC1C,WAAO,oBAAoB,UAAU,MAAM;AAAA,EAC7C;AACF;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/auto-resize",
|
|
3
|
-
"version": "0.56.
|
|
3
|
+
"version": "0.56.1",
|
|
4
4
|
"description": "Autoresize utilities for the web",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"js",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"url": "https://github.com/chakra-ui/zag/issues"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@zag-js/dom-query": "0.56.
|
|
26
|
+
"@zag-js/dom-query": "0.56.1"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"clean-package": "2.2.0"
|