hys-ui 0.3.0 → 0.4.0

package/dist/types/components/HysTour/HysTour.vue.d.ts

@@ -1,30 +1,67 @@
-import type { HysPopupMotionProps } from '../../motion/popup';
-type __VLS_Props = HysPopupMotionProps & {
-    steps: {
-        title: string;
-        description: string;
-    }[];
-    current?: number;
-    closeOnEscape?: boolean;
+import type { HysTourContext, HysTourProps } from "../../composables/tour";
+type __VLS_Props = HysTourProps;
+type __VLS_Slots = {
+    /** 自定义引导说明，接收当前步骤与导航方法。 */
+    default?: (context: HysTourContext) => unknown;
+    header?: (context: HysTourContext) => unknown;
+    cover?: (context: HysTourContext) => unknown;
+    indicators?: (context: HysTourContext) => unknown;
+    footer?: (context: HysTourContext) => unknown;
+    "close-icon"?: (context: HysTourContext) => unknown;
 };
+declare function goTo(value: number): void;
+declare function start(value?: number): void;
+declare function close(): void;
+declare function previous(): void;
+declare function next(): void;
 type __VLS_ModelProps = {
     modelValue?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
+    start: typeof start;
+    close: typeof close;
+    goTo: typeof goTo;
+    previous: typeof previous;
+    next: typeof next;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (index: number) => any;
     "update:modelValue": (value: boolean) => any;
     close: () => any;
     finish: () => any;
+    "update:open": (open: boolean) => any;
     "update:current": (index: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onChange?: ((index: number) => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onClose?: (() => any) | undefined;
     onFinish?: (() => any) | undefined;
+    "onUpdate:open"?: ((open: boolean) => any) | undefined;
     "onUpdate:current"?: ((index: number) => any) | undefined;
 }>, {
+    showArrow: boolean;
+    mask: import("../../index.js").HysTourMask;
+    type: "default" | "primary";
+    placement: import("../../index.js").Placement;
+    open: boolean;
+    appendTo: string | false | HTMLElement;
+    arrow: boolean | {
+        pointAtCenter?: boolean;
+    };
     closeOnEscape: boolean;
+    showClose: boolean;
+    skipText: string;
+    prevText: string;
+    nextText: string;
+    finishText: string;
+    scrollIntoViewOptions: boolean | ScrollIntoViewOptions;
+    targetAreaClickable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/composables/buttonGroup.d.ts

@@ -0,0 +1,9 @@
+import type { InjectionKey, Ref } from "vue";
+import type { HysButtonAppearance, HysButtonSize, HysButtonVariant } from "../components/HysButton/HysButton.vue";
+export declare function buttonSize(size: HysButtonSize | undefined): "sm" | "md" | "lg" | undefined;
+export declare function buttonVariant(type: HysButtonAppearance | "button" | "submit" | "reset" | undefined): HysButtonVariant | undefined;
+export declare const buttonGroupKey: InjectionKey<{
+    variant: Readonly<Ref<HysButtonVariant | undefined>>;
+    size: Readonly<Ref<"sm" | "md" | "lg" | undefined>>;
+    disabled: Readonly<Ref<boolean>>;
+}>;

package/dist/types/composables/floatingPosition.d.ts

@@ -0,0 +1,14 @@
+import type { Placement } from "./useFloating";
+export declare function positionFloating(anchor: DOMRect, size: {
+    width: number;
+    height: number;
+}, viewport: {
+    width: number;
+    height: number;
+}, placement: Placement, gap: number, padding: number, flip: boolean): {
+    width: number;
+    height: number;
+    x: number;
+    y: number;
+    placement: Placement;
+};

package/dist/types/composables/mention.d.ts

@@ -0,0 +1,284 @@
+import type { StyleValue, VNodeChild } from "vue";
+import type { Placement } from "./useFloating";
+import type { HysPopupMotionProps } from "../motion/popup";
+export interface HysMentionUser {
+    id: string;
+    name: string;
+    disabled?: boolean;
+}
+export interface HysMentionOption {
+    id?: string | number;
+    value: string | number;
+    label?: string | ((option: HysMentionOption) => VNodeChild);
+    disabled?: boolean;
+    prefix?: string;
+    type?: string;
+    avatar?: string;
+    description?: string;
+    group?: string;
+    keywords?: readonly string[];
+    recommended?: boolean;
+    class?: string;
+    style?: StyleValue;
+    payload?: unknown;
+}
+export interface HysMentionContext {
+    prefix: string;
+    query: string;
+    start: number;
+    end: number;
+    manual?: boolean;
+}
+export interface HysMentionFieldNames {
+    value?: string;
+    label?: string;
+    disabled?: string;
+    id?: string;
+    group?: string;
+    avatar?: string;
+    description?: string;
+    type?: string;
+}
+export type HysMentionDataOption = HysMentionOption | Record<string, unknown>;
+export interface HysMentionLoadContext extends HysMentionContext {
+    signal: AbortSignal;
+    text: string;
+    page: number;
+    pageSize: number;
+    cursor?: string | number;
+}
+export interface HysMentionPage {
+    items: readonly HysMentionDataOption[];
+    hasMore?: boolean;
+    nextCursor?: string | number | null;
+    total?: number;
+}
+export type HysMentionLoader = (context: HysMentionLoadContext) => readonly HysMentionDataOption[] | HysMentionPage | Promise<readonly HysMentionDataOption[] | HysMentionPage>;
+export type HysMentionFilter = boolean | ((query: string, option: HysMentionOption, prefix: string) => boolean);
+export type HysMentionSearchField = string | ((option: HysMentionOption) => unknown);
+export type HysMentionSearchMode = "includes" | "fuzzy" | "pinyin" | "initials";
+export type HysMentionMatch = (context: {
+    text: string;
+    caret: number;
+    prefix: string;
+}) => {
+    start: number;
+    query: string;
+} | null | undefined;
+export interface HysMentionTrigger {
+    prefix: string;
+    minQueryLength?: number;
+    boundary?: "any" | "word" | ((text: string, index: number) => boolean);
+    allowSpaces?: boolean;
+    match?: HysMentionMatch;
+    split?: string;
+    type?: string;
+    options?: readonly HysMentionDataOption[];
+    loadOptions?: HysMentionLoader;
+    filterOption?: HysMentionFilter;
+    searchMode?: HysMentionSearchMode | readonly HysMentionSearchMode[];
+    formatMention?: HysMentionProps["formatMention"];
+    allowCreate?: boolean;
+}
+export interface HysMentionSource {
+    key: string;
+    prefixes?: readonly string[];
+    group?: string;
+    options?: readonly HysMentionDataOption[];
+    loadOptions?: HysMentionLoader;
+    fieldNames?: HysMentionFieldNames;
+}
+export interface HysMentionEntity {
+    id: string | number;
+    value: string | number;
+    label: string;
+    type: string;
+    prefix: string;
+    text: string;
+    start: number;
+    end: number;
+    payload?: unknown;
+}
+export interface HysMentionDocument {
+    text: string;
+    entities: HysMentionEntity[];
+}
+export interface HysMentionOpenOptions {
+    prefix?: string;
+    query?: string;
+    position?: number;
+}
+export interface HysMentionInsertOptions {
+    prefix?: string;
+    start?: number;
+    end?: number;
+    focus?: boolean;
+}
+export interface HysMentionAutosize {
+    minRows?: number;
+    maxRows?: number;
+}
+export interface HysMentionLocale {
+    input: string;
+    list: string;
+    placeholder: string;
+    loading: string;
+    empty: string;
+    error: string;
+    retry: string;
+    more: string;
+    recent: string;
+    recommended: string;
+    clear: string;
+    create: string;
+}
+export interface HysMentionSlots {
+    prefix?: () => VNodeChild;
+    suffix?: () => VNodeChild;
+    "clear-icon"?: () => VNodeChild;
+    count?: (props: {
+        count: number;
+        max?: number;
+    }) => VNodeChild;
+    option?: (props: {
+        user: HysMentionUser;
+        option: HysMentionOption;
+        context?: HysMentionContext;
+        created: boolean;
+    }) => VNodeChild;
+    avatar?: (props: {
+        option: HysMentionOption;
+    }) => VNodeChild;
+    group?: (props: {
+        label: string;
+        context?: HysMentionContext;
+    }) => VNodeChild;
+    header?: (props: {
+        context?: HysMentionContext;
+    }) => VNodeChild;
+    footer?: (props: {
+        context?: HysMentionContext;
+        hasMore: boolean;
+        loadMore: () => Promise<boolean>;
+    }) => VNodeChild;
+    loading?: () => VNodeChild;
+    empty?: () => VNodeChild;
+    error?: (props: {
+        error: unknown;
+        retry: () => void;
+        context?: HysMentionContext;
+    }) => VNodeChild;
+}
+export type HysMentionAction = "next" | "previous" | "first" | "last" | "select" | "close" | "open" | "retry";
+export interface HysMentionInstance {
+    readonly input: HTMLElement | undefined;
+    readonly dropdownVisible: boolean;
+    focus: () => void;
+    blur: () => void;
+    open: (options?: HysMentionOpenOptions) => boolean;
+    close: () => void;
+    update: () => void;
+    retry: () => void;
+    loadMore: () => Promise<boolean>;
+    insertMention: (option: HysMentionOption, options?: HysMentionInsertOptions) => Promise<boolean>;
+    removeMention: (target: HysMentionEntity | string | number) => Promise<boolean>;
+    getEntities: () => HysMentionEntity[];
+    getDocument: () => HysMentionDocument;
+    setDocument: (document: HysMentionDocument | string) => Promise<boolean>;
+    serialize: () => string;
+    clear: () => Promise<boolean>;
+    undo: () => Promise<boolean>;
+    redo: () => Promise<boolean>;
+}
+export interface HysMentionProps extends HysPopupMotionProps {
+    modelValue?: string;
+    users?: readonly HysMentionUser[];
+    /** 候选选项。提供时优先于 users。 */
+    options?: readonly HysMentionDataOption[];
+    fieldNames?: HysMentionFieldNames;
+    /** 输入触发词后按当前关键字加载候选。过期请求会被取消。 */
+    loadOptions?: HysMentionLoader;
+    sources?: readonly HysMentionSource[];
+    debounce?: number;
+    throttle?: number;
+    pageSize?: number;
+    cache?: boolean | {
+        ttl?: number;
+        maxEntries?: number;
+    };
+    historyKey?: string;
+    recentLimit?: number;
+    recommendations?: readonly HysMentionOption[];
+    recommendOnFocus?: boolean;
+    minQueryLength?: number;
+    defaultValue?: string;
+    /** 提及触发词，可传多个前缀。 */
+    prefix?: string | readonly string[];
+    triggers?: readonly HysMentionTrigger[];
+    boundary?: HysMentionTrigger["boundary"];
+    allowSpaces?: boolean;
+    matchTrigger?: HysMentionMatch;
+    /** 选择候选后插入的分隔符。 */
+    split?: string;
+    filterOption?: HysMentionFilter;
+    searchMode?: HysMentionTrigger["searchMode"];
+    searchFields?: readonly HysMentionSearchField[];
+    sortOptions?: boolean | ((a: HysMentionOption, b: HysMentionOption, context: HysMentionContext) => number);
+    groupBy?: (option: HysMentionOption, context: HysMentionContext) => string | undefined;
+    validateSearch?: (query: string, context: HysMentionContext) => boolean;
+    whole?: boolean;
+    checkIsWhole?: (value: string, prefix: string) => boolean;
+    validateEntity?: (entity: HysMentionEntity) => boolean;
+    invalidEntity?: "mark" | "text" | "remove";
+    canSelect?: (option: HysMentionOption, context: HysMentionContext) => boolean;
+    beforeRemove?: (entity: HysMentionEntity) => boolean;
+    parseEntities?: (text: string) => readonly HysMentionEntity[];
+    highlightMentions?: boolean;
+    entityClass?: string | ((entity: HysMentionEntity) => string);
+    allowCreate?: boolean;
+    createOption?: (context: HysMentionContext) => HysMentionOption | false;
+    /** 自定义写入的提及文本，包含所需前缀。组件会追加 split。 */
+    formatMention?: (option: HysMentionOption, context: HysMentionContext) => string;
+    /** 替换光标后的同一提及词尾。默认保留光标后的文本。 */
+    replaceRest?: boolean;
+    selectOnTab?: boolean;
+    highlightMatch?: boolean;
+    loading?: boolean;
+    notFoundText?: string;
+    errorText?: string;
+    maxOptions?: number;
+    placement?: Placement;
+    showArrow?: boolean;
+    offset?: number;
+    autoAdjustOverflow?: boolean;
+    popupWidth?: string | number;
+    popupMaxHeight?: string | number;
+    zIndex?: number;
+    virtual?: boolean;
+    itemHeight?: number;
+    overscan?: number;
+    appendTo?: string | HTMLElement | false;
+    popupClass?: string;
+    popupStyle?: StyleValue;
+    type?: "text" | "textarea" | "rich";
+    rows?: number;
+    name?: string;
+    autofocus?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    maxlength?: number;
+    minlength?: number;
+    required?: boolean;
+    clearable?: boolean;
+    showCount?: boolean;
+    autosize?: boolean | HysMentionAutosize;
+    restoreFocus?: boolean;
+    shortcuts?: Partial<Record<string, HysMentionAction>>;
+    locale?: Partial<HysMentionLocale>;
+    defaultEntities?: readonly HysMentionEntity[];
+    entities?: readonly HysMentionEntity[];
+    ariaLabel?: string;
+    status?: "error" | "warning";
+    size?: "sm" | "md" | "lg";
+}

package/dist/types/composables/mentionDocument.d.ts

@@ -0,0 +1,15 @@
+import type { HysMentionContext, HysMentionDocument, HysMentionEntity, HysMentionProps, HysMentionTrigger } from "./mention";
+export declare function mentionTriggers(props: HysMentionProps): HysMentionTrigger[];
+export declare function matchMention(text: string, caret: number, rules: readonly HysMentionTrigger[], defaults: Pick<HysMentionProps, "boundary" | "allowSpaces" | "matchTrigger" | "split">): HysMentionContext | undefined;
+export declare function normalizeMentionEntities(text: string, input: readonly HysMentionEntity[]): HysMentionEntity[];
+export declare function serializeMentionDocument(document: HysMentionDocument): string;
+export declare function deserializeMentionDocument(source: string): HysMentionDocument;
+export declare function rebaseMentionEntities(before: HysMentionDocument, text: string, range?: {
+    start: number;
+    end: number;
+}): HysMentionEntity[];
+export declare function mentionSegments(text: string, entities: readonly HysMentionEntity[]): {
+    text: string;
+    start: number;
+    entity?: HysMentionEntity;
+}[];

package/dist/types/composables/mentionEditor.d.ts

@@ -0,0 +1,7 @@
+export interface MentionSelection {
+    start: number;
+    end: number;
+}
+export declare function isNativeMentionInput(element: HTMLElement): element is HTMLInputElement | HTMLTextAreaElement;
+export declare function readMentionSelection(element: HTMLElement, fallback: number): MentionSelection;
+export declare function writeMentionSelection(element: HTMLElement, selection: MentionSelection): void;

package/dist/types/composables/modal.d.ts

@@ -150,6 +150,8 @@ export interface HysModalSlotContext {
 }
 export interface HysModalSlots {
     default?: (context: HysModalSlotContext) => VNodeChild;
+    /** Content placed between the overlay and the dialog panel. */
+    backdrop?: (context: HysModalSlotContext) => VNodeChild;
     header?: (context: HysModalSlotContext) => VNodeChild;
     footer?: (context: HysModalSlotContext) => VNodeChild;
     icon?: (context: HysModalSlotContext) => VNodeChild;

package/dist/types/composables/selectOptions.d.ts

@@ -1,5 +1,10 @@
 export type HysSelectValue = string | number | boolean | Record<string, unknown>;
 export type HysSelectModelValue = HysSelectValue | HysSelectValue[] | null;
+export type HysSelectLabeledValue = {
+    value: HysSelectValue;
+    label: string;
+};
+export declare function isSelectLabeledValue(value: HysSelectValue): value is HysSelectLabeledValue;
 export interface HysSelectOption {
     label: string;
     value: HysSelectValue;

package/dist/types/composables/splitPaneSizes.d.ts

@@ -0,0 +1,11 @@
+import type { HysSplitPaneLength } from "../components/HysSplitPane/HysSplitPane.vue";
+export declare const paneEpsilon = 1e-7;
+export declare function paneRatio(value: HysSplitPaneLength | undefined, available: number): number | undefined;
+interface PanePreference {
+    min: number;
+    max: number;
+    preferred?: number;
+    relative?: boolean;
+}
+export declare function fitPaneSizes(panes: readonly PanePreference[]): number[];
+export {};