@remotion/layout-utils 4.0.141 → 4.0.143
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/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/index.d.ts +3 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/index.js +3 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/fill-text-box.d.ts +10 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/fill-text-box.js +57 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/fit-text.d.ts +14 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/fit-text.js +16 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/measure-text.d.ts +23 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/esm/layouts/measure-text.js +81 -0
- package/.rollup.cache/Users/jonathanburger/remotion/packages/layout-utils/dist/tsconfig-esm.tsbuildinfo +1 -0
- package/bundle.ts +13 -0
- package/dist/cjs/layouts/measure-text.js +1 -1
- package/dist/esm/index.mjs +194 -146
- package/package.json +2 -2
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type Word } from './measure-text';
|
|
2
|
+
export declare const fillTextBox: ({ maxBoxWidth, maxLines, }: {
|
|
3
|
+
maxBoxWidth: number;
|
|
4
|
+
maxLines: number;
|
|
5
|
+
}) => {
|
|
6
|
+
add: ({ text, fontFamily, fontWeight, fontSize, letterSpacing, fontVariantNumeric, validateFontIsLoaded, textTransform, additionalStyles, }: Word) => {
|
|
7
|
+
exceedsBox: boolean;
|
|
8
|
+
newLine: boolean;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { measureText } from './measure-text';
|
|
2
|
+
export const fillTextBox = ({ maxBoxWidth, maxLines, }) => {
|
|
3
|
+
const lines = new Array(maxLines).fill(0).map(() => []);
|
|
4
|
+
return {
|
|
5
|
+
add: ({ text, fontFamily, fontWeight, fontSize, letterSpacing, fontVariantNumeric, validateFontIsLoaded, textTransform, additionalStyles, }) => {
|
|
6
|
+
const lastLineIndex = lines.reduceRight((acc, curr, index) => {
|
|
7
|
+
if (acc === -1 && curr.length > 0) {
|
|
8
|
+
return index;
|
|
9
|
+
}
|
|
10
|
+
return acc;
|
|
11
|
+
}, -1);
|
|
12
|
+
const currentlyAt = lastLineIndex === -1 ? 0 : lastLineIndex;
|
|
13
|
+
const lineToUse = lines[currentlyAt];
|
|
14
|
+
const lineWithWord = [
|
|
15
|
+
...lineToUse,
|
|
16
|
+
{
|
|
17
|
+
text,
|
|
18
|
+
fontFamily,
|
|
19
|
+
fontWeight,
|
|
20
|
+
fontSize,
|
|
21
|
+
letterSpacing,
|
|
22
|
+
fontVariantNumeric,
|
|
23
|
+
validateFontIsLoaded,
|
|
24
|
+
textTransform,
|
|
25
|
+
additionalStyles,
|
|
26
|
+
},
|
|
27
|
+
];
|
|
28
|
+
const widths = lineWithWord.map((w) => measureText(w).width);
|
|
29
|
+
const lineWidthWithWordAdded = widths.reduce((a, b) => a + b, 0);
|
|
30
|
+
if (Math.ceil(lineWidthWithWordAdded) < maxBoxWidth) {
|
|
31
|
+
lines[currentlyAt].push({
|
|
32
|
+
text: lines[currentlyAt].length === 0 ? text.trimStart() : text,
|
|
33
|
+
fontFamily,
|
|
34
|
+
fontWeight,
|
|
35
|
+
fontSize,
|
|
36
|
+
letterSpacing,
|
|
37
|
+
fontVariantNumeric,
|
|
38
|
+
});
|
|
39
|
+
return { exceedsBox: false, newLine: false };
|
|
40
|
+
}
|
|
41
|
+
if (currentlyAt === maxLines - 1) {
|
|
42
|
+
return { exceedsBox: true, newLine: false };
|
|
43
|
+
}
|
|
44
|
+
lines[currentlyAt + 1] = [
|
|
45
|
+
{
|
|
46
|
+
text: text.trimStart(),
|
|
47
|
+
fontFamily,
|
|
48
|
+
fontWeight,
|
|
49
|
+
fontSize,
|
|
50
|
+
letterSpacing,
|
|
51
|
+
fontVariantNumeric,
|
|
52
|
+
},
|
|
53
|
+
];
|
|
54
|
+
return { exceedsBox: false, newLine: true };
|
|
55
|
+
},
|
|
56
|
+
};
|
|
57
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { ModifyableCSSProperties, TextTransform } from '../layouts/measure-text';
|
|
2
|
+
export declare const fitText: ({ text, withinWidth, fontFamily, fontVariantNumeric, fontWeight, letterSpacing, validateFontIsLoaded, additionalStyles, textTransform, }: {
|
|
3
|
+
text: string;
|
|
4
|
+
withinWidth: number;
|
|
5
|
+
fontFamily: string;
|
|
6
|
+
fontWeight?: string | number | undefined;
|
|
7
|
+
letterSpacing?: string | undefined;
|
|
8
|
+
fontVariantNumeric?: string | undefined;
|
|
9
|
+
validateFontIsLoaded?: boolean | undefined;
|
|
10
|
+
textTransform?: TextTransform | undefined;
|
|
11
|
+
additionalStyles?: ModifyableCSSProperties<Partial<CSSStyleDeclaration>> | undefined;
|
|
12
|
+
}) => {
|
|
13
|
+
fontSize: number;
|
|
14
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { measureText } from '../layouts/measure-text';
|
|
2
|
+
const sampleSize = 100;
|
|
3
|
+
export const fitText = ({ text, withinWidth, fontFamily, fontVariantNumeric, fontWeight, letterSpacing, validateFontIsLoaded, additionalStyles, textTransform, }) => {
|
|
4
|
+
const estimate = measureText({
|
|
5
|
+
text,
|
|
6
|
+
fontFamily,
|
|
7
|
+
fontSize: sampleSize,
|
|
8
|
+
fontWeight,
|
|
9
|
+
fontVariantNumeric,
|
|
10
|
+
letterSpacing,
|
|
11
|
+
validateFontIsLoaded,
|
|
12
|
+
textTransform,
|
|
13
|
+
additionalStyles,
|
|
14
|
+
});
|
|
15
|
+
return { fontSize: (withinWidth / estimate.width) * sampleSize };
|
|
16
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export type Dimensions = {
|
|
2
|
+
width: number;
|
|
3
|
+
height: number;
|
|
4
|
+
};
|
|
5
|
+
export type ModifyableCSSProperties<T = Partial<CSSStyleDeclaration>> = {
|
|
6
|
+
[P in keyof T as P extends 'length' ? never : P extends keyof CSSPropertiesOnWord ? never : T[P] extends string | number ? P : never]: T[P];
|
|
7
|
+
};
|
|
8
|
+
export type TextTransform = '-moz-initial' | 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset' | 'none' | 'capitalize' | 'full-size-kana' | 'full-width' | 'lowercase' | 'uppercase';
|
|
9
|
+
type CSSPropertiesOnWord = {
|
|
10
|
+
fontFamily: string;
|
|
11
|
+
fontSize: number | string;
|
|
12
|
+
fontWeight?: number | string;
|
|
13
|
+
letterSpacing?: string;
|
|
14
|
+
fontVariantNumeric?: string;
|
|
15
|
+
textTransform?: TextTransform;
|
|
16
|
+
};
|
|
17
|
+
export type Word = {
|
|
18
|
+
text: string;
|
|
19
|
+
validateFontIsLoaded?: boolean;
|
|
20
|
+
additionalStyles?: ModifyableCSSProperties;
|
|
21
|
+
} & CSSPropertiesOnWord;
|
|
22
|
+
export declare const measureText: ({ text, fontFamily, fontSize, fontWeight, letterSpacing, fontVariantNumeric, validateFontIsLoaded, additionalStyles, }: Word) => Dimensions;
|
|
23
|
+
export {};
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
const wordCache = new Map();
|
|
2
|
+
const takeMeasurement = ({ text, fontFamily, fontSize, fontWeight, letterSpacing, fontVariantNumeric, additionalStyles, textTransform, }) => {
|
|
3
|
+
if (typeof document === 'undefined') {
|
|
4
|
+
throw new Error('measureText() can only be called in a browser.');
|
|
5
|
+
}
|
|
6
|
+
const node = document.createElement('span');
|
|
7
|
+
if (fontFamily) {
|
|
8
|
+
node.style.fontFamily = fontFamily;
|
|
9
|
+
}
|
|
10
|
+
node.style.display = 'inline-block';
|
|
11
|
+
node.style.position = 'absolute';
|
|
12
|
+
node.style.top = `-10000px`;
|
|
13
|
+
node.style.whiteSpace = 'pre';
|
|
14
|
+
node.style.fontSize =
|
|
15
|
+
typeof fontSize === 'string' ? fontSize : `${fontSize}px`;
|
|
16
|
+
if (additionalStyles) {
|
|
17
|
+
for (const key of Object.keys(additionalStyles)) {
|
|
18
|
+
node.style[key] = additionalStyles[key];
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
if (fontWeight) {
|
|
22
|
+
node.style.fontWeight = fontWeight.toString();
|
|
23
|
+
}
|
|
24
|
+
if (letterSpacing) {
|
|
25
|
+
node.style.letterSpacing = letterSpacing;
|
|
26
|
+
}
|
|
27
|
+
if (fontVariantNumeric) {
|
|
28
|
+
node.style.fontVariantNumeric = fontVariantNumeric;
|
|
29
|
+
}
|
|
30
|
+
if (textTransform) {
|
|
31
|
+
node.style.textTransform = textTransform;
|
|
32
|
+
}
|
|
33
|
+
node.innerText = text;
|
|
34
|
+
document.body.appendChild(node);
|
|
35
|
+
const computedFontFamily = window.getComputedStyle(node).fontFamily;
|
|
36
|
+
const boundingBox = node.getBoundingClientRect();
|
|
37
|
+
document.body.removeChild(node);
|
|
38
|
+
return {
|
|
39
|
+
boundingBox,
|
|
40
|
+
computedFontFamily,
|
|
41
|
+
};
|
|
42
|
+
};
|
|
43
|
+
export const measureText = ({ text, fontFamily, fontSize, fontWeight, letterSpacing, fontVariantNumeric, validateFontIsLoaded, additionalStyles, }) => {
|
|
44
|
+
const key = `${text}-${fontFamily}-${fontWeight}-${fontSize}-${letterSpacing}`;
|
|
45
|
+
if (wordCache.has(key)) {
|
|
46
|
+
return wordCache.get(key);
|
|
47
|
+
}
|
|
48
|
+
const { boundingBox, computedFontFamily } = takeMeasurement({
|
|
49
|
+
fontFamily,
|
|
50
|
+
fontSize,
|
|
51
|
+
text,
|
|
52
|
+
fontVariantNumeric,
|
|
53
|
+
fontWeight,
|
|
54
|
+
letterSpacing,
|
|
55
|
+
additionalStyles,
|
|
56
|
+
});
|
|
57
|
+
if (validateFontIsLoaded && text.trim().length > 0) {
|
|
58
|
+
const { boundingBox: boundingBoxOfFallbackFont, computedFontFamily: computedFallback, } = takeMeasurement({
|
|
59
|
+
fontFamily: null,
|
|
60
|
+
fontSize,
|
|
61
|
+
text,
|
|
62
|
+
fontVariantNumeric,
|
|
63
|
+
fontWeight,
|
|
64
|
+
letterSpacing,
|
|
65
|
+
additionalStyles,
|
|
66
|
+
});
|
|
67
|
+
const sameAsFallbackFont = boundingBox.height === boundingBoxOfFallbackFont.height &&
|
|
68
|
+
boundingBox.width === boundingBoxOfFallbackFont.width;
|
|
69
|
+
if (sameAsFallbackFont && computedFallback !== computedFontFamily) {
|
|
70
|
+
const err = [
|
|
71
|
+
`Called measureText() with "fontFamily": ${JSON.stringify(fontFamily)} but it looks like the font is not loaded at the time of calling.`,
|
|
72
|
+
`A measurement with the fallback font ${computedFallback} was taken and had the same dimensions, indicating that the browser used the fallback font.`,
|
|
73
|
+
'See https://remotion.dev/docs/layout-utils/best-practices for best practices.',
|
|
74
|
+
];
|
|
75
|
+
throw new Error(err.join('\n'));
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
const result = { height: boundingBox.height, width: boundingBox.width };
|
|
79
|
+
wordCache.set(key, result);
|
|
80
|
+
return result;
|
|
81
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"program":{"fileNames":["../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es5.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2016.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.dom.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.core.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.collection.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.generator.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.promise.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.date.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.object.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.string.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.intl.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.intl.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.promise.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.array.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.object.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.string.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.symbol.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2019.intl.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.bigint.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.date.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.promise.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.sharedmemory.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.string.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.symbol.wellknown.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.intl.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.es2020.number.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.esnext.intl.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.decorators.d.ts","../../../node_modules/.pnpm/typescript@5.3.3/node_modules/typescript/lib/lib.decorators.legacy.d.ts","../src/layouts/measure-text.ts","../src/layouts/fill-text-box.ts","../src/layouts/fit-text.ts","../src/index.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/assert.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/assert/strict.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/globals.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/async_hooks.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/buffer.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/child_process.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/cluster.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/console.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/constants.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/crypto.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/dgram.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/diagnostics_channel.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/dns.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/dns/promises.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/domain.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/dom-events.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/events.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/fs.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/fs/promises.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/http.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/http2.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/https.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/inspector.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/module.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/net.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/os.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/path.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/perf_hooks.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/process.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/punycode.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/querystring.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/readline.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/readline/promises.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/repl.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/stream.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/stream/promises.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/stream/consumers.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/stream/web.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/string_decoder.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/test.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/timers.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/timers/promises.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/tls.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/trace_events.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/tty.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/url.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/util.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/v8.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/vm.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/wasi.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/worker_threads.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/zlib.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/globals.global.d.ts","../../../node_modules/.pnpm/@types+node@18.14.6/node_modules/@types/node/index.d.ts","../../../node_modules/.pnpm/@types+eslint@7.28.0/node_modules/@types/eslint/helpers.d.ts","../../../node_modules/.pnpm/@types+eslint@7.28.0/node_modules/@types/eslint/lib/rules/index.d.ts","../../../node_modules/.pnpm/@types+json-schema@7.0.13/node_modules/@types/json-schema/index.d.ts","../../../node_modules/.pnpm/@types+estree@1.0.0/node_modules/@types/estree/index.d.ts","../../../node_modules/.pnpm/@types+eslint@7.28.0/node_modules/@types/eslint/index.d.ts","../../../node_modules/.pnpm/@types+eslint-scope@3.7.3/node_modules/@types/eslint-scope/index.d.ts"],"fileInfos":[{"version":"f33e5332b24c3773e930e212cbb8b6867c8ba3ec4492064ea78e55a524d57450","affectsGlobalScope":true},"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","26f2f787e82c4222710f3b676b4d83eb5ad0a72fa7b746f03449e7a026ce5073","9a68c0c07ae2fa71b44384a839b7b8d81662a236d4b9ac30916718f7510b1b2d","5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","68d73b4a11549f9c0b7d352d10e91e5dca8faa3322bfb77b661839c42b1ddec7","5efce4fc3c29ea84e8928f97adec086e3dc876365e0982cc8479a07954a3efd4",{"version":"21e41a76098aa7a191028256e52a726baafd45a925ea5cf0222eb430c96c1d83","affectsGlobalScope":true},{"version":"138fb588d26538783b78d1e3b2c2cc12d55840b97bf5e08bca7f7a174fbe2f17","affectsGlobalScope":true},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true},{"version":"4443e68b35f3332f753eacc66a04ac1d2053b8b035a0e0ac1d455392b5e243b3","affectsGlobalScope":true},{"version":"bc47685641087c015972a3f072480889f0d6c65515f12bd85222f49a98952ed7","affectsGlobalScope":true},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true},{"version":"93495ff27b8746f55d19fcbcdbaccc99fd95f19d057aed1bd2c0cafe1335fbf0","affectsGlobalScope":true},{"version":"6fc23bb8c3965964be8c597310a2878b53a0306edb71d4b5a4dfe760186bcc01","affectsGlobalScope":true},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true},{"version":"bb42a7797d996412ecdc5b2787720de477103a0b2e53058569069a0e2bae6c7e","affectsGlobalScope":true},{"version":"4738f2420687fd85629c9efb470793bb753709c2379e5f85bc1815d875ceadcd","affectsGlobalScope":true},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true},{"version":"9fc46429fbe091ac5ad2608c657201eb68b6f1b8341bd6d670047d32ed0a88fa","affectsGlobalScope":true},{"version":"61c37c1de663cf4171e1192466e52c7a382afa58da01b1dc75058f032ddf0839","affectsGlobalScope":true},{"version":"b541a838a13f9234aba650a825393ffc2292dc0fc87681a5d81ef0c96d281e7a","affectsGlobalScope":true},{"version":"e0275cd0e42990dc3a16f0b7c8bca3efe87f1c8ad404f80c6db1c7c0b828c59f","affectsGlobalScope":true},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true},{"version":"d7e7d9b7b50e5f22c915b525acc5a49a7a6584cf8f62d0569e557c5cfc4b2ac2","affectsGlobalScope":true},{"version":"71c37f4c9543f31dfced6c7840e068c5a5aacb7b89111a4364b1d5276b852557","affectsGlobalScope":true},{"version":"576711e016cf4f1804676043e6a0a5414252560eb57de9faceee34d79798c850","affectsGlobalScope":true},{"version":"89c1b1281ba7b8a96efc676b11b264de7a8374c5ea1e6617f11880a13fc56dc6","affectsGlobalScope":true},{"version":"49ed889be54031e1044af0ad2c603d627b8bda8b50c1a68435fe85583901d072","affectsGlobalScope":true},{"version":"e93d098658ce4f0c8a0779e6cab91d0259efb88a318137f686ad76f8410ca270","affectsGlobalScope":true},{"version":"063600664504610fe3e99b717a1223f8b1900087fab0b4cad1496a114744f8df","affectsGlobalScope":true},{"version":"934019d7e3c81950f9a8426d093458b65d5aff2c7c1511233c0fd5b941e608ab","affectsGlobalScope":true},{"version":"bf14a426dbbf1022d11bd08d6b8e709a2e9d246f0c6c1032f3b2edb9a902adbe","affectsGlobalScope":true},{"version":"ec0104fee478075cb5171e5f4e3f23add8e02d845ae0165bfa3f1099241fa2aa","affectsGlobalScope":true},{"version":"2b72d528b2e2fe3c57889ca7baef5e13a56c957b946906d03767c642f386bbc3","affectsGlobalScope":true},{"version":"acae90d417bee324b1372813b5a00829d31c7eb670d299cd7f8f9a648ac05688","affectsGlobalScope":true},{"version":"368af93f74c9c932edd84c58883e736c9e3d53cec1fe24c0b0ff451f529ceab1","affectsGlobalScope":true},{"version":"13f6e6380c78e15e140243dc4be2fa546c287c6d61f4729bc2dd7cf449605471","affectsGlobalScope":true},{"version":"33358442698bb565130f52ba79bfd3d4d484ac85fe33f3cb1759c54d18201393","affectsGlobalScope":true},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true},{"version":"5f88f84c52ab483da69fa90f4878b5fc650b62ace98e6c41113524243ae1ec04","signature":"53eedb62d2f810c59e1f126cf63e06255db5c49ca36cddbf8095042efa718b2b"},{"version":"33281bd0ab5e902b1094a23c8f475107fc4dc3e79e850bfb43d03ac630a2a3b5","signature":"5d64a65032234e3a32832bdfbf635fbbe7a6b67ed02b5e0727aea159ab802d6e"},{"version":"375c9339669202e5a3ff9f03747aaa1b5619314082274332a13c413fac1dbd92","signature":"fdafeba049827609c1a31c7cbd132ec6c3617467c0961174cb987a6cb8244565"},{"version":"add52fd17c88fea609b6beb08ed0f9504545a4359c365dcd0a467812e918df1d","signature":"84241402d0cddd0ed94a008ea26b9f303b3c8a3716b39fc43ded44beb7987e77"},"7e771891adaa85b690266bc37bd6eb43bc57eecc4b54693ead36467e7369952a","a69c09dbea52352f479d3e7ac949fde3d17b195abe90b045d619f747b38d6d1a",{"version":"ca72190df0eb9b09d4b600821c8c7b6c9747b75a1c700c4d57dc0bb72abc074c","affectsGlobalScope":true},"11e2d554398d2bd460e7d06b2fa5827a297c8acfbe00b4f894a224ac0862857f",{"version":"fc811ced095f38ad4438bb94a8d665c63bf4943e58a71ada16627add5ad93226","affectsGlobalScope":true},"374ca798f244e464346f14301dc2a8b4b111af1a83b49fffef5906c338a1f922","5a94487653355b56018122d92392beb2e5f4a6c63ba5cef83bbe1c99775ef713",{"version":"d5135ad93b33adcce80b18f8065087934cdc1730d63db58562edcf017e1aad9b","affectsGlobalScope":true},"82408ed3e959ddc60d3e9904481b5a8dc16469928257af22a3f7d1a3bc7fd8c4","5eb881ed2a0d5b17ea36df5cd4c4be500e460c412f270c3170e906bec65580ac","bb9c4ffa5e6290c6980b63c815cdd1625876dadb2efaf77edbe82984be93e55e","489532ff54b714f0e0939947a1c560e516d3ae93d51d639ab02e907a0e950114","f30bb836526d930a74593f7b0f5c1c46d10856415a8f69e5e2fc3db80371e362","14b5aa23c5d0ae1907bc696ac7b6915d88f7d85799cc0dc2dcf98fbce2c5a67c","5c439dafdc09abe4d6c260a96b822fa0ba5be7203c71a63ab1f1423cd9e838ea",{"version":"6b526a5ec4a401ca7c26cfe6a48e641d8f30af76673bad3b06a1b4504594a960","affectsGlobalScope":true},{"version":"816ad2e607a96de5bcac7d437f843f5afd8957f1fa5eefa6bba8e4ed7ca8fd84","affectsGlobalScope":true},"cec36af22f514322f870e81d30675c78df82ae8bf4863f5fd4e4424c040c678d","d903fafe96674bc0b2ac38a5be4a8fc07b14c2548d1cdb165a80ea24c44c0c54","5eec82ac21f84d83586c59a16b9b8502d34505d1393393556682fe7e7fde9ef2","04eb6578a588d6a46f50299b55f30e3a04ef27d0c5a46c57d8fcc211cd530faa","8d3c583a07e0c37e876908c2d5da575019f689df8d9fa4c081d99119d53dba22","2c828a5405191d006115ab34e191b8474bc6c86ffdc401d1a9864b1b6e088a58",{"version":"e630e5528e899219ae319e83bef54bf3bcb91b01d76861ecf881e8e614b167f0","affectsGlobalScope":true},"bcebb922784739bdb34c18ee51095d25a92b560c78ccd2eaacd6bd00f7443d83","7ee6ed878c4528215c82b664fe0cfe80e8b4da6c0d4cc80869367868774db8b1","b0973c3cbcdc59b37bf477731d468696ecaf442593ec51bab497a613a580fe30",{"version":"4989e92ba5b69b182d2caaea6295af52b7dc73a4f7a2e336a676722884e7139d","affectsGlobalScope":true},{"version":"b3624aed92dab6da8484280d3cb3e2f4130ec3f4ef3f8201c95144ae9e898bb6","affectsGlobalScope":true},"5153a2fd150e46ce57bb3f8db1318d33f6ad3261ed70ceeff92281c0608c74a3","210d54cd652ec0fec8c8916e4af59bb341065576ecda039842f9ffb2e908507c","36b03690b628eab08703d63f04eaa89c5df202e5f1edf3989f13ad389cd2c091","0effadd232a20498b11308058e334d3339cc5bf8c4c858393e38d9d4c0013dcf","25846d43937c672bab7e8195f3d881f93495df712ee901860effc109918938cc","fd93cee2621ff42dabe57b7be402783fd1aa69ece755bcba1e0290547ae60513","1b952304137851e45bc009785de89ada562d9376177c97e37702e39e60c2f1ff","69ee23dd0d215b09907ad30d23f88b7790c93329d1faf31d7835552a10cf7cbf","44b8b584a338b190a59f4f6929d072431950c7bd92ec2694821c11bce180c8a5","23b89798789dffbd437c0c423f5d02d11f9736aea73d6abf16db4f812ff36eda","09326ae5f7e3d49be5cd9ea00eb814770e71870a438faa2efd8bdd9b4db21320",{"version":"3c4ba1dd9b12ffa284b565063108f2f031d150ea15b8fafbdc17f5d2a07251f3","affectsGlobalScope":true},"e10177274a35a9d07c825615340b2fcde2f610f53f3fb40269fd196b4288dda6","c4577fb855ca259bdbf3ea663ca73988ce5f84251a92b4aef80a1f4122b6f98e","3c13ef48634e7b5012fcf7e8fce7496352c2d779a7201389ca96a2a81ee4314d","5d0a25ec910fa36595f85a67ac992d7a53dd4064a1ba6aea1c9f14ab73a023f2",{"version":"f0900cd5d00fe1263ff41201fb8073dbeb984397e4af3b8002a5c207a30bdc33","affectsGlobalScope":true},{"version":"ff07a9a03c65732ccc59b3c65bc584173da093bd563a6565411c01f5703bd3cb","affectsGlobalScope":true},"06d7c42d256f0ce6afe1b2b6cfbc97ab391f29dadb00dd0ae8e8f23f5bc916c3","ec4bd1b200670fb567920db572d6701ed42a9641d09c4ff6869768c8f81b404c","e59a892d87e72733e2a9ca21611b9beb52977be2696c7ba4b216cbbb9a48f5aa",{"version":"da26af7362f53d122283bc69fed862b9a9fe27e01bc6a69d1d682e0e5a4df3e6","affectsGlobalScope":true},"8a300fa9b698845a1f9c41ecbe2c5966634582a8e2020d51abcace9b55aa959e",{"version":"ab9b9a36e5284fd8d3bf2f7d5fcbc60052f25f27e4d20954782099282c60d23e","affectsGlobalScope":true},"ed2a670a77a1b80653c5bde2d813b0ab2e92872cc9b2b611ce11050b95139be6",{"version":"64d4b35c5456adf258d2cf56c341e203a073253f229ef3208fc0d5020253b241","affectsGlobalScope":true},"0133ebdd17a823ae56861948870cde4dac18dd8818ab641039c85bbb720429e0","dd89872dd0647dfd63665f3d525c06d114310a2f7a5a9277e5982a152b31be2b","946bd1737d9412395a8f24414c70f18660b84a75a12b0b448e6eb1a2161d06dd","e300bf65972ac08167a72787e19d1b43c285c5424707194d0ba64422f6b02c77","dc33ce27fbeaf0ea3da556c80a6cc8af9d13eb443088c8f25cdc39fca8e756f6"],"root":[[46,49]],"options":{"composite":true,"declaration":true,"declarationMap":false,"emitDeclarationOnly":false,"esModuleInterop":true,"importHelpers":true,"jsx":4,"module":99,"noEmitHelpers":true,"noUnusedLocals":true,"noUnusedParameters":true,"outDir":"./esm","rootDir":"../src","skipLibCheck":true,"sourceMap":false,"strict":true,"target":5},"fileIdsList":[[96,107,108],[96],[96,104,105,106,107],[96,108],[50,96],[53,96],[54,59,87,96],[55,66,67,74,84,95,96],[55,56,66,74,96],[57,96],[58,59,67,75,96],[59,84,92,96],[60,62,66,74,96],[61,96],[62,63,96],[66,96],[64,66,96],[66,67,68,84,95,96],[66,67,68,81,84,87,96],[96,100],[62,69,74,84,95,96],[66,67,69,70,74,84,92,95,96],[69,71,84,92,95,96],[50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102],[66,72,96],[73,95,96],[62,66,74,84,96],[75,96],[76,96],[53,77,96],[78,94,96,100],[79,96],[80,96],[66,81,82,96],[81,83,96,98],[54,66,84,85,86,87,96],[54,84,86,96],[84,85,96],[87,96],[88,96],[66,90,91,96],[90,91,96],[59,74,84,92,96],[93,96],[74,94,96],[54,69,80,95,96],[59,96],[84,96,97],[96,98],[96,99],[54,59,66,68,77,84,95,96,98,100],[84,96,101],[46,47,48,96],[46,96],[46,47,48],[46]],"referencedMap":[[109,1],[104,2],[108,3],[105,4],[107,2],[106,2],[50,5],[51,5],[53,6],[54,7],[55,8],[56,9],[57,10],[58,11],[59,12],[60,13],[61,14],[62,15],[63,15],[65,16],[64,17],[66,16],[67,18],[68,19],[52,20],[102,2],[69,21],[70,22],[71,23],[103,24],[72,25],[73,26],[74,27],[75,28],[76,29],[77,30],[78,31],[79,32],[80,33],[81,34],[82,34],[83,35],[84,36],[86,37],[85,38],[87,39],[88,40],[89,2],[90,41],[91,42],[92,43],[93,44],[94,45],[95,46],[96,47],[97,48],[98,49],[99,50],[100,51],[101,52],[44,2],[45,2],[8,2],[10,2],[9,2],[2,2],[11,2],[12,2],[13,2],[14,2],[15,2],[16,2],[17,2],[18,2],[3,2],[4,2],[19,2],[23,2],[20,2],[21,2],[22,2],[24,2],[25,2],[26,2],[5,2],[27,2],[28,2],[29,2],[30,2],[6,2],[34,2],[31,2],[32,2],[33,2],[35,2],[7,2],[36,2],[41,2],[42,2],[37,2],[38,2],[39,2],[40,2],[1,2],[43,2],[49,53],[47,54],[48,54],[46,2]],"exportedModulesMap":[[109,1],[104,2],[108,3],[105,4],[107,2],[106,2],[50,5],[51,5],[53,6],[54,7],[55,8],[56,9],[57,10],[58,11],[59,12],[60,13],[61,14],[62,15],[63,15],[65,16],[64,17],[66,16],[67,18],[68,19],[52,20],[102,2],[69,21],[70,22],[71,23],[103,24],[72,25],[73,26],[74,27],[75,28],[76,29],[77,30],[78,31],[79,32],[80,33],[81,34],[82,34],[83,35],[84,36],[86,37],[85,38],[87,39],[88,40],[89,2],[90,41],[91,42],[92,43],[93,44],[94,45],[95,46],[96,47],[97,48],[98,49],[99,50],[100,51],[101,52],[44,2],[45,2],[8,2],[10,2],[9,2],[2,2],[11,2],[12,2],[13,2],[14,2],[15,2],[16,2],[17,2],[18,2],[3,2],[4,2],[19,2],[23,2],[20,2],[21,2],[22,2],[24,2],[25,2],[26,2],[5,2],[27,2],[28,2],[29,2],[30,2],[6,2],[34,2],[31,2],[32,2],[33,2],[35,2],[7,2],[36,2],[41,2],[42,2],[37,2],[38,2],[39,2],[40,2],[1,2],[43,2],[49,55],[47,56],[48,56]],"semanticDiagnosticsPerFile":[109,104,108,105,107,106,50,51,53,54,55,56,57,58,59,60,61,62,63,65,64,66,67,68,52,102,69,70,71,103,72,73,74,75,76,77,78,79,80,81,82,83,84,86,85,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,44,45,8,10,9,2,11,12,13,14,15,16,17,18,3,4,19,23,20,21,22,24,25,26,5,27,28,29,30,6,34,31,32,33,35,7,36,41,42,37,38,39,40,1,43,49,47,48,46],"latestChangedDtsFile":"./esm/index.d.ts"},"version":"5.3.3"}
|
package/bundle.ts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import {build} from 'bun';
|
|
2
|
+
|
|
3
|
+
const output = await build({
|
|
4
|
+
entrypoints: ['src/index.ts'],
|
|
5
|
+
naming: '[name].mjs',
|
|
6
|
+
});
|
|
7
|
+
|
|
8
|
+
const [file] = output.outputs;
|
|
9
|
+
const text = await file.text();
|
|
10
|
+
|
|
11
|
+
await Bun.write('dist/esm/index.mjs', text);
|
|
12
|
+
|
|
13
|
+
export {};
|
|
@@ -57,7 +57,7 @@ const measureText = ({ text, fontFamily, fontSize, fontWeight, letterSpacing, fo
|
|
|
57
57
|
letterSpacing,
|
|
58
58
|
additionalStyles,
|
|
59
59
|
});
|
|
60
|
-
if (validateFontIsLoaded) {
|
|
60
|
+
if (validateFontIsLoaded && text.trim().length > 0) {
|
|
61
61
|
const { boundingBox: boundingBoxOfFallbackFont, computedFontFamily: computedFallback, } = takeMeasurement({
|
|
62
62
|
fontFamily: null,
|
|
63
63
|
fontSize,
|
package/dist/esm/index.mjs
CHANGED
|
@@ -1,156 +1,204 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
// src/layouts/measure-text.ts
|
|
2
|
+
var wordCache = new Map;
|
|
3
|
+
var takeMeasurement = ({
|
|
4
|
+
text,
|
|
5
|
+
fontFamily,
|
|
6
|
+
fontSize,
|
|
7
|
+
fontWeight,
|
|
8
|
+
letterSpacing,
|
|
9
|
+
fontVariantNumeric,
|
|
10
|
+
additionalStyles,
|
|
11
|
+
textTransform
|
|
12
|
+
}) => {
|
|
13
|
+
if (typeof document === "undefined") {
|
|
14
|
+
throw new Error("measureText() can only be called in a browser.");
|
|
15
|
+
}
|
|
16
|
+
const node = document.createElement("span");
|
|
17
|
+
if (fontFamily) {
|
|
18
|
+
node.style.fontFamily = fontFamily;
|
|
19
|
+
}
|
|
20
|
+
node.style.display = "inline-block";
|
|
21
|
+
node.style.position = "absolute";
|
|
22
|
+
node.style.top = `-10000px`;
|
|
23
|
+
node.style.whiteSpace = "pre";
|
|
24
|
+
node.style.fontSize = typeof fontSize === "string" ? fontSize : `${fontSize}px`;
|
|
25
|
+
if (additionalStyles) {
|
|
26
|
+
for (const key of Object.keys(additionalStyles)) {
|
|
27
|
+
node.style[key] = additionalStyles[key];
|
|
5
28
|
}
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
node.style.
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
node.style.
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
node.style.fontVariantNumeric = fontVariantNumeric;
|
|
29
|
-
}
|
|
30
|
-
if (textTransform) {
|
|
31
|
-
node.style.textTransform = textTransform;
|
|
32
|
-
}
|
|
33
|
-
node.innerText = text;
|
|
34
|
-
document.body.appendChild(node);
|
|
35
|
-
const computedFontFamily = window.getComputedStyle(node).fontFamily;
|
|
36
|
-
const boundingBox = node.getBoundingClientRect();
|
|
37
|
-
document.body.removeChild(node);
|
|
38
|
-
return {
|
|
39
|
-
boundingBox,
|
|
40
|
-
computedFontFamily,
|
|
41
|
-
};
|
|
29
|
+
}
|
|
30
|
+
if (fontWeight) {
|
|
31
|
+
node.style.fontWeight = fontWeight.toString();
|
|
32
|
+
}
|
|
33
|
+
if (letterSpacing) {
|
|
34
|
+
node.style.letterSpacing = letterSpacing;
|
|
35
|
+
}
|
|
36
|
+
if (fontVariantNumeric) {
|
|
37
|
+
node.style.fontVariantNumeric = fontVariantNumeric;
|
|
38
|
+
}
|
|
39
|
+
if (textTransform) {
|
|
40
|
+
node.style.textTransform = textTransform;
|
|
41
|
+
}
|
|
42
|
+
node.innerText = text;
|
|
43
|
+
document.body.appendChild(node);
|
|
44
|
+
const computedFontFamily = window.getComputedStyle(node).fontFamily;
|
|
45
|
+
const boundingBox = node.getBoundingClientRect();
|
|
46
|
+
document.body.removeChild(node);
|
|
47
|
+
return {
|
|
48
|
+
boundingBox,
|
|
49
|
+
computedFontFamily
|
|
50
|
+
};
|
|
42
51
|
};
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
52
|
+
var measureText = ({
|
|
53
|
+
text,
|
|
54
|
+
fontFamily,
|
|
55
|
+
fontSize,
|
|
56
|
+
fontWeight,
|
|
57
|
+
letterSpacing,
|
|
58
|
+
fontVariantNumeric,
|
|
59
|
+
validateFontIsLoaded,
|
|
60
|
+
additionalStyles
|
|
61
|
+
}) => {
|
|
62
|
+
const key = `${text}-${fontFamily}-${fontWeight}-${fontSize}-${letterSpacing}`;
|
|
63
|
+
if (wordCache.has(key)) {
|
|
64
|
+
return wordCache.get(key);
|
|
65
|
+
}
|
|
66
|
+
const { boundingBox, computedFontFamily } = takeMeasurement({
|
|
67
|
+
fontFamily,
|
|
68
|
+
fontSize,
|
|
69
|
+
text,
|
|
70
|
+
fontVariantNumeric,
|
|
71
|
+
fontWeight,
|
|
72
|
+
letterSpacing,
|
|
73
|
+
additionalStyles
|
|
74
|
+
});
|
|
75
|
+
if (validateFontIsLoaded && text.trim().length > 0) {
|
|
76
|
+
const {
|
|
77
|
+
boundingBox: boundingBoxOfFallbackFont,
|
|
78
|
+
computedFontFamily: computedFallback
|
|
79
|
+
} = takeMeasurement({
|
|
80
|
+
fontFamily: null,
|
|
81
|
+
fontSize,
|
|
82
|
+
text,
|
|
83
|
+
fontVariantNumeric,
|
|
84
|
+
fontWeight,
|
|
85
|
+
letterSpacing,
|
|
86
|
+
additionalStyles
|
|
56
87
|
});
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
88
|
+
const sameAsFallbackFont = boundingBox.height === boundingBoxOfFallbackFont.height && boundingBox.width === boundingBoxOfFallbackFont.width;
|
|
89
|
+
if (sameAsFallbackFont && computedFallback !== computedFontFamily) {
|
|
90
|
+
const err = [
|
|
91
|
+
`Called measureText() with "fontFamily": ${JSON.stringify(fontFamily)} but it looks like the font is not loaded at the time of calling.`,
|
|
92
|
+
`A measurement with the fallback font ${computedFallback} was taken and had the same dimensions, indicating that the browser used the fallback font.`,
|
|
93
|
+
"See https://remotion.dev/docs/layout-utils/best-practices for best practices."
|
|
94
|
+
];
|
|
95
|
+
throw new Error(err.join("\n"));
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
const result = { height: boundingBox.height, width: boundingBox.width };
|
|
99
|
+
wordCache.set(key, result);
|
|
100
|
+
return result;
|
|
101
|
+
};
|
|
102
|
+
|
|
103
|
+
// src/layouts/fill-text-box.ts
|
|
104
|
+
var fillTextBox = ({
|
|
105
|
+
maxBoxWidth,
|
|
106
|
+
maxLines
|
|
107
|
+
}) => {
|
|
108
|
+
const lines = new Array(maxLines).fill(0).map(() => []);
|
|
109
|
+
return {
|
|
110
|
+
add: ({
|
|
111
|
+
text,
|
|
112
|
+
fontFamily,
|
|
113
|
+
fontWeight,
|
|
114
|
+
fontSize,
|
|
115
|
+
letterSpacing,
|
|
116
|
+
fontVariantNumeric,
|
|
117
|
+
validateFontIsLoaded,
|
|
118
|
+
textTransform,
|
|
119
|
+
additionalStyles
|
|
120
|
+
}) => {
|
|
121
|
+
const lastLineIndex = lines.reduceRight((acc, curr, index) => {
|
|
122
|
+
if (acc === -1 && curr.length > 0) {
|
|
123
|
+
return index;
|
|
124
|
+
}
|
|
125
|
+
return acc;
|
|
126
|
+
}, -1);
|
|
127
|
+
const currentlyAt = lastLineIndex === -1 ? 0 : lastLineIndex;
|
|
128
|
+
const lineToUse = lines[currentlyAt];
|
|
129
|
+
const lineWithWord = [
|
|
130
|
+
...lineToUse,
|
|
131
|
+
{
|
|
132
|
+
text,
|
|
133
|
+
fontFamily,
|
|
134
|
+
fontWeight,
|
|
135
|
+
fontSize,
|
|
136
|
+
letterSpacing,
|
|
137
|
+
fontVariantNumeric,
|
|
138
|
+
validateFontIsLoaded,
|
|
139
|
+
textTransform,
|
|
140
|
+
additionalStyles
|
|
141
|
+
}
|
|
142
|
+
];
|
|
143
|
+
const widths = lineWithWord.map((w) => measureText(w).width);
|
|
144
|
+
const lineWidthWithWordAdded = widths.reduce((a, b) => a + b, 0);
|
|
145
|
+
if (Math.ceil(lineWidthWithWordAdded) < maxBoxWidth) {
|
|
146
|
+
lines[currentlyAt].push({
|
|
147
|
+
text: lines[currentlyAt].length === 0 ? text.trimStart() : text,
|
|
148
|
+
fontFamily,
|
|
149
|
+
fontWeight,
|
|
150
|
+
fontSize,
|
|
151
|
+
letterSpacing,
|
|
152
|
+
fontVariantNumeric
|
|
66
153
|
});
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
154
|
+
return { exceedsBox: false, newLine: false };
|
|
155
|
+
}
|
|
156
|
+
if (currentlyAt === maxLines - 1) {
|
|
157
|
+
return { exceedsBox: true, newLine: false };
|
|
158
|
+
}
|
|
159
|
+
lines[currentlyAt + 1] = [
|
|
160
|
+
{
|
|
161
|
+
text: text.trimStart(),
|
|
162
|
+
fontFamily,
|
|
163
|
+
fontWeight,
|
|
164
|
+
fontSize,
|
|
165
|
+
letterSpacing,
|
|
166
|
+
fontVariantNumeric
|
|
76
167
|
}
|
|
168
|
+
];
|
|
169
|
+
return { exceedsBox: false, newLine: true };
|
|
77
170
|
}
|
|
78
|
-
|
|
79
|
-
wordCache.set(key, result);
|
|
80
|
-
return result;
|
|
171
|
+
};
|
|
81
172
|
};
|
|
82
173
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
];
|
|
109
|
-
const widths = lineWithWord.map((w) => measureText(w).width);
|
|
110
|
-
const lineWidthWithWordAdded = widths.reduce((a, b) => a + b, 0);
|
|
111
|
-
if (Math.ceil(lineWidthWithWordAdded) < maxBoxWidth) {
|
|
112
|
-
lines[currentlyAt].push({
|
|
113
|
-
text: lines[currentlyAt].length === 0 ? text.trimStart() : text,
|
|
114
|
-
fontFamily,
|
|
115
|
-
fontWeight,
|
|
116
|
-
fontSize,
|
|
117
|
-
letterSpacing,
|
|
118
|
-
fontVariantNumeric,
|
|
119
|
-
});
|
|
120
|
-
return { exceedsBox: false, newLine: false };
|
|
121
|
-
}
|
|
122
|
-
if (currentlyAt === maxLines - 1) {
|
|
123
|
-
return { exceedsBox: true, newLine: false };
|
|
124
|
-
}
|
|
125
|
-
lines[currentlyAt + 1] = [
|
|
126
|
-
{
|
|
127
|
-
text: text.trimStart(),
|
|
128
|
-
fontFamily,
|
|
129
|
-
fontWeight,
|
|
130
|
-
fontSize,
|
|
131
|
-
letterSpacing,
|
|
132
|
-
fontVariantNumeric,
|
|
133
|
-
},
|
|
134
|
-
];
|
|
135
|
-
return { exceedsBox: false, newLine: true };
|
|
136
|
-
},
|
|
137
|
-
};
|
|
174
|
+
// src/layouts/fit-text.ts
|
|
175
|
+
var sampleSize = 100;
|
|
176
|
+
var fitText = ({
|
|
177
|
+
text,
|
|
178
|
+
withinWidth,
|
|
179
|
+
fontFamily,
|
|
180
|
+
fontVariantNumeric,
|
|
181
|
+
fontWeight,
|
|
182
|
+
letterSpacing,
|
|
183
|
+
validateFontIsLoaded,
|
|
184
|
+
additionalStyles,
|
|
185
|
+
textTransform
|
|
186
|
+
}) => {
|
|
187
|
+
const estimate = measureText({
|
|
188
|
+
text,
|
|
189
|
+
fontFamily,
|
|
190
|
+
fontSize: sampleSize,
|
|
191
|
+
fontWeight,
|
|
192
|
+
fontVariantNumeric,
|
|
193
|
+
letterSpacing,
|
|
194
|
+
validateFontIsLoaded,
|
|
195
|
+
textTransform,
|
|
196
|
+
additionalStyles
|
|
197
|
+
});
|
|
198
|
+
return { fontSize: withinWidth / estimate.width * sampleSize };
|
|
138
199
|
};
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
text,
|
|
144
|
-
fontFamily,
|
|
145
|
-
fontSize: sampleSize,
|
|
146
|
-
fontWeight,
|
|
147
|
-
fontVariantNumeric,
|
|
148
|
-
letterSpacing,
|
|
149
|
-
validateFontIsLoaded,
|
|
150
|
-
textTransform,
|
|
151
|
-
additionalStyles,
|
|
152
|
-
});
|
|
153
|
-
return { fontSize: (withinWidth / estimate.width) * sampleSize };
|
|
200
|
+
export {
|
|
201
|
+
measureText,
|
|
202
|
+
fitText,
|
|
203
|
+
fillTextBox
|
|
154
204
|
};
|
|
155
|
-
|
|
156
|
-
export { fillTextBox, fitText, measureText };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remotion/layout-utils",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.143",
|
|
4
4
|
"description": "Layout Utils for Remotion",
|
|
5
5
|
"main": "dist/cjs/index.js",
|
|
6
6
|
"types": "dist/cjs/index.d.ts",
|
|
@@ -49,6 +49,6 @@
|
|
|
49
49
|
"formatting": "prettier src --check",
|
|
50
50
|
"lint": "eslint src --ext ts,tsx",
|
|
51
51
|
"watch": "tsc -w",
|
|
52
|
-
"build": "
|
|
52
|
+
"build": "bun bundle.ts && tsc -d"
|
|
53
53
|
}
|
|
54
54
|
}
|