@kromatv/sdk 0.1.40-canary.0

package/types/ui/src/components/atoms/text-field/text-field.d.ts

@@ -0,0 +1,50 @@
+import { type ReactNode, type RefObject } from 'react';
+import { type StyleProp, TextInput, type TextInputProps, type TextStyle } from 'react-native';
+import { type BoxProps } from '#ui/components/atoms/box';
+import { type IconName } from '#ui/components/atoms/icon';
+import { type ControlSize } from '#ui/lib/field-shell';
+type TextFieldType = 'text' | 'email' | 'password' | 'url' | 'search' | 'number';
+interface TextFieldProps extends Omit<BoxProps, 'children' | 'ring'> {
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (next: string) => void;
+    type?: TextFieldType;
+    onSubmit?: () => void;
+    /** After the entry takes focus. A shell drawn AROUND this field (see
+     *  <InputGroup>) paints the focus state the entry itself gives up. */
+    onFocus?: () => void;
+    /** After the entry loses focus: the commit point of a save-on-blur field. */
+    onBlur?: () => void;
+    /** The entry itself, for a caller that has to focus it from outside: give it
+     *  a ref and the field uses it instead of its own. */
+    entryRef?: RefObject<TextInput | null>;
+    placeholder?: string;
+    icon?: IconName;
+    trailing?: ReactNode;
+    physicalKeyboard?: boolean;
+    autoFocus?: boolean;
+    /** Explicit override; normally derived from `type`. */
+    keyboardType?: 'default' | 'url' | 'email-address';
+    /** Explicit override; normally derived from `type`. A registration form's
+     *  password field says `new-password` here, or the browser's manager fills
+     *  the CURRENT password into it and never offers to generate one. */
+    autoComplete?: NonNullable<TextInputProps['autoComplete']>;
+    invalid?: boolean;
+    /** A value to read and copy, not to change: the entry still focuses and
+     *  still selects, so a share link can be picked up with the keyboard. */
+    readOnly?: boolean;
+    /** Select the whole value when the entry takes focus, which is what a
+     *  one-shot value (a link, a token) wants: focus it and copy it. */
+    selectOnFocus?: boolean;
+    label?: string;
+    /** The control shell's size. Defaults to the app's (`setEntryDefaults`), so a
+     *  call site states this only when it differs from the rest of the app. */
+    size?: ControlSize;
+    textStyle?: StyleProp<TextStyle>;
+    /** The shell belongs to something else - the well of an <InputGroup>, the row
+     *  of a command palette. See `fieldShell` for what that drops and why. */
+    flat?: boolean;
+}
+declare function TextField({ value: valueProp, defaultValue, onValueChange, type, onSubmit, onFocus, onBlur, entryRef, placeholder, icon, trailing, physicalKeyboard, autoFocus, keyboardType, autoComplete, invalid, readOnly, selectOnFocus, label, size, textStyle, flat, ...box }: Readonly<TextFieldProps>): import("react").JSX.Element;
+export type { TextFieldProps, TextFieldType };
+export { TextField };

package/types/ui/src/components/atoms/watched-badge/index.d.ts

@@ -0,0 +1 @@
+export * from './watched-badge';

package/types/ui/src/components/atoms/watched-badge/watched-badge.d.ts

@@ -0,0 +1,19 @@
+type WatchedCorner = 'top-left' | 'top-right';
+interface WatchedBadgeProps {
+    /** Length of the fold's two legs in px. Defaults to 40. */
+    size?: number;
+    /** Which corner it folds into. Defaults to the top left. */
+    corner?: WatchedCorner;
+}
+/**
+ * A folded corner, the shape the media servers KROMA's viewers arrive from use
+ * for this. It changes the tile's silhouette, so it reads before its colour does
+ * and survives artwork it happens to match.
+ *
+ * It pins ITSELF flush into the corner: a fold that floats inside the tile reads
+ * as a sticker. The surface only has to clip, which every art box already does,
+ * and the fold takes the tile's own rounded corner from that.
+ */
+declare function WatchedBadge({ size, corner }: Readonly<WatchedBadgeProps>): import("react").JSX.Element;
+export type { WatchedBadgeProps, WatchedCorner };
+export { WatchedBadge };

package/types/ui/src/components/atoms/wheel/index.d.ts

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

package/types/ui/src/components/atoms/wheel/wheel.d.ts

