mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-03-19 14:00:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: prettier

Browse Source
This commit is contained in:
07akioni 2020-12-12 13:47:04 +08:00
parent aba0178a66
commit 1c032d2279
533 changed files with 5735 additions and 7094 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.prettierignore Normal file
View File

@ -0,0 +1,2 @@
src/_deprecated/icons
*.cssr.js

3
.prettierrc
View File

@ -1,3 +1,4 @@
semi: false
singleQuote: true
printWidth: 80
printWidth: 80
trailingComma: "none"

6
package.json
View File

@ -40,10 +40,10 @@
"README.md"
],
"lint-staged": {
"*.js": "eslint --cache --fix",
"*.js": "eslint --fix",
"*.vue": [
"eslint",
"prettier --parser=vue --write"
"prettier --parser=vue --write",
"eslint --fix"
],
"*.css": "stylelint --fix",
"*.{js,css,md}": "prettier --write"

4
src/_base/fade-in-expand-transition/index.js
View File

@ -1,3 +1 @@
export {
default
} from './src/FadeInExpandTransition'
export { default } from './src/FadeInExpandTransition'

38
src/_base/fade-in-expand-transition/src/FadeInExpandTransition.js
View File

@ -47,10 +47,8 @@ export default {
} else {
el.style.maxHeight = ''
}
const {
onAfterLeave
} = this
if (this.onAfterLeave) onAfterLeave()
const { onAfterLeave } = this
if (onAfterLeave) onAfterLeave()
},
handleEnter (el) {
el.style.transition = 'none'
@ -79,19 +77,23 @@ export default {
},
render () {
const type = this.group ? TransitionGroup : Transition
return h(type, {
name: this.width
? 'n-fade-in-width-expand-transition'
: 'n-fade-in-height-expand-transition',
mode: this.mode,
appear: this.appear,
onEnter: this.handleEnter,
onAfterEnter: this.handleAfterEnter,
onBeforeLeave: this.handleBeforeLeave,
onLeave: this.handleLeave,
onAfterLeave: this.handleAfterLeave
}, {
default: this.$slots.default
})
return h(
type,
{
name: this.width
? 'n-fade-in-width-expand-transition'
: 'n-fade-in-height-expand-transition',
mode: this.mode,
appear: this.appear,
onEnter: this.handleEnter,
onAfterEnter: this.handleAfterEnter,
onBeforeLeave: this.handleBeforeLeave,
onLeave: this.handleLeave,
onAfterLeave: this.handleAfterLeave
},
{
default: this.$slots.default
}
)
}
}

2
src/_base/focus-detector/src/FocusDetector.vue
View File

@ -1,6 +1,6 @@
<template>
<div
style="width: 0; height: 0;"
style="width: 0; height: 0"
tabindex="0"
@focus="handleFocus"
@blur="handleBlur"

4
src/_base/icon-switch-transition/index.js
View File

@ -1,3 +1 @@
export {
default
} from './src/IconSwitchTransition.js'
export { default } from './src/IconSwitchTransition.js'

12
src/_base/icon-switch-transition/src/IconSwitchTransition.js
View File

@ -13,9 +13,13 @@ export default {
})
},
render () {
return h(Transition, {
name: 'n-icon-switch-transition',
appear: this.appear
}, this.$slots)
return h(
Transition,
{
name: 'n-icon-switch-transition',
appear: this.appear
},
this.$slots
)
}
}

28
src/_base/icons/Add.vue
View File

@ -1,6 +1,30 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<line x1="256" y1="112" x2="256" y2="400" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<line x1="400" y1="256" x2="112" y2="256" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<line
x1="256"
y1="112"
x2="256"
y2="400"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
<line
x1="400"
y1="256"
x2="112"
y2="256"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
</svg>
</template>

13
src/_base/icons/ArrowDown.vue
View File

@ -1,8 +1,17 @@
<template>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
width="28px"
height="28px"
viewBox="0 0 28 28"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M23.7916,15.2664 C24.0788,14.9679 24.0696,14.4931 23.7711,14.206 C23.4726,13.9188 22.9978,13.928 22.7106,14.2265 L14.7511,22.5007 L14.7511,3.74792 C14.7511,3.33371 14.4153,2.99792 14.0011,2.99792 C13.5869,2.99792 13.2511,3.33371 13.2511,3.74793 L13.2511,22.4998 L5.29259,14.2265 C5.00543,13.928 4.53064,13.9188 4.23213,14.206 C3.93361,14.4931 3.9244,14.9679 4.21157,15.2664 L13.2809,24.6944 C13.6743,25.1034 14.3289,25.1034 14.7223,24.6944 L23.7916,15.2664 Z" />
<path
d="M23.7916,15.2664 C24.0788,14.9679 24.0696,14.4931 23.7711,14.206 C23.4726,13.9188 22.9978,13.928 22.7106,14.2265 L14.7511,22.5007 L14.7511,3.74792 C14.7511,3.33371 14.4153,2.99792 14.0011,2.99792 C13.5869,2.99792 13.2511,3.33371 13.2511,3.74793 L13.2511,22.4998 L5.29259,14.2265 C5.00543,13.928 4.53064,13.9188 4.23213,14.206 C3.93361,14.4931 3.9244,14.9679 4.21157,15.2664 L13.2809,24.6944 C13.6743,25.1034 14.3289,25.1034 14.7223,24.6944 L23.7916,15.2664 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/Attach.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 16 16"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="currentColor" fill-rule="nonzero">
<path d="M3.25735931,8.70710678 L7.85355339,4.1109127 C8.82986412,3.13460197 10.4127766,3.13460197 11.3890873,4.1109127 C12.365398,5.08722343 12.365398,6.67013588 11.3890873,7.64644661 L6.08578644,12.9497475 C5.69526215,13.3402718 5.06209717,13.3402718 4.67157288,12.9497475 C4.28104858,12.5592232 4.28104858,11.9260582 4.67157288,11.5355339 L9.97487373,6.23223305 C10.1701359,6.0369709 10.1701359,5.72038841 9.97487373,5.52512627 C9.77961159,5.32986412 9.4630291,5.32986412 9.26776695,5.52512627 L3.96446609,10.8284271 C3.18341751,11.6094757 3.18341751,12.8758057 3.96446609,13.6568542 C4.74551468,14.4379028 6.01184464,14.4379028 6.79289322,13.6568542 L12.0961941,8.35355339 C13.4630291,6.98671837 13.4630291,4.77064094 12.0961941,3.40380592 C10.7293591,2.0369709 8.51328163,2.0369709 7.14644661,3.40380592 L2.55025253,8 C2.35499039,8.19526215 2.35499039,8.51184464 2.55025253,8.70710678 C2.74551468,8.90236893 3.06209717,8.90236893 3.25735931,8.70710678 Z" />
<path
d="M3.25735931,8.70710678 L7.85355339,4.1109127 C8.82986412,3.13460197 10.4127766,3.13460197 11.3890873,4.1109127 C12.365398,5.08722343 12.365398,6.67013588 11.3890873,7.64644661 L6.08578644,12.9497475 C5.69526215,13.3402718 5.06209717,13.3402718 4.67157288,12.9497475 C4.28104858,12.5592232 4.28104858,11.9260582 4.67157288,11.5355339 L9.97487373,6.23223305 C10.1701359,6.0369709 10.1701359,5.72038841 9.97487373,5.52512627 C9.77961159,5.32986412 9.4630291,5.32986412 9.26776695,5.52512627 L3.96446609,10.8284271 C3.18341751,11.6094757 3.18341751,12.8758057 3.96446609,13.6568542 C4.74551468,14.4379028 6.01184464,14.4379028 6.79289322,13.6568542 L12.0961941,8.35355339 C13.4630291,6.98671837 13.4630291,4.77064094 12.0961941,3.40380592 C10.7293591,2.0369709 8.51328163,2.0369709 7.14644661,3.40380592 L2.55025253,8 C2.35499039,8.19526215 2.35499039,8.51184464 2.55025253,8.70710678 C2.74551468,8.90236893 3.06209717,8.90236893 3.25735931,8.70710678 Z"
/>
</g>
</g>
</svg>

5
src/_base/icons/Backward.vue
View File

@ -1,5 +1,8 @@
<template>
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.2674 15.793C11.9675 16.0787 11.4927 16.0672 11.2071 15.7673L6.20572 10.5168C5.9298 10.2271 5.9298 9.7719 6.20572 9.48223L11.2071 4.23177C11.4927 3.93184 11.9675 3.92031 12.2674 4.206C12.5673 4.49169 12.5789 4.96642 12.2932 5.26634L7.78458 9.99952L12.2932 14.7327C12.5789 15.0326 12.5673 15.5074 12.2674 15.793Z" fill="currentColor" />
<path
d="M12.2674 15.793C11.9675 16.0787 11.4927 16.0672 11.2071 15.7673L6.20572 10.5168C5.9298 10.2271 5.9298 9.7719 6.20572 9.48223L11.2071 4.23177C11.4927 3.93184 11.9675 3.92031 12.2674 4.206C12.5673 4.49169 12.5789 4.96642 12.2932 5.26634L7.78458 9.99952L12.2932 14.7327C12.5789 15.0326 12.5673 15.5074 12.2674 15.793Z"
fill="currentColor"
/>
</svg>
</template>

13
src/_base/icons/CalendarIcon.vue
View File

@ -1,8 +1,17 @@
<template>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
width="28px"
height="28px"
viewBox="0 0 28 28"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M21.75,3 C23.5449254,3 25,4.45507456 25,6.25 L25,21.75 C25,23.5449254 23.5449254,25 21.75,25 L6.25,25 C4.45507456,25 3,23.5449254 3,21.75 L3,6.25 C3,4.45507456 4.45507456,3 6.25,3 L21.75,3 Z M23.5,9.503 L4.5,9.503 L4.5,21.75 C4.5,22.7164983 5.28350169,23.5 6.25,23.5 L21.75,23.5 C22.7164983,23.5 23.5,22.7164983 23.5,21.75 L23.5,9.503 Z M21.75,4.5 L6.25,4.5 C5.28350169,4.5 4.5,5.28350169 4.5,6.25 L4.5,8.003 L23.5,8.003 L23.5,6.25 C23.5,5.28350169 22.7164983,4.5 21.75,4.5 Z" />
<path
d="M21.75,3 C23.5449254,3 25,4.45507456 25,6.25 L25,21.75 C25,23.5449254 23.5449254,25 21.75,25 L6.25,25 C4.45507456,25 3,23.5449254 3,21.75 L3,6.25 C3,4.45507456 4.45507456,3 6.25,3 L21.75,3 Z M23.5,9.503 L4.5,9.503 L4.5,21.75 C4.5,22.7164983 5.28350169,23.5 6.25,23.5 L21.75,23.5 C22.7164983,23.5 23.5,22.7164983 23.5,21.75 L23.5,9.503 Z M21.75,4.5 L6.25,4.5 C5.28350169,4.5 4.5,5.28350169 4.5,6.25 L4.5,8.003 L23.5,8.003 L23.5,6.25 C23.5,5.28350169 22.7164983,4.5 21.75,4.5 Z"
/>
</g>
</g>
</svg>

28
src/_base/icons/Cancel.vue
View File

@ -1,6 +1,30 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<line x1="368" y1="368" x2="144" y2="144" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<line x1="368" y1="144" x2="144" y2="368" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<line
x1="368"
y1="368"
x2="144"
y2="144"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
<line
x1="368"
y1="144"
x2="144"
y2="368"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
</svg>
</template>

5
src/_base/icons/Checkmark.vue
View File

@ -1,5 +1,8 @@
<template>
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.8639 3.65609C14.0533 3.85704 14.0439 4.17348 13.8429 4.36288L5.91309 11.8368C5.67573 12.0605 5.30311 12.0536 5.07417 11.8213L2.39384 9.10093C2.20003 8.90422 2.20237 8.58765 2.39907 8.39384C2.59578 8.20003 2.91235 8.20237 3.10616 8.39908L5.51192 10.8407L13.1571 3.63517C13.358 3.44577 13.6745 3.45513 13.8639 3.65609Z" fill="currentColor" />
<path
d="M13.8639 3.65609C14.0533 3.85704 14.0439 4.17348 13.8429 4.36288L5.91309 11.8368C5.67573 12.0605 5.30311 12.0536 5.07417 11.8213L2.39384 9.10093C2.20003 8.90422 2.20237 8.58765 2.39907 8.39384C2.59578 8.20003 2.91235 8.20237 3.10616 8.39908L5.51192 10.8407L13.1571 3.63517C13.358 3.44577 13.6745 3.45513 13.8639 3.65609Z"
fill="currentColor"
/>
</svg>
</template>

5
src/_base/icons/ChevronLeft.vue
View File

@ -1,5 +1,8 @@
<template>
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.3536 3.14645C10.5488 3.34171 10.5488 3.65829 10.3536 3.85355L6.20711 8L10.3536 12.1464C10.5488 12.3417 10.5488 12.6583 10.3536 12.8536C10.1583 13.0488 9.84171 13.0488 9.64645 12.8536L5.14645 8.35355C4.95118 8.15829 4.95118 7.84171 5.14645 7.64645L9.64645 3.14645C9.84171 2.95118 10.1583 2.95118 10.3536 3.14645Z" fill="currentColor" />
<path
d="M10.3536 3.14645C10.5488 3.34171 10.5488 3.65829 10.3536 3.85355L6.20711 8L10.3536 12.1464C10.5488 12.3417 10.5488 12.6583 10.3536 12.8536C10.1583 13.0488 9.84171 13.0488 9.64645 12.8536L5.14645 8.35355C4.95118 8.15829 4.95118 7.84171 5.14645 7.64645L9.64645 3.14645C9.84171 2.95118 10.1583 2.95118 10.3536 3.14645Z"
fill="currentColor"
/>
</svg>
</template>

5
src/_base/icons/ChevronRight.vue
View File

@ -1,5 +1,8 @@
<template>
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.64645 3.14645C5.45118 3.34171 5.45118 3.65829 5.64645 3.85355L9.79289 8L5.64645 12.1464C5.45118 12.3417 5.45118 12.6583 5.64645 12.8536C5.84171 13.0488 6.15829 13.0488 6.35355 12.8536L10.8536 8.35355C11.0488 8.15829 11.0488 7.84171 10.8536 7.64645L6.35355 3.14645C6.15829 2.95118 5.84171 2.95118 5.64645 3.14645Z" fill="currentColor" />
<path
d="M5.64645 3.14645C5.45118 3.34171 5.45118 3.65829 5.64645 3.85355L9.79289 8L5.64645 12.1464C5.45118 12.3417 5.45118 12.6583 5.64645 12.8536C5.84171 13.0488 6.15829 13.0488 6.35355 12.8536L10.8536 8.35355C11.0488 8.15829 11.0488 7.84171 10.8536 7.64645L6.35355 3.14645C6.15829 2.95118 5.84171 2.95118 5.64645 3.14645Z"
fill="currentColor"
/>
</svg>
</template>

