naive-ui 2.23.1 → 2.23.2

package/es/layout/src/styles/layout-sider.cssr.js

@@ -1,33 +1,33 @@
 import { c, cB, cE, cM } from '../../../_utils/cssr'; // vars:
-// --bezier
-// --color
-// --text-color
-// --border-color
-// --toggle-button-color
-// --toggle-bar-color
-// --toggle-bar-color-hover
+// --n-bezier
+// --n-color
+// --n-text-color
+// --n-border-color
+// --n-toggle-button-color
+// --n-toggle-bar-color
+// --n-toggle-bar-color-hover
 
 export default cB('layout-sider', `
  flex-shrink: 0;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
- color: var(--text-color);
+ color: var(--n-text-color);
  transition:
- color .3s var(--bezier),
- border-color .3s var(--bezier),
- min-width .3s var(--bezier),
- max-width .3s var(--bezier),
- transform .3s var(--bezier),
- background-color .3s var(--bezier);
- background-color: var(--color);
+ color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier),
+ min-width .3s var(--n-bezier),
+ max-width .3s var(--n-bezier),
+ transform .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
+ background-color: var(--n-color);
  display: flex;
  justify-content: flex-end;
 `, [cM('right-placement', `
  justify-content: flex-start;
  `, [cM('bordered', `
  border-right: none;
- border-left: 1px solid var(--border-color);
+ border-left: 1px solid var(--n-border-color);
  `), cM('collapsed', [cB('layout-toggle-button', [cB('base-icon', `
  transform: rotate(180deg);
  `)]), cB('layout-toggle-bar', [c('&:hover', [cE('top', {
@@ -54,11 +54,11 @@ export default cB('layout-sider', `
  transform: rotate(0);
  `)])]), cB('layout-toggle-button', `
  transition:
- color .3s var(--bezier),
- right .3s var(--bezier),
- left .3s var(--bezier),
- border-color .3s var(--bezier),
- background-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ right .3s var(--n-bezier),
+ left .3s var(--n-bezier),
+ border-color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
  cursor: pointer;
  width: 24px;
  height: 24px;
@@ -70,13 +70,13 @@ export default cB('layout-sider', `
  align-items: center;
  justify-content: center;
  font-size: 18px;
- color: var(--toggle-button-icon-color);
- border: var(--toggle-button-border);
- background-color: var(--toggle-button-color);
+ color: var(--n-toggle-button-icon-color);
+ border: var(--n-toggle-button-border);
+ background-color: var(--n-toggle-button-color);
  box-shadow: 0 2px 4px 0px rgba(0, 0, 0, .06);
  transform: translateX(50%) translateY(-50%);
  `, [cB('base-icon', `
- transition: transform .3s var(--bezier);
+ transition: transform .3s var(--n-bezier);
  transform: rotate(180deg);
  `)]), cB('layout-toggle-bar', `
  cursor: pointer;
@@ -92,8 +92,8 @@ export default cB('layout-sider', `
  height: 38px;
  left: 14px;
  transition: 
- background-color .3s var(--bezier),
- transform .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ transform .3s var(--n-bezier);
  `), cE('bottom', `
  position: absolute;
  top: 34px;
@@ -102,23 +102,23 @@ export default cB('layout-sider', `
 }), cE('bottom', {
   transform: 'rotate(-12deg) scale(1.15) translateY(2px)'
 })]), cE('top, bottom', {
-  backgroundColor: 'var(--toggle-bar-color)'
+  backgroundColor: 'var(--n-toggle-bar-color)'
 }), c('&:hover', [cE('top, bottom', {
-  backgroundColor: 'var(--toggle-bar-color-hover)'
+  backgroundColor: 'var(--n-toggle-bar-color-hover)'
 })])]), cE('border', `
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 1px;
- transition: background-color .3s var(--bezier);
+ transition: background-color .3s var(--n-bezier);
  `), cB('layout-sider-scroll-container', `
  flex-grow: 1;
  flex-shrink: 0;
  box-sizing: border-box;
  height: 100%;
  opacity: 0;
- transition: opacity .3s var(--bezier);
+ transition: opacity .3s var(--n-bezier);
  max-width: 100%;
  `), cM('show-content', [cB('layout-sider-scroll-container', {
   opacity: 1
@@ -128,5 +128,5 @@ export default cB('layout-sider', `
  top: 0;
  bottom: 0;
  `), cM('bordered', `
- border-right: 1px solid var(--border-color);
+ border-right: 1px solid var(--n-border-color);
  `)]);

package/es/layout/src/styles/layout.cssr.js

@@ -1,20 +1,20 @@
 import { cB, cM } from '../../../_utils/cssr'; // vars:
-// --bezier
-// --color
-// --text-color
+// --n-bezier
+// --n-color
+// --n-text-color
 
 export default cB('layout', `
- color: var(--text-color);
- background-color: var(--color);
+ color: var(--n-text-color);
+ background-color: var(--n-color);
  box-sizing: border-box;
  position: relative;
  z-index: auto;
  flex: auto;
  overflow: hidden;
  transition:
- box-shadow .3s var(--bezier),
- background-color .3s var(--bezier),
- color .3s var(--bezier);
+ box-shadow .3s var(--n-bezier),
+ background-color .3s var(--n-bezier),
+ color .3s var(--n-bezier);
 `, [cB('layout-scroll-container', `
  overflow-x: hidden;
  box-sizing: border-box;

package/es/list/src/List.d.ts

@@ -93,16 +93,16 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--font-size': string;
-        '--bezier': string;
-        '--text-color': string;
-        '--color': string;
-        '--border-radius': string;
-        '--border-color': string;
-        '--border-color-modal': string;
-        '--border-color-popover': string;
-        '--color-modal': string;
-        '--color-popover': string;
+        '--n-font-size': string;
+        '--n-bezier': string;
+        '--n-text-color': string;
+        '--n-color': string;
+        '--n-border-radius': string;
+        '--n-border-color': string;
+        '--n-border-color-modal': string;
+        '--n-border-color-popover': string;
+        '--n-color-modal': string;
+        '--n-color-popover': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     size?: unknown;

package/es/list/src/List.js

@@ -24,16 +24,16 @@ export default defineComponent({
             cssVars: computed(() => {
                 const { common: { cubicBezierEaseInOut }, self: { fontSize, textColor, color, colorModal, colorPopover, borderColor, borderColorModal, borderColorPopover, borderRadius } } = themeRef.value;
                 return {
-                    '--font-size': fontSize,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--text-color': textColor,
-                    '--color': color,
-                    '--border-radius': borderRadius,
-                    '--border-color': borderColor,
-                    '--border-color-modal': borderColorModal,
-                    '--border-color-popover': borderColorPopover,
-                    '--color-modal': colorModal,
-                    '--color-popover': colorPopover
+                    '--n-font-size': fontSize,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-text-color': textColor,
+                    '--n-color': color,
+                    '--n-border-radius': borderRadius,
+                    '--n-border-color': borderColor,
+                    '--n-border-color-modal': borderColorModal,
+                    '--n-border-color-popover': borderColorPopover,
+                    '--n-color-modal': colorModal,
+                    '--n-color-popover': colorPopover
                 };
             })
         };

package/es/list/src/styles/index.cssr.js

@@ -1,51 +1,51 @@
 import { cB, c, cE, cM, insideModal, insidePopover } from '../../../_utils/cssr'; // vars:
-// --font-size
-// --bezier
-// --text-color
-// --color
-// --border-radius
-// --border-color
-// --border-color-modal
-// --border-color-popover
-// --color-modal
-// --color-popover
+// --n-font-size
+// --n-bezier
+// --n-text-color
+// --n-color
+// --n-border-radius
+// --n-border-color
+// --n-border-color-modal
+// --n-border-color-popover
+// --n-color-modal
+// --n-color-popover
 
 export default c([cB('list', `
- --merged-border-color: var(--border-color);
- --merged-color: var(--color)
- font-size: var(--font-size);
+ --n-merged-border-color: var(--n-border-color);
+ --n-merged-color: var(--n-color)
+ font-size: var(--n-font-size);
  transition:
- background-color .3s var(--bezier),
- color .3s var(--bezier),
- border-color .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  padding: 0;
  list-style-type: none;
- color: var(--text-color);
- background-color: var(--merged-color);
+ color: var(--n-text-color);
+ background-color: var(--n-merged-color);
  `, [cM('bordered', `
- border-radius: var(--border-radius);
- border: 1px solid var(--merged-border-color);
+ border-radius: var(--n-border-radius);
+ border: 1px solid var(--n-merged-border-color);
  `, [cB('list-item', `
  padding: 12px 20px;
  `, [c('&:not(:last-child)', `
- border-bottom: 1px solid var(--merged-border-color);
+ border-bottom: 1px solid var(--n-merged-border-color);
  `)]), cE('header, footer', `
  padding: 12px 20px;
  `, [c('&:not(:last-child)', `
- border-bottom: 1px solid var(--merged-border-color);
+ border-bottom: 1px solid var(--n-merged-border-color);
  `)])]), cE('header, footer', `
  padding: 12px 0;
  box-sizing: border-box;
- transition: border-color .3s var(--bezier);
+ transition: border-color .3s var(--n-bezier);
  `, [c('&:not(:last-child)', `
- border-bottom: 1px solid var(--merged-border-color);
+ border-bottom: 1px solid var(--n-merged-border-color);
  `)]), cB('list-item', `
  padding: 12px 0; 
  box-sizing: border-box;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
- transition: border-color .3s var(--bezier);
+ transition: border-color .3s var(--n-bezier);
  `, [cE('prefix', `
  margin-right: 20px;
  flex: 0;
@@ -55,11 +55,11 @@ export default c([cB('list', `
  `), cE('main', `
  flex: 1;
  `), c('&:not(:last-child)', `
- border-bottom: 1px solid var(--merged-border-color);
+ border-bottom: 1px solid var(--n-merged-border-color);
  `)])]), insideModal(cB('list', `
- --merged-color: var(--color-modal);
- --merged-border-color: var(--border-color-modal);
+ --merged-color: var(--n-color-modal);
+ --merged-border-color: var(--n-border-color-modal);
  `)), insidePopover(cB('list', `
- --merged-color: var(--color-popover);
- --merged-border-color: var(--border-color-popover);
+ --merged-color: var(--n-color-popover);
+ --merged-border-color: var(--n-border-color-popover);
  `))]);

package/es/loading-bar/src/LoadingBar.d.ts

@@ -13,9 +13,9 @@ declare const _default: import("vue").DefineComponent<{}, {
     handleAfterLeave: () => Promise<void>;
     mergedLoadingBarStyle: import("vue").ComputedRef<string | import("vue").CSSProperties | undefined>;
     cssVars: import("vue").ComputedRef<{
-        '--height': string;
-        '--color-loading': string;
-        '--color-error': string;
+        '--n-height': string;
+        '--n-color-loading': string;
+        '--n-color-error': string;
     }>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{} & {} & {}>, {}>;
 export default _default;

package/es/loading-bar/src/LoadingBar.js

@@ -128,9 +128,9 @@ export default defineComponent({
             cssVars: computed(() => {
                 const { self: { height, colorError, colorLoading } } = themeRef.value;
                 return {
-                    '--height': height,
-                    '--color-loading': colorLoading,
-                    '--color-error': colorError
+                    '--n-height': height,
+                    '--n-color-loading': colorLoading,
+                    '--n-color-error': colorError
                 };
             })
         };

package/es/loading-bar/src/styles/index.cssr.js

@@ -1,8 +1,8 @@
 import { cB, cM } from '../../../_utils/cssr';
 import fadeInTransition from '../../../_styles/transitions/fade-in.cssr'; // vars:
-// --height
-// --color-loading
-// --color-error
+// --n-height
+// --n-color-loading
+// --n-color-error
 
 export default cB('loading-bar-container', `
  z-index: 5999;
@@ -19,16 +19,16 @@ export default cB('loading-bar-container', `
  transition:
  max-width 4s linear,
  background .2s linear;
- height: var(--height);
+ height: var(--n-height);
  `, [cM('starting', `
- background: var(--color-loading);
+ background: var(--n-color-loading);
  `), cM('finishing', `
- background: var(--color-loading);
+ background: var(--n-color-loading);
  transition:
  max-width .2s linear,
  background .2s linear;
  `), cM('error', `
- background: var(--color-error);
+ background: var(--n-color-error);
  transition:
  max-width .2s linear,
  background .2s linear;

package/es/locales/common/frFR.js

@@ -15,18 +15,18 @@ const frFR = {
         loadingRequiredMessage: (label) => `Charger tous les enfants de ${label} avant de le sélectionner`
     },
     Time: {
-        dateFormat: 'dd-MM-yyyy',
-        dateTimeFormat: 'dd-MM-yyyy HH:mm:ss'
+        dateFormat: 'dd/MM/yyyy',
+        dateTimeFormat: 'dd/MM/yyyy HH:mm:ss'
     },
     DatePicker: {
         yearFormat: 'yyyy',
         monthFormat: 'MMM',
         dayFormat: 'eeeeee',
         yearTypeFormat: 'yyyy',
-        monthTypeFormat: 'MM-yyyy',
-        dateFormat: 'dd-MM-yyyy',
-        dateTimeFormat: 'dd-MM-yyyy HH:mm:ss',
-        quarterFormat: 'yyyy-qqq',
+        monthTypeFormat: 'MM/yyyy',
+        dateFormat: 'dd/MM/yyyy',
+        dateTimeFormat: 'dd/MM/yyyy HH:mm:ss',
+        quarterFormat: 'qqq yyyy',
         clear: 'Effacer',
         now: 'Maintenant',
         confirm: 'Confirmer',
@@ -36,8 +36,7 @@ const frFR = {
         datetimePlaceholder: "Sélectionner la date et l'heure",
         monthPlaceholder: 'Sélectionner le mois',
         yearPlaceholder: "Sélectionner l'année",
-        // FIXME: translation needed
-        quarterPlaceholder: 'Select Quarter',
+        quarterPlaceholder: 'Sélectionner le trimestre',
         startDatePlaceholder: 'Date de début',
         endDatePlaceholder: 'Date de fin',
         startDatetimePlaceholder: 'Date et heure de début',

package/es/mention/src/Mention.d.ts

@@ -1093,7 +1093,7 @@ declare const _default: import("vue").DefineComponent<{
     focus: () => void;
     blur: () => void;
     cssVars: import("vue").ComputedRef<{
-        '--menu-box-shadow': string;
+        '--n-menu-box-shadow': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly to?: unknown;

package/es/mention/src/Mention.js

@@ -300,7 +300,7 @@ export default defineComponent({
             cssVars: computed(() => {
                 const { self: { menuBoxShadow } } = themeRef.value;
                 return {
-                    '--menu-box-shadow': menuBoxShadow
+                    '--n-menu-box-shadow': menuBoxShadow
                 };
             })
         };

package/es/mention/src/styles/index.cssr.js

@@ -1,6 +1,6 @@
 import fadeInScaleUp from '../../../_styles/transitions/fade-in-scale-up.cssr';
-import { c, cB } from '../../../_utils/cssr'; // --menu-box-shadow
+import { c, cB } from '../../../_utils/cssr'; // --n-menu-box-shadow
 
 export default c([cB('mention', 'width: 100%; z-index: auto; position: relative;'), cB('mention-menu', `
- box-shadow: var(--menu-box-shadow);
+ box-shadow: var(--n-menu-box-shadow);
  `, [fadeInScaleUp()])]);

package/es/menu/src/Menu.js

@@ -204,55 +204,58 @@ export default defineComponent({
                 const { common: { cubicBezierEaseInOut }, self } = themeRef.value;
                 const { borderRadius, borderColorHorizontal, fontSize, itemHeight, dividerColor } = self;
                 const vars = {
-                    '--divider-color': dividerColor,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--font-size': fontSize,
-                    '--border-color-horizontal': borderColorHorizontal,
-                    '--border-radius': borderRadius,
-                    '--item-height': itemHeight
+                    '--n-divider-color': dividerColor,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-font-size': fontSize,
+                    '--n-border-color-horizontal': borderColorHorizontal,
+                    '--n-border-radius': borderRadius,
+                    '--n-item-height': itemHeight
                 };
                 if (inverted) {
-                    vars['--group-text-color'] = self.groupTextColorInverted;
-                    vars['--color'] = self.colorInverted;
-                    vars['--item-text-color'] = self.itemTextColorInverted;
-                    vars['--arrow-color'] = self.arrowColorInverted;
-                    vars['--arrow-color-hover'] = self.arrowColorHoverInverted;
-                    vars['--arrow-color-active'] = self.arrowColorActiveInverted;
-                    vars['--arrow-color-child-active'] =
+                    vars['--n-group-text-color'] = self.groupTextColorInverted;
+                    vars['--n-color'] = self.colorInverted;
+                    vars['--n-item-text-color'] = self.itemTextColorInverted;
+                    vars['--n-arrow-color'] = self.arrowColorInverted;
+                    vars['--n-arrow-color-hover'] = self.arrowColorHoverInverted;
+                    vars['--n-arrow-color-active'] = self.arrowColorActiveInverted;
+                    vars['--n-arrow-color-child-active'] =
                         self.arrowColorChildActiveInverted;
-                    vars['--item-icon-color'] = self.itemIconColorInverted;
-                    vars['--item-text-color-hover'] = self.itemTextColorHoverInverted;
-                    vars['--item-icon-color-hover'] = self.itemIconColorHoverInverted;
-                    vars['--item-text-color-active'] = self.itemTextColorActiveInverted;
-                    vars['--item-icon-color-active'] = self.itemIconColorActiveInverted;
-                    vars['--item-icon-color-collapsed'] =
+                    vars['--n-item-icon-color'] = self.itemIconColorInverted;
+                    vars['--n-item-text-color-hover'] = self.itemTextColorHoverInverted;
+                    vars['--n-item-icon-color-hover'] = self.itemIconColorHoverInverted;
+                    vars['--n-item-text-color-active'] = self.itemTextColorActiveInverted;
+                    vars['--n-item-icon-color-active'] = self.itemIconColorActiveInverted;
+                    vars['--n-item-icon-color-collapsed'] =
                         self.itemIconColorCollapsedInverted;
-                    vars['--item-color-active'] = self.itemColorActiveInverted;
-                    vars['--item-color-active-collapsed'] =
+                    vars['--n-item-color-active'] = self.itemColorActiveInverted;
+                    vars['--n-item-color-active-collapsed'] =
                         self.itemColorActiveCollapsedInverted;
-                    vars['--item-text-color-child-active'] =
+                    vars['--n-item-text-color-child-active'] =
                         self.itemTextColorChildActiveInverted;
-                    vars['--item-icon-color-child-active'] =
+                    vars['--n-item-icon-color-child-active'] =
                         self.itemIconColorChildActiveInverted;
                 }
                 else {
-                    vars['--group-text-color'] = self.groupTextColor;
-                    vars['--color'] = self.color;
-                    vars['--item-text-color'] = self.itemTextColor;
-                    vars['--arrow-color'] = self.arrowColor;
-                    vars['--arrow-color-hover'] = self.arrowColorHover;
-                    vars['--arrow-color-active'] = self.arrowColorActive;
-                    vars['--arrow-color-child-active'] = self.arrowColorChildActive;
-                    vars['--item-icon-color'] = self.itemIconColor;
-                    vars['--item-text-color-hover'] = self.itemTextColorHover;
-                    vars['--item-icon-color-hover'] = self.itemIconColorHover;
-                    vars['--item-text-color-active'] = self.itemTextColorActive;
-                    vars['--item-icon-color-active'] = self.itemIconColorActive;
-                    vars['--item-icon-color-collapsed'] = self.itemIconColorCollapsed;
-                    vars['--item-color-active'] = self.itemColorActive;
-                    vars['--item-color-active-collapsed'] = self.itemColorActiveCollapsed;
-                    vars['--item-text-color-child-active'] = self.itemTextColorChildActive;
-                    vars['--item-icon-color-child-active'] = self.itemIconColorChildActive;
+                    vars['--n-group-text-color'] = self.groupTextColor;
+                    vars['--n-color'] = self.color;
+                    vars['--n-item-text-color'] = self.itemTextColor;
+                    vars['--n-arrow-color'] = self.arrowColor;
+                    vars['--n-arrow-color-hover'] = self.arrowColorHover;
+                    vars['--n-arrow-color-active'] = self.arrowColorActive;
+                    vars['--n-arrow-color-child-active'] = self.arrowColorChildActive;
+                    vars['--n-item-icon-color'] = self.itemIconColor;
+                    vars['--n-item-text-color-hover'] = self.itemTextColorHover;
+                    vars['--n-item-icon-color-hover'] = self.itemIconColorHover;
+                    vars['--n-item-text-color-active'] = self.itemTextColorActive;
+                    vars['--n-item-icon-color-active'] = self.itemIconColorActive;
+                    vars['--n-item-icon-color-collapsed'] = self.itemIconColorCollapsed;
+                    vars['--n-item-color-active'] = self.itemColorActive;
+                    vars['--n-item-color-active-collapsed'] =
+                        self.itemColorActiveCollapsed;
+                    vars['--n-item-text-color-child-active'] =
+                        self.itemTextColorChildActive;
+                    vars['--n-item-icon-color-child-active'] =
+                        self.itemIconColorChildActive;
                 }
                 return vars;
             })