@pmndrs/vanilla
Advanced tools
Comparing version 1.19.3 to 1.19.4
@@ -1,1 +0,1 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./pcss.cjs.js"),s=require("./Caustics.cjs.js"),r=require("./shaderMaterial.cjs.js"),t=require("./AccumulativeShadows.cjs.js"),i=require("./Cloud.cjs.js"),a=require("./useFBO.cjs.js"),o=require("./SpriteAnimator.cjs.js"),u=require("./Outlines.cjs.js"),p=require("./Billboard.cjs.js"),l=require("./Text.cjs.js"),c=require("./Splat.cjs.js"),j=require("./Grid.cjs.js");require("three"),require("three/examples/jsm/postprocessing/Pass.js"),require("../materials/MeshDiscardMaterial.cjs.js"),require("../helpers/deprecated.cjs.js"),require("three/examples/jsm/utils/BufferGeometryUtils.js"),require("troika-three-text"),exports.pcss=e.pcss,exports.Caustics=s.Caustics,exports.CausticsMaterial=s.CausticsMaterial,exports.CausticsProjectionMaterial=s.CausticsProjectionMaterial,exports.createCausticsUpdate=s.createCausticsUpdate,exports.shaderMaterial=r.shaderMaterial,exports.ProgressiveLightMap=t.ProgressiveLightMap,exports.SoftShadowMaterial=t.SoftShadowMaterial,exports.CLOUD_URL=i.CLOUD_URL,exports.Cloud=i.Cloud,exports.Clouds=i.Clouds,exports.useFBO=a.useFBO,exports.SpriteAnimator=o.SpriteAnimator,exports.Outlines=u.Outlines,exports.Billboard=p.Billboard,exports.Text=l.Text,exports.Splat=c.Splat,exports.SplatLoader=c.SplatLoader,exports.Grid=j.Grid; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./pcss.cjs.js"),s=require("./Caustics.cjs.js"),r=require("./shaderMaterial.cjs.js"),t=require("./AccumulativeShadows.cjs.js"),a=require("./Cloud.cjs.js"),i=require("./useFBO.cjs.js"),o=require("./SpriteAnimator.cjs.js"),u=require("./Outlines.cjs.js"),p=require("./Billboard.cjs.js"),l=require("./Splat.cjs.js"),c=require("./Grid.cjs.js");require("three"),require("three/examples/jsm/postprocessing/Pass.js"),require("../materials/MeshDiscardMaterial.cjs.js"),require("../helpers/deprecated.cjs.js"),require("three/examples/jsm/utils/BufferGeometryUtils.js"),exports.pcss=e.pcss,exports.Caustics=s.Caustics,exports.CausticsMaterial=s.CausticsMaterial,exports.CausticsProjectionMaterial=s.CausticsProjectionMaterial,exports.createCausticsUpdate=s.createCausticsUpdate,exports.shaderMaterial=r.shaderMaterial,exports.ProgressiveLightMap=t.ProgressiveLightMap,exports.SoftShadowMaterial=t.SoftShadowMaterial,exports.CLOUD_URL=a.CLOUD_URL,exports.Cloud=a.Cloud,exports.Clouds=a.Clouds,exports.useFBO=i.useFBO,exports.SpriteAnimator=o.SpriteAnimator,exports.Outlines=u.Outlines,exports.Billboard=p.Billboard,exports.Splat=l.Splat,exports.SplatLoader=l.SplatLoader,exports.Grid=c.Grid; |
@@ -10,4 +10,3 @@ export * from './pcss'; | ||
export * from './Billboard'; | ||
export * from './Text'; | ||
export * from './Splat'; | ||
export * from './Grid'; |
@@ -10,3 +10,2 @@ export { pcss } from './pcss.js'; | ||
export { Billboard } from './Billboard.js'; | ||
export { Text } from './Text.js'; | ||
export { Splat, SplatLoader } from './Splat.js'; | ||
@@ -19,2 +18,1 @@ export { Grid } from './Grid.js'; | ||
import 'three/examples/jsm/utils/BufferGeometryUtils.js'; | ||
import 'troika-three-text'; |
@@ -10,3 +10,2 @@ export { pcss } from './core/pcss.js'; | ||
export { Billboard } from './core/Billboard.js'; | ||
export { Text } from './core/Text.js'; | ||
export { Splat, SplatLoader } from './core/Splat.js'; | ||
@@ -13,0 +12,0 @@ export { Grid } from './core/Grid.js'; |
{ | ||
"name": "@pmndrs/vanilla", | ||
"version": "1.19.3", | ||
"version": "1.19.4", | ||
"private": false, | ||
@@ -46,4 +46,3 @@ "publishConfig": { | ||
"dependencies": { | ||
"glsl-noise": "^0.0.0", | ||
"troika-three-text": "0.47.2" | ||
"glsl-noise": "^0.0.0" | ||
}, | ||
@@ -50,0 +49,0 @@ "peerDependencies": { |
@@ -657,81 +657,8 @@ ![logo](logo.jpg) | ||
#### Text | ||
#### Text [EXTERNAL] | ||
[![storybook](https://img.shields.io/badge/-storybook-%23ff69b4)](https://pmndrs.github.io/drei-vanilla/?path=/story/abstractions-text--text-story) | ||
[drei counterpart](https://github.com/pmndrs/drei#text) | ||
Hi-quality text rendering w/ signed distance fields (SDF) and antialiasing, using [troika-3d-text](https://github.com/protectwise/troika/tree/master/packages/troika-3d-text). All of troikas props are valid! | ||
Hi-quality text rendering w/ signed distance fields (SDF) and antialiasing, using [troika-3d-text](https://github.com/protectwise/troika/tree/master/packages/troika-3d-text). | ||
> Required `troika-three-text` >= `0.46.4` | ||
```ts | ||
export type TextProps = { | ||
characters?: string | ||
color?: number | string | ||
// the text content | ||
text: string | ||
/** Font size, default: 1 */ | ||
fontSize?: number | ||
maxWidth?: number | ||
lineHeight?: number | ||
letterSpacing?: number | ||
textAlign?: 'left' | 'right' | 'center' | 'justify' | ||
font?: string | ||
anchorX?: number | 'left' | 'center' | 'right' | ||
anchorY?: number | 'top' | 'top-baseline' | 'middle' | 'bottom-baseline' | 'bottom' | ||
clipRect?: [number, number, number, number] | ||
depthOffset?: number | ||
direction?: 'auto' | 'ltr' | 'rtl' | ||
overflowWrap?: 'normal' | 'break-word' | ||
whiteSpace?: 'normal' | 'overflowWrap' | 'nowrap' | ||
outlineWidth?: number | string | ||
outlineOffsetX?: number | string | ||
outlineOffsetY?: number | string | ||
outlineBlur?: number | string | ||
outlineColor?: number | string | ||
outlineOpacity?: number | ||
strokeWidth?: number | string | ||
strokeColor?: number | string | ||
strokeOpacity?: number | ||
fillOpacity?: number | ||
sdfGlyphSize?: number | ||
debugSDF?: boolean | ||
onSync?: (troika: any) => void | ||
onPreloadEnd?: () => void | ||
} | ||
``` | ||
Usage | ||
```jsx | ||
const text = Text({ | ||
text: 'Hello World', | ||
}) | ||
const mesh = new THREE.Mesh(geometry, material) | ||
mesh.add(text.mesh) | ||
``` | ||
Text function returns the following | ||
```jsx | ||
export type TextType = { | ||
mesh: THREE.Mesh | ||
updateProps: (newProps: Partial<TextProps>) => void | ||
dispose: () => void | ||
} | ||
``` | ||
You can preload the font and characters: | ||
```ts | ||
const preloadRelatedParams = { | ||
// support ttf/otf/woff(woff2 is not supported) | ||
font: '/your/font/path', | ||
characters: 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!?.,:;\'"()[]{}<>|/@\\^$-%+=#_&~*', | ||
onPreloadEnd: () => { | ||
// this is the callback when font and characters are loaded | ||
}, | ||
``` | ||
#### Splat | ||
@@ -738,0 +665,0 @@ |
Sorry, the diff of this file is too big to display
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
2
21
334485
73
4355
790
- Removedtroika-three-text@0.47.2
- Removedbidi-js@1.0.3(transitive)
- Removedrequire-from-string@2.0.2(transitive)
- Removedtroika-three-text@0.47.2(transitive)
- Removedtroika-three-utils@0.47.2(transitive)
- Removedtroika-worker-utils@0.47.2(transitive)
- Removedwebgl-sdf-generator@1.1.1(transitive)