paulzi / svg-text-to-path Goto Github PK

View Code? Open in Web Editor NEW

91.0 91.0 12.0 1.11 MB

Convert svg text element to path

JavaScript 100.00%

svg-text-to-path's People

Contributors

Stargazers

Watchers

Forkers

anatawa12 iziorama w8r rizalrenaldi blaggacao originalsin sumtiogo christianliebel luk3ya0 kernelwhisperer ifeitao garg

svg-text-to-path's Issues

Every svg I generate got display none inside svg tag

This is the svg code I got,
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 500" style="display: none;">

My code is just:

let session = new Session(
        `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 500">
            <style> text{ font-size:42px}</style>
      <text x="20" y="25" font-family="Roboto,Noto Sans KR,Noto Sans TC, Helvetica">sà-wàt-dee안녕하세요i Bas안녕하세요ic 可是 343sample</text>
      </svg>`,
        {
          googleApiKey: 'key',
        }
      );
      let stat = await session.replaceAll();
      let out = session.getSvgString();

Could you try on your end to see if it is an issue?
Thanks!

Font "IBM Plex Mono" causes error

Attempt to use font "IBM Plex Mono" causes error

RangeError: Offset is outside the bounds of the DataView
    at DataView.getInt16 (<anonymous>)
    at DecodeStream.<computed> [as readInt16BE] (DecodeStream.js:72:29)
    at NumberT.decode (Number.js:20:31)
    at Struct._parseFields (Struct.js:41:20)
    at Struct.decode (Struct.js:12:10)
    at $69aac16029968692$export$2e2bcd8739ae039._getCBox (TTFGlyph.js:79:28)
    at $69aac16029968692$export$2e2bcd8739ae039._getMetrics (TTFGlyph.js:318:21)
    at get advanceWidth (Glyph.js:146:17)
    at descriptor.get (decorators.js:10:23)
    at LayoutEngine.js:92:79

Font source:

@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@100;200;300;400;500;600;700&display=swap";

Unable to use config file when using in a browser

`@import` seems not to be supported

Thanks for this lib.

When I import a font like this:

<style>
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@1000&display=swap');
</style>

the browser expands it internally to this:

    <style>
      /* cyrillic-ext */
      @font-face {
        font-family: "Nunito";
        font-style: normal;
        font-weight: 1000;
        font-display: swap;
        src: url(https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofIOOaBXso.woff2)
          format("woff2");
        unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF,
          U+A640-A69F, U+FE2E-FE2F;
      }
      /* cyrillic */
      @font-face {
        font-family: "Nunito";
        font-style: normal;
        font-weight: 1000;
        font-display: swap;
        src: url(https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofIMeaBXso.woff2)
          format("woff2");
        unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
      }
      /* vietnamese */
      @font-face {
        font-family: "Nunito";
        font-style: normal;
        font-weight: 1000;
        font-display: swap;
        src: url(https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofIOuaBXso.woff2)
          format("woff2");
        unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169,
          U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
      }
      /* latin-ext */
      @font-face {
        font-family: "Nunito";
        font-style: normal;
        font-weight: 1000;
        font-display: swap;
        src: url(https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofIO-aBXso.woff2)
          format("woff2");
        unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
          U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
      }
      /* latin */
      @font-face {
        font-family: "Nunito";
        font-style: normal;
        font-weight: 1000;
        font-display: swap;
        src: url(https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofINeaB.woff2)
          format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
          U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
          U+2212, U+2215, U+FEFF, U+FFFD;
      }
    </style>

but then this library fails with Failed to read the 'cssRules' property from 'CSSStyleSheet'

However, import rules look like this: https://developer.mozilla.org/en-US/docs/Web/API/CSSImportRule

Hence

svg-text-to-path/providers/font-face/FontFaceSessionProvider.js

Lines 57 to 59 in 1461877

 if (rule.constructor.name === 'CSSFontFaceRule') { 

 this.#parseFontFace(rule); 

 }

would need a (potentially) small modification to support them.

Font "Oxygen" causes error

Attempt to use font "Oxygen" causes error

@import "https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap";

Whether support text decoration like underline or line-through

