@cn-ui/core/dist/lib/timeline/TimeLine.d.ts

The @cn-ui/core is a collection of UI components and utilities for building modern web applications with SolidJS.

import { type Atom, type JSXSlot } from "@cn-ui/reactive";
import { type Accessor } from "solid-js";
import "./index.css";
interface StepOptions {
    /** 如果没有，则指定 label 为 key */
    key?: string;
    label: string;
    content?: JSXSlot;
    icon?: JSXSlot<{
        step: StepOptions;
        index: number;
    }>;
}
export interface TimelineProps {
    options: StepOptions[];
    pending?: Atom<boolean>;
    /** dev */
    reverse?: boolean;
    /** dev */
    alternate?: boolean;
    horizontal?: boolean;
    expose?: (expose: TimelineExpose) => void;
}
export type TimelineExpose = ReturnType<typeof useStepController>;
export declare const TimelineCtx: {
    use<D = {
        isCurrentPending: Atom<boolean>;
        StepKeyToOption: Accessor<Map<string, StepOptions>>;
        steps: Accessor<StepOptions[]>;
        syncModel(model: Atom<StepOptions>): void;
        stepNames: import("solid-js").Accessor<string[]>;
        index: import("solid-js").Accessor<number>;
        current: import("solid-js").Accessor<string>;
        next: import("solid-js").Accessor<string | undefined>;
        previous: import("solid-js").Accessor<string | undefined>;
        isFirst: import("solid-js").Accessor<boolean>;
        isLast: import("solid-js").Accessor<boolean>;
        at: (index: number) => string | undefined;
        get: (step: string) => string | undefined;
        goTo: (step: string) => void;
        goToNext: () => void;
        goToPrevious: () => void;
        goBackTo: (step: string) => void;
        isNext: (step: string) => boolean;
        isPrevious: (step: string) => boolean;
        isCurrent: (step: string) => boolean;
        isBefore: (step: string) => boolean;
        isAfter: (step: string) => boolean;
        getKeyFromOption: (i: StepOptions) => string;
    }>(): D;
    id: symbol;
    Provider: import("solid-js").ContextProviderComponent<{
        isCurrentPending: Atom<boolean>;
        StepKeyToOption: Accessor<Map<string, StepOptions>>;
        steps: Accessor<StepOptions[]>;
        syncModel(model: Atom<StepOptions>): void;
        stepNames: import("solid-js").Accessor<string[]>;
        index: import("solid-js").Accessor<number>;
        current: import("solid-js").Accessor<string>;
        next: import("solid-js").Accessor<string | undefined>;
        previous: import("solid-js").Accessor<string | undefined>;
        isFirst: import("solid-js").Accessor<boolean>;
        isLast: import("solid-js").Accessor<boolean>;
        at: (index: number) => string | undefined;
        get: (step: string) => string | undefined;
        goTo: (step: string) => void;
        goToNext: () => void;
        goToPrevious: () => void;
        goBackTo: (step: string) => void;
        isNext: (step: string) => boolean;
        isPrevious: (step: string) => boolean;
        isCurrent: (step: string) => boolean;
        isBefore: (step: string) => boolean;
        isAfter: (step: string) => boolean;
        getKeyFromOption: (i: StepOptions) => string;
    } | undefined>;
    defaultValue: {
        isCurrentPending: Atom<boolean>;
        StepKeyToOption: Accessor<Map<string, StepOptions>>;
        steps: Accessor<StepOptions[]>;
        syncModel(model: Atom<StepOptions>): void;
        stepNames: import("solid-js").Accessor<string[]>;
        index: import("solid-js").Accessor<number>;
        current: import("solid-js").Accessor<string>;
        next: import("solid-js").Accessor<string | undefined>;
        previous: import("solid-js").Accessor<string | undefined>;
        isFirst: import("solid-js").Accessor<boolean>;
        isLast: import("solid-js").Accessor<boolean>;
        at: (index: number) => string | undefined;
        get: (step: string) => string | undefined;
        goTo: (step: string) => void;
        goToNext: () => void;
        goToPrevious: () => void;
        goBackTo: (step: string) => void;
        isNext: (step: string) => boolean;
        isPrevious: (step: string) => boolean;
        isCurrent: (step: string) => boolean;
        isBefore: (step: string) => boolean;
        isAfter: (step: string) => boolean;
        getKeyFromOption: (i: StepOptions) => string;
    } | undefined;
};
export declare const Timeline: import("solid-js").Component<import("@cn-ui/reactive").OriginComponentOutputType<TimelineProps, HTMLUListElement, StepOptions>>;
declare function useStepController(steps: Accessor<StepOptions[]>, { isCurrentPending }: {
    isCurrentPending: Atom<boolean>;
}): {
    isCurrentPending: Atom<boolean>;
    StepKeyToOption: Accessor<Map<string, StepOptions>>;
    steps: Accessor<StepOptions[]>;
    syncModel(model: Atom<StepOptions>): void;
    stepNames: import("solid-js").Accessor<string[]>;
    index: import("solid-js").Accessor<number>;
    current: import("solid-js").Accessor<string>;
    next: import("solid-js").Accessor<string | undefined>;
    previous: import("solid-js").Accessor<string | undefined>;
    isFirst: import("solid-js").Accessor<boolean>;
    isLast: import("solid-js").Accessor<boolean>;
    at: (index: number) => string | undefined;
    get: (step: string) => string | undefined;
    goTo: (step: string) => void;
    goToNext: () => void;
    goToPrevious: () => void;
    goBackTo: (step: string) => void;
    isNext: (step: string) => boolean;
    isPrevious: (step: string) => boolean;
    isCurrent: (step: string) => boolean;
    isBefore: (step: string) => boolean;
    isAfter: (step: string) => boolean;
    getKeyFromOption: (i: StepOptions) => string;
};
export {};