element-plus
Version:
A Component Library for Vue 3
1 lines • 4.46 kB
Source Map (JSON)
{"version":3,"file":"calc-textarea-height.mjs","sources":["../../../../../../packages/components/input/src/calc-textarea-height.ts"],"sourcesContent":["import { isNumber } from '@element-plus/utils/util'\n\nlet hiddenTextarea: HTMLTextAreaElement | undefined = undefined\n\nconst HIDDEN_STYLE = `\n height:0 !important;\n visibility:hidden !important;\n overflow:hidden !important;\n position:absolute !important;\n z-index:-1000 !important;\n top:0 !important;\n right:0 !important;\n`\n\nconst CONTEXT_STYLE = [\n 'letter-spacing',\n 'line-height',\n 'padding-top',\n 'padding-bottom',\n 'font-family',\n 'font-weight',\n 'font-size',\n 'text-rendering',\n 'text-transform',\n 'width',\n 'text-indent',\n 'padding-left',\n 'padding-right',\n 'border-width',\n 'box-sizing',\n]\n\ntype NodeStyle = {\n contextStyle: string\n boxSizing: string\n paddingSize: number\n borderSize: number\n}\n\ntype TextAreaHeight = {\n height: string\n minHeight?: string\n}\n\nfunction calculateNodeStyling(targetElement: Element): NodeStyle {\n const style = window.getComputedStyle(targetElement)\n\n const boxSizing = style.getPropertyValue('box-sizing')\n\n const paddingSize =\n parseFloat(style.getPropertyValue('padding-bottom')) +\n parseFloat(style.getPropertyValue('padding-top'))\n\n const borderSize =\n parseFloat(style.getPropertyValue('border-bottom-width')) +\n parseFloat(style.getPropertyValue('border-top-width'))\n\n const contextStyle = CONTEXT_STYLE.map(\n (name) => `${name}:${style.getPropertyValue(name)}`\n ).join(';')\n\n return { contextStyle, paddingSize, borderSize, boxSizing }\n}\n\nexport function calcTextareaHeight(\n targetElement: HTMLTextAreaElement,\n minRows = 1,\n maxRows?: number\n): TextAreaHeight {\n if (!hiddenTextarea) {\n hiddenTextarea = document.createElement('textarea')\n document.body.appendChild(hiddenTextarea)\n }\n\n const { paddingSize, borderSize, boxSizing, contextStyle } =\n calculateNodeStyling(targetElement)\n\n hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`)\n hiddenTextarea.value = targetElement.value || targetElement.placeholder || ''\n\n let height = hiddenTextarea.scrollHeight\n const result = {} as TextAreaHeight\n\n if (boxSizing === 'border-box') {\n height = height + borderSize\n } else if (boxSizing === 'content-box') {\n height = height - paddingSize\n }\n\n hiddenTextarea.value = ''\n const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize\n\n if (isNumber(minRows)) {\n let minHeight = singleRowHeight * minRows\n if (boxSizing === 'border-box') {\n minHeight = minHeight + paddingSize + borderSize\n }\n height = Math.max(minHeight, height)\n result.minHeight = `${minHeight}px`\n }\n if (isNumber(maxRows)) {\n let maxHeight = singleRowHeight * maxRows\n if (boxSizing === 'border-box') {\n maxHeight = maxHeight + paddingSize + borderSize\n }\n height = Math.min(maxHeight, height)\n }\n result.height = `${height}px`\n hiddenTextarea.parentNode?.removeChild(hiddenTextarea)\n hiddenTextarea = undefined\n\n return result\n}\n"],"names":[],"mappings":";;AAEA,IAAI,iBAAkD;AAEtD,MAAM,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUrB,MAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAeF,8BAA8B,eAAmC;AAC/D,QAAM,QAAQ,OAAO,iBAAiB;AAEtC,QAAM,YAAY,MAAM,iBAAiB;AAEzC,QAAM,cACJ,WAAW,MAAM,iBAAiB,qBAClC,WAAW,MAAM,iBAAiB;AAEpC,QAAM,aACJ,WAAW,MAAM,iBAAiB,0BAClC,WAAW,MAAM,iBAAiB;AAEpC,QAAM,eAAe,cAAc,IACjC,CAAC,SAAS,GAAG,QAAQ,MAAM,iBAAiB,SAC5C,KAAK;AAEP,SAAO,EAAE,cAAc,aAAa,YAAY;AAAA;4BAIhD,eACA,UAAU,GACV,SACgB;AApElB;AAqEE,MAAI,CAAC,gBAAgB;AACnB,qBAAiB,SAAS,cAAc;AACxC,aAAS,KAAK,YAAY;AAAA;AAG5B,QAAM,EAAE,aAAa,YAAY,WAAW,iBAC1C,qBAAqB;AAEvB,iBAAe,aAAa,SAAS,GAAG,gBAAgB;AACxD,iBAAe,QAAQ,cAAc,SAAS,cAAc,eAAe;AAE3E,MAAI,SAAS,eAAe;AAC5B,QAAM,SAAS;AAEf,MAAI,cAAc,cAAc;AAC9B,aAAS,SAAS;AAAA,aACT,cAAc,eAAe;AACtC,aAAS,SAAS;AAAA;AAGpB,iBAAe,QAAQ;AACvB,QAAM,kBAAkB,eAAe,eAAe;AAEtD,MAAI,SAAS,UAAU;AACrB,QAAI,YAAY,kBAAkB;AAClC,QAAI,cAAc,cAAc;AAC9B,kBAAY,YAAY,cAAc;AAAA;AAExC,aAAS,KAAK,IAAI,WAAW;AAC7B,WAAO,YAAY,GAAG;AAAA;AAExB,MAAI,SAAS,UAAU;AACrB,QAAI,YAAY,kBAAkB;AAClC,QAAI,cAAc,cAAc;AAC9B,kBAAY,YAAY,cAAc;AAAA;AAExC,aAAS,KAAK,IAAI,WAAW;AAAA;AAE/B,SAAO,SAAS,GAAG;AACnB,uBAAe,eAAf,mBAA2B,YAAY;AACvC,mBAAiB;AAEjB,SAAO;AAAA;;;;"}