mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-30 12:52:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(use-theme): robust type

Browse Source
This commit is contained in:
07akioni 2021-02-02 00:59:16 +08:00
parent 16acf849a8
commit 937c785f8b
46 changed files with 158 additions and 172 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/_mixins/use-theme.ts
View File

@ -17,6 +17,18 @@ export interface Theme<T = {}, R = any> {
self?: (vars: ThemeCommonVars) => T
}
export interface ThemeProps<T> {
unstableTheme: PropType<T>
themeOverrides: PropType<ExtractThemeOverrides<T>>
builtinThemeOverrides: PropType<ExtractThemeOverrides<T>>
}
export interface ThemePropsReactive<T> {
unstableTheme?: T
themeOverrides?: ExtractThemeOverrides<T>
builtinThemeOverrides?: ExtractThemeOverrides<T>
}
export type ExtractThemeVars<T> = T extends Theme<infer U, unknown>
? unknown extends U // self is undefined, ThemeVars is unknown
? {}
@ -26,14 +38,15 @@ export type ExtractThemeVars<T> = T extends Theme<infer U, unknown>
export type ExtractPeerOverrides<T> = T extends Theme<unknown, infer V>
? {
peers?: {
[k in keyof V]?: ExtractThemeVars<V[k]>
[k in keyof V]?: ExtractThemeOverrides<V[k]>
}
}
: T
// V is peers theme
export type ExtractMergedPeerOverrides<T> = T extends Theme<unknown, infer V>
? {
[k in keyof V]?: ExtractThemeVars<V[k]>
[k in keyof V]?: ExtractPeerOverrides<T>
}
: T
@ -46,7 +59,7 @@ export function createTheme<T, R> (theme: Theme<T, R>): Theme<T, R> {
type UseThemeProps<T> = Readonly<{
unstableTheme?: T | undefined
unstableThemeOverrides?: ExtractThemeOverrides<T>
themeOverrides?: ExtractThemeOverrides<T>
builtinThemeOverrides?: ExtractThemeOverrides<T>
}>
@ -55,7 +68,7 @@ export type MergedTheme<T> = T extends Theme<infer V, infer W>
common: ThemeCommonVars
self: V
peers: W
overrides: ExtractMergedPeerOverrides<T>
peerOverrides: ExtractMergedPeerOverrides<T>
}
: T
@ -80,51 +93,50 @@ function useTheme<T, R> (
const mergedThemeRef = computed(() => {
// keep props to make theme overrideable
const {
unstableTheme: { common, self, peers = {} } = {},
unstableThemeOverrides: selfOverrides = {} as ExtractThemeOverrides<
Theme<T, R>
>,
unstableTheme: { common: selfCommon, self, peers = {} } = {},
themeOverrides: selfOverrides = {} as ExtractThemeOverrides<Theme<T, R>>,
builtinThemeOverrides: builtinOverrides = {} as ExtractThemeOverrides<
Theme<T, R>
>
} = props
const { common: commonOverrides, peers: peersOverrides } = selfOverrides
const { common: selfCommonOverrides, peers: peersOverrides } = selfOverrides
const {
mergedUnstableTheme: {
common: injectedGlobalCommon = undefined,
common: globalCommon = undefined,
[resolveId]: {
common: injectedCommon = undefined,
self: injectedSelf = undefined,
peers: injectedPeers = {}
common: globalSelfCommon = undefined,
self: globalSelf = undefined,
peers: globalPeers = {}
} = {}
} = {},
mergedUnstableThemeOverrides: {
common: injectedGlobalCommonOverrides = undefined,
[resolveId]: injectedSelfOverrides = {}
common: globalCommonOverrides = undefined,
[resolveId]: globalSelfOverrides = {}
} = {}
} = NConfigProvider || {}
const {
common: injectedCommonOverrides,
peers: injectedPeersOverrides = {}
} = injectedSelfOverrides
common: globalSelfCommonOverrides,
peers: globalPeersOverrides = {}
} = globalSelfOverrides
const mergedCommon = merge(
{},
common || injectedCommon || injectedGlobalCommon || defaultTheme.common,
injectedGlobalCommonOverrides,
injectedCommonOverrides,
commonOverrides
selfCommon || globalSelfCommon || globalCommon || defaultTheme.common,
globalCommonOverrides,
globalSelfCommonOverrides,
selfCommonOverrides
)
const mergedSelf = merge(
(self || injectedSelf || defaultTheme.self)?.(mergedCommon) || {},
// executed every time, no need for empty obj
(self || globalSelf || defaultTheme.self)?.(mergedCommon) || {},
builtinOverrides,
injectedSelfOverrides,
globalSelfOverrides,
selfOverrides
)
return {
common: mergedCommon,
self: mergedSelf as any,
peers: merge({}, defaultTheme.peers, peers, injectedPeers),
overrides: merge({}, peersOverrides, injectedPeersOverrides)
peers: merge({}, defaultTheme.peers, globalPeers, peers),
peerOverrides: merge({}, globalPeersOverrides, peersOverrides)
}
})
return mergedThemeRef
@ -132,22 +144,10 @@ function useTheme<T, R> (
useTheme.props = {
unstableTheme: Object,
unstableThemeOverrides: Object,
themeOverrides: Object,
builtinThemeOverrides: Object
} as const
export interface ThemeProps<T> {
unstableTheme: PropType<T>
unstableThemeOverrides: PropType<ExtractThemeOverrides<T>>
builtinThemeOverrides: PropType<ExtractThemeOverrides<T>>
}
export interface ThemePropsReactive<T> {
unstableTheme?: T
unstableThemeOverrides?: ExtractThemeOverrides<T>
builtinThemeOverrides?: ExtractThemeOverrides<T>
}
/**
* props.unstableTheme (Theme):
* {

8
src/auto-complete/src/AutoComplete.tsx
View File

@ -293,8 +293,8 @@ export default defineComponent({
(
<NInput
unstableTheme={this.mergedTheme.peers.Input}
unstableThemeOverrides={
this.mergedTheme.overrides.Input
themeOverrides={
this.mergedTheme.peerOverrides.Input
}
bordered={this.mergedBordered}
value={this.mergedValue}
@ -337,8 +337,8 @@ export default defineComponent({
unstableTheme={
this.mergedTheme.peers.InternalSelectMenu
}
unstableThemeOverrides={
this.mergedTheme.overrides
themeOverrides={
this.mergedTheme.peerOverrides
.InternalSelectMenu
}
auto-pending

4
src/cascader/src/Cascader.tsx
View File

@ -732,8 +732,8 @@ export default defineComponent({
bordered={this.mergedBordered}
size={this.mergedSize}
unstableTheme={this.mergedTheme.peers.InternalSelection}
unstableThemeOverrides={
this.mergedTheme.overrides.InternalSelection
themeOverrides={
this.mergedTheme.peerOverrides.InternalSelection
}
active={this.mergedShow}
pattern={this.pattern}

2
src/cascader/src/CascaderOption.tsx
View File

@ -176,7 +176,7 @@ export default defineComponent({
checked={this.checked}
indeterminate={this.indeterminate}
unstableTheme={NCascader.mergedTheme.peers.Checkbox}
unstableThemeOverrides={NCascader.mergedTheme.overrides.Checkbox}
themeOverrides={NCascader.mergedTheme.peerOverrides.Checkbox}
onUpdateChecked={this.handleCheckboxUpdateValue}
/>
</div>

4
src/cascader/src/CascaderSelectMenu.tsx
View File

@ -168,8 +168,8 @@ export default defineComponent({
ref="menuInstRef"
class="n-cascader-menu"
autoPending
unstableThemeOverrides={
NCascader.mergedTheme.overrides.InternalSelectMenu
themeOverrides={
NCascader.mergedTheme.peerOverrides.InternalSelectMenu
}
unstableTheme={NCascader.mergedTheme.peers.InternalSelectMenu}
treeMate={this.selectTreeMate}

2
src/cascader/src/CascaderSubmenu.tsx
View File

@ -46,7 +46,7 @@ export default defineComponent({
<NScrollbar
ref="scrollbarInstRef"
unstableTheme={NCascader.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={NCascader.mergedTheme.overrides.Scrollbar}
themeOverrides={NCascader.mergedTheme.peerOverrides.Scrollbar}
>
{{
default: () =>

8
src/config-provider/src/ConfigProvider.ts
View File

@ -39,7 +39,7 @@ export default defineComponent({
hljs: Object as PropType<Hljs>,
// wip, unstable
unstableTheme: Object as PropType<GlobalTheme>,
unstableThemeOverrides: Object as PropType<GlobalThemeOverrides>,
themeOverrides: Object as PropType<GlobalThemeOverrides>,
// deprecated
theme: String,
language: String,
@ -81,10 +81,10 @@ export default defineComponent({
: unstableTheme
})
const mergedUnstableThemeOverridesRef = computed(() => {
const { unstableThemeOverrides } = props
return unstableThemeOverrides === undefined
const { themeOverrides } = props
return themeOverrides === undefined
? NConfigProvider?.mergedUnstableThemeOverrides
: unstableThemeOverrides
: themeOverrides
})
const mergedNamespaceRef = useMemo(() => {
const { namespace } = props

10
src/data-table/src/DataTable.tsx
View File

@ -360,7 +360,7 @@ export default defineComponent({
<NSpin
show={this.loading}
unstableTheme={this.mergedTheme.peers.Spin}
unstableThemeOverrides={this.mergedTheme.overrides.Spin}
themeOverrides={this.mergedTheme.peerOverrides.Spin}
size="small"
>
{{
@ -385,8 +385,8 @@ export default defineComponent({
>
<NEmpty
unstableTheme={this.mergedTheme.peers.Empty}
unstableThemeOverrides={
this.mergedTheme.overrides.Empty
themeOverrides={
this.mergedTheme.peerOverrides.Empty
}
/>
</div>
@ -398,9 +398,7 @@ export default defineComponent({
<div class="n-data-table__pagination">
<NPagination
unstableTheme={this.mergedTheme.peers.Pagination}
unstableThemeOverrides={
this.mergedTheme.overrides.Pagination
}
themeOverrides={this.mergedTheme.peerOverrides.Pagination}
{...this.mergedPagination}
/>
</div>

2
src/data-table/src/HeaderButton/FilterButton.tsx
View File

@ -102,7 +102,7 @@ export default defineComponent({
onUpdateShow={(v) => (this.showPopover = v)}
trigger="click"
unstableTheme={mergedTheme.peers.Popover}
unstableThemeOverrides={mergedTheme.overrides.Popover}
themeOverrides={mergedTheme.peerOverrides.Popover}
padded={false}
>
{{

10
src/data-table/src/HeaderButton/FilterMenu.tsx
View File

@ -140,9 +140,7 @@ export default defineComponent({
<NCheckbox
key={option.value}
unstableTheme={mergedTheme.peers.Checkbox}
unstableThemeOverrides={
mergedTheme.overrides.Checkbox
}
themeOverrides={mergedTheme.peerOverrides.Checkbox}
value={option.value}
>
{{ default: () => option.label }}
@ -165,7 +163,7 @@ export default defineComponent({
key={option.value}
value={option.value}
unstableTheme={mergedTheme.peers.Radio}
unstableThemeOverrides={mergedTheme.overrides.Radio}
themeOverrides={mergedTheme.peerOverrides.Radio}
>
{{ default: () => option.label }}
</NRadio>
@ -180,14 +178,14 @@ export default defineComponent({
<NButton
size="tiny"
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
onClick={this.handleClearClick}
>
{{ default: () => locale.clear }}
</NButton>
<NButton
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
type="primary"
size="tiny"
onClick={this.handleConfirmClick}

2
src/data-table/src/TableParts/Body.tsx
View File

@ -54,7 +54,7 @@ export default defineComponent({
ref="scrollbarInstRef"
class="n-data-table-base-table-body"
unstableTheme={mergedTheme.peers.Scrollbar}
unstableThemeOverrides={mergedTheme.overrides.Scrollbar}
themeOverrides={mergedTheme.peerOverrides.Scrollbar}
contentStyle={{
minWidth: formatLength(scrollX)
}}

2
src/date-picker/src/DatePicker.tsx
View File

@ -550,7 +550,7 @@ export default defineComponent({
bordered: this.mergedBordered,
size: this.mergedSize,
unstableTheme: this.mergedTheme.peers.Input,
unstableThemeOverrides: this.mergedTheme.overrides.Input,
themeOverrides: this.mergedTheme.peerOverrides.Input,
passivelyActivated: true,
disabled: this.disabled,
readonly: this.disabled,

12
src/date-picker/src/panel/date.tsx
View File

@ -83,8 +83,8 @@ export default defineComponent({
{this.actions.includes('clear') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleClearClick}
@ -95,8 +95,8 @@ export default defineComponent({
{this.actions.includes('now') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleNowClick}
@ -107,8 +107,8 @@ export default defineComponent({
{this.actions.includes('confirm') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
type="primary"

8
src/date-picker/src/panel/daterange.tsx
View File

@ -179,8 +179,8 @@ export default defineComponent({
{this.actions.includes('clear') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleClearClick}
@ -191,8 +191,8 @@ export default defineComponent({
{this.actions.includes('confirm') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
type="primary"

20
src/date-picker/src/panel/datetime.tsx
View File

@ -30,9 +30,7 @@ export default defineComponent({
<NInput
value={this.dateInputValue}
unstableTheme={this.NDatePicker.mergedTheme.peers.Input}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Input
}
themeOverrides={this.NDatePicker.mergedTheme.peerOverrides.Input}
stateful={false}
size={this.timePickerSize}
class="n-date-panel-date-input"
@ -46,8 +44,8 @@ export default defineComponent({
format={this.timeFormat}
stateful={false}
unstableTheme={this.NDatePicker.mergedTheme.peers.TimePicker}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.TimePicker
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.TimePicker
}
teleport-disabled
size={this.timePickerSize}
@ -118,8 +116,8 @@ export default defineComponent({
{this.actions.includes('clear') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleClearClick}
@ -130,8 +128,8 @@ export default defineComponent({
{this.actions.includes('now') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleNowClick}
@ -142,8 +140,8 @@ export default defineComponent({
{this.actions.includes('confirm') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
type="primary"

24
src/date-picker/src/panel/datetimerange.tsx
View File

@ -31,9 +31,7 @@ export default defineComponent({
<NInput
value={this.startDateDisplayString}
unstableTheme={this.NDatePicker.mergedTheme.peers.Input}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Input
}
themeOverrides={this.NDatePicker.mergedTheme.peerOverrides.Input}
size={this.timePickerSize}
stateful={false}
class="n-date-panel-date-input"
@ -47,8 +45,8 @@ export default defineComponent({
teleportDisabled
showIcon={false}
unstableTheme={this.NDatePicker.mergedTheme.peers.TimePicker}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.TimePicker
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.TimePicker
}
stateful={false}
placeholder={this.locale.selectTime}
@ -62,9 +60,7 @@ export default defineComponent({
<NInput
value={this.endDateInput}
unstableTheme={this.NDatePicker.mergedTheme.peers.Input}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Input
}
themeOverrides={this.NDatePicker.mergedTheme.peerOverrides.Input}
stateful={false}
size={this.timePickerSize}
class="n-date-panel-date-input"
@ -76,8 +72,8 @@ export default defineComponent({
<NTimePicker
showIcon={false}
unstableTheme={this.NDatePicker.mergedTheme.peers.TimePicker}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.TimePicker
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.TimePicker
}
teleportDisabled
size={this.timePickerSize}
@ -245,8 +241,8 @@ export default defineComponent({
{this.actions.includes('clear') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
onClick={this.handleClearClick}
@ -257,8 +253,8 @@ export default defineComponent({
{this.actions.includes('confirm') ? (
<NButton
unstableTheme={this.NDatePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NDatePicker.mergedTheme.overrides.Button
themeOverrides={
this.NDatePicker.mergedTheme.peerOverrides.Button
}
size="tiny"
type="primary"

4
src/dialog/src/Dialog.tsx
View File

@ -257,7 +257,7 @@ export default defineComponent({
negativeText ? (
<NButton
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
ghost
size="small"
onClick={handleNegativeClick}
@ -270,7 +270,7 @@ export default defineComponent({
) : null,
<NButton
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
disabled={loading}
loading={loading}
size="small"

4
src/drawer/src/DrawerBodyWrapper.tsx
View File

@ -122,8 +122,8 @@ export default defineComponent({
unstableTheme={
NDrawer.mergedTheme.peers.Scrollbar
}
unstableThemeOverrides={
NDrawer.mergedTheme.overrides.Scrollbar
themeOverrides={
NDrawer.mergedTheme.peerOverrides.Scrollbar
}
>
{$slots}

2
src/dropdown/src/Dropdown.ts
View File

@ -344,7 +344,7 @@ export default defineComponent({
raw: true,
shadow: false,
unstableTheme: this.mergedTheme.peers.Popover,
unstableThemeOverrides: this.mergedTheme.overrides.Popover
themeOverrides: this.mergedTheme.peerOverrides.Popover
}),
{
trigger: this.$slots.default,

8
src/dynamic-input/src/DynamicInput.tsx
View File

@ -261,7 +261,7 @@ export default defineComponent({
ghost
dashed
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
onClick={this.handleCreateClick}
>
{{
@ -310,9 +310,7 @@ export default defineComponent({
!this.removeDisabled ? (
<NButton
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={
mergedTheme.overrides.Button
}
themeOverrides={mergedTheme.peerOverrides.Button}
circle
onClick={() => remove(index)}
>
@ -329,7 +327,7 @@ export default defineComponent({
disabled={this.insertionDisabled}
circle
unstableTheme={mergedTheme.peers.Button}
unstableThemeOverrides={mergedTheme.overrides.Button}
themeOverrides={mergedTheme.peerOverrides.Button}
onClick={() => createItem(index)}
>
{{

4
src/dynamic-input/src/InputPreset.tsx
View File

@ -31,7 +31,9 @@ export default defineComponent({
<div class="n-dynamic-input-preset-input">
<NInput
unstableTheme={NDynamicInput.mergedTheme.peers.Input}
unstableTheme-overrides={NDynamicInput.mergedTheme.overrides.Input}
unstableTheme-overrides={
NDynamicInput.mergedTheme.peerOverrides.Input
}
value={value}
placeholder={NDynamicInput.placeholder}
onUpdateValue={onUpdateValue}

8
src/dynamic-input/src/PairPreset.tsx
View File

@ -47,7 +47,9 @@ export default defineComponent({
<div class="n-dynamic-input-preset-pair">
<NInput
unstableTheme={NDynamicInput.mergedTheme.peers.Input}
unstableTheme-overrides={NDynamicInput.mergedTheme.overrides.Input}
unstableTheme-overrides={
NDynamicInput.mergedTheme.peerOverrides.Input
}
value={value.key}
class="n-dynamic-input-pair-input"
placeholder={NDynamicInput.keyPlaceholder}
@ -55,7 +57,9 @@ export default defineComponent({
/>
<NInput
unstableTheme={NDynamicInput.mergedTheme.peers.Input}
unstableTheme-overrides={NDynamicInput.mergedTheme.overrides.Input}
unstableTheme-overrides={
NDynamicInput.mergedTheme.peerOverrides.Input
}
value={value.value}
class="n-dynamic-input-pair-input"
placeholder={NDynamicInput.valuePlaceholder}

6
src/dynamic-tags/src/DynamicTags.tsx
View File

@ -153,7 +153,7 @@ export default defineComponent({
<NTag
key={index}
unstableTheme={mergedTheme.peers.Tag}
unstableThemeOverrides={mergedTheme.overrides.Tag}
themeOverrides={mergedTheme.peerOverrides.Tag}
style={this.tagStyle}
type={this.type}
round={this.round}
@ -174,7 +174,7 @@ export default defineComponent({
}}
forceFocus={this.inputForceFocused}
unstableTheme={mergedTheme.peers.Input}
unstableThemeOverrides={mergedTheme.overrides.Input}
themeOverrides={mergedTheme.peerOverrides.Input}
style={this.inputStyle}
size={this.inputSize}
placeholder=""
@ -185,7 +185,7 @@ export default defineComponent({
<NButton
dashed
unstableTheme={this.mergedTheme.peers.Button}
unstableThemeOverrides={this.mergedTheme.overrides.Button}
themeOverrides={this.mergedTheme.peerOverrides.Button}
size={this.inputSize}
onClick={this.handleAddClick}
>

2
src/input-number/src/InputNumber.tsx
View File

@ -321,7 +321,7 @@ export default defineComponent({
onUpdateValue={this.handleUpdateDisplayedValue}
passively-activated
unstableTheme={this.mergedTheme.peers.Input}
unstableThemeOverrides={this.mergedTheme.overrides.Input}
themeOverrides={this.mergedTheme.peerOverrides.Input}
builtinThemeOverrides={this.inputThemeOverrides}
size={this.mergedSize}
placeholder={this.mergedPlaceholder}

2
src/layout/src/Layout.tsx
View File

@ -129,7 +129,7 @@ export default defineComponent({
{...this.scrollbarProps}
ref="scrollbarRef"
unstableTheme={this.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={this.mergedTheme.overrides.Scrollbar}
themeOverrides={this.mergedTheme.peerOverrides.Scrollbar}
>
{this.$slots}
</NScrollbar>

2
src/layout/src/LayoutSider.tsx
View File

@ -281,7 +281,7 @@ export default defineComponent({
class="n-layout-sider__content"
{...this.scrollbarProps}
unstableTheme={this.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={this.mergedTheme.overrides.Scrollbar}
themeOverrides={this.mergedTheme.peerOverrides.Scrollbar}
>
{this.$slots}
</NScrollbar>

4
src/log/src/Log.tsx
View File

@ -250,14 +250,14 @@ export default defineComponent({
<NScrollbar
ref="scrollbarRef"
unstableTheme={this.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={this.mergedTheme.overrides.Scrollbar}
themeOverrides={this.mergedTheme.peerOverrides.Scrollbar}
onScroll={this.handleScroll}
>
{{
default: () => (
<NCode
unstableTheme={this.mergedTheme.peers.Code}
unstableThemeOverrides={this.mergedTheme.overrides.Code}
themeOverrides={this.mergedTheme.peerOverrides.Code}
>
{{
default: () =>

2
src/menu/src/MenuItem.ts
View File

@ -90,7 +90,7 @@ export default defineComponent({
NTooltip,
{
unstableTheme: this.mergedTheme.peers.Tooltip,
unstableThemeOverrides: this.mergedTheme.overrides.Tooltip,
themeOverrides: this.mergedTheme.peerOverrides.Tooltip,
trigger: 'hover',
placement: this.dropdownPlacement,
disabled: !this.dropdownEnabled

10
src/modal/src/BodyWrapper.tsx
View File

@ -170,7 +170,7 @@ export default defineComponent({
<NScrollbar
ref="scrollbarRef"
unstableTheme={NModal.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={NModal.mergedTheme.overrides.Scrollbar}
themeOverrides={NModal.mergedTheme.peerOverrides.Scrollbar}
contentClass="n-modal-scroll-content"
>
{{
@ -194,8 +194,8 @@ export default defineComponent({
unstableTheme={
NModal.mergedTheme.peers.Dialog
}
unstableThemeOverrides={
NModal.mergedTheme.overrides.Dialog
themeOverrides={
NModal.mergedTheme.peerOverrides.Dialog
}
{...keep(this.$props, dialogPropKeys)}
>
@ -207,8 +207,8 @@ export default defineComponent({
unstableTheme={
NModal.mergedTheme.peers.Card
}
unstableThemeOverrides={
NModal.mergedTheme.overrides.Card
themeOverrides={
NModal.mergedTheme.peerOverrides.Card
}
{...keep(this.$props, cardPropKeys)}
>

4
src/notification/src/NotificationContainer.tsx
View File

@ -31,8 +31,8 @@ export default defineComponent({
{scrollable ? (
<NScrollbar
unstableTheme={NNotificationProvider.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={
NNotificationProvider.mergedTheme.overrides.Scrollbar
themeOverrides={
NNotificationProvider.mergedTheme.peerOverrides.Scrollbar
}
>
{$slots}

4
src/pagination/src/Pagination.tsx
View File

@ -476,7 +476,7 @@ export default defineComponent({
value={pageSize}
disabled={disabled}
unstableTheme={mergedTheme.peers.Select}
unstableThemeOverrides={mergedTheme.overrides.Select}
themeOverrides={mergedTheme.peerOverrides.Select}
onUpdateValue={handleSizePickerChange as any}
/>
) : null}
@ -491,7 +491,7 @@ export default defineComponent({
placeholder=""
disabled={disabled}
unstableTheme={mergedTheme.peers.Input}
unstableThemeOverrides={mergedTheme.overrides.Input}
themeOverrides={mergedTheme.peerOverrides.Input}
onKeyup={handleQuickJumperKeyUp}
/>
</div>

2
src/popconfirm/src/Popconfirm.ts
View File

@ -85,7 +85,7 @@ export default defineComponent({
{
...omit(props, panelPropKeys, {
unstableTheme: mergedTheme.peers.Popover,
unstableThemeOverrides: mergedTheme.overrides.Popover
themeOverrides: mergedTheme.peerOverrides.Popover
}),
class: 'n-popconfirm',
ref: 'popoverInstRef'

2
src/popselect/src/Popselect.ts
View File

@ -64,7 +64,7 @@ export default defineComponent({
ref: 'popoverInstRef',
class: 'n-popselect',
unstableTheme: mergedTheme.peers.Popover,
unstableThemeOverrides: mergedTheme.overrides.Popover
themeOverrides: mergedTheme.peerOverrides.Popover
}),
{
trigger: this.$slots.default,

4
src/popselect/src/PopselectPanel.tsx
View File

@ -134,8 +134,8 @@ export default defineComponent({
return (
<NInternalSelectMenu
unstableTheme={this.NPopselect.mergedTheme.peers.InternalSelectMenu}
unstableThemeOverrides={
this.NPopselect.mergedTheme.overrides.InternalSelectMenu
themeOverrides={
this.NPopselect.mergedTheme.peerOverrides.InternalSelectMenu
}
multiple={this.multiple}
treeMate={this.treeMate}

8
src/select/src/Select.tsx
View File

@ -649,8 +649,8 @@ export default defineComponent({
disabled={this.disabled}
size={this.mergedSize}
unstableTheme={this.mergedTheme.peers.InternalSelection}
unstableThemeOverrides={
this.mergedTheme.overrides.InternalSelection
themeOverrides={
this.mergedTheme.peerOverrides.InternalSelection
}
loading={this.loading}
autofocus={this.autofocus}
@ -694,8 +694,8 @@ export default defineComponent({
autoPending: true,
unstableTheme: this.mergedTheme.peers
.InternalSelectMenu,
unstableThemeOverrides: this.mergedTheme
.overrides.InternalSelectMenu,
themeOverrides: this.mergedTheme.peerOverrides
.InternalSelectMenu,
pattern: this.pattern,
treeMate: this.treeMate,
multiple: this.multiple,

20
src/time-picker/src/Panel.tsx
View File

@ -161,8 +161,8 @@ export default defineComponent({
<NScrollbar
ref="hourScrollRef"
unstableTheme={this.NTimePicker.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={
this.NTimePicker.mergedTheme.overrides.Scrollbar
themeOverrides={
this.NTimePicker.mergedTheme.peerOverrides.Scrollbar
}
>
{{
@ -192,8 +192,8 @@ export default defineComponent({
<NScrollbar
ref="minuteScrollRef"
unstableTheme={this.NTimePicker.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={
this.NTimePicker.mergedTheme.overrides.Scrollbar
themeOverrides={
this.NTimePicker.mergedTheme.peerOverrides.Scrollbar
}
>
{{
@ -223,8 +223,8 @@ export default defineComponent({
<NScrollbar
ref="secondScrollRef"
unstableTheme={this.NTimePicker.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={
this.NTimePicker.mergedTheme.overrides.Scrollbar
themeOverrides={
this.NTimePicker.mergedTheme.peerOverrides.Scrollbar
}
>
{{
@ -245,9 +245,7 @@ export default defineComponent({
<NButton
size="tiny"
unstableTheme={this.NTimePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NTimePicker.mergedTheme.overrides.Button
}
themeOverrides={this.NTimePicker.mergedTheme.peerOverrides.Button}
onClick={this.onNowClick}
>
{{ default: () => this.nowText }}
@ -257,9 +255,7 @@ export default defineComponent({
type="primary"
class="n-time-picker-actions__confirm"
unstableTheme={this.NTimePicker.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NTimePicker.mergedTheme.overrides.Button
}
themeOverrides={this.NTimePicker.mergedTheme.peerOverrides.Button}
disabled={this.isValueInvalid}
onClick={this.onConfirmClick}
>

2
src/time-picker/src/TimePicker.tsx
View File

@ -593,7 +593,7 @@ export default defineComponent({
deactivateOnEnter
attrSize={this.mergedAttrSize}
unstableTheme={this.mergedTheme.peers.Input}
unstableThemeOverrides={this.mergedTheme.overrides.Input}
themeOverrides={this.mergedTheme.peerOverrides.Input}
stateful={this.stateful}
size={this.mergedSize}
forceFocus={this.active}

4
src/tooltip/src/Tooltip.ts
View File

@ -29,7 +29,7 @@ export default defineComponent({
return {
popoverRef,
syncPosition () {
(popoverRef.value as PopoverRef).syncPosition()
;(popoverRef.value as PopoverRef).syncPosition()
},
mergedTheme: themeRef,
popoverThemeOverrides: computed(() => {
@ -44,7 +44,7 @@ export default defineComponent({
{
...this.$props,
unstableTheme: mergedTheme.peers.Popover,
unstableThemeOverrides: mergedTheme.overrides.Popover,
themeOverrides: mergedTheme.peerOverrides.Popover,
builtinThemeOverrides: this.popoverThemeOverrides,
class: 'n-tooltip n-popover--tooltip',
ref: 'popoverRef'

4
src/transfer/src/Transfer.tsx
View File

@ -348,7 +348,7 @@ export default defineComponent({
<NButton
disabled={this.toButtonDisabled || this.disabled}
unstableTheme={this.mergedTheme.peers.Button}
unstableThemeOverrides={this.mergedTheme.overrides.Button}
themeOverrides={this.mergedTheme.peerOverrides.Button}
onClick={this.handleToTgtClick}
>
{{
@ -360,7 +360,7 @@ export default defineComponent({
<NButton
disabled={this.fromButtonDisabled || this.disabled}
unstableTheme={this.mergedTheme.peers.Button}
unstableThemeOverrides={this.mergedTheme.overrides.Button}
themeOverrides={this.mergedTheme.peerOverrides.Button}
onClick={this.handleToSrcClick}
>
{{

2
src/transfer/src/TransferFilter.tsx
View File

@ -40,7 +40,7 @@ export default defineComponent({
onUpdateValue={this.onUpdateValue}
disabled={this.disabled}
unstableTheme={NTransfer.mergedTheme.peers.Input}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Input}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Input}
clearable
size="small"
placeholder={this.placeholder}

2
src/transfer/src/TransferHeader.tsx
View File

@ -35,7 +35,7 @@ export default defineComponent({
<div class="n-transfer-list-header__checkbox">
<NCheckbox
unstableTheme={NTransfer.mergedTheme.peers.Checkbox}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Checkbox}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Checkbox}
checked={checkboxProps.checked}
indeterminate={checkboxProps.indeterminate}
disabled={checkboxProps.disabled || NTransfer.disabled}

6
src/transfer/src/TransferList.tsx
View File

@ -82,7 +82,7 @@ export default defineComponent({
<NScrollbar
ref="scrollerInstRef"
unstableTheme={NTransfer.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Scrollbar}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Scrollbar}
container={this.scrollContainer}
content={this.scrollContent}
>
@ -118,7 +118,7 @@ export default defineComponent({
) : (
<NScrollbar
unstableTheme={NTransfer.mergedTheme.peers.Scrollbar}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Scrollbar}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Scrollbar}
>
{{
default: () => (
@ -158,7 +158,7 @@ export default defineComponent({
default: () => (
<NEmpty
unstableTheme={NTransfer.mergedTheme.peers.Empty}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Empty}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Empty}
/>
)
}}

2
src/transfer/src/TransferListItem.tsx
View File

@ -67,7 +67,7 @@ export default defineComponent({
<div class="n-transfer-list-item__checkbox">
<NCheckbox
unstableTheme={NTransfer.mergedTheme.peers.Checkbox}
unstableThemeOverrides={NTransfer.mergedTheme.overrides.Checkbox}
themeOverrides={NTransfer.mergedTheme.peerOverrides.Checkbox}
disabled={disabled}
checked={checked}
/>

2
src/tree/src/TreeNodeCheckbox.tsx
View File

@ -39,7 +39,7 @@ export default defineComponent({
<span class="n-tree-node-checkbox">
<NCheckbox
unstableTheme={NTree.mergedTheme.peers.Checkbox}
unstableThemeOverrides={NTree.mergedTheme.overrides.Checkbox}
themeOverrides={NTree.mergedTheme.peerOverrides.Checkbox}
checked={checked}
indeterminate={indeterminate}
onUpdateChecked={handleUpdateValue}

4
src/upload/src/UploadFile.tsx
View File

@ -133,9 +133,7 @@ export default defineComponent({
<NButton
key="cancelOrTrash"
unstableTheme={this.NUpload.mergedTheme.peers.Button}
unstableThemeOverrides={
this.NUpload.mergedTheme.overrides.Button
}
themeOverrides={this.NUpload.mergedTheme.peerOverrides.Button}
circle
size="tiny"
ghost

4
src/upload/src/UploadProgress.tsx
View File

@ -60,9 +60,7 @@ export default defineComponent({
status={this.status}
height={2}
unstableTheme={this.NUpload.mergedTheme.peers.Progress}
unstableThemeOverrides={
this.NUpload.mergedTheme.overrides.Progress
}
themeOverrides={this.NUpload.mergedTheme.peerOverrides.Progress}
/>
) : null
}}