@k2b/ui 0.17.0 → 0.19.0

package/dist/types/layout/navigation-model.d.ts

@@ -1,11 +1,25 @@
 import type { LinkNavigateEvent, NavigationScrollMode } from "@k2b/ssr/nav";
 import type { Accessor } from "solid-js";
+import type { IntentTone } from "../semantics";
+/** A status icon at a row's end, such as "running". `label` names it for screen readers and as its tooltip. */
+export type NavigationStatus = {
+    icon: string;
+    label: string;
+    tone?: IntentTone;
+};
 type NavigationEntry = {
     id: string;
     label: string;
     icon?: string;
+    /** Names a meaningful icon for screen readers, such as "Homepage"; without it the icon is decorative. */
+    iconLabel?: string;
     badge?: string | number;
     description?: string;
+    /**
+     * Status icon in a fixed-size slot at the row's end. Set `null` on a row whose status comes and goes: the empty slot
+     * keeps its place, so a status change never rewraps the label or moves the rows below.
+     */
+    status?: NavigationStatus | null;
     active?: boolean;
     disabled?: boolean;
     color?: string;
@@ -33,17 +47,21 @@ export type NavigationItem = NavigationEntry & ({
     action?: string;
     navigation?: "document" | "enhanced";
     scroll?: NavigationScrollMode;
+    section?: never;
 } | {
     action: string;
     href?: never;
     navigation?: never;
     scroll?: never;
+    section?: never;
 } | {
     href?: never;
     action?: never;
     navigation?: never;
     scroll?: never;
     children: readonly NavigationItem[];
+    /** Shows the group as a plain heading over its rows, always open and not indented, instead of a disclosure. */
+    section?: boolean;
 });
 export type NavigationOptions = {
     items: Accessor<readonly NavigationItem[]>;

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

@@ -0,0 +1,31 @@
+import { type JSX } from "solid-js";
+/**
+ * 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";
+export type ResourceCardProps = {
+    /** Defaults to `"ok"`. Every state has the same size, so a card that changes state moves nothing around it. */
+    state?: ResourceCardState;
+    /** The element's name. Shown only in state `"ok"`, as "Untitled" when blank, so a card that opens always has a name. */
+    title?: string;
+    /** Icon class of the element's kind, for example `ti ti-notebook`. Shown only in state `"ok"`. */
+    icon?: 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"`. */
+    location?: string;
+    /** One line of plain text from the element. Shown only in state `"ok"`. */
+    preview?: string;
+    /** Opens the element, for example in a panel. Takes precedence over `href`. Only in state `"ok"`. */
+    onOpen?: () => void;
+    /** Opens the element. Absolute `https` or `http`, or relative. Only in state `"ok"`. */
+    href?: string;
+    class?: string;
+};
+/**
+ * A card for an element that something refers to, such as a task or a document, with the same size in every state.
+ * Outside state `"ok"`, it shows none of the element's fields and opens nothing, whatever the caller passes.
+ */
+export declare function ResourceCard(props: ResourceCardProps): JSX.Element;
+export default ResourceCard;

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

@@ -16,6 +16,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 { ResourceCard } from "./ResourceCard";
 export type { StatCellAccent, StatCellProps, StatCellTone } from "./StatCell";
 export { StatCell } from "./StatCell";
 export type { StatGridAction, StatGridColumns, StatGridProps, StatGridSize, StatGridSurface, } from "./StatGrid";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@k2b/ui",
-  "version": "0.17.0",
+  "version": "0.19.0",
   "description": "Production-ready components for SolidJS applications.",
   "repository": {
     "type": "git",
@@ -45,24 +45,25 @@
   "dependencies": {
     "@fontsource/ibm-plex-mono": "5.3.0",
     "@fontsource/ibm-plex-sans": "5.3.0",
-    "@k2b/stdlib": "0.27.0",
+    "@k2b/stdlib": "0.28.0",
     "@tabler/icons-webfont": "3.48.0",
     "marked": "18.0.14",
     "qr-scanner": "1.4.2"
   },
   "peerDependencies": {
-    "@k2b/ssr": "^0.12.0 || ^0.13.0 || ^0.14.0",
+    "@k2b/ssr": "^0.12.0 || ^0.13.0 || ^0.14.0 || ^0.15.0",
     "solid-js": "^1.9.10"
   },
   "devDependencies": {
     "@babel/core": "8.0.6",
     "@babel/preset-typescript": "8.0.1",
-    "@k2b/ssr": "0.14.0",
+    "@k2b/ssr": "0.15.0",
     "@types/babel__core": "7.20.5",
     "@types/bun": "1.4.2",
     "axe-core": "4.11.0",
     "babel-preset-solid": "1.9.15",
     "bun-plugin-tailwind": "0.1.2",
+    "emojibase-data": "17.0.0",
     "happy-dom": "20.14.5",
     "hono": "4.13.9",
     "playwright": "1.63.0",