My original SVG string is like the below:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" width="53.9" height="144" viewBox="0 0 215.6 576"><path stroke="#000000" stroke-width="8" d="M4 288L4 0M72 288L72 0M124 288L124 0M144 288L144 0M180 288L180 0M248 288L248 0M268 288L268 0M312 288L312 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="4" d="M14 288L14 0M46 288L46 0M54 288L54 0M90 288L90 0M134 288L134 0M210 288L210 0M222 288L222 0M238 288L238 0M302 288L302 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="12" d="M30 288L30 0M110 288L110 0M158 288L158 0M198 288L198 0M290 288L290 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><text alignment-baseline="hanging" text-decoration="underline" width="68.33042025546865" height="9.68242055019997" font-size="7" transform="matrix(1.0014891976530848e-14,-4,4,1.0014891976530848e-14,87.79999999999998,302.66666666666583)" svgjs:data="{&quot;leading&quot;:&quot;1.3&quot;}">ADIDAS | SUPERSTAR 80S</text></svg>

After use this lib, I got:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" width="53.9" height="144" viewBox="0 0 215.6 576"><path stroke="#000000" stroke-width="8" d="M4 288L4 0M72 288L72 0M124 288L124 0M144 288L144 0M180 288L180 0M248 288L248 0M268 288L268 0M312 288L312 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="4" d="M14 288L14 0M46 288L46 0M54 288L54 0M90 288L90 0M134 288L134 0M210 288L210 0M222 288L222 0M238 288L238 0M302 288L302 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="12" d="M30 288L30 0M110 288L110 0M158 288L158 0M198 288L198 0M290 288L290 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="8" d="M4 288L4 0M72 288L72 0M124 288L124 0M144 288L144 0M180 288L180 0M248 288L248 0M268 288L268 0M312 288L312 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="4" d="M14 288L14 0M46 288L46 0M54 288L54 0M90 288L90 0M134 288L134 0M210 288L210 0M222 288L222 0M238 288L238 0M302 288L302 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><path stroke="#000000" stroke-width="12" d="M30 288L30 0M110 288L110 0M158 288L158 0M198 288L198 0M290 288L290 0" transform="matrix(5.769824349776429e-16,0.7932489451476711,-0.14302191464821212,1.0402930010014438e-16,62.46666666666661,302.66666666666583)"></path><g alignment-baseline="hanging" text-decoration="underline" width="68.33042025546865" height="9.68242055019997" transform="matrix(1.0014891976530848e-14,-4,4,1.0014891976530848e-14,87.79999999999998,302.66666666666583)" svgjs:data="{&quot;leading&quot;:&quot;1.3&quot;}"><path d="M3.33 3.9L1.24 3.9L0.77 5.2L0.1 5.2L2 0.22L2.57 0.22L4.47 5.2L3.8 5.2ZM1.44 3.36L3.13 3.36L2.28 1.03ZM5.14 5.2L5.14 0.22L6.55 0.22Q7.2 0.22 7.7 0.51Q8.2 0.79 8.47 1.32Q8.74 1.85 8.74 2.54L8.74 2.86Q8.74 3.56 8.47 4.09Q8.2 4.62 7.7 4.9Q7.19 5.19 6.52 5.2ZM5.8 0.76L5.8 4.66L6.49 4.66Q7.25 4.66 7.67 4.19Q8.09 3.72 8.09 2.84L8.09 2.55Q8.09 1.71 7.7 1.24Q7.3 0.77 6.57 0.76ZM10.44 5.2L9.78 5.2L9.78 0.22L10.44 0.22ZM11.64 5.2L11.64 0.22L13.04 0.22Q13.69 0.22 14.19 0.51Q14.69 0.79 14.96 1.32Q15.23 1.85 15.24 2.54L15.24 2.86Q15.24 3.56 14.97 4.09Q14.69 4.62 14.19 4.9Q13.69 5.19 13.02 5.2ZM12.29 0.76L12.29 4.66L12.98 4.66Q13.74 4.66 14.17 4.19Q14.59 3.72 14.59 2.84L14.59 2.55Q14.59 1.71 14.19 1.24Q13.79 0.77 13.06 0.76ZM18.9 3.9L16.82 3.9L16.35 5.2L15.67 5.2L17.58 0.22L18.15 0.22L20.05 5.2L19.38 5.2ZM17.02 3.36L18.71 3.36L17.86 1.03ZM22.19 2.98Q21.35 2.73 20.96 2.38Q20.58 2.03 20.58 1.51Q20.58 0.92 21.05 0.53Q21.52 0.15 22.27 0.15Q22.78 0.15 23.18 0.35Q23.58 0.55 23.8 0.9Q24.02 1.24 24.02 1.66L23.37 1.66Q23.37 1.21 23.08 0.95Q22.79 0.69 22.27 0.69Q21.78 0.69 21.51 0.9Q21.24 1.12 21.24 1.5Q21.24 1.8 21.5 2.01Q21.76 2.22 22.38 2.4Q23 2.57 23.35 2.78Q23.7 2.99 23.87 3.27Q24.04 3.55 24.04 3.93Q24.04 4.54 23.56 4.9Q23.09 5.26 22.3 5.26Q21.79 5.26 21.35 5.07Q20.9 4.87 20.66 4.53Q20.42 4.19 20.42 3.75L21.08 3.75Q21.08 4.2 21.41 4.47Q21.75 4.73 22.3 4.73Q22.82 4.73 23.1 4.52Q23.38 4.3 23.38 3.94Q23.38 3.57 23.12 3.37Q22.86 3.17 22.19 2.98ZM27.14 6.12L26.63 6.12L26.63 0.22L27.14 0.22ZM31.51 2.98Q30.67 2.73 30.28 2.38Q29.9 2.03 29.9 1.51Q29.9 0.92 30.37 0.53Q30.84 0.15 31.59 0.15Q32.1 0.15 32.51 0.35Q32.91 0.55 33.13 0.9Q33.35 1.24 33.35 1.66L32.69 1.66Q32.69 1.21 32.4 0.95Q32.12 0.69 31.59 0.69Q31.11 0.69 30.84 0.9Q30.56 1.12 30.56 1.5Q30.56 1.8 30.82 2.01Q31.08 2.22 31.7 2.4Q32.32 2.57 32.67 2.78Q33.02 2.99 33.19 3.27Q33.36 3.55 33.36 3.93Q33.36 4.54 32.89 4.9Q32.42 5.26 31.63 5.26Q31.11 5.26 30.67 5.07Q30.23 4.87 29.98 4.53Q29.74 4.19 29.74 3.75L30.4 3.75Q30.4 4.2 30.74 4.47Q31.07 4.73 31.63 4.73Q32.15 4.73 32.42 4.52Q32.7 4.3 32.7 3.94Q32.7 3.57 32.44 3.37Q32.19 3.17 31.51 2.98ZM37.7 0.22L37.7 3.6Q37.7 4.31 37.26 4.75Q36.82 5.2 36.07 5.26L35.9 5.26Q35.08 5.26 34.59 4.82Q34.11 4.38 34.1 3.61L34.1 0.22L34.75 0.22L34.75 3.59Q34.75 4.13 35.05 4.43Q35.35 4.73 35.9 4.73Q36.45 4.73 36.75 4.43Q37.04 4.13 37.04 3.59L37.04 0.22ZM39.4 3.25L39.4 5.2L38.74 5.2L38.74 0.22L40.57 0.22Q41.39 0.22 41.85 0.64Q42.32 1.05 42.32 1.74Q42.32 2.46 41.86 2.86Q41.41 3.25 40.57 3.25ZM39.4 2.71L40.57 2.71Q41.1 2.71 41.38 2.46Q41.66 2.21 41.66 1.75Q41.66 1.3 41.38 1.04Q41.1 0.77 40.61 0.76L39.4 0.76ZM45.97 2.9L43.81 2.9L43.81 4.66L46.32 4.66L46.32 5.2L43.16 5.2L43.16 0.22L46.28 0.22L46.28 0.76L43.81 0.76L43.81 2.36L45.97 2.36ZM48.96 3.18L47.79 3.18L47.79 5.2L47.13 5.2L47.13 0.22L48.78 0.22Q49.62 0.22 50.07 0.6Q50.52 0.98 50.52 1.72Q50.52 2.18 50.27 2.53Q50.02 2.87 49.57 3.04L50.74 5.15L50.74 5.2L50.04 5.2ZM47.79 2.65L48.8 2.65Q49.29 2.65 49.58 2.39Q49.86 2.14 49.86 1.72Q49.86 1.25 49.59 1.01Q49.31 0.76 48.79 0.76L47.79 0.76ZM52.91 2.98Q52.07 2.73 51.68 2.38Q51.3 2.03 51.3 1.51Q51.3 0.92 51.77 0.53Q52.24 0.15 52.99 0.15Q53.5 0.15 53.9 0.35Q54.3 0.55 54.53 0.9Q54.75 1.24 54.75 1.66L54.09 1.66Q54.09 1.21 53.8 0.95Q53.51 0.69 52.99 0.69Q52.5 0.69 52.23 0.9Q51.96 1.12 51.96 1.5Q51.96 1.8 52.22 2.01Q52.48 2.22 53.1 2.4Q53.72 2.57 54.07 2.78Q54.42 2.99 54.59 3.27Q54.76 3.55 54.76 3.93Q54.76 4.54 54.28 4.9Q53.81 5.26 53.02 5.26Q52.51 5.26 52.07 5.07Q51.62 4.87 51.38 4.53Q51.14 4.19 51.14 3.75L51.8 3.75Q51.8 4.2 52.13 4.47Q52.47 4.73 53.02 4.73Q53.54 4.73 53.82 4.52Q54.1 4.3 54.1 3.94Q54.1 3.57 53.84 3.37Q53.58 3.17 52.91 2.98ZM59.04 0.76L57.44 0.76L57.44 5.2L56.78 5.2L56.78 0.76L55.19 0.76L55.19 0.22L59.04 0.22ZM62.25 3.9L60.17 3.9L59.7 5.2L59.02 5.2L60.92 0.22L61.5 0.22L63.4 5.2L62.73 5.2ZM60.36 3.36L62.06 3.36L61.21 1.03ZM65.9 3.18L64.73 3.18L64.73 5.2L64.07 5.2L64.07 0.22L65.71 0.22Q66.55 0.22 67.01 0.6Q67.46 0.98 67.46 1.72Q67.46 2.18 67.21 2.53Q66.96 2.87 66.51 3.04L67.68 5.15L67.68 5.2L66.98 5.2ZM64.73 2.65L65.73 2.65Q66.22 2.65 66.51 2.39Q66.8 2.14 66.8 1.72Q66.8 1.25 66.53 1.01Q66.25 0.76 65.73 0.76L64.73 0.76ZM72.97 1.52Q72.97 1.89 72.77 2.18Q72.57 2.47 72.24 2.64Q72.63 2.8 72.86 3.12Q73.08 3.45 73.08 3.85Q73.08 4.5 72.65 4.88Q72.21 5.26 71.5 5.26Q70.78 5.26 70.35 4.88Q69.92 4.49 69.92 3.85Q69.92 3.45 70.14 3.12Q70.36 2.8 70.75 2.63Q70.42 2.47 70.23 2.18Q70.03 1.89 70.03 1.52Q70.03 0.89 70.44 0.52Q70.84 0.15 71.5 0.15Q72.16 0.15 72.56 0.52Q72.97 0.89 72.97 1.52ZM72.45 3.84Q72.45 3.42 72.19 3.16Q71.92 2.9 71.49 2.9Q71.07 2.9 70.81 3.15Q70.55 3.41 70.55 3.84Q70.55 4.26 70.8 4.5Q71.05 4.75 71.5 4.75Q71.94 4.75 72.2 4.5Q72.45 4.26 72.45 3.84ZM71.5 0.67Q71.13 0.67 70.9 0.9Q70.67 1.13 70.67 1.53Q70.67 1.91 70.89 2.14Q71.12 2.38 71.5 2.38Q71.88 2.38 72.11 2.14Q72.33 1.91 72.33 1.53Q72.33 1.15 72.1 0.91Q71.86 0.67 71.5 0.67ZM77 3.07Q77 4.18 76.62 4.72Q76.24 5.26 75.43 5.26Q74.64 5.26 74.26 4.74Q73.87 4.21 73.86 3.16L73.86 2.31Q73.86 1.22 74.24 0.68Q74.62 0.15 75.43 0.15Q76.23 0.15 76.61 0.66Q76.99 1.18 77 2.25ZM76.37 2.21Q76.37 1.4 76.14 1.04Q75.92 0.67 75.43 0.67Q74.94 0.67 74.72 1.04Q74.5 1.4 74.49 2.16L74.49 3.17Q74.49 3.98 74.73 4.36Q74.96 4.75 75.43 4.75Q75.9 4.75 76.13 4.39Q76.36 4.02 76.37 3.24ZM79.44 2.98Q78.6 2.73 78.21 2.38Q77.83 2.03 77.83 1.51Q77.83 0.92 78.3 0.53Q78.77 0.15 79.52 0.15Q80.03 0.15 80.43 0.35Q80.83 0.55 81.06 0.9Q81.28 1.24 81.28 1.66L80.62 1.66Q80.62 1.21 80.33 0.95Q80.04 0.69 79.52 0.69Q79.03 0.69 78.76 0.9Q78.49 1.12 78.49 1.5Q78.49 1.8 78.75 2.01Q79.01 2.22 79.63 2.4Q80.25 2.57 80.6 2.78Q80.95 2.99 81.12 3.27Q81.29 3.55 81.29 3.93Q81.29 4.54 80.81 4.9Q80.34 5.26 79.55 5.26Q79.04 5.26 78.6 5.07Q78.15 4.87 77.91 4.53Q77.67 4.19 77.67 3.75L78.33 3.75Q78.33 4.2 78.66 4.47Q79 4.73 79.55 4.73Q80.07 4.73 80.35 4.52Q80.63 4.3 80.63 3.94Q80.63 3.57 80.37 3.37Q80.11 3.17 79.44 2.98Z"></path></g></svg>

