naive-ui 2.32.2 → 2.33.2

package/lib/data-table/src/DataTable.d.ts

@@ -399,6 +399,7 @@ export declare const dataTableProps: {
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -1105,6 +1106,7 @@ export declare const dataTableProps: {
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -1811,6 +1813,7 @@ export declare const dataTableProps: {
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -2620,6 +2623,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -3326,6 +3330,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -4032,6 +4037,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -4860,6 +4866,7 @@ declare const _default: import("vue").DefineComponent<{
                 boxShadowDisabled: string;
                 color: string;
                 colorDisabled: string;
+                colorActive: string;
                 textColor: string;
                 textColorDisabled: string;
                 dotColorActive: string;
@@ -6035,6 +6042,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -6741,6 +6749,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;
@@ -7447,6 +7456,7 @@ declare const _default: import("vue").DefineComponent<{
             boxShadowDisabled: string;
             color: string;
             colorDisabled: string;
+            colorActive: string;
             textColor: string;
             textColorDisabled: string;
             dotColorActive: string;

package/lib/data-table/src/HeaderButton/FilterButton.d.ts

@@ -414,6 +414,7 @@ declare const _default: import("vue").DefineComponent<{
                 boxShadowDisabled: string;
                 color: string;
                 colorDisabled: string;
+                colorActive: string;
                 textColor: string;
                 textColorDisabled: string;
                 dotColorActive: string;

package/lib/data-table/src/HeaderButton/FilterMenu.d.ts

@@ -439,6 +439,7 @@ declare const _default: import("vue").DefineComponent<{
                 boxShadowDisabled: string;
                 color: string;
                 colorDisabled: string;
+                colorActive: string;
                 textColor: string;
                 textColorDisabled: string;
                 dotColorActive: string;

package/lib/data-table/src/TableParts/Body.d.ts

@@ -438,6 +438,7 @@ declare const _default: import("vue").DefineComponent<{
                 boxShadowDisabled: string;
                 color: string;
                 colorDisabled: string;
+                colorActive: string;
                 textColor: string;
                 textColorDisabled: string;
                 dotColorActive: string;

package/lib/data-table/src/TableParts/Cell.d.ts

@@ -423,6 +423,7 @@ declare const _default: import("vue").DefineComponent<{
                     boxShadowDisabled: string;
                     color: string;
                     colorDisabled: string;
+                    colorActive: string;
                     textColor: string;
                     textColorDisabled: string;
                     dotColorActive: string;
@@ -1579,6 +1580,7 @@ declare const _default: import("vue").DefineComponent<{
                     boxShadowDisabled: string;
                     color: string;
                     colorDisabled: string;
+                    colorActive: string;
                     textColor: string;
                     textColorDisabled: string;
                     dotColorActive: string;

package/lib/data-table/src/TableParts/Header.d.ts

@@ -426,6 +426,7 @@ declare const _default: import("vue").DefineComponent<{
                 boxShadowDisabled: string;
                 color: string;
                 colorDisabled: string;
+                colorActive: string;
                 textColor: string;
                 textColorDisabled: string;
                 dotColorActive: string;

package/lib/data-table/src/use-sorter.js

@@ -162,7 +162,7 @@ function useSorter(props, { dataRelatedColsRef, filteredDataRef }) {
             const columnToSort = dataRelatedColsRef.value.find((column) => column.type !== 'selection' &&
                 column.type !== 'expand' &&
                 column.key === columnKey);
-            if (!columnToSort || !columnToSort.sorter)
+            if (!(columnToSort === null || columnToSort === void 0 ? void 0 : columnToSort.sorter))
                 return;
             const sorter = columnToSort.sorter;
             deriveNextSorter({

package/lib/data-table/styles/light.d.ts

@@ -346,6 +346,7 @@ declare const dataTableLight: import("../../_mixins").Theme<"DataTable", {
         boxShadowDisabled: string;
         color: string;
         colorDisabled: string;
+        colorActive: string;
         textColor: string;
         textColorDisabled: string;
         dotColorActive: string;

package/lib/dialog/index.d.ts

@@ -3,4 +3,4 @@ export { dialogProps } from './src/dialogProps';
 export type { DialogProps } from './src/dialogProps';
 export { NDialogProvider, dialogProviderProps } from './src/DialogProvider';
 export type { DialogProviderProps, DialogProviderInst, DialogOptions, DialogReactive, DialogApiInjection as DialogApi } from './src/DialogProvider';
-export { useDialog } from './src/use-dialog';
+export { useDialog, useDialogReactiveList } from './src/composables';

package/lib/dialog/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDialog = exports.dialogProviderProps = exports.NDialogProvider = exports.dialogProps = exports.NDialog = void 0;
+exports.useDialogReactiveList = exports.useDialog = exports.dialogProviderProps = exports.NDialogProvider = exports.dialogProps = exports.NDialog = void 0;
 var Dialog_1 = require("./src/Dialog");
 Object.defineProperty(exports, "NDialog", { enumerable: true, get: function () { return Dialog_1.NDialog; } });
 var dialogProps_1 = require("./src/dialogProps");
@@ -8,5 +8,6 @@ Object.defineProperty(exports, "dialogProps", { enumerable: true, get: function
 var DialogProvider_1 = require("./src/DialogProvider");
 Object.defineProperty(exports, "NDialogProvider", { enumerable: true, get: function () { return DialogProvider_1.NDialogProvider; } });
 Object.defineProperty(exports, "dialogProviderProps", { enumerable: true, get: function () { return DialogProvider_1.dialogProviderProps; } });
-var use_dialog_1 = require("./src/use-dialog");
-Object.defineProperty(exports, "useDialog", { enumerable: true, get: function () { return use_dialog_1.useDialog; } });
+var composables_1 = require("./src/composables");
+Object.defineProperty(exports, "useDialog", { enumerable: true, get: function () { return composables_1.useDialog; } });
+Object.defineProperty(exports, "useDialogReactiveList", { enumerable: true, get: function () { return composables_1.useDialogReactiveList; } });

package/lib/dialog/src/DialogEnvironment.d.ts

@@ -1,5 +1,6 @@
 import { PropType, CSSProperties } from 'vue';
 export declare const exposedDialogEnvProps: {
+    readonly onAfterEnter: PropType<() => void>;
     readonly blockScroll: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -56,6 +57,7 @@ export declare const NDialogEnvironment: import("vue").DefineComponent<{
         type: PropType<(key: string) => void>;
         required: true;
     };
+    onAfterEnter: PropType<() => void>;
     blockScroll: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -121,6 +123,7 @@ export declare const NDialogEnvironment: import("vue").DefineComponent<{
         type: PropType<(key: string) => void>;
         required: true;
     };
+    onAfterEnter: PropType<() => void>;
     blockScroll: {
         readonly type: BooleanConstructor;
         readonly default: true;

package/lib/dialog/src/DialogEnvironment.js

@@ -11,7 +11,7 @@ const Modal_1 = __importDefault(require("../../modal/src/Modal"));
 const _utils_1 = require("../../_utils");
 const Dialog_1 = require("./Dialog");
 const dialogProps_1 = require("./dialogProps");
-exports.exposedDialogEnvProps = Object.assign(Object.assign({}, dialogProps_1.dialogProps), { blockScroll: { type: Boolean, default: true }, closeOnEsc: { type: Boolean, default: true }, onEsc: Function, autoFocus: {
+exports.exposedDialogEnvProps = Object.assign(Object.assign({}, dialogProps_1.dialogProps), { onAfterEnter: Function, blockScroll: { type: Boolean, default: true }, closeOnEsc: { type: Boolean, default: true }, onEsc: Function, autoFocus: {
         type: Boolean,
         default: true
     }, internalStyle: [String, Object], maskClosable: {
@@ -106,7 +106,7 @@ exports.NDialogEnvironment = (0, vue_1.defineComponent)({
     },
     render() {
         const { handlePositiveClick, handleUpdateShow, handleNegativeClick, handleCloseClick, handleAfterLeave, handleMaskClick, handleEsc, to, maskClosable, show } = this;
-        return ((0, vue_1.h)(Modal_1.default, { show: show, onUpdateShow: handleUpdateShow, onMaskClick: handleMaskClick, onEsc: handleEsc, to: to, maskClosable: maskClosable, onAfterLeave: handleAfterLeave, closeOnEsc: this.closeOnEsc, blockScroll: this.blockScroll, autoFocus: this.autoFocus, internalAppear: true, internalDialog: true }, {
+        return ((0, vue_1.h)(Modal_1.default, { show: show, onUpdateShow: handleUpdateShow, onMaskClick: handleMaskClick, onEsc: handleEsc, to: to, maskClosable: maskClosable, onAfterEnter: this.onAfterEnter, onAfterLeave: handleAfterLeave, closeOnEsc: this.closeOnEsc, blockScroll: this.blockScroll, autoFocus: this.autoFocus, internalAppear: true, internalDialog: true }, {
             default: () => ((0, vue_1.h)(Dialog_1.NDialog, Object.assign({}, (0, _utils_1.keep)(this.$props, dialogProps_1.dialogPropKeys), { style: this.internalStyle, onClose: handleCloseClick, onNegativeClick: handleNegativeClick, onPositiveClick: handlePositiveClick })))
         }));
     }

package/lib/dialog/src/DialogProvider.d.ts

@@ -2,6 +2,7 @@ import { ExtractPropTypes, PropType, Ref, CSSProperties } from 'vue';
 import type { ExtractPublicPropTypes, Mutable } from '../../_utils';
 import { exposedDialogEnvProps } from './DialogEnvironment';
 export declare type DialogOptions = Mutable<Omit<Partial<ExtractPropTypes<typeof exposedDialogEnvProps>>, 'internalStyle'> & {
+    class?: any;
     style?: string | CSSProperties;
 }>;
 export declare type DialogReactive = {
@@ -23,6 +24,7 @@ export interface DialogProviderInjection {
         y: number;
     } | null>;
 }
+export declare type DialogReactiveListInjection = Ref<DialogReactive[]>;
 interface DialogInst {
     hide: () => void;
 }
@@ -42,6 +44,7 @@ export declare const NDialogProvider: import("vue").DefineComponent<{
         type?: "default" | "error" | "info" | "success" | "warning" | undefined;
         content?: string | (() => import("vue").VNodeChild) | undefined;
         icon?: (() => import("vue").VNodeChild) | undefined;
+        onAfterEnter?: (() => void) | undefined;
         title?: string | (() => import("vue").VNodeChild) | undefined;
         action?: (() => import("vue").VNodeChild) | undefined;
         autoFocus?: boolean | undefined;
@@ -736,6 +739,7 @@ export declare const NDialogProvider: import("vue").DefineComponent<{
         onMaskClick?: ((e: MouseEvent) => void) | undefined;
         maskClosable?: boolean | undefined;
         closeOnEsc?: boolean | undefined;
+        class?: any;
         style?: any;
     }[]>;
     dialogInstRefs: Record<string, DialogInst>;

package/lib/dialog/src/DialogProvider.js

@@ -48,6 +48,7 @@ exports.NDialogProvider = (0, vue_1.defineComponent)({
             clickedRef: (0, vooks_1.useClicked)(64),
             clickPositionRef: (0, vooks_1.useClickPosition)()
         });
+        (0, vue_1.provide)(context_1.dialogReactiveListInjectionKey, dialogListRef);
         return Object.assign(Object.assign({}, api), { dialogList: dialogListRef, dialogInstRefs,
             handleAfterLeave });
     },

package/lib/dialog/src/composables.d.ts

@@ -0,0 +1,4 @@
+import { Ref } from 'vue';
+import type { DialogApiInjection, DialogReactive } from './DialogProvider';
+export declare function useDialog(): DialogApiInjection;
+export declare function useDialogReactiveList(): Ref<readonly DialogReactive[]>;

package/lib/dialog/src/{use-dialog.js → composables.js}

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDialog = void 0;
+exports.useDialogReactiveList = exports.useDialog = void 0;
 const vue_1 = require("vue");
 const context_1 = require("./context");
 const _utils_1 = require("../../_utils");
@@ -12,3 +12,11 @@ function useDialog() {
     return dialog;
 }
 exports.useDialog = useDialog;
+function useDialogReactiveList() {
+    const dialogReactiveList = (0, vue_1.inject)(context_1.dialogReactiveListInjectionKey, null);
+    if (dialogReactiveList === null) {
+        (0, _utils_1.throwError)('use-dialog-reactive-list', 'No outer <n-dialog-provider /> founded.');
+    }
+    return dialogReactiveList;
+}
+exports.useDialogReactiveList = useDialogReactiveList;

package/lib/dialog/src/context.d.ts

@@ -1,3 +1,4 @@
-import type { DialogApiInjection, DialogProviderInjection } from './DialogProvider';
+import type { DialogApiInjection, DialogProviderInjection, DialogReactiveListInjection } from './DialogProvider';
 export declare const dialogProviderInjectionKey: import("vue").InjectionKey<DialogProviderInjection>;
 export declare const dialogApiInjectionKey: import("vue").InjectionKey<DialogApiInjection>;
+export declare const dialogReactiveListInjectionKey: import("vue").InjectionKey<DialogReactiveListInjection>;

package/lib/dialog/src/context.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.dialogApiInjectionKey = exports.dialogProviderInjectionKey = void 0;
+exports.dialogReactiveListInjectionKey = exports.dialogApiInjectionKey = exports.dialogProviderInjectionKey = void 0;
 const _utils_1 = require("../../_utils");
 exports.dialogProviderInjectionKey = (0, _utils_1.createInjectionKey)('n-dialog-provider');
 exports.dialogApiInjectionKey = (0, _utils_1.createInjectionKey)('n-dialog-api');
+exports.dialogReactiveListInjectionKey = (0, _utils_1.createInjectionKey)('n-dialog-reactive-list');

package/lib/form/src/FormItem.d.ts

@@ -283,6 +283,7 @@ declare const _default: import("vue").DefineComponent<{
     mergedValidationStatus: import("vue").ComputedRef<"error" | "success" | "warning" | undefined>;
     mergedShowFeedback: import("vue").ComputedRef<boolean>;
     mergedShowLabel: import("vue").ComputedRef<boolean>;
+    isAutoLabelWidth: import("vue").ComputedRef<boolean>;
     labelElementRef: import("vue").Ref<HTMLLabelElement | null>;
     mergedClsPrefix: import("vue").ComputedRef<string>;
     mergedRequired: import("vue").ComputedRef<boolean>;

package/lib/form/src/FormItem.js

@@ -255,8 +255,15 @@ exports.default = (0, vue_1.defineComponent)({
         };
         const labelElementRef = (0, vue_1.ref)(null);
         (0, vue_1.onMounted)(() => {
-            if (labelElementRef.value !== null) {
-                NForm === null || NForm === void 0 ? void 0 : NForm.deriveMaxChildLabelWidth(Number(getComputedStyle(labelElementRef.value).width.slice(0, -2)));
+            if (!formItemMiscRefs.isAutoLabelWidth.value)
+                return;
+            const labelElement = labelElementRef.value;
+            if (labelElement !== null) {
+                const memoizedWhitespace = labelElement.style.whiteSpace;
+                labelElement.style.whiteSpace = 'nowrap';
+                labelElement.style.width = '';
+                NForm === null || NForm === void 0 ? void 0 : NForm.deriveMaxChildLabelWidth(Number(getComputedStyle(labelElement).width.slice(0, -2)));
+                labelElement.style.whiteSpace = memoizedWhitespace;
             }
         });
         const cssVarsRef = (0, vue_1.computed)(() => {
@@ -296,34 +303,36 @@ exports.default = (0, vue_1.defineComponent)({
         return Object.assign(Object.assign(Object.assign(Object.assign({ labelElementRef, mergedClsPrefix: mergedClsPrefixRef, mergedRequired: mergedRequiredRef, feedbackId: feedbackIdRef, renderExplains: renderExplainsRef }, formItemMiscRefs), formItemSizeRefs), exposedRef), { 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() {
-        var _a;
         const { $slots, mergedClsPrefix, mergedShowLabel, mergedShowRequireMark, mergedRequireMarkPlacement, onRender } = this;
         const renderedShowRequireMark = mergedShowRequireMark !== undefined
             ? mergedShowRequireMark
             : this.mergedRequired;
         onRender === null || onRender === void 0 ? void 0 : onRender();
+        const renderLabel = () => {
+            const labelText = this.$slots.label ? this.$slots.label() : this.label;
+            if (!labelText)
+                return null;
+            const textNode = ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-form-item-label__text` }, labelText));
+            const markNode = renderedShowRequireMark ? ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-form-item-label__asterisk` }, mergedRequireMarkPlacement !== 'left' ? '\u00A0*' : '*\u00A0')) : (mergedRequireMarkPlacement === 'right-hanging' && ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-form-item-label__asterisk-placeholder` }, '\u00A0*')));
+            const { labelProps } = this;
+            return ((0, vue_1.h)("label", Object.assign({}, labelProps, { class: [
+                    labelProps === null || labelProps === void 0 ? void 0 : labelProps.class,
+                    `${mergedClsPrefix}-form-item-label`,
+                    `${mergedClsPrefix}-form-item-label--${mergedRequireMarkPlacement}-mark`
+                ], style: this.mergedLabelStyle, ref: "labelElementRef" }), mergedRequireMarkPlacement === 'left'
+                ? [markNode, textNode]
+                : [textNode, markNode]));
+        };
         return ((0, vue_1.h)("div", { class: [
                 `${mergedClsPrefix}-form-item`,
                 this.themeClass,
                 `${mergedClsPrefix}-form-item--${this.mergedSize}-size`,
                 `${mergedClsPrefix}-form-item--${this.mergedLabelPlacement}-labelled`,
+                this.isAutoLabelWidth &&
+                    `${mergedClsPrefix}-form-item--auto-label-width`,
                 !mergedShowLabel && `${mergedClsPrefix}-form-item--no-label`
             ], style: this.cssVars },
-            mergedShowLabel && (this.label || $slots.label) ? ((0, vue_1.h)("label", Object.assign({}, this.labelProps, { class: [
-                    (_a = this.labelProps) === null || _a === void 0 ? void 0 : _a.class,
-                    `${mergedClsPrefix}-form-item-label`
-                ], style: this.mergedLabelStyle, ref: "labelElementRef" }),
-                mergedRequireMarkPlacement !== 'left'
-                    ? $slots.label
-                        ? $slots.label()
-                        : this.label
-                    : null,
-                renderedShowRequireMark ? ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-form-item-label__asterisk` }, mergedRequireMarkPlacement !== 'left' ? '\u00A0*' : '*\u00A0')) : (mergedRequireMarkPlacement === 'right-hanging' && ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-form-item-label__asterisk-placeholder` }, '\u00A0*'))),
-                mergedRequireMarkPlacement === 'left'
-                    ? $slots.label
-                        ? $slots.label()
-                        : this.label
-                    : null)) : null,
+            mergedShowLabel && renderLabel(),
             (0, vue_1.h)("div", { class: [
                     `${mergedClsPrefix}-form-item-blank`,
                     this.mergedValidationStatus &&

package/lib/form/src/styles/form-item.cssr.js

@@ -25,61 +25,83 @@ const fade_down_cssr_1 = require("../../../_styles/transitions/fade-down.cssr");
 // --n-label-padding
 
 
-exports.default = (0, cssr_1.cB)('form-item', {
-  display: 'grid',
-  lineHeight: 'var(--n-line-height)'
-}, [(0, cssr_1.cB)('form-item-label', `
+exports.default = (0, cssr_1.cB)('form-item', `
+ display: grid;
+ line-height: var(--n-line-height);
+`, [(0, cssr_1.cB)('form-item-label', `
  grid-area: label;
  align-items: center;
  line-height: 1.25;
  text-align: var(--n-label-text-align);
  font-size: var(--n-label-font-size);
- height: var(--n-label-height);
+ min-height: var(--n-label-height);
  padding: var(--n-label-padding);
  color: var(--n-label-text-color);
  transition: color .3s var(--n-bezier);
  box-sizing: border-box;
  `, [(0, cssr_1.cE)('asterisk', `
+ white-space: nowrap;
  user-select: none;
  -webkit-user-select: none;
  color: var(--n-asterisk-color);
  transition: color .3s var(--n-bezier);
  `), (0, cssr_1.cE)('asterisk-placeholder', `
+ grid-area: mark;
  user-select: none;
  -webkit-user-select: none;
  visibility: hidden; 
- `)]), (0, cssr_1.cB)('form-item-blank', {
-  gridArea: 'blank',
-  minHeight: 'var(--n-blank-height)'
-}), (0, cssr_1.cM)('left-labelled', `
+ `)]), (0, cssr_1.cB)('form-item-blank', `
+ grid-area: blank;
+ min-height: var(--n-blank-height);
+ `), (0, cssr_1.cM)('auto-label-width', [(0, cssr_1.cB)('form-item-label', 'white-space: nowrap;')]), (0, cssr_1.cM)('left-labelled', `
  grid-template-areas:
  "label blank"
  "label feedback";
  grid-template-columns: auto minmax(0, 1fr);
+ grid-template-rows: auto 1fr;
+ align-items: start;
  `, [(0, cssr_1.cB)('form-item-label', `
- height: var(--n-blank-height);
- line-height: var(--n-blank-height);
+ display: grid;
+ grid-template-columns: 1fr auto;
+ min-height: var(--n-blank-height);
+ height: auto;
  box-sizing: border-box;
- white-space: nowrap;
  flex-shrink: 0;
  flex-grow: 0;
- `)]), (0, cssr_1.cM)('top-labelled', `
+ `, [(0, cssr_1.cM)('left-mark', `
+ grid-template-areas:
+ "mark text"
+ ". text";
+ `), (0, cssr_1.cM)('right-mark', `
+ grid-template-areas: 
+ "text mark"
+ "text .";
+ `), (0, cssr_1.cM)('right-hanging-mark', `
+ grid-template-areas: 
+ "text mark"
+ "text .";
+ `), (0, cssr_1.cE)('text', `
+ grid-area: text; 
+ `), (0, cssr_1.cE)('asterisk', `
+ grid-area: mark; 
+ align-self: end;
+ `)])]), (0, cssr_1.cM)('top-labelled', `
  grid-template-areas:
  "label"
  "blank"
  "feedback";
- grid-template-rows: var(--n-label-height) 1fr;
+ grid-template-rows: minmax(var(--n-label-height), auto) 1fr;
  grid-template-columns: minmax(0, 100%);
  `, [(0, cssr_1.cM)('no-label', `
  grid-template-areas:
  "blank"
  "feedback";
  grid-template-rows: 1fr;
- `), (0, cssr_1.cB)('form-item-label', {
-  display: 'flex',
-  alignItems: 'flex-end',
-  justifyContent: 'var(--n-label-text-align)'
-})]), (0, cssr_1.cB)('form-item-blank', `
+ `), (0, cssr_1.cB)('form-item-label', `
+ display: flex;
+ align-items: flex-start;
+ justify-content: var(--n-label-text-align);
+ `)]), (0, cssr_1.cB)('form-item-blank', `
  box-sizing: border-box;
  display: flex;
  align-items: center;

package/lib/form/src/utils.d.ts

@@ -14,6 +14,7 @@ export declare function formItemMisc(props: FormItemSetupProps): {
     mergedValidationStatus: ComputedRef<"error" | "success" | "warning" | undefined>;
     mergedShowFeedback: ComputedRef<boolean>;
     mergedShowLabel: ComputedRef<boolean>;
+    isAutoLabelWidth: ComputedRef<boolean>;
 };
 export declare function formItemRule(props: FormItemSetupProps): {
     mergedRules: ComputedRef<FormItemRule[]>;

package/lib/form/src/utils.js

@@ -21,6 +21,18 @@ exports.formItemSize = formItemSize;
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 function formItemMisc(props) {
     const NForm = (0, vue_1.inject)(context_1.formInjectionKey, null);
+    const mergedLabelPlacementRef = (0, vue_1.computed)(() => {
+        const { labelPlacement } = props;
+        if (labelPlacement !== undefined)
+            return labelPlacement;
+        if (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelPlacement)
+            return NForm.props.labelPlacement;
+        return 'top';
+    });
+    const isAutoLabelWidthRef = (0, vue_1.computed)(() => {
+        return (mergedLabelPlacementRef.value === 'left' &&
+            (props.labelWidth === 'auto' || (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelWidth) === 'auto'));
+    });
     const mergedLabelWidthRef = (0, vue_1.computed)(() => {
         if (mergedLabelPlacementRef.value === 'top')
             return;
@@ -28,7 +40,7 @@ function formItemMisc(props) {
         if (labelWidth !== undefined && labelWidth !== 'auto') {
             return (0, _utils_1.formatLength)(labelWidth);
         }
-        if (labelWidth === 'auto' || (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelWidth) === 'auto') {
+        if (isAutoLabelWidthRef.value) {
             const autoComputedWidth = NForm === null || NForm === void 0 ? void 0 : NForm.maxChildLabelWidthRef.value;
             if (autoComputedWidth !== undefined) {
                 return (0, _utils_1.formatLength)(autoComputedWidth);
@@ -42,14 +54,6 @@ function formItemMisc(props) {
         }
         return undefined;
     });
-    const mergedLabelPlacementRef = (0, vue_1.computed)(() => {
-        const { labelPlacement } = props;
-        if (labelPlacement !== undefined)
-            return labelPlacement;
-        if (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelPlacement)
-            return NForm.props.labelPlacement;
-        return 'top';
-    });
     const mergedLabelAlignRef = (0, vue_1.computed)(() => {
         const { labelAlign } = props;
         if (labelAlign)
@@ -114,7 +118,8 @@ function formItemMisc(props) {
         mergedRequireMarkPlacement: mergedRequireMarkPlacementRef,
         mergedValidationStatus: mergedValidationStatusRef,
         mergedShowFeedback: mergedShowFeedbackRef,
-        mergedShowLabel: mergedShowLabelRef
+        mergedShowLabel: mergedShowLabelRef,
+        isAutoLabelWidth: isAutoLabelWidthRef
     };
 }
 exports.formItemMisc = formItemMisc;

package/lib/input/src/utils.js

@@ -19,7 +19,7 @@ function useCursor(inputElRef) {
     const selectionRef = (0, vue_1.ref)(null);
     function recordCursor() {
         const { value: input } = inputElRef;
-        if (!input || !input.focus) {
+        if (!(input === null || input === void 0 ? void 0 : input.focus)) {
             reset();
             return;
         }

package/lib/locales/common/frFR.js

@@ -43,9 +43,8 @@ const frFR = {
         endDatePlaceholder: 'Date de fin',
         startDatetimePlaceholder: 'Date et heure de début',
         endDatetimePlaceholder: 'Date et heure de fin',
-        // FIXME: translation needed
-        startMonthPlaceholder: 'Start Month',
-        endMonthPlaceholder: 'End Month',
+        startMonthPlaceholder: 'Mois de début',
+        endMonthPlaceholder: 'Mois de fin',
         monthBeforeYear: true,
         firstDayOfWeek: 1,
         today: "Aujourd'hui"
@@ -60,13 +59,12 @@ const frFR = {
         sourceTitle: 'Source',
         targetTitle: 'Cible'
     },
-    // TODO: translation
     Transfer: {
-        selectAll: 'Select all',
-        unselectAll: 'Unselect all',
-        clearAll: 'Clear',
-        total: (num) => `Total ${num} items`,
-        selected: (num) => `${num} items selected`
+        selectAll: 'Sélectionner tout',
+        unselectAll: 'Désélectionner tout',
+        clearAll: 'Effacer',
+        total: (num) => `Total ${num} éléments`,
+        selected: (num) => `${num} éléments sélectionnés`
     },
     Empty: {
         description: 'Aucune donnée'
@@ -117,8 +115,7 @@ const frFR = {
         tipZoomOut: 'Dézoomer',
         tipZoomIn: 'Zoomer',
         tipClose: 'Fermer (Échap.)',
-        // TODO: translation
-        tipOriginalSize: 'Zoom to original size'
+        tipOriginalSize: 'Zoom à la taille originale'
     }
 };
 exports.default = frFR;

package/lib/menu/src/Menu.d.ts

@@ -42,6 +42,10 @@ export declare const menuProps: {
         readonly type: StringConstructor;
         readonly default: "children";
     };
+    readonly disabledField: {
+        readonly type: StringConstructor;
+        readonly default: "disabled";
+    };
     readonly defaultExpandAll: BooleanConstructor;
     readonly defaultExpandedKeys: PropType<Key[]>;
     readonly expandedKeys: PropType<Key[]>;
@@ -648,6 +652,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: "children";
     };
+    readonly disabledField: {
+        readonly type: StringConstructor;
+        readonly default: "disabled";
+    };
     readonly defaultExpandAll: BooleanConstructor;
     readonly defaultExpandedKeys: PropType<Key[]>;
     readonly expandedKeys: PropType<Key[]>;
@@ -1585,6 +1593,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: "children";
     };
+    readonly disabledField: {
+        readonly type: StringConstructor;
+        readonly default: "disabled";
+    };
     readonly defaultExpandAll: BooleanConstructor;
     readonly defaultExpandedKeys: PropType<Key[]>;
     readonly expandedKeys: PropType<Key[]>;
@@ -2163,6 +2175,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly defaultExpandAll: boolean;
     readonly indent: number;
     readonly inverted: boolean;
+    readonly disabledField: string;
     readonly accordion: boolean;
     readonly collapsed: boolean | undefined;
     readonly collapsedWidth: number;