@hearthscale/app-ui 0.0.0-stage → 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,745 @@
+import * as react from 'react';
+import { ButtonHTMLAttributes, ReactNode, MouseEvent, CSSProperties, InputHTMLAttributes, RefObject, Key, Ref } from 'react';
+
+type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger';
+type ButtonSize = 'sm' | 'md' | 'lg';
+interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onClick'> {
+    children: ReactNode;
+    /**
+     * `primary` is the accent: one per view, for its single main action.
+     * `secondary` is the everyday glass control, `ghost` the quiet one for
+     * toolbars, `danger` a destructive action in the error colour.
+     */
+    variant?: ButtonVariant;
+    /** `sm` sits in a row, `md` closes a section or a dialog, `lg` is a
+     *  page's call to action. */
+    size?: ButtonSize;
+    /** A mark before the label; every destructive action carries one. */
+    icon?: ReactNode;
+    trailingIcon?: ReactNode;
+    /** Stretch to the container. */
+    fullWidth?: boolean;
+    /** An address makes the button a link to it, drawn the same. */
+    href?: string;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+}
+/**
+ * The product's text button. Its whole look is `.hs-button` in the
+ * stylesheet, keyed on `data-variant` and `data-size`, so a theme reaches
+ * every one of them.
+ * @category Actions
+ */
+declare function Button({ children, variant, size, icon, trailingIcon, fullWidth, href, type, className, onClick, ...rest }: ButtonProps): react.JSX.Element;
+type IconButtonSize = 'sm' | 'md' | 'lg';
+interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
+    children: ReactNode;
+    /** Required: the control shows no text, so it must carry its own name. */
+    'aria-label': string;
+    size?: IconButtonSize;
+}
+/**
+ * A square, glyph-only control for toolbars and headers. Its look is
+ * `.hs-icon-button` in the stylesheet, keyed on `data-size`.
+ * @category Actions
+ */
+declare function IconButton({ children, size, type, className, ...rest }: IconButtonProps): react.JSX.Element;
+
+interface CardProps {
+    children: ReactNode;
+    /**
+     * `solid` is the raised surface a block of content sits on, `glass` the
+     * translucent one over the shell's frost, `gate` the opaque one a person
+     * must answer before work goes on.
+     */
+    variant?: 'solid' | 'glass' | 'gate';
+    /** The hue of a card that asks: a warning, or a question. */
+    tone?: 'warn' | 'info';
+    /** Where the card sits in a page outside the shell's stylesheet rules;
+     *  inside the shell its look is the stylesheet's alone. */
+    style?: CSSProperties;
+}
+/**
+ * The bordered surface every grouped block sits on. Its corners, inset,
+ * border and fill are `.hs-card` in the stylesheet, keyed on
+ * `data-variant`, so a theme reaches every card.
+ * @category Surfaces
+ */
+declare function Card({ children, variant, tone, style }: CardProps): react.JSX.Element;
+
+interface EmptyStateProps {
+    /** A mark over the title, drawn in the dim ink. */
+    icon?: ReactNode;
+    title: ReactNode;
+    /** What follows the title: the one action that fills the place. */
+    children?: ReactNode;
+}
+/**
+ * A place with nothing in it yet: a mark, a title and what fills it,
+ * centred in the box it fills. Its look is `.hs-empty-view` in the
+ * stylesheet.
+ * @category Surfaces
+ */
+declare function EmptyState({ icon, title, children }: EmptyStateProps): react.JSX.Element;
+
+/**
+ * The inline, bordered notice row — how the product states a condition
+ * ("no device paired", "relay reconnecting", "stopped") without stealing the
+ * page. Compose the message from plain text plus one `hs-link` button for
+ * its one remedy.
+ * @category Surfaces
+ */
+declare function Notice({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+
+type ChipTone = 'neutral' | 'info' | 'ok' | 'warn' | 'bad';
+interface ChipProps {
+    children: ReactNode;
+    tone?: ChipTone;
+    icon?: ReactNode;
+    title?: string;
+    /** Whether this choice is the chosen one; given, the chip is a choice. */
+    selected?: boolean;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+}
+/**
+ * A small named thing inside a row or a card: a file, an agent, a right.
+ * A mark may lead the words, and `title` carries what does not fit, such
+ * as a file's whole path. With `selected` it is one choice of a row of
+ * chips instead, such as a filter: a press with no tone, on a plate while
+ * it is the chosen one. Its whole look is `.hs-chip` in the stylesheet,
+ * keyed on `data-tone`, or on `data-sel` for a choice.
+ * @category Status
+ */
+declare function Chip({ children, tone, icon, title, selected, onClick }: ChipProps): react.JSX.Element;
+
+type StatusTone = 'ok' | 'bad' | 'warn' | 'info' | 'dim';
+interface StatusWordProps {
+    tone: StatusTone;
+    live?: boolean;
+    children: ReactNode;
+}
+/**
+ * A state in one or two words at the end of a row: "Failed", "Waiting for
+ * you", "Interrupted". The tone colours it; `live` makes it shine while
+ * the state lasts. Its whole look is `.hs-status` in the stylesheet.
+ * @category Status
+ */
+declare function StatusWord({ tone, live, children }: StatusWordProps): react.JSX.Element;
+
+/**
+ * A caption: the small label above a group, beside a value or under a
+ * mark. It is set in the interface font, in sentence case; monospace is for
+ * machine text only.
+ * @category Typography
+ */
+declare function Label({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+/**
+ * Machine text inside a sentence or a row: a key, an id, a hash, a path.
+ * @category Typography
+ */
+declare function Mono({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+interface PageTitleProps {
+    children: ReactNode;
+    /** The single explanatory line under the heading. Keep it to one sentence. */
+    lead?: ReactNode;
+    /** Centred and larger: a page that opens with one question. */
+    hero?: boolean;
+}
+/**
+ * A page's opening heading, with its optional lead paragraph. Every routed
+ * screen opens with exactly one.
+ * @category Typography
+ */
+declare function PageTitle({ children, lead, hero }: PageTitleProps): react.JSX.Element;
+
+interface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Always label a field; the product has no placeholder-only inputs. */
+    label: ReactNode;
+    /** Rendered in muted weight beside the label, e.g. "(optional)". */
+    labelNote?: string;
+    /** Muted line under the field for format or consequence. */
+    hint?: ReactNode;
+}
+/**
+ * A labelled text input. It shows nothing on focus: no outline, no border
+ * colour, no ring. The caret is the focus. A text control matches
+ * `:focus-visible` on a click as well, so any focus treatment would draw on
+ * every click, and the product never does that on an input.
+ * @category Forms
+ */
+declare function TextField({ label, labelNote, hint, id, className, ...rest }: TextFieldProps): react.JSX.Element;
+
+interface TextInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'className'> {
+    variant?: 'text' | 'number' | 'password' | 'email' | 'url' | 'date' | 'datetime-local';
+}
+/**
+ * A one-line field with a box: text, a number, a secret drawn as dots, an
+ * email address, a web address, a day, or a day and a time.
+ * The caret is the focus; the box shows no ring. Its whole look is
+ * `.hs-input` in the stylesheet, keyed on `data-variant`.
+ * @category Forms
+ */
+declare function TextInput({ variant, ...rest }: TextInputProps): react.JSX.Element;
+
+interface ToggleProps {
+    checked: boolean;
+    onChange?: (checked: boolean) => void;
+    /** Inert: the switch states a fact and takes no press. The row around
+     *  it dims where the setting is unavailable; the switch stays plain. */
+    disabled?: boolean;
+    'aria-label'?: string;
+}
+/** A controlled settings switch. @category Forms */
+declare function Toggle({ checked, onChange, disabled, ...rest }: ToggleProps): react.JSX.Element;
+
+interface SegmentedControlProps<T extends string> {
+    value: T;
+    options: {
+        value: T;
+        label: string;
+    }[];
+    onChange: (value: T) => void;
+    /** What the choice is about, for a reader that cannot see the control. */
+    label: string;
+    disabled?: boolean;
+}
+/**
+ * One choice of a few, every option in sight: a radio group drawn as one
+ * control, the chosen option on a glass plate. The arrow keys move the
+ * choice. Its whole look is `.hs-segmented` in the stylesheet.
+ * @category Forms
+ */
+declare function SegmentedControl<T extends string>({ value, options, onChange, label, disabled, }: SegmentedControlProps<T>): react.JSX.Element;
+
+/** One settings group, with a single border around its rows. @category Settings */
+declare function SettingsCard({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+/** A muted heading above a settings card. @category Settings */
+declare function SettingsSection({ children, first, action, }: {
+    children: ReactNode;
+    first?: boolean;
+    action?: ReactNode;
+}): react.JSX.Element;
+/** The settings surface's search field: the shell's address-field recipe,
+ *  whose placeholder sits centred and slides left on focus. @category Settings */
+declare function SettingsSearch({ value, placeholder, onChange, }: {
+    value: string;
+    placeholder: string;
+    onChange: (value: string) => void;
+}): react.JSX.Element;
+/** A picker on the shell's own menu, in place of a native select.
+ *  @category Settings */
+declare function SettingsSelect<T extends string>({ value, options, onPick, minWidth, menuHeight, menuWidth, placeholder, disabled, label, }: {
+    value: T;
+    /** `disabled` keeps an entry visible and inert, so the reason it cannot
+     *  be picked is readable where the pick is made. */
+    options: {
+        value: T;
+        label: string;
+        sub?: string;
+        trailing?: ReactNode;
+        disabled?: boolean;
+    }[];
+    onPick: (value: T) => void;
+    minWidth?: number;
+    /** Caps the menu of a long list, which then scrolls. */
+    menuHeight?: number;
+    /** Caps the menu of rows whose sub lines carry prose, which then wraps. */
+    menuWidth?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    label?: string;
+}): react.JSX.Element;
+/** A labelled row with a toggle at its end. @category Settings */
+declare function ToggleRow({ id, title, sub, help, on, onFlip, }: {
+    id?: string;
+    title: string;
+    /** Only where the label cannot carry the meaning on its own. */
+    sub?: string;
+    /** An explanation behind a question mark, for the same case. */
+    help?: string;
+    on: boolean;
+    onFlip?: () => void;
+}): react.JSX.Element;
+/** A labelled row with a value at its end. @category Settings */
+declare function InfoRow({ id, title, sub, help, helpOpen, value, }: {
+    id?: string;
+    /** A node where part of the label is itself a control — a version that
+     *  opens its release notes. */
+    title: ReactNode;
+    /** Only where the label cannot carry the meaning on its own. */
+    sub?: string;
+    /** An explanation behind a question mark, for the same case. */
+    help?: string;
+    /** The depth behind the question mark, which then takes a click. */
+    helpOpen?: () => void;
+    value: ReactNode;
+}): react.JSX.Element;
+/** A row that opens a page of its own: a mark, a title with a line under
+ *  it, a value, and a chevron. The whole row is the press. @category Settings */
+declare function LinkRow({ id, mark, title, sub, value, onOpen, }: {
+    id?: string;
+    /** The subject's own mark, such as a connector's icon. */
+    mark?: ReactNode;
+    title: ReactNode;
+    sub?: ReactNode;
+    /** A short state at the row's end, such as "Connected". */
+    value?: ReactNode;
+    onOpen: () => void;
+}): react.JSX.Element;
+/** A row of a list the page manages: a mark, a title with a line under
+ *  it, and the actions on the row, such as Edit and Delete. @category Settings */
+declare function ListRow({ id, role, mark, title, sub, actions, }: {
+    id?: string;
+    /** A class naming what the row is, such as `hs-grantrow`, which the
+     *  theme's guard keeps visible. */
+    role?: string;
+    mark?: ReactNode;
+    title: ReactNode;
+    sub?: ReactNode;
+    actions?: ReactNode;
+}): react.JSX.Element;
+/** A row of an information table: a label and a value, the value wrapping
+ *  inside its column however long it is. @category Settings */
+declare function FactRow({ label, value }: {
+    label: string;
+    value: ReactNode;
+}): react.JSX.Element;
+/** Categories of one page with arrow-key navigation. @category Settings */
+declare function SettingsTabs<T extends string>({ label, value, tabs, onPick, panelRef, }: {
+    /** The name of the row of tabs, for assistive technology. */
+    label: string;
+    value: T;
+    tabs: {
+        value: T;
+        label: string;
+    }[];
+    onPick: (value: T) => void;
+    /** Starts the linked scroll panel at its heading when the category changes. */
+    panelRef?: RefObject<HTMLElement | null>;
+}): react.JSX.Element;
+
+interface MenuAnchor {
+    key: string;
+    element: HTMLElement;
+}
+/** Keeps the clicked element as the menu's positioning reference. */
+declare function anchorFrom(key: string, e: MouseEvent<HTMLElement>): MenuAnchor;
+/** The heavy-frost popup surface a context menu or picker sits on. It is
+ *  drawn into the popup root, so no scroll container clips it and no glass
+ *  surface it opens from keeps it from frosting what lies behind.
+ *  @category Overlays */
+declare function MenuSurface({ anchor, align, dir, minWidth, maxWidth, maxHeight, fit, keyboard, onDismiss, children, }: {
+    anchor: MenuAnchor;
+    align?: 'auto' | 'left' | 'right';
+    dir?: 'down' | 'up' | 'right';
+    minWidth?: number;
+    /** The menu takes its anchor's width and corners exactly, as a picker
+     *  that opens beneath its own field does. */
+    fit?: boolean;
+    keyboard?: boolean;
+    /** Caps a menu whose rows carry prose, which would otherwise stretch to
+     *  the width of the longest sentence. */
+    maxWidth?: number;
+    /** Caps a long list, which then scrolls, opened on its selected row. */
+    maxHeight?: number;
+    onDismiss: () => void;
+    children: ReactNode;
+}): react.ReactPortal;
+/** One row of a shell menu: glyph, label, optional sub/chip/check. @category Overlays */
+declare function MItem({ icon, label, sub, chip, checked, selected, danger, disabled, onClick, trailing, }: {
+    icon?: ReactNode;
+    label: string;
+    sub?: string;
+    chip?: string;
+    checked?: boolean;
+    selected?: boolean;
+    danger?: boolean;
+    /** Drawn dimmed and inert: the row stays visible so the reason for it
+     *  being unavailable is readable beside it. */
+    disabled?: boolean;
+    onClick?: () => void;
+    /** What sits at the row's end: a switch, a chevron. */
+    trailing?: ReactNode;
+}): react.JSX.Element;
+/** A row that opens a flyout on the side with space while hovered. The
+ *  flyout closes as a menu does, with this row as its trigger, and a row
+ *  opens its flyout only while no other row of its menu holds one.
+ *  @category Overlays */
+declare function MSub({ icon, label, minWidth, children, }: {
+    icon?: ReactNode;
+    label: string;
+    minWidth?: number;
+    children: ReactNode;
+}): react.JSX.Element;
+/** Hairline between menu groups. @category Overlays */
+declare function MDivider(): react.JSX.Element;
+/** Mono-caps section label inside a menu. @category Overlays */
+declare function MSection({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+/** Where a floating tip sits against its mark. */
+type TipPlacement = 'bottom-start' | 'bottom' | 'top' | 'right';
+/** The hover wiring of a `FloatingTip` for the marks of one component,
+ *  a list of them included. `tips(key, text, chip)` names one mark: spread
+ *  its `hover` on the mark and render its `tip` inside it, so the tip goes
+ *  with the mark. A mark with no text shows no tip. @category Overlays */
+declare function useFloatingTips(placement?: TipPlacement): (key: string, text: string | undefined, chip?: string) => {
+    hover: {
+        onMouseEnter: (e: MouseEvent<HTMLElement>) => void;
+        onMouseLeave: () => void;
+    };
+    tip: react.JSX.Element | null;
+};
+
+interface ShellConfirmProps {
+    title: string;
+    body: ReactNode;
+    /** The action's label, in the imperative: "Regenerate", "Delete 3 sessions". */
+    action: string;
+    /** The action's look: `danger` where the action destroys something,
+     *  `primary` where it installs or buys. */
+    tone?: 'danger' | 'primary';
+    onConfirm: () => void;
+    onCancel: () => void;
+}
+/** A confirmation dialog styled by the theme, with presence and operability
+ *  maintained by the guard layer. It asks the person while it shows.
+ *  @category Overlays */
+declare function ShellConfirm({ title, body, action, tone, onConfirm, onCancel, }: ShellConfirmProps): react.JSX.Element;
+
+interface OverlayScrollProps {
+    /** The scroller's own classes: its overflow, its padding and the gap
+     *  between its rows. */
+    className: string;
+    children: ReactNode;
+}
+/** A scroller with its bar over the right end of its rows. It fills the
+ *  height its column gives it. @category Layout */
+declare function OverlayScroll({ className, children }: OverlayScrollProps): react.JSX.Element;
+
+/**
+ * A key the person can press, as a small cap: "Enter", "Esc", "1". Its
+ * whole look is `.hs-kbd` in the stylesheet.
+ * @category Status
+ */
+declare function Kbd({ children }: {
+    children: ReactNode;
+}): react.JSX.Element;
+
+interface MeterProps {
+    /** The share, from 0 to 1. */
+    value: number;
+    /** What the meter measures, for assistive technology. */
+    label: string;
+    variant?: 'bar' | 'ring';
+    /** The bad hue, for a share that is close to its limit. */
+    tone?: 'bad';
+}
+/**
+ * How much of something is done or used: a thin bar under a label, or a
+ * small ring. Its whole look is `.hs-meter` in the stylesheet, keyed on
+ * `data-variant` and `data-tone`.
+ * @category Status
+ */
+declare function Meter({ value, label, variant, tone }: MeterProps): react.JSX.Element;
+
+interface LightboxItem {
+    src: string;
+    name: string;
+    /** Words under the caption, such as what a model read in the picture. */
+    note?: ReactNode;
+    onSave?: () => void;
+    /** Opens the picture where its kind opens; `at` is the press. */
+    onOpen?: (at: HTMLElement) => void;
+}
+interface LightboxProps {
+    items: LightboxItem[];
+    /** The picture it opens on. */
+    start: number;
+    onClose: () => void;
+}
+/** @category Overlays */
+declare function Lightbox({ items, start, onClose }: LightboxProps): react.JSX.Element | null;
+
+interface SliderProps {
+    value: number;
+    onChange: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** What the slider sets, for assistive technology. */
+    label: string;
+    /** The value in words, after the track: "40%", "1.5 s". */
+    shown?: string;
+    disabled?: boolean;
+}
+/**
+ * A value on a scale, set by dragging a thumb along a track, with the
+ * value in words after it. It fills the width its container gives it.
+ * Its look is `.hs-range` in a `.hs-slider` row.
+ * @category Forms
+ */
+declare function Slider({ value, onChange, min, max, step, label, shown, disabled, }: SliderProps): react.JSX.Element;
+
+/** Where a popover opens against its anchor: the side, then the edge of
+ *  that side it lines up with. */
+type PopoverPlacement = 'bottom' | 'bottom-start' | 'bottom-end' | 'top' | 'top-start' | 'top-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+interface PopoverProps {
+    /** The element it opens from, such as the button that opened it. */
+    anchor: HTMLElement;
+    placement?: PopoverPlacement;
+    /** What it holds, for assistive technology. */
+    label: string;
+    onDismiss: () => void;
+    children: ReactNode;
+}
+/**
+ * A small panel beside the element it opens from, over everything else:
+ * a form, a picker, the details of a row. It takes the focus when it
+ * opens, to the element inside marked `data-autofocus` or else the first
+ * control, and keeps it, so Tab moves only between its own controls.
+ * Escape, a press outside it, or the window losing the focus close it.
+ * It draws into the theme root, so no frame or scroller clips it.
+ * @category Overlays
+ */
+declare function Popover({ anchor, placement, label, onDismiss, children, }: PopoverProps): react.ReactPortal;
+
+interface ToastProps {
+    /** What happened: "Moved to Archive". */
+    children: ReactNode;
+    /** The one thing to do about it: "Undo". It closes the toast. */
+    action?: {
+        label: string;
+        onPress: () => void;
+    };
+    /** How long it shows, in milliseconds, counted while the pointer and the
+     *  focus are off it. */
+    duration?: number;
+    /** The element it sits above, centred on it, such as a composer at the
+     *  bottom of the view; without it, the bottom of the window. */
+    above?: RefObject<HTMLElement | null>;
+    onClose: () => void;
+}
+/**
+ * A short line at the bottom of the window, or above the element `above`
+ * names, about something that just happened, with at most one action and
+ * a close mark. It closes itself after its time, which waits while the
+ * pointer or the focus is on it, and assistive technology reads it out. A
+ * view shows one at a time.
+ * @category Overlays
+ */
+declare function Toast({ children, action, duration, above, onClose }: ToastProps): react.JSX.Element;
+
+/** A day of the calendar as `YYYY-MM-DD`, with no time and no zone. */
+type PlainDate = string;
+interface DateGridProps {
+    value: PlainDate | null;
+    onChange: (date: PlainDate) => void;
+    /** The person's locale, as the view's host context gives it: it sets the
+     *  names, the order and the first day of the week. */
+    locale: string;
+    /** The first day that can be chosen. */
+    min?: PlainDate;
+    /** The last day that can be chosen. */
+    max?: PlainDate;
+}
+/**
+ * A month of days to choose one from, with the month's name and steps to
+ * the month before and after. Today is marked and the chosen day filled.
+ * The arrow keys move a day or a week, Home and End to the ends of the
+ * week, Page Up and Page Down a month (with Shift a year), never past the
+ * first or the last day that can be chosen, and Enter chooses.
+ * @category Forms
+ */
+declare function DateGrid({ value, onChange, locale, min, max }: DateGridProps): react.JSX.Element;
+interface DatePickerProps extends DateGridProps {
+    /** What the day is, for assistive technology: "Start date". */
+    label: string;
+    /** The words in the field while no day is chosen. */
+    placeholder?: string;
+    disabled?: boolean;
+}
+/**
+ * A field that shows a day in the person's own way of writing it and
+ * opens a month of days to choose another.
+ * @category Forms
+ */
+declare function DatePicker({ value, onChange, locale, min, max, label, placeholder, disabled, }: DatePickerProps): react.JSX.Element;
+
+/** A time of day as `HH:MM` on the 24-hour clock, with no day and no zone. */
+type PlainTime = string;
+interface TimePickerProps {
+    value: PlainTime | null;
+    onChange: (time: PlainTime) => void;
+    /** The person's locale, as the view's host context gives it: it sets the
+     *  hour cycle, as its `hc` key does. */
+    locale: string;
+    /** What the time is, for assistive technology: "Start time". */
+    label: string;
+    /** The minutes between two times of the list. */
+    step?: number;
+    /** The words in the field while no time is chosen. */
+    placeholder?: string;
+    disabled?: boolean;
+}
+/**
+ * A field that shows a time of day in the person's own hour cycle and
+ * opens a list of the day's times, a step apart, to choose another. The
+ * list opens on the chosen time; a chosen time between two steps is in
+ * the list too.
+ * @category Forms
+ */
+declare function TimePicker({ value, onChange, locale, label, step, placeholder, disabled, }: TimePickerProps): react.JSX.Element;
+
+/** The colours of the category palette, in the order a picker shows them:
+ *  twelve hues round the wheel, then a grey. */
+declare const SWATCHES: readonly ["rose", "ember", "amber", "sun", "lime", "moss", "jade", "sky", "ocean", "indigo", "violet", "plum", "slate"];
+/** A colour of the category palette. An element with `data-swatch` set to
+ *  one draws with `--swatch`, `--swatch-tint` and `--swatch-ink`. */
+type Swatch = (typeof SWATCHES)[number];
+interface SwatchPickerProps {
+    value: Swatch;
+    onChange: (swatch: Swatch) => void;
+    /** What the colour is of, for assistive technology: "Calendar colour". */
+    label: string;
+}
+/**
+ * A choice of one colour of the category palette: a row of dots, the
+ * chosen one ringed, each named in its tooltip. The arrow keys move the
+ * choice, as in any group of radio buttons.
+ * @category Forms
+ */
+declare function SwatchPicker({ value, onChange, label }: SwatchPickerProps): react.JSX.Element;
+
+interface PersonMarkProps {
+    /** The person's name, or an address where no name is known. */
+    name: string;
+    /** The address of the person's picture. */
+    picture?: string;
+    size?: 'sm' | 'md' | 'lg';
+    /** The colour of the initials' fill; by default one the name picks. */
+    swatch?: Swatch;
+}
+/**
+ * A person as a small round mark: their picture, or their initials on a
+ * soft fill of a colour that stays the same for the same name. A picture
+ * that does not load shows the initials.
+ * @category Status
+ */
+declare function PersonMark({ name, picture, size, swatch }: PersonMarkProps): react.JSX.Element;
+
+/** Resolved publisher identity, independent of the model architecture.
+ *  `GET /v1/publishers/{owner}/picture` answers the picture of the Hub
+ *  user or organisation `repository` names first: its bytes as
+ *  `image/png`, `image/jpeg`, `image/webp`, `image/gif` or
+ *  `image/svg+xml`, with `cache-control: max-age=86400`. A 404
+ *  `invalid_request` says no picture is known for the owner, and a 400
+ *  `invalid_request` refuses a name that is not one Hub path segment of
+ *  ASCII letters, digits, `-`, `_` and `.`. */
+interface ModelIdentity {
+    publisher: string;
+    /** The Hub repository whose publisher supplies the artwork; null for other sources. */
+    repository: string | null;
+}
+
+/** Where a host serves the picture of a model's publisher: the address of
+ *  the picture the Hearthscale Server `server` keeps of the Hugging Face
+ *  user or organisation `owner`, or none where the host serves none. */
+type PublisherPictures = (server: string | undefined, owner: string) => string | undefined;
+/** The publisher pictures the avatars under it show; without a provider,
+ *  none. @category Icons */
+declare const PublisherPicturesContext: react.Context<PublisherPictures>;
+/** A model's publisher: the picture its Server keeps of the publisher,
+ *  else the bundled brand mark, else the publisher's initial. `server` is
+ *  the Hearthscale Server the model comes from, a card's `provider` or the
+ *  Server a Discover search ran on. @category Icons */
+declare function ModelAvatar({ identity, server, size, }: {
+    identity: ModelIdentity;
+    server?: string;
+    size?: number;
+}): react.JSX.Element;
+
+interface VirtualListHandle {
+    /** Scrolls the row into sight: to the top, the middle or the bottom of
+     *  the list, or by the least scroll that shows it. */
+    scrollToIndex(index: number, align?: 'start' | 'center' | 'end' | 'auto'): void;
+}
+interface VirtualListProps {
+    /** How many rows the list holds. */
+    count: number;
+    /** A row's height in pixels until it is drawn and measured. */
+    estimate: number;
+    /** The row at a place in the list. */
+    row: (index: number) => ReactNode;
+    /** What names the row at a place, so a row keeps its state where rows
+     *  come and go before it. By default its place. */
+    rowKey?: (index: number) => Key;
+    /** The scroller's own classes: its height, its padding. */
+    className?: string;
+    ref?: Ref<VirtualListHandle>;
+}
+/**
+ * A scrolling list of any length that draws only the rows in sight and a
+ * few beyond, each as tall as it draws: a mailbox, a log, a library. Its
+ * height is what its container or its class gives it.
+ * @category Layout
+ */
+declare function VirtualList({ count, estimate, row, rowKey, className, ref }: VirtualListProps): react.JSX.Element;
+
+interface ComparedPicture {
+    src: string;
+    /** The words over its corner: "Before", a model's name. */
+    name: string;
+}
+interface PictureCompareProps {
+    /** The picture on the left of the line. */
+    before: ComparedPicture;
+    /** The picture on the right of the line, drawn over the first at its
+     *  size. */
+    after: ComparedPicture;
+}
+/**
+ * Two pictures of the same size, one over the other, split by a line the
+ * person drags to show more of one or the other. The arrow keys move the
+ * line a step, Home and End to the edges.
+ * @category Media
+ */
+declare function PictureCompare({ before, after }: PictureCompareProps): react.JSX.Element;
+
+/**
+ * The name of every icon of the Remix Icon font, as https://remixicon.com/
+ * shows it. Written by `scripts/icon-names.mjs` from the `remixicon`
+ * package; not edited by hand.
+ */
+type IconName = '24-hours-fill' | '24-hours-line' | '4k-fill' | '4k-line' | 'a-b' | 'accessibility-fill' | 'accessibility-line' | 'account-box-2-fill' | 'account-box-2-line' | 'account-box-fill' | 'account-box-line' | 'account-circle-2-fill' | 'account-circle-2-line' | 'account-circle-fill' | 'account-circle-line' | 'account-pin-box-fill' | 'account-pin-box-line' | 'account-pin-circle-fill' | 'account-pin-circle-line' | 'add-box-fill' | 'add-box-line' | 'add-circle-fill' | 'add-circle-line' | 'add-fill' | 'add-large-fill' | 'add-large-line' | 'add-line' | 'admin-fill' | 'admin-line' | 'advertisement-fill' | 'advertisement-line' | 'aed-electrodes-fill' | 'aed-electrodes-line' | 'aed-fill' | 'aed-line' | 'ai' | 'ai-agent-fill' | 'ai-agent-line' | 'ai-generate' | 'ai-generate-2' | 'ai-generate-2-fill' | 'ai-generate-2-line' | 'ai-generate-3d-fill' | 'ai-generate-3d-line' | 'ai-generate-text' | 'airplay-fill' | 'airplay-line' | 'alarm-add-fill' | 'alarm-add-line' | 'alarm-fill' | 'alarm-line' | 'alarm-snooze-fill' | 'alarm-snooze-line' | 'alarm-warning-fill' | 'alarm-warning-line' | 'album-fill' | 'album-line' | 'alert-fill' | 'alert-line' | 'alibaba-cloud-fill' | 'alibaba-cloud-line' | 'aliens-fill' | 'aliens-line' | 'align-bottom' | 'align-center' | 'align-item-bottom-fill' | 'align-item-bottom-line' | 'align-item-horizontal-center-fill' | 'align-item-horizontal-center-line' | 'align-item-left-fill' | 'align-item-left-line' | 'align-item-right-fill' | 'align-item-right-line' | 'align-item-top-fill' | 'align-item-top-line' | 'align-item-vertical-center-fill' | 'align-item-vertical-center-line' | 'align-justify' | 'align-left' | 'align-right' | 'align-top' | 'align-vertically' | 'alipay-fill' | 'alipay-line' | 'amazon-fill' | 'amazon-line' | 'anchor-fill' | 'anchor-line' | 'ancient-gate-fill' | 'ancient-gate-line' | 'ancient-pavilion-fill' | 'ancient-pavilion-line' | 'android-fill' | 'android-line' | 'angularjs-fill' | 'angularjs-line' | 'anthropic-fill' | 'anthropic-line' | 'anticlockwise-2-fill' | 'anticlockwise-2-line' | 'anticlockwise-fill' | 'anticlockwise-line' | 'app-store-fill' | 'app-store-line' | 'apple-fill' | 'apple-line' | 'apps-2-add-fill' | 'apps-2-add-line' | 'apps-2-ai-fill' | 'apps-2-ai-line' | 'apps-2-fill' | 'apps-2-line' | 'apps-ai-fill' | 'apps-ai-line' | 'apps-fill' | 'apps-line' | 'archive-2-fill' | 'archive-2-line' | 'archive-drawer-fill' | 'archive-drawer-line' | 'archive-fill' | 'archive-line' | 'archive-stack-fill' | 'archive-stack-line' | 'area-chart-fill' | 'area-chart-line' | 'armchair-fill' | 'armchair-line' | 'arrow-down-box-fill' | 'arrow-down-box-line' | 'arrow-down-circle-fill' | 'arrow-down-circle-line' | 'arrow-down-double-fill' | 'arrow-down-double-line' | 'arrow-down-fill' | 'arrow-down-line' | 'arrow-down-long-fill' | 'arrow-down-long-line' | 'arrow-down-s-fill' | 'arrow-down-s-line' | 'arrow-down-wide-fill' | 'arrow-down-wide-line' | 'arrow-drop-down-fill' | 'arrow-drop-down-line' | 'arrow-drop-left-fill' | 'arrow-drop-left-line' | 'arrow-drop-right-fill' | 'arrow-drop-right-line' | 'arrow-drop-up-fill' | 'arrow-drop-up-line' | 'arrow-go-back-fill' | 'arrow-go-back-line' | 'arrow-go-forward-fill' | 'arrow-go-forward-line' | 'arrow-left-box-fill' | 'arrow-left-box-line' | 'arrow-left-circle-fill' | 'arrow-left-circle-line' | 'arrow-left-double-fill' | 'arrow-left-double-line' | 'arrow-left-down-box-fill' | 'arrow-left-down-box-line' | 'arrow-left-down-fill' | 'arrow-left-down-line' | 'arrow-left-down-long-fill' | 'arrow-left-down-long-line' | 'arrow-left-fill' | 'arrow-left-line' | 'arrow-left-long-fill' | 'arrow-left-long-line' | 'arrow-left-right-fill' | 'arrow-left-right-line' | 'arrow-left-s-fill' | 'arrow-left-s-line' | 'arrow-left-up-box-fill' | 'arrow-left-up-box-line' | 'arrow-left-up-fill' | 'arrow-left-up-line' | 'arrow-left-up-long-fill' | 'arrow-left-up-long-line' | 'arrow-left-wide-fill' | 'arrow-left-wide-line' | 'arrow-right-box-fill' | 'arrow-right-box-line' | 'arrow-right-circle-fill' | 'arrow-right-circle-line' | 'arrow-right-double-fill' | 'arrow-right-double-line' | 'arrow-right-down-box-fill' | 'arrow-right-down-box-line' | 'arrow-right-down-fill' | 'arrow-right-down-line' | 'arrow-right-down-long-fill' | 'arrow-right-down-long-line' | 'arrow-right-fill' | 'arrow-right-line' | 'arrow-right-long-fill' | 'arrow-right-long-line' | 'arrow-right-s-fill' | 'arrow-right-s-line' | 'arrow-right-up-box-fill' | 'arrow-right-up-box-line' | 'arrow-right-up-fill' | 'arrow-right-up-line' | 'arrow-right-up-long-fill' | 'arrow-right-up-long-line' | 'arrow-right-wide-fill' | 'arrow-right-wide-line' | 'arrow-turn-back-fill' | 'arrow-turn-back-line' | 'arrow-turn-forward-fill' | 'arrow-turn-forward-line' | 'arrow-up-box-fill' | 'arrow-up-box-line' | 'arrow-up-circle-fill' | 'arrow-up-circle-line' | 'arrow-up-double-fill' | 'arrow-up-double-line' | 'arrow-up-down-fill' | 'arrow-up-down-line' | 'arrow-up-fill' | 'arrow-up-line' | 'arrow-up-long-fill' | 'arrow-up-long-line' | 'arrow-up-s-fill' | 'arrow-up-s-line' | 'arrow-up-wide-fill' | 'arrow-up-wide-line' | 'artboard-2-fill' | 'artboard-2-line' | 'artboard-fill' | 'artboard-line' | 'article-fill' | 'article-line' | 'aspect-ratio-fill' | 'aspect-ratio-line' | 'asterisk' | 'at-fill' | 'at-line' | 'atom-fill' | 'atom-line' | 'attachment-2' | 'attachment-fill' | 'attachment-line' | 'auction-fill' | 'auction-line' | 'award-fill' | 'award-line' | 'baidu-fill' | 'baidu-line' | 'ball-pen-fill' | 'ball-pen-line' | 'bank-card-2-fill' | 'bank-card-2-line' | 'bank-card-fill' | 'bank-card-line' | 'bank-fill' | 'bank-line' | 'bar-chart-2-fill' | 'bar-chart-2-line' | 'bar-chart-box-ai-fill' | 'bar-chart-box-ai-line' | 'bar-chart-box-fill' | 'bar-chart-box-line' | 'bar-chart-fill' | 'bar-chart-grouped-fill' | 'bar-chart-grouped-line' | 'bar-chart-horizontal-fill' | 'bar-chart-horizontal-line' | 'bar-chart-line' | 'barcode-box-fill' | 'barcode-box-line' | 'barcode-fill' | 'barcode-line' | 'bard-fill' | 'bard-line' | 'barricade-fill' | 'barricade-line' | 'base-station-fill' | 'base-station-line' | 'baseball-fill' | 'baseball-line' | 'basketball-fill' | 'basketball-line' | 'battery-2-charge-fill' | 'battery-2-charge-line' | 'battery-2-fill' | 'battery-2-line' | 'battery-charge-fill' | 'battery-charge-line' | 'battery-fill' | 'battery-line' | 'battery-low-fill' | 'battery-low-line' | 'battery-saver-fill' | 'battery-saver-line' | 'battery-share-fill' | 'battery-share-line' | 'bear-smile-fill' | 'bear-smile-line' | 'beer-fill' | 'beer-line' | 'behance-fill' | 'behance-line' | 'bell-fill' | 'bell-line' | 'bike-fill' | 'bike-line' | 'bilibili-fill' | 'bilibili-line' | 'bill-fill' | 'bill-line' | 'billiards-fill' | 'billiards-line' | 'binoculars-fill' | 'binoculars-line' | 'bit-coin-fill' | 'bit-coin-line' | 'blaze-fill' | 'blaze-line' | 'blender-fill' | 'blender-line' | 'blogger-fill' | 'blogger-line' | 'bluesky-fill' | 'bluesky-line' | 'bluetooth-connect-fill' | 'bluetooth-connect-line' | 'bluetooth-fill' | 'bluetooth-line' | 'blur-off-fill' | 'blur-off-line' | 'bnb-fill' | 'bnb-line' | 'body-scan-fill' | 'body-scan-line' | 'bold' | 'book-2-fill' | 'book-2-line' | 'book-3-fill' | 'book-3-line' | 'book-ai-fill' | 'book-ai-line' | 'book-fill' | 'book-line' | 'book-marked-fill' | 'book-marked-line' | 'book-open-fill' | 'book-open-line' | 'book-read-fill' | 'book-read-line' | 'book-shelf-fill' | 'book-shelf-line' | 'booklet-fill' | 'booklet-line' | 'bookmark-2-fill' | 'bookmark-2-line' | 'bookmark-3-fill' | 'bookmark-3-line' | 'bookmark-fill' | 'bookmark-line' | 'bootstrap-fill' | 'bootstrap-line' | 'bowl-fill' | 'bowl-line' | 'box-1-fill' | 'box-1-line' | 'box-2-fill' | 'box-2-line' | 'box-3-fill' | 'box-3-line' | 'boxing-fill' | 'boxing-line' | 'braces-fill' | 'braces-line' | 'brackets-fill' | 'brackets-line' | 'brain-2-fill' | 'brain-2-line' | 'brain-3-fill' | 'brain-3-line' | 'brain-ai-3-fill' | 'brain-ai-3-line' | 'brain-fill' | 'brain-line' | 'bread-fill' | 'bread-line' | 'briefcase-2-fill' | 'briefcase-2-line' | 'briefcase-3-fill' | 'briefcase-3-line' | 'briefcase-4-fill' | 'briefcase-4-line' | 'briefcase-5-fill' | 'briefcase-5-line' | 'briefcase-fill' | 'briefcase-line' | 'bring-forward' | 'bring-to-front' | 'broadcast-fill' | 'broadcast-line' | 'brush-2-fill' | 'brush-2-line' | 'brush-3-fill' | 'brush-3-line' | 'brush-4-fill' | 'brush-4-line' | 'brush-ai-3-fill' | 'brush-ai-3-line' | 'brush-ai-fill' | 'brush-ai-line' | 'brush-fill' | 'brush-line' | 'btc-fill' | 'btc-line' | 'bubble-chart-fill' | 'bubble-chart-line' | 'bug-2-fill' | 'bug-2-line' | 'bug-fill' | 'bug-line' | 'building-2-fill' | 'building-2-line' | 'building-3-fill' | 'building-3-line' | 'building-4-fill' | 'building-4-line' | 'building-fill' | 'building-line' | 'bus-2-fill' | 'bus-2-line' | 'bus-fill' | 'bus-line' | 'bus-wifi-fill' | 'bus-wifi-line' | 'cactus-fill' | 'cactus-line' | 'cake-2-fill' | 'cake-2-line' | 'cake-3-fill' | 'cake-3-line' | 'cake-fill' | 'cake-line' | 'calculator-fill' | 'calculator-line' | 'calendar-2-fill' | 'calendar-2-line' | 'calendar-check-fill' | 'calendar-check-line' | 'calendar-close-fill' | 'calendar-close-line' | 'calendar-event-fill' | 'calendar-event-line' | 'calendar-fill' | 'calendar-line' | 'calendar-schedule-fill' | 'calendar-schedule-line' | 'calendar-todo-fill' | 'calendar-todo-line' | 'calendar-view' | 'camera-2-fill' | 'camera-2-line' | 'camera-3-fill' | 'camera-3-line' | 'camera-4-fill' | 'camera-4-line' | 'camera-ai-2-fill' | 'camera-ai-2-line' | 'camera-ai-fill' | 'camera-ai-line' | 'camera-fill' | 'camera-lens-ai-fill' | 'camera-lens-ai-line' | 'camera-lens-fill' | 'camera-lens-line' | 'camera-line' | 'camera-off-fill' | 'camera-off-line' | 'camera-switch-fill' | 'camera-switch-line' | 'candle-fill' | 'candle-line' | 'capsule-fill' | 'capsule-line' | 'car-fill' | 'car-line' | 'car-washing-fill' | 'car-washing-line' | 'caravan-fill' | 'caravan-line' | 'carousel-view' | 'cash-fill' | 'cash-line' | 'cast-fill' | 'cast-line' | 'cellphone-fill' | 'cellphone-line' | 'celsius-fill' | 'celsius-line' | 'centos-fill' | 'centos-line' | 'character-recognition-fill' | 'character-recognition-line' | 'charging-pile-2-fill' | 'charging-pile-2-line' | 'charging-pile-fill' | 'charging-pile-line' | 'chat-1-fill' | 'chat-1-line' | 'chat-2-fill' | 'chat-2-line' | 'chat-3-fill' | 'chat-3-line' | 'chat-4-fill' | 'chat-4-line' | 'chat-ai-2-fill' | 'chat-ai-2-line' | 'chat-ai-3-fill' | 'chat-ai-3-line' | 'chat-ai-4-fill' | 'chat-ai-4-line' | 'chat-ai-fill' | 'chat-ai-line' | 'chat-check-fill' | 'chat-check-line' | 'chat-delete-fill' | 'chat-delete-line' | 'chat-download-fill' | 'chat-download-line' | 'chat-follow-up-fill' | 'chat-follow-up-line' | 'chat-forward-fill' | 'chat-forward-line' | 'chat-heart-fill' | 'chat-heart-line' | 'chat-history-fill' | 'chat-history-line' | 'chat-new-fill' | 'chat-new-line' | 'chat-off-fill' | 'chat-off-line' | 'chat-poll-fill' | 'chat-poll-line' | 'chat-private-fill' | 'chat-private-line' | 'chat-quote-fill' | 'chat-quote-line' | 'chat-search-fill' | 'chat-search-line' | 'chat-settings-fill' | 'chat-settings-line' | 'chat-smile-2-fill' | 'chat-smile-2-line' | 'chat-smile-3-fill' | 'chat-smile-3-line' | 'chat-smile-ai-3-fill' | 'chat-smile-ai-3-line' | 'chat-smile-ai-fill' | 'chat-smile-ai-line' | 'chat-smile-fill' | 'chat-smile-line' | 'chat-thread-fill' | 'chat-thread-line' | 'chat-unread-fill' | 'chat-unread-line' | 'chat-upload-fill' | 'chat-upload-line' | 'chat-voice-ai-fill' | 'chat-voice-ai-line' | 'chat-voice-fill' | 'chat-voice-line' | 'check-double-fill' | 'check-double-line' | 'check-fill' | 'check-line' | 'checkbox-blank-circle-fill' | 'checkbox-blank-circle-line' | 'checkbox-blank-fill' | 'checkbox-blank-line' | 'checkbox-circle-fill' | 'checkbox-circle-line' | 'checkbox-fill' | 'checkbox-indeterminate-fill' | 'checkbox-indeterminate-line' | 'checkbox-line' | 'checkbox-multiple-blank-fill' | 'checkbox-multiple-blank-line' | 'checkbox-multiple-fill' | 'checkbox-multiple-line' | 'chess-fill' | 'chess-line' | 'china-railway-fill' | 'china-railway-line' | 'chrome-fill' | 'chrome-line' | 'circle-fill' | 'circle-line' | 'clapperboard-ai-fill' | 'clapperboard-ai-line' | 'clapperboard-fill' | 'clapperboard-line' | 'claude-fill' | 'claude-line' | 'clipboard-fill' | 'clipboard-line' | 'clockwise-2-fill' | 'clockwise-2-line' | 'clockwise-fill' | 'clockwise-line' | 'close-circle-fill' | 'close-circle-line' | 'close-fill' | 'close-large-fill' | 'close-large-line' | 'close-line' | 'closed-captioning-ai-fill' | 'closed-captioning-ai-line' | 'closed-captioning-fill' | 'closed-captioning-line' | 'cloud-fill' | 'cloud-line' | 'cloud-off-fill' | 'cloud-off-line' | 'cloud-windy-fill' | 'cloud-windy-line' | 'cloudy-2-fill' | 'cloudy-2-line' | 'cloudy-fill' | 'cloudy-line' | 'code-ai-fill' | 'code-ai-line' | 'code-block' | 'code-box-fill' | 'code-box-line' | 'code-fill' | 'code-line' | 'code-s-fill' | 'code-s-line' | 'code-s-slash-fill' | 'code-s-slash-line' | 'code-view' | 'codepen-fill' | 'codepen-line' | 'coin-fill' | 'coin-line' | 'coins-fill' | 'coins-line' | 'collage-fill' | 'collage-line' | 'collapse-diagonal-2-fill' | 'collapse-diagonal-2-line' | 'collapse-diagonal-fill' | 'collapse-diagonal-line' | 'collapse-horizontal-fill' | 'collapse-horizontal-line' | 'collapse-vertical-fill' | 'collapse-vertical-line' | 'color-filter-ai-fill' | 'color-filter-ai-line' | 'color-filter-fill' | 'color-filter-line' | 'command-fill' | 'command-line' | 'community-fill' | 'community-line' | 'compass-2-fill' | 'compass-2-line' | 'compass-3-fill' | 'compass-3-line' | 'compass-4-fill' | 'compass-4-line' | 'compass-discover-fill' | 'compass-discover-line' | 'compass-fill' | 'compass-line' | 'compasses-2-fill' | 'compasses-2-line' | 'compasses-fill' | 'compasses-line' | 'computer-fill' | 'computer-line' | 'contacts-book-2-fill' | 'contacts-book-2-line' | 'contacts-book-3-fill' | 'contacts-book-3-line' | 'contacts-book-fill' | 'contacts-book-line' | 'contacts-book-upload-fill' | 'contacts-book-upload-line' | 'contacts-fill' | 'contacts-line' | 'contract-fill' | 'contract-left-fill' | 'contract-left-line' | 'contract-left-right-fill' | 'contract-left-right-line' | 'contract-line' | 'contract-right-fill' | 'contract-right-line' | 'contract-up-down-fill' | 'contract-up-down-line' | 'contrast-2-fill' | 'contrast-2-line' | 'contrast-drop-2-fill' | 'contrast-drop-2-line' | 'contrast-drop-fill' | 'contrast-drop-line' | 'contrast-fill' | 'contrast-line' | 'copilot-fill' | 'copilot-line' | 'copper-coin-fill' | 'copper-coin-line' | 'copper-diamond-fill' | 'copper-diamond-line' | 'copyleft-fill' | 'copyleft-line' | 'copyright-fill' | 'copyright-line' | 'coreos-fill' | 'coreos-line' | 'corner-down-left-fill' | 'corner-down-left-line' | 'corner-down-right-fill' | 'corner-down-right-line' | 'corner-left-down-fill' | 'corner-left-down-line' | 'corner-left-up-fill' | 'corner-left-up-line' | 'corner-right-down-fill' | 'corner-right-down-line' | 'corner-right-up-fill' | 'corner-right-up-line' | 'corner-up-left-double-fill' | 'corner-up-left-double-line' | 'corner-up-left-fill' | 'corner-up-left-line' | 'corner-up-right-double-fill' | 'corner-up-right-double-line' | 'corner-up-right-fill' | 'corner-up-right-line' | 'coupon-2-fill' | 'coupon-2-line' | 'coupon-3-fill' | 'coupon-3-line' | 'coupon-4-fill' | 'coupon-4-line' | 'coupon-5-fill' | 'coupon-5-line' | 'coupon-fill' | 'coupon-line' | 'cpu-fill' | 'cpu-line' | 'creative-commons-by-fill' | 'creative-commons-by-line' | 'creative-commons-fill' | 'creative-commons-line' | 'creative-commons-nc-fill' | 'creative-commons-nc-line' | 'creative-commons-nd-fill' | 'creative-commons-nd-line' | 'creative-commons-sa-fill' | 'creative-commons-sa-line' | 'creative-commons-zero-fill' | 'creative-commons-zero-line' | 'criminal-fill' | 'criminal-line' | 'crop-2-fill' | 'crop-2-line' | 'crop-fill' | 'crop-line' | 'cross-fill' | 'cross-line' | 'crosshair-2-fill' | 'crosshair-2-line' | 'crosshair-fill' | 'crosshair-line' | 'css3-fill' | 'css3-line' | 'cup-fill' | 'cup-line' | 'currency-fill' | 'currency-line' | 'cursor-fill' | 'cursor-hand' | 'cursor-line' | 'custom-size' | 'customer-service-2-fill' | 'customer-service-2-line' | 'customer-service-fill' | 'customer-service-line' | 'dashboard-2-fill' | 'dashboard-2-line' | 'dashboard-3-fill' | 'dashboard-3-line' | 'dashboard-fill' | 'dashboard-horizontal-fill' | 'dashboard-horizontal-line' | 'dashboard-line' | 'database-2-fill' | 'database-2-line' | 'database-fill' | 'database-line' | 'deepseek-fill' | 'deepseek-line' | 'delete-back-2-fill' | 'delete-back-2-line' | 'delete-back-fill' | 'delete-back-line' | 'delete-bin-2-fill' | 'delete-bin-2-line' | 'delete-bin-3-fill' | 'delete-bin-3-line' | 'delete-bin-4-fill' | 'delete-bin-4-line' | 'delete-bin-5-fill' | 'delete-bin-5-line' | 'delete-bin-6-fill' | 'delete-bin-6-line' | 'delete-bin-7-fill' | 'delete-bin-7-line' | 'delete-bin-fill' | 'delete-bin-line' | 'delete-column' | 'delete-row' | 'device-fill' | 'device-line' | 'device-recover-fill' | 'device-recover-line' | 'diamond-fill' | 'diamond-line' | 'diamond-ring-fill' | 'diamond-ring-line' | 'dice-1-fill' | 'dice-1-line' | 'dice-2-fill' | 'dice-2-line' | 'dice-3-fill' | 'dice-3-line' | 'dice-4-fill' | 'dice-4-line' | 'dice-5-fill' | 'dice-5-line' | 'dice-6-fill' | 'dice-6-line' | 'dice-fill' | 'dice-line' | 'dingding-fill' | 'dingding-line' | 'direction-fill' | 'direction-line' | 'disc-fill' | 'disc-line' | 'discord-fill' | 'discord-line' | 'discount-percent-fill' | 'discount-percent-line' | 'discuss-fill' | 'discuss-line' | 'dislike-fill' | 'dislike-line' | 'disqus-fill' | 'disqus-line' | 'divide-fill' | 'divide-line' | 'dna-fill' | 'dna-line' | 'donut-chart-fill' | 'donut-chart-line' | 'door-closed-fill' | 'door-closed-line' | 'door-fill' | 'door-line' | 'door-lock-box-fill' | 'door-lock-box-line' | 'door-lock-fill' | 'door-lock-line' | 'door-open-fill' | 'door-open-line' | 'dossier-fill' | 'dossier-line' | 'douban-fill' | 'douban-line' | 'double-quotes-l' | 'double-quotes-r' | 'download-2-fill' | 'download-2-line' | 'download-cloud-2-fill' | 'download-cloud-2-line' | 'download-cloud-fill' | 'download-cloud-line' | 'download-fill' | 'download-line' | 'draft-fill' | 'draft-line' | 'drag-drop-fill' | 'drag-drop-line' | 'drag-move-2-fill' | 'drag-move-2-line' | 'drag-move-fill' | 'drag-move-line' | 'draggable' | 'dribbble-fill' | 'dribbble-line' | 'drinks-2-fill' | 'drinks-2-line' | 'drinks-fill' | 'drinks-line' | 'drive-fill' | 'drive-line' | 'drizzle-fill' | 'drizzle-line' | 'drop-fill' | 'drop-line' | 'dropbox-fill' | 'dropbox-line' | 'dropdown-list' | 'dropper-fill' | 'dropper-line' | 'dual-sim-1-fill' | 'dual-sim-1-line' | 'dual-sim-2-fill' | 'dual-sim-2-line' | 'dv-fill' | 'dv-line' | 'dvd-ai-fill' | 'dvd-ai-line' | 'dvd-fill' | 'dvd-line' | 'e-bike-2-fill' | 'e-bike-2-line' | 'e-bike-fill' | 'e-bike-line' | 'earth-fill' | 'earth-line' | 'earthquake-fill' | 'earthquake-line' | 'edge-fill' | 'edge-line' | 'edge-new-fill' | 'edge-new-line' | 'edit-2-fill' | 'edit-2-line' | 'edit-box-fill' | 'edit-box-line' | 'edit-circle-fill' | 'edit-circle-line' | 'edit-fill' | 'edit-line' | 'eject-fill' | 'eject-line' | 'emoji-sticker-fill' | 'emoji-sticker-line' | 'emotion-2-fill' | 'emotion-2-line' | 'emotion-add-fill' | 'emotion-add-line' | 'emotion-fill' | 'emotion-happy-fill' | 'emotion-happy-line' | 'emotion-laugh-fill' | 'emotion-laugh-line' | 'emotion-line' | 'emotion-normal-fill' | 'emotion-normal-line' | 'emotion-sad-fill' | 'emotion-sad-line' | 'emotion-unhappy-fill' | 'emotion-unhappy-line' | 'empathize-fill' | 'empathize-line' | 'emphasis' | 'emphasis-cn' | 'english-input' | 'equal-fill' | 'equal-line' | 'equalizer-2-fill' | 'equalizer-2-line' | 'equalizer-3-fill' | 'equalizer-3-line' | 'equalizer-fill' | 'equalizer-line' | 'eraser-fill' | 'eraser-line' | 'error-warning-fill' | 'error-warning-line' | 'eth-fill' | 'eth-line' | 'evernote-fill' | 'evernote-line' | 'exchange-2-fill' | 'exchange-2-line' | 'exchange-box-fill' | 'exchange-box-line' | 'exchange-cny-fill' | 'exchange-cny-line' | 'exchange-dollar-fill' | 'exchange-dollar-line' | 'exchange-fill' | 'exchange-funds-fill' | 'exchange-funds-line' | 'exchange-line' | 'expand-diagonal-2-fill' | 'expand-diagonal-2-line' | 'expand-diagonal-fill' | 'expand-diagonal-line' | 'expand-diagonal-s-2-fill' | 'expand-diagonal-s-2-line' | 'expand-diagonal-s-fill' | 'expand-diagonal-s-line' | 'expand-height-fill' | 'expand-height-line' | 'expand-horizontal-fill' | 'expand-horizontal-line' | 'expand-horizontal-s-fill' | 'expand-horizontal-s-line' | 'expand-left-fill' | 'expand-left-line' | 'expand-left-right-fill' | 'expand-left-right-line' | 'expand-right-fill' | 'expand-right-line' | 'expand-up-down-fill' | 'expand-up-down-line' | 'expand-vertical-fill' | 'expand-vertical-line' | 'expand-vertical-s-fill' | 'expand-vertical-s-line' | 'expand-width-fill' | 'expand-width-line' | 'export-fill' | 'export-line' | 'external-link-fill' | 'external-link-line' | 'eye-2-fill' | 'eye-2-line' | 'eye-close-fill' | 'eye-close-line' | 'eye-fill' | 'eye-line' | 'eye-off-fill' | 'eye-off-line' | 'facebook-box-fill' | 'facebook-box-line' | 'facebook-circle-fill' | 'facebook-circle-line' | 'facebook-fill' | 'facebook-line' | 'fahrenheit-fill' | 'fahrenheit-line' | 'fediverse-fill' | 'fediverse-line' | 'feedback-fill' | 'feedback-line' | 'figma-fill' | 'figma-line' | 'file-2-fill' | 'file-2-line' | 'file-3-fill' | 'file-3-line' | 'file-4-fill' | 'file-4-line' | 'file-add-fill' | 'file-add-line' | 'file-ai-2-fill' | 'file-ai-2-line' | 'file-ai-fill' | 'file-ai-line' | 'file-chart-2-fill' | 'file-chart-2-line' | 'file-chart-fill' | 'file-chart-line' | 'file-check-fill' | 'file-check-line' | 'file-close-fill' | 'file-close-line' | 'file-cloud-fill' | 'file-cloud-line' | 'file-code-fill' | 'file-code-line' | 'file-copy-2-fill' | 'file-copy-2-line' | 'file-copy-fill' | 'file-copy-line' | 'file-damage-fill' | 'file-damage-line' | 'file-download-fill' | 'file-download-line' | 'file-edit-fill' | 'file-edit-line' | 'file-excel-2-fill' | 'file-excel-2-line' | 'file-excel-fill' | 'file-excel-line' | 'file-fill' | 'file-forbid-fill' | 'file-forbid-line' | 'file-gif-fill' | 'file-gif-line' | 'file-history-fill' | 'file-history-line' | 'file-hwp-fill' | 'file-hwp-line' | 'file-image-fill' | 'file-image-line' | 'file-info-fill' | 'file-info-line' | 'file-line' | 'file-list-2-fill' | 'file-list-2-line' | 'file-list-3-fill' | 'file-list-3-line' | 'file-list-fill' | 'file-list-line' | 'file-lock-fill' | 'file-lock-line' | 'file-marked-fill' | 'file-marked-line' | 'file-music-fill' | 'file-music-line' | 'file-paper-2-fill' | 'file-paper-2-line' | 'file-paper-fill' | 'file-paper-line' | 'file-pdf-2-fill' | 'file-pdf-2-line' | 'file-pdf-fill' | 'file-pdf-line' | 'file-ppt-2-fill' | 'file-ppt-2-line' | 'file-ppt-fill' | 'file-ppt-line' | 'file-reduce-fill' | 'file-reduce-line' | 'file-scan-fill' | 'file-scan-line' | 'file-search-fill' | 'file-search-line' | 'file-settings-fill' | 'file-settings-line' | 'file-shield-2-fill' | 'file-shield-2-line' | 'file-shield-fill' | 'file-shield-line' | 'file-shred-fill' | 'file-shred-line' | 'file-text-fill' | 'file-text-line' | 'file-transfer-fill' | 'file-transfer-line' | 'file-unknow-fill' | 'file-unknow-line' | 'file-upload-fill' | 'file-upload-line' | 'file-user-fill' | 'file-user-line' | 'file-video-fill' | 'file-video-line' | 'file-warning-fill' | 'file-warning-line' | 'file-word-2-fill' | 'file-word-2-line' | 'file-word-fill' | 'file-word-line' | 'file-zip-fill' | 'file-zip-line' | 'film-ai-fill' | 'film-ai-line' | 'film-fill' | 'film-line' | 'filter-2-fill' | 'filter-2-line' | 'filter-3-fill' | 'filter-3-line' | 'filter-fill' | 'filter-line' | 'filter-off-fill' | 'filter-off-line' | 'find-replace-fill' | 'find-replace-line' | 'finder-fill' | 'finder-line' | 'fingerprint-2-fill' | 'fingerprint-2-line' | 'fingerprint-fill' | 'fingerprint-line' | 'fire-fill' | 'fire-line' | 'firebase-fill' | 'firebase-line' | 'firefox-browser-fill' | 'firefox-browser-line' | 'firefox-fill' | 'firefox-line' | 'first-aid-kit-fill' | 'first-aid-kit-line' | 'fiverr-fill' | 'fiverr-line' | 'flag-2-fill' | 'flag-2-line' | 'flag-fill' | 'flag-line' | 'flag-off-fill' | 'flag-off-line' | 'flashlight-fill' | 'flashlight-line' | 'flask-fill' | 'flask-line' | 'flickr-fill' | 'flickr-line' | 'flight-land-fill' | 'flight-land-line' | 'flight-takeoff-fill' | 'flight-takeoff-line' | 'flip-horizontal-2-fill' | 'flip-horizontal-2-line' | 'flip-horizontal-fill' | 'flip-horizontal-line' | 'flip-vertical-2-fill' | 'flip-vertical-2-line' | 'flip-vertical-fill' | 'flip-vertical-line' | 'flood-fill' | 'flood-line' | 'flow-chart' | 'flower-fill' | 'flower-line' | 'flutter-fill' | 'flutter-line' | 'focus-2-fill' | 'focus-2-line' | 'focus-3-fill' | 'focus-3-line' | 'focus-fill' | 'focus-line' | 'focus-mode' | 'foggy-fill' | 'foggy-line' | 'folder-2-fill' | 'folder-2-line' | 'folder-3-fill' | 'folder-3-line' | 'folder-4-fill' | 'folder-4-line' | 'folder-5-fill' | 'folder-5-line' | 'folder-6-fill' | 'folder-6-line' | 'folder-add-fill' | 'folder-add-line' | 'folder-chart-2-fill' | 'folder-chart-2-line' | 'folder-chart-fill' | 'folder-chart-line' | 'folder-check-fill' | 'folder-check-line' | 'folder-close-fill' | 'folder-close-line' | 'folder-cloud-fill' | 'folder-cloud-line' | 'folder-download-fill' | 'folder-download-line' | 'folder-fill' | 'folder-forbid-fill' | 'folder-forbid-line' | 'folder-history-fill' | 'folder-history-line' | 'folder-image-fill' | 'folder-image-line' | 'folder-info-fill' | 'folder-info-line' | 'folder-keyhole-fill' | 'folder-keyhole-line' | 'folder-line' | 'folder-lock-fill' | 'folder-lock-line' | 'folder-music-fill' | 'folder-music-line' | 'folder-open-fill' | 'folder-open-line' | 'folder-received-fill' | 'folder-received-line' | 'folder-reduce-fill' | 'folder-reduce-line' | 'folder-settings-fill' | 'folder-settings-line' | 'folder-shared-fill' | 'folder-shared-line' | 'folder-shield-2-fill' | 'folder-shield-2-line' | 'folder-shield-fill' | 'folder-shield-line' | 'folder-transfer-fill' | 'folder-transfer-line' | 'folder-unknow-fill' | 'folder-unknow-line' | 'folder-upload-fill' | 'folder-upload-line' | 'folder-user-fill' | 'folder-user-line' | 'folder-video-fill' | 'folder-video-line' | 'folder-warning-fill' | 'folder-warning-line' | 'folder-zip-fill' | 'folder-zip-line' | 'folders-fill' | 'folders-line' | 'font-color' | 'font-family' | 'font-mono' | 'font-sans-serif' | 'font-serif' | 'font-size' | 'font-size-2' | 'font-size-ai' | 'football-fill' | 'football-line' | 'footprint-fill' | 'footprint-line' | 'forbid-2-fill' | 'forbid-2-line' | 'forbid-fill' | 'forbid-line' | 'format-clear' | 'formula' | 'forward-10-fill' | 'forward-10-line' | 'forward-15-fill' | 'forward-15-line' | 'forward-30-fill' | 'forward-30-line' | 'forward-5-fill' | 'forward-5-line' | 'forward-end-fill' | 'forward-end-line' | 'forward-end-mini-fill' | 'forward-end-mini-line' | 'fridge-fill' | 'fridge-line' | 'friendica-fill' | 'friendica-line' | 'fullscreen-exit-fill' | 'fullscreen-exit-line' | 'fullscreen-fill' | 'fullscreen-line' | 'function-add-fill' | 'function-add-line' | 'function-ai-fill' | 'function-ai-line' | 'function-fill' | 'function-line' | 'functions' | 'funds-box-fill' | 'funds-box-line' | 'funds-fill' | 'funds-line' | 'gallery-fill' | 'gallery-line' | 'gallery-upload-fill' | 'gallery-upload-line' | 'gallery-view' | 'gallery-view-2' | 'game-2-fill' | 'game-2-line' | 'game-fill' | 'game-line' | 'gamepad-fill' | 'gamepad-line' | 'gas-station-fill' | 'gas-station-line' | 'gatsby-fill' | 'gatsby-line' | 'gemini-fill' | 'gemini-line' | 'genderless-fill' | 'genderless-line' | 'ghost-2-fill' | 'ghost-2-line' | 'ghost-3-fill' | 'ghost-3-line' | 'ghost-fill' | 'ghost-line' | 'ghost-smile-fill' | 'ghost-smile-line' | 'gift-2-fill' | 'gift-2-line' | 'gift-fill' | 'gift-line' | 'git-branch-fill' | 'git-branch-line' | 'git-close-pull-request-fill' | 'git-close-pull-request-line' | 'git-commit-fill' | 'git-commit-line' | 'git-fork-fill' | 'git-fork-line' | 'git-merge-fill' | 'git-merge-line' | 'git-pr-draft-fill' | 'git-pr-draft-line' | 'git-pull-request-fill' | 'git-pull-request-line' | 'git-repository-commits-fill' | 'git-repository-commits-line' | 'git-repository-fill' | 'git-repository-line' | 'git-repository-private-fill' | 'git-repository-private-line' | 'gitee-fill' | 'gitee-line' | 'github-fill' | 'github-line' | 'gitlab-fill' | 'gitlab-line' | 'glasses-2-fill' | 'glasses-2-line' | 'glasses-fill' | 'glasses-line' | 'global-fill' | 'global-line' | 'global-off-fill' | 'global-off-line' | 'globe-fill' | 'globe-line' | 'goblet-2-fill' | 'goblet-2-line' | 'goblet-broken-fill' | 'goblet-broken-line' | 'goblet-fill' | 'goblet-line' | 'goggles-fill' | 'goggles-line' | 'golf-ball-fill' | 'golf-ball-line' | 'google-fill' | 'google-line' | 'google-play-fill' | 'google-play-line' | 'government-fill' | 'government-line' | 'gps-fill' | 'gps-line' | 'gradienter-fill' | 'gradienter-line' | 'graduation-cap-fill' | 'graduation-cap-line' | 'grid-fill' | 'grid-line' | 'group-2-fill' | 'group-2-line' | 'group-3-fill' | 'group-3-line' | 'group-fill' | 'group-line' | 'guide-fill' | 'guide-line' | 'h-1' | 'h-2' | 'h-3' | 'h-4' | 'h-5' | 'h-6' | 'hail-fill' | 'hail-line' | 'hammer-fill' | 'hammer-line' | 'hand' | 'hand-coin-fill' | 'hand-coin-line' | 'hand-heart-fill' | 'hand-heart-line' | 'hand-sanitizer-fill' | 'hand-sanitizer-line' | 'handbag-fill' | 'handbag-line' | 'hard-drive-2-fill' | 'hard-drive-2-line' | 'hard-drive-3-fill' | 'hard-drive-3-line' | 'hard-drive-fill' | 'hard-drive-line' | 'hashtag' | 'haze-2-fill' | 'haze-2-line' | 'haze-fill' | 'haze-line' | 'hd-fill' | 'hd-line' | 'heading' | 'headphone-fill' | 'headphone-line' | 'health-book-fill' | 'health-book-line' | 'heart-2-fill' | 'heart-2-line' | 'heart-3-fill' | 'heart-3-line' | 'heart-add-2-fill' | 'heart-add-2-line' | 'heart-add-fill' | 'heart-add-line' | 'heart-fill' | 'heart-line' | 'heart-pulse-fill' | 'heart-pulse-line' | 'hearts-fill' | 'hearts-line' | 'heavy-showers-fill' | 'heavy-showers-line' | 'hexagon-fill' | 'hexagon-line' | 'history-fill' | 'history-line' | 'home-2-fill' | 'home-2-line' | 'home-3-fill' | 'home-3-line' | 'home-4-fill' | 'home-4-line' | 'home-5-fill' | 'home-5-line' | 'home-6-fill' | 'home-6-line' | 'home-7-fill' | 'home-7-line' | 'home-8-fill' | 'home-8-line' | 'home-9-fill' | 'home-9-line' | 'home-fill' | 'home-gear-fill' | 'home-gear-line' | 'home-heart-fill' | 'home-heart-line' | 'home-line' | 'home-office-fill' | 'home-office-line' | 'home-smile-2-fill' | 'home-smile-2-line' | 'home-smile-fill' | 'home-smile-line' | 'home-wifi-fill' | 'home-wifi-line' | 'honor-of-kings-fill' | 'honor-of-kings-line' | 'honour-fill' | 'honour-line' | 'hospital-fill' | 'hospital-line' | 'hotel-bed-fill' | 'hotel-bed-line' | 'hotel-fill' | 'hotel-line' | 'hotspot-fill' | 'hotspot-line' | 'hourglass-2-fill' | 'hourglass-2-line' | 'hourglass-fill' | 'hourglass-line' | 'hq-fill' | 'hq-line' | 'html5-fill' | 'html5-line' | 'id-card-fill' | 'id-card-line' | 'ie-fill' | 'ie-line' | 'image-2-fill' | 'image-2-line' | 'image-add-fill' | 'image-add-line' | 'image-ai-fill' | 'image-ai-line' | 'image-circle-ai-fill' | 'image-circle-ai-line' | 'image-circle-fill' | 'image-circle-line' | 'image-download-fill' | 'image-download-line' | 'image-edit-fill' | 'image-edit-line' | 'image-fill' | 'image-line' | 'image-upload-fill' | 'image-upload-line' | 'import-fill' | 'import-line' | 'inbox-2-fill' | 'inbox-2-line' | 'inbox-archive-fill' | 'inbox-archive-line' | 'inbox-fill' | 'inbox-line' | 'inbox-unarchive-fill' | 'inbox-unarchive-line' | 'increase-decrease-fill' | 'increase-decrease-line' | 'indent-decrease' | 'indent-increase' | 'indeterminate-circle-fill' | 'indeterminate-circle-line' | 'infinity-fill' | 'infinity-line' | 'info-card-fill' | 'info-card-line' | 'info-i' | 'information-2-fill' | 'information-2-line' | 'information-fill' | 'information-line' | 'information-off-fill' | 'information-off-line' | 'infrared-thermometer-fill' | 'infrared-thermometer-line' | 'ink-bottle-fill' | 'ink-bottle-line' | 'input-cursor-move' | 'input-field' | 'input-method-fill' | 'input-method-line' | 'insert-column-left' | 'insert-column-right' | 'insert-row-bottom' | 'insert-row-top' | 'instagram-fill' | 'instagram-line' | 'install-fill' | 'install-line' | 'instance-fill' | 'instance-line' | 'invision-fill' | 'invision-line' | 'issues-fill' | 'issues-line' | 'issues-reopen-fill' | 'issues-reopen-line' | 'italic' | 'java-fill' | 'java-line' | 'javascript-fill' | 'javascript-line' | 'jewelry-fill' | 'jewelry-line' | 'kakao-talk-fill' | 'kakao-talk-line' | 'kanban-view' | 'kanban-view-2' | 'key-2-fill' | 'key-2-line' | 'key-fill' | 'key-line' | 'keyboard-box-fill' | 'keyboard-box-line' | 'keyboard-fill' | 'keyboard-line' | 'keynote-fill' | 'keynote-line' | 'kick-fill' | 'kick-line' | 'knife-blood-fill' | 'knife-blood-line' | 'knife-fill' | 'knife-line' | 'landscape-ai-fill' | 'landscape-ai-line' | 'landscape-fill' | 'landscape-line' | 'layout-2-fill' | 'layout-2-line' | 'layout-3-fill' | 'layout-3-line' | 'layout-4-fill' | 'layout-4-line' | 'layout-5-fill' | 'layout-5-line' | 'layout-6-fill' | 'layout-6-line' | 'layout-bottom-2-fill' | 'layout-bottom-2-line' | 'layout-bottom-fill' | 'layout-bottom-line' | 'layout-column-fill' | 'layout-column-line' | 'layout-fill' | 'layout-grid-2-fill' | 'layout-grid-2-line' | 'layout-grid-fill' | 'layout-grid-line' | 'layout-horizontal-fill' | 'layout-horizontal-line' | 'layout-left-2-fill' | 'layout-left-2-line' | 'layout-left-fill' | 'layout-left-line' | 'layout-line' | 'layout-masonry-fill' | 'layout-masonry-line' | 'layout-right-2-fill' | 'layout-right-2-line' | 'layout-right-fill' | 'layout-right-line' | 'layout-row-fill' | 'layout-row-line' | 'layout-top-2-fill' | 'layout-top-2-line' | 'layout-top-fill' | 'layout-top-line' | 'layout-vertical-fill' | 'layout-vertical-line' | 'leaf-fill' | 'leaf-line' | 'letter-spacing-2' | 'lifebuoy-fill' | 'lifebuoy-line' | 'lightbulb-ai-fill' | 'lightbulb-ai-line' | 'lightbulb-fill' | 'lightbulb-flash-fill' | 'lightbulb-flash-line' | 'lightbulb-line' | 'line-chart-fill' | 'line-chart-line' | 'line-fill' | 'line-height' | 'line-height-2' | 'line-line' | 'link' | 'link-m' | 'link-unlink' | 'link-unlink-m' | 'linkedin-box-fill' | 'linkedin-box-line' | 'linkedin-fill' | 'linkedin-line' | 'links-fill' | 'links-line' | 'list-check' | 'list-check-2' | 'list-check-3' | 'list-indefinite' | 'list-ordered' | 'list-ordered-2' | 'list-radio' | 'list-settings-fill' | 'list-settings-line' | 'list-unordered' | 'list-view' | 'live-fill' | 'live-line' | 'loader-2-fill' | 'loader-2-line' | 'loader-3-fill' | 'loader-3-line' | 'loader-4-fill' | 'loader-4-line' | 'loader-5-fill' | 'loader-5-line' | 'loader-fill' | 'loader-line' | 'lock-2-fill' | 'lock-2-line' | 'lock-fill' | 'lock-line' | 'lock-password-fill' | 'lock-password-line' | 'lock-star-fill' | 'lock-star-line' | 'lock-unlock-fill' | 'lock-unlock-line' | 'login-box-fill' | 'login-box-line' | 'login-circle-fill' | 'login-circle-line' | 'logout-box-fill' | 'logout-box-line' | 'logout-box-r-fill' | 'logout-box-r-line' | 'logout-circle-fill' | 'logout-circle-line' | 'logout-circle-r-fill' | 'logout-circle-r-line' | 'loop-left-ai-fill' | 'loop-left-ai-line' | 'loop-left-fill' | 'loop-left-line' | 'loop-right-ai-fill' | 'loop-right-ai-line' | 'loop-right-fill' | 'loop-right-line' | 'luggage-cart-fill' | 'luggage-cart-line' | 'luggage-deposit-fill' | 'luggage-deposit-line' | 'lungs-fill' | 'lungs-line' | 'mac-fill' | 'mac-line' | 'macbook-fill' | 'macbook-line' | 'magic-fill' | 'magic-line' | 'mail-add-fill' | 'mail-add-line' | 'mail-ai-fill' | 'mail-ai-line' | 'mail-check-fill' | 'mail-check-line' | 'mail-close-fill' | 'mail-close-line' | 'mail-download-fill' | 'mail-download-line' | 'mail-fill' | 'mail-forbid-fill' | 'mail-forbid-line' | 'mail-line' | 'mail-lock-fill' | 'mail-lock-line' | 'mail-open-fill' | 'mail-open-line' | 'mail-send-fill' | 'mail-send-line' | 'mail-settings-fill' | 'mail-settings-line' | 'mail-star-fill' | 'mail-star-line' | 'mail-unread-fill' | 'mail-unread-line' | 'mail-volume-fill' | 'mail-volume-line' | 'map-2-fill' | 'map-2-line' | 'map-fill' | 'map-line' | 'map-pin-2-fill' | 'map-pin-2-line' | 'map-pin-3-fill' | 'map-pin-3-line' | 'map-pin-4-fill' | 'map-pin-4-line' | 'map-pin-5-fill' | 'map-pin-5-line' | 'map-pin-add-fill' | 'map-pin-add-line' | 'map-pin-fill' | 'map-pin-line' | 'map-pin-range-fill' | 'map-pin-range-line' | 'map-pin-time-fill' | 'map-pin-time-line' | 'map-pin-user-fill' | 'map-pin-user-line' | 'mark-pen-fill' | 'mark-pen-line' | 'markdown-fill' | 'markdown-line' | 'markup-fill' | 'markup-line' | 'mastercard-fill' | 'mastercard-line' | 'mastodon-fill' | 'mastodon-line' | 'medal-2-fill' | 'medal-2-line' | 'medal-fill' | 'medal-line' | 'medicine-bottle-fill' | 'medicine-bottle-line' | 'medium-fill' | 'medium-line' | 'megaphone-fill' | 'megaphone-line' | 'memories-fill' | 'memories-line' | 'men-fill' | 'men-line' | 'mental-health-fill' | 'mental-health-line' | 'menu-2-fill' | 'menu-2-line' | 'menu-3-fill' | 'menu-3-line' | 'menu-4-fill' | 'menu-4-line' | 'menu-5-fill' | 'menu-5-line' | 'menu-add-fill' | 'menu-add-line' | 'menu-fill' | 'menu-fold-2-fill' | 'menu-fold-2-line' | 'menu-fold-3-fill' | 'menu-fold-3-line' | 'menu-fold-4-fill' | 'menu-fold-4-line' | 'menu-fold-fill' | 'menu-fold-line' | 'menu-line' | 'menu-search-fill' | 'menu-search-line' | 'menu-unfold-2-fill' | 'menu-unfold-2-line' | 'menu-unfold-3-fill' | 'menu-unfold-3-line' | 'menu-unfold-4-fill' | 'menu-unfold-4-line' | 'menu-unfold-fill' | 'menu-unfold-line' | 'merge-cells-horizontal' | 'merge-cells-vertical' | 'message-2-fill' | 'message-2-line' | 'message-3-fill' | 'message-3-line' | 'message-ai-3-fill' | 'message-ai-3-line' | 'message-fill' | 'message-line' | 'messenger-fill' | 'messenger-line' | 'meta-fill' | 'meta-line' | 'meteor-fill' | 'meteor-line' | 'mic-2-ai-fill' | 'mic-2-ai-line' | 'mic-2-fill' | 'mic-2-line' | 'mic-ai-fill' | 'mic-ai-line' | 'mic-fill' | 'mic-line' | 'mic-off-fill' | 'mic-off-line' | 'mickey-fill' | 'mickey-line' | 'microscope-fill' | 'microscope-line' | 'microsoft-fill' | 'microsoft-line' | 'microsoft-loop-fill' | 'microsoft-loop-line' | 'mind-map' | 'mini-program-fill' | 'mini-program-line' | 'mist-fill' | 'mist-line' | 'mixtral-fill' | 'mixtral-line' | 'mobile-download-fill' | 'mobile-download-line' | 'money-cny-box-fill' | 'money-cny-box-line' | 'money-cny-circle-fill' | 'money-cny-circle-line' | 'money-dollar-box-fill' | 'money-dollar-box-line' | 'money-dollar-circle-fill' | 'money-dollar-circle-line' | 'money-euro-box-fill' | 'money-euro-box-line' | 'money-euro-circle-fill' | 'money-euro-circle-line' | 'money-pound-box-fill' | 'money-pound-box-line' | 'money-pound-circle-fill' | 'money-pound-circle-line' | 'money-rupee-circle-fill' | 'money-rupee-circle-line' | 'moon-clear-fill' | 'moon-clear-line' | 'moon-cloudy-fill' | 'moon-cloudy-line' | 'moon-fill' | 'moon-foggy-fill' | 'moon-foggy-line' | 'moon-line' | 'more-2-fill' | 'more-2-line' | 'more-fill' | 'more-line' | 'motorbike-fill' | 'motorbike-line' | 'mouse-fill' | 'mouse-line' | 'movie-2-ai-fill' | 'movie-2-ai-line' | 'movie-2-fill' | 'movie-2-line' | 'movie-ai-fill' | 'movie-ai-line' | 'movie-fill' | 'movie-line' | 'multi-image-fill' | 'multi-image-line' | 'music-2-fill' | 'music-2-line' | 'music-ai-fill' | 'music-ai-line' | 'music-fill' | 'music-line' | 'mv-ai-fill' | 'mv-ai-line' | 'mv-fill' | 'mv-line' | 'navigation-fill' | 'navigation-line' | 'netease-cloud-music-fill' | 'netease-cloud-music-line' | 'netflix-fill' | 'netflix-line' | 'network-error-fill' | 'network-error-line' | 'network-fill' | 'network-line' | 'network-off-fill' | 'network-off-line' | 'news-fill' | 'news-line' | 'newspaper-fill' | 'newspaper-line' | 'nextjs-fill' | 'nextjs-line' | 'nft-fill' | 'nft-line' | 'no-credit-card-fill' | 'no-credit-card-line' | 'node-tree' | 'nodejs-fill' | 'nodejs-line' | 'notification-2-fill' | 'notification-2-line' | 'notification-3-fill' | 'notification-3-line' | 'notification-4-fill' | 'notification-4-line' | 'notification-badge-fill' | 'notification-badge-line' | 'notification-fill' | 'notification-line' | 'notification-off-fill' | 'notification-off-line' | 'notification-snooze-fill' | 'notification-snooze-line' | 'notion-fill' | 'notion-line' | 'npmjs-fill' | 'npmjs-line' | 'number-0' | 'number-1' | 'number-2' | 'number-3' | 'number-4' | 'number-5' | 'number-6' | 'number-7' | 'number-8' | 'number-9' | 'numbers-fill' | 'numbers-line' | 'nurse-fill' | 'nurse-line' | 'octagon-fill' | 'octagon-line' | 'oil-fill' | 'oil-line' | 'omega' | 'open-arm-fill' | 'open-arm-line' | 'open-source-fill' | 'open-source-line' | 'openai-fill' | 'openai-line' | 'openbase-fill' | 'openbase-line' | 'opera-fill' | 'opera-line' | 'order-play-fill' | 'order-play-line' | 'organization-chart' | 'outlet-2-fill' | 'outlet-2-line' | 'outlet-fill' | 'outlet-line' | 'overline' | 'p2p-fill' | 'p2p-line' | 'page-separator' | 'pages-fill' | 'pages-line' | 'paint-brush-fill' | 'paint-brush-line' | 'paint-fill' | 'paint-line' | 'painting-ai-fill' | 'painting-ai-line' | 'painting-fill' | 'painting-line' | 'palette-fill' | 'palette-line' | 'pantone-fill' | 'pantone-line' | 'paragraph' | 'parent-fill' | 'parent-line' | 'parentheses-fill' | 'parentheses-line' | 'parking-box-fill' | 'parking-box-line' | 'parking-fill' | 'parking-line' | 'pass-expired-fill' | 'pass-expired-line' | 'pass-pending-fill' | 'pass-pending-line' | 'pass-valid-fill' | 'pass-valid-line' | 'passport-fill' | 'passport-line' | 'patreon-fill' | 'patreon-line' | 'pause-circle-fill' | 'pause-circle-line' | 'pause-fill' | 'pause-large-fill' | 'pause-large-line' | 'pause-line' | 'pause-mini-fill' | 'pause-mini-line' | 'paypal-fill' | 'paypal-line' | 'pen-nib-fill' | 'pen-nib-line' | 'pencil-ai-2-fill' | 'pencil-ai-2-line' | 'pencil-ai-fill' | 'pencil-ai-line' | 'pencil-fill' | 'pencil-line' | 'pencil-ruler-2-fill' | 'pencil-ruler-2-line' | 'pencil-ruler-fill' | 'pencil-ruler-line' | 'pentagon-fill' | 'pentagon-line' | 'percent-fill' | 'percent-line' | 'perplexity-fill' | 'perplexity-line' | 'phone-camera-fill' | 'phone-camera-line' | 'phone-fill' | 'phone-find-fill' | 'phone-find-line' | 'phone-line' | 'phone-lock-fill' | 'phone-lock-line' | 'php-fill' | 'php-line' | 'piano-fill' | 'piano-grand-fill' | 'piano-grand-line' | 'piano-line' | 'picture-in-picture-2-fill' | 'picture-in-picture-2-line' | 'picture-in-picture-exit-fill' | 'picture-in-picture-exit-line' | 'picture-in-picture-fill' | 'picture-in-picture-line' | 'pie-chart-2-fill' | 'pie-chart-2-line' | 'pie-chart-box-fill' | 'pie-chart-box-line' | 'pie-chart-fill' | 'pie-chart-line' | 'pin-distance-fill' | 'pin-distance-line' | 'ping-pong-fill' | 'ping-pong-line' | 'pinterest-fill' | 'pinterest-line' | 'pinyin-input' | 'pix-fill' | 'pix-line' | 'pixelfed-fill' | 'pixelfed-line' | 'plane-fill' | 'plane-line' | 'planet-fill' | 'planet-line' | 'plant-fill' | 'plant-line' | 'play-circle-fill' | 'play-circle-line' | 'play-fill' | 'play-large-fill' | 'play-large-line' | 'play-line' | 'play-list-2-fill' | 'play-list-2-line' | 'play-list-add-fill' | 'play-list-add-line' | 'play-list-fill' | 'play-list-line' | 'play-mini-fill' | 'play-mini-line' | 'play-reverse-fill' | 'play-reverse-large-fill' | 'play-reverse-large-line' | 'play-reverse-line' | 'play-reverse-mini-fill' | 'play-reverse-mini-line' | 'playstation-fill' | 'playstation-line' | 'plug-2-fill' | 'plug-2-line' | 'plug-3-fill' | 'plug-3-line' | 'plug-fill' | 'plug-line' | 'poker-clubs-fill' | 'poker-clubs-line' | 'poker-diamonds-fill' | 'poker-diamonds-line' | 'poker-hearts-fill' | 'poker-hearts-line' | 'poker-spades-fill' | 'poker-spades-line' | 'polaroid-2-fill' | 'polaroid-2-line' | 'polaroid-fill' | 'polaroid-line' | 'police-badge-fill' | 'police-badge-line' | 'police-car-fill' | 'police-car-line' | 'presentation-fill' | 'presentation-line' | 'price-tag-2-fill' | 'price-tag-2-line' | 'price-tag-3-fill' | 'price-tag-3-line' | 'price-tag-fill' | 'price-tag-line' | 'printer-cloud-fill' | 'printer-cloud-line' | 'printer-fill' | 'printer-line' | 'product-hunt-fill' | 'product-hunt-line' | 'profile-fill' | 'profile-line' | 'progress-1-fill' | 'progress-1-line' | 'progress-2-fill' | 'progress-2-line' | 'progress-3-fill' | 'progress-3-line' | 'progress-4-fill' | 'progress-4-line' | 'progress-5-fill' | 'progress-5-line' | 'progress-6-fill' | 'progress-6-line' | 'progress-7-fill' | 'progress-7-line' | 'progress-8-fill' | 'progress-8-line' | 'prohibited-2-fill' | 'prohibited-2-line' | 'prohibited-fill' | 'prohibited-line' | 'projector-2-fill' | 'projector-2-line' | 'projector-fill' | 'projector-line' | 'psychotherapy-fill' | 'psychotherapy-line' | 'pulse-ai-fill' | 'pulse-ai-line' | 'pulse-fill' | 'pulse-line' | 'pushpin-2-fill' | 'pushpin-2-line' | 'pushpin-fill' | 'pushpin-line' | 'puzzle-2-fill' | 'puzzle-2-line' | 'puzzle-fill' | 'puzzle-line' | 'qq-fill' | 'qq-line' | 'qr-code-fill' | 'qr-code-line' | 'qr-scan-2-fill' | 'qr-scan-2-line' | 'qr-scan-fill' | 'qr-scan-line' | 'question-answer-fill' | 'question-answer-line' | 'question-fill' | 'question-line' | 'question-mark' | 'questionnaire-fill' | 'questionnaire-line' | 'quill-pen-ai-fill' | 'quill-pen-ai-line' | 'quill-pen-fill' | 'quill-pen-line' | 'quote-text' | 'radar-fill' | 'radar-line' | 'radio-2-fill' | 'radio-2-line' | 'radio-button-fill' | 'radio-button-line' | 'radio-fill' | 'radio-line' | 'rainbow-fill' | 'rainbow-line' | 'rainy-fill' | 'rainy-line' | 'ram-2-fill' | 'ram-2-line' | 'ram-fill' | 'ram-line' | 'reactjs-fill' | 'reactjs-line' | 'receipt-fill' | 'receipt-line' | 'record-circle-fill' | 'record-circle-line' | 'record-mail-fill' | 'record-mail-line' | 'rectangle-fill' | 'rectangle-line' | 'recycle-fill' | 'recycle-line' | 'red-packet-fill' | 'red-packet-line' | 'reddit-fill' | 'reddit-line' | 'refresh-fill' | 'refresh-line' | 'refund-2-fill' | 'refund-2-line' | 'refund-fill' | 'refund-line' | 'registered-fill' | 'registered-line' | 'remix-fill' | 'remix-line' | 'remix-run-fill' | 'remix-run-line' | 'remixicon-fill' | 'remixicon-line' | 'remote-control-2-fill' | 'remote-control-2-line' | 'remote-control-fill' | 'remote-control-line' | 'repeat-2-fill' | 'repeat-2-line' | 'repeat-fill' | 'repeat-line' | 'repeat-one-fill' | 'repeat-one-line' | 'replay-10-fill' | 'replay-10-line' | 'replay-15-fill' | 'replay-15-line' | 'replay-30-fill' | 'replay-30-line' | 'replay-5-fill' | 'replay-5-line' | 'reply-all-fill' | 'reply-all-line' | 'reply-fill' | 'reply-line' | 'reserved-fill' | 'reserved-line' | 'reset-left-fill' | 'reset-left-line' | 'reset-right-fill' | 'reset-right-line' | 'rest-time-fill' | 'rest-time-line' | 'restart-fill' | 'restart-line' | 'restaurant-2-fill' | 'restaurant-2-line' | 'restaurant-fill' | 'restaurant-line' | 'rewind-fill' | 'rewind-line' | 'rewind-mini-fill' | 'rewind-mini-line' | 'rewind-start-fill' | 'rewind-start-line' | 'rewind-start-mini-fill' | 'rewind-start-mini-line' | 'rfid-fill' | 'rfid-line' | 'rhythm-fill' | 'rhythm-line' | 'riding-fill' | 'riding-line' | 'road-map-fill' | 'road-map-line' | 'roadster-fill' | 'roadster-line' | 'robot-2-fill' | 'robot-2-line' | 'robot-3-fill' | 'robot-3-line' | 'robot-fill' | 'robot-line' | 'rocket-2-fill' | 'rocket-2-line' | 'rocket-fill' | 'rocket-line' | 'rotate-lock-fill' | 'rotate-lock-line' | 'rounded-corner' | 'route-fill' | 'route-line' | 'router-fill' | 'router-line' | 'rss-fill' | 'rss-line' | 'ruler-2-fill' | 'ruler-2-line' | 'ruler-fill' | 'ruler-line' | 'run-fill' | 'run-line' | 'safari-fill' | 'safari-line' | 'safe-2-fill' | 'safe-2-line' | 'safe-3-fill' | 'safe-3-line' | 'safe-fill' | 'safe-line' | 'sailboat-fill' | 'sailboat-line' | 'save-2-fill' | 'save-2-line' | 'save-3-fill' | 'save-3-line' | 'save-fill' | 'save-line' | 'scales-2-fill' | 'scales-2-line' | 'scales-3-fill' | 'scales-3-line' | 'scales-fill' | 'scales-line' | 'scan-2-fill' | 'scan-2-line' | 'scan-fill' | 'scan-line' | 'school-fill' | 'school-line' | 'scissors-2-fill' | 'scissors-2-line' | 'scissors-cut-fill' | 'scissors-cut-line' | 'scissors-fill' | 'scissors-line' | 'screenshot-2-fill' | 'screenshot-2-line' | 'screenshot-fill' | 'screenshot-line' | 'scroll-to-bottom-fill' | 'scroll-to-bottom-line' | 'sd-card-fill' | 'sd-card-line' | 'sd-card-mini-fill' | 'sd-card-mini-line' | 'search-2-fill' | 'search-2-line' | 'search-ai-2-fill' | 'search-ai-2-line' | 'search-ai-3-fill' | 'search-ai-3-line' | 'search-ai-4-fill' | 'search-ai-4-line' | 'search-ai-fill' | 'search-ai-line' | 'search-eye-fill' | 'search-eye-line' | 'search-fill' | 'search-line' | 'secure-payment-fill' | 'secure-payment-line' | 'seedling-fill' | 'seedling-line' | 'send-backward' | 'send-ins-fill' | 'send-ins-line' | 'send-plane-2-fill' | 'send-plane-2-line' | 'send-plane-fill' | 'send-plane-line' | 'send-to-back' | 'sensor-fill' | 'sensor-line' | 'seo-fill' | 'seo-line' | 'separator' | 'server-fill' | 'server-line' | 'service-bell-fill' | 'service-bell-line' | 'service-fill' | 'service-line' | 'settings-2-fill' | 'settings-2-line' | 'settings-3-fill' | 'settings-3-line' | 'settings-4-fill' | 'settings-4-line' | 'settings-5-fill' | 'settings-5-line' | 'settings-6-fill' | 'settings-6-line' | 'settings-fill' | 'settings-line' | 'shadow-fill' | 'shadow-line' | 'shake-hands-fill' | 'shake-hands-line' | 'shape-2-fill' | 'shape-2-line' | 'shape-fill' | 'shape-line' | 'shapes-fill' | 'shapes-line' | 'share-2-fill' | 'share-2-line' | 'share-box-fill' | 'share-box-line' | 'share-circle-fill' | 'share-circle-line' | 'share-fill' | 'share-forward-2-fill' | 'share-forward-2-line' | 'share-forward-box-fill' | 'share-forward-box-line' | 'share-forward-fill' | 'share-forward-line' | 'share-line' | 'shield-check-fill' | 'shield-check-line' | 'shield-cross-fill' | 'shield-cross-line' | 'shield-fill' | 'shield-flash-fill' | 'shield-flash-line' | 'shield-keyhole-fill' | 'shield-keyhole-line' | 'shield-line' | 'shield-star-fill' | 'shield-star-line' | 'shield-user-fill' | 'shield-user-line' | 'shining-2-fill' | 'shining-2-line' | 'shining-fill' | 'shining-line' | 'ship-2-fill' | 'ship-2-line' | 'ship-fill' | 'ship-line' | 'shirt-fill' | 'shirt-line' | 'shopping-bag-2-fill' | 'shopping-bag-2-line' | 'shopping-bag-3-fill' | 'shopping-bag-3-line' | 'shopping-bag-4-fill' | 'shopping-bag-4-line' | 'shopping-bag-fill' | 'shopping-bag-line' | 'shopping-basket-2-fill' | 'shopping-basket-2-line' | 'shopping-basket-fill' | 'shopping-basket-line' | 'shopping-cart-2-fill' | 'shopping-cart-2-line' | 'shopping-cart-fill' | 'shopping-cart-line' | 'showers-fill' | 'showers-line' | 'shuffle-fill' | 'shuffle-line' | 'shut-down-fill' | 'shut-down-line' | 'side-bar-fill' | 'side-bar-line' | 'sidebar-fold-fill' | 'sidebar-fold-line' | 'sidebar-unfold-fill' | 'sidebar-unfold-line' | 'signal-cellular-1-fill' | 'signal-cellular-1-line' | 'signal-cellular-2-fill' | 'signal-cellular-2-line' | 'signal-cellular-3-fill' | 'signal-cellular-3-line' | 'signal-cellular-off-fill' | 'signal-cellular-off-line' | 'signal-tower-fill' | 'signal-tower-line' | 'signal-wifi-1-fill' | 'signal-wifi-1-line' | 'signal-wifi-2-fill' | 'signal-wifi-2-line' | 'signal-wifi-3-fill' | 'signal-wifi-3-line' | 'signal-wifi-error-fill' | 'signal-wifi-error-line' | 'signal-wifi-fill' | 'signal-wifi-line' | 'signal-wifi-off-fill' | 'signal-wifi-off-line' | 'signpost-fill' | 'signpost-line' | 'sim-card-2-fill' | 'sim-card-2-line' | 'sim-card-fill' | 'sim-card-line' | 'single-quotes-l' | 'single-quotes-r' | 'sip-fill' | 'sip-line' | 'sketching' | 'skip-back-fill' | 'skip-back-line' | 'skip-back-mini-fill' | 'skip-back-mini-line' | 'skip-down-fill' | 'skip-down-line' | 'skip-forward-fill' | 'skip-forward-line' | 'skip-forward-mini-fill' | 'skip-forward-mini-line' | 'skip-left-fill' | 'skip-left-line' | 'skip-right-fill' | 'skip-right-line' | 'skip-up-fill' | 'skip-up-line' | 'skull-2-fill' | 'skull-2-line' | 'skull-fill' | 'skull-line' | 'skype-fill' | 'skype-line' | 'slack-fill' | 'slack-line' | 'slash-commands' | 'slash-commands-2' | 'slice-fill' | 'slice-line' | 'slideshow-2-fill' | 'slideshow-2-line' | 'slideshow-3-fill' | 'slideshow-3-line' | 'slideshow-4-fill' | 'slideshow-4-line' | 'slideshow-fill' | 'slideshow-line' | 'slideshow-view' | 'slow-down-fill' | 'slow-down-line' | 'smartphone-fill' | 'smartphone-line' | 'snapchat-fill' | 'snapchat-line' | 'snowflake-fill' | 'snowflake-line' | 'snowy-fill' | 'snowy-line' | 'sofa-fill' | 'sofa-line' | 'sort-alphabet-asc' | 'sort-alphabet-desc' | 'sort-asc' | 'sort-desc' | 'sort-number-asc' | 'sort-number-desc' | 'sound-module-fill' | 'sound-module-line' | 'soundcloud-fill' | 'soundcloud-line' | 'space' | 'space-ship-fill' | 'space-ship-line' | 'spam-2-fill' | 'spam-2-line' | 'spam-3-fill' | 'spam-3-line' | 'spam-fill' | 'spam-line' | 'sparkling-2-fill' | 'sparkling-2-line' | 'sparkling-fill' | 'sparkling-line' | 'speak-ai-fill' | 'speak-ai-line' | 'speak-fill' | 'speak-line' | 'speaker-2-fill' | 'speaker-2-line' | 'speaker-3-fill' | 'speaker-3-line' | 'speaker-fill' | 'speaker-line' | 'spectrum-fill' | 'spectrum-line' | 'speech-to-text-fill' | 'speech-to-text-line' | 'speed-fill' | 'speed-line' | 'speed-mini-fill' | 'speed-mini-line' | 'speed-up-fill' | 'speed-up-line' | 'split-cells-horizontal' | 'split-cells-vertical' | 'spotify-fill' | 'spotify-line' | 'spy-fill' | 'spy-line' | 'square-fill' | 'square-line' | 'square-root' | 'stack-fill' | 'stack-line' | 'stack-overflow-fill' | 'stack-overflow-line' | 'stacked-chart-fill' | 'stacked-chart-line' | 'stacked-view' | 'stackshare-fill' | 'stackshare-line' | 'stairs-fill' | 'stairs-line' | 'star-fill' | 'star-half-fill' | 'star-half-line' | 'star-half-s-fill' | 'star-half-s-line' | 'star-line' | 'star-off-fill' | 'star-off-line' | 'star-s-fill' | 'star-s-line' | 'star-smile-fill' | 'star-smile-line' | 'steam-fill' | 'steam-line' | 'steering-2-fill' | 'steering-2-line' | 'steering-fill' | 'steering-line' | 'stethoscope-fill' | 'stethoscope-line' | 'sticky-note-2-fill' | 'sticky-note-2-line' | 'sticky-note-add-fill' | 'sticky-note-add-line' | 'sticky-note-fill' | 'sticky-note-line' | 'stock-fill' | 'stock-line' | 'stop-circle-fill' | 'stop-circle-line' | 'stop-fill' | 'stop-large-fill' | 'stop-large-line' | 'stop-line' | 'stop-mini-fill' | 'stop-mini-line' | 'store-2-fill' | 'store-2-line' | 'store-3-fill' | 'store-3-line' | 'store-fill' | 'store-line' | 'strikethrough' | 'strikethrough-2' | 'subscript' | 'subscript-2' | 'subtract-fill' | 'subtract-line' | 'subway-fill' | 'subway-line' | 'subway-wifi-fill' | 'subway-wifi-line' | 'suitcase-2-fill' | 'suitcase-2-line' | 'suitcase-3-fill' | 'suitcase-3-line' | 'suitcase-fill' | 'suitcase-line' | 'sun-cloudy-fill' | 'sun-cloudy-line' | 'sun-fill' | 'sun-foggy-fill' | 'sun-foggy-line' | 'sun-line' | 'supabase-fill' | 'supabase-line' | 'superscript' | 'superscript-2' | 'surgical-mask-fill' | 'surgical-mask-line' | 'surround-sound-fill' | 'surround-sound-line' | 'survey-fill' | 'survey-line' | 'svelte-fill' | 'svelte-line' | 'swap-2-fill' | 'swap-2-line' | 'swap-3-fill' | 'swap-3-line' | 'swap-box-fill' | 'swap-box-line' | 'swap-fill' | 'swap-line' | 'switch-fill' | 'switch-line' | 'sword-fill' | 'sword-line' | 'syringe-fill' | 'syringe-line' | 't-box-fill' | 't-box-line' | 't-shirt-2-fill' | 't-shirt-2-line' | 't-shirt-air-fill' | 't-shirt-air-line' | 't-shirt-fill' | 't-shirt-line' | 'table-2' | 'table-3' | 'table-alt-fill' | 'table-alt-line' | 'table-fill' | 'table-line' | 'table-view' | 'tablet-fill' | 'tablet-line' | 'tailwind-css-fill' | 'tailwind-css-line' | 'takeaway-fill' | 'takeaway-line' | 'taobao-fill' | 'taobao-line' | 'tape-fill' | 'tape-line' | 'target-fill' | 'target-line' | 'task-fill' | 'task-line' | 'taxi-fill' | 'taxi-line' | 'taxi-wifi-fill' | 'taxi-wifi-line' | 'team-fill' | 'team-line' | 'telegram-2-fill' | 'telegram-2-line' | 'telegram-fill' | 'telegram-line' | 'temp-cold-fill' | 'temp-cold-line' | 'temp-hot-fill' | 'temp-hot-line' | 'tent-fill' | 'tent-line' | 'terminal-box-fill' | 'terminal-box-line' | 'terminal-fill' | 'terminal-line' | 'terminal-window-fill' | 'terminal-window-line' | 'test-tube-fill' | 'test-tube-line' | 'text' | 'text-block' | 'text-direction-l' | 'text-direction-r' | 'text-snippet' | 'text-spacing' | 'text-to-speech-fill' | 'text-to-speech-line' | 'text-wrap' | 'thermometer-fill' | 'thermometer-line' | 'threads-fill' | 'threads-line' | 'thumb-down-fill' | 'thumb-down-line' | 'thumb-up-fill' | 'thumb-up-line' | 'thunderstorms-fill' | 'thunderstorms-line' | 'ticket-2-fill' | 'ticket-2-line' | 'ticket-fill' | 'ticket-line' | 'tiktok-fill' | 'tiktok-line' | 'time-fill' | 'time-line' | 'time-zone-fill' | 'time-zone-line' | 'timeline-view' | 'timer-2-fill' | 'timer-2-line' | 'timer-fill' | 'timer-flash-fill' | 'timer-flash-line' | 'timer-line' | 'todo-fill' | 'todo-line' | 'toggle-fill' | 'toggle-line' | 'token-swap-fill' | 'token-swap-line' | 'tools-fill' | 'tools-line' | 'tooth-fill' | 'tooth-line' | 'tornado-fill' | 'tornado-line' | 'trademark-fill' | 'trademark-line' | 'traffic-light-fill' | 'traffic-light-line' | 'train-fill' | 'train-line' | 'train-wifi-fill' | 'train-wifi-line' | 'translate' | 'translate-2' | 'translate-ai' | 'translate-ai-2' | 'travesti-fill' | 'travesti-line' | 'treasure-map-fill' | 'treasure-map-line' | 'tree-fill' | 'tree-line' | 'trello-fill' | 'trello-line' | 'triangle-fill' | 'triangle-line' | 'triangular-flag-fill' | 'triangular-flag-line' | 'trophy-fill' | 'trophy-line' | 'truck-fill' | 'truck-line' | 'tumblr-fill' | 'tumblr-line' | 'tv-2-fill' | 'tv-2-line' | 'tv-fill' | 'tv-line' | 'twitch-fill' | 'twitch-line' | 'twitter-fill' | 'twitter-line' | 'twitter-x-fill' | 'twitter-x-line' | 'typhoon-fill' | 'typhoon-line' | 'u-disk-fill' | 'u-disk-line' | 'ubuntu-fill' | 'ubuntu-line' | 'umbrella-fill' | 'umbrella-line' | 'underline' | 'uninstall-fill' | 'uninstall-line' | 'unpin-fill' | 'unpin-line' | 'unsplash-fill' | 'unsplash-line' | 'upload-2-fill' | 'upload-2-line' | 'upload-cloud-2-fill' | 'upload-cloud-2-line' | 'upload-cloud-fill' | 'upload-cloud-line' | 'upload-fill' | 'upload-line' | 'upwork-fill' | 'upwork-line' | 'usb-fill' | 'usb-line' | 'user-2-fill' | 'user-2-line' | 'user-3-fill' | 'user-3-line' | 'user-4-fill' | 'user-4-line' | 'user-5-fill' | 'user-5-line' | 'user-6-fill' | 'user-6-line' | 'user-add-fill' | 'user-add-line' | 'user-community-fill' | 'user-community-line' | 'user-fill' | 'user-follow-fill' | 'user-follow-line' | 'user-forbid-fill' | 'user-forbid-line' | 'user-heart-fill' | 'user-heart-line' | 'user-line' | 'user-location-fill' | 'user-location-line' | 'user-minus-fill' | 'user-minus-line' | 'user-received-2-fill' | 'user-received-2-line' | 'user-received-fill' | 'user-received-line' | 'user-search-fill' | 'user-search-line' | 'user-settings-fill' | 'user-settings-line' | 'user-shared-2-fill' | 'user-shared-2-line' | 'user-shared-fill' | 'user-shared-line' | 'user-smile-fill' | 'user-smile-line' | 'user-star-fill' | 'user-star-line' | 'user-unfollow-fill' | 'user-unfollow-line' | 'user-voice-fill' | 'user-voice-line' | 'vercel-fill' | 'vercel-line' | 'verified-badge-fill' | 'verified-badge-line' | 'video-add-fill' | 'video-add-line' | 'video-ai-fill' | 'video-ai-line' | 'video-chat-fill' | 'video-chat-line' | 'video-download-fill' | 'video-download-line' | 'video-fill' | 'video-line' | 'video-off-fill' | 'video-off-line' | 'video-on-ai-fill' | 'video-on-ai-line' | 'video-on-fill' | 'video-on-line' | 'video-upload-fill' | 'video-upload-line' | 'vidicon-2-fill' | 'vidicon-2-line' | 'vidicon-fill' | 'vidicon-line' | 'vimeo-fill' | 'vimeo-line' | 'vip-crown-2-fill' | 'vip-crown-2-line' | 'vip-crown-fill' | 'vip-crown-line' | 'vip-diamond-fill' | 'vip-diamond-line' | 'vip-fill' | 'vip-line' | 'virus-fill' | 'virus-line' | 'visa-fill' | 'visa-line' | 'vk-fill' | 'vk-line' | 'voice-ai-fill' | 'voice-ai-line' | 'voice-recognition-fill' | 'voice-recognition-line' | 'voiceprint-fill' | 'voiceprint-line' | 'volume-down-fill' | 'volume-down-line' | 'volume-mute-fill' | 'volume-mute-line' | 'volume-off-vibrate-fill' | 'volume-off-vibrate-line' | 'volume-up-fill' | 'volume-up-line' | 'volume-vibrate-fill' | 'volume-vibrate-line' | 'vuejs-fill' | 'vuejs-line' | 'walk-fill' | 'walk-line' | 'wallet-2-fill' | 'wallet-2-line' | 'wallet-3-fill' | 'wallet-3-line' | 'wallet-fill' | 'wallet-line' | 'water-flash-fill' | 'water-flash-line' | 'water-percent-fill' | 'water-percent-line' | 'webcam-fill' | 'webcam-line' | 'webhook-fill' | 'webhook-line' | 'wechat-2-fill' | 'wechat-2-line' | 'wechat-channels-fill' | 'wechat-channels-line' | 'wechat-fill' | 'wechat-line' | 'wechat-pay-fill' | 'wechat-pay-line' | 'weibo-fill' | 'weibo-line' | 'weight-fill' | 'weight-line' | 'whatsapp-fill' | 'whatsapp-line' | 'wheelchair-fill' | 'wheelchair-line' | 'wifi-fill' | 'wifi-line' | 'wifi-off-fill' | 'wifi-off-line' | 'window-2-fill' | 'window-2-line' | 'window-fill' | 'window-line' | 'windows-fill' | 'windows-line' | 'windy-fill' | 'windy-line' | 'wireless-charging-fill' | 'wireless-charging-line' | 'women-fill' | 'women-line' | 'wordpress-fill' | 'wordpress-line' | 'wrench-fill' | 'wrench-line' | 'wubi-input' | 'xbox-fill' | 'xbox-line' | 'xing-fill' | 'xing-line' | 'xrp-fill' | 'xrp-line' | 'xtz-fill' | 'xtz-line' | 'youtube-fill' | 'youtube-line' | 'yuque-fill' | 'yuque-line' | 'zcool-fill' | 'zcool-line' | 'zhihu-fill' | 'zhihu-line' | 'zoom-in-fill' | 'zoom-in-line' | 'zoom-out-fill' | 'zoom-out-line' | 'zzz-fill' | 'zzz-line';
+
+/** Hearthscale's own marks, which the kit's sheet draws beside the font's:
+ *  the sidebar open wide and folded narrow. */
+type OwnIconName = 'side-wide' | 'side-narrow';
+interface IconProps {
+    /** The icon's name on https://remixicon.com/, such as `mail-line`, or
+     *  one of Hearthscale's own marks. */
+    name: IconName | OwnIconName;
+    /** The mark's size in pixels; without one, the font size around it. */
+    size?: number;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * A Remix Icon of the font the host loads into every view, or one of
+ * Hearthscale's own marks, in the colour of the text around it. `hs-icon`
+ * gives it the box of its size and the rules of the design system's drawn
+ * marks: the dim ink in a picker or a search field, and the press of the
+ * control it sits in.
+ */
+declare function Icon({ name, size, className, style }: IconProps): react.JSX.Element;
+
+export { Button, Card, Chip, DateGrid, DatePicker, EmptyState, FactRow, Icon, IconButton, InfoRow, Kbd, Label, Lightbox, LinkRow, ListRow, MDivider, MItem, MSection, MSub, MenuSurface, Meter, ModelAvatar, Mono, Notice, OverlayScroll, PageTitle, PersonMark, PictureCompare, Popover, PublisherPicturesContext, SWATCHES, SegmentedControl, SettingsCard, SettingsSearch, SettingsSection, SettingsSelect, SettingsTabs, ShellConfirm, Slider, StatusWord, SwatchPicker, TextField, TextInput, TimePicker, Toast, Toggle, ToggleRow, VirtualList, anchorFrom, useFloatingTips };
+export type { ButtonProps, ButtonSize, ButtonVariant, CardProps, ChipProps, ChipTone, ComparedPicture, DateGridProps, DatePickerProps, EmptyStateProps, IconButtonProps, IconButtonSize, IconName, IconProps, LightboxItem, LightboxProps, MenuAnchor, MeterProps, OverlayScrollProps, OwnIconName, PageTitleProps, PersonMarkProps, PictureCompareProps, PlainDate, PlainTime, PopoverPlacement, PopoverProps, PublisherPictures, SegmentedControlProps, ShellConfirmProps, SliderProps, StatusTone, StatusWordProps, Swatch, SwatchPickerProps, TextFieldProps, TextInputProps, TimePickerProps, ToastProps, ToggleProps, VirtualListHandle, VirtualListProps };