@furystack/shades 6.0.4 → 6.0.7

package/dist/shade.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Shade = void 0;
-const utils_1 = require("@furystack/utils");
 const inject_1 = require("@furystack/inject");
 /**
  * Factory method for creating Shade components
@@ -18,12 +17,8 @@ const Shade = (o) => {
             constructor(_props) {
                 super();
                 this.compareState = o.compareState ||
-                    ((oldState, newState) => Object.entries(oldState).some(([key, value]) => value !== newState[key]) ||
+                    (({ oldState, newState }) => Object.entries(oldState).some(([key, value]) => value !== newState[key]) ||
                         Object.entries(newState).some(([key, value]) => value !== oldState[key]));
-                /**
-                 * Will be updated when on children change
-                 */
-                this.shadeChildren = new utils_1.ObservableValue([]);
                 /**
                  * @param options Options for rendering the component
                  * @returns the JSX element
@@ -33,30 +28,42 @@ const Shade = (o) => {
                  * @returns values for the current render options
                  */
                 this.getRenderOptions = () => {
-                    const props = this.props.getValue() || {};
-                    const getState = () => this.state.getValue();
+                    const props = { ...this.props };
+                    const getState = () => ({ ...this.state });
                     const updateState = (stateChanges, skipRender) => {
-                        const currentState = this.state.getValue();
-                        const newState = { ...currentState, ...stateChanges };
-                        if (this.compareState(currentState, newState)) {
-                            this.state.setValue(newState);
-                            !skipRender && this.updateComponent();
+                        const oldState = { ...this.state };
+                        const newState = { ...oldState, ...stateChanges };
+                        this.state = newState;
+                        if (!skipRender &&
+                            this.compareState({
+                                oldState,
+                                newState,
+                                props,
+                                element: this,
+                                injector: this.injector,
+                            })) {
+                            this.updateComponent();
                         }
                     };
                     const returnValue = {
-                        props,
-                        getState,
-                        injector: this.injector,
-                        updateState,
-                        children: this.shadeChildren.getValue(),
-                        element: this,
+                        ...{
+                            props,
+                            injector: this.injector,
+                            children: this.shadeChildren,
+                            element: this,
+                        },
+                        ...(o.getInitialState
+                            ? {
+                                getState,
+                                updateState,
+                            }
+                            : {}),
                     };
                     return returnValue;
                 };
                 this.cleanup = undefined;
                 this.resources = [];
-                this.props = new utils_1.ObservableValue();
-                this.state = new utils_1.ObservableValue();
+                this.props = _props;
             }
             connectedCallback() {
                 o.onAttach && o.onAttach(this.getRenderOptions());
@@ -66,19 +73,18 @@ const Shade = (o) => {
                 o.onDetach && o.onDetach(this.getRenderOptions());
                 Object.values(this.resources).forEach((s) => s.dispose());
                 this.cleanup && this.cleanup();
-                this.shadeChildren.dispose();
-                this.props.dispose();
-                this.state.dispose();
             }
             createResources() {
-                var _a;
-                this.resources.push(...(((_a = o.resources) === null || _a === void 0 ? void 0 : _a.call(o, this.getRenderOptions())) || []));
+                this.resources.push(...(o.resources?.(this.getRenderOptions()) || []));
             }
             /**
              * Updates the component in the DOM.
              */
             updateComponent() {
                 const renderResult = this.render(this.getRenderOptions());
+                if (renderResult === null) {
+                    this.innerHTML = '';
+                }
                 if (typeof renderResult === 'string') {
                     this.innerHTML = renderResult;
                 }
@@ -98,12 +104,9 @@ const Shade = (o) => {
              * Finialize the component initialization after it gets the Props. Called by the framework internally
              */
             callConstructed() {
-                if (this.props.isDisposed) {
-                    return;
-                }
                 ;
                 o.getInitialState &&
-                    this.state.setValue(o.getInitialState({ props: this.props.getValue(), injector: this.injector }));
+                    (this.state = o.getInitialState({ props: { ...this.props }, injector: this.injector }));
                 this.updateComponent();
                 this.createResources();
                 const cleanupResult = o.constructed && o.constructed(this.getRenderOptions());
@@ -125,15 +128,14 @@ const Shade = (o) => {
                 }
             }
             get injector() {
-                var _a, _b;
                 if (this._injector) {
                     return this._injector;
                 }
-                const fromState = (_a = this.state.getValue()) === null || _a === void 0 ? void 0 : _a.injector;
+                const fromState = this.state?.injector;
                 if (fromState && fromState instanceof inject_1.Injector) {
                     return fromState;
                 }
-                const fromProps = (_b = this.props.getValue()) === null || _b === void 0 ? void 0 : _b.injector;
+                const fromProps = this.props?.injector;
                 if (fromProps && fromProps instanceof inject_1.Injector) {
                     return fromProps;
                 }
@@ -157,8 +159,8 @@ const Shade = (o) => {
         const el = document.createElement(customElementName, {
             ...props,
         });
-        el.props.setValue(props);
-        el.shadeChildren.setValue(children);
+        el.props = props;
+        el.shadeChildren = children;
         return el;
     };
 };

package/dist/shade.js.map

@@ -1 +1 @@
-{"version":3,"file":"shade.js","sourceRoot":"","sources":["../src/shade.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"shade.js","sourceRoot":"","sources":["../src/shade.ts"],"names":[],"mappings":"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"}

package/dist/shades.integration.spec.js

@@ -21,6 +21,81 @@ describe('Shades integration tests', () => {
         });
         expect(document.body.innerHTML).toBe('<div id="root"><shades-example><div>Hello</div></shades-example></div>');
     });
+    it('Should mount a custom component with a string render result', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const ExampleComponent = (0, shade_1.Shade)({ render: () => 'Hello', shadowDomName: 'shades-string-render-result' });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
+        });
+        expect(document.body.innerHTML).toBe('<div id="root"><shades-string-render-result>Hello</shades-string-render-result></div>');
+    });
+    it('Should mount a custom component with null render result', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const ExampleComponent = (0, shade_1.Shade)({ render: () => null, shadowDomName: 'shades-null-render-result' });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
+        });
+        expect(document.body.innerHTML).toBe('<div id="root"><shades-null-render-result></shades-null-render-result></div>');
+    });
+    it('Should mount a custom component with a document fragment render result', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const ExampleComponent = (0, shade_1.Shade)({
+            render: () => ((0, shade_component_1.createComponent)(shade_component_1.createFragment, null,
+                (0, shade_component_1.createComponent)("p", null, "1"),
+                (0, shade_component_1.createComponent)("p", null, "2"))),
+            shadowDomName: 'shades-fragment-render-result',
+        });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
+        });
+        expect(document.body.innerHTML).toBe('<div id="root"><shades-fragment-render-result><p>1</p><p>2</p></shades-fragment-render-result></div>');
+    });
+    it('Should mount a custom component with a nested document fragment render result', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const ExampleComponent = (0, shade_1.Shade)({
+            render: () => ((0, shade_component_1.createComponent)("p", null,
+                (0, shade_component_1.createComponent)(shade_component_1.createFragment, null,
+                    (0, shade_component_1.createComponent)("p", null, "1"),
+                    (0, shade_component_1.createComponent)("p", null, "2")))),
+            shadowDomName: 'shades-fragment-render-result-nested',
+        });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
+        });
+        expect(document.body.innerHTML).toBe('<div id="root"><shades-fragment-render-result-nested><p><p>1</p><p>2</p></p></shades-fragment-render-result-nested></div>');
+    });
+    it('Should mount a custom component with a document fragment that contains custom components', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const CustomComponent = (0, shade_1.Shade)({
+            shadowDomName: 'shades-fragment-test-custom-component',
+            render: () => (0, shade_component_1.createComponent)("p", null, "Hello"),
+        });
+        const ExampleComponent = (0, shade_1.Shade)({
+            render: () => ((0, shade_component_1.createComponent)(shade_component_1.createFragment, null,
+                (0, shade_component_1.createComponent)(CustomComponent, null),
+                (0, shade_component_1.createComponent)(CustomComponent, null))),
+            shadowDomName: 'shades-fragment-render-result-2',
+        });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
+        });
+        expect(document.body.innerHTML).toBe('<div id="root"><shades-fragment-render-result-2><shades-fragment-test-custom-component><p>Hello</p></shades-fragment-test-custom-component><shades-fragment-test-custom-component><p>Hello</p></shades-fragment-test-custom-component></shades-fragment-render-result-2></div>');
+    });
     it('Should mount nested Shades components', () => {
         const injector = new inject_1.Injector();
         const rootElement = document.getElementById('root');
@@ -103,16 +178,64 @@ describe('Shades integration tests', () => {
             rootElement,
             jsxElement: (0, shade_component_1.createComponent)(ExampleComponent, null),
         });
-        const plus = () => { var _a; return (_a = document.getElementById('plus')) === null || _a === void 0 ? void 0 : _a.click(); };
-        const minus = () => { var _a; return (_a = document.getElementById('minus')) === null || _a === void 0 ? void 0 : _a.click(); };
-        expect(document.body.innerHTML).toContain('Count is 0');
+        const plus = () => document.getElementById('plus')?.click();
+        const minus = () => document.getElementById('minus')?.click();
+        const expectCount = (count) => expect(document.body.innerHTML).toContain(`Count is ${count}`);
+        expectCount(0);
         plus();
-        expect(document.body.innerHTML).toContain('Count is 1');
+        expectCount(1);
         plus();
-        expect(document.body.innerHTML).toContain('Count is 2');
+        expectCount(2);
         minus();
         minus();
-        expect(document.body.innerHTML).toContain('Count is 0');
+        expectCount(0);
+    });
+    it('Should allow children update after unmount and remount', () => {
+        const injector = new inject_1.Injector();
+        const rootElement = document.getElementById('root');
+        const Parent = (0, shade_1.Shade)({
+            shadowDomName: 'shade-remount-parent',
+            getInitialState: () => ({ areChildrenVisible: true }),
+            render: ({ children, getState, updateState }) => ((0, shade_component_1.createComponent)("div", null,
+                (0, shade_component_1.createComponent)("button", { id: "showHideChildren", onclick: () => {
+                        updateState({ areChildrenVisible: !getState().areChildrenVisible });
+                    } }, "Toggle"),
+                getState().areChildrenVisible ? children : (0, shade_component_1.createComponent)("div", null))),
+        });
+        const Child = (0, shade_1.Shade)({
+            shadowDomName: 'example-remount-child',
+            getInitialState: () => ({ count: 0 }),
+            render: ({ getState, updateState }) => {
+                const { count } = getState();
+                return ((0, shade_component_1.createComponent)("div", null,
+                    "Count is ",
+                    getState().count.toString(),
+                    (0, shade_component_1.createComponent)("button", { id: "plus", onclick: () => updateState({ count: count + 1 }) }, "+"),
+                    (0, shade_component_1.createComponent)("button", { id: "minus", onclick: () => updateState({ count: count - 1 }) }, "-")));
+            },
+        });
+        (0, initialize_1.initializeShadeRoot)({
+            injector,
+            rootElement,
+            jsxElement: ((0, shade_component_1.createComponent)(Parent, null,
+                (0, shade_component_1.createComponent)(Child, null))),
+        });
+        const plus = () => document.getElementById('plus')?.click();
+        const minus = () => document.getElementById('minus')?.click();
+        const expectCount = (count) => expect(document.body.innerHTML).toContain(`Count is ${count}`);
+        const toggleChildren = () => document.getElementById('showHideChildren')?.click();
+        expectCount(0);
+        plus();
+        expectCount(1);
+        toggleChildren();
+        expect(document.getElementById('plus')).toBeNull();
+        toggleChildren();
+        expect(document.getElementById('plus')).toBeDefined();
+        // expectCount(0)
+        plus();
+        expectCount(1);
+        minus();
+        expectCount(0);
     });
 });
 //# sourceMappingURL=shades.integration.spec.js.map

