@compose-market/theme 0.0.82 → 0.0.90

package/dist/css/index.css

@@ -12,3 +12,7 @@
 @import './app.css';
 @import './agents.css';
 @import './session.css';
+@import './workflows.css';
+@import './market.css';
+@import './mirror.css';
+@import './utilities.css';

package/dist/css/index.d.ts

@@ -12,5 +12,5 @@ export declare function generateRadiusCss(): string;
 export declare const baseTokensCss: string;
 export declare const darkThemeCss: string;
 export declare const lightThemeCss: string;
-export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n@import './effects.css';\n@import './app.css';\n@import './agents.css';\n@import './session.css';\n";
+export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n@import './effects.css';\n@import './app.css';\n@import './agents.css';\n@import './session.css';\n@import './workflows.css';\n@import './market.css';\n@import './mirror.css';\n@import './utilities.css';\n";
 //# sourceMappingURL=index.d.ts.map

package/dist/css/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,kXAepB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,4dAmBpB,CAAC"}

package/dist/css/index.js

@@ -97,5 +97,9 @@ export const indexCss = `/**
 @import './app.css';
 @import './agents.css';
 @import './session.css';
+@import './workflows.css';
+@import './market.css';
+@import './mirror.css';
+@import './utilities.css';
 `;
 //# sourceMappingURL=index.js.map

package/dist/css/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;CAevB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;;;;;CAmBvB,CAAC"}

package/dist/css/market.css

