🚀 Socket Launch Week Day 5:Introducing Repository Access Permissions and Custom Roles.Learn more →

@forge/react

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

@forge/react - npm Package Compare versions

Comparing version

0.0.0-experimental-edeb51b

0.1.0-next.0

+12

src/globals.d.ts

		interface GlobalBridge {
		callBridge(action: 'reconcile', payload: any): Promise<any>;
		__SEMVER: string;
		}

		declare module '@forge/react' {
		global {
		interface Window {
		__bridge: GlobalBridge;
		}
		}
		}

+1

src/index.ts

export { ForgeReconciler as default } from './reconciler';

+219

src/reconciler.ts

		/* eslint-disable @typescript-eslint/no-empty-function */
		import Reconciler, { HostConfig } from 'react-reconciler';
		import { DefaultEventPriority } from 'react-reconciler/constants';
		import { v4 as uuid } from 'uuid';

		type ElementType = string;
		type ElementProps = { [key: string]: any };

		interface ForgeDoc {
		type: string;
		props: { [key: string]: any };
		children: ForgeDoc[];
		key: string;
		}

		// @ts-ignore
		const callBridge = self.__bridge.callBridge;

		const createElement = (type: ElementType, props: ElementProps = {}): ForgeDoc => {
		const { children, ...restProps } = props;
		return {
		type,
		children: [],
		props: restProps,
		key: uuid()
		};
		};

		const appendChild = (parent: ForgeDoc, child: ForgeDoc) => {
		if (parent.children.includes(child)) {
		const removeIndex = parent.children.indexOf(child);
		parent.children.splice(removeIndex, 1);
		}
		parent.children.push(child);
		};

		const insertBefore = (parent: ForgeDoc, child: ForgeDoc, beforeChild: ForgeDoc) => {
		const insertIndex = parent.children.indexOf(beforeChild);
		if (parent.children.includes(child)) {
		const removeIndex = parent.children.indexOf(child);
		parent.children.splice(removeIndex, 1);
		}
		parent.children.splice(insertIndex, 0, child);
		};

		const hostConfig: HostConfig<
		string, // Type
		Record<string, any>, // Props
		ForgeDoc, // Container
		ForgeDoc, // Instance
		ForgeDoc, // TextInstance
		ForgeDoc, // SuspenseInstance
		ForgeDoc, // HydratableInstance
		ForgeDoc, // PublicInstance
		any, // HostContext
		any, // UpdatePayload,
		any, // _ChildSet
		any, // TimeoutHandle
		any // NoTimeout
		> = {
		supportsMutation: true,
		supportsPersistence: false,
		noTimeout: -1,
		isPrimaryRenderer: false,
		supportsHydration: false,

		resetAfterCommit(forgeDoc: ForgeDoc): void {
		callBridge('reconcile', { forgeDoc });
		},

		createInstance(type: ElementType, props: ElementProps) {
		const element = createElement(type, props);
		return element;
		},

		createTextInstance(text: string): ForgeDoc {
		return {
		type: 'String',
		children: [],
		props: {
		text
		},
		key: uuid()
		};
		},

		appendInitialChild(parent: ForgeDoc, child: ForgeDoc): void {
		appendChild(parent, child);
		},

		appendChild(parent: ForgeDoc, child: ForgeDoc): void {
		appendChild(parent, child);
		},

		appendChildToContainer(container: ForgeDoc, child: ForgeDoc): void {
		appendChild(container, child);
		},

		finalizeInitialChildren(): boolean {
		return false;
		},

		prepareUpdate(instance: ForgeDoc, type: ElementType, oldProps: ElementProps, newProps: ElementProps): ElementProps {
		instance.props = newProps;
		return newProps;
		},

		shouldSetTextContent(): boolean {
		return false;
		},

		getRootHostContext() {
		return {};
		},

		getChildHostContext(parentContext, fiberType): null {
		return null;
		},

		getPublicInstance(instance: ForgeDoc): ForgeDoc {
		return instance;
		},

		prepareForCommit(): null {
		return null;
		},

		preparePortalMount(): void {},

		scheduleTimeout(fn: () => void, delay: number): any {
		return setTimeout(fn, delay);
		},

		cancelTimeout(id): void {
		clearTimeout(id);
		},

		insertBefore(parent: ForgeDoc, child: ForgeDoc, beforeChild: ForgeDoc): void {
		insertBefore(parent, child, beforeChild);
		},

		insertInContainerBefore(container: ForgeDoc, child: ForgeDoc, beforeChild: ForgeDoc): void {
		insertBefore(container, child, beforeChild);
		},

		removeChild(parent: ForgeDoc, child: ForgeDoc): void {
		const removeIndex = parent.children.indexOf(child);
		parent.children.splice(removeIndex, 1);
		},

		removeChildFromContainer(container: ForgeDoc, child: ForgeDoc): void {
		const removeIndex = container.children.indexOf(child);
		container.children.splice(removeIndex, 1);
		},

		resetTextContent(): void {},

		commitTextUpdate(textInstance: ForgeDoc, oldText: string, newText: string): void {
		textInstance.props.text = newText;
		},

		commitMount(): void {},

		commitUpdate(): void {},

		hideInstance(): void {},

		hideTextInstance(): void {},

		unhideInstance(): void {},

		unhideTextInstance(): void {},

		clearContainer(): void {},

		detachDeletedInstance(instance: ForgeDoc): void {},

		getCurrentEventPriority() {
		return DefaultEventPriority;
		},

		getInstanceFromNode(): null {
		return null;
		},

		beforeActiveInstanceBlur(): void {},

		afterActiveInstanceBlur(): void {},

		prepareScopeUpdate(): void {},

		getInstanceFromScope(): null {
		return null;
		}
		};

		const reconciler = Reconciler(hostConfig);

		export const ForgeReconciler = {
		render: (element: any): void => {
		const rootElement = createElement('Root');
		const container = reconciler.createContainer(
		rootElement,
		0,
		null,
		false,
		null,
		'root',
		(err: any) => {
		// eslint-disable-next-line no-console
		console.log(err);
		},
		null
		);
		reconciler.updateContainer(element, container, null, null);
		}
		};

		export default ForgeReconciler;

