@overcrow/mcp 0.0.0 → 0.1.0

package/dist/content/examples/notes/manifest.json

@@ -0,0 +1,40 @@
+{
+  "schemaVersion": 1,
+  "apiVersion": 1,
+  "id": "com.playervox.overcrow.notes",
+  "version": "1.0.2",
+  "name": {
+    "en": "Notes",
+    "fr": "Notes"
+  },
+  "sizing": {
+    "fit": "height",
+    "preferred": { "width": 360, "height": 280 },
+    "min": { "width": 280, "height": 48 },
+    "max": { "width": 900, "height": 900 }
+  },
+  "permissions": {
+    "capabilities": ["notes.read", "notes.write"]
+  },
+  "wrapper": {
+    "menu": [
+      {
+        "type": "choice",
+        "id": "sections",
+        "label": { "en": "Show", "fr": "Afficher" },
+        "choices": [
+          { "value": "both", "label": { "en": "Note and checklist", "fr": "Note et liste de tâches" } },
+          { "value": "note", "label": { "en": "Note only", "fr": "Note seule" } },
+          { "value": "checklist", "label": { "en": "Checklist only", "fr": "Liste de tâches seule" } }
+        ],
+        "default": "both"
+      },
+      {
+        "type": "toggle",
+        "id": "move-checked",
+        "label": { "en": "Checked items at the end", "fr": "Éléments cochés à la fin" },
+        "default": true
+      }
+    ]
+  }
+}

package/dist/content/examples/notes/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "overcrow-widget-notes",
+  "version": "1.0.2",
+  "private": true,
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "check": "overcrow-widget check",
+    "package": "overcrow-widget package",
+    "test": "node --test tests/*.test.mjs"
+  },
+  "devDependencies": {
+    "@overcrow/sdk": "1.0.0",
+    "typescript": "6.0.3"
+  }
+}

package/dist/content/examples/notes/style.ocss

