nodality 1.0.0-beta.20 → 1.0.0-beta.22

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) [year] [fullname]
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,108 @@
+# nodality
+Simple UI JS library using node-based approach.
+
+## Installation
+
+The easiest way to get up and running is to use **npm**:
+
+```bash
+npm create nodality@latest my-app
+```
+
+---
+
+## Tutorial
+## Step 1
+
+Define an array of elements you want to display in your user interface:
+
+```js
+let elements = [
+  {
+    type: "h1",
+    text: "Hello"
+  }
+];
+```
+
+---
+
+## Step 2
+
+Define an array of nodes that will adjust the behaviour of the element.  
+This particular node will add the **stroked text** effect:
+
+```js
+let nodes = [
+  {
+    op: "blast"
+  }
+];
+```
+
+---
+
+## Step 3
+
+Add the `nodes` array using the `.nodes()` modifier, and use the `.set()` method to mount the result of the code to the website.  
+Use the `code: true` option to also display the source code of the elements:
+
+```js
+new Des()
+  .nodes(nodes)
+  .add(elements)
+  .set({
+    mount: "#mount",
+    code: true
+  });
+```
+
+Also define a `<div>` with `id="#mount"` that will serve as a root element to render the UI.
+
+---
+
+## Everything Together
+
+Here is the complete working code which uses CDN for convenient testing.
+
+```html
+
+<!-- div for mounting the result -->
+<div id="#mount"></div>
+
+<script type="module">
+import {Des} from "https://www.unpkg.com/nodality@1.0.0-beta.4/dist/index.esm.js";
+
+let elements = [
+  {
+    type: "h1",
+    text: "Hello"
+  }
+];
+
+let nodes = [
+  {
+    op: "blast"
+  }
+];
+
+new Des()
+  .nodes(nodes)
+  .add(elements)
+  .set({
+    mount: "#mount",
+    code: true
+  });
+</script>
+```
+
+---
+
+## Result
+<img src="https://nodalityjs.github.io/assets/images/image-2601c982f747c8e3977a2d588f61e040.png">
+
+After running this code:
+
+- You will see an `<h1>` element on the screen.
+- When the user resizes the window and hits the **400–600px** breakpoint, a **stroke effect** will appear on the text, thanks to the `blast` modifier.
+- The **resulting code** of the UI will also be displayed below the rendered element.

package/layout/text.js

@@ -16,7 +16,7 @@ class Text extends Animator {
 		this.html = [];
 		this.react = [];
 		this.code.push(`new Text("${this.text}")`);
-		// this.setRandom();
+		console.log("A");
 	}
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodality",
-  "version": "1.0.0-beta.20",
+  "version": "1.0.0-beta.22",
   "description": "A lightweight library for declarative UI elements.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
@@ -18,7 +18,7 @@
   "scripts": {
     "build": "webpack --config webpack.config.js",
     "test": "jest",
-   "postpublish": "git add . && git commit -m 'release: v$npm_package_version' && git tag v$npm_package_version && git push --force --set-upstream origin main && git push --force origin v$npm_package_version"
+    "postpublish": "git add . && git commit -m \"release: v$npm_package_version\" && git tag v$npm_package_version && git push --set-upstream origin main && git push origin v$npm_package_version"
   },
   "jest": {
     "testEnvironment": "jsdom",