Which is missing underline. Is it because open type js not support text decoration?
Thank you so much for your attention and participation.

Can you support text vertical mode?

Vertical alignment text:
writing-mode: vertical-rl;
text-orientation: upright;

tspan use: y & dx

font-family with multiple languages

Hello there, I would like to know if I can use font-family with multiple values.
For instance, I have a string with KR and English like Adidas with 안녕하세요 .
I set font-family to Robot, Noto Sans KR

But the KR string failed to demonstrate on the SVG text.
Is there any workaround I can follow? Thanks!

font specification attributes should be removed

font attributes likefont-family and font-size should be removed in path tag because they're not valid for path tag.

Support attribute font declaration and font

With following SVG, ERROR: Cannot read properties of undefined (reading 'split') error occurred.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="100%" height="100%" viewBox="0 0 400 400" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <text x="34px" y="105.198px" font-family="ArialMT" font-size="98px">ﬁx</text>
</svg>

With the following one, no errors occurred.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="100%" height="100%" viewBox="0 0 400 400" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <text x="34px" y="105.198px" style="font-family: ArialMT; font-size: 98px">ﬁx</text>
</svg>

Please support font-*** attribute in SVG. here is MDN doc: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute#f

Can't convert local font

I'm not sure if the inclusion of a local source is configured correctly
Thanks

