@k2b/ui 0.4.1 → 0.5.0

package/dist/types/intl/messages.d.ts

@@ -83,6 +83,7 @@ declare const uiMessages: import("@k2b/stdlib").Catalog<{
         page: number;
     }) => string;
     retry: string;
+    refreshing: string;
     reset: string;
     required: string;
     rename: string;

package/dist/types/layout/AppOverview.d.ts

@@ -3,6 +3,8 @@ export type AppOverviewProps = {
     title: string;
     subtitle?: string;
     icon: string;
+    /** The page's single primary action, such as a create button or menu. */
+    actions?: JSX.Element;
     class?: string;
     children: JSX.Element;
 };
@@ -20,9 +22,14 @@ export type AppOverviewEmptyStateProps = {
     class?: string;
     children?: JSX.Element;
 };
+export type AppOverviewCardsProps = {
+    class?: string;
+    children: JSX.Element;
+};
 type AppOverviewComponent = ((props: AppOverviewProps) => JSX.Element) & {
     Main: (props: AppOverviewPanelProps) => JSX.Element;
     Aside: (props: AppOverviewPanelProps) => JSX.Element;
+    Cards: (props: AppOverviewCardsProps) => JSX.Element;
     EmptyState: (props: AppOverviewEmptyStateProps) => JSX.Element;
 };
 declare const AppOverview: AppOverviewComponent;

package/dist/types/layout/AppWorkspace.d.ts

