@logicplanes/kaeso-ui 0.1.0

package/dist/types/components/input/input-group.d.ts

@@ -0,0 +1,55 @@
+import type * as React from "react";
+import { type HTMLAttributes, type InputHTMLAttributes } from "react";
+import { type IconData, type IconSize } from "../icon/icon.js";
+export declare const KAESO_INPUT_GROUP_VARIANTS: {
+    readonly size: {
+        readonly sm: {
+            readonly classes: "h-32 px-12 gap-6 text-body";
+            readonly description: "32px: toolbars and compact forms";
+        };
+        readonly md: {
+            readonly classes: "h-36 px-16 gap-8 text-body";
+            readonly description: "36px: the default";
+        };
+        readonly lg: {
+            readonly classes: "h-40 px-18 gap-8 text-body";
+            readonly description: "40px";
+        };
+        readonly xl: {
+            readonly classes: "h-48 px-22 gap-8 text-body-lg";
+            readonly description: "48px: sign-in and setup forms";
+        };
+    };
+};
+export declare const KAESO_INPUT_GROUP_DEFAULT_VARIANTS: {
+    readonly size: "md";
+};
+export type InputSize = keyof typeof KAESO_INPUT_GROUP_VARIANTS.size;
+export declare const INPUT_ICON_SIZE: Record<InputSize, IconSize>;
+export interface InputGroupProps extends HTMLAttributes<HTMLDivElement> {
+    size?: InputSize | undefined;
+    leadingIcon?: boolean | undefined;
+    trailingButton?: boolean | undefined;
+    invalid?: boolean | undefined;
+    disabled?: boolean | undefined;
+    readOnly?: boolean | undefined;
+    "data-force"?: string | undefined;
+}
+export interface InputGroupInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+}
+export interface InputGroupAddonProps extends HTMLAttributes<HTMLSpanElement> {
+    icon?: IconData | undefined;
+}
+export interface InputGroupButtonProps {
+    icon: IconData;
+    "aria-label": string;
+    onClick?: (() => void) | undefined;
+    disabled?: boolean | undefined;
+    className?: string | undefined;
+}
+export declare const InputGroup: React.ForwardRefExoticComponent<InputGroupProps & React.RefAttributes<HTMLDivElement>> & {
+    Input: React.ForwardRefExoticComponent<InputGroupInputProps & React.RefAttributes<HTMLInputElement>>;
+    Addon: React.ForwardRefExoticComponent<InputGroupAddonProps & React.RefAttributes<HTMLSpanElement>>;
+    Button: React.ForwardRefExoticComponent<InputGroupButtonProps & React.RefAttributes<HTMLButtonElement>>;
+};
+export declare const useInputGroupSize: () => "sm" | "md" | "lg" | "xl";

package/dist/types/components/input/input.d.ts

@@ -0,0 +1,45 @@
+import { type InputHTMLAttributes, type ReactNode } from "react";
+import { type FieldWrapProps } from "../field/field.js";
+import { type InputSize } from "./input-group.js";
+import { type IconData } from "../icon/icon.js";
+export declare const KAESO_INPUT_VARIANTS: {
+    readonly size: {
+        readonly sm: {
+            readonly classes: "h-32";
+            readonly description: "32px: toolbars and compact forms";
+        };
+        readonly md: {
+            readonly classes: "h-36";
+            readonly description: "36px: the default";
+        };
+        readonly lg: {
+            readonly classes: "h-40";
+            readonly description: "40px";
+        };
+        readonly xl: {
+            readonly classes: "h-48";
+            readonly description: "48px: sign-in and setup forms";
+        };
+    };
+};
+export declare const KAESO_INPUT_DEFAULT_VARIANTS: {
+    readonly size: "md";
+};
+export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "prefix">, FieldWrapProps {
+    size?: InputSize | undefined;
+    leadingIcon?: IconData | undefined;
+    prefix?: ReactNode | undefined;
+    suffix?: ReactNode | undefined;
+    trailing?: ReactNode | undefined;
+    invalid?: boolean | undefined;
+    align?: "start" | "end" | undefined;
+    "data-force"?: string | undefined;
+    className?: string | undefined;
+}
+export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
+export interface SearchInputProps extends Omit<InputProps, "leadingIcon" | "type" | "prefix" | "suffix"> {
+    shortcut?: string[] | undefined;
+    onClear?: (() => void) | undefined;
+    placeholder?: string | undefined;
+}
+export declare const SearchInput: import("react").ForwardRefExoticComponent<SearchInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/input/number-input.d.ts

