Merge branch 'next' of github.com:vueComponent/ant-design-vue into next
commit
19e3137ede
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
},
|
},
|
||||||
};
|
});
|
|
@ -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>
|
||||||
|
|
|
@ -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);
|
File diff suppressed because it is too large
Load Diff
|
@ -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;
|
||||||
|
};
|
||||||
|
|
|
@ -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`,
|
|
@ -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>;
|
||||||
},
|
},
|
||||||
};
|
});
|
|
@ -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);
|
|
@ -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">
|
||||||
<!---->
|
<!---->
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -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>
|
||||||
);
|
);
|
||||||
|
|
|
@ -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);
|
||||||
|
|
|
@ -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>`;
|
||||||
|
|
|
@ -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>,
|
||||||
},
|
},
|
||||||
|
|
|
@ -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,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue