@nxgt/material 3.73.0 → 3.74.0

package/dist/lib/components/ui/display/list-tile/partials/list-tile-classes.d.ts

@@ -12,9 +12,11 @@ type ListTileClassesOptions = {
     dense?: boolean;
     /** `divided` only: a 16px inline inset (`px-4`) in place of 4px (`px-1`). */
     inset?: boolean;
+    /** The tile has `content`: it wraps onto a full-width line under the row. */
+    stacked?: boolean;
 };
 /** The classes shared by the tile's three elements (link, button, div). */
-export declare function listTileClasses({ compact, selected, interactive, disabled, className, split, divided, dense, inset, }: ListTileClassesOptions): string;
+export declare function listTileClasses({ compact, selected, interactive, disabled, className, split, divided, dense, inset, stacked, }: ListTileClassesOptions): string;
 /**
  * The row of a tile with `actions` (its link, button or div): it fills the
  * tile's box except for the actions, and a link or button stretches over the

package/dist/lib/components/ui/display/list-tile/partials/list-tile-line.d.ts

@@ -1,3 +1,3 @@
 import { ListTileCommonProps, ListTileLinkOrButtonProps } from '../list-tile.js';
 /** A link, a button or a plain tile, with or without `actions` beside it. */
-export declare function ListTileLine({ title, subtitle, leading, trailing, chips, variant, inset, actions, className, selected, size, href, chevron, linkComponent: ownLink, disabled, onClick, ...props }: ListTileCommonProps & Omit<ListTileLinkOrButtonProps, 'toggle'>): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react").JSX.Element | null | undefined;
+export declare function ListTileLine({ title, subtitle, leading, trailing, chips, content, variant, inset, actions, className, selected, size, href, chevron, linkComponent: ownLink, disabled, onClick, ...props }: ListTileCommonProps & Omit<ListTileLinkOrButtonProps, 'toggle'>): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react").JSX.Element | null | undefined;

package/dist/lib/components/ui/display/list-tile/partials/list-tile-row.d.ts

@@ -2,7 +2,7 @@ import { MouseEventHandler, ReactNode } from 'react';
 import { LinkComponent } from '../../../primitives/link/link-component.js';
 type Attrs = Record<string, unknown>;
 /** What stays on the box of a tile with actions: `data-*` and `style` (the class is its own). */
