naive-ui 2.35.0 → 2.37.0

package/es/dynamic-input/src/DynamicInput.js

@@ -1,302 +0,0 @@
-import { h, ref, toRef, isProxy, toRaw, computed, defineComponent, inject, provide, watchEffect } from 'vue';
-import { useMergedState } from 'vooks';
-import { createId } from 'seemly';
-import { RemoveIcon, AddIcon, ArrowDownIcon, ArrowUpIcon } from '../../_internal/icons';
-import { formItemInjectionKey } from '../../_mixins/use-form-item';
-import { NBaseIcon } from '../../_internal';
-import { NButton } from '../../button';
-import { NButtonGroup } from '../../button-group';
-import { useTheme, useLocale, useConfig, useThemeClass } from '../../_mixins';
-import { call, warnOnce, resolveSlotWithProps, resolveSlot } from '../../_utils';
-import { dynamicInputLight } from '../styles';
-import NDynamicInputInputPreset from './InputPreset';
-import NDynamicInputPairPreset from './PairPreset';
-import { dynamicInputInjectionKey } from './interface';
-import style from './styles/index.cssr';
-import { useRtl } from '../../_mixins/use-rtl';
-const globalDataKeyMap = new WeakMap();
-export const dynamicInputProps = Object.assign(Object.assign({}, useTheme.props), { max: Number, min: {
-        type: Number,
-        default: 0
-    }, value: Array, 
-    // TODO: make it robust for different types
-    defaultValue: {
-        type: Array,
-        default: () => []
-    }, preset: {
-        type: String,
-        default: 'input'
-    }, keyField: String, itemStyle: [String, Object], 
-    // for preset pair
-    keyPlaceholder: {
-        type: String,
-        default: ''
-    }, valuePlaceholder: {
-        type: String,
-        default: ''
-    }, 
-    // for preset input
-    placeholder: {
-        type: String,
-        default: ''
-    }, disabled: Boolean, showSortButton: Boolean, createButtonProps: Object, onCreate: Function, onRemove: Function, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], 
-    // deprecated
-    onClear: Function, onInput: [Function, Array] });
-export default defineComponent({
-    name: 'DynamicInput',
-    props: dynamicInputProps,
-    setup(props, { slots }) {
-        if (process.env.NODE_ENV !== 'production') {
-            watchEffect(() => {
-                if (props.onClear !== undefined) {
-                    warnOnce('dynamic-input', '`on-clear` is deprecated, it is out of usage anymore.');
-                }
-                if (props.onInput !== undefined) {
-                    warnOnce('dynamic-input', '`on-input` is deprecated, please use `on-update:value` instead.');
-                }
-            });
-        }
-        const { mergedComponentPropsRef, mergedClsPrefixRef, mergedRtlRef, inlineThemeDisabled } = useConfig();
-        const NFormItem = inject(formItemInjectionKey, null);
-        const uncontrolledValueRef = ref(props.defaultValue);
-        const controlledValueRef = toRef(props, 'value');
-        const mergedValueRef = useMergedState(controlledValueRef, uncontrolledValueRef);
-        const themeRef = useTheme('DynamicInput', '-dynamic-input', style, dynamicInputLight, props, mergedClsPrefixRef);
-        const insertionDisabledRef = computed(() => {
-            const { value: mergedValue } = mergedValueRef;
-            if (Array.isArray(mergedValue)) {
-                const { max } = props;
-                return max !== undefined && mergedValue.length >= max;
-            }
-            return false;
-        });
-        const removeDisabledRef = computed(() => {
-            const { value: mergedValue } = mergedValueRef;
-            if (Array.isArray(mergedValue))
-                return mergedValue.length <= props.min;
-            return true;
-        });
-        const buttonSizeRef = computed(() => {
-            var _a, _b;
-            return (_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.DynamicInput) === null || _b === void 0 ? void 0 : _b.buttonSize;
-        });
-        function doUpdateValue(value) {
-            const { onInput, 'onUpdate:value': _onUpdateValue, onUpdateValue } = props;
-            if (onInput)
-                call(onInput, value);
-            if (_onUpdateValue)
-                call(_onUpdateValue, value);
-            if (onUpdateValue)
-                call(onUpdateValue, value);
-            uncontrolledValueRef.value = value;
-        }
-        function ensureKey(value, index) {
-            if (value === undefined || value === null)
-                return index;
-            if (typeof value !== 'object')
-                return index;
-            const rawValue = isProxy(value) ? toRaw(value) : value;
-            let key = globalDataKeyMap.get(rawValue);
-            if (key === undefined) {
-                globalDataKeyMap.set(rawValue, (key = createId()));
-            }
-            return key;
-        }
-        function handleValueChange(index, value) {
-            const { value: mergedValue } = mergedValueRef;
-            const newValue = Array.from(mergedValue !== null && mergedValue !== void 0 ? mergedValue : []);
-            const originalItem = newValue[index];
-            newValue[index] = value;
-            // update dataKeyMap
-            if (originalItem &&
-                value &&
-                typeof originalItem === 'object' &&
-                typeof value === 'object') {
-                const rawOriginal = isProxy(originalItem)
-                    ? toRaw(originalItem)
-                    : originalItem;
-                const rawNew = isProxy(value) ? toRaw(value) : value;
-                // inherit key is value position is not change
-                const originalKey = globalDataKeyMap.get(rawOriginal);
-                if (originalKey !== undefined) {
-                    globalDataKeyMap.set(rawNew, originalKey);
-                }
-            }
-            doUpdateValue(newValue);
-        }
-        function handleCreateClick() {
-            createItem(-1);
-        }
-        function createItem(index) {
-            const { value: mergedValue } = mergedValueRef;
-            const { onCreate } = props;
-            const newValue = Array.from(mergedValue !== null && mergedValue !== void 0 ? mergedValue : []);
-            if (onCreate) {
-                newValue.splice(index + 1, 0, onCreate(index + 1));
-                doUpdateValue(newValue);
-            }
-            else if (slots.default) {
-                newValue.splice(index + 1, 0, null);
-                doUpdateValue(newValue);
-            }
-            else {
-                switch (props.preset) {
-                    case 'input':
-                        newValue.splice(index + 1, 0, '');
-                        doUpdateValue(newValue);
-                        break;
-                    case 'pair':
-                        newValue.splice(index + 1, 0, { key: '', value: '' });
-                        doUpdateValue(newValue);
-                        break;
-                }
-            }
-        }
-        function remove(index) {
-            const { value: mergedValue } = mergedValueRef;
-            if (!Array.isArray(mergedValue))
-                return;
-            const { min } = props;
-            if (mergedValue.length <= min)
-                return;
-            const { onRemove } = props;
-            if (onRemove) {
-                onRemove(index);
-            }
-            const newValue = Array.from(mergedValue);
-            newValue.splice(index, 1);
-            doUpdateValue(newValue);
-        }
-        function swap(array, currentIndex, targetIndex) {
-            if (currentIndex < 0 ||
-                targetIndex < 0 ||
-                currentIndex >= array.length ||
-                targetIndex >= array.length) {
-                return;
-            }
-            if (currentIndex === targetIndex)
-                return;
-            const currentItem = array[currentIndex];
-            array[currentIndex] = array[targetIndex];
-            array[targetIndex] = currentItem;
-        }
-        function move(type, index) {
-            const { value: mergedValue } = mergedValueRef;
-            if (!Array.isArray(mergedValue))
-                return;
-            const newValue = Array.from(mergedValue);
-            if (type === 'up') {
-                swap(newValue, index, index - 1);
-            }
-            if (type === 'down') {
-                swap(newValue, index, index + 1);
-            }
-            doUpdateValue(newValue);
-        }
-        provide(dynamicInputInjectionKey, {
-            mergedThemeRef: themeRef,
-            keyPlaceholderRef: toRef(props, 'keyPlaceholder'),
-            valuePlaceholderRef: toRef(props, 'valuePlaceholder'),
-            placeholderRef: toRef(props, 'placeholder')
-        });
-        const rtlEnabledRef = useRtl('DynamicInput', mergedRtlRef, mergedClsPrefixRef);
-        const cssVarsRef = computed(() => {
-            const { self: { actionMargin, actionMarginRtl } } = themeRef.value;
-            return {
-                '--action-margin': actionMargin,
-                '--action-margin-rtl': actionMarginRtl
-            };
-        });
-        const themeClassHandle = inlineThemeDisabled
-            ? useThemeClass('dynamic-input', undefined, cssVarsRef, props)
-            : undefined;
-        return {
-            locale: useLocale('DynamicInput').localeRef,
-            rtlEnabled: rtlEnabledRef,
-            buttonSize: buttonSizeRef,
-            mergedClsPrefix: mergedClsPrefixRef,
-            NFormItem,
-            uncontrolledValue: uncontrolledValueRef,
-            mergedValue: mergedValueRef,
-            insertionDisabled: insertionDisabledRef,
-            removeDisabled: removeDisabledRef,
-            handleCreateClick,
-            ensureKey,
-            handleValueChange,
-            remove,
-            move,
-            createItem,
-            mergedTheme: themeRef,
-            cssVars: inlineThemeDisabled ? undefined : cssVarsRef,
-            themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
-            onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
-        };
-    },
-    render() {
-        const { $slots, buttonSize, mergedClsPrefix, mergedValue, locale, mergedTheme, keyField, itemStyle, preset, showSortButton, NFormItem, ensureKey, handleValueChange, remove, createItem, move, onRender, disabled } = this;
-        onRender === null || onRender === void 0 ? void 0 : onRender();
-        return (h("div", { class: [
-                `${mergedClsPrefix}-dynamic-input`,
-                this.rtlEnabled && `${mergedClsPrefix}-dynamic-input--rtl`,
-                this.themeClass
-            ], style: this.cssVars }, !Array.isArray(mergedValue) || mergedValue.length === 0 ? (h(NButton, Object.assign({ block: true, ghost: true, dashed: true, size: buttonSize }, this.createButtonProps, { disabled: this.insertionDisabled || disabled, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, onClick: this.handleCreateClick }), {
-            default: () => resolveSlot($slots['create-button-default'], () => [
-                locale.create
-            ]),
-            icon: () => resolveSlot($slots['create-button-icon'], () => [
-                h(NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => h(AddIcon, null) })
-            ])
-        })) : (mergedValue.map((_, index) => (h("div", { key: keyField ? _[keyField] : ensureKey(_, index), "data-key": keyField ? _[keyField] : ensureKey(_, index), class: `${mergedClsPrefix}-dynamic-input-item`, style: itemStyle },
-            resolveSlotWithProps($slots.default, {
-                value: mergedValue[index],
-                index
-            }, () => {
-                return [
-                    preset === 'input' ? (h(NDynamicInputInputPreset, { disabled: disabled, clsPrefix: mergedClsPrefix, value: mergedValue[index], parentPath: NFormItem ? NFormItem.path.value : undefined, path: (NFormItem === null || NFormItem === void 0 ? void 0 : NFormItem.path.value)
-                            ? `${NFormItem.path.value}[${index}]`
-                            : undefined, onUpdateValue: (v) => {
-                            handleValueChange(index, v);
-                        } })) : preset === 'pair' ? (h(NDynamicInputPairPreset, { disabled: disabled, clsPrefix: mergedClsPrefix, value: mergedValue[index], parentPath: NFormItem ? NFormItem.path.value : undefined, path: (NFormItem === null || NFormItem === void 0 ? void 0 : NFormItem.path.value)
-                            ? `${NFormItem.path.value}[${index}]`
-                            : undefined, onUpdateValue: (v) => {
-                            handleValueChange(index, v);
-                        } })) : null
-                ];
-            }),
-            resolveSlotWithProps($slots.action, {
-                value: mergedValue[index],
-                index,
-                create: createItem,
-                remove,
-                move
-            }, () => [
-                h("div", { class: `${mergedClsPrefix}-dynamic-input-item__action` },
-                    h(NButtonGroup, { size: buttonSize }, {
-                        default: () => [
-                            h(NButton, { disabled: this.removeDisabled || disabled, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, circle: true, onClick: () => {
-                                    remove(index);
-                                } }, {
-                                icon: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => h(RemoveIcon, null) }))
-                            }),
-                            h(NButton, { disabled: this.insertionDisabled || disabled, circle: true, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, onClick: () => {
-                                    createItem(index);
-                                } }, {
-                                icon: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => h(AddIcon, null) }))
-                            }),
-                            showSortButton ? (h(NButton, { disabled: index === 0 || disabled, circle: true, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, onClick: () => {
-                                    move('up', index);
-                                } }, {
-                                icon: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix }, {
-                                    default: () => h(ArrowUpIcon, null)
-                                }))
-                            })) : null,
-                            showSortButton ? (h(NButton, { disabled: index === mergedValue.length - 1 || disabled, circle: true, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, onClick: () => {
-                                    move('down', index);
-                                } }, {
-                                icon: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => h(ArrowDownIcon, null) }))
-                            })) : null
-                        ]
-                    }))
-            ])))))));
-    }
-});

