@skillcdn/console 0.1.2 → 0.1.4

package/dist/console.css

@@ -192,7 +192,7 @@ svg {
   color: var(--sc-color-text-muted);
 }
 
-/* The shell: a header with the name, the pages and the person; the page below it. */
+/* The shell: a header with the workspace, the project and the person, the tabs under it, and the page below (ADR-0010). */
 
 .sc-shell {
   display: flex;
@@ -244,6 +244,20 @@ svg {
   white-space: nowrap;
 }
 
+.sc-brand-symbol {
+  width: 1.5rem;
+  height: 1.5rem;
+  margin-right: var(--sc-space-2);
+  vertical-align: middle;
+}
+
+.sc-sign-in-wordmark {
+  display: block;
+  max-width: 14rem;
+  height: 2rem;
+  margin-bottom: var(--sc-space-4);
+}
+
 .sc-crumb {
   display: inline-flex;
   align-items: center;
@@ -265,35 +279,151 @@ svg {
   text-overflow: ellipsis;
 }
 
-.sc-nav {
+/* The tabs: the pages of the level the person is on, under the header's first row. */
+
+.sc-tabs {
+  max-width: var(--sc-width-page);
+  margin-inline: auto;
+  padding-inline: var(--sc-space-5);
+  overflow-x: auto;
+  scrollbar-width: none;
+}
+
+.sc-tabs-inner {
   display: flex;
-  flex-wrap: wrap;
   gap: var(--sc-space-1);
 }
 
-.sc-nav-link {
+.sc-tab {
   display: inline-flex;
   align-items: center;
   gap: var(--sc-space-2);
-  padding: var(--sc-space-1) var(--sc-space-3);
-  border-radius: var(--sc-radius-md);
+  padding: var(--sc-space-2) var(--sc-space-3);
+  margin-bottom: -1px;
+  border-bottom: 2px solid transparent;
   color: var(--sc-color-text-muted);
   font-size: var(--sc-text-sm);
   font-weight: var(--sc-weight-medium);
   text-decoration: none;
+  white-space: nowrap;
   transition:
-    background var(--sc-transition),
+    border-color var(--sc-transition),
     color var(--sc-transition);
 }
 
-.sc-nav-link:hover {
-  background: var(--sc-color-bg-inset);
+.sc-tab:hover {
   color: var(--sc-color-text);
 }
 
-.sc-nav-current {
+.sc-tab-current {
+  border-bottom-color: var(--sc-color-accent);
+  color: var(--sc-color-text);
+}
+
+/* The person's menu: a disclosure at the end of the header, with the workspace's pages. */
+
+.sc-menu {
+  position: relative;
+}
+
+.sc-menu-summary {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--sc-space-2);
+  padding: var(--sc-space-1) var(--sc-space-2);
+  border-radius: var(--sc-radius-md);
+  list-style: none;
+  cursor: pointer;
+  transition: background var(--sc-transition);
+}
+
+.sc-menu-summary::-webkit-details-marker {
+  display: none;
+}
+
+.sc-menu-summary:hover,
+.sc-menu[open] > .sc-menu-summary {
   background: var(--sc-color-bg-inset);
+}
+
+.sc-menu-panel {
+  position: absolute;
+  top: calc(100% + var(--sc-space-1));
+  right: 0;
+  z-index: 20;
+  min-width: 14rem;
+  padding: var(--sc-space-2);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-lg);
+  background: var(--sc-color-bg-raised);
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
+}
+
+.sc-menu-who {
+  display: flex;
+  flex-direction: column;
+  padding: var(--sc-space-2) var(--sc-space-3) var(--sc-space-3);
+  margin-bottom: var(--sc-space-1);
+  border-bottom: var(--sc-border);
+  font-size: var(--sc-text-sm);
+  font-weight: var(--sc-weight-medium);
+}
+
+.sc-menu-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.sc-menu-link {
+  display: block;
+  width: 100%;
+  padding: var(--sc-space-2) var(--sc-space-3);
+  border: 0;
+  border-radius: var(--sc-radius-md);
+  background: none;
   color: var(--sc-color-text);
+  font: inherit;
+  font-size: var(--sc-text-sm);
+  text-align: left;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.sc-menu-link:hover {
+  background: var(--sc-color-bg-inset);
+}
+
+.sc-menu-link[aria-current="page"] {
+  color: var(--sc-color-accent);
+  font-weight: var(--sc-weight-medium);
+}
+
+.sc-menu-languages {
+  margin: var(--sc-space-1) 0 0;
+  padding: var(--sc-space-1) 0 0;
+  border: 0;
+  border-top: var(--sc-border);
+}
+
+.sc-menu-heading {
+  display: block;
+  padding: var(--sc-space-1) var(--sc-space-3);
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-xs);
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+.sc-menu-chosen {
+  color: var(--sc-color-accent);
+  font-weight: var(--sc-weight-medium);
+}
+
+.sc-menu-out {
+  margin-top: var(--sc-space-1);
+  border-top: var(--sc-border);
+  border-radius: 0;
+  color: var(--sc-color-text-muted);
 }
 
 .sc-nav-count {
@@ -1188,6 +1318,14 @@ svg {
     padding-inline: var(--sc-space-4);
   }
 
+  .sc-tabs {
+    padding-inline: var(--sc-space-4);
+  }
+
+  .sc-menu-summary .sc-person-login {
+    display: none;
+  }
+
   .sc-main {
     padding-inline: var(--sc-space-4);
   }
@@ -1470,3 +1608,165 @@ svg {
   white-space: pre-wrap;
   word-break: break-all;
 }
+
+/* Documents: a folder's pages, one page with its versions, its links both ways and its files. */
+
+.sc-doc-crumbs {
+  margin-bottom: var(--sc-space-3);
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-doc-crumbs a {
+  color: var(--sc-color-text-muted);
+  text-decoration: none;
+}
+
+.sc-doc-crumbs a:hover {
+  color: var(--sc-color-accent);
+}
+
+.sc-doc-search {
+  display: flex;
+  gap: var(--sc-space-2);
+  margin-bottom: var(--sc-space-4);
+}
+
+.sc-doc-search .sc-input {
+  flex: 1;
+  max-width: 32rem;
+}
+
+.sc-folder {
+  display: grid;
+  gap: var(--sc-space-3);
+}
+
+.sc-folders {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--sc-space-2);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.sc-folder-link {
+  display: inline-block;
+  padding: var(--sc-space-1) var(--sc-space-3);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-md);
+  background: var(--sc-color-bg-subtle);
+  color: var(--sc-color-text);
+  font-family: var(--sc-font-mono);
+  font-size: var(--sc-text-sm);
+  text-decoration: none;
+}
+
+.sc-folder-link:hover {
+  border-color: var(--sc-color-border-strong);
+  color: var(--sc-color-accent);
+}
+
+.sc-docs {
+  display: grid;
+  gap: var(--sc-space-2);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.sc-doc-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: var(--sc-space-2) var(--sc-space-3);
+  padding: var(--sc-space-3) var(--sc-space-4);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-md);
+  background: var(--sc-color-bg-subtle);
+}
+
+.sc-doc-title {
+  color: var(--sc-color-text);
+  font-weight: var(--sc-weight-medium);
+  text-decoration: none;
+}
+
+.sc-doc-title:hover {
+  color: var(--sc-color-accent);
+}
+
+.sc-doc-meta {
+  color: var(--sc-color-text-muted);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-doc-path {
+  font-family: var(--sc-font-mono);
+  font-size: var(--sc-text-xs);
+  color: var(--sc-color-text-faint);
+}
+
+.sc-doc-editor {
+  min-height: 20rem;
+  font-family: var(--sc-font-mono);
+  font-size: var(--sc-text-sm);
+}
+
+.sc-doc-notice {
+  margin-bottom: var(--sc-space-4);
+  padding: var(--sc-space-3) var(--sc-space-4);
+  border: var(--sc-border);
+  border-radius: var(--sc-radius-md);
+  background: var(--sc-color-bg-inset);
+  color: var(--sc-color-text-muted);
+}
+
+.sc-doc-archived .sc-prose {
+  opacity: 0.85;
+}
+
+.sc-doc-attach {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--sc-space-2);
+  margin-top: var(--sc-space-3);
+}
+
+.sc-versions {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.sc-version + .sc-version {
+  margin-top: var(--sc-space-2);
+}
+
+.sc-version-number {
+  display: inline-block;
+  min-width: 2.5rem;
+  font-family: var(--sc-font-mono);
+  font-size: var(--sc-text-sm);
+}
+
+/* A decision as a record: its context, its answer, and what followed. */
+
+.sc-decision-section {
+  margin-top: var(--sc-space-3);
+}
+
+.sc-decision-label {
+  margin: 0 0 var(--sc-space-1);
+  color: var(--sc-color-text-faint);
+  font-size: var(--sc-text-xs);
+  font-weight: var(--sc-weight-medium);
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+.sc-outcome-form {
+  display: grid;
+  gap: var(--sc-space-2);
+}

package/dist/console.d.ts

@@ -5,11 +5,12 @@ import { type DecisionListProps } from "./components/decision-list.js";
 import { type EventFeedProps } from "./components/event-feed.js";
 import { type PeopleListProps } from "./components/people.js";
 import { type MemberListProps, type ProjectListProps } from "./components/projects.js";
-import { type ShellProps } from "./components/shell.js";
+import { type Brand, type ShellProps } from "./components/shell.js";
 import { type SignInProps } from "./components/sign-in.js";
 import { type SkillListProps } from "./components/skills.js";
 import { type TaskViewProps } from "./components/task-view.js";
 import { type TokenListProps } from "./components/tokens.js";
+import { type LanguagePack } from "./i18n/index.js";
 /** The components a custom console may replace, each with the props the default one takes. */
 export interface ConsoleComponents {
     readonly Shell: ComponentType<ShellProps>;
@@ -32,6 +33,10 @@ export interface ConsoleConfig {
     readonly title?: string | undefined;
     /** The components to use in place of the default ones. */
     readonly components?: Partial<ConsoleComponents> | undefined;
+    /** The languages the pages speak, the first being the one spoken when nothing else decides; the package's when left out. */
+    readonly languages?: readonly LanguagePack[] | undefined;
+    /** The marks beside the name (ADR-0013); none shows the name alone. A custom console brings its own. */
+    readonly brand?: Brand | undefined;
     /** The client to talk to the server with; made from `baseUrl` when left out. For tests. */
     readonly client?: ConsoleClient | undefined;
 }

package/dist/console.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"console.d.ts","sourceRoot":"","sources":["../src/console.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAyD,MAAM,OAAO,CAAC;AAElG,OAAO,EAEL,KAAK,aAAa,EAanB,MAAM,UAAU,CAAC;AAClB,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAE/D,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AACrF,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5E,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAEL,KAAK,eAAe,EAGpB,KAAK,gBAAgB,EACtB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExE,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACzE,OAAO,EAAkC,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAkB7F,8FAA8F;AAC9F,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAC1C,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAC1C,QAAQ,CAAC,QAAQ,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;IAChD,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACxD,QAAQ,CAAC,SAAS,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAClD,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IAC5C,QAAQ,CAAC,SAAS,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAClD,QAAQ,CAAC,UAAU,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IACpD,QAAQ,CAAC,SAAS,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAClD,QAAQ,CAAC,WAAW,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACtD,QAAQ,CAAC,UAAU,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,kBAAkB,EAAE,iBAYhC,CAAC;AAEF,MAAM,WAAW,aAAa;IAC5B,wEAAwE;IACxE,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACtC,+FAA+F;IAC/F,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,0DAA0D;IAC1D,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC;IAC7D,2FAA2F;IAC3F,QAAQ,CAAC,MAAM,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;CAC7C;AAED,MAAM,WAAW,UAAU;IACzB,sEAAsE;IACtE,QAAQ,CAAC,GAAG,EAAE,aAAa,CAAC;QAAE,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;KAAE,CAAC,CAAC;IAC3E,mFAAmF;IACnF,KAAK,CAAC,SAAS,EAAE,OAAO,GAAG,MAAM,IAAI,CAAC;CACvC;AA2fD,wBAAgB,aAAa,CAAC,MAAM,GAAE,aAAkB,GAAG,UAAU,CA+JpE"}
+{"version":3,"file":"console.d.ts","sourceRoot":"","sources":["../src/console.tsx"],"names":[],"mappings":"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"}