@wordpress/block-editor
Version:
8 lines (7 loc) • 4.95 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../src/utils/fit-text-utils.js"],
"sourcesContent": ["/**\n * Shared utility functions for fit text functionality.\n * Uses callback-based approach for maximum code reuse between editor and frontend.\n */\n\n/**\n * Find optimal font size using simple binary search between 0-2400px.\n *\n * @param {HTMLElement} textElement The text element\n * @param {Function} applyFontSize Function that receives font size in pixels\n * @return {number} Optimal font size\n */\nfunction findOptimalFontSize( textElement, applyFontSize ) {\n\tconst alreadyHasScrollableHeight =\n\t\ttextElement.scrollHeight > textElement.clientHeight;\n\tlet minSize = 0;\n\tlet maxSize = 2400;\n\tlet bestSize = minSize;\n\n\tconst computedStyle = window.getComputedStyle( textElement );\n\tlet paddingLeft = parseFloat( computedStyle.paddingLeft ) || 0;\n\tlet paddingRight = parseFloat( computedStyle.paddingRight ) || 0;\n\tconst range = document.createRange();\n\trange.selectNodeContents( textElement );\n\n\tlet referenceElement = textElement;\n\tconst parentElement = textElement.parentElement;\n\tif ( parentElement ) {\n\t\tconst parentElementComputedStyle =\n\t\t\twindow.getComputedStyle( parentElement );\n\t\tif ( parentElementComputedStyle?.display === 'flex' ) {\n\t\t\treferenceElement = parentElement;\n\t\t\tpaddingLeft +=\n\t\t\t\tparseFloat( parentElementComputedStyle.paddingLeft ) || 0;\n\t\t\tpaddingRight +=\n\t\t\t\tparseFloat( parentElementComputedStyle.paddingRight ) || 0;\n\t\t}\n\t}\n\tlet maxclientHeight = referenceElement.clientHeight;\n\n\twhile ( minSize <= maxSize ) {\n\t\tconst midSize = Math.floor( ( minSize + maxSize ) / 2 );\n\t\tapplyFontSize( midSize );\n\n\t\t// When there is padding if the text overflows to the\n\t\t// padding area, it should be considered overflowing.\n\t\t// Use Range API to measure actual text content dimensions.\n\t\tconst rect = range.getBoundingClientRect();\n\t\tconst textWidth = rect.width;\n\n\t\t// Check if text fits within the element's width and is not\n\t\t// overflowing into the padding area.\n\t\tconst fitsWidth =\n\t\t\ttextElement.scrollWidth <= referenceElement.clientWidth &&\n\t\t\ttextWidth <=\n\t\t\t\treferenceElement.clientWidth - paddingLeft - paddingRight;\n\t\t// Check if text fits within the element's height.\n\t\tconst fitsHeight =\n\t\t\talreadyHasScrollableHeight ||\n\t\t\ttextElement.scrollHeight <= referenceElement.clientHeight ||\n\t\t\ttextElement.scrollHeight <= maxclientHeight;\n\n\t\t// When there are calculated line heights, text may jump in height\n\t\t// the available space may decrease while the font size decreases,\n\t\t// making text not fit.\n\t\t// We store a maximum reference height: the maximum reference element height that was observed\n\t\t// during the loop to avoid issues with such jumps.\n\t\tif ( referenceElement.clientHeight > maxclientHeight ) {\n\t\t\tmaxclientHeight = referenceElement.clientHeight;\n\t\t}\n\n\t\tif ( fitsWidth && fitsHeight ) {\n\t\t\tbestSize = midSize;\n\t\t\tminSize = midSize + 1;\n\t\t} else {\n\t\t\tmaxSize = midSize - 1;\n\t\t}\n\t}\n\trange.detach();\n\n\treturn bestSize;\n}\n\n/**\n * Complete fit text optimization for a single text element.\n * Handles the full flow using callbacks for font size application.\n *\n * @param {HTMLElement} textElement The text element (paragraph, heading, etc.)\n * @param {Function} applyFontSize Function that receives font size in pixels (0 to clear, >0 to apply)\n */\nexport function optimizeFitText( textElement, applyFontSize ) {\n\tif ( ! textElement ) {\n\t\treturn;\n\t}\n\n\tapplyFontSize( 0 );\n\n\tconst optimalSize = findOptimalFontSize( textElement, applyFontSize );\n\n\tapplyFontSize( optimalSize );\n\treturn optimalSize;\n}\n"],
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA,SAAS,oBAAqB,aAAa,eAAgB;AAC1D,QAAM,6BACL,YAAY,eAAe,YAAY;AACxC,MAAI,UAAU;AACd,MAAI,UAAU;AACd,MAAI,WAAW;AAEf,QAAM,gBAAgB,OAAO,iBAAkB,WAAY;AAC3D,MAAI,cAAc,WAAY,cAAc,WAAY,KAAK;AAC7D,MAAI,eAAe,WAAY,cAAc,YAAa,KAAK;AAC/D,QAAM,QAAQ,SAAS,YAAY;AACnC,QAAM,mBAAoB,WAAY;AAEtC,MAAI,mBAAmB;AACvB,QAAM,gBAAgB,YAAY;AAClC,MAAK,eAAgB;AACpB,UAAM,6BACL,OAAO,iBAAkB,aAAc;AACxC,QAAK,4BAA4B,YAAY,QAAS;AACrD,yBAAmB;AACnB,qBACC,WAAY,2BAA2B,WAAY,KAAK;AACzD,sBACC,WAAY,2BAA2B,YAAa,KAAK;AAAA,IAC3D;AAAA,EACD;AACA,MAAI,kBAAkB,iBAAiB;AAEvC,SAAQ,WAAW,SAAU;AAC5B,UAAM,UAAU,KAAK,OAAS,UAAU,WAAY,CAAE;AACtD,kBAAe,OAAQ;AAKvB,UAAM,OAAO,MAAM,sBAAsB;AACzC,UAAM,YAAY,KAAK;AAIvB,UAAM,YACL,YAAY,eAAe,iBAAiB,eAC5C,aACC,iBAAiB,cAAc,cAAc;AAE/C,UAAM,aACL,8BACA,YAAY,gBAAgB,iBAAiB,gBAC7C,YAAY,gBAAgB;AAO7B,QAAK,iBAAiB,eAAe,iBAAkB;AACtD,wBAAkB,iBAAiB;AAAA,IACpC;AAEA,QAAK,aAAa,YAAa;AAC9B,iBAAW;AACX,gBAAU,UAAU;AAAA,IACrB,OAAO;AACN,gBAAU,UAAU;AAAA,IACrB;AAAA,EACD;AACA,QAAM,OAAO;AAEb,SAAO;AACR;AASO,SAAS,gBAAiB,aAAa,eAAgB;AAC7D,MAAK,CAAE,aAAc;AACpB;AAAA,EACD;AAEA,gBAAe,CAAE;AAEjB,QAAM,cAAc,oBAAqB,aAAa,aAAc;AAEpE,gBAAe,WAAY;AAC3B,SAAO;AACR;",
"names": []
}