@@ -0,0 +1,28 @@
+import { type InputProps } from "./input.js";
+export declare const KAESO_NUMBER_INPUT_VARIANTS: {
+    readonly align: {
+        readonly end: {
+            readonly classes: "text-right";
+            readonly description: "Right-aligned tabular digits (default)";
+        };
+        readonly start: {
+            readonly classes: "text-left";
+            readonly description: "Left-aligned";
+        };
+    };
+};
+export declare const KAESO_NUMBER_INPUT_DEFAULT_VARIANTS: {
+    readonly align: "end";
+};
+export interface NumberInputProps extends Omit<InputProps, "type" | "value" | "defaultValue" | "onChange" | "min" | "max" | "step"> {
+    value?: string | undefined;
+    defaultValue?: string | undefined;
+    onValueChange?: ((value: string) => void) | undefined;
+    unit?: string | undefined;
+    step?: string | undefined;
+    min?: string | undefined;
+    max?: string | undefined;
+    hideStepper?: boolean | undefined;
+    align?: keyof typeof KAESO_NUMBER_INPUT_VARIANTS.align | undefined;
+}
+export declare const NumberInput: import("react").ForwardRefExoticComponent<NumberInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/input/otp-input.d.ts

@@ -0,0 +1,27 @@
+import { type InputHTMLAttributes } from "react";
+export declare const KAESO_OTP_INPUT_VARIANTS: {
+    readonly size: {
+        readonly md: {
+            readonly classes: "size-48 text-title";
+            readonly description: "48px cells (default)";
+        };
+        readonly sm: {
+            readonly classes: "size-40 text-title-sm";
+            readonly description: "40px cells";
+        };
+    };
+};
+export declare const KAESO_OTP_INPUT_DEFAULT_VARIANTS: {
+    readonly size: "md";
+};
+export interface OTPInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "size" | "maxLength"> {
+    length?: number | undefined;
+    value?: string | undefined;
+    defaultValue?: string | undefined;
+    onValueChange?: ((value: string) => void) | undefined;
+    onComplete?: ((value: string) => void) | undefined;
+    invalid?: boolean | undefined;
+    size?: keyof typeof KAESO_OTP_INPUT_VARIANTS.size | undefined;
+    "data-force"?: string | undefined;
+}
+export declare const OTPInput: import("react").ForwardRefExoticComponent<OTPInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/input/sensitive-input.d.ts

@@ -0,0 +1,21 @@
+import { type InputProps } from "./input.js";
+export declare const KAESO_SENSITIVE_INPUT_VARIANTS: {
+    readonly kind: {
+        readonly secret: {
+            readonly classes: "";
+            readonly description: "Provider keys and tokens: never autocompleted (default)";
+        };
+        readonly password: {
+            readonly classes: "";
+            readonly description: "Passwords: browser password managers allowed, Caps Lock hint";
+        };
+    };
+};
+export declare const KAESO_SENSITIVE_INPUT_DEFAULT_VARIANTS: {
+    readonly kind: "secret";
+};
+export interface SensitiveInputProps extends Omit<InputProps, "type" | "trailing"> {
+    kind?: keyof typeof KAESO_SENSITIVE_INPUT_VARIANTS.kind | undefined;
+    defaultRevealed?: boolean | undefined;
+}
+export declare const SensitiveInput: import("react").ForwardRefExoticComponent<SensitiveInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/input/tag-input.d.ts

