Split workspace into electron and ui packages

2025-11-17 12:06:58 +00:00
parent aa77ca2931
commit 89bd32814f
137 changed files with 407 additions and 1371 deletions
--- a/packages/ui/src/styles/panels/panel-shell.css
+++ b/packages/ui/src/styles/panels/panel-shell.css
@@ -0,0 +1,121 @@
+/* Panel component shells */
+.panel {
+  @apply rounded-lg shadow-sm border overflow-hidden;
+  background-color: var(--surface-base);
+  border-color: var(--border-base);
+  color: var(--text-primary);
+}
+
+.panel-footer-hints {
+  @apply flex items-center justify-center flex-wrap gap-3 text-xs;
+  color: var(--text-muted);
+}
+
+.panel-header {
+  @apply px-4 py-3 border-b;
+  border-color: var(--border-base);
+  background-color: var(--surface-secondary);
+}
+
+.panel-title {
+  @apply text-base font-semibold;
+  color: var(--text-primary);
+}
+
+.panel-subtitle {
+  @apply text-xs mt-0.5;
+  color: var(--text-muted);
+}
+
+.panel-body {
+  @apply p-4;
+  background-color: var(--surface-base);
+}
+
+.panel-section {
+  @apply border-t;
+  border-color: var(--border-base);
+}
+
+.panel-section-header {
+  @apply w-full px-4 py-3 flex items-center justify-center transition-colors cursor-pointer gap-2;
+  background-color: var(--surface-secondary);
+}
+
+.panel-section-header:hover {
+  background-color: var(--surface-hover);
+}
+
+.panel-section-content {
+  @apply px-4 py-3 border-t overflow-visible space-y-4 w-full;
+  border-color: var(--border-base);
+  background-color: var(--surface-secondary);
+}
+
+.panel-list {
+  @apply max-h-[400px] overflow-y-auto;
+}
+
+.panel-list--fill {
+  max-height: none;
+  height: 100%;
+}
+
+.panel-list-item {
+  @apply border-b last:border-b-0 transition-colors w-full;
+  border-color: var(--border-base);
+}
+
+.panel-list-item:hover {
+  background-color: var(--surface-hover);
+}
+
+.panel-list-item-highlight {
+  background-color: var(--list-item-highlight-bg) !important;
+  box-shadow: inset 0 0 0 1px var(--list-item-highlight-border);
+}
+
+.panel-list-item-content {
+  @apply flex-1 text-left px-4 py-3 flex items-center justify-between gap-3 outline-none transition-colors w-full;
+}
+
+.panel-list-item-content:hover {
+  background-color: transparent;
+}
+
+.panel-list-item-content:disabled {
+  opacity: 0.6;
+}
+
+.panel-list-item button:disabled {
+  cursor: not-allowed;
+}
+
+.panel-list-item-disabled {
+  opacity: 0.6;
+}
+
+.panel-empty-state {
+  @apply p-6 text-center;
+}
+
+.panel-empty-state-icon {
+  @apply text-gray-400 dark:text-gray-600 mb-2;
+  color: var(--text-muted);
+}
+
+.panel-empty-state-title {
+  @apply font-medium text-sm mb-1;
+  color: var(--text-secondary);
+}
+
+.panel-empty-state-description {
+  @apply text-xs;
+  color: var(--text-muted);
+}
+
+.panel-footer {
+  @apply px-4 py-3 border-t;
+  border-color: var(--border-base);
+  background-color: var(--surface-secondary);
+}