mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-04-12 14:40:47 +08:00
fix: lint
This commit is contained in:
07akioni
parent
636421eaa3
commit
25608dc5f5
@ -14,9 +14,10 @@ module.exports = {
|
||||
}
|
||||
}
|
||||
],
|
||||
'vue/no-template-key': 0,
|
||||
'vue/valid-template-root': 0,
|
||||
'vue/valid-v-model': 0
|
||||
'vue/no-multiple-template-root': 0,
|
||||
'vue/no-lone-template': 0,
|
||||
'vue/no-v-model-argument': 0,
|
||||
'no-void': 0
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
|
||||
@ -5,7 +5,7 @@ const { DefinePlugin } = require('webpack')
|
||||
exports.alias = {
|
||||
'naive-ui/lib/icons': path.resolve(__dirname, '../src/_icons'),
|
||||
'naive-ui': path.resolve(__dirname, '../src/index.js'),
|
||||
'src': path.resolve(__dirname, '../src')
|
||||
src: path.resolve(__dirname, '../src')
|
||||
}
|
||||
|
||||
exports.resolve = {
|
||||
|
||||
@ -16,13 +16,13 @@ import { useMemo } from 'vooks'
|
||||
|
||||
export default {
|
||||
name: 'Site',
|
||||
components: {
|
||||
SiteHeader
|
||||
},
|
||||
inject: [
|
||||
'SiteProvider',
|
||||
'loadingBar'
|
||||
],
|
||||
components: {
|
||||
SiteHeader
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
Site: this
|
||||
|
||||
@ -83,24 +83,24 @@ export default {
|
||||
setup () {
|
||||
const { t } = i18n({
|
||||
'zh-CN': {
|
||||
'dark': '深色',
|
||||
'light': '浅色',
|
||||
'searchPlaceholder': '搜索',
|
||||
'home': '首页',
|
||||
'doc': '文档',
|
||||
'common': '常规',
|
||||
'debug': '调试',
|
||||
'alreadyHome': '别点了，你已经在首页了'
|
||||
dark: '深色',
|
||||
light: '浅色',
|
||||
searchPlaceholder: '搜索',
|
||||
home: '首页',
|
||||
doc: '文档',
|
||||
common: '常规',
|
||||
debug: '调试',
|
||||
alreadyHome: '别点了，你已经在首页了'
|
||||
},
|
||||
'en-US': {
|
||||
'dark': 'Dark',
|
||||
'light': 'Light',
|
||||
'searchPlaceholder': 'Search',
|
||||
'home': 'Home',
|
||||
'doc': 'Documentation',
|
||||
'common': 'Common',
|
||||
'debug': 'Debug',
|
||||
'alreadyHome': "You've already been in home page. No clicking."
|
||||
dark: 'Dark',
|
||||
light: 'Light',
|
||||
searchPlaceholder: 'Search',
|
||||
home: 'Home',
|
||||
doc: 'Documentation',
|
||||
common: 'Common',
|
||||
debug: 'Debug',
|
||||
alreadyHome: "You've already been in home page. No clicking."
|
||||
}
|
||||
})
|
||||
const menuItemsRef = computed(() => {
|
||||
|
||||
@ -22,13 +22,19 @@ import Site from './Site.vue'
|
||||
|
||||
export default {
|
||||
name: 'SiteProvider',
|
||||
components: {
|
||||
Site
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
SiteProvider: this
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Site
|
||||
beforeRouteEnter (to, from, next) {
|
||||
next()
|
||||
},
|
||||
beforeRouteUpdate (to, from, next) {
|
||||
next()
|
||||
},
|
||||
computed: {
|
||||
lang: {
|
||||
@ -53,12 +59,6 @@ export default {
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeRouteEnter (to, from, next) {
|
||||
next()
|
||||
},
|
||||
beforeRouteUpdate (to, from, next) {
|
||||
next()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -4,13 +4,13 @@
|
||||
title="Parklife"
|
||||
:deactivate="() => isActive = false"
|
||||
>
|
||||
<template v-slot:header>
|
||||
<template #header>
|
||||
{{ time }}
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<template #footer>
|
||||
v-slot:footer
|
||||
</template>
|
||||
<template v-slot:content>
|
||||
<template #content>
|
||||
<n-input
|
||||
v-model="time"
|
||||
/>
|
||||
@ -26,7 +26,7 @@
|
||||
trigger="click"
|
||||
style="margin-right: 12px;"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button style="margin: 0;">
|
||||
California Girls(Click)
|
||||
</n-button>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<n-modal v-model="value">
|
||||
<template v-slot:header>
|
||||
<template #header>
|
||||
<n-input v-model="time" /> {{ time }}
|
||||
<n-button>Look at it</n-button>
|
||||
</template>
|
||||
<n-input v-model="time" /> {{ time }}
|
||||
<template v-slot:footer>
|
||||
<template #footer>
|
||||
<n-input v-model="time" /> {{ time }}
|
||||
<n-button>Look at it</n-button>
|
||||
</template>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<n-config-provider style="height: 6000px; width: 6000px;" theme="light">
|
||||
<div class="popover-grid" style="margin-top: 1500px;">
|
||||
<n-popover placement="top-start" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 1 / 2 / 2 / 3;">
|
||||
Top Start
|
||||
</n-button>
|
||||
@ -12,7 +12,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="top" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 1 / 3 / 2 / 4;">
|
||||
Top
|
||||
</n-button>
|
||||
@ -22,7 +22,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="top-end" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 1 / 4/ 2 / 5;">
|
||||
Top End
|
||||
</n-button>
|
||||
@ -32,7 +32,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="left-start" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 2 / 1 / 3 / 2;">
|
||||
Left Start
|
||||
</n-button>
|
||||
@ -42,7 +42,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="left" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 3 / 1 / 4 / 2;">
|
||||
Left
|
||||
</n-button>
|
||||
@ -52,7 +52,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="left-end" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 4 / 1 / 5 / 2;">
|
||||
Left End
|
||||
</n-button>
|
||||
@ -62,7 +62,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="right-start" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 2 / 5 / 3 / 6;">
|
||||
Right Start
|
||||
</n-button>
|
||||
@ -72,7 +72,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="right" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 3 / 5 / 4 / 6;">
|
||||
Right
|
||||
</n-button>
|
||||
@ -82,7 +82,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="right-end" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 4 / 5 / 5 / 6;">
|
||||
Right End
|
||||
</n-button>
|
||||
@ -92,7 +92,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="bottom-start" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 5 / 2 / 6 / 3;">
|
||||
Bottom Start
|
||||
</n-button>
|
||||
@ -102,7 +102,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="bottom" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 5 / 3 / 6 / 4;">
|
||||
Bottom
|
||||
</n-button>
|
||||
@ -112,7 +112,7 @@
|
||||
</div>
|
||||
</n-popover>
|
||||
<n-popover placement="bottom-end" trigger="click">
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button size="small" style="grid-area: 5 / 4 / 6 / 5;">
|
||||
Bottom End
|
||||
</n-button>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<n-config-consumer>
|
||||
<template v-slot="{ styleScheme }">
|
||||
<template #default="{ styleScheme }">
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="30 0 579.43 484.77">
|
||||
<g id="Page-1" style="opacity:.9">
|
||||
<g id="Dark-1-Copy-3">
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<n-config-consumer>
|
||||
<template v-slot="{ styleScheme }">
|
||||
<template #default="{ styleScheme }">
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 575.08 485.98">
|
||||
<g id="Page-1" style="opacity:.9">
|
||||
<g id="Dark-1-Copy-3">
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<n-config-consumer>
|
||||
<template v-slot="{ theme }">
|
||||
<template #default="{ theme }">
|
||||
<div>
|
||||
<n-layout-footer position="absolute" style="z-index: auto;">
|
||||
<landing-footer style="max-width: 1200px; margin: auto;" />
|
||||
@ -47,32 +47,32 @@ import rightImage from './Right.vue'
|
||||
import { i18n } from '../../util-composables'
|
||||
|
||||
export default {
|
||||
inject: {
|
||||
NConfigProvider: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
LandingFooter,
|
||||
leftImage,
|
||||
rightImage
|
||||
},
|
||||
inject: {
|
||||
NConfigProvider: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup () {
|
||||
return {
|
||||
...(i18n({
|
||||
'zh-CN': {
|
||||
'start': '开始使用',
|
||||
'intro1': '一个 Vue UI 框架',
|
||||
'intro2': '在意样式，带主题，比较完整，不算太慢',
|
||||
'intro3': '有点意思',
|
||||
'intro4': '换个主题'
|
||||
start: '开始使用',
|
||||
intro1: '一个 Vue UI 框架',
|
||||
intro2: '在意样式，带主题，比较完整，不算太慢',
|
||||
intro3: '有点意思',
|
||||
intro4: '换个主题'
|
||||
},
|
||||
'en-US': {
|
||||
'start': 'Get Started',
|
||||
'intro1': 'A Vue UI Framework',
|
||||
'intro2': 'Caring About Styles, Themed, Batteries Included, Not Rather Slow',
|
||||
'intro3': 'Interesting Somehow',
|
||||
'intro4': 'Change Theme'
|
||||
start: 'Get Started',
|
||||
intro1: 'A Vue UI Framework',
|
||||
intro2: 'Caring About Styles, Themed, Batteries Included, Not Rather Slow',
|
||||
intro3: 'Interesting Somehow',
|
||||
intro4: 'Change Theme'
|
||||
}
|
||||
}))
|
||||
}
|
||||
|
||||
@ -4,13 +4,13 @@
|
||||
relative-url="<!--URL-->"
|
||||
title="<!--TITLE_SLOT-->"
|
||||
>
|
||||
<template v-slot:title>
|
||||
<template #title>
|
||||
<!--TITLE_SLOT-->
|
||||
</template>
|
||||
<template v-slot:content>
|
||||
<template #content>
|
||||
<!--CONTENT_SLOT-->
|
||||
</template>
|
||||
<template v-slot:demo>
|
||||
<template #demo>
|
||||
<div
|
||||
class="demo-card__view"
|
||||
>
|
||||
@ -18,7 +18,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<template
|
||||
v-slot:code
|
||||
#code
|
||||
>
|
||||
<!--CODE_SLOT-->
|
||||
</template>
|
||||
|
||||
@ -31,7 +31,7 @@ module.exports = function (content, path) {
|
||||
content = content.replace(/\n#/g, '\n\n#')
|
||||
const tokens = marked.lexer(content)
|
||||
const titleIndex = tokens.findIndex(token => token.type === 'heading' && token.depth === 1)
|
||||
let titleText = titleIndex > -1 ? JSON.stringify(tokens[titleIndex].text) : null
|
||||
const titleText = titleIndex > -1 ? JSON.stringify(tokens[titleIndex].text) : null
|
||||
const anchor = parseMdAsAnchor(tokens)
|
||||
const components = parseComponents(tokens)
|
||||
const importStatements = components
|
||||
|
||||
@ -45,7 +45,7 @@ function createRenderer (wrapCodeWithCard = true) {
|
||||
blockquote: quote => {
|
||||
return `<n-blockquote>${quote}</n-blockquote>`
|
||||
},
|
||||
hr: () => `<n-hr />`,
|
||||
hr: () => '<n-hr />',
|
||||
paragraph: text => {
|
||||
return `<n-p>${text}</n-p>`
|
||||
},
|
||||
|
||||
@ -16,13 +16,13 @@ const appendCounts = item => {
|
||||
},
|
||||
scopedSlots: {
|
||||
default: ({ styleScheme }) => {
|
||||
return h('span', [ item.name, h('span', {
|
||||
return h('span', [item.name, h('span', {
|
||||
style: {
|
||||
color: styleScheme.tertiaryTextColor,
|
||||
fontWeight: '400',
|
||||
transition: `color .3s ${styleScheme.easeInOutCubicBezier}`
|
||||
}
|
||||
}, [ ' (', item.count, ')' ])])
|
||||
}, [' (', item.count, ')'])])
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@ -7,17 +7,17 @@
|
||||
}"
|
||||
:content-style="contentStyle"
|
||||
>
|
||||
<template v-slot:header>
|
||||
<template #header>
|
||||
<slot name="title" />
|
||||
</template>
|
||||
|
||||
<template v-slot:header-extra>
|
||||
<template #header-extra>
|
||||
<n-tooltip
|
||||
trigger="hover"
|
||||
:placement="'top'"
|
||||
:show-arrow="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<edit-on-github-button
|
||||
style="padding: 0; margin-right: 6px;"
|
||||
size="tiny"
|
||||
@ -32,7 +32,7 @@
|
||||
:placement="'top'"
|
||||
:show-arrow="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<n-button
|
||||
style="padding: 0;"
|
||||
size="tiny"
|
||||
@ -40,7 +40,7 @@
|
||||
icon-depth="tertiary"
|
||||
@click="toggleCodeDisplay"
|
||||
>
|
||||
<template v-slot:icon>
|
||||
<template #icon>
|
||||
<code-outline />
|
||||
</template>
|
||||
</n-button>
|
||||
@ -50,7 +50,7 @@
|
||||
</template>
|
||||
<slot name="content" />
|
||||
<slot name="demo" />
|
||||
<template v-if="showCode" v-slot:footer>
|
||||
<template v-if="showCode" #footer>
|
||||
<n-scrollbar x-scrollable>
|
||||
<slot name="code" />
|
||||
</n-scrollbar>
|
||||
@ -67,6 +67,11 @@ export default {
|
||||
components: {
|
||||
codeOutline
|
||||
},
|
||||
inject: {
|
||||
NDocumentation: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
@ -81,24 +86,19 @@ export default {
|
||||
required: true
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NDocumentation: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup () {
|
||||
return {
|
||||
displayMode: displayModeRef,
|
||||
...(i18n({
|
||||
'zh-CN': {
|
||||
'show': '显示代码',
|
||||
'hide': '收起代码',
|
||||
'editOnGithub': '在 Github 上编辑'
|
||||
show: '显示代码',
|
||||
hide: '收起代码',
|
||||
editOnGithub: '在 Github 上编辑'
|
||||
},
|
||||
'en-US': {
|
||||
'show': 'Show Code',
|
||||
'hide': 'Hide Code',
|
||||
'editOnGithub': 'Edit on Github'
|
||||
show: 'Show Code',
|
||||
hide: 'Hide Code',
|
||||
editOnGithub: 'Edit on Github'
|
||||
}
|
||||
}))
|
||||
}
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
:size="size"
|
||||
@click="handleEditOnGithubClick"
|
||||
>
|
||||
<template v-slot:icon>
|
||||
<template #icon>
|
||||
<edit-icon />
|
||||
</template>
|
||||
</n-button>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
placement="left"
|
||||
:show-arrow="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<template #activator>
|
||||
<edit-on-github-button
|
||||
text
|
||||
size="large"
|
||||
@ -40,10 +40,10 @@ export default {
|
||||
return {
|
||||
...(i18n({
|
||||
'zh-CN': {
|
||||
'editOnGithub': '在 Github 上编辑'
|
||||
editOnGithub: '在 Github 上编辑'
|
||||
},
|
||||
'en-US': {
|
||||
'editOnGithub': 'Edit on Github'
|
||||
editOnGithub: 'Edit on Github'
|
||||
}
|
||||
}))
|
||||
}
|
||||
|
||||
@ -24,7 +24,7 @@ module.exports = {
|
||||
}
|
||||
if (/.md$/.test(ctx.path) || ctx.path.endsWith('.entry')) {
|
||||
const publicPath = ctx.path
|
||||
let filePath = resolver.requestToFile(publicPath)
|
||||
const filePath = resolver.requestToFile(publicPath)
|
||||
const content = mdTransform2VueTemplateHandlers(filePath)
|
||||
// make it Treat as vue
|
||||
ctx.vue = true
|
||||
|
||||
@ -43,15 +43,21 @@
|
||||
"@babel/preset-env": "^7.12.1",
|
||||
"@rollup/plugin-alias": "^3.1.1",
|
||||
"@rollup/plugin-node-resolve": "^10.0.0",
|
||||
"@rollup/plugin-replace": "^2.3.4",
|
||||
"@types/jest": "^26.0.15",
|
||||
"@vue/compiler-sfc": "^3.0.2",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"@vue/test-utils": "^2.0.0-beta.8",
|
||||
"autoprefixer": "^9.8.6",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"babel-jest": "^26.6.2",
|
||||
"cross-env": "^5.2.1",
|
||||
"cssnano": "^4.1.10",
|
||||
"eslint": "^7.12.1",
|
||||
"eslint-plugin-import": "^2.22.1",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.2",
|
||||
"eslint-plugin-vue": "^7.1.0",
|
||||
"jest": "^26.6.2",
|
||||
"lodash": "^4.17.20",
|
||||
|
||||
@ -46,7 +46,7 @@ export default {
|
||||
computed: {
|
||||
styleTransform () {
|
||||
const type = this.type
|
||||
if (type === 'backward' || type === 'fast-backward') return `rotate(180deg)`
|
||||
if (type === 'backward' || type === 'fast-backward') return 'rotate(180deg)'
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ export default {
|
||||
},
|
||||
render () {
|
||||
const { tmNode: { rawNode } } = this
|
||||
const children = rawNode.render ? [rawNode.render(rawNode)] : [ rawNode.name ]
|
||||
const children = rawNode.render ? [rawNode.render(rawNode)] : [rawNode.name]
|
||||
return h('div', {
|
||||
class: 'n-base-select-group-header'
|
||||
}, children)
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
@resize="handleVirtualListResize"
|
||||
@scroll="handleVirtualListScroll"
|
||||
>
|
||||
<template v-slot="{ item: tmNode }">
|
||||
<template #default="{ item: tmNode }">
|
||||
<n-select-group-header
|
||||
v-if="tmNode.rawNode.type === 'group'"
|
||||
:key="tmNode.key"
|
||||
@ -89,11 +89,6 @@ import styles from './styles'
|
||||
|
||||
export default {
|
||||
name: 'BaseSelectMenu',
|
||||
provide () {
|
||||
return {
|
||||
NBaseSelectMenu: this
|
||||
}
|
||||
},
|
||||
components: {
|
||||
VirtualList,
|
||||
NScrollbar,
|
||||
@ -107,6 +102,11 @@ export default {
|
||||
injectCssrProps: true
|
||||
})
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NBaseSelectMenu: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
theme: {
|
||||
type: String,
|
||||
|
||||
@ -73,7 +73,7 @@ export default {
|
||||
},
|
||||
render () {
|
||||
const { rawNode } = this
|
||||
const children = rawNode.render ? rawNode.render(rawNode, this.isSelected) : [ rawNode.label ]
|
||||
const children = rawNode.render ? rawNode.render(rawNode, this.isSelected) : [rawNode.label]
|
||||
return h('div', {
|
||||
class: [
|
||||
'n-base-select-option',
|
||||
|
||||
@ -140,7 +140,7 @@ export default c([
|
||||
right: 0,
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
padding: `0 26px 0 14px`,
|
||||
padding: '0 26px 0 14px',
|
||||
color: pallete.placeholderColor,
|
||||
transition: `color .3s ${cubicBezierEaseInOut}`
|
||||
})
|
||||
|
||||
@ -6,7 +6,7 @@ import suffixStyle from '../../suffix/styles/light'
|
||||
export default create({
|
||||
name: 'BaseSelection',
|
||||
theme: 'dark',
|
||||
peer: [ suffixStyle ],
|
||||
peer: [suffixStyle],
|
||||
getDerivedVariables ({ base, derived }) {
|
||||
return {
|
||||
...commonVariables,
|
||||
|
||||
@ -6,7 +6,7 @@ import suffixStyle from '../../suffix/styles/dark'
|
||||
export default create({
|
||||
name: 'BaseSelection',
|
||||
theme: 'light',
|
||||
peer: [ suffixStyle ],
|
||||
peer: [suffixStyle],
|
||||
getDerivedVariables ({ base, derived }) {
|
||||
return {
|
||||
...commonVariables,
|
||||
|
||||
@ -53,11 +53,6 @@ import styles from './styles'
|
||||
|
||||
export default {
|
||||
name: 'BaseSuffix',
|
||||
inject: {
|
||||
NFormItem: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
CancelIcon,
|
||||
NBaseLoading,
|
||||
@ -66,6 +61,11 @@ export default {
|
||||
mixins: [
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NFormItem: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
theme: {
|
||||
type: String,
|
||||
|
||||
@ -68,17 +68,17 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
styles () {
|
||||
let style = {}
|
||||
const style = {}
|
||||
if (this.size) {
|
||||
if (typeof this.size === 'number') {
|
||||
style['width'] = this.size + 'px'
|
||||
style['height'] = this.size + 'px'
|
||||
style.width = this.size + 'px'
|
||||
style.height = this.size + 'px'
|
||||
} else if (this.size.endsWith('%') || this.size.endsWith('px')) {
|
||||
style['width'] = this.size
|
||||
style['height'] = this.size
|
||||
style.width = this.size
|
||||
style.height = this.size
|
||||
} else {
|
||||
style['width'] = this.size + 'px'
|
||||
style['height'] = this.size + 'px'
|
||||
style.width = this.size + 'px'
|
||||
style.height = this.size + 'px'
|
||||
}
|
||||
}
|
||||
if (this.color) {
|
||||
|
||||
@ -121,13 +121,13 @@ export default {
|
||||
const siderProps = {
|
||||
'show-toggle-button': true,
|
||||
'show-trigger': true,
|
||||
'collapsed': this.collapsed,
|
||||
collapsed: this.collapsed,
|
||||
'collapse-mode': 'width',
|
||||
'bordered': this.siderBordered,
|
||||
bordered: this.siderBordered,
|
||||
'show-content': !this.collapsed,
|
||||
'use-native-scrollbar': false,
|
||||
'collapsed-width': 0,
|
||||
'width': 288,
|
||||
width: 288,
|
||||
'trigger-style': {
|
||||
top: 'calc(50% - 78px)'
|
||||
},
|
||||
@ -162,7 +162,7 @@ export default {
|
||||
h(NLayoutSider, {
|
||||
...siderProps,
|
||||
style: {
|
||||
'display': 'flex',
|
||||
display: 'flex',
|
||||
'justify-content': 'flex-end',
|
||||
...this.siderStyle
|
||||
},
|
||||
|
||||
@ -1,81 +1,81 @@
|
||||
export const lightStyleScheme = {
|
||||
'primaryColor': '#18a058',
|
||||
'primaryHoverColor': '#36ad6a',
|
||||
'primaryActiveColor': '#0c7a43',
|
||||
'infoColor': '#2080f0',
|
||||
'infoHoverColor': '#4098fc',
|
||||
'infoActiveColor': '#1060c9',
|
||||
'successColor': '#18a058',
|
||||
'successHoverColor': '#36ad6a',
|
||||
'successActiveColor': '#0c7a43',
|
||||
'errorColor': '#d03050',
|
||||
'errorHoverColor': '#de576d',
|
||||
'errorActiveColor': '#ab1f3f',
|
||||
'warningColor': '#f0a020',
|
||||
'warningHoverColor': '#fcb040',
|
||||
'warningActiveColor': '#c97c10',
|
||||
'primaryTextColor': '#2e2e2e',
|
||||
'secondaryTextColor': '#474747',
|
||||
'tertiaryTextColor': '#9e9e9e',
|
||||
'quaternaryTextColor': '#c2c2c2',
|
||||
'primaryTextOverlayColor': 'rgba(0, 0, 0, .82)',
|
||||
'secondaryTextOverlayColor': 'rgba(0, 0, 0, .72)',
|
||||
'tertiaryTextOverlayColor': 'rgba(0, 0, 0, .38)',
|
||||
'quaternaryTextOverlayColor': 'rgba(0, 0, 0, .24)',
|
||||
'baseBackgroundColor': '#FFF',
|
||||
'popoverBackgroundColor': '#FFF',
|
||||
'modalBackgroundColor': '#FFF',
|
||||
'cardBackgroundColor': '#FFF',
|
||||
'bodyBackgroundColor': '#f8f8f8',
|
||||
'closeColor': '#9e9e9e',
|
||||
'closeOverlayColor': 'rgba(0, 0, 0, .38)',
|
||||
'dividerColor': '#ebebeb',
|
||||
'dividerOverlayColor': 'rgba(0, 0, 0, .08)',
|
||||
'borderColor': '#dbdbdb',
|
||||
'borderOverlayColor': 'rgba(0, 0, 0, .14)',
|
||||
'easeInOutCubicBezier': 'cubic-bezier(.4, 0, .2, 1)',
|
||||
'tableHeaderOverlayBackgroundColor': 'rgba(0, 0, 0, .02)',
|
||||
'inputOverlayBackgroundColor': null
|
||||
primaryColor: '#18a058',
|
||||
primaryHoverColor: '#36ad6a',
|
||||
primaryActiveColor: '#0c7a43',
|
||||
infoColor: '#2080f0',
|
||||
infoHoverColor: '#4098fc',
|
||||
infoActiveColor: '#1060c9',
|
||||
successColor: '#18a058',
|
||||
successHoverColor: '#36ad6a',
|
||||
successActiveColor: '#0c7a43',
|
||||
errorColor: '#d03050',
|
||||
errorHoverColor: '#de576d',
|
||||
errorActiveColor: '#ab1f3f',
|
||||
warningColor: '#f0a020',
|
||||
warningHoverColor: '#fcb040',
|
||||
warningActiveColor: '#c97c10',
|
||||
primaryTextColor: '#2e2e2e',
|
||||
secondaryTextColor: '#474747',
|
||||
tertiaryTextColor: '#9e9e9e',
|
||||
quaternaryTextColor: '#c2c2c2',
|
||||
primaryTextOverlayColor: 'rgba(0, 0, 0, .82)',
|
||||
secondaryTextOverlayColor: 'rgba(0, 0, 0, .72)',
|
||||
tertiaryTextOverlayColor: 'rgba(0, 0, 0, .38)',
|
||||
quaternaryTextOverlayColor: 'rgba(0, 0, 0, .24)',
|
||||
baseBackgroundColor: '#FFF',
|
||||
popoverBackgroundColor: '#FFF',
|
||||
modalBackgroundColor: '#FFF',
|
||||
cardBackgroundColor: '#FFF',
|
||||
bodyBackgroundColor: '#f8f8f8',
|
||||
closeColor: '#9e9e9e',
|
||||
closeOverlayColor: 'rgba(0, 0, 0, .38)',
|
||||
dividerColor: '#ebebeb',
|
||||
dividerOverlayColor: 'rgba(0, 0, 0, .08)',
|
||||
borderColor: '#dbdbdb',
|
||||
borderOverlayColor: 'rgba(0, 0, 0, .14)',
|
||||
easeInOutCubicBezier: 'cubic-bezier(.4, 0, .2, 1)',
|
||||
tableHeaderOverlayBackgroundColor: 'rgba(0, 0, 0, .02)',
|
||||
inputOverlayBackgroundColor: null
|
||||
}
|
||||
|
||||
export const darkStyleScheme = {
|
||||
'primaryColor': '#63e2b7',
|
||||
'primaryHoverColor': '#7fe7c4',
|
||||
'primaryActiveColor': '#5acea7',
|
||||
'infoColor': '#70C0E8',
|
||||
'infoHoverColor': '#8acbec',
|
||||
'infoActiveColor': '#66afd3',
|
||||
'successColor': '#64e3b8',
|
||||
'successHoverColor': '#7ee7c4',
|
||||
'successActiveColor': '#5acea7',
|
||||
'errorColor': '#e88080',
|
||||
'errorHoverColor': '#e98b8b',
|
||||
'errorActiveColor': '#e57272',
|
||||
'warningColor': '#f2c97d',
|
||||
'warningHoverColor': '#f5d599',
|
||||
'warningActiveColor': '#e6c260',
|
||||
'primaryTextColor': '#e6e6e6',
|
||||
'secondaryTextColor': '#d1d1d1',
|
||||
'tertiaryTextColor': '#858585',
|
||||
'quaternaryTextColor': '#616161',
|
||||
'primaryTextOverlayColor': 'rgba(255, 255, 255, .9)',
|
||||
'secondaryTextOverlayColor': 'rgba(255, 255, 255, .82)',
|
||||
'tertiaryTextOverlayColor': 'rgba(255, 255, 255, .52)',
|
||||
'quaternaryTextOverlayColor': 'rgba(255, 255, 255, .38)',
|
||||
'baseBackgroundColor': '#000',
|
||||
'popoverBackgroundColor': '#48484e',
|
||||
'modalBackgroundColor': '#2c2c32',
|
||||
'cardBackgroundColor': '#18181c',
|
||||
'bodyBackgroundColor': '#101014',
|
||||
'closeColor': '#858585',
|
||||
'closeOverlayColor': 'rgba(255, 255, 255, .52)',
|
||||
'dividerColor': '#171717',
|
||||
'dividerOverlayColor': 'rgba(255, 255, 255, .09)',
|
||||
'borderColor': '#3d3d3d',
|
||||
'borderOverlayColor': 'rgba(255, 255, 255, .24)',
|
||||
'easeInOutCubicBezier': 'cubic-bezier(.4, 0, .2, 1)',
|
||||
'tableHeaderOverlayBackgroundColor': 'rgba(255, 255, 255, .06)',
|
||||
'inputOverlayBackgroundColor': 'rgba(255, 255, 255, .1)'
|
||||
primaryColor: '#63e2b7',
|
||||
primaryHoverColor: '#7fe7c4',
|
||||
primaryActiveColor: '#5acea7',
|
||||
infoColor: '#70C0E8',
|
||||
infoHoverColor: '#8acbec',
|
||||
infoActiveColor: '#66afd3',
|
||||
successColor: '#64e3b8',
|
||||
successHoverColor: '#7ee7c4',
|
||||
successActiveColor: '#5acea7',
|
||||
errorColor: '#e88080',
|
||||
errorHoverColor: '#e98b8b',
|
||||
errorActiveColor: '#e57272',
|
||||
warningColor: '#f2c97d',
|
||||
warningHoverColor: '#f5d599',
|
||||
warningActiveColor: '#e6c260',
|
||||
primaryTextColor: '#e6e6e6',
|
||||
secondaryTextColor: '#d1d1d1',
|
||||
tertiaryTextColor: '#858585',
|
||||
quaternaryTextColor: '#616161',
|
||||
primaryTextOverlayColor: 'rgba(255, 255, 255, .9)',
|
||||
secondaryTextOverlayColor: 'rgba(255, 255, 255, .82)',
|
||||
tertiaryTextOverlayColor: 'rgba(255, 255, 255, .52)',
|
||||
quaternaryTextOverlayColor: 'rgba(255, 255, 255, .38)',
|
||||
baseBackgroundColor: '#000',
|
||||
popoverBackgroundColor: '#48484e',
|
||||
modalBackgroundColor: '#2c2c32',
|
||||
cardBackgroundColor: '#18181c',
|
||||
bodyBackgroundColor: '#101014',
|
||||
closeColor: '#858585',
|
||||
closeOverlayColor: 'rgba(255, 255, 255, .52)',
|
||||
dividerColor: '#171717',
|
||||
dividerOverlayColor: 'rgba(255, 255, 255, .09)',
|
||||
borderColor: '#3d3d3d',
|
||||
borderOverlayColor: 'rgba(255, 255, 255, .24)',
|
||||
easeInOutCubicBezier: 'cubic-bezier(.4, 0, .2, 1)',
|
||||
tableHeaderOverlayBackgroundColor: 'rgba(255, 255, 255, .06)',
|
||||
inputOverlayBackgroundColor: 'rgba(255, 255, 255, .1)'
|
||||
}
|
||||
|
||||
export default {
|
||||
|
||||
@ -8,9 +8,11 @@ class ZIndexManager {
|
||||
this.elementZIndex = new Map()
|
||||
this.nextZIndex = 2000
|
||||
}
|
||||
|
||||
get elementCount () {
|
||||
return this.elementZIndex.size
|
||||
}
|
||||
|
||||
registerElement (el, zIndex) {
|
||||
if (__DEV__) {
|
||||
debug('z-index-manager/register-element', 'Called.')
|
||||
@ -34,6 +36,7 @@ class ZIndexManager {
|
||||
}
|
||||
this.afterManipulation()
|
||||
}
|
||||
|
||||
setNewZIndex (el, zIndex) {
|
||||
if (__DEV__) {
|
||||
debug('z-index-manager/set-new-z-index', 'Called.')
|
||||
@ -59,6 +62,7 @@ class ZIndexManager {
|
||||
}
|
||||
this.afterManipulation()
|
||||
}
|
||||
|
||||
unregisterElement (el) {
|
||||
if (__DEV__) {
|
||||
debug('z-index-manager/unregister-element', 'Called.')
|
||||
@ -73,12 +77,14 @@ class ZIndexManager {
|
||||
}
|
||||
this.afterManipulation()
|
||||
}
|
||||
|
||||
afterManipulation () {
|
||||
if (!this.elementCount) {
|
||||
this.nextZIndex = 2000
|
||||
}
|
||||
if (this.nextZIndex - this.elementCount > 2500) this.rearrangeZIndex()
|
||||
}
|
||||
|
||||
rearrangeZIndex () {
|
||||
const elementZIndexPair = Array.from(this.elementZIndex.entries())
|
||||
elementZIndexPair.sort((pair1, pair2) => {
|
||||
|
||||
@ -58,7 +58,7 @@ function getNextBackgroundColorOf (el) {
|
||||
}
|
||||
|
||||
let cachedNextBackgroundColor = null
|
||||
let cachedCSSStyleDeclaration = new WeakMap()
|
||||
const cachedCSSStyleDeclaration = new WeakMap()
|
||||
let callCount = 0
|
||||
|
||||
function cache () {
|
||||
|
||||
@ -14,16 +14,16 @@ const lengthToCompare = {
|
||||
|
||||
const placementToTransformOrigin = {
|
||||
'bottom-start': 'top left',
|
||||
'bottom': 'top center',
|
||||
bottom: 'top center',
|
||||
'bottom-end': 'top right',
|
||||
'top-start': 'bottom left',
|
||||
'top': 'bottom',
|
||||
top: 'bottom',
|
||||
'top-end': 'bottom right',
|
||||
'right-start': 'top left',
|
||||
'right': 'center left',
|
||||
right: 'center left',
|
||||
'right-end': 'bottom left',
|
||||
'left-start': 'top right',
|
||||
'left': 'center right',
|
||||
left: 'center right',
|
||||
'left-end': 'bottom right'
|
||||
}
|
||||
|
||||
@ -38,8 +38,8 @@ const positionDirections = {
|
||||
'left-end': 'top'
|
||||
}
|
||||
const oppositePosition = {
|
||||
'start': 'end',
|
||||
'end': 'start'
|
||||
start: 'end',
|
||||
end: 'start'
|
||||
}
|
||||
|
||||
export function getAdjustedPlacementOfTrackingElement (placement, trackedRect, trackingRect, flip) {
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
import { find } from '../_utils/cssr'
|
||||
import globalStyle from '../_styles/global-style/index.cssr.js'
|
||||
import { warn } from '../_utils'
|
||||
|
||||
if (__DEV__) {
|
||||
if (!window.naive) window.naive = {}
|
||||
@ -6,27 +8,27 @@ if (__DEV__) {
|
||||
}
|
||||
|
||||
function getThemeVariables (naive, themeName) {
|
||||
const styles = naive.styles
|
||||
const { styles } = naive
|
||||
const theme = styles[themeName]
|
||||
return theme.base
|
||||
return theme.base // style[theme]base, for example style.light.base
|
||||
}
|
||||
|
||||
function createMutableStyleId (
|
||||
componentCssrId,
|
||||
renderedTheme,
|
||||
dependencyKey,
|
||||
dependencyValue
|
||||
depKey,
|
||||
depValue
|
||||
) {
|
||||
if (
|
||||
dependencyKey === 'mergedTheme' ||
|
||||
dependencyKey === 'theme'
|
||||
depKey === 'mergedTheme' ||
|
||||
depKey === 'theme'
|
||||
) {
|
||||
return componentCssrId + '-' + renderedTheme
|
||||
}
|
||||
return (
|
||||
componentCssrId + '-' +
|
||||
renderedTheme + '-' +
|
||||
dependencyKey + (dependencyValue ? ('-' + dependencyValue) : '')
|
||||
depKey + (depValue ? ('-' + depValue) : '')
|
||||
)
|
||||
}
|
||||
|
||||
@ -39,11 +41,13 @@ function createImmutableStyleId (
|
||||
function setupMutableStyle (
|
||||
instance,
|
||||
theme,
|
||||
dependencyKey,
|
||||
depKey,
|
||||
CNode
|
||||
) {
|
||||
const naive = instance.$naive
|
||||
const options = instance.$options
|
||||
const {
|
||||
$naive: naive,
|
||||
$options: options
|
||||
} = instance
|
||||
const {
|
||||
fallbackTheme,
|
||||
styles
|
||||
@ -51,26 +55,26 @@ function setupMutableStyle (
|
||||
const name = options.cssrName || options.name
|
||||
const id = options.cssrId || name
|
||||
const renderedTheme = theme || fallbackTheme
|
||||
const dependencyValue = (
|
||||
dependencyKey === 'mergedTheme' ||
|
||||
dependencyKey === 'theme'
|
||||
) ? renderedTheme : instance[dependencyKey]
|
||||
const depValue = (
|
||||
depKey === 'mergedTheme' ||
|
||||
depKey === 'theme'
|
||||
) ? renderedTheme : instance[depKey]
|
||||
if (
|
||||
__DEV__ &&
|
||||
(dependencyValue === null || dependencyValue === undefined)
|
||||
(depValue === null || depValue === undefined)
|
||||
) {
|
||||
console.error(`[naive-ui/mixins/usecssr]: dependency key ${name}.${dependencyKey} should not be nullable`, instance)
|
||||
warn('mixins/usecssr', `dependency key ${name}.${depKey} should not be nullable`)
|
||||
}
|
||||
const mountId = createMutableStyleId(
|
||||
id,
|
||||
renderedTheme,
|
||||
dependencyKey,
|
||||
dependencyValue
|
||||
depKey,
|
||||
depValue
|
||||
)
|
||||
if (find(mountId)) return
|
||||
const cssrPropsGetter = styles[renderedTheme][name]
|
||||
if (__DEV__ && !cssrPropsGetter) {
|
||||
console.error(`[naive-ui/mixins/usecssr]: ${name}'s style not found`, styles)
|
||||
warn('mixins/usecssr', `${name}'s style not found`)
|
||||
}
|
||||
// themeVariables: { base, derived }
|
||||
const themeVariables = getThemeVariables(naive, renderedTheme)
|
||||
@ -131,7 +135,7 @@ function getCssrProps (
|
||||
}
|
||||
}
|
||||
|
||||
const usecssr = function (styles, cssrPropsOption) {
|
||||
const usecssr = function (styles = [], cssrPropsOption) {
|
||||
// collect watchers
|
||||
const watchers = {}
|
||||
if (
|
||||
@ -193,7 +197,11 @@ const usecssr = function (styles, cssrPropsOption) {
|
||||
cssrProps: getCssrProps(this, this[cssrPropsOption.themeKey])
|
||||
}
|
||||
} : undefined,
|
||||
created () {
|
||||
beforeMount () {
|
||||
globalStyle.mount({
|
||||
target: 'naive-ui-global',
|
||||
count: false
|
||||
})
|
||||
styles.forEach(style => {
|
||||
if (__DEV__) {
|
||||
window.naive.styleRenderingDuration -= performance.now()
|
||||
|
||||
@ -19,16 +19,16 @@ export default function ({
|
||||
transition: `transform ${duration} ${cubicBezierEaseOut}`
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-to`, {
|
||||
transform: `translateY(0)`
|
||||
transform: 'translateY(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-from`, {
|
||||
transform: `translateY(100%)`
|
||||
transform: 'translateY(100%)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-from`, {
|
||||
transform: `translateY(0)`
|
||||
transform: 'translateY(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-to`, {
|
||||
transform: `translateY(100%)`
|
||||
transform: 'translateY(100%)'
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
@ -19,16 +19,16 @@ export default function ({
|
||||
transition: `transform ${duration} ${cubicBezierEaseOut}`
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-to`, {
|
||||
transform: `translateX(0)`
|
||||
transform: 'translateX(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-from`, {
|
||||
transform: `translateX(-100%)`
|
||||
transform: 'translateX(-100%)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-from`, {
|
||||
transform: `translateX(0)`
|
||||
transform: 'translateX(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-to`, {
|
||||
transform: `translateX(-100%)`
|
||||
transform: 'translateX(-100%)'
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
@ -19,16 +19,16 @@ export default function ({
|
||||
transition: `transform ${duration} ${cubicBezierEaseOut}`
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-to`, {
|
||||
transform: `translateX(0)`
|
||||
transform: 'translateX(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-from`, {
|
||||
transform: `translateX(100%)`
|
||||
transform: 'translateX(100%)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-from`, {
|
||||
transform: `translateX(0)`
|
||||
transform: 'translateX(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-to`, {
|
||||
transform: `translateX(100%)`
|
||||
transform: 'translateX(100%)'
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
@ -19,16 +19,16 @@ export default function ({
|
||||
transition: `transform ${duration} ${cubicBezierEaseOut}`
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-to`, {
|
||||
transform: `translateY(0)`
|
||||
transform: 'translateY(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-enter-from`, {
|
||||
transform: `translateY(-100%)`
|
||||
transform: 'translateY(-100%)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-from`, {
|
||||
transform: `translateY(0)`
|
||||
transform: 'translateY(0)'
|
||||
}),
|
||||
c(`&.${namespace}-${name}-transition-leave-to`, {
|
||||
transform: `translateY(-100%)`
|
||||
transform: 'translateY(-100%)'
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
@ -6,9 +6,11 @@ class ClickOutsideDelegate {
|
||||
this.handleMouseUpOutside = this.handleMouseUpOutside.bind(this)
|
||||
this.handleMouseDown = this.handleMouseDown.bind(this)
|
||||
}
|
||||
|
||||
handleMouseDown (e) {
|
||||
this.mouseDownTarget = e.target
|
||||
}
|
||||
|
||||
handleMouseUpOutside (e) {
|
||||
const { target } = e
|
||||
for (const [handler, { els }] of this.handlers) {
|
||||
@ -25,6 +27,7 @@ class ClickOutsideDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
unregisterHandler (handler) {
|
||||
if (__DEV__) {
|
||||
console.debug('[ClickOutsideDelegate]: unregisterHandler')
|
||||
@ -54,6 +57,7 @@ class ClickOutsideDelegate {
|
||||
this.handlers = new Map()
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (els, handler) {
|
||||
if (!Array.isArray(els)) {
|
||||
els = [els]
|
||||
|
||||
@ -59,6 +59,7 @@ class KeyboardDelegate {
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
getKeyboardStatus () {
|
||||
return {
|
||||
shiftPressed: this.shiftPressed,
|
||||
@ -67,6 +68,7 @@ class KeyboardDelegate {
|
||||
tabPressed: this.c
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (keyCode, type, handler, options = {}) {
|
||||
this.handlerInfoList.push({
|
||||
keyCode,
|
||||
@ -77,6 +79,7 @@ class KeyboardDelegate {
|
||||
capture: options.capture
|
||||
})
|
||||
}
|
||||
|
||||
unregisterHandler (handler) {
|
||||
this.handlerInfoList = this.handlerInfoList.filter(handlerInfo => {
|
||||
return handler !== handlerInfo.handler
|
||||
|
||||
@ -7,6 +7,7 @@ class MoveOutsideDelegate {
|
||||
this.handlerCount = 0
|
||||
this.handleMoveOutside = this.handleMoveOutside.bind(this)
|
||||
}
|
||||
|
||||
handleMoveOutside (e) {
|
||||
const target = e.target
|
||||
for (const [handler, { els, once }] of this.handlers) {
|
||||
@ -34,6 +35,7 @@ class MoveOutsideDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
unregisterHandler (handler) {
|
||||
if (__DEV__) {
|
||||
console.debug('[MoveOutsideDelegate]: unregisterHandler')
|
||||
@ -51,6 +53,7 @@ class MoveOutsideDelegate {
|
||||
this.handlers = new Map()
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (els, handler, once = true) {
|
||||
if (!Array.isArray(els)) {
|
||||
els = [els]
|
||||
|
||||
@ -7,6 +7,7 @@ class MutationObserverDelegate {
|
||||
this.observers = new Map()
|
||||
this.handleMutation = this.handleMutation.bind(this)
|
||||
}
|
||||
|
||||
handleMutation (mutationList) {
|
||||
for (const mutationRecord of mutationList) {
|
||||
const handlers = this.handlers.get(mutationRecord.target)
|
||||
@ -17,6 +18,7 @@ class MutationObserverDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
unregisterHandler (el, handler) {
|
||||
const handlers = this.handlers.get(el)
|
||||
if (handlers) {
|
||||
@ -32,6 +34,7 @@ class MutationObserverDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (el, handler) {
|
||||
if (this.handlers.get(el)) {
|
||||
this.handlers.get(el).push(handler)
|
||||
|
||||
@ -6,6 +6,7 @@ class ResizeDelegate {
|
||||
this.handlers = []
|
||||
this.handleResize = this.handleResize.bind(this)
|
||||
}
|
||||
|
||||
handleResize (e) {
|
||||
const handlers = this.handlers
|
||||
if (handlers.length) {
|
||||
@ -14,6 +15,7 @@ class ResizeDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
unregisterHandler (handler) {
|
||||
const handlers = this.handlers
|
||||
if (handlers.length) {
|
||||
@ -31,6 +33,7 @@ class ResizeDelegate {
|
||||
window.removeEventListener('resize', this.handleResize, true)
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (handler) {
|
||||
if (!this.handlers.length) {
|
||||
if (__DEV__) {
|
||||
|
||||
@ -7,6 +7,7 @@ class ScrollDelegate {
|
||||
this.handlerCount = 0
|
||||
this.handleScroll = this.handleScroll.bind(this)
|
||||
}
|
||||
|
||||
handleScroll (e) {
|
||||
const handlers = this.handlers.get(e.target)
|
||||
if (handlers) {
|
||||
@ -15,6 +16,7 @@ class ScrollDelegate {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
unregisterHandler (el, handler) {
|
||||
const handlers = this.handlers.get(el)
|
||||
if (handlers) {
|
||||
@ -37,6 +39,7 @@ class ScrollDelegate {
|
||||
this.handlers = new Map()
|
||||
}
|
||||
}
|
||||
|
||||
registerHandler (el, handler) {
|
||||
if (!this.handlerCount) {
|
||||
if (__DEV__) {
|
||||
|
||||
@ -98,12 +98,6 @@ export default {
|
||||
scrollElement: ref(null)
|
||||
}
|
||||
},
|
||||
beforeUnmount () {
|
||||
const { scrollElement } = this
|
||||
if (scrollElement) {
|
||||
scrollElement.removeEventListener('scroll', this.handleScroll)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
activeHref (value) {
|
||||
if (value === null) {
|
||||
@ -112,6 +106,12 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeUnmount () {
|
||||
const { scrollElement } = this
|
||||
if (scrollElement) {
|
||||
scrollElement.removeEventListener('scroll', this.handleScroll)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
disableTransitionOneTick () {
|
||||
const barEl = this.$refs.bar
|
||||
@ -220,8 +220,8 @@ export default {
|
||||
return a.top > b.top || a.top === b.top ? a.height < b.height : false
|
||||
})
|
||||
const currentActiveHref = this.activeHref
|
||||
let bound = this.bound
|
||||
let ignoreGap = this.ignoreGap
|
||||
const bound = this.bound
|
||||
const ignoreGap = this.ignoreGap
|
||||
const activeLink = links.reduce((prevLink, link, index) => {
|
||||
if (link.top + link.height < 0) {
|
||||
if (ignoreGap) {
|
||||
|
||||
@ -2,14 +2,14 @@ import { c, cTB, cB, cM, createKey } from '../../../_utils/cssr'
|
||||
|
||||
function createRippleAnimation () {
|
||||
return [
|
||||
c(`@keyframes badge-wave-spread`, {
|
||||
c('@keyframes badge-wave-spread', {
|
||||
from: {
|
||||
boxShadow: `0 0 0.5px 0px var(--ripple-color)`,
|
||||
boxShadow: '0 0 0.5px 0px var(--ripple-color)',
|
||||
opacity: 0.6
|
||||
},
|
||||
to: {
|
||||
// don't use exact 5px since chrome will display the animation with glitches
|
||||
boxShadow: `0 0 0.5px 4.5px var(--ripple-color)`,
|
||||
boxShadow: '0 0 0.5px 4.5px var(--ripple-color)',
|
||||
opacity: 0
|
||||
}
|
||||
})
|
||||
|
||||
@ -91,6 +91,11 @@ export default {
|
||||
NIconSwitchTransition,
|
||||
NFadeInExpandTransition
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NButtonGroup: {
|
||||
default: null
|
||||
@ -99,11 +104,6 @@ export default {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
props: {
|
||||
color: {
|
||||
type: String,
|
||||
|
||||
@ -16,7 +16,7 @@ export default c([
|
||||
cB('base-wave', [
|
||||
cM('active', {
|
||||
zIndex: 1,
|
||||
animationName: `button-wave-spread, button-wave-opacity`
|
||||
animationName: 'button-wave-spread, button-wave-opacity'
|
||||
})
|
||||
]),
|
||||
// background-color
|
||||
@ -77,16 +77,16 @@ function extractPallete (props, type) {
|
||||
|
||||
function createRippleAnimation () {
|
||||
return [
|
||||
c(`@keyframes button-wave-spread`, {
|
||||
c('@keyframes button-wave-spread', {
|
||||
from: {
|
||||
boxShadow: `0 0 0.5px 0 var(--ripple-color)`
|
||||
boxShadow: '0 0 0.5px 0 var(--ripple-color)'
|
||||
},
|
||||
to: {
|
||||
// don't use exact 5px since chrome will display the animation with glitches
|
||||
boxShadow: `0 0 0.5px 4.5px var(--ripple-color)`
|
||||
boxShadow: '0 0 0.5px 4.5px var(--ripple-color)'
|
||||
}
|
||||
}),
|
||||
c(`@keyframes button-wave-opacity`, {
|
||||
c('@keyframes button-wave-opacity', {
|
||||
from: {
|
||||
opacity: 0.6
|
||||
},
|
||||
|
||||
@ -96,20 +96,17 @@ export default {
|
||||
NBaseSelection,
|
||||
NLazyTeleport
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
locale('Cascader'),
|
||||
usecssr(styles)
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NCascader: this
|
||||
}
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
locale('Cascader'),
|
||||
usecssr(styles, {
|
||||
themeKey: 'mergedTheme',
|
||||
injectCssrProps: true
|
||||
})
|
||||
],
|
||||
props: {
|
||||
options: {
|
||||
type: Array,
|
||||
|
||||
@ -78,11 +78,6 @@ import { useMemo } from 'vooks'
|
||||
|
||||
export default {
|
||||
name: 'NCascaderOption',
|
||||
inject: {
|
||||
NCascader: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NCheckbox,
|
||||
NBaseLoading,
|
||||
@ -90,6 +85,11 @@ export default {
|
||||
ChevronRightIcon,
|
||||
CheckmarkIcon
|
||||
},
|
||||
inject: {
|
||||
NCascader: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
tmNode: {
|
||||
type: Object,
|
||||
|
||||
@ -46,11 +46,6 @@ export default {
|
||||
components: {
|
||||
NBaseSelectMenu
|
||||
},
|
||||
inject: {
|
||||
NCascader: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
zindexable,
|
||||
clickoutside
|
||||
@ -58,6 +53,11 @@ export default {
|
||||
mixins: [
|
||||
placeable
|
||||
],
|
||||
inject: {
|
||||
NCascader: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
// eslint-disable-next-line vue/require-prop-types
|
||||
placement: {
|
||||
|
||||
@ -22,15 +22,15 @@ import NScrollbar from '../../scrollbar'
|
||||
|
||||
export default {
|
||||
name: 'NCascaderSubmenu',
|
||||
components: {
|
||||
NCascaderOption,
|
||||
NScrollbar
|
||||
},
|
||||
inject: {
|
||||
NCascader: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NCascaderOption,
|
||||
NScrollbar
|
||||
},
|
||||
props: {
|
||||
depth: {
|
||||
type: Number,
|
||||
|
||||
@ -68,11 +68,6 @@ import { warn, call } from '../../_utils'
|
||||
|
||||
export default {
|
||||
name: 'Checkbox',
|
||||
inject: {
|
||||
NCheckboxGroup: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NIconSwitchTransition,
|
||||
CheckMark,
|
||||
@ -102,6 +97,11 @@ export default {
|
||||
}),
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NCheckboxGroup: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
size: {
|
||||
validator (value) {
|
||||
|
||||
@ -63,7 +63,7 @@ export default {
|
||||
nTriggerFormChange
|
||||
} = this
|
||||
if (Array.isArray(this.value)) {
|
||||
let groupValue = Array.from(this.value)
|
||||
const groupValue = Array.from(this.value)
|
||||
const index = groupValue.findIndex(value => value === checkboxValue)
|
||||
if (checked) {
|
||||
if (!~index) {
|
||||
|
||||
@ -46,13 +46,13 @@ export default create({
|
||||
.hljs-attribute,
|
||||
.hljs-meta-string
|
||||
`, {
|
||||
color: `#50a14f`
|
||||
color: '#50a14f'
|
||||
}),
|
||||
c(`
|
||||
.hljs-built_in,
|
||||
.hljs-class .hljs-title
|
||||
`, {
|
||||
color: `#c18401`
|
||||
color: '#c18401'
|
||||
}),
|
||||
c(`
|
||||
.hljs-attr,
|
||||
@ -64,7 +64,7 @@ export default create({
|
||||
.hljs-selector-pseudo,
|
||||
.hljs-number
|
||||
`, {
|
||||
color: `#986801`
|
||||
color: '#986801'
|
||||
}),
|
||||
c(`
|
||||
.hljs-symbol,
|
||||
@ -74,10 +74,10 @@ export default create({
|
||||
.hljs-selector-id,
|
||||
.hljs-title
|
||||
`, {
|
||||
color: `#4078f2`
|
||||
color: '#4078f2'
|
||||
}),
|
||||
c('.hljs-emphasis', {
|
||||
fontStyle: `italic`
|
||||
fontStyle: 'italic'
|
||||
}),
|
||||
c('.hljs-strong', {
|
||||
fontWeight: base.fontWeightStrong
|
||||
|
||||
@ -61,7 +61,7 @@ export default {
|
||||
default: undefined
|
||||
},
|
||||
name: {
|
||||
type: [ String, Number ],
|
||||
type: [String, Number],
|
||||
default: undefined
|
||||
},
|
||||
displayDirective: {
|
||||
|
||||
@ -1,53 +1,62 @@
|
||||
import version from './version'
|
||||
import globalStyle from './_styles/global-style/index.cssr.js'
|
||||
import { warn } from './_utils'
|
||||
|
||||
function setHljs (hljs) {
|
||||
this.hljs = hljs
|
||||
}
|
||||
|
||||
function createLocalesObject (locales) {
|
||||
return locales && locales.reduce((localesObject, locale) => {
|
||||
localesObject[locale._name] = locale
|
||||
return localesObject
|
||||
return locales && locales.reduce((localeMap, locale) => {
|
||||
localeMap[locale._name] = locale
|
||||
return localeMap
|
||||
}, {})
|
||||
}
|
||||
|
||||
function createStylesObject (styles) {
|
||||
const stylesObject = {}
|
||||
const styleMap = {}
|
||||
function traverse (rootStyles) {
|
||||
rootStyles.forEach(style => {
|
||||
if (!stylesObject[style.theme]) {
|
||||
stylesObject[style.theme] = {}
|
||||
stylesObject[style.theme].override = (...args) => {
|
||||
stylesObject[style.theme].base.override(...args)
|
||||
const {
|
||||
theme,
|
||||
name,
|
||||
peer
|
||||
} = style
|
||||
if (!styleMap[theme]) {
|
||||
styleMap[theme] = {}
|
||||
styleMap[theme].override = (...args) => {
|
||||
styleMap[theme].base.override(...args)
|
||||
}
|
||||
}
|
||||
if (!stylesObject[style.theme][style.name]) {
|
||||
stylesObject[style.theme][style.name] = style
|
||||
if (!styleMap[theme][name]) {
|
||||
styleMap[theme][name] = style
|
||||
}
|
||||
if (style.peer) {
|
||||
traverse(style.peer)
|
||||
if (peer) {
|
||||
traverse(peer)
|
||||
}
|
||||
})
|
||||
}
|
||||
traverse(styles)
|
||||
return stylesObject
|
||||
return styleMap
|
||||
}
|
||||
|
||||
function create ({
|
||||
componentPrefix = 'N',
|
||||
components = [],
|
||||
styles = [],
|
||||
locales,
|
||||
fallbackLocale,
|
||||
hljs,
|
||||
fallbackTheme
|
||||
}) {
|
||||
function create (options = {}) {
|
||||
const {
|
||||
componentPrefix = 'N',
|
||||
components = [],
|
||||
styles = [],
|
||||
locales = [],
|
||||
fallbackLocale, // required
|
||||
hljs,
|
||||
fallbackTheme // required
|
||||
} = options
|
||||
const mergedFallbackLocale = fallbackLocale || locales[0]
|
||||
if (!mergedFallbackLocale) warn('create', 'both `fallbackLocale` and `locales` are not specified.')
|
||||
if (!fallbackTheme) warn('create', '`fallbackTheme` is not specified.')
|
||||
const installTargets = []
|
||||
const naive = {
|
||||
componentPrefix,
|
||||
locales: createLocalesObject(locales),
|
||||
fallbackLocale: fallbackLocale || locales[0],
|
||||
fallbackLocale: mergedFallbackLocale,
|
||||
hljs,
|
||||
components: {},
|
||||
styles: createStylesObject(styles),
|
||||
@ -57,7 +66,6 @@ function create ({
|
||||
setHljs,
|
||||
setHighlightjs: setHljs,
|
||||
use (plugin) {
|
||||
console.log('use naive ui')
|
||||
plugin.install(naive)
|
||||
},
|
||||
install
|
||||
@ -66,12 +74,8 @@ function create ({
|
||||
if (installTargets.includes(app)) return
|
||||
installTargets.push(app)
|
||||
app.config.globalProperties.$naive = naive
|
||||
for (const component of components) {
|
||||
components.forEach(component => {
|
||||
component.install(app, naive)
|
||||
}
|
||||
globalStyle.mount({
|
||||
target: 'naive-ui-global',
|
||||
count: false
|
||||
})
|
||||
}
|
||||
if (__DEV__) {
|
||||
|
||||
@ -119,7 +119,7 @@ export default {
|
||||
fixedColumnsLeft () {
|
||||
const columnsLeft = {}
|
||||
let left = 0
|
||||
let columns = this.columns
|
||||
const columns = this.columns
|
||||
columns.map((column) => {
|
||||
if (this.NDataTable.leftFixedColumns.indexOf(column) > -1) {
|
||||
columnsLeft[column.key] = left
|
||||
@ -131,7 +131,7 @@ export default {
|
||||
fixedColumnsRight () {
|
||||
const columnsRight = {}
|
||||
let right = 0
|
||||
let columns = this.columns
|
||||
const columns = this.columns
|
||||
for (let i = columns.length - 1; i >= 0; i--) {
|
||||
if (this.NDataTable.rightFixedColumns.indexOf(this.columns[i]) > -1) {
|
||||
columnsRight[columns[i].key] = right
|
||||
|
||||
@ -148,15 +148,15 @@ export default {
|
||||
},
|
||||
props: {
|
||||
pagination: {
|
||||
type: [ Object, Boolean ],
|
||||
type: [Object, Boolean],
|
||||
default: false
|
||||
},
|
||||
minHeight: {
|
||||
type: [ Number, String ],
|
||||
type: [Number, String],
|
||||
default: null
|
||||
},
|
||||
maxHeight: {
|
||||
type: [ Number, String ],
|
||||
type: [Number, String],
|
||||
default: null
|
||||
},
|
||||
columns: {
|
||||
@ -168,7 +168,7 @@ export default {
|
||||
default: () => []
|
||||
},
|
||||
rowClassName: {
|
||||
type: [ String, Function ],
|
||||
type: [String, Function],
|
||||
default: ''
|
||||
},
|
||||
rowKey: {
|
||||
@ -184,7 +184,7 @@ export default {
|
||||
default: true
|
||||
},
|
||||
scrollX: {
|
||||
type: [ Number, String ],
|
||||
type: [Number, String],
|
||||
default: null
|
||||
},
|
||||
defaultCheckedRowKeys: {
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
:theme="NDataTable.mergedTheme"
|
||||
:body-style="popoverBodyStyle"
|
||||
>
|
||||
<template v-slot:trigger>
|
||||
<template #trigger>
|
||||
<div class="n-data-table-filter-button__icon-wrapper">
|
||||
<n-icon>
|
||||
<filter-icon />
|
||||
@ -46,17 +46,17 @@ function createActiveFilters (allFilters, columnKey, syntheticFilterValue) {
|
||||
}
|
||||
|
||||
export default {
|
||||
inject: {
|
||||
NDataTable: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NIcon,
|
||||
NDataTableFilterMenu,
|
||||
NPopover,
|
||||
FilterIcon
|
||||
},
|
||||
inject: {
|
||||
NDataTable: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
column: {
|
||||
type: Object,
|
||||
|
||||
@ -79,11 +79,6 @@ function isEqual (value, oldValue) {
|
||||
}
|
||||
|
||||
export default {
|
||||
inject: {
|
||||
NDataTable: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NCheckboxGroup,
|
||||
NCheckbox,
|
||||
@ -93,6 +88,11 @@ export default {
|
||||
NButton,
|
||||
NScrollbar
|
||||
},
|
||||
inject: {
|
||||
NDataTable: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
column: {
|
||||
type: Object,
|
||||
@ -107,7 +107,7 @@ export default {
|
||||
required: true
|
||||
},
|
||||
value: {
|
||||
type: [ Array, String, Number ],
|
||||
type: [Array, String, Number],
|
||||
default: null
|
||||
},
|
||||
options: {
|
||||
@ -161,7 +161,7 @@ export default {
|
||||
shouldUseArrayInSingleMode(this.column)
|
||||
) {
|
||||
/** this branch is for compatibility */
|
||||
this.cachedValue = [ value ]
|
||||
this.cachedValue = [value]
|
||||
} else {
|
||||
this.cachedValue = value
|
||||
}
|
||||
|
||||
@ -20,15 +20,15 @@ import NIcon from '../../../icon'
|
||||
|
||||
export default {
|
||||
name: 'SortIcon',
|
||||
components: {
|
||||
NIcon,
|
||||
ArrowDownIcon
|
||||
},
|
||||
inject: {
|
||||
NDataTable: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NIcon,
|
||||
ArrowDownIcon
|
||||
},
|
||||
props: {
|
||||
fontSize: {
|
||||
type: Number,
|
||||
|
||||
@ -35,7 +35,7 @@
|
||||
@deactivate="handleRangeInputDeactivate"
|
||||
@input="handleRangeInput"
|
||||
>
|
||||
<template v-slot:suffix>
|
||||
<template #suffix>
|
||||
<n-icon><calendar-icon /></n-icon>
|
||||
</template>
|
||||
</n-input>
|
||||
@ -60,7 +60,7 @@
|
||||
@input="handleTimeInput"
|
||||
@clear="handleClear"
|
||||
>
|
||||
<template v-slot:suffix>
|
||||
<template #suffix>
|
||||
<n-icon><calendar-icon /></n-icon>
|
||||
</template>
|
||||
</n-input>
|
||||
@ -311,14 +311,6 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
displayTime: '',
|
||||
displayStartTime: '',
|
||||
displayEndTime: '',
|
||||
active: false
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
return {
|
||||
panelRef: ref(null),
|
||||
@ -331,6 +323,14 @@ export default {
|
||||
...dualCalendarValidation(props)
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
displayTime: '',
|
||||
displayStartTime: '',
|
||||
displayEndTime: '',
|
||||
active: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
__placeableEnabled () {
|
||||
return this.active
|
||||
|
||||
@ -14,7 +14,7 @@ const TIME_CONST = {
|
||||
const weekdays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
|
||||
|
||||
export default {
|
||||
mixins: [ locale('DatePicker') ],
|
||||
mixins: [locale('DatePicker')],
|
||||
inject: {
|
||||
NDatePicker: {
|
||||
default: null
|
||||
|
||||
@ -152,7 +152,7 @@ export default {
|
||||
`n-descriptions--${size}-size`,
|
||||
{
|
||||
[`n-${mergedTheme}-theme`]: mergedTheme,
|
||||
[`n-descriptions--bordered`]: bordered
|
||||
'n-descriptions--bordered': bordered
|
||||
}
|
||||
]
|
||||
}, [
|
||||
|
||||
@ -47,6 +47,17 @@ export default {
|
||||
components: {
|
||||
NScrollbar
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NDrawerBody: this,
|
||||
NModalBody: null
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NDrawer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
theme: {
|
||||
type: String,
|
||||
@ -81,17 +92,6 @@ export default {
|
||||
required: true
|
||||
}
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NDrawerBody: this,
|
||||
NModalBody: null
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NDrawer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
const displayedRef = ref(props.show)
|
||||
watchEffect(() => {
|
||||
|
||||
@ -26,7 +26,7 @@
|
||||
circle
|
||||
@click="remove($event, index)"
|
||||
>
|
||||
<template v-slot:icon>
|
||||
<template #icon>
|
||||
<md-remove />
|
||||
</template>
|
||||
</n-button>
|
||||
@ -35,7 +35,7 @@
|
||||
circle
|
||||
@click="createItem($event, index)"
|
||||
>
|
||||
<template v-slot:icon>
|
||||
<template #icon>
|
||||
<md-add />
|
||||
</template>
|
||||
</n-button>
|
||||
@ -46,6 +46,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable vue/no-mutating-props */
|
||||
import NButton from '../../button'
|
||||
import NButtonGroup from '../../button-group'
|
||||
import mdAdd from '../../_deprecated/icons/md-add.vue'
|
||||
@ -189,19 +190,19 @@ export default {
|
||||
const keyField = this.keyField
|
||||
if (keyField) {
|
||||
const memorizedKeyField = this.value[0][keyField]
|
||||
this.doInput([ Object.assign(onClear(), {
|
||||
this.doInput([Object.assign(onClear(), {
|
||||
[keyField]: memorizedKeyField
|
||||
})])
|
||||
} else {
|
||||
this.doInput([ onClear() ])
|
||||
this.doInput([onClear()])
|
||||
}
|
||||
} else {
|
||||
switch (this.preset) {
|
||||
case 'input':
|
||||
this.doInput([ null ])
|
||||
this.doInput([null])
|
||||
break
|
||||
case 'pair':
|
||||
this.doInput([ { key: null, value: null } ])
|
||||
this.doInput([{ key: null, value: null }])
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
:size="inputSize"
|
||||
@click="handleAddClick"
|
||||
>
|
||||
<template v-slot:icon>
|
||||
<template #icon>
|
||||
<n-icon>
|
||||
<add-icon />
|
||||
</n-icon>
|
||||
|
||||
@ -153,6 +153,16 @@ export default {
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NForm: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NFormItem: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
label: {
|
||||
type: [Number, String],
|
||||
@ -223,16 +233,6 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NForm: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NFormItem: this
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
return {
|
||||
...formItemSize(props),
|
||||
|
||||
@ -29,15 +29,15 @@ import usecssr from '../../_mixins/usecssr'
|
||||
import styles from './styles/col.js'
|
||||
|
||||
export default {
|
||||
name: 'Col',
|
||||
mixins: [
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NRow: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
name: 'Col',
|
||||
mixins: [
|
||||
usecssr(styles)
|
||||
],
|
||||
props: {
|
||||
span: {
|
||||
type: [String, Number],
|
||||
|
||||
@ -21,15 +21,15 @@ import usecssr from '../../_mixins/usecssr'
|
||||
import styles from './styles/row.js'
|
||||
|
||||
export default {
|
||||
name: 'Row',
|
||||
mixins: [
|
||||
usecssr(styles)
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NRow: this
|
||||
}
|
||||
},
|
||||
name: 'Row',
|
||||
mixins: [
|
||||
usecssr(styles)
|
||||
],
|
||||
props: {
|
||||
gutter: {
|
||||
type: [Array, Number, String],
|
||||
|
||||
@ -10,7 +10,7 @@ export default create({
|
||||
borderRadius: base.borderRadius,
|
||||
color: derived.inputColorOverlay,
|
||||
textColor: derived.textColor2,
|
||||
boxShadow: `inset 0 0 0 1px transparent`
|
||||
boxShadow: 'inset 0 0 0 1px transparent'
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@ -6,7 +6,7 @@ import suffixStyle from '../../_base/suffix/styles/dark'
|
||||
export default create({
|
||||
name: 'Input',
|
||||
theme: 'dark',
|
||||
peer: [ suffixStyle ],
|
||||
peer: [suffixStyle],
|
||||
getDerivedVariables ({ base, derived }) {
|
||||
const {
|
||||
textColor2Overlay,
|
||||
|
||||
@ -6,7 +6,7 @@ import suffixStyle from '../../_base/suffix/styles/light'
|
||||
export default create({
|
||||
name: 'Input',
|
||||
theme: 'light',
|
||||
peer: [ suffixStyle ],
|
||||
peer: [suffixStyle],
|
||||
getDerivedVariables ({ base, derived }) {
|
||||
const {
|
||||
textColor2,
|
||||
|
||||
@ -49,16 +49,16 @@ export default {
|
||||
NLogLoader,
|
||||
NLogLine
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NLog: this
|
||||
}
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NLog: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
loading: {
|
||||
type: Boolean,
|
||||
|
||||
@ -4,17 +4,17 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
inject: {
|
||||
NLog: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
line: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NLog: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
highlight () {
|
||||
return this.NLog.highlight
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
:placement="popoverPlacement"
|
||||
:disabled="!popoverEnabled"
|
||||
>
|
||||
<template v-slot:trigger>
|
||||
<template #trigger>
|
||||
<n-menu-item-content
|
||||
:padding-left="delayedPaddingLeft"
|
||||
:max-icon-size="maxIconSize"
|
||||
@ -47,7 +47,7 @@ export default {
|
||||
],
|
||||
props: {
|
||||
extra: {
|
||||
type: [ String, Function ],
|
||||
type: [String, Function],
|
||||
default: undefined
|
||||
},
|
||||
disabled: {
|
||||
|
||||
@ -32,7 +32,7 @@ export function getActivePath (menuItems, activeKey) {
|
||||
if (item.children) {
|
||||
path.push(item.internalKey)
|
||||
if (__DEV__ && activeKey === item.internalKey) {
|
||||
warn('menu', `Menu can't select a submenu key.`)
|
||||
warn('menu', 'Menu can\'t select a submenu key.')
|
||||
}
|
||||
if (traverse(item.children)) return true
|
||||
path.pop()
|
||||
|
||||
@ -34,14 +34,14 @@
|
||||
@negative-click="handleNegativeClick"
|
||||
@positive-click="handlePositiveClick"
|
||||
>
|
||||
<template v-if="$slots.header" v-slot:header>
|
||||
<template v-if="$slots.header" #header>
|
||||
<slot name="header" />
|
||||
</template>
|
||||
<template v-if="$slots.icon" v-slot:icon>
|
||||
<template v-if="$slots.icon" #icon>
|
||||
<slot name="icon" />
|
||||
</template>
|
||||
<slot />
|
||||
<template v-if="$slots.action" v-slot:action>
|
||||
<template v-if="$slots.action" #action>
|
||||
<slot name="action" />
|
||||
</template>
|
||||
</n-dialog>
|
||||
@ -56,16 +56,16 @@
|
||||
:segmented="segmented"
|
||||
@close="handleCloseClick"
|
||||
>
|
||||
<template v-if="$slots.header" v-slot:header>
|
||||
<template v-if="$slots.header" #header>
|
||||
<slot name="header" />
|
||||
</template>
|
||||
<template v-if="$slots['header-extra']" v-slot:header-extra>
|
||||
<template v-if="$slots['header-extra']" #header-extra>
|
||||
<slot name="header-extra" />
|
||||
</template>
|
||||
<template v-if="$slots.footer" v-slot:footer>
|
||||
<template v-if="$slots.footer" #footer>
|
||||
<slot name="footer" />
|
||||
</template>
|
||||
<template v-if="$slots.action" v-slot:action>
|
||||
<template v-if="$slots.action" #action>
|
||||
<slot name="action" />
|
||||
</template>
|
||||
<slot />
|
||||
@ -112,25 +112,6 @@ export default {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
const dataRefs = toRefs(reactive({
|
||||
displayed: props.show,
|
||||
transformOriginX: null,
|
||||
transformOriginY: null
|
||||
}))
|
||||
watch(toRef(props, 'show'), value => {
|
||||
if (value) dataRefs.displayed.value = true
|
||||
})
|
||||
return {
|
||||
compitableBodyStyle: useCompitable(props, [
|
||||
'overlayStyle',
|
||||
'bodyStyle'
|
||||
]),
|
||||
mousePosition: useLastClickPosition(),
|
||||
bodyRef: ref(null),
|
||||
...dataRefs
|
||||
}
|
||||
},
|
||||
props: {
|
||||
show: {
|
||||
type: Boolean,
|
||||
@ -171,6 +152,26 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
const dataRefs = toRefs(reactive({
|
||||
displayed: props.show,
|
||||
transformOriginX: null,
|
||||
transformOriginY: null
|
||||
}))
|
||||
watch(toRef(props, 'show'), value => {
|
||||
if (value) dataRefs.displayed.value = true
|
||||
})
|
||||
return {
|
||||
compitableBodyStyle: useCompitable(props, [
|
||||
'overlayStyle',
|
||||
'bodyStyle'
|
||||
]),
|
||||
mousePosition: useLastClickPosition(),
|
||||
bodyRef: ref(null),
|
||||
...dataRefs
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
styleTransformOrigin () {
|
||||
const {
|
||||
|
||||
@ -63,7 +63,7 @@ export default c([
|
||||
})
|
||||
]),
|
||||
cM('no-arrow',
|
||||
[ 'top',
|
||||
['top',
|
||||
'top-start',
|
||||
'top-end',
|
||||
'bottom',
|
||||
|
||||
@ -28,16 +28,16 @@ export default {
|
||||
NBaseSelectMenu
|
||||
},
|
||||
cssrName: 'Popselect',
|
||||
inject: {
|
||||
NPopselect: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
mixins: [
|
||||
configurable,
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
inject: {
|
||||
NPopselect: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
|
||||
@ -148,7 +148,7 @@ export default {
|
||||
`n-radio-group--${mergedSize}-size`,
|
||||
{
|
||||
[`n-${mergedTheme}-theme`]: mergedTheme,
|
||||
[`n-radio-group--button-group`]: isButtonGroup
|
||||
'n-radio-group--button-group': isButtonGroup
|
||||
}
|
||||
]
|
||||
}, children)
|
||||
|
||||
@ -41,7 +41,7 @@ export default create({
|
||||
buttonTextColorHover: primaryColor,
|
||||
opacityDisabled: opacityDisabled,
|
||||
buttonBoxShadowFocus: `inset 0 0 0 1px ${primaryColor}, 0 0 0 2px ${changeColor(primaryColor, { alpha: 0.3 })}`,
|
||||
buttonBoxShadowHover: `inset 0 0 0 1px transparent`,
|
||||
buttonBoxShadowHover: 'inset 0 0 0 1px transparent',
|
||||
buttonBoxShadow: 'inset 0 0 0 1px transparent',
|
||||
buttonBorderRadius: borderRadius
|
||||
}
|
||||
|
||||
@ -163,6 +163,14 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
setup () {
|
||||
return {
|
||||
containerRef: ref(null),
|
||||
contentRef: ref(null),
|
||||
yRailRef: ref(null),
|
||||
xRailRef: ref(null)
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
contentHeight: null,
|
||||
@ -242,14 +250,6 @@ export default {
|
||||
window.removeEventListener('mousemove', this.handleYScrollMouseMove, true)
|
||||
window.removeEventListener('mouseup', this.handleYScrollMouseUp, true)
|
||||
},
|
||||
setup () {
|
||||
return {
|
||||
containerRef: ref(null),
|
||||
contentRef: ref(null),
|
||||
yRailRef: ref(null),
|
||||
xRailRef: ref(null)
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
// if container exist, it always can't be resolved when scrollbar is mounted
|
||||
// for example:
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
<n-base-selection
|
||||
ref="triggerRef"
|
||||
class="n-select-selection"
|
||||
:active="show"
|
||||
:active="mergedShow"
|
||||
:pattern="pattern"
|
||||
:placeholder="localizedPlaceholder"
|
||||
:selected-option="selectedOption"
|
||||
@ -41,13 +41,13 @@
|
||||
@focus="handleTriggerFocus"
|
||||
/>
|
||||
<n-lazy-teleport
|
||||
:show="show"
|
||||
:show="mergedShow"
|
||||
adjust-to
|
||||
>
|
||||
<div
|
||||
ref="offsetContainerRef"
|
||||
v-zindexable="{
|
||||
enabled: show
|
||||
enabled: mergedShow
|
||||
}"
|
||||
class="n-positioning-container"
|
||||
:class="{
|
||||
@ -64,7 +64,7 @@
|
||||
@after-leave="handleMenuAfterLeave"
|
||||
>
|
||||
<n-base-select-menu
|
||||
v-if="show"
|
||||
v-if="mergedShow"
|
||||
ref="menuRef"
|
||||
v-clickoutside="handleMenuClickOutside"
|
||||
class="n-select-menu"
|
||||
@ -79,13 +79,13 @@
|
||||
@menu-toggle-option="handleToggleOption"
|
||||
@scroll="handleMenuScroll"
|
||||
>
|
||||
<template v-if="$slots.empty" v-slot:empty>
|
||||
<template v-if="$slots.empty" #empty>
|
||||
<slot name="empty" />
|
||||
</template>
|
||||
<template v-if="$slots.unmatch" v-slot:unmatch>
|
||||
<template v-if="$slots.unmatch" #unmatch>
|
||||
<slot name="unmatch" />
|
||||
</template>
|
||||
<template v-if="$slots.action" v-slot:action>
|
||||
<template v-if="$slots.action" #action>
|
||||
<slot name="action" />
|
||||
</template>
|
||||
</n-base-select-menu>
|
||||
@ -256,7 +256,7 @@ export default {
|
||||
})
|
||||
},
|
||||
fallbackOption: {
|
||||
type: [ Function, Boolean ],
|
||||
type: [Function, Boolean],
|
||||
default: () => value => ({
|
||||
label: '' + value,
|
||||
value
|
||||
@ -343,7 +343,7 @@ export default {
|
||||
menuRef: ref(null),
|
||||
pattern: patternRef,
|
||||
uncontrolledShow: uncontrolledShowRef,
|
||||
show: mergedShowRef,
|
||||
mergedShow: mergedShowRef,
|
||||
compitableOptions: useCompitable(props, [
|
||||
'items',
|
||||
'options'
|
||||
@ -355,7 +355,7 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
__placeableEnabled () {
|
||||
return this.show
|
||||
return this.mergedShow
|
||||
},
|
||||
localizedPlaceholder () {
|
||||
return this.placeholder ?? this.localeNs.placeholder
|
||||
@ -438,11 +438,11 @@ export default {
|
||||
this.updateMemorizedOptions()
|
||||
},
|
||||
filteredOptions () {
|
||||
if (!this.show) return
|
||||
if (!this.mergedShow) return
|
||||
this.$nextTick(this.__placeableSyncPosition)
|
||||
},
|
||||
value () {
|
||||
if (!this.show) return
|
||||
if (!this.mergedShow) return
|
||||
this.$nextTick(this.__placeableSyncPosition)
|
||||
}
|
||||
},
|
||||
@ -544,7 +544,7 @@ export default {
|
||||
},
|
||||
handleTriggerClick () {
|
||||
if (this.disabled) return
|
||||
if (!this.show) {
|
||||
if (!this.mergedShow) {
|
||||
this.openMenu()
|
||||
} else {
|
||||
if (!this.filterable) {
|
||||
@ -560,7 +560,7 @@ export default {
|
||||
this.doFocus()
|
||||
},
|
||||
handleMenuClickOutside (e) {
|
||||
if (this.show) {
|
||||
if (this.mergedShow) {
|
||||
if (!this.triggerRef.$el.contains(e.target)) {
|
||||
this.closeMenu()
|
||||
}
|
||||
@ -695,7 +695,7 @@ export default {
|
||||
},
|
||||
// keyboard events
|
||||
handleKeyUpEnter (e) {
|
||||
if (this.show) {
|
||||
if (this.mergedShow) {
|
||||
const menu = this.menuRef
|
||||
const pendingOptionData = menu && menu.getPendingOption()
|
||||
if (pendingOptionData) {
|
||||
@ -716,13 +716,13 @@ export default {
|
||||
},
|
||||
handleKeyUpUp () {
|
||||
if (this.loading) return
|
||||
if (this.show) {
|
||||
if (this.mergedShow) {
|
||||
this.menuRef.prev()
|
||||
}
|
||||
},
|
||||
handleKeyUpDown () {
|
||||
if (this.loading) return
|
||||
if (this.show) {
|
||||
if (this.mergedShow) {
|
||||
this.menuRef.next()
|
||||
}
|
||||
},
|
||||
|
||||
@ -61,11 +61,6 @@ import { themeable } from '../../_mixins'
|
||||
import NIconSwitchTransition from '../../_transition/IconSwitchTransition'
|
||||
export default {
|
||||
name: 'Step',
|
||||
inject: {
|
||||
NSteps: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NIcon,
|
||||
FinishedIcon,
|
||||
@ -75,6 +70,11 @@ export default {
|
||||
mixins: [
|
||||
themeable
|
||||
],
|
||||
inject: {
|
||||
NSteps: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
status: {
|
||||
type: String,
|
||||
|
||||
@ -3,7 +3,7 @@ import { getSlot } from '../../_utils/vue'
|
||||
|
||||
export default {
|
||||
name: 'TabPane',
|
||||
inject: [ 'NTab' ],
|
||||
inject: ['NTab'],
|
||||
props: {
|
||||
label: {
|
||||
type: [String, Number],
|
||||
|
||||
@ -109,11 +109,6 @@ import { onFontReady } from '../../_utils/composition'
|
||||
|
||||
export default {
|
||||
name: 'Tabs',
|
||||
provide () {
|
||||
return {
|
||||
NTab: this
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NIcon,
|
||||
BackwardIcon,
|
||||
@ -126,6 +121,11 @@ export default {
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NTab: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: String || Number,
|
||||
@ -186,6 +186,22 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
onFontReady(vm => {
|
||||
vm.updateScrollStatus()
|
||||
if (vm.typeIsLine) {
|
||||
vm.updateCurrentBarPosition()
|
||||
}
|
||||
})
|
||||
return {
|
||||
compitableValue: useCompitable(props, ['activeName', 'value']),
|
||||
compitableOnValueChange: useCompitable(props, ['onActiveNameChange', 'onUpdate:value']),
|
||||
navScrollRef: ref(null),
|
||||
labelWrapperRef: ref(null),
|
||||
navRef: ref(null),
|
||||
labelBarRef: ref(null)
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
panels: [],
|
||||
@ -230,22 +246,6 @@ export default {
|
||||
this.$nextTick(this.updateScrollStatus)
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
onFontReady(vm => {
|
||||
vm.updateScrollStatus()
|
||||
if (vm.typeIsLine) {
|
||||
vm.updateCurrentBarPosition()
|
||||
}
|
||||
})
|
||||
return {
|
||||
compitableValue: useCompitable(props, ['activeName', 'value']),
|
||||
compitableOnValueChange: useCompitable(props, ['onActiveNameChange', 'onUpdate:value']),
|
||||
navScrollRef: ref(null),
|
||||
labelWrapperRef: ref(null),
|
||||
navRef: ref(null),
|
||||
labelBarRef: ref(null)
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.updateScrollStatus()
|
||||
},
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
@input="handleTimeInput"
|
||||
@clear="handleTimeInputClear"
|
||||
>
|
||||
<template v-if="showIcon" v-slot:suffix>
|
||||
<template v-if="showIcon" #suffix>
|
||||
<n-icon>
|
||||
<time-icon />
|
||||
</n-icon>
|
||||
@ -498,8 +498,10 @@ export default {
|
||||
})
|
||||
break
|
||||
case KEY_CODE.TAB:
|
||||
const shiftPressed = keyboardDelegate.getKeyboardStatus().shiftPressed
|
||||
if (shiftPressed && e.target === this.panelRef) {
|
||||
if (
|
||||
keyboardDelegate.getKeyboardStatus().shiftPressed &&
|
||||
e.target === this.panelRef
|
||||
) {
|
||||
e.preventDefault()
|
||||
this.closeTimeSelector({
|
||||
returnFocus: true,
|
||||
|
||||
@ -24,6 +24,11 @@ export default {
|
||||
themeable,
|
||||
usecssr(styles)
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NTimeline: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
itemPlacement: {
|
||||
validator (value) {
|
||||
@ -37,11 +42,6 @@ export default {
|
||||
},
|
||||
default: 'medium'
|
||||
}
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NTimeline: this
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -36,12 +36,12 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TimelineItem',
|
||||
inject: {
|
||||
NTimeline: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
name: 'TimelineItem',
|
||||
props: {
|
||||
time: {
|
||||
type: [String, Number],
|
||||
|
||||
@ -243,6 +243,11 @@ export default {
|
||||
locale('Transfer'),
|
||||
asformitem()
|
||||
],
|
||||
provide () {
|
||||
return {
|
||||
NTransfer: this
|
||||
}
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Array,
|
||||
@ -306,11 +311,6 @@ export default {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
provide () {
|
||||
return {
|
||||
NTransfer: this
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
return {
|
||||
isMounted: useIsMounted(),
|
||||
|
||||
@ -24,6 +24,11 @@
|
||||
import createValidator from '../../_utils/vue/validateProp'
|
||||
|
||||
export default {
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
to: {
|
||||
validator: createValidator(['boolean']),
|
||||
@ -34,11 +39,6 @@ export default {
|
||||
required: true
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
disabled () {
|
||||
const {
|
||||
|
||||
@ -18,6 +18,11 @@ export default {
|
||||
components: {
|
||||
NCheckbox
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
theme: {
|
||||
validator: createValidator(['string']),
|
||||
@ -32,11 +37,6 @@ export default {
|
||||
required: true
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
checkboxProps () {
|
||||
const {
|
||||
|
||||
@ -17,16 +17,16 @@ import createValidator from '../../_utils/vue/validateProp'
|
||||
|
||||
export default {
|
||||
name: 'NTransferHeaderExtra',
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
source: {
|
||||
validator: createValidator(['boolean']),
|
||||
default: false
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -33,6 +33,11 @@ export default {
|
||||
components: {
|
||||
NCheckbox
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
label: {
|
||||
validator: createValidator(['string']),
|
||||
@ -47,11 +52,6 @@ export default {
|
||||
default: false
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
const NTransfer = inject('NTransfer')
|
||||
return {
|
||||
|
||||
@ -33,6 +33,11 @@ export default {
|
||||
components: {
|
||||
NCheckbox
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
label: {
|
||||
validator: createValidator(['string']),
|
||||
@ -47,11 +52,6 @@ export default {
|
||||
default: false
|
||||
}
|
||||
},
|
||||
inject: {
|
||||
NTransfer: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
setup (props) {
|
||||
const NTransfer = inject('NTransfer')
|
||||
return {
|
||||
|
||||
@ -13,14 +13,14 @@ import NCheckbox from '../../checkbox'
|
||||
|
||||
export default {
|
||||
name: 'NTreeNodeCheckbox',
|
||||
components: {
|
||||
NCheckbox
|
||||
},
|
||||
inject: {
|
||||
NTree: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
NCheckbox
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean,
|
||||
|
||||
@ -25,16 +25,16 @@ import NIconSwitchTransition from '../../_transition/IconSwitchTransition'
|
||||
|
||||
export default {
|
||||
name: 'NTreeSwitcher',
|
||||
inject: {
|
||||
NTree: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
components: {
|
||||
mdArrowDropright,
|
||||
NBaseLoading,
|
||||
NIconSwitchTransition
|
||||
},
|
||||
inject: {
|
||||
NTree: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
expanded: {
|
||||
type: Boolean,
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user