jamis
Version:
一种支持通过JSON配置方式生成页面的组件库
83 lines (82 loc) • 2.37 kB
TypeScript
/**
* AnchorNavSection 锚点区域组件
*
*/
import type { PropsWithChildren } from 'react';
import type { PickClassStyleType, ReactPropsBase, RendererProps, Schema } from 'jamis-core';
import type { BaseSchema, SchemaClassName, SchemaCollection } from '../types';
export interface AnchorNavSectionSchema extends Omit<BaseSchema, 'type'> {
/**
* 导航文字说明
*/
title: string;
/**
* `.cxd-AnchorNav-link`元素的样式类
*/
linkClassName?: SchemaClassName;
/**
* 锚点链接
*/
href?: string;
/**
* 内容
*/
body?: SchemaCollection;
}
/**
* AnchorNav 锚点导航组件
*
*/
export interface AnchorNavSchema extends BaseSchema {
/**
* 指定为 AnchorNav 锚点导航组件
*/
type: 'anchor-nav';
/**
* 楼层集合
*/
links: Array<AnchorNavSectionSchema>;
direction?: 'vertical' | 'horizontal';
/**
* 被激活（定位）的楼层
*/
active?: string | number;
/**
* 样式名
*/
className?: SchemaClassName;
/**
* `.cxd-AnchorNav-link-wrap`元素的样式类
*/
linkWrapClassName?: SchemaClassName;
/**
* `.cxd-AnchorNav-link-parent`元素的样式类
*/
linkParentClassName?: SchemaClassName;
/**
* `.cxd-AnchorNav-link`导航样式名
*/
linkClassName?: SchemaClassName;
/**
* `.cxd-AnchorNav-section-wrap` 样式名
*/
sectionClassName?: SchemaClassName;
}
export interface AnchorNavSectionProps extends PropsWithChildren, ReactPropsBase, PickClassStyleType {
title?: string;
name: string | number;
body?: Schema;
className?: string;
}
export interface AnchorNavProps extends Omit<AnchorNavSchema, 'type' | 'children' | 'links'>, PropsWithChildren, ReactPropsBase, PickClassStyleType {
links?: Array<AnchorNavSectionProps>;
active?: string | number;
/**
* 获取初始的active值
*/
getInitialActive: () => AnchorNavSchema['active'];
sectionRender?: (section: AnchorNavSectionProps, props?: AnchorNavProps) => JSX.Element;
}
export interface AnchorNavRendererProps extends RendererProps, Omit<AnchorNavSchema, 'className' | 'linkClassName' | 'sectionClassName'> {
sectionRender?: (section: AnchorNavSectionSchema, props: AnchorNavRendererProps, index: number) => JSX.Element;
}