@abot-ai/runtime 1.4.0 → 1.6.0

package/dist/src/web-ui/app/styles/47-config-controls.css

@@ -0,0 +1,178 @@
+/* Config-only controls; Memory and native plugin switches keep their styles. */
+
+.config-workspace-panel .config-dashboard {
+  --config-control: color-mix(in srgb, var(--bg) 60%, var(--panel));
+}
+
+.config-workspace-panel
+  .config-dashboard
+  :is(input:not([type="checkbox"], [type="radio"]), select, textarea) {
+  border-color: var(--config-line);
+  border-radius: 6px;
+  background-color: var(--config-control);
+  color: var(--config-copy);
+}
+
+.config-workspace-panel
+  .config-dashboard
+  :is(input:not([type="checkbox"], [type="radio"]), select) {
+  min-height: 36px;
+  padding: 6px 10px;
+}
+
+.config-workspace-panel .config-dashboard textarea {
+  padding: 8px 10px;
+}
+
+.config-workspace-panel .config-dashboard :is(input, textarea)::placeholder {
+  color: var(--config-faint);
+  opacity: 1;
+}
+
+.config-workspace-panel
+  .config-dashboard
+  :is(input:not([type="checkbox"], [type="radio"]), select, textarea):focus {
+  border-color: var(--accent);
+  outline: 2px solid color-mix(in srgb, var(--accent) 22%, transparent);
+  outline-offset: 1px;
+  background-color: var(--config-control);
+  box-shadow: none;
+}
+
+.config-workspace-panel .config-dashboard :is(input, textarea)[readonly] {
+  background-color: var(--config-surface);
+  color: var(--config-muted);
+}
+
+.config-workspace-panel
+  .config-dashboard
+  :is(input:not([type="checkbox"], [type="radio"]), select, textarea):disabled {
+  background-color: var(--config-surface);
+  color: var(--config-muted);
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+
+.config-workspace-panel
+  .config-dashboard
+  :is(input:not([type="checkbox"], [type="radio"]), select, textarea):is(
+    [aria-invalid="true"],
+    :user-invalid
+  ) {
+  border-color: var(--danger);
+  outline-color: color-mix(in srgb, var(--danger) 22%, transparent);
+}
+
+.config-workspace-panel .config-toggle {
+  align-self: end;
+  justify-self: start;
+  gap: 8px;
+  min-height: 36px;
+  max-width: 100%;
+  padding: 0 8px;
+  border-color: transparent;
+  border-radius: 6px;
+  background: transparent;
+  cursor: pointer;
+}
+
+.config-workspace-panel .config-toggle:has(input:not(:disabled)):hover {
+  background: var(--accent-soft);
+}
+
+.config-workspace-panel .config-toggle input {
+  width: 16px;
+  height: 16px;
+  min-width: 16px;
+  min-height: 16px;
+  accent-color: var(--accent);
+}
+
+.config-workspace-panel .config-toggle > span {
+  color: var(--config-copy);
+  font-size: var(--font-size-md);
+}
+
+.config-workspace-panel .config-toggle:has(input:disabled) {
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+
+.config-workspace-panel .config-model-defaults-title {
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px 12px;
+}
+
+.config-workspace-panel .config-model-defaults-heading {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  min-width: 0;
+}
+
+.config-workspace-panel .config-model-defaults-heading .config-toggle {
+  align-self: center;
+  min-height: 28px;
+  padding-inline: 6px;
+}
+
+.config-workspace-panel .config-model-defaults-title > span {
+  white-space: normal;
+}
+
+.config-workspace-panel .config-calibration-meta,
+.config-workspace-panel .config-calibration-card .config-field-grid {
+  align-items: start;
+}
+
+.config-workspace-panel .config-calibration-meta > label,
+.config-workspace-panel .config-calibration-card .config-field-grid > label {
+  align-content: start;
+}
+
+.config-calibration-section {
+  border-top: 1px solid var(--config-line);
+}
+
+.config-calibration-section-title {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-height: 44px;
+  color: var(--config-copy);
+  font-size: var(--font-size-sm);
+  font-weight: 400;
+  list-style: none;
+  cursor: pointer;
+}
+
+.config-calibration-section-title::-webkit-details-marker {
+  display: none;
+}
+
+.config-calibration-section-title::before {
+  content: "";
+  width: 6px;
+  height: 6px;
+  flex: none;
+  border-right: 1px solid var(--config-muted);
+  border-bottom: 1px solid var(--config-muted);
+  transform: rotate(-45deg);
+}
+
+.config-calibration-section[open] > .config-calibration-section-title::before {
+  transform: rotate(45deg);
+}
+
+.config-calibration-section-title small {
+  margin-inline-start: auto;
+  color: var(--config-muted);
+  font-weight: 400;
+}
+
+.config-calibration-section-body {
+  display: grid;
+  gap: 16px;
+  padding: 4px 0 12px;
+}

package/dist/src/web-ui/app/styles/48-notifications.css

@@ -0,0 +1,103 @@
+.notifications-content {
+  --config-line: var(--line);
+  --config-copy: var(--text);
+  --config-muted: var(--muted);
+  min-width: 0;
+  border: 1px solid var(--line);
+  border-radius: 10px;
+  background: var(--panel);
+  color: var(--text);
+}
+.notifications-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+.notifications-toolbar,
+.notification-toolbar-actions,
+.notification-filters,
+.notification-item-meta,
+.notification-item-actions { display: flex; align-items: center; gap: 12px; }
+.notifications-toolbar { justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; }
+.notification-filters { gap: 4px; }
+.notifications-content button:not(.config-category-tab),
+.notification-item-actions a {
+  min-height: 32px;
+  padding: 5px 8px;
+  border: 1px solid transparent;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--muted);
+  font-size: var(--font-size-sm);
+  font-weight: 400;
+  text-decoration: none;
+  box-shadow: none;
+}
+.notifications-content button:not(.config-category-tab):hover:not(:disabled),
+.notification-item-actions a:hover { background: var(--control-bg); color: var(--text); }
+.notifications-workspace-panel :is(button, a, summary):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.notification-filters button[aria-pressed="true"] { background: var(--control-bg); color: var(--text); }
+.notification-feedback { color: var(--muted); font-size: var(--font-size-sm); line-height: 1.6; }
+.notification-feedback:empty { display: none; }
+.notification-feedback.is-error { color: var(--danger); }
+.notification-empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 230px; padding: 36px 20px; text-align: center; }
+.notification-empty-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 16px; border-radius: 50%; background: var(--accent-soft); color: var(--accent-strong); }
+.notification-empty-icon svg { width: 26px; height: 26px; }
+.notification-empty-state h3 { margin: 0; color: var(--text-strong); font-size: var(--font-size-xl); font-weight: 500; line-height: 1.4; }
+.notification-empty-state p { max-width: 38ch; margin: 8px 0 0; color: var(--muted); font-size: var(--font-size-sm); line-height: 1.6; }
+.notification-list { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
+.notification-item { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: start; gap: 6px 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
+.notification-item.is-unread { border-inline-start: 3px solid var(--accent); padding-inline-start: 12px; background: color-mix(in srgb, var(--accent) 3%, var(--panel)); }
+.notification-kind-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--control-bg); color: var(--muted); }
+.notification-kind-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
+.notification-item.is-unread .notification-kind-icon { background: var(--accent-soft); color: var(--accent-strong); }
+.notification-item-details { min-width: 0; }
+.notification-item-details > summary { display: block; list-style: none; cursor: pointer; border-radius: 3px; }
+.notification-item-details > summary::-webkit-details-marker { display: none; }
+.notification-item-heading { display: flex; align-items: center; gap: 8px; min-width: 0; line-height: 22px; }
+.notification-item-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-strong); font-size: var(--font-size-sm); font-weight: 400; }
+.notification-item.is-unread .notification-item-title { font-weight: 500; }
+.notification-read-state { flex-shrink: 0; color: var(--muted); font-size: var(--font-size-xs); }
+.notification-item.is-unread .notification-read-state { color: var(--accent-strong); }
+.notification-expand-icon { flex: 0 0 12px; width: 12px; height: 12px; fill: none; stroke: var(--muted); stroke-width: 1.4; }
+.notification-item-preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-top: 3px; overflow: hidden; overflow-wrap: anywhere; white-space: pre-line; color: var(--muted); font-size: var(--font-size-sm); line-height: 20px; }
+.notification-item-details[open] .notification-expand-icon { transform: rotate(90deg); }
+.notification-item-details[open] .notification-item-preview { display: none; }
+.notification-item-details[open] .notification-item-title { overflow-wrap: anywhere; white-space: normal; }
+.notification-item-expanded { padding-top: 5px; }
+.notification-item-expanded p { margin: 0; color: var(--muted); line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--font-size-sm); }
+.notification-item-expanded .notification-delivery-error { margin-top: 6px; font-size: var(--font-size-xs); line-height: 1.5; }
+.notification-item-meta { flex-wrap: wrap; gap: 8px; margin-top: 8px; color: var(--muted); font-size: var(--font-size-xs); }
+.notification-item-meta span + span::before { content: "·"; margin-inline-end: 8px; }
+.notification-item-footer { grid-column: 2; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; min-width: 0; }
+.notification-item-footer time { color: var(--muted); font-size: var(--font-size-xs); font-variant-numeric: tabular-nums; }
+.notification-item-actions { flex-shrink: 0; gap: 4px; margin-inline-start: auto; }
+.notification-item-actions :is(button, a) { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-height: 28px; padding: 3px 7px; font-size: var(--font-size-xs); }
+.notification-item-actions a { border-color: var(--line); color: var(--text); }
+.notification-load-more { display: block; margin: 22px auto; }
+.notification-load-more[hidden] { display: none; }
+.notification-settings-body { padding: 0; }
+.notification-setting { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; padding: 5px 0; font-size: var(--font-size-sm); cursor: pointer; }
+.notification-setting strong { font-weight: 500; }
+.notification-setting small { display: block; color: var(--muted); margin-top: 3px; line-height: 1.4; }
+.notification-setting input { width: 16px; height: 16px; min-height: 16px; margin: 0; padding: 0; flex-shrink: 0; accent-color: var(--accent); }
+.notification-computer-status,
+.notification-settings-note { margin: 5px 0; color: var(--muted); font-size: var(--font-size-xs); line-height: 1.5; }
+.notification-kind-settings { padding-top: 8px; margin-top: 8px; border-top: 1px solid var(--line); }
+.notification-kind-settings > p { margin: 0 0 3px; color: var(--muted); font-size: var(--font-size-xs); }
+.notification-kind-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
+.notification-rail-count { position: absolute; top: 3px; left: 24px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9px; background: var(--accent-strong); color: var(--bg); font-size: 10px; line-height: 16px; text-align: center; }
+.notification-rail-count[hidden] { display: none; }
+@media (max-width: 980px) {
+  .notifications-content .config-category-panel { padding: 22px; }
+}
+@media (max-width: 760px) {
+  .notifications-content .config-category-panel { padding: 20px; }
+  .notification-item { grid-template-columns: 28px minmax(0, 1fr); gap: 6px 9px; padding: 10px; }
+  .notification-item.is-unread { padding-inline-start: 8px; }
+  .notification-kind-icon { width: 28px; height: 28px; }
+  .notification-item-heading { gap: 7px; }
+  .notification-item-footer { grid-column: 1 / -1; }
+  .notification-item-actions :is(button, a) { min-height: 32px; }
+  .notification-kind-options { grid-template-columns: minmax(0, 1fr); }
+  .notification-rail-count { left: calc(50% + 2px); }
+}
+@media (max-width: 620px) {
+  .notifications-content { border-radius: 8px; }
+}