package/es/dynamic-input/src/InputPreset.js

@@ -1,37 +0,0 @@
-import { h, defineComponent, inject } from 'vue';
-import { NInput } from '../../input';
-import { dynamicInputInjectionKey } from './interface';
-export default defineComponent({
-    name: 'DynamicInputInputPreset',
-    props: {
-        clsPrefix: {
-            type: String,
-            required: true
-        },
-        value: {
-            type: String,
-            default: ''
-        },
-        disabled: Boolean,
-        parentPath: String,
-        path: String,
-        onUpdateValue: {
-            type: Function,
-            required: true
-        }
-    },
-    setup() {
-        const { mergedThemeRef, placeholderRef
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-         } = inject(dynamicInputInjectionKey);
-        return {
-            mergedTheme: mergedThemeRef,
-            placeholder: placeholderRef
-        };
-    },
-    render() {
-        const { mergedTheme, placeholder, value, clsPrefix, onUpdateValue, disabled } = this;
-        return (h("div", { class: `${clsPrefix}-dynamic-input-preset-input` },
-            h(NInput, { theme: mergedTheme.peers.Input, "theme-overrides": mergedTheme.peerOverrides.Input, value: value, placeholder: placeholder, onUpdateValue: onUpdateValue, disabled: disabled })));
-    }
-});

