@k2b/ui 0.32.0 → 0.34.0

package/dist/types/surfaces/ResourceCard.d.ts

@@ -1,9 +1,12 @@
 import { type JSX } from "solid-js";
+import type { LinkCardColor } from "./LinkCard";
 /**
  * What a card can show of the element it stands for: the element itself, a placeholder while it is being looked up, or
  * why it cannot be shown.
  */
 export type ResourceCardState = "ok" | "loading" | "no_access" | "deleted" | "unavailable";
+/** The icon chip's colour, from the same palette as `LinkCard`. */
+export type ResourceCardColor = LinkCardColor;
 export type ResourceCardProps = {
     /** Defaults to `"ok"`. Every state has the same size, so a card that changes state moves nothing around it. */
     state?: ResourceCardState;
@@ -11,6 +14,12 @@ export type ResourceCardProps = {
     title?: string;
     /** Icon class of the element's kind, for example `ti ti-notebook`. Shown only in state `"ok"`. */
     icon?: string;
+    /** Colour of the icon chip, usually one per kind of element. Without it the chip stays neutral. Only in state `"ok"`. */
+    color?: ResourceCardColor;
+    /** One line above the title: what and where the element is, for example "Task in IT planning · due 30 Oct". Only in state `"ok"`. */
+    context?: string;
+    /** The element's current state as a short label, for example "Open", shown at the end. Only in state `"ok"`. */
+    status?: string;
     /** What the element belongs to, for example the application or service. Shown only in state `"ok"`. */
     source?: string;
     /** Where the element lives within its source, for example a folder or a project. Shown only in state `"ok"`. */

package/dist/types/surfaces/index.d.ts

@@ -4,6 +4,8 @@ export type { AvatarStackPerson, AvatarStackProps } from "./AvatarStack";
 export { AvatarStack } from "./AvatarStack";
 export type { DescriptionListItem, DescriptionListProps } from "./DescriptionList";
 export { DescriptionList } from "./DescriptionList";
+export type { DotStripProps, DotStripTone } from "./DotStrip";
+export { DotStrip } from "./DotStrip";
 export type { LinkCardColor, LinkCardProps } from "./LinkCard";
 export { LinkCard } from "./LinkCard";
 export type { NotFoundStateAction, NotFoundStateProps } from "./NotFoundState";
@@ -18,7 +20,8 @@ export type { ProgressBarProps, ProgressBarTone } from "./ProgressBar";
 export { ProgressBar } from "./ProgressBar";
 export type { ProgressRingProps, ProgressRingTone } from "./ProgressRing";
 export { ProgressRing } from "./ProgressRing";
-export type { ResourceCardProps, ResourceCardState } from "./ResourceCard";
+export { PERSON_COLORS, personColor } from "./person-color";
+export type { ResourceCardColor, ResourceCardProps, ResourceCardState } from "./ResourceCard";
 export { ResourceCard } from "./ResourceCard";
 export { Skeleton, type SkeletonProps } from "./Skeleton";
 export type { StatCellAccent, StatCellProps, StatCellTone } from "./StatCell";

package/dist/types/surfaces/person-color.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The colors that stand for a person: the tint behind avatar initials, a collaborator's cursor, and the marks and
+ * comments a person leaves. The palette leaves out cyan, which means AI, and yellow, which reads as a text highlight.
+ * Several people can share a color, so a person's name always appears next to it.
+ */
+export declare const PERSON_COLORS: readonly ["#3b82f6", "#6366f1", "#8b5cf6", "#c026d3", "#ec4899", "#e11d48", "#f97316", "#16a34a"];
+/** The palette index for a name, the order of the `.k2b-avatar[data-tint]` rules. Surrounding spaces do not count. */
+export declare const personTint: (name: string) => number;
+/** A person's color from their display name, the same wherever Cloud shows that person. */
+export declare const personColor: (name: string) => string;

package/dist/types/surfaces/resource-messages.d.ts

@@ -3,6 +3,8 @@ declare const resourceMessages: import("@k2b/stdlib").Catalog<{
     resourceNoAccess: string;
     resourceDeleted: string;
     resourceUnavailable: string;
+    resourceKind: string;
+    resourceNoAccessHint: string;
 }>;
 export type ResourceMessages = ReturnType<(typeof resourceMessages)["resolve"]>["t"];
 /** Resolved from the inherited render locale. */

package/dist/types/widgets/Widget.d.ts

@@ -1,7 +1,8 @@
 import { type JSX } from "solid-js";
 /**
- * `standard` is 25rem high and `compact` 14rem; `fill` takes the height its container gives it, such as a grid cell,
- * and `content` has no fixed height. Every size except `content` scrolls body content taller than itself.
+ * `standard` is 25rem high and `compact` 14rem; `fill` takes the height and the width its container gives it, such as
+ * a grid cell, and does not size itself from its content; `content` has no fixed height. Every size except `content`
+ * scrolls body content taller than itself.
  */
 export type WidgetSize = "content" | "compact" | "standard" | "fill";
 export type WidgetProps = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@k2b/ui",
-  "version": "0.32.0",
+  "version": "0.34.0",
   "description": "Production-ready components for SolidJS applications.",
   "repository": {
     "type": "git",
@@ -31,6 +31,11 @@
       "browser": "./dist/browser/chart-inspection.js",
       "default": "./dist/browser/chart-inspection.js"
     },
+    "./charts": {
+      "types": "./dist/types/charts.d.ts",
+      "browser": "./dist/browser/charts.js",
+      "default": "./dist/ssr/charts.js"
+    },
     "./package.json": "./package.json",
     "./map-glyphs/*": "./map-glyphs/*"
   },
@@ -65,7 +70,7 @@
   "devDependencies": {
     "@babel/core": "8.0.6",
     "@babel/preset-typescript": "8.0.1",
-    "@k2b/ssr": "0.20.0",
+    "@k2b/ssr": "0.20.1",
     "@types/babel__core": "7.20.5",
     "@types/bun": "1.4.2",
     "axe-core": "4.11.0",