+9

tsconfig.json

		{
		"extends": "../../tsconfig-base.json",
		"compilerOptions": {
		"outDir": "./out",
		"rootDir": "src",
		"composite": true
		},
		"references": []
		}

+3

-4

CHANGELOG.md

		# @forge/react

		## 0.0.0-experimental-edeb51b
		## 0.1.0-next.0
		### Minor Changes

		### Patch Changes

		- 456c10c: Add
		- 71d89a06: Add basic ForgeReconciler implementation

+5

-3

package.json

		{
		"name": "@forge/react",
		"version": "0.0.0-experimental-edeb51b",
		"version": "0.1.0-next.0",
		"description": "Forge React reconciler",
		@@ -15,7 +15,9 @@ "author": "Atlassian",
		"peerDependencies": {
		"react": "^16.13.1"
		"@forge/ui": "1.3.0"
		},
		"dependencies": {
		"react-reconciler": "^0.27.0"
		"@types/react-reconciler": "^0.28.0",
		"react-reconciler": "^0.28.0",
		"uuid": "^3.4.0"
		}
		}

-1

out/index.d.ts

export * from './reconciler';

-14

out/index.js

		"use strict";
		var __createBinding = (this && this.__createBinding) \|\| (Object.create ? (function(o, m, k, k2) {
		if (k2 === undefined) k2 = k;
		Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
		}) : (function(o, m, k, k2) {
		if (k2 === undefined) k2 = k;
		o[k2] = m[k];
		}));
		var __exportStar = (this && this.__exportStar) \|\| function(m, exports) {
		for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
		};
		Object.defineProperty(exports, "__esModule", { value: true });
		__exportStar(require("./reconciler"), exports);
		//# sourceMappingURL=index.js.map

-1

out/index.js.map

