@nordmanai/nif 0.0.0-stage → 0.2.0

package/dist/ui/components/nm-color-picker/nm-color-picker.d.ts

@@ -0,0 +1,15 @@
+/** One colour as a swatch. The colour picker and the theme list both draw it. */
+export declare function NmColorSwatch({ color, shape }: {
+    color: string;
+    shape?: 'square' | 'round';
+}): import("react").JSX.Element;
+/** A colour field. The picker opens in a popover, drawn by NIF tokens around react-colorful. */
+export declare function NmColorPicker({ value, onValueChange, swatches, label, caption, disabled, }: {
+    value: string;
+    onValueChange: (hex: string) => void;
+    swatches?: readonly string[];
+    label?: string;
+    /** A caption above the field, set like the caption of a Field. */
+    caption?: string;
+    disabled?: boolean;
+}): import("react").JSX.Element;

package/dist/ui/components/nm-combobox/nm-combobox.d.ts

@@ -0,0 +1,26 @@
+import type { ReactNode } from 'react';
+import { Combobox as ComboboxPrimitive } from '@base-ui/react/combobox';
+/**
+ * Base UI Combobox, in the shadcn composition, styled by NIF tokens. A select you can search: type to filter the
+ * list, then choose. The list is the same surface as the Dropdown Menu and the Select.
+ */
+export declare function NmCombobox<Value = string>(props: ComboboxPrimitive.Root.Props<Value>): import("react").JSX.Element;
+/** The field you type in, with the button that opens the list. `bare` drops its own box, for use inside a Field. */
+export declare function NmComboboxInput({ className, bare, showClear, ...props }: ComboboxPrimitive.Input.Props & {
+    bare?: boolean;
+    showClear?: boolean;
+}): import("react").JSX.Element;
+/** `anchor` is the element the list lines up with. It defaults to the input. */
+export declare function NmComboboxContent({ className, children, anchor, ...props }: ComboboxPrimitive.Popup.Props & {
+    anchor?: HTMLElement | null;
+}): import("react").JSX.Element;
+/** The items. Give it a function of one item, and it draws the filtered list. */
+export declare function NmComboboxList({ className, ...props }: ComboboxPrimitive.List.Props): import("react").JSX.Element;
+export declare function NmComboboxItem({ className, children, ...props }: ComboboxPrimitive.Item.Props & {
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** What the list says when nothing matches. */
+export declare function NmComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props): import("react").JSX.Element;
+export declare function NmComboboxGroup(props: ComboboxPrimitive.Group.Props): import("react").JSX.Element;
+export declare function NmComboboxLabel({ className, ...props }: ComboboxPrimitive.GroupLabel.Props): import("react").JSX.Element;
+export declare function NmComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props): import("react").JSX.Element;

package/dist/ui/components/nm-command/nm-command.d.ts

