@k2b/ui 0.6.2 → 0.8.0

package/dist/types/content/FileView.d.ts

@@ -39,6 +39,7 @@ export type FileViewProps = {
     crossOrigin?: "anonymous" | "use-credentials";
     /** Native media failed to load; the host can renew a signed URL and offer retry. */
     onPreviewError?: () => void;
+    /** Download actions only; never a preview source, because an attachment response does not render inline. */
     downloadHref?: string | null;
     /** App-specific renderers matched before the built-ins for this instance. */
     renderers?: readonly FileViewRenderer[];

package/dist/types/inputs/FileInputs.d.ts

@@ -5,6 +5,7 @@ export type FileDropzoneProps = FieldProps & {
     accept?: string;
     multiple?: boolean;
     busy?: boolean;
+    /** Full icon class list, for example `"ti ti-photo-plus"`. Defaults to `"ti ti-cloud-upload"`. */
     icon?: string;
     title?: JSX.Element;
     subtitle?: JSX.Element;

package/dist/types/inputs/choice.d.ts

@@ -12,6 +12,18 @@ export type ChoiceOption<T extends string = string> = {
 export type ChoiceOptionsLoader<T extends string = string> = (query: string, signal: AbortSignal) => Promise<readonly ChoiceOption<T>[]>;
 export declare const filterChoiceOptions: <T extends string>(options: readonly ChoiceOption<T>[], query: string) => readonly ChoiceOption<T>[];
 export declare const nextEnabledChoiceIndex: <T extends string>(options: readonly ChoiceOption<T>[], current: number, direction: 1 | -1) => number;
+/**
+ * Counts the leading pills that fit into `available` pixels and measures the
+ * whole row. When not all of them fit, the rest collapse into a summary pill
+ * of width `more`; the first pill always stays and truncates when even it does
+ * not fit. Without a measured width (no layout yet) every pill stays. Half a
+ * pixel of slack absorbs layout rounding, so a row given exactly its own
+ * `rowWidth` always fits.
+ */
+export declare const fitChoicePills: (available: number, widths: readonly number[], gap: number, more: number) => {
+    visible: number;
+    rowWidth: number;
+};
 export declare function createChoiceLoader<T extends string>(loader: () => ChoiceOptionsLoader<T> | undefined, debounceMs: () => number): {
     options: () => readonly ChoiceOption<T>[];
     loading: () => boolean;

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

@@ -334,6 +334,9 @@ declare const uiMessages: import("@k2b/stdlib").Catalog<{
         index: number;
         total: number;
     }) => string;
+    moreSelected: ({ count }: {
+        count: number;
+    }) => string;
     removeNamed: ({ name }: {
         name: string;
     }) => string;

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

@@ -46,11 +46,21 @@ type DetailPanelSectionBaseProps = {
     meta?: JSX.Element;
     class?: string;
 };
+/** One direct secondary command, rendered as a sibling icon button at the end of the row. */
+export type DetailPanelActionSecondary = {
+    /** Icon class, for example `ti ti-trash`. */
+    icon: string;
+    /** Accessible name and tooltip of the icon button. */
+    label: string;
+    onClick: () => void;
+    variant?: "danger";
+};
 type DetailPanelActionBaseProps = {
     title: JSX.Element;
     description?: JSX.Element;
     leading?: JSX.Element;
     trailing?: JSX.Element;
+    secondaryAction?: DetailPanelActionSecondary;
     class?: string;
 };
 type DetailPanelActionMenuProps = {

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

@@ -9,7 +9,7 @@ export { APP_WORKSPACE_DETAIL_DEFAULT, APP_WORKSPACE_DETAIL_MAX, APP_WORKSPACE_D
 export { type BottomSheetProps, bottomSheetOptions, default as BottomSheet } from "./BottomSheet";
 export type { DataPanelProps } from "./DataPanel";
 export { DataPanel } from "./DataPanel";
-export type { DetailPanelActionButtonProps, DetailPanelActionLinkProps, DetailPanelActionProps, DetailPanelBodyProps, DetailPanelGroupProps, DetailPanelHeaderProps, DetailPanelProps, DetailPanelSectionProps, DetailPanelSummaryProps, DetailPanelTone, } from "./DetailPanel";
+export type { DetailPanelActionButtonProps, DetailPanelActionLinkProps, DetailPanelActionProps, DetailPanelActionSecondary, DetailPanelBodyProps, DetailPanelGroupProps, DetailPanelHeaderProps, DetailPanelProps, DetailPanelSectionProps, DetailPanelSummaryProps, DetailPanelTone, } from "./DetailPanel";
 export { default as DetailPanel } from "./DetailPanel";
 export type { DiscussionComposerProps, DiscussionItemProps, DiscussionListProps, DiscussionProps } from "./Discussion";
 export { default as Discussion } from "./Discussion";

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

@@ -2,7 +2,8 @@ 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";
+/** `compact` stacks inside a section, `inline` is one row in a list or sidebar, `panel` fills a work area. */
+export type PlaceholderVariant = "compact" | "inline" | "panel";
 export type PlaceholderProps = {
     title?: JSX.Element;
     description?: JSX.Element;

package/package.json

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