package/dist/src/web-ui/app/styles/49-macos-permission.css

@@ -0,0 +1,225 @@
+.mac-permission-dialog {
+  width: min(calc(100vw - 40px), 604px);
+  max-width: none;
+  max-height: calc(100dvh - 40px);
+  margin: auto;
+  padding: 0;
+  border: 1px solid var(--line-strong);
+  border-radius: 10px;
+  color: var(--text);
+  background: var(--panel);
+  box-shadow: 0 28px 110px #0009;
+  overflow: auto;
+}
+.mac-permission-dialog::backdrop {
+  background: rgba(3, 8, 14, 0.73);
+  backdrop-filter: blur(5px);
+}
+.mac-permission-content {
+  padding: 30px 32px 25px;
+}
+.mac-permission-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 22px;
+}
+.mac-permission-icon {
+  width: 40px;
+  height: 40px;
+  display: grid;
+  place-items: center;
+  border: 1px solid #82d4c233;
+  border-radius: 10px;
+  color: var(--accent);
+  background: var(--accent-soft);
+  font-size: 24px;
+}
+.mac-permission-dialog .mac-permission-close {
+  width: 32px;
+  min-height: 32px;
+  padding: 0;
+  border: 0;
+  color: var(--muted);
+  background: transparent;
+  font-size: 23px;
+}
+.mac-permission-eyebrow {
+  margin: 0 0 10px;
+  color: var(--accent);
+  font-size: 10px;
+  font-weight: 600;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+.mac-permission-dialog h2 {
+  margin: 0 0 18px;
+  color: var(--text-strong);
+  font-size: 27px;
+  font-weight: 600;
+  letter-spacing: -0.7px;
+  line-height: 1.2;
+}
+.mac-permission-dialog h2:focus {
+  outline: none;
+}
+.mac-permission-lead {
+  margin: 0 0 9px;
+  font-size: 17px;
+  font-weight: 500;
+}
+.mac-permission-description {
+  margin: 0;
+  color: var(--muted);
+  font-size: 14px;
+  line-height: 1.65;
+}
+.mac-permission-identity {
+  margin: 23px 0 20px;
+  border: 1px solid #304a56;
+  border-radius: 8px;
+  background: #101e28;
+  overflow: hidden;
+}
+.mac-permission-identity > p:first-child {
+  margin: 0;
+  padding: 14px 16px 0;
+  color: var(--text);
+  font-size: 12px;
+  font-weight: 500;
+}
+.mac-permission-path {
+  display: flex;
+  align-items: center;
+  gap: 9px;
+  padding: 11px 12px 14px 16px;
+}
+.mac-permission-path code {
+  flex: 1;
+  min-width: 0;
+  font-family: var(--font-mono);
+  font-size: 12px;
+  line-height: 1.7;
+  color: var(--accent-strong);
+  overflow-wrap: anywhere;
+  user-select: all;
+}
+.mac-permission-path button {
+  flex: none;
+  min-height: 32px;
+  padding: 7px 9px;
+  font-size: 11px;
+}
+.mac-permission-identity .mac-permission-path-note {
+  margin: 0;
+  padding: 10px 16px;
+  border-top: 1px solid #263c47;
+  color: var(--muted);
+  font-size: 11px;
+  line-height: 1.55;
+}
+.mac-permission-usage {
+  margin: 0 0 21px;
+  color: var(--muted);
+  font-size: 13px;
+  line-height: 1.65;
+}
+.mac-permission-usage strong,
+.mac-permission-details strong {
+  color: var(--text);
+  font-weight: 500;
+}
+.mac-permission-details {
+  border-top: 1px solid var(--line);
+  padding-top: 17px;
+}
+.mac-permission-details summary {
+  cursor: pointer;
+  color: var(--text);
+  font-size: 12px;
+}
+.mac-permission-details p {
+  margin: 12px 0 0;
+  color: var(--muted);
+  font-size: 12px;
+  line-height: 1.65;
+}
+.mac-permission-feedback {
+  margin: 12px 0 0;
+  color: var(--accent);
+  font-size: 12px;
+  line-height: 1.5;
+}
+.mac-permission-feedback:empty {
+  display: none;
+}
+.mac-permission-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20px;
+  padding: 19px 32px;
+  background: #0b131c;
+  border-top: 1px solid var(--line);
+}
+.mac-permission-footer > span {
+  color: var(--muted-2);
+  font-size: 11px;
+  line-height: 1.5;
+}
+.mac-permission-footer > div {
+  display: flex;
+  gap: 10px;
+  flex-shrink: 0;
+}
+.mac-permission-footer button {
+  min-height: 40px;
+  padding: 9px 18px;
+  font-size: 13px;
+  font-weight: 500;
+}
+.mac-permission-footer .mac-permission-continue {
+  background: var(--accent);
+  border-color: var(--accent);
+  color: #08251e;
+  font-weight: 600;
+}
+.mac-permission-footer .mac-permission-continue:hover {
+  background: var(--accent-strong);
+  border-color: var(--accent-strong);
+}
+.mac-permission-dialog button:focus-visible,
+.mac-permission-dialog summary:focus-visible,
+.mac-permission-path code:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 3px;
+}
+@media (max-width: 560px) {
+  .mac-permission-dialog {
+    width: calc(100vw - 24px);
+    max-height: calc(100dvh - 24px);
+  }
+  .mac-permission-content {
+    padding: 23px 22px 20px;
+  }
+  .mac-permission-dialog h2 {
+    font-size: 24px;
+  }
+  .mac-permission-lead {
+    font-size: 16px;
+  }
+  .mac-permission-footer {
+    padding: 17px 22px;
+    flex-wrap: wrap;
+    gap: 13px;
+  }
+  .mac-permission-footer > div {
+    margin-left: auto;
+  }
+  .mac-permission-path {
+    align-items: flex-start;
+  }
+  .mac-permission-path code {
+    font-size: 11px;
+  }
+}