package/dist/shades.integration.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"shades.integration.spec.js","sourceRoot":"","sources":["../src/shades.integration.spec.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"shades.integration.spec.js","sourceRoot":"","sources":["../src/shades.integration.spec.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@furystack/shades",
-  "version": "6.0.4",
+  "version": "6.0.7",
   "description": "Google Authentication Provider for FuryStack",
   "main": "dist/index.js",
   "files": [
@@ -29,18 +29,17 @@
   },
   "homepage": "https://github.com/furystack/furystack",
   "devDependencies": {
-    "@types/jest": "^28.1.6",
+    "@types/jest": "^29.0.0",
     "@types/jsdom": "^20.0.0",
-    "@types/node": "^18.7.1",
+    "@types/node": "^18.7.15",
     "jsdom": "^20.0.0"
   },
   "dependencies": {
-    "@furystack/core": "^11.0.8",
-    "@furystack/inject": "^7.0.2",
-    "@furystack/utils": "^3.0.6",
+    "@furystack/core": "^11.0.11",
+    "@furystack/inject": "^7.0.4",
+    "@furystack/utils": "^3.0.8",
     "path-to-regexp": "^6.2.1",
-    "semaphore-async-await": "^1.5.1",
-    "tslib": "^2.4.0"
+    "semaphore-async-await": "^1.5.1"
   },
   "typings": "./types/index.d.ts",
   "gitHead": "76e1d17a71b981984935c9a7a5791cf61ebf5213"

package/src/component-factory.spec.tsx

@@ -59,9 +59,9 @@ describe('Shades Component Factory', () => {
       )
 
       const shade = component.firstElementChild as JSX.Element
-      expect(shade.props.getValue()).toBe(null)
-      expect(shade.state.getValue()).toBe(undefined)
-      expect(shade.shadeChildren.getValue()).toStrictEqual([])
+      expect(shade.props).toBe(null)
+      expect(shade.state).toBe(undefined)
+      expect(shade.shadeChildren).toStrictEqual([])
     })
 
     it('Should render a component with props', () => {
@@ -80,9 +80,9 @@ describe('Shades Component Factory', () => {
 
       shade.callConstructed()
 
-      expect(shade.props.getValue().foo).toStrictEqual('example')
-      expect(shade.state.getValue()).toBe(undefined)
-      expect(shade.shadeChildren.getValue()).toStrictEqual([])
+      expect(shade.props.foo).toStrictEqual('example')
+      expect(shade.state).toBe(undefined)
+      expect(shade.shadeChildren).toStrictEqual([])
 
       expect(shade.innerHTML).toBe('<div>example</div>')
     })
@@ -102,8 +102,8 @@ describe('Shades Component Factory', () => {
 
       const shade = component.firstElementChild as JSX.Element
       shade.callConstructed()
-      expect(shade.state.getValue()).toStrictEqual({ foo: 'example' })
-      expect(shade.shadeChildren.getValue()).toStrictEqual([])
+      expect(shade.state).toStrictEqual({ foo: 'example' })
+      expect(shade.shadeChildren).toStrictEqual([])
     })
   })
 })

package/src/jsx.ts

@@ -1,4 +1,3 @@
-import { ObservableValue } from '@furystack/utils'
 import { Injector } from '@furystack/inject'
 import { ChildrenList, PartialElement } from './models'
 
@@ -7,10 +6,10 @@ declare global {
   export namespace JSX {
     interface Element<TProps = any, TState = any> extends HTMLElement {
       injector: Injector
-      state: ObservableValue<TState>
-      props: ObservableValue<TProps>
+      state: TState
+      props: TProps
       updateComponent: () => void
-      shadeChildren: ObservableValue<ChildrenList>
+      shadeChildren?: ChildrenList
       callConstructed: () => void
     }
 
@@ -521,8 +520,3 @@ declare global {
     }
   }
 }
-
-export const isJsxElement = (obj: any): obj is JSX.Element => {
-  const casted = obj as JSX.Element
-  return casted.props !== undefined && casted.state !== undefined
-}

package/src/models/partial-element.ts

@@ -1,3 +1,5 @@
-export type PartialElement<T extends { style?: CSSStyleDeclaration }> = Omit<Partial<T>, 'style'> & {
-  style?: Partial<CSSStyleDeclaration>
-}
+export type PartialElement<T> = T extends { style?: CSSStyleDeclaration }
+  ? Omit<Partial<T>, 'style'> & {
+      style?: Partial<CSSStyleDeclaration>
+    }
+  : Partial<T>

