@saboit-dev/thomas 1.0.0

package/text_engine_2d/MSDFTextGeometry/vertices.js

@@ -0,0 +1,84 @@
+function generateAttributes(glyphs, texWidth, texHeight, flipY) {
+  const uvs = new Float32Array(glyphs.length * 4 * 2);
+  const positions = new Float32Array(glyphs.length * 4 * 3);
+  const centers = new Float32Array(glyphs.length * 4 * 2);
+  let i = 0;
+  let j = 0;
+  let k = 0;
+  glyphs.forEach(function (glyph) {
+    const bitmap = glyph.data;
+
+    // UV
+    const bw = bitmap.x + bitmap.width;
+    const bh = bitmap.y + bitmap.height;
+
+    // top left position
+    const u0 = bitmap.x / texWidth;
+    let v1 = bitmap.y / texHeight;
+    const u1 = bw / texWidth;
+    let v0 = bh / texHeight;
+    if (flipY) {
+      v1 = (texHeight - bitmap.y) / texHeight;
+      v0 = (texHeight - bh) / texHeight;
+    }
+
+    // BL
+    uvs[i++] = u0;
+    uvs[i++] = v1;
+    // TL
+    uvs[i++] = u0;
+    uvs[i++] = v0;
+    // TR
+    uvs[i++] = u1;
+    uvs[i++] = v0;
+    // BR
+    uvs[i++] = u1;
+    uvs[i++] = v1;
+
+    /// Positions, Centers
+
+    // bottom left position
+    const x = glyph.position[0] + bitmap.xoffset;
+    const y = glyph.position[1] + bitmap.yoffset;
+
+    // quad size
+    const w = bitmap.width;
+    const h = bitmap.height;
+
+    // Position
+
+    // BL
+    positions[j++] = x;
+    positions[j++] = y;
+    positions[j++] = 0;
+    // TL
+    positions[j++] = x;
+    positions[j++] = y + h;
+    positions[j++] = 0;
+    // TR
+    positions[j++] = x + w;
+    positions[j++] = y + h;
+    positions[j++] = 0;
+    // BR
+    positions[j++] = x + w;
+    positions[j++] = y;
+    positions[j++] = 0;
+
+    // Center
+    centers[k++] = x + w / 2;
+    centers[k++] = y + h / 2;
+    centers[k++] = x + w / 2;
+    centers[k++] = y + h / 2;
+    centers[k++] = x + w / 2;
+    centers[k++] = y + h / 2;
+    centers[k++] = x + w / 2;
+    centers[k++] = y + h / 2;
+  });
+  return {
+    uvs,
+    positions,
+    centers
+  };
+}
+
+export { generateAttributes };

package/text_engine_2d/MSDFTextMaterial/fragment.glsl.js

@@ -0,0 +1,3 @@
+var fragmentShader = "#define GLSLIFY 1\nvarying vec2 vUv;uniform float uOpacity;uniform float uOffset;uniform vec3 uColor;uniform sampler2D uMap;float median(float r,float g,float b){return max(min(r,g),min(max(r,g),b));}void main(){vec3 s=texture2D(uMap,vUv).rgb;float sigDist=median(s.r,s.g,s.b)-0.5+uOffset;float alpha=clamp(sigDist/fwidth(sigDist)+0.5,0.0,1.0);if(alpha<0.01)discard;gl_FragColor=vec4(uColor,uOpacity*alpha);}"; // eslint-disable-line
+
+export { fragmentShader as default };

package/text_engine_2d/MSDFTextMaterial/index.cjs.js

@@ -0,0 +1 @@
+"use strict";var i=require("three");class e extends i.ShaderMaterial{constructor(e={}){super(e={...{side:i.FrontSide,transparent:!0,extensions:{derivatives:!0},uniforms:{uOpacity:{value:1},uOffset:{value:0},uColor:{value:new i.Color("#ffffff")},uMap:{value:null}},vertexShader:"#define GLSLIFY 1\nvarying vec2 vUv;void main(){vec4 mvPosition=vec4(position,1.0);mvPosition=modelViewMatrix*mvPosition;gl_Position=projectionMatrix*mvPosition;vUv=uv;}",fragmentShader:"#define GLSLIFY 1\nvarying vec2 vUv;uniform float uOpacity;uniform float uOffset;uniform vec3 uColor;uniform sampler2D uMap;float median(float r,float g,float b){return max(min(r,g),min(max(r,g),b));}void main(){vec3 s=texture2D(uMap,vUv).rgb;float sigDist=median(s.r,s.g,s.b)-0.5+uOffset;float alpha=clamp(sigDist/fwidth(sigDist)+0.5,0.0,1.0);if(alpha<0.01)discard;gl_FragColor=vec4(uColor,uOpacity*alpha);}"},...e})}}module.exports=e;

