Merge branch 'next' of github.com:vueComponent/ant-design-vue into next

pull/3053/head
tangjinzhou 2020-10-24 23:56:50 +08:00
commit 19e3137ede
22 changed files with 2476 additions and 3221 deletions

View File

@ -46,9 +46,10 @@ export const SiderProps = {
// belowShow?: boolean; // belowShow?: boolean;
// } // }
// export interface SiderContext { export interface SiderContextProps {
// siderCollapsed: boolean; sCollapsed?: boolean;
// } collapsedWidth?: string | number;
}
const generateId = (() => { const generateId = (() => {
let i = 0; let i = 0;

View File

@ -3,15 +3,14 @@ import classNames from '../_util/classNames';
import { getComponent, isStringElement, isEmptyElement, getSlot } from '../_util/props-util'; import { getComponent, isStringElement, isEmptyElement, getSlot } from '../_util/props-util';
import { Col } from '../grid'; import { Col } from '../grid';
import { defaultConfigProvider } from '../config-provider'; import { defaultConfigProvider } from '../config-provider';
import { ListGridType } from './index';
import { cloneElement } from '../_util/vnode'; import { cloneElement } from '../_util/vnode';
import { inject } from 'vue'; import { defineComponent, ExtractPropTypes, FunctionalComponent, inject } from 'vue';
export const ListItemProps = { export const ListItemProps = {
prefixCls: PropTypes.string, prefixCls: PropTypes.string,
extra: PropTypes.any, extra: PropTypes.any,
actions: PropTypes.array, actions: PropTypes.array,
grid: ListGridType, grid: PropTypes.any,
}; };
export const ListItemMetaProps = { export const ListItemMetaProps = {
@ -21,9 +20,11 @@ export const ListItemMetaProps = {
title: PropTypes.any, title: PropTypes.any,
}; };
export const ListItemMeta = (props, { slots }) => { export const ListItemMeta: FunctionalComponent<Partial<
ExtractPropTypes<typeof ListItemMetaProps>
>> = (props, { slots }) => {
const configProvider = inject('configProvider', defaultConfigProvider); const configProvider = inject('configProvider', defaultConfigProvider);
const getPrefixCls = configProvider.getPrefixCls; const { getPrefixCls } = configProvider;
const { prefixCls: customizePrefixCls } = props; const { prefixCls: customizePrefixCls } = props;
const prefixCls = getPrefixCls('list', customizePrefixCls); const prefixCls = getPrefixCls('list', customizePrefixCls);
const avatar = props.avatar || slots.avatar?.(); const avatar = props.avatar || slots.avatar?.();
@ -53,13 +54,18 @@ function getGrid(grid, t) {
return grid[t] && Math.floor(24 / grid[t]); return grid[t] && Math.floor(24 / grid[t]);
} }
export default { export interface ListContext {
grid?: any;
itemLayout?: string;
}
export default defineComponent({
name: 'AListItem', name: 'AListItem',
inheritAttrs: false, inheritAttrs: false,
Meta: ListItemMeta, Meta: ListItemMeta,
props: ListItemProps, props: ListItemProps,
setup() { setup() {
const listContext = inject('listContext', {}); const listContext = inject<ListContext>('listContext', {});
const configProvider = inject('configProvider', defaultConfigProvider); const configProvider = inject('configProvider', defaultConfigProvider);
return { return {
listContext, listContext,
@ -147,4 +153,4 @@ export default {
return mainContent; return mainContent;
}, },
}; });

View File

@ -9,12 +9,12 @@ exports[`List renders empty list 1`] = `
<div class="ant-spin-container"> <div class="ant-spin-container">
<div class="ant-list-empty-text"> <div class="ant-list-empty-text">
<div class="ant-empty ant-empty-normal"> <div class="ant-empty ant-empty-normal">
<div class="ant-empty-image"><svg width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg"> <div class="ant-empty-image"><svg class="ant-empty-img-default" width="64" height="41" viewBox="0 0 64 41">
<g transform="translate(0 1)" fill="none" fill-rule="evenodd"> <g transform="translate(0 1)" fill="none" fill-rule="evenodd">
<ellipse fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse> <ellipse class="ant-empty-img-default-ellipse" fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse>
<g fill-rule="nonzero" stroke="#D9D9D9"> <g class="ant-empty-img-default-g" fill-rule="nonzero" stroke="#D9D9D9">
<path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path> <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path>
<path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA"></path> <path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA" class="ant-empty-img-default-path"></path>
</g> </g>
</g> </g>
</svg></div> </svg></div>

View File

@ -8,9 +8,11 @@ import Pagination, { PaginationConfig } from '../pagination';
import { Row } from '../grid'; import { Row } from '../grid';
import Item from './Item'; import Item from './Item';
import { initDefaultProps, getComponent, getSlot } from '../_util/props-util'; import { getComponent, getSlot } from '../_util/props-util';
import initDefaultProps from '../_util/props-util/initDefaultProps';
import { cloneElement } from '../_util/vnode'; import { cloneElement } from '../_util/vnode';
import { provide, inject } from 'vue'; import { provide, inject, defineComponent, App } from 'vue';
import { tuple } from '../_util/type';
export { ListItemProps, ListItemMetaProps } from './Item'; export { ListItemProps, ListItemMetaProps } from './Item';
@ -29,7 +31,7 @@ export const ListGridType = {
xxl: PropTypes.oneOf(ColumnCount), xxl: PropTypes.oneOf(ColumnCount),
}; };
export const ListSize = ['small', 'default', 'large']; export const ListSize = tuple('small', 'default', 'large');
export const ListProps = () => ({ export const ListProps = () => ({
bordered: PropTypes.looseBool, bordered: PropTypes.looseBool,
@ -52,7 +54,7 @@ export const ListProps = () => ({
locale: PropTypes.object, locale: PropTypes.object,
}); });
const List = { const List = defineComponent({
inheritAttrs: false, inheritAttrs: false,
Item, Item,
name: 'AList', name: 'AList',
@ -65,31 +67,35 @@ const List = {
}), }),
created() { created() {
provide('listContext', this); provide('listContext', this);
},
setup() {
return {
configProvider: inject('configProvider', defaultConfigProvider),
};
},
data() {
this.keys = [];
this.defaultPaginationProps = { this.defaultPaginationProps = {
current: 1, current: 1,
pageSize: 10, pageSize: 10,
onChange: (page, pageSize) => { onChange: (page: number, pageSize: number) => {
const { pagination } = this; const { pagination } = this;
this.paginationCurrent = page; this.paginationCurrent = page;
if (pagination && pagination.onChange) { if (pagination && (pagination as any).onChange) {
pagination.onChange(page, pageSize); (pagination as any).onChange(page, pageSize);
} }
}, },
total: 0, total: 0,
}; };
this.onPaginationChange = this.triggerPaginationEvent('onChange'); this.onPaginationChange = this.triggerPaginationEvent('onChange');
this.onPaginationShowSizeChange = this.triggerPaginationEvent('onShowSizeChange'); this.onPaginationShowSizeChange = this.triggerPaginationEvent('onShowSizeChange');
},
setup() {
return {
keys: [],
defaultPaginationProps: {},
onPaginationChange: null,
onPaginationShowSizeChange: null,
configProvider: inject('configProvider', defaultConfigProvider),
};
},
data() {
const { pagination } = this.$props; const { pagination } = this.$props;
const paginationObj = pagination && typeof pagination === 'object' ? pagination : {}; const paginationObj: Partial<typeof pagination> =
pagination && typeof pagination === 'object' ? pagination : {};
return { return {
paginationCurrent: paginationObj.defaultCurrent || 1, paginationCurrent: paginationObj.defaultCurrent || 1,
paginationSize: paginationObj.defaultPageSize || 10, paginationSize: paginationObj.defaultPageSize || 10,
@ -163,7 +169,7 @@ const List = {
paginationSize, paginationSize,
$attrs, $attrs,
} = this; } = this;
const getPrefixCls = this.configProvider.getPrefixCls; const { getPrefixCls } = this.configProvider;
const prefixCls = getPrefixCls('list', customizePrefixCls); const prefixCls = getPrefixCls('list', customizePrefixCls);
const { class: className, ...restAttrs } = $attrs; const { class: className, ...restAttrs } = $attrs;
const loadMore = getComponent(this, 'loadMore'); const loadMore = getComponent(this, 'loadMore');
@ -209,7 +215,7 @@ const List = {
total: dataSource.length, total: dataSource.length,
current: paginationCurrent, current: paginationCurrent,
pageSize: paginationSize, pageSize: paginationSize,
...(pagination || {}), ...((pagination as any) || {}),
}; };
classString; classString;
const largestPage = Math.ceil(paginationProps.total / paginationProps.pageSize); const largestPage = Math.ceil(paginationProps.total / paginationProps.pageSize);
@ -276,10 +282,10 @@ const List = {
</div> </div>
); );
}, },
}; });
/* istanbul ignore next */ /* istanbul ignore next */
List.install = function(app) { List.install = function(app: App) {
app.component(List.name, List); app.component(List.name, List);
app.component(List.Item.name, List.Item); app.component(List.Item.name, List.Item);
app.component(List.Item.Meta.displayName, List.Item.Meta); app.component(List.Item.Meta.displayName, List.Item.Meta);

View File

@ -204,4 +204,6 @@ Mentions.install = function(app: App) {
return app; return app;
}; };
export default Mentions; export default Mentions as typeof Mentions & {
readonly Option: typeof Option;
};

View File

@ -1,8 +1,9 @@
import { defineComponent, inject } from 'vue'; import { defineComponent, inject } from 'vue';
import { Item, itemProps } from '../vc-menu'; import { Item, itemProps } from '../vc-menu';
import { getOptionProps, getSlot } from '../_util/props-util'; import { getOptionProps, getSlot } from '../_util/props-util';
import Tooltip from '../tooltip'; import Tooltip, { TooltipProps } from '../tooltip';
function noop() {} import { SiderContextProps } from '../layout/Sider';
export default defineComponent({ export default defineComponent({
name: 'MenuItem', name: 'MenuItem',
inheritAttrs: false, inheritAttrs: false,
@ -10,13 +11,13 @@ export default defineComponent({
isMenuItem: true, isMenuItem: true,
setup() { setup() {
return { return {
getInlineCollapsed: inject('getInlineCollapsed', noop), getInlineCollapsed: inject<() => boolean>('getInlineCollapsed', () => false),
layoutSiderContext: inject('layoutSiderContext', {}), layoutSiderContext: inject<SiderContextProps>('layoutSiderContext', {}),
}; };
}, },
methods: { methods: {
onKeyDown(e) { onKeyDown(e: HTMLElement) {
this.$refs.menuItem.onKeyDown(e); (this.$refs.menuItem as any).onKeyDown(e);
}, },
}, },
render() { render() {
@ -31,7 +32,7 @@ export default defineComponent({
} else if (title === false) { } else if (title === false) {
tooltipTitle = ''; tooltipTitle = '';
} }
const tooltipProps = { const tooltipProps: TooltipProps = {
title: tooltipTitle, title: tooltipTitle,
}; };
const siderCollapsed = this.layoutSiderContext.sCollapsed; const siderCollapsed = this.layoutSiderContext.sCollapsed;
@ -48,7 +49,7 @@ export default defineComponent({
...attrs, ...attrs,
ref: 'menuItem', ref: 'menuItem',
}; };
const toolTipProps = { const toolTipProps: TooltipProps = {
...tooltipProps, ...tooltipProps,
placement: 'right', placement: 'right',
overlayClassName: `${rootPrefixCls}-inline-collapsed-tooltip`, overlayClassName: `${rootPrefixCls}-inline-collapsed-tooltip`,

View File

@ -1,22 +1,29 @@
import { inject } from 'vue'; import { defineComponent, inject } from 'vue';
import { SubMenu as VcSubMenu } from '../vc-menu'; import { SubMenu as VcSubMenu } from '../vc-menu';
import classNames from '../_util/classNames'; import classNames from '../_util/classNames';
import Omit from 'omit.js'; import Omit from 'omit.js';
import { getSlot } from '../_util/props-util'; import { getSlot } from '../_util/props-util';
export default { export type MenuTheme = 'light' | 'dark';
export interface MenuContextProps {
inlineCollapsed?: boolean;
theme?: MenuTheme;
}
export default defineComponent({
name: 'ASubMenu', name: 'ASubMenu',
isSubMenu: true, isSubMenu: true,
inheritAttrs: false, inheritAttrs: false,
props: { ...VcSubMenu.props }, props: { ...VcSubMenu.props },
setup() { setup() {
return { return {
menuPropsContext: inject('menuPropsContext', {}), menuPropsContext: inject<MenuContextProps>('menuPropsContext', {}),
}; };
}, },
methods: { methods: {
onKeyDown(e) { onKeyDown(e) {
this.$refs.subMenu.onKeyDown(e); (this.$refs.subMenu as any).onKeyDown(e);
}, },
}, },
@ -33,4 +40,4 @@ export default {
}; };
return <VcSubMenu {...props}>{getSlot(this)}</VcSubMenu>; return <VcSubMenu {...props}>{getSlot(this)}</VcSubMenu>;
}, },
}; });

View File

@ -1,4 +1,4 @@
import { defineComponent, inject, provide, toRef } from 'vue'; import { defineComponent, inject, provide, toRef, App, ExtractPropTypes } from 'vue';
import omit from 'omit.js'; import omit from 'omit.js';
import VcMenu, { Divider, ItemGroup } from '../vc-menu'; import VcMenu, { Divider, ItemGroup } from '../vc-menu';
import SubMenu from './SubMenu'; import SubMenu from './SubMenu';
@ -10,6 +10,8 @@ import { hasProp, getOptionProps, getSlot } from '../_util/props-util';
import BaseMixin from '../_util/BaseMixin'; import BaseMixin from '../_util/BaseMixin';
import commonPropsType from '../vc-menu/commonPropsType'; import commonPropsType from '../vc-menu/commonPropsType';
import { defaultConfigProvider } from '../config-provider'; import { defaultConfigProvider } from '../config-provider';
import { SiderContextProps } from '../layout/Sider';
import { tuple } from '../_util/type';
// import raf from '../_util/raf'; // import raf from '../_util/raf';
export const MenuMode = PropTypes.oneOf([ export const MenuMode = PropTypes.oneOf([
@ -22,7 +24,7 @@ export const MenuMode = PropTypes.oneOf([
export const menuProps = { export const menuProps = {
...commonPropsType, ...commonPropsType,
theme: PropTypes.oneOf(['light', 'dark']).def('light'), theme: PropTypes.oneOf(tuple('light', 'dark')).def('light'),
mode: MenuMode.def('vertical'), mode: MenuMode.def('vertical'),
selectable: PropTypes.looseBool, selectable: PropTypes.looseBool,
selectedKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), selectedKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
@ -43,10 +45,10 @@ export const menuProps = {
onClick: PropTypes.func, onClick: PropTypes.func,
onMouseenter: PropTypes.func, onMouseenter: PropTypes.func,
onSelectChange: PropTypes.func, onSelectChange: PropTypes.func,
'onUpdate:selectedKeys': PropTypes.func,
'onUpdate:openKeys': PropTypes.func,
}; };
export type MenuProps = Partial<ExtractPropTypes<typeof menuProps>>;
const Menu = defineComponent({ const Menu = defineComponent({
name: 'AMenu', name: 'AMenu',
inheritAttrs: false, inheritAttrs: false,
@ -56,23 +58,33 @@ const Menu = defineComponent({
SubMenu: { ...SubMenu, name: 'ASubMenu' }, SubMenu: { ...SubMenu, name: 'ASubMenu' },
ItemGroup: { ...ItemGroup, name: 'AMenuItemGroup' }, ItemGroup: { ...ItemGroup, name: 'AMenuItemGroup' },
mixins: [BaseMixin], mixins: [BaseMixin],
emits: [
'update:selectedKeys',
'update:openKeys',
'mouseenter',
'openChange',
'click',
'selectChange',
'select',
'deselect',
],
created() { created() {
provide('getInlineCollapsed', this.getInlineCollapsed); provide('getInlineCollapsed', this.getInlineCollapsed);
provide('menuPropsContext', this.$props); provide('menuPropsContext', this.$props);
}, },
setup() { setup() {
const layoutSiderContext = inject('layoutSiderContext', {}); const layoutSiderContext = inject<SiderContextProps>('layoutSiderContext', {});
const layoutSiderCollapsed = toRef(layoutSiderContext, 'sCollapsed'); const layoutSiderCollapsed = toRef(layoutSiderContext, 'sCollapsed');
return { return {
configProvider: inject('configProvider', defaultConfigProvider), configProvider: inject('configProvider', defaultConfigProvider),
layoutSiderContext, layoutSiderContext,
layoutSiderCollapsed, layoutSiderCollapsed,
propsUpdating: false,
switchingModeFromInline: false,
leaveAnimationExecutedWhenInlineCollapsed: false,
inlineOpenKeys: [],
}; };
}, },
// model: {
// prop: 'selectedKeys',
// event: 'selectChange',
// },
updated() { updated() {
this.propsUpdating = false; this.propsUpdating = false;
}, },
@ -96,15 +108,12 @@ const Menu = defineComponent({
}, },
}, },
data() { data() {
const props = getOptionProps(this); const props: MenuProps = getOptionProps(this);
warning( warning(
!('inlineCollapsed' in props && props.mode !== 'inline'), !('inlineCollapsed' in props && props.mode !== 'inline'),
'Menu', 'Menu',
"`inlineCollapsed` should only be used when Menu's `mode` is inline.", "`inlineCollapsed` should only be used when Menu's `mode` is inline.",
); );
this.switchingModeFromInline = false;
this.leaveAnimationExecutedWhenInlineCollapsed = false;
this.inlineOpenKeys = [];
let sOpenKeys; let sOpenKeys;
if ('openKeys' in props) { if ('openKeys' in props) {
@ -244,7 +253,7 @@ const Menu = defineComponent({
const menuOpenAnimation = this.getMenuOpenAnimation(menuMode); const menuOpenAnimation = this.getMenuOpenAnimation(menuMode);
const { class: className, ...otherAttrs } = this.$attrs; const { class: className, ...otherAttrs } = this.$attrs;
const menuClassName = { const menuClassName = {
[className]: className, [className as string]: className,
[`${prefixCls}-${theme}`]: true, [`${prefixCls}-${theme}`]: true,
[`${prefixCls}-inline-collapsed`]: this.getInlineCollapsed(), [`${prefixCls}-inline-collapsed`]: this.getInlineCollapsed(),
}; };
@ -297,7 +306,7 @@ const Menu = defineComponent({
}); });
/* istanbul ignore next */ /* istanbul ignore next */
Menu.install = function(app) { Menu.install = function(app: App) {
app.component(Menu.name, Menu); app.component(Menu.name, Menu);
app.component(Menu.Item.name, Menu.Item); app.component(Menu.Item.name, Menu.Item);
app.component(Menu.SubMenu.name, Menu.SubMenu); app.component(Menu.SubMenu.name, Menu.SubMenu);

View File

@ -16,7 +16,7 @@ exports[`Slider should show tooltip when hovering slider handler 1`] = `
<div style="position: absolute; top: 0px; left: 0px; width: 100%;"> <div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div> <div>
<!----> <!---->
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top zoom-down-enter" style="left: -999px; top: -1003px;"> <div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top " style="left: -999px; top: -1003px;">
<div class="ant-tooltip-content"> <div class="ant-tooltip-content">
<div class="ant-tooltip-arrow"> <div class="ant-tooltip-arrow">
<!----> <!---->
@ -44,7 +44,7 @@ exports[`Slider should show tooltip when hovering slider handler 2`] = `
<div style="position: absolute; top: 0px; left: 0px; width: 100%;"> <div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div> <div>
<!----> <!---->
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top" style="left: -999px; top: -1003px; display: none;"> <div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top " style="left: -999px; top: -1003px; display: none;">
<div class="ant-tooltip-content"> <div class="ant-tooltip-content">
<div class="ant-tooltip-arrow"> <div class="ant-tooltip-arrow">
<!----> <!---->

View File

@ -147,14 +147,13 @@ export default defineComponent({
}; };
}, },
data() { data(this) {
const props = getOptionProps(this); const props = getOptionProps(this);
warning( warning(
!props.expandedRowRender || !('scroll' in props), !props.expandedRowRender || !('scroll' in props),
'`expandedRowRender` and `scroll` are not compatible. Please use one of them at one time.', '`expandedRowRender` and `scroll` are not compatible. Please use one of them at one time.',
); );
const self = this; const { getDefaultSortOrder, getDefaultFilters, getDefaultPagination } = this as typeof this & {
const { getDefaultSortOrder, getDefaultFilters, getDefaultPagination } = self as typeof self & {
getDefaultSortOrder: Function; getDefaultSortOrder: Function;
getDefaultFilters: Function; getDefaultFilters: Function;
getDefaultPagination: Function; getDefaultPagination: Function;

View File

@ -138,13 +138,6 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
<!----> <!---->
</div> </div>
</div> </div>
<ul unselectable="unselectable" class="ant-pagination ant-table-pagination">
<!---->
<li title="Previous Page" class="ant-pagination-disabled ant-pagination-prev" aria-disabled="true"><a class="ant-pagination-item-link"><span role="img" aria-label="left" class="anticon anticon-left"><svg class="" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path></svg></span></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="Next Page" class="ant-pagination-disabled ant-pagination-next" aria-disabled="true"><a class="ant-pagination-item-link"><span role="img" aria-label="right" class="anticon anticon-right"><svg class="" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"></path></svg></span></a></li>
<!---->
</ul>
</div> </div>
</div> </div>
</div> </div>

View File

@ -59,13 +59,6 @@ exports[`Table align column should not override cell style 1`] = `
<!----> <!---->
</div> </div>
</div> </div>
<ul unselectable="unselectable" class="ant-pagination ant-table-pagination">
<!---->
<li title="Previous Page" class="ant-pagination-disabled ant-pagination-prev" aria-disabled="true"><a class="ant-pagination-item-link"><span role="img" aria-label="left" class="anticon anticon-left"><svg class="" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path></svg></span></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="Next Page" class="ant-pagination-disabled ant-pagination-next" aria-disabled="true"><a class="ant-pagination-item-link"><span role="img" aria-label="right" class="anticon anticon-right"><svg class="" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"></path></svg></span></a></li>
<!---->
</ul>
</div> </div>
</div> </div>
</div> </div>

View File

@ -60,12 +60,12 @@ exports[`Table renders empty table 1`] = `
</div> </div>
<div class="ant-table-placeholder"> <div class="ant-table-placeholder">
<div class="ant-empty ant-empty-normal"> <div class="ant-empty ant-empty-normal">
<div class="ant-empty-image"><svg width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg"> <div class="ant-empty-image"><svg class="ant-empty-img-default" width="64" height="41" viewBox="0 0 64 41">
<g transform="translate(0 1)" fill="none" fill-rule="evenodd"> <g transform="translate(0 1)" fill="none" fill-rule="evenodd">
<ellipse fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse> <ellipse class="ant-empty-img-default-ellipse" fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse>
<g fill-rule="nonzero" stroke="#D9D9D9"> <g class="ant-empty-img-default-g" fill-rule="nonzero" stroke="#D9D9D9">
<path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path> <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path>
<path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA"></path> <path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA" class="ant-empty-img-default-path"></path>
</g> </g>
</g> </g>
</svg></div> </svg></div>
@ -226,12 +226,12 @@ exports[`Table renders empty table with fixed columns 1`] = `
</div> </div>
<div class="ant-table-placeholder"> <div class="ant-table-placeholder">
<div class="ant-empty ant-empty-normal"> <div class="ant-empty ant-empty-normal">
<div class="ant-empty-image"><svg width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg"> <div class="ant-empty-image"><svg class="ant-empty-img-default" width="64" height="41" viewBox="0 0 64 41">
<g transform="translate(0 1)" fill="none" fill-rule="evenodd"> <g transform="translate(0 1)" fill="none" fill-rule="evenodd">
<ellipse fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse> <ellipse class="ant-empty-img-default-ellipse" fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse>
<g fill-rule="nonzero" stroke="#D9D9D9"> <g class="ant-empty-img-default-g" fill-rule="nonzero" stroke="#D9D9D9">
<path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path> <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path>
<path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA"></path> <path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA" class="ant-empty-img-default-path"></path>
</g> </g>
</g> </g>
</svg></div> </svg></div>
@ -359,12 +359,12 @@ exports[`Table renders empty table without emptyText when loading 1`] = `
</div> </div>
<div class="ant-table-placeholder"> <div class="ant-table-placeholder">
<div class="ant-empty ant-empty-normal"> <div class="ant-empty ant-empty-normal">
<div class="ant-empty-image"><svg width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg"> <div class="ant-empty-image"><svg class="ant-empty-img-default" width="64" height="41" viewBox="0 0 64 41">
<g transform="translate(0 1)" fill="none" fill-rule="evenodd"> <g transform="translate(0 1)" fill="none" fill-rule="evenodd">
<ellipse fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse> <ellipse class="ant-empty-img-default-ellipse" fill="#F5F5F5" cx="32" cy="33" rx="32" ry="7"></ellipse>
<g fill-rule="nonzero" stroke="#D9D9D9"> <g class="ant-empty-img-default-g" fill-rule="nonzero" stroke="#D9D9D9">
<path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path> <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path>
<path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA"></path> <path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" fill="#FAFAFA" class="ant-empty-img-default-path"></path>
</g> </g>
</g> </g>
</svg></div> </svg></div>

View File

@ -156,7 +156,7 @@ export default defineComponent({
column, column,
filterDropdown filterDropdown
? selectedKeys ? selectedKeys
: selectedKeys.map(key => valueKeys[key]).filter(key => key !== undefined), : selectedKeys.map((key: any) => valueKeys[key]).filter(key => key !== undefined),
); );
} }
}, },

View File

@ -1,4 +1,4 @@
import { defineComponent, inject } from 'vue'; import { defineComponent, ExtractPropTypes, inject } from 'vue';
import VcTooltip from '../vc-tooltip'; import VcTooltip from '../vc-tooltip';
import classNames from '../_util/classNames'; import classNames from '../_util/classNames';
import getPlacements from './placements'; import getPlacements from './placements';
@ -27,13 +27,18 @@ const splitObject = (obj: any, keys: string[]) => {
return { picked, omitted }; return { picked, omitted };
}; };
const props = abstractTooltipProps(); const props = abstractTooltipProps();
const tooltipProps = {
...props,
title: PropTypes.VNodeChild,
};
export type TooltipProps = Partial<ExtractPropTypes<typeof tooltipProps>>;
export default defineComponent({ export default defineComponent({
name: 'ATooltip', name: 'ATooltip',
inheritAttrs: false, inheritAttrs: false,
props: { props: tooltipProps,
...props,
title: PropTypes.VNodeChild,
},
emits: ['update:visible', 'visibleChange'], emits: ['update:visible', 'visibleChange'],
setup() { setup() {
return { return {
@ -192,7 +197,7 @@ export default defineComponent({
[openClassName || `${prefixCls}-open`]: sVisible, [openClassName || `${prefixCls}-open`]: sVisible,
[child.props && child.props.class]: child.props && child.props.class, [child.props && child.props.class]: child.props && child.props.class,
}); });
const tooltipProps = { const vcTooltipProps = {
...$attrs, ...$attrs,
...$props, ...$props,
prefixCls, prefixCls,
@ -205,7 +210,7 @@ export default defineComponent({
onPopupAlign: this.onPopupAlign, onPopupAlign: this.onPopupAlign,
}; };
return ( return (
<VcTooltip {...tooltipProps}> <VcTooltip {...vcTooltipProps}>
{sVisible ? cloneElement(child, { class: childCls }) : child} {sVisible ? cloneElement(child, { class: childCls }) : child}
</VcTooltip> </VcTooltip>
); );

View File

@ -1,6 +1,8 @@
import { App } from 'vue'; import { App } from 'vue';
import ToolTip from './Tooltip'; import ToolTip from './Tooltip';
export { TooltipProps } from './Tooltip';
/* istanbul ignore next */ /* istanbul ignore next */
ToolTip.install = function(app: App) { ToolTip.install = function(app: App) {
app.component(ToolTip.name, ToolTip); app.component(ToolTip.name, ToolTip);

View File

@ -1,5 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Search should show cross icon when input value exists 1`] = `<div><input placeholder="" type="text" class="ant-input"><span class="undefined-action"><span role="img" aria-label="search" class="anticon anticon-search"><svg class="" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></span></span></div>`; exports[`Search should show cross icon when input value exists 1`] = `<input placeholder="" type="text" class="ant-input"><span class="undefined-action"><span role="img" aria-label="search" class="anticon anticon-search"><svg class="" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></span></span>`;
exports[`Search should show cross icon when input value exists 2`] = `<div><input placeholder="" type="text" class="ant-input"><span class="undefined-action"><span role="img" aria-label="search" class="anticon anticon-search"><svg class="" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></span></span></div>`; exports[`Search should show cross icon when input value exists 2`] = `<input placeholder="" type="text" class="ant-input"><span class="undefined-action"><span role="img" aria-label="search" class="anticon anticon-search"><svg class="" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></span></span>`;

View File

@ -1,6 +1,6 @@
import { PropType } from 'vue'; import { PropType } from 'vue';
import PropTypes from '../../_util/vue-types'; import PropTypes from '../../_util/vue-types';
import initDefaultProps from '../../_util/props-util/initDefaultProps'; import { initDefaultProps } from '../../_util/props-util';
import { import {
filterOption as defaultFilterOption, filterOption as defaultFilterOption,
validateSearch as defaultValidateSearch, validateSearch as defaultValidateSearch,
@ -20,12 +20,8 @@ export const mentionsProps = {
placement: PropTypes.oneOf(PlaceMent), placement: PropTypes.oneOf(PlaceMent),
character: PropTypes.any, character: PropTypes.any,
characterRender: PropTypes.func, characterRender: PropTypes.func,
filterOption: { filterOption: PropTypes.func,
type: [Boolean, Function] as PropType<false | typeof defaultFilterOption>, validateSearch: PropTypes.func,
},
validateSearch: {
type: Function as PropType<typeof defaultValidateSearch>,
},
getPopupContainer: { getPopupContainer: {
type: Function as PropType<() => HTMLElement>, type: Function as PropType<() => HTMLElement>,
}, },

View File

@ -47,7 +47,7 @@ const Menu = {
this.updateMiniStore(); this.updateMiniStore();
}, },
methods: { methods: {
onSelect(selectInfo) { handleSelect(selectInfo) {
const props = this.$props; const props = this.$props;
if (props.selectable) { if (props.selectable) {
// root menu // root menu
@ -70,7 +70,7 @@ const Menu = {
} }
}, },
onClick(e) { handleClick(e) {
this.__emit('click', e); this.__emit('click', e);
}, },
// onKeyDown needs to be exposed as a instance method // onKeyDown needs to be exposed as a instance method
@ -112,7 +112,7 @@ const Menu = {
} }
}, },
onDeselect(selectInfo) { handleDeselect(selectInfo) {
const props = this.$props; const props = this.$props;
if (props.selectable) { if (props.selectable) {
const selectedKeys = this.store.getState().selectedKeys.concat(); const selectedKeys = this.store.getState().selectedKeys.concat();
@ -172,10 +172,10 @@ const Menu = {
overflowedIndicator: getComponent(this, 'overflowedIndicator', props) || <span>···</span>, overflowedIndicator: getComponent(this, 'overflowedIndicator', props) || <span>···</span>,
openTransitionName: this.getOpenTransitionName(), openTransitionName: this.getOpenTransitionName(),
children: filterEmpty(props.children), children: filterEmpty(props.children),
onClick: this.onClick, onClick: this.handleClick,
onOpenChange: this.onOpenChange, onOpenChange: this.onOpenChange,
onDeselect: this.onDeselect, onDeselect: this.handleDeselect,
onSelect: this.onSelect, onSelect: this.handleSelect,
ref: this.saveInnerMenu, ref: this.saveInnerMenu,
}; };