package/src/models/render-options.ts

@@ -6,7 +6,7 @@ export type RenderOptions<TProps, TState> = {
   readonly props: TProps
 
   injector: Injector
-  children: ChildrenList
+  children?: ChildrenList
   element: JSX.Element<TProps, TState>
 } & (unknown extends TState
   ? {}

package/src/shade-component.ts

@@ -6,12 +6,12 @@ import { ChildrenList, ShadeComponent, isShadeComponent } from './models'
  * @param el the root element
  * @param children array of items to append
  */
-export const appendChild = (el: HTMLElement, children: ChildrenList) => {
+export const appendChild = (el: HTMLElement | DocumentFragment, children: ChildrenList) => {
   for (const child of children) {
     if (typeof child === 'string') {
       el.appendChild(document.createTextNode(child))
     } else {
-      if (child instanceof HTMLElement) {
+      if (child instanceof HTMLElement || child instanceof DocumentFragment) {
         el.appendChild(child)
       } else if (child instanceof Array) {
         appendChild(el, child)
@@ -70,14 +70,14 @@ export const createComponent = <TProps>(
     }
     return el
   } else if (isShadeComponent(elementType)) {
-    const el = (elementType as ShadeComponent<TProps>)(props, children)
+    const el = elementType(props, children)
     attachStyles(el, props)
     return el
   }
 }
 
-export const createFragment = (_props: any, ...children: [[ShadeComponent[]]]) => {
+export const createFragment = (_props: any, children: ChildrenList) => {
   const fragment = document.createDocumentFragment()
-  fragment.append(...(children[0].flat() as any))
+  appendChild(fragment, children)
   return fragment
 }