package/text_engine_2d/MSDFTextMaterial/index.d.ts

@@ -0,0 +1,4 @@
+import { ShaderMaterial } from 'three';
+export default class MSDFTextMaterial extends ShaderMaterial {
+    constructor(options?: {});
+}

package/text_engine_2d/MSDFTextMaterial/index.js

@@ -0,0 +1,38 @@
+import { ShaderMaterial, FrontSide, Color } from 'three';
+import fragmentShader from './fragment.glsl.js';
+import vertexShader from './vertex.glsl.js';
+
+class MSDFTextMaterial extends ShaderMaterial {
+  constructor(options = {}) {
+    const defaultOptions = {
+      side: FrontSide,
+      transparent: true,
+      extensions: {
+        derivatives: true
+      },
+      uniforms: {
+        uOpacity: {
+          value: 1
+        },
+        uOffset: {
+          value: 0
+        },
+        uColor: {
+          value: new Color('#ffffff')
+        },
+        uMap: {
+          value: null
+        }
+      },
+      vertexShader,
+      fragmentShader
+    };
+    options = {
+      ...defaultOptions,
+      ...options
+    };
+    super(options);
+  }
+}
+
+export { MSDFTextMaterial as default };

package/text_engine_2d/MSDFTextMaterial/vertex.glsl.js

@@ -0,0 +1,3 @@
+var vertexShader = "#define GLSLIFY 1\nvarying vec2 vUv;void main(){vec4 mvPosition=vec4(position,1.0);mvPosition=modelViewMatrix*mvPosition;gl_Position=projectionMatrix*mvPosition;vUv=uv;}"; // eslint-disable-line
+
+export { vertexShader as default };

package/text_engine_2d/index.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./MSDFTextGeometry/index.cjs.js"),r=require("./MSDFTextMaterial/index.cjs.js"),t=require("./react/SDFText.cjs.js"),s=require("./react/SDFTextProvider.cjs.js");require("quad-indices"),require("three"),require("./MSDFTextGeometry/TextLayout.cjs.js"),require("word-wrapper"),require("./MSDFTextGeometry/utils.cjs.js"),require("./MSDFTextGeometry/vertices.cjs.js"),require("react"),require("./react/context.cjs.js"),require("./react/utils.cjs.js"),require("@babel/runtime/helpers/extends"),require("@react-three/drei"),require("@react-three/fiber"),require("three/examples/jsm/loaders/FontLoader"),require("./register.cjs.js"),exports.MSDFTextGeometry=e,exports.MSDFTextMaterial=r,exports.SDFText=t.SDFText,exports.SDFTextProvider=s.SDFTextProvider;

package/text_engine_2d/index.d.ts

@@ -0,0 +1,6 @@
+import MSDFTextGeometry from './MSDFTextGeometry';
+import MSDFTextMaterial from './MSDFTextMaterial';
+export { MSDFTextMaterial, MSDFTextGeometry };
+export { SDFText } from './react/SDFText';
+export type { SDFTextRefType } from './react/SDFText';
+export { SDFTextProvider } from './react/SDFTextProvider';

package/text_engine_2d/index.js

@@ -0,0 +1,18 @@
+export { default as MSDFTextGeometry } from './MSDFTextGeometry/index.js';
+export { default as MSDFTextMaterial } from './MSDFTextMaterial/index.js';
+export { SDFText } from './react/SDFText.js';
+export { SDFTextProvider } from './react/SDFTextProvider.js';
+import 'quad-indices';
+import 'three';
+import './MSDFTextGeometry/TextLayout.js';
+import 'word-wrapper';
+import './MSDFTextGeometry/utils.js';
+import './MSDFTextGeometry/vertices.js';
+import 'react';
+import './react/context.js';
+import './react/utils.js';
+import '@babel/runtime/helpers/esm/extends';
+import '@react-three/drei';
+import '@react-three/fiber';
+import 'three/examples/jsm/loaders/FontLoader';
+import './register.js';