TypeError

When I press the "Convert" button it shows me an error "Uncaught (in promise) TypeError: a.items is undefined"

SvgTextToPath.replaceAllInString() not working (as expected)

I'm not sure if this is an actual issue or if I just misunderstand the usage of the method.
From my understanding the browser runtimes's replaceAllInString() method takes a string representation of
a html <svg> element for it's first argument.

Unfortunately something like

let svgData = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 400">
<text x="343.01" y="267.28" font-family="Arial" font-size="30px" style="stroke: black; fill: rgb(198, 233, 55);">Hello World</text>
</svg>`;
let out = await SvgTextToPath.replaceAllInString(svgData, {
	fontsUrl: "/fonts",
	handlers: [SvgTextToPath.handlers.map, SvgTextToPath.handlers.http],
	group: true
});

just throws:
svg-text-to-path.js:1 Uncaught (in promise) TypeError: Cannot read property 'getComputedStyle' of null

Support system fonts?

Hi, for the node/CLI variants, is it possible to use system-installed fonts? Especially on Windows?

The obvious --fonts-dir C:\Windows\fonts didn't work in the CLI.

Error importing module to vue-cli app

Get complication error when import to vue-cli app

ERROR Failed to compile with 1 error 6:11:18 PM

error in ./node_modules/svg-text-to-path/src/main.js

Module parse failed: Unexpected token (70:66)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| export async function getFontForNode(textNode, params = {}) {
| let style = getNodeStyle(textNode);
let familyList = getStyleProp(textNode, style, 'fontFamily') ?? '';
| let wght = getStyleProp(textNode, style, 'fontWeight');
| let ital = getStyleProp(textNode, style, 'fontStyle');`

