@crewlethq/artifact-kit 0.25.0 → 0.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +17 -15
- package/dist/kit.css +1 -1
- package/dist/kit.js +12 -12
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -7,12 +7,12 @@ The engine serves this package's `dist/` directory, unchanged, from the artifact
|
|
|
7
7
|
## What a page links
|
|
8
8
|
|
|
9
9
|
```html
|
|
10
|
-
<link rel="stylesheet" href="/_crewlet/kit
|
|
11
|
-
<script src="/_crewlet/kit
|
|
12
|
-
<script type="module" src="/_crewlet/kit
|
|
10
|
+
<link rel="stylesheet" href="/_crewlet/kit/<version>/kit.css">
|
|
11
|
+
<script src="/_crewlet/kit/<version>/theme.js"></script>
|
|
12
|
+
<script type="module" src="/_crewlet/kit/<version>/kit.js"></script>
|
|
13
13
|
```
|
|
14
14
|
|
|
15
|
-
Link the first two in the `<head>`, `theme.js` as a classic blocking script, before anything paints. `kit.js` is only needed by a page that draws a sheet. Then write colours, spacing and type with the tokens rather than literal values:
|
|
15
|
+
`<version>` is the exact kit version the page was written against (the engine's authoring guide names the newest it serves); the engine serves every kit version it has shipped, so a published page keeps its own. Link the first two in the `<head>`, `theme.js` as a classic blocking script, before anything paints. `kit.js` is only needed by a page that draws a sheet. Then write colours, spacing and type with the tokens rather than literal values:
|
|
16
16
|
|
|
17
17
|
```css
|
|
18
18
|
.summary {
|
|
@@ -41,7 +41,7 @@ A page draws an editable sheet over one of its datastore collections with `<crew
|
|
|
41
41
|
or from a script:
|
|
42
42
|
|
|
43
43
|
```js
|
|
44
|
-
import { mountSheet } from '/_crewlet/kit
|
|
44
|
+
import { mountSheet } from '/_crewlet/kit/<version>/kit.js';
|
|
45
45
|
|
|
46
46
|
const sheet = mountSheet(document.querySelector('#grid'), { collection: 'vendors' });
|
|
47
47
|
// sheet.update({ ... }) draws it again with changed options; sheet.unmount() takes it down.
|
|
@@ -49,7 +49,7 @@ const sheet = mountSheet(document.querySelector('#grid'), { collection: 'vendors
|
|
|
49
49
|
|
|
50
50
|
A sheet with no columns of its own draws the collection's schema: its hidden columns are left out, its primary column is frozen, and a column type this kit does not know is drawn as read-only text.
|
|
51
51
|
|
|
52
|
-
It is the design system's own `SheetGrid`, the component the dashboard draws a native sheet with, so a page's sheet looks and behaves exactly like it: the keyboard of a spreadsheet (arrows, Enter or F2 to edit, Escape, Tab, Space on a checkbox, typing to replace, Mod+C and Mod+V for ranges, Delete, Mod+Z and Mod+Shift+Z), an edit drawn at once as Saving until the engine confirms it, a refusal said on the cell, a conflict note naming whoever changed a cell under the editor, collaborators' rings and name flags, and the light and dark themes and every palette.
|
|
52
|
+
It is the design system's own `SheetGrid`, the component the dashboard draws a native sheet with, so a page's sheet looks and behaves exactly like it: the keyboard of a spreadsheet (arrows, Enter or F2 to edit, Escape, Tab, Space on a checkbox, typing to replace, Mod+C and Mod+V for ranges, Delete, Mod+Z and Mod+Shift+Z), an edit drawn at once as Saving until the engine confirms it, a refusal said on the cell and held in the sync strip as not saved until the reader dismisses it, a conflict note naming whoever changed a cell under the editor, collaborators' rings and name flags, and the light and dark themes and every palette.
|
|
53
53
|
|
|
54
54
|
### `<crewlet-sheet>` attributes
|
|
55
55
|
|
|
@@ -60,7 +60,7 @@ It is the design system's own `SheetGrid`, the component the dashboard draws a n
|
|
|
60
60
|
| `sort` | The initial order: `score` ascending, `-score` descending. |
|
|
61
61
|
| `frozen` | How many leading columns stay in view while the sheet scrolls sideways. |
|
|
62
62
|
| `readonly` | Draws the sheet read only, whatever the reader may do. |
|
|
63
|
-
| `height` | The
|
|
63
|
+
| `height` | The most the sheet grows to, in px; its rows scroll past it. The sheet is as tall as its rows below that, so no empty space sits under Add row. Without it the sheet stops at `--crewlet-sheet-max-height` (70% of the viewport by default). |
|
|
64
64
|
|
|
65
65
|
### `<crewlet-column>` attributes
|
|
66
66
|
|
|
@@ -78,19 +78,21 @@ It is the design system's own `SheetGrid`, the component the dashboard draws a n
|
|
|
78
78
|
|
|
79
79
|
### What the sheet binds to
|
|
80
80
|
|
|
81
|
-
The sheet talks only to the page's runtime, `window.crewlet` (runtime contract 1.0), so it has exactly the page's capabilities and no more:
|
|
81
|
+
The sheet talks only to the page's runtime, `window.crewlet` (runtime contract 1.0, documented in the engine's `docs/reference/artifact-runtime.md`), so it has exactly the page's capabilities and no more:
|
|
82
82
|
|
|
83
83
|
| Runtime call | What the sheet uses it for | Capability |
|
|
84
84
|
| ------------ | -------------------------- | ---------- |
|
|
85
|
-
| `data.
|
|
86
|
-
| `data.collection(name).
|
|
87
|
-
| `data.collection(name).
|
|
88
|
-
| `data.
|
|
89
|
-
| `
|
|
90
|
-
| `
|
|
85
|
+
| `data.schema()` | The collection's title, and its columns when the page declared none | `db` |
|
|
86
|
+
| `data.collection(name).subscribe(callback, onError)` | The rows, live; a refused subscription is said in place of the grid | `db` |
|
|
87
|
+
| `data.collection(name).merge(id, fields)`, `data.batch().merge(…).commit()` | One edit, and a paste or a cleared range as one all-or-nothing write | `db` |
|
|
88
|
+
| `data.collection(name).set(id, {})` | Add row, under an id the kit mints | `db` |
|
|
89
|
+
| `data.collection(name).delete(id)` | Delete row, from a row's actions, once the reader confirms it | `db` |
|
|
90
|
+
| `data.undo()`, `data.redo()` | Mod+Z and Mod+Shift+Z over the page's own writes; a step somebody overtook is skipped and said | `db` |
|
|
91
|
+
| `presence.roster()`, `presence.subscribe(…)`, `presence.set({ activity, focus })` | Collaborators' rings and flags, the presence stack, and the reader's own cell | `presence` |
|
|
92
|
+
| `identity.me()`, `identity.people()` | A viewer's read-only sheet, and the people a person cell offers and names | `identity` |
|
|
91
93
|
| `connection.subscribe(…)` | Offline in the sync strip | none |
|
|
92
94
|
|
|
93
|
-
A page that did not declare `
|
|
95
|
+
A write resolves with the engine's verdict (`applied`, `pending`, `conflict`, `invalid`, `forbidden`, `quota` or `gone`) and rejects only where nothing was decided (`rate_limited`, `unavailable`, `capability_not_declared`); the sheet says either on the cell it wrote, and a paste is refused whole, never in part. An Add row that fails is said under the sheet with Retry. Delete row (on a row's number, or Shift+F10) asks in the kit's own confirmation, never a browser dialog, which an artifact frame refuses; a delete the engine refuses or the runtime rejects keeps the row and is said on its first cell, held as a write's refusal is. A viewer and a `readonly` sheet are offered neither. A subscription the runtime refuses (`forbidden`, `not_found`, `unavailable`, `capability_not_declared`) is said in place of the grid, never drawn as an empty collection. A page that did not declare `db` gets a sheet that says so rather than an empty grid; without `presence` or `identity` the sheet draws without collaborators or without names. When the kit loads before the runtime, it waits for the runtime's `crewlet:ready` event on `window` (exported as `RUNTIME_READY_EVENT`).
|
|
94
96
|
|
|
95
97
|
## What is in it
|
|
96
98
|
|