@@ -0,0 +1,469 @@
+/* The built-in's layout at 100 %: in Interactive mode a 28 px row (the
+   note selector and three icon buttons), the note list when it is open,
+   then the active note's text and checklist, or its editor; in Passive
+   mode the note's title, text and checklist alone. The wrapper draws the
+   panel; the content keeps the built-in's 10 × 8 px margin. The width is
+   the user's; the height fits the content. */
+.notes {
+  flex-direction: column;
+  row-gap: 6px;
+  width: 100%;
+  /* The manifest's largest height: a note taller than the panel scrolls
+     in it instead of being cut by the wrapper. */
+  max-height: 900px;
+  padding: 8px 10px;
+}
+
+.status {
+  font-family: var(--font-ui);
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--color-text-muted);
+}
+
+.error {
+  font-family: var(--font-ui);
+  font-size: var(--font-size-small);
+  line-height: 14px;
+  color: var(--color-danger);
+}
+
+.hint {
+  font-family: var(--font-ui);
+  font-size: var(--font-size-small);
+  line-height: 14px;
+  color: var(--color-text-muted);
+}
+
+/* The selector takes the free width; the buttons keep the right edge. */
+.toolbar {
+  flex-direction: row;
+  align-items: center;
+  column-gap: 4px;
+  height: var(--control-height);
+  flex-shrink: 0;
+}
+
+.selector {
+  flex-direction: row;
+  align-items: center;
+  column-gap: 6px;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  height: var(--control-height);
+  padding: 0px 8px;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--color-border);
+  background: var(--color-surface-raised);
+}
+
+.selector:hover,
+.selector:focus {
+  background: var(--color-surface-hover);
+}
+
+.selector:disabled {
+  background: transparent;
+}
+
+.selector-label {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  font-family: var(--font-ui);
+  font-size: var(--font-size-button);
+  line-height: 16px;
+  color: var(--color-text);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* The chevron's slot keeps its place without a chevron and with the
+   spinner: the title never moves. */
+.selector-icon {
+  width: 14px;
+  height: 14px;
+  flex-shrink: 0;
+  font-size: 14px;
+  color: var(--color-text-muted);
+}
+
+.none {
+  visibility: hidden;
+}
+
+.spin {
+  animation: notes-spin 900ms linear infinite;
+}
+
+@keyframes notes-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.icon-button {
+  justify-content: center;
+  align-items: center;
+  width: var(--control-height);
+  height: var(--control-height);
+  flex-shrink: 0;
+  border-radius: var(--radius-sm);
+  font-size: 15px;
+  color: var(--color-text-muted);
+}
+
+.icon-button:hover,
+.icon-button:focus {
+  background: var(--color-surface-hover);
+  color: var(--color-text);
+}
+
+.icon-button:disabled {
+  opacity: 0.4;
+}
+
+.small {
+  width: var(--icon-button-size);
+  height: var(--icon-button-size);
+  font-size: 13px;
+}
+
+/* The note list: in the panel, under the selector, at most 220 px. */
+.list {
+  flex-direction: column;
+  row-gap: 2px;
+  max-height: 220px;
+  flex-shrink: 0;
+  padding: 4px;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--color-border);
+  background: var(--color-surface-popover);
+}
+
+.list-row {
+  flex-direction: row;
+  align-items: center;
+  column-gap: 2px;
+  flex-shrink: 0;
+}
+
+.list-item {
+  flex-direction: row;
+  align-items: center;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  height: 26px;
+  padding: 0px 6px;
+  border-radius: 4px;
+}
+
+.list-item:hover,
+.list-item:focus {
+  background: var(--color-surface-hover);
+}
+
+.current {
+  background: var(--color-accent-soft);
+}
+
+.list-label {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  font-family: var(--font-ui);
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--color-text);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* Passive mode: the note's title; Interactive, checklist only: its
+   heading. */
+.heading {
+  flex-direction: row;
+  align-items: center;
+  column-gap: 6px;
+  flex-shrink: 0;
+}
+
+.heading-icon {
+  width: 14px;
+  height: 14px;
+  flex-shrink: 0;
+  font-size: 14px;
+  color: var(--color-text-muted);
+}
+
+.heading-title {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  font-family: var(--font-ui);
+  font-size: var(--font-size-body);
+  font-weight: 700;
+  line-height: 18px;
+  color: var(--color-text);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* The note: scrolled by the host when it is taller than the panel. */
+.preview {
+  flex-direction: column;
+  row-gap: 6px;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0px;
+}
+
+.body {
+  flex-shrink: 0;
+  font-family: var(--font-ui);
+  font-size: var(--font-size-body);
+  line-height: 19px;
+  color: var(--color-text);
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+.item {
+  flex-direction: row;
+  align-items: start;
+  column-gap: 6px;
+  flex-shrink: 0;
+}
+
+.item-check {
+  margin-top: 1px;
+  flex-shrink: 0;
+}
+
+.item-icon {
+  width: 18px;
+  height: 18px;
+  flex-shrink: 0;
+  font-size: 18px;
+  color: var(--color-text-muted);
+}
+
+.item-icon-done {
+  color: var(--color-accent);
+}
+
+.item-text {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  font-family: var(--font-ui);
+  font-size: 12px;
+  line-height: 18px;
+  color: var(--color-text);
+  overflow-wrap: anywhere;
+}
+
+.done {
+  color: var(--color-text-muted);
+  text-decoration: line-through;
+}
+
+/* The editor: its fields scroll, Save and Cancel stay below them. Hidden,
+   the form stays in the view and OverCrow keeps the draft its controls
+   hold. */
+.editor {
+  flex-direction: column;
+  row-gap: 6px;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0px;
+}
+
+.hidden {
+  display: none;
+}
+
+.fields {
+  flex-direction: column;
+  row-gap: 6px;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0px;
+}
+
+.title-field {
+  width: 100%;
+  height: var(--control-height);
+  flex-shrink: 0;
+  padding: 0px 8px;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--color-border);
+  background: var(--color-surface-field);
+  font-family: var(--font-ui);
+  font-size: var(--font-size-body);
+  font-weight: 700;
+  line-height: 18px;
+  color: var(--color-text);
+}
+
+.body-field {
+  width: 100%;
+  flex-shrink: 0;
+  padding: 6px 8px;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--color-border);
+  background: var(--color-surface-field);
+  font-family: var(--font-ui);
+  font-size: 13px;
+  line-height: 17px;
+  color: var(--color-text);
+}
+
+.title-field:focus,
+.body-field:focus {
+  border: 1px solid var(--color-border-strong);
+}
+
+.meta {
+  flex-shrink: 0;
+  font-family: var(--font-ui);
+  font-size: var(--font-size-small);
+  line-height: 14px;
+  color: var(--color-text-muted);
+}
+
+.rows {
+  flex-direction: column;
+  row-gap: 2px;
+  flex-shrink: 0;
+  padding: 4px;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--color-border);
+}
+
+.row {
+  flex-direction: row;
+  align-items: center;
+  column-gap: 6px;
+  min-height: 24px;
+}
+
+.row-check {
+  flex-shrink: 0;
+}
+
+/* A new row has no check until it is saved. */
+.row-new {
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+  font-size: 16px;
+  color: var(--color-text-subtle);
+}
+
+.row-field {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0px;
+  height: 24px;
+  padding: 0px 6px;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  font-family: var(--font-ui);
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--color-text);
+}
+
+.row-field:hover,
+.row-field:focus {
+  border: 1px solid var(--color-border);
+  background: var(--color-surface-field);
+}
+
+/* The last, empty row has no remove button: its place is kept. */
+.row-space {
+  width: var(--icon-button-size);
+  height: var(--icon-button-size);
+  flex-shrink: 0;
+}
+
+.rule {
+  flex-shrink: 0;
+  height: 1px;
+  background: var(--color-border-strong);
+}
+
+.actions {
+  flex-direction: row;
+  column-gap: 6px;
+  flex-shrink: 0;
+}
+
+.action {
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  column-gap: 6px;
+  height: var(--control-height);
+  padding: 0px 12px;
+  flex-shrink: 0;
+  border-radius: var(--radius-md);
+  border: 1px solid var(--color-border-strong);
+  background: var(--color-surface-raised);
+}
+
+.action:hover,
+.action:focus {
+  background: var(--color-surface-hover);
+}
+
+.action-label {
+  font-family: var(--font-ui);
+  font-size: var(--font-size-button);
+  font-weight: 700;
+  line-height: 16px;
+  color: var(--color-text);
+  white-space: nowrap;
+}
+
+.action-icon {
+  width: 14px;
+  height: 14px;
+  font-size: 14px;
+  color: var(--color-text);
+}
+
+.action:disabled .action-label {
+  color: var(--color-text-muted);
+}
+
+/* The one action of the moment: Save with something to save, Add note
+   without any note. */
+.primary {
+  border: 1px solid var(--color-accent);
+  background: var(--color-accent);
+}
+
+.primary:hover,
+.primary:focus {
+  border: 1px solid var(--color-accent-hover);
+  background: var(--color-accent-hover);
+}
+
+.primary .action-label,
+.primary .action-icon {
+  color: var(--color-on-accent);
+}
+
+.add {
+  align-self: start;
+}