naive-ui 2.41.1 → 2.42.0

package/dist/index.js

@@ -32126,7 +32126,6 @@
   display: inline-block;
   position: relative;
   fill: currentColor;
-  transform: translateZ(0);
 `, [c$1("svg", `
     height: 1em;
     width: 1em;
@@ -40560,6 +40559,7 @@
     var Link = vue.defineComponent({
       name: "AnchorLink",
       props: anchorLinkProps,
+      slots: Object,
       setup(props, { slots }) {
         const titleRef = vue.ref(null);
         const NAnchor = vue.inject(anchorInjectionKey);
@@ -40602,7 +40602,9 @@
                 title: getTitleAttribute(props.title),
                 onClick: handleClick
               },
-              props.title
+              {
+                default: () => resolveSlot(slots.title, () => [props.title])
+              }
             ),
             slots.default?.()
           );
@@ -62960,14 +62962,10 @@
   `), cB("radio-input", `
     position: absolute;
     border: 0;
-    border-radius: inherit;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
+    width: 0;
+    height: 0;
     opacity: 0;
-    z-index: 1;
-    cursor: pointer;
+    margin: 0;
   `), cE("dot", `
     position: absolute;
     top: 50%;
@@ -63265,7 +63263,15 @@
             ],
             style: this.cssVars
           },
