{ "version": "2.8", "children": [ { "type": "frame", "id": "ds_cover", "name": "0 — Cover", "x": 0, "y": 0, "width": 1440, "height": "fit_content(400)", "fill": "$--background", "layout": "vertical", "gap": 32, "padding": [ 80, 60 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "ds_title", "content": "Laputa Design System", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 48, "fontWeight": "700", "letterSpacing": -1.5 }, { "type": "text", "id": "ds_subtitle", "content": "Wiki-linked knowledge management for deep thinkers", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 18, "lineHeight": 1.5 }, { "type": "rectangle", "id": "ds_div", "width": "fill_container", "height": 1, "fill": "$--border" }, { "type": "frame", "id": "ds_toc", "name": "TOC", "layout": "vertical", "width": "fill_container", "gap": 16, "children": [ { "type": "text", "id": "ds_toc_t", "content": "Table of Contents", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "600" }, { "type": "frame", "id": "ds_toc_items", "layout": "vertical", "width": "fill_container", "gap": 8, "children": [ { "type": "text", "id": "ds_t1", "fill": "$--primary", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "500", "content": "1. Foundations — Colors, Typography, Spacing, Shadows, Heights" }, { "type": "text", "id": "ds_t2", "fill": "$--primary", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "500", "content": "2. Components — Atoms, Molecules, Organisms" }, { "type": "text", "id": "ds_t3", "fill": "$--primary", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "500", "content": "3. Full Layouts — 6 app variants at 1440×900" }, { "type": "text", "id": "ds_t4", "fill": "$--primary", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "500", "content": "4. Feature Specs — All screens grouped by functional area" } ] } ] } ] }, { "type": "frame", "id": "sec1_hdr", "name": "1 — Foundations", "x": 0, "y": 500, "width": 1440, "height": 60, "fill": "$--foreground", "padding": [ 0, 60 ], "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "sec1_hdr_lbl", "content": "1 — FOUNDATIONS", "fill": "$--background", "fontFamily": "Inter", "fontSize": 24, "fontWeight": "700", "letterSpacing": 2 } ] }, { "type": "frame", "id": "mOf4J", "x": 0, "y": 600, "name": "Color Palette — shadcn/ui Theme (Light)", "theme": { "Mode": "Light" }, "width": 1440, "fill": "$--background", "layout": "vertical", "gap": 32, "padding": 40, "children": [ { "type": "text", "id": "rmJdn", "name": "cTitle", "fill": "$--foreground", "content": "Color Palette — shadcn/ui Theme Variables (Light)", "fontFamily": "Inter", "fontSize": 28, "fontWeight": "700", "letterSpacing": -0.5 }, { "type": "text", "id": "V79Zu", "name": "cSub", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "All colors from src/index.css. Variables support light/dark mode via .dark class.", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 14, "fontWeight": "normal" }, { "type": "text", "id": "Xbdzq", "name": "primLbl", "fill": "$--foreground", "content": "Primary Colors", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "NyoC7", "name": "primRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "Inb1x", "name": "sw1", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "HRsVC", "name": "sw1b", "fill": "$--background", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "jV89s", "name": "sw1n", "fill": "$--foreground", "content": "--background", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "qOUUY", "name": "sw1v", "fill": "$--muted-foreground", "content": "L: #FFFFFF / D: #0f0f1a", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "QytAQ", "name": "sw2", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "TMuHH", "name": "sw2b", "fill": "$--foreground", "width": "fill_container", "height": 60 }, { "type": "text", "id": "k9qK4", "name": "sw2n", "fill": "$--foreground", "content": "--foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "BfEn7", "name": "sw2v", "fill": "$--muted-foreground", "content": "L: #37352F / D: #e0e0e0", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "gJZtB", "name": "sw3", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "RRsQg", "name": "sw3b", "fill": "$--primary", "width": "fill_container", "height": 60 }, { "type": "text", "id": "CtJe4", "name": "sw3n", "fill": "$--foreground", "content": "--primary", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "1iFr6", "name": "sw3v", "fill": "$--muted-foreground", "content": "#155DFF", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "mbvua", "name": "sw4", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "fajNZ", "name": "sw4b", "fill": "$--primary-foreground", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "wVJ7z", "name": "sw4n", "fill": "$--foreground", "content": "--primary-foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "Oum5Q", "name": "sw4v", "fill": "$--muted-foreground", "content": "L: #FFFFFF / D: #ffffff", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "text", "id": "UvI4d", "name": "accLbl", "fill": "$--foreground", "content": "Accent & Semantic Colors", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "jOmo7", "name": "accRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "uFXJ3", "name": "a1", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "NRr0w", "name": "a1b", "fill": "$--accent-blue", "width": "fill_container", "height": 60 }, { "type": "text", "id": "ECVqk", "name": "a1n", "fill": "$--foreground", "content": "--accent-blue", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "csKEt", "name": "a2", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "5IiT2", "name": "a2b", "fill": "$--accent-green", "width": "fill_container", "height": 60 }, { "type": "text", "id": "aCPba", "name": "a2n", "fill": "$--foreground", "content": "--accent-green", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "XbY7C", "name": "a3", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "I9qCz", "name": "a3b", "fill": "$--accent-yellow", "width": "fill_container", "height": 60 }, { "type": "text", "id": "DfZVh", "name": "a3n", "fill": "$--foreground", "content": "--accent-yellow", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "nROw3", "name": "a4", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "IcIoP", "name": "a4b", "fill": "$--accent-red", "width": "fill_container", "height": 60 }, { "type": "text", "id": "eGgz6", "name": "a4n", "fill": "$--foreground", "content": "--destructive", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "J95fv", "name": "a5", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "o03fQ", "name": "a5b", "fill": "$--accent-purple", "width": "fill_container", "height": 60 }, { "type": "text", "id": "H9VWy", "name": "a5n", "fill": "$--foreground", "content": "--accent-purple", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] } ] }, { "type": "text", "id": "GcYle", "name": "lightLightLbl", "fill": "$--foreground", "content": "Accent Light Backgrounds", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "Ju2xp", "name": "accLightRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "5dnn5", "name": "al1", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "7kcqW", "name": "ll1b", "fill": "$--accent-blue-light", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "dBCbF", "name": "ll1n", "fill": "$--foreground", "content": "--accent-blue-light", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "W0t0j", "name": "al2", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "1vepp", "name": "ll2b", "fill": "$--accent-green-light", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "6kUyf", "name": "ll2n", "fill": "$--foreground", "content": "--accent-green-light", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "zyV1j", "name": "al3", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "yUDBN", "name": "ll3b", "fill": "$--accent-yellow-light", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "dmfZ4", "name": "ll3n", "fill": "$--foreground", "content": "--accent-yellow-light", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "yGmmo", "name": "al4", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "eLu8o", "name": "ll4b", "fill": "$--accent-red-light", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "PVLwR", "name": "ll4n", "fill": "$--foreground", "content": "--accent-red-light", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "0BO2b", "name": "al5", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "6FBws", "name": "ll5b", "fill": "$--accent-purple-light", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "i2DfV", "name": "ll5n", "fill": "$--foreground", "content": "--accent-purple-light", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] } ] }, { "type": "text", "id": "JFocf", "name": "surfLbl", "fill": "$--foreground", "content": "Surface & Border Colors", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "YAJLW", "name": "surfRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "JHS3j", "name": "s1", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "9Bj41", "name": "s1b", "fill": "$--card", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "wn4ua", "name": "s1n", "fill": "$--foreground", "content": "--card", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "Fyvfd", "name": "s2", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "UFLw5", "name": "s2b", "fill": "$--sidebar", "width": "fill_container", "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--sidebar-border" } }, { "type": "text", "id": "gngfL", "name": "s2n", "fill": "$--foreground", "content": "--sidebar", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "zbyEJ", "name": "s3", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "WnmQD", "name": "s3b", "fill": "$--secondary", "width": "fill_container", "height": 60 }, { "type": "text", "id": "wnkxR", "name": "s3n", "fill": "$--foreground", "content": "--secondary", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "Z2FuK", "name": "s4", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "lNPnc", "name": "s4b", "fill": "$--border", "width": "fill_container", "height": 60 }, { "type": "text", "id": "x9aeh", "name": "s4n", "fill": "$--foreground", "content": "--border / --input", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "TDDQ0", "name": "s5", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "MwHOe", "name": "s5b", "fill": "$--muted-foreground", "width": "fill_container", "height": 60 }, { "type": "text", "id": "dHZj5", "name": "s5n", "fill": "$--foreground", "content": "--muted-foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] } ] } ] }, { "type": "frame", "id": "HZonq", "x": 0, "y": 1600, "name": "Typography & Spacing Specs (Light)", "theme": { "Mode": "Light" }, "width": 1440, "fill": "$--background", "layout": "vertical", "gap": 32, "padding": 40, "children": [ { "type": "text", "id": "nGLlU", "name": "tTitle", "fill": "$--foreground", "content": "Typography Scale (Light)", "fontFamily": "Inter", "fontSize": 28, "fontWeight": "700", "letterSpacing": -0.5 }, { "type": "text", "id": "gkQqO", "name": "tSub", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Fonts: Inter, IBM Plex Mono. Base: 14px. System fallback: -apple-system, BlinkMacSystemFont, sans-serif.", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 14, "fontWeight": "normal" }, { "type": "frame", "id": "QL9fK", "name": "t1", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "px1l7", "name": "t1s", "fill": "$--foreground", "content": "Heading 1", "lineHeight": 1.2, "fontFamily": "Inter", "fontSize": 32, "fontWeight": "700" }, { "type": "text", "id": "3UWKu", "name": "t1d", "fill": "$--muted-foreground", "content": "32px / Bold / lh 1.2 — Editor H1", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Yjhit", "name": "t2", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "iFzl0", "name": "t2s", "fill": "$--foreground", "content": "Heading 2", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "cF55I", "name": "t2d", "fill": "$--muted-foreground", "content": "24px / Semibold / lh 1.3 — Editor H2", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "bBHMa", "name": "t3", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "kpSyr", "name": "t3s", "fill": "$--foreground", "content": "App Title", "fontFamily": "Inter", "fontSize": 17, "fontWeight": "700", "letterSpacing": -0.3 }, { "type": "text", "id": "xUuNz", "name": "t3d", "fill": "$--muted-foreground", "content": "17px / Bold / ls -0.3 — Sidebar header", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Lsh7F", "name": "t4", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "vTRSs", "name": "t4s", "fill": "$--foreground", "content": "Body Text", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "fKa3p", "name": "t4d", "fill": "$--muted-foreground", "content": "16px / Regular / lh 1.6 — Editor paragraphs", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "rpOTz", "name": "t5", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "VXY3Z", "name": "t5s", "fill": "$--foreground", "content": "UI Label / Button", "lineHeight": 1.43, "fontFamily": "Inter", "fontSize": 14, "fontWeight": "500" }, { "type": "text", "id": "F6GQz", "name": "t5d", "fill": "$--muted-foreground", "content": "14px / Medium / lh 1.43 — Buttons, NoteList header, Inspector labels", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "H6Rgt", "name": "t6", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "xWvbj", "name": "t6s", "fill": "$--foreground", "content": "Sidebar Item", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "text", "id": "bvBBm", "name": "t6d", "fill": "$--muted-foreground", "content": "13px / Medium — Sidebar nav items, filter items, search", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "GrFAq", "name": "t7", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "vY8j4", "name": "t7s", "fill": "$--muted-foreground", "content": "SECTION HEADER", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "600", "letterSpacing": 0.5 }, { "type": "text", "id": "okws6", "name": "t7d", "fill": "$--muted-foreground", "content": "11px / Semibold / ls 0.5 — Sidebar sections, type pills", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "awxls", "name": "t8", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "mD3f5", "name": "t8s", "fill": "$--foreground", "content": "ALL-CAPS LABEL", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1.2 }, { "type": "text", "id": "jFpLw", "name": "t8d", "fill": "$--muted-foreground", "content": "11px / Semibold / ls 1.2 / IBM Plex Mono — Section labels, metadata tags", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "ToLzL", "name": "t9", "width": "fill_container", "gap": 24, "alignItems": "center", "children": [ { "type": "text", "id": "LEsxW", "name": "t9s", "fill": "$--muted-foreground", "content": "OVERLINE TEXT", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.5 }, { "type": "text", "id": "HQ3Df", "name": "t9d", "fill": "$--muted-foreground", "content": "10px / Medium / ls 1.5 / IBM Plex Mono — Overlines, category labels, timestamps", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "rectangle", "id": "3tiJ7", "name": "div1", "fill": "$--border", "width": "fill_container", "height": 1 }, { "type": "text", "id": "b2Mt9", "name": "spTitle", "fill": "$--foreground", "content": "Spacing & Layout Reference", "fontFamily": "Inter", "fontSize": 28, "fontWeight": "700", "letterSpacing": -0.5 }, { "type": "frame", "id": "o6ETJ", "name": "pnlRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "HhbOn", "name": "p1", "width": "fill_container", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 6, "padding": 16, "children": [ { "type": "text", "id": "YBekR", "name": "p1t", "fill": "$--foreground", "content": "Sidebar: 250px", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "dT8Xe", "name": "p1d", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "bg: --sidebar | padding: 8px container, 12px 16px header, 6px 16px items", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "aYkMZ", "name": "p2", "width": "fill_container", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 6, "padding": 16, "children": [ { "type": "text", "id": "Eycne", "name": "p2t", "fill": "$--foreground", "content": "NoteList: 300px", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "lyTZN", "name": "p2d", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "bg: --card | padding: 14px 16px header, 8px 12px search/pills, 10px 16px items", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "E6G3g", "name": "p3", "width": "fill_container", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 6, "padding": 16, "children": [ { "type": "text", "id": "Xy5Gl", "name": "p3t", "fill": "$--foreground", "content": "Editor: flexible", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "y4svr", "name": "p3d", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "bg: --background | padding: 32px 64px content, 7px 14px tabs, gap: 16px", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "RBPav", "name": "p4", "width": "fill_container", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 6, "padding": 16, "children": [ { "type": "text", "id": "xKUWC", "name": "p4t", "fill": "$--foreground", "content": "Inspector: 280px", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "u81W5", "name": "p4d", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "bg: --sidebar | padding: 14px 12px header, 12px body, 16px section gap, 8px prop gap", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "text", "id": "VvZyF", "name": "radLbl", "fill": "$--foreground", "content": "Border Radius", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "OwJH7", "name": "radRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "DHrzV", "name": "r1", "width": "fill_container", "layout": "vertical", "gap": 8, "alignItems": "center", "children": [ { "type": "rectangle", "cornerRadius": 4, "id": "V35oi", "name": "r1b", "fill": "$--secondary", "width": 80, "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "HVQpq", "name": "r1n", "fill": "$--foreground", "content": "4px (sm) — chips", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "wp350", "name": "r2", "width": "fill_container", "layout": "vertical", "gap": 8, "alignItems": "center", "children": [ { "type": "rectangle", "cornerRadius": 6, "id": "E031z", "name": "r2b", "fill": "$--secondary", "width": 80, "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "rDLff", "name": "r2n", "fill": "$--foreground", "content": "6px (md) — buttons, inputs", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "d6tJt", "name": "r3", "width": "fill_container", "layout": "vertical", "gap": 8, "alignItems": "center", "children": [ { "type": "rectangle", "cornerRadius": 8, "id": "PNkS4", "name": "r3b", "fill": "$--secondary", "width": 80, "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "rZGXb", "name": "r3n", "fill": "$--foreground", "content": "8px (lg) — cards, dialogs", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "UAZ8u", "name": "r4", "width": "fill_container", "layout": "vertical", "gap": 8, "alignItems": "center", "children": [ { "type": "rectangle", "cornerRadius": 16, "id": "wgMVG", "name": "r4b", "fill": "$--secondary", "width": 80, "height": 60, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" } }, { "type": "text", "id": "zw3RY", "name": "r4n", "fill": "$--foreground", "content": "16px — badges", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] } ] }, { "type": "rectangle", "id": "kIrXE", "name": "div2", "fill": "$--border", "width": "fill_container", "height": 1 }, { "type": "text", "id": "FYw8k", "name": "compTitle", "fill": "$--foreground", "content": "shadcn/ui Component Inventory", "fontFamily": "Inter", "fontSize": 28, "fontWeight": "700", "letterSpacing": -0.5 }, { "type": "frame", "id": "7Q1Fi", "name": "compRow", "width": "fill_container", "gap": 16, "children": [ { "type": "frame", "id": "XfUwj", "name": "cg1", "width": "fill_container", "fill": "$--card", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 12, "padding": 16, "children": [ { "type": "text", "id": "ly7m0", "name": "cg1t", "fill": "$--accent-green", "content": "In Use", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "Re89a", "name": "cg1r1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Button — 5 variants (Default, Secondary, Outline, Ghost, Destructive)", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "ILbjW", "name": "cg1r2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Input — Default text input with label group", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "eurqS", "name": "cg1r3", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Dialog — Modal overlay (CreateNote, Commit)", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "AZyZP", "name": "cg1r4", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Badge — 4 variants (Default, Secondary, Outline, Destructive)", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "WtehQ", "name": "cg2", "width": "fill_container", "fill": "$--card", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "gap": 12, "padding": 16, "children": [ { "type": "text", "id": "KaMZ9", "name": "cg2t", "fill": "$--accent-yellow", "content": "Available (Not Yet Used)", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "F8wam", "name": "cg2r1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "DropdownMenu — Context / dropdown menus", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "Nl1aV", "name": "cg2r2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Tabs — Tab navigation component", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "0sBwH", "name": "cg2r3", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Tooltip, Select, Card, Separator, ScrollArea", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "ds_spacing", "name": "Spacing Scale", "x": 0, "y": 3000, "width": 700, "fill": "$--background", "layout": "vertical", "gap": 24, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "ds_sp_title", "content": "Spacing Scale", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "600" }, { "type": "text", "id": "ds_sp_sub", "content": "Consistent spacing tokens used throughout the app.", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 13, "lineHeight": 1.5 }, { "type": "frame", "id": "sp_xs", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_xs_box", "width": 4, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_xs_lbl", "content": "--spacing-xs: 4px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_sm", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_sm_box", "width": 8, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_sm_lbl", "content": "--spacing-sm: 8px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_md", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_md_box", "width": 12, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_md_lbl", "content": "--spacing-md: 12px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_lg", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_lg_box", "width": 16, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_lg_lbl", "content": "--spacing-lg: 16px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_xl", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_xl_box", "width": 24, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_xl_lbl", "content": "--spacing-xl: 24px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_2xl", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_2xl_box", "width": 32, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_2xl_lbl", "content": "--spacing-2xl: 32px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "sp_3xl", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "sp_3xl_box", "width": 40, "height": 24, "fill": "$--primary", "cornerRadius": 2 }, { "type": "text", "id": "sp_3xl_lbl", "content": "--spacing-3xl: 40px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] } ] }, { "type": "frame", "id": "ds_heights", "name": "Height Variables", "x": 800, "y": 3000, "width": 700, "fill": "$--background", "layout": "vertical", "gap": 24, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "ds_ht_title", "content": "Height Variables", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "600" }, { "type": "text", "id": "ds_ht_sub", "content": "Fixed heights for key layout regions.", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 13, "lineHeight": 1.5 }, { "type": "frame", "id": "ht_titlebar", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_titlebar_bar", "width": 120, "height": 38, "fill": "$--sidebar", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_titlebar_lbl", "content": "--height-titlebar: 38px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "ht_tabbar", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_tabbar_bar", "width": 120, "height": 45, "fill": "$--sidebar", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_tabbar_lbl", "content": "--height-tabbar: 45px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "ht_breadcrumb", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_breadcrumb_bar", "width": 120, "height": 45, "fill": "$--background", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_breadcrumb_lbl", "content": "--height-breadcrumb: 45px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "ht_statusbar", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_statusbar_bar", "width": 120, "height": 30, "fill": "$--sidebar", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_statusbar_lbl", "content": "--height-statusbar: 30px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "ht_modal_header", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_modal_header_bar", "width": 120, "height": 56, "fill": "$--background", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_modal_header_lbl", "content": "--height-modal-header: 56px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] }, { "type": "frame", "id": "ht_inspector_header", "layout": "horizontal", "gap": 16, "alignItems": "center", "width": "fill_container", "children": [ { "type": "rectangle", "id": "ht_inspector_header_bar", "width": 120, "height": 36, "fill": "$--background", "cornerRadius": "$--radius-sm", "stroke": { "fill": "$--border", "thickness": 1 } }, { "type": "text", "id": "ht_inspector_header_lbl", "content": "--height-inspector-header: 36px", "fill": "$--foreground", "fontFamily": "IBM Plex Mono", "fontSize": 13 } ] } ] }, { "type": "frame", "id": "ds_shadows", "name": "Shadows", "x": 0, "y": 3600, "width": 700, "fill": "$--background", "layout": "vertical", "gap": 32, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "ds_sh_title", "content": "Shadows", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "600" }, { "type": "text", "id": "ds_sh_sub", "content": "Elevation levels for cards, modals, and popovers.", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 13, "lineHeight": 1.5 }, { "type": "frame", "id": "sh_sm", "layout": "horizontal", "gap": 24, "alignItems": "center", "width": "fill_container", "children": [ { "type": "frame", "id": "sh_sm_box", "width": 120, "height": 80, "fill": "$--card", "cornerRadius": "$--radius-lg", "effect": { "type": "shadow", "offset": { "x": 0, "y": 1 }, "blur": 2, "color": "#0000000D" } }, { "type": "frame", "id": "sh_sm_info", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "sh_sm_name", "content": "Shadow SM", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "sh_sm_desc", "content": "0 1px 2px rgba(0,0,0,0.05)", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] } ] }, { "type": "frame", "id": "sh_md", "layout": "horizontal", "gap": 24, "alignItems": "center", "width": "fill_container", "children": [ { "type": "frame", "id": "sh_md_box", "width": 120, "height": 80, "fill": "$--card", "cornerRadius": "$--radius-lg", "effect": { "type": "shadow", "offset": { "x": 0, "y": 4 }, "blur": 6, "color": "#00000012" } }, { "type": "frame", "id": "sh_md_info", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "sh_md_name", "content": "Shadow MD", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "sh_md_desc", "content": "0 4px 6px rgba(0,0,0,0.07)", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] } ] }, { "type": "frame", "id": "sh_lg", "layout": "horizontal", "gap": 24, "alignItems": "center", "width": "fill_container", "children": [ { "type": "frame", "id": "sh_lg_box", "width": 120, "height": 80, "fill": "$--card", "cornerRadius": "$--radius-lg", "effect": { "type": "shadow", "offset": { "x": 0, "y": 10 }, "blur": 15, "color": "#0000001A" } }, { "type": "frame", "id": "sh_lg_info", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "sh_lg_name", "content": "Shadow LG", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "text", "id": "sh_lg_desc", "content": "0 10px 15px rgba(0,0,0,0.1)", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] } ] } ] }, { "type": "frame", "id": "sec2_hdr", "name": "2 — Components", "x": 0, "y": 4200, "width": 1440, "height": 60, "fill": "$--foreground", "padding": [ 0, 60 ], "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "sec2_hdr_lbl", "content": "2 — COMPONENTS", "fill": "$--background", "fontFamily": "Inter", "fontSize": 24, "fontWeight": "700", "letterSpacing": 2 } ] }, { "type": "text", "id": "sub_atoms", "content": "ATOMS", "x": 0, "y": 4290, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "comp_StatusDot", "name": "component/StatusDot", "reusable": true, "x": 0, "y": 4320, "width": "fit_content(6)", "height": "fit_content(6)", "theme": { "Mode": "Light" }, "children": [ { "type": "ellipse", "id": "StatusDot_dot", "width": 6, "height": 6, "fill": "$--accent-orange" } ] }, { "type": "frame", "id": "comp_Separator", "name": "component/Separator", "reusable": true, "x": 100, "y": 4320, "width": "fill_container(200)", "height": 1, "fill": "$--border", "theme": { "Mode": "Light" }, "children": [] }, { "type": "frame", "id": "comp_Badge", "name": "component/Badge", "reusable": true, "x": 400, "y": 4320, "cornerRadius": 12, "fill": "$--accent-blue-light", "padding": [ 2, 8 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "Badge_label", "content": "Badge", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "comp_ButtonPrimary", "name": "component/Button/Primary", "reusable": true, "x": 0, "y": 4380, "cornerRadius": "$--radius-md", "fill": "$--primary", "padding": [ 8, 16 ], "gap": 6, "alignItems": "center", "justifyContent": "center", "height": 36, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "BtnPri_label", "content": "Button", "fill": "$--primary-foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "comp_ButtonSecondary", "name": "component/Button/Secondary", "reusable": true, "x": 200, "y": 4380, "cornerRadius": "$--radius-md", "fill": "$--secondary", "padding": [ 8, 16 ], "gap": 6, "alignItems": "center", "justifyContent": "center", "height": 36, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "BtnSec_label", "content": "Button", "fill": "$--secondary-foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "comp_ButtonGhost", "name": "component/Button/Ghost", "reusable": true, "x": 400, "y": 4380, "cornerRadius": "$--radius-md", "padding": [ 8, 16 ], "gap": 6, "alignItems": "center", "justifyContent": "center", "height": 36, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "BtnGho_label", "content": "Button", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "comp_Input", "name": "component/Input", "reusable": true, "x": 0, "y": 4440, "width": 240, "height": 36, "cornerRadius": "$--radius-md", "fill": "$--background", "stroke": { "fill": "$--input", "thickness": 1, "align": "inside" }, "padding": [ 0, 12 ], "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "Input_placeholder", "content": "Placeholder...", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 13 } ] }, { "type": "frame", "id": "comp_IconButton", "name": "component/IconButton", "reusable": true, "x": 300, "y": 4440, "width": 28, "height": 28, "cornerRadius": "$--radius-sm", "alignItems": "center", "justifyContent": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "icon_font", "id": "IconBtn_icon", "width": 16, "height": 16, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "plus" } ] }, { "type": "frame", "id": "showcase_Atoms", "name": "Showcase — Atoms", "x": 0, "y": 4520, "width": 1440, "fill": "$--background", "layout": "vertical", "gap": 24, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "showcase_Atoms_title", "content": "Atoms", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "show_comp_StatusDot", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_StatusDot_lbl", "content": "StatusDot", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_StatusDot_ref", "ref": "comp_StatusDot" } ] }, { "type": "frame", "id": "show_comp_Separator", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_Separator_lbl", "content": "Separator", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_Separator_ref", "ref": "comp_Separator" } ] }, { "type": "frame", "id": "show_comp_Badge", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_Badge_lbl", "content": "Badge", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_Badge_ref", "ref": "comp_Badge" } ] }, { "type": "frame", "id": "show_comp_ButtonPrimary", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_ButtonPrimary_lbl", "content": "Button/Primary", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_ButtonPrimary_ref", "ref": "comp_ButtonPrimary" } ] }, { "type": "frame", "id": "show_comp_ButtonSecondary", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_ButtonSecondary_lbl", "content": "Button/Secondary", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_ButtonSecondary_ref", "ref": "comp_ButtonSecondary" } ] }, { "type": "frame", "id": "show_comp_ButtonGhost", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_ButtonGhost_lbl", "content": "Button/Ghost", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_ButtonGhost_ref", "ref": "comp_ButtonGhost" } ] }, { "type": "frame", "id": "show_comp_Input", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_Input_lbl", "content": "Input", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_Input_ref", "ref": "comp_Input" } ] }, { "type": "frame", "id": "show_comp_IconButton", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_IconButton_lbl", "content": "IconButton", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_IconButton_ref", "ref": "comp_IconButton" } ] } ] }, { "type": "text", "id": "sub_molecules", "content": "MOLECULES", "x": 0, "y": 4870, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "comp_InspectorHeader", "name": "component/InspectorHeader", "reusable": true, "x": 0, "y": 4900, "width": "fill_container(320)", "height": "$--height-inspector-header", "justifyContent": "space_between", "alignItems": "center", "padding": [ 0, 12 ], "theme": { "Mode": "Light" }, "children": [ { "type": "frame", "id": "IH_left", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "IH_icon", "width": 16, "height": 16, "fill": "$--muted-foreground", "iconFontFamily": "phosphor", "iconFontName": "sliders-horizontal" }, { "type": "text", "id": "IH_title", "content": "Properties", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "IH_close", "width": 16, "height": 16, "fill": "$--muted-foreground", "iconFontFamily": "phosphor", "iconFontName": "x" } ] }, { "type": "frame", "id": "comp_NoteListItem", "name": "component/NoteListItem", "reusable": true, "x": 0, "y": 4960, "width": "fill_container(340)", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "stroke": { "align": "inside", "fill": "$--border", "thickness": { "bottom": 1 } }, "theme": { "Mode": "Light" }, "children": [ { "type": "frame", "id": "NLI_titleRow", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "NLI_titleGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "NLI_title", "content": "Note Title", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "text", "id": "NLI_time", "content": "2m ago", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "NLI_snippet", "content": "Preview text of the note content...", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 12, "lineHeight": 1.5, "textGrowth": "fixed-width", "width": "fill_container" } ] }, { "type": "frame", "id": "comp_TabActive", "name": "component/Tab/Active", "reusable": true, "x": 400, "y": 4900, "height": "fill_container(45)", "gap": 6, "fill": "$--background", "alignItems": "center", "padding": [ 0, 14 ], "stroke": { "align": "inside", "fill": "$--border", "thickness": { "right": 1 } }, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "TabA_label", "content": "Tab Title", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "TabA_close", "width": 14, "height": 14, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "x" } ] }, { "type": "frame", "id": "comp_TabInactive", "name": "component/Tab/Inactive", "reusable": true, "x": 600, "y": 4900, "height": "fill_container(45)", "gap": 6, "alignItems": "center", "padding": [ 0, 14 ], "stroke": { "align": "inside", "fill": "$--sidebar-border", "thickness": { "bottom": 1, "right": 1 } }, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "TabI_label", "content": "Tab Title", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 12 }, { "type": "icon_font", "id": "TabI_close", "width": 14, "height": 14, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "x", "opacity": 0 } ] }, { "type": "frame", "id": "comp_PropertyRow", "name": "component/PropertyRow", "reusable": true, "x": 0, "y": 5060, "width": "fill_container(300)", "alignItems": "center", "cornerRadius": 4, "padding": [ 4, 6 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "PR_label", "content": "LABEL", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2 }, { "type": "text", "id": "PR_value", "content": "Value", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13 } ] }, { "type": "frame", "id": "comp_RelationshipPill", "name": "component/RelationshipPill", "reusable": true, "x": 0, "y": 5120, "width": "fill_container(280)", "cornerRadius": 6, "fill": "$--accent-blue-light", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "padding": [ 6, 10 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "RP_title", "content": "Related Note", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "RP_icon", "width": 14, "height": 14, "fill": "$--accent-blue", "iconFontFamily": "phosphor", "iconFontName": "wrench", "weight": 700 } ] }, { "type": "frame", "id": "comp_SidebarFilterItem", "name": "component/SidebarFilterItem", "reusable": true, "x": 400, "y": 5060, "width": "fill_container(250)", "cornerRadius": 6, "gap": 8, "alignItems": "center", "padding": [ 6, 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "icon_font", "id": "SFI_icon", "width": 16, "height": 16, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "folder" }, { "type": "text", "id": "SFI_label", "content": "Filter Item", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13 }, { "type": "text", "id": "SFI_count", "content": "42", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "frame", "id": "comp_SectionLabel", "name": "component/SectionLabel", "reusable": true, "x": 0, "y": 5180, "width": "fill_container(280)", "padding": [ 0, 12 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "SL_label", "content": "SECTION", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] }, { "type": "frame", "id": "comp_SectionCountHeader", "name": "component/SectionCountHeader", "reusable": true, "x": 400, "y": 5180, "width": "fill_container(280)", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "SCH_label", "content": "SECTION", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 }, { "type": "text", "id": "SCH_count", "content": "3", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "frame", "id": "comp_AddButton", "name": "component/AddButton", "reusable": true, "x": 0, "y": 5240, "width": "fill_container(280)", "height": 32, "cornerRadius": 6, "justifyContent": "center", "alignItems": "center", "stroke": { "align": "inside", "fill": "$--border", "thickness": 1 }, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "AB_label", "content": "+ Add property", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 12 } ] }, { "type": "frame", "id": "comp_RelGroupLabel", "name": "component/RelGroupLabel", "reusable": true, "x": 400, "y": 5240, "width": "fill_container(280)", "justifyContent": "space_between", "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "RGL_label", "content": "BELONGS TO", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "letterSpacing": 0.5 }, { "type": "text", "id": "RGL_count", "content": "3", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10 } ] }, { "type": "frame", "id": "comp_CommandPaletteItem", "name": "component/CommandPaletteItem", "reusable": true, "x": 0, "y": 5300, "width": "fill_container(460)", "height": 40, "alignItems": "center", "gap": 12, "padding": [ 0, 16 ], "cornerRadius": "$--radius-md", "theme": { "Mode": "Light" }, "children": [ { "type": "icon_font", "id": "CPI_icon", "width": 16, "height": 16, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "file-text" }, { "type": "frame", "id": "CPI_content", "layout": "vertical", "width": "fill_container", "gap": 2, "children": [ { "type": "text", "id": "CPI_title", "content": "Command Name", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "text", "id": "CPI_shortcut", "content": "⌘K", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] }, { "type": "frame", "id": "comp_EditableValue", "name": "component/EditableValue", "reusable": true, "x": 0, "y": 5360, "width": "fill_container(200)", "alignItems": "center", "gap": 4, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "EV_value", "content": "Editable Value", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13 }, { "type": "icon_font", "id": "EV_edit", "width": 12, "height": 12, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "pencil", "opacity": 0 } ] }, { "type": "frame", "id": "showcase_Molecules", "name": "Showcase — Molecules", "x": 0, "y": 5420, "width": 1440, "fill": "$--background", "layout": "vertical", "gap": 24, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "showcase_Molecules_title", "content": "Molecules", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "show_comp_InspectorHeader", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_InspectorHeader_lbl", "content": "InspectorHeader", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_InspectorHeader_ref", "ref": "comp_InspectorHeader" } ] }, { "type": "frame", "id": "show_comp_NoteListItem", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_NoteListItem_lbl", "content": "NoteListItem", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_NoteListItem_ref", "ref": "comp_NoteListItem" } ] }, { "type": "frame", "id": "show_comp_TabActive", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_TabActive_lbl", "content": "Tab/Active", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_TabActive_ref", "ref": "comp_TabActive" } ] }, { "type": "frame", "id": "show_comp_TabInactive", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_TabInactive_lbl", "content": "Tab/Inactive", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_TabInactive_ref", "ref": "comp_TabInactive" } ] }, { "type": "frame", "id": "show_comp_PropertyRow", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_PropertyRow_lbl", "content": "PropertyRow", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_PropertyRow_ref", "ref": "comp_PropertyRow" } ] }, { "type": "frame", "id": "show_comp_RelationshipPill", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_RelationshipPill_lbl", "content": "RelationshipPill", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_RelationshipPill_ref", "ref": "comp_RelationshipPill" } ] }, { "type": "frame", "id": "show_comp_SidebarFilterItem", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_SidebarFilterItem_lbl", "content": "SidebarFilterItem", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_SidebarFilterItem_ref", "ref": "comp_SidebarFilterItem" } ] }, { "type": "frame", "id": "show_comp_SectionLabel", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_SectionLabel_lbl", "content": "SectionLabel", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_SectionLabel_ref", "ref": "comp_SectionLabel" } ] }, { "type": "frame", "id": "show_comp_SectionCountHeader", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_SectionCountHeader_lbl", "content": "SectionCountHeader", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_SectionCountHeader_ref", "ref": "comp_SectionCountHeader" } ] }, { "type": "frame", "id": "show_comp_AddButton", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_AddButton_lbl", "content": "AddButton", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_AddButton_ref", "ref": "comp_AddButton" } ] }, { "type": "frame", "id": "show_comp_RelGroupLabel", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_RelGroupLabel_lbl", "content": "RelGroupLabel", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_RelGroupLabel_ref", "ref": "comp_RelGroupLabel" } ] }, { "type": "frame", "id": "show_comp_CommandPaletteItem", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_CommandPaletteItem_lbl", "content": "CommandPaletteItem", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_CommandPaletteItem_ref", "ref": "comp_CommandPaletteItem" } ] }, { "type": "frame", "id": "show_comp_EditableValue", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_EditableValue_lbl", "content": "EditableValue", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_EditableValue_ref", "ref": "comp_EditableValue" } ] } ] }, { "type": "text", "id": "sub_organisms", "content": "ORGANISMS", "x": 0, "y": 5870, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "comp_Toast", "name": "component/Toast", "reusable": true, "x": 0, "y": 5900, "width": 360, "cornerRadius": "$--radius-lg", "fill": "$--card", "padding": [ 12, 16 ], "gap": 12, "alignItems": "center", "stroke": { "fill": "$--border", "thickness": 1 }, "effect": { "type": "shadow", "offset": { "x": 0, "y": 4 }, "blur": 12, "color": "#0000001A" }, "theme": { "Mode": "Light" }, "children": [ { "type": "icon_font", "id": "Toast_icon", "width": 20, "height": 20, "fill": "$--accent-green", "iconFontFamily": "lucide", "iconFontName": "check-circle" }, { "type": "frame", "id": "Toast_content", "layout": "vertical", "width": "fill_container", "gap": 2, "children": [ { "type": "text", "id": "Toast_title", "content": "Success", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "text", "id": "Toast_msg", "content": "Your changes have been saved.", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 12, "lineHeight": 1.4 } ] }, { "type": "icon_font", "id": "Toast_close", "width": 14, "height": 14, "fill": "$--muted-foreground", "iconFontFamily": "lucide", "iconFontName": "x" } ] }, { "type": "frame", "id": "comp_AIChatMessage", "name": "component/AIChatMessage", "reusable": true, "x": 0, "y": 5980, "width": "fill_container(400)", "layout": "horizontal", "gap": 12, "padding": [ 12, 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "frame", "id": "AIM_avatar", "width": 28, "height": 28, "cornerRadius": 14, "fill": "$--accent-purple-light", "alignItems": "center", "justifyContent": "center", "children": [ { "type": "icon_font", "id": "AIM_avatarIcon", "width": 16, "height": 16, "fill": "$--accent-purple", "iconFontFamily": "lucide", "iconFontName": "sparkles" } ] }, { "type": "frame", "id": "AIM_body", "layout": "vertical", "width": "fill_container", "gap": 4, "children": [ { "type": "text", "id": "AIM_sender", "content": "AI Assistant", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" }, { "type": "text", "id": "AIM_text", "content": "Here's a summary of your recent notes...", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 13, "lineHeight": 1.5, "textGrowth": "fixed-width", "width": "fill_container" } ] } ] }, { "type": "frame", "id": "showcase_Organisms", "name": "Showcase — Organisms", "x": 0, "y": 6100, "width": 1440, "fill": "$--background", "layout": "vertical", "gap": 24, "padding": 40, "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "showcase_Organisms_title", "content": "Organisms", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 18, "fontWeight": "600" }, { "type": "frame", "id": "show_comp_Toast", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_Toast_lbl", "content": "Toast", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_Toast_ref", "ref": "comp_Toast" } ] }, { "type": "frame", "id": "show_comp_AIChatMessage", "layout": "vertical", "gap": 8, "padding": [ 12, 0 ], "children": [ { "type": "text", "id": "show_comp_AIChatMessage_lbl", "content": "AIChatMessage", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "letterSpacing": 0.5 }, { "type": "ref", "id": "show_comp_AIChatMessage_ref", "ref": "comp_AIChatMessage" } ] } ] }, { "type": "frame", "id": "sec3_hdr", "name": "3 — Full Layouts", "x": 0, "y": 6600, "width": 1440, "height": 60, "fill": "$--foreground", "padding": [ 0, 60 ], "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "sec3_hdr_lbl", "content": "3 — FULL LAYOUTS", "fill": "$--background", "fontFamily": "Inter", "fontSize": 24, "fontWeight": "700", "letterSpacing": 2 } ] }, { "type": "frame", "id": "qHhaj", "x": 0, "y": 6700, "name": "Laputa App — Full Layout (Light)", "theme": { "Mode": "Light" }, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "yVQFF", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "0MCME", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "c2AU6", "name": "closeBtn", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "h0zbh", "name": "minimizeBtn", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "tcqbu", "name": "maximizeBtn", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "oHDfa", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "ZTOSJ", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": 0, "fill": "$--sidebar-border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "4wMva", "name": "Filters", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 1, "padding": [ 8, 8, 16, 8 ], "children": [ { "type": "frame", "id": "Q78hg", "name": "filterAll", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "5ip58", "name": "leftAll", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "PXpWi", "name": "iconAll", "width": 18, "height": 18, "iconFontName": "tray-fill", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--primary" }, { "type": "text", "id": "NWprl", "name": "fAllTxt", "fill": "$--primary", "content": "Untagged", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "NZ9Dv", "name": "countAll", "height": 20, "fill": "$--primary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "mPlUV", "name": "badgeAllTxt", "fill": "$--primary-foreground", "content": "24", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "YLWsY", "name": "filterUntagged", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "k7LIr", "name": "leftUntagged", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "FMVlh", "name": "untaggedIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "5XllD", "name": "untaggedTxt", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "aSpGv", "name": "countUntagged", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "qZUFt", "name": "untaggedBadgeTxt", "fill": "$--muted-foreground", "content": "6", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "Jahon", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "IOiBI", "name": "leftTrash", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "X6F74", "name": "trashIcon", "width": 18, "height": 18, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "vRMH9", "name": "trashTxt", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "JMpkq", "name": "countTrash", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "0cKm4", "name": "trashBadgeTxt", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "6RMbq", "name": "filterChanges", "width": "fill_container", "cornerRadius": 6, "gap": 6, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "DpdBu", "name": "leftChanges", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "VTusA", "name": "iconChanges", "width": 18, "height": 18, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "qvq5O", "name": "fChangesTxt", "fill": "$--foreground", "content": "Changes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "qAMES", "name": "countChanges", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "nkzVk", "name": "badgeChangesTxt", "fill": "$--muted-foreground", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] }, { "type": "frame", "id": "SSEUP", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "nM2Cn", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "ouIl9", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Rx1Cp", "name": "leftProj", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "t5WJJ", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "S3sGC", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "FKwSS", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "IHzFh", "name": "projItem1", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "iiFcl", "name": "proj1Txt", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "LdaU9", "name": "projItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "XRll4", "name": "proj2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Vmykd", "name": "projItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "0PqQQ", "name": "proj3Txt", "fill": "$--muted-foreground", "content": "AI Habit Tracker", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "WAQtn", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "aSi3l", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "lov6B", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Em4ns", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "WPRCo", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "6hDdQ", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "FmUu0", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "Dat6o", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "iJlgx", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "I2J1R", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "AToF0", "name": "Procedures", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "meEIL", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "T4NG2", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "Q01iL", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "eE6Ca", "name": "leftPeople", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "jOmVa", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "users", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "caelD", "name": "peopleLbl", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "TkuS1", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "BY1Qx", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "v28d8", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "TPyOc", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "ELRMi", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "OlI6Q", "name": "eventsLbl", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "TZwK8", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "trKNW", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "qdbZ3", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "JP83M", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Q57kF", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "DeVxP", "name": "eventsLbl", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "nzAcm", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ZWXuk", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "CQaLg", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "2SMcN", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "0N8UH", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "6XB2H", "name": "eventsLbl", "fill": "$--foreground", "content": "Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "NmBSB", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "2cQBp", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "0f10v", "name": "leftEvents", "gap": 8, "padding": [ 8, 0 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "xBv1X", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "viWPL", "name": "eventsLbl", "fill": "$--muted-foreground", "content": "Create new type", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "8lLHp", "name": "Commit Area", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "layout": "vertical", "padding": 12, "children": [ { "type": "frame", "id": "YYjuy", "name": "commitBtn", "width": "fill_container", "fill": "$--primary", "cornerRadius": 6, "gap": 6, "padding": [ 8, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "YF44G", "name": "commitIcon", "width": 14, "height": 14, "iconFontName": "git-commit-horizontal", "iconFontFamily": "lucide", "fill": "$--primary-foreground" }, { "type": "text", "id": "vpzJm", "name": "commitTxt", "fill": "$--primary-foreground", "content": "Commit & Push", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "vhU5z", "name": "commitBadge", "height": 18, "fill": "$--white-overlay", "cornerRadius": 9, "padding": [ 0, 5 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "sdvYT", "name": "commitBadgeTxt", "fill": "$--white", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] } ] }, { "type": "rectangle", "id": "IIvWr", "name": "Resize Handle", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "zFIJv", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--card", "stroke": { "align": "inside", "thickness": 0, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "uZJVN", "name": "NoteList Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "hmbdb", "name": "nlTitle", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "frame", "id": "m6AeW", "name": "nlActions", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "8gMXE", "name": "searchIcon", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "YqvSN", "name": "plusIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "0aJUm", "name": "Note Items", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "y9y05", "name": "Backlinks Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "tMsM4", "name": "Note Item Selected", "width": "fill_container", "fill": "$--accent-red-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "rectangle", "id": "npYuc", "name": "leftAccent", "fill": "$--accent-red", "width": 3, "height": "fill_container" }, { "type": "frame", "id": "a33Wx", "name": "noteSelContent", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "AZkyx", "name": "noteSelRow", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "j7GDJ", "name": "titleGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "j7o2Q", "name": "noteSelTitle", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "icon_font", "id": "BnkTG", "name": "ico", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "lucide", "fill": "$--accent-red" } ] } ] }, { "type": "text", "id": "Ac5Ds", "name": "noteSelSnip", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "9ASsT", "name": "noteSelTime", "fill": "$--accent-red", "content": "2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "7G8pN", "name": "Related Notes Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "fDxtF", "name": "Related Notes Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "UBRdO", "name": "rnLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "8Z4Wq", "name": "rnLabel", "fill": "$--muted-foreground", "content": "RELATED NOTES", "fontFamily": "IBM Plex Mono", "fontSize": 11 }, { "type": "text", "id": "vpnZr", "name": "rnCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "X9LIR", "name": "rnRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "fzVWu", "name": "rnFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "wuqsO", "name": "rnPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "SbjLq", "name": "rnChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "AsAKG", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "QX5A1", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rYdta", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "PC9XN", "name": "note2Title", "fill": "$--foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "oI64Y", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "S9JPj", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Redesigning portfolio site with modern stack and updated visual language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "lU75x", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "u6E6Z", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "ZjCz3", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "mxCzu", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "INenY", "name": "note2Title", "fill": "$--foreground", "content": "Sample note 2", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "gz6qS", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "s141z", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "SvGnt", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "1GwHB", "name": "Events Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "fp4xI", "name": "Events Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "MNNuU", "name": "evLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "BNxZp", "name": "evLabel", "fill": "$--muted-foreground", "content": "EVENTS", "fontFamily": "IBM Plex Mono", "fontSize": 11 }, { "type": "text", "id": "qcEvw", "name": "evCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Sans", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "WCyfc", "name": "evRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "SpCoO", "name": "evFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "G1DCl", "name": "evPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "sAalN", "name": "evChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "k7CjA", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "og5Gz", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "ttBdk", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "KI8Bf", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "LdRjU", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "FfPXa", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "BHh4Z", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "AQ51u", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "SHgK3", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "3rIet", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "dCwzu", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "l8O2I", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "1L4oo", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "3oBam", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "rectangle", "id": "MeqjO", "name": "Resize Handle 2", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "zAbPt", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "NdYcO", "name": "Tab Bar", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "nVUGr", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "kBpGX", "name": "tab1Txt", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "Bb2AE", "name": "tab1Close", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "GYeyL", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "kZ1bn", "name": "tab2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "RwyYI", "name": "tab2Close", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "sbpmq", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "WF97k", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "rfSoS", "name": "iconPlus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "t0u6z", "name": "iconSplit", "width": 16, "height": 16, "iconFontName": "columns", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "kbe1P", "name": "iconExpand", "width": 16, "height": 16, "iconFontName": "arrows-out-simple", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "rTdKS", "name": "Editor Body", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "NfyTF", "name": "Editor Left", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "hvoFh", "name": "Info Bar", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "bTP0I", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "Msj7v", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "wqdMG", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "FzENd", "name": "breadcrumbName", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "pvTmc", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "9ga1R", "name": "modifiedTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" } ] }, { "type": "frame", "id": "3bzDp", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "9Ctb0", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "csHzz", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "2s6Of", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "JVSlj", "name": "iconAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "k3AiV", "name": "iconMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "vvETz", "name": "Editor Content", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 32, 64 ], "children": [ { "type": "text", "id": "b6up3", "name": "editorP1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app, built with Tauri v2 + React + TypeScript + CodeMirror 6. It reads a vault of markdown files with YAML frontmatter and presents them in a four-panel UI inspired by Bear Notes.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "a2S43", "name": "editorH2", "fill": "$--foreground", "content": "Architecture", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "wgvQa", "name": "editorP2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "The app uses a four-panel layout: Sidebar for navigation, NoteList for browsing, Editor for content, and Inspector for metadata. All data lives in markdown files with YAML frontmatter, git-versioned.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "GGP97", "name": "Inspector", "clip": true, "width": 260, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "left": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "FbHy7", "name": "Inspector Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "sA7Dx", "name": "leftGroup", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "0ccF1", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "T2vTZ", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "NQOhZ", "name": "sidebarIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "LYFki", "name": "Inspector Body", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "frame", "id": "8g61y", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "VhH4P", "name": "addPropBtn", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 12 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "Q9z8F", "name": "addPropTxt", "fill": "$--muted-foreground", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "6PwTH", "name": "propType", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Vt2BC", "name": "propTypeLbl", "fill": "$--muted-foreground", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "uvBiY", "name": "propTypeVal", "fill": "$--foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "FDbay", "name": "propStatus", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "e426F", "name": "propStatusLbl", "fill": "$--muted-foreground", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "o2rZM", "name": "propStatusBadge", "fill": "$--accent-green-light", "cornerRadius": 16, "stroke": { "align": "inside", "thickness": 1, "fill": "transparent" }, "gap": 8, "padding": [ 1, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "QM7L3", "name": "Badge Text", "fill": "$--accent-green", "content": "ACTIVE", "lineHeight": 1.33, "textAlign": "center", "textAlignVertical": "middle", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] } ] } ] }, { "type": "frame", "id": "NmRLv", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "WFVAr", "name": "relGroup1", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "0N729", "name": "relGrp1Title", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "zLl8F", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "kw9vC", "name": "laputaTxt", "fill": "$--accent-green", "content": "Laputa", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "RFvoz", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "ybi8Q", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "VNcmt", "name": "laputaTxt", "fill": "$--accent-green", "content": "Building", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "UVPwc", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "L6knW", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "jwU3Z", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "laPFL", "name": "relGroup2", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "LOXUL", "name": "relGrp2Title", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "qLTYD", "name": "relMigrationBtn", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "GBk2u", "name": "migrationTxt", "fill": "$--accent-red", "content": "Shadcn Migration", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "Sy14T", "name": "expIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "u8ijV", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "PUXx5", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "6PUnO", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "PllIu", "name": "blTitle", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "ZbgbI", "name": "blTitleTxt", "rotation": -0.5285936385085725, "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10 } ] }, { "type": "text", "id": "eRoDO", "name": "blItem1", "fill": "$--primary", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "u1olR", "name": "blItem2", "fill": "$--primary", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "oUd9s", "name": "blItem3", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "yf0wj", "name": "History Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "dG7rj", "name": "histTitle", "fill": "$--muted-foreground", "content": "HISTORY", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "z2Mdy", "name": "histItem1", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "AsiWz", "name": "histItem1Hash", "fill": "$--accent-blue", "content": "a089f44 · feat: migrate to shadcn/ui", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "BdVhi", "name": "histItem1Date", "fill": "$--muted-foreground", "content": "Feb 16, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "piJNC", "name": "histItem2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "0PWoX", "name": "histItem2Hash", "fill": "$--accent-blue", "content": "5a4b4ac · feat: emoji favicon", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "xySNW", "name": "histItem2Date", "fill": "$--muted-foreground", "content": "Feb 15, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] } ] } ] } ] } ] } ] } ] }, { "type": "frame", "id": "x1AHT", "name": "lightStatusBar", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "e2UzJ", "name": "Status Left", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mlD58", "name": "versionIcon", "width": 14, "height": 14, "iconFontName": "box", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "hRBRa", "name": "versionText", "fill": "$--muted-foreground", "content": "v0.4.2", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "text", "id": "bFwrw", "name": "sep1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "ey3Gr", "name": "branchIcon", "width": 14, "height": 14, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "Kz0sS", "name": "branchText", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "6IY1E", "name": "sep2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "IjEG1", "name": "syncIcon", "width": 13, "height": 13, "iconFontName": "refresh-cw", "iconFontFamily": "lucide", "fill": "$--accent-green" }, { "type": "text", "id": "srxkr", "name": "syncText", "fill": "$--muted-foreground", "content": "Synced 2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "4jgQF", "name": "Status Right", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "3RPmA", "name": "aiIcon", "width": 13, "height": 13, "iconFontName": "sparkles", "iconFontFamily": "lucide", "fill": "$--accent-purple" }, { "type": "text", "id": "t0NOA", "name": "aiText", "fill": "$--muted-foreground", "content": "Claude Sonnet 4", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "16V7i", "name": "sep3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "PXVrd", "name": "notesCount", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "2FxCi", "name": "notesText", "fill": "$--muted-foreground", "content": "1,247 notes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "pB6ds", "name": "sep4", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "fRHKs", "name": "bellIcon", "width": 13, "height": 13, "iconFontName": "bell", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "2sEBS", "name": "settingsIcon", "width": 13, "height": 13, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "SC_all", "name": "Sidebar Collapse — All panels visible", "x": 0, "y": 7700, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "theme": { "Mode": "Light" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_all_title", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "SC_all_tl", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "SC_all_c", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_all_m", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_all_x", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "SC_all_content", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "SC_all_sb", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_all_sb_hdr", "name": "SidebarHeader", "width": "fill_container", "height": 32, "padding": [ 0, 8 ], "alignItems": "center", "justifyContent": "flex_end", "children": [ { "type": "frame", "id": "SC_all_sb_btn", "name": "collapseBtn", "width": 24, "height": 24, "cornerRadius": 4, "fill": "transparent", "alignItems": "center", "justifyContent": "center", "children": [ { "type": "icon_font", "id": "SC_all_sb_btn_icon", "name": "chevronIcon", "width": 14, "height": 14, "iconFontName": "caret-left-bold", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "SC_all_sb_nav", "name": "NavItems", "width": "fill_container", "layout": "vertical", "gap": 1, "padding": [ 4, 8 ], "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "SC_all_sb_t1", "text": "All Notes", "fontSize": 13, "fill": "$--foreground", "width": "fill_container", "padding": [ 6, 12 ] }, { "type": "text", "id": "SC_all_sb_t2", "text": "Favorites", "fontSize": 13, "fill": "$--muted-foreground", "width": "fill_container", "padding": [ 6, 12 ] }, { "type": "text", "id": "SC_all_sb_t3", "text": "Archive", "fontSize": 13, "fill": "$--muted-foreground", "width": "fill_container", "padding": [ 6, 12 ] }, { "type": "text", "id": "SC_all_sb_t4", "text": "Trash", "fontSize": 13, "fill": "$--muted-foreground", "width": "fill_container", "padding": [ 6, 12 ] } ] }, { "type": "frame", "id": "SC_all_sb_sec", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 8, 8 ], "children": [ { "type": "text", "id": "SC_all_sb_sh", "text": "SECTIONS", "fontSize": 11, "fill": "$--muted-foreground", "letterSpacing": 1.2, "width": "fill_container", "padding": [ 4, 12 ] }, { "type": "text", "id": "SC_all_sb_s1", "text": "Projects", "fontSize": 13, "fill": "$--foreground", "width": "fill_container", "padding": [ 6, 12 ] }, { "type": "text", "id": "SC_all_sb_s2", "text": "Experiments", "fontSize": 13, "fill": "$--muted-foreground", "width": "fill_container", "padding": [ 6, 12 ] } ] } ] }, { "type": "frame", "id": "SC_all_nl", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_all_nl_hdr", "name": "NoteListHeader", "width": "fill_container", "height": 40, "padding": [ 0, 12 ], "alignItems": "center", "justifyContent": "space_between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "SC_all_nl_title", "text": "All Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "SC_all_nl_count", "text": "42 notes", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "SC_all_nl_list", "name": "NoteItems", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "SC_all_nl_n1", "name": "noteItem1", "width": "fill_container", "padding": [ 10, 16 ], "fill": "$--accent", "children": [ { "type": "text", "id": "SC_all_nl_n1t", "text": "My First Project", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_all_nl_n2", "name": "noteItem2", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_all_nl_n2t", "text": "Weekly Review", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_all_nl_n3", "name": "noteItem3", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_all_nl_n3t", "text": "Meeting Notes", "fontSize": 13, "fill": "$--foreground" } ] } ] } ] }, { "type": "frame", "id": "SC_all_ed", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "SC_all_ed_tabs", "name": "TabBar", "width": "fill_container", "height": 36, "padding": [ 0, 8 ], "alignItems": "center", "gap": 4, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "fill": "$--background", "children": [ { "type": "frame", "id": "SC_all_ed_tab1", "name": "activeTab", "padding": [ 6, 12 ], "cornerRadius": [ 6, 6, 0, 0 ], "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--primary" }, "children": [ { "type": "text", "id": "SC_all_ed_tab1t", "text": "My First Project", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "SC_all_ed_content", "name": "EditorContent", "width": "fill_container", "height": "fill_container", "padding": [ 24, 48 ], "layout": "vertical", "gap": 12, "children": [ { "type": "text", "id": "SC_all_ed_h1", "text": "My First Project", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground", "width": "fill_container" }, { "type": "text", "id": "SC_all_ed_p1", "text": "This is the editor area with full markdown editing support.", "fontSize": 15, "fill": "$--foreground", "width": "fill_container", "lineHeight": 1.6 }, { "type": "text", "id": "SC_all_ed_p2", "text": "The editor expands to fill all available space when panels are collapsed.", "fontSize": 15, "fill": "$--muted-foreground", "width": "fill_container", "lineHeight": 1.6 } ] } ] } ] } ] }, { "type": "frame", "id": "SC_nosb", "name": "Sidebar Collapse — Sidebar collapsed", "x": 0, "y": 8700, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "theme": { "Mode": "Light" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_nosb_title", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "SC_nosb_tl", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "SC_nosb_c", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_nosb_m", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_nosb_x", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "SC_nosb_content", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "SC_nosb_nl", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_nosb_nl_hdr", "name": "NoteListHeader", "width": "fill_container", "height": 40, "padding": [ 0, 12 ], "alignItems": "center", "justifyContent": "space_between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "SC_nosb_nl_title", "text": "All Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "SC_nosb_nl_count", "text": "42 notes", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "SC_nosb_nl_list", "name": "NoteItems", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "SC_nosb_nl_n1", "name": "noteItem1", "width": "fill_container", "padding": [ 10, 16 ], "fill": "$--accent", "children": [ { "type": "text", "id": "SC_nosb_nl_n1t", "text": "My First Project", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_nosb_nl_n2", "name": "noteItem2", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_nosb_nl_n2t", "text": "Weekly Review", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_nosb_nl_n3", "name": "noteItem3", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_nosb_nl_n3t", "text": "Meeting Notes", "fontSize": 13, "fill": "$--foreground" } ] } ] } ] }, { "type": "frame", "id": "SC_nosb_ed", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "SC_nosb_ed_tabs", "name": "TabBar", "width": "fill_container", "height": 36, "padding": [ 0, 8 ], "alignItems": "center", "gap": 4, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "fill": "$--background", "children": [ { "type": "frame", "id": "SC_nosb_ed_tab1", "name": "activeTab", "padding": [ 6, 12 ], "cornerRadius": [ 6, 6, 0, 0 ], "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--primary" }, "children": [ { "type": "text", "id": "SC_nosb_ed_tab1t", "text": "My First Project", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "SC_nosb_ed_content", "name": "EditorContent", "width": "fill_container", "height": "fill_container", "padding": [ 24, 48 ], "layout": "vertical", "gap": 12, "children": [ { "type": "text", "id": "SC_nosb_ed_h1", "text": "My First Project", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground", "width": "fill_container" }, { "type": "text", "id": "SC_nosb_ed_p1", "text": "This is the editor area with full markdown editing support.", "fontSize": 15, "fill": "$--foreground", "width": "fill_container", "lineHeight": 1.6 }, { "type": "text", "id": "SC_nosb_ed_p2", "text": "The editor expands to fill all available space when panels are collapsed.", "fontSize": 15, "fill": "$--muted-foreground", "width": "fill_container", "lineHeight": 1.6 } ] } ] } ] } ] }, { "type": "frame", "id": "SC_edonly", "name": "Sidebar Collapse — Editor only", "x": 0, "y": 9700, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "theme": { "Mode": "Light" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_edonly_title", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "SC_edonly_tl", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "SC_edonly_c", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_edonly_m", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_edonly_x", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "SC_edonly_content", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "SC_edonly_ed", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "SC_edonly_ed_tabs", "name": "TabBar", "width": "fill_container", "height": 36, "padding": [ 0, 8 ], "alignItems": "center", "gap": 4, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "fill": "$--background", "children": [ { "type": "frame", "id": "SC_edonly_ed_tab1", "name": "activeTab", "padding": [ 6, 12 ], "cornerRadius": [ 6, 6, 0, 0 ], "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--primary" }, "children": [ { "type": "text", "id": "SC_edonly_ed_tab1t", "text": "My First Project", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "SC_edonly_ed_content", "name": "EditorContent", "width": "fill_container", "height": "fill_container", "padding": [ 24, 48 ], "layout": "vertical", "gap": 12, "children": [ { "type": "text", "id": "SC_edonly_ed_h1", "text": "My First Project", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground", "width": "fill_container" }, { "type": "text", "id": "SC_edonly_ed_p1", "text": "This is the editor area with full markdown editing support.", "fontSize": 15, "fill": "$--foreground", "width": "fill_container", "lineHeight": 1.6 }, { "type": "text", "id": "SC_edonly_ed_p2", "text": "The editor expands to fill all available space when panels are collapsed.", "fontSize": 15, "fill": "$--muted-foreground", "width": "fill_container", "lineHeight": 1.6 } ] } ] } ] } ] }, { "type": "frame", "id": "SC_ednl", "name": "Sidebar Collapse — Editor + notes", "x": 0, "y": 10700, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "theme": { "Mode": "Light" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_ednl_title", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "SC_ednl_tl", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "SC_ednl_c", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_ednl_m", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "SC_ednl_x", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "SC_ednl_content", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "SC_ednl_nl", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "SC_ednl_nl_hdr", "name": "NoteListHeader", "width": "fill_container", "height": 40, "padding": [ 0, 12 ], "alignItems": "center", "justifyContent": "space_between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "SC_ednl_nl_title", "text": "All Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "SC_ednl_nl_count", "text": "42 notes", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "SC_ednl_nl_list", "name": "NoteItems", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "SC_ednl_nl_n1", "name": "noteItem1", "width": "fill_container", "padding": [ 10, 16 ], "fill": "$--accent", "children": [ { "type": "text", "id": "SC_ednl_nl_n1t", "text": "My First Project", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_ednl_nl_n2", "name": "noteItem2", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_ednl_nl_n2t", "text": "Weekly Review", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "SC_ednl_nl_n3", "name": "noteItem3", "width": "fill_container", "padding": [ 10, 16 ], "children": [ { "type": "text", "id": "SC_ednl_nl_n3t", "text": "Meeting Notes", "fontSize": 13, "fill": "$--foreground" } ] } ] } ] }, { "type": "frame", "id": "SC_ednl_ed", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "SC_ednl_ed_tabs", "name": "TabBar", "width": "fill_container", "height": 36, "padding": [ 0, 8 ], "alignItems": "center", "gap": 4, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "fill": "$--background", "children": [ { "type": "frame", "id": "SC_ednl_ed_tab1", "name": "activeTab", "padding": [ 6, 12 ], "cornerRadius": [ 6, 6, 0, 0 ], "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--primary" }, "children": [ { "type": "text", "id": "SC_ednl_ed_tab1t", "text": "My First Project", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "SC_ednl_ed_content", "name": "EditorContent", "width": "fill_container", "height": "fill_container", "padding": [ 24, 48 ], "layout": "vertical", "gap": 12, "children": [ { "type": "text", "id": "SC_ednl_ed_h1", "text": "My First Project", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground", "width": "fill_container" }, { "type": "text", "id": "SC_ednl_ed_p1", "text": "This is the editor area with full markdown editing support.", "fontSize": 15, "fill": "$--foreground", "width": "fill_container", "lineHeight": 1.6 }, { "type": "text", "id": "SC_ednl_ed_p2", "text": "The editor expands to fill all available space when panels are collapsed.", "fontSize": 15, "fill": "$--muted-foreground", "width": "fill_container", "lineHeight": 1.6 } ] } ] } ] } ] }, { "type": "frame", "id": "FM_focus", "name": "Focus Mode — Distraction-free Writing", "x": 0, "y": 11700, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "theme": { "Mode": "Light" }, "layout": "vertical", "children": [ { "type": "frame", "id": "FM_SC_edonly_title", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "FM_SC_edonly_tl", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "FM_SC_edonly_c", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "FM_SC_edonly_m", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "FM_SC_edonly_x", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "FM_SC_edonly_content", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "FM_SC_edonly_ed", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "FM_SC_edonly_ed_tabs", "name": "TabBar", "width": "fill_container", "height": 36, "padding": [ 0, 8 ], "alignItems": "center", "gap": 4, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "fill": "$--background", "children": [ { "type": "frame", "id": "FM_SC_edonly_ed_tab1", "name": "activeTab", "padding": [ 6, 12 ], "cornerRadius": [ 6, 6, 0, 0 ], "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--primary" }, "children": [ { "type": "text", "id": "FM_SC_edonly_ed_tab1t", "text": "My First Project", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "FM_SC_edonly_ed_content", "name": "EditorContent", "width": "fill_container", "height": "fill_container", "padding": [ 24, 48 ], "layout": "vertical", "gap": 12, "children": [ { "type": "text", "id": "FM_SC_edonly_ed_h1", "text": "My First Project", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground", "width": "fill_container" }, { "type": "text", "id": "FM_SC_edonly_ed_p1", "text": "This is the editor area with full markdown editing support.", "fontSize": 15, "fill": "$--foreground", "width": "fill_container", "lineHeight": 1.6 }, { "type": "text", "id": "FM_SC_edonly_ed_p2", "text": "The editor expands to fill all available space when panels are collapsed.", "fontSize": 15, "fill": "$--muted-foreground", "width": "fill_container", "lineHeight": 1.6 } ] } ] } ] } ] }, { "type": "frame", "id": "X6DiX", "x": 0, "y": 12800, "name": "Full Layout — Editor Focused", "theme": { "Mode": "Light" }, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "QXp_S", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "a7ql_", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "PIagL", "name": "closeBtn", "fill": "#FF5F57", "width": 12, "height": 12 }, { "type": "ellipse", "id": "UkrIX", "name": "minimizeBtn", "fill": "#FEBC2E", "width": 12, "height": 12 }, { "type": "ellipse", "id": "rpllF", "name": "maximizeBtn", "fill": "#28C840", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "YHu8M", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "AUMkh", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": 0, "fill": "$--sidebar-border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "jIs8c", "name": "Filters", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 1, "padding": [ 8, 8, 16, 8 ], "children": [ { "type": "frame", "id": "uDixt", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "0ZAuF", "name": "leftAll", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "CvmcV", "name": "iconAll", "width": 18, "height": 18, "iconFontName": "tray-fill", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "_IXF5", "name": "fAllTxt", "fill": "$--foreground", "content": "Untagged", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "cc5p7", "name": "countAll", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "wekdD", "name": "badgeAllTxt", "fill": "$--muted-foreground", "content": "24", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "UzJob", "name": "filterUntagged", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "UassE", "name": "leftUntagged", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "94gjp", "name": "untaggedIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--primary" }, { "type": "text", "id": "Z4kx8", "name": "untaggedTxt", "fill": "$--primary", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "mxu-s", "name": "countUntagged", "height": 20, "fill": "$--primary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "766If", "name": "untaggedBadgeTxt", "fill": "$--primary-foreground", "content": "9247", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ], "fill": "#4a9eff18" }, { "type": "frame", "id": "j6x6d", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "2-DOi", "name": "leftTrash", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "otR4H", "name": "trashIcon", "width": 18, "height": 18, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "XnkPL", "name": "trashTxt", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "FVqx6", "name": "countTrash", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "3QQmO", "name": "trashBadgeTxt", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "IGH4B", "name": "filterChanges", "width": "fill_container", "cornerRadius": 6, "gap": 6, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "RM0XF", "name": "leftChanges", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "i-4iz", "name": "iconChanges", "width": 18, "height": 18, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "Px5GR", "name": "fChangesTxt", "fill": "$--foreground", "content": "Changes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "wO3WO", "name": "countChanges", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "YJxJn", "name": "badgeChangesTxt", "fill": "$--muted-foreground", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] }, { "type": "frame", "id": "jXROv", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "sO-XL", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "8e7Vt", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rcsfO", "name": "leftProj", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "gytXN", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "-s_mS", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "CwD_O", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "52A6U", "name": "projItem1", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "BgNaS", "name": "proj1Txt", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "VdDh5", "name": "projItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "A0wXl", "name": "proj2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "fZ-0x", "name": "projItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "TtXDd", "name": "proj3Txt", "fill": "$--muted-foreground", "content": "AI Habit Tracker", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "GZd6p", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "E6xqR", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "fa0Nk", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "S8AHA", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "xe_g8", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "XpuwI", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "shgFZ", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "8Ujcl", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "J4tD5", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "jdHxB", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "Gt0UH", "name": "Procedures", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "GFHmg", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "hiql_", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "hC4r1", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "TrVIO", "name": "leftPeople", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Dr2Jm", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "users", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "lzFwD", "name": "peopleLbl", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "u7Y66", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "v05Mj", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "KVmYN", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "P0NRp", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "NaHtD", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "YsEle", "name": "eventsLbl", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "b0yk2", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "oMYo2", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "TUZI-", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "6uK9k", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "WJIXx", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "3dn7l", "name": "eventsLbl", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "yPQuN", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "N-qVJ", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsXnU", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "aW1pQ", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "SQjcs", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "Vv4ha", "name": "eventsLbl", "fill": "$--foreground", "content": "Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "P1KUL", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "MhWVM", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "zgDZ5", "name": "leftEvents", "gap": 8, "padding": [ 8, 0 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "sMBNg", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "gFAJs", "name": "eventsLbl", "fill": "$--muted-foreground", "content": "Create new type", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "EyZli", "name": "Commit Area", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "layout": "vertical", "padding": 12, "children": [ { "type": "frame", "id": "1JRzZ", "name": "commitBtn", "width": "fill_container", "fill": "$--primary", "cornerRadius": 6, "gap": 6, "padding": [ 8, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "Ts-7a", "name": "commitIcon", "width": 14, "height": 14, "iconFontName": "git-commit-horizontal", "iconFontFamily": "lucide", "fill": "$--primary-foreground" }, { "type": "text", "id": "pEh20", "name": "commitTxt", "fill": "$--primary-foreground", "content": "Commit & Push", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "ZC4Tp", "name": "commitBadge", "height": 18, "fill": "#ffffff40", "cornerRadius": 9, "padding": [ 0, 5 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "dH3M0", "name": "commitBadgeTxt", "fill": "$--white", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] } ] }, { "type": "rectangle", "id": "iayXd", "name": "Resize Handle", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "KYP3S", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--card", "stroke": { "align": "inside", "thickness": 0, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "udhLQ", "name": "NoteList Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ajmdp", "name": "nlTitle", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "frame", "id": "5SvsJ", "name": "nlActions", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "qFJVP", "name": "searchIcon", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "cgafy", "name": "plusIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "koQ0J", "name": "Note Items", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "1H3yZ", "name": "Backlinks Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "3kSDX", "name": "Note Item Selected", "width": "fill_container", "fill": "$--accent-red-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "#E9E9E7" }, "children": [ { "type": "rectangle", "id": "Ha8HS", "name": "leftAccent", "fill": "$--accent-red", "width": 3, "height": "fill_container" }, { "type": "frame", "id": "pvIeZ", "name": "noteSelContent", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "miGdK", "name": "noteSelRow", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "XsFs9", "name": "titleGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "qGt0S", "name": "noteSelTitle", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "icon_font", "id": "nbrro", "name": "ico", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "lucide", "fill": "$--accent-red" } ] } ] }, { "type": "text", "id": "2ONoL", "name": "noteSelSnip", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "9An2M", "name": "noteSelTime", "fill": "$--accent-red", "content": "2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "kZZVQ", "name": "Related Notes Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "15OPP", "name": "Related Notes Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "VZfPV", "name": "rnLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "yt3sX", "name": "rnLabel", "fill": "$--muted-foreground", "content": "RELATED NOTES", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "rMUGk", "name": "rnCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "lxFxs", "name": "rnRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "T9Tni", "name": "rnFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "7zq2S", "name": "rnPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "k2dd-", "name": "rnChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "64sl5", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "Jgqoc", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "u-lDr", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Sx4pi", "name": "note2Title", "fill": "$--foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "FKgVd", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "Or7kg", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Redesigning portfolio site with modern stack and updated visual language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "icctC", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "lpkip", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "hV9DU", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "4MowJ", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "OqjO4", "name": "note2Title", "fill": "$--foreground", "content": "Sample note 2", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "geEmd", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "ya9zF", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "yfwf5", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "piEtY", "name": "Events Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "fOL6M", "name": "Events Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "cx0o6", "name": "evLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "4073P", "name": "evLabel", "fill": "$--muted-foreground", "content": "EVENTS", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "up3pe", "name": "evCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Sans", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "QCl7r", "name": "evRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "r-KNu", "name": "evFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "4-yEN", "name": "evPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "is8Ce", "name": "evChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "2Bw0D", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "bDrW1", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dIBZK", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "YXOiG", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "UHaDj", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "wHYGL", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "zyqm_", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "BVMQi", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "Kj543", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "_csvb", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "fsnPK", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "O3Je-", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "NGfVJ", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "dw3Za", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "rectangle", "id": "fKf2N", "name": "Resize Handle 2", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "MLegO", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "2UACq", "name": "Tab Bar", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "RjysZ", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "ZWVUX", "name": "tab1Txt", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "5xN9D", "name": "tab1Close", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "bqwJh", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "jxV4d", "name": "tab2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "ZS9l6", "name": "tab2Close", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "fqCqt", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "KdlSR", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "68hyI", "name": "iconPlus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "-LdMX", "name": "iconSplit", "width": 16, "height": 16, "iconFontName": "columns", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "tyTM3", "name": "iconExpand", "width": 16, "height": 16, "iconFontName": "arrows-out-simple", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "4w-0l", "name": "Editor Body", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "NuCqT", "name": "Editor Left", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "bkLPb", "name": "Info Bar", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "htutC", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "K65hN", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "3Xf0o", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "eNhLA", "name": "breadcrumbName", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "TLxAY", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "5hBHI", "name": "modifiedTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" } ] }, { "type": "frame", "id": "xfmHb", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "tzPx4", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "z9LJI", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "19AWC", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "8TamW", "name": "iconAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "a6NOM", "name": "iconMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "uoKNo", "name": "Editor Content", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 32, 64 ], "children": [ { "type": "text", "id": "bhmHx", "name": "editorP1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app, built with Tauri v2 + React + TypeScript + CodeMirror 6. It reads a vault of markdown files with YAML frontmatter and presents them in a four-panel UI inspired by Bear Notes.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "pmflZ", "name": "editorH2", "fill": "$--foreground", "content": "Architecture", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "YPHOR", "name": "editorP2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "The app uses a four-panel layout: Sidebar for navigation, NoteList for browsing, Editor for content, and Inspector for metadata. All data lives in markdown files with YAML frontmatter, git-versioned.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "8m_Ts", "name": "Inspector", "clip": true, "width": 260, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "left": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "gr1Z5", "name": "Inspector Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "608WF", "name": "leftGroup", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Bpugj", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "hxMyO", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "_i79H", "name": "sidebarIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "VgKF5", "name": "Inspector Body", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "frame", "id": "JeUUj", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "LEpT-", "name": "addPropBtn", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 12 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "1nsVc", "name": "addPropTxt", "fill": "$--muted-foreground", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "AUN9O", "name": "propType", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "EnTXQ", "name": "propTypeLbl", "fill": "$--muted-foreground", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "vS0Af", "name": "propTypeVal", "fill": "$--foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "s0Vdq", "name": "propStatus", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "UUhF3", "name": "propStatusLbl", "fill": "$--muted-foreground", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "UMqtv", "name": "propStatusBadge", "fill": "$--accent-green-light", "cornerRadius": 16, "stroke": { "align": "inside", "thickness": 1, "fill": "transparent" }, "gap": 8, "padding": [ 1, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "P2h15", "name": "Badge Text", "fill": "$--accent-green", "content": "ACTIVE", "lineHeight": 1.33, "textAlign": "center", "textAlignVertical": "middle", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] } ] }, { "type": "frame", "id": "Ye0W8", "name": "propOwner", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ZvN9n", "name": "propOwnerLbl", "fill": "$--muted-foreground", "content": "OWNER", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "p18lp", "name": "propOwnerVal", "fill": "$--foreground", "content": "Luca", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "YgQHc", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "MK0WC", "name": "relGroup1", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "_rh_c", "name": "relGrp1Title", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "wQayu", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "5BZc-", "name": "laputaTxt", "fill": "$--accent-green", "content": "Laputa", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "bj3hA", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "9NFxD", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "HoFKQ", "name": "laputaTxt", "fill": "$--accent-green", "content": "Building", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "U_GEF", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "Hf4E8", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "yVLK0", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "EShyo", "name": "relGroup2", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "CPHxH", "name": "relGrp2Title", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "F4ygG", "name": "relMigrationBtn", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "5xPef", "name": "migrationTxt", "fill": "$--accent-red", "content": "Shadcn Migration", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "tLBGZ", "name": "expIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "3UaSi", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "suN12", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "zL5_Y", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "JbVdn", "name": "blTitle", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "ob0bb", "name": "blTitleTxt", "rotation": -0.5285936385085725, "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "text", "id": "3ZsuW", "name": "blItem1", "fill": "$--primary", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "wkQVV", "name": "blItem2", "fill": "$--primary", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "6s0lo", "name": "blItem3", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "r7vXk", "name": "History Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "iw_bo", "name": "histTitle", "fill": "$--muted-foreground", "content": "HISTORY", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "xzvFM", "name": "histItem1", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "Ut4ez", "name": "histItem1Hash", "fill": "$--accent-blue", "content": "a089f44 · feat: migrate to shadcn/ui", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "svS7D", "name": "histItem1Date", "fill": "$--muted-foreground", "content": "Feb 16, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "rwIrR", "name": "histItem2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "l6CYP", "name": "histItem2Hash", "fill": "$--accent-blue", "content": "5a4b4ac · feat: emoji favicon", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "httIc", "name": "histItem2Date", "fill": "$--muted-foreground", "content": "Feb 15, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] } ] } ] } ] } ] } ] } ] }, { "type": "frame", "id": "Lo-el", "name": "lightStatusBar", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "b51Tr", "name": "Status Left", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "ojWSJ", "name": "versionIcon", "width": 14, "height": 14, "iconFontName": "box", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "qB18p", "name": "versionText", "fill": "$--muted-foreground", "content": "v0.4.2", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "text", "id": "ykdyj", "name": "sep1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "3B0P6", "name": "branchIcon", "width": 14, "height": 14, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "HpD4X", "name": "branchText", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "6RVGg", "name": "sep2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "h9Ul_", "name": "syncIcon", "width": 13, "height": 13, "iconFontName": "refresh-cw", "iconFontFamily": "lucide", "fill": "$--accent-green" }, { "type": "text", "id": "yer4n", "name": "syncText", "fill": "$--muted-foreground", "content": "Synced 2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Ggt4q", "name": "Status Right", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "YowOM", "name": "aiIcon", "width": 13, "height": 13, "iconFontName": "sparkles", "iconFontFamily": "lucide", "fill": "$--accent-purple" }, { "type": "text", "id": "bVd9g", "name": "aiText", "fill": "$--muted-foreground", "content": "Claude Sonnet 4", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "8QSq1", "name": "sep3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "z-rFh", "name": "notesCount", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "U_qqx", "name": "notesText", "fill": "$--muted-foreground", "content": "1,247 notes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "MQE9Z", "name": "sep4", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "XB_ZN", "name": "bellIcon", "width": 13, "height": 13, "iconFontName": "bell", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "gmulL", "name": "settingsIcon", "width": 13, "height": 13, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "QR-Au", "x": 0, "y": 13900, "name": "Full Layout — Search Panel Active", "theme": { "Mode": "Light" }, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "D2byp", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "EDFgx", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "DfcH7", "name": "closeBtn", "fill": "#FF5F57", "width": 12, "height": 12 }, { "type": "ellipse", "id": "k4jwL", "name": "minimizeBtn", "fill": "#FEBC2E", "width": 12, "height": 12 }, { "type": "ellipse", "id": "4la7Z", "name": "maximizeBtn", "fill": "#28C840", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "md1g3", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "A_kBk", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": 0, "fill": "$--sidebar-border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "GLS8B", "name": "Filters", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 1, "padding": [ 8, 8, 16, 8 ], "children": [ { "type": "frame", "id": "5KmsU", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "CO7qs", "name": "leftAll", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "UqiN-", "name": "iconAll", "width": 18, "height": 18, "iconFontName": "tray-fill", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "GQxwa", "name": "fAllTxt", "fill": "$--foreground", "content": "Untagged", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "OszI0", "name": "countAll", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "aws3Z", "name": "badgeAllTxt", "fill": "$--muted-foreground", "content": "24", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "dwASK", "name": "filterUntagged", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "RFfYP", "name": "leftUntagged", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "b4vff", "name": "untaggedIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--primary" }, { "type": "text", "id": "t3WAm", "name": "untaggedTxt", "fill": "$--primary", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "fHpat", "name": "countUntagged", "height": 20, "fill": "$--primary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "ZOPgU", "name": "untaggedBadgeTxt", "fill": "$--primary-foreground", "content": "9247", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ], "fill": "#4a9eff18" }, { "type": "frame", "id": "xfTev", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Y4E4C", "name": "leftTrash", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "kK01T", "name": "trashIcon", "width": 18, "height": 18, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "-LXnc", "name": "trashTxt", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "nt-Xb", "name": "countTrash", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "rRo0q", "name": "trashBadgeTxt", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "F3pkw", "name": "filterChanges", "width": "fill_container", "cornerRadius": 6, "gap": 6, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "wcNVU", "name": "leftChanges", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "xhrmm", "name": "iconChanges", "width": 18, "height": 18, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "prgnw", "name": "fChangesTxt", "fill": "$--foreground", "content": "Changes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "PugNW", "name": "countChanges", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "5bfMY", "name": "badgeChangesTxt", "fill": "$--muted-foreground", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] }, { "type": "frame", "id": "JUzOE", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "OXkKG", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "G9YEB", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "jL0bz", "name": "leftProj", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "1LJDb", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "fsRhn", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "EK_iu", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "_MfW7", "name": "projItem1", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "buYPs", "name": "proj1Txt", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "TsI_D", "name": "projItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "_h7S1", "name": "proj2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "bNfnr", "name": "projItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "9SY8F", "name": "proj3Txt", "fill": "$--muted-foreground", "content": "AI Habit Tracker", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "CjIEL", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "U5NLf", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "5yyfh", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "hjjpp", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "8paVp", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "YKDWL", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "lmqzR", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "UOvjm", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "j6Mzi", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "hTccp", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "0o3Rd", "name": "Procedures", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "CuU3s", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "Lbn-0", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "k4VBq", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Ilgp-", "name": "leftPeople", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "AK0H9", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "users", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "s9plC", "name": "peopleLbl", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "Ry1Km", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "Xo_LE", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "x-sYh", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "XG0mM", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "xinWJ", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "5YiYH", "name": "eventsLbl", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "4kX5T", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "N2Kl0", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "OC_Wz", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "_COf_", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "5ddUS", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "mYK3y", "name": "eventsLbl", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "CUHPs", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "c-AgB", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "updPo", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "kIAbE", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "JQy54", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "Hh9wq", "name": "eventsLbl", "fill": "$--foreground", "content": "Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "27zSn", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "FQdQQ", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "FWkK6", "name": "leftEvents", "gap": 8, "padding": [ 8, 0 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "V0gxx", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "AM8SJ", "name": "eventsLbl", "fill": "$--muted-foreground", "content": "Create new type", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "a4iCv", "name": "Commit Area", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "layout": "vertical", "padding": 12, "children": [ { "type": "frame", "id": "c6wjQ", "name": "commitBtn", "width": "fill_container", "fill": "$--primary", "cornerRadius": 6, "gap": 6, "padding": [ 8, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "8YmeU", "name": "commitIcon", "width": 14, "height": 14, "iconFontName": "git-commit-horizontal", "iconFontFamily": "lucide", "fill": "$--primary-foreground" }, { "type": "text", "id": "3miZQ", "name": "commitTxt", "fill": "$--primary-foreground", "content": "Commit & Push", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "YXy6F", "name": "commitBadge", "height": 18, "fill": "#ffffff40", "cornerRadius": 9, "padding": [ 0, 5 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "9q2NX", "name": "commitBadgeTxt", "fill": "$--white", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] } ] }, { "type": "rectangle", "id": "S5zsk", "name": "Resize Handle", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "RL1ew", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--card", "stroke": { "align": "inside", "thickness": 0, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "AVROe", "name": "NoteList Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "3Dlx5", "name": "nlTitle", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "frame", "id": "B_hDb", "name": "nlActions", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "1o_2j", "name": "searchIcon", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "wI4DJ", "name": "plusIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "Rqh8Y", "name": "Note Items", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "GsD3O", "name": "Backlinks Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "O3ith", "name": "Note Item Selected", "width": "fill_container", "fill": "$--accent-red-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "#E9E9E7" }, "children": [ { "type": "rectangle", "id": "LmFnl", "name": "leftAccent", "fill": "$--accent-red", "width": 3, "height": "fill_container" }, { "type": "frame", "id": "6jJVC", "name": "noteSelContent", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "3eUuB", "name": "noteSelRow", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "HwQTu", "name": "titleGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "oh0Nx", "name": "noteSelTitle", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "icon_font", "id": "92t6N", "name": "ico", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "lucide", "fill": "$--accent-red" } ] } ] }, { "type": "text", "id": "iapFF", "name": "noteSelSnip", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "dbFN3", "name": "noteSelTime", "fill": "$--accent-red", "content": "2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "-5PW8", "name": "Related Notes Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "IkgDl", "name": "Related Notes Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "el34m", "name": "rnLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "ffLM0", "name": "rnLabel", "fill": "$--muted-foreground", "content": "RELATED NOTES", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "A7jbI", "name": "rnCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "6Cw-D", "name": "rnRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "EkBrm", "name": "rnFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "OiAPI", "name": "rnPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "IFfVO", "name": "rnChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "XG9Tg", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "ibW95", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "_MlWz", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "MZJ5r", "name": "note2Title", "fill": "$--foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "_qdsw", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "2liVx", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Redesigning portfolio site with modern stack and updated visual language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "TCQuI", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "43UHB", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "DSC7W", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "fjSDQ", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "wTu8C", "name": "note2Title", "fill": "$--foreground", "content": "Sample note 2", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "1QPiQ", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] } ] }, { "type": "text", "id": "43L7m", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "RcKQy", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "GnvhS", "name": "Events Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "D_Dxu", "name": "Events Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "vDIey", "name": "evLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "q7YSK", "name": "evLabel", "fill": "$--muted-foreground", "content": "EVENTS", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "HrCep", "name": "evCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Sans", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "KC4JY", "name": "evRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "8Bqzc", "name": "evFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "Ncjba", "name": "evPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "wVeQy", "name": "evChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "LLaDT", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "dk5T8", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "yq1MX", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "azv9n", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "bzPbO", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "W2zQX", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "yiflh", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "qpVBh", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "H2GoU", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "jUxXL", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "zlSrF", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "QFA7g", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "S7tfE", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "84akW", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "rectangle", "id": "kqcSS", "name": "Resize Handle 2", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "yI94h", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "IbaLP", "name": "Tab Bar", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "WFTLH", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "5qYgu", "name": "tab1Txt", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "TG1oa", "name": "tab1Close", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "s3CbP", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "LJqW3", "name": "tab2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "9u2Lp", "name": "tab2Close", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "beMtf", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "2jnhM", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "DB5oM", "name": "iconPlus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "aD6Zp", "name": "iconSplit", "width": 16, "height": 16, "iconFontName": "columns", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "jOY8N", "name": "iconExpand", "width": 16, "height": 16, "iconFontName": "arrows-out-simple", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "RIloA", "name": "Editor Body", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "xQh-S", "name": "Search Scrim", "x": 0, "y": 0, "width": "fill_container", "height": "fill_container", "fill": "#00000008" }, { "type": "frame", "id": "O1H0q", "name": "Editor Left", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "yVgkY", "name": "Info Bar", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "6R_ol", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "hqrF6", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "wri-y", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "aJ9Ij", "name": "breadcrumbName", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "PXDzs", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "Y7ORU", "name": "modifiedTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" } ] }, { "type": "frame", "id": "3mw5a", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "TLrxL", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "3qqRK", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "k_wJK", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "l1J1b", "name": "iconAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "OYxYL", "name": "iconMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "L5ga1", "name": "Editor Content", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 32, 64 ], "children": [ { "type": "text", "id": "31dfV", "name": "editorP1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app, built with Tauri v2 + React + TypeScript + CodeMirror 6. It reads a vault of markdown files with YAML frontmatter and presents them in a four-panel UI inspired by Bear Notes.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "hT17f", "name": "editorH2", "fill": "$--foreground", "content": "Architecture", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "rhk-8", "name": "editorP2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "The app uses a four-panel layout: Sidebar for navigation, NoteList for browsing, Editor for content, and Inspector for metadata. All data lives in markdown files with YAML frontmatter, git-versioned.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "GmAF6", "name": "Inspector", "clip": true, "width": 260, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "left": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "x_zWw", "name": "Inspector Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "jusHS", "name": "leftGroup", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "jAvXS", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "2DFD2", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "h3_LP", "name": "sidebarIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "fAW8G", "name": "Inspector Body", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "frame", "id": "6kMFv", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "o0GPt", "name": "addPropBtn", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 12 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "nFYSs", "name": "addPropTxt", "fill": "$--muted-foreground", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Lix0z", "name": "propType", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ui6BQ", "name": "propTypeLbl", "fill": "$--muted-foreground", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "xvb_A", "name": "propTypeVal", "fill": "$--foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "EoxR3", "name": "propStatus", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "mhPbZ", "name": "propStatusLbl", "fill": "$--muted-foreground", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "V8dLb", "name": "propStatusBadge", "fill": "$--accent-green-light", "cornerRadius": 16, "stroke": { "align": "inside", "thickness": 1, "fill": "transparent" }, "gap": 8, "padding": [ 1, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "HklId", "name": "Badge Text", "fill": "$--accent-green", "content": "ACTIVE", "lineHeight": 1.33, "textAlign": "center", "textAlignVertical": "middle", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] } ] } ] }, { "type": "frame", "id": "xWWeV", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "faCRJ", "name": "relGroup1", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "e4hku", "name": "relGrp1Title", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "Ucmgk", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "HP94T", "name": "laputaTxt", "fill": "$--accent-green", "content": "Laputa", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "VCM1s", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "NKNrl", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "7Fgue", "name": "laputaTxt", "fill": "$--accent-green", "content": "Building", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "ot-0i", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "p85Ij", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "twL0t", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "L799V", "name": "relGroup2", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "hT1h0", "name": "relGrp2Title", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "D_WgI", "name": "relMigrationBtn", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ec81_", "name": "migrationTxt", "fill": "$--accent-red", "content": "Shadcn Migration", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "S-vxq", "name": "expIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "qiAMM", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ny0XL", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "EW804", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "iakOI", "name": "blTitle", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "mIh0h", "name": "blTitleTxt", "rotation": -0.5285936385085725, "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "text", "id": "qRWB3", "name": "blItem1", "fill": "$--primary", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "W5Kbo", "name": "blItem2", "fill": "$--primary", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "74gGV", "name": "blItem3", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "MGyob", "name": "History Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "yQzzw", "name": "histTitle", "fill": "$--muted-foreground", "content": "HISTORY", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "D4Tgg", "name": "histItem1", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "WGiuL", "name": "histItem1Hash", "fill": "$--accent-blue", "content": "a089f44 · feat: migrate to shadcn/ui", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "it7Kq", "name": "histItem1Date", "fill": "$--muted-foreground", "content": "Feb 16, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "q_JXB", "name": "histItem2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "FvrLg", "name": "histItem2Hash", "fill": "$--accent-blue", "content": "5a4b4ac · feat: emoji favicon", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "kDCXM", "name": "histItem2Date", "fill": "$--muted-foreground", "content": "Feb 15, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "frame", "id": "iCeGZ", "name": "Search Panel", "x": 80, "y": 60, "width": 480, "fill": "$--card", "cornerRadius": 12, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "shadow": [ { "x": 0, "y": 8, "blur": 32, "spread": -4, "fill": "#00000020" } ], "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "CF2zr", "name": "searchInputRow", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 14, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "O_fof", "name": "searchIcon", "width": 18, "height": 18, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--primary" }, { "type": "text", "id": "iLTe7", "name": "searchQuery", "fill": "$--foreground", "content": "time management", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "normal" }, { "type": "frame", "id": "Ouy78", "name": "searchClearBtn", "width": 20, "height": 20, "fill": "$--muted", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "mI1q5", "name": "clearX", "width": 12, "height": 12, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "fGvPp", "name": "resultsHeader", "width": "fill_container", "padding": [ 8, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "h0VR7", "name": "resultsCount", "fill": "$--muted-foreground", "content": "3 results", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" } ] }, { "type": "frame", "id": "8NV5p", "name": "searchResult1", "width": "fill_container", "fill": "$--accent-blue-light", "layout": "vertical", "gap": 4, "padding": [ 10, 16 ], "children": [ { "type": "frame", "id": "nGwMG", "name": "sr1Row", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "fselJ", "name": "sr1Title", "fill": "$--foreground", "content": "Time Management Strategies", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "icon_font", "id": "6BhB1", "name": "sr1Icon", "width": 14, "height": 14, "iconFontName": "leaf", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "text", "id": "mrzGz", "name": "sr1Snippet", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Effective time management requires clear priorities and consistent review cycles...", "lineHeight": 1.4, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "uGf_u", "name": "searchResult2", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 10, 16 ], "children": [ { "type": "frame", "id": "M3Z_b", "name": "sr2Row", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "_afkK", "name": "sr2Title", "fill": "$--foreground", "content": "Weekly Review Process", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "f9OL0", "name": "sr2Icon", "width": 14, "height": 14, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] }, { "type": "text", "id": "Rn89e", "name": "sr2Snippet", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Every Sunday: review tasks, update time blocks, plan the week ahead...", "lineHeight": 1.4, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "D4qLW", "name": "searchResult3", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 10, 16, 14, 16 ], "children": [ { "type": "frame", "id": "dXBPc", "name": "sr3Row", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "7eWQ_", "name": "sr3Title", "fill": "$--foreground", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "0KeJ1", "name": "sr3Icon", "width": 14, "height": 14, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] }, { "type": "text", "id": "UcByL", "name": "sr3Snippet", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Allocated time management focus blocks in Q1 for deep work sessions...", "lineHeight": 1.4, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "IMqpw", "name": "searchFooter", "width": "fill_container", "fill": "$--muted", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "gap": 16, "padding": [ 8, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "6gOIh", "name": "footerHint1", "fill": "$--muted-foreground", "content": "↑↓ Navigate", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "LHkSK", "name": "footerHint2", "fill": "$--muted-foreground", "content": "↵ Open", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "qqfIt", "name": "footerHint3", "fill": "$--muted-foreground", "content": "Esc Close", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] } ] }, { "type": "frame", "id": "L0KqX", "name": "lightStatusBar", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Np9m-", "name": "Status Left", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "V3HFi", "name": "versionIcon", "width": 14, "height": 14, "iconFontName": "box", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "YkNbh", "name": "versionText", "fill": "$--muted-foreground", "content": "v0.4.2", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "text", "id": "JH56P", "name": "sep1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "qL-f2", "name": "branchIcon", "width": 14, "height": 14, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "yro7z", "name": "branchText", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "CXGWw", "name": "sep2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "xOHNm", "name": "syncIcon", "width": 13, "height": 13, "iconFontName": "refresh-cw", "iconFontFamily": "lucide", "fill": "$--accent-green" }, { "type": "text", "id": "j4lBc", "name": "syncText", "fill": "$--muted-foreground", "content": "Synced 2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "ihq0v", "name": "Status Right", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "kz722", "name": "aiIcon", "width": 13, "height": 13, "iconFontName": "sparkles", "iconFontFamily": "lucide", "fill": "$--accent-purple" }, { "type": "text", "id": "qzFAM", "name": "aiText", "fill": "$--muted-foreground", "content": "Claude Sonnet 4", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "stI-S", "name": "sep3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "DXxdw", "name": "notesCount", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "OehL-", "name": "notesText", "fill": "$--muted-foreground", "content": "1,247 notes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "ZNpGu", "name": "sep4", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "g-Zfe", "name": "bellIcon", "width": 13, "height": 13, "iconFontName": "bell", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "nUudo", "name": "settingsIcon", "width": 13, "height": 13, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "6DhJh", "x": 0, "y": 15000, "name": "Full Layout — Rich Properties + Autocomplete", "theme": { "Mode": "Light" }, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "U52CB", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "9xPhv", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "xK0i1", "name": "closeBtn", "fill": "#FF5F57", "width": 12, "height": 12 }, { "type": "ellipse", "id": "W-zEa", "name": "minimizeBtn", "fill": "#FEBC2E", "width": 12, "height": 12 }, { "type": "ellipse", "id": "Lz9Ly", "name": "maximizeBtn", "fill": "#28C840", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "-eZ2Q", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "qWB0S", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": 0, "fill": "$--sidebar-border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "MJJ3h", "name": "Filters", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 1, "padding": [ 8, 8, 16, 8 ], "children": [ { "type": "frame", "id": "Apugb", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "MRMwA", "name": "leftAll", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "bF9xl", "name": "iconAll", "width": 18, "height": 18, "iconFontName": "tray-fill", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "vDABp", "name": "fAllTxt", "fill": "$--foreground", "content": "Untagged", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "uMV2b", "name": "countAll", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "5CjlO", "name": "badgeAllTxt", "fill": "$--muted-foreground", "content": "24", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "nYVMy", "name": "filterUntagged", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "y2a7H", "name": "leftUntagged", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "GTbCN", "name": "untaggedIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "MyPei", "name": "untaggedTxt", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "Jq-_7", "name": "countUntagged", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "sq-ni", "name": "untaggedBadgeTxt", "fill": "$--muted-foreground", "content": "6", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "OwWRW", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "nEDEe", "name": "leftTrash", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "q71pa", "name": "trashIcon", "width": 18, "height": 18, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "ycx_R", "name": "trashTxt", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "q1o3f", "name": "countTrash", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "JDhNE", "name": "trashBadgeTxt", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "1cNey", "name": "filterChanges", "width": "fill_container", "cornerRadius": 6, "gap": 6, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "3Zjt9", "name": "leftChanges", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "HwG_w", "name": "iconChanges", "width": 18, "height": 18, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "hsvfN", "name": "fChangesTxt", "fill": "$--foreground", "content": "Changes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "3iQa3", "name": "countChanges", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "IpnSM", "name": "badgeChangesTxt", "fill": "$--muted-foreground", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] }, { "type": "frame", "id": "4zVQn", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "2KL00", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "60D7x", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Ns0Uw", "name": "leftProj", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "TlBFF", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "DU0f7", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "LhRc1", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "XpysB", "name": "projItem1", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "EHkKO", "name": "proj1Txt", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "PY1Qz", "name": "projItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "lklgj", "name": "proj2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "uDbn3", "name": "projItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "4p5Tw", "name": "proj3Txt", "fill": "$--muted-foreground", "content": "AI Habit Tracker", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "lTCT0", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "lNMXl", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "Sifl6", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Lzww_", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "MDzfV", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "nIT14", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "jxdL-", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "K6ZYE", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "0yx1-", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "q8gWU", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "UFUbg", "name": "Procedures", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "znhle", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "sVqwB", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "x5bql", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rT7Sw", "name": "leftPeople", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "EdWKN", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "users", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "IeV1X", "name": "peopleLbl", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "ijXZt", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "jJrjZ", "name": "personItem1", "width": "fill_container", "fill": "$--accent-yellow-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "2qK41", "name": "person1Txt", "fill": "$--accent-yellow", "content": "Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "RhLex", "name": "personItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "o6wg_", "name": "person2Txt", "fill": "$--muted-foreground", "content": "Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "_tP3q", "name": "personItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "tLGQc", "name": "person3Txt", "fill": "$--muted-foreground", "content": "Sarah", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "HNWez", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "4TSY6", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "esbbT", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "6v9eG", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "Gbmba", "name": "eventsLbl", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "4HZQC", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "k8Qek", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "ZJKIA", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "aOgWv", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "4uMpd", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "55-Jj", "name": "eventsLbl", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "C5q2c", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "Dl7QT", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "zssYh", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "XuI_M", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "hKKJ2", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "HJ6Sg", "name": "eventsLbl", "fill": "$--foreground", "content": "Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "R9E3Y", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "KyUdZ", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "7E72I", "name": "leftEvents", "gap": 8, "padding": [ 8, 0 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "akfbn", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "NUGRe", "name": "eventsLbl", "fill": "$--muted-foreground", "content": "Create new type", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "uAgKJ", "name": "Commit Area", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "layout": "vertical", "padding": 12, "children": [ { "type": "frame", "id": "0zA0z", "name": "commitBtn", "width": "fill_container", "fill": "$--primary", "cornerRadius": 6, "gap": 6, "padding": [ 8, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "w07m8", "name": "commitIcon", "width": 14, "height": 14, "iconFontName": "git-commit-horizontal", "iconFontFamily": "lucide", "fill": "$--primary-foreground" }, { "type": "text", "id": "4D-Y_", "name": "commitTxt", "fill": "$--primary-foreground", "content": "Commit & Push", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "vWH8M", "name": "commitBadge", "height": 18, "fill": "#ffffff40", "cornerRadius": 9, "padding": [ 0, 5 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "969L9", "name": "commitBadgeTxt", "fill": "$--white", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] } ] }, { "type": "rectangle", "id": "UYNhO", "name": "Resize Handle", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "m93C0", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--card", "stroke": { "align": "inside", "thickness": 0, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "978jd", "name": "NoteList Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "hSxft", "name": "nlTitle", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "frame", "id": "vOlfM", "name": "nlActions", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "8oc-r", "name": "searchIcon", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "oF9bA", "name": "plusIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "e99_i", "name": "Note Items", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "3lYpU", "name": "Backlinks Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "lmika", "name": "Note Item Selected", "width": "fill_container", "fill": "$--accent-yellow-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "#E9E9E7" }, "children": [ { "type": "rectangle", "id": "B3XPh", "name": "leftAccent", "fill": "$--accent-yellow", "width": 3, "height": "fill_container" }, { "type": "frame", "id": "_6k8_", "name": "noteSelContent", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "3aPer", "name": "noteSelRow", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "CKtmP", "name": "titleGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "4sDfy", "name": "noteSelTitle", "fill": "$--foreground", "content": "Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "icon_font", "id": "C_5rR", "name": "ico", "width": 14, "height": 14, "iconFontName": "users", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "2j16A", "name": "noteSelSnip", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Engineering lead at Acme Corp, focused on infrastructure and platform...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "4aybL", "name": "noteSelTime", "fill": "$--accent-yellow", "content": "3h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "-2gWn", "name": "Related Notes Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "ZDyjn", "name": "Related Notes Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "C3498", "name": "rnLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "L6f44", "name": "rnLabel", "fill": "$--muted-foreground", "content": "RELATED NOTES", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "SP2mP", "name": "rnCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "VUxRC", "name": "rnRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "K0u69", "name": "rnFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "5I6Q6", "name": "rnPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "nWc9j", "name": "rnChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "0g78J", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "UYt-3", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "UHgKQ", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "I3Kzu", "name": "note2Title", "fill": "$--foreground", "content": "Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "2SrYa", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "users", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "u9IDo", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Product manager working on growth initiatives and user research...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "bIgVf", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "ZCkrg", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "2HTTQ", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "lpW_m", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Yjt0e", "name": "note2Title", "fill": "$--foreground", "content": "Sarah", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "n8Bdp", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "users", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "sBpy_", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Designer specializing in design systems and component libraries...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "SfEiI", "name": "note2Time", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "UjKyN", "name": "Events Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "1ieBk", "name": "Events Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "jL0Cn", "name": "evLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "WPdoU", "name": "evLabel", "fill": "$--muted-foreground", "content": "EVENTS", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "begIt", "name": "evCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Sans", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "unj5n", "name": "evRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "96nxy", "name": "evFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "anHN8", "name": "evPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "51Def", "name": "evChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "1Y6r5", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "NtQjv", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "AGbrd", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "xla4h", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "_FbgU", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "0VoCK", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "6Xbdy", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "KazQF", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "1_Cz1", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "s4GwN", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "U3H8E", "name": "note3Title", "fill": "$--foreground", "content": "Meeting with Matteo", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "gqOjx", "name": "calIco", "width": 14, "height": 14, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "-o6br", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "N4dE4", "name": "note3Time", "fill": "$--muted-foreground", "content": "Yesterday", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "rectangle", "id": "hli5_", "name": "Resize Handle 2", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "OSNm1", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "0bMNp", "name": "Tab Bar", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "MIU7l", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "08oJY", "name": "tab1Txt", "fill": "$--foreground", "content": "Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "Nb4TP", "name": "tab1Close", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "x41zt", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "OeJUm", "name": "tab2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "j0rhL", "name": "tab2Close", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "JSjRx", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "K33DX", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "cvEPw", "name": "iconPlus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "l33JZ", "name": "iconSplit", "width": 16, "height": 16, "iconFontName": "columns", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "CnxJJ", "name": "iconExpand", "width": 16, "height": 16, "iconFontName": "arrows-out-simple", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "2tTb3", "name": "Editor Body", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "VvcZt", "name": "Editor Left", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "FS1KF", "name": "Info Bar", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "IRSz3", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "CPWzB", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Person", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "vGAbj", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "3UmsD", "name": "breadcrumbName", "fill": "$--foreground", "content": "Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "DN8so", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "kXgl0", "name": "modifiedTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" } ] }, { "type": "frame", "id": "3wpHS", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "MDVCo", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "N_aAh", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "3BBMe", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "tKvI2", "name": "iconAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "D88o2", "name": "iconMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "vlazI", "name": "Editor Content", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 32, 64 ], "children": [ { "type": "text", "id": "gabKY", "name": "editorP1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Grant is an engineering lead at Acme Corp, focused on infrastructure, Kubernetes, and platform reliability. He drives the technical roadmap for backend systems and mentors junior engineers.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "rZOkl", "name": "editorH2", "fill": "$--foreground", "content": "Key Responsibilities", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "VqiRL", "name": "editorP2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Leads the infrastructure team. Oversees Kubernetes cluster management, CI/CD pipelines, and service mesh. Reports to CTO. Weekly 1:1 on Thursdays.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "B_y3t", "name": "Inspector", "clip": true, "width": 260, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "left": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "IY9fD", "name": "Inspector Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "w2rRY", "name": "leftGroup", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "rCy6H", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "74Es2", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "pRO4e", "name": "sidebarIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "iSZtX", "name": "Inspector Body", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "frame", "id": "FGspn", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "9Cl0d", "name": "addPropBtn", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 12 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "qqk-x", "name": "addPropTxt", "fill": "$--muted-foreground", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "10Rpz", "name": "propType", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "BCqzK", "name": "propTypeLbl", "fill": "$--muted-foreground", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "l7rGQ", "name": "propTypeVal", "fill": "$--foreground", "content": "Person", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "X-DIV", "name": "propCompany", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "_jYqg", "name": "propCompanyLbl", "fill": "$--muted-foreground", "content": "COMPANY", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "hBEEy", "name": "propCompanyVal", "fill": "$--foreground", "content": "Acme Corp", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "DplyA", "name": "propRole", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Artv7", "name": "propRoleLbl", "fill": "$--muted-foreground", "content": "ROLE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "ZtdR4", "name": "propRoleVal", "fill": "$--foreground", "content": "Eng Lead", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "kr9yE", "name": "propStatus", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "lCQ2c", "name": "propStatusLbl", "fill": "$--muted-foreground", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "UktKt", "name": "propStatusBadge", "fill": "$--accent-green-light", "cornerRadius": 16, "stroke": { "align": "inside", "thickness": 1, "fill": "transparent" }, "gap": 8, "padding": [ 1, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "PZMuf", "name": "Badge Text", "fill": "$--accent-green", "content": "ACTIVE", "lineHeight": 1.33, "textAlign": "center", "textAlignVertical": "middle", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] } ] }, { "type": "frame", "id": "uq-Ch", "name": "propTags", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "9-GAi", "name": "propTagsLbl", "fill": "$--muted-foreground", "content": "TAGS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "um9TH", "name": "tagsList", "width": "fill_container", "gap": 4, "flexWrap": "wrap", "children": [ { "type": "frame", "id": "pAZPG", "name": "tag1", "fill": "$--accent-green-light", "cornerRadius": 4, "padding": [ 2, 6 ], "alignItems": "center", "children": [ { "type": "text", "id": "LxWxl", "name": "tag1Txt", "fill": "$--accent-green", "content": "infrastructure", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" } ] }, { "type": "frame", "id": "uu7oj", "name": "tag2", "fill": "$--accent-blue-light", "cornerRadius": 4, "padding": [ 2, 6 ], "alignItems": "center", "children": [ { "type": "text", "id": "F3Ono", "name": "tag2Txt", "fill": "$--accent-blue", "content": "kubernetes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "oII4d", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "LxgzI", "name": "relGroup1", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "M1hqt", "name": "relGrp1Title", "fill": "$--muted-foreground", "content": "WORKS AT", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "1axQn", "name": "relAcmeBtn", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "VKyg3", "name": "acmeTxt", "fill": "$--accent-red", "content": "Acme Corp", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "GG63z", "name": "companyIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "kpHDy", "name": "linkExistingActive", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--primary" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Q7UgS", "name": "linkTxt", "fill": "$--foreground", "content": "Infra", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "RBm2-", "name": "searchIco", "width": 14, "height": 14, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "X_w5s", "name": "autocompleteDropdown", "width": "fill_container", "fill": "$--card", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "shadow": [ { "x": 0, "y": 4, "blur": 16, "spread": -2, "fill": "#00000015" } ], "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "3Pxkn", "name": "acItem1", "width": "fill_container", "fill": "$--accent-blue-light", "gap": 8, "padding": [ 8, 10 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "BgVut", "name": "acIcon1", "width": 14, "height": 14, "iconFontName": "medal", "iconFontFamily": "phosphor", "fill": "$--accent-purple" }, { "type": "text", "id": "RPfuk", "name": "acTxt1", "fill": "$--foreground", "content": "Infrastructure Team", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "sxoEV", "name": "acItem2", "width": "fill_container", "gap": 8, "padding": [ 8, 10 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "7ikv0", "name": "acIcon2", "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" }, { "type": "text", "id": "gVVyY", "name": "acTxt2", "fill": "$--foreground", "content": "Infrastructure", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "r85eA", "name": "acItem3", "width": "fill_container", "gap": 8, "padding": [ 8, 10 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "_BaES", "name": "acIcon3", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-red" }, { "type": "text", "id": "x-wlM", "name": "acTxt3", "fill": "$--foreground", "content": "Infra Migration", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "frame", "id": "N5Sll", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "imLWJ", "name": "blTitle", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "Y-UG1", "name": "blTitleTxt", "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "text", "id": "6K6Bd", "name": "blItem1", "fill": "$--primary", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "6EGhq", "name": "blItem2", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "FCfBL", "name": "blItem3", "fill": "$--primary", "content": "Hiring Pipeline", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] } ] } ] } ] }, { "type": "frame", "id": "WAxYr", "name": "lightStatusBar", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "q_a9K", "name": "Status Left", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Mlziz", "name": "versionIcon", "width": 14, "height": 14, "iconFontName": "box", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "gzUtx", "name": "versionText", "fill": "$--muted-foreground", "content": "v0.4.2", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "text", "id": "3x0kF", "name": "sep1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "hY-Is", "name": "branchIcon", "width": 14, "height": 14, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "k9Hay", "name": "branchText", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "WKBM-", "name": "sep2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "lhY_1", "name": "syncIcon", "width": 13, "height": 13, "iconFontName": "refresh-cw", "iconFontFamily": "lucide", "fill": "$--accent-green" }, { "type": "text", "id": "uELg8", "name": "syncText", "fill": "$--muted-foreground", "content": "Synced 2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "c38hL", "name": "Status Right", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "leRDx", "name": "aiIcon", "width": 13, "height": 13, "iconFontName": "sparkles", "iconFontFamily": "lucide", "fill": "$--accent-purple" }, { "type": "text", "id": "W6In1", "name": "aiText", "fill": "$--muted-foreground", "content": "Claude Sonnet 4", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "rxqIt", "name": "sep3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "B0jTr", "name": "notesCount", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "01ygw", "name": "notesText", "fill": "$--muted-foreground", "content": "1,247 notes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "BeA6T", "name": "sep4", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "yNSZ0", "name": "bellIcon", "width": 13, "height": 13, "iconFontName": "bell", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "RbzrU", "name": "settingsIcon", "width": 13, "height": 13, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "cDqLP", "x": 0, "y": 16100, "name": "Full Layout — Changes View", "theme": { "Mode": "Light" }, "clip": true, "width": 1440, "height": 900, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "2HK9s", "name": "macOS Title Bar", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "AiPEP", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "X3X_h", "name": "closeBtn", "fill": "#FF5F57", "width": 12, "height": 12 }, { "type": "ellipse", "id": "P1J0D", "name": "minimizeBtn", "fill": "#FEBC2E", "width": 12, "height": 12 }, { "type": "ellipse", "id": "3zuNz", "name": "maximizeBtn", "fill": "#28C840", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "-ekXq", "name": "Content", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "M2KC-", "name": "Panel: Sidebar", "clip": true, "width": 250, "height": "fill_container", "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": 0, "fill": "$--sidebar-border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "ZulZE", "name": "Filters", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 1, "padding": [ 8, 8, 16, 8 ], "children": [ { "type": "frame", "id": "IS4Fm", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "vPb76", "name": "leftAll", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "yuOG7", "name": "iconAll", "width": 18, "height": 18, "iconFontName": "tray-fill", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "XsyTZ", "name": "fAllTxt", "fill": "$--foreground", "content": "Untagged", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "XP413", "name": "countAll", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "jwZW-", "name": "badgeAllTxt", "fill": "$--muted-foreground", "content": "24", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "nJQFj", "name": "filterUntagged", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rYzZ5", "name": "leftUntagged", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "rOyw2", "name": "untaggedIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "y-u3E", "name": "untaggedTxt", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "kQQSy", "name": "countUntagged", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "-He5A", "name": "untaggedBadgeTxt", "fill": "$--muted-foreground", "content": "6", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "z-rwa", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "EZw96", "name": "leftTrash", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "yFQYH", "name": "trashIcon", "width": 18, "height": 18, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "zgVFp", "name": "trashTxt", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "2ZVsp", "name": "countTrash", "height": 20, "fill": "$--secondary", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "6KjzA", "name": "trashBadgeTxt", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "Jz98b", "name": "filterChanges", "width": "fill_container", "cornerRadius": 6, "gap": 6, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "hCAhH", "name": "leftChanges", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "zut43", "name": "iconChanges", "width": 18, "height": 18, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-orange" }, { "type": "text", "id": "eNZE_", "name": "fChangesTxt", "fill": "$--accent-orange", "content": "Changes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "frame", "id": "Vd1IP", "name": "countChanges", "height": 20, "fill": "$--accent-orange", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "WQevI", "name": "badgeChangesTxt", "fill": "$--primary-foreground", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ], "fill": "#D9730D18" } ] }, { "type": "frame", "id": "iZGMX", "name": "Sections", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "K9kps", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "NqU-g", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "l4Db7", "name": "leftProj", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "UH57P", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "qhWRv", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "2z0Fc", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "hZaR_", "name": "projItem1", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "KMKlm", "name": "proj1Txt", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "4auYC", "name": "projItem2", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "-h_S-", "name": "proj2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] }, { "type": "frame", "id": "Xby4k", "name": "projItem3", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "zflkU", "name": "proj3Txt", "fill": "$--muted-foreground", "content": "AI Habit Tracker", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "yOvdh", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "9NVPP", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "KLgB7", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "_RJw9", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "P2TLS", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "FMkvu", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "jdhEx", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "yNxrB", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "ZbG_K", "name": "leftResp", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "Lrz9B", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "JYP7R", "name": "Procedures", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "cuKa1", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "9ZtV7", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "bqUk7", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "GDmNS", "name": "leftPeople", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "4N-jT", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "users", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "eYxow", "name": "peopleLbl", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "zxTf-", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "oO2nv", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "01fhT", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "BpjDl", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "WNSv4", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "calendar-blank", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "Z-BdI", "name": "eventsLbl", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "VtYYq", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "QB60u", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dr3Dy", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "gip-z", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "YWJHr", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "M4fMh", "name": "eventsLbl", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "be_vU", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "jtFdo", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "t051Q", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "CSC3E", "name": "leftEvents", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "wt2dG", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "qqxUQ", "name": "eventsLbl", "fill": "$--foreground", "content": "Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "OyEhu", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "b0y4m", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "XKefw", "name": "leftEvents", "gap": 8, "padding": [ 8, 0 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "5MMXe", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "yJWsr", "name": "eventsLbl", "fill": "$--muted-foreground", "content": "Create new type", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] } ] }, { "type": "frame", "id": "wTdWJ", "name": "Commit Area", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "layout": "vertical", "padding": 12, "children": [ { "type": "frame", "id": "alvR1", "name": "commitBtn", "width": "fill_container", "fill": "$--primary", "cornerRadius": 6, "gap": 6, "padding": [ 8, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "icon_font", "id": "OZpvZ", "name": "commitIcon", "width": 14, "height": 14, "iconFontName": "git-commit-horizontal", "iconFontFamily": "lucide", "fill": "$--primary-foreground" }, { "type": "text", "id": "vye-W", "name": "commitTxt", "fill": "$--primary-foreground", "content": "Commit & Push", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "M_lH9", "name": "commitBadge", "height": 18, "fill": "#ffffff40", "cornerRadius": 9, "padding": [ 0, 5 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "kTQAa", "name": "commitBadgeTxt", "fill": "$--white", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] } ] }, { "type": "rectangle", "id": "aBuSJ", "name": "Resize Handle", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "5CXKO", "name": "Panel: NoteList", "clip": true, "width": 300, "height": "fill_container", "fill": "$--card", "stroke": { "align": "inside", "thickness": 0, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "UhLWn", "name": "NoteList Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "jyxqb", "name": "nlTitle", "fill": "$--foreground", "content": "Changes", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" }, { "type": "frame", "id": "0eL1W", "name": "nlActions", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "XsWjG", "name": "searchIcon", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "bBObW", "name": "plusIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "TK7b7", "name": "Note Items", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "dri89", "name": "Backlinks Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "9mLoL", "name": "Note Item Selected", "width": "fill_container", "fill": "$--accent-yellow-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "#E9E9E7" }, "children": [ { "type": "rectangle", "id": "lmpZx", "name": "leftAccent", "fill": "$--accent-yellow", "width": 3, "height": "fill_container" }, { "type": "frame", "id": "CkBEU", "name": "noteSelContent", "width": "fill_container", "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "0KzHG", "name": "noteSelRow", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "ScgZY", "name": "titleGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "3mYfY", "name": "noteSelTitle", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "frame", "id": "jqZDh", "name": "modBadge", "width": 18, "height": 18, "fill": "$--accent-yellow-light", "cornerRadius": 4, "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "v8EXM", "name": "modBadgeTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "700" } ] } ] } ] }, { "type": "text", "id": "mCaj6", "name": "noteSelSnip", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "mi4c4", "name": "noteSelTime", "fill": "$--accent-yellow", "content": "Modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "MYwXd", "name": "Related Notes Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "fKL4E", "name": "Related Notes Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "eCRui", "name": "rnLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "UEtOs", "name": "rnLabel", "fill": "$--muted-foreground", "content": "MODIFIED", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "geohb", "name": "rnCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "vW3Ux", "name": "rnRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "8-7YX", "name": "rnFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "rJ2Qt", "name": "rnPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "Agecx", "name": "rnChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "Ef8xK", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "ikmO0", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "DgJzU", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "0SmlX", "name": "note2Title", "fill": "$--foreground", "content": "Weekly Review Process", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "Ipmvo", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "pencil-simple", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "6-aLC", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Every Sunday: review tasks, update time blocks, plan the week ahead...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "35sd_", "name": "note2Time", "fill": "$--muted-foreground", "content": "Modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "D1PDV", "name": "Note Item", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "m3Yy9", "name": "note2Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "G7YLm", "name": "leafGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "VeAEm", "name": "note2Title", "fill": "$--foreground", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "rXUE_", "name": "leafIco", "width": 14, "height": 14, "iconFontName": "pencil-simple", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "1G-GA", "name": "note2Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Allocated focus blocks in Q1 for deep work sessions on infrastructure...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "p_rqw", "name": "note2Time", "fill": "$--muted-foreground", "content": "Modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "3o8WQ", "name": "Events Group", "width": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "G7UWp", "name": "Events Header", "width": "fill_container", "height": 32, "fill": "$--muted", "padding": [ 0, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "msMtG", "name": "evLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "SGt7e", "name": "evLabel", "fill": "$--muted-foreground", "content": "MODIFIED", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "1PVP7", "name": "evCount", "fill": "$--muted-foreground", "content": "2", "fontFamily": "IBM Plex Sans", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "FCzPr", "name": "evRight", "gap": 10, "alignItems": "center", "children": [ { "type": "icon_font", "id": "UYR0D", "name": "evFilter", "width": 12, "height": 12, "iconFontName": "funnel", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "4jbCj", "name": "evPlus", "width": 12, "height": 12, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "WRN9r", "name": "evChev", "width": 12, "height": 12, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "RiDwJ", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "Rvp4A", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "bnvDp", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "QjRDJ", "name": "note3Title", "fill": "$--foreground", "content": "Time Management Strategies", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "LeQCT", "name": "calIco", "width": 14, "height": 14, "iconFontName": "pencil-simple", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "vwDsc", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Effective time management requires clear priorities and consistent review...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "OPKF_", "name": "note3Time", "fill": "$--muted-foreground", "content": "Modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "PsBeq", "name": "Note Item 2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "sPOHy", "name": "note3Row", "width": "fill_container", "gap": 8, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "1Ecj7", "name": "calGroup", "width": "fill_container", "gap": 6, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "DlZRH", "name": "note3Title", "fill": "$--foreground", "content": "Time Management Strategies", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "yi-xp", "name": "calIco", "width": 14, "height": 14, "iconFontName": "pencil-simple", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" } ] } ] }, { "type": "text", "id": "CJPuv", "name": "note3Snip", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Effective time management requires clear priorities and consistent review...", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "6MtFY", "name": "note3Time", "fill": "$--muted-foreground", "content": "Modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ] } ] } ] }, { "type": "rectangle", "id": "0kPjR", "name": "Resize Handle 2", "fill": "$--border", "width": 1, "height": "fill_container" }, { "type": "frame", "id": "XRb-G", "name": "Panel: Editor", "clip": true, "width": "fill_container", "height": "fill_container", "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "GMRdK", "name": "Tab Bar", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "iXash", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "eo9dK", "name": "tab1Txt", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "6MLT7", "name": "tab1Close", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "0UmLQ", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "1JK8S", "name": "tab2Txt", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "k2PZa", "name": "tab2Close", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "bM7NZ", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "G6gUe", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "oVC29", "name": "iconPlus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "XwYxq", "name": "iconSplit", "width": 16, "height": 16, "iconFontName": "columns", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "8z4xd", "name": "iconExpand", "width": 16, "height": 16, "iconFontName": "arrows-out-simple", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ZIoKq", "name": "Editor Body", "width": "fill_container", "height": "fill_container", "children": [ { "type": "frame", "id": "tJCEQ", "name": "Editor Left", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "L9_bR", "name": "Info Bar", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "7YAl6", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "8RsE6", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "aPIWW", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "Hko61", "name": "breadcrumbName", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "UgLju", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "atZy3", "name": "modifiedTxt", "fill": "$--accent-yellow", "content": "M", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" } ] }, { "type": "frame", "id": "i_O9Q", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mATmR", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "7-BlR", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "hggOM", "name": "iconSearch", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "lKS8-", "name": "iconAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "etlhz", "name": "iconMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "n-cpK", "name": "Editor Content", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 32, 64 ], "children": [ { "type": "text", "id": "jnGoo", "name": "editorP1", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge and life management desktop app, built with Tauri v2 + React + TypeScript + CodeMirror 6. It reads a vault of markdown files with YAML frontmatter and presents them in a four-panel UI inspired by Bear Notes.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" }, { "type": "text", "id": "fwFRq", "name": "editorH2", "fill": "$--foreground", "content": "Architecture", "lineHeight": 1.3, "fontFamily": "Inter", "fontSize": 24, "fontWeight": "600" }, { "type": "text", "id": "qK0e0", "name": "editorP2", "fill": "$--foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "The app uses a four-panel layout: Sidebar for navigation, NoteList for browsing, Editor for content, and Inspector for metadata. All data lives in markdown files with YAML frontmatter, git-versioned.", "lineHeight": 1.6, "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "RkIhR", "name": "Inspector", "clip": true, "width": 260, "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "left": 1 }, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "0CJaZ", "name": "Inspector Header", "width": "fill_container", "height": 45, "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "TPquS", "name": "leftGroup", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "AVtUy", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "Lgi69", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "uWuxn", "name": "sidebarIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "u6jJ2", "name": "Inspector Body", "clip": true, "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "frame", "id": "MRZfg", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "qC-P7", "name": "addPropBtn", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 12 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "HBg9i", "name": "addPropTxt", "fill": "$--muted-foreground", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "oHFVh", "name": "propType", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Mk9GH", "name": "propTypeLbl", "fill": "$--muted-foreground", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "text", "id": "NUS5u", "name": "propTypeVal", "fill": "$--foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "EAnqI", "name": "propStatus", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "YZlCv", "name": "propStatusLbl", "fill": "$--muted-foreground", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "khF0Y", "name": "propStatusBadge", "fill": "$--accent-green-light", "cornerRadius": 16, "stroke": { "align": "inside", "thickness": 1, "fill": "transparent" }, "gap": 8, "padding": [ 1, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "H3X2o", "name": "Badge Text", "fill": "$--accent-green", "content": "ACTIVE", "lineHeight": 1.33, "textAlign": "center", "textAlignVertical": "middle", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 } ] } ] } ] }, { "type": "frame", "id": "F0I-7", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "10XXp", "name": "relGroup1", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "qh7dI", "name": "relGrp1Title", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "ovNo_", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "u6cth", "name": "laputaTxt", "fill": "$--accent-green", "content": "Laputa", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "911p5", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "TwrqD", "name": "relLaputaBtn", "width": "fill_container", "fill": "$--accent-green-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "R02qX", "name": "laputaTxt", "fill": "$--accent-green", "content": "Building", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "URmQn", "name": "topicIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "tag", "iconFontFamily": "phosphor", "fill": "$--accent-green" } ] }, { "type": "frame", "id": "y-RCD", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "Sohlo", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "NON3K", "name": "relGroup2", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "PRmP1", "name": "relGrp2Title", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "ZORAR", "name": "relMigrationBtn", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "zBinS", "name": "migrationTxt", "fill": "$--accent-red", "content": "Shadcn Migration", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "fmvl7", "name": "expIcon", "opacity": 0.5, "width": 14, "height": 14, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "rk_6m", "name": "linkExisting", "width": "fill_container", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "0BiPL", "name": "laputaTxt", "fill": "$--muted-foreground", "content": "+ Link existing", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "4CbGG", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "bYwPw", "name": "blTitle", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "FXmIm", "name": "blTitleTxt", "rotation": -0.5285936385085725, "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "text", "id": "QkxSV", "name": "blItem1", "fill": "$--primary", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "5GEwY", "name": "blItem2", "fill": "$--primary", "content": "Meeting with Grant", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "JjS06", "name": "blItem3", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "-AVRp", "name": "History Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "s2sCa", "name": "histTitle", "fill": "$--muted-foreground", "content": "HISTORY", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" }, { "type": "frame", "id": "Wh7sL", "name": "histItem1", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "WJkad", "name": "histItem1Hash", "fill": "$--accent-blue", "content": "a089f44 · feat: migrate to shadcn/ui", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "tdi_I", "name": "histItem1Date", "fill": "$--muted-foreground", "content": "Feb 16, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "LM_vp", "name": "histItem2", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "left": 2 }, "fill": "$--border" }, "layout": "vertical", "gap": 2, "padding": [ 0, 0, 0, 10 ], "children": [ { "type": "text", "id": "FAnJW", "name": "histItem2Hash", "fill": "$--accent-blue", "content": "5a4b4ac · feat: emoji favicon", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "9bpmf", "name": "histItem2Date", "fill": "$--muted-foreground", "content": "Feb 15, 2026", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal" } ] } ] } ] } ] } ] } ] } ] }, { "type": "frame", "id": "gH1Q6", "name": "lightStatusBar", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "8q9j3", "name": "Status Left", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "HoLpj", "name": "versionIcon", "width": 14, "height": 14, "iconFontName": "box", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "k-eWA", "name": "versionText", "fill": "$--muted-foreground", "content": "v0.4.2", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "text", "id": "Y-wAn", "name": "sep1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "gtv6Y", "name": "branchIcon", "width": 14, "height": 14, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "xnDxG", "name": "branchText", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "qpDn7", "name": "sep2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "NUI5N", "name": "syncIcon", "width": 13, "height": 13, "iconFontName": "pencil-simple", "iconFontFamily": "phosphor", "fill": "$--accent-yellow" }, { "type": "text", "id": "sDa8O", "name": "syncText", "fill": "$--muted-foreground", "content": "3 modified", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "4RcrW", "name": "Status Right", "height": "fill_container", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "5g3ye", "name": "aiIcon", "width": 13, "height": 13, "iconFontName": "sparkles", "iconFontFamily": "lucide", "fill": "$--accent-purple" }, { "type": "text", "id": "D1hG8", "name": "aiText", "fill": "$--muted-foreground", "content": "Claude Sonnet 4", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "l4igr", "name": "sep3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "2uctj", "name": "notesCount", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "uv6xG", "name": "notesText", "fill": "$--muted-foreground", "content": "1,247 notes", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "text", "id": "tViOI", "name": "sep4", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "icon_font", "id": "i4ZVl", "name": "bellIcon", "width": 13, "height": 13, "iconFontName": "bell", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "-T7ch", "name": "settingsIcon", "width": 13, "height": 13, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "sec4_hdr", "name": "4 — Feature Specs", "x": 0, "y": 17200, "width": 1440, "height": 60, "fill": "$--foreground", "padding": [ 0, 60 ], "alignItems": "center", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "sec4_hdr_lbl", "content": "4 — FEATURE SPECS", "fill": "$--background", "fontFamily": "Inter", "fontSize": 24, "fontWeight": "700", "letterSpacing": 2 } ] }, { "type": "text", "id": "fg_tabs_and_navigation", "content": "TABS & NAVIGATION", "x": 0, "y": 17300, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dt0", "name": "Draggable Tabs — Default State", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dt1", "name": "frameLabel", "content": "Default: tabs are draggable (grab cursor on hover)", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "dt2", "name": "Tab Bar Default", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "dt3", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt4", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "dt5", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt6", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt7", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dt8", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt9", "name": "Tab Inactive 2", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dta", "fill": "$--muted-foreground", "content": "Weekly Review", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dtb", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dtc", "name": "Tab Inactive 3", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dtd", "fill": "$--muted-foreground", "content": "Workout Log", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dte", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dtf", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "dtg", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "dth", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "dti", "name": "cursorNote", "content": "cursor: grab → grabbing during drag", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 0, "y": 17330 }, { "type": "frame", "id": "dtj", "name": "Draggable Tabs — Dragging (Tab Being Moved)", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dtk", "name": "frameLabel2", "content": "Dragging: \"Portfolio Rewrite\" is being dragged left (opacity 0.5, blue drop indicator)", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "dtl", "name": "Tab Bar Dragging", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "rectangle", "id": "dtm", "name": "Drop Indicator", "width": 2, "height": 30, "fill": "$--primary", "cornerRadius": 1 }, { "type": "frame", "id": "dtn", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dto", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "dtp", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dtq", "name": "Tab Dragging (ghost)", "height": "fill_container", "opacity": 0.5, "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dtr", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dts", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dtt", "name": "Tab Inactive 2", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dtu", "fill": "$--muted-foreground", "content": "Weekly Review", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "dtv", "name": "Tab Inactive 3", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dtw", "fill": "$--muted-foreground", "content": "Workout Log", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "dtx", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "dty", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "dtz", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "dt10", "name": "dragNote", "content": "Drop indicator: 2px $--primary bar shows insertion point. Dragged tab has opacity: 0.5.", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 900, "y": 17330 }, { "type": "frame", "id": "dt11", "name": "Draggable Tabs — After Drop (Reordered)", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dt12", "name": "frameLabel3", "content": "After drop: \"Portfolio Rewrite\" moved before \"Laputa App\". Order persisted to localStorage.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "dt13", "name": "Tab Bar Reordered", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "dt14", "name": "Tab Inactive (moved)", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt15", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dt16", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt17", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt18", "fill": "$--foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "dt19", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt1a", "name": "Tab Inactive 2", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt1b", "fill": "$--muted-foreground", "content": "Weekly Review", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dt1c", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt1d", "name": "Tab Inactive 3", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "dt1e", "fill": "$--muted-foreground", "content": "Workout Log", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "dt1f", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dt1g", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "dt1h", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "dt1i", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "dt1j", "name": "persistNote", "content": "localStorage key: \"laputa-tab-order\" stores path array. Restored on next session.", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 1800, "y": 17330 }, { "type": "frame", "id": "rnt0", "name": "Rename Tab — Normal tab state", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "rnt1", "name": "frameLabel", "content": "Normal state: tabs show note title. Double-click to rename.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "rnt2", "name": "Tab Bar Normal", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "rnt3", "name": "Tab Active", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "rnt4", "fill": "$--foreground", "content": "Weekly Review", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rnt5", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rnt6", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "rnt7", "fill": "$--muted-foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "rnt8", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rnt9", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "rnta", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "rntb", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "rntc", "name": "interactionNote", "content": "Double-click tab title → enters edit mode", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 0, "y": 17490 }, { "type": "frame", "id": "rne0", "name": "Rename Tab — Double-clicked (editing mode)", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "rne1", "name": "frameLabel", "content": "Editing mode: tab title replaced with inline input field, text selected.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "rne2", "name": "Tab Bar Editing", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "rne3", "name": "Tab Active (Editing)", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "frame", "id": "rne4", "name": "Inline Input", "fill": "$--background", "stroke": { "align": "inside", "thickness": 1, "fill": "$--ring" }, "cornerRadius": 3, "padding": [ 2, 6 ], "alignItems": "center", "children": [ { "type": "text", "id": "rne5", "fill": "$--foreground", "content": "Weekly Review", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500", "highlight": "$--primary", "highlightOpacity": 0.2 } ] }, { "type": "icon_font", "id": "rne6", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rne7", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "rne8", "fill": "$--muted-foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "rne9", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rnea", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "rneb", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "rnec", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "rned", "name": "interactionNote", "content": "Enter → save & rename file + update wiki links | Escape → cancel | Blur → save", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 900, "y": 17490 }, { "type": "frame", "id": "rns0", "name": "Rename Tab — Saved (updated name)", "width": 800, "height": 120, "layout": "vertical", "fill": "$--sidebar", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "rns1", "name": "frameLabel", "content": "After save: tab shows updated title. File renamed, wiki links updated across vault.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "rns2", "name": "Tab Bar Saved", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "rns3", "name": "Tab Active (Renamed)", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "rns4", "fill": "$--foreground", "content": "Sprint Retrospective", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rns5", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rns6", "name": "Tab Inactive", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "rns7", "fill": "$--muted-foreground", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "rns8", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rns9", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "rnsa", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "rnsb", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "rnsc", "name": "interactionNote", "content": "File: weekly-review.md → sprint-retrospective.md | [[Weekly Review]] → [[Sprint Retrospective]] in all notes", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 4, 12 ] } ], "x": 1800, "y": 17490 }, { "type": "frame", "id": "archBtnNorm", "x": 0, "y": 17650, "name": "Archive Notes — Breadcrumb button (normal note)", "theme": { "Mode": "Light" }, "clip": true, "width": 800, "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "anInfoL", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "anType", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "anSep", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "anName", "name": "breadcrumbName", "fill": "$--foreground", "content": "My Active Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "anDot", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "anWords", "name": "wordCount", "fill": "$--muted-foreground", "content": "1,234 words", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] }, { "type": "frame", "id": "anInfoR", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "anISearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "anIGit", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "anICursor", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "anIAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "frame", "id": "anArchiveBtn", "name": "archiveButton", "gap": 4, "alignItems": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--primary" }, "cornerRadius": 4, "padding": [ 2, 2 ], "children": [ { "type": "icon_font", "id": "anIArchive", "width": 16, "height": 16, "iconFontName": "archive", "iconFontFamily": "phosphor", "fill": "$--primary" } ] }, { "type": "icon_font", "id": "anITrash", "width": 16, "height": 16, "iconFontName": "trash", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "anIMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "archBtnArc", "x": 900, "y": 17650, "name": "Archive Notes — Breadcrumb button (archived note, shows Unarchive)", "theme": { "Mode": "Light" }, "clip": true, "width": 800, "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "auInfoL", "name": "infoLeft", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "auType", "name": "breadcrumbType", "fill": "$--muted-foreground", "content": "Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "auSep", "name": "breadcrumbSep", "fill": "$--muted-foreground", "content": "›", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "auName", "name": "breadcrumbName", "fill": "$--foreground", "content": "My Archived Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "auDot", "name": "dotSep", "fill": "$--muted-foreground", "content": "·", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "auWords", "name": "wordCount", "fill": "$--muted-foreground", "content": "567 words", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "frame", "id": "auBadge", "name": "archivedBadge", "height": 16, "fill": "$--accent-blue-light", "cornerRadius": 4, "padding": [ 1, 4 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "auBadgeTxt", "fill": "$--primary", "content": "ARCHIVED", "fontFamily": "Inter", "fontSize": 9, "fontWeight": "500" } ] } ] }, { "type": "frame", "id": "auInfoR", "name": "infoRight", "gap": 12, "alignItems": "center", "children": [ { "type": "icon_font", "id": "auISearch", "width": 16, "height": 16, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "auIGit", "width": 16, "height": 16, "iconFontName": "git-branch", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "auICursor", "width": 16, "height": 16, "iconFontName": "cursor-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "auIAI", "width": 16, "height": 16, "iconFontName": "sparkle", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "frame", "id": "auUnarchiveBtn", "name": "unarchiveButton", "gap": 4, "alignItems": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--primary" }, "cornerRadius": 4, "padding": [ 2, 2 ], "children": [ { "type": "icon_font", "id": "auIUnarchive", "width": 16, "height": 16, "iconFontName": "arrow-u-up-left", "iconFontFamily": "phosphor", "fill": "$--primary" } ] }, { "type": "icon_font", "id": "auITrash", "width": 16, "height": 16, "iconFontName": "trash", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "icon_font", "id": "auIMore", "width": 16, "height": 16, "iconFontName": "dots-three", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "srtDD", "x": 1800, "y": 17650, "name": "Sort Dropdown — Direction Arrows", "clip": true, "width": 260, "height": 280, "fill": "$--popover", "cornerRadius": "$--radius-md", "stroke": { "align": "outside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "padding": [ 8, 0 ], "children": [ { "type": "frame", "id": "srtH1", "name": "dropdownHeader", "width": "fill_container", "height": 28, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtHL", "name": "headerLabel", "content": "Sort by", "fontSize": 11, "fontWeight": 600, "fill": "$--muted-foreground", "fontFamily": "$--font-primary", "textTransform": "uppercase", "letterSpacing": 0.5 } ] }, { "type": "frame", "id": "srtR1", "name": "row-modified", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "fill": "$--muted", "children": [ { "type": "text", "id": "srtT1", "name": "label-modified", "content": "Modified", "fontSize": 13, "fontWeight": 500, "fill": "$--popover-foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "frame", "id": "srtA1", "name": "arrows-modified", "gap": 2, "alignItems": "center", "children": [ { "type": "text", "id": "srtU1", "name": "arrow-up-active", "content": "↑", "fontSize": 13, "fontWeight": 700, "fill": "$--accent-blue" }, { "type": "text", "id": "srtD1", "name": "arrow-down", "content": "↓", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "srtR2", "name": "row-title", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtT2", "name": "label-title", "content": "Title", "fontSize": 13, "fontWeight": 400, "fill": "$--popover-foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "frame", "id": "srtA2", "name": "arrows-title", "gap": 2, "alignItems": "center", "children": [ { "type": "text", "id": "srtU2", "name": "arrow-up", "content": "↑", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" }, { "type": "text", "id": "srtD2", "name": "arrow-down", "content": "↓", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "srtR3", "name": "row-created", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtT3", "name": "label-created", "content": "Created", "fontSize": 13, "fontWeight": 400, "fill": "$--popover-foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "frame", "id": "srtA3", "name": "arrows-created", "gap": 2, "alignItems": "center", "children": [ { "type": "text", "id": "srtU3", "name": "arrow-up", "content": "↑", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" }, { "type": "text", "id": "srtD3", "name": "arrow-down", "content": "↓", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "srtR4", "name": "row-type", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtT4", "name": "label-type", "content": "Type", "fontSize": 13, "fontWeight": 400, "fill": "$--popover-foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "frame", "id": "srtA4", "name": "arrows-type", "gap": 2, "alignItems": "center", "children": [ { "type": "text", "id": "srtU4", "name": "arrow-up", "content": "↑", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" }, { "type": "text", "id": "srtD4", "name": "arrow-down", "content": "↓", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "srtSP", "name": "separator", "width": "fill_container", "height": 1, "fill": "$--border" }, { "type": "frame", "id": "srtAN", "name": "annotation", "width": "fill_container", "padding": [ 6, 12 ], "children": [ { "type": "text", "id": "srtAT", "name": "annotation-text", "content": "Click ↑↓ to toggle direction. Blue = active.", "fontSize": 11, "fill": "$--muted-foreground", "fontFamily": "$--font-primary" } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "srtBN", "x": 2160, "y": 17650, "name": "Sort Button — With Direction Indicator", "clip": true, "width": 400, "height": 200, "fill": "$--background", "cornerRadius": "$--radius-md", "stroke": { "align": "outside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "padding": [ 16, 16 ], "gap": 16, "children": [ { "type": "frame", "id": "srtBH", "name": "noteListHeader", "width": "fill_container", "height": 36, "alignItems": "center", "children": [ { "type": "text", "id": "srtBC", "name": "noteCount", "content": "42 notes", "fontSize": 12, "fill": "$--muted-foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "frame", "id": "srtBB", "name": "sortButton", "padding": [ 4, 8 ], "cornerRadius": "$--radius-sm", "fill": "$--muted", "alignItems": "center", "gap": 4, "children": [ { "type": "text", "id": "srtBL", "name": "sortLabel", "content": "Modified", "fontSize": 12, "fontWeight": 500, "fill": "$--foreground", "fontFamily": "$--font-primary" }, { "type": "text", "id": "srtBA", "name": "directionArrow", "content": "↓", "fontSize": 12, "fontWeight": 600, "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "srtSP2", "name": "divider", "width": "fill_container", "height": 1, "fill": "$--border" }, { "type": "frame", "id": "srtEX", "name": "exampleNotes", "width": "fill_container", "layout": "vertical", "gap": 2, "children": [ { "type": "frame", "id": "srtN1", "name": "noteRow1", "width": "fill_container", "height": 32, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtNT1", "name": "noteTitle1", "content": "Meeting Notes — Feb 22", "fontSize": 13, "fill": "$--foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "text", "id": "srtND1", "name": "noteDate1", "content": "2 min ago", "fontSize": 11, "fill": "$--muted-foreground", "fontFamily": "$--font-primary" } ] }, { "type": "frame", "id": "srtN2", "name": "noteRow2", "width": "fill_container", "height": 32, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtNT2", "name": "noteTitle2", "content": "Project Roadmap", "fontSize": 13, "fill": "$--foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "text", "id": "srtND2", "name": "noteDate2", "content": "1 hr ago", "fontSize": 11, "fill": "$--muted-foreground", "fontFamily": "$--font-primary" } ] }, { "type": "frame", "id": "srtN3", "name": "noteRow3", "width": "fill_container", "height": 32, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "srtNT3", "name": "noteTitle3", "content": "Weekly Review", "fontSize": 13, "fill": "$--foreground", "fontFamily": "$--font-primary", "width": "fill_container" }, { "type": "text", "id": "srtND3", "name": "noteDate3", "content": "Yesterday", "fontSize": 11, "fill": "$--muted-foreground", "fontFamily": "$--font-primary" } ] } ] }, { "type": "frame", "id": "srtAN2", "name": "annotation", "width": "fill_container", "padding": [ 6, 0 ], "children": [ { "type": "text", "id": "srtAT2", "name": "annotation-text", "content": "Sort button shows property + direction arrow. Click to open dropdown.", "fontSize": 11, "fill": "$--muted-foreground", "fontFamily": "$--font-primary" } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_inspector_and_proper", "content": "INSPECTOR & PROPERTIES", "x": 0, "y": 18010, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "pi01", "name": "Properties Inspector — Editable Properties", "width": 320, "height": 520, "layout": "vertical", "fill": "$--background", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "pi02", "name": "frameLabel", "content": "Editable properties section: interactive hover states, cursor pointer, click-to-edit inputs. Properties from frontmatter YAML that the user can modify.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "pi03", "name": "Inspector Header", "width": "fill_container", "height": 45, "fill": "$--background", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 8, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "pi04", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "pi05", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600", "fill": "$--muted-foreground", "width": "fill_container" }, { "type": "icon_font", "id": "pi06", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "pi07", "name": "Properties Section", "width": "fill_container", "layout": "vertical", "padding": [ 12, 12 ], "gap": 10, "children": [ { "type": "frame", "id": "pi08", "name": "Type Row", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "children": [ { "type": "text", "id": "pi09", "content": "TYPE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground" }, { "type": "frame", "id": "pi10", "name": "Type Badge", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 2, 8 ], "children": [ { "type": "text", "id": "pi11", "content": "Project", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500", "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "pi12", "name": "Editable Row — Status (hover state)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "cornerRadius": 4, "fill": "$--bg-hover-subtle", "padding": [ 4, 6 ], "children": [ { "type": "text", "id": "pi13", "content": "STATUS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground" }, { "type": "frame", "id": "pi14", "name": "Status Badge", "fill": "$--accent-green-light", "cornerRadius": 16, "padding": [ 1, 6 ], "children": [ { "type": "text", "id": "pi15", "content": "ACTIVE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2, "fill": "$--accent-green" } ] } ] }, { "type": "frame", "id": "pi16", "name": "Editable Row — Owner (normal state)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "cornerRadius": 4, "padding": [ 4, 6 ], "children": [ { "type": "text", "id": "pi17", "content": "OWNER", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground" }, { "type": "text", "id": "pi18", "content": "Luca Rossi", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal", "fill": "$--foreground" } ] }, { "type": "frame", "id": "pi19", "name": "Editable Row — Tags (normal state)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "cornerRadius": 4, "padding": [ 4, 6 ], "children": [ { "type": "text", "id": "pi20", "content": "TAGS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground" }, { "type": "frame", "id": "pi21", "name": "Tag Pills", "gap": 4, "children": [ { "type": "frame", "id": "pi22", "fill": "$--accent-blue-light", "cornerRadius": 12, "padding": [ 2, 8 ], "children": [ { "type": "text", "id": "pi23", "content": "React", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500", "fill": "$--accent-blue" } ] }, { "type": "frame", "id": "pi24", "fill": "$--accent-blue-light", "cornerRadius": 12, "padding": [ 2, 8 ], "children": [ { "type": "text", "id": "pi25", "content": "TypeScript", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500", "fill": "$--accent-blue" } ] } ] } ] }, { "type": "frame", "id": "pi26", "name": "Add Property Button", "width": "fill_container", "height": 32, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "cornerRadius": 6, "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "pi27", "content": "+ Add property", "fontFamily": "Inter", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "pi28", "name": "Separator", "width": "fill_container", "height": 1, "fill": "$--border" }, { "type": "frame", "id": "pi29", "name": "Info Section — Read-only Metadata", "width": "fill_container", "layout": "vertical", "padding": [ 12, 12 ], "gap": 6, "children": [ { "type": "text", "id": "pi30", "content": "INFO", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground", "padding": [ 0, 0, 4, 0 ] }, { "type": "frame", "id": "pi31", "name": "Info Row — Modified (read-only, muted)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "children": [ { "type": "text", "id": "pi32", "content": "MODIFIED", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--text-muted" }, { "type": "text", "id": "pi33", "content": "Feb 14, 2026", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "fill": "$--text-muted" } ] }, { "type": "frame", "id": "pi34", "name": "Info Row — Created (read-only, muted)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "children": [ { "type": "text", "id": "pi35", "content": "CREATED", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--text-muted" }, { "type": "text", "id": "pi36", "content": "Jan 5, 2026", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "fill": "$--text-muted" } ] }, { "type": "frame", "id": "pi37", "name": "Info Row — Words (read-only, muted)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "children": [ { "type": "text", "id": "pi38", "content": "WORDS", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--text-muted" }, { "type": "text", "id": "pi39", "content": "1,247", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "fill": "$--text-muted" } ] }, { "type": "frame", "id": "pi40", "name": "Info Row — File Size (read-only, muted)", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "children": [ { "type": "text", "id": "pi41", "content": "SIZE", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--text-muted" }, { "type": "text", "id": "pi42", "content": "4.2 KB", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "fill": "$--text-muted" } ] } ] } ], "x": 0, "y": 18040 }, { "type": "frame", "id": "pi50", "name": "Properties Inspector — Info Section Detail", "width": 320, "height": 400, "layout": "vertical", "fill": "$--background", "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "pi51", "name": "frameLabel", "content": "Info section for read-only derived metadata. Labels and values use --text-muted color. No hover states, no cursor pointer, no click interaction. Visually distinct from editable properties above.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground", "padding": [ 8, 12 ] }, { "type": "frame", "id": "pi52", "name": "Comparison Side by Side", "width": "fill_container", "layout": "vertical", "padding": [ 12, 12 ], "gap": 16, "children": [ { "type": "frame", "id": "pi53", "name": "Editable Property Example", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "pi54", "content": "EDITABLE (interactive)", "fontFamily": "IBM Plex Mono", "fontSize": 9, "fontWeight": "600", "letterSpacing": 1.5, "fill": "$--accent-green" }, { "type": "frame", "id": "pi55", "name": "Row — cursor:pointer, hover:bg-muted, rounded", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "cornerRadius": 4, "fill": "$--bg-hover-subtle", "padding": [ 4, 6 ], "children": [ { "type": "text", "id": "pi56", "content": "OWNER", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--muted-foreground" }, { "type": "text", "id": "pi57", "content": "Luca Rossi", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal", "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "pi58", "name": "Read-only Property Example", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "pi59", "content": "READ-ONLY (muted, no interaction)", "fontFamily": "IBM Plex Mono", "fontSize": 9, "fontWeight": "600", "letterSpacing": 1.5, "fill": "$--text-muted" }, { "type": "frame", "id": "pi60", "name": "Row — cursor:default, no hover, muted color", "width": "fill_container", "justifyContent": "space-between", "alignItems": "center", "padding": [ 4, 6 ], "children": [ { "type": "text", "id": "pi61", "content": "MODIFIED", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "letterSpacing": 1.2, "fill": "$--text-muted" }, { "type": "text", "id": "pi62", "content": "Feb 14, 2026", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "fill": "$--text-muted" } ] } ] } ] } ], "x": 420, "y": 18040 }, { "type": "frame", "id": "rbF01", "x": 840, "y": 18040, "name": "Inspector — Referenced By (Multiple)", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 700, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "rbF01h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rbF01hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "rbF01hI", "name": "propIcon", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "rbF01hT", "name": "inspTitle", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "rbF01hX", "name": "closeIcon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rbF01rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF01relT", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "rbF01relB", "name": "relBtn", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "rbF01relBT", "fill": "$--accent-blue", "content": "Grow Newsletter", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01relBI", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "target", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "rbF01ref", "name": "Referenced By Section", "width": "fill_container", "layout": "vertical", "gap": 10, "children": [ { "type": "frame", "id": "rbF01refH", "name": "refByHeader", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "rbF01refHT", "fill": "$--muted-foreground", "content": "REFERENCED BY", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF01refHC", "fill": "$--muted-foreground", "content": "5", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "rbF01refG1", "name": "refByGroup — via Belongs to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF01refG1T", "fill": "$--muted-foreground", "opacity": 0.7, "content": "VIA BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 9 }, { "type": "frame", "id": "rbF01refG1B1", "name": "refItem1", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF01refG1B1T", "fill": "$--accent-orange", "content": "Write Weekly Essays", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01refG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "fill": "$--accent-orange" } ] }, { "type": "frame", "id": "rbF01refG1B2", "name": "refItem2", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF01refG1B2T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01refG1B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] }, { "type": "frame", "id": "rbF01refG1B3", "name": "refItem3", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF01refG1B3T", "fill": "$--accent-purple", "content": "AI Agents Primer", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01refG1B3I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] }, { "type": "frame", "id": "rbF01refG2", "name": "refByGroup — via Related to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF01refG2T", "fill": "$--muted-foreground", "opacity": 0.7, "content": "VIA RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 9 }, { "type": "frame", "id": "rbF01refG2B1", "name": "refItem4", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF01refG2B1T", "fill": "$--accent-red", "content": "Failed SEO Experiment", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01refG2B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "rbF01refG2B2", "name": "refItem5", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF01refG2B2T", "fill": "$--accent-red", "content": "Twitter Thread Experiment", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF01refG2B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] } ] } ] }, { "type": "frame", "id": "rbF01bl", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "rbF01blT", "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF01blI1", "fill": "$--primary", "content": "Write Weekly Essays", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "rbF02", "x": 1260, "y": 18040, "name": "Inspector — Referenced By (Empty)", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 500, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "rbF02h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rbF02hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "rbF02hI", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "rbF02hT", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "rbF02hX", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rbF02rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF02relT", "fill": "$--muted-foreground", "content": "No relationships", "fontFamily": "Inter", "fontSize": 13 } ] }, { "type": "frame", "id": "rbF02ref", "name": "Referenced By Section (Empty)", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "rbF02refT", "fill": "$--muted-foreground", "content": "REFERENCED BY", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF02refE", "fill": "$--muted-foreground", "content": "No references", "fontFamily": "Inter", "fontSize": 13 } ] }, { "type": "frame", "id": "rbF02bl", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "rbF02blT", "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF02blE", "fill": "$--muted-foreground", "content": "No backlinks", "fontFamily": "Inter", "fontSize": 13 } ] } ] }, { "type": "frame", "id": "rbF03", "x": 1680, "y": 18040, "name": "Inspector — Referenced By (Many Backlinks)", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 800, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "rbF03h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "rbF03hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "rbF03hI", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "rbF03hT", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "rbF03hX", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "rbF03rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "rbF03relG1", "name": "relGroup — Has", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF03relG1T", "fill": "$--muted-foreground", "content": "HAS", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "rbF03relG1B1", "width": "fill_container", "fill": "$--accent-purple-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "rbF03relG1B1T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03relG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] }, { "type": "frame", "id": "rbF03relG1B2", "width": "fill_container", "fill": "$--accent-purple-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "rbF03relG1B2T", "fill": "$--accent-purple", "content": "Engineering Leadership 101", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03relG1B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] } ] }, { "type": "frame", "id": "rbF03ref", "name": "Referenced By Section (Many)", "width": "fill_container", "layout": "vertical", "gap": 10, "children": [ { "type": "frame", "id": "rbF03refH", "name": "refByHeader", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "rbF03refHT", "fill": "$--muted-foreground", "content": "REFERENCED BY", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF03refHC", "fill": "$--muted-foreground", "content": "8", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "frame", "id": "rbF03refG1", "name": "refByGroup — via Belongs to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF03refG1T", "fill": "$--muted-foreground", "opacity": 0.7, "content": "VIA BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 9 }, { "type": "frame", "id": "rbF03refG1B1", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG1B1T", "fill": "$--accent-orange", "content": "Write Weekly Essays", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "fill": "$--accent-orange" } ] }, { "type": "frame", "id": "rbF03refG1B2", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG1B2T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG1B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] }, { "type": "frame", "id": "rbF03refG1B3", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG1B3T", "fill": "$--accent-purple", "content": "Engineering Leadership 101", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG1B3I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] }, { "type": "frame", "id": "rbF03refG1B4", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG1B4T", "fill": "$--accent-purple", "content": "AI Agents Primer", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG1B4I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] }, { "type": "frame", "id": "rbF03refG2", "name": "refByGroup — via Related to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF03refG2T", "fill": "$--muted-foreground", "opacity": 0.7, "content": "VIA RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 9 }, { "type": "frame", "id": "rbF03refG2B1", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG2B1T", "fill": "$--accent-red", "content": "Failed SEO Experiment", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG2B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "frame", "id": "rbF03refG2B2", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG2B2T", "fill": "$--accent-red", "content": "Twitter Thread Experiment", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG2B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] } ] }, { "type": "frame", "id": "rbF03refG3", "name": "refByGroup — via Topics", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "rbF03refG3T", "fill": "$--muted-foreground", "opacity": 0.7, "content": "VIA TOPICS", "fontFamily": "IBM Plex Mono", "fontSize": 9 }, { "type": "frame", "id": "rbF03refG3B1", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG3B1T", "fill": "$--accent-blue", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG3B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] }, { "type": "frame", "id": "rbF03refG3B2", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "text", "id": "rbF03refG3B2T", "fill": "$--accent-blue", "content": "Newsletter Strategy 2026", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "rbF03refG3B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] } ] } ] }, { "type": "frame", "id": "rbF03bl", "name": "Backlinks Section", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "frame", "id": "rbF03blH", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "rbF03blT", "fill": "$--muted-foreground", "content": "BACKLINKS", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "text", "id": "rbF03blC", "fill": "$--muted-foreground", "content": "3", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "normal" } ] }, { "type": "text", "id": "rbF03blI1", "fill": "$--primary", "content": "Write Weekly Essays", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "rbF03blI2", "fill": "$--primary", "content": "Monthly Review Template", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "rbF03blI3", "fill": "$--primary", "content": "Q1 Planning", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "reF01", "x": 2100, "y": 18040, "name": "Relations Edit — Default (hover to reveal remove)", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 520, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "reF01h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "reF01hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF01hI", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF01hT", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "reF01hX", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "reF01rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "reF01relG1", "name": "relGroup — Belongs to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF01relG1T", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF01relG1B1", "name": "relPill1", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF01relG1B1T", "fill": "$--accent-blue", "content": "Grow Newsletter", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF01relG1B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF01relG1B1X", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--accent-blue", "annotation": "visible on hover" }, { "type": "icon_font", "id": "reF01relG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "target", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "reF01relG1Add", "name": "addBtn", "gap": 4, "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "icon_font", "id": "reF01relG1AddI", "width": 14, "height": 14, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF01relG1AddT", "fill": "$--muted-foreground", "content": "Add", "fontFamily": "Inter", "fontSize": 12 } ] } ] }, { "type": "frame", "id": "reF01relG2", "name": "relGroup — Related to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF01relG2T", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF01relG2B1", "name": "relPill2", "width": "fill_container", "fill": "$--accent-purple-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF01relG2B1T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF01relG2B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF01relG2B1X", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--accent-purple", "annotation": "visible on hover" }, { "type": "icon_font", "id": "reF01relG2B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] }, { "type": "frame", "id": "reF01relG2B2", "name": "relPill3", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF01relG2B2T", "fill": "$--accent-red", "content": "Failed SEO Experiment", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF01relG2B2R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF01relG2B2X", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--accent-red", "annotation": "visible on hover" }, { "type": "icon_font", "id": "reF01relG2B2I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] } ] }, { "type": "frame", "id": "reF01relG2Add", "name": "addBtn", "gap": 4, "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "icon_font", "id": "reF01relG2AddI", "width": 14, "height": 14, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF01relG2AddT", "fill": "$--muted-foreground", "content": "Add", "fontFamily": "Inter", "fontSize": 12 } ] } ] } ] } ] }, { "type": "frame", "id": "reF02", "x": 2520, "y": 18040, "name": "Relations Edit — Hover on pill (X remove visible)", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 520, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "reF02h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "reF02hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF02hI", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF02hT", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "reF02hX", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "reF02rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "reF02relG1", "name": "relGroup — Belongs to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF02relG1T", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF02relG1B1", "name": "relPill1 — hovered", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--accent-blue", "opacity": 0.3 }, "annotation": "pill is hovered — X button fully visible", "children": [ { "type": "text", "id": "reF02relG1B1T", "fill": "$--accent-blue", "content": "Grow Newsletter", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF02relG1B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF02relG1B1X", "width": 14, "height": 14, "opacity": 1, "iconFontName": "x-circle", "iconFontFamily": "phosphor", "fill": "$--accent-blue", "annotation": "X remove — fully visible on hover" }, { "type": "icon_font", "id": "reF02relG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "target", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "reF02relG1Add", "name": "addBtn", "gap": 4, "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "icon_font", "id": "reF02relG1AddI", "width": 14, "height": 14, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF02relG1AddT", "fill": "$--muted-foreground", "content": "Add", "fontFamily": "Inter", "fontSize": 12 } ] } ] }, { "type": "frame", "id": "reF02relG2", "name": "relGroup — Related to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF02relG2T", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF02relG2B1", "name": "relPill2", "width": "fill_container", "fill": "$--accent-purple-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF02relG2B1T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF02relG2B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF02relG2B1X", "width": 14, "height": 14, "opacity": 0, "iconFontName": "x-circle", "iconFontFamily": "phosphor", "fill": "$--accent-purple", "annotation": "hidden — not hovered" }, { "type": "icon_font", "id": "reF02relG2B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] }, { "type": "frame", "id": "reF02relG2Add", "name": "addBtn", "gap": 4, "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "icon_font", "id": "reF02relG2AddI", "width": 14, "height": 14, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF02relG2AddT", "fill": "$--muted-foreground", "content": "Add", "fontFamily": "Inter", "fontSize": 12 } ] } ] } ] } ] }, { "type": "frame", "id": "reF03", "x": 0, "y": 18880, "name": "Relations Edit — Add expanded with autocomplete", "theme": { "Mode": "Light" }, "clip": true, "width": 320, "height": 620, "fill": "$--background", "layout": "vertical", "gap": 16, "padding": 16, "children": [ { "type": "frame", "id": "reF03h", "name": "Inspector Header", "width": "fill_container", "height": 36, "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "reF03hL", "name": "leftGroup", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03hI", "width": 16, "height": 16, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF03hT", "fill": "$--muted-foreground", "content": "Properties", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "icon_font", "id": "reF03hX", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "reF03rel", "name": "Relationships Section", "width": "fill_container", "layout": "vertical", "gap": 16, "children": [ { "type": "frame", "id": "reF03relG1", "name": "relGroup — Belongs to (add expanded)", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF03relG1T", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF03relG1B1", "name": "relPill1", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF03relG1B1T", "fill": "$--accent-blue", "content": "Grow Newsletter", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF03relG1B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG1B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "target", "iconFontFamily": "phosphor", "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "reF03relG1Input", "name": "addInputWrapper", "width": "fill_container", "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "reF03relG1InputF", "name": "textInputField", "width": "fill_container", "height": 32, "fill": "$--background", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--primary" }, "padding": [ 6, 10 ], "alignItems": "center", "gap": 4, "children": [ { "type": "icon_font", "id": "reF03relG1InputSI", "width": 14, "height": 14, "iconFontName": "magnifying-glass", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF03relG1InputTV", "fill": "$--foreground", "content": "Eng", "fontFamily": "Inter", "fontSize": 12 }, { "type": "frame", "id": "reF03relG1InputCursor", "name": "textCursor", "width": 1, "height": 14, "fill": "$--primary" } ] }, { "type": "frame", "id": "reF03relG1Drop", "name": "autocompleteDropdown", "width": "fill_container", "fill": "$--popover", "cornerRadius": 6, "stroke": { "align": "outside", "thickness": 1, "fill": "$--border" }, "layout": "vertical", "padding": [ 4, 0 ], "children": [ { "type": "frame", "id": "reF03relG1DropI1", "name": "suggestion1 — highlighted", "width": "fill_container", "fill": "$--accent", "cornerRadius": 4, "padding": [ 6, 10 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG1DropI1I", "width": 14, "height": 14, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" }, { "type": "text", "id": "reF03relG1DropI1T", "fill": "$--foreground", "content": "Engineering Leadership 101", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" } ] }, { "type": "frame", "id": "reF03relG1DropI2", "name": "suggestion2", "width": "fill_container", "padding": [ 6, 10 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG1DropI2I", "width": 14, "height": 14, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" }, { "type": "text", "id": "reF03relG1DropI2T", "fill": "$--foreground", "content": "Engineering Metrics", "fontFamily": "Inter", "fontSize": 12 } ] }, { "type": "frame", "id": "reF03relG1DropI3", "name": "suggestion3", "width": "fill_container", "padding": [ 6, 10 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG1DropI3I", "width": 14, "height": 14, "iconFontName": "target", "iconFontFamily": "phosphor", "fill": "$--accent-blue" }, { "type": "text", "id": "reF03relG1DropI3T", "fill": "$--foreground", "content": "English Writing Course", "fontFamily": "Inter", "fontSize": 12 } ] }, { "type": "frame", "id": "reF03relG1DropI4", "name": "suggestion4", "width": "fill_container", "padding": [ 6, 10 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG1DropI4I", "width": 14, "height": 14, "iconFontName": "flask", "iconFontFamily": "phosphor", "fill": "$--accent-red" }, { "type": "text", "id": "reF03relG1DropI4T", "fill": "$--foreground", "content": "Engine Performance Tests", "fontFamily": "Inter", "fontSize": 12 } ] } ] } ] } ] }, { "type": "frame", "id": "reF03relG2", "name": "relGroup — Related to", "width": "fill_container", "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "reF03relG2T", "fill": "$--muted-foreground", "content": "RELATED TO", "fontFamily": "IBM Plex Mono", "fontSize": 10 }, { "type": "frame", "id": "reF03relG2B1", "name": "relPill2", "width": "fill_container", "fill": "$--accent-purple-light", "cornerRadius": 6, "padding": [ 6, 10 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "reF03relG2B1T", "fill": "$--accent-purple", "content": "On Writing Well", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "reF03relG2B1R", "name": "rightIcons", "gap": 6, "alignItems": "center", "children": [ { "type": "icon_font", "id": "reF03relG2B1I", "width": 14, "height": 14, "opacity": 0.5, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--accent-purple" } ] } ] }, { "type": "frame", "id": "reF03relG2Add", "name": "addBtn", "gap": 4, "alignItems": "center", "padding": [ 4, 0 ], "children": [ { "type": "icon_font", "id": "reF03relG2AddI", "width": 14, "height": 14, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" }, { "type": "text", "id": "reF03relG2AddT", "fill": "$--muted-foreground", "content": "Add", "fontFamily": "Inter", "fontSize": 12 } ] } ] } ] } ] }, { "type": "frame", "id": "urlDefault", "x": 420, "y": 18880, "name": "URL Property — default state (no hover)", "width": 320, "height": 40, "fill": "$--background", "layout": "horizontal", "alignItems": "center", "padding": [ 6, 6 ], "gap": 8, "children": [ { "type": "text", "id": "urlDefaultLabel", "name": "label", "content": "URL", "fontSize": 10, "fontWeight": 600, "letterSpacing": 1.2, "textTransform": "uppercase", "fill": "$--muted-foreground" }, { "type": "frame", "id": "urlDefaultValueWrap", "name": "value-wrapper", "width": "fill_container", "layout": "horizontal", "alignItems": "center", "justifyContent": "end", "gap": 4, "children": [ { "type": "text", "id": "urlDefaultValue", "name": "url-value", "content": "https://example.com/article", "fontSize": 13, "fill": "$--foreground", "textAlign": "right" }, { "type": "text", "id": "urlDefaultEditIcon", "name": "edit-icon", "content": "pencil", "fontSize": 12, "fill": "$--muted-foreground", "opacity": 0 } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "urlHover", "x": 840, "y": 18880, "name": "URL Property — hover state (underline + pointer cursor)", "width": 320, "height": 40, "fill": "$--muted", "layout": "horizontal", "alignItems": "center", "padding": [ 6, 6 ], "gap": 8, "children": [ { "type": "text", "id": "urlHoverLabel", "name": "label", "content": "URL", "fontSize": 10, "fontWeight": 600, "letterSpacing": 1.2, "textTransform": "uppercase", "fill": "$--muted-foreground" }, { "type": "frame", "id": "urlHoverValueWrap", "name": "value-wrapper", "width": "fill_container", "layout": "horizontal", "alignItems": "center", "justifyContent": "end", "gap": 4, "children": [ { "type": "text", "id": "urlHoverValue", "name": "url-value-hovered", "content": "https://example.com/article", "fontSize": 13, "fill": "$--primary", "textDecoration": "underline", "textAlign": "right" }, { "type": "text", "id": "urlHoverEditIcon", "name": "edit-icon-visible", "content": "pencil", "fontSize": 12, "fill": "$--muted-foreground", "opacity": 1 } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "urlEdit", "x": 1260, "y": 18880, "name": "URL Property — edit mode (double-click or edit icon)", "width": 320, "height": 40, "fill": "$--background", "layout": "horizontal", "alignItems": "center", "padding": [ 6, 6 ], "gap": 8, "children": [ { "type": "text", "id": "urlEditLabel", "name": "label", "content": "URL", "fontSize": 10, "fontWeight": 600, "letterSpacing": 1.2, "textTransform": "uppercase", "fill": "$--muted-foreground" }, { "type": "frame", "id": "urlEditInputWrap", "name": "input-wrapper", "width": "fill_container", "height": 28, "fill": "$--muted", "cornerRadius": 4, "stroke": { "align": "inside", "thickness": 1, "fill": "$--primary" }, "padding": [ 4, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "urlEditInput", "name": "edit-input", "content": "https://example.com/article", "fontSize": 13, "fill": "$--foreground" } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_note_list_and_virtua", "content": "NOTE LIST & VIRTUAL LIST", "x": 0, "y": 19580, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "vl001", "x": 0, "y": 19610, "name": "Virtual List — Default State (9000+ notes)", "theme": { "Mode": "Light" }, "clip": true, "width": 300, "height": 900, "fill": "$--card", "layout": "vertical", "children": [ { "type": "frame", "id": "vl002", "name": "Header", "width": "fill_container", "height": 45, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl003", "text": "Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "vl004", "text": "9,236 items", "fontSize": 11, "fill": "$--muted-foreground", "x": 200 } ] }, { "type": "frame", "id": "vl005", "name": "Virtualized Viewport", "width": "fill_container", "height": "fill_container", "fill": "$--card", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "vl006", "name": "NoteItem-visible-1", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl007", "text": "Build Laputa App", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "vl008", "text": "This paragraph has bold text, italic text...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl009", "text": "2m ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl010", "name": "NoteItem-visible-2", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl011", "text": "Facebook Ads Strategy", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl012", "text": "Lookalike audiences convert 3x better...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl013", "text": "5h ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl014", "name": "NoteItem-visible-3", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl015", "text": "Quick Meeting 1", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl016", "text": "Key findings from the latest analysis...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl017", "text": "1d ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl018", "name": "NoteItem-visible-4", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl019", "text": "Advanced Strategy 2", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl020", "text": "Notes on process improvements...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl021", "text": "2d ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl022", "name": "NoteItem-visible-5-selected", "width": "fill_container", "height": 72, "fill": "$--accent-blue-light", "stroke": { "align": "inside", "thickness": { "left": 3, "bottom": 1 }, "fill": "$--accent-blue" }, "padding": [ 14, 13 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl023", "text": "Daily Review 3", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "vl024", "text": "Summary of decisions made during review...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl025", "text": "3d ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl026", "name": "NoteItem-visible-6", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl027", "text": "Weekly Plan 4", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl028", "text": "Action items and follow-ups...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl029", "text": "4d ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl030", "name": "scrollbar-indicator", "width": 6, "height": 40, "fill": "$--muted-foreground", "opacity": 0.3, "cornerRadius": 3, "x": 290, "y": 200 } ] } ] }, { "type": "frame", "id": "vl100", "x": 400, "y": 19610, "name": "Virtual List — Scrolled Mid-list", "theme": { "Mode": "Light" }, "clip": true, "width": 300, "height": 900, "fill": "$--card", "layout": "vertical", "children": [ { "type": "frame", "id": "vl101", "name": "Header", "width": "fill_container", "height": 45, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl102", "text": "Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vl103", "name": "Virtualized Viewport — items 4500-4512", "width": "fill_container", "height": "fill_container", "fill": "$--card", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "vl104", "name": "NoteItem-mid-1", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl105", "text": "Final Report 4501", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl106", "text": "Draft outline for upcoming deliverable.", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl107", "text": "Jan 15", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl108", "name": "NoteItem-mid-2", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl109", "text": "Revised Checklist 4502", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl110", "text": "Reference material for ongoing initiative.", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl111", "text": "Jan 14", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl112", "name": "NoteItem-mid-3", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl113", "text": "Archived Template 4503", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl114", "text": "Tracking progress on quarterly objectives.", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl115", "text": "Jan 13", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl116", "name": "NoteItem-mid-4", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl117", "text": "New Framework 4504", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl118", "text": "Comparison of different approaches.", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl119", "text": "Jan 12", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl120", "name": "scrollbar-indicator-mid", "width": 6, "height": 40, "fill": "$--muted-foreground", "opacity": 0.3, "cornerRadius": 3, "x": 290, "y": 440 } ] } ] }, { "type": "frame", "id": "vl200", "x": 800, "y": 19610, "name": "Virtual List — Search Filtering", "theme": { "Mode": "Light" }, "clip": true, "width": 300, "height": 900, "fill": "$--card", "layout": "vertical", "children": [ { "type": "frame", "id": "vl201", "name": "Header", "width": "fill_container", "height": 45, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl202", "text": "Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vl203", "name": "Search Bar", "width": "fill_container", "height": 40, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 8, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "vl204", "name": "search-input", "width": "fill_container", "height": 32, "fill": "$--background", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl205", "text": "strategy", "fontSize": 13, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "vl206", "name": "Filtered Results (23 matches)", "width": "fill_container", "height": "fill_container", "fill": "$--card", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "vl207", "name": "NoteItem-filtered-1", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl208", "text": "Facebook Ads Strategy", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl209", "text": "Lookalike audiences convert 3x better...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl210", "text": "5h ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl211", "name": "NoteItem-filtered-2", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl212", "text": "Advanced Strategy 2", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl213", "text": "Notes on process improvements...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl214", "text": "2d ago", "fontSize": 10, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vl215", "name": "NoteItem-filtered-3", "width": "fill_container", "height": 72, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 14, 16 ], "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "vl216", "text": "Quick Strategy 10", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "text", "id": "vl217", "text": "Key findings from the latest analysis...", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "text", "id": "vl218", "text": "Jan 5", "fontSize": 10, "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "vl300", "x": 1200, "y": 19610, "name": "Virtual List — Empty Search Result", "theme": { "Mode": "Light" }, "clip": true, "width": 300, "height": 400, "fill": "$--card", "layout": "vertical", "children": [ { "type": "frame", "id": "vl301", "name": "Header", "width": "fill_container", "height": 45, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl302", "text": "Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vl303", "name": "Search Bar", "width": "fill_container", "height": 40, "fill": "$--card", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 8, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "vl304", "name": "search-input", "width": "fill_container", "height": 32, "fill": "$--background", "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "vl305", "text": "xyznonexistent", "fontSize": 13, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "vl306", "name": "Empty State", "width": "fill_container", "height": "fill_container", "fill": "$--card", "layout": "vertical", "justifyContent": "center", "alignItems": "center", "padding": [ 32, 16 ], "children": [ { "type": "text", "id": "vl307", "text": "No matching notes", "fontSize": 13, "fill": "$--muted-foreground", "textAlign": "center" } ] } ] }, { "type": "frame", "id": "mni01", "x": 1600, "y": 19610, "name": "Modified Note Indicator — NoteList States", "width": 340, "height": "fit_content(600)", "fill": "$--card", "layout": "vertical", "children": [ { "type": "text", "id": "mni01t", "fill": "$--muted-foreground", "content": "NoteList — Modified vs Clean", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "width": "fill_container", "padding": [ 8, 16 ] }, { "type": "frame", "id": "mni02", "name": "Note Item — Modified", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "mni02r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "mni02tg", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "mni02dot", "name": "Modified Indicator", "width": 6, "height": 6, "fill": "$--accent-orange" }, { "type": "text", "id": "mni02ti", "fill": "$--foreground", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "mni02ic", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-red" } ] }, { "type": "text", "id": "mni02sn", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Personal knowledge management app built with Tauri + React.", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "mni02tm", "fill": "$--muted-foreground", "content": "2m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "mni03", "name": "Note Item — Clean (no indicator)", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "mni03r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "mni03ti", "fill": "$--foreground", "content": "Facebook Ads Strategy", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "icon_font", "id": "mni03ic", "width": 14, "height": 14, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "text", "id": "mni03sn", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "Lookalike audiences convert 3x better than cold.", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "mni03tm", "fill": "$--muted-foreground", "content": "1h ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] }, { "type": "frame", "id": "mni04", "name": "Note Item — Added (new file)", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "mni04r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "mni04tg", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "mni04dot", "name": "Modified Indicator", "width": 6, "height": 6, "fill": "$--accent-orange" }, { "type": "text", "id": "mni04ti", "fill": "$--foreground", "content": "AI Agents Primer", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "mni04ic", "width": 14, "height": 14, "iconFontName": "file-text", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "text", "id": "mni04sn", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "How autonomous agents are changing software development.", "lineHeight": 1.5, "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "text", "id": "mni04tm", "fill": "$--muted-foreground", "content": "5m ago", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dp01", "x": 2040, "y": 19610, "name": "NoteStatus — NoteList (New vs Modified)", "width": 340, "height": "fit_content(600)", "fill": "$--card", "layout": "vertical", "children": [ { "type": "text", "id": "dp01t", "fill": "$--muted-foreground", "content": "NoteList — New vs Modified vs Clean", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "width": "fill_container", "padding": [ 8, 16 ] }, { "type": "frame", "id": "dp02", "name": "Note Item — New (green dot)", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "dp02r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dp02tg", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "dp02dot", "name": "New Indicator (green)", "width": 6, "height": 6, "fill": "$--accent-green" }, { "type": "text", "id": "dp02ti", "fill": "$--foreground", "content": "Untitled Note", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "text", "id": "dp02d", "fill": "$--muted-foreground", "content": "just now", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "dp02s", "fill": "$--muted-foreground", "content": "New note created in this session, never saved to disk", "fontFamily": "Inter", "fontSize": 12, "width": "fill_container" } ] }, { "type": "frame", "id": "dp03", "name": "Note Item — Modified (orange dot)", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "dp03r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dp03tg", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "dp03dot", "name": "Modified Indicator (orange)", "width": 6, "height": 6, "fill": "$--accent-orange" }, { "type": "text", "id": "dp03ti", "fill": "$--foreground", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "text", "id": "dp03d", "fill": "$--muted-foreground", "content": "2 hours ago", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "dp03s", "fill": "$--muted-foreground", "content": "Existing note with uncommitted git changes", "fontFamily": "Inter", "fontSize": 12, "width": "fill_container" } ] }, { "type": "frame", "id": "dp04", "name": "Note Item — Clean (no dot)", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "layout": "vertical", "gap": 4, "padding": [ 14, 16 ], "children": [ { "type": "frame", "id": "dp04r", "name": "titleRow", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dp04tg", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "dp04ti", "fill": "$--foreground", "content": "Meeting Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "text", "id": "dp04d", "fill": "$--muted-foreground", "content": "yesterday", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "dp04s", "fill": "$--muted-foreground", "content": "No indicator — clean, committed note", "fontFamily": "Inter", "fontSize": 12, "width": "fill_container" } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_sidebar_and_sections", "content": "SIDEBAR & SECTIONS", "x": 0, "y": 20590, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dsg01a", "name": "Sidebar — Drag Handles Visible", "x": 0, "y": 20620, "width": 330, "height": 680, "fill": "$--background", "layout": "vertical", "padding": [ 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dsg01b", "name": "frame1Title", "content": "Drag handles appear on section headers", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600", "fill": "$--foreground" }, { "type": "text", "id": "dsg01c", "name": "frame1Desc", "content": "Grip icon shown left of section icon. Cursor changes to grab on hover.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground" }, { "type": "frame", "id": "dsg01d", "height": 12 }, { "type": "frame", "id": "dsg01e", "name": "sidebarDefault", "width": 250, "height": 600, "fill": "$--sidebar", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "dsg01f", "name": "filters", "width": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 8, 6 ], "children": [ { "type": "frame", "id": "dsg01g", "name": "allNotesRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg01h", "width": 18, "height": 18, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg01i", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg01j", "name": "favRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg01k", "width": 18, "height": 18, "iconFontName": "star", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg01l", "fill": "$--muted-foreground", "content": "Favorites", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg01m", "name": "sectionsWrap", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "dsg00a", "name": "projGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "dsg005", "name": "projHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg001", "name": "projLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg000", "name": "projDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg002", "name": "projIcon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "dsg003", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg004", "name": "projChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dsg006", "name": "projItem0", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "fill": "$--accent-red-light", "children": [ { "type": "text", "id": "dsg007", "name": "projItemTxt0", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg008", "name": "projItem1", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "dsg009", "name": "projItemTxt1", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg00h", "name": "respGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg00g", "name": "respHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg00c", "name": "respLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg00b", "name": "respDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg00d", "name": "respIcon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg00e", "name": "respLabel", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg00f", "name": "respChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg00o", "name": "procGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg00n", "name": "procHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg00j", "name": "procLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg00i", "name": "procDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg00k", "name": "procIcon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg00l", "name": "procLabel", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg00m", "name": "procChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg00v", "name": "peopleGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg00u", "name": "peopleHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg00q", "name": "peopleLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg00p", "name": "peopleDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg00r", "name": "peopleIcon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg00s", "name": "peopleLabel", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg00t", "name": "peopleChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg012", "name": "eventsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg011", "name": "eventsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg00x", "name": "eventsLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg00w", "name": "eventsDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg00y", "name": "eventsIcon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg00z", "name": "eventsLabel", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg010", "name": "eventsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg019", "name": "topicsGroup", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg018", "name": "topicsHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg014", "name": "topicsLeft", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg013", "name": "topicsDrag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg015", "name": "topicsIcon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "dsg016", "name": "topicsLabel", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg017", "name": "topicsChev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] } ] } ] }, { "type": "frame", "id": "dsg02w", "name": "Sidebar — Section Being Dragged", "x": 430, "y": 20620, "width": 330, "height": 680, "fill": "$--background", "layout": "vertical", "padding": [ 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dsg02x", "name": "frame2Title", "content": "Dragging \"People\" above \"Responsibilities\"", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600", "fill": "$--foreground" }, { "type": "text", "id": "dsg02y", "name": "frame2Desc", "content": "Blue drop indicator line shows insertion point. Dragged section floats with blue border.", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground" }, { "type": "frame", "id": "dsg02z", "height": 12 }, { "type": "frame", "id": "dsg030", "name": "sidebarDragging", "width": 250, "height": 600, "fill": "$--sidebar", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "dsg031", "name": "filters", "width": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 8, 6 ], "children": [ { "type": "frame", "id": "dsg032", "name": "allNotesRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg033", "width": 18, "height": 18, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg034", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg035", "name": "favRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg036", "width": 18, "height": 18, "iconFontName": "star", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg037", "fill": "$--muted-foreground", "content": "Favorites", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg038", "name": "sectionsWrap", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "dsg01x", "name": "proj2Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "dsg01s", "name": "proj2Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg01o", "name": "proj2Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg01n", "name": "proj2Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg01p", "name": "proj2Icon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "dsg01q", "name": "proj2Label", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg01r", "name": "proj2Chev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dsg01t", "name": "proj2Item0", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "fill": "$--accent-red-light", "children": [ { "type": "text", "id": "dsg01u", "name": "proj2ItemTxt0", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg01v", "name": "proj2Item1", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "dsg01w", "name": "proj2ItemTxt1", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg01y", "name": "dropIndicator", "width": "fill_container", "height": 2, "fill": "$--accent-blue", "cornerRadius": 1 }, { "type": "frame", "id": "dsg025", "name": "resp2Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg024", "name": "resp2Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg020", "name": "resp2Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg01z", "name": "resp2Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg021", "name": "resp2Icon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg022", "name": "resp2Label", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg023", "name": "resp2Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg02c", "name": "proc2Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg02b", "name": "proc2Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg027", "name": "proc2Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg026", "name": "proc2Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg028", "name": "proc2Icon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg029", "name": "proc2Label", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg02a", "name": "proc2Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg02j", "name": "events2Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg02i", "name": "events2Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg02e", "name": "events2Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg02d", "name": "events2Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg02f", "name": "events2Icon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg02g", "name": "events2Label", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg02h", "name": "events2Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg02q", "name": "topics2Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg02p", "name": "topics2Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg02l", "name": "topics2Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg02k", "name": "topics2Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg02m", "name": "topics2Icon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "dsg02n", "name": "topics2Label", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg02o", "name": "topics2Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] } ] }, { "type": "frame", "id": "dsg02r", "name": "draggedSection", "x": 8, "y": 160, "width": 234, "fill": "$--sidebar", "cornerRadius": 6, "stroke": { "align": "outside", "thickness": 1, "fill": { "type": "color", "color": "$--accent-blue" } }, "opacity": 0.9, "layout": "vertical", "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg02s", "name": "draggedHeader", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg02t", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--accent-blue", "opacity": 0.8 }, { "type": "icon_font", "id": "dsg02u", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg02v", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ] }, { "type": "frame", "id": "dsg04j", "name": "Sidebar — After Reorder (People Moved Up)", "x": 860, "y": 20620, "width": 330, "height": 680, "fill": "$--background", "layout": "vertical", "padding": [ 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "dsg04k", "name": "frame3Title", "content": "After drop — People now second section", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600", "fill": "$--foreground" }, { "type": "text", "id": "dsg04l", "name": "frame3Desc", "content": "Order persisted as \"order\" property in each Type document frontmatter (e.g. order: 2).", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "fill": "$--muted-foreground" }, { "type": "frame", "id": "dsg04m", "height": 12 }, { "type": "frame", "id": "dsg04n", "name": "sidebarReordered", "width": 250, "height": 600, "fill": "$--sidebar", "layout": "vertical", "clip": true, "children": [ { "type": "frame", "id": "dsg04o", "name": "filters", "width": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 8, 6 ], "children": [ { "type": "frame", "id": "dsg04p", "name": "allNotesRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg04q", "width": 18, "height": 18, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg04r", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg04s", "name": "favRow", "width": "fill_container", "cornerRadius": 4, "padding": [ 6, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg04t", "width": 18, "height": 18, "iconFontName": "star", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "dsg04u", "fill": "$--muted-foreground", "content": "Favorites", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg04v", "name": "sectionsWrap", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "dsg03j", "name": "proj3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6, 8, 6 ], "children": [ { "type": "frame", "id": "dsg03e", "name": "proj3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg03a", "name": "proj3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg039", "name": "proj3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg03b", "name": "proj3Icon", "width": 18, "height": 18, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-red" }, { "type": "text", "id": "dsg03c", "name": "proj3Label", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg03d", "name": "proj3Chev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "dsg03f", "name": "proj3Item0", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "fill": "$--accent-red-light", "children": [ { "type": "text", "id": "dsg03g", "name": "proj3ItemTxt0", "fill": "$--accent-red", "content": "Laputa App", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "dsg03h", "name": "proj3Item1", "width": "fill_container", "cornerRadius": 6, "padding": [ 6, 16, 6, 28 ], "alignItems": "center", "children": [ { "type": "text", "id": "dsg03i", "name": "proj3ItemTxt1", "fill": "$--muted-foreground", "content": "Portfolio Rewrite", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "dsg03q", "name": "people3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg03p", "name": "people3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg03l", "name": "people3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg03k", "name": "people3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg03m", "name": "people3Icon", "width": 18, "height": 18, "iconFontName": "leaf", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg03n", "name": "people3Label", "fill": "$--foreground", "content": "People", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg03o", "name": "people3Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg03x", "name": "resp3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg03w", "name": "resp3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg03s", "name": "resp3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg03r", "name": "resp3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg03t", "name": "resp3Icon", "width": 18, "height": 18, "iconFontName": "medal", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg03u", "name": "resp3Label", "fill": "$--foreground", "content": "Responsibilities", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg03v", "name": "resp3Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg044", "name": "proc3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg043", "name": "proc3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg03z", "name": "proc3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg03y", "name": "proc3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg040", "name": "proc3Icon", "width": 18, "height": 18, "iconFontName": "arrows-clockwise", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-purple" }, { "type": "text", "id": "dsg041", "name": "proc3Label", "fill": "$--foreground", "content": "Procedures", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg042", "name": "proc3Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg04b", "name": "events3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg04a", "name": "events3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg046", "name": "events3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg045", "name": "events3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg047", "name": "events3Icon", "width": 18, "height": 18, "iconFontName": "cardholder", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-yellow" }, { "type": "text", "id": "dsg048", "name": "events3Label", "fill": "$--foreground", "content": "Events", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg049", "name": "events3Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "dsg04i", "name": "topics3Group", "width": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": { "type": "color", "color": "$--border", "enabled": false } }, "layout": "vertical", "gap": 2, "padding": [ 4, 6 ], "children": [ { "type": "frame", "id": "dsg04h", "name": "topics3Header", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "dsg04d", "name": "topics3Left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "dsg04c", "name": "topics3Drag", "width": 14, "height": 14, "iconFontName": "grip-vertical", "iconFontFamily": "lucide", "fill": "$--muted-foreground", "opacity": 0.5 }, { "type": "icon_font", "id": "dsg04e", "name": "topics3Icon", "width": 18, "height": 18, "iconFontName": "tag", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-green" }, { "type": "text", "id": "dsg04f", "name": "topics3Label", "fill": "$--foreground", "content": "Topics", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "dsg04g", "name": "topics3Chev", "width": 14, "height": 14, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ] } ] } ] }, { "type": "frame", "id": "csA01", "x": 1670, "y": 20620, "name": "Sections Header — New Design", "theme": { "Mode": "Light" }, "clip": true, "width": 280, "height": 120, "fill": "$--sidebar", "layout": "vertical", "gap": 8, "padding": [ 16, 12 ], "children": [ { "type": "text", "id": "csA02", "name": "frameLabel", "fill": "$--muted-foreground", "content": "AFTER — New Design", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1 }, { "type": "frame", "id": "csA03", "name": "sectionsHeader", "width": "fill_container", "padding": [ 4, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "csA04", "name": "sectionsLabel", "fill": "$--muted-foreground", "content": "SECTIONS", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1.2 }, { "type": "icon_font", "id": "csA05", "name": "settingsIcon", "width": 14, "height": 14, "iconFontName": "sliders-horizontal", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "csA06", "name": "sectionRow", "width": "fill_container", "cornerRadius": 4, "gap": 8, "padding": [ 6, 16 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "csA07", "name": "left", "gap": 8, "alignItems": "center", "children": [ { "type": "icon_font", "id": "csA08", "name": "projIcon", "width": 16, "height": 16, "iconFontName": "wrench", "iconFontFamily": "phosphor", "fill": "$--accent-red" }, { "type": "text", "id": "csA09", "name": "projLabel", "fill": "$--foreground", "content": "Projects", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "icon_font", "id": "csA10", "name": "chevron", "width": 12, "height": 12, "iconFontName": "caret-right", "iconFontFamily": "phosphor", "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "trSB1", "x": 2050, "y": 20620, "name": "Trash — Sidebar Filter", "theme": { "Mode": "Light" }, "clip": true, "width": 260, "height": 400, "fill": "$--sidebar", "layout": "vertical", "gap": 0, "padding": [ 8, 6 ], "children": [ { "type": "frame", "id": "trFAll", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "trIAll", "name": "iconAll", "width": 16, "height": 16, "iconFontName": "file-text", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "trTAll", "name": "txtAll", "fill": "$--foreground", "content": "All Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "trFFav", "name": "filterFav", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "trIFav", "name": "iconFav", "width": 16, "height": 16, "iconFontName": "star", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "trTFav", "name": "txtFav", "fill": "$--foreground", "content": "Favorites", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] }, { "type": "frame", "id": "trFArc", "name": "filterArchive", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "trIArc", "name": "iconArchive", "width": 16, "height": 16, "iconFontName": "archive", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--foreground" }, { "type": "text", "id": "trTArc", "name": "txtArchive", "fill": "$--foreground", "content": "Archive", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "trBArc", "name": "badgeArc", "height": 20, "fill": "$--muted", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "trBTArc", "fill": "$--muted-foreground", "content": "2", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "trFTr", "name": "filterTrash", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "icon_font", "id": "trITr", "name": "iconTrash", "width": 16, "height": 16, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--destructive" }, { "type": "text", "id": "trTTr", "name": "txtTrash", "fill": "$--destructive", "content": "Trash", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "frame", "id": "trBTr", "name": "badgeTrash", "height": 20, "fill": "$--destructive", "cornerRadius": 9999, "padding": [ 0, 6 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "trBTTr", "fill": "$--background", "content": "3", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600" } ] } ] } ] }, { "type": "text", "id": "fg_modals_and_settings", "content": "MODALS & SETTINGS", "x": 0, "y": 21380, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "iogBH", "x": 0, "y": 21410, "name": "Settings Panel — Modal", "width": 520, "fill": "$--background", "cornerRadius": 12, "stroke": { "thickness": 1, "fill": "$--border" }, "layout": "vertical", "children": [ { "type": "frame", "id": "61XqC", "name": "Header", "width": "fill_container", "height": 56, "stroke": { "thickness": { "bottom": 1 }, "fill": "$--border" }, "padding": [ 0, 24 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "2IAX7", "name": "Title", "fill": "$--foreground", "content": "Settings", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600" }, { "type": "icon_font", "id": "kIGy9", "name": "Close Icon", "width": 16, "height": 16, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "Jk6ga", "name": "Body", "width": "fill_container", "layout": "vertical", "gap": 24, "padding": 24, "children": [ { "type": "text", "id": "efWNx", "name": "Section Label", "fill": "$--foreground", "content": "AI Provider Keys", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" }, { "type": "text", "id": "wYQL5", "name": "Section Description", "fill": "$--muted-foreground", "textGrowth": "fixed-width", "width": "fill_container", "content": "API keys are stored locally on your device. Never sent to our servers.", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "frame", "id": "lo4r8", "name": "Anthropic Key Row", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "WogRV", "name": "anthropicLabel", "fill": "$--foreground", "content": "Anthropic", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "GUELn", "name": "Input", "width": "fill_container", "height": 36, "fill": "$--background", "cornerRadius": "$--radius-md", "stroke": { "thickness": 1, "fill": "$--border" }, "gap": 8, "padding": [ 0, 10 ], "alignItems": "center", "children": [ { "type": "text", "id": "NjLRf", "name": "anthropicValue", "fill": "$--foreground", "content": "sk-ant-•••••••••••••k4Rm", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" }, { "type": "icon_font", "id": "kBDAI", "name": "anthropicClear", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "qaTjV", "name": "OpenAI Key Row", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "etofy", "name": "openaiLabel", "fill": "$--foreground", "content": "OpenAI", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "BKXuT", "name": "Input Empty", "width": "fill_container", "height": 36, "fill": "$--background", "cornerRadius": "$--radius-md", "stroke": { "thickness": 1, "fill": "$--border" }, "padding": [ 0, 10 ], "alignItems": "center", "children": [ { "type": "text", "id": "EHi9A", "name": "openaiPlaceholder", "fill": "$--muted-foreground", "content": "sk-...", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] }, { "type": "frame", "id": "ZM8dg", "name": "Google Key Row", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "qzpsp", "name": "googleLabel", "fill": "$--foreground", "content": "Google AI", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "pRsLr", "name": "Input Empty", "width": "fill_container", "height": 36, "fill": "$--background", "cornerRadius": "$--radius-md", "stroke": { "thickness": 1, "fill": "$--border" }, "padding": [ 0, 10 ], "alignItems": "center", "children": [ { "type": "text", "id": "KAqg2", "name": "googlePlaceholder", "fill": "$--muted-foreground", "content": "AIza...", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal" } ] } ] } ] }, { "type": "frame", "id": "be7TS", "name": "Footer", "width": "fill_container", "height": 56, "stroke": { "thickness": { "top": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 24 ], "justifyContent": "end", "alignItems": "center", "children": [ { "type": "text", "id": "LAIeB", "name": "footerHint", "fill": "$--muted-foreground", "content": "Cmd+, to open settings", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal" }, { "type": "frame", "id": "DR2VW", "name": "Spacer", "width": "fill_container", "height": 1 }, { "type": "frame", "id": "u9fBE", "name": "Save Button", "height": 32, "fill": "$--primary", "cornerRadius": "$--radius-md", "padding": [ 0, 16 ], "justifyContent": "center", "alignItems": "center", "children": [ { "type": "text", "id": "yRYWq", "name": "saveBtnLabel", "fill": "$--primary-foreground", "content": "Save", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghv01", "x": 620, "y": 21410, "name": "GitHub Vault — Modal empty state", "clip": true, "width": 560, "height": 480, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv01-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv01-title", "name": "title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "ghv01-close", "name": "closeBtn", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "ghv01-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv01-tabs", "name": "TabBar", "width": "fill_container", "height": 44, "fill": "$--background", "padding": [ 0, 24 ], "gap": 0, "alignItems": "end", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv01-tab-clone", "name": "Tab: Clone Existing", "padding": [ 8, 16 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--accent-blue" }, "children": [ { "type": "text", "id": "ghv01-tab-clone-lbl", "content": "Clone Existing", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv01-tab-create", "name": "Tab: Create New", "padding": [ 8, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv01-tab-create-lbl", "content": "Create New", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv01-body", "name": "Body: Empty State", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 32, 24 ], "gap": 16, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "frame", "id": "ghv01-icon", "name": "githubIcon", "width": 48, "height": 48, "cornerRadius": 24, "fill": "$--accent", "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "ghv01-gh", "content": "GH", "fontSize": 20, "fontWeight": 600, "fill": "$--muted-foreground" } ] }, { "type": "text", "id": "ghv01-heading", "content": "Clone an existing GitHub repository", "fontSize": 15, "fontWeight": 600, "fill": "$--foreground", "textAlign": "center" }, { "type": "text", "id": "ghv01-desc", "content": "Search your repos or paste a URL to clone a GitHub repo as a vault.", "fontSize": 13, "fill": "$--muted-foreground", "textAlign": "center", "width": 360 }, { "type": "frame", "id": "ghv01-search", "name": "SearchInput", "width": 400, "height": 40, "cornerRadius": 8, "fill": "$--input", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv01-placeholder", "content": "Search repos or paste URL...", "fontSize": 13, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv01-footer", "name": "Footer", "width": "fill_container", "height": 56, "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv01-hint", "content": "Connected as @lucaong", "fontSize": 11, "fill": "$--muted-foreground" }, { "type": "frame", "id": "ghv01-btns", "name": "buttons", "gap": 8, "alignItems": "center", "children": [ { "type": "frame", "id": "ghv01-cancel", "name": "cancelBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv01-cancel-lbl", "content": "Cancel", "fontSize": 13, "fill": "$--foreground" } ] } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghv02", "x": 1280, "y": 21410, "name": "GitHub Vault — Clone repo list", "clip": true, "width": 560, "height": 540, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv02-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv02-title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "ghv02-close", "name": "closeBtn", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "ghv02-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv02-tabs", "name": "TabBar", "width": "fill_container", "height": 44, "fill": "$--background", "padding": [ 0, 24 ], "gap": 0, "alignItems": "end", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv02-tab-clone", "name": "Tab: Clone Existing (active)", "padding": [ 8, 16 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--accent-blue" }, "children": [ { "type": "text", "id": "ghv02-tab-clone-lbl", "content": "Clone Existing", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv02-tab-create", "name": "Tab: Create New", "padding": [ 8, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-tab-create-lbl", "content": "Create New", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv02-body", "name": "Body: Repo List", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 16, 24 ], "gap": 12, "children": [ { "type": "frame", "id": "ghv02-search", "name": "SearchInput (filled)", "width": "fill_container", "height": 40, "cornerRadius": 8, "fill": "$--input", "stroke": { "align": "inside", "thickness": 1, "fill": "$--ring" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-search-val", "content": "laputa", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv02-list", "name": "RepoList", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 2, "children": [ { "type": "frame", "id": "ghv02-repo1", "name": "RepoItem: selected", "width": "fill_container", "height": 56, "cornerRadius": 6, "fill": "$--accent", "padding": [ 8, 12 ], "layout": "vertical", "gap": 4, "justifyContent": "center", "children": [ { "type": "frame", "id": "ghv02-repo1-row", "name": "topRow", "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-repo1-name", "content": "lucaong/laputa-vault", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "ghv02-repo1-badge", "name": "privateBadge", "padding": [ 2, 6 ], "cornerRadius": 4, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv02-repo1-priv", "content": "Private", "fontSize": 10, "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "ghv02-repo1-desc", "content": "Personal knowledge vault — markdown + YAML frontmatter", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "ghv02-repo2", "name": "RepoItem: unselected", "width": "fill_container", "height": 56, "cornerRadius": 6, "padding": [ 8, 12 ], "layout": "vertical", "gap": 4, "justifyContent": "center", "children": [ { "type": "frame", "id": "ghv02-repo2-row", "name": "topRow", "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-repo2-name", "content": "lucaong/laputa-app", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" }, { "type": "frame", "id": "ghv02-repo2-badge", "name": "publicBadge", "padding": [ 2, 6 ], "cornerRadius": 4, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv02-repo2-pub", "content": "Public", "fontSize": 10, "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "ghv02-repo2-desc", "content": "Laputa desktop app — Tauri + React + CodeMirror 6", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "ghv02-repo3", "name": "RepoItem: unselected 2", "width": "fill_container", "height": 56, "cornerRadius": 6, "padding": [ 8, 12 ], "layout": "vertical", "gap": 4, "justifyContent": "center", "children": [ { "type": "frame", "id": "ghv02-repo3-row", "name": "topRow", "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-repo3-name", "content": "lucaong/dotfiles", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" } ] }, { "type": "text", "id": "ghv02-repo3-desc", "content": "My macOS dotfiles and config", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv02-path", "name": "LocalPathPicker", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "ghv02-path-lbl", "content": "Clone to:", "fontSize": 12, "fontWeight": 500, "fill": "$--foreground" }, { "type": "frame", "id": "ghv02-path-input", "name": "pathInput", "width": "fill_container", "height": 36, "cornerRadius": 6, "fill": "$--input", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 10 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv02-path-val", "content": "~/Vaults/laputa-vault", "fontSize": 12, "fill": "$--foreground" } ] } ] } ] }, { "type": "frame", "id": "ghv02-footer", "name": "Footer", "width": "fill_container", "height": 56, "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv02-hint", "content": "3 repos found", "fontSize": 11, "fill": "$--muted-foreground" }, { "type": "frame", "id": "ghv02-btns", "name": "buttons", "gap": 8, "alignItems": "center", "children": [ { "type": "frame", "id": "ghv02-cancel", "name": "cancelBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv02-cancel-lbl", "content": "Cancel", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv02-clone-btn", "name": "cloneBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "fill": "$--primary", "children": [ { "type": "text", "id": "ghv02-clone-lbl", "content": "Clone & Open", "fontSize": 13, "fontWeight": 500, "fill": "$--background" } ] } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghv03", "x": 1940, "y": 21410, "name": "GitHub Vault — Create new repo", "clip": true, "width": 560, "height": 440, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv03-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv03-title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "ghv03-close", "name": "closeBtn", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "ghv03-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "ghv03-tabs", "name": "TabBar", "width": "fill_container", "height": 44, "fill": "$--background", "padding": [ 0, 24 ], "gap": 0, "alignItems": "end", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv03-tab-clone", "name": "Tab: Clone Existing", "padding": [ 8, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv03-tab-clone-lbl", "content": "Clone Existing", "fontSize": 13, "fontWeight": 400, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "ghv03-tab-create", "name": "Tab: Create New (active)", "padding": [ 8, 16 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 2 }, "fill": "$--accent-blue" }, "children": [ { "type": "text", "id": "ghv03-tab-create-lbl", "content": "Create New", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "ghv03-body", "name": "Body: Create Form", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 24, 24 ], "gap": 20, "children": [ { "type": "frame", "id": "ghv03-name-field", "name": "RepoNameField", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "ghv03-name-lbl", "content": "Repository name", "fontSize": 12, "fontWeight": 500, "fill": "$--foreground" }, { "type": "frame", "id": "ghv03-name-input", "name": "nameInput", "width": "fill_container", "height": 40, "cornerRadius": 8, "fill": "$--input", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv03-name-val", "content": "my-vault", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "text", "id": "ghv03-name-hint", "content": "github.com/lucaong/my-vault", "fontSize": 11, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "ghv03-vis-field", "name": "VisibilityToggle", "width": "fill_container", "layout": "vertical", "gap": 8, "children": [ { "type": "text", "id": "ghv03-vis-lbl", "content": "Visibility", "fontSize": 12, "fontWeight": 500, "fill": "$--foreground" }, { "type": "frame", "id": "ghv03-vis-opts", "name": "options", "gap": 12, "alignItems": "center", "children": [ { "type": "frame", "id": "ghv03-opt-priv", "name": "PrivateOption (selected)", "padding": [ 6, 12 ], "cornerRadius": 6, "fill": "$--accent", "stroke": { "align": "inside", "thickness": 1, "fill": "$--accent-blue" }, "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "ghv03-opt-priv-icon", "content": "Lock", "fontSize": 13, "fill": "$--accent-blue" }, { "type": "text", "id": "ghv03-opt-priv-lbl", "content": "Private", "fontSize": 13, "fontWeight": 500, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv03-opt-pub", "name": "PublicOption", "padding": [ 6, 12 ], "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "ghv03-opt-pub-icon", "content": "Globe", "fontSize": 13, "fill": "$--muted-foreground" }, { "type": "text", "id": "ghv03-opt-pub-lbl", "content": "Public", "fontSize": 13, "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "ghv03-path-field", "name": "LocalPathField", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [ { "type": "text", "id": "ghv03-path-lbl", "content": "Clone to:", "fontSize": 12, "fontWeight": 500, "fill": "$--foreground" }, { "type": "frame", "id": "ghv03-path-input", "name": "pathInput", "width": "fill_container", "height": 36, "cornerRadius": 6, "fill": "$--input", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "padding": [ 0, 10 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghv03-path-val", "content": "~/Vaults/my-vault", "fontSize": 12, "fill": "$--foreground" } ] } ] } ] }, { "type": "frame", "id": "ghv03-footer", "name": "Footer", "width": "fill_container", "height": 56, "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "end", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv03-btns", "name": "buttons", "gap": 8, "alignItems": "center", "children": [ { "type": "frame", "id": "ghv03-cancel", "name": "cancelBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv03-cancel-lbl", "content": "Cancel", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv03-create-btn", "name": "createBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "fill": "$--primary", "children": [ { "type": "text", "id": "ghv03-create-lbl", "content": "Create & Clone", "fontSize": 13, "fontWeight": 500, "fill": "$--background" } ] } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghv04", "x": 0, "y": 21990, "name": "GitHub Vault — Clone in progress", "clip": true, "width": 560, "height": 320, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv04-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv04-title", "content": "Cloning Repository...", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "ghv04-body", "name": "Body: Progress", "width": "fill_container", "height": "fill_container", "layout": "vertical", "padding": [ 32, 24 ], "gap": 20, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "frame", "id": "ghv04-spinner", "name": "spinner", "width": 40, "height": 40, "cornerRadius": 20, "stroke": { "align": "inside", "thickness": 3, "fill": "$--accent-blue" } }, { "type": "text", "id": "ghv04-status", "content": "Cloning lucaong/laputa-vault...", "fontSize": 14, "fontWeight": 500, "fill": "$--foreground", "textAlign": "center" }, { "type": "text", "id": "ghv04-sub", "content": "Receiving objects: 67% (1,234/1,842)", "fontSize": 12, "fill": "$--muted-foreground", "textAlign": "center" }, { "type": "frame", "id": "ghv04-bar-bg", "name": "progressBarBg", "width": 360, "height": 4, "cornerRadius": 2, "fill": "$--accent", "children": [ { "type": "frame", "id": "ghv04-bar-fill", "name": "progressBarFill", "width": 241, "height": 4, "cornerRadius": 2, "fill": "$--accent-blue" } ] } ] }, { "type": "frame", "id": "ghv04-footer", "name": "Footer", "width": "fill_container", "height": 56, "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "end", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "ghv04-cancel", "name": "cancelBtn", "padding": [ 6, 16 ], "cornerRadius": 6, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "ghv04-cancel-lbl", "content": "Cancel", "fontSize": 13, "fill": "$--foreground" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_editor_and_wikilinks", "content": "EDITOR & WIKILINKS", "x": 0, "y": 22390, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "wlc01", "x": 0, "y": 22420, "name": "Wikilink Colors — Editor View (Light)", "theme": { "Mode": "Light" }, "clip": true, "width": 760, "height": 440, "fill": "$--background", "layout": "vertical", "padding": [ 32, 40 ], "gap": 12, "children": [ { "type": "text", "id": "wlc02", "content": "Build Laputa App", "fontSize": 28, "fontWeight": 700, "fill": "$--foreground" }, { "type": "text", "id": "wlc03", "content": "Wiki-Links", "fontSize": 20, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "wlc10", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc10a", "content": "See ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc10b", "content": "Stock Screener — EMA200 Wick Bounce", "fontSize": 15, "fill": "$--accent-red", "textDecoration": "underline" }, { "type": "text", "id": "wlc10c", "content": " for the experiment approach.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "frame", "id": "wlc11", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc11a", "content": "Contact ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc11b", "content": "Matteo Cellini", "fontSize": 15, "fill": "$--accent-yellow", "textDecoration": "underline" }, { "type": "text", "id": "wlc11c", "content": " for sponsorship data.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "frame", "id": "wlc12", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc12a", "content": "Link to ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc12b", "content": "Grow Newsletter", "fontSize": 15, "fill": "$--accent-purple", "textDecoration": "underline" }, { "type": "text", "id": "wlc12c", "content": " responsibility.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "frame", "id": "wlc13", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc13a", "content": "Check ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc13b", "content": "Software Development", "fontSize": 15, "fill": "$--accent-green", "textDecoration": "underline" }, { "type": "text", "id": "wlc13c", "content": " for tech notes.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "frame", "id": "wlc14", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc14a", "content": "See ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc14b", "content": "Laputa App Design Session", "fontSize": 15, "fill": "$--accent-yellow", "textDecoration": "underline" }, { "type": "text", "id": "wlc14c", "content": " event recap.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "frame", "id": "wlc15", "name": "Legend", "layout": "horizontal", "gap": 16, "width": "fill_container", "height": "hug_contents", "padding": [ 12, 0, 0, 0 ], "children": [ { "type": "text", "id": "wlc15a", "content": "Experiment", "fontSize": 12, "fill": "$--accent-red" }, { "type": "text", "id": "wlc15b", "content": "Person / Event", "fontSize": 12, "fill": "$--accent-yellow" }, { "type": "text", "id": "wlc15c", "content": "Responsibility", "fontSize": 12, "fill": "$--accent-purple" }, { "type": "text", "id": "wlc15d", "content": "Topic", "fontSize": 12, "fill": "$--accent-green" } ] } ] }, { "type": "frame", "id": "wlc20", "x": 860, "y": 22420, "name": "Wikilink Colors — Broken Link State", "theme": { "Mode": "Light" }, "clip": true, "width": 500, "height": 200, "fill": "$--background", "layout": "vertical", "padding": [ 32, 40 ], "gap": 12, "children": [ { "type": "text", "id": "wlc21", "content": "Broken Wikilink", "fontSize": 20, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "wlc22", "layout": "horizontal", "gap": 0, "width": "fill_container", "height": "hug_contents", "children": [ { "type": "text", "id": "wlc22a", "content": "Also see ", "fontSize": 15, "fill": "$--foreground" }, { "type": "text", "id": "wlc22b", "content": "Non-Existent Note", "fontSize": 15, "fill": "$--muted-foreground", "textDecoration": "underline", "opacity": 0.7 }, { "type": "text", "id": "wlc22c", "content": " which is a broken link.", "fontSize": 15, "fill": "$--foreground" } ] }, { "type": "text", "id": "wlc23", "content": "Broken links show muted color + dashed underline + reduced opacity", "fontSize": 12, "fill": "$--muted-foreground", "fontStyle": "italic" } ] }, { "type": "frame", "id": "mb011", "x": 1960, "y": 22420, "name": "macOS Border — With Border", "theme": { "Mode": "Light" }, "clip": true, "width": 400, "height": 200, "fill": "$--background", "layout": "vertical", "children": [ { "type": "frame", "id": "mb012", "name": "macOS Title Bar (after)", "width": "fill_container", "height": 38, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "mb013", "name": "trafficLights", "gap": 8, "alignItems": "center", "children": [ { "type": "ellipse", "id": "mb014", "fill": "$--traffic-red", "width": 12, "height": 12 }, { "type": "ellipse", "id": "mb015", "fill": "$--traffic-yellow", "width": 12, "height": 12 }, { "type": "ellipse", "id": "mb016", "fill": "$--traffic-green", "width": 12, "height": 12 } ] } ] }, { "type": "frame", "id": "mb017", "name": "Sidebar Content (after)", "width": "fill_container", "height": "fill_container", "fill": "$--sidebar", "padding": [ 8, 12 ], "layout": "vertical", "gap": 4, "children": [ { "type": "text", "id": "mb018", "value": "All Notes", "fontSize": 14, "fill": "$--foreground" }, { "type": "text", "id": "mb019", "value": "Favorites", "fontSize": 14, "fill": "$--foreground" }, { "type": "text", "id": "mb020", "value": "Archive", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "text", "id": "fg_status_and_indicator", "content": "STATUS & INDICATORS", "x": 0, "y": 22940, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "mni10", "x": 0, "y": 22970, "name": "Modified Note Indicator — TabBar States", "width": 800, "height": 120, "fill": "$--sidebar", "layout": "vertical", "children": [ { "type": "text", "id": "mni10t", "fill": "$--muted-foreground", "content": "TabBar — Modified Dot on Dirty Tabs", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "padding": [ 8, 16 ] }, { "type": "frame", "id": "mni11", "name": "Tab Bar with Modified Indicators", "width": "fill_container", "height": 45, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--sidebar-border" }, "alignItems": "center", "children": [ { "type": "frame", "id": "mni11a", "name": "Tab Active — Modified", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "mni11at", "fill": "$--foreground", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "ellipse", "id": "mni11adot", "name": "Tab Modified Dot", "width": 6, "height": 6, "fill": "$--accent-orange" }, { "type": "icon_font", "id": "mni11ax", "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "mni11b", "name": "Tab Inactive — Clean", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "mni11bt", "fill": "$--muted-foreground", "content": "Facebook Ads Strategy", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "icon_font", "id": "mni11bx", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "mni11c", "name": "Tab Inactive — Modified", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "gap": 6, "padding": [ 0, 14 ], "alignItems": "center", "children": [ { "type": "text", "id": "mni11ct", "fill": "$--muted-foreground", "content": "AI Agents Primer", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal" }, { "type": "ellipse", "id": "mni11cdot", "name": "Tab Modified Dot", "width": 6, "height": 6, "fill": "$--accent-orange" }, { "type": "icon_font", "id": "mni11cx", "opacity": 0, "width": 14, "height": 14, "iconFontName": "x", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "mni11sp", "name": "tabSpacer", "width": "fill_container", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" } }, { "type": "frame", "id": "mni11ctrl", "name": "tabControls", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "bottom": 1, "left": 1 }, "fill": "$--border" }, "gap": 12, "padding": [ 0, 12 ], "justifyContent": "space_around", "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni11plus", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "phosphor", "fill": "$--muted-foreground" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "mni20", "x": 900, "y": 22970, "name": "Modified Note Indicator — StatusBar Pending Count", "width": 800, "height": 80, "fill": "$--background", "layout": "vertical", "children": [ { "type": "text", "id": "mni20t", "fill": "$--muted-foreground", "content": "StatusBar — Pending Changes Counter", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "padding": [ 8, 16 ] }, { "type": "frame", "id": "mni21", "name": "StatusBar with Pending Count", "width": "fill_container", "height": 30, "fill": "$--sidebar", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "padding": [ 0, 8 ], "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "frame", "id": "mni21l", "name": "left", "gap": 12, "alignItems": "center", "children": [ { "type": "frame", "id": "mni21v", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni21fi", "width": 13, "height": 13, "iconFontName": "folder-open", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "mni21fl", "fill": "$--muted-foreground", "content": "Demo v2", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "mni21s1", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11 }, { "type": "frame", "id": "mni21br", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni21gi", "width": 13, "height": 13, "iconFontName": "git-branch", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "mni21gl", "fill": "$--muted-foreground", "content": "main", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "mni21s2", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11 }, { "type": "frame", "id": "mni21sy", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni21ri", "width": 13, "height": 13, "iconFontName": "refresh-cw", "iconFontFamily": "lucide", "fill": "$--accent-green" }, { "type": "text", "id": "mni21rl", "fill": "$--muted-foreground", "content": "Synced 2m ago", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "text", "id": "mni21s3", "fill": "$--border", "content": "|", "fontFamily": "Inter", "fontSize": 11 }, { "type": "frame", "id": "mni21pd", "name": "Pending Count", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni21pi", "width": 13, "height": 13, "iconFontName": "circle-dot", "iconFontFamily": "lucide", "fill": "$--accent-orange" }, { "type": "text", "id": "mni21pl", "fill": "$--muted-foreground", "content": "3 pending", "fontFamily": "Inter", "fontSize": 11 } ] } ] }, { "type": "frame", "id": "mni21r", "name": "right", "gap": 12, "alignItems": "center", "children": [ { "type": "frame", "id": "mni21nc", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "mni21ni", "width": 13, "height": 13, "iconFontName": "file-text", "iconFontFamily": "lucide", "fill": "$--muted-foreground" }, { "type": "text", "id": "mni21nl", "fill": "$--muted-foreground", "content": "9,200 notes", "fontFamily": "Inter", "fontSize": 11 } ] }, { "type": "icon_font", "id": "mni21set", "width": 14, "height": 14, "iconFontName": "settings", "iconFontFamily": "lucide", "fill": "$--muted-foreground" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dp10", "x": 1800, "y": 22970, "name": "NoteStatus — TabBar (New vs Modified)", "width": 600, "height": "fit_content(200)", "fill": "$--sidebar", "layout": "vertical", "children": [ { "type": "text", "id": "dp10t", "fill": "$--muted-foreground", "content": "TabBar — Green vs Orange Status Dots", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "width": "fill_container", "padding": [ 8, 16 ] }, { "type": "frame", "id": "dp11", "name": "Tab Row", "width": "fill_container", "height": 45, "alignItems": "center", "children": [ { "type": "frame", "id": "dp11a", "name": "Active Tab (new)", "height": "fill_container", "fill": "$--background", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "padding": [ 0, 12 ], "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "dp11at", "fill": "$--foreground", "content": "Untitled Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "ellipse", "id": "dp11adot", "name": "New dot (green)", "width": 6, "height": 6, "fill": "$--accent-green" }, { "type": "text", "id": "dp11ax", "fill": "$--muted-foreground", "content": "×", "fontFamily": "Inter", "fontSize": 14 } ] }, { "type": "frame", "id": "dp11b", "name": "Inactive Tab (modified)", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "padding": [ 0, 12 ], "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "dp11bt", "fill": "$--muted-foreground", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 12 }, { "type": "ellipse", "id": "dp11bdot", "name": "Modified dot (orange)", "width": 6, "height": 6, "fill": "$--accent-orange" } ] }, { "type": "frame", "id": "dp11c", "name": "Inactive Tab (clean)", "height": "fill_container", "stroke": { "align": "inside", "thickness": { "right": 1, "bottom": 1 }, "fill": "$--sidebar-border" }, "padding": [ 0, 12 ], "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "dp11ct", "fill": "$--muted-foreground", "content": "Meeting Notes", "fontFamily": "Inter", "fontSize": 12 } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dp20", "x": 0, "y": 23410, "name": "NoteStatus — BreadcrumbBar (N vs M badge)", "width": 600, "height": "fit_content(200)", "fill": "$--background", "layout": "vertical", "children": [ { "type": "text", "id": "dp20t", "fill": "$--muted-foreground", "content": "BreadcrumbBar — Status Badge", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "width": "fill_container", "padding": [ 8, 16 ] }, { "type": "frame", "id": "dp21", "name": "Breadcrumb — New Note", "width": "fill_container", "padding": [ 8, 16 ], "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "dp21type", "fill": "$--muted-foreground", "content": "Note", "fontFamily": "Inter", "fontSize": 12 }, { "type": "text", "id": "dp21sep", "fill": "$--muted-foreground", "content": "/", "fontFamily": "Inter", "fontSize": 12 }, { "type": "text", "id": "dp21title", "fill": "$--foreground", "content": "Untitled Note", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "dp21badge", "name": "New Badge", "fill": "$--accent-green", "cornerRadius": 3, "padding": [ 1, 5 ], "children": [ { "type": "text", "id": "dp21bl", "fill": "$--background", "content": "N", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "700" } ] } ] }, { "type": "frame", "id": "dp22", "name": "Breadcrumb — Modified Note", "width": "fill_container", "padding": [ 8, 16 ], "gap": 8, "alignItems": "center", "stroke": { "align": "inside", "thickness": { "top": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "dp22type", "fill": "$--muted-foreground", "content": "Project", "fontFamily": "Inter", "fontSize": 12 }, { "type": "text", "id": "dp22sep", "fill": "$--muted-foreground", "content": "/", "fontFamily": "Inter", "fontSize": 12 }, { "type": "text", "id": "dp22title", "fill": "$--foreground", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "dp22badge", "name": "Modified Badge", "fill": "$--accent-yellow", "cornerRadius": 3, "padding": [ 1, 5 ], "children": [ { "type": "text", "id": "dp22bl", "fill": "$--background", "content": "M", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "700" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "dp30", "x": 700, "y": 23410, "name": "NoteStatus — State Transitions", "width": 960, "height": "fit_content(300)", "fill": "$--card", "layout": "vertical", "children": [ { "type": "text", "id": "dp30t", "fill": "$--muted-foreground", "content": "State Transition Flow", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "textTransform": "uppercase", "letterSpacing": 1, "width": "fill_container", "padding": [ 8, 16 ] }, { "type": "frame", "id": "dp31", "name": "Flow", "width": "fill_container", "padding": [ 16, 16 ], "gap": 16, "alignItems": "center", "children": [ { "type": "frame", "id": "dp31a", "name": "Create", "fill": "$--accent-green", "cornerRadius": 8, "padding": [ 12, 20 ], "children": [ { "type": "text", "id": "dp31at", "fill": "$--background", "content": "Create Note → Green Dot", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "text", "id": "dp31arr1", "fill": "$--muted-foreground", "content": "→", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "700" }, { "type": "frame", "id": "dp31b", "name": "Save", "fill": "$--muted", "cornerRadius": 8, "padding": [ 12, 20 ], "children": [ { "type": "text", "id": "dp31bt", "fill": "$--foreground", "content": "Cmd+S → Dot Removed", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "text", "id": "dp31arr2", "fill": "$--muted-foreground", "content": "→", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "700" }, { "type": "frame", "id": "dp31c", "name": "Edit+Save", "fill": "$--accent-orange", "cornerRadius": 8, "padding": [ 12, 20 ], "children": [ { "type": "text", "id": "dp31ct", "fill": "$--background", "content": "Edit Existing → Orange Dot", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] }, { "type": "text", "id": "dp31arr3", "fill": "$--muted-foreground", "content": "→", "fontFamily": "Inter", "fontSize": 20, "fontWeight": "700" }, { "type": "frame", "id": "dp31d", "name": "Commit", "fill": "$--muted", "cornerRadius": 8, "padding": [ 12, 20 ], "children": [ { "type": "text", "id": "dp31dt", "fill": "$--foreground", "content": "Git Commit → Dot Removed", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "600" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_git_and_changes", "content": "GIT & CHANGES", "x": 0, "y": 23890, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "vc001", "x": 0, "y": 23920, "name": "Changes — sidebar section with pending notes", "clip": true, "width": 550, "height": 500, "fill": "$--background", "layout": "horizontal", "children": [ { "type": "frame", "id": "vc002", "name": "Sidebar", "width": 250, "height": "fill_container", "fill": "$--sidebar", "layout": "vertical", "children": [ { "type": "frame", "id": "vc003", "name": "Filters", "width": "fill_container", "layout": "vertical", "gap": 1, "padding": [ 8, 8 ], "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc004", "name": "filterAll", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc005", "text": "All Notes", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc006", "name": "filterFavorites", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc007", "text": "Favorites", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc008", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc009", "text": "Trash", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc010", "name": "filterChanges-active", "width": "fill_container", "fill": "$--accent-orange", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "justifyContent": "space-between", "children": [ { "type": "text", "id": "vc011", "text": "Changes", "fontSize": 13, "fontWeight": 500, "fill": "$--accent-orange" }, { "type": "frame", "id": "vc012", "name": "badge", "fill": "$--accent-orange", "cornerRadius": 9999, "padding": [ 0, 6 ], "height": 20, "alignItems": "center", "children": [ { "type": "text", "id": "vc013", "text": "3", "fontSize": 10, "fontWeight": 600, "fill": "$--white" } ] } ] } ] } ] }, { "type": "frame", "id": "vc014", "name": "NoteList: Changes", "width": 300, "height": "fill_container", "fill": "$--card", "layout": "vertical", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc015", "name": "header", "width": "fill_container", "height": 45, "padding": [ 0, 16 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "vc016", "text": "Changes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc017", "name": "note1-modified", "width": "fill_container", "padding": [ 10, 16 ], "gap": 4, "layout": "vertical", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc018", "name": "titleRow", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "vc019", "name": "modifiedDot", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc020", "text": "Build Laputa App", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "text", "id": "vc021", "text": "This paragraph has bold text, italic text…", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vc022", "name": "note2-modified", "width": "fill_container", "padding": [ 10, 16 ], "gap": 4, "layout": "vertical", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc023", "name": "titleRow", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "vc024", "name": "modifiedDot", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc025", "text": "Facebook Ads Strategy", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "text", "id": "vc026", "text": "Lookalike audiences from newsletter subscribers…", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "vc027", "name": "note3-added", "width": "fill_container", "padding": [ 10, 16 ], "gap": 4, "layout": "vertical", "children": [ { "type": "frame", "id": "vc028", "name": "titleRow", "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "vc029", "name": "modifiedDot", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc030", "text": "AI Agents Primer", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "text", "id": "vc031", "text": "AI agents are autonomous systems that can plan…", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "vc100", "x": 650, "y": 23920, "name": "Changes — empty state (0 pending)", "clip": true, "width": 550, "height": 400, "fill": "$--background", "layout": "horizontal", "children": [ { "type": "frame", "id": "vc101", "name": "Sidebar (no Changes item)", "width": 250, "height": "fill_container", "fill": "$--sidebar", "layout": "vertical", "children": [ { "type": "frame", "id": "vc102", "name": "Filters", "width": "fill_container", "layout": "vertical", "gap": 1, "padding": [ 8, 8 ], "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc103", "name": "filterAll-active", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc104", "text": "All Notes", "fontSize": 13, "fontWeight": 500, "fill": "$--primary" } ] }, { "type": "frame", "id": "vc105", "name": "filterFavorites", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc106", "text": "Favorites", "fontSize": 13, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc107", "name": "filterTrash", "width": "fill_container", "cornerRadius": 6, "gap": 8, "padding": [ 6, 16 ], "alignItems": "center", "children": [ { "type": "text", "id": "vc108", "text": "Trash", "fontSize": 13, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "vc109", "name": "annotation", "width": "fill_container", "padding": [ 12, 16 ], "children": [ { "type": "text", "id": "vc110", "text": "← No \"Changes\" item when 0 pending", "fontSize": 11, "fill": "$--muted-foreground", "fontStyle": "italic" } ] } ] }, { "type": "frame", "id": "vc111", "name": "NoteList: All Notes", "width": 300, "height": "fill_container", "fill": "$--card", "layout": "vertical", "stroke": { "align": "inside", "thickness": { "right": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc112", "name": "header", "width": "fill_container", "height": 45, "padding": [ 0, 16 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "vc113", "text": "Notes", "fontSize": 14, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc114", "name": "notesList", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [ { "type": "frame", "id": "vc115", "name": "note-no-dot", "width": "fill_container", "padding": [ 10, 16 ], "gap": 4, "layout": "vertical", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "vc116", "text": "Build Laputa App", "fontSize": 13, "fontWeight": 600, "fill": "$--foreground" }, { "type": "text", "id": "vc117", "text": "No orange dot — all committed", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "vc200", "x": 1300, "y": 23920, "name": "Changes — real-time update (note disappears after save)", "clip": true, "width": 800, "height": 300, "fill": "$--background", "layout": "horizontal", "gap": 40, "padding": [ 20, 20 ], "children": [ { "type": "frame", "id": "vc201", "name": "Before: 3 pending", "width": 340, "height": "fill_container", "fill": "$--card", "layout": "vertical", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc202", "name": "header", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "vc203", "text": "Changes (before save)", "fontSize": 12, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc204", "name": "item1", "width": "fill_container", "padding": [ 8, 12 ], "gap": 6, "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "ellipse", "id": "vc205", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc206", "text": "Build Laputa App", "fontSize": 12, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc207", "name": "item2-highlight", "width": "fill_container", "padding": [ 8, 12 ], "gap": 6, "fill": "$--accent-orange", "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "ellipse", "id": "vc208", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc209", "text": "Facebook Ads Strategy ← saving…", "fontSize": 12, "fontWeight": 500, "fill": "$--accent-orange" } ] }, { "type": "frame", "id": "vc210", "name": "item3", "width": "fill_container", "padding": [ 8, 12 ], "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "vc211", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc212", "text": "AI Agents Primer", "fontSize": 12, "fill": "$--foreground" } ] } ] }, { "type": "frame", "id": "vc220", "name": "After: 2 pending (note committed)", "width": 340, "height": "fill_container", "fill": "$--card", "layout": "vertical", "cornerRadius": 8, "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "vc221", "name": "header", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "vc222", "text": "Changes (after save + commit)", "fontSize": 12, "fontWeight": 600, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc223", "name": "item1", "width": "fill_container", "padding": [ 8, 12 ], "gap": 6, "alignItems": "center", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "ellipse", "id": "vc224", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc225", "text": "Build Laputa App", "fontSize": 12, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc226", "name": "item2", "width": "fill_container", "padding": [ 8, 12 ], "gap": 6, "alignItems": "center", "children": [ { "type": "ellipse", "id": "vc227", "fill": "$--accent-orange", "width": 6, "height": 6 }, { "type": "text", "id": "vc228", "text": "AI Agents Primer", "fontSize": 12, "fill": "$--foreground" } ] }, { "type": "frame", "id": "vc229", "name": "removedNote", "width": "fill_container", "padding": [ 12, 12 ], "children": [ { "type": "text", "id": "vc230", "text": "Facebook Ads Strategy removed (committed)", "fontSize": 11, "fontStyle": "italic", "fill": "$--muted-foreground" } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghCL1", "x": 2200, "y": 23920, "name": "Git History — Commit List", "width": 300, "height": "fit_content(600)", "fill": "$--background", "cornerRadius": "$--radius-lg", "stroke": { "fill": "$--border", "thickness": 1 }, "layout": "vertical", "gap": 16, "padding": 12, "children": [ { "type": "text", "id": "ghCL1h", "content": "HISTORY", "fill": "$--muted-foreground", "fontSize": 10, "fontWeight": "600", "letterSpacing": 1.2 }, { "type": "frame", "id": "ghC1", "layout": "vertical", "width": "fill_container", "gap": 2, "padding": [ 0, 0, 0, 10 ], "stroke": { "fill": "$--border", "thickness": { "left": 2 } }, "children": [ { "type": "frame", "id": "ghC1r", "layout": "horizontal", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ghC1h", "content": "a1b2c3d", "fill": "$--primary", "fontSize": 11, "fontWeight": "500", "underline": true }, { "type": "text", "id": "ghC1d", "content": "2d ago", "fill": "$--muted-foreground", "fontSize": 10 } ] }, { "type": "text", "id": "ghC1m", "content": "Update grow-newsletter with latest changes", "fill": "$--secondary-foreground", "fontSize": 12, "textGrowth": "fixed-width", "width": "fill_container" }, { "type": "text", "id": "ghC1a", "content": "Luca Rossi", "fill": "$--muted-foreground", "fontSize": 10 } ] }, { "type": "frame", "id": "ghC2", "layout": "vertical", "width": "fill_container", "gap": 2, "padding": [ 0, 0, 0, 10 ], "stroke": { "fill": "$--border", "thickness": { "left": 2 } }, "children": [ { "type": "frame", "id": "ghC2r", "layout": "horizontal", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ghC2h", "content": "e4f5g6h", "fill": "$--primary", "fontSize": 11, "fontWeight": "500", "underline": true }, { "type": "text", "id": "ghC2d", "content": "5d ago", "fill": "$--muted-foreground", "fontSize": 10 } ] }, { "type": "text", "id": "ghC2m", "content": "Add new section to grow-newsletter", "fill": "$--secondary-foreground", "fontSize": 12, "textGrowth": "fixed-width", "width": "fill_container" }, { "type": "text", "id": "ghC2a", "content": "Luca Rossi", "fill": "$--muted-foreground", "fontSize": 10 } ] }, { "type": "frame", "id": "ghC3", "layout": "vertical", "width": "fill_container", "gap": 2, "padding": [ 0, 0, 0, 10 ], "stroke": { "fill": "$--border", "thickness": { "left": 2 } }, "children": [ { "type": "frame", "id": "ghC3r", "layout": "horizontal", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [ { "type": "text", "id": "ghC3h", "content": "i7j8k9l", "fill": "$--primary", "fontSize": 11, "fontWeight": "500", "underline": true }, { "type": "text", "id": "ghC3d", "content": "12d ago", "fill": "$--muted-foreground", "fontSize": 10 } ] }, { "type": "text", "id": "ghC3m", "content": "Create grow-newsletter", "fill": "$--secondary-foreground", "fontSize": 12, "textGrowth": "fixed-width", "width": "fill_container" }, { "type": "text", "id": "ghC3a", "content": "Luca Rossi", "fill": "$--muted-foreground", "fontSize": 10 } ] } ], "theme": { "Mode": "Light" } }, { "type": "frame", "id": "ghDO1", "x": 0, "y": 24460, "name": "Git History — Diff Open", "width": 600, "height": "fit_content(500)", "fill": "$--background", "cornerRadius": "$--radius-lg", "stroke": { "fill": "$--border", "thickness": 1 }, "layout": "vertical", "gap": 0, "padding": 0, "children": [ { "type": "frame", "id": "ghDObc", "layout": "horizontal", "width": "fill_container", "height": 36, "padding": [ 0, 12 ], "gap": 8, "alignItems": "center", "fill": "$--muted", "stroke": { "fill": "$--border", "thickness": { "bottom": 1 } }, "children": [ { "type": "text", "id": "ghDObcP", "content": "responsibility / grow-newsletter.md", "fill": "$--muted-foreground", "fontSize": 12 }, { "type": "frame", "id": "ghDObcS", "width": "fill_container", "height": 1 }, { "type": "frame", "id": "ghDObcB", "layout": "horizontal", "padding": [ 2, 8 ], "cornerRadius": "$--radius-sm", "fill": "$--primary", "alignItems": "center", "children": [ { "type": "text", "id": "ghDObcBt", "content": "Diff: a1b2c3d", "fill": "$--primary-foreground", "fontSize": 10, "fontWeight": "600" } ] } ] }, { "type": "frame", "id": "ghDOb", "layout": "vertical", "width": "fill_container", "padding": 0, "gap": 0, "children": [ { "type": "frame", "id": "ghDOl1", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "fill": "$--muted", "children": [ { "type": "text", "id": "ghDOl1n", "content": "1", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl1t", "content": "diff --git a/grow-newsletter.md b/grow-newsletter.md", "fill": "$--muted-foreground", "fontSize": 11, "fontWeight": "600" } ] }, { "type": "frame", "id": "ghDOl2", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "fill": "$--accent-blue-light", "children": [ { "type": "text", "id": "ghDOl2n", "content": "2", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl2t", "content": "@@ -5,3 +5,5 @@", "fill": "$--primary", "fontSize": 11, "fontStyle": "italic" } ] }, { "type": "frame", "id": "ghDOl3", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "children": [ { "type": "text", "id": "ghDOl3n", "content": "3", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl3t", "content": " # Grow Newsletter", "fill": "$--secondary-foreground", "fontSize": 11 } ] }, { "type": "frame", "id": "ghDOl4", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "fill": "$--accent-red-light", "children": [ { "type": "text", "id": "ghDOl4n", "content": "4", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl4t", "content": "-Old paragraph from before a1b2c3d.", "fill": "$--accent-red", "fontSize": 11 } ] }, { "type": "frame", "id": "ghDOl5", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "fill": "$--accent-green-light", "children": [ { "type": "text", "id": "ghDOl5n", "content": "5", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl5t", "content": "+Updated paragraph at commit a1b2c3d.", "fill": "$--accent-green", "fontSize": 11 } ] }, { "type": "frame", "id": "ghDOl6", "layout": "horizontal", "width": "fill_container", "height": 22, "padding": [ 0, 8 ], "alignItems": "center", "fill": "$--accent-green-light", "children": [ { "type": "text", "id": "ghDOl6n", "content": "6", "fill": "$--muted-foreground", "fontSize": 11, "textGrowth": "fixed-width", "width": 30, "textAlign": "right" }, { "type": "text", "id": "ghDOl6t", "content": "+New content added in this commit.", "fill": "$--accent-green", "fontSize": 11 } ] } ] } ], "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_search", "content": "SEARCH", "x": 0, "y": 24940, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "children": [ { "alignItems": "center", "children": [ { "content": "🔍", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal", "id": "PjHq0", "name": "searchIcon", "type": "text" }, { "content": "Search in all notes...", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 15, "fontWeight": "normal", "id": "rkrbE", "name": "searchInput", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "alignItems": "center", "children": [ { "content": "Keyword", "fill": "$--search-text", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "R5D8g", "name": "kwText", "type": "text" } ], "cornerRadius": 4, "fill": "$--search-border", "id": "mcpPa", "name": "kwBadge", "padding": [ 4, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "Semantic", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "NJYVj", "name": "semText", "type": "text" } ], "cornerRadius": 4, "fill": "$--foreground", "id": "W1DvY", "name": "semBadge", "padding": [ 4, 8 ], "type": "frame" } ], "gap": 4, "id": "1az05", "name": "Mode Toggle", "type": "frame" } ], "cornerRadius": 8, "fill": "$--search-input-bg", "gap": 10, "height": 48, "id": "x1pHS", "name": "Search Bar", "padding": [ 0, 16 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "content": "Search across all note contents — Cmd+Shift+F", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "normal", "id": "6O2iX", "name": "hintText", "type": "text" } ], "id": "73imz", "justifyContent": "center", "name": "shortcutHint", "padding": [ 24, 16 ], "type": "frame", "width": "fill_container" } ], "cornerRadius": 12, "fill": "$--search-bg", "id": "3aG9b", "layout": "vertical", "name": "Full-text Search — Empty State", "type": "frame", "width": 500, "x": 0, "y": 24970, "theme": { "Mode": "Light" } }, { "children": [ { "alignItems": "center", "children": [ { "content": "🔍", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal", "id": "9pswg", "name": "icon2", "type": "text" }, { "content": "time management", "fill": "$--search-heading", "fontFamily": "Inter", "fontSize": 15, "fontWeight": "normal", "id": "IG4Oy", "name": "input2", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "alignItems": "center", "children": [ { "content": "Keyword", "fill": "$--search-text", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "aL4o7", "name": "kwLabel", "type": "text" } ], "cornerRadius": 4, "fill": "$--search-border", "id": "7jTLP", "name": "kwActive", "padding": [ 4, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "Semantic", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "Kq87g", "name": "semLabel", "type": "text" } ], "cornerRadius": 4, "fill": "$--foreground", "id": "cTlcM", "name": "semInactive", "padding": [ 4, 8 ], "type": "frame" } ], "gap": 4, "id": "hgbNF", "name": "Mode Toggle", "type": "frame" } ], "cornerRadius": 8, "fill": "$--search-input-bg", "gap": 10, "height": 48, "id": "mNK9x", "name": "Search Bar", "padding": [ 0, 16 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "content": "12 results — 148ms", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "ox2wo", "name": "countText", "type": "text" } ], "id": "SAQ8v", "name": "countBar", "padding": [ 6, 16 ], "type": "frame", "width": "fill_container" }, { "children": [ { "children": [ { "content": "How to Manage your Time", "fill": "$--search-heading", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600", "id": "tCIvh", "name": "r1title", "type": "text" }, { "content": "...how people can improve their time management skills. They gathered results in this article...", "fill": "$--search-snippet", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "id": "jAqxc", "lineHeight": 1.4, "name": "r1snippet", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "content": "Essay", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "Peatz", "name": "r1typeText", "type": "text" } ], "cornerRadius": 3, "fill": "$--foreground", "id": "a4ghT", "name": "r1type", "padding": [ 2, 6 ], "type": "frame" }, { "content": "score: 0.87", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "xS0iX", "name": "r1score", "type": "text" } ], "gap": 8, "id": "AP1fQ", "name": "r1meta", "type": "frame" } ], "fill": "$--search-input-bg", "gap": 4, "id": "g7JoL", "layout": "vertical", "name": "Result Item — Selected", "padding": [ 10, 16 ], "type": "frame", "width": "fill_container" }, { "children": [ { "content": "On solo work, self-reflection and decision fatigue", "fill": "$--search-count", "fontFamily": "Inter", "fontSize": 14, "id": "eSx2r", "name": "r2title", "type": "text" }, { "content": "...I organize my time carefully, create recurring activities, block time on my calendar...", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "id": "MB5C8", "lineHeight": 1.4, "name": "r2snippet", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "content": "Evergreen", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "lVC0y", "name": "r2typeText", "type": "text" } ], "cornerRadius": 3, "fill": "$--foreground", "id": "DZDtT", "name": "r2type", "padding": [ 2, 6 ], "type": "frame" }, { "content": "score: 0.75", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "q5ohu", "name": "r2score", "type": "text" } ], "gap": 8, "id": "kUzQY", "name": "r2meta", "type": "frame" } ], "gap": 4, "id": "wa3Pe", "layout": "vertical", "name": "Result Item", "padding": [ 10, 16 ], "type": "frame", "width": "fill_container" }, { "children": [ { "content": "Time Management Is About More Than Life Hacks", "fill": "$--search-count", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "normal", "id": "fDBcr", "name": "r3title", "type": "text" }, { "content": "...the results ran counter to popular admonitions of either the virtues or the detriments of multitasking...", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "id": "9X1rc", "lineHeight": 1.4, "name": "r3snippet", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "content": "Reading", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "ql9Q1", "name": "r3typeText", "type": "text" } ], "cornerRadius": 3, "fill": "$--foreground", "id": "IHIHs", "name": "r3type", "padding": [ 2, 6 ], "type": "frame" }, { "content": "score: 0.73", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "XQs3c", "name": "r3score", "type": "text" } ], "gap": 8, "id": "gMuVI", "name": "r3meta", "type": "frame" } ], "gap": 4, "id": "EATNG", "layout": "vertical", "name": "Result Item", "padding": [ 10, 16 ], "type": "frame", "width": "fill_container" } ], "id": "cGRXu", "layout": "vertical", "name": "Results List", "type": "frame", "width": "fill_container" } ], "cornerRadius": 12, "fill": "$--search-bg", "id": "K1O2x", "layout": "vertical", "name": "Full-text Search — Results", "type": "frame", "width": 500, "x": 600, "y": 24970, "theme": { "Mode": "Light" } }, { "children": [ { "alignItems": "center", "children": [ { "content": "🔍", "fill": "$--search-text-muted", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "normal", "id": "nrIc1", "name": "icon3", "type": "text" }, { "content": "xyznonexistent", "fill": "$--search-heading", "fontFamily": "Inter", "fontSize": 15, "fontWeight": "normal", "id": "nrIc2", "name": "input3", "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "alignItems": "center", "children": [ { "alignItems": "center", "children": [ { "content": "Keyword", "fill": "$--search-text", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "nrIc3", "type": "text" } ], "cornerRadius": 4, "fill": "$--search-border", "id": "nrIc4", "padding": [ 4, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "Semantic", "fill": "$--search-text-dim", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "normal", "id": "nrIc5", "type": "text" } ], "cornerRadius": 4, "fill": "$--foreground", "id": "nrIc6", "padding": [ 4, 8 ], "type": "frame" } ], "gap": 4, "id": "nrIc7", "name": "Mode Toggle", "type": "frame" } ], "cornerRadius": 8, "fill": "$--search-input-bg", "gap": 10, "height": 48, "id": "nrIc8", "name": "Search Bar", "padding": [ 0, 16 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "content": "No results found", "fill": "$--search-snippet", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "normal", "id": "nrIcA", "type": "text" }, { "content": "Try different keywords or switch to semantic search", "fill": "$--search-highlight", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "id": "nrIcB", "type": "text" } ], "gap": 8, "id": "nrIc9", "justifyContent": "center", "layout": "vertical", "name": "No Results Body", "padding": [ 32, 16 ], "type": "frame", "width": "fill_container" } ], "cornerRadius": 12, "fill": "$--search-bg", "id": "nrIcZ", "layout": "vertical", "name": "Full-text Search — No Results", "type": "frame", "width": 500, "x": 1200, "y": 24970, "theme": { "Mode": "Light" } }, { "type": "text", "id": "fg_trash", "content": "TRASH", "x": 0, "y": 25250, "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 16, "fontWeight": "600", "letterSpacing": 1, "theme": { "Mode": "Light" } }, { "type": "frame", "id": "trNL1", "x": 0, "y": 25280, "name": "Trash — Note List View", "theme": { "Mode": "Light" }, "clip": true, "width": 340, "height": 360, "fill": "$--card", "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "trNLH", "name": "header", "width": "fill_container", "height": 45, "padding": [ 0, 16 ], "alignItems": "center", "justifyContent": "space_between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "trNLT", "fill": "$--foreground", "content": "Trash", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "600" } ] }, { "type": "frame", "id": "trN1", "name": "trashedNote1", "width": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 14, 16 ], "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "trN1H", "name": "titleRow", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "trN1T", "fill": "$--foreground", "content": "Old Draft Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "trN1B", "name": "trashedBadge", "height": 16, "fill": "$--accent-red-light", "cornerRadius": 4, "padding": [ 1, 4 ], "alignItems": "center", "children": [ { "type": "text", "id": "trN1BT", "fill": "$--destructive", "content": "TRASHED", "fontFamily": "Inter", "fontSize": 9, "fontWeight": "500" } ] } ] }, { "type": "text", "id": "trN1S", "fill": "$--muted-foreground", "content": "Some draft content that is no longer needed...", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "400" }, { "type": "text", "id": "trN1D", "fill": "$--muted-foreground", "content": "5d ago", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "400" } ] }, { "type": "frame", "id": "trN2", "name": "trashedNote2Warning", "width": "fill_container", "layout": "vertical", "gap": 2, "padding": [ 14, 16 ], "fill": "$--accent-red-light", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "frame", "id": "trN2H", "name": "titleRow", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "trN2T", "fill": "$--foreground", "content": "Deprecated API Notes", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500" }, { "type": "frame", "id": "trN2B", "name": "warningBadge", "height": 16, "fill": "$--destructive", "cornerRadius": 4, "padding": [ 1, 4 ], "alignItems": "center", "children": [ { "type": "text", "id": "trN2BT", "fill": "$--background", "content": "30+ DAYS", "fontFamily": "Inter", "fontSize": 9, "fontWeight": "600" } ] } ] }, { "type": "text", "id": "trN2S", "fill": "$--muted-foreground", "content": "Old API documentation that was replaced...", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "400" }, { "type": "text", "id": "trN2D", "fill": "$--destructive", "content": "Trashed 35d ago — will be permanently deleted", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "500" } ] } ] }, { "type": "frame", "id": "trRI1", "x": 440, "y": 25280, "name": "Trash — Relationship Indicator", "theme": { "Mode": "Light" }, "clip": true, "width": 300, "height": 200, "fill": "$--background", "layout": "vertical", "gap": 8, "padding": [ 16, 16 ], "children": [ { "type": "text", "id": "trRIL", "fill": "$--muted-foreground", "content": "BELONGS TO", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "letterSpacing": 0.5 }, { "type": "frame", "id": "trRN", "name": "normalRef", "width": "fill_container", "fill": "$--accent-blue-light", "cornerRadius": 6, "padding": [ 6, 10 ], "gap": 6, "alignItems": "center", "justifyContent": "space_between", "children": [ { "type": "text", "id": "trRNT", "fill": "$--accent-blue", "content": "Build Laputa App", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "icon_font", "id": "trRNI", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--accent-blue" } ] }, { "type": "frame", "id": "trRT", "name": "trashedRef", "width": "fill_container", "fill": "$--muted", "cornerRadius": 6, "padding": [ 6, 10 ], "gap": 6, "alignItems": "center", "justifyContent": "space_between", "opacity": 0.7, "children": [ { "type": "frame", "id": "trRTL", "gap": 4, "alignItems": "center", "children": [ { "type": "icon_font", "id": "trRTTI", "width": 12, "height": 12, "iconFontName": "trash", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" }, { "type": "text", "id": "trRTT", "fill": "$--muted-foreground", "content": "Old Draft Notes", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "trRTTX", "fill": "$--muted-foreground", "content": "(trashed)", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "400" } ] }, { "type": "icon_font", "id": "trRTI", "width": 14, "height": 14, "iconFontName": "file-text", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" } ] }, { "type": "frame", "id": "trRA", "name": "archivedRef", "width": "fill_container", "fill": "$--muted", "cornerRadius": 6, "padding": [ 6, 10 ], "gap": 6, "alignItems": "center", "justifyContent": "space_between", "opacity": 0.7, "children": [ { "type": "frame", "id": "trRAL", "gap": 4, "alignItems": "center", "children": [ { "type": "text", "id": "trRAT", "fill": "$--muted-foreground", "content": "Website Redesign", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "text", "id": "trRATX", "fill": "$--muted-foreground", "content": "(archived)", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "400" } ] }, { "type": "icon_font", "id": "trRAI", "width": 14, "height": 14, "iconFontName": "wrench", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "trW30", "x": 840, "y": 25280, "name": "Trash — 30-Day Auto-Delete Warning", "theme": { "Mode": "Light" }, "clip": true, "width": 340, "height": 120, "fill": "$--background", "layout": "vertical", "gap": 8, "padding": [ 16, 16 ], "children": [ { "type": "text", "id": "trW3L", "fill": "$--muted-foreground", "content": "Warning banner shown at top of trash view:", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "frame", "id": "trW3B", "name": "warningBanner", "width": "fill_container", "fill": "$--accent-red-light", "cornerRadius": 8, "padding": [ 10, 12 ], "gap": 8, "alignItems": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--accent-red" }, "children": [ { "type": "icon_font", "id": "trW3I", "width": 16, "height": 16, "iconFontName": "warning", "iconFontFamily": "phosphor", "weight": 700, "fill": "$--destructive" }, { "type": "frame", "id": "trW3T", "layout": "vertical", "gap": 2, "children": [ { "type": "text", "id": "trW3T1", "fill": "$--destructive", "content": "Notes in trash for 30+ days will be permanently deleted", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "600" }, { "type": "text", "id": "trW3T2", "fill": "$--muted-foreground", "content": "1 note is past the 30-day retention period", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "400" } ] } ] } ] }, { "type": "frame", "id": "rel_x_default", "name": "Relationship Pill — Default (X hidden)", "x": 0, "y": 0, "width": 280, "height": "fit_content(40)", "fill": "$--background", "layout": "vertical", "gap": 8, "padding": [ 16, 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "rel_x_default_label", "content": "Relationship Pill — Default State", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "frame", "id": "rel_x_pill_default", "layout": "horizontal", "gap": 4, "padding": [ 4, 8 ], "fill": "$--accent", "borderRadius": 6, "width": "fit_content", "height": "fit_content", "children": [ { "type": "text", "id": "rel_x_pill_label", "content": "Note Title", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "rectangle", "id": "rel_x_type_icon", "width": 14, "height": 14, "fill": "$--muted-foreground", "opacity": 0.5, "borderRadius": 2 } ] }, { "type": "text", "id": "rel_x_note_default", "content": "X button not visible in default state", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10 } ] }, { "type": "frame", "id": "rel_x_hover", "name": "Relationship Pill — Hover (X visible)", "x": 320, "y": 0, "width": 280, "height": "fit_content(40)", "fill": "$--background", "layout": "vertical", "gap": 8, "padding": [ 16, 16 ], "theme": { "Mode": "Light" }, "children": [ { "type": "text", "id": "rel_x_hover_label", "content": "Relationship Pill — Hover State", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500" }, { "type": "frame", "id": "rel_x_pill_hover", "layout": "horizontal", "gap": 6, "padding": [ 4, 8 ], "fill": "$--accent", "borderRadius": 6, "width": "fit_content", "height": "fit_content", "children": [ { "type": "text", "id": "rel_x_pill_label_hover", "content": "Note Title", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500" }, { "type": "frame", "id": "rel_x_trailing", "layout": "horizontal", "gap": 6, "children": [ { "type": "text", "id": "rel_x_icon", "content": "×", "fill": "$--foreground", "fontFamily": "Inter", "fontSize": 14, "fontWeight": "400" }, { "type": "rectangle", "id": "rel_x_type_icon_hover", "width": 14, "height": 14, "fill": "$--muted-foreground", "opacity": 0.5, "borderRadius": 2 } ] } ] }, { "type": "text", "id": "rel_x_note_hover", "content": "X appears inline as flex child, before type icon. Ring border on hover.", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10 } ] }, { "children": [ { "content": "Tags Property — Display", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "600", "id": "HHQbx", "letterSpacing": 0.5, "name": "title1", "type": "text" }, { "alignItems": "center", "children": [ { "content": "TAGS", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "500", "id": "9BDgi", "letterSpacing": 1.2, "name": "label1", "type": "text" }, { "alignItems": "center", "children": [ { "alignItems": "center", "children": [ { "content": "React", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500", "id": "V1Dfn", "name": "pillText1", "type": "text" }, { "content": "×", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "500", "id": "urcjo", "name": "pillX1", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-blue-light", "gap": 4, "id": "70AK4", "name": "pill1", "padding": [ 2, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "TypeScript", "fill": "$--accent-green", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500", "id": "VtpTf", "name": "pillText2", "type": "text" }, { "content": "×", "fill": "$--accent-green", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "500", "id": "sw4gt", "name": "pillX2", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-green-light", "gap": 4, "id": "rCHzS", "name": "pill2", "padding": [ 2, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "Tauri", "fill": "$--accent-purple", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "500", "id": "OTVWd", "name": "pillText3", "type": "text" }, { "content": "×", "fill": "$--accent-purple", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "500", "id": "j8w8E", "name": "pillX3", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-purple-light", "gap": 4, "id": "U4Dfr", "name": "pill3", "padding": [ 2, 8 ], "type": "frame" }, { "alignItems": "center", "children": [ { "content": "+", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "500", "id": "BTPW1", "name": "addPlus", "type": "text" } ], "cornerRadius": 10, "height": 20, "id": "2A0u4", "justifyContent": "center", "name": "addBtn", "type": "frame", "width": 20 } ], "gap": 4, "id": "wQwb9", "name": "pillWrap", "type": "frame" } ], "gap": 8, "id": "9vZUA", "name": "row1", "type": "frame", "width": "fill_container" } ], "cornerRadius": 8, "fill": "$--background", "gap": 12, "id": "5Co69", "layout": "vertical", "name": "Tags Property — Display (pills with color + X)", "padding": 16, "type": "frame", "width": 280, "x": 0, "y": 0 }, { "children": [ { "content": "Tags Dropdown — Multi-Select", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "600", "id": "EYQrz", "letterSpacing": 0.5, "name": "title2", "type": "text" }, { "children": [ { "content": "Type a tag...", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 12, "fontWeight": "normal", "id": "K4O5T", "name": "searchInput", "type": "text" } ], "id": "FiJYp", "name": "searchBox", "padding": [ 8, 12 ], "type": "frame", "width": "fill_container" }, { "children": [ { "content": "FROM VAULT", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 9, "fontWeight": "500", "id": "TTrI3", "letterSpacing": 1.2, "name": "secLabel1", "type": "text" }, { "alignItems": "center", "children": [ { "content": "✓", "fill": "$--accent-blue", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "id": "hvC9R", "name": "check1", "type": "text" }, { "children": [ { "content": "REACT", "fill": "$--accent-blue", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "id": "uafDO", "letterSpacing": 1.2, "name": "optPillText1", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-blue-light", "id": "fSE56", "name": "optPill1", "padding": [ 1, 6 ], "type": "frame" }, { "fill": "$--accent-blue", "height": 14, "id": "hm8BB", "name": "optColor1", "type": "ellipse", "width": 14 } ], "cornerRadius": 4, "fill": "$--muted", "gap": 6, "id": "sEjJ4", "name": "opt1", "padding": [ 6, 8 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "content": "✓", "fill": "$--accent-green", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "id": "xMjpj", "name": "check2", "type": "text" }, { "children": [ { "content": "TYPESCRIPT", "fill": "$--accent-green", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "id": "QkrlH", "letterSpacing": 1.2, "name": "optPillText2", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-green-light", "id": "mFD4b", "name": "optPill2", "padding": [ 1, 6 ], "type": "frame" }, { "fill": "$--accent-green", "height": 14, "id": "IeC8h", "name": "optColor2", "type": "ellipse", "width": 14 } ], "cornerRadius": 4, "gap": 6, "id": "jTW08", "name": "opt2", "padding": [ 6, 8 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "height": 14, "id": "VWb7I", "name": "spacer3", "type": "frame", "width": 14 }, { "children": [ { "content": "VITE", "fill": "$--accent-orange", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "id": "IBEpk", "letterSpacing": 1.2, "name": "optPillText3", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-orange-light", "id": "juYuA", "name": "optPill3", "padding": [ 1, 6 ], "type": "frame" }, { "fill": "$--accent-orange", "height": 14, "id": "aTF8b", "name": "optColor3", "type": "ellipse", "width": 14 } ], "cornerRadius": 4, "gap": 6, "id": "byNKM", "name": "opt3", "padding": [ 6, 8 ], "type": "frame", "width": "fill_container" }, { "fill": "$--border", "height": 1, "id": "5sC2Y", "name": "divider", "type": "rectangle", "width": "fill_container" }, { "content": "SUGGESTED", "fill": "$--muted-foreground", "fontFamily": "IBM Plex Mono", "fontSize": 9, "fontWeight": "500", "id": "7vME3", "letterSpacing": 1.2, "name": "secLabel2", "type": "text" } ], "id": "KsIE1", "layout": "vertical", "name": "listArea", "padding": [ 4, 0 ], "type": "frame", "width": "fill_container" } ], "cornerRadius": 8, "fill": "$--background", "id": "aWUZr", "layout": "vertical", "name": "Tags Property — Input (entering new tag)", "type": "frame", "width": 220, "x": 320, "y": 0 }, { "children": [ { "content": "Color Picker — Per Tag", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 11, "fontWeight": "600", "id": "eUqcb", "letterSpacing": 0.5, "name": "title3", "type": "text" }, { "content": "Click the color swatch next to any tag to expand the color picker row", "fill": "$--muted-foreground", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "normal", "id": "9JSxa", "name": "desc3", "type": "text" }, { "alignItems": "center", "children": [ { "content": "✓", "fill": "$--accent-purple", "fontFamily": "Inter", "fontSize": 10, "fontWeight": "600", "id": "8P4r5", "name": "optCheck", "type": "text" }, { "children": [ { "content": "TAURI", "fill": "$--accent-purple", "fontFamily": "IBM Plex Mono", "fontSize": 10, "fontWeight": "600", "id": "u9Ljh", "letterSpacing": 1.2, "name": "optPillTxt", "type": "text" } ], "cornerRadius": 12, "fill": "$--accent-purple-light", "id": "KLwLI", "name": "optPill", "padding": [ 1, 6 ], "type": "frame" }, { "fill": "$--accent-purple", "height": 14, "id": "XMIpZ", "name": "optSwatch", "type": "ellipse", "width": 14 } ], "cornerRadius": 4, "fill": "$--muted", "gap": 6, "id": "osSzq", "name": "optRow", "padding": [ 6, 4 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "fill": "$--accent-red", "height": 16, "id": "4lhx5", "name": "c1", "type": "ellipse", "width": 16 }, { "fill": "$--accent-orange", "height": 16, "id": "aa0VW", "name": "c2", "type": "ellipse", "width": 16 }, { "fill": "$--accent-yellow", "height": 16, "id": "Vdkb2", "name": "c3", "type": "ellipse", "width": 16 }, { "fill": "$--accent-green", "height": 16, "id": "nb62h", "name": "c4", "type": "ellipse", "width": 16 }, { "fill": "$--accent-blue", "height": 16, "id": "lFU1J", "name": "c5", "type": "ellipse", "width": 16 }, { "fill": "$--accent-purple", "height": 16, "id": "d7Vkz", "name": "c6", "type": "ellipse", "width": 16 } ], "gap": 6, "id": "aHm6t", "name": "colorRow", "padding": [ 8, 12 ], "type": "frame" } ], "cornerRadius": 8, "fill": "$--background", "id": "SBYSL", "layout": "vertical", "name": "Tags Property — Color Picker (selecting tag color)", "padding": 12, "type": "frame", "width": 220, "x": 580, "y": 0 }, { "type": "frame", "id": "zs_normal", "name": "Zoom Shortcuts — StatusBar (100% / default)", "x": 0, "y": 0, "theme": { "Mode": "Light" }, "width": 800, "height": 32, "fill": "$--background", "layout": "horizontal", "gap": 0, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "zs_normal_desc", "name": "description", "width": "fill_container", "children": [ { "type": "text", "id": "zs_normal_desc_text", "fill": "$--muted-foreground", "content": "StatusBar at 100% zoom — zoom indicator is HIDDEN. Cmd+= zooms in, Cmd+- zooms out, Cmd+0 resets to 100%.", "fontFamily": "Inter", "fontSize": 11 } ] } ] }, { "type": "frame", "id": "zs_zoomed", "name": "Zoom Shortcuts — StatusBar (150% / zoomed in)", "x": 0, "y": 60, "theme": { "Mode": "Light" }, "width": 800, "height": 32, "fill": "$--background", "layout": "horizontal", "gap": 0, "padding": [ 0, 12 ], "alignItems": "center", "children": [ { "type": "frame", "id": "zs_statusbar_zoomed", "name": "StatusBar — 150% (zoom indicator visible)", "layout": "horizontal", "gap": 8, "alignItems": "center", "padding": [ 0, 8 ], "children": [ { "type": "text", "id": "zs_wordcount_z", "fill": "$--muted-foreground", "content": "1,247 words", "fontFamily": "IBM Plex Mono", "fontSize": 11 }, { "type": "frame", "id": "zs_zoom_badge", "name": "Zoom % Badge", "fill": "$--muted", "cornerRadius": 4, "padding": [ 2, 6 ], "alignItems": "center", "gap": 4, "children": [ { "type": "text", "id": "zs_zoom_label", "fill": "$--foreground", "content": "150%", "fontFamily": "IBM Plex Mono", "fontSize": 11, "fontWeight": "500" } ] } ] } ] }, { "type": "frame", "id": "zs_cmd_palette", "name": "Zoom Shortcuts — Command Palette entries", "x": 0, "y": 120, "theme": { "Mode": "Light" }, "width": 540, "height": 120, "fill": "$--popover", "cornerRadius": 12, "layout": "vertical", "gap": 0, "children": [ { "type": "frame", "id": "zs_cmd_row1", "name": "Command — Zoom In (⌘=)", "layout": "horizontal", "width": "fill_container", "padding": [ 8, 12 ], "gap": 8, "alignItems": "center", "fill": "$--accent", "children": [ { "type": "text", "id": "zs_cmd_row1_label", "fill": "$--accent-foreground", "content": "Zoom In", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500", "width": "fill_container" }, { "type": "text", "id": "zs_cmd_row1_shortcut", "fill": "$--muted-foreground", "content": "Command+=", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] }, { "type": "frame", "id": "zs_cmd_row2", "name": "Command — Zoom Out (⌘-)", "layout": "horizontal", "width": "fill_container", "padding": [ 8, 12 ], "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "zs_cmd_row2_label", "fill": "$--foreground", "content": "Zoom Out", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500", "width": "fill_container" }, { "type": "text", "id": "zs_cmd_row2_shortcut", "fill": "$--muted-foreground", "content": "Command+-", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] }, { "type": "frame", "id": "zs_cmd_row3", "name": "Command — Reset Zoom (⌘0)", "layout": "horizontal", "width": "fill_container", "padding": [ 8, 12 ], "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "zs_cmd_row3_label", "fill": "$--foreground", "content": "Reset Zoom", "fontFamily": "Inter", "fontSize": 13, "fontWeight": "500", "width": "fill_container" }, { "type": "text", "id": "zs_cmd_row3_shortcut", "fill": "$--muted-foreground", "content": "Command+0", "fontFamily": "IBM Plex Mono", "fontSize": 11 } ] } ] }, { "type": "frame", "id": "gofix01", "x": 0, "y": 0, "name": "GitHub OAuth Fix — Modal with inline device flow", "clip": true, "width": 560, "height": 420, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "gofix01-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "gofix01-title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "gofix01-close", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "gofix01-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "gofix01-desc", "name": "Description", "width": "fill_container", "padding": [ 16, 24 ], "children": [ { "type": "text", "id": "gofix01-desc-t", "content": "Connect your GitHub account to clone or create vaults backed by GitHub repos.", "fontSize": 13, "fill": "$--muted-foreground", "lineHeight": 1.5 } ] }, { "type": "frame", "id": "gofix01-body", "name": "DeviceFlowLogin", "width": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 24, 24 ], "alignItems": "center", "children": [ { "type": "frame", "id": "gofix01-login-btn", "name": "LoginButton", "width": 200, "height": 36, "fill": "$--foreground", "cornerRadius": 6, "alignItems": "center", "justifyContent": "center", "gap": 8, "children": [ { "type": "text", "id": "gofix01-gh-icon", "content": "G", "fontSize": 14, "fontWeight": 700, "fill": "$--background" }, { "type": "text", "id": "gofix01-login-label", "content": "Login with GitHub", "fontSize": 13, "fontWeight": 500, "fill": "$--background" } ] } ] } ] }, { "type": "frame", "id": "gofix02", "x": 660, "y": 0, "name": "GitHub OAuth Fix — Device code waiting state", "clip": true, "width": 560, "height": 420, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "gofix02-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "gofix02-title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "gofix02-close", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "gofix02-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "gofix02-desc", "name": "Description", "width": "fill_container", "padding": [ 16, 24 ], "children": [ { "type": "text", "id": "gofix02-desc-t", "content": "Connect your GitHub account to clone or create vaults backed by GitHub repos.", "fontSize": 13, "fill": "$--muted-foreground", "lineHeight": 1.5 } ] }, { "type": "frame", "id": "gofix02-body", "name": "DeviceCodeCard", "width": "fill_container", "layout": "vertical", "gap": 12, "padding": [ 24, 24 ], "alignItems": "center", "children": [ { "type": "frame", "id": "gofix02-card", "name": "CodeCard", "width": "fill_container", "layout": "vertical", "gap": 8, "padding": [ 16, 24 ], "cornerRadius": 8, "alignItems": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "gofix02-hint", "content": "Enter this code on GitHub:", "fontSize": 12, "fill": "$--muted-foreground" }, { "type": "frame", "id": "gofix02-code-row", "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "gofix02-code", "content": "ABCD-1234", "fontSize": 24, "fontWeight": 700, "letterSpacing": 4, "fontFamily": "monospace", "fill": "$--foreground" }, { "type": "text", "id": "gofix02-copy", "content": "[copy]", "fontSize": 12, "fill": "$--muted-foreground" } ] }, { "type": "text", "id": "gofix02-url", "content": "https://github.com/login/device", "fontSize": 12, "fill": "$--muted-foreground", "textDecoration": "underline" }, { "type": "frame", "id": "gofix02-spinner-row", "gap": 6, "alignItems": "center", "children": [ { "type": "text", "id": "gofix02-waiting", "content": "Waiting for authorization...", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "gofix02-cancel-btn", "name": "CancelButton", "width": 80, "height": 32, "cornerRadius": 6, "alignItems": "center", "justifyContent": "center", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "text", "id": "gofix02-cancel-label", "content": "Cancel", "fontSize": 12, "fill": "$--muted-foreground" } ] } ] } ] }, { "type": "frame", "id": "gofix03", "x": 1320, "y": 0, "name": "GitHub OAuth Fix — Expired/Error state with retry", "clip": true, "width": 560, "height": 420, "fill": "$--background", "cornerRadius": 12, "layout": "vertical", "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" }, "children": [ { "type": "frame", "id": "gofix03-hdr", "name": "Header", "width": "fill_container", "height": 56, "fill": "$--background", "padding": [ 0, 24 ], "alignItems": "center", "justifyContent": "space-between", "stroke": { "align": "inside", "thickness": { "bottom": 1 }, "fill": "$--border" }, "children": [ { "type": "text", "id": "gofix03-title", "content": "Connect GitHub Repo", "fontSize": 16, "fontWeight": 600, "fill": "$--foreground" }, { "type": "frame", "id": "gofix03-close", "width": 24, "height": 24, "cornerRadius": 4, "alignItems": "center", "justifyContent": "center", "children": [ { "type": "text", "id": "gofix03-x", "content": "X", "fontSize": 14, "fill": "$--muted-foreground" } ] } ] }, { "type": "frame", "id": "gofix03-desc", "name": "Description", "width": "fill_container", "padding": [ 16, 24 ], "children": [ { "type": "text", "id": "gofix03-desc-t", "content": "Connect your GitHub account to clone or create vaults backed by GitHub repos.", "fontSize": 13, "fill": "$--muted-foreground", "lineHeight": 1.5 } ] }, { "type": "frame", "id": "gofix03-body", "name": "ErrorState", "width": "fill_container", "layout": "vertical", "gap": 16, "padding": [ 24, 24 ], "alignItems": "center", "children": [ { "type": "frame", "id": "gofix03-login-btn", "name": "LoginButton", "width": 200, "height": 36, "fill": "$--foreground", "cornerRadius": 6, "alignItems": "center", "justifyContent": "center", "gap": 8, "children": [ { "type": "text", "id": "gofix03-gh-icon", "content": "G", "fontSize": 14, "fontWeight": 700, "fill": "$--background" }, { "type": "text", "id": "gofix03-login-label", "content": "Login with GitHub", "fontSize": 13, "fontWeight": 500, "fill": "$--background" } ] }, { "type": "frame", "id": "gofix03-error-row", "gap": 8, "alignItems": "center", "children": [ { "type": "text", "id": "gofix03-error-msg", "content": "Authorization expired. Please try again.", "fontSize": 12, "fill": "$--destructive" }, { "type": "text", "id": "gofix03-retry-label", "content": "Retry", "fontSize": 12, "fill": "$--destructive" } ] } ] } ] }, { "children": [ { "alignItems": "center", "children": [ { "content": "Settings", "fill": "#37352F", "fontSize": 16, "fontWeight": "600", "id": "o6HJK", "type": "text" }, { "fill": "#787774", "height": 16, "iconFontFamily": "lucide", "iconFontName": "x", "id": "zgXAf", "type": "icon_font", "width": 16 } ], "height": 56, "id": "mxSw1", "justifyContent": "space_between", "name": "Header", "padding": [ 0, 24 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "bottom": 1 } }, "type": "frame", "width": "fill_container" }, { "children": [ { "content": "Appearance", "fill": "#37352F", "fontSize": 13, "fontWeight": "600", "id": "NhMui", "type": "text" }, { "content": "Choose a theme for your vault. Themes are JSON files in _themes/ — edit them to customize.", "fill": "#787774", "fontSize": 12, "id": "atYQn", "lineHeight": 1.5, "textGrowth": "fixed-width", "type": "text", "width": "fill_container" }, { "children": [ { "alignItems": "center", "children": [ { "children": [ { "fill": "#FFFFFF", "height": 32, "type": "rectangle", "width": 20 }, { "fill": "#F7F6F3", "height": 32, "type": "rectangle", "width": 20 } ], "cornerRadius": 4, "height": 32, "type": "frame", "width": 40 }, { "children": [ { "content": "Default", "fill": "#37352F", "fontSize": 13, "fontWeight": "500", "type": "text" }, { "content": "Light theme with warm tones", "fill": "#787774", "fontSize": 11, "type": "text" } ], "gap": 2, "layout": "vertical", "type": "frame", "width": "fill_container" }, { "content": "Active", "fill": "#155DFF", "fontSize": 11, "fontWeight": "500", "type": "text" } ], "cornerRadius": 6, "gap": 12, "height": 56, "name": "Theme Item — Default (Active)", "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#155DFF", "thickness": 2 }, "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "fill": "#1a1a2e", "height": 32, "type": "rectangle", "width": 20 }, { "fill": "#0f0f1a", "height": 32, "type": "rectangle", "width": 20 } ], "cornerRadius": 4, "height": 32, "type": "frame", "width": 40 }, { "children": [ { "content": "Dark", "fill": "#37352F", "fontSize": 13, "fontWeight": "500", "type": "text" }, { "content": "Dark variant with deep navy tones", "fill": "#787774", "fontSize": 11, "type": "text" } ], "gap": 2, "layout": "vertical", "type": "frame", "width": "fill_container" } ], "cornerRadius": 6, "gap": 12, "height": 56, "name": "Theme Item — Dark", "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "fill": "#FAFAFA", "height": 32, "type": "rectangle", "width": 20 }, { "fill": "#111111", "height": 32, "type": "rectangle", "width": 20 } ], "cornerRadius": 4, "height": 32, "type": "frame", "width": 40 }, { "children": [ { "content": "Minimal", "fill": "#37352F", "fontSize": 13, "fontWeight": "500", "type": "text" }, { "content": "High contrast, minimal chrome", "fill": "#787774", "fontSize": 11, "type": "text" } ], "gap": 2, "layout": "vertical", "type": "frame", "width": "fill_container" } ], "cornerRadius": 6, "gap": 12, "height": 56, "name": "Theme Item — Minimal", "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame", "width": "fill_container" } ], "gap": 8, "layout": "vertical", "name": "Theme List", "type": "frame", "width": "fill_container" }, { "children": [ { "alignItems": "center", "children": [ { "fill": "#787774", "height": 14, "iconFontFamily": "lucide", "iconFontName": "plus", "type": "icon_font", "width": 14 }, { "content": "New Theme", "fill": "#37352F", "fontSize": 12, "fontWeight": "500", "type": "text" } ], "cornerRadius": 6, "gap": 6, "height": 32, "name": "New Theme Button", "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame" }, { "alignItems": "center", "children": [ { "fill": "#787774", "height": 14, "iconFontFamily": "lucide", "iconFontName": "pencil", "type": "icon_font", "width": 14 }, { "content": "Open in Editor", "fill": "#37352F", "fontSize": 12, "fontWeight": "500", "type": "text" } ], "cornerRadius": 6, "gap": 6, "height": 32, "name": "Open in Editor Button", "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame" } ], "gap": 8, "name": "Actions", "type": "frame", "width": "fill_container" } ], "gap": 20, "layout": "vertical", "name": "Body", "padding": 24, "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "alignItems": "center", "children": [ { "content": "Cancel", "fill": "#37352F", "fontSize": 13, "type": "text" } ], "cornerRadius": 6, "height": 32, "padding": [ 0, 16 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame" }, { "alignItems": "center", "children": [ { "content": "Save", "fill": "#FFFFFF", "fontSize": 13, "type": "text" } ], "cornerRadius": 6, "fill": "#155DFF", "height": 32, "padding": [ 0, 16 ], "type": "frame" } ], "gap": 8, "height": 56, "justifyContent": "end", "name": "Footer", "padding": [ 0, 24 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "top": 1 } }, "type": "frame", "width": "fill_container" } ], "fill": "#FFFFFF", "layout": "vertical", "name": "Settings — Appearance", "type": "frame", "width": 520, "x": 0, "y": 0 }, { "children": [ { "alignItems": "center", "children": [ { "content": "Switch theme...", "fill": "#787774", "fontSize": 15, "type": "text" } ], "height": 44, "name": "Search", "padding": [ 0, 16 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "bottom": 1 } }, "type": "frame", "width": "fill_container" }, { "children": [ { "content": "APPEARANCE", "fill": "#787774", "fontSize": 11, "fontWeight": "600", "letterSpacing": 0.8, "type": "text" }, { "alignItems": "center", "children": [ { "children": [ { "fill": "#FFFFFF", "height": 16, "type": "rectangle", "width": 10 }, { "fill": "#F7F6F3", "height": 16, "type": "rectangle", "width": 10 } ], "cornerRadius": 3, "height": 16, "type": "frame", "width": 20 }, { "content": "Switch to Default", "fill": "#37352F", "fontSize": 13, "type": "text" }, { "fill": "#155DFF", "height": 14, "iconFontFamily": "lucide", "iconFontName": "check", "type": "icon_font", "width": 14 } ], "cornerRadius": 6, "fill": "#EBEBEA", "gap": 8, "height": 36, "name": "Row — Active", "padding": [ 0, 12 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "fill": "#1a1a2e", "height": 16, "type": "rectangle", "width": 10 }, { "fill": "#0f0f1a", "height": 16, "type": "rectangle", "width": 10 } ], "cornerRadius": 3, "height": 16, "type": "frame", "width": 20 }, { "content": "Switch to Dark", "fill": "#37352F", "fontSize": 13, "type": "text" } ], "cornerRadius": 6, "gap": 8, "height": 36, "name": "Row — Dark", "padding": [ 0, 12 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "children": [ { "fill": "#FAFAFA", "height": 16, "type": "rectangle", "width": 10 }, { "fill": "#111111", "height": 16, "type": "rectangle", "width": 10 } ], "cornerRadius": 3, "height": 16, "type": "frame", "width": 20 }, { "content": "Switch to Minimal", "fill": "#37352F", "fontSize": 13, "type": "text" } ], "cornerRadius": 6, "gap": 8, "height": 36, "name": "Row — Minimal", "padding": [ 0, 12 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "fill": "#787774", "height": 16, "iconFontFamily": "lucide", "iconFontName": "plus", "type": "icon_font", "width": 16 }, { "content": "New Theme", "fill": "#37352F", "fontSize": 13, "type": "text" } ], "cornerRadius": 6, "gap": 8, "height": 36, "name": "Row — New Theme", "padding": [ 0, 12 ], "type": "frame", "width": "fill_container" } ], "layout": "vertical", "name": "Results", "padding": [ 4, 0 ], "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "content": "↑↓ navigate", "fill": "#787774", "fontSize": 11, "type": "text" }, { "content": "↵ select", "fill": "#787774", "fontSize": 11, "type": "text" }, { "content": "esc close", "fill": "#787774", "fontSize": 11, "type": "text" } ], "gap": 16, "height": 28, "name": "Footer", "padding": [ 0, 16 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "top": 1 } }, "type": "frame", "width": "fill_container" } ], "cornerRadius": 12, "fill": "#FFFFFF", "layout": "vertical", "name": "Command Palette — Theme Switching", "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame", "width": 520, "x": 620, "y": 0 }, { "children": [ { "children": [ { "alignItems": "center", "children": [ { "fill": "#787774", "height": 14, "iconFontFamily": "lucide", "iconFontName": "file", "type": "icon_font", "width": 14 }, { "content": "_themes/default.json", "fill": "#37352F", "fontSize": 12, "fontWeight": "500", "type": "text" } ], "gap": 8, "height": 36, "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "bottom": 1 } }, "type": "frame", "width": "fill_container" }, { "children": [ { "content": "{", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": " \"name\": \"Default\",", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": " \"colors\": {", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": " \"background\": \"#FFFFFF\",", "fill": "#155DFF", "fontFamily": "IBM Plex Mono", "fontSize": 12, "fontWeight": "600", "type": "text" }, { "content": " \"sidebar-background\": \"#F7F6F3\",", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": " \"accent\": \"#155DFF\"", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": " }", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" }, { "content": "}", "fill": "#37352F", "fontFamily": "IBM Plex Mono", "fontSize": 12, "type": "text" } ], "gap": 2, "layout": "vertical", "padding": 16, "type": "frame", "width": "fill_container" } ], "cornerRadius": 8, "fill": "#FFFFFF", "layout": "vertical", "name": "Editor — Theme JSON", "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame", "width": 400 }, { "alignItems": "center", "children": [ { "fill": "#787774", "height": 24, "iconFontFamily": "lucide", "iconFontName": "arrow-right", "type": "icon_font", "width": 24 }, { "content": "~300ms", "fill": "#787774", "fontSize": 10, "fontWeight": "500", "type": "text" } ], "justifyContent": "center", "layout": "vertical", "name": "Arrow", "type": "frame", "width": 40 }, { "children": [ { "alignItems": "center", "children": [ { "fill": "#FF5F57", "height": 8, "type": "ellipse", "width": 8 }, { "fill": "#FEBC2E", "height": 8, "type": "ellipse", "width": 8 }, { "fill": "#28C840", "height": 8, "type": "ellipse", "width": 8 } ], "fill": "#F7F6F3", "gap": 6, "height": 28, "padding": [ 0, 8 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "bottom": 1 } }, "type": "frame", "width": "fill_container" }, { "children": [ { "children": [ { "cornerRadius": 4, "fill": "#EBEBEA", "height": 20, "type": "frame", "width": "fill_container" }, { "cornerRadius": 4, "height": 20, "type": "frame", "width": "fill_container" }, { "cornerRadius": 4, "height": 20, "type": "frame", "width": "fill_container" } ], "fill": "#F7F6F3", "gap": 4, "height": "fill_container", "layout": "vertical", "padding": [ 8, 6 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "right": 1 } }, "type": "frame", "width": 80 }, { "children": [ { "cornerRadius": 2, "fill": "#37352F", "height": 12, "type": "frame", "width": 160 }, { "cornerRadius": 2, "fill": "#F0F0EF", "height": 8, "type": "frame", "width": "fill_container" }, { "cornerRadius": 2, "fill": "#F0F0EF", "height": 8, "type": "frame", "width": 220 }, { "cornerRadius": 2, "fill": "#F0F0EF", "height": 8, "type": "frame", "width": 180 } ], "gap": 8, "height": "fill_container", "layout": "vertical", "padding": 16, "type": "frame", "width": "fill_container" } ], "height": 260, "type": "frame", "width": "fill_container" }, { "alignItems": "center", "children": [ { "fill": "#38A169", "height": 6, "type": "ellipse", "width": 6 }, { "content": "Live — CSS variables update instantly", "fill": "#787774", "fontSize": 10, "type": "text" } ], "gap": 6, "height": 28, "padding": [ 0, 12 ], "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": { "top": 1 } }, "type": "frame", "width": "fill_container" } ], "cornerRadius": 8, "fill": "#FFFFFF", "layout": "vertical", "name": "App Preview", "stroke": { "align": "inside", "fill": "#E9E9E7", "thickness": 1 }, "type": "frame", "width": 380 } ], "fill": "#F0F0EF", "gap": 24, "name": "Live Theme Editing Flow", "padding": 24, "type": "frame", "width": 900, "x": 0, "y": 700 } ], "themes": { "Mode": [ "Dark" ] }, "variables": { "--accent": { "type": "color", "value": [ { "value": "#EBEBEA" }, { "value": "#252545", "theme": { "Mode": "Dark" } } ] }, "--accent-blue": { "type": "color", "value": [ { "value": "#2383E2" }, { "value": "#4a9eff", "theme": { "Mode": "Dark" } }, { "value": "#155DFF" }, { "value": "#155DFF", "theme": { "Mode": "Dark" } } ] }, "--accent-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#ffffff", "theme": { "Mode": "Dark" } } ] }, "--accent-green": { "type": "color", "value": [ { "value": "#0F7B6C" }, { "value": "#4caf50", "theme": { "Mode": "Dark" } }, { "value": "#00B38B" }, { "value": "#00B38B", "theme": { "Mode": "Dark" } } ] }, "--accent-orange": { "type": "color", "value": [ { "value": "#D9730D" }, { "value": "#ff9800", "theme": { "Mode": "Dark" } } ] }, "--accent-purple": { "type": "color", "value": [ { "value": "#9065B0" }, { "value": "#9c72ff", "theme": { "Mode": "Dark" } }, { "value": "#A932FF" }, { "value": "#A932FF", "theme": { "Mode": "Dark" } } ] }, "--accent-red": { "type": "color", "value": [ { "value": "#E03E3E" }, { "value": "#f44336", "theme": { "Mode": "Dark" } } ] }, "--background": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#0f0f1a", "theme": { "Mode": "Dark" } } ] }, "--black": { "type": "color", "value": "#000000" }, "--border": { "type": "color", "value": [ { "value": "#E9E9E7" }, { "value": "#2a2a4a", "theme": { "Mode": "Dark" } } ] }, "--card": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#16162a", "theme": { "Mode": "Dark" } } ] }, "--card-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#e0e0e0", "theme": { "Mode": "Dark" } } ] }, "--destructive": { "type": "color", "value": [ { "value": "#E03E3E" }, { "value": "#f44336", "theme": { "Mode": "Dark" } } ] }, "--destructive-foreground": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#ffffff", "theme": { "Mode": "Dark" } } ] }, "--font-primary": { "type": "string", "value": [ { "value": "Inter" }, { "value": "-apple-system, BlinkMacSystemFont, Inter, sans-serif" }, { "value": "Inter" } ] }, "--font-system": { "type": "string", "value": "-apple-system, BlinkMacSystemFont, sans-serif" }, "--foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#e0e0e0", "theme": { "Mode": "Dark" } } ] }, "--input": { "type": "color", "value": [ { "value": "#E9E9E7" }, { "value": "#2a2a4a", "theme": { "Mode": "Dark" } } ] }, "--muted": { "type": "color", "value": [ { "value": "#F0F0EF" }, { "value": "#1e1e3a", "theme": { "Mode": "Dark" } } ] }, "--muted-foreground": { "type": "color", "value": [ { "value": "#787774" }, { "value": "#888888", "theme": { "Mode": "Dark" } } ] }, "--popover": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#1e1e3a", "theme": { "Mode": "Dark" } } ] }, "--popover-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#e0e0e0", "theme": { "Mode": "Dark" } } ] }, "--primary": { "type": "color", "value": [ { "value": "#2383E2" }, { "value": "#4a9eff", "theme": { "Mode": "Dark" } }, { "value": "#155DFF" }, { "value": "#155DFF", "theme": { "Mode": "Dark" } } ] }, "--primary-foreground": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#ffffff", "theme": { "Mode": "Dark" } } ] }, "--radius-lg": { "type": "number", "value": 8 }, "--radius-md": { "type": "number", "value": 6 }, "--radius-sm": { "type": "number", "value": 4 }, "--ring": { "type": "color", "value": [ { "value": "#2383E2" }, { "value": "#4a9eff", "theme": { "Mode": "Dark" } }, { "value": "#155DFF" }, { "value": "#155DFF", "theme": { "Mode": "Dark" } } ] }, "--secondary": { "type": "color", "value": [ { "value": "#EBEBEA" }, { "value": "#2a2a4a", "theme": { "Mode": "Dark" } } ] }, "--secondary-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#e0e0e0", "theme": { "Mode": "Dark" } } ] }, "--sidebar": { "type": "color", "value": [ { "value": "#F7F6F3" }, { "value": "#1a1a2e", "theme": { "Mode": "Dark" } } ] }, "--sidebar-accent": { "type": "color", "value": [ { "value": "#EBEBEA" }, { "value": "#252545", "theme": { "Mode": "Dark" } } ] }, "--sidebar-accent-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#ffffff", "theme": { "Mode": "Dark" } } ] }, "--sidebar-border": { "type": "color", "value": [ { "value": "#E9E9E7" }, { "value": "#2a2a4a", "theme": { "Mode": "Dark" } } ] }, "--sidebar-foreground": { "type": "color", "value": [ { "value": "#37352F" }, { "value": "#e0e0e0", "theme": { "Mode": "Dark" } } ] }, "--sidebar-primary": { "type": "color", "value": [ { "value": "#2383E2" }, { "value": "#4a9eff", "theme": { "Mode": "Dark" } }, { "value": "#155DFF" }, { "value": "#155DFF", "theme": { "Mode": "Dark" } } ] }, "--sidebar-primary-foreground": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "value": "#ffffff", "theme": { "Mode": "Dark" } } ] }, "--sidebar-ring": { "type": "color", "value": [ { "value": "#2383E2" }, { "value": "#4a9eff", "theme": { "Mode": "Dark" } }, { "value": "#155DFF" }, { "value": "#155DFF", "theme": { "Mode": "Dark" } } ] }, "--white": { "type": "color", "value": "#ffffff" }, "--accent-yellow": { "type": "color", "value": [ { "value": "#F0B100" }, { "value": "#F0B100", "theme": { "Mode": "Dark" } } ] }, "--accent-blue-light": { "type": "color", "value": [ { "value": "#155DFF14" }, { "value": "#155DFF20", "theme": { "Mode": "Dark" } } ] }, "--accent-green-light": { "type": "color", "value": [ { "value": "#00B38B14" }, { "value": "#00B38B20", "theme": { "Mode": "Dark" } } ] }, "--accent-purple-light": { "type": "color", "value": [ { "value": "#A932FF14" }, { "value": "#A932FF20", "theme": { "Mode": "Dark" } } ] }, "--accent-red-light": { "type": "color", "value": [ { "value": "#E03E3E14" }, { "value": "#f4433620", "theme": { "Mode": "Dark" } } ] }, "--accent-yellow-light": { "type": "color", "value": [ { "value": "#F0B10014" }, { "value": "#F0B10020", "theme": { "Mode": "Dark" } } ] }, "--spacing-xs": { "type": "number", "value": 4 }, "--spacing-sm": { "type": "number", "value": 8 }, "--spacing-md": { "type": "number", "value": 12 }, "--spacing-lg": { "type": "number", "value": 16 }, "--spacing-xl": { "type": "number", "value": 24 }, "--spacing-2xl": { "type": "number", "value": 32 }, "--spacing-3xl": { "type": "number", "value": 40 }, "--height-titlebar": { "type": "number", "value": 38 }, "--height-tabbar": { "type": "number", "value": 45 }, "--height-breadcrumb": { "type": "number", "value": 45 }, "--height-statusbar": { "type": "number", "value": 30 }, "--height-search-bar": { "type": "number", "value": 40 }, "--height-note-item": { "type": "number", "value": 64 }, "--height-inspector-header": { "type": "number", "value": 36 }, "--height-modal-header": { "type": "number", "value": 56 }, "--height-modal-footer": { "type": "number", "value": 56 }, "--shadow-sm": { "type": "string", "value": "0 1px 2px rgba(0,0,0,0.05)" }, "--shadow-md": { "type": "string", "value": "0 4px 6px rgba(0,0,0,0.07)" }, "--shadow-lg": { "type": "string", "value": "0 10px 15px rgba(0,0,0,0.1)" }, "--font-mono": { "type": "string", "value": "IBM Plex Mono, monospace" }, "--search-bg": { "type": "color", "value": [ { "value": "#FFFFFF" }, { "theme": { "Mode": "Dark" }, "value": "#1E1E2E" } ] }, "--search-input-bg": { "type": "color", "value": [ { "value": "#F0F0EF" }, { "theme": { "Mode": "Dark" }, "value": "#2A2A3C" } ] }, "--search-text": { "type": "color", "value": [ { "value": "#37352F" }, { "theme": { "Mode": "Dark" }, "value": "#ccccdd" } ] }, "--search-text-muted": { "type": "color", "value": [ { "value": "#787774" }, { "theme": { "Mode": "Dark" }, "value": "#8888aa" } ] }, "--search-text-dim": { "type": "color", "value": [ { "value": "#787774" }, { "theme": { "Mode": "Dark" }, "value": "#666680" } ] }, "--search-heading": { "type": "color", "value": [ { "value": "#37352F" }, { "theme": { "Mode": "Dark" }, "value": "#e0e0f0" } ] }, "--search-border": { "type": "color", "value": [ { "value": "#E9E9E7" }, { "theme": { "Mode": "Dark" }, "value": "#4c4c6d" } ] }, "--search-highlight": { "type": "color", "value": [ { "value": "#37352F" }, { "theme": { "Mode": "Dark" }, "value": "#555570" } ] }, "--search-snippet": { "type": "color", "value": [ { "value": "#787774" }, { "theme": { "Mode": "Dark" }, "value": "#888899" } ] }, "--search-count": { "type": "color", "value": [ { "value": "#787774" }, { "theme": { "Mode": "Dark" }, "value": "#c0c0d0" } ] }, "--traffic-red": { "type": "color", "value": "#ff5f57" }, "--traffic-yellow": { "type": "color", "value": "#febc2e" }, "--traffic-green": { "type": "color", "value": "#28c840" }, "--white-overlay": { "type": "color", "value": "#ffffff40" }, "--accent-orange-light": { "type": "color", "value": "#D9730D14" } }, "fonts": [ { "name": "GT Pressura Trial", "url": "GT-Pressura-Regular-Trial.otf" } ] }