11
src/_base/icons/Close.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 28 28"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M3.52499419,3.71761187 L3.61611652,3.61611652 C4.0717282,3.16050485 4.79154862,3.13013074 5.28238813,3.52499419 L5.38388348,3.61611652 L14,12.233 L22.6161165,3.61611652 C23.1042719,3.12796116 23.8957281,3.12796116 24.3838835,3.61611652 C24.8720388,4.10427189 24.8720388,4.89572811 24.3838835,5.38388348 L15.767,14 L24.3838835,22.6161165 C24.8394952,23.0717282 24.8698693,23.7915486 24.4750058,24.2823881 L24.3838835,24.3838835 C23.9282718,24.8394952 23.2084514,24.8698693 22.7176119,24.4750058 L22.6161165,24.3838835 L14,15.767 L5.38388348,24.3838835 C4.89572811,24.8720388 4.10427189,24.8720388 3.61611652,24.3838835 C3.12796116,23.8957281 3.12796116,23.1042719 3.61611652,22.6161165 L12.233,14 L3.61611652,5.38388348 C3.16050485,4.9282718 3.13013074,4.20845138 3.52499419,3.71761187 L3.61611652,3.61611652 L3.52499419,3.71761187 Z" />
<path
d="M3.52499419,3.71761187 L3.61611652,3.61611652 C4.0717282,3.16050485 4.79154862,3.13013074 5.28238813,3.52499419 L5.38388348,3.61611652 L14,12.233 L22.6161165,3.61611652 C23.1042719,3.12796116 23.8957281,3.12796116 24.3838835,3.61611652 C24.8720388,4.10427189 24.8720388,4.89572811 24.3838835,5.38388348 L15.767,14 L24.3838835,22.6161165 C24.8394952,23.0717282 24.8698693,23.7915486 24.4750058,24.2823881 L24.3838835,24.3838835 C23.9282718,24.8394952 23.2084514,24.8698693 22.7176119,24.4750058 L22.6161165,24.3838835 L14,15.767 L5.38388348,24.3838835 C4.89572811,24.8720388 4.10427189,24.8720388 3.61611652,24.3838835 C3.12796116,23.8957281 3.12796116,23.1042719 3.61611652,22.6161165 L12.233,14 L3.61611652,5.38388348 C3.16050485,4.9282718 3.13013074,4.20845138 3.52499419,3.71761187 L3.61611652,3.61611652 L3.52499419,3.71761187 Z"
/>
</g>
</g>
</svg>

15
src/_base/icons/Delete.vue
View File

@ -1,7 +1,16 @@
<template>
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.5 7L6.5 11C6.5 11.2761 6.72386 11.5 7 11.5C7.27614 11.5 7.5 11.2761 7.5 11L7.5 7C7.5 6.72386 7.27614 6.5 7 6.5C6.72386 6.5 6.5 6.72386 6.5 7Z" fill="currentColor" />
<path d="M9 6.5C9.27614 6.5 9.5 6.72386 9.5 7V11C9.5 11.2761 9.27614 11.5 9 11.5C8.72386 11.5 8.5 11.2761 8.5 11V7C8.5 6.72386 8.72386 6.5 9 6.5Z" fill="currentColor" />
<path d="M10 4H13C13.2761 4 13.5 4.22386 13.5 4.5C13.5 4.77614 13.2761 5 13 5H12.4475L11.6946 11.7761C11.5539 13.0422 10.4838 14 9.20991 14H6.79008C5.51621 14 4.44605 13.0422 4.30537 11.7761L3.55247 5H3C2.72386 5 2.5 4.77614 2.5 4.5C2.5 4.22386 2.72386 4 3 4H6C6 2.89543 6.89543 2 8 2C9.10457 2 10 2.89543 10 4ZM8 3C7.44772 3 7 3.44772 7 4H9C9 3.44772 8.55229 3 8 3ZM4.55863 5L5.29925 11.6656C5.38366 12.4253 6.02575 13 6.79008 13H9.20991C9.97423 13 10.6163 12.4253 10.7007 11.6656L11.4414 5H4.55863Z" fill="currentColor" />
<path
d="M6.5 7L6.5 11C6.5 11.2761 6.72386 11.5 7 11.5C7.27614 11.5 7.5 11.2761 7.5 11L7.5 7C7.5 6.72386 7.27614 6.5 7 6.5C6.72386 6.5 6.5 6.72386 6.5 7Z"
fill="currentColor"
/>
<path
d="M9 6.5C9.27614 6.5 9.5 6.72386 9.5 7V11C9.5 11.2761 9.27614 11.5 9 11.5C8.72386 11.5 8.5 11.2761 8.5 11V7C8.5 6.72386 8.72386 6.5 9 6.5Z"
fill="currentColor"
/>
<path
d="M10 4H13C13.2761 4 13.5 4.22386 13.5 4.5C13.5 4.77614 13.2761 5 13 5H12.4475L11.6946 11.7761C11.5539 13.0422 10.4838 14 9.20991 14H6.79008C5.51621 14 4.44605 13.0422 4.30537 11.7761L3.55247 5H3C2.72386 5 2.5 4.77614 2.5 4.5C2.5 4.22386 2.72386 4 3 4H6C6 2.89543 6.89543 2 8 2C9.10457 2 10 2.89543 10 4ZM8 3C7.44772 3 7 3.44772 7 4H9C9 3.44772 8.55229 3 8 3ZM4.55863 5L5.29925 11.6656C5.38366 12.4253 6.02575 13 6.79008 13H9.20991C9.97423 13 10.6163 12.4253 10.7007 11.6656L11.4414 5H4.55863Z"
fill="currentColor"
/>
</svg>
</template>

11
src/_base/icons/Download.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 16 16"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="currentColor" fill-rule="nonzero">
<path d="M3.5,13 L12.5,13 C12.7761424,13 13,13.2238576 13,13.5 C13,13.7454599 12.8231248,13.9496084 12.5898756,13.9919443 L12.5,14 L3.5,14 C3.22385763,14 3,13.7761424 3,13.5 C3,13.2545401 3.17687516,13.0503916 3.41012437,13.0080557 L3.5,13 L12.5,13 L3.5,13 Z M7.91012437,1.00805567 L8,1 C8.24545989,1 8.44960837,1.17687516 8.49194433,1.41012437 L8.5,1.5 L8.5,10.292 L11.1819805,7.6109127 C11.3555469,7.43734635 11.6249713,7.4180612 11.8198394,7.55305725 L11.8890873,7.6109127 C12.0626536,7.78447906 12.0819388,8.05390346 11.9469427,8.2487716 L11.8890873,8.31801948 L8.35355339,11.8535534 C8.17998704,12.0271197 7.91056264,12.0464049 7.7156945,11.9114088 L7.64644661,11.8535534 L4.1109127,8.31801948 C3.91565056,8.12275734 3.91565056,7.80617485 4.1109127,7.6109127 C4.28447906,7.43734635 4.55390346,7.4180612 4.7487716,7.55305725 L4.81801948,7.6109127 L7.5,10.292 L7.5,1.5 C7.5,1.25454011 7.67687516,1.05039163 7.91012437,1.00805567 L8,1 L7.91012437,1.00805567 Z" />
<path
d="M3.5,13 L12.5,13 C12.7761424,13 13,13.2238576 13,13.5 C13,13.7454599 12.8231248,13.9496084 12.5898756,13.9919443 L12.5,14 L3.5,14 C3.22385763,14 3,13.7761424 3,13.5 C3,13.2545401 3.17687516,13.0503916 3.41012437,13.0080557 L3.5,13 L12.5,13 L3.5,13 Z M7.91012437,1.00805567 L8,1 C8.24545989,1 8.44960837,1.17687516 8.49194433,1.41012437 L8.5,1.5 L8.5,10.292 L11.1819805,7.6109127 C11.3555469,7.43734635 11.6249713,7.4180612 11.8198394,7.55305725 L11.8890873,7.6109127 C12.0626536,7.78447906 12.0819388,8.05390346 11.9469427,8.2487716 L11.8890873,8.31801948 L8.35355339,11.8535534 C8.17998704,12.0271197 7.91056264,12.0464049 7.7156945,11.9114088 L7.64644661,11.8535534 L4.1109127,8.31801948 C3.91565056,8.12275734 3.91565056,7.80617485 4.1109127,7.6109127 C4.28447906,7.43734635 4.55390346,7.4180612 4.7487716,7.55305725 L4.81801948,7.6109127 L7.5,10.292 L7.5,1.5 C7.5,1.25454011 7.67687516,1.05039163 7.91012437,1.00805567 L8,1 L7.91012437,1.00805567 Z"
/>
</g>
</g>
</svg>

24
src/_base/icons/Empty.vue
View File

@ -1,6 +1,26 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M448,256c0-106-86-192-192-192S64,150,64,256s86,192,192,192S448,362,448,256Z" style="fill: none; stroke: currentColor; stroke-miterlimit: 10; stroke-width: 32px" />
<line x1="336" y1="256" x2="176" y2="256" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<path
d="M448,256c0-106-86-192-192-192S64,150,64,256s86,192,192,192S448,362,448,256Z"
style="
fill: none;
stroke: currentColor;
stroke-miterlimit: 10;
stroke-width: 32px;
"
/>
<line
x1="336"
y1="256"
x2="176"
y2="256"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
</svg>
</template>

11
src/_base/icons/Error.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 48 48"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M17.8838835,16.1161165 L17.7823881,16.0249942 C17.3266086,15.6583353 16.6733914,15.6583353 16.2176119,16.0249942 L16.1161165,16.1161165 L16.0249942,16.2176119 C15.6583353,16.6733914 15.6583353,17.3266086 16.0249942,17.7823881 L16.1161165,17.8838835 L22.233,24 L16.1161165,30.1161165 L16.0249942,30.2176119 C15.6583353,30.6733914 15.6583353,31.3266086 16.0249942,31.7823881 L16.1161165,31.8838835 L16.2176119,31.9750058 C16.6733914,32.3416647 17.3266086,32.3416647 17.7823881,31.9750058 L17.8838835,31.8838835 L24,25.767 L30.1161165,31.8838835 L30.2176119,31.9750058 C30.6733914,32.3416647 31.3266086,32.3416647 31.7823881,31.9750058 L31.8838835,31.8838835 L31.9750058,31.7823881 C32.3416647,31.3266086 32.3416647,30.6733914 31.9750058,30.2176119 L31.8838835,30.1161165 L25.767,24 L31.8838835,17.8838835 L31.9750058,17.7823881 C32.3416647,17.3266086 32.3416647,16.6733914 31.9750058,16.2176119 L31.8838835,16.1161165 L31.7823881,16.0249942 C31.3266086,15.6583353 30.6733914,15.6583353 30.2176119,16.0249942 L30.1161165,16.1161165 L24,22.233 L17.8838835,16.1161165 L17.7823881,16.0249942 L17.8838835,16.1161165 Z" />
<path
d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M17.8838835,16.1161165 L17.7823881,16.0249942 C17.3266086,15.6583353 16.6733914,15.6583353 16.2176119,16.0249942 L16.1161165,16.1161165 L16.0249942,16.2176119 C15.6583353,16.6733914 15.6583353,17.3266086 16.0249942,17.7823881 L16.1161165,17.8838835 L22.233,24 L16.1161165,30.1161165 L16.0249942,30.2176119 C15.6583353,30.6733914 15.6583353,31.3266086 16.0249942,31.7823881 L16.1161165,31.8838835 L16.2176119,31.9750058 C16.6733914,32.3416647 17.3266086,32.3416647 17.7823881,31.9750058 L17.8838835,31.8838835 L24,25.767 L30.1161165,31.8838835 L30.2176119,31.9750058 C30.6733914,32.3416647 31.3266086,32.3416647 31.7823881,31.9750058 L31.8838835,31.8838835 L31.9750058,31.7823881 C32.3416647,31.3266086 32.3416647,30.6733914 31.9750058,30.2176119 L31.8838835,30.1161165 L25.767,24 L31.8838835,17.8838835 L31.9750058,17.7823881 C32.3416647,17.3266086 32.3416647,16.6733914 31.9750058,16.2176119 L31.8838835,16.1161165 L31.7823881,16.0249942 C31.3266086,15.6583353 30.6733914,15.6583353 30.2176119,16.0249942 L30.1161165,16.1161165 L24,22.233 L17.8838835,16.1161165 L17.7823881,16.0249942 L17.8838835,16.1161165 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/FastBackward.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 20 20"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="currentColor" fill-rule="nonzero">
<path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" />
<path
d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/FastForward.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 20 20"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="currentColor" fill-rule="nonzero">
<path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" />
<path
d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/Filter.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 28 28"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M17,19 C17.5522847,19 18,19.4477153 18,20 C18,20.5522847 17.5522847,21 17,21 L11,21 C10.4477153,21 10,20.5522847 10,20 C10,19.4477153 10.4477153,19 11,19 L17,19 Z M21,13 C21.5522847,13 22,13.4477153 22,14 C22,14.5522847 21.5522847,15 21,15 L7,15 C6.44771525,15 6,14.5522847 6,14 C6,13.4477153 6.44771525,13 7,13 L21,13 Z M24,7 C24.5522847,7 25,7.44771525 25,8 C25,8.55228475 24.5522847,9 24,9 L4,9 C3.44771525,9 3,8.55228475 3,8 C3,7.44771525 3.44771525,7 4,7 L24,7 Z" />
<path
d="M17,19 C17.5522847,19 18,19.4477153 18,20 C18,20.5522847 17.5522847,21 17,21 L11,21 C10.4477153,21 10,20.5522847 10,20 C10,19.4477153 10.4477153,19 11,19 L17,19 Z M21,13 C21.5522847,13 22,13.4477153 22,14 C22,14.5522847 21.5522847,15 21,15 L7,15 C6.44771525,15 6,14.5522847 6,14 C6,13.4477153 6.44771525,13 7,13 L21,13 Z M24,7 C24.5522847,7 25,7.44771525 25,8 C25,8.55228475 24.5522847,9 24,9 L4,9 C3.44771525,9 3,8.55228475 3,8 C3,7.44771525 3.44771525,7 4,7 L24,7 Z"
/>
</g>
</g>
</svg>

5
src/_base/icons/Forward.vue
View File

@ -1,5 +1,8 @@
<template>
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.73271 4.20694C8.03263 3.92125 8.50737 3.93279 8.79306 4.23271L13.7944 9.48318C14.0703 9.77285 14.0703 10.2281 13.7944 10.5178L8.79306 15.7682C8.50737 16.0681 8.03263 16.0797 7.73271 15.794C7.43279 15.5083 7.42125 15.0336 7.70694 14.7336L12.2155 10.0005L7.70694 5.26729C7.42125 4.96737 7.43279 4.49264 7.73271 4.20694Z" fill="currentColor" />
<path
d="M7.73271 4.20694C8.03263 3.92125 8.50737 3.93279 8.79306 4.23271L13.7944 9.48318C14.0703 9.77285 14.0703 10.2281 13.7944 10.5178L8.79306 15.7682C8.50737 16.0681 8.03263 16.0797 7.73271 15.794C7.43279 15.5083 7.42125 15.0336 7.70694 14.7336L12.2155 10.0005L7.70694 5.26729C7.42125 4.96737 7.43279 4.49264 7.73271 4.20694Z"
fill="currentColor"
/>
</svg>
</template>

11
src/_base/icons/Info.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 28 28"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M14,2 C20.6274,2 26,7.37258 26,14 C26,20.6274 20.6274,26 14,26 C7.37258,26 2,20.6274 2,14 C2,7.37258 7.37258,2 14,2 Z M14,11 C13.4477,11 13,11.4477 13,12 L13,12 L13,20 C13,20.5523 13.4477,21 14,21 C14.5523,21 15,20.5523 15,20 L15,20 L15,12 C15,11.4477 14.5523,11 14,11 Z M14,6.75 C13.3096,6.75 12.75,7.30964 12.75,8 C12.75,8.69036 13.3096,9.25 14,9.25 C14.6904,9.25 15.25,8.69036 15.25,8 C15.25,7.30964 14.6904,6.75 14,6.75 Z" />
<path
d="M14,2 C20.6274,2 26,7.37258 26,14 C26,20.6274 20.6274,26 14,26 C7.37258,26 2,20.6274 2,14 C2,7.37258 7.37258,2 14,2 Z M14,11 C13.4477,11 13,11.4477 13,12 L13,12 L13,20 C13,20.5523 13.4477,21 14,21 C14.5523,21 15,20.5523 15,20 L15,20 L15,12 C15,11.4477 14.5523,11 14,11 Z M14,6.75 C13.3096,6.75 12.75,7.30964 12.75,8 C12.75,8.69036 13.3096,9.25 14,9.25 C14.6904,9.25 15.25,8.69036 15.25,8 C15.25,7.30964 14.6904,6.75 14,6.75 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/More.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 16 16"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="currentColor" fill-rule="nonzero">
<path d="M4,7 C4.55228,7 5,7.44772 5,8 C5,8.55229 4.55228,9 4,9 C3.44772,9 3,8.55229 3,8 C3,7.44772 3.44772,7 4,7 Z M8,7 C8.55229,7 9,7.44772 9,8 C9,8.55229 8.55229,9 8,9 C7.44772,9 7,8.55229 7,8 C7,7.44772 7.44772,7 8,7 Z M12,7 C12.5523,7 13,7.44772 13,8 C13,8.55229 12.5523,9 12,9 C11.4477,9 11,8.55229 11,8 C11,7.44772 11.4477,7 12,7 Z" />
<path
d="M4,7 C4.55228,7 5,7.44772 5,8 C5,8.55229 4.55228,9 4,9 C3.44772,9 3,8.55229 3,8 C3,7.44772 3.44772,7 4,7 Z M8,7 C8.55229,7 9,7.44772 9,8 C9,8.55229 8.55229,9 8,9 C7.44772,9 7,8.55229 7,8 C7,7.44772 7.44772,7 8,7 Z M12,7 C12.5523,7 13,7.44772 13,8 C13,8.55229 12.5523,9 12,9 C11.4477,9 11,8.55229 11,8 C11,7.44772 11.4477,7 12,7 Z"
/>
</g>
</g>
</svg>