When nullish assignment removed, compilation passed.

Support for `textLength` and `lengthAdjust` attributes

These would not be so bad to implement. Depending on the lengthAdjust mode, either scale all the path widths (with a transform) or space the characters further/closer apart

Alignment baseline middle is not supported

Alignment-baseline="middle" SVG property ignored while conversions.

Letter-spacing property ignored

Letter spacing in svg text element property or inline styles ignored.

Examples
Styles
<text styles="letter-spacing: 1em;">Sample text</text>
Property
<text letter-spacing="1em">Sample text</text>

font face url matcher adds undue `"`

svg-text-to-path/providers/font-face/FontFaceSessionProvider.js

Lines 73 to 79 in 1461877

 let match = item.match(/url\(['"]?([\S^)]+)['"]?\)\s+format\(['"]?([a-z0-9]+)['"]?\)/); 

 if (match) { 

 if (['truetype', 'opentype', 'woff', 'woff2'].includes(match[2])) { 

 source = match[1]; 

 break; 

 } 

 }

The input string is: input : "url(\"https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofINeaB.woff2\") format(\"woff2\")"

Support for `font-stretch`

The font-stretch css property allows different versions of a font to be used for wider or narrower characters.

font-stretch:
ultra-condensed 50%
extra-condensed 62.5%
condensed       75%
semi-condensed  87.5%
normal          100%
semi-expanded   112.5%
expanded        125%
extra-expanded  150%
ultra-expanded  200%

What would the steps be for supporting this in svg-text-to-path?

Problem by running svg-text-to-path via php exec

Hello and thank you very much for your great svg-text-to-path-tool!

We are working on a php-script that should start svg-text-to-path via the exec- or shell_exec-function of php.
We testet code like
$output = shell_exec('cat '.$inputpath.' | svg-text-to-path -k -c svg-create.conf >'.$outputpath);
or
$output = shell_exec('svg-text-to-path -k -c svg-create.conf -o '.$outputpath.' '.$inputpath);

In both cases it seems as if svg-text-to-path doesn't get the inputfile. It creates an output-file, but there is just this line inside:
<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">1:0: document must contain a root element.</parsererror>

If we run the same function (of course with the input- and output-path instead of the vars) everything works perfect.

Do you have any idea, what we are doing wrong or how we can use your tool in that way?

TypeScript?

Hi there!

I really appreciate the work you've done with this library. I was wondering if you would be open to a contribution that would migrate this library to TypeScript? Currently, we're unable to generate d.ts files using tsc due to type errors, even though the JSDOC annotations are great.

For now, we're managing with our own handcrafted d.ts files, but it would be great to have a TypeScript edition of the library. If you're not interested in migrating the library to TypeScript, we could create a fork under @21GramConsulting and maintain a TypeScript edition there.

Please know that our intention is not to hijack your library, but rather to improve its compatibility with TypeScript. Would you be open to a TypeScript migration contribution?

Best,
Adam

Add support of OpenType features (tabular numerals, etc)

I used OpenType features in css (tabular numbers or alternates stylistic set). But script replaces alternate symbols with the ordinary. Demo: tabular symbols "1" at the top replaced to ordinary.

Can you add support of OT features to maybe you know how works with alternates?

	if (rule.constructor.name === 'CSSFontFaceRule') {
	this.#parseFontFace(rule);
	}

	let match = item.match(/url\(['"]?([\S^)]+)['"]?\)\s+format\(['"]?([a-z0-9]+)['"]?\)/);
	if (match) {
	if (['truetype', 'opentype', 'woff', 'woff2'].includes(match[2])) {
	source = match[1];
	break;
	}
	}