package/text_engine_2d/react/SDFText.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./context.cjs.js"),r=require("./utils.cjs.js");function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var o=n(e);const i=e.forwardRef((function({instanceKey:n,bold:i,color:u,opacity:c,outlineWidth:l,outlineOpacity:a,outlineColor:s,text:f,alignX:d,alignY:p,letterSpacing:y,yShift:g,width:v,lineHeight:h,onBeforeUpdate:j},x){const b=e.useContext(t.SDFTextProviderContext);if(!b)throw new Error("No SDFTextProvider");const O=e.useRef(null),S=e.useRef(null);return e.useImperativeHandle(x,(()=>({setTransform(e){S.current&&(S.current.transform=e)}})),[]),e.useLayoutEffect((()=>{var e;const t={bold:i,color:u,opacity:c,outlineWidth:l,outlineOpacity:a,outlineColor:s},o={text:f,alignX:d,alignY:p,letterSpacing:y,yShift:g,width:v,lineHeight:h,onBeforeUpdate:j},x=r.makeStyleId(t);return S.current=b.insertInstance(x,t,n,o,null!==(e=O.current)&&void 0!==e?e:void 0),()=>b.removeInstance(x,n)}),[b,n,f,d,p,y,g,v,h,i,u,c,l,a,s,j]),o.createElement("group",{ref:O})}));exports.SDFText=i;

package/text_engine_2d/react/SDFText.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { Matrix4 } from 'three';
+import { ISDFTextConfig, ISDFTextStyle } from './types';
+export type SDFTextRefType = {
+    setTransform(transform: Matrix4): void;
+};
+export declare const SDFText: React.ForwardRefExoticComponent<{
+    instanceKey: string;
+} & ISDFTextConfig & ISDFTextStyle & React.RefAttributes<SDFTextRefType>>;

package/text_engine_2d/react/SDFText.js

@@ -0,0 +1,63 @@
+import * as React from 'react';
+import { forwardRef, useContext, useRef, useImperativeHandle, useLayoutEffect } from 'react';
+import { SDFTextProviderContext } from './context.js';
+import { makeStyleId } from './utils.js';
+
+const SDFText = /*#__PURE__*/forwardRef(function SDFText({
+  instanceKey,
+  bold,
+  color,
+  opacity,
+  outlineWidth,
+  outlineOpacity,
+  outlineColor,
+  text,
+  alignX,
+  alignY,
+  letterSpacing,
+  yShift,
+  width,
+  lineHeight,
+  onBeforeUpdate
+}, ref) {
+  const services = useContext(SDFTextProviderContext);
+  if (!services) throw new Error('No SDFTextProvider');
+  const groupRef = useRef(null);
+  const instanceRef = useRef(null);
+  useImperativeHandle(ref, () => ({
+    setTransform(transform) {
+      if (instanceRef.current) {
+        instanceRef.current.transform = transform;
+      }
+    }
+  }), []);
+  useLayoutEffect(() => {
+    var _groupRef$current;
+    const textStyle = {
+      bold,
+      color,
+      opacity,
+      outlineWidth,
+      outlineOpacity,
+      outlineColor
+    };
+    const textConfig = {
+      text,
+      alignX,
+      alignY,
+      letterSpacing,
+      yShift,
+      width,
+      lineHeight,
+      onBeforeUpdate
+    };
+    const styleId = makeStyleId(textStyle);
+    instanceRef.current = services.insertInstance(styleId, textStyle, instanceKey, textConfig, (_groupRef$current = groupRef.current) !== null && _groupRef$current !== void 0 ? _groupRef$current : undefined);
+    return () => services.removeInstance(styleId, instanceKey);
+  }, [services, instanceKey, text, alignX, alignY, letterSpacing, yShift, width, lineHeight, bold, color, opacity, outlineWidth, outlineOpacity, outlineColor, onBeforeUpdate]);
+  return /*#__PURE__*/React.createElement("group", {
+    ref: groupRef
+  });
+});
+
+export { SDFText };