@@ -0,0 +1,9 @@
+import { type WheelSpin } from '#ui/lib/wheel-paths';
+interface WheelProps {
+    /** Wheel diameter. */
+    size?: number;
+    spin?: WheelSpin;
+}
+declare function Wheel({ size, spin }: Readonly<WheelProps>): import("react").JSX.Element;
+export type { WheelProps };
+export { Wheel };

package/types/ui/src/components/common/if/if.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+export interface IfProps {
+    /** Render `children` when truthy, otherwise `fallback`. */
+    condition: unknown;
+    /** Rendered when `condition` is falsy. Defaults to nothing. */
+    fallback?: ReactNode;
+    children: ReactNode;
+}
+export declare function If({ condition, fallback, children }: Readonly<IfProps>): ReactNode;

package/types/ui/src/components/common/if/index.d.ts

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

package/types/ui/src/components/common/index.d.ts

@@ -0,0 +1,2 @@
+export type { IfProps } from './if';
+export { If } from './if';

package/types/ui/src/components/molecules/add-tile/add-tile.d.ts

@@ -0,0 +1,65 @@
+import type { StyleProp, ViewStyle } from 'react-native';
+import { type FocusableProps } from '#ui/components/atoms/focusable';
+import { type IconProps } from '#ui/components/atoms/icon';
+import { type StyleDecl } from '#ui/core';
+type AddTileSize = 'md' | 'tv';
+declare const addTileVariants: import("../../../core/types").SvFn<{
+    root: StyleDecl;
+    well: StyleDecl;
+    glyph: Pick<IconProps, 'color' | 'size' | 'thickness'>;
+    label: StyleDecl;
+}, {
+    readonly size: {
+        readonly md: {
+            readonly root: {
+                readonly gap: 6;
+            };
+            readonly well: {
+                w: 104;
+                h: 104;
+                radius: number;
+            };
+            readonly glyph: {
+                readonly size: 34;
+            };
+            readonly label: {
+                readonly fontSize: 15;
+            };
+        };
+        readonly tv: {
+            readonly root: {
+                readonly gap: 12;
+            };
+            readonly well: {
+                w: 146;
+                h: 146;
+                radius: number;
+            };
+            readonly glyph: {
+                readonly size: 46;
+            };
+            readonly label: {
+                readonly fontSize: 18;
+            };
+        };
+    };
+}>;
+interface AddTileProps extends Omit<FocusableProps, 'children' | 'style'> {
+    /** Names the control, and is drawn under the tile. Both, from one string:
+     *  the caption IS the accessible name, so they cannot drift apart. */
+    label: string;
+    size?: AddTileSize;
+    /** The glyph, for a row that adds something other than a profile. */
+    icon?: 'plus' | 'server' | 'device-tv';
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * The trailing "add" tile of a profile or server row.
+ *
+ * ```tsx
+ * <AddTile label={t('profiles.addProfile')} onPress={() => nav.go('addProfile')} />
+ * ```
+ */
+declare function AddTile({ label, size, icon, style, ...focus }: Readonly<AddTileProps>): import("react").JSX.Element;
+export type { AddTileProps, AddTileSize };
+export { AddTile, addTileVariants };

package/types/ui/src/components/molecules/add-tile/index.d.ts

@@ -0,0 +1,2 @@
+export type { AddTileProps, AddTileSize } from './add-tile';
+export { AddTile, addTileVariants } from './add-tile';

package/types/ui/src/components/molecules/alphabet-rail/alphabet-rail-context.d.ts

@@ -0,0 +1,20 @@
+/** The letters whose sections are on screen right now, first to last: the
+ * stretch the lens covers. */
+interface LetterRange {
+    first: string;
+    last: string;
+}
+declare const PAD = 4;
+declare const ROW_W = 32;
+interface AlphabetRailState {
+    /** Where a letter sits in the rail, or -1. Positions are the Root's: it is
+     *  the only thing that has seen every letter. */
+    indexOf: (value: string) => number;
+    lit: [number, number] | null;
+    rowH: number;
+    fontSize: number;
+    jump: (letter: string) => void;
+}
+declare const AlphabetRailContext: import("react").Context<AlphabetRailState | null>, useAlphabetRail: (part: string) => AlphabetRailState;
+export type { AlphabetRailState, LetterRange };
+export { AlphabetRailContext, PAD, ROW_W, useAlphabetRail };

package/types/ui/src/components/molecules/alphabet-rail/alphabet-rail-item.d.ts

@@ -0,0 +1,13 @@
+interface AlphabetItemProps {
+    /** The bucket this row stands for: '#', 'A' … 'Z'. */
+    value: string;
+    /** A bucket the list does not carry. It renders dimmed and takes NO focus
+     *  stop; a scrub or tap near it snaps to the nearest letter that is there. */
+    disabled?: boolean;
+    /** The accessible name of the jump, defaulting to the letter itself. */
+    label?: string;
+}
+/** One letter of the rail. */
+declare function Item({ value, disabled, label }: Readonly<AlphabetItemProps>): import("react").JSX.Element;
+export type { AlphabetItemProps };
+export { Item };

package/types/ui/src/components/molecules/alphabet-rail/alphabet-rail-lens.d.ts

@@ -0,0 +1,17 @@
+interface LensBox {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+declare function lensFor(lit: [number, number], rowH: number): LensBox;
+declare function Lens({ box, chase }: Readonly<{
+    box: LensBox | null;
+    chase: boolean;
+}>): import("react").JSX.Element;
+/** The letter under a scrubbing finger, held clear of it. */
+declare function Bubble({ letter, y }: Readonly<{
+    letter: string;
+    y: number;
+}>): import("react").JSX.Element;
+export { Bubble, Lens, lensFor };

package/types/ui/src/components/molecules/alphabet-rail/alphabet-rail.d.ts

@@ -0,0 +1,46 @@
+import { type ReactNode } from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+import { type LetterRange } from './alphabet-rail-context';
+import { type AlphabetItemProps, Item } from './alphabet-rail-item';
+type AlphabetRailSize = 'sm' | 'md';
+interface AlphabetRailRootProps {
+    /** Accessible name of the rail. */
+    label: string;
+    /** `sm` fixes the rows to a thumb's pitch; `md` (the default) scales them
+     *  with the window, up to a 10-foot cap. */
+    size?: AlphabetRailSize;
+    /** The stretch of buckets whose sections are on screen: where the lens sits.
+     *  It is the HOST's scroll, not the rail's own state. */
+    range?: LetterRange;
+    onJump: (letter: string) => void;
+    style?: StyleProp<ViewStyle>;
+    /** Only a DIRECT <AlphabetRail.Item> child takes a row. */
+    children: ReactNode;
+}
+/** The vertical sibling of the NavPill: a glass capsule of letters, an amber
+ * lens over the letters on screen, and (under a finger or pointer drag) a
+ * bubble naming the letter being scrubbed to. The host owns the list and the
+ * scroll; the rail only reports jumps. */
+declare function Root({ label, size, range, onJump, style, children, }: Readonly<AlphabetRailRootProps>): import("react").JSX.Element;
+/**
+ * The fast-scroll rail for a long alphabetical list.
+ *
+ * ```tsx
+ * <AlphabetRail.Root label="A-Z" range={visible} onJump={scrollToLetter}>
+ *   {TITLE_LETTERS.map((letter) => (
+ *     <AlphabetRail.Item
+ *       key={letter}
+ *       value={letter}
+ *       disabled={!inView.has(letter)}
+ *       label={t('browse.jumpToLetter', { letter })}
+ *     />
+ *   ))}
+ * </AlphabetRail.Root>
+ * ```
+ */
+declare const AlphabetRail: {
+    Root: typeof Root;
+    Item: typeof Item;
+};
+export type { AlphabetItemProps, AlphabetRailRootProps, AlphabetRailSize, LetterRange };
+export { AlphabetRail };

package/types/ui/src/components/molecules/alphabet-rail/index.d.ts

@@ -0,0 +1,2 @@
+export type { AlphabetItemProps, AlphabetRailRootProps, AlphabetRailSize, LetterRange, } from './alphabet-rail';
+export { AlphabetRail } from './alphabet-rail';

package/types/ui/src/components/molecules/alphabet-rail/use-letter-scrub.d.ts

@@ -0,0 +1,17 @@
+import { type RefObject } from 'react';
+import { type View } from 'react-native';
+interface Slot {
+    value: string;
+    present: boolean;
+}
+interface Bubble {
+    letter: string;
+    y: number;
+}
+declare const clampNum: (min: number, v: number, max: number) => number;
+declare function useLetterScrub(rail: RefObject<View | null>, slots: readonly Slot[], rowH: number, onJump: (letter: string) => void): {
+    bubble: Bubble | null;
+    panHandlers: import("react-native").GestureResponderHandlers | null;
+};
+export type { Slot };
+export { clampNum, useLetterScrub };

package/types/ui/src/components/molecules/back-button/back-button.d.ts

@@ -0,0 +1,10 @@
+import { type IconButtonProps } from '#ui/components/atoms/icon-button';
+interface BackButtonProps extends Omit<IconButtonProps, 'icon'> {
+    /** Where it goes, spelled out beside the chevron: "Modules", not "Back". A
+     *  header uses it so the destination is readable; a control floating over
+     *  artwork leaves it off and stays a disc. */
+    text?: string;
+}
+declare function BackButton({ diameter, glyph, variant, focusFill, focusScale, hitSlop, label, text, ...rest }: Readonly<BackButtonProps>): import("react").JSX.Element;
+export type { BackButtonProps };
+export { BackButton };

package/types/ui/src/components/molecules/back-button/index.d.ts

@@ -0,0 +1 @@
+export * from './back-button';

package/types/ui/src/components/molecules/button-group/button-group.d.ts

@@ -0,0 +1,37 @@
+import { type ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import { type CornerValue } from '#ui/core';
+import { type ControlSize } from '#ui/lib/field-shell';
+import { type GroupOrientation } from '#ui/lib/group-shape';
+interface ButtonGroupRootProps {
+    orientation?: GroupOrientation;
+    /** Names the group to assistive tech: what these controls are controls of. */
+    label: string;
+    /** The group's outer corner, by token name or in px. Defaults to the one
+     *  that goes with `size`. */
+    radius?: CornerValue;
+    /** The size members fall back to, defaulting to the shell's. A member's own
+     *  `size` still wins. */
+    size?: ControlSize;
+    style?: StyleProp<ViewStyle>;
+    children: ReactNode;
+}
+declare function Root({ orientation, label, radius, size, style, children, }: Readonly<ButtonGroupRootProps>): import("react").JSX.Element;
+interface ButtonGroupAddonProps {
+    children: ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+/** A chip nothing can press, shaped like the members around it: a protocol, a
+ *  domain suffix, the unit a neighbouring value is counted in. */
+declare function Addon({ children, style }: Readonly<ButtonGroupAddonProps>): import("react").JSX.Element;
+/** A hairline between two members, for the variants that carry no border of
+ *  their own. It occupies a child slot, so the member after it is still shaped
+ *  as the member after it. */
+declare function Separator(): import("react").JSX.Element;
+declare const ButtonGroup: {
+    Root: typeof Root;
+    Addon: typeof Addon;
+    Separator: typeof Separator;
+};
+export type { ButtonGroupAddonProps, ButtonGroupRootProps };
+export { ButtonGroup };

package/types/ui/src/components/molecules/button-group/index.d.ts

@@ -0,0 +1,3 @@
+export type { GroupMember, GroupOrientation, GroupPosition } from '#ui/lib/group-shape';
+export { useGroupMember, useGroupShape } from '#ui/lib/group-shape';
+export * from './button-group';

package/types/ui/src/components/molecules/callout/callout.d.ts

@@ -0,0 +1,63 @@
+import { type ReactNode } from 'react';
+import { type IconName } from '#ui/components/atoms/icon';
+import { type ControlSize } from '#ui/lib/field-shell';
+type CalloutTone = 'neutral' | 'accent' | 'success' | 'danger';
+interface CalloutRootProps {
+    /** What the block is saying, in the palette's own words. Defaults to
+     *  `neutral`, so a tone is always a decision. */
+    tone?: CalloutTone;
+    /** The control shell's size, defaulting to the app's (`setEntryDefaults`), so
+     *  a callout in a form matches the fields around it without saying so. */
+    size?: ControlSize;
+    /** The mark, as a glyph the kit can size. Media it cannot size goes through
+     *  <Callout.Media>, which wins the head of the row. */
+    icon?: IconName;
+    /** A DIRECT <Callout.Media> or <Callout.Actions> child is sorted into the head
+     *  and tail of the row, so those two may be written anywhere; everything else
+     *  is the message column, in the order it was written. */
+    children?: ReactNode;
+}
+declare function Root({ tone, size, icon, children }: Readonly<CalloutRootProps>): import("react").JSX.Element;
+/** The mark that says which kind of thing this is, inked and sized by the Root.
+ *  A glyph goes through `name`; media the kit cannot size goes through
+ *  `children`. */
+declare function Media({ name, children }: Readonly<{
+    name?: IconName;
+    children?: ReactNode;
+}>): import("react").JSX.Element;
+/** The one sentence the block exists to say, in the tone's ink. */
+declare function Title({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+/** The technical particular behind it: a path, a status line, what the server
+ *  actually answered. Quiet whatever the tone, so the title keeps the colour. */
+declare function Detail({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+/** The one thing to do about it, pinned to the end of the row. */
+declare function Actions({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+/**
+ * A toned block carrying one message, and sometimes the action that answers it.
+ *
+ * ```tsx
+ * <Callout.Root tone="danger">
+ *   <Callout.Title>{error}</Callout.Title>
+ * </Callout.Root>
+ *
+ * <Callout.Root tone="accent" icon="info-circle">
+ *   <Callout.Title>Le catalogue repond</Callout.Title>
+ *   <Callout.Detail>12 modules</Callout.Detail>
+ * </Callout.Root>
+ * ```
+ */
+declare const Callout: {
+    Root: typeof Root;
+    Media: typeof Media;
+    Title: typeof Title;
+    Detail: typeof Detail;
+    Actions: typeof Actions;
+};
+export type { CalloutRootProps, CalloutTone };
+export { Callout };

package/types/ui/src/components/molecules/callout/index.d.ts

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

package/types/ui/src/components/molecules/category-tile/category-tile.d.ts

@@ -0,0 +1,65 @@
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { ReactNode } from 'react';
+import { type FocusableProps } from '#ui/components/atoms/focusable';
+import { type IconName } from '#ui/components/atoms/icon';
+import type { ColorValue } from '#ui/core';
+declare const categoryTileVariants: import("../../../core/types").SvFn<import("../../../core/types").StyleSlots<{
+    frame: {
+        shrink: number;
+        radius: "xl";
+    };
+    label: {
+        font: "display";
+        fontWeight: "700";
+        color: string;
+    };
+    meta: {
+        font: "ui";
+        fontWeight: "600";
+        color: string;
+        fontVariant: "tabular-nums"[];
+    };
+}>, {
+    readonly size: {
+        readonly md: {
+            readonly label: {
+                readonly fontSize: 18;
+                readonly lineHeight: 20;
+            };
+            readonly meta: {
+                readonly fontSize: 12;
+            };
+        };
+        readonly tv: {
+            readonly label: {
+                readonly fontSize: 23;
+                readonly lineHeight: 24;
+            };
+            readonly meta: {
+                readonly fontSize: 14;
+            };
+        };
+    };
+}>;
+type CategoryTileSize = 'md' | 'tv';
+interface CategoryTileProps extends Omit<FocusableProps, 'children' | 'style' | 'label'> {
+    label: string;
+    meta?: string;
+    art?: string | null;
+    background?: string;
+    wash?: string;
+    accent?: ColorValue;
+    /** Drawn before the label, at the label's own size. Absent where the glyph
+     *  subset this build ships has none for it (see lib/genre-icon). */
+    icon?: IconName;
+    size?: CategoryTileSize;
+    /** An explicit tile width. Omit inside a <Grid>, whose cell already sets the
+     *  column width. */
+    width?: number;
+    aspect?: number;
+    children?: ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+declare function CategoryTile({ label, meta, art, background, wash, accent, icon, size, width, aspect, children, style, focusScale, ...focusProps }: Readonly<CategoryTileProps>): import("react").JSX.Element;
+export type { CategoryTileProps, CategoryTileSize };
+export { CategoryTile, categoryTileVariants };

package/types/ui/src/components/molecules/category-tile/index.d.ts

@@ -0,0 +1 @@
+export * from './category-tile';

package/types/ui/src/components/molecules/choice-list/choice-list.d.ts

@@ -0,0 +1,53 @@
+import { type ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { ControlSize } from '#ui/lib/field-shell';
+interface RootBase {
+    /** Names the group to assistive tech: what the choices are choices OF. */
+    label: string;
+    size?: ControlSize;
+    gap?: number;
+    style?: StyleProp<ViewStyle>;
+    children: ReactNode;
+}
+interface SingleRootProps extends RootBase {
+    mode?: 'single';
+    value: string | null;
+    onValueChange: (next: string) => void;
+}
+interface MultipleRootProps extends RootBase {
+    mode: 'multiple';
+    value: readonly string[];
+    onValueChange: (next: string[]) => void;
+}
+type ChoiceRootProps = SingleRootProps | MultipleRootProps;
+declare function Root(props: Readonly<ChoiceRootProps>): import("react").JSX.Element;
+interface ItemProps {
+    value: string;
+    disabled?: boolean;
+    /** The row: a <ChoiceList.Label>, and a <ChoiceList.Hint> under it. The
+     *  label's plain text is also the row's accessible name. */
+    children?: ReactNode;
+    /** Trailing controls (an edit or delete button); they keep their own focus. */
+    actions?: ReactNode;
+}
+declare function Item({ value, disabled, children, actions }: Readonly<ItemProps>): import("react").JSX.Element;
+/** The checkbox or radio face. Rendered for you by <Item>; name it yourself
+ *  only when the row's arrangement puts it somewhere else. */
+declare function Indicator(): import("react").JSX.Element;
+/** The row's title. */
+declare function Label({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+/** The quieter second line: the fact that settles the choice. */
+declare function Hint({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+declare const ChoiceList: {
+    Root: typeof Root;
+    Item: typeof Item;
+    Indicator: typeof Indicator;
+    Label: typeof Label;
+    Hint: typeof Hint;
+};
+export type { ChoiceRootProps, ItemProps as ChoiceItemProps, MultipleRootProps, SingleRootProps };
+export { ChoiceList };

package/types/ui/src/components/molecules/choice-list/index.d.ts

@@ -0,0 +1 @@
+export * from './choice-list';

package/types/ui/src/components/molecules/copy-button/copy-button.d.ts

@@ -0,0 +1,19 @@
+import { type ButtonSize, type ButtonVariant } from '#ui/components/atoms/button';
+export interface CopyButtonProps {
+    /** What lands on the clipboard. */
+    value: string;
+    label?: string;
+    copiedLabel?: string;
+    /** Said when the platform refuses the write: an insecure origin, or a
+     *  document that does not have focus. */
+    failedLabel?: string;
+    size?: ButtonSize;
+    variant?: ButtonVariant;
+    /** Glyph only, for a control that repeats on every row of a page. `label`
+     *  stays the accessible name. */
+    iconOnly?: boolean;
+}
+/** Copies `value` and confirms it on the control itself, rather than by toast.
+ * Renders nothing where the platform has no clipboard: a television has neither
+ * one nor anywhere to paste. */
+export declare function CopyButton({ value, label, copiedLabel, failedLabel, size, variant, iconOnly, }: Readonly<CopyButtonProps>): import("react").JSX.Element | null;

package/types/ui/src/components/molecules/copy-button/index.d.ts

@@ -0,0 +1 @@
+export * from './copy-button';

package/types/ui/src/components/molecules/data-field/data-field.d.ts

@@ -0,0 +1,44 @@
+import type { ReactNode } from 'react';
+import { type ControlSize } from '#ui/lib/field-shell';
+interface DataFieldRootProps {
+    /** How loud the pair reads, defaulting to the app's entry size
+     *  (`setEntryDefaults`) so a readout matches the rows beside it. */
+    size?: ControlSize;
+    /** The pair: a `<DataField.Label>`, and the `<DataField.Value>` under it. */
+    children?: ReactNode;
+}
+declare function Root({ size, children }: Readonly<DataFieldRootProps>): import("react").JSX.Element;
+/** What the fact is called. */
+declare function Label({ children }: Readonly<{
+    children: ReactNode;
+}>): import("react").JSX.Element;
+interface DataFieldValueProps {
+    /** Clamp to N lines with an ellipsis. Unclamped by default: a readout in a
+     *  tight grid asks for 1, one under a hero is allowed to wrap. */
+    lines?: number;
+    children: ReactNode;
+}
+/** The fact itself. */
+declare function Value({ lines, children }: Readonly<DataFieldValueProps>): import("react").JSX.Element;
+/**
+ * A label-above-value readout.
+ *
+ * ```tsx
+ * <DataField.Root>
+ *   <DataField.Label>Duree</DataField.Label>
+ *   <DataField.Value>2 h 04</DataField.Value>
+ * </DataField.Root>
+ *
+ * <DataField.Root>
+ *   <DataField.Label>Reseau</DataField.Label>
+ *   <DataField.Value lines={1}>{session.network}</DataField.Value>
+ * </DataField.Root>
+ * ```
+ */
+declare const DataField: {
+    Root: typeof Root;
+    Label: typeof Label;
+    Value: typeof Value;
+};
+export type { DataFieldRootProps, DataFieldValueProps };
+export { DataField };

package/types/ui/src/components/molecules/data-field/index.d.ts

@@ -0,0 +1 @@
+export * from './data-field';