package/es/dynamic-input/src/PairPreset.js

@@ -1,53 +0,0 @@
-import { defineComponent, h, inject } from 'vue';
-import { NInput } from '../../input';
-import { dynamicInputInjectionKey } from './interface';
-export default defineComponent({
-    name: 'DynamicInputPairPreset',
-    props: {
-        clsPrefix: {
-            type: String,
-            required: true
-        },
-        value: {
-            type: Object,
-            default: () => ({
-                key: '',
-                value: ''
-            })
-        },
-        disabled: Boolean,
-        parentPath: String,
-        path: String,
-        onUpdateValue: {
-            type: Function,
-            required: true
-        }
-    },
-    setup(props) {
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        const { mergedThemeRef, keyPlaceholderRef, valuePlaceholderRef } = inject(dynamicInputInjectionKey);
-        return {
-            mergedTheme: mergedThemeRef,
-            keyPlaceholder: keyPlaceholderRef,
-            valuePlaceholder: valuePlaceholderRef,
-            handleKeyInput(key) {
-                props.onUpdateValue({
-                    key,
-                    value: props.value.value
-                });
-            },
-            handleValueInput(value) {
-                props.onUpdateValue({
-                    key: props.value.key,
-                    value
-                });
-            }
-        };
-    },
-    render() {
-        const { mergedTheme, keyPlaceholder, valuePlaceholder, value, clsPrefix, disabled } = this;
-        return (h("div", { class: `${clsPrefix}-dynamic-input-preset-pair` },
-            h(NInput, { theme: mergedTheme.peers.Input, "theme-overrides": mergedTheme.peerOverrides.Input, value: value.key, class: `${clsPrefix}-dynamic-input-pair-input`, placeholder: keyPlaceholder, onUpdateValue: this.handleKeyInput, disabled: disabled }),
-            h(NInput, { theme: mergedTheme.peers.Input, "theme-overrides": mergedTheme.peerOverrides.Input, value: value.value, class: `${clsPrefix}-dynamic-input-pair-input`, placeholder: valuePlaceholder, onUpdateValue: this.handleValueInput, disabled: disabled })));
-    }
-});