package/text_engine_2d/react/SDFTextProvider.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/drei"),r=require("@react-three/fiber"),n=require("react"),o=require("three"),a=require("three/examples/jsm/loaders/FontLoader"),l=require("../MSDFTextGeometry/index.cjs.js"),i=require("../register.cjs.js"),u=require("./context.cjs.js"),s=require("./utils.cjs.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function d(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}require("quad-indices"),require("../MSDFTextGeometry/TextLayout.cjs.js"),require("word-wrapper"),require("../MSDFTextGeometry/utils.cjs.js"),require("../MSDFTextGeometry/vertices.cjs.js"),require("../MSDFTextMaterial/index.cjs.js");var f=c(e),m=d(n);const y=99999,p=99998,v=new o.Matrix4,x=new o.Matrix4,h=new o.Color("#ffffff"),j=new o.Color("#000000"),g=.01;function M({instances:e,textStyle:t,atlas:o,font:a,atlasBold:i,fontBold:u,...s}){var c;const d=i&&u&&t.bold,M=d?u.data:a.data,S=n.useState((()=>new l({font:M,texts:[]})))[0];n.useLayoutEffect((()=>()=>S.dispose()),[S]),n.useLayoutEffect((()=>{const t=e.map((e=>e.config));S.update({font:M,texts:t})}),[S,e,M]),r.useFrame((()=>{e.forEach(((t,r)=>{null==t.config.onBeforeUpdate||t.config.onBeforeUpdate(),x.identity();const n=e[r].object;n&&(n.updateMatrixWorld(),x.multiply(n.matrixWorld)),x.multiply(t.transform),v.makeScale(g,g,g),x.multiply(v);const o=S._layouts[r];if(o){var a,l,i,u;const e=null!==(a=o.width)&&void 0!==a?a:0,t=null!==(l=o.height)&&void 0!==l?l:0,r=null!==(i=o.lineHeight)&&void 0!==i?i:0,n=null!==(u=o._options.yShift)&&void 0!==u?u:0,s=r/4-t,c=r/2;let d=0;"center"===o._options.alignX&&(d=-e/2),"right"===o._options.alignX&&(d=-e);let f=s+n;"middle"===o._options.alignY&&(f=(s+c)/2-o.ascender+n),"bottom"===o._options.alignY&&(f=c+n),v.makeTranslation(d,f,0),x.multiply(v)}v.makeRotationX(Math.PI),x.multiply(v),S.setTransform(x,r)}))}));const q=n.useMemo((()=>{var e,r;return{uMap:{value:d?i:o},uColor:{value:null!==(e=t.color)&&void 0!==e?e:h},uOpacity:{value:null!==(r=t.opacity)&&void 0!==r?r:1},uOffset:{value:0}}}),[d,t.opacity,t.color,o,i]),F=n.useMemo((()=>{var e,r;return{uMap:{value:d?i:o},uColor:{value:null!==(e=t.outlineColor)&&void 0!==e?e:j},uOpacity:{value:null!==(r=t.outlineOpacity)&&void 0!==r?r:.4},uOffset:{value:t.outlineWidth}}}),[d,t.outlineOpacity,t.outlineColor,t.outlineWidth,o,i]);return m.createElement(m.Fragment,null,m.createElement("mesh",f.default({geometry:S,frustumCulled:!1,renderOrder:y},s),m.createElement("mSDFTextMaterial",{uniforms:q})),(null!==(c=t.outlineWidth)&&void 0!==c?c:0)>0&&m.createElement("mesh",f.default({geometry:S,frustumCulled:!1,renderOrder:p},s),m.createElement("mSDFTextMaterial",{uniforms:F,depthWrite:!1})))}exports.SDFTextProvider=function({children:e,fontPathRegular:l,fontPathBold:c}){n.useMemo(i.registerTextEngineToR3F,[]);const d=t.useTexture(l.sdfPath),f=r.useLoader(a.FontLoader,l.fontPath),y=t.useTexture(c?c.sdfPath:[]),p=r.useLoader(a.FontLoader,c?c.fontPath:[]),v=n.useState((()=>new Map))[0],x=n.useState(0)[1],h=n.useMemo((()=>({insertInstance(e,t,r,n,a){var l;const i={instanceKey:r,config:n,object:a,transform:new o.Matrix4},u=v.get(e);return v.set(e,{textStyle:t,instances:[...null!==(l=null==u?void 0:u.instances)&&void 0!==l?l:[],i]}),x((e=>e+1)),i},removeInstance(e,t){const r=v.get(e);if(r){const n=r.instances.filter((e=>e.instanceKey!==t));0===n.length?v.delete(e):v.set(e,{textStyle:r.textStyle,instances:n}),x((e=>e+1))}}})),[]);return m.createElement(u.SDFTextProviderContext.Provider,{value:h},m.createElement(m.Fragment,null,e,Array.from(v.values()).map((e=>m.createElement(M,{key:s.makeStyleId(e.textStyle),textStyle:e.textStyle,instances:e.instances,atlas:d,font:f,atlasBold:Array.isArray(y)?void 0:y,fontBold:Array.isArray(p)?void 0:p})))))};

package/text_engine_2d/react/SDFTextProvider.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+import { ISDFFont } from './types';
+export declare function SDFTextProvider({ children, fontPathRegular, fontPathBold, }: PropsWithChildren<{
+    fontPathRegular: ISDFFont;
+    fontPathBold?: ISDFFont;
+}>): JSX.Element;

package/text_engine_2d/react/SDFTextProvider.js

