Repository navigation
feat: fontApplyFeatures, and letterSpacing on createLayout spans and fontShapeText - #70
Merged
Merged
Conversation
…fontShapeText For sidorares/react-x11#588: tabular figures for a live readout, and spaced small caps. fontApplyFeatures sets OpenType features by tag, the sibling of fontApplyVariations. An array turns tags on, an object sets each tag to its value, and with nothing to set the font itself comes back. letterSpacing is points added after every character, the last included, through kCTKernAttributeName: a createLayout span option, and an option to fontShapeText so that a run shaped alone agrees with the paragraph.
sidorares
added a commit
that referenced
this pull request
Sep 17, 2026
…the fill colour (#71) The system's icons by name, which createStatusItem's image and a menu item's iconName already take, can now be drawn into a surface for a renderer's own content, sidorares/react-x11#591. ctxDrawSymbol draws the symbol fitted into a rect, centred, in the current fill colour. The template's shape goes into a transparency layer and the colour through it, so a symbol follows the CTM, the clip, the global alpha and the blend mode as a glyph run does, over what is already drawn. It answers false, drawing nothing, for a name the catalogue does not know. symbolSize answers the symbol's size in points, or null. Both take pointSize, weight, scale and variableValue, and run on the calling thread in threaded mode, where they draw the same pixels. The CSS weight mapping matchFont used is shared as FontWeightFromCss. CI now runs test/text-features.js, which #70 added to the test script only, and the new test/symbols.js.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
For sidorares/react-x11#588: tabular figures for a live readout, and spaced small caps. The ntk half is sidorares/ntk#357; react-x11 uses both once they are released.
fontApplyFeatures(font, features)The font with OpenType features set by tag, through
kCTFontFeatureSettingsAttributewithkCTFontOpenTypeFeatureTag— the sibling offontApplyVariations:['tnum'];true/falseor a number for a feature that selects among alternates:{ tnum: true, liga: false, salt: 2 }.The settings replace any the font carries, the way a style names its features whole, and with nothing to set the font itself comes back — the same
External— so a caller can apply it unconditionally. A non-font first argument is a TypeError, as for the other font verbs.letterSpacingPoints added after every character, the last included — what
kCTKernAttributeNamedoes, and what CSS'sletter-spacinglong did; negative values tighten.createLayoutspan option;fontShapeText, as a third argument{ letterSpacing }, so that a glyph run shaped alone and the paragraph it belongs to agree on every advance.It says nothing about ligatures. CSS turns the optional ones off where letters are spaced, and a caller that wants that rule sets them through
fontApplyFeatureson the spaced span — react-x11 will, to match ntk.Tests
test/text-features.js, added tonpm test: the system face's digits are proportional, one width undertnumin either form and still proportional under{ tnum: false }; nothing to set answers the font itself; a non-font argument is a TypeError; a span's spacing adds three gaps to three characters, tightens when negative and spaces only its own span;fontShapeTextspaces to the same width ascreateLayout, every advance carrying the gap, and without the option spaces nothing.Mutation check, each change undone alone and rebuilt:
tnumone width, the object formfalsesets a feature on{ tnum: false }letterSpacingignoredfontShapeText's option ignoredfontShapeTextchecksnpm testpasses on macOS 15 with the verbs built from this branch.