16
src/_base/icons/Remove.vue
View File

@ -1,3 +1,17 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><line x1="400" y1="256" x2="112" y2="256" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" /></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<line
x1="400"
y1="256"
x2="112"
y2="256"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
</svg>
</template>

11
src/_base/icons/Search.vue
View File

@ -1,5 +1,14 @@
<template>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background: new 0 0 512 512" xml:space="preserve">
<svg
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px"
y="0px"
viewBox="0 0 512 512"
style="enable-background: new 0 0 512 512"
xml:space="preserve"
>
<path
d="M443.5,420.2L336.7,312.4c20.9-26.2,33.5-59.4,33.5-95.5c0-84.5-68.5-153-153.1-153S64,132.5,64,217s68.5,153,153.1,153
c36.6,0,70.1-12.8,96.5-34.2l106.1,107.1c3.2,3.4,7.6,5.1,11.9,5.1c4.1,0,8.2-1.5,11.3-4.5C449.5,437.2,449.7,426.8,443.5,420.2z

11
src/_base/icons/Success.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 48 48"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z" />
<path
d="M24,4 C35.045695,4 44,12.954305 44,24 C44,35.045695 35.045695,44 24,44 C12.954305,44 4,35.045695 4,24 C4,12.954305 12.954305,4 24,4 Z M32.6338835,17.6161165 C32.1782718,17.1605048 31.4584514,17.1301307 30.9676119,17.5249942 L30.8661165,17.6161165 L20.75,27.732233 L17.1338835,24.1161165 C16.6457281,23.6279612 15.8542719,23.6279612 15.3661165,24.1161165 C14.9105048,24.5717282 14.8801307,25.2915486 15.2749942,25.7823881 L15.3661165,25.8838835 L19.8661165,30.3838835 C20.3217282,30.8394952 21.0415486,30.8698693 21.5323881,30.4750058 L21.6338835,30.3838835 L32.6338835,19.3838835 C33.1220388,18.8957281 33.1220388,18.1042719 32.6338835,17.6161165 Z"
/>
</g>
</g>
</svg>

11
src/_base/icons/Switcher.vue
View File

@ -1,5 +1,14 @@
<template>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
<svg
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px"
y="0px"
viewBox="0 0 512 512"
enable-background="new 0 0 512 512"
xml:space="preserve"
>
<g>
<polygon points="192,128 320,256 192,384" />
</g>

21
src/_base/icons/Time.vue
View File

@ -1,6 +1,23 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M256,64C150,64,64,150,64,256s86,192,192,192,192-86,192-192S362,64,256,64Z" style="fill: none; stroke: currentColor; stroke-miterlimit: 10; stroke-width: 32px" />
<polyline points="256 128 256 272 352 272" style="fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px" />
<path
d="M256,64C150,64,64,150,64,256s86,192,192,192,192-86,192-192S362,64,256,64Z"
style="
fill: none;
stroke: currentColor;
stroke-miterlimit: 10;
stroke-width: 32px;
"
/>
<polyline
points="256 128 256 272 352 272"
style="
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
"
/>
</svg>
</template>

11
src/_base/icons/Warning.vue
View File

@ -1,8 +1,15 @@
<template>
<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg
viewBox="0 0 24 24"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g stroke="none" stroke-width="1" fill-rule="evenodd">
<g fill-rule="nonzero">
<path d="M12,2 C17.523,2 22,6.478 22,12 C22,17.522 17.523,22 12,22 C6.477,22 2,17.522 2,12 C2,6.478 6.477,2 12,2 Z M12.0018002,15.0037242 C11.450254,15.0037242 11.0031376,15.4508407 11.0031376,16.0023869 C11.0031376,16.553933 11.450254,17.0010495 12.0018002,17.0010495 C12.5533463,17.0010495 13.0004628,16.553933 13.0004628,16.0023869 C13.0004628,15.4508407 12.5533463,15.0037242 12.0018002,15.0037242 Z M11.99964,7 C11.4868042,7.00018474 11.0642719,7.38637706 11.0066858,7.8837365 L11,8.00036004 L11.0018003,13.0012393 L11.00857,13.117858 C11.0665141,13.6151758 11.4893244,14.0010638 12.0021602,14.0008793 C12.514996,14.0006946 12.9375283,13.6145023 12.9951144,13.1171428 L13.0018002,13.0005193 L13,7.99964009 L12.9932303,7.8830214 C12.9352861,7.38570354 12.5124758,6.99981552 11.99964,7 Z" />
<path
d="M12,2 C17.523,2 22,6.478 22,12 C22,17.522 17.523,22 12,22 C6.477,22 2,17.522 2,12 C2,6.478 6.477,2 12,2 Z M12.0018002,15.0037242 C11.450254,15.0037242 11.0031376,15.4508407 11.0031376,16.0023869 C11.0031376,16.553933 11.450254,17.0010495 12.0018002,17.0010495 C12.5533463,17.0010495 13.0004628,16.553933 13.0004628,16.0023869 C13.0004628,15.4508407 12.5533463,15.0037242 12.0018002,15.0037242 Z M11.99964,7 C11.4868042,7.00018474 11.0642719,7.38637706 11.0066858,7.8837365 L11,8.00036004 L11.0018003,13.0012393 L11.00857,13.117858 C11.0665141,13.6151758 11.4893244,14.0010638 12.0021602,14.0008793 C12.514996,14.0006946 12.9375283,13.6145023 12.9951144,13.1171428 L13.0018002,13.0005193 L13,7.99964009 L12.9932303,7.8830214 C12.9352861,7.38570354 12.5124758,6.99981552 11.99964,7 Z"
/>
</g>
</g>
</svg>

8
src/_base/loading/src/Loading.vue
View File

@ -1,6 +1,6 @@
<template>
<div
:class="{[`n-${theme}-theme`]: theme}"
:class="{ [`n-${theme}-theme`]: theme }"
class="n-base-loading"
:style="{
stroke
@ -18,7 +18,7 @@
:cx="radius"
:cy="radius"
fill="none"
:r="radius - (strokeWidth) / 2"
:r="radius - strokeWidth / 2"
/>
</svg>
</div>
@ -30,9 +30,7 @@ import styles from './styles/'
export default {
name: 'BaseLoading',
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
props: {
radius: {
type: Number,

16
src/_base/menu-mask/src/MenuMask.vue
View File

@ -1,7 +1,5 @@
<template>
<transition
name="n-fade-in-transition"
>
<transition name="n-fade-in-transition">
<div
v-if="show"
class="n-base-menu-mask"
@ -22,9 +20,7 @@ import styles from './styles'
export default {
name: 'BaseMenuMask',
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
props: {
theme: {
type: String,
@ -36,9 +32,7 @@ export default {
const timerIdRef = ref(null)
const uncontrolledShowRef = ref(false)
onBeforeUnmount(() => {
const {
value: timerId
} = timerIdRef
const { value: timerId } = timerIdRef
if (timerId !== null) {
window.clearTimeout(timerId)
}
@ -48,9 +42,7 @@ export default {
timerId: timerIdRef,
show: uncontrolledShowRef,
showOnce (message, duration = 1500) {
const {
value: timerId
} = timerIdRef
const { value: timerId } = timerIdRef
if (timerId) window.clearTimeout(timerId)
uncontrolledShowRef.value = true
messageRef.value = message

14
src/_base/select-menu/src/SelectGroupHeader.js
View File

@ -9,10 +9,16 @@ export default {
}
},
render () {
const { tmNode: { rawNode } } = this
const {
tmNode: { rawNode }
} = this
const children = rawNode.render ? [rawNode.render(rawNode)] : [rawNode.name]
return h('div', {
class: 'n-base-select-group-header'
}, children)
return h(
'div',
{
class: 'n-base-select-group-header'
},
children
)
}
}

64
src/_base/select-menu/src/SelectMenu.vue
View File

@ -36,35 +36,21 @@
:key="tmNode.key"
:tm-node="tmNode"
/>
<n-select-option
v-else
:key="tmNode.key"
:tm-node="tmNode"
/>
<n-select-option v-else :key="tmNode.key" :tm-node="tmNode" />
</template>
</virtual-list>
<div
v-else
class="n-base-select-menu-option-wrapper"
>
<div v-else class="n-base-select-menu-option-wrapper">
<template v-for="tmNode in tmNodes">
<n-select-group-header
v-if="tmNode.rawNode.type === 'group'"
:key="tmNode.key"
:tm-node="tmNode"
/>
<n-select-option
v-else
:key="tmNode.key"
:tm-node="tmNode"
/>
<n-select-option v-else :key="tmNode.key" :tm-node="tmNode" />
</template>
</div>
</n-scrollbar>
<div
v-else
style="padding: 14px 0; width: 100%;"
>
<div v-else style="padding: 14px 0; width: 100%">
<slot name="empty">
<n-empty />
</slot>
@ -168,14 +154,14 @@ export default {
? props.value === null
? treeMate.getFirstAvailableNode()
: props.multiple
? treeMate.getNode((props.value || [])[(props.value || []).length - 1]) || treeMate.getFirstAvailableNode()
? treeMate.getNode(
(props.value || [])[(props.value || []).length - 1]
) || treeMate.getFirstAvailableNode()
: treeMate.getNode(props.value) || treeMate.getFirstAvailableNode()
: null
)
onMounted(() => {
const {
value
} = scrollbarRef
const { value } = scrollbarRef
if (value) value.sync()
})
return {
@ -183,15 +169,11 @@ export default {
virtualListRef,
scrollbarRef,
virtualListContainer () {
const {
value
} = virtualListRef
const { value } = virtualListRef
return value && value.listRef
},
virtualListContent () {
const {
value
} = virtualListRef
const { value } = virtualListRef
return value && value.itemsRef
},
pendingTmNode: pendingNodeRef,
@ -200,10 +182,7 @@ export default {
},
computed: {
valueSet () {
if (
this.multiple &&
Array.isArray(this.value)
) return new Set(this.value)
if (this.multiple && Array.isArray(this.value)) return new Set(this.value)
return null
},
empty () {
@ -231,15 +210,11 @@ export default {
},
methods: {
doToggleOption (option) {
const {
onMenuToggleOption
} = this
const { onMenuToggleOption } = this
if (onMenuToggleOption) onMenuToggleOption(option)
},
doScroll (e) {
const {
onScroll
} = this
const { onScroll } = this
if (onScroll) onScroll(e)
},
// required, scroller sync need to be triggered manually
@ -270,17 +245,13 @@ export default {
this.next()
},
next () {
const {
pendingTmNode
} = this
const { pendingTmNode } = this
if (pendingTmNode) {
this.setPendingTmNode(pendingTmNode.getNext({ loop: true }), true)
}
},
prev () {
const {
pendingTmNode
} = this
const { pendingTmNode } = this
if (pendingTmNode) {
this.setPendingTmNode(pendingTmNode.getPrev({ loop: true }), true)
}
@ -291,7 +262,10 @@ export default {
if (this.virtualScroll) {
this.virtualListRef.scrollTo({ index: tmNode.fIndex })
} else {
this.scrollbarRef.scrollTo({ index: tmNode.fIndex, elSize: this.itemSize })
this.scrollbarRef.scrollTo({
index: tmNode.fIndex,
elSize: this.itemSize
})
}
}
}

66
src/_base/select-menu/src/SelectOption.js
View File

@ -30,16 +30,11 @@ export default {
return props.tmNode.key === pendingTmNode.key
}),
isSelected: useMemo(() => {
const {
multiple,
value
} = NBaseSelectMenu
const { multiple, value } = NBaseSelectMenu
if (value === null) return false
const optionValue = rawNodeRef.value.value
if (multiple) {
const {
valueSet
} = NBaseSelectMenu
const { valueSet } = NBaseSelectMenu
return valueSet.has(optionValue)
} else {
return value === optionValue
@ -49,48 +44,47 @@ export default {
},
methods: {
handleClick (e) {
const {
tmNode
} = this
const { tmNode } = this
if (tmNode.disabled) return
this.NBaseSelectMenu.handleOptionClick(e, tmNode)
},
handleMouseEnter (e) {
const {
tmNode
} = this
const { tmNode } = this
if (tmNode.disabled) return
this.NBaseSelectMenu.handleOptionMouseEnter(e, tmNode)
},
handleMouseMove (e) {
const {
tmNode,
isPending
} = this
const { tmNode, isPending } = this
if (tmNode.disabled || isPending) return
this.NBaseSelectMenu.handleOptionMouseEnter(e, tmNode)
}
},
render () {
const { rawNode } = this
const children = rawNode.render ? rawNode.render(rawNode, this.isSelected) : [rawNode.label]
return h('div', {
class: [
'n-base-select-option',
[
rawNode.class,
{
'n-base-select-option--disabled': rawNode.disabled,
'n-base-select-option--selected': this.isSelected,
'n-base-select-option--grouped': this.isGrouped,
'n-base-select-option--pending': this.isPending
}
]
],
style: rawNode.style,
onClick: this.handleClick,
onMouseEnter: this.handleMouseEnter,
onMouseMove: this.handleMouseMove
}, children)
const children = rawNode.render
? rawNode.render(rawNode, this.isSelected)
: [rawNode.label]
return h(
'div',
{
class: [
'n-base-select-option',
[
rawNode.class,
{
'n-base-select-option--disabled': rawNode.disabled,
'n-base-select-option--selected': this.isSelected,
'n-base-select-option--grouped': this.isGrouped,
'n-base-select-option--pending': this.isPending
}
]
],
style: rawNode.style,
onClick: this.handleClick,
onMouseEnter: this.handleMouseEnter,
onMouseMove: this.handleMouseMove
},
children
)
}
}

9
src/_base/select-menu/src/styles/index.js
View File

@ -4,17 +4,12 @@ import sizeStyle from './themed-size'
export default [
{
key: 'theme',
watch: [
'theme'
],
watch: ['theme'],
CNode: baseStyle
},
{
key: 'size',
watch: [
'size',
'theme'
],
watch: ['size', 'theme'],
CNode: sizeStyle
}
]

142
src/_base/select-menu/src/styles/themed-base.js
View File

@ -2,9 +2,7 @@ import { cTB, c, cB, cE, cM, cNotM } from '../../../../_utils/cssr'
export default c([
({ props }) => {
const {
cubicBezierEaseInOut
} = props.$global
const { cubicBezierEaseInOut } = props.$global
const {
borderRadius,
color,
@ -20,8 +18,10 @@ export default c([
actionTextColor,
optionColorPending
} = props.$local
return cTB('base-select-menu', {
raw: `
return cTB(
'base-select-menu',
{
raw: `
outline: none;
margin-top: 4px;
margin-bottom: 4px;
@ -35,29 +35,32 @@ export default c([
background-color: ${color};
box-shadow: ${boxShadow};
`
}, [
cB('base-select-menu-option-wrapper', {
position: 'relative',
width: '100%'
}),
cE('action', {
padding: '8px 14px',
fontSize: '14px',
transition: `
},
[
cB('base-select-menu-option-wrapper', {
position: 'relative',
width: '100%'
}),
cE('action', {
padding: '8px 14px',
fontSize: '14px',
transition: `
color .3s ${cubicBezierEaseInOut},
border-color .3s ${cubicBezierEaseInOut}
`,
borderTop: `1px solid ${actionDividerColor}`,
color: actionTextColor
}),
cB('base-select-group-header', {
position: 'relative',
cursor: 'default',
padding: '0 14px',
color: groupHeaderTextColor
}),
cB('base-select-option', {
raw: `
borderTop: `1px solid ${actionDividerColor}`,
color: actionTextColor
}),
cB('base-select-group-header', {
position: 'relative',
cursor: 'default',
padding: '0 14px',
color: groupHeaderTextColor
}),
cB(
'base-select-option',
{
raw: `
cursor: pointer;
position: relative;
padding: 0 14px;
@ -72,43 +75,52 @@ export default c([
color: ${optionTextColor};
opacity: 1;
`
}, [
c('&:active', {
color: optionTextColorPressed
}),
cM('grouped', {
padding: '0 21px'
}),
cM('selected', {
color: optionTextColorSelected
}),
cM('disabled', {
cursor: 'not-allowed'
}, [
cNotM('selected', {
color: optionTextColorDisabled
}),
cM('selected', {
opacity: optionOpacityDisabled
})
]),
cM('pending', {
backgroundColor: optionColorPending
})
]),
cM('multiple', [
cB('base-select-option', {
position: 'relative',
paddingRight: '28px'
}, [
cM('selected', [
c('&::after', {
opacity: 1,
transform: 'rotate(45deg) scale(1)'
},
[
c('&:active', {
color: optionTextColorPressed
}),
cM('grouped', {
padding: '0 21px'
}),
cM('selected', {
color: optionTextColorSelected
}),
cM(
'disabled',
{
cursor: 'not-allowed'
},
[
cNotM('selected', {
color: optionTextColorDisabled
}),
cM('selected', {
opacity: optionOpacityDisabled
})
]
),
cM('pending', {
backgroundColor: optionColorPending
})
]),
c('&::after', {
raw: `
]
),
cM('multiple', [
cB(
'base-select-option',
{
position: 'relative',
paddingRight: '28px'
},
[
cM('selected', [
c('&::after', {
opacity: 1,
transform: 'rotate(45deg) scale(1)'
})
]),
c('&::after', {
raw: `
content: '';
height: 6px;
width: 3px;
@ -123,9 +135,11 @@ export default c([
border-right: 1px solid ${optionCheckColor};
border-bottom: 1px solid ${optionCheckColor};
`
})
})
]
)
])
])
])
]
)
}
])

44
src/_base/select-menu/src/styles/themed-size.js
View File

@ -10,26 +10,30 @@ export default c([
const menuHeight = pxfy(depx(optionHeight) * 7.6)
const padding = props.$local[createKey('padding', size)]
return cTB('base-select-menu', [
cM(size + '-size', {
padding
}, [
cB('scrollbar', {
maxHeight: menuHeight
}),
cB('virtual-list', {
maxHeight: menuHeight
}),
cB('base-select-option', {
height: optionHeight,
lineHeight: optionHeight,
fontSize: fontSize
}),
cB('base-select-group-header', {
height: optionHeight,
lineHeight: optionHeight,
fontSize: groupHeaderFontSize
})
])
cM(
size + '-size',
{
padding
},
[
cB('scrollbar', {
maxHeight: menuHeight
}),
cB('virtual-list', {
maxHeight: menuHeight
}),
cB('base-select-option', {
height: optionHeight,
lineHeight: optionHeight,
fontSize: fontSize
}),
cB('base-select-group-header', {
height: optionHeight,
lineHeight: optionHeight,
fontSize: groupHeaderFontSize
})
]
)
])
}
])

4
src/_base/select-menu/styles/dark.js
View File

@ -5,9 +5,7 @@ import commonVariables from './_common'
export default create({
name: 'BaseSelectMenu',
theme: 'dark',
peer: [
scrollbarDark
],
peer: [scrollbarDark],
getLocalVars (vars) {
return {
...commonVariables,

4
src/_base/select-menu/styles/light.js
View File

@ -5,9 +5,7 @@ import commonVariables from './_common'
export default create({
name: 'BaseSelectMenu',
theme: 'light',
peer: [
scrollbarLight
],
peer: [scrollbarLight],
getLocalVars (vars) {
return {
...commonVariables,

47
src/_base/selection/src/Selection.vue
View File

@ -48,9 +48,7 @@
@clear="handleClear"
/>
</div>
<div
class="n-base-selection__placeholder"
>
<div class="n-base-selection__placeholder">
{{ placeholder }}
</div>
</template>
@ -59,7 +57,7 @@
<div
ref="patternInputWrapper"
class="n-base-selection-tags"
:tabindex="(disabled || patternInputFocused) ? false : '0'"
:tabindex="disabled || patternInputFocused ? false : '0'"
@blur="handleBlur"
>
<n-tag
@ -74,9 +72,7 @@
>
{{ option.label }}
</n-tag>
<div
class="n-base-selection-input-tag"
>
<div class="n-base-selection-input-tag">
<input
ref="patternInput"
tabindex="-1"
@ -105,9 +101,7 @@
@clear="handleClear"
/>
</div>
<div
class="n-base-selection__placeholder"
>
<div class="n-base-selection__placeholder">
{{ placeholder }}
</div>
</template>
@ -116,15 +110,19 @@
<div
ref="patternInputWrapper"
class="n-base-selection-label"
:tabindex="(!disabled && !patternInputFocused) ? '0' : false"
:tabindex="!disabled && !patternInputFocused ? '0' : false"
@blur="handleBlur"
>
<input
ref="patternInput"
class="n-base-selection-label__input"
:value="(patternInputFocused && active) ? pattern : label"
:value="patternInputFocused && active ? pattern : label"
:placeholder="null"
:readonly="!disabled && filterable && (active || autofocus) ? false : 'readonly'"
:readonly="
!disabled && filterable && (active || autofocus)
? false
: 'readonly'
"
:disabled="disabled"
tabindex="-1"
:autofocus="autofocus"
@ -158,10 +156,7 @@
:tabindex="disabled ? false : '0'"
@blur="handleBlur"
>
<div
v-if="label && label.length"
class="n-base-selection-label__input"
>
<div v-if="label && label.length" class="n-base-selection-label__input">
{{ label }}
</div>
<div
@ -200,9 +195,7 @@ export default {
NBaseSuffix,
NTag
},
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
props: {
bordered: {
type: Boolean,
@ -319,8 +312,11 @@ export default {
return label
},
selected () {
if (this.multiple) return !!(Array.isArray(this.selectedOptions) && this.selectedOptions.length)
else {
if (this.multiple) {
return !!(
Array.isArray(this.selectedOptions) && this.selectedOptions.length
)
} else {
return this.selectedOption !== null
}
}
@ -406,7 +402,12 @@ export default {
},
handleMouseDown (e) {
if (!this.active) return
const filterableElKeys = ['focusableEl1', 'patternInputWrapper', 'patternInput', 'focusableEl2']
const filterableElKeys = [
'focusableEl1',
'patternInputWrapper',
'patternInput',
'focusableEl2'
]
const refs = this.$refs
for (const key of filterableElKeys) {
const el = refs[key]

8
src/_base/selection/src/styles/index.js
View File

@ -4,16 +4,12 @@ import sizeStyle from './themed-size'
export default [
{
key: 'theme',
watch: [
'theme'
],
watch: ['theme'],
CNode: baseStyle
},
{
key: 'size',
watch: [
'size', 'theme'
],
watch: ['size', 'theme'],
CNode: sizeStyle
}
]

524
src/_base/selection/src/styles/themed-base.js
View File

@ -1,4 +1,14 @@
import { cTB, cRB, c, cB, cE, cM, cNotM, createKey, insideFormItem } from '../../../../_utils/cssr'
import {
cTB,
cRB,
c,
cB,
cE,
cM,
cNotM,
createKey,
insideFormItem
} from '../../../../_utils/cssr'
export default c([
({ props }) => {
@ -22,11 +32,11 @@ export default c([
borderHover,
borderActive
} = $local
const {
cubicBezierEaseInOut
} = props.$global
return cTB('base-selection', {
raw: `
const { cubicBezierEaseInOut } = props.$global
return cTB(
'base-selection',
{
raw: `
position: relative;
z-index: auto;
box-shadow: none;
@ -35,15 +45,16 @@ export default c([
display: inline-block;
vertical-align: bottom;
`,
borderRadius
}, [
cM('bordered', [
cE('border', {
border
})
]),
cE('border, state-border', {
raw: `
borderRadius
},
[
cM('bordered', [
cE('border', {
border
})
]),
cE('border, state-border', {
raw: `
position: absolute;
left: 0;
right: 0;
@ -51,16 +62,16 @@ export default c([
bottom: 0;
pointer-events: none;
`,
border,
borderColor: 'transparent',
borderRadius,
transition: `border-color .3s ${cubicBezierEaseInOut}`
}),
cE('state-border', {
zIndex: 1
}),
cE('box-shadow', {
raw: `
border,
borderColor: 'transparent',
borderRadius,
transition: `border-color .3s ${cubicBezierEaseInOut}`
}),
cE('state-border', {
zIndex: 1
}),
cE('box-shadow', {
raw: `
position: absolute;
left: 0;
right: 0;
@ -69,36 +80,38 @@ export default c([
pointer-events: none;
z-index: 1;
`,
borderRadius,
transition: `box-shadow .3s ${cubicBezierEaseInOut}`
}),
cE('mark', {
raw: `
borderRadius,
transition: `box-shadow .3s ${cubicBezierEaseInOut}`
}),
cE('mark', {
raw: `
cursor: pointer;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 10px;
`
}),
cM('selected', [
}),
cM('selected', [
cE('placeholder', {
opacity: 0
})
]),
cE('placeholder', {
opacity: 0
})
]),
cE('placeholder', {
raw: `
raw: `
pointer-events: none;
position: absolute;
left: 14px;
top: 0;
opacity: 1;
`,
transition: `color .3s ${cubicBezierEaseInOut}`,
color: placeholderColor
}),
cB('base-selection-tags', {
raw: `
transition: `color .3s ${cubicBezierEaseInOut}`,
color: placeholderColor
}),
cB(
'base-selection-tags',
{
raw: `
cursor: pointer;
outline: none;
box-sizing: border-box;
@ -111,31 +124,39 @@ export default c([
width: 100%;
vertical-align: bottom;
`,
backgroundColor: color,
borderRadius,
transition: `
backgroundColor: color,
borderRadius,
transition: `
color .3s ${cubicBezierEaseInOut},
box-shadow .3s ${cubicBezierEaseInOut},
background-color .3s ${cubicBezierEaseInOut}
`
}, [
cB('tag', {
raw: `
},
[
cB(
'tag',
{
raw: `
margin-right: 7px;
margin-bottom: 3px;
font-size: 14px;
max-width: 100%;
`
}, [
cE('content', {
raw: `
},
[
cE('content', {
raw: `
text-overflow: ellipsis;
overflow: hidden;`
})
])
]),
cB('base-selection-label', {
raw: `
})
]
)
]
),
cB(
'base-selection-label',
{
raw: `
display: inline-block;
width: 100%;
vertical-align: bottom;
@ -145,16 +166,17 @@ export default c([
box-sizing: border-box;
position: relative;
`,
transition: `
transition: `
color .3s ${cubicBezierEaseInOut},
box-shadow .3s ${cubicBezierEaseInOut},
background-color .3s ${cubicBezierEaseInOut}
`,
borderRadius: borderRadius,
backgroundColor: color
}, [
cE('input', {
raw: `
borderRadius: borderRadius,
backgroundColor: color
},
[
cE('input', {
raw: `
line-height: inherit;
outline: none;
cursor: pointer;
@ -167,119 +189,134 @@ export default c([
padding: ${paddingSingle};
background-color: transparent;
`,
color: textColor,
transition: `color .3s ${cubicBezierEaseInOut}`
}),
cE('placeholder', {
lineHeight: 'inherit',
pointerEvents: 'none',
position: 'absolute',
whiteSpace: 'nowrap',
overflow: 'hidden',
left: 0,
right: 0,
top: 0,
bottom: 0,
padding: '0 26px 0 14px',
color: placeholderColor,
transition: `color .3s ${cubicBezierEaseInOut}`
})
]),
cNotM('disabled', [
cM('focus', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
]),
cM('active', [
cE('box-shadow', {
boxShadow: boxShadowActive
}),
cE('state-border', {
border: borderActive
}),
cB('base-selection-label', {
backgroundColor: colorActive
}),
cB('base-selection-tags', {
backgroundColor: colorActive
}),
cB('base-selection-input-tag', {
display: 'inline-block'
})
]),
cNotM('active', [
cRB('base-selection-label', [
c('&:focus ~', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
]),
c('&:hover ~', [
cE('box-shadow', {
boxShadow: boxShadowHover
}),
cE('state-border', {
border: borderHover
})
])
color: textColor,
transition: `color .3s ${cubicBezierEaseInOut}`
}),
cE('placeholder', {
lineHeight: 'inherit',
pointerEvents: 'none',
position: 'absolute',
whiteSpace: 'nowrap',
overflow: 'hidden',
left: 0,
right: 0,
top: 0,
bottom: 0,
padding: '0 26px 0 14px',
color: placeholderColor,
transition: `color .3s ${cubicBezierEaseInOut}`
})
]
),
cNotM('disabled', [
cM('focus', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
]),
cRB('base-selection-tags', [
c('&:focus ~', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
cM('active', [
cE('box-shadow', {
boxShadow: boxShadowActive
}),
cE('state-border', {
border: borderActive
}),
cB('base-selection-label', {
backgroundColor: colorActive
}),
cB('base-selection-tags', {
backgroundColor: colorActive
}),
cB('base-selection-input-tag', {
display: 'inline-block'
})
]),
cNotM('active', [
cRB('base-selection-label', [
c('&:focus ~', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
]),
c('&:hover ~', [
cE('box-shadow', {
boxShadow: boxShadowHover
}),
cE('state-border', {
border: borderHover
})
])
]),
c('&:hover ~', [
cE('box-shadow', {
boxShadow: boxShadowHover
}),
cE('state-border', {
border: borderHover
})
cRB('base-selection-tags', [
c('&:focus ~', [
cE('box-shadow', {
boxShadow: boxShadowFocus
}),
cE('state-border', {
border: borderFocus
})
]),
c('&:hover ~', [
cE('box-shadow', {
boxShadow: boxShadowHover
}),
cE('state-border', {
border: borderHover
})
])
])
])
])
]),
cM('disabled', {
cursor: 'not-allowed'
}, [
cB('base-selection-label', {
cursor: 'not-allowed',
backgroundColor: colorDisabled
}, [
cE('input', {
cursor: 'not-allowed',
color: textColorDisabled
}, [
cM('placeholder', {
color: placeholderColorDisabled
]),
cM(
'disabled',
{
cursor: 'not-allowed'
},
[
cB(
'base-selection-label',
{
cursor: 'not-allowed',
backgroundColor: colorDisabled
},
[
cE(
'input',
{
cursor: 'not-allowed',
color: textColorDisabled
},
[
cM('placeholder', {
color: placeholderColorDisabled
}),
c('&::placeholder', {
color: placeholderColorDisabled
})
]
)
]
),
cB('base-selection-tags', {
cursor: 'now-allowed',
backgroundColor: colorDisabled
}),
c('&::placeholder', {
cE('placeholder', {
cursor: 'not-allowed',
color: placeholderColorDisabled
})
])
]),
cB('base-selection-tags', {
cursor: 'now-allowed',
backgroundColor: colorDisabled
}),
cE('placeholder', {
cursor: 'not-allowed',
color: placeholderColorDisabled
})
]),
cB('base-selection-input-tag', {
raw: `
]
),
cB(
'base-selection-input-tag',
{
raw: `
outline: none;
display: none;
position: relative;
@ -287,9 +324,10 @@ export default c([
max-width: 100%;
vertical-align: bottom;
`
}, [
cE('input', {
raw: `
},
[
cE('input', {
raw: `
padding: 0;
background-color: transparent;
outline: none;
@ -300,11 +338,11 @@ export default c([
line-height: inherit;
cursor: pointer;
`,
color: textColor,
caretColor
}),
cE('mirror', {
raw: `
color: textColor,
caretColor
}),
cE('mirror', {
raw: `
position: absolute;
padding-right: 1em;
left: 0;
@ -314,47 +352,75 @@ export default c([
user-select: none;
opacity: 0;
`
})
])
])
})
]
)
]
)
},
({ props }) => {
const { $local } = props
return [
'warning',
'error'
].map(status => {
return insideFormItem(status, cTB('base-selection', [
[
cE('state-border', {
border: $local[createKey('border', status)]
}),
cNotM('disabled', [
cM('active', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowActive', status)]
}),
cE('state-border', {
border: $local[createKey('borderActive', status)]
}),
cB('base-selection-label', {
backgroundColor: $local[createKey('colorActive', status)]
}),
cB('base-selection-tags', {
backgroundColor: $local[createKey('boxShadowActive', status)]
})
]),
cNotM('active', [
cRB('base-selection-label', [
c('&:hover ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowHover', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
return ['warning', 'error'].map((status) => {
return insideFormItem(
status,
cTB('base-selection', [
[
cE('state-border', {
border: $local[createKey('border', status)]
}),
cNotM('disabled', [
cM('active', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowActive', status)]
}),
cE('state-border', {
border: $local[createKey('borderActive', status)]
}),
cB('base-selection-label', {
backgroundColor: $local[createKey('colorActive', status)]
}),
cB('base-selection-tags', {
backgroundColor: $local[createKey('boxShadowActive', status)]
})
]),
cNotM('active', [
cRB('base-selection-label', [
c('&:hover ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowHover', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
]),
c('&:focus ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowFocus', status)]
}),
cE('state-border', {
border: $local[createKey('borderFocus', status)]
})
])
]),
c('&:focus ~', [
cRB('base-selection-tags', [
c('&:hover ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowHover', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
]),
c('&:focus ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowFocus', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
])
]),
cM('focus', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowFocus', status)]
}),
@ -362,37 +428,11 @@ export default c([
border: $local[createKey('borderFocus', status)]
})
])
]),
cRB('base-selection-tags', [
c('&:hover ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowHover', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
]),
c('&:focus ~', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowFocus', status)]
}),
cE('state-border', {
border: $local[createKey('borderHover', status)]
})
])
]),
cM('focus', [
cE('box-shadow', {
boxShadow: $local[createKey('boxShadowFocus', status)]
}),
cE('state-border', {
border: $local[createKey('borderFocus', status)]
})
])
])
])
]
]))
]
])
)
})
}
])

56
src/_base/selection/src/styles/themed-size.js
View File

@ -4,36 +4,42 @@ import { formatLength } from '../../../../_utils'
export default c([
({ props }) => {
const {
$vm: {
size
},
$vm: { size },
$local
} = props
const height = $local[createKey('height', size)]
const fontSize = $local[createKey('fontSize', size)]
return cTB('base-selection', [
cM(size + '-size', {
minHeight: height,
lineHeight: height,
fontSize
}, [
cE('placeholder', {
height,
lineHeight: height
}),
cB('base-selection-label', {
height,
lineHeight: height
}),
cB('base-selection-tags', {
minHeight: height
}, [
cB('base-selection-input-tag', {
height: formatLength(height, { c: 1, offset: -6 }),
lineHeight: formatLength(height, { c: 1, offset: -6 })
})
])
])
cM(
size + '-size',
{
minHeight: height,
lineHeight: height,
fontSize
},
[
cE('placeholder', {
height,
lineHeight: height
}),
cB('base-selection-label', {
height,
lineHeight: height
}),
cB(
'base-selection-tags',
{
minHeight: height
},
[
cB('base-selection-input-tag', {
height: formatLength(height, { c: 1, offset: -6 }),
lineHeight: formatLength(height, { c: 1, offset: -6 })
})
]
)
]
)
])
}
])

12
src/_base/selection/styles/dark.js
View File

@ -24,7 +24,9 @@ export default create({
borderActive: `1px solid ${vars.primaryColor}`,
borderFocus: `1px solid ${vars.primaryColorHover}`,
boxShadowHover: null,
boxShadowActive: `0 0 8px 0 ${changeColor(vars.primaryColor, { alpha: 0.4 })}`,
boxShadowActive: `0 0 8px 0 ${changeColor(vars.primaryColor, {
alpha: 0.4
})}`,
boxShadowFocus: null,
caretColor: vars.primaryColor,
// warning
@ -33,7 +35,9 @@ export default create({
borderActiveWarning: `1px solid ${vars.warningColor}`,
borderFocusWarning: `1px solid ${vars.warningColorHover}`,
boxShadowHoverWarning: null,
boxShadowActiveWarning: ` 0 0 8px 0 ${changeColor(vars.warningColor, { alpha: 0.4 })}`,
boxShadowActiveWarning: ` 0 0 8px 0 ${changeColor(vars.warningColor, {
alpha: 0.4
})}`,
boxShadowFocusWarning: null,
colorActiveWarning: changeColor(vars.warningColor, { alpha: 0.1 }),
caretColorWarning: vars.warningColor,
@ -43,7 +47,9 @@ export default create({
borderActiveError: `1px solid ${vars.errorColor}`,
borderFocusError: `1px solid ${vars.errorColorHover}`,
boxShadowHoverError: null,
boxShadowActiveError: `0 0 8px 0 ${changeColor(vars.errorColor, { alpha: 0.4 })}`,
boxShadowActiveError: `0 0 8px 0 ${changeColor(vars.errorColor, {
alpha: 0.4
})}`,
boxShadowFocusError: null,
colorActiveError: changeColor(vars.errorColor, { alpha: 0.1 }),
caretColorError: vars.errorColor

12
src/_base/selection/styles/light.js
View File

@ -24,7 +24,9 @@ export default create({
borderActive: `1px solid ${vars.primaryColor}`,
borderFocus: `1px solid ${vars.primaryColorHover}`,
boxShadowHover: null,
boxShadowActive: `0 0 0 2px ${changeColor(vars.primaryColor, { alpha: 0.2 })}`,
boxShadowActive: `0 0 0 2px ${changeColor(vars.primaryColor, {
alpha: 0.2
})}`,
boxShadowFocus: null,
caretColor: vars.primaryColor,
// warning
@ -33,7 +35,9 @@ export default create({
borderActiveWarning: `1px solid ${vars.warningColor}`,
borderFocusWarning: `1px solid ${vars.warningColorHover}`,
boxShadowHoverWarning: null,
boxShadowActiveWarning: `0 0 0 2px ${changeColor(vars.warningColor, { alpha: 0.2 })}`,
boxShadowActiveWarning: `0 0 0 2px ${changeColor(vars.warningColor, {
alpha: 0.2
})}`,
boxShadowFocusWarning: null,
colorActiveWarning: vars.inputColor,
caretColorWarning: vars.warningColor,
@ -43,7 +47,9 @@ export default create({
borderActiveError: `1px solid ${vars.errorColor}`,
borderFocusError: `1px solid ${vars.errorColorHover}`,
boxShadowHoverError: null,
boxShadowActiveError: `0 0 0 2px ${changeColor(vars.errorColor, { alpha: 0.2 })}`,
boxShadowActiveError: `0 0 0 2px ${changeColor(vars.errorColor, {
alpha: 0.2
})}`,
boxShadowFocusError: null,
colorActiveError: vars.inputColor,
caretColorError: vars.errorColor

19
src/_base/slot-machine/src/SlotMachine.vue
View File

@ -1,8 +1,5 @@
<template>
<span
v-if="valueIsNumber"
class="n-base-slot-machine"
>
<span v-if="valueIsNumber" class="n-base-slot-machine">
<transition-group name="n-fade-up-width-expand-transition" tag="span">
<slot-machine-number
v-for="(number, i) in numbers"
@ -13,16 +10,10 @@
/>
</transition-group>
<n-fade-in-expand-transition key="+" width>
<slot-machine-number
v-if="max && max < value"
:value="'+'"
/>
<slot-machine-number v-if="max && max < value" :value="'+'" />
</n-fade-in-expand-transition>
</span>
<span
v-else
class="n-base-slot-machine"
>
<span v-else class="n-base-slot-machine">
{{ value }}
</span>
</template>
@ -39,9 +30,7 @@ export default {
NFadeInExpandTransition,
SlotMachineNumber
},
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
props: {
theme: {
type: String,

16
src/_base/slot-machine/src/SlotMachineNumber.vue
View File

@ -1,8 +1,5 @@
<template>
<span
ref="numbers"
class="n-base-slot-machine-number"
>
<span ref="numbers" class="n-base-slot-machine-number">
<span
v-if="oldNumber !== null"
class="n-base-slot-machine-old-number n-base-slot-machine-old-number--top"
@ -16,8 +13,7 @@
ref="numberWrapper"
class="n-base-slot-machine-current-number__inner"
:class="{
'n-base-slot-machine-current-number__inner--not-number':
isNotNumber
'n-base-slot-machine-current-number__inner--not-number': isNotNumber
}"
>{{ newNumber }}</span>
</span>
@ -56,10 +52,14 @@ export default {
},
computed: {
newNumberScrollAnimationClass () {
return this.active ? `n-base-slot-machine-current-number--${this.scrollAnimationDirection}-scroll` : null
return this.active
? `n-base-slot-machine-current-number--${this.scrollAnimationDirection}-scroll`
: null
},
oldNumberScrollAnimationClass () {
return this.active ? `n-base-slot-machine-old-number--${this.scrollAnimationDirection}-scroll` : null
return this.active
? `n-base-slot-machine-old-number--${this.scrollAnimationDirection}-scroll`
: null
},
isNotNumber () {
return !(typeof this.value === 'number')

4
src/_base/slot-machine/src/styles/index.js
View File

@ -3,9 +3,7 @@ import baseStyle from './base.cssr.js'
export default [
{
key: 'theme',
watch: [
'theme'
],
watch: ['theme'],
CNode: baseStyle
}
]

16
src/_base/suffix/src/Suffix.vue
View File

@ -45,9 +45,7 @@
import { ChevronDownIcon, DismissCircleIcon } from '../../icons'
import { NIconSwitchTransition } from '../../../_base'
import NBaseLoading from '../../loading'
import {
withCssr
} from '../../../_mixins'
import { withCssr } from '../../../_mixins'
import styles from './styles'
export default {
@ -58,9 +56,7 @@ export default {
NBaseLoading,
NIconSwitchTransition
},
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
inject: {
NFormItem: {
default: null
@ -123,9 +119,7 @@ export default {
},
methods: {
handleClick (e) {
const {
onClear
} = this
const { onClear } = this
if (onClear) onClear(e)
},
handleMouseEnter () {
@ -136,9 +130,7 @@ export default {
},
handleMouseDown (e) {
e.preventDefault()
const {
onMouseDown
} = this
const { onMouseDown } = this
if (onMouseDown) onMouseDown(e)
}
}

4
src/_base/wave/src/Wave.vue
View File

@ -13,9 +13,7 @@ import styles from './styles/index.js'
export default {
name: 'BaseWave',
mixins: [
withCssr(styles)
],
mixins: [withCssr(styles)],
props: {
theme: {
type: String,

9
src/_deprecated/nimbus-icon/src/icons/ban.vue
View File

@ -1,12 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 100 100"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<title>ban</title>
<g
:fill="color"
>
<g :fill="color">
<path
d="M50,0A50,50,0,1,0,85.36,14.64,50,50,0,0,0,50,0Zm0,89.58A39.59,39.59,0,0,1,18.19,26.44L73.56,81.81A39.41,39.41,0,0,1,50,89.58Zm31.81-16L26.44,18.19A39.59,39.59,0,0,1,81.81,73.56Z"
/>

5
src/_deprecated/nimbus-icon/src/icons/close.vue
View File

@ -1,8 +1,5 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 99.9 99.9"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99.9 99.9">
<title>close</title>
<g>
<path

16
src/_deprecated/nimbus-icon/src/icons/edit.vue
View File

@ -1,13 +1,13 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 94.97 93.6"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 94.97 93.6">
<title>apply</title>
<g
:fill="color"
>
<path d="M75.8,83.3H10.3V20.5h36L56.5,10.3H7a7,7,0,0,0-7,7.1V86.5a7,7,0,0,0,7,7.1H79a7,7,0,0,0,7-7.1V37.2L75.8,47.3Z" /><path d="M94.3,12,83.1.7A2.61,2.61,0,0,0,81.4,0a2.84,2.84,0,0,0-1.7.7l-42,41.9a2.09,2.09,0,0,0-.7,1.3L34.5,57.6a2.29,2.29,0,0,0,.7,2.1,3.15,3.15,0,0,0,1.5.8,1.27,1.27,0,0,0,.6-.1l13.8-2.5a1.85,1.85,0,0,0,1.2-.7l42-41.9A2.35,2.35,0,0,0,94.3,12Z" />
<g :fill="color">
<path
d="M75.8,83.3H10.3V20.5h36L56.5,10.3H7a7,7,0,0,0-7,7.1V86.5a7,7,0,0,0,7,7.1H79a7,7,0,0,0,7-7.1V37.2L75.8,47.3Z"
/>
<path
d="M94.3,12,83.1.7A2.61,2.61,0,0,0,81.4,0a2.84,2.84,0,0,0-1.7.7l-42,41.9a2.09,2.09,0,0,0-.7,1.3L34.5,57.6a2.29,2.29,0,0,0,.7,2.1,3.15,3.15,0,0,0,1.5.8,1.27,1.27,0,0,0,.6-.1l13.8-2.5a1.85,1.85,0,0,0,1.2-.7l42-41.9A2.35,2.35,0,0,0,94.3,12Z"
/>
</g>
</svg>
</template>

17
src/_deprecated/nimbus-icon/src/icons/operate.vue
View File

@ -1,12 +1,13 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 100 99.14"
><title>operate</title>
<g
:fill="color"
>
<path d="M98.34,4.31,95.69,1.66a5.69,5.69,0,0,0-8,0l-35.38,37c-.1.1-.17.2-.27.31A16,16,0,0,0,29.46,55.38l11.08-8a4.27,4.27,0,0,1,5.94,1l4.14,5.78a4.26,4.26,0,0,1-1,5.93L38.55,68.08a16,16,0,0,0,22-19.68,8,8,0,0,0,.76-.68l37-35.38A5.69,5.69,0,0,0,98.34,4.31ZM93.6,11.47a3.58,3.58,0,1,1,0-5.06A3.6,3.6,0,0,1,93.6,11.47Z" /><path d="M41.4,99.14H54.74l1.13-9.4a39.13,39.13,0,0,0,14-5.81l7.46,5.85,9.44-9.43-5.86-7.46a39.21,39.21,0,0,0,5.81-14l9.41-1.13V44.4l-9.41-1.13a39,39,0,0,0-3.32-9.68L73.29,42.8A26.66,26.66,0,1,1,56.94,26.07l8.13-10.59a39.34,39.34,0,0,0-9.2-3.07L54.74,3H41.4l-1.14,9.4a39.21,39.21,0,0,0-14,5.81L18.8,12.37,9.36,21.8l5.85,7.46a39.31,39.31,0,0,0-5.81,14L0,44.4V57.75l9.4,1.13a39.39,39.39,0,0,0,5.81,14L9.36,80.35l9.44,9.43,7.45-5.85a39.21,39.21,0,0,0,14,5.81Z" />
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 99.14">
<title>operate</title>
<g :fill="color">
<path
d="M98.34,4.31,95.69,1.66a5.69,5.69,0,0,0-8,0l-35.38,37c-.1.1-.17.2-.27.31A16,16,0,0,0,29.46,55.38l11.08-8a4.27,4.27,0,0,1,5.94,1l4.14,5.78a4.26,4.26,0,0,1-1,5.93L38.55,68.08a16,16,0,0,0,22-19.68,8,8,0,0,0,.76-.68l37-35.38A5.69,5.69,0,0,0,98.34,4.31ZM93.6,11.47a3.58,3.58,0,1,1,0-5.06A3.6,3.6,0,0,1,93.6,11.47Z"
/>
<path
d="M41.4,99.14H54.74l1.13-9.4a39.13,39.13,0,0,0,14-5.81l7.46,5.85,9.44-9.43-5.86-7.46a39.21,39.21,0,0,0,5.81-14l9.41-1.13V44.4l-9.41-1.13a39,39,0,0,0-3.32-9.68L73.29,42.8A26.66,26.66,0,1,1,56.94,26.07l8.13-10.59a39.34,39.34,0,0,0-9.2-3.07L54.74,3H41.4l-1.14,9.4a39.21,39.21,0,0,0-14,5.81L18.8,12.37,9.36,21.8l5.85,7.46a39.31,39.31,0,0,0-5.81,14L0,44.4V57.75l9.4,1.13a39.39,39.39,0,0,0,5.81,14L9.36,80.35l9.44,9.43,7.45-5.85a39.21,39.21,0,0,0,14,5.81Z"
/>
</g>
</svg>
</template>

9
src/_deprecated/nimbus-icon/src/icons/pullRequest.vue
View File

@ -1,12 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<title>pull-request</title>
<g
:fill="color"
>
<g :fill="color">
<path
d="M4.38,13.45V6.55A3.37,3.37,0,0,0,7,3.33,3.42,3.42,0,0,0,3.5,0,3.42,3.42,0,0,0,0,3.33,3.37,3.37,0,0,0,2.62,6.55v6.9A3.37,3.37,0,0,0,0,16.67,3.42,3.42,0,0,0,3.5,20,3.42,3.42,0,0,0,7,16.67,3.37,3.37,0,0,0,4.38,13.45ZM1.75,3.33A1.7,1.7,0,0,1,3.5,1.67,1.7,1.7,0,0,1,5.25,3.33,1.71,1.71,0,0,1,3.5,5,1.71,1.71,0,0,1,1.75,3.33Zm1.75,15A1.67,1.67,0,1,1,3.5,15a1.67,1.67,0,1,1,0,3.33Z"
/>

9
src/_deprecated/nimbus-icon/src/icons/share.vue
View File

@ -1,12 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 16"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<title>share</title>
<g
:fill="color"
>
<g :fill="color">
<path
d="M2.94,16h8.12A2.93,2.93,0,0,0,14,13.06v-5a.66.66,0,0,0-.68-.68h0a.66.66,0,0,0-.67.68v5a1.58,1.58,0,0,1-1.59,1.59H2.94a1.58,1.58,0,0,1-1.59-1.59V4.94A1.58,1.58,0,0,1,2.94,3.35h5a.66.66,0,0,0,.68-.67A.66.66,0,0,0,7.9,2h-5A2.93,2.93,0,0,0,0,4.94H0v8.12A2.93,2.93,0,0,0,2.94,16Z"
/>

29
src/_deprecated/nimbus-icon/src/main.vue
View File

@ -1,35 +1,20 @@
<template>
<i
:class="`n-nimbus-icon n-nimbus-icon-${type}`"
:style="styles"
>
<share-icon
v-if="type==='share'"
:style="iconStyle"
:color="color"
/>
<ban-icon
v-else-if="type==='ban'"
:style="iconStyle"
:color="color"
/>
<i :class="`n-nimbus-icon n-nimbus-icon-${type}`" :style="styles">
<share-icon v-if="type === 'share'" :style="iconStyle" :color="color" />
<ban-icon v-else-if="type === 'ban'" :style="iconStyle" :color="color" />
<pull-request-icon
v-else-if="type==='pull-request'"
v-else-if="type === 'pull-request'"
:style="iconStyle"
:color="color"
/>
<operate-icon
v-else-if="type==='operate'"
:style="iconStyle"
:color="color"
/>
<edit-icon
v-else-if="type==='edit'"
v-else-if="type === 'operate'"
:style="iconStyle"
:color="color"
/>
<edit-icon v-else-if="type === 'edit'" :style="iconStyle" :color="color" />
<close-icon
v-else-if="type==='close'"
v-else-if="type === 'close'"
:style="iconStyle"
:color="color"
/>

79
src/_deprecated/nimbus-service-layout/src/ServiceLayout.js
View File

@ -9,9 +9,7 @@ import { useMergedState } from 'vooks'
export default {
name: 'ServiceLayout',
alias: [
'NimbusServiceLayout'
],
alias: ['NimbusServiceLayout'],
provide () {
return {
ServiceLayout: this
@ -67,7 +65,10 @@ export default {
setup (props) {
const uncontrolledValueRef = ref(null)
const controlledValueRef = toRef(props, 'value')
const mergedValueRef = useMergedState(controlledValueRef, uncontrolledValueRef)
const mergedValueRef = useMergedState(
controlledValueRef,
uncontrolledValueRef
)
const uncontrolledCollapsedRef = ref(false)
return {
mergedValue: mergedValueRef,
@ -90,11 +91,7 @@ export default {
this.uncontrolledCollapsed = value
},
doUpdateValue (value) {
const {
onInput,
onSelect,
'onUpdate:value': onUpdateValue
} = this
const { onInput, onSelect, 'onUpdate:value': onUpdateValue } = this
this.uncontrolledValue = value
if (onSelect) onSelect(value)
if (onInput) onInput(value)
@ -170,34 +167,46 @@ export default {
bordered: true
}
const navSlot = this.$slots.nav
return h(NLayout, {
position: 'absolute'
}, {
default: () => [
navSlot ? h(NLayoutHeader, headerProps, navSlot()) : null,
h(NLayout, {
style: {
top: navSlot ? '64px' : null
},
position: 'absolute'
}, {
default: () => [
h(NLayoutSider, siderProps, {
return h(
NLayout,
{
position: 'absolute'
},
{
default: () => [
navSlot ? h(NLayoutHeader, headerProps, navSlot()) : null,
h(
NLayout,
{
style: {
top: navSlot ? '64px' : null
},
position: 'absolute'
},
{
default: () => [
h(SiderHeader, {
name: this.name
}, {
icon: this.$slots['drawer-header-icon']
h(NLayoutSider, siderProps, {
default: () => [
h(
SiderHeader,
{
name: this.name
},
{
icon: this.$slots['drawer-header-icon']
}
),
h(SiderMenu)
]
}),
h(SiderMenu)
h(NLayout, contentProps, {
default: this.$slots.default
})
]
}),
h(NLayout, contentProps, {
default: this.$slots.default
})
]
})
]
})
}
)
]
}
)
}
}

74
src/_deprecated/nimbus-service-layout/src/SiderHeader.js
View File

@ -10,39 +10,49 @@ export default {
}
},
render () {
return this.name ? [
h('div', {
style: {
alignItems: 'center',
height: '64px',
paddingLeft: '36px',
fontSize: '16px',
fontWeight: '500',
display: 'flex',
position: 'relative'
}
}, [
this.$slots.icon
? h(NIcon, {
size: 20,
return this.name
? [
h(
'div',
{
style: {
position: 'absolute',
left: '10px',
top: '50%',
transform: 'translateY(-50%)'
alignItems: 'center',
height: '64px',
paddingLeft: '36px',
fontSize: '16px',
fontWeight: '500',
display: 'flex',
position: 'relative'
}
}, {
default: this.$slots.icon
})
: null,
h('span', [this.name])
]),
h(NDivider, {
style: {
margin: '0',
padding: '0 8px'
}
})
] : null
},
[
this.$slots.icon
? h(
NIcon,
{
size: 20,
style: {
position: 'absolute',
left: '10px',
top: '50%',
transform: 'translateY(-50%)'
}
},
{
default: this.$slots.icon
}
)
: null,
h('span', [this.name])
]
),
h(NDivider, {
style: {
margin: '0',
padding: '0 8px'
}
})
]
: null
}
}

36
src/_deprecated/nimbus-service-layout/src/SiderMenu.js
View File

@ -3,15 +3,11 @@ import { h } from 'vue'
export default {
name: 'ServiceLayoutSider',
inject: [
'ServiceLayout'
],
inject: ['ServiceLayout'],
methods: {
handleMenuUpdateValue (value, item) {
if (this.$router && item.path) {
Promise.resolve(
this.$router.push(item.path)
).catch(err => {
Promise.resolve(this.$router.push(item.path)).catch((err) => {
console.log(err)
})
}
@ -21,15 +17,17 @@ export default {
computed: {
items () {
function createItems (items) {
return items.map(item => {
const isGroup = (item.group || item.type === 'group')
return items.map((item) => {
const isGroup = item.group || item.type === 'group'
return {
path: item.path,
title: item.title || item.name,
extra: item.extra || item.titleExtra,
key: item.name,
disabled: item.disabled,
children: item.childItems ? createItems(item.childItems) : undefined,
children: item.childItems
? createItems(item.childItems)
: undefined,
type: isGroup ? 'group' : undefined
}
})
@ -39,16 +37,14 @@ export default {
},
render () {
const { ServiceLayout, items } = this
return h(NMenu,
{
value: ServiceLayout.mergedValue,
defaultExpandAll: true,
rootIndent: 36,
indent: 40,
items,
'onUpdate:expandedKeys': ServiceLayout.onExpandedNamesChange,
'onUpdate:value': this.handleMenuUpdateValue
}
)
return h(NMenu, {
value: ServiceLayout.mergedValue,
defaultExpandAll: true,
rootIndent: 36,
indent: 40,
items,
'onUpdate:expandedKeys': ServiceLayout.onExpandedNamesChange,
'onUpdate:value': this.handleMenuUpdateValue
})
}
}

26
src/_mixins/as-form-item.js
View File

@ -1,8 +1,5 @@
export default function (options = {}) {
const {
defaultSize = 'medium',
mergedSize
} = options
const { defaultSize = 'medium', mergedSize } = options
return {
provide: {
NFormItem: null
@ -13,18 +10,17 @@ export default function (options = {}) {
}
},
computed: {
mergedSize: mergedSize || function () {
const size = this.size
if (size) return size
const NFormItem = this.NFormItem
if (
NFormItem &&
NFormItem.mergedSize
) {
return NFormItem.mergedSize
mergedSize:
mergedSize ||
function () {
const size = this.size
if (size) return size
const NFormItem = this.NFormItem
if (NFormItem && NFormItem.mergedSize) {
return NFormItem.mergedSize
}
return defaultSize
}
return defaultSize
}
},
beforeUnmount () {
const { NFormItem } = this

4
src/_mixins/configurable.js
View File

@ -9,9 +9,7 @@ export default {
const { bordered } = this
if (bordered !== undefined) return bordered
const {
NConfigProvider: {
bordered: inheritedBordered
}
NConfigProvider: { bordered: inheritedBordered }
} = this
if (inheritedBordered !== undefined) return inheritedBordered
return true

14
src/_mixins/registerable.js
View File

@ -1,8 +1,4 @@
export default function (
injectionName,
collectionKey,
registerKey = 'value'
) {
export default function (injectionName, collectionKey, registerKey = 'value') {
return {
watch: {
[registerKey]: function (value, oldValue) {
@ -25,12 +21,16 @@ export default function (
},
removeInstance (collection, key) {
if (!collection[key]) collection[key] = []
const indexOfInstance = collection[key].findIndex(instance => instance === this)
const indexOfInstance = collection[key].findIndex(
(instance) => instance === this
)
if (~indexOfInstance) collection[key].splice(indexOfInstance, 1)
},
addInstance (collection, key) {
if (!collection[key]) collection[key] = []
const indexOfInstance = collection[key].findIndex(instance => instance === this)
const indexOfInstance = collection[key].findIndex(
(instance) => instance === this
)
if (!~indexOfInstance) collection[key].push(this)
}
}

16
src/_mixins/themeable.js
View File

@ -23,9 +23,7 @@ export default {
mergedStyle () {
const { themedStyle } = this
if (themedStyle) {
const {
mergedTheme
} = this
const { mergedTheme } = this
return themedStyle[mergedTheme || fallbackTheme]
}
return null
@ -33,14 +31,12 @@ export default {
mergedThemeEnvironment () {
const { NConfigProvider } = this
if (NConfigProvider) {
const {
inheritedThemeEnvironments
} = NConfigProvider
const { inheritedThemeEnvironments } = NConfigProvider
if (inheritedThemeEnvironments) {
const {
mergedTheme
} = this
return inheritedThemeEnvironments[mergedTheme || fallbackTheme] || null
const { mergedTheme } = this
return (
inheritedThemeEnvironments[mergedTheme || fallbackTheme] || null
)
}
}
return null

12
src/_mixins/use-as-form-item.js
View File

@ -1,20 +1,14 @@
import { computed, inject, provide, onBeforeUnmount } from 'vue'
export default function useFormItem (props, options = {}) {
const {
defaultSize = 'medium'
} = options
const { defaultSize = 'medium' } = options
const NFormItem = inject('NFormItem', null)
provide('NFormItem', null)
const mergedSizeRef = computed(() => {
const {
size
} = props
const { size } = props
if (size) return size
if (NFormItem) {
const {
mergedSize
} = NFormItem
const { mergedSize } = NFormItem
if (mergedSize) {
return mergedSize
}

135
src/_mixins/with-cssr.js
View File

@ -13,9 +13,7 @@ function getRenderedTheme (vm) {
function getGlobalVars (styles, theme) {
const {
[theme]: {
base
}
[theme]: { base }
} = styles
return base.getGlobalVars() // style[theme].base, for example style.light.base
}
@ -34,52 +32,39 @@ function createMutableStyleId (
depKey,
depValue
) {
if (
depKey === 'mergedTheme' ||
depKey === 'theme'
) {
if (depKey === 'mergedTheme' || depKey === 'theme') {
return componentCssrId + '-' + renderedTheme
}
return (
componentCssrId + '-' +
renderedTheme + '-' +
depKey + (depValue ? ('-' + depValue) : '')
componentCssrId +
'-' +
renderedTheme +
'-' +
depKey +
(depValue ? '-' + depValue : '')
)
}
function setupMutableStyle (
vm,
theme,
depKey,
CNode
) {
function setupMutableStyle (vm, theme, depKey, CNode) {
const {
$naive: {
styles
},
$naive: { styles },
$options: options
} = vm
const resolveId = options.cssrName || options.name
const mountPrefix = options.cssrId || resolveId
const depValue = (
depKey === 'mergedTheme' ||
depKey === 'theme'
) ? theme : vm[depKey]
if (
depValue === null || depValue === undefined
) {
const depValue =
depKey === 'mergedTheme' || depKey === 'theme' ? theme : vm[depKey]
if (depValue === null || depValue === undefined) {
if (__DEV__) {
warn('mixins/with-cssr', `dependency key ${resolveId}.${depKey} should not be nullable`)
warn(
'mixins/with-cssr',
`dependency key ${resolveId}.${depKey} should not be nullable`
)
}
return
}
// create mount id
const mountId = createMutableStyleId(
mountPrefix,
theme,
depKey,
depValue
)
const mountId = createMutableStyleId(mountPrefix, theme, depKey, depValue)
if (find(mountId)) return
// get global style
const globalVars = getGlobalVars(styles, theme)
@ -87,12 +72,7 @@ function setupMutableStyle (
const localStyle = getLocalStyle(styles, theme, resolveId)
const localVars = getLocalVars(localStyle, globalVars)
// get cssr props
const cssrProps = createCssrProps(
vm,
theme,
globalVars,
localVars
)
const cssrProps = createCssrProps(vm, theme, globalVars, localVars)
// mount the style
CNode.mount({
target: mountId,
@ -101,12 +81,7 @@ function setupMutableStyle (
})
}
function createCssrProps (
vm,
theme,
globalVars,
localVars
) {
function createCssrProps (vm, theme, globalVars, localVars) {
return {
$vm: vm,
$theme: theme,
@ -117,37 +92,24 @@ function createCssrProps (
function getCssrProps (vm, theme) {
const {
$naive: {
styles
},
$naive: { styles },
$options: options
} = vm
const resolveId = options.cssrName || options.name
const globalVars = getGlobalVars(styles, theme)
const localStyle = getLocalStyle(styles, theme, resolveId)
const localVars = getLocalVars(localStyle, globalVars)
return createCssrProps(
vm,
theme,
globalVars,
localVars
)
return createCssrProps(vm, theme, globalVars, localVars)
}
const withCssr = function (styles = [], options = {}) {
let data
// collect watchers
const watchers = {}
const {
themeKey,
injectCssrProps
} = options
if (
themeKey &&
injectCssrProps
) {
const { themeKey, injectCssrProps } = options
if (themeKey && injectCssrProps) {
watchers[themeKey] = [
vm => {
(vm) => {
vm.cssrProps = getCssrProps(vm, vm[themeKey])
}
]
@ -157,48 +119,37 @@ const withCssr = function (styles = [], options = {}) {
}
}
}
styles.forEach(style => {
styles.forEach((style) => {
if (__DEV__ && !style.watch) {
warn('with-cssr', 'Style option has no `watch` field.')
return
}
style.watch.forEach(watchKey => {
style.watch.forEach((watchKey) => {
if (!watchers[watchKey]) watchers[watchKey] = []
watchers[watchKey].push(
function (vm, mergedTheme) {
if (__DEV__) {
window.naive.styleRenderingDuration -= performance.now()
}
setupMutableStyle(
vm,
mergedTheme,
style.key,
style.CNode
)
if (__DEV__) {
window.naive.styleRenderingDuration += performance.now()
}
watchers[watchKey].push(function (vm, mergedTheme) {
if (__DEV__) {
window.naive.styleRenderingDuration -= performance.now()
}
)
setupMutableStyle(vm, mergedTheme, style.key, style.CNode)
if (__DEV__) {
window.naive.styleRenderingDuration += performance.now()
}
})
})
})
// create component watch options
const watchOptions = {}
Object
.keys(watchers)
.forEach(
watchKey => {
watchOptions[watchKey] = function () {
watchers[watchKey].forEach(watcher => {
watcher(this, getRenderedTheme(this))
})
}
}
)
Object.keys(watchers).forEach((watchKey) => {
watchOptions[watchKey] = function () {
watchers[watchKey].forEach((watcher) => {
watcher(this, getRenderedTheme(this))
})
}
})
return {
data,
beforeMount () {
styles.forEach(style => {
styles.forEach((style) => {
if (__DEV__) {
window.naive.styleRenderingDuration -= performance.now()
}

3
src/_styles/base/_common.js
View File

@ -1,5 +1,6 @@
export default {
fontFamily: 'v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontFamily:
'v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontFamilyMono: 'v-mono, SFMono-Regular, Menlo, Consolas, Courier, monospace',
fontWeight: '400',

126
src/_styles/base/dark.js
View File

@ -6,80 +6,86 @@ export default create({
theme: 'dark',
name: 'base',
getBaseVars () {
return Object.assign({
neutralBase: '#000',
neutralInvertBase: '#fff',
neutralTextBase: '#fff',
neutralPopover: 'rgb(72, 72, 78)',
neutralCard: 'rgb(24, 24, 28)',
neutralModal: 'rgb(44, 44, 50)',
neutralBody: 'rgb(16, 16, 20)',
return Object.assign(
{
neutralBase: '#000',
neutralInvertBase: '#fff',
neutralTextBase: '#fff',
neutralPopover: 'rgb(72, 72, 78)',
neutralCard: 'rgb(24, 24, 28)',
neutralModal: 'rgb(44, 44, 50)',
neutralBody: 'rgb(16, 16, 20)',
alpha1: '0.9',
alpha2: '0.82',
alpha3: '0.52',
alpha4: '0.38',
alpha5: '0.28',
alpha1: '0.9',
alpha2: '0.82',
alpha3: '0.52',
alpha4: '0.38',
alpha5: '0.28',
alphaClose: '0.52',
alphaClose: '0.52',
alphaDisabled: '0.6',
alphaDisabledInput: '0.06',
alphaPending: '0.09',
alphaTablePending: '0.06',
alphaActive: '0.03',
alphaDisabled: '0.6',
alphaDisabledInput: '0.06',
alphaPending: '0.09',
alphaTablePending: '0.06',
alphaActive: '0.03',
alphaAvatar: '0.18',
alphaRail: '0.2',
alphaProgressRail: '0.12',
alphaBorder: '0.24',
alphaDivider: '0.09',
alphaInput: '0.1',
alphaAction: '0.06',
alphaTab: '0.1',
alphaScrollbar: '0.2',
alphaScrollbarHover: '0.3',
alphaCode: '0.12',
alphaTag: '0',
alphaAvatar: '0.18',
alphaRail: '0.2',
alphaProgressRail: '0.12',
alphaBorder: '0.24',
alphaDivider: '0.09',
alphaInput: '0.1',
alphaAction: '0.06',
alphaTab: '0.1',
alphaScrollbar: '0.2',
alphaScrollbarHover: '0.3',
alphaCode: '0.12',
alphaTag: '0',
// primary
primaryHover: '#7fe7c4',
primaryDefault: '#63e2b7',
primaryActive: '#5acea7',
primarySuppl: 'rgb(42, 148, 125)',
// primary
primaryHover: '#7fe7c4',
primaryDefault: '#63e2b7',
primaryActive: '#5acea7',
primarySuppl: 'rgb(42, 148, 125)',
// info
infoHover: '#8acbec',
infoDefault: '#70c0e8',
infoActive: '#66afd3',
infoSuppl: 'rgb(56, 137, 197)',
// info
infoHover: '#8acbec',
infoDefault: '#70c0e8',
infoActive: '#66afd3',
infoSuppl: 'rgb(56, 137, 197)',
// error
errorHover: '#e98b8b',
errorDefault: '#e88080',
errorActive: '#e57272',
errorSuppl: 'rgb(208, 58, 82)',
// error
errorHover: '#e98b8b',
errorDefault: '#e88080',
errorActive: '#e57272',
errorSuppl: 'rgb(208, 58, 82)',
// warning
warningHover: '#f5d599',
warningDefault: '#f2c97d',
warningActive: '#e6c260',
warningSuppl: 'rgb(240, 138, 0)',
// warning
warningHover: '#f5d599',
warningDefault: '#f2c97d',
warningActive: '#e6c260',
warningSuppl: 'rgb(240, 138, 0)',
// success
successHover: '#7fe7c4',
successDefault: '#63e2b7',
successActive: '#5acea7',
successSuppl: 'rgb(42, 148, 125)',
// success
successHover: '#7fe7c4',
successDefault: '#63e2b7',
successActive: '#5acea7',
successSuppl: 'rgb(42, 148, 125)',
boxShadow2: '0 3px 6px -4px rgba(0, 0, 0, .16), 0 6px 12px 0 rgba(0, 0, 0, .08), 0 9px 18px 8px rgba(0, 0, 0, .04)',
boxShadow3: '0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03)'
}, commonVariables)
boxShadow2:
'0 3px 6px -4px rgba(0, 0, 0, .16), 0 6px 12px 0 rgba(0, 0, 0, .08), 0 9px 18px 8px rgba(0, 0, 0, .04)',
boxShadow3:
'0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03)'
},
commonVariables
)
},
getDerivedVars (base) {
const baseBackgroundRgb = rgba(base.neutralBase)
const baseInvertBackgroundRgb = rgba(base.neutralInvertBase)
const overlayPrefix = 'rgba(' + baseInvertBackgroundRgb.slice(0, 3).join(', ') + ', '
const overlayPrefix =
'rgba(' + baseInvertBackgroundRgb.slice(0, 3).join(', ') + ', '
function overlay (alpha) {
return overlayPrefix + String(alpha) + ')'
}

128
src/_styles/base/light.js
View File

@ -6,81 +6,87 @@ export default create({
theme: 'light',
name: 'base',
getBaseVars () {
return Object.assign({
neutralBase: '#FFF',
neutralInvertBase: '#000',
neutralTextBase: '#000',
neutralPopover: '#fff',
neutralCard: '#fff',
neutralModal: '#fff',
neutralBody: '#fff',
return Object.assign(
{
neutralBase: '#FFF',
neutralInvertBase: '#000',
neutralTextBase: '#000',
neutralPopover: '#fff',
neutralCard: '#fff',
neutralModal: '#fff',
neutralBody: '#fff',
alpha1: '0.82',
alpha2: '0.72',
alpha3: '0.38',
alpha4: '0.24', // disabled text, placeholder, icon
alpha5: '0.18', // disabled placeholder
alpha1: '0.82',
alpha2: '0.72',
alpha3: '0.38',
alpha4: '0.24', // disabled text, placeholder, icon
alpha5: '0.18', // disabled placeholder
alphaClose: '0.52',
alphaClose: '0.52',
alphaDisabled: '0.5',
alphaDisabledInput: '0.02',
alphaPending: '0.04',
alphaTablePending: '0.02',
alphaActive: '0.06',
alphaDisabled: '0.5',
alphaDisabledInput: '0.02',
alphaPending: '0.04',
alphaTablePending: '0.02',
alphaActive: '0.06',
alphaAvatar: '0.2',
alphaRail: '0.14',
alphaProgressRail: '.08',
alphaBorder: '0.12',
alphaDivider: '0.06',
alphaInput: '0',
alphaAction: '0.02',
alphaTab: '0.04',
alphaScrollbar: '0.25',
alphaScrollbarHover: '0.4',
alphaCode: '0.05',
alphaTag: '0.02',
alphaAvatar: '0.2',
alphaRail: '0.14',
alphaProgressRail: '.08',
alphaBorder: '0.12',
alphaDivider: '0.06',
alphaInput: '0',
alphaAction: '0.02',
alphaTab: '0.04',
alphaScrollbar: '0.25',
alphaScrollbarHover: '0.4',
alphaCode: '0.05',
alphaTag: '0.02',
// primary
primaryHover: '#36ad6a',
primaryDefault: '#18a058',
primaryActive: '#0c7a43',
primarySuppl: '#36ad6a',
// primary
primaryHover: '#36ad6a',
primaryDefault: '#18a058',
primaryActive: '#0c7a43',
primarySuppl: '#36ad6a',
// info
infoHover: '#4098fc',
infoDefault: '#2080f0',
infoActive: '#1060c9',
infoSuppl: '#4098fc',
// info
infoHover: '#4098fc',
infoDefault: '#2080f0',
infoActive: '#1060c9',
infoSuppl: '#4098fc',
// error
errorHover: '#de576d',
errorDefault: '#d03050',
errorActive: '#ab1f3f',
errorSuppl: '#de576d',
// error
errorHover: '#de576d',
errorDefault: '#d03050',
errorActive: '#ab1f3f',
errorSuppl: '#de576d',
// warning
warningHover: '#fcb040',
warningDefault: '#f0a020',
warningActive: '#c97c10',
warningSuppl: '#fcb040',
// warning
warningHover: '#fcb040',
warningDefault: '#f0a020',
warningActive: '#c97c10',
warningSuppl: '#fcb040',
// success
successHover: '#36ad6a',
successDefault: '#18a058',
successActive: '#0c7a43',
successSuppl: '#36ad6a',
// success
successHover: '#36ad6a',
successDefault: '#18a058',
successActive: '#0c7a43',
successSuppl: '#36ad6a',
boxShadow1: '',
boxShadow2: '0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05)',
boxShadow3: '0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03)'
}, commonVariables)
boxShadow1: '',
boxShadow2:
'0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05)',
boxShadow3:
'0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03)'
},
commonVariables
)
},
getDerivedVars (base) {
const baseBackgroundRgb = rgba(base.neutralBase)
const baseInvertBackgroundRgb = rgba(base.neutralInvertBase)
const overlayPrefix = 'rgba(' + baseInvertBackgroundRgb.slice(0, 3).join(', ') + ', '
const overlayPrefix =
'rgba(' + baseInvertBackgroundRgb.slice(0, 3).join(', ') + ', '
function overlay (alpha) {
return overlayPrefix + String(alpha) + ')'
}

4
src/_styles/index.js
View File

@ -1,3 +1 @@
export {
default as globalStyle
} from './global/index.cssr.js'
export { default as globalStyle } from './global/index.cssr.js'

26
src/_styles/transitions/fade-down.js
View File

@ -1,9 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseInOut
} = commonVariables
const { cubicBezierEaseInOut } = commonVariables
export default function (options = {}) {
const {
@ -15,14 +13,20 @@ export default function (options = {}) {
leaveCubicBezier = cubicBezierEaseInOut
} = options
return [
c(`&.${namespace}-${name}-transition-enter-from, &.${namespace}-${name}-transition-leave-to`, {
opacity: 0,
transform: `translateY(${fromOffset})`
}),
c(`&.${namespace}-${name}-transition-enter-to, &.${namespace}-${name}-transition-leave-from`, {
opacity: 1,
transform: 'translateY(0)'
}),
c(
`&.${namespace}-${name}-transition-enter-from, &.${namespace}-${name}-transition-leave-to`,
{
opacity: 0,
transform: `translateY(${fromOffset})`
}
),
c(
`&.${namespace}-${name}-transition-enter-to, &.${namespace}-${name}-transition-leave-from`,
{
opacity: 1,
transform: 'translateY(0)'
}
),
c(`&.${namespace}-${name}-transition-leave-active`, {
transition: `opacity ${leaveDuration} ${leaveCubicBezier}, transform ${leaveDuration} ${leaveCubicBezier}`
}),

30
src/_styles/transitions/fade-in-height-expand.js
View File

@ -18,18 +18,24 @@ export default function (options = {}) {
leaveToProps = null
} = options
return [
c(`&.${namespace}-fade-in-height-expand-transition-leave-from, &.${namespace}-fade-in-height-expand-transition-enter-to`, {
...enterToProps,
opacity: 1
}),
c(`&.${namespace}-fade-in-height-expand-transition-leave-to, &.${namespace}-fade-in-height-expand-transition-enter-from`, {
...leaveToProps,
opacity: 0,
marginTop: '0 !important',
marginBottom: '0 !important',
paddingTop: foldPadding ? '0 !important' : null,
paddingBottom: foldPadding ? '0 !important' : null
}),
c(
`&.${namespace}-fade-in-height-expand-transition-leave-from, &.${namespace}-fade-in-height-expand-transition-enter-to`,
{
...enterToProps,
opacity: 1
}
),
c(
`&.${namespace}-fade-in-height-expand-transition-leave-to, &.${namespace}-fade-in-height-expand-transition-enter-from`,
{
...leaveToProps,
opacity: 0,
marginTop: '0 !important',
marginBottom: '0 !important',
paddingTop: foldPadding ? '0 !important' : null,
paddingBottom: foldPadding ? '0 !important' : null
}
),
c(`&.${namespace}-fade-in-height-expand-transition-leave-active`, {
raw: `
overflow: ${overflow};

30
src/_styles/transitions/fade-in-scale-up.js
View File

@ -18,19 +18,29 @@ export default function (options = {}) {
return [
c(`&.${namespace}-fade-in-scale-up-transition-leave-active`, {
transformOrigin,
transition: `opacity ${duration} ${cubicBezierEaseIn}, transform ${duration} ${cubicBezierEaseIn} ${originalTransition && ',' + originalTransition}`
transition: `opacity ${duration} ${cubicBezierEaseIn}, transform ${duration} ${cubicBezierEaseIn} ${
originalTransition && ',' + originalTransition
}`
}),
c(`&.${namespace}-fade-in-scale-up-transition-enter-active`, {
transformOrigin,
transition: `opacity ${duration} ${cubicBezierEaseOut}, transform ${duration} ${cubicBezierEaseOut} ${originalTransition && ',' + originalTransition}`
transition: `opacity ${duration} ${cubicBezierEaseOut}, transform ${duration} ${cubicBezierEaseOut} ${
originalTransition && ',' + originalTransition
}`
}),
c(`&.${namespace}-fade-in-scale-up-transition-enter-from, &.${namespace}-fade-in-scale-up-transition-leave-to`, {
opacity: 0,
transform: `scale(${enterScale}) ${originalTransform}`
}),
c(`&.${namespace}-fade-in-scale-up-transition-leave-from, &.${namespace}-fade-in-scale-up-transition-enter-to`, {
opacity: 1,
transform: `scale(${transformDebounceScale}) ${originalTransform}`
})
c(
`&.${namespace}-fade-in-scale-up-transition-enter-from, &.${namespace}-fade-in-scale-up-transition-leave-to`,
{
opacity: 0,
transform: `scale(${enterScale}) ${originalTransform}`
}
),
c(
`&.${namespace}-fade-in-scale-up-transition-leave-from, &.${namespace}-fade-in-scale-up-transition-enter-to`,
{
opacity: 1,
transform: `scale(${transformDebounceScale}) ${originalTransform}`
}
)
]
}

27
src/_styles/transitions/fade-in-width-expand.js
View File

@ -3,19 +3,22 @@ import commonVariables from '../base/_common'
const cubicBezierEaseInOut = commonVariables.cubicBezierEaseInOut
export default function ({
duration = '.2s',
delay = '.1s'
} = {}) {
export default function ({ duration = '.2s', delay = '.1s' } = {}) {
return [
c(`&.${namespace}-fade-in-width-expand-transition-leave-from, &.${namespace}-fade-in-width-expand-transition-enter-to`, {
opacity: 1
}),
c(`&.${namespace}-fade-in-width-expand-transition-leave-to, &.${namespace}-fade-in-width-expand-transition-enter-from`, {
opacity: '0 !important',
marginLeft: '0 !important',
marginRight: '0 !important'
}),
c(
`&.${namespace}-fade-in-width-expand-transition-leave-from, &.${namespace}-fade-in-width-expand-transition-enter-to`,
{
opacity: 1
}
),
c(
`&.${namespace}-fade-in-width-expand-transition-leave-to, &.${namespace}-fade-in-width-expand-transition-enter-from`,
{
opacity: '0 !important',
marginLeft: '0 !important',
marginRight: '0 !important'
}
),
c(`&.${namespace}-fade-in-width-expand-transition-leave-active`, {
raw: `
overflow: hidden;

22
src/_styles/transitions/fade-in.js
View File

@ -1,9 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseInOut
} = commonVariables
const { cubicBezierEaseInOut } = commonVariables
export default function ({
name = 'fade-in',
@ -19,11 +17,17 @@ export default function ({
c(`&.${namespace}-${name}-transition-leave-active`, {
transition: `all ${leaveDuration} ${leaveCubicBezier}!important`
}),
c(`&.${namespace}-${name}-transition-enter-from, &.${namespace}-${name}-transition-leave-to`, {
opacity: 0
}),
c(`&.${namespace}-${name}-transition-leave-from, &.${namespace}-${name}-transition-enter-to`, {
opacity: 1
})
c(
`&.${namespace}-${name}-transition-enter-from, &.${namespace}-${name}-transition-leave-to`,
{
opacity: 0
}
),
c(
`&.${namespace}-${name}-transition-leave-from, &.${namespace}-${name}-transition-enter-to`,
{
opacity: 1
}
)
]
}

8
src/_styles/transitions/fade-up-width-expand.js
View File

@ -1,13 +1,9 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseOut
} = commonVariables
const { cubicBezierEaseOut } = commonVariables
export default function fadeUpWidthExpandTransition ({
duration = '.2s'
} = {}) {
export default function fadeUpWidthExpandTransition ({ duration = '.2s' } = {}) {
return [
c(`&.${namespace}-fade-up-width-expand-transition-leave-active`, {
transition: `

47
src/_styles/transitions/icon-switch.js
View File

@ -8,24 +8,33 @@ export default function ({
transition = `all .3s ${commonVariables.cubicBezierEaseInOut} !important`
} = {}) {
return [
c(`&.${namespace}-icon-switch-transition-enter-from, &.${namespace}-icon-switch-transition-leave-to`, {
transform: originalTransform + ' scale(0.75)',
left,
top,
opacity: 0
}),
c(`&.${namespace}-icon-switch-transition-enter-to, &.${namespace}-icon-switch-transition-leave-from`, {
transform: `${commonVariables.transformDebounceScale} ${originalTransform}`,
left,
top,
opacity: 1
}),
c(`&.${namespace}-icon-switch-transition-enter-active, &.${namespace}-icon-switch-transition-leave-active`, {
transformOrigin: 'center',
position: 'absolute',
left,
top,
transition
})
c(
`&.${namespace}-icon-switch-transition-enter-from, &.${namespace}-icon-switch-transition-leave-to`,
{
transform: originalTransform + ' scale(0.75)',
left,
top,
opacity: 0
}
),
c(
`&.${namespace}-icon-switch-transition-enter-to, &.${namespace}-icon-switch-transition-leave-from`,
{
transform: `${commonVariables.transformDebounceScale} ${originalTransform}`,
left,
top,
opacity: 1
}
),
c(
`&.${namespace}-icon-switch-transition-enter-active, &.${namespace}-icon-switch-transition-leave-active`,
{
transformOrigin: 'center',
position: 'absolute',
left,
top,
transition
}
)
]
}

5
src/_styles/transitions/slide-in-from-bottom.js
View File

@ -1,10 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseIn,
cubicBezierEaseOut
} = commonVariables
const { cubicBezierEaseIn, cubicBezierEaseOut } = commonVariables
export default function ({
duration = '0.3s',

5
src/_styles/transitions/slide-in-from-left.js
View File

@ -1,10 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseIn,
cubicBezierEaseOut
} = commonVariables
const { cubicBezierEaseIn, cubicBezierEaseOut } = commonVariables
export default function ({
duration = '0.3s',

5
src/_styles/transitions/slide-in-from-right.js
View File

@ -1,10 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseIn,
cubicBezierEaseOut
} = commonVariables
const { cubicBezierEaseIn, cubicBezierEaseOut } = commonVariables
export default function ({
duration = '0.3s',

5
src/_styles/transitions/slide-in-from-top.js
View File

@ -1,10 +1,7 @@
import { c, namespace } from '../../_utils/cssr'
import commonVariables from '../base/_common'
const {
cubicBezierEaseIn,
cubicBezierEaseOut
} = commonVariables
const { cubicBezierEaseIn, cubicBezierEaseOut } = commonVariables
export default function ({
duration = '0.3s',

7
src/_styles/utils/create-component-base.js
View File

@ -4,12 +4,7 @@ export default function createBaseComponent (options) {
globalVars: null,
overrides: null
}
const {
name,
theme,
peer,
getLocalVars
} = options
const { name, theme, peer, getLocalVars } = options
function updateVars () {
cache.localVars = Object.assign(
getLocalVars(cache.globalVars),

22
src/_utils/composable/index.js
View File

@ -24,7 +24,7 @@ export function useInjectionCollection (injectionName, collectionKey, valueRef)
watch(valueRef, (value, prevValue) => {
const collectionArray = injection[collectionKey]
const index = collectionArray.findIndex(
collectionValue => collectionValue === prevValue
(collectionValue) => collectionValue === prevValue
)
if (~index) collectionArray.splice(index, 1)
collectionArray.push(value)
@ -32,29 +32,31 @@ export function useInjectionCollection (injectionName, collectionKey, valueRef)
onBeforeUnmount(() => {
const collectionArray = injection[collectionKey]
const index = collectionArray.findIndex(
collectionValue => collectionValue === valueRef.value
(collectionValue) => collectionValue === valueRef.value
)
if (~index) collectionArray.splice(index, 1)
})
}
export function useInjectionElementCollection (injectionName, collectionKey, getElement) {
export function useInjectionElementCollection (
injectionName,
collectionKey,
getElement
) {
const injection = inject(injectionName)
if (!(collectionKey in injection)) {
injection[collectionKey] = []
}
onMounted(() => {
const currentInstance = getCurrentInstance().proxy
injection[collectionKey].push(
getElement(currentInstance)
)
injection[collectionKey].push(getElement(currentInstance))
})
onBeforeUnmount(() => {
const collectionArray = injection[collectionKey]
const currentInstance = getCurrentInstance().proxy
const element = getElement(currentInstance)
const index = collectionArray.findIndex(
collectionElement => collectionElement === element
(collectionElement) => collectionElement === element
)
if (~index) collectionArray.splice(index, 1)
})
@ -64,7 +66,7 @@ export function useDelayedTrue (valueRef, delay, shouldDelayRef) {
if (!delay) return valueRef
const delayedRef = ref(valueRef.value)
let timerId = null
watch(valueRef, value => {
watch(valueRef, (value) => {
if (timerId !== null) clearTimeout(timerId)
if (value === true) {
if (shouldDelayRef && shouldDelayRef.value === false) {
@ -81,6 +83,4 @@ export function useDelayedTrue (valueRef, delay, shouldDelayRef) {
return delayedRef
}
export {
useAdjustedTo
} from './use-adjusted-to'
export { useAdjustedTo } from './use-adjusted-to'

6
src/_utils/css/format-length.js
View File

@ -2,11 +2,7 @@ const pureNumberRegex = /^(\d|\.)+$/
const numberRegex = /(\d|\.)+/
export default function formatLength (length, options = {}) {
const {
c = 1,
offset = 0,
attachPx = true
} = options
const { c = 1, offset = 0, attachPx = true } = options
const type = typeof length
if (type === 'number') {
const result = (length + offset) * c

45
src/_utils/cssr/index.js
View File

@ -24,45 +24,40 @@ function insideFormItem (status, style) {
if (status === null) return style
return c(`${prefix}form-item`, [
c(`${prefix}form-item-blank`, [
c(() => `&${prefix}form-item-blank${modifierPrefix}${status}`, [
style
])
c(() => `&${prefix}form-item-blank${modifierPrefix}${status}`, [style])
])
])
}
function insideModal (style) {
return c(`${prefix}modal-body-wrapper, ${prefix}drawer`, [
style
])
return c(`${prefix}modal-body-wrapper, ${prefix}drawer`, [style])
}
function cTB (selector, ...rest) {
return cB(selector, [
c(
({ props }) => {
const theme = props.$theme
if (__DEV__ && !theme) {
warn('utils/cssr', 'No theme when rendering styles, this could be a bug of naive-ui.')
}
return (
theme === fallbackTheme
? ''
: `&.${namespace}-${theme}-theme`
c(({ props }) => {
const theme = props.$theme
if (__DEV__ && !theme) {
warn(
'utils/cssr',
'No theme when rendering styles, this could be a bug of naive-ui.'
)
},
...rest
)
}
return theme === fallbackTheme ? '' : `&.${namespace}-${theme}-theme`
}, ...rest)
])
}
function createKey (keyPrefix, ...suffixs) {
return keyPrefix + suffixs.map(
suffix => {
if (suffix === 'default') return ''
return suffix.replace(/^[a-z]/, startChar => startChar.toUpperCase())
}
).join('')
return (
keyPrefix +
suffixs
.map((suffix) => {
if (suffix === 'default') return ''
return suffix.replace(/^[a-z]/, (startChar) => startChar.toUpperCase())
})
.join('')
)
}
function cRB (selector, ...rest) {

9
src/_utils/index.js
View File

@ -7,11 +7,6 @@ export {
getVNodeChildren,
render
} from './vue'
export {
warn,
warnOnce
} from './naive'
export {
formatLength
} from './css'
export { warn, warnOnce } from './naive'
export { formatLength } from './css'
export * from './composable'

2
src/_utils/vue/call.js
View File

@ -1,4 +1,4 @@
export function call (funcs, ...args) {
if (Array.isArray(funcs)) funcs.forEach(func => call(func, ...args))
if (Array.isArray(funcs)) funcs.forEach((func) => call(func, ...args))
else return funcs(...args)
}

2
src/_utils/vue/flatten.js
View File

@ -2,7 +2,7 @@ import { Fragment } from 'vue'
// o(n) flatten
export function flatten (vNodes, result = []) {
vNodes.forEach(vNode => {
vNodes.forEach((vNode) => {
if (vNode.type === Fragment) {
flatten(vNode.children, result)
} else {

2
src/_utils/vue/keep.js
View File

@ -1,6 +1,6 @@
export function keep (object, keys = [], rest = {}) {
const keepedObject = {}
keys.forEach(key => {
keys.forEach((key) => {
keepedObject[key] = object[key]
})
return Object.assign(keepedObject, rest)

4
src/_utils/vue/omit.js
View File

@ -1,8 +1,8 @@
export function omit (object, keys = [], rest = {}) {
const omitedObject = {}
const originalKeys = Object.getOwnPropertyNames(object)
originalKeys.forEach(originalKey => {
if (!keys.includes(originalKey)) omitedObject[originalKey] = object[originalKey]
originalKeys.forEach((originalKey) => {
if (!keys.includes(originalKey)) { omitedObject[originalKey] = object[originalKey] }
})
return Object.assign(omitedObject, rest)
}

33
src/affix/src/Affix.vue
View File

@ -13,21 +13,13 @@
<script>
import { getScrollParent, unwrapElement } from 'seemly'
import {
configurable,
themeable,
withCssr
} from '../../_mixins'
import { configurable, themeable, withCssr } from '../../_mixins'
import styles from './styles/index.js'
import { warn } from '../../_utils'
export default {
name: 'Affix',
mixins: [
configurable,
themeable,
withCssr(styles)
],
mixins: [configurable, themeable, withCssr(styles)],
props: {
listenTo: {
type: [String, Object],
@ -109,10 +101,7 @@ export default {
},
methods: {
init () {
const {
target: getScrollTarget,
listenTo
} = this
const { target: getScrollTarget, listenTo } = this
let scrollElement
if (getScrollTarget) {
// deprecated
@ -149,20 +138,22 @@ export default {
const affixRect = this.$el.getBoundingClientRect()
const pxToTop = affixRect.top - containerRect.top
const pxToBottom = containerRect.bottom - affixRect.bottom
const {
mergedOffsetTop,
mergedOffsetBottom
} = this
const { mergedOffsetTop, mergedOffsetBottom } = this
if (mergedOffsetTop !== undefined && pxToTop <= mergedOffsetTop) {
this.stickToTop = true
this.topAffixedTriggerScrollTop = containerEl.scrollTop - (mergedOffsetTop - pxToTop)
this.topAffixedTriggerScrollTop =
containerEl.scrollTop - (mergedOffsetTop - pxToTop)
} else {
this.stickToTop = false
this.topAffixedTriggerScrollTop = null
}
if (mergedOffsetBottom !== undefined && pxToBottom <= mergedOffsetBottom) {
if (
mergedOffsetBottom !== undefined &&
pxToBottom <= mergedOffsetBottom
) {
this.stickToBottom = true
this.bottomAffixedTriggerScrollTop = containerEl.scrollTop + mergedOffsetBottom - pxToBottom
this.bottomAffixedTriggerScrollTop =
containerEl.scrollTop + mergedOffsetBottom - pxToBottom
} else {
this.stickToBottom = false
this.bottomAffixedTriggerScrollTop = null

4
src/affix/src/styles/index.js
View File

@ -3,9 +3,7 @@ import baseStyle from './base.cssr.js'
export default [
{
key: 'mergedTheme',
watch: [
'mergedTheme'
],
watch: ['mergedTheme'],
CNode: baseStyle
}
]

4
src/affix/styles/dark.js
View File

@ -4,9 +4,7 @@ import { baseDark } from '../../_styles/base'
export default create({
theme: 'dark',
name: 'Affix',
peer: [
baseDark
],
peer: [baseDark],
getLocalVars () {
return {}
}

4
src/affix/styles/light.js
View File

@ -4,9 +4,7 @@ import { baseLight } from '../../_styles/base'
export default create({
theme: 'light',
name: 'Affix',
peer: [
baseLight
],
peer: [baseLight],
getLocalVars () {
return {}
}

8
src/affix/tests/Affix.spec.js
View File

@ -6,12 +6,8 @@ import { NAffix } from '../index'
describe('n-affix', () => {
const naive = create({
locales: [
enUS
],
styles: [
affixLight
]
locales: [enUS],
styles: [affixLight]
})
it('should work with import on demand', () => {
mount(NAffix, {

Some files were not shown because too many files have changed in this diff Show More