feat: add events to mentions & add defaultOpen property to modal

This commit is contained in:
xzdry 2022-04-24 18:42:08 +08:00
parent b127c703e9
commit a49e7d0d53
6 changed files with 47 additions and 25 deletions

View File

@ -37,7 +37,7 @@ const options = {
methods: {},
slots: [],
styleSlots: ['content'],
events: ['onChange', 'onClear', 'onPressEnter'],
events: ['onChange', 'onClear', 'onPressEnter', 'onFocus', 'onBlur'],
},
};
@ -61,7 +61,6 @@ export const Mentions = implementRuntimeComponent(options)(props => {
};
const onPressEnter = () => {
// TODO complete onPressEnter methods
callbackMap?.onPressEnter?.();
};
@ -71,6 +70,8 @@ export const Mentions = implementRuntimeComponent(options)(props => {
onPressEnter={onPressEnter}
onClear={onClear}
className={css(customStyle?.content)}
onBlur={() => callbackMap?.onBlur?.()}
onFocus={() => callbackMap?.onFocus?.()}
onChange={onChange}
{...cProps}
value={value}

View File

@ -5,24 +5,9 @@ import { Type, Static } from '@sinclair/typebox';
import { FALLBACK_METADATA, getComponentProps } from '../sunmao-helper';
import { MenuPropsSpec as BaseMenuPropsSpec } from '../generated/types/Menu';
import { useEffect, useState } from 'react';
import { Category } from '../constants/category';
const MenuPropsSpec = Type.Object({
...BaseMenuPropsSpec,
defaultActiveKey: Type.String({
title: 'Default Active Key',
category: Category.Basic,
}),
items: Type.Array(
Type.Object({
key: Type.String(),
text: Type.String(),
disabled: Type.Optional(Type.Boolean()),
}),
{
category: Category.Basic,
}
),
});
const MenuStateSpec = Type.Object({
activeKey: Type.Optional(Type.String()),
@ -38,6 +23,7 @@ const exampleProperties: Static<typeof MenuPropsSpec> = {
{ key: 'key1', text: 'item1' },
{ key: 'key2', text: 'item2' },
],
ellipsis:false,
defaultActiveKey: 'key1',
};

View File

@ -18,6 +18,7 @@ const exampleProperties: Static<typeof ModalPropsSpec> = {
closable: true,
maskClosable: true,
confirmLoading: false,
defaultOpen:true
};
export const Modal = implementRuntimeComponent({
version: 'arco/v1',
@ -43,8 +44,8 @@ export const Modal = implementRuntimeComponent({
},
})(props => {
const { subscribeMethods, slotsElements, customStyle, callbackMap } = props;
const { getElement, title, ...cProps } = getComponentProps(props);
const [visible, setVisible] = useState(true);
const { getElement, title, defaultOpen, ...cProps } = getComponentProps(props);
const [visible, setVisible] = useState(defaultOpen);
const contentRef = useRef<HTMLDivElement | null>(null);
const afterOpen = () => {

View File

@ -16,6 +16,7 @@ export const LinkPropsSpec = {
hoverable: Type.Boolean({
title: 'Hoverable',
category: Category.Style,
description: 'Whether to hide background when hover'
}),
status: StringUnion(['success', 'warning', 'error'], {
title: 'Status',

View File

@ -8,19 +8,48 @@ export const MenuPropsSpec = {
// title: 'theme',
// category: Category.Style,
// }),
mode: StringUnion(['vertical', 'horizontal']),
mode: StringUnion(['vertical', 'horizontal'], {
title: 'Mode',
category: Category.Basic
}),
items: Type.Array(
Type.Object({
key: Type.String(),
text: Type.String(),
disabled: Type.Optional(Type.Boolean()),
}),
{
title:'Items',
category: Category.Basic,
}
),
defaultActiveKey: Type.String({
title: 'Default Active Key',
category: Category.Basic,
}),
autoOpen: Type.Boolean({
title: 'Auto Open',
description: 'Whether to expand all multi-level menus by default',
category: Category.Basic
}),
collapse: Type.Boolean({
title: 'Collapse',
category: Category.Style,
}),
// accordion: Type.Boolean({
// category: Category.Style,
// }),
// ellipsis: Type.Boolean({
// description: 'Whether the horizontal menu automatically collapses when it overflows',
// }),
autoScrollIntoView: Type.Boolean(),
hasCollapseButton: Type.Boolean(),
ellipsis: Type.Boolean({
title: 'Ellipsis',
description: 'Whether the horizontal menu automatically collapses when it overflows',
category: Category.Basic
}),
autoScrollIntoView: Type.Boolean({
title: 'Auto Scroll Into View',
category: Category.Basic
}),
hasCollapseButton: Type.Boolean({
title: 'Collapse Button',
category: Category.Basic
}),
};

View File

@ -7,6 +7,10 @@ export const ModalPropsSpec = {
category: Category.Basic,
weight: 10,
}),
defaultOpen:Type.Boolean({
title:'Default Open',
category: Category.Behavior,
}),
mask: Type.Boolean({
title: 'Mask',
category: Category.Style,