-          /* @__PURE__ */ vue.h(
+          /* @__PURE__ */ vue.h("div", { class: `${mergedClsPrefix}-radio__dot-wrapper` }, "\xA0", /* @__PURE__ */ vue.h(
+            "div",
+            {
+              class: [
+                `${mergedClsPrefix}-radio__dot`,
+                this.renderSafeChecked && `${mergedClsPrefix}-radio__dot--checked`
+              ]
+            }
+          ), /* @__PURE__ */ vue.h(
             "input",
             {
               ref: "inputRef",
@@ -63279,15 +63285,6 @@
               onFocus: this.handleRadioInputFocus,
               onBlur: this.handleRadioInputBlur
             }
-          ),
-          /* @__PURE__ */ vue.h("div", { class: `${mergedClsPrefix}-radio__dot-wrapper` }, "\xA0", /* @__PURE__ */ vue.h(
-            "div",
-            {
-              class: [
-                `${mergedClsPrefix}-radio__dot`,
-                this.renderSafeChecked && `${mergedClsPrefix}-radio__dot--checked`
-              ]
-            }
           )),
           resolveWrappedSlot($slots.default, (children) => {
             if (!children && !label)
@@ -64744,7 +64741,6 @@
   display: inline-block;
   position: relative;
   fill: currentColor;
-  transform: translateZ(0);
 `, [cM("color-transition", {
       transition: "color .3s var(--n-bezier)"
     }), cM("depth", {
@@ -69490,7 +69486,7 @@
         type: Boolean,
         default: void 0
       },
-      timerPickerFormat: {
+      timePickerFormat: {
         type: String,
         value: TIME_FORMAT
       },
@@ -70938,7 +70934,7 @@
         if (typeof startTime !== "number") {
           startTime = getTime(startTime);
         }
-        if (source !== "shortcutPreview") {
+        if (source !== "shortcutPreview" && source !== "shortcutDone") {
           let startDefaultTime;
           let endDefaultTime;
           if (type === "datetimerange") {
@@ -70960,7 +70956,7 @@
             endTime = getTime(set(endTime, endDefaultTime));
           }
         }
-        panelCommon.doUpdateValue([startTime, endTime], props.panel && source === "done");
+        panelCommon.doUpdateValue([startTime, endTime], props.panel && (source === "done" || source === "shortcutDone"));
       }
       function sanitizeValue(datetime) {
         if (type === "datetimerange") {
@@ -71097,7 +71093,7 @@
       function handleRangeShortcutClick(shortcut) {
         const shortcutValue = panelCommon.getShortcutValue(shortcut);
         if (!Array.isArray(shortcutValue)) return;
-        changeStartEndTime(shortcutValue[0], shortcutValue[1], "done");
+        changeStartEndTime(shortcutValue[0], shortcutValue[1], "shortcutDone");
         panelCommon.clearPendingValue();
         handleConfirmClick();
       }
@@ -74209,7 +74205,7 @@
             {
               size: this.timePickerSize,
               placeholder: this.locale.selectTime,
-              format: this.timerPickerFormat,
+              format: this.timePickerFormat,
               ...Array.isArray(timePickerProps) ? void 0 : timePickerProps,
               showIcon: false,
               to: false,
@@ -74445,7 +74441,7 @@
             NTimePicker,
             {
               placeholder: this.locale.selectTime,
-              format: this.timerPickerFormat,
+              format: this.timePickerFormat,
               size: this.timePickerSize,
               ...Array.isArray(timePickerProps) ? timePickerProps[0] : timePickerProps,
               value: this.startTimeValue,
@@ -74479,7 +74475,7 @@
             NTimePicker,
             {
               placeholder: this.locale.selectTime,
-              format: this.timerPickerFormat,
+              format: this.timePickerFormat,
               size: this.timePickerSize,
               ...Array.isArray(timePickerProps) ? timePickerProps[1] : timePickerProps,
               disabled: this.isSelecting,
@@ -75082,7 +75078,7 @@
       endPlaceholder: String,
       format: String,
       dateFormat: String,
-      timerPickerFormat: String,
+      timePickerFormat: String,
       actions: Array,
       shortcuts: Object,
       isDateDisabled: Function,
@@ -76452,7 +76448,7 @@
           onPrevMonth: this.onPrevMonth,
           onNextYear: this.onNextYear,
           onPrevYear: this.onPrevYear,
-          timerPickerFormat: this.timerPickerFormat,
+          timePickerFormat: this.timePickerFormat,
           dateFormat: this.dateFormat,
           calendarDayFormat: this.calendarDayFormat,
           calendarHeaderYearFormat: this.calendarHeaderYearFormat,
@@ -90861,10 +90857,19 @@
     display: flex;
     align-items: center;
     gap: var(--n-gap);
-  `, [cB("input", `
-      width: var(--n-input-width);
-      text-align: center;
-    `)])]);
+  `, [cM("block", ``, [cB("input", ``, [cNotM("autosize", `
+          text-align: center;
+          min-width: 0;
+        `), cM("autosize", `
+          text-align: center;
+          min-width: 0;
+        `)])]), cNotM("block", ``, [cB("input", ``, [cNotM("autosize", `
+          width: var(--n-input-width);
+          text-align: center;
+        `), cM("autosize", `
+          width: var(--n-input-width);
+          text-align: center;
+        `)])])])]);
 
     const inputOtpProps = {
       ...useTheme.props,
@@ -90874,6 +90879,7 @@
         type: Number,
         default: 6
       },
+      block: Boolean,
       size: String,
       disabled: Boolean,
       mask: Boolean,
@@ -91018,6 +91024,9 @@
           nTriggerFormChange();
         }
         const handlePaste = (e, index) => {
+          if (props.readonly || mergedDisabledRef.value) {
+            return;
+          }
           e.preventDefault();
           const { clipboardData } = e;
           const text = clipboardData?.getData("text");
@@ -91050,9 +91059,11 @@
           }
         };
         const handleKeydown = (e, index) => {
+          if (mergedDisabledRef.value)
+            return;
           const keyCode = e.code || e.key;
           const currentValue = justifyValue(mergedValueRef.value);
-          if (keyCode === "Backspace") {
+          if (keyCode === "Backspace" && !props.readonly) {
             e.preventDefault();
             currentValue[Math.max(index, 0)] = "";
             doUpdateValue(currentValue, { diff: "", index, source: "delete" });
@@ -91126,7 +91137,8 @@
             class: [
               `${mergedClsPrefix}-input-otp`,
               themeClass,
-              this.rtlEnabled && `${mergedClsPrefix}-input-otp--rtl`
+              this.rtlEnabled && `${mergedClsPrefix}-input-otp--rtl`,
+              this.block && `${mergedClsPrefix}-input-otp--block`
             ]
           },
           repeat(this.length, void 0).map(
@@ -105433,7 +105445,6 @@
     box-sizing: border-box;
     padding: var(--n-node-wrapper-padding);
   `), cB("tree-node", `
-    transform: translate3d(0,0,0);
     position: relative;
     display: flex;
     border-radius: var(--n-node-border-radius);
@@ -110862,7 +110873,7 @@
       });
     }
 
-    var version = "2.41.1";
+    var version = "2.42.0";
 
     function create({
       componentPrefix = "N",

package/dist/index.mjs

@@ -32122,7 +32122,6 @@ var style$1E = cB("base-icon", `
   display: inline-block;
   position: relative;
   fill: currentColor;
-  transform: translateZ(0);
 `, [c$1("svg", `
     height: 1em;
     width: 1em;
@@ -40556,6 +40555,7 @@ const anchorLinkProps = {
 var Link = defineComponent({
   name: "AnchorLink",
   props: anchorLinkProps,
+  slots: Object,
   setup(props, { slots }) {
     const titleRef = ref(null);
     const NAnchor = inject(anchorInjectionKey);
@@ -40598,7 +40598,9 @@ var Link = defineComponent({
             title: getTitleAttribute(props.title),
             onClick: handleClick
           },
-          props.title
+          {
+            default: () => resolveSlot(slots.title, () => [props.title])
+          }
         ),
         slots.default?.()
       );
@@ -62956,14 +62958,10 @@ var style$12 = cB("radio", `
   `), cB("radio-input", `
     position: absolute;
     border: 0;
-    border-radius: inherit;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
+    width: 0;
+    height: 0;
     opacity: 0;
-    z-index: 1;
-    cursor: pointer;
+    margin: 0;
   `), cE("dot", `
     position: absolute;
     top: 50%;
@@ -63261,7 +63259,15 @@ var NRadio = defineComponent({
         ],
         style: this.cssVars
       },
-      /* @__PURE__ */ h(
+      /* @__PURE__ */ h("div", { class: `${mergedClsPrefix}-radio__dot-wrapper` }, "\xA0", /* @__PURE__ */ h(
+        "div",
+        {
+          class: [
+            `${mergedClsPrefix}-radio__dot`,
+            this.renderSafeChecked && `${mergedClsPrefix}-radio__dot--checked`
+          ]
+        }
+      ), /* @__PURE__ */ h(
         "input",
         {
           ref: "inputRef",
@@ -63275,15 +63281,6 @@ var NRadio = defineComponent({
           onFocus: this.handleRadioInputFocus,
           onBlur: this.handleRadioInputBlur
         }
-      ),
-      /* @__PURE__ */ h("div", { class: `${mergedClsPrefix}-radio__dot-wrapper` }, "\xA0", /* @__PURE__ */ h(
-        "div",
-        {
-          class: [
-            `${mergedClsPrefix}-radio__dot`,
-            this.renderSafeChecked && `${mergedClsPrefix}-radio__dot--checked`
-          ]
-        }
       )),
       resolveWrappedSlot($slots.default, (children) => {
         if (!children && !label)
@@ -64740,7 +64737,6 @@ var style$$ = cB("icon", `
   display: inline-block;
   position: relative;
   fill: currentColor;
-  transform: translateZ(0);
 `, [cM("color-transition", {
   transition: "color .3s var(--n-bezier)"
 }), cM("depth", {
@@ -69486,7 +69482,7 @@ const usePanelCommonProps = {
     type: Boolean,
     default: void 0
   },
-  timerPickerFormat: {
+  timePickerFormat: {
     type: String,
     value: TIME_FORMAT
   },
@@ -70934,7 +70930,7 @@ function useDualCalendar(props, type) {
     if (typeof startTime !== "number") {
       startTime = getTime(startTime);
     }
-    if (source !== "shortcutPreview") {
+    if (source !== "shortcutPreview" && source !== "shortcutDone") {
       let startDefaultTime;
       let endDefaultTime;
       if (type === "datetimerange") {
@@ -70956,7 +70952,7 @@ function useDualCalendar(props, type) {
         endTime = getTime(set(endTime, endDefaultTime));
       }
     }
-    panelCommon.doUpdateValue([startTime, endTime], props.panel && source === "done");
+    panelCommon.doUpdateValue([startTime, endTime], props.panel && (source === "done" || source === "shortcutDone"));
   }
   function sanitizeValue(datetime) {
     if (type === "datetimerange") {
@@ -71093,7 +71089,7 @@ function useDualCalendar(props, type) {
   function handleRangeShortcutClick(shortcut) {
     const shortcutValue = panelCommon.getShortcutValue(shortcut);
     if (!Array.isArray(shortcutValue)) return;
-    changeStartEndTime(shortcutValue[0], shortcutValue[1], "done");
+    changeStartEndTime(shortcutValue[0], shortcutValue[1], "shortcutDone");
     panelCommon.clearPendingValue();
     handleConfirmClick();
   }
@@ -74205,7 +74201,7 @@ var DatetimePanel = defineComponent({
         {
           size: this.timePickerSize,
           placeholder: this.locale.selectTime,
-          format: this.timerPickerFormat,
+          format: this.timePickerFormat,
           ...Array.isArray(timePickerProps) ? void 0 : timePickerProps,
           showIcon: false,
           to: false,
@@ -74441,7 +74437,7 @@ var DatetimerangePanel = defineComponent({
         NTimePicker,
         {
           placeholder: this.locale.selectTime,
-          format: this.timerPickerFormat,
+          format: this.timePickerFormat,
           size: this.timePickerSize,
           ...Array.isArray(timePickerProps) ? timePickerProps[0] : timePickerProps,
           value: this.startTimeValue,
@@ -74475,7 +74471,7 @@ var DatetimerangePanel = defineComponent({
         NTimePicker,
         {
           placeholder: this.locale.selectTime,
-          format: this.timerPickerFormat,
+          format: this.timePickerFormat,
           size: this.timePickerSize,
           ...Array.isArray(timePickerProps) ? timePickerProps[1] : timePickerProps,
           disabled: this.isSelecting,
@@ -75078,7 +75074,7 @@ const datePickerProps = {
   endPlaceholder: String,
   format: String,
   dateFormat: String,
-  timerPickerFormat: String,
+  timePickerFormat: String,
   actions: Array,
   shortcuts: Object,
   isDateDisabled: Function,
@@ -76448,7 +76444,7 @@ var DatePicker = defineComponent({
       onPrevMonth: this.onPrevMonth,
       onNextYear: this.onNextYear,
       onPrevYear: this.onPrevYear,
-      timerPickerFormat: this.timerPickerFormat,
+      timePickerFormat: this.timePickerFormat,
       dateFormat: this.dateFormat,
       calendarDayFormat: this.calendarDayFormat,
       calendarHeaderYearFormat: this.calendarHeaderYearFormat,
@@ -90857,10 +90853,19 @@ var style$D = c$1([cB("input-otp", `
     display: flex;
     align-items: center;
     gap: var(--n-gap);
-  `, [cB("input", `
-      width: var(--n-input-width);
-      text-align: center;
-    `)])]);
+  `, [cM("block", ``, [cB("input", ``, [cNotM("autosize", `
+          text-align: center;
+          min-width: 0;
+        `), cM("autosize", `
+          text-align: center;
+          min-width: 0;
+        `)])]), cNotM("block", ``, [cB("input", ``, [cNotM("autosize", `
+          width: var(--n-input-width);
+          text-align: center;
+        `), cM("autosize", `
+          width: var(--n-input-width);
+          text-align: center;
+        `)])])])]);
 
 const inputOtpProps = {
   ...useTheme.props,
@@ -90870,6 +90875,7 @@ const inputOtpProps = {
     type: Number,
     default: 6
   },
+  block: Boolean,
   size: String,
   disabled: Boolean,
   mask: Boolean,
@@ -91014,6 +91020,9 @@ var InputOtp = defineComponent({
       nTriggerFormChange();
     }
     const handlePaste = (e, index) => {
+      if (props.readonly || mergedDisabledRef.value) {
+        return;
+      }
       e.preventDefault();
       const { clipboardData } = e;
       const text = clipboardData?.getData("text");
@@ -91046,9 +91055,11 @@ var InputOtp = defineComponent({
       }
     };
     const handleKeydown = (e, index) => {
+      if (mergedDisabledRef.value)
+        return;
       const keyCode = e.code || e.key;
       const currentValue = justifyValue(mergedValueRef.value);
-      if (keyCode === "Backspace") {
+      if (keyCode === "Backspace" && !props.readonly) {
         e.preventDefault();
         currentValue[Math.max(index, 0)] = "";
         doUpdateValue(currentValue, { diff: "", index, source: "delete" });
@@ -91122,7 +91133,8 @@ var InputOtp = defineComponent({
         class: [
           `${mergedClsPrefix}-input-otp`,
           themeClass,
-          this.rtlEnabled && `${mergedClsPrefix}-input-otp--rtl`
+          this.rtlEnabled && `${mergedClsPrefix}-input-otp--rtl`,
+          this.block && `${mergedClsPrefix}-input-otp--block`
         ]
       },
       repeat(this.length, void 0).map(
@@ -105429,7 +105441,6 @@ var style$a = cB("tree", `
     box-sizing: border-box;
     padding: var(--n-node-wrapper-padding);
   `), cB("tree-node", `
-    transform: translate3d(0,0,0);
     position: relative;
     display: flex;
     border-radius: var(--n-node-border-radius);
@@ -110858,7 +110869,7 @@ function useThemeVars() {
   });
 }
 
-var version = "2.41.1";
+var version = "2.42.0";
 
 function create({
   componentPrefix = "N",