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

namspacing and lowercasing ui functions. they're functions, not data constructors now. matching CG userspace ui functions

Browse source
This commit is contained in:
Dustin Swan 2026-02-09 19:29:08 -07:00
parent b8a396a734
commit 3fe7750290
No known key found for this signature in database
GPG key ID: 30D46587E2100467
6 changed files with 126 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

60
src/runtime-js.ts
View file

@ -22,19 +22,39 @@ export const _rt = {
gte: (a: any) => (b: any) => ({ _tag: a >= b ? 'True' : 'False' }),
lte: (a: any) => (b: any) => ({ _tag: a <= b ? 'True' : 'False' }),
ui: {
rect: (config: any) => ({ _kind: 'rect', ...config }),
text: (config: any) => ({ _kind: 'text', ...config }),
stack: (config: any) => ({ _kind: 'stack', ...config }),
row: (config: any) => ({ _kind: 'row', ...config }),
column: (config: any) => ({ _kind: 'column', ...config }),
padding: (config: any) => ({ _kind: 'padding', ...config }),
positioned: (config: any) => ({ _kind: 'positioned', ...config }),
clickable: (config: any) => ({ _kind: 'clickable', ...config }),
clip: (config: any) => ({ _kind: 'clip', ...config }),
opacity: (config: any) => ({ _kind: 'opacity', ...config }),
stateful: (config: any) => ({ _kind: 'stateful', ...config }),
measure: (config: any) => ({ _kind: 'measure', ...config }),
measureText: (text: string) => {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
if (ctx) {
ctx.font = '16px "SF Mono", "Monaco", "Menlo", monospace';
return Math.floor(ctx.measureText(text).width);
}
return text.length * 10; // fallback
},
},
batch: (events: any[]) => ({ _tag: 'Batch', _0: events }),
noOp: { _tag: 'NoOp' },
rerender: { _tag: 'Rerender' },
focus: (key: string) => ({ _tag: 'Focus', _0: key }),
len: (list: any[]) => list.length,
str: (x: any) => String(x),
slice: (s: string | any[]) => (start: number) => (end: number) => s.slice(start, end),
debug: (label: string) => (value: any) => { console.log(label, value); return value; },
measureText: (text: string) => {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
if (ctx) {
ctx.font = '16px "SF Mono", "Monaco", "Menlo", monospace';
return Math.floor(ctx.measureText(text).width);
}
return text.length * 10; // fallback
},
fuzzyMatch: (query: string) => (target: string) => {
const q = query.toLowerCase();
const t = target.toLowerCase();
@ -69,11 +89,11 @@ export const _rt = {
}
},
measure: (ui: any): { width: number, height: number } => {
switch (ui._tag) {
case 'Rect': return { width: ui.w, height: ui.h };
case 'Text': return { width: ui.content.length * 10, height: 20 }; // TODO
case 'Clip': return { width: ui.w, height: ui.h };
case 'Row': {
switch (ui._kind) {
case 'rect': return { width: ui.w, height: ui.h };
case 'text': return { width: ui.content.length * 10, height: 20 }; // TODO
case 'clip': return { width: ui.w, height: ui.h };
case 'row': {
let totalWidth = 0;
let maxHeight = 0;
for (const child of ui.children) {
@ -85,7 +105,7 @@ export const _rt = {
return { width: totalWidth, height: maxHeight };
}
case 'Column': {
case 'column': {
let totalHeight = 0;
let maxWidth = 0;
for (const child of ui.children) {
@ -97,7 +117,7 @@ export const _rt = {
return { width: maxWidth, height: totalHeight };
}
case 'Padding': {
case 'padding': {
const childSize = _rt.measure(ui.child);
return {
width: childSize.width + ui.amount * 2,
@ -105,7 +125,7 @@ export const _rt = {
}
}
case 'Stack': {
case 'stack': {
let maxWidth = 0;
let maxHeight = 0;
for (const child of ui.children) {
@ -117,9 +137,9 @@ export const _rt = {
return { width: maxWidth, height: maxHeight };
}
case 'Clickable':
case 'Opacity':
case 'Positioned':
case 'clickable':
case 'opacity':
case 'positioned':
return _rt.measure(ui.child);
default: