exodeui 6.3.45 → 6.3.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +26 -10
- package/dist/index.js +34 -34
- package/dist/index.mjs +3457 -3395
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -45,14 +45,18 @@ function App() {
|
|
|
45
45
|
|
|
46
46
|
## Features
|
|
47
47
|
|
|
48
|
-
### 1. State
|
|
49
|
-
ExodeUI supports complex interactive logic using a node-based **State Machine**.
|
|
50
|
-
- **
|
|
51
|
-
- **
|
|
52
|
-
- **
|
|
53
|
-
|
|
48
|
+
### 1. State Variables & Logic
|
|
49
|
+
ExodeUI supports complex interactive logic using a node-based **State Machine**. At the core of this logic are **State Variables** (Inputs). ExodeUI supports several types of state variables:
|
|
50
|
+
- **Boolean**: Simple `true` / `false` switches.
|
|
51
|
+
- **Number**: Float or integer values (e.g. 0 to 100).
|
|
52
|
+
- **Trigger**: Momentary pulses that auto-reset (e.g. for "Jump" or "Click").
|
|
53
|
+
- **Array**: Arrays of numbers or strings (e.g. for charts or list data).
|
|
54
|
+
- **Random Number / Random Color**: Engine-managed variables that dynamically evaluate based on seeds and time.
|
|
55
|
+
|
|
56
|
+
#### Setting State Variables
|
|
57
|
+
You can update variables to drive animations and logic from your React code:
|
|
54
58
|
```tsx
|
|
55
|
-
const
|
|
59
|
+
const { setEngine, setInputBool, fireTrigger, setInputNumberArray } = useExodeUI();
|
|
56
60
|
|
|
57
61
|
// ... inside your component
|
|
58
62
|
<ExodeUICanvas
|
|
@@ -60,9 +64,21 @@ const [engine, setEngine] = useState<ExodeUIEngine | null>(null);
|
|
|
60
64
|
onReady={setEngine}
|
|
61
65
|
/>
|
|
62
66
|
|
|
63
|
-
//
|
|
64
|
-
<button onClick={() =>
|
|
65
|
-
<button onClick={() =>
|
|
67
|
+
// Setting values
|
|
68
|
+
<button onClick={() => setInputBool('IsRunning', true)}>Run</button>
|
|
69
|
+
<button onClick={() => fireTrigger('Jump')}>Jump</button>
|
|
70
|
+
<button onClick={() => setInputNumberArray('ChartData', [10, 20, 30])}>Update Chart</button>
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
#### Reading State Variables
|
|
74
|
+
You can also read the current value of any state variable at runtime using `getInputValue()`. This works for standard variables you set, as well as dynamic ones like Random Number and Random Color evaluated internally by the engine:
|
|
75
|
+
```tsx
|
|
76
|
+
const { getInputValue } = useExodeUI();
|
|
77
|
+
|
|
78
|
+
// Read a boolean, number, array, or dynamically generated variable
|
|
79
|
+
const isRunning = getInputValue('IsRunning');
|
|
80
|
+
const randomVal = getInputValue('MyRandomNumber'); // Read engine-managed random value
|
|
81
|
+
console.log(`Running: ${isRunning}, Random: ${randomVal}`);
|
|
66
82
|
```
|
|
67
83
|
|
|
68
84
|
### 2. Physics Engine
|