feat(cientos): add Text component (SDF text via troika-three-text) - #1444
Draft
Gazoon007 wants to merge 1 commit into
Draft
feat(cientos): add Text component (SDF text via troika-three-text)#1444Gazoon007 wants to merge 1 commit into
Gazoon007 wants to merge 1 commit into
Conversation
✅ Deploy Preview for tresjs-lab ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for rapier-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for cientos-tresjs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for postprocessing-tresjs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for tresjs-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
- Add a new `<Text>` component that renders high-quality SDF (signed distance field) text using `troika-three-text`. - Include features like kerning, ligatures, bidirectional text, unicode fallback, and automatic sync/disposal of the underlying instance. - Update `pnpm-workspace.yaml` and `package.json` to include `troika-three-text`. - Add playground demo, API documentation, and examples to showcase the component’s capabilities.
Gazoon007
force-pushed
the
feat/text-object
branch
from
June 21, 2026 14:30
62e3196 to
fb806bd
Compare
@tresjs/cientos
@tresjs/core
@tresjs/eslint-config
@tresjs/leches
@tresjs/nuxt
@tresjs/post-processing
@tresjs/rapier
commit: |
Gazoon007
marked this pull request as draft
June 22, 2026 16:01
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.
Refs: https://github.com/orgs/Tresjs/discussions/1441
What
Adds a
<Text>component to cientos for SDF text viatroika-three-text, next to the existing extruded<Text3D>. Mirrors drei's<Text3D>/<Text>split.Why
<Text3D>is baked-font extruded geometry only, so no kerning, ligatures, RTL, or unicode fallback. SDF text covers labels, UI, and multilingual content from real font files. The only way to get this before was the manual<primitive>pattern fromapps/docs/content/3.api/5.advanced/primitives.md, where you set props and handle disposal by hand. This component does.sync()and disposal for you.How
New
packages/cientos/src/core/objects/Text.vue, built the same way asText3D.vue(<script setup>, props viawithDefaults, text from prop or slot,defineExpose({ instance })).Owns the troika
Textinstance, callsinstance.sync(() => { invalidate(); emit('sync', instance) })on prop changes, disposes on unmount.Props follow drei's
<Text>, defaultsanchor-x="center",anchor-y="middle",font-size=1,sdf-glyph-size=64.Exported from
src/core/objects/index.ts. Also updated the primitives doc to point at<Text>.Dependency
Adds
troika-three-textas a [catalog dep / optionalDependency, per the issue]. Wasn't a cientos dep before. drei depends on it directly.Usage
Included
Text.vuewith typed props/emits and JSDocsrc/core/objects/index.tsNotes for reviewers