@@ -0,0 +1,191 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { useTexture } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import * as React from 'react';
+import { useMemo, useState, useLayoutEffect } from 'react';
+import { Matrix4, Color } from 'three';
+import { FontLoader } from 'three/examples/jsm/loaders/FontLoader';
+import MSDFTextGeometry from '../MSDFTextGeometry/index.js';
+import { registerTextEngineToR3F } from '../register.js';
+import { SDFTextProviderContext } from './context.js';
+import { makeStyleId } from './utils.js';
+
+// Since the outline is done with two meshes, we hardcode two render order values
+// to ensure the foreground is rendered after the outline
+const foreRenderOrder = 99999;
+const outlineRenderOrder = 99998;
+const temp = new Matrix4();
+const transformFinal = new Matrix4();
+const white = new Color('#ffffff');
+const black = new Color('#000000');
+const scaleFactor = 0.01;
+function StyleGroupRenderer({
+  instances,
+  textStyle,
+  atlas,
+  font,
+  atlasBold,
+  fontBold,
+  ...rest
+}) {
+  var _textStyle$outlineWid;
+  const shouldDoBold = atlasBold && fontBold && textStyle.bold;
+  const fontData = shouldDoBold ? fontBold.data : font.data;
+  const geometry = useState(() => new MSDFTextGeometry({
+    font: fontData,
+    texts: []
+  }))[0];
+  useLayoutEffect(() => () => geometry.dispose(), [geometry]);
+  useLayoutEffect(() => {
+    const texts = instances.map(is => is.config);
+    geometry.update({
+      font: fontData,
+      texts
+    });
+  }, [geometry, instances, fontData]);
+  useFrame(() => {
+    // TODO: Revisit this to avoid calculating the matrix every frame
+    instances.forEach((inst, index) => {
+      inst.config.onBeforeUpdate == null ? void 0 : inst.config.onBeforeUpdate();
+      transformFinal.identity();
+      const placeholder = instances[index].object;
+      if (placeholder) {
+        placeholder.updateMatrixWorld();
+        transformFinal.multiply(placeholder.matrixWorld);
+      }
+      transformFinal.multiply(inst.transform);
+      temp.makeScale(scaleFactor, scaleFactor, scaleFactor);
+      transformFinal.multiply(temp);
+      const layout = geometry._layouts[index];
+      if (layout) {
+        var _layout$width, _layout$height, _layout$lineHeight, _layout$_options$yShi;
+        const width = (_layout$width = layout.width) !== null && _layout$width !== void 0 ? _layout$width : 0;
+        const height = (_layout$height = layout.height) !== null && _layout$height !== void 0 ? _layout$height : 0;
+        const lineHeight = (_layout$lineHeight = layout.lineHeight) !== null && _layout$lineHeight !== void 0 ? _layout$lineHeight : 0;
+        const optYShift = (_layout$_options$yShi = layout._options.yShift) !== null && _layout$_options$yShi !== void 0 ? _layout$_options$yShi : 0;
+        const bottomShift = -height + lineHeight / 4;
+        const topShift = lineHeight / 2;
+        let xShift = 0;
+        if (layout._options.alignX === 'center') xShift = -width / 2;
+        if (layout._options.alignX === 'right') xShift = -width;
+        let yShift = bottomShift + optYShift;
+        if (layout._options.alignY === 'middle') yShift = (bottomShift + topShift) / 2 - layout.ascender + optYShift;
+        if (layout._options.alignY === 'bottom') yShift = topShift + optYShift;
+        temp.makeTranslation(xShift, yShift, 0);
+        transformFinal.multiply(temp);
+      }
+      temp.makeRotationX(Math.PI);
+      transformFinal.multiply(temp);
+      geometry.setTransform(transformFinal, index);
+    });
+  });
+  const uniforms = useMemo(() => {
+    var _textStyle$color, _textStyle$opacity;
+    return {
+      uMap: {
+        value: shouldDoBold ? atlasBold : atlas
+      },
+      uColor: {
+        value: (_textStyle$color = textStyle.color) !== null && _textStyle$color !== void 0 ? _textStyle$color : white
+      },
+      uOpacity: {
+        value: (_textStyle$opacity = textStyle.opacity) !== null && _textStyle$opacity !== void 0 ? _textStyle$opacity : 1.0
+      },
+      uOffset: {
+        value: 0
+      }
+    };
+  }, [shouldDoBold, textStyle.opacity, textStyle.color, atlas, atlasBold]);
+  const uniformsOutline = useMemo(() => {
+    var _textStyle$outlineCol, _textStyle$outlineOpa;
+    return {
+      uMap: {
+        value: shouldDoBold ? atlasBold : atlas
+      },
+      uColor: {
+        value: (_textStyle$outlineCol = textStyle.outlineColor) !== null && _textStyle$outlineCol !== void 0 ? _textStyle$outlineCol : black
+      },
+      uOpacity: {
+        value: (_textStyle$outlineOpa = textStyle.outlineOpacity) !== null && _textStyle$outlineOpa !== void 0 ? _textStyle$outlineOpa : 0.4
+      },
+      uOffset: {
+        value: textStyle.outlineWidth
+      }
+    };
+  }, [shouldDoBold, textStyle.outlineOpacity, textStyle.outlineColor, textStyle.outlineWidth, atlas, atlasBold]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("mesh", _extends({
+    geometry: geometry,
+    frustumCulled: false,
+    renderOrder: foreRenderOrder
+  }, rest), /*#__PURE__*/React.createElement("mSDFTextMaterial", {
+    uniforms: uniforms
+  })), ((_textStyle$outlineWid = textStyle.outlineWidth) !== null && _textStyle$outlineWid !== void 0 ? _textStyle$outlineWid : 0) > 0 && /*#__PURE__*/React.createElement("mesh", _extends({
+    geometry: geometry,
+    frustumCulled: false,
+    renderOrder: outlineRenderOrder
+  }, rest), /*#__PURE__*/React.createElement("mSDFTextMaterial", {
+    uniforms: uniformsOutline,
+    depthWrite: false
+  })));
+}
+function SDFTextProvider({
+  children,
+  fontPathRegular,
+  fontPathBold
+}) {
+  useMemo(registerTextEngineToR3F, []);
+  const atlas = useTexture(fontPathRegular.sdfPath);
+  const font = useLoader(FontLoader, fontPathRegular.fontPath);
+  const atlasBold = useTexture(fontPathBold ? fontPathBold.sdfPath : []);
+  const fontBold = useLoader(FontLoader, fontPathBold ? fontPathBold.fontPath : []);
+
+  // We have a mutable map of immutable arrays, so we are using a force update
+  const instancesGroups = useState(() => new Map())[0];
+  const forceUpdate = useState(0)[1];
+  const api = useMemo(() => ({
+    insertInstance(styleId, textStyle, instanceKey, config, object) {
+      var _prevRecord$instances;
+      const newInst = {
+        instanceKey,
+        config,
+        object,
+        transform: new Matrix4()
+      };
+      const prevRecord = instancesGroups.get(styleId);
+      instancesGroups.set(styleId, {
+        textStyle,
+        instances: [...((_prevRecord$instances = prevRecord == null ? void 0 : prevRecord.instances) !== null && _prevRecord$instances !== void 0 ? _prevRecord$instances : []), newInst]
+      });
+      forceUpdate(i => i + 1);
+      return newInst;
+    },
+    removeInstance(styleId, instanceKey) {
+      const prevRecord = instancesGroups.get(styleId);
+      if (prevRecord) {
+        const without = prevRecord.instances.filter(inst => inst.instanceKey !== instanceKey);
+        if (without.length === 0) {
+          instancesGroups.delete(styleId);
+        } else {
+          instancesGroups.set(styleId, {
+            textStyle: prevRecord.textStyle,
+            instances: without
+          });
+        }
+        forceUpdate(i => i + 1);
+      }
+    }
+  }), []);
+  return /*#__PURE__*/React.createElement(SDFTextProviderContext.Provider, {
+    value: api
+  }, /*#__PURE__*/React.createElement(React.Fragment, null, children, Array.from(instancesGroups.values()).map(ig => /*#__PURE__*/React.createElement(StyleGroupRenderer, {
+    key: makeStyleId(ig.textStyle),
+    textStyle: ig.textStyle,
+    instances: ig.instances,
+    atlas: atlas,
+    font: font,
+    atlasBold: Array.isArray(atlasBold) ? undefined : atlasBold,
+    fontBold: Array.isArray(fontBold) ? undefined : fontBold
+  }))));
+}
+
+export { SDFTextProvider };

