@skillcdn/console 0.1.24 → 0.3.1

package/src/styles/console.css

@@ -875,7 +875,8 @@ table {
     color var(--sc-transition);
 }
 
-.sc-button:disabled {
+.sc-button:disabled,
+.sc-button[aria-disabled="true"] {
   opacity: 0.55;
   cursor: not-allowed;
 }
@@ -1176,6 +1177,7 @@ table {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
   gap: var(--sc-space-4);
+  align-items: start;
 }
 
 .sc-input {
@@ -1573,6 +1575,10 @@ table {
 }
 
 .sc-answer-option {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--sc-space-2);
   font-weight: var(--sc-weight-bold);
 }
 
@@ -1619,6 +1625,17 @@ table {
   accent-color: var(--sc-color-accent);
 }
 
+/* The last choice is the person's own words: the radio, its label, and the line they write on. */
+.sc-option-own {
+  flex-wrap: wrap;
+}
+
+.sc-option-own .sc-input {
+  flex: 1 1 12rem;
+  min-width: 0;
+  min-height: 2rem;
+}
+
 /* The feed: a line per event, newest first. */
 
 .sc-feed {
@@ -3020,7 +3037,7 @@ table {
   }
 }
 
-/* The record of the decisions: a row each. */
+/* The decisions waiting on a person's plate: a row each. */
 .sc-decision-log {
   display: grid;
   gap: var(--sc-space-2);
@@ -3060,18 +3077,109 @@ table {
   color: var(--sc-color-accent);
 }
 
-.sc-decision-row-answer {
-  color: var(--sc-color-success);
+.sc-decision-row-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--sc-space-2);
+  color: var(--sc-color-text-muted);
+}
+
+/* The record of the decisions: a row each, what was asked on the left and what was answered on
+   the right, each with who and when under it; one column where the window is narrow. */
+.sc-decision-record {
+  display: grid;
+  gap: var(--sc-space-2);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.sc-decision-record-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  gap: var(--sc-space-3) var(--sc-space-6);
+  padding: var(--sc-space-3) var(--sc-space-4);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-md);
+  background: var(--sc-color-sheet);
+  font-size: var(--sc-text-sm);
+}
+
+@media (min-width: 40rem) {
+  .sc-decision-record-row {
+    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  }
+}
+
+.sc-decision-record-asked,
+.sc-decision-record-answer {
+  display: grid;
+  align-content: start;
+  gap: var(--sc-space-1);
+  min-width: 0;
+}
+
+.sc-decision-record-question {
   font-weight: var(--sc-weight-medium);
   overflow-wrap: anywhere;
 }
 
-.sc-decision-row-meta {
+.sc-decision-record-question a {
+  color: var(--sc-color-text);
+  text-decoration: none;
+}
+
+.sc-decision-record-question a:hover {
+  color: var(--sc-color-accent);
+}
+
+.sc-decision-record-question .sc-card-number {
+  margin-left: var(--sc-space-2);
+}
+
+.sc-decision-record-chosen {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: var(--sc-space-2);
+  color: var(--sc-color-success);
+  font-weight: var(--sc-weight-medium);
+  overflow-wrap: anywhere;
+}
+
+/* The word given with the answer: a few lines of it here, the whole on the decision's page. */
+.sc-decision-record-note {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  overflow: hidden;
+  color: var(--sc-color-text-muted);
+  overflow-wrap: anywhere;
+}
+
+.sc-decision-record-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--sc-space-1) var(--sc-space-2);
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-xs);
+}
+
+/* The way between the pages of the record: the step before, what is shown of how many, the step after. */
+.sc-pager {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--sc-space-3);
+  margin-top: var(--sc-space-3);
+}
+
+.sc-pager-range {
   color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
 }
 
 /* Who has what: a small table, the late numbers in the danger colour. */
