@unsetsoft/ryunixjs 0.4.13-nightly.5 → 0.4.14

package/src/lib/render.ts

@@ -0,0 +1,33 @@
+import { vars } from '../utils/index'
+
+/**
+ * The function renders an element into a container using a work-in-progress root.
+ * @param element - The element parameter is the component or element that needs to be rendered in the
+ * container. It could be a Ryunix component or a DOM element.
+ * @param container - The container parameter is the DOM element where the rendered element will be
+ * appended to. this parameter is optional if you use createRoot().
+ */
+const render = (element, container) => {
+  vars.wipRoot = {
+    dom: vars.containerRoot || container,
+    props: {
+      children: [element],
+    },
+    alternate: vars.currentRoot,
+  }
+  vars.deletions = []
+  vars.nextUnitOfWork = vars.wipRoot
+}
+
+/**
+ * @description The function creates a reference to a DOM element with the specified ID. This will be used to initialize the app.
+ * @example Ryunix.init("root") -> <div id="root" />
+ * @param root - The parameter "root" is the id of the HTML element that will serve as the container
+ * for the root element.
+ */
+const init = (root) => {
+  const rootElement = root || '__ryunix'
+  vars.containerRoot = document.getElementById(rootElement)
+}
+
+export { render, init }

package/src/lib/workers.ts

@@ -0,0 +1,60 @@
+import { commitRoot } from './commits'
+import { updateFunctionComponent, updateHostComponent } from './components'
+import { vars } from '../utils/index'
+
+/**
+ * This function uses requestIdleCallback to perform work on a fiber tree until it is complete or the
+ * browser needs to yield to other tasks.
+ * @param deadline - The `deadline` parameter is an object that represents the amount of time the
+ * browser has to perform work before it needs to handle other tasks. It has a `timeRemaining()` method
+ * that returns the amount of time remaining before the deadline is reached. The `shouldYield` variable
+ * is used to determine
+ */
+const workLoop = (deadline) => {
+  let shouldYield = false
+  while (vars.nextUnitOfWork && !shouldYield) {
+    vars.nextUnitOfWork = performUnitOfWork(vars.nextUnitOfWork)
+    shouldYield = deadline.timeRemaining() < 1
+  }
+
+  if (!vars.nextUnitOfWork && vars.wipRoot) {
+    commitRoot()
+  }
+
+  requestIdleCallback(workLoop)
+}
+
+requestIdleCallback(workLoop)
+
+/**
+ * The function performs a unit of work by updating either a function component or a host component and
+ * returns the next fiber to be processed.
+ * @param fiber - A fiber is a unit of work in Ryunix that represents a component and its state. It
+ * contains information about the component's type, props, and children, as well as pointers to its
+ * parent, child, and sibling fibers. The `performUnitOfWork` function takes a fiber as a parameter and
+ * performs work
+ * @returns The function `performUnitOfWork` returns the next fiber to be processed. If the current
+ * fiber has a child, it returns the child. Otherwise, it looks for the next sibling of the current
+ * fiber. If there are no more siblings, it goes up the tree to the parent and looks for the next
+ * sibling of the parent. The function returns `null` if there are no more fibers to process.
+ */
+const performUnitOfWork = (fiber) => {
+  const isFunctionComponent = fiber.type instanceof Function
+  if (isFunctionComponent) {
+    updateFunctionComponent(fiber)
+  } else {
+    updateHostComponent(fiber)
+  }
+  if (fiber.child) {
+    return fiber.child
+  }
+  let nextFiber = fiber
+  while (nextFiber) {
+    if (nextFiber.sibling) {
+      return nextFiber.sibling
+    }
+    nextFiber = nextFiber.parent
+  }
+}
+
+export { performUnitOfWork, workLoop }

package/src/main.ts

@@ -0,0 +1,12 @@
+import Ryunix from './lib/index.js'
+export {
+  useStore,
+  useEffect,
+  useQuery,
+  Fragments,
+  Navigate,
+  Router,
+  Link,
+} from './lib/index.js'
+
+export default Ryunix

package/src/utils/index.js

@@ -18,9 +18,14 @@ const RYUNIX_TYPES = Object.freeze({
 const STRINGS = Object.freeze({
   object: 'object',
   function: 'function',
+  style: 'ryunix-style',
+  className: 'ryunix-class',
+  children: 'children',
+})
+
+const OLD_STRINGS = Object.freeze({
   style: 'style',
   className: 'className',
-  children: 'children',
 })
 
 const EFFECT_TAGS = Object.freeze({
@@ -29,4 +34,4 @@ const EFFECT_TAGS = Object.freeze({
   DELETION: Symbol(),
 })
 
-export { vars, reg, RYUNIX_TYPES, EFFECT_TAGS, STRINGS }
+export { vars, reg, RYUNIX_TYPES, EFFECT_TAGS, STRINGS, OLD_STRINGS }

package/src/utils/index.ts

@@ -0,0 +1,32 @@
+const vars = Object.freeze({
+  containerRoot: null,
+  nextUnitOfWork: null,
+  currentRoot: null,
+  wipRoot: null,
+  deletions: null,
+  wipFiber: null,
+  hookIndex: null,
+})
+
+const reg = /[A-Z]/g
+
+const RYUNIX_TYPES = Object.freeze({
+  TEXT_ELEMENT: Symbol('text.element'),
+  RYUNIX_EFFECT: Symbol('ryunix.effect'),
+})
+
+const STRINGS = Object.freeze({
+  object: 'object',
+  function: 'function',
+  style: 'style',
+  className: 'className',
+  children: 'children',
+})
+
+const EFFECT_TAGS = Object.freeze({
+  PLACEMENT: Symbol(),
+  UPDATE: Symbol(),
+  DELETION: Symbol(),
+})
+
+export { vars, reg, RYUNIX_TYPES, EFFECT_TAGS, STRINGS }