package/text_engine_2d/react/context.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=require("react").createContext(null);exports.SDFTextProviderContext=e;

package/text_engine_2d/react/context.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ISDFTextServices } from './types';
+export declare const SDFTextProviderContext: import("react").Context<ISDFTextServices | null>;

package/text_engine_2d/react/context.js

@@ -0,0 +1,5 @@
+import { createContext } from 'react';
+
+const SDFTextProviderContext = /*#__PURE__*/createContext(null);
+
+export { SDFTextProviderContext };

package/text_engine_2d/react/types.cjs.js

@@ -0,0 +1 @@
+"use strict";

package/text_engine_2d/react/types.d.ts

@@ -0,0 +1,33 @@
+import { Color, Matrix4, Object3D } from 'three';
+export interface ISDFTextStyle {
+    bold?: boolean;
+    color?: Color;
+    opacity?: number;
+    outlineWidth?: number;
+    outlineOpacity?: number;
+    outlineColor?: Color;
+}
+export interface ISDFTextInstance {
+    config: ISDFTextConfig;
+    instanceKey: string;
+    object?: Object3D;
+    transform: Matrix4;
+}
+export interface ISDFTextConfig {
+    text: string;
+    alignX?: 'left' | 'center' | 'right';
+    alignY?: 'top' | 'middle' | 'bottom';
+    letterSpacing?: number;
+    width?: number;
+    lineHeight?: number;
+    yShift?: number;
+    onBeforeUpdate?: () => void;
+}
+export interface ISDFTextServices {
+    insertInstance(styleId: string, textStyle: ISDFTextStyle, instanceKey: string, config: ISDFTextConfig, object?: Object3D): ISDFTextInstance;
+    removeInstance(styleId: string, instanceKey: string): void;
+}
+export interface ISDFFont {
+    sdfPath: string;
+    fontPath: string;
+}