@@ -0,0 +1,37 @@
+import { type ComponentProps, type ReactNode } from 'react';
+import { Command as CommandPrimitive } from 'cmdk';
+import { NmDialog } from '../nm-dialog/nm-dialog.tsx';
+/**
+ * Command: search and run. The shadcn Command composition on cmdk, which gives filtering, arrow-key
+ * navigation and the listbox roles. Everything you see is NIF tokens.
+ */
+export declare function NmCommand({ className, ...props }: ComponentProps<typeof CommandPrimitive>): import("react").JSX.Element;
+export declare function NmCommandDialog({ title, description, children, ...props }: Omit<ComponentProps<typeof NmDialog>, 'children'> & {
+    title?: string;
+    description?: string;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The search row: an icon, the field and a clear button once there is text. */
+export declare function NmCommandInput({ className, value, defaultValue, onValueChange, clearLabel, ...props }: ComponentProps<typeof CommandPrimitive.Input> & {
+    clearLabel?: string;
+    defaultValue?: string;
+}): import("react").JSX.Element;
+/** Chips that narrow the list to one kind of result. */
+export declare function NmCommandFilters({ items, value, onValueChange, label, }: {
+    items: readonly {
+        id: string;
+        label: string;
+    }[];
+    value: string;
+    onValueChange: (id: string) => void;
+    label?: string;
+}): import("react").JSX.Element;
+export declare function NmCommandList({ className, ...props }: ComponentProps<typeof CommandPrimitive.List>): import("react").JSX.Element;
+export declare function NmCommandEmpty({ className, ...props }: ComponentProps<typeof CommandPrimitive.Empty>): import("react").JSX.Element;
+export declare function NmCommandLoading({ className, children, ...props }: ComponentProps<typeof CommandPrimitive.Loading>): import("react").JSX.Element;
+export declare function NmCommandGroup({ className, ...props }: ComponentProps<typeof CommandPrimitive.Group>): import("react").JSX.Element;
+export declare function NmCommandSeparator({ className, ...props }: ComponentProps<typeof CommandPrimitive.Separator>): import("react").JSX.Element;
+export declare function NmCommandItem({ className, children, ...props }: ComponentProps<typeof CommandPrimitive.Item>): import("react").JSX.Element;
+/** Shown on the right of an item, and only while the item is selected. */
+export declare function NmCommandItemActions({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+export declare function NmCommandShortcut({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;

package/dist/ui/components/nm-composer/nm-composer.d.ts

@@ -0,0 +1,33 @@
+import { type ReactNode } from 'react';
+import { type NmComposerAttachment, type NmComposerQueued } from '../../config/nm-composer.ts';
+export type NmComposerProps = {
+    value: string;
+    onChange: (value: string) => void;
+    onSend: () => void;
+    /** While the agent answers, the send button becomes Stop. */
+    busy?: boolean;
+    onStop?: () => void;
+    placeholder?: string;
+    /** A card shown above the box, such as a usage warning. It stacks directly over the frame. */
+    notice?: ReactNode;
+    /** Messages waiting for the agent to finish. They stack above the text, oldest first. */
+    queue?: readonly NmComposerQueued[];
+    onEditQueued?: (id: string) => void;
+    onRemoveQueued?: (id: string) => void;
+    attachments?: readonly NmComposerAttachment[];
+    onRemoveAttachment?: (id: string) => void;
+    /** The add button on the left. Omit it to hide the button. */
+    onAdd?: () => void;
+    /** Dictation. Pressed while it listens. */
+    onMic?: () => void;
+    micActive?: boolean;
+    /** Voice mode. It shows while the box is empty. Typing swaps it for Send. */
+    onVoice?: () => void;
+    /** Replaces the add button, for a menu of what to add. Give the trigger the composer button class. */
+    addControl?: ReactNode;
+    /** Controls beside the add button, such as the model selector. */
+    start?: ReactNode;
+    disabled?: boolean;
+    testId?: string;
+};
+export declare function NmComposer(props: NmComposerProps): ReactNode;

package/dist/ui/components/nm-context-menu/nm-context-menu.d.ts

@@ -0,0 +1,9 @@
+import { ContextMenu as ContextMenuPrimitive } from '@base-ui/react/context-menu';
+/**
+ * Base UI Context Menu: the menu that opens on right click or long press. Its items are the dropdown menu parts
+ * (NmDropdownMenuItem, NmDropdownMenuSub, NmDropdownMenuCheckboxItem and the rest).
+ */
+export declare function NmContextMenu(props: ContextMenuPrimitive.Root.Props): import("react").JSX.Element;
+/** The area that answers a right click. */
+export declare function NmContextMenuTrigger({ className, ...props }: ContextMenuPrimitive.Trigger.Props): import("react").JSX.Element;
+export declare function NmContextMenuContent({ className, ...props }: ContextMenuPrimitive.Popup.Props): import("react").JSX.Element;

package/dist/ui/components/nm-date-picker/nm-date-picker.d.ts

@@ -0,0 +1,35 @@
+import type { DateRange } from 'react-day-picker';
+type Common = {
+    placeholder?: string;
+    invalid?: boolean;
+    disabled?: boolean;
+    label?: string;
+    className?: string;
+};
+/** A date field. The calendar opens in a popover, so it follows the theme as everything else does. */
+export declare function NmDatePicker({ value, onValueChange, placeholder, ...rest }: Common & {
+    value?: Date;
+    onValueChange?: (date: Date | undefined) => void;
+}): import("react").JSX.Element;
+export declare function NmDateRangePicker({ value, onValueChange, placeholder, ...rest }: Common & {
+    value?: DateRange;
+    onValueChange?: (range: DateRange | undefined) => void;
+}): import("react").JSX.Element;
+/** A month field. Value is `YYYY-MM`. */
+export declare function NmMonthPicker({ value, onValueChange, placeholder, ...rest }: Common & {
+    value?: string;
+    onValueChange?: (month: string) => void;
+}): import("react").JSX.Element;
+/** A time field in 24 hours. Value is `HH:mm`. */
+export declare function NmTimePicker({ value, onValueChange, placeholder, minuteStep, ...rest }: Common & {
+    value?: string;
+    onValueChange?: (time: string) => void;
+    minuteStep?: number;
+}): import("react").JSX.Element;
+/** A date and a time in one field. */
+export declare function NmDateTimePicker({ value, onValueChange, placeholder, minuteStep, ...rest }: Common & {
+    value?: Date;
+    onValueChange?: (date: Date | undefined) => void;
+    minuteStep?: number;
+}): import("react").JSX.Element;
+export {};

package/dist/ui/components/nm-dialog/nm-dialog.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentProps } from 'react';
+import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';
+/** Base UI Dialog, in the shadcn composition, styled by NIF tokens. */
+export declare function NmDialog(props: DialogPrimitive.Root.Props): import("react").JSX.Element;
+export declare function NmDialogTrigger(props: DialogPrimitive.Trigger.Props): import("react").JSX.Element;
+export declare function NmDialogClose(props: DialogPrimitive.Close.Props): import("react").JSX.Element;
+/** `size="full"` fills the screen, for a whole view. */
+export declare function NmDialogContent({ className, children, size, ...props }: DialogPrimitive.Popup.Props & {
+    size?: 'default' | 'full';
+}): import("react").JSX.Element;
+export declare function NmDialogHeader({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+export declare function NmDialogTitle({ className, ...props }: DialogPrimitive.Title.Props): import("react").JSX.Element;
+export declare function NmDialogDescription({ className, ...props }: DialogPrimitive.Description.Props): import("react").JSX.Element;

package/dist/ui/components/nm-dropdown/nm-dropdown-item.d.ts

@@ -0,0 +1,26 @@
+import type { ReactNode } from 'react';
+import type { NmIconId } from '../../config/nm-icons.ts';
+export type NmDropdownItem = {
+    id: string;
+    label?: string;
+    detail?: string;
+    /** Keyboard hint, such as ⌘K. Display only; the binding lives with the command. */
+    shortcut?: string;
+    icon?: NmIconId;
+    imageSrc?: string;
+    leading?: ReactNode;
+    separator?: boolean;
+    danger?: boolean;
+    disabled?: boolean;
+    checked?: boolean;
+    /** Publish row state. The row stays inactive while busy or live. */
+    mark?: 'idle' | 'busy' | 'live';
+    children?: readonly NmDropdownItem[];
+};
+export declare function isNmDropdownSeparator(item: NmDropdownItem): boolean;
+export declare function nmDropdownSeparator(id: string): NmDropdownItem;
+export declare function dropdownBranchPath(items: readonly NmDropdownItem[], id: string, trail?: readonly string[]): string[] | null;
+/** Hover and click open this branch. They do not close it again. */
+export declare function openDropdownBranch(items: readonly NmDropdownItem[], id: string): string[];
+/** Opening a branch keeps only that branch and its parents. Closing it keeps the parents. */
+export declare function nextExpandedBranches(items: readonly NmDropdownItem[], expanded: readonly string[], id: string): string[];

package/dist/ui/components/nm-dropdown/nm-dropdown-options.d.ts

@@ -0,0 +1,12 @@
+import { type NmDropdownItem } from './nm-dropdown-item';
+export declare function findDropdownItem(items: readonly NmDropdownItem[], selected?: string | null): NmDropdownItem | undefined;
+export declare function NmDropdownOptions({ items, selected, focusedOptionId, expandedIds, selectionMark, onSelect, onOpenBranch, onCloseBranches, }: {
+    items: readonly NmDropdownItem[];
+    selected?: string | null;
+    focusedOptionId?: string | null;
+    expandedIds?: readonly string[];
+    selectionMark?: 'check' | 'none';
+    onSelect: (id: string) => void;
+    onOpenBranch: (id: string) => void;
+    onCloseBranches: () => void;
+}): import("react").JSX.Element;

package/dist/ui/components/nm-dropdown/nm-dropdown-panel.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode, type Ref, type RefObject } from 'react';
+export declare function NmDropdownPanel({ open, placement, className, id, label, panelRef, children, }: {
+    open: boolean;
+    placement: string;
+    className: string;
+    id: string;
+    label: string;
+    panelRef: Ref<HTMLUListElement>;
+    children: ReactNode;
+}): ReactNode;
+export declare function NmDropdownBranch({ open, label, anchorRef, children, }: {
+    open: boolean;
+    label?: string;
+    anchorRef: RefObject<HTMLElement | null>;
+    children: ReactNode;
+}): ReactNode;

package/dist/ui/components/nm-dropdown/nm-dropdown-placement.d.ts

@@ -0,0 +1,55 @@
+import { NM_DROPDOWN_ALIGN } from '../../config/nm-dropdown.ts';
+export type NmDropdownBox = {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+    width: number;
+    height: number;
+};
+export type NmDropdownViewport = {
+    width: number;
+    height: number;
+};
+export type NmDropdownPlacement = {
+    top: number;
+    left: number;
+    maxHeight?: number;
+};
+/** Scroll cap for a panel anchored at `panelTop`; only needed when content exceeds this. */
+export declare function nmDropdownViewportMaxHeight(input: {
+    trigger: Pick<NmDropdownBox, 'top' | 'bottom'>;
+    viewport: NmDropdownViewport;
+    panelTop: number;
+    gap?: number;
+    edgePadding?: number;
+}): number;
+export declare function placeNmDropdownPanel({ trigger, panel, viewport, align, gap, }: {
+    trigger: NmDropdownBox;
+    panel: Pick<NmDropdownBox, 'width' | 'height'>;
+    viewport: NmDropdownViewport;
+    align: (typeof NM_DROPDOWN_ALIGN)[keyof typeof NM_DROPDOWN_ALIGN];
+    gap?: number;
+}): NmDropdownPlacement;
+/** Opens below (or above) a history row; panel width matches the row pill. */
+export declare function placeNmDropdownRowPanel({ row, panel, viewport, gap, }: {
+    row: NmDropdownBox;
+    panel: Pick<NmDropdownBox, 'height'>;
+    viewport: NmDropdownViewport;
+    gap?: number;
+}): NmDropdownPlacement & {
+    width: number;
+};
+/** Places a submenu beside its parent menu, with the same gap as the trigger. */
+export declare function placeNmDropdownSubpanel({ rowTop, rowBottom, panelLeft, panelRight, submenuWidth, submenuHeight, viewportWidth, viewportHeight, gap, }: {
+    rowTop: number;
+    rowBottom: number;
+    panelLeft: number;
+    panelRight: number;
+    submenuWidth: number;
+    submenuHeight: number;
+    viewportWidth: number;
+    viewportHeight: number;
+    gap?: number;
+}): NmDropdownPlacement;
+export declare function dropdownPortalHost(explicit: HTMLElement | null | undefined, trigger: HTMLElement | null): HTMLElement;

package/dist/ui/components/nm-dropdown/nm-dropdown.d.ts

@@ -0,0 +1,31 @@
+import { type ReactNode, type Ref } from 'react';
+import type { NmIconId } from '../../config/nm-icons.ts';
+import { NM_DROPDOWN_ALIGN, NM_DROPDOWN_REVEAL, NM_DROPDOWN_TONE, NM_DROPDOWN_TRIGGER } from '../../config/nm-dropdown.ts';
+import { type NmDropdownItem } from './nm-dropdown-item';
+export type { NmDropdownItem };
+export type NmDropdownProps = {
+    label: string;
+    items?: readonly NmDropdownItem[];
+    selected?: string | null;
+    testId?: string;
+    trigger?: (typeof NM_DROPDOWN_TRIGGER)[keyof typeof NM_DROPDOWN_TRIGGER];
+    tone?: (typeof NM_DROPDOWN_TONE)[keyof typeof NM_DROPDOWN_TONE];
+    align?: (typeof NM_DROPDOWN_ALIGN)[keyof typeof NM_DROPDOWN_ALIGN];
+    icon?: NmIconId;
+    imageSrc?: string;
+    displayLabel?: string;
+    /** Chip/text triggers show only the lead icon; `label` stays for accessibility. */
+    iconOnly?: boolean;
+    portal?: boolean;
+    portalRoot?: HTMLElement | null;
+    disabled?: boolean;
+    /** `hover` hides the trigger until the host with `data-nm-menu` is hovered or focused. */
+    reveal?: (typeof NM_DROPDOWN_REVEAL)[keyof typeof NM_DROPDOWN_REVEAL];
+    open?: boolean;
+    triggerClassName?: string;
+    triggerRef?: Ref<HTMLButtonElement>;
+    onOpenChange?: (open: boolean) => void;
+    onSelect?: (id: string) => void;
+    onBranchExpand?: (id: string) => void;
+};
+export declare function NmDropdown(props: NmDropdownProps): ReactNode;

package/dist/ui/components/nm-dropdown-menu/nm-dropdown-menu.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentProps } from 'react';
+import { Menu as MenuPrimitive } from '@base-ui/react/menu';
+/** Base UI Menu, in the shadcn dropdown-menu composition, styled by NIF tokens. */
+export declare function NmDropdownMenu(props: MenuPrimitive.Root.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuTrigger(props: MenuPrimitive.Trigger.Props): import("react").JSX.Element;
+type PositionProps = Pick<MenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>;
+export declare function NmDropdownMenuContent({ align, alignOffset, side, sideOffset, className, ...props }: MenuPrimitive.Popup.Props & PositionProps): import("react").JSX.Element;
+export declare function NmDropdownMenuGroup(props: MenuPrimitive.Group.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuLabel({ className, ...props }: MenuPrimitive.GroupLabel.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuItem({ className, variant, ...props }: MenuPrimitive.Item.Props & {
+    variant?: 'default' | 'destructive';
+}): import("react").JSX.Element;
+export declare function NmDropdownMenuSub(props: MenuPrimitive.SubmenuRoot.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuSubTrigger({ className, children, ...props }: MenuPrimitive.SubmenuTrigger.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuSubContent({ align, alignOffset, side, sideOffset, className, ...props }: MenuPrimitive.Popup.Props & PositionProps): import("react").JSX.Element;
+export declare function NmDropdownMenuCheckboxItem({ className, children, ...props }: MenuPrimitive.CheckboxItem.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuRadioGroup(props: MenuPrimitive.RadioGroup.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props): import("react").JSX.Element;
+export declare function NmDropdownMenuShortcut({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+/** Two lines in an item: the title, then a quieter description. */
+export declare function NmDropdownMenuText({ title, description }: {
+    title: string;
+    description?: string;
+}): import("react").JSX.Element;
+/** A status dot at the start of an item. */
+export declare function NmDropdownMenuDot({ status }: {
+    status?: 'ok' | 'error';
+}): import("react").JSX.Element;
+export {};

package/dist/ui/components/nm-field/nm-field.d.ts

@@ -0,0 +1,52 @@
+import { type KeyboardEventHandler, type ReactNode, type Ref } from 'react';
+import type { NmIconId } from '../../config/nm-icons.ts';
+import { NM_FIELD_KINDS, NM_FIELD_LAYOUT, type NmFieldKind, type NmFieldLayout, type NmFieldOption } from '../../config/nm-field.ts';
+import { type NmDropdownItem } from '../nm-dropdown/nm-dropdown.tsx';
+export type NmFieldProps = {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    kind?: NmFieldKind;
+    layout?: NmFieldLayout;
+    caption?: string;
+    placeholder?: string;
+    icon?: NmIconId;
+    /** Mark shown inside the field, before the value. */
+    leading?: ReactNode;
+    leadingSize?: 'mark' | 'face';
+    /** Keeps the value in the primary text color when the field is read-only. */
+    emphasis?: boolean;
+    trailing?: ReactNode;
+    /** Ellipsis menu. Hidden until the field is hovered or focused. */
+    menuItems?: readonly NmDropdownItem[];
+    menuLabel?: string;
+    onMenuSelect?: (id: string) => void;
+    options?: readonly NmFieldOption[];
+    searchPlaceholder?: string;
+    /** What a searchable select says when nothing matches. */
+    emptyLabel?: string;
+    searchValue?: string;
+    onSearchChange?: (value: string) => void;
+    onAdd?: () => void;
+    addLabel?: string;
+    addIcon?: NmIconId;
+    testId?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    name?: string;
+    id?: string;
+    autoComplete?: string;
+    minLength?: number;
+    maxLength?: number;
+    className?: string;
+    inputRef?: Ref<HTMLInputElement>;
+    describedBy?: string;
+    invalid?: boolean;
+    keyShortcuts?: string;
+    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+    onKeyUp?: KeyboardEventHandler<HTMLInputElement>;
+    onFocus?: () => void;
+    onBlur?: () => void;
+};
+export declare const NmField: import("react").ForwardRefExoticComponent<NmFieldProps & import("react").RefAttributes<HTMLDivElement>>;
+export { NM_FIELD_KINDS, NM_FIELD_LAYOUT };

package/dist/ui/components/nm-form-field/nm-form-field.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentProps } from 'react';
+/** The shadcn Field family. NmField is the older all-in-one field. These parts compose any control into a form. */
+export declare function NmFieldSet({ className, ...props }: ComponentProps<'fieldset'>): import("react").JSX.Element;
+export declare function NmFieldLegend({ className, variant, ...props }: ComponentProps<'legend'> & {
+    variant?: 'legend' | 'label';
+}): import("react").JSX.Element;
+export declare function NmFieldGroup({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+export declare function NmFormField({ className, orientation, invalid, disabled, ...props }: ComponentProps<'div'> & {
+    orientation?: 'vertical' | 'horizontal';
+    invalid?: boolean;
+    disabled?: boolean;
+}): import("react").JSX.Element;
+export declare function NmFieldContent({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+export declare function NmFieldLabel({ className, ...props }: ComponentProps<'label'>): import("react").JSX.Element;
+export declare function NmFieldTitle({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+export declare function NmFieldDescription({ className, ...props }: ComponentProps<'p'>): import("react").JSX.Element;
+export declare function NmFieldError({ className, children, ...props }: ComponentProps<'div'>): import("react").JSX.Element | null;
+export declare function NmFieldSeparator({ className, children, ...props }: ComponentProps<'div'>): import("react").JSX.Element;

package/dist/ui/components/nm-gallery/nm-gallery.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentProps, ReactNode } from 'react';
+/** Images, or any media, in a grid. Each item is a button, so choosing one opens it, for example in the side panel. */
+export declare function NmGallery({ className, ...props }: ComponentProps<'ul'>): import("react").JSX.Element;
+export declare function NmGalleryItem({ className, label, selected, children, ...props }: Omit<ComponentProps<'button'>, 'children'> & {
+    label: string;
+    selected?: boolean;
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/ui/components/nm-hover-card/nm-hover-card.d.ts

@@ -0,0 +1,5 @@
+import { PreviewCard as PreviewCardPrimitive } from '@base-ui/react/preview-card';
+/** Base UI Preview Card, in the shadcn hover-card composition, styled by NIF tokens. */
+export declare function NmHoverCard(props: PreviewCardPrimitive.Root.Props): import("react").JSX.Element;
+export declare function NmHoverCardTrigger(props: PreviewCardPrimitive.Trigger.Props): import("react").JSX.Element;
+export declare function NmHoverCardContent({ className, side, sideOffset, align, alignOffset, ...props }: PreviewCardPrimitive.Popup.Props & Pick<PreviewCardPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>): import("react").JSX.Element;

package/dist/ui/components/nm-icon/nm-icon.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+import { type NmIconId } from '../../config/nm-icons.ts';
+export type NmIconProps = {
+    id: NmIconId;
+    className?: string;
+};
+export declare function NmIcon(props: NmIconProps): ReactNode;

package/dist/ui/components/nm-icon/nm-lucide.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+export declare const NM_LUCIDE_FILLED_IDS: Set<string>;
+export declare function hasNmLucide(id: string): boolean;
+export declare function NmLucide({ id, className }: {
+    id: string;
+    className?: string;
+}): ReactNode;

package/dist/ui/components/nm-icon-border/nm-icon-border.d.ts

@@ -0,0 +1,21 @@
+import type { MouseEvent as ReactMouseEvent, ReactNode, Ref } from 'react';
+import type { NmIconId } from '../../config/nm-icons.ts';
+export type NmIconBorderProps = {
+    label: string;
+    icon?: NmIconId;
+    imageSrc?: string;
+    pressed?: boolean;
+    checked?: boolean;
+    disabled?: boolean;
+    ariaDisabled?: boolean;
+    busy?: boolean;
+    expanded?: boolean;
+    popup?: 'listbox';
+    controls?: string;
+    buttonRef?: Ref<HTMLButtonElement>;
+    className?: string;
+    children?: ReactNode;
+    testId?: string;
+    onClick?: (event: ReactMouseEvent<HTMLButtonElement>) => void;
+};
+export declare function NmIconBorder(props: NmIconBorderProps): ReactNode;

package/dist/ui/components/nm-input/nm-input.d.ts

@@ -0,0 +1,5 @@
+import { Input as InputPrimitive } from '@base-ui/react/input';
+/** Base UI Input, in the shadcn composition. Text, email, password, number, search, tel, url, date, time and more. */
+export declare function NmInput({ className, type, ...props }: InputPrimitive.Props & {
+    type?: string;
+}): import("react").JSX.Element;

package/dist/ui/components/nm-input-group/nm-input-group.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentProps } from 'react';
+import { Input as InputPrimitive } from '@base-ui/react/input';
+/** An input with something attached: an icon, a unit, a button. The group draws the frame. */
+export declare function NmInputGroup({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+export declare function NmInputGroupAddon({ className, align, ...props }: ComponentProps<'div'> & {
+    align?: 'inline-start' | 'inline-end';
+}): import("react").JSX.Element;
+export declare function NmInputGroupText({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+export declare function NmInputGroupInput({ className, ...props }: InputPrimitive.Props): import("react").JSX.Element;

package/dist/ui/components/nm-label/nm-label.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentProps } from 'react';
+export declare function NmLabel({ className, ...props }: ComponentProps<'label'>): import("react").JSX.Element;

package/dist/ui/components/nm-list-item/nm-list-item.d.ts

@@ -0,0 +1,23 @@
+import type { ReactNode } from 'react';
+import { type NmDropdownItem } from '../nm-dropdown/nm-dropdown.tsx';
+export type NmListItemProps = {
+    title: string;
+    detail?: string;
+    /** Brand mark or face shown beside the title. */
+    leading?: ReactNode;
+    /** `mark` is a 20px app logo. `icon` is a tool glyph. `face` is the companion portrait. */
+    leadingSize?: 'mark' | 'icon' | 'face';
+    /** Connect or disconnect control. Stays visible; it does not collapse into the menu. */
+    action?: ReactNode;
+    menuLabel?: string;
+    /** Ellipsis menu. The shared dropdown, usually edit and delete. */
+    menuItems?: readonly NmDropdownItem[];
+    onMenuSelect?: (id: string) => void;
+    locked?: boolean;
+    /** Lock shown at rest. Hover replaces it with the menu. */
+    resting?: 'lock';
+    onMenu?: () => void;
+    /** Opens the row. The title becomes the control. */
+    onOpen?: () => void;
+};
+export declare function NmListItem(props: NmListItemProps): ReactNode;

package/dist/ui/components/nm-menubar/nm-menubar.d.ts

@@ -0,0 +1,9 @@
+import { Menubar as MenubarPrimitive } from '@base-ui/react/menubar';
+import { Menu as MenuPrimitive } from '@base-ui/react/menu';
+/**
+ * Base UI Menubar, in the shadcn composition. A row of menus that open on click and then on hover.
+ * Each menu is an NmDropdownMenu, so its content and items are the dropdown parts.
+ */
+export declare function NmMenubar({ className, ...props }: MenubarPrimitive.Props): import("react").JSX.Element;
+export declare function NmMenubarMenu(props: MenuPrimitive.Root.Props): import("react").JSX.Element;
+export declare function NmMenubarTrigger({ className, ...props }: MenuPrimitive.Trigger.Props): import("react").JSX.Element;

package/dist/ui/components/nm-message/nm-message-actions.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+export type NmMessageActionsProps = {
+    children: ReactNode;
+    testId?: string;
+    revealOnHover?: boolean;
+};
+export declare function NmMessageActions(props: NmMessageActionsProps): ReactNode;

package/dist/ui/components/nm-message/nm-message-meta.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+export type NmMessageMetaProps = {
+    label: string;
+    testId?: string;
+    expandable?: boolean;
+    expanded?: boolean;
+    onToggle?: () => void;
+    live?: boolean;
+};
+export declare function NmMessageMeta(props: NmMessageMetaProps): ReactNode;

package/dist/ui/components/nm-message/nm-text-shimmer.d.ts

@@ -0,0 +1,4 @@
+import type { ReactNode } from 'react';
+export declare function NmTextShimmer(props: {
+    children: string;
+}): ReactNode;

package/dist/ui/components/nm-message/nm-trace.d.ts

@@ -0,0 +1,58 @@
+import { type ReactNode } from 'react';
+import { type NmTraceGlyphKind, type NmTraceStatus } from '../../config/nm-message.ts';
+export declare function NmTraceGlyph(props: {
+    kind: NmTraceGlyphKind;
+    spin?: boolean;
+}): ReactNode;
+export declare function NmTrace(props: {
+    children: ReactNode;
+    testId?: string;
+    ariaLabel?: string;
+    role?: 'region' | 'group';
+}): ReactNode;
+export declare function NmTraceCollapsible(props: {
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    testId?: string;
+}): ReactNode;
+export declare function NmTraceCollapsibleTrigger(props: {
+    children: ReactNode;
+    ariaLabel?: string;
+    action?: ReactNode;
+    testId?: string;
+}): ReactNode;
+export declare function NmTraceCollapsibleContent(props: {
+    children: ReactNode;
+    keepMounted?: boolean;
+    asList?: boolean;
+    testId?: string;
+}): ReactNode;
+export declare function NmTraceLine(props: {
+    children: ReactNode;
+    status?: NmTraceStatus;
+    as?: 'div' | 'span' | 'li';
+    testId?: string;
+    role?: 'status';
+    ariaLive?: 'polite';
+}): ReactNode;
+export declare function NmTraceIcon(props: {
+    children: ReactNode;
+}): ReactNode;
+export declare function NmTraceTitle(props: {
+    children: ReactNode;
+    shimmer?: boolean;
+}): ReactNode;
+export declare function NmTraceDescription(props: {
+    children: ReactNode;
+    ariaHidden?: boolean;
+    testId?: string;
+}): ReactNode;
+export declare function NmTraceBadges(props: {
+    children: ReactNode;
+    ariaHidden?: boolean;
+}): ReactNode;
+export declare function NmTraceBadge(props: {
+    children: ReactNode;
+}): ReactNode;