package/es/dynamic-input/src/interface.js

@@ -1,2 +0,0 @@
-import { createInjectionKey } from '../../_utils';
-export const dynamicInputInjectionKey = createInjectionKey('n-dynamic-input');

package/es/dynamic-input/src/styles/index.cssr.js

@@ -1,35 +0,0 @@
-import { c, cB, cM, cE } from '../../../_utils/cssr';
-// vars:
-// --action-margin
-export default cB('dynamic-input', {
-  width: '100%'
-}, [cB('dynamic-input-item', `
- margin-bottom: 10px;
- display: flex;
- flex-wrap: nowrap;
- `, [cB('dynamic-input-preset-input', {
-  flex: 1,
-  alignItems: 'center'
-}), cB('dynamic-input-preset-pair', `
- flex: 1;
- display: flex;
- align-items: center;
- `, [cB('dynamic-input-pair-input', [c('&:first-child', {
-  'margin-right': '12px'
-})])]), cE('action', `
- align-self: flex-start;
- display: flex;
- justify-content: flex-end;
- flex-shrink: 0;
- flex-grow: 0;
- margin: var(--action-margin);
- `, [cM('icon', {
-  cursor: 'pointer'
-})]), c('&:last-child', {
-  marginBottom: 0
-})]), cB('form-item', `
- padding-top: 0 !important;
- margin-right: 0 !important;
- `, [cB('form-item-blank', {
-  paddingTop: '0 !important'
-})])]);