package/text_engine_2d/react/types.js

@@ -0,0 +1 @@
+

package/text_engine_2d/react/utils.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.makeStyleId=e=>{var t,o;return[e.bold,null==(t=e.color)?void 0:t.getHexString(),e.opacity,e.outlineWidth,e.outlineOpacity,null==(o=e.outlineColor)?void 0:o.getHexString()].join("_")};

package/text_engine_2d/react/utils.d.ts

@@ -0,0 +1,2 @@
+import { ISDFTextStyle } from './types';
+export declare const makeStyleId: (style: ISDFTextStyle) => string;

package/text_engine_2d/react/utils.js

@@ -0,0 +1,6 @@
+const makeStyleId = style => {
+  var _style$color, _style$outlineColor;
+  return [style.bold, (_style$color = style.color) == null ? void 0 : _style$color.getHexString(), style.opacity, style.outlineWidth, style.outlineOpacity, (_style$outlineColor = style.outlineColor) == null ? void 0 : _style$outlineColor.getHexString()].join('_');
+};
+
+export { makeStyleId };

package/text_engine_2d/register.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),r=require("./MSDFTextGeometry/index.cjs.js"),t=require("./MSDFTextMaterial/index.cjs.js");require("quad-indices"),require("three"),require("./MSDFTextGeometry/TextLayout.cjs.js"),require("word-wrapper"),require("./MSDFTextGeometry/utils.cjs.js"),require("./MSDFTextGeometry/vertices.cjs.js"),exports.registerTextEngineToR3F=function(){e.extend({MSDFTextMaterial:t,MSDFTextGeometry:r})};

package/text_engine_2d/register.d.ts

@@ -0,0 +1,12 @@
+import { ReactThreeFiber } from '@react-three/fiber';
+import MSDFTextGeometry from './MSDFTextGeometry';
+import MSDFTextMaterial from './MSDFTextMaterial';
+export declare function registerTextEngineToR3F(): void;
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            mSDFTextMaterial: ReactThreeFiber.MaterialNode<MSDFTextMaterial, typeof MSDFTextMaterial>;
+            mSDFTextGeometry: ReactThreeFiber.BufferGeometryNode<MSDFTextGeometry, typeof MSDFTextGeometry>;
+        }
+    }
+}

package/text_engine_2d/register.js

@@ -0,0 +1,12 @@
+import { extend } from '@react-three/fiber';
+import MSDFTextGeometry from './MSDFTextGeometry/index.js';
+import MSDFTextMaterial from './MSDFTextMaterial/index.js';
+
+function registerTextEngineToR3F() {
+  extend({
+    MSDFTextMaterial,
+    MSDFTextGeometry
+  });
+}
+
+export { registerTextEngineToR3F };

