diff --git a/javascript/README.md b/javascript/README.md new file mode 100644 index 00000000..5f6fad3a --- /dev/null +++ b/javascript/README.md @@ -0,0 +1,25 @@ +# yoga-layout + +This package provides JavaScript bindings for the Yoga layout engine as either WebAssembly (for browsers, Node) or asm.js (other clients or clients unable to read package export maps). + +## Usage + +The default entrypoint provides an asynchronous loader function to return a Yoga instance. + +```ts +import { loadYoga, ALIGN_CENTER } from "yoga-layout"; + +const Yoga = await loadYoga(); + +const node = Yoga.Node.create(); +node.setAlignContent(ALIGN_CENTER); +``` + +An alternative synchronous API is provided for compatibility, but requires using asm.js in browsers instead of WebAssembly, leading to worse performance and larger assets. + +```ts +import Yoga, { ALIGN_CENTER } from "yoga-layout/sync"; + +const node = Yoga.Node.create(); +node.setAlignContent(ALIGN_CENTER); +``` diff --git a/javascript/jest.setup.js b/javascript/jest.setup.js index 85c6582d..4589c3be 100644 --- a/javascript/jest.setup.js +++ b/javascript/jest.setup.js @@ -13,8 +13,8 @@ module.exports = async () => { } else if (process.env['SYNC']) { global.Yoga = require("./dist/sync.asmjs"); } else if (process.env['WASM']) { - global.Yoga = await require("./dist/index.wasm").load(); + global.Yoga = await require("./dist/index.wasm").loadYoga(); } else { - global.Yoga = await require("./dist/index.asmjs").load(); + global.Yoga = await require("./dist/index.asmjs").loadYoga(); } } diff --git a/javascript/sources/index.asmjs.js b/javascript/sources/index.asmjs.js index ca89851c..6831b01e 100644 --- a/javascript/sources/index.asmjs.js +++ b/javascript/sources/index.asmjs.js @@ -8,9 +8,9 @@ */ const wrapAsm = require('./wrapAsm'); -const loadYoga = require('./asmjs-async'); +const loadAsm = require('./asmjs-async'); module.exports = { - load: () => loadYoga().then(wrapAsm), + loadYoga: () => loadAsm().then(wrapAsm), ...require('./YGEnums'), } diff --git a/javascript/sources/index.d.ts b/javascript/sources/index.d.ts index 7340238a..64bdf899 100644 --- a/javascript/sources/index.d.ts +++ b/javascript/sources/index.d.ts @@ -12,4 +12,4 @@ import type {Yoga} from './wrapAsm'; export * from './YGEnums'; export * from './wrapAsm'; -export function load(): Promise; +export function loadYoga(): Promise; diff --git a/javascript/sources/index.wasm.js b/javascript/sources/index.wasm.js index e64d3985..f9696b2d 100644 --- a/javascript/sources/index.wasm.js +++ b/javascript/sources/index.wasm.js @@ -8,9 +8,9 @@ */ const wrapAsm = require('./wrapAsm'); -const loadYoga = require('./wasm-async'); +const loadAsm = require('./wasm-async'); module.exports = { - load: () => loadYoga().then(wrapAsm), + loadYoga: () => loadAsm().then(wrapAsm), ...require('./YGEnums'), } diff --git a/javascript/sources/sync.asmjs.js b/javascript/sources/sync.asmjs.js index 2e769414..bfb929fc 100644 --- a/javascript/sources/sync.asmjs.js +++ b/javascript/sources/sync.asmjs.js @@ -8,6 +8,6 @@ */ const wrapAsm = require('./wrapAsm'); -const loadYoga = require('./asmjs-sync'); +const loadAsm = require('./asmjs-sync'); -module.exports = wrapAsm(loadYoga()); +module.exports = wrapAsm(loadAsm()); diff --git a/javascript/sources/sync.wasm.js b/javascript/sources/sync.wasm.js index 393c6d31..87280bc3 100644 --- a/javascript/sources/sync.wasm.js +++ b/javascript/sources/sync.wasm.js @@ -8,6 +8,6 @@ */ const wrapAsm = require('./wrapAsm'); -const loadYoga = require('./wasm-sync'); +const loadAsm = require('./wasm-sync'); -module.exports = wrapAsm(loadYoga()); +module.exports = wrapAsm(loadAsm());