{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,+CAA6B"}

-2

out/reconciler.d.ts

		import React from 'react';
		export declare const render: (component: React.ReactNode) => void;

-172

out/reconciler.js

		"use strict";
		var __assign = (this && this.__assign) \|\| function () {
		__assign = Object.assign \|\| function(t) {
		for (var s, i = 1, n = arguments.length; i < n; i++) {
		s = arguments[i];
		for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
		t[p] = s[p];
		}
		return t;
		};
		return __assign.apply(this, arguments);
		};
		var __importDefault = (this && this.__importDefault) \|\| function (mod) {
		return (mod && mod.__esModule) ? mod : { "default": mod };
		};
		Object.defineProperty(exports, "__esModule", { value: true });
		exports.render = void 0;
		var react_reconciler_1 = __importDefault(require("react-reconciler"));
		var debug = false;
		var assignNextPropsToElement = function (element, props) {
		element.props = props;
		delete element.props.children;
		};
		var createStringNode = function (text) {
		return {
		type: 'String',
		children: [],
		operators: {},
		props: {
		text: text
		}
		};
		};
		var createElement = function (type, props) {
		if (props === void 0) { props = {}; }
		var element = {
		type: type,
		children: [],
		props: props,
		operators: {}
		};
		assignNextPropsToElement(element, props);
		var appendChild = function (child) {
		element.children.push(child);
		};
		var removeChild = function (child) {
		element.children.splice(element.children.indexOf(child), 1);
		};
		var insertBeforeChild = function (child, beforeChild) {
		element.children.splice(element.children.indexOf(beforeChild), 0, child);
		};
		Object.assign(element, {
		operators: {
		appendChild: appendChild,
		removeChild: removeChild,
		insertBeforeChild: insertBeforeChild
		}
		});
		return element;
		};
		var hostConfig = {
		supportsMutation: true,
		supportsMicrotask: true,
		noTimeout: -1,
		isPrimaryRenderer: false,
		resetAfterCommit: function (containerInfo) {
		// eslint-disable-next-line no-console
		if (debug)
		console.log('in resetAfterCommit');
		// eslint-disable-next-line no-console
		if (debug)
		console.log({ containerInfo: containerInfo });
		var newTree = __assign({}, containerInfo);
		var traverse = function (children) {
		return children.map(function (element) {
		return __assign(__assign({}, element), { operators: undefined, children: traverse(element.children) });
		});
		};
		newTree.children = traverse(containerInfo.children);
		self.dispatch(newTree);
		},
		createInstance: function (type, props) {
		var element = createElement(type, props);
		return element;
		},
		createTextInstance: function (text) {
		return createStringNode(text);
		},
		appendInitialChild: function (parentInstance, child) {
		parentInstance.operators.appendChild(child);
		},
		appendChild: function (parentInstance, child) {
		return parentInstance.operators.appendChild(child);
		},
		appendChildToContainer: function (container, child) {
		return container.operators.appendChild(child);
		},
		finalizeInitialChildren: function () {
		return false;
		},
		prepareUpdate: function (instance, type, oldProps, newProps) {
		return Object.assign(instance.props, newProps);
		},
		shouldSetTextContent: function () {
		return false;
		},
		getRootHostContext: function () {
		return null;
		},
		getChildHostContext: function () {
		return null;
		},
		getPublicInstance: function () {
		return null;
		},
		prepareForCommit: function () {
		return null;
		},
		preparePortalMount: function () { },
		now: function () {
		// eslint-disable-next-line no-console
		if (debug)
		console.log('in now');
		return 0;
		},
		scheduleTimeout: function (fn, delay) {
		return setTimeout(fn, delay);
		},
		scheduleMicrotask: function (fn) {
		return setTimeout(fn, 0);
		},
		cancelTimeout: function (id) {
		// eslint-disable-next-line no-console
		if (debug)
		console.log('in cancelTimeout');
		// eslint-disable-next-line no-console
		if (debug)
		console.log({ id: id });
		clearTimeout(id);
		},
		insertBefore: function (parentInstance, child, beforeChild) {
		return parentInstance.operators.insertBeforeChild(child, beforeChild);
		},
		insertInContainerBefore: function (container, child, beforeChild) {
		return container.operators.insertBeforeChild(child, beforeChild);
		},
		removeChild: function (parentInstance, child) {
		return parentInstance.operators.removeChild(child);
		},
		removeChildFromContainer: function (container, child) {
		return container.operators.removeChild(child);
		},
		resetTextContent: function () { },
		commitTextUpdate: function (textInstance, oldText, newText) {
		textInstance.props.text = newText;
		},
		commitMount: function () { },
		commitUpdate: function () { },
		hideInstance: function () { },
		hideTextInstance: function () { },
		unhideInstance: function () { },
		unhideTextInstance: function () { },
		clearContainer: function () { },
		detachDeletedInstance: function () { }
		};
		var reconciler = react_reconciler_1.default(hostConfig);
		exports.render = function (component) {
		var container = createElement('View');
		var root = reconciler.createContainer(container, 0, false, null);
		reconciler.updateContainer(component, root, null);
		};
		//# sourceMappingURL=reconciler.js.map

-1

out/reconciler.js.map

-1

README.md

# Forge React Reconciler

@forge/react - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics

Dependency changes