@kitn.ai/ui/dist/ui/notice.d.ts

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import { JSX } from 'solid-js';
export type NoticeSeverity = 'neutral' | 'info' | 'warning' | 'error' | 'success';
/** The default leading icon for a notice: `null` when `icon="none"`, the named
 *  icon when one is given, else the severity glyph. Exported so the `kai-notice`
 *  facade can use it as the fallback inside a `slot="icon"` escape hatch. */
export declare function noticeIconNode(severity: NoticeSeverity, icon?: string): JSX.Element;
export interface NoticeProps {
    severity?: NoticeSeverity;
    /** Leading icon: omit for the severity default, `"none"` to hide it, or a named
     *  icon to override. */
    icon?: string;
    /** A custom icon node that replaces the icon region entirely (the `kai-notice`
     *  facade passes a `slot="icon"` here, with the default icon as its fallback). */
    iconSlot?: JSX.Element;
    /** Render a dismiss (×) button that hides the notice and calls `onDismiss`. */
    dismissible?: boolean;
    /** Called after the notice is dismissed. */
    onDismiss?: () => void;
    /** The message. */
    children: JSX.Element;
    /** Optional trailing action (e.g. a link). */
    action?: JSX.Element;
    class?: string;
}
/**
 * A self-contained inline notice / alert: a leading severity icon, a message, an
 * optional trailing action, and an optional dismiss. Carries the right a11y role
 * (`alert` for errors, `status` otherwise). Placement is the consumer's — this is
 * just the notice box.
 */
export declare function Notice(props: NoticeProps): JSX.Element;