package/text_engine_3d/InstancedText.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),n=require("three"),r=require("./InstancedTextProvider.cjs.js"),o=require("./types.cjs.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}require("@react-three/fiber"),require("./instancedTextBuffers.cjs.js"),require("./InstancedTextPlaceholder.cjs.js"),require("./useInstancedTextMaterial.cjs.js"),require("@react-three/drei");var c=a(e),i=u(t);const s=new n.Color("white");exports.InstancedText=function({text:e,thickness:a,fontSize:u,textAlign:d,scale:l,color:f,opacity:g,font:x,...y}){var b,M,h;const m=x.fontMetadata.charToIndex["?"],p=r.useInstancedTextAPI(),B=t.useRef(null),v=t.useRef(null);t.useLayoutEffect((()=>{const t=B.current;if(!t)return;const r=x.fontMetadata.fontScale,u=(x.fontMetadata.boundingBox.yMax-x.fontMetadata.boundingBox.yMin+x.fontMetadata.underlineThickness)*r,c=new Float32Array(e.length),i=new Float32Array(2*e.length);let l=0,g=0;const y=[];Array.from(e).forEach(((e,t)=>{if("\n"===e)y.push(l),l=0,g-=u;else{var n;const o=x.fontMetadata.charToIndex[e],a=null!==(n=x.fontMetadata.advances[o])&&void 0!==n?n:x.fontMetadata.advances[m];c[t]=r,i[2*t]=l,i[2*t+1]=g,l+=a*r}})),y.push(l);const b=Math.max(...y),M=-((x.fontMetadata.boundingBox.yMax-x.fontMetadata.boundingBox.yMin)/2+x.fontMetadata.boundingBox.yMin)*r;Array.from(e).forEach(((e,t)=>{c[t]>0&&(d===o.TextAlignment.left&&(i[2*t+1]+=M),d===o.TextAlignment.right&&(i[2*t]-=b,i[2*t+1]+=M),d===o.TextAlignment.center&&(i[2*t]-=b/2,i[2*t+1]+=M))})),t.geometry.boundingBox||(t.geometry.boundingBox=new n.Box3),t.geometry.boundingSphere||(t.geometry.boundingSphere=new n.Sphere),t.geometry.boundingBox.setFromPoints([new n.Vector3(0,x.fontMetadata.boundingBox.yMin*r,0),new n.Vector3(b,x.fontMetadata.boundingBox.yMax*r,a)]),t.geometry.boundingSphere.setFromPoints([new n.Vector3(0,x.fontMetadata.boundingBox.yMin*r,0),new n.Vector3(b,x.fontMetadata.boundingBox.yMax*r,a)]),d===o.TextAlignment.left&&(t.geometry.boundingBox.translate(new n.Vector3(0,M,0)),t.geometry.boundingSphere.translate(new n.Vector3(0,M,0))),d===o.TextAlignment.right&&(t.geometry.boundingBox.translate(new n.Vector3(-b,M,0)),t.geometry.boundingSphere.translate(new n.Vector3(-b,M,0))),d===o.TextAlignment.center&&(t.geometry.boundingBox.translate(new n.Vector3(-b/2,M,0)),t.geometry.boundingSphere.translate(new n.Vector3(-b/2,M,0)));const h=p.addInstances(e,x,null!=f?f:s,i,t);return h?(v.current=h,()=>p.removeInstances(h)):void 0}),[e,f,x.fontMetadata,m,a,d,p]),t.useEffect((()=>{v.current&&p.setOpacity(v.current,null!=g?g:1)}),[p,g]);const T=t.useMemo((()=>({getBuffers:()=>v.current&&p.getBuffers(v.current),getPtr:()=>v.current,setGlyphs:e=>{if(!v.current)return;const t=p.getBuffers(v.current);if(!t)return;const n=Array.from(e).map((e=>x.fontMetadata.charToIndex[e]));t.instanceGIndexBuffer.set(n,v.current.start),t.instanceGIndexBufferAttribute.needsUpdate=!0}})),[x.fontMetadata.charToIndex]);return i.createElement("instancedTextPlaceholder",c.default({scale:[u*(null!==(b=null==l?void 0:l.x)&&void 0!==b?b:1),u*(null!==(M=null==l?void 0:l.y)&&void 0!==M?M:1),a*(null!==(h=null==l?void 0:l.z)&&void 0!==h?h:1)]},y,{textAPI:T,ref:B,frustumCulled:!1}))};

package/text_engine_3d/InstancedText.d.ts

@@ -0,0 +1,13 @@
+import { GroupProps } from '@react-three/fiber';
+import { Color, Vector3 } from 'three';
+import { Font3D, TextAlignment } from './types';
+export declare function InstancedText({ text, thickness, fontSize, textAlign, scale, color, opacity, font, ...rest }: {
+    text: string;
+    thickness: number;
+    fontSize: number;
+    textAlign?: TextAlignment;
+    scale?: Vector3;
+    color?: Color;
+    opacity?: number;
+    font: Font3D;
+} & GroupProps): JSX.Element;