@@ -0,0 +1,27 @@
+import { type FieldWrapProps } from "../field/field.js";
+export declare const KAESO_TAG_INPUT_VARIANTS: {
+    readonly size: {
+        readonly md: {
+            readonly classes: "min-h-36 p-4";
+            readonly description: "36px at one row; grows as tags wrap (default)";
+        };
+    };
+};
+export declare const KAESO_TAG_INPUT_DEFAULT_VARIANTS: {
+    readonly size: "md";
+};
+export interface TagInputProps extends FieldWrapProps {
+    value?: string[] | undefined;
+    defaultValue?: string[] | undefined;
+    onValueChange?: ((value: string[]) => void) | undefined;
+    placeholder?: string | undefined;
+    validate?: ((tag: string) => true | string) | undefined;
+    separators?: string[] | undefined;
+    disabled?: boolean | undefined;
+    id?: string | undefined;
+    name?: string | undefined;
+    className?: string | undefined;
+    "aria-label"?: string | undefined;
+    "data-force"?: string | undefined;
+}
+export declare const TagInput: import("react").ForwardRefExoticComponent<TagInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/input/textarea.d.ts

@@ -0,0 +1,25 @@
+import { type TextareaHTMLAttributes } from "react";
+import { type FieldWrapProps } from "../field/field.js";
+export declare const KAESO_TEXTAREA_VARIANTS: {
+    readonly resize: {
+        readonly auto: {
+            readonly classes: "resize-none";
+            readonly description: "Grows with its content to 8 lines, then scrolls (default)";
+        };
+        readonly vertical: {
+            readonly classes: "resize-y";
+            readonly description: "People can drag it taller";
+        };
+    };
+};
+export declare const KAESO_TEXTAREA_DEFAULT_VARIANTS: {
+    readonly resize: "auto";
+};
+export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement>, FieldWrapProps {
+    resize?: keyof typeof KAESO_TEXTAREA_VARIANTS.resize | undefined;
+    maxRows?: number | undefined;
+    invalid?: boolean | undefined;
+    mono?: boolean | undefined;
+    "data-force"?: string | undefined;
+}
+export declare const Textarea: import("react").ForwardRefExoticComponent<TextareaProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/types/components/kaeso/conversation.d.ts

@@ -0,0 +1,58 @@
+import { type ReactNode } from "react";
+export declare const KAESO_CONVERSATION_VARIANTS: {
+    readonly density: {
+        readonly default: {
+            readonly classes: "gap-24";
+            readonly description: "24px between turns (default)";
+        };
+        readonly compact: {
+            readonly classes: "gap-16";
+            readonly description: "16px, inside sheets";
+        };
+    };
+};
+export declare const KAESO_CONVERSATION_DEFAULT_VARIANTS: {
+    readonly density: "default";
+};
+export type ContentBlock = {
+    type: "text";
+    text: string;
+} | {
+    type: "tool_call";
+    id?: string | undefined;
+    name: string;
+    arguments: unknown;
+} | {
+    type: "tool_result";
+    tool_call_id?: string | undefined;
+    content: string | ContentBlock[];
+    is_error?: boolean | undefined;
+} | {
+    type: "reasoning";
+    text: string;
+    redacted?: boolean | undefined;
+} | {
+    type: "image";
+    src?: string | undefined;
+    alt?: string | undefined;
+    media_type?: string | undefined;
+} | {
+    type: "document";
+    name?: string | undefined;
+    media_type?: string | undefined;
+} | {
+    type: "refusal";
+    text: string;
+};
+export interface ConversationMessage {
+    role: "system" | "user" | "assistant" | "tool" | "developer";
+    content: string | ContentBlock[];
+}
+export interface ConversationViewProps {
+    messages: ConversationMessage[];
+    density?: keyof typeof KAESO_CONVERSATION_VARIANTS.density | undefined;
+    markdown?: boolean | undefined;
+    className?: string | undefined;
+    footer?: ReactNode | undefined;
+}
+export declare const ConversationView: import("react").ForwardRefExoticComponent<ConversationViewProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/kaeso/docs.d.ts

@@ -0,0 +1,139 @@
+export declare const docs: {
+    ConversationView: {
+        description: string;
+        props: {
+            density: string;
+            footer: string;
+            markdown: string;
+            messages: string;
+        };
+    };
+    EffectiveAccess: {
+        description: string;
+        props: {
+            action: string;
+            "aria-label": string;
+            groups: string;
+            sources: string;
+        };
+    };
+    EnvironmentSnippet: {
+        description: string;
+        props: {
+            apiKey: string;
+            baseUrl: string;
+            model: string;
+        };
+    };
+    KeyDisplay: {
+        description: string;
+        props: {
+            access: string;
+            copy: string;
+            redacted: string;
+            state: string;
+        };
+    };
+    LimitMeter: {
+        description: string;
+        props: {
+            alerts: string;
+            hard: string;
+            kind: string;
+            limit: string;
+            resets: string;
+            scope: string;
+            used: string;
+            valueLabel: string;
+            window: string;
+        };
+    };
+    ModelLabel: {
+        description: string;
+        props: {
+            capabilities: string;
+            model: string;
+            name: string;
+            provider: string;
+        };
+    };
+    ProviderBadge: {
+        description: string;
+        props: {
+            provider: string;
+            size: string;
+            withName: string;
+        };
+    };
+    ProviderCard: {
+        description: string;
+        props: {
+            actions: string;
+            connected: string;
+            detail: string;
+            keyLabel: string;
+            provider: string;
+            status: string;
+        };
+    };
+    RequestTimeline: {
+        description: string;
+        props: {
+            totalMs: string;
+            ttfbMs: string;
+            width: string;
+        };
+    };
+    RightsMatrix: {
+        description: string;
+        props: {
+            "aria-label": string;
+            groups: string;
+            onChange: string;
+            onRightsChange: string;
+            originLabels: string;
+            readOnly: string;
+            searchable: string;
+        };
+    };
+    RolePicker: {
+        description: string;
+        props: {
+            appearance: string;
+            "aria-label": string;
+            disabled: string;
+            fullWidth: string;
+            label: string;
+            name: string;
+            onValueChange: string;
+            roles: string;
+            size: string;
+            value: string;
+        };
+    };
+    SecretReveal: {
+        description: string;
+        props: {
+            apiKey: string;
+            baseUrl: string;
+            model: string;
+            name: string;
+            onCopied: string;
+            secret: string;
+            snippets: string;
+        };
+    };
+    StatusCode: {
+        description: string;
+        props: {
+            code: string;
+            showText: string;
+        };
+    };
+    UsageBreakdown: {
+        description: string;
+        props: {
+            tokens: string;
+        };
+    };
+};

package/dist/types/components/kaeso/effective-access.d.ts

@@ -0,0 +1,21 @@
+import { type ReactNode } from "react";
+import type { RightSource, RightsGroup } from "./rights.js";
+export declare const KAESO_EFFECTIVE_ACCESS_VARIANTS: {
+    readonly layout: {
+        readonly rows: {
+            readonly classes: "flex flex-col @auth:grid @auth:grid-cols-term @auth:gap-x-16";
+            readonly description: "A row per group: its name, what is granted in words, and how many (default)";
+        };
+    };
+};
+export declare const KAESO_EFFECTIVE_ACCESS_DEFAULT_VARIANTS: {
+    readonly layout: "rows";
+};
+export interface EffectiveAccessProps {
+    groups: RightsGroup[];
+    sources?: RightSource[] | undefined;
+    action?: ReactNode | undefined;
+    "aria-label"?: string | undefined;
+    className?: string | undefined;
+}
+export declare const EffectiveAccess: import("react").ForwardRefExoticComponent<EffectiveAccessProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/kaeso/identity.d.ts