@@ -34,6 +34,8 @@ export type AppWorkspaceContentProps = {
 export type AppWorkspaceMainProps = {
     children: JSX.Element;
     class?: string;
+    /** `"content"` centers the children as one reading column with the shared page width on large screens. */
+    width?: "full" | "content";
     mobilePane?: string;
     scroll?: boolean;
     scrollFade?: boolean;
@@ -83,6 +85,12 @@ export type AppWorkspaceSidebarProps = {
     label?: string;
     children: JSX.Element;
     class?: string;
+    /**
+     * Below the desktop breakpoint the sidebar is hidden and the host's mobile
+     * navigation takes over. `"stacked"` keeps it as a block above the content
+     * instead, for overviews whose sidebar is the primary object list.
+     */
+    mobile?: "hidden" | "stacked";
     resizable?: boolean;
     resizeShadow?: boolean;
     collapsible?: boolean;
@@ -115,8 +123,12 @@ export type AppWorkspaceSidebarItemTone = "default" | "success" | "danger";
 export type AppWorkspaceSidebarIconActionTone = "default" | "success" | "danger";
 export type AppWorkspaceSidebarItemProps = {
     children: JSX.Element;
-    /** Card rows add a quiet context header above the main label. */
-    variant?: "row" | "card";
+    /**
+     * Card rows add a quiet context header above the main label. Object rows
+     * present one resource with a title, a description line, and stacked
+     * trailing counts; use them for the objects an overview navigates into.
+     */
+    variant?: "row" | "card" | "object";
     context?: JSX.Element;
     contextMeta?: JSX.Element;
     /** Passive second line; keep controls in actions or preview. */

package/dist/types/layout/BottomSheet.d.ts

@@ -2,6 +2,7 @@ import { type JSX } from "solid-js";
 export declare const bottomSheetOptions: {
     panelClassName: string;
     contentClassName: string;
+    initialFocus: (dialog: HTMLDialogElement) => HTMLElement | null;
 };
 export type BottomSheetProps = {
     children: JSX.Element;

package/dist/types/layout/PanelHeader.d.ts

@@ -4,7 +4,7 @@ export type PanelHeaderProps = {
     subtitle?: JSX.Element;
     actions?: JSX.Element;
     as?: "h1" | "h2" | "h3";
-    size?: "sm" | "md";
+    size?: "sm" | "md" | "lg";
     class?: string;
 };
 export declare function PanelHeader(props: PanelHeaderProps): JSX.Element;

package/dist/types/layout/PullToRefresh.d.ts

@@ -0,0 +1,21 @@
+import { type JSX } from "solid-js";
+export type PullToRefreshState = "idle" | "pulling" | "ready" | "refreshing";
+export type PullToRefreshProps = {
+    /** Reloads the wrapped content. The indicator stays busy until the promise settles. */
+    onRefresh: () => Promise<void>;
+    disabled?: boolean;
+    /** Status text announced while refreshing. Defaults to the shared "Refreshing" message. */
+    label?: string;
+    class?: string;
+    /** Exactly one scroll container; the gesture only starts while it is scrolled to the top. */
+    children: JSX.Element;
+};
+/**
+ * Turns a downward pull on a scroll container that is already at its top into
+ * one `onRefresh` call. Touch pulls, mouse or pen drags on non-interactive
+ * space, and trackpad or wheel overscroll share one gesture model. The gesture
+ * is an enhancement: keep a keyboard-reachable refresh (a button or the page
+ * reload) next to it.
+ */
+export declare function PullToRefresh(props: PullToRefreshProps): JSX.Element;
+export default PullToRefresh;

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

@@ -1,4 +1,4 @@
-export type { AppOverviewEmptyStateProps, AppOverviewPanelProps, AppOverviewProps, } from "./AppOverview";
+export type { AppOverviewCardsProps, AppOverviewEmptyStateProps, AppOverviewPanelProps, AppOverviewProps, } from "./AppOverview";
 export { default as AppOverview } from "./AppOverview";
 export type { AppWorkspaceBottomDrawerHeight, AppWorkspaceBottomDrawerProps, AppWorkspaceContentProps, AppWorkspaceDetailProps, AppWorkspaceDetailWidth, AppWorkspaceMainPaneProps, AppWorkspaceMainProps, AppWorkspaceNavTreeItemProps, AppWorkspaceNavTreeProps, AppWorkspaceProps, AppWorkspaceSidebarAccessoryVisibility, AppWorkspaceSidebarBodyProps, AppWorkspaceSidebarIconActionProps, AppWorkspaceSidebarIconActionTone, AppWorkspaceSidebarIconGridProps, AppWorkspaceSidebarItemActionProps, AppWorkspaceSidebarItemActionsProps, AppWorkspaceSidebarItemIconProps, AppWorkspaceSidebarItemLabelProps, AppWorkspaceSidebarItemMetaProps, AppWorkspaceSidebarItemProps, AppWorkspaceSidebarItemTone, AppWorkspaceSidebarProps, AppWorkspaceSidebarSectionProps, AppWorkspaceSidebarVisibility, } from "./AppWorkspace";
 export { default as AppWorkspace } from "./AppWorkspace";
@@ -23,6 +23,8 @@ export type { PanelHeaderProps } from "./PanelHeader";
 export { PanelHeader } from "./PanelHeader";
 export type { PanesItem, PanesProps } from "./Panes";
 export { default as Panes } from "./Panes";
+export type { PullToRefreshProps, PullToRefreshState } from "./PullToRefresh";
+export { default as PullToRefresh } from "./PullToRefresh";
 export type { AddPanesItemOptions, PanesDirection, PanesGroup, PanesIntent, PanesLayout, PanesNode, PanesPath, PanesPathSegment, PanesSide, PanesSplit, } from "./panes-layout";
 export { activatePanesItem, addPanesItem, applyPanesIntent, createPanesLayout, isPanesItemVisible, PANES_LAYOUT_VERSION, parsePanesLayout, reconcilePanesLayout, removePanesItem, resizePanesSplit, } from "./panes-layout";
 export type { ScrollAreaProps } from "./ScrollArea";

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

@@ -1,11 +1,14 @@
-import type { JSX } from "solid-js";
+import { type JSX } from "solid-js";
 export type LinkCardColor = "blue" | "emerald" | "violet" | "orange" | "red" | "amber" | "zinc" | "cyan" | "rose";
 export type LinkCardProps = {
     href: string;
     title: string;
     description: string;
     icon: string;
-    color: LinkCardColor;
+    /** Glyph color. Omit it to use the host application's accent. */
+    color?: LinkCardColor;
+    /** One trailing fact, such as a count or a badge. */
+    meta?: JSX.Element;
 };
 export declare function LinkCard(props: LinkCardProps): JSX.Element;
 export default LinkCard;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@k2b/ui",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "Production-ready components for SolidJS applications.",
   "repository": {
     "type": "git",