@@ -4023,3 +4131,158 @@ table {
 .sc-goal-view-list {
   display: block;
 }
+
+/* The workspace's settings (ADR-0035): each setting a row, its name beside its value; on the form,
+   its name and its hint beside a control of a bounded width, so that a short choice is not a
+   field as wide as the page. */
+.sc-settings-list {
+  display: grid;
+  margin: 0;
+  font-size: var(--sc-text-sm);
+}
+
+.sc-settings-item {
+  display: grid;
+  grid-template-columns: minmax(8rem, 14rem) minmax(0, 1fr);
+  gap: var(--sc-space-1) var(--sc-space-5);
+  padding: var(--sc-space-3) 0;
+  border-top: var(--sc-border);
+}
+
+.sc-settings-item:first-child {
+  padding-top: 0;
+  border-top: 0;
+}
+
+.sc-settings-item:last-child {
+  padding-bottom: 0;
+}
+
+.sc-settings-item dt {
+  color: var(--sc-color-text-muted);
+}
+
+.sc-settings-item dd {
+  margin: 0;
+}
+
+.sc-settings-note {
+  margin-left: var(--sc-space-3);
+  color: var(--sc-color-text-muted);
+}
+
+.sc-settings-form {
+  gap: 0;
+}
+
+.sc-settings-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(14rem, 20rem);
+  gap: var(--sc-space-3) var(--sc-space-6);
+  align-items: start;
+  padding: var(--sc-space-4) 0;
+  border-top: var(--sc-border);
+}
+
+.sc-settings-row:first-child {
+  padding-top: 0;
+  border-top: 0;
+}
+
+.sc-settings-label {
+  display: block;
+  font-weight: var(--sc-weight-medium);
+}
+
+.sc-settings-hint {
+  max-width: var(--sc-width-prose);
+  margin: var(--sc-space-1) 0 0;
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-settings-control {
+  display: grid;
+  justify-items: start;
+  gap: var(--sc-space-2);
+}
+
+.sc-settings-control .sc-input {
+  width: 100%;
+}
+
+.sc-settings-form .sc-form-actions {
+  padding-top: var(--sc-space-4);
+  border-top: var(--sc-border);
+}
+
+@media (max-width: 40rem) {
+  .sc-settings-item,
+  .sc-settings-row {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
+/* The pack token (ADR-0028, ADR-0036): what it is for first, then the two ways to one side by
+   side, each a card with its words before its controls, and the code shown large while the
+   page waits for the approval. */
+.sc-pack-intro {
+  max-width: var(--sc-width-prose);
+  margin: 0 0 var(--sc-space-5);
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-pack-ways {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
+  gap: var(--sc-space-4);
+}
+
+.sc-pack-way {
+  display: grid;
+  align-content: start;
+  gap: var(--sc-space-3);
+  padding: var(--sc-space-4);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-lg);
+  background: var(--sc-color-sheet);
+}
+
+.sc-pack-way-title {
+  font-size: var(--sc-text-md);
+  font-weight: var(--sc-weight-medium);
+}
+
+.sc-pack-way .sc-field-hint {
+  margin-top: 0;
+}
+
+.sc-pack-connect {
+  display: grid;
+  gap: var(--sc-space-3);
+}
+
+.sc-pack-connect-code {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: var(--sc-space-3);
+}
+
+.sc-pack-code {
+  font-size: var(--sc-text-xl);
+  letter-spacing: 0.12em;
+}
+
+.sc-pack-connect-waiting {
+  display: flex;
+  align-items: center;
+  gap: var(--sc-space-2);
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-pack-actions {
+  margin-top: var(--sc-space-5);
+}

package/src/vocabulary.ts

@@ -97,6 +97,30 @@ export const PROJECT_VISIBILITIES = ["workspace", "private"] as const;
 
 export type ProjectVisibility = (typeof PROJECT_VISIBILITIES)[number];
 
+/**
+ * Who sees whom on the People page and in the pickers (ADR-0035): everyone of the workspace,
+ * or only the people one shares a project with; an administrator always sees everyone.
+ */
+export const PEOPLE_VISIBILITIES = ["everyone", "shared_projects"] as const;
+
+export type PeopleVisibility = (typeof PEOPLE_VISIBILITIES)[number];
+
+/**
+ * The day the calendars begin a week on (ADR-0035): as the language of the pages has it, or
+ * Monday, or Sunday, for the whole workspace.
+ */
+export const WEEK_STARTS = ["auto", "monday", "sunday"] as const;
+
+export type WeekStart = (typeof WEEK_STARTS)[number];
+
+/**
+ * How a private pack's connection ended short of a token (ADR-0036): the code expired before
+ * anyone approved, the person declined at the deployment, or the deployment refused the request.
+ */
+export const PACK_CONNECT_ENDINGS = ["expired", "declined", "refused"] as const;
+
+export type PackConnectEnding = (typeof PACK_CONNECT_ENDINGS)[number];
+
 /** What a run is doing: at work, waiting for a person's decision, or over in one of three ways. */
 export const RUN_STATUSES = ["running", "waiting", "finished", "failed", "abandoned"] as const;
 
@@ -153,6 +177,7 @@ export const EVENT_KINDS = [
   "person.unlisted",
   "person.deactivated",
   "person.reactivated",
+  "workspace.updated",
   "category.created",
   "category.updated",
   "category.removed",