package/es/dynamic-input/src/styles/rtl.cssr.js

@@ -1,9 +0,0 @@
-import { c, cB, cE, cM } from '../../../_utils/cssr';
-export default cB('dynamic-input', [cM('rtl', `
- direction: rtl;
- `, [cB('dynamic-input-preset-pair', [cB('dynamic-input-pair-input', [c('&:first-child', {
-  'margin-left': '12px',
-  'margin-right': '0'
-})])]), cB('dynamic-input-item', [cE('action', `
- margin: var(--action-margin-rtl);
- `)])])]);

package/es/dynamic-input/styles/_common.js

@@ -1,4 +0,0 @@
-export default {
-    actionMargin: '0 0 0 20px',
-    actionMarginRtl: '0 20px 0 0'
-};

package/es/dynamic-input/styles/dark.js

@@ -1,16 +0,0 @@
-import { inputDark } from '../../input/styles';
-import { buttonDark } from '../../button/styles';
-import { commonDark } from '../../_styles/common';
-import commonVariables from './_common';
-const dynamicInputDark = {
-    name: 'DynamicInput',
-    common: commonDark,
-    peers: {
-        Input: inputDark,
-        Button: buttonDark
-    },
-    self() {
-        return commonVariables;
-    }
-};
-export default dynamicInputDark;

package/es/dynamic-input/styles/index.js

@@ -1,3 +0,0 @@
-export { default as dynamicInputDark } from './dark';
-export { default as dynamicInputLight } from './light';
-export { dynamicInputRtl } from './rtl';

package/es/dynamic-input/styles/light.js

@@ -1,18 +0,0 @@
-import { inputLight } from '../../input/styles';
-import { buttonLight } from '../../button/styles';
-import { commonLight } from '../../_styles/common';
-import commonVariables from './_common';
-import { createTheme } from '../../_mixins';
-const self = () => {
-    return commonVariables;
-};
-const dynamicInputLight = createTheme({
-    name: 'DynamicInput',
-    common: commonLight,
-    peers: {
-        Input: inputLight,
-        Button: buttonLight
-    },
-    self
-});
-export default dynamicInputLight;

package/es/dynamic-input/styles/rtl.js

@@ -1,11 +0,0 @@
-import rtlStyle from '../src/styles/rtl.cssr';
-import { inputRtl } from '../../input/styles/rtl';
-import { buttonRtl } from '../../button/styles/rtl';
-import { buttonGroupRtl } from '../../button-group/styles/rtl';
-import { checkboxRtl } from '../../checkbox/styles/rtl';
-import { inputNumberRtl } from '../../input-number/styles/rtl';
-export const dynamicInputRtl = {
-    name: 'DynamicInput',
-    style: rtlStyle,
-    peers: [inputRtl, buttonRtl, buttonGroupRtl, checkboxRtl, inputNumberRtl]
-};

