@lightningjs/solid
Advanced tools
@lightningjs/solid - npm Package Compare versions
Comparing version 0.15.4 to 0.15.5
@@ -507,8 +507,3 @@ import { createSignal, mergeProps as mergeProps$1, createRoot, createRenderEffect, createMemo, createComponent as createComponent$1, untrack, splitProps } from 'solid-js'; | ||
| this.name = name; | ||
| this.rendered = false; | ||
| this.autofocus = false; | ||
| this._renderProps = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| this._renderProps = {}; | ||
| this.children = new Children(this); | ||
@@ -521,3 +516,3 @@ } | ||
| this._effects = v; | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this.shader = convertEffectsToShader(v); | ||
@@ -531,3 +526,3 @@ } | ||
| this._parent = p; | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| this.lng.parent = p?.lng ?? null; | ||
@@ -561,3 +556,3 @@ } | ||
| _sendToLightning(name, value) { | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| this.lng[name] = value; | ||
@@ -600,3 +595,3 @@ } else { | ||
| setFocus() { | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| // can be 0 | ||
@@ -690,3 +685,3 @@ if (this.forwardFocus !== undefined) { | ||
| this._states = new States(this._stateChanged.bind(this), states); | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this._stateChanged(); | ||
@@ -749,6 +744,3 @@ } | ||
| // Apply the styles | ||
| Object.assign(this, { | ||
| ...stylesToUndo, | ||
| ...newStyles | ||
| }); | ||
| Object.assign(this, stylesToUndo, newStyles); | ||
| } | ||
@@ -764,7 +756,7 @@ } | ||
| } | ||
| if (!parent.rendered) { | ||
| if (!parent.lng) { | ||
| console.warn('Parent not rendered yet: ', this); | ||
| return; | ||
| } | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| console.warn('Node already rendered: ', this); | ||
@@ -779,7 +771,8 @@ return; | ||
| } | ||
| node.updateLayout(); | ||
| if (this.states.length) { | ||
| this._stateChanged(); | ||
| } | ||
| let props = node._renderProps; | ||
| const props = node._renderProps; | ||
| props.x = props.x || 0; | ||
| props.y = props.y || 0; | ||
| if (parent.lng) { | ||
@@ -792,16 +785,17 @@ props.parent = parent.lng; | ||
| if (node.isTextNode()) { | ||
| props = { | ||
| ...config.fontSettings, | ||
| ...props, | ||
| text: node.getText() | ||
| }; | ||
| if (config.fontSettings) { | ||
| for (const key in config.fontSettings) { | ||
| if (props[key] === undefined) { | ||
| props[key] = config.fontSettings[key]; | ||
| } | ||
| } | ||
| } | ||
| props.text = node.getText(); | ||
| if (props.contain) { | ||
| if (!props.width) { | ||
| props.width = (parent.width || 0) - (props.x || 0) - (props.marginRight || 0); | ||
| node._width = props.width; | ||
| props.width = (parent.width || 0) - props.x - (props.marginRight || 0); | ||
| node._autosized = true; | ||
| } | ||
| if (props.contain === 'both' && !props.height && !props.maxLines) { | ||
| props.height = (parent.height || 0) - (props.y || 0) - (props.marginBottom || 0); | ||
| node._height = props.height; | ||
| props.height = (parent.height || 0) - props.y - (props.marginBottom || 0); | ||
| node._autosized = true; | ||
@@ -812,6 +806,3 @@ } | ||
| node.lng = renderer.createTextNode(props); | ||
| if (isFunc(node.onLoad)) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| if (!node.width || !node.height) { | ||
| if (!props.width || !props.height) { | ||
| node._autosized = true; | ||
@@ -825,9 +816,7 @@ node._resizeOnTextLoad(); | ||
| if (isNaN(props.width)) { | ||
| props.width = (parent.width || 0) - (props.x || 0); | ||
| node._width = props.width; | ||
| props.width = (parent.width || 0) - props.x; | ||
| node._autosized = true; | ||
| } | ||
| if (isNaN(props.height)) { | ||
| props.height = (parent.height || 0) - (props.y || 0); | ||
| node._height = props.height; | ||
| props.height = (parent.height || 0) - props.y; | ||
| node._autosized = true; | ||
@@ -838,3 +827,3 @@ } | ||
| // to set color '#ffffffff' | ||
| node._color = props.color = 0x00000000; | ||
| props.color = 0x00000000; | ||
| } | ||
@@ -844,10 +833,9 @@ } | ||
| node.lng = renderer.createNode(props); | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| } | ||
| node.rendered = true; | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| isFunc(this.onCreate) && this.onCreate.call(this, node); | ||
@@ -864,4 +852,2 @@ node.onEvents.forEach(([name, handler]) => { | ||
| } | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
| if (node.name !== 'text') { | ||
@@ -878,2 +864,4 @@ node.children.forEach(c => { | ||
| node.autofocus && node.setFocus(); | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
| } | ||
@@ -884,6 +872,5 @@ } | ||
| get() { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightningAnimatable(key, v); | ||
@@ -896,6 +883,5 @@ } | ||
| get() { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightning(key, v); | ||
@@ -1273,3 +1259,3 @@ } | ||
| if (node instanceof ElementNode) { | ||
| parent.rendered && node.render(); | ||
| parent.lng && node.render(); | ||
| } else if (parent.isTextNode()) { | ||
@@ -1334,3 +1320,2 @@ // TextNodes can be placed outside of <text> nodes when <Show> is used as placeholder | ||
| rootNode.lng = renderer.root; | ||
| rootNode.rendered = true; | ||
| // @ts-expect-error - code is jsx element and not SolidElement yet | ||
@@ -1337,0 +1322,0 @@ const dispose = solidRenderer.render(code, rootNode); |
@@ -113,3 +113,2 @@ /* | ||
| selected; | ||
| rendered; | ||
| autofocus; | ||
@@ -130,5 +129,2 @@ flexItem; | ||
| _animationSettings; | ||
| _width; | ||
| _height; | ||
| _color; | ||
| _borderRadius; | ||
@@ -149,5 +145,3 @@ _border; | ||
| this.name = name; | ||
| this.rendered = false; | ||
| this.autofocus = false; | ||
| this._renderProps = { x: 0, y: 0 }; | ||
| this._renderProps = {}; | ||
| this.children = new Children(this); | ||
@@ -160,3 +154,3 @@ } | ||
| this._effects = v; | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this.shader = convertEffectsToShader(v); | ||
@@ -170,3 +164,3 @@ } | ||
| this._parent = p; | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| this.lng.parent = p?.lng ?? null; | ||
@@ -204,3 +198,3 @@ } | ||
| _sendToLightning(name, value) { | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| this.lng[name] = value; | ||
@@ -245,3 +239,3 @@ } | ||
| setFocus() { | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| // can be 0 | ||
@@ -336,3 +330,3 @@ if (this.forwardFocus !== undefined) { | ||
| this._states = new States(this._stateChanged.bind(this), states); | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this._stateChanged(); | ||
@@ -394,3 +388,3 @@ } | ||
| // Apply the styles | ||
| Object.assign(this, { ...stylesToUndo, ...newStyles }); | ||
| Object.assign(this, stylesToUndo, newStyles); | ||
| } | ||
@@ -406,7 +400,7 @@ } | ||
| } | ||
| if (!parent.rendered) { | ||
| if (!parent.lng) { | ||
| console.warn('Parent not rendered yet: ', this); | ||
| return; | ||
| } | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| console.warn('Node already rendered: ', this); | ||
@@ -420,7 +414,8 @@ return; | ||
| } | ||
| node.updateLayout(); | ||
| if (this.states.length) { | ||
| this._stateChanged(); | ||
| } | ||
| let props = node._renderProps; | ||
| const props = node._renderProps; | ||
| props.x = props.x || 0; | ||
| props.y = props.y || 0; | ||
| if (parent.lng) { | ||
@@ -433,12 +428,14 @@ props.parent = parent.lng; | ||
| if (node.isTextNode()) { | ||
| props = { | ||
| ...config.fontSettings, | ||
| ...props, | ||
| text: node.getText(), | ||
| }; | ||
| if (config.fontSettings) { | ||
| for (const key in config.fontSettings) { | ||
| if (props[key] === undefined) { | ||
| props[key] = config.fontSettings[key]; | ||
| } | ||
| } | ||
| } | ||
| props.text = node.getText(); | ||
| if (props.contain) { | ||
| if (!props.width) { | ||
| props.width = | ||
| (parent.width || 0) - (props.x || 0) - (props.marginRight || 0); | ||
| node._width = props.width; | ||
| (parent.width || 0) - props.x - (props.marginRight || 0); | ||
| node._autosized = true; | ||
@@ -448,4 +445,3 @@ } | ||
| props.height = | ||
| (parent.height || 0) - (props.y || 0) - (props.marginBottom || 0); | ||
| node._height = props.height; | ||
| (parent.height || 0) - props.y - (props.marginBottom || 0); | ||
| node._autosized = true; | ||
@@ -456,6 +452,3 @@ } | ||
| node.lng = renderer.createTextNode(props); | ||
| if (isFunc(node.onLoad)) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| if (!node.width || !node.height) { | ||
| if (!props.width || !props.height) { | ||
| node._autosized = true; | ||
@@ -470,9 +463,7 @@ node._resizeOnTextLoad(); | ||
| if (isNaN(props.width)) { | ||
| props.width = (parent.width || 0) - (props.x || 0); | ||
| node._width = props.width; | ||
| props.width = (parent.width || 0) - props.x; | ||
| node._autosized = true; | ||
| } | ||
| if (isNaN(props.height)) { | ||
| props.height = (parent.height || 0) - (props.y || 0); | ||
| node._height = props.height; | ||
| props.height = (parent.height || 0) - props.y; | ||
| node._autosized = true; | ||
@@ -483,3 +474,3 @@ } | ||
| // to set color '#ffffffff' | ||
| node._color = props.color = 0x00000000; | ||
| props.color = 0x00000000; | ||
| } | ||
@@ -489,10 +480,9 @@ } | ||
| node.lng = renderer.createNode(props); | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| } | ||
| node.rendered = true; | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| isFunc(this.onCreate) && this.onCreate.call(this, node); | ||
@@ -508,4 +498,2 @@ node.onEvents.forEach(([name, handler]) => { | ||
| } | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
| if (node.name !== 'text') { | ||
@@ -523,2 +511,4 @@ node.children.forEach((c) => { | ||
| node.autofocus && node.setFocus(); | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
| } | ||
@@ -529,6 +519,5 @@ } | ||
| get() { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightningAnimatable(key, v); | ||
@@ -541,6 +530,5 @@ }, | ||
| get() { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightning(key, v); | ||
@@ -547,0 +535,0 @@ }, |
@@ -30,3 +30,2 @@ /* eslint-disable @typescript-eslint/unbound-method */ | ||
| rootNode.lng = renderer.root; | ||
| rootNode.rendered = true; | ||
| // @ts-expect-error - code is jsx element and not SolidElement yet | ||
@@ -33,0 +32,0 @@ const dispose = solidRenderer.render(code, rootNode); |
@@ -43,3 +43,3 @@ /* | ||
| if (node instanceof ElementNode) { | ||
| parent.rendered && node.render(); | ||
| parent.lng && node.render(); | ||
| } | ||
@@ -46,0 +46,0 @@ else if (parent.isTextNode()) { |
@@ -37,4 +37,3 @@ import { createShader } from '../lightningInit.js'; | ||
| selected?: number; | ||
| rendered: boolean; | ||
| autofocus: boolean; | ||
| autofocus?: boolean; | ||
| flexItem?: boolean; | ||
@@ -54,5 +53,2 @@ flexOrder?: number; | ||
| private _animationSettings?; | ||
| private _width?; | ||
| private _height?; | ||
| private _color?; | ||
| _borderRadius?: number; | ||
@@ -59,0 +55,0 @@ _border?: BorderStyleObject; |
| { | ||
| "name": "@lightningjs/solid", | ||
| "version": "0.15.4", | ||
| "version": "0.15.5", | ||
| "description": "Lightning renderer for solid universal", | ||
@@ -5,0 +5,0 @@ "type": "module", |
@@ -13,2 +13,6 @@ <p> | ||
| ## Demo App | ||
| [Solid TMDB Demo App](https://github.com/lightning-js/solid-demo-app) | ||
| ## Playground | ||
@@ -15,0 +19,0 @@ |
@@ -183,4 +183,3 @@ /* | ||
| selected?: number; | ||
| rendered: boolean; | ||
| autofocus: boolean; | ||
| autofocus?: boolean; | ||
| flexItem?: boolean; | ||
@@ -205,5 +204,2 @@ flexOrder?: number; | ||
| private _animationSettings?: Partial<AnimationSettings>; | ||
| private _width?: number; | ||
| private _height?: number; | ||
| private _color?: number | string; | ||
| public _borderRadius?: number; | ||
@@ -228,5 +224,3 @@ public _border?: BorderStyleObject; | ||
| this.name = name; | ||
| this.rendered = false; | ||
| this.autofocus = false; | ||
| this._renderProps = { x: 0, y: 0 }; | ||
| this._renderProps = {}; | ||
| this.children = new Children(this); | ||
@@ -241,3 +235,3 @@ } | ||
| this._effects = v; | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this.shader = convertEffectsToShader(v); | ||
@@ -253,3 +247,3 @@ } | ||
| this._parent = p; | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| this.lng.parent = p?.lng ?? null; | ||
@@ -294,3 +288,3 @@ } | ||
| _sendToLightning(name: string, value: unknown) { | ||
| if (this.rendered && this.lng) { | ||
| if (this.lng) { | ||
| (this.lng[name as keyof INodeWritableProps] as unknown) = value; | ||
@@ -344,3 +338,3 @@ } else { | ||
| setFocus() { | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| // can be 0 | ||
@@ -446,3 +440,3 @@ if (this.forwardFocus !== undefined) { | ||
| this._states = new States(this._stateChanged.bind(this), states); | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| this._stateChanged(); | ||
@@ -519,3 +513,3 @@ } | ||
| // Apply the styles | ||
| Object.assign(this, { ...stylesToUndo, ...newStyles }); | ||
| Object.assign(this, stylesToUndo, newStyles); | ||
| } | ||
@@ -534,3 +528,3 @@ } | ||
| if (!parent.rendered) { | ||
| if (!parent.lng) { | ||
| console.warn('Parent not rendered yet: ', this); | ||
@@ -540,3 +534,3 @@ return; | ||
| if (this.rendered) { | ||
| if (this.lng) { | ||
| console.warn('Node already rendered: ', this); | ||
@@ -552,4 +546,2 @@ return; | ||
| node.updateLayout(); | ||
| if (this.states.length) { | ||
@@ -559,3 +551,5 @@ this._stateChanged(); | ||
| let props = node._renderProps as IntrinsicNodeProps | IntrinsicTextProps; | ||
| const props = node._renderProps as IntrinsicNodeProps | IntrinsicTextProps; | ||
| props.x = props.x || 0; | ||
| props.y = props.y || 0; | ||
@@ -571,7 +565,10 @@ if (parent.lng) { | ||
| if (node.isTextNode()) { | ||
| props = { | ||
| ...config.fontSettings, | ||
| ...props, | ||
| text: node.getText(), | ||
| }; | ||
| if (config.fontSettings) { | ||
| for (const key in config.fontSettings) { | ||
| if (props[key] === undefined) { | ||
| props[key] = config.fontSettings[key]; | ||
| } | ||
| } | ||
| } | ||
| props.text = node.getText(); | ||
@@ -581,4 +578,3 @@ if (props.contain) { | ||
| props.width = | ||
| (parent.width || 0) - (props.x || 0) - (props.marginRight || 0); | ||
| node._width = props.width; | ||
| (parent.width || 0) - props.x - (props.marginRight || 0); | ||
| node._autosized = true; | ||
@@ -589,4 +585,3 @@ } | ||
| props.height = | ||
| (parent.height || 0) - (props.y || 0) - (props.marginBottom || 0); | ||
| node._height = props.height; | ||
| (parent.height || 0) - props.y - (props.marginBottom || 0); | ||
| node._autosized = true; | ||
@@ -599,7 +594,3 @@ } | ||
| if (isFunc(node.onLoad)) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| if (!node.width || !node.height) { | ||
| if (!props.width || !props.height) { | ||
| node._autosized = true; | ||
@@ -613,4 +604,3 @@ node._resizeOnTextLoad(); | ||
| if (isNaN(props.width as number)) { | ||
| props.width = (parent.width || 0) - (props.x || 0); | ||
| node._width = props.width; | ||
| props.width = (parent.width || 0) - props.x; | ||
| node._autosized = true; | ||
@@ -620,4 +610,3 @@ } | ||
| if (isNaN(props.height as number)) { | ||
| props.height = (parent.height || 0) - (props.y || 0); | ||
| node._height = props.height; | ||
| props.height = (parent.height || 0) - props.y; | ||
| node._autosized = true; | ||
@@ -629,3 +618,3 @@ } | ||
| // to set color '#ffffffff' | ||
| node._color = props.color = 0x00000000; | ||
| props.color = 0x00000000; | ||
| } | ||
@@ -636,13 +625,12 @@ } | ||
| node.lng = renderer.createNode(props); | ||
| } | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onFail) { | ||
| node.lng.on('failed', node.onFail); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| if (node.onLoad) { | ||
| node.lng.on('loaded', node.onLoad); | ||
| } | ||
| node.rendered = true; | ||
| isFunc(this.onCreate) && this.onCreate.call(this, node); | ||
@@ -660,4 +648,2 @@ | ||
| } | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
@@ -676,2 +662,4 @@ if (node.name !== 'text') { | ||
| node.autofocus && node.setFocus(); | ||
| // clean up after first render; | ||
| delete this._renderProps; | ||
| } | ||
@@ -683,6 +671,5 @@ } | ||
| get(): number { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v: number) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightningAnimatable(key, v); | ||
@@ -696,6 +683,5 @@ }, | ||
| get() { | ||
| return (this.lng && this.lng[key]) ?? this[`_${key}`]; | ||
| return this.lng ? this.lng[key] : this._renderProps[key]; | ||
| }, | ||
| set(v) { | ||
| this[`_${key}`] = v; | ||
| this._sendToLightning(key, v); | ||
@@ -702,0 +688,0 @@ }, |
@@ -36,3 +36,2 @@ /* eslint-disable @typescript-eslint/unbound-method */ | ||
| rootNode.lng = renderer.root!; | ||
| rootNode.rendered = true; | ||
| // @ts-expect-error - code is jsx element and not SolidElement yet | ||
@@ -39,0 +38,0 @@ const dispose = solidRenderer.render(code, rootNode); |
@@ -51,3 +51,3 @@ /* | ||
| if (node instanceof ElementNode) { | ||
| parent.rendered && node.render(); | ||
| parent.lng && node.render(); | ||
| } else if (parent.isTextNode()) { | ||
@@ -54,0 +54,0 @@ // TextNodes can be placed outside of <text> nodes when <Show> is used as placeholder |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Number of lines in readme file
- increased by9.76%
45
Worsened metrics
- Total package byte prevSize
- decreased by-0.94%
268300
- Lines of code
- decreased by-1.01%
4420