@@ -0,0 +1,273 @@
+
+/* ── Page Header ── */
+.cm-page-header {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  border-bottom: 1px solid hsl(var(--sidebar-border));
+  padding-bottom: 16px;
+}
+
+@media (min-width: 640px) {
+  .cm-page-header {
+    gap: 8px;
+    padding-bottom: 24px;
+  }
+}
+
+.cm-page-header__title-row {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.cm-page-header__title {
+  font-family: var(--font-display), sans-serif;
+  font-weight: 700;
+  color: hsl(var(--foreground));
+  font-size: 20px;
+}
+
+@media (min-width: 640px) {
+  .cm-page-header__title {
+    font-size: 24px;
+  }
+}
+
+.cm-page-header__rule {
+  height: 1px;
+  width: 128px;
+  background: linear-gradient(90deg, hsl(var(--accent)), transparent);
+}
+
+.cm-page-header__subtitle {
+  color: hsl(var(--muted-foreground));
+  font-family: var(--font-mono, monospace);
+  font-size: 12px;
+}
+
+@media (min-width: 640px) {
+  .cm-page-header__subtitle {
+    font-size: 14px;
+  }
+}
+
+/* ── Card Grid ── */
+.cm-card-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 16px;
+}
+
+@media (min-width: 640px) {
+  .cm-card-grid {
+    grid-template-columns: repeat(2, 1fr);
+    gap: 24px;
+  }
+}
+
+@media (min-width: 1024px) {
+  .cm-card-grid {
+    grid-template-columns: repeat(3, 1fr);
+  }
+}
+
+.cm-card-grid--2col {
+  grid-template-columns: 1fr;
+}
+
+@media (min-width: 640px) {
+  .cm-card-grid--2col {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+
+/* ── Stat Cell ── */
+.cm-stat-cell {
+  padding: 6px;
+  background: hsl(var(--background));
+  border: 1px solid hsl(var(--sidebar-border) / 0.5);
+  border-radius: 4px;
+}
+
+@media (min-width: 640px) {
+  .cm-stat-cell {
+    padding: 8px;
+  }
+}
+
+.cm-stat-cell__label {
+  font-size: 8px;
+  color: hsl(var(--muted-foreground));
+  text-transform: uppercase;
+}
+
+@media (min-width: 640px) {
+  .cm-stat-cell__label {
+    font-size: 10px;
+  }
+}
+
+.cm-stat-cell__value-row {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.cm-stat-cell__value {
+  font-family: var(--font-mono, monospace);
+  font-size: 12px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+@media (min-width: 640px) {
+  .cm-stat-cell__value {
+    font-size: 14px;
+  }
+}
+
+/* ── Filter Bar ── */
+.cm-filter-bar {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+@media (min-width: 640px) {
+  .cm-filter-bar {
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+  }
+}
+
+.cm-filter-bar__actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+@media (max-width: 639px) {
+  .cm-filter-bar__actions {
+    justify-content: space-between;
+  }
+}
+
+/* ── Empty State (inline variant) ── */
+.cm-empty-state-inline {
+  text-align: center;
+  padding: 48px 16px;
+}
+
+@media (min-width: 640px) {
+  .cm-empty-state-inline {
+    padding: 80px 16px;
+  }
+}
+
+.cm-empty-state-inline__icon {
+  margin: 0 auto 16px;
+  color: hsl(var(--muted-foreground) / 0.3);
+  width: 40px;
+  height: 40px;
+}
+
+@media (min-width: 640px) {
+  .cm-empty-state-inline__icon {
+    width: 48px;
+    height: 48px;
+  }
+}
+
+.cm-empty-state-inline__text {
+  color: hsl(var(--muted-foreground));
+  font-size: 14px;
+}
+
+@media (min-width: 640px) {
+  .cm-empty-state-inline__text {
+    font-size: 16px;
+  }
+}
+
+.cm-empty-state-inline__hint {
+  color: hsl(var(--muted-foreground) / 0.6);
+  font-size: 10px;
+  margin-top: 8px;
+  padding: 0 16px;
+}
+
+@media (min-width: 640px) {
+  .cm-empty-state-inline__hint {
+    font-size: 12px;
+  }
+}
+
+/* ── Stat Grid (centered, icon-above) ── */
+.cm-stat-grid {
+  display: grid;
+  gap: 6px;
+  font-family: var(--font-mono, monospace);
+}
+
+@media (min-width: 640px) {
+  .cm-stat-grid {
+    gap: 12px;
+  }
+}
+
+.cm-stat-grid--3col {
+  grid-template-columns: repeat(3, 1fr);
+}
+
+.cm-stat-grid--2col {
+  grid-template-columns: repeat(2, 1fr);
+}
+
+.cm-stat-grid__cell {
+  text-align: center;
+  padding: 6px;
+  border-radius: 2px;
+  background: hsl(var(--sidebar-accent));
+}
+
+@media (min-width: 640px) {
+  .cm-stat-grid__cell {
+    padding: 8px;
+  }
+}
+
+.cm-stat-grid__cell-icon {
+  margin: 0 auto 2px;
+  width: 12px;
+  height: 12px;
+}
+
+@media (min-width: 640px) {
+  .cm-stat-grid__cell-icon {
+    width: 14px;
+    height: 14px;
+    margin-bottom: 4px;
+  }
+}
+
+.cm-stat-grid__cell-value {
+  font-weight: 700;
+  color: hsl(var(--foreground));
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.cm-stat-grid__cell-label {
+  font-size: 8px;
+  color: hsl(var(--muted-foreground));
+}
+
+@media (min-width: 640px) {
+  .cm-stat-grid__cell-label {
+    font-size: 10px;
+  }
+}

package/dist/css/mirror.css

@@ -0,0 +1,251 @@
+
+/* ── Mirror Pane ── */
+.cm-mirror-pane {
+  display: flex;
+  flex-direction: column;
+  border: 1px solid hsl(var(--primary) / 0.3);
+  border-radius: 8px;
+  background: hsl(var(--card));
+  overflow: hidden;
+  height: 100%;
+}
+
+/* Toolbar (icon tabs) */
+.cm-mirror-pane__toolbar {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 8px;
+  border-bottom: 1px solid hsl(var(--sidebar-border));
+  background: hsl(var(--background) / 0.3);
+}
+
+.cm-mirror-pane__toolbar-btn {
+  padding: 8px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: hsl(var(--muted-foreground));
+  cursor: pointer;
+  transition: color 0.15s ease, background 0.15s ease;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.cm-mirror-pane__toolbar-btn:hover {
+  color: hsl(var(--foreground));
+  background: hsl(var(--muted));
+}
+
+.cm-mirror-pane__toolbar-btn--active-cyan {
+  background: hsl(var(--primary) / 0.2);
+  color: hsl(var(--primary));
+}
+
+.cm-mirror-pane__toolbar-btn--active-fuchsia {
+  background: hsl(var(--accent) / 0.2);
+  color: hsl(var(--accent));
+}
+
+/* Body */
+.cm-mirror-pane__body {
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  flex: 1;
+  overflow-y: auto;
+}
+
+@media (min-width: 640px) {
+  .cm-mirror-pane__body {
+    padding: 16px;
+  }
+}
+
+@media (min-width: 768px) {
+  .cm-mirror-pane__body {
+    padding: 20px;
+  }
+}
+
+/* Model identity */
+.cm-mirror-pane__model-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+}
+
+.cm-mirror-pane__model-icon-box {
+  padding: 8px;
+  background: hsl(var(--primary) / 0.1);
+  border: 1px solid hsl(var(--primary) / 0.3);
+  border-radius: 8px;
+  flex-shrink: 0;
+}
+
+.cm-mirror-pane__model-copy {
+  min-width: 0;
+  flex: 1;
+}
+
+.cm-mirror-pane__model-name {
+  font-weight: 600;
+  color: hsl(var(--foreground));
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-size: 14px;
+}
+
+@media (min-width: 768px) {
+  .cm-mirror-pane__model-name {
+    font-size: 16px;
+  }
+}
+
+.cm-mirror-pane__model-provider {
+  font-size: 12px;
+  color: hsl(var(--muted-foreground));
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* Section panel */
+.cm-mirror-pane__section {
+  border-radius: 2px;
+  border: 1px solid hsl(var(--sidebar-border));
+  background: hsl(var(--background) / 0.3);
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.cm-mirror-pane__section-label {
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: hsl(var(--muted-foreground));
+}
+
+/* Key-value rows */
+.cm-mirror-pane__kv-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  font-family: var(--font-mono, monospace);
+}
+
+.cm-mirror-pane__kv-label {
+  color: hsl(var(--muted-foreground));
+}
+
+.cm-mirror-pane__kv-value {
+  color: hsl(var(--foreground));
+  text-align: right;
+}
+
+/* Pricing sub-panel */
+.cm-mirror-pane__pricing-block {
+  border-radius: 2px;
+  border: 1px solid hsl(var(--sidebar-border));
+  background: hsl(var(--background) / 0.4);
+  padding: 8px;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.cm-mirror-pane__pricing-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.cm-mirror-pane__pricing-name {
+  font-family: var(--font-mono, monospace);
+  color: hsl(var(--primary));
+}
+
+/* Description block */
+.cm-mirror-pane__description {
+  border-radius: 2px;
+  border: 1px solid hsl(var(--sidebar-border));
+  background: hsl(var(--background) / 0.3);
+  padding: 12px;
+  color: hsl(var(--muted-foreground));
+  line-height: 1.6;
+}
+
+/* Settings: tool group */
+.cm-mirror-pane__tool-group {
+  border-radius: 2px;
+  border: 1px solid hsl(var(--primary) / 0.2);
+  background: hsl(var(--primary) / 0.05);
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.cm-mirror-pane__tool-group--fuchsia {
+  border-color: hsl(var(--accent) / 0.2);
+  background: hsl(var(--accent) / 0.05);
+}
+
+.cm-mirror-pane__tool-group-label {
+  font-size: 12px;
+  font-family: var(--font-mono, monospace);
+}
+
+.cm-mirror-pane__tool-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.cm-mirror-pane__tool-toggle-label {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+}
+
+/* Empty state */
+.cm-mirror-pane__empty {
+  padding: 16px 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  flex: 1;
+  text-align: center;
+}
+
+.cm-mirror-pane__empty-icon {
+  width: 40px;
+  height: 40px;
+  color: hsl(var(--muted-foreground) / 0.4);
+  margin-bottom: 12px;
+}
+
+.cm-mirror-pane__empty-text {
+  font-size: 14px;
+  color: hsl(var(--muted-foreground) / 0.7);
+}
+
+/* No-params state */
+.cm-mirror-pane__no-params {
+  border-radius: 2px;
+  border: 1px solid hsl(var(--sidebar-border));
+  background: hsl(var(--background) / 0.3);
+  padding: 16px;
+  font-size: 14px;
+  color: hsl(var(--muted-foreground));
+}

package/dist/css/utilities.css

@@ -0,0 +1,81 @@
+
+/* ── Marquee ── */
+@keyframes cm-marquee-scroll {
+  0%   { transform: translateX(0); }
+  100% { transform: translateX(-50%); }
+}
+
+@keyframes cm-marquee-scroll-reverse {
+  0%   { transform: translateX(-50%); }
+  100% { transform: translateX(0); }
+}
+
+.cm-marquee-track {
+  animation: cm-marquee-scroll linear infinite;
+  will-change: transform;
+}
+
+.cm-marquee-track-reverse {
+  animation: cm-marquee-scroll-reverse linear infinite;
+  will-change: transform;
+}
+
+/* ── Safe Area ── */
+.cm-safe-area-top    { padding-top: env(safe-area-inset-top); }
+.cm-safe-area-bottom { padding-bottom: env(safe-area-inset-bottom); }
+.cm-safe-area-left   { padding-left: env(safe-area-inset-left); }
+.cm-safe-area-right  { padding-right: env(safe-area-inset-right); }
+
+.cm-safe-area-x {
+  padding-left: env(safe-area-inset-left);
+  padding-right: env(safe-area-inset-right);
+}
+
+.cm-safe-area-y {
+  padding-top: env(safe-area-inset-top);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+/* ── Touch ── */
+.cm-touch-manipulation {
+  touch-action: manipulation;
+}
+
+.cm-no-select {
+  -webkit-user-select: none;
+  user-select: none;
+}
+
+/* ── Scrollbar Hide ── */
+.cm-scrollbar-hide {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+.cm-scrollbar-hide::-webkit-scrollbar {
+  display: none;
+}
+
+/* ── Text Truncation ── */
+.cm-text-truncate {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+}
+
+/* ── Touch Targets (mobile ≤ 768px) ── */
+@media (max-width: 768px) {
+  .cm-touch-target {
+    min-height: 44px;
+    min-width: 44px;
+  }
+}
+
+/* ── Mobile Scrollbar (thinner for ≤ 768px) ── */
+@media (max-width: 768px) {
+  .cm-thin-scrollbar::-webkit-scrollbar {
+    width: 4px;
+    height: 4px;
+  }
+}