package/es/dynamic-tags/index.js

@@ -1 +0,0 @@
-export { default as NDynamicTags, dynamicTagsProps } from './src/DynamicTags';

package/es/dynamic-tags/src/DynamicTags.js

@@ -1,165 +0,0 @@
-import { h, defineComponent, ref, computed, nextTick, toRef, watchEffect } from 'vue';
-import { useMergedState } from 'vooks';
-import commonProps from '../../tag/src/common-props';
-import { AddIcon } from '../../_internal/icons';
-import { NButton } from '../../button';
-import { NSpace } from '../../space';
-import { NInput } from '../../input';
-import { NTag } from '../../tag';
-import { NBaseIcon } from '../../_internal';
-import { useTheme, useFormItem, useLocale, useConfig, useThemeClass } from '../../_mixins';
-import { call, smallerSize, warnOnce } from '../../_utils';
-import { dynamicTagsLight } from '../styles';
-import style from './styles/index.cssr';
-export const dynamicTagsProps = Object.assign(Object.assign(Object.assign({}, useTheme.props), commonProps), { size: {
-        type: String,
-        default: 'medium'
-    }, closable: {
-        type: Boolean,
-        default: true
-    }, defaultValue: {
-        type: Array,
-        default: () => []
-    }, value: Array, inputStyle: [String, Object], inputProps: Object, max: Number, tagStyle: [String, Object], renderTag: Function, onCreate: {
-        type: Function,
-        default: (label) => label
-    }, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], 
-    // deprecated
-    onChange: [Function, Array] });
-export default defineComponent({
-    name: 'DynamicTags',
-    props: dynamicTagsProps,
-    setup(props) {
-        if (process.env.NODE_ENV !== 'production') {
-            watchEffect(() => {
-                if (props.onChange !== undefined) {
-                    warnOnce('dynamic-tags', '`on-change` is deprecated, please use `on-update:value` instead.');
-                }
-            });
-        }
-        const { mergedClsPrefixRef, inlineThemeDisabled } = useConfig(props);
-        const { localeRef } = useLocale('DynamicTags');
-        const formItem = useFormItem(props);
-        const { mergedDisabledRef } = formItem;
-        const inputValueRef = ref('');
-        const showInputRef = ref(false);
-        const inputForceFocusedRef = ref(true);
-        const inputInstRef = ref(null);
-        const themeRef = useTheme('DynamicTags', '-dynamic-tags', style, dynamicTagsLight, props, mergedClsPrefixRef);
-        const uncontrolledValueRef = ref(props.defaultValue);
-        const controlledValueRef = toRef(props, 'value');
-        const mergedValueRef = useMergedState(controlledValueRef, uncontrolledValueRef);
-        const localizedAddRef = computed(() => {
-            return localeRef.value.add;
-        });
-        const inputSizeRef = computed(() => {
-            return smallerSize(props.size);
-        });
-        const triggerDisabledRef = computed(() => {
-            return (mergedDisabledRef.value ||
-                (!!props.max && mergedValueRef.value.length >= props.max));
-        });
-        function doChange(value) {
-            const { onChange, 'onUpdate:value': _onUpdateValue, onUpdateValue } = props;
-            const { nTriggerFormInput, nTriggerFormChange } = formItem;
-            if (onChange)
-                call(onChange, value);
-            if (onUpdateValue)
-                call(onUpdateValue, value);
-            if (_onUpdateValue)
-                call(_onUpdateValue, value);
-            uncontrolledValueRef.value = value;
-            nTriggerFormInput();
-            nTriggerFormChange();
-        }
-        function handleCloseClick(index) {
-            const tags = mergedValueRef.value.slice(0);
-            tags.splice(index, 1);
-            doChange(tags);
-        }
-        function handleInputKeyUp(e) {
-            switch (e.key) {
-                case 'Enter':
-                    handleInputConfirm();
-            }
-        }
-        function handleInputConfirm(externalValue) {
-            const nextValue = externalValue !== null && externalValue !== void 0 ? externalValue : inputValueRef.value;
-            if (nextValue) {
-                const tags = mergedValueRef.value.slice(0);
-                tags.push(props.onCreate(nextValue));
-                doChange(tags);
-            }
-            showInputRef.value = false;
-            inputForceFocusedRef.value = true;
-            inputValueRef.value = '';
-        }
-        function handleInputBlur() {
-            handleInputConfirm();
-        }
-        function handleAddClick() {
-            showInputRef.value = true;
-            void nextTick(() => {
-                var _a;
-                (_a = inputInstRef.value) === null || _a === void 0 ? void 0 : _a.focus();
-                inputForceFocusedRef.value = false;
-            });
-        }
-        const cssVarsRef = computed(() => {
-            const { self: { inputWidth } } = themeRef.value;
-            return {
-                '--n-input-width': inputWidth
-            };
-        });
-        const themeClassHandle = inlineThemeDisabled
-            ? useThemeClass('dynamic-tags', undefined, cssVarsRef, props)
-            : undefined;
-        return {
-            mergedClsPrefix: mergedClsPrefixRef,
-            inputInstRef,
-            localizedAdd: localizedAddRef,
-            inputSize: inputSizeRef,
-            inputValue: inputValueRef,
-            showInput: showInputRef,
-            inputForceFocused: inputForceFocusedRef,
-            mergedValue: mergedValueRef,
-            mergedDisabled: mergedDisabledRef,
-            triggerDisabled: triggerDisabledRef,
-            handleInputKeyUp,
-            handleAddClick,
-            handleInputBlur,
-            handleCloseClick,
-            handleInputConfirm,
-            mergedTheme: themeRef,
-            cssVars: inlineThemeDisabled ? undefined : cssVarsRef,
-            themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
-            onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
-        };
-    },
-    render() {
-        const { mergedTheme, cssVars, mergedClsPrefix, onRender, renderTag } = this;
-        onRender === null || onRender === void 0 ? void 0 : onRender();
-        return (h(NSpace, { class: [`${mergedClsPrefix}-dynamic-tags`, this.themeClass], size: "small", style: cssVars, theme: mergedTheme.peers.Space, themeOverrides: mergedTheme.peerOverrides.Space, itemStyle: "display: flex;" }, {
-            default: () => {
-                const { mergedTheme, tagStyle, type, round, size, color, closable, mergedDisabled, showInput, inputValue, inputStyle, inputSize, inputForceFocused, triggerDisabled, handleInputKeyUp, handleInputBlur, handleAddClick, handleCloseClick, handleInputConfirm, $slots } = this;
-                return this.mergedValue
-                    .map((tag, index) => renderTag ? (renderTag(tag, index)) : (h(NTag, { key: index, theme: mergedTheme.peers.Tag, themeOverrides: mergedTheme.peerOverrides.Tag, style: tagStyle, type: type, round: round, size: size, color: color, closable: closable, disabled: mergedDisabled, onClose: () => {
-                        handleCloseClick(index);
-                    } }, {
-                    default: () => (typeof tag === 'string' ? tag : tag.label)
-                })))
-                    .concat(showInput ? ($slots.input ? ($slots.input({
-                    submit: handleInputConfirm,
-                    deactivate: handleInputBlur
-                })) : (h(NInput, Object.assign({ placeholder: "", size: inputSize, style: inputStyle, autosize: true }, this.inputProps, { ref: "inputInstRef", value: inputValue, onUpdateValue: (v) => {
-                        this.inputValue = v;
-                    }, theme: mergedTheme.peers.Input, themeOverrides: mergedTheme.peerOverrides.Input, onKeyup: handleInputKeyUp, onBlur: handleInputBlur, internalForceFocus: inputForceFocused })))) : $slots.trigger ? ($slots.trigger({
-                    activate: handleAddClick,
-                    disabled: triggerDisabled
-                })) : (h(NButton, { dashed: true, disabled: triggerDisabled, theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: inputSize, onClick: handleAddClick }, {
-                    icon: () => (h(NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => h(AddIcon, null) }))
-                })));
-            }
-        }));
-    }
-});