UNPKG

@phren/cli

Version:

Knowledge layer for AI agents - CLI, MCP server, and data layer

github.com/alaarab/phren

alaarab/phren

8 lines (7 loc) • 21.7 kB
1
2
3
4
5
6
7
8
export declare const PROJECT_REFERENCE_UI_STYLES = "\n .project-reference-shell {\n height: calc(100vh - 260px);\n min-height: 520px;\n }\n .reference-sidebar-toolbar {\n display: flex;\n gap: 8px;\n padding: 12px 16px;\n border-bottom: 1px solid var(--border);\n background: var(--surface);\n position: sticky;\n top: 0;\n z-index: 1;\n }\n .reference-banner {\n border: 1px solid var(--border);\n border-radius: var(--radius);\n background: color-mix(in srgb, var(--accent) 6%, var(--surface));\n color: var(--ink-secondary);\n padding: 14px 16px;\n margin-bottom: 12px;\n font-size: var(--text-sm);\n line-height: 1.55;\n }\n .reference-doc-meta {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n margin-top: 10px;\n }\n .reference-hint {\n padding: 20px;\n color: var(--muted);\n font-size: var(--text-sm);\n line-height: 1.6;\n }\n .reference-status {\n margin-left: auto;\n font-size: var(--text-xs);\n color: var(--muted);\n }\n .reference-status.ok { color: var(--success); }\n .reference-status.err { color: var(--danger); }\n .reference-sidebar-note {\n padding: 12px 16px;\n color: var(--muted);\n font-size: var(--text-sm);\n border-bottom: 1px solid var(--border-light);\n }\n .reference-item-main {\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 0;\n }\n .reference-item-title {\n font-size: var(--text-base);\n color: var(--ink);\n font-weight: 500;\n }\n .reference-item-meta {\n font-size: var(--text-xs);\n color: var(--muted);\n line-height: 1.4;\n }\n .reference-item-action {\n margin-left: 8px;\n flex-shrink: 0;\n }\n .topic-editor {\n padding: 20px;\n display: flex;\n flex-direction: column;\n gap: 14px;\n max-width: 720px;\n }\n .topic-editor label {\n display: flex;\n flex-direction: column;\n gap: 6px;\n color: var(--ink-secondary);\n font-size: var(--text-sm);\n font-weight: 600;\n }\n .topic-editor input,\n .topic-editor textarea {\n width: 100%;\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n padding: 10px 12px;\n font-size: var(--text-base);\n font-family: var(--font);\n background: var(--surface);\n color: var(--ink);\n }\n .topic-editor textarea {\n min-height: 90px;\n resize: vertical;\n }\n .topic-editor-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n }\n .topic-empty {\n padding: 24px 20px;\n color: var(--muted);\n line-height: 1.6;\n }\n .topic-keywords {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n margin-top: 12px;\n }\n .topic-keyword {\n display: inline-flex;\n align-items: center;\n padding: 4px 8px;\n border-radius: 999px;\n background: var(--surface-sunken);\n color: var(--ink-secondary);\n font-size: var(--text-xs);\n font-weight: 600;\n }\n"; export declare const SETTINGS_TAB_UI_STYLES = "\n .settings-shell {\n display: flex;\n flex-direction: column;\n gap: 18px;\n }\n .settings-section {\n border: 1px solid var(--border);\n border-radius: var(--radius);\n background: var(--surface);\n box-shadow: var(--shadow);\n overflow: hidden;\n }\n .settings-section-findings { border-top: 3px solid color-mix(in srgb, var(--accent) 60%, var(--border)); }\n .settings-section-behavior { border-top: 3px solid color-mix(in srgb, var(--blue) 45%, var(--border)); }\n .settings-section-integrations { border-top: 3px solid color-mix(in srgb, var(--purple) 45%, var(--border)); }\n .settings-section-header {\n padding: 16px 18px 12px;\n border-bottom: 1px solid var(--border-light);\n background: var(--surface);\n }\n .settings-section-header h3 {\n margin: 0;\n font-size: var(--text-md);\n font-weight: 700;\n letter-spacing: -0.02em;\n color: var(--ink);\n }\n .settings-section-header p {\n margin: 6px 0 0;\n color: var(--muted);\n font-size: var(--text-sm);\n line-height: 1.5;\n }\n .settings-section-body {\n padding: 18px;\n display: flex;\n flex-direction: column;\n gap: 16px;\n }\n .settings-control {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 12px;\n border: 1px solid var(--border-light);\n border-radius: var(--radius-sm);\n background: var(--surface-raised);\n }\n .settings-control-primary {\n background: color-mix(in srgb, var(--accent) 4%, var(--surface-raised));\n border-color: color-mix(in srgb, var(--accent) 18%, var(--border));\n }\n .settings-control-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n }\n .settings-control-label {\n font-size: var(--text-base);\n font-weight: 600;\n color: var(--ink-secondary);\n }\n .settings-control-note {\n color: var(--muted);\n font-size: var(--text-sm);\n line-height: 1.5;\n }\n .settings-control-value {\n color: var(--ink-secondary);\n font-size: var(--text-base);\n font-weight: 600;\n }\n .settings-chip-row {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n }\n .settings-chip {\n border: 1px solid var(--border);\n background: transparent;\n color: var(--ink-secondary);\n border-radius: 999px;\n padding: 6px 12px;\n cursor: pointer;\n font-size: var(--text-sm);\n font-family: var(--font);\n font-weight: 600;\n transition: background .15s, border-color .15s, color .15s;\n }\n .settings-chip:hover {\n border-color: var(--accent);\n color: var(--ink);\n }\n .settings-chip.active {\n border-color: var(--accent);\n background: var(--accent);\n color: #fff;\n }\n .settings-chip.readonly {\n cursor: default;\n opacity: 0.92;\n }\n .settings-chip.readonly:hover {\n border-color: var(--border);\n color: var(--ink-secondary);\n }\n .settings-chip.active.readonly:hover {\n border-color: var(--accent);\n color: #fff;\n }\n .settings-status-inline {\n min-height: 18px;\n font-size: var(--text-sm);\n color: var(--muted);\n }\n .settings-status-inline.ok { color: var(--success); }\n .settings-status-inline.err { color: var(--danger); }\n .settings-integrations-table {\n width: 100%;\n border-collapse: collapse;\n }\n .settings-integrations-table th,\n .settings-integrations-table td {\n text-align: left;\n padding: 10px 8px;\n border-bottom: 1px solid var(--border-light);\n font-size: var(--text-sm);\n vertical-align: middle;\n }\n .settings-integrations-table th {\n color: var(--muted);\n font-weight: 650;\n letter-spacing: 0.02em;\n text-transform: uppercase;\n font-size: var(--text-xs);\n }\n .settings-integrations-table tr:last-child td { border-bottom: none; }\n .settings-tool {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 600;\n color: var(--ink-secondary);\n text-transform: capitalize;\n }\n .settings-indicator {\n width: 9px;\n height: 9px;\n border-radius: 50%;\n display: inline-block;\n margin-right: 6px;\n }\n .settings-indicator.on { background: var(--success); }\n .settings-indicator.off { background: var(--danger); }\n"; export declare const TASK_UI_STYLES = "\n /* \u2500\u2500 Task Manager Styles \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n .task-toolbar {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 20px;\n flex-wrap: wrap;\n }\n .task-filter-select {\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n padding: 8px 12px;\n background: var(--surface);\n color: var(--ink);\n font-size: var(--text-sm);\n font-family: var(--font);\n cursor: pointer;\n transition: border-color 0.15s;\n }\n .task-filter-select:hover { border-color: var(--accent); }\n .task-filter-select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-dim); }\n .task-count-label {\n font-size: var(--text-sm);\n color: var(--muted);\n margin-left: auto;\n font-weight: 500;\n }\n\n .task-empty-state {\n padding: 60px 40px;\n text-align: center;\n color: var(--muted);\n }\n\n .task-add-bar {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n align-items: center;\n }\n .task-add-input {\n flex: 1;\n padding: 10px 14px;\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n background: var(--surface);\n color: var(--ink);\n font-size: var(--text-base);\n font-family: var(--font);\n transition: border-color 0.15s, box-shadow 0.15s;\n }\n .task-add-input:focus {\n outline: none;\n border-color: var(--accent);\n box-shadow: 0 0 0 3px var(--accent-dim);\n }\n .task-add-input::placeholder { color: var(--muted); opacity: 0.6; }\n .task-add-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 10px 18px;\n border: none;\n border-radius: var(--radius-sm);\n background: var(--accent);\n color: #fff;\n cursor: pointer;\n font-size: var(--text-sm);\n font-weight: 600;\n font-family: var(--font);\n transition: background 0.15s, transform 0.1s;\n white-space: nowrap;\n }\n .task-add-btn:hover { background: var(--accent-hover); }\n .task-add-btn:active { transform: scale(0.97); }\n\n .task-section-group { margin-bottom: 24px; }\n .task-section-header {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: var(--text-xs);\n font-weight: 700;\n color: var(--muted);\n text-transform: uppercase;\n letter-spacing: 0.06em;\n margin-bottom: 8px;\n padding: 0 4px;\n }\n .task-section-count {\n font-weight: 500;\n color: var(--muted);\n font-size: var(--text-xs);\n opacity: 0.7;\n }\n\n .task-list {\n display: flex;\n flex-direction: column;\n gap: 2px;\n border: 1px solid var(--border);\n border-radius: var(--radius);\n background: var(--surface);\n overflow: hidden;\n }\n\n .task-row {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 14px;\n border-bottom: 1px solid var(--border-light);\n transition: background 0.1s;\n cursor: default;\n position: relative;\n }\n .task-row:last-child { border-bottom: none; }\n .task-row:hover { background: var(--surface-raised); }\n .task-row:hover .task-row-actions { opacity: 1; pointer-events: auto; }\n\n .task-row-priority {\n width: 4px;\n height: 24px;\n border-radius: 2px;\n flex-shrink: 0;\n }\n .task-row-priority-high { background: #ef4444; }\n .task-row-priority-medium { background: #f59e0b; }\n .task-row-priority-low { background: #9ca3af; }\n .task-row-priority-none { background: transparent; }\n\n .task-row-content {\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n .task-row-text {\n font-size: var(--text-base);\n color: var(--ink);\n line-height: 1.4;\n word-break: break-word;\n }\n .task-row-done .task-row-text {\n text-decoration: line-through;\n opacity: 0.5;\n }\n .task-row-context {\n font-size: var(--text-xs);\n color: var(--muted);\n font-style: italic;\n margin-top: 2px;\n }\n\n .task-row-meta {\n display: flex;\n align-items: center;\n gap: 6px;\n flex-shrink: 0;\n }\n\n .task-priority-badge {\n display: inline-block;\n padding: 1px 7px;\n border-radius: 999px;\n font-size: 10px;\n font-weight: 600;\n text-transform: capitalize;\n }\n .task-priority-high { background: #ef444418; color: #ef4444; }\n .task-priority-medium { background: #f59e0b18; color: #f59e0b; }\n .task-priority-low { background: #6b728018; color: #6b7280; }\n\n .task-project-badge {\n display: inline-block;\n padding: 2px 8px;\n border-radius: var(--radius-sm);\n font-size: 10px;\n font-weight: 500;\n background: var(--accent-dim);\n color: var(--accent);\n }\n\n .task-pin-indicator {\n color: var(--accent);\n display: inline-flex;\n align-items: center;\n }\n\n .task-github-badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n border-radius: var(--radius-sm);\n font-size: 10px;\n font-weight: 500;\n background: var(--surface-sunken);\n color: var(--ink-secondary);\n text-decoration: none;\n transition: background 0.15s;\n }\n .task-github-badge:hover { background: var(--accent-dim); color: var(--accent); }\n\n .task-row-actions {\n display: flex;\n align-items: center;\n gap: 4px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 0.15s;\n flex-shrink: 0;\n }\n .task-action-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n background: var(--surface);\n color: var(--muted);\n cursor: pointer;\n font-size: 12px;\n font-family: var(--font);\n transition: all 0.15s;\n padding: 0;\n }\n .task-action-btn:hover {\n border-color: var(--accent);\n color: var(--accent);\n background: var(--accent-dim);\n }\n .task-action-btn.task-action-complete:hover {\n border-color: var(--success);\n color: var(--success);\n background: var(--success-dim);\n }\n .task-action-btn.task-action-delete:hover {\n border-color: var(--danger);\n color: var(--danger);\n background: var(--danger-dim);\n }\n\n .task-done-section { margin-top: 24px; }\n .task-done-toggle {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 4px;\n background: none;\n border: none;\n color: var(--muted);\n font-size: var(--text-xs);\n font-weight: 700;\n font-family: var(--font);\n cursor: pointer;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n transition: color 0.15s;\n }\n .task-done-toggle:hover { color: var(--ink-secondary); }\n .task-toggle-arrow {\n font-size: 10px;\n transition: transform 0.2s;\n }\n .task-done-list { padding-top: 4px; }\n\n /* \u2500\u2500 Task Summary Bar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n .task-summary-bar {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 14px;\n background: var(--surface-sunken, var(--surface));\n border: 1px solid var(--border);\n border-radius: var(--radius);\n margin-bottom: 16px;\n flex-wrap: wrap;\n font-size: var(--text-sm);\n }\n .task-summary-total {\n font-weight: 600;\n color: var(--ink);\n font-size: var(--text-base);\n }\n .task-summary-pill {\n display: inline-flex;\n align-items: center;\n padding: 2px 8px;\n border-radius: 999px;\n font-size: 11px;\n font-weight: 600;\n }\n .task-summary-high { background: #ef444422; color: #ef4444; }\n .task-summary-medium { background: #f59e0b22; color: #f59e0b; }\n .task-summary-low { background: #6b728022; color: #6b7280; }\n .task-summary-projects {\n display: flex;\n gap: 6px;\n align-items: center;\n }\n .task-summary-project {\n font-size: 11px;\n color: var(--muted);\n padding: 1px 6px;\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n }\n\n /* \u2500\u2500 Task Session Badge \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n .task-session-badge {\n display: inline-block;\n padding: 1px 6px;\n border-radius: var(--radius-sm);\n font-size: 10px;\n font-family: var(--mono, monospace);\n background: var(--surface-sunken, var(--surface));\n color: var(--muted);\n border: 1px solid var(--border);\n }\n"; export declare const REVIEW_UI_STYLES = "\n /* \u2500\u2500 Review Toolbar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n .review-toolbar {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 16px;\n flex-wrap: wrap;\n }\n .review-flagged-toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: var(--text-sm);\n font-weight: 500;\n color: var(--ink-secondary);\n cursor: pointer;\n user-select: none;\n }\n .review-flagged-toggle input[type=\"checkbox\"] {\n width: 14px;\n height: 14px;\n cursor: pointer;\n accent-color: var(--accent);\n }\n .review-sync-dot {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n flex-shrink: 0;\n }\n .review-sync-indicator {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--success);\n display: inline-block;\n transition: background 0.3s;\n }\n .review-sync-indicator.syncing {\n background: var(--warning);\n animation: ledPulse 1.2s infinite;\n }\n .review-sync-indicator.error {\n background: var(--danger);\n }\n /* \u2500\u2500 Review Card Highlight (keyboard shortcuts) \u2500\u2500\u2500\u2500 */\n .review-card-highlight {\n border: 2px solid var(--blue) !important;\n box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.08), var(--shadow) !important;\n background: color-mix(in srgb, var(--surface) 98%, var(--blue)) !important;\n }\n"; export declare const LAYOUT_VIEWPORT_STYLES = "\n /* Graph: fill the available viewport height instead of forcing 800px\n (which overflowed laptop-height screens), and frame it as a panel. */\n #graph-canvas {\n height: calc(100vh - 110px);\n min-height: 420px;\n }\n .graph-container {\n position: relative;\n border: 1px solid var(--border);\n border-radius: 10px;\n overflow: hidden;\n }\n\n /* Header nav: shrink and scroll internally on narrow widths so the header\n never pushes the page wider than the viewport. */\n .nav {\n min-width: 0;\n flex: 0 1 auto;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n -ms-overflow-style: none;\n }\n .nav::-webkit-scrollbar { display: none; }\n .nav-item { flex: 0 0 auto; white-space: nowrap; }\n\n @media (max-width: 900px) {\n #graph-canvas { height: calc(100vh - 92px); min-height: 360px; }\n .header { gap: 12px; }\n .nav-item { padding: 0 12px; }\n }\n"; export declare const FINDING_CAPTURE_UI_STYLES = "\n .project-detail-header .capture-finding-btn { margin-left: auto; }\n .finding-capture-bar {\n display: flex;\n gap: 8px;\n padding: 14px 14px 0;\n }\n .finding-capture-bar input {\n flex: 1;\n min-width: 0;\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n padding: 7px 10px;\n background: var(--surface);\n color: var(--ink);\n font: var(--text-sm) var(--font);\n }\n .finding-capture-bar input:focus {\n outline: none;\n border-color: var(--accent);\n box-shadow: 0 0 0 3px var(--accent-dim);\n }\n"; export declare const NOTES_UI_STYLES = "\n .capture-note-btn { white-space: nowrap; }\n .notes-panel { padding: 14px; }\n .note-capture {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n gap: 10px;\n padding: 14px;\n border: 1px solid var(--border);\n border-radius: var(--radius);\n background: var(--surface-raised);\n margin-bottom: 20px;\n }\n .note-capture textarea {\n width: 100%; min-height: 76px; resize: vertical; padding: 10px 12px;\n border: 1px solid var(--border); border-radius: var(--radius-sm);\n background: var(--surface); color: var(--ink); font: var(--text-base) var(--font); line-height: 1.5;\n }\n .note-capture textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-dim); }\n .note-capture-actions { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }\n .note-capture-actions input { padding: 7px 8px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); }\n .note-day { display: flex; flex-direction: column; gap: 9px; margin-bottom: 20px; }\n .note-day-heading { font-size: var(--text-xs); font-weight: 700; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; }\n .note-card { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 14px; background: var(--surface-raised); }\n .note-card-meta { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: var(--text-xs); margin-bottom: 8px; }\n .note-card-meta code { font-family: var(--mono); }\n .note-promoted { color: var(--success); background: var(--success-dim); border-radius: 999px; padding: 1px 7px; font-weight: 600; }\n .note-card-text { color: var(--ink-secondary); font-size: var(--text-base); line-height: 1.6; overflow-wrap: anywhere; }\n .note-card-actions { display: flex; gap: 7px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--border-light); }\n .note-card-actions .note-remove { margin-left: auto; color: var(--danger); }\n @media (max-width: 680px) {\n .note-capture { grid-template-columns: 1fr; }\n .note-capture-actions { flex-direction: row; }\n .project-detail-header { flex-wrap: wrap; }\n }\n";