@@ -0,0 +1,70 @@
+import { type ReactNode } from "react";
+export declare const KAESO_IDENTITY_VARIANTS: {
+    readonly provider: {
+        readonly sm: {
+            readonly classes: "size-16 rounded-cell text-micro";
+            readonly description: "16px, inside table cells";
+        };
+        readonly md: {
+            readonly classes: "size-20 rounded-avatar text-micro";
+            readonly description: "20px (default)";
+        };
+        readonly lg: {
+            readonly classes: "size-28 rounded-org text-caption";
+            readonly description: "28px";
+        };
+        readonly xl: {
+            readonly classes: "size-40 rounded-org text-body";
+            readonly description: "40px: a provider's own page or card";
+        };
+    };
+};
+export declare const KAESO_IDENTITY_DEFAULT_VARIANTS: {
+    readonly provider: "md";
+};
+export declare const providerName: (id: string) => string;
+export declare const ProviderBadge: import("react").ForwardRefExoticComponent<{
+    provider: string;
+    size?: keyof typeof KAESO_IDENTITY_VARIANTS.provider | undefined;
+    withName?: boolean | undefined;
+    className?: string | undefined;
+} & import("react").RefAttributes<HTMLSpanElement>>;
+export type Capability = "tools" | "reasoning" | "vision" | "pdf" | "structuredOutput";
+export interface ModelLabelProps {
+    provider: string;
+    model: string;
+    name?: string | undefined;
+    capabilities?: Capability[] | undefined;
+    className?: string | undefined;
+}
+export declare const ModelLabel: import("react").ForwardRefExoticComponent<ModelLabelProps & import("react").RefAttributes<HTMLSpanElement>>;
+export type KeyState = "active" | "disabled" | "expired" | "archived";
+export interface KeyDisplayProps {
+    redacted: string;
+    state?: KeyState | undefined;
+    access?: "inference" | "platform" | "both" | undefined;
+    copy?: boolean | undefined;
+    className?: string | undefined;
+}
+export declare const KeyDisplay: import("react").ForwardRefExoticComponent<KeyDisplayProps & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const StatusCode: import("react").ForwardRefExoticComponent<{
+    code: number;
+    showText?: boolean | undefined;
+    className?: string | undefined;
+} & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const RequestTimeline: import("react").ForwardRefExoticComponent<{
+    ttfbMs: number;
+    totalMs: number;
+    width?: 160 | 240 | "full" | undefined;
+    className?: string | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export interface ProviderCardProps {
+    provider: string;
+    connected: boolean;
+    status: ReactNode;
+    keyLabel?: ReactNode | undefined;
+    detail?: ReactNode | undefined;
+    actions?: ReactNode | undefined;
+    className?: string | undefined;
+}
+export declare const ProviderCard: import("react").ForwardRefExoticComponent<ProviderCardProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/kaeso/index.d.ts

@@ -0,0 +1,8 @@
+export * from "./identity.js";
+export * from "./moments.js";
+export * from "./usage.js";
+export * from "./conversation.js";
+export * from "./rights.js";
+export * from "./rights-logic.js";
+export * from "./role-picker.js";
+export * from "./effective-access.js";

package/dist/types/components/kaeso/moments.d.ts

@@ -0,0 +1,30 @@
+import { type ReactNode } from "react";
+import { type CodeTab } from "../code-block/code-block.js";
+export declare const KAESO_MOMENTS_VARIANTS: {
+    readonly secret: {
+        readonly md: {
+            readonly classes: "rounded-well bg-fill-1 px-20 py-16";
+            readonly description: "The one-time secret on a well";
+        };
+    };
+};
+export declare const KAESO_MOMENTS_DEFAULT_VARIANTS: {
+    readonly secret: "md";
+};
+export interface SnippetOptions {
+    baseUrl: string;
+    apiKey?: string | undefined;
+    model?: string | undefined;
+}
+export declare function sdkSnippets({ baseUrl, apiKey, model }: SnippetOptions): CodeTab[];
+export interface SecretRevealProps extends SnippetOptions {
+    secret: string;
+    name?: ReactNode | undefined;
+    onCopied?: (() => void) | undefined;
+    snippets?: CodeTab[] | false | undefined;
+    className?: string | undefined;
+}
+export declare const SecretReveal: import("react").ForwardRefExoticComponent<SecretRevealProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const EnvironmentSnippet: import("react").ForwardRefExoticComponent<SnippetOptions & {
+    className?: string | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/kaeso/provider-marks.d.ts

@@ -0,0 +1 @@
+export declare const PROVIDER_MARKS: Record<string, string>;

package/dist/types/components/kaeso/rights-logic.d.ts

@@ -0,0 +1,13 @@
+export interface RightChange {
+    code: string;
+    granted: boolean;
+}
+interface Node {
+    code: string;
+    granted: boolean;
+    requires?: string[] | undefined;
+    disabled?: boolean | undefined;
+}
+export declare function rightsCascade(rights: readonly Node[], code: string, granted: boolean): RightChange[];
+export declare function groupCascade(all: readonly Node[], group: readonly Node[], granted: boolean): RightChange[];
+export {};

package/dist/types/components/kaeso/rights.d.ts

@@ -0,0 +1,69 @@
+import { type RightChange } from "./rights-logic.js";
+export declare const KAESO_RIGHTS_MATRIX_VARIANTS: {
+    readonly origin: {
+        readonly preset: {
+            readonly classes: "text-fg-tertiary";
+            readonly description: "Comes from the role";
+        };
+        readonly added: {
+            readonly classes: "text-success-text";
+            readonly description: "Added on top of the role";
+        };
+        readonly removed: {
+            readonly classes: "text-danger-text";
+            readonly description: "Removed from the role";
+        };
+        readonly none: {
+            readonly classes: "";
+            readonly description: "Not granted";
+        };
+    };
+    readonly mode: {
+        readonly edit: {
+            readonly classes: "";
+            readonly description: "Checkboxes, group toggles and requirement hints (default)";
+        };
+        readonly readOnly: {
+            readonly classes: "";
+            readonly description: "A mark per right and, under it, the roles that grant it";
+        };
+    };
+};
+export declare const KAESO_RIGHTS_MATRIX_DEFAULT_VARIANTS: {
+    readonly origin: "none";
+    readonly mode: "edit";
+};
+type Origin = keyof typeof KAESO_RIGHTS_MATRIX_VARIANTS.origin;
+export interface RightSource {
+    label: string;
+    detail?: string | undefined;
+}
+export interface Right {
+    code: string;
+    label?: string | undefined;
+    description: string;
+    granted: boolean;
+    origin?: Origin | undefined;
+    sensitive?: boolean | undefined;
+    requires?: string[] | undefined;
+    sources?: RightSource[] | undefined;
+    disabled?: boolean | undefined;
+    disabledReason?: string | undefined;
+}
+export interface RightsGroup {
+    label: string;
+    description?: string | undefined;
+    rights: Right[];
+}
+export interface RightsMatrixProps {
+    groups: RightsGroup[];
+    onChange?: ((code: string, granted: boolean) => void) | undefined;
+    onRightsChange?: ((changes: RightChange[]) => void) | undefined;
+    readOnly?: boolean | undefined;
+    searchable?: boolean | undefined;
+    originLabels?: Partial<Record<Origin, string>> | undefined;
+    "aria-label"?: string | undefined;
+    className?: string | undefined;
+}
+export declare const RightsMatrix: import("react").ForwardRefExoticComponent<RightsMatrixProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};