-export declare function boxProps(props: Attrs): Attrs;
+export declare function boxProps(props: object): Attrs;
 type RenderRowOptions = {
     props: Attrs;
     tileAttrs: Attrs;

package/dist/lib/components/ui/display/seat-ring/types.d.ts

@@ -21,6 +21,12 @@ export type Seat = {
     badge?: ReactNode;
     /** Cannot be picked: `aria-disabled`, still reachable by keyboard. */
     disabled?: boolean;
+    /**
+     * Eliminated: the seat stays visible but dimmed, its name struck through and
+     * its avatar greyed, with the word "Out" (`material.seat-ring.out`) shown and
+     * read as part of the seat's name. It stays pickable unless `disabled`.
+     */
+    out?: boolean;
     /** Nobody sits here: a dashed placeholder, never selectable. */
     empty?: boolean;
 };

package/dist/lib/components/ui/feedback/index.d.ts

@@ -11,6 +11,7 @@ export * from './empty-state/index.js';
 export * from './error-state/index.js';
 export * from './hydrate-loading/index.js';
 export * from './loading-indicator/index.js';
+export * from './moment/index.js';
 export * from './notification-row/index.js';
 export * from './notifications/index.js';
 export * from './page-load-failed/index.js';

package/dist/lib/components/ui/feedback/moment/index.d.ts

@@ -0,0 +1 @@
+export * from './moment.js';

package/dist/lib/components/ui/feedback/moment/moment-body.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+/** What a Moment shows: the picture, the title, the description (or the hint for assistive technology), the action and the close button. */
+export declare function MomentBody({ illustration, title, description, action, closeLabel, }: {
+    illustration?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    closeLabel?: string;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/feedback/moment/moment.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+import { Tone } from '../../tones.js';
+export interface MomentProps {
+    /** Whether the announcement is on screen. */
+    open: boolean;
+    /** Called with `false` when it is dismissed: Escape, a tap, the close button, the action or the end of `duration`. */
+    onOpenChange: (open: boolean) => void;
+    /** Dismisses it by itself after this many milliseconds. Unset: it stays until dismissed. */
+    duration?: number;
+    /** The picture above the title: a scene, a pictogram, an icon. Decorative (hidden from assistive technology): the title says it all. */
+    illustration?: ReactNode;
+    /** What happened, and the dialog's accessible name. */
+    title: ReactNode;
+    /** The line under the title. It sits in a `<p>`: phrasing content only. */
+    description?: ReactNode;
+    /** A button or a link under the text. A click on it dismisses the Moment after its own handler, unless that handler calls `event.preventDefault()`. */
+    action?: ReactNode;
+    /** The colour of the meaning: one of the library's tones, or an app's own. Unset: `neutral`. */
+    tone?: Tone;
+    /** Accessible name of the close button (translated by default). */
+    closeLabel?: string;
+    className?: string;
+}
+/**
+ * A transient full-screen announcement for a dramatic one-off event (a
+ * player is eliminated, a role is revealed). It is a modal dialog named by
+ * its title and described by its description, so a screen reader announces
+ * it as it opens; focus moves into it and goes back to the element that had
+ * it when it closes. Escape, a tap anywhere, the close button and the
+ * `action` dismiss it, and so does `duration`. It fades in and its picture
+ * pops in, none of it under `prefers-reduced-motion`.
+ */
+export declare function Moment({ open, onOpenChange, duration, illustration, title, description, action, tone, closeLabel, className, }: MomentProps): import("react").JSX.Element;

package/dist/lib/components/ui/fields/choice-list/choice-list-control.d.ts

@@ -0,0 +1,17 @@
+import { useMaterialTranslation } from '../../../../i18n/use-material-translation.js';
+import { ArrayError, useRefusedFocus } from './choice-list-focus.js';
+import { defaultRowLabel } from './choice-list-names.js';
+import { ChoiceListFieldProps, ChoiceRow } from './types.js';
+export type ChoiceListControlProps = Pick<ChoiceListFieldProps, 'min' | 'rowLabel' | 'disabled' | 'onChange'> & {
+    selection: NonNullable<ChoiceListFieldProps['selection']>;
+    rows: ChoiceRow[];
+    error: ArrayError | undefined;
+    focus: ReturnType<typeof useRefusedFocus>;
+    /** Sets the ids without dirtying the form; absent, they go through `onChange`. */
+    setIds?: (next: ChoiceRow[]) => void;
+    t: ReturnType<typeof useMaterialTranslation>['t'];
+    label: ReturnType<typeof defaultRowLabel>;
+    props: Omit<ChoiceListFieldProps, 'value' | 'onChange' | 'onAssignIds' | 'error' | 'rowErrors' | 'onBlur'>;
+};
+/** The list itself, with the group and per-row errors of the field. */
+export declare function ChoiceListControl({ rows, error, focus, setIds, onChange, t, label, min, selection, rowLabel, disabled, props, }: ChoiceListControlProps): import("react").JSX.Element;

package/dist/lib/components/ui/fields/choice-list/choice-list-focus.d.ts

@@ -37,6 +37,13 @@ export declare function refusedFocus(handle: FocusHandle, read: {
  */
 export declare function useRefusedFocus(error: () => ArrayError | undefined, blank: () => string): {
     rows: RefObject<readonly ChoiceRow[]>;
+    list: RefObject<Element | null>;
     listRef: (node: Element | null) => void;
     through: (fieldRef: RefCallback<unknown>) => RefCallback<unknown>;
 };
+/**
+ * The handle React Hook Form gets as the `ref` of a row path
+ * (`choices.<i>.text`): `setFocus` and `setError(…, { shouldFocus })` on that
+ * path call its `focus()`, which goes to the row's text input.
+ */
+export declare function rowFocus(list: RefObject<Element | null>, position: number): FocusHandle;