@blitzui/core - npm Package Compare versions

Comparing version 1.1.1 to 2.0.0

dist/index.d.ts

 /// <reference types="react" />
-import IComponentPool from "./Interfaces/IComponentPool";
-import IBehaviourPool from "./Interfaces/IBehaviourPool";
-declare function blitz(components: IComponentPool, behaviours: IBehaviourPool): (config: any[]) => JSX.Element;
-export { IComponentPool, IBehaviourPool };
+import { Component, ActionPool, ComponentPool } from "./types";
+declare function blitz(components: ComponentPool, actions: ActionPool): (config: Component[]) => JSX.Element;
+export { ActionPool, ComponentPool };
 export default blitz;

dist/index.js

@@ -6,8 +6,8 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const ComponentFactory_1 = __importDefault(require("./Classes/ComponentFactory"));
-const BehaviourFactory_1 = __importDefault(require("./Classes/BehaviourFactory"));
-const Page_1 = __importDefault(require("./Classes/Page"));
-function blitz(components, behaviours) {
+const ComponentFactory_1 = __importDefault(require("./ComponentFactory"));
+const ActionFactory_1 = __importDefault(require("./ActionFactory"));
+const Page_1 = __importDefault(require("./Page"));
+function blitz(components, actions) {
     const componentFactory = new ComponentFactory_1.default(components);
-    const behaviourFactory = new BehaviourFactory_1.default(behaviours);
+    const behaviourFactory = new ActionFactory_1.default(actions);
     const page = new Page_1.default(behaviourFactory, componentFactory);
@@ -14,0 +14,0 @@ return (config) => page.setConfig(config).render();

package.json

 {
   "name": "@blitzui/core",
-  "version": "1.1.1",
+  "version": "2.0.0",
   "description": "Tool for generating dynamic website content",
@@ -11,6 +11,6 @@ "main": "dist/index.js",
   "devDependencies": {
-    "react": "^18.2.0",
     "@types/react": "^18.0.26",
     "jest": "^29.3.1",
-    "typescript": "^4.9.4"
+    "react": "^18.2.0",
+    "typescript": "^4.9.5"
   },
@@ -20,3 +20,2 @@ "peerDependencies": {
   },
-  "dependencies": {},
   "scripts": {
@@ -23,0 +22,0 @@ "test": "echo \"Error: no test specified\" && exit 1"

README.md

 # Intro
-**Blitzui** is a tool for dynamically generating a website using already existing components and Behaviours, giving the possibility to compose your application and change it on demand without having to re-build
 
-In the context of Blitzui, we have to main concepts.
+**Blitzui** is a tool for dynamically generating a website using already existing components and actions, giving the possibility to compose your application and change it on demand without having to re-build
+
+In the context of Blitzui, we have two main concepts.
+
 - Components
-- Behaviours
+- Actions
 - Component Pool
-- Behaviour Pool
+- Action Pool
 
-**Components**: Are UI components including React components meant to be reused, the components is what we are going to use to "generate" the ui.
+**Components**: Are UI components including React components meant to be reused, the components are what we are going to use to "generate" the UI.
 
-**Behaviours**: Are functions we can pass to components as props, the idea of behaviours is to add functionality to the UI.
+**actions**: are functions we can pass to components as props, the idea of actions is to add functionality to the UI.
 
-**Component Pools**: Is where we register our components and pass it to the Blitz main function.
+**Component Pools**: Is where we register our components and pass them to the Blitz main function.
 
-**Behaviour Pool**: Is where we register our behaviours to pass it down to the Blitz main function.
+**Action Pool**: Is where we register our actions to pass them down to the Blitz main function.
 
+By combining **Components** and **actions**, we can compose our UI and reuse it. This is very useful when having to create applications like a CMS or to generate dynamic reports with interactivity.
 
-By combining **Components** and **Behaviours**, we can compose our UI and reuse. This is very useful when having to create applications like a CMS or to generate dynamic reports with interactivity.
-
 # Basic Example
-- visit : https://blitzui.com/ for a demo page
-- repo : https://github.com/isan26/blitz-demo
 
+```
+import Blitz from '@blitzui/core'
 
-## First steps.
+// Component Pool
+const components = {
+  "default": {
+    "button": ({ onClick, text }) => <button onClick={onClick}>{text}</button>
+  }
+}
 
+
+// Actions Pool
+const actions = {
+  default: {
+    onClick: (e) => {
+      console.log(e)
+      alert('Hello World')
+    }
+  }
+}
+
+
+const page = [ // Most be an array
+  {
+    component: "h1", // HTML tags can be used
+    children: "Welcome to Blitz"
+  },
+  {
+    component: "default.button",
+    props: {
+      onClick: {
+        action: "default.onClick",
+      },
+      text: "Click me"
+    },
+  }
+]
+
+function App() {
+  const blitz = Blitz(components, actions)
+
+  return (
+    <>
+      {blitz(page)}
+    </>
+  )
+}
+
+export default App
+
+
+```
+
+- visit : <https://blitzui.com/> for a demo page
+- repo : <https://github.com/isan26/blitz-demo>
+
+## First steps
+
 Let's create a component and a simple component Pool.
-A component Pool is a big object representing a Tree like structure, this tree structure will be used when creating the JSON with the UI instructions.
+A component Pool is a big object representing a Tree-like structure, this tree structure will be used when creating the JSON with the UI instructions.
 
@@ -34,3 +88,3 @@ On a newly created react app:
 1. Create a folder named `components` on `src` folder
-1. Create a index.js file
+1. Create an index.js file
 1. Create a TestComponent.js file
@@ -52,3 +106,2 @@ 1. Copy and paste the code above to the files
 
-
 ```
@@ -73,5 +126,5 @@ // Paste on TestComponent.js file
 
-Now that we have ready our basic component pool, let's create the behaviour pool
+Now that we have ready our basic component pool, let's create the action pool
 
-1. Create a folder named `behaviours` on `src` folder
+1. Create a folder named `actions` on `src` folder
 1. Create a file `index.js` inside this folder
@@ -81,3 +134,2 @@ 1. Create a file `textGenerator.js` inside this folder
 
-
 ```
@@ -105,4 +157,3 @@ // Paste into index.js
 
-
-At this point we have the component pool and the behaviour pool, let's bring them together. 
+At this point we have the component pool and the actions pool, let's bring them together.
 Create a file named demo.json and put the following:
@@ -116,3 +167,3 @@
             "textGenerator": {
-                "behaviour": "dummy.textGenerator"
+                "action": "dummy.textGenerator"
             },
@@ -131,5 +182,4 @@ "title": "Title"
 
-This is the configuration file, and what is instructing is to print a `TestComponent` that can be found on the pool by going into `basic.TestComponent`. Pass the prop `textGenerator` which is a `behaviour` that can be found in `dummy.textGenerator` (the Behaviour pool we already defined). Also pass the prop title and as children, print a simple span with some text.
+This is the configuration file, and what is instructing is to print a `TestComponent` that can be found on the pool by going into `basic.TestComponent`. Pass the prop `textGenerator` which is an `action` that can be found in `dummy.textGenerator` (the Actions pool we already defined). Also, pass the prop title and as children, print a simple span with some text.
 
-
 ## Bringing all together
@@ -141,17 +191,16 @@
 1. Import your component Pool
-1. Import you behaviour Pool
+1. Import your actions Pool
 1. Import your demo.json file
-1. Pass your component pool and behaviour pool to the Blitz function and assign the result to a constant (will return a function).
-1. Pass you config file to this function and print the results.
+1. Pass your component pool and actions pool to the Blitz function and assign the result to a constant (will return a function).
+1. Pass your config file to this function and print the results.
 
 See the following code for reference.
 
-
 ```
 import Blitz from '@blitzui/core';
 import components from './components';
-import behaviours from './behaviours';
+import actions from './actions';
 import demo from './demo';
 
-const blitz = Blitz(components, behaviours);
+const blitz = Blitz(components, actions);
 
@@ -171,5 +220,5 @@ function App() {
 
-## Executing Behaviours
-Behaviours can be executed on the spot, meaning you won't pass the function but the value they generate. Check the following example.
+## Executing actions
 
+actions can be executed on the spot, meaning you won't pass the function but the value they generate. Check the following example.
 
@@ -182,4 +231,5 @@ ```
 ```
+
 ```
-//Behaviour Pool
+//action Pool
 import textGenerator from "./textGenerator";
@@ -202,6 +252,6 @@ import titleGenerator from "./titleGenerator";
             "textGenerator": {
-                "behaviour": "dummy.textGenerator"
+                "action": "dummy.textGenerator"
             },
             "title": {
-                "behaviour": "dummy.titleGenerator",
+                "action": "dummy.titleGenerator",
                 "execute": true
@@ -214,3 +264,2 @@ }
 
-
-This will pass the prop `title`, which is the value from executing the `Behaviour` on the spot, and the component will receive the text generated.
+This will pass the prop `title`, which is the value from executing the `action` on the spot, and the component will receive the text generated.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This 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

254

increased by23.9%

Worsened metrics

Total package byte prevSize

15424

decreased by-7.05%

Number of package files

15

decreased by-44.44%

Lines of code

207

decreased by-18.5%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes