@k2b/ui 0.1.0-rc.0 → 0.1.1

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

@@ -0,0 +1,17 @@
+import { type JSX } from "solid-js";
+export type DescriptionListItem = {
+    term: JSX.Element;
+    description: JSX.Element;
+    action?: JSX.Element;
+};
+export type DescriptionListProps = {
+    items: readonly DescriptionListItem[];
+    columns?: 1 | 2 | 3;
+    layout?: "grid" | "rows";
+    size?: "sm" | "md";
+    actionVisibility?: "always" | "progressive";
+    class?: string;
+};
+/** Semantic key-value content with predictable responsive density. */
+export declare function DescriptionList(props: DescriptionListProps): JSX.Element;
+export default DescriptionList;

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

@@ -0,0 +1,11 @@
+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;
+};
+export declare function LinkCard(props: LinkCardProps): JSX.Element;
+export default LinkCard;

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

@@ -0,0 +1,15 @@
+import { type JSX } from "solid-js";
+export type NotFoundStateAction = {
+    label: string;
+    href: string;
+    icon?: string;
+};
+export type NotFoundStateProps = {
+    code?: string;
+    title: string;
+    description?: string;
+    icon?: string;
+    action?: NotFoundStateAction;
+};
+export declare function NotFoundState(props: NotFoundStateProps): JSX.Element;
+export default NotFoundState;

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

@@ -0,0 +1,39 @@
+import { type JSX } from "solid-js";
+import type { IntentTone } from "../semantics";
+export type NoticeTone = Extract<IntentTone, "neutral" | "info" | "success" | "warning" | "danger">;
+type NoticeCardContentProps = {
+    title: JSX.Element;
+    detail?: JSX.Element;
+    children?: JSX.Element;
+} | {
+    title?: never;
+    detail?: never;
+    children: JSX.Element;
+};
+export type NoticeCardProps = Omit<JSX.HTMLAttributes<HTMLElement>, "children" | "class" | "title"> & NoticeCardContentProps & {
+    tone?: NoticeTone;
+    icon?: string | false;
+    class?: string;
+    bodyClass?: string;
+};
+export declare const NOTICE_CARD_CLASSES: {
+    readonly root: "k2b-notice-card";
+    readonly inner: "k2b-notice-card__inner";
+    readonly icon: "k2b-notice-card__icon";
+    readonly content: "k2b-notice-card__content";
+    readonly title: "k2b-notice-card__title";
+    readonly description: "k2b-notice-card__description";
+    readonly body: "k2b-notice-card__body";
+};
+export declare const NOTICE_CARD_ICONS: Readonly<Record<NoticeTone, string>>;
+declare function NoticeCardComponent(props: NoticeCardProps): JSX.Element;
+export type NoticeGridProps<T> = {
+    items: readonly T[];
+    children: (item: T) => JSX.Element;
+    class?: string;
+};
+declare function NoticeGrid<T>(props: NoticeGridProps<T>): JSX.Element;
+export declare const NoticeCard: typeof NoticeCardComponent & {
+    Grid: typeof NoticeGrid;
+};
+export default NoticeCard;

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

@@ -0,0 +1,13 @@
+import { type JSX } from "solid-js";
+export type PaperTag = "div" | "section" | "article" | "a";
+type PaperOwnProps<T extends PaperTag> = {
+    as?: T;
+    children?: JSX.Element;
+    class?: string;
+    elevated?: boolean;
+    interactive?: boolean;
+    tabIndex?: number;
+};
+export type PaperProps<T extends PaperTag = "div"> = PaperOwnProps<T> & Omit<JSX.IntrinsicElements[T], keyof PaperOwnProps<T>>;
+export declare function Paper<T extends PaperTag = "div">(props: PaperProps<T>): JSX.Element;
+export default Paper;

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

@@ -0,0 +1,17 @@
+import { type JSX } from "solid-js";
+export type PlaceholderAlign = "center" | "left";
+export type PlaceholderSurface = "none" | "paper";
+export type PlaceholderState = "empty" | "loading" | "error";
+export type PlaceholderVariant = "compact" | "panel";
+export type PlaceholderProps = {
+    title?: JSX.Element;
+    description?: JSX.Element;
+    icon?: string;
+    action?: JSX.Element;
+    align?: PlaceholderAlign;
+    surface?: PlaceholderSurface;
+    state?: PlaceholderState;
+    variant?: PlaceholderVariant;
+    class?: string;
+};
+export default function Placeholder(props: PlaceholderProps): JSX.Element;

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

@@ -0,0 +1,13 @@
+import type { JSX } from "solid-js";
+import type { IntentTone } from "../semantics";
+export type ProgressBarTone = Extract<IntentTone, "info" | "success" | "danger">;
+export type ProgressBarProps = {
+    value: number;
+    size?: "xs" | "sm" | "md";
+    tone?: ProgressBarTone;
+    showValue?: boolean;
+    label: string;
+    class?: string;
+};
+export declare function ProgressBar(props: ProgressBarProps): JSX.Element;
+export default ProgressBar;

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

@@ -0,0 +1,22 @@
+import { type JSX } from "solid-js";
+import type { AccentColor } from "../semantics";
+import { type StatGridSize } from "./StatGrid";
+export type StatCellTone = AccentColor;
+export type StatCellAccent = {
+    tone: StatCellTone;
+    icon: string;
+    text?: string;
+};
+export type StatCellProps = {
+    label: string;
+    value: string | number | JSX.Element;
+    sub?: string;
+    valueClass?: string;
+    accent?: StatCellAccent;
+    href?: string;
+    title?: string;
+    trend?: readonly number[];
+    size?: StatGridSize;
+};
+export declare function StatCell(props: StatCellProps): JSX.Element;
+export default StatCell;

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

@@ -0,0 +1,21 @@
+import { type JSX } from "solid-js";
+export type StatGridSize = "md" | "sm";
+export type StatGridSurface = "white" | "muted";
+export type StatGridColumns = 1 | 2 | 3 | 4 | 5 | 6;
+export type StatGridAction = {
+    label: string;
+    href: string;
+};
+export type StatGridProps = {
+    children: JSX.Element;
+    title?: string;
+    action?: StatGridAction;
+    columns?: StatGridColumns;
+    size?: StatGridSize;
+    surface?: StatGridSurface;
+    class?: string;
+};
+export declare const useStatGridSize: () => StatGridSize;
+export declare const useStatGridSurface: () => StatGridSurface;
+export declare function StatGrid(props: StatGridProps): JSX.Element;
+export default StatGrid;

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

@@ -0,0 +1,12 @@
+import { type JSX } from "solid-js";
+export type StatusTone = "ok" | "warning" | "error" | "degraded" | "running" | "neutral";
+export type StatusBadgeProps = {
+    tone: StatusTone;
+    label: JSX.Element;
+    icon?: string | null;
+    variant?: "chip" | "dot" | "text";
+    title?: string;
+    class?: string;
+};
+export declare function StatusBadge(props: StatusBadgeProps): JSX.Element;
+export default StatusBadge;

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

@@ -0,0 +1,16 @@
+import { type JSX } from "solid-js";
+export type TagSize = "sm" | "md" | "lg";
+export type TagProps = {
+    children: JSX.Element;
+    color?: string | null;
+    icon?: string;
+    size?: TagSize;
+    selected?: boolean;
+    onRemove?: () => void;
+    removeLabel?: string;
+    disabled?: boolean;
+    class?: string;
+};
+/** Compact label presentation with optional color, icon, and remove action. */
+export declare function Tag(props: TagProps): JSX.Element;
+export default Tag;

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

@@ -0,0 +1,24 @@
+export type { AvatarProps, AvatarSize } from "./Avatar";
+export { Avatar } from "./Avatar";
+export type { DescriptionListItem, DescriptionListProps } from "./DescriptionList";
+export { DescriptionList } from "./DescriptionList";
+export type { LinkCardColor, LinkCardProps } from "./LinkCard";
+export { LinkCard } from "./LinkCard";
+export type { NotFoundStateAction, NotFoundStateProps } from "./NotFoundState";
+export { NotFoundState } from "./NotFoundState";
+export type { NoticeCardProps, NoticeGridProps, NoticeTone } from "./NoticeCard";
+export { NOTICE_CARD_CLASSES, NOTICE_CARD_ICONS, NoticeCard } from "./NoticeCard";
+export type { PaperProps, PaperTag } from "./Paper";
+export { Paper } from "./Paper";
+export type { PlaceholderAlign, PlaceholderProps, PlaceholderState, PlaceholderSurface, PlaceholderVariant, } from "./Placeholder";
+export { default as Placeholder } from "./Placeholder";
+export type { ProgressBarProps, ProgressBarTone } from "./ProgressBar";
+export { ProgressBar } from "./ProgressBar";
+export type { StatCellAccent, StatCellProps, StatCellTone } from "./StatCell";
+export { StatCell } from "./StatCell";
+export type { StatGridAction, StatGridColumns, StatGridProps, StatGridSize, StatGridSurface, } from "./StatGrid";
+export { StatGrid } from "./StatGrid";
+export type { StatusBadgeProps, StatusTone } from "./StatusBadge";
+export { StatusBadge } from "./StatusBadge";
+export type { TagProps, TagSize } from "./Tag";
+export { Tag } from "./Tag";

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

@@ -0,0 +1,12 @@
+import { type JSX } from "solid-js";
+export type WidgetSize = "content" | "compact" | "standard";
+export type WidgetProps = {
+    title: string;
+    icon?: string;
+    href?: string;
+    meta?: string;
+    size?: WidgetSize;
+    children: JSX.Element;
+};
+export declare function Widget(props: WidgetProps): JSX.Element;
+export default Widget;

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

@@ -0,0 +1,11 @@
+import { type JSX } from "solid-js";
+import type { AccentColor } from "../semantics";
+export type WidgetTone = AccentColor;
+export type WidgetHeroProps = {
+    title: string;
+    subtitle?: string;
+    icon?: string;
+    tone?: WidgetTone;
+};
+export declare function WidgetHero(props: WidgetHeroProps): JSX.Element;
+export default WidgetHero;

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

@@ -0,0 +1,17 @@
+import { type JSX } from "solid-js";
+import type { WidgetTone } from "./WidgetHero";
+export type WidgetListItem = {
+    icon?: string;
+    iconTone?: WidgetTone;
+    label: string;
+    sub?: string;
+    meta?: string;
+    href?: string;
+};
+export type WidgetListProps = {
+    items: readonly WidgetListItem[];
+    emptyMessage?: string;
+    grow?: boolean;
+};
+export declare function WidgetList(props: WidgetListProps): JSX.Element;
+export default WidgetList;

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

@@ -0,0 +1,14 @@
+import { type JSX } from "solid-js";
+import type { WidgetTone } from "./WidgetHero";
+export type WidgetPill = {
+    label: string;
+    value: string | number;
+    tone?: WidgetTone;
+    href?: string;
+};
+export type WidgetPillsProps = {
+    pills: readonly WidgetPill[];
+    grow?: boolean;
+};
+export declare function WidgetPills(props: WidgetPillsProps): JSX.Element;
+export default WidgetPills;

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

@@ -0,0 +1,17 @@
+import { type JSX } from "solid-js";
+import type { WidgetTone } from "./WidgetHero";
+export type WidgetStatAccent = {
+    tone: WidgetTone;
+    icon: string;
+    text?: string;
+};
+export type WidgetStatProps = {
+    value: string | number;
+    label: string;
+    sub?: string;
+    valueClass?: string;
+    accent?: WidgetStatAccent;
+    grow?: boolean;
+};
+export declare function WidgetStat(props: WidgetStatProps): JSX.Element;
+export default WidgetStat;

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

@@ -0,0 +1,12 @@
+import { type JSX } from "solid-js";
+import type { IntentTone } from "../semantics";
+export type WidgetStatusTone = Extract<IntentTone, "info" | "success" | "warning" | "danger">;
+export type WidgetStatusProps = {
+    tone: WidgetStatusTone;
+    title: string;
+    message?: string;
+    icon?: string;
+    grow?: boolean;
+};
+export declare function WidgetStatus(props: WidgetStatusProps): JSX.Element;
+export default WidgetStatus;

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

@@ -0,0 +1,6 @@
+export * from "./Widget";
+export * from "./WidgetHero";
+export * from "./WidgetList";
+export * from "./WidgetPills";
+export * from "./WidgetStat";
+export * from "./WidgetStatus";

package/package.json

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