@goplasmatic/datalogic-ui 0.1.0 → 0.1.1

package/dist/styles.css

@@ -1899,6 +1899,142 @@ svg.react-flow__connectionline {
 .json-syntax-punctuation {
   color: var(--syntax-punctuation);
 }
+
+/* ============================================
+   Structure Node Styles
+   ============================================ */
+
+.structure-node {
+  background: var(--node-bg) !important;
+  border-radius: 8px;
+  border: 2px solid;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  font-size: 13px;
+  width: fit-content;
+  box-sizing: border-box;
+  box-shadow: 0 2px 6px var(--node-shadow);
+  transition: box-shadow 0.2s, transform 0.1s;
+  min-width: 150px;
+  max-width: 350px;
+  position: relative;
+}
+
+.structure-node:hover {
+  box-shadow: 0 4px 12px var(--node-shadow-hover);
+}
+
+.structure-node.selected {
+  box-shadow: 0 0 0 2px var(--accent-blue), 0 4px 12px var(--node-shadow-hover);
+}
+
+.structure-node-header {
+  padding: 6px 12px;
+  border-radius: 6px 6px 0 0;
+  color: white;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  height: 32px;
+  box-sizing: border-box;
+}
+
+.structure-node-icon {
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+}
+
+.structure-node-label {
+  font-weight: 600;
+  font-size: 14px;
+  letter-spacing: 0.5px;
+  flex: 1;
+}
+
+.structure-node-body {
+  padding: 8px 12px;
+  padding-right: 24px;
+  font-family: 'SF Mono', 'Consolas', monospace;
+  font-size: 12px;
+  white-space: pre;
+  line-height: 18px;
+  overflow-x: auto;
+  max-width: 100%;
+}
+
+.structure-node.collapsed .structure-node-body {
+  white-space: normal;
+}
+
+/* Expression marker - clickable link to expression node */
+.structure-expression-marker {
+  display: inline-flex;
+  align-items: center;
+  background: var(--accent-blue-light);
+  color: var(--accent-blue);
+  padding: 1px 6px;
+  border-radius: 3px;
+  font-size: 11px;
+  font-weight: 500;
+  position: relative;
+}
+
+.structure-expression-marker:hover {
+  background: var(--accent-blue);
+  color: white;
+}
+
+.structure-expression-label {
+  margin-right: 4px;
+}
+
+.structure-expression-handle {
+  width: 8px !important;
+  height: 8px !important;
+  border: 2px solid white !important;
+  min-width: 8px;
+  min-height: 8px;
+}
+
+[data-theme="dark"] .structure-expression-handle {
+  border-color: var(--bg-primary) !important;
+}
+
+/* Branch handles positioned at node level */
+.structure-branch-handle {
+  width: 10px !important;
+  height: 10px !important;
+  border: 2px solid white !important;
+  min-width: 10px;
+  min-height: 10px;
+  position: absolute !important;
+  transform: translateY(-50%) !important;
+}
+
+[data-theme="dark"] .structure-branch-handle {
+  border-color: var(--bg-primary) !important;
+}
+
+/* Debug states for structure node */
+.structure-node.debug-current {
+  box-shadow: 0 0 0 3px var(--debug-current-color),
+              0 0 20px var(--debug-current-glow) !important;
+  animation: debug-pulse 1.5s ease-in-out infinite;
+}
+
+.structure-node.debug-executed {
+  border-color: var(--debug-executed-color) !important;
+  box-shadow: 0 0 0 1px var(--debug-executed-border);
+}
+
+.structure-node.debug-pending {
+  opacity: var(--debug-pending-opacity);
+}
+
+.structure-node.debug-on-path {
+  border-color: var(--debug-current-color) !important;
+  box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.3);
+}
 .logic-editor {
   width: 100%;
   height: 100%;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@goplasmatic/datalogic-ui",
   "private": false,
-  "version": "0.1.0",
+  "version": "0.1.1",
   "type": "module",
   "description": "DataLogic Debugger - Visual JSONLogic Debugger & Editor for debugging and visualizing JSONLogic expressions",
   "keywords": [
@@ -14,10 +14,11 @@
     "react",
     "flow diagram"
   ],
-  "homepage": "https://goplasmatic.github.io/datalogic-ui/",
+  "homepage": "https://goplasmatic.github.io/datalogic-rs/playground/",
   "repository": {
     "type": "git",
-    "url": "https://github.com/GoPlasmatic/datalogic-ui"
+    "url": "https://github.com/GoPlasmatic/datalogic-rs",
+    "directory": "ui"
   },
   "author": "Plasmatic",
   "license": "MIT",
@@ -38,7 +39,12 @@
     "./styles.css": "./dist/styles.css"
   },
   "files": [
-    "dist",
+    "dist/index.js",
+    "dist/index.cjs",
+    "dist/index.d.ts",
+    "dist/styles.css",
+    "dist/datalogic_wasm-*.js",
+    "dist/datalogic_wasm-*.cjs",
     "README.md",
     "LICENSE"
   ],
@@ -49,6 +55,7 @@
     "dev": "vite",
     "build": "tsc -b && vite build",
     "build:lib": "vite build --config vite.lib.config.ts",
+    "build:embed": "vite build --config vite.embed.config.ts",
     "lint": "eslint .",
     "preview": "vite preview",
     "prepublishOnly": "npm run build:lib",
@@ -58,7 +65,7 @@
   },
   "dependencies": {
     "@dagrejs/dagre": "^1.1.8",
-    "@goplasmatic/datalogic": "^4.0.6",
+    "@goplasmatic/datalogic": "workspace:*",
     "lucide-react": "^0.562.0",
     "uuid": "^13.0.0"
   },