@fpxfd/next/types/anchor/index.d.ts

A configurable component library for web built on React.

/// <reference types="react" />

import * as React from 'react';
import CommonProps from '../util';

export interface AnchorProps extends CommonProps {
    /**
     * 固定模式
     * 默认true
     * */
    affix?: boolean;
    /**
     * 数据源
     * href 锚点 id
     * title 标题
     * children 二级锚点（可选）
     * */
    dataSource: ({ href: string; title: string; children?: ({ href: string; title: string })[] })[];
    /**
     * 是否展示可折叠收齐（当选择是时，滚动时收齐，滚动结束时展开）
     * 默认 false
     * https://4pxgroup.yuque.com/4pxued/rgbgu6/20212223/measure?artboard_type=artboard&from=&view=
     * */
    allowFold?: boolean;
    /**
     * 默认收起，默认收齐
     */
    open?: boolean;
    /**
     * 距离窗口顶部达到指定偏移量后触发
     * */
    offsetTop?: number;
    /**
     * 锚点区域边界
     * */
    bounds?: number;
    /**
     * 指定滚动的容器 () => HTMLElement
     * 默认值 () => window
     * 当在抽屉中使用时需要指定容器：document.querySelector('.fpx-dialog-drawer > div')
     * */
    getContainer?: () => HTMLElement | Window;
    /**
     * click 事件的 handler
     * Function(e: Event, link: Object)
     * */
    onClick?: (e: React.MouseEvent<HTMLElement>, link: { title: React.ReactNode; href: string }) => void;
    /**
     * 锚点滚动偏移量，默认与 offsetTop 相同
     * */
    targetOffset?: number;
    /**
     * 锚监听锚点链接改变
     * (currentActiveLink: string) => void
     * */
    onChange?: (currentActiveLink: string) => void;
    /**
     * 自定设置设置锚点组件放置何处
     * */
    className?: string;
    /**
     * 自定设置设置锚点组件放置何处
     * */
    style?: React.CSSProperties;
}

export default class Anchor extends React.Component<AnchorProps, any> {}