dustinswan/cg
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

more tree editor stuff

Browse source
This commit is contained in:
Dustin Swan 2026-02-16 21:44:13 -07:00
parent f42b5d8abe
commit 3d7559845e
No known key found for this signature in database
GPG key ID: 30D46587E2100467
3 changed files with 38 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/cg/03-ui-components.cg
View file

@ -110,7 +110,7 @@ textInput = config \
onSubmit = _ \ noOp,
onChange = _ \ noOp,
initialValue = "",
initialFocus = False,
autoFocus = False,
};
c = { ...defaults, ...config };
@ -157,13 +157,13 @@ textInput = config \
ui.stateful {
key = c.key,
focusable = True,
autoFocus = c.initialFocus,
autoFocus = c.autoFocus,
# init : State
init = {
text = c.initialValue,
focused = c.initialFocus,
cursorPos = 0,
focused = c.autoFocus,
cursorPos = len c.initialValue,
scrollOffset = 0
},

2
src/cg/05-palette.cg
View file

@ -118,7 +118,7 @@ palette = config \
textInput {
key = "palette-query",
initialValue = paletteState.query,
initialFocus = True,
autoFocus = True,
color = "white",
backgroundColor = "rgba(0,0,0,0.2)",
w = contentWidth,

60
src/cg/06-tree.cg
View file

@ -52,11 +52,13 @@ treeNode = config \
depth = config.depth;
indent = depth * 20;
simple = path content color \
simple = path content color onClick \
selected = (config.selectedPath | Some p \ p == path | None \ False);
ui.positioned { x = indent, y = 0,
child = ui.text { content = content, color = (selected | True \ "white" | False \ color) }
};
inner = ui.text { content = content, color = (selected | True \ "white" | False \ color) };
wrapped = (onClick
| Some handler \ ui.clickable { onClick = handler, child = inner }
| None \ inner);
ui.positioned { x = indent, y = 0, child = wrapped };
isEditing = config.editing | Some p \ p == config.path | None \ False;
@ -67,11 +69,8 @@ treeNode = config \
| FunctionValue _ \ Some "<fn>"
| _ \ None;
header = isExp label color \
ui.clickable {
onClick = _ \ config.onToggle config.path,
child = simple config.path (config.prefix & (isExp | True \ "▼ " | False \ "▶ ") & label) color
};
header = isExp label color \
simple config.path (config.prefix & (isExp | True \ "▼ " | False \ "▶ ") & label) color (Some (_ \ config.onToggle config.path));
isExp = contains config.path config.expanded;
@ -92,7 +91,7 @@ treeNode = config \
h = 30,
onSubmit = onSubmit
}
| False \ simple config.path (config.prefix & (show n)) "#6cf")
| False \ simple config.path (config.prefix & (show n)) "#6cf" (Some (_ \ config.onEditLeaf config.path)))
| StringValue n \ (isEditing
| True \ textInput {
@ -105,7 +104,7 @@ treeNode = config \
h = 30,
onSubmit = onSubmit
}
| False \ simple config.path (config.prefix & "\"" & n & "\"") "#f6a")
| False \ simple config.path (config.prefix & "\"" & n & "\"") "#f6a" (Some (_ \ config.onEditLeaf config.path)))
| ConstructorValue { tag = tag } \ (isEditing
| True \ textInput {
@ -118,9 +117,9 @@ treeNode = config \
h = 30,
onSubmit = onSubmit
}
| False \ simple config.path (config.prefix & tag) "#fc6")
| False \ simple config.path (config.prefix & tag) "#fc6" (Some (_ \ config.onEditLeaf config.path)))
| FunctionValue _ \ simple config.path (config.prefix & "<fn>") "#888"
| FunctionValue _ \ simple config.path (config.prefix & "<fn>") "#888" None
| RecordValue entries \
ui.column { gap = 0, children = [
@ -130,7 +129,7 @@ treeNode = config \
onClick = _ \ noOp,
child = ui.column { gap = 0, children = map (entry \
pfx = (valueLabel entry.value) | Some _ \ " = " | None \ " ";
treeNode { value = entry.value, depth = depth + 1, path = config.path & "." & entry.key, expanded = config.expanded, onToggle = config.onToggle, selectedPath = config.selectedPath, prefix = entry.key & pfx, editing = config.editing, onDoneEditing = config.onDoneEditing }
treeNode { value = entry.value, depth = depth + 1, path = config.path & "." & entry.key, expanded = config.expanded, onToggle = config.onToggle, selectedPath = config.selectedPath, prefix = entry.key & pfx, editing = config.editing, onDoneEditing = config.onDoneEditing, onEditLeaf = config.onEditLeaf }
) entries }
}]
| False \ [])
@ -142,7 +141,7 @@ treeNode = config \
| True \ [ui.clickable {
onClick = _ \ noOp,
child = ui.column { gap = 0, children = mapWithIndex (item i \
treeNode { value = item, depth = depth + 1, path = config.path & "." & (show i), expanded = config.expanded, onToggle = config.onToggle, selectedPath = config.selectedPath, prefix = (show i) & ": ", editing = config.editing, onDoneEditing = config.onDoneEditing }
treeNode { value = item, depth = depth + 1, path = config.path & "." & (show i), expanded = config.expanded, onToggle = config.onToggle, selectedPath = config.selectedPath, prefix = (show i) & ": ", editing = config.editing, onDoneEditing = config.onDoneEditing, onEditLeaf = config.onEditLeaf }
) items }
}]
| False \ [])
@ -150,6 +149,15 @@ treeNode = config \
| _ \ ui.text { content = "?", color = "#666" };
tree = config \
downArrow = state \
paths = visiblePaths config.value config.path state.expanded;
newIndex = min (len paths - 1) (state.selectedIndex + 1);
{ state = state.{ selectedIndex = newIndex }, emit = [] };
upArrow = state \
newIndex = max 0 (state.selectedIndex - 1);
{ state = state.{ selectedIndex = newIndex }, emit = [] };
ui.stateful {
focusable = True,
autoFocus = True,
@ -167,17 +175,10 @@ tree = config \
newY = max 0 (min (totalH - config.h) (state.scrollY + delta.deltaY));
{ state = state.{ scrollY = newY }, emit = [] })
| Key { key = "ArrowDown" } \ (
paths = visiblePaths config.value config.path state.expanded;
newIndex = min (len paths - 1) (state.selectedIndex + 1);
_ = debug "newIndex" newIndex;
{ state = state.{ selectedIndex = newIndex }, emit = [] })
| Key { key = "ArrowUp" } \ (
# paths = visiblePaths config.value config.path state.expanded;
newIndex = max 0 (state.selectedIndex - 1);
_ = debug "newIndex" newIndex;
{ state = state.{ selectedIndex = newIndex }, emit = [] })
| Key { key = "ArrowDown" } \ downArrow state
| Key { key = "j" } \ downArrow state
| Key { key = "ArrowUp" } \ upArrow state
| Key { key = "k" } \ upArrow state
| Key { key = "Enter" } \ (
items = visiblePaths config.value config.path state.expanded;
@ -194,12 +195,17 @@ tree = config \
| Key { key = "Escape" } \ { state = state.{ editing = None }, emit = [] }
| EditLeaf path \ { state = state.{ editing = Some path }, emit = [] }
| DoneEditing \ { state = state.{ editing = None }, emit = [] }
| _ \ { state = state, emit = [] },
view = state emit \
onToggle = path \ emit (Toggle path);
onEditLeaf = path \
_ = debug "onEditLeaf" path;
emit (EditLeaf path);
onDoneEditing = _ \ emit DoneEditing;
totalH = treeNodeHeight config.value config.path state.expanded;
paths = visiblePaths config.value config.path state.expanded;
@ -213,6 +219,6 @@ tree = config \
scrollX = 0,
scrollY = state.scrollY,
onScroll = delta \ emit (Scrolled delta),
child = treeNode { value = config.value, path = config.path, depth = 0, expanded = state.expanded, onToggle = onToggle, selectedPath = selectedPath, prefix = "", editing = state.editing, onDoneEditing = onDoneEditing }
child = treeNode { value = config.value, path = config.path, depth = 0, expanded = state.expanded, onToggle = onToggle, selectedPath = selectedPath, prefix = "", editing = state.editing, onDoneEditing = onDoneEditing, onEditLeaf = onEditLeaf }
}
};