@hlang-tech/editor-ui 0.2.2 → 0.4.0
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/lib/edges/FlowEdge.css +55 -0
- package/lib/index.d.mts +510 -28
- package/lib/index.d.ts +510 -28
- package/lib/index.js +1549 -382
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +1487 -356
- package/lib/index.mjs.map +1 -1
- package/lib/live/LivePulse.css +21 -0
- package/lib/nodes/AssetNode.css +9 -7
- package/lib/nodes/HlangNode.css +9 -7
- package/lib/nodes/PillNode.css +9 -7
- package/lib/panels/InspectorPanel.css +59 -0
- package/lib/panels/ParamForm.css +11 -0
- package/lib/panels/RunLog.css +175 -0
- package/lib/shell/EditorShell.css +82 -0
- package/lib/styles.css +2 -0
- package/package.json +13 -12
package/lib/edges/FlowEdge.css
CHANGED
|
@@ -78,3 +78,58 @@
|
|
|
78
78
|
box-shadow: var(--hl-glass-edge), 0 2px 8px -3px rgba(0, 0, 0, 0.6);
|
|
79
79
|
white-space: nowrap;
|
|
80
80
|
}
|
|
81
|
+
|
|
82
|
+
/* One flash per message the edge carried (see FlowEdge), fading out. */
|
|
83
|
+
.hl-edge-pulse {
|
|
84
|
+
fill: none;
|
|
85
|
+
stroke: var(--hl-spark);
|
|
86
|
+
stroke-width: 2.5;
|
|
87
|
+
pointer-events: none;
|
|
88
|
+
opacity: 0;
|
|
89
|
+
filter: drop-shadow(0 0 6px color-mix(in oklab, var(--hl-spark) 70%, transparent));
|
|
90
|
+
animation: hl-edge-pulse 0.6s var(--hl-ease);
|
|
91
|
+
}
|
|
92
|
+
.hl-edge.is-error .hl-edge-pulse {
|
|
93
|
+
stroke: var(--hl-error);
|
|
94
|
+
filter: drop-shadow(0 0 6px color-mix(in oklab, var(--hl-error) 70%, transparent));
|
|
95
|
+
}
|
|
96
|
+
@keyframes hl-edge-pulse {
|
|
97
|
+
0% {
|
|
98
|
+
opacity: 1;
|
|
99
|
+
}
|
|
100
|
+
100% {
|
|
101
|
+
opacity: 0;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
/* A bounded connection's capacity, in FBP notation: `[4]`. A connection that
|
|
106
|
+
drops its oldest message when full is lossy, so its badge takes the
|
|
107
|
+
warning hue. */
|
|
108
|
+
.hl-edge-capacity {
|
|
109
|
+
position: absolute;
|
|
110
|
+
pointer-events: none;
|
|
111
|
+
padding: 2px 7px;
|
|
112
|
+
border-radius: var(--hl-r-pill);
|
|
113
|
+
border: 1px solid var(--hl-line-strong);
|
|
114
|
+
font-size: 11px;
|
|
115
|
+
line-height: 1.4;
|
|
116
|
+
white-space: nowrap;
|
|
117
|
+
color: var(--hl-silver-hi);
|
|
118
|
+
/* Opaque, so the label stays legible over the line it labels. */
|
|
119
|
+
background: var(--hl-surface-2);
|
|
120
|
+
}
|
|
121
|
+
.hl-edge-capacity.is-lossy {
|
|
122
|
+
border-color: color-mix(in oklab, var(--hl-warning) 45%, var(--hl-line-strong));
|
|
123
|
+
}
|
|
124
|
+
.hl-edge-capacity.is-lossy {
|
|
125
|
+
color: var(--hl-warning);
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
/* A selected connection (the one the inspector shows): a brighter, thicker
|
|
129
|
+
silver line, so it is clear which connection is being edited. */
|
|
130
|
+
.hl-edge.is-selected .hl-edge-flow {
|
|
131
|
+
stroke: var(--hl-silver-hi);
|
|
132
|
+
stroke-width: 2.25;
|
|
133
|
+
opacity: 1;
|
|
134
|
+
filter: drop-shadow(0 0 4px color-mix(in oklab, var(--hl-silver) 60%, transparent));
|
|
135
|
+
}
|