naive-ui 2.23.1 → 2.23.2

package/lib/empty/src/Empty.js

@@ -11,10 +11,10 @@ const _internal_1 = require("../../_internal");
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 const ConfigProvider_1 = require("../../config-provider/src/ConfigProvider");
-const emptyProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { description: {
-        type: String,
-        default: undefined
-    }, showDescription: {
+const emptyProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { description: String, showDescription: {
+        type: Boolean,
+        default: true
+    }, showIcon: {
         type: Boolean,
         default: true
     }, size: {
@@ -48,12 +48,12 @@ exports.default = (0, vue_1.defineComponent)({
                 const { size } = props;
                 const { common: { cubicBezierEaseInOut }, self: { [(0, _utils_1.createKey)('iconSize', size)]: iconSize, [(0, _utils_1.createKey)('fontSize', size)]: fontSize, textColor, iconColor, extraTextColor } } = themeRef.value;
                 return {
-                    '--icon-size': iconSize,
-                    '--font-size': fontSize,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--text-color': textColor,
-                    '--icon-color': iconColor,
-                    '--extra-text-color': extraTextColor
+                    '--n-icon-size': iconSize,
+                    '--n-font-size': fontSize,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-text-color': textColor,
+                    '--n-icon-color': iconColor,
+                    '--n-extra-text-color': extraTextColor
                 };
             })
         };
@@ -61,9 +61,9 @@ exports.default = (0, vue_1.defineComponent)({
     render() {
         const { $slots, mergedClsPrefix } = this;
         return ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty`, style: this.cssVars },
-            (0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty__icon` }, (0, vue_1.renderSlot)($slots, 'icon', undefined, () => [
+            this.showIcon ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty__icon` }, (0, vue_1.renderSlot)($slots, 'icon', undefined, () => [
                 (0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: this.mergedRenderIcon })
-            ])),
+            ]))) : null,
             this.showDescription ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty__description` }, (0, vue_1.renderSlot)($slots, 'default', undefined, () => [
                 this.localizedDescription
             ]))) : null,

package/lib/empty/src/styles/index.cssr.js

@@ -5,34 +5,35 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars:
-// --font-size
-// --icon-size
-// --icon-color
-// --bezier
-// --text-color
-// --extra-text-color
+// --n-font-size
+// --n-icon-size
+// --n-icon-color
+// --n-bezier
+// --n-text-color
+// --n-extra-text-color
 
 
 exports.default = (0, cssr_1.cB)('empty', `
  display: flex;
  flex-direction: column;
  align-items: center;
- font-size: var(--font-size);
+ font-size: var(--n-font-size);
 `, [(0, cssr_1.cE)('icon', `
- width: var(--icon-size);
- height: var(--icon-size);
- font-size: var(--icon-size);
- line-height: var(--icon-size);
- color: var(--icon-color);
+ width: var(--n-icon-size);
+ height: var(--n-icon-size);
+ font-size: var(--n-icon-size);
+ line-height: var(--n-icon-size);
+ color: var(--n-icon-color);
  transition:
- color .3s var(--bezier);
- `), (0, cssr_1.cE)('description', `
+ color .3s var(--n-bezier);
+ `, [(0, cssr_1.c)('+', [(0, cssr_1.cE)('description', `
  margin-top: 8px;
- transition: color .3s var(--bezier);
- color: var(--text-color);
+ `)])]), (0, cssr_1.cE)('description', `
+ transition: color .3s var(--n-bezier);
+ color: var(--n-text-color);
  `), (0, cssr_1.cE)('extra', `
  text-align: center;
- transition: color .3s var(--bezier);
+ transition: color .3s var(--n-bezier);
  margin-top: 12px;
- color: var(--extra-text-color);
+ color: var(--n-extra-text-color);
  `)]);

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

@@ -249,21 +249,21 @@ declare const _default: import("vue").DefineComponent<{
     }, any>>>;
 }, {
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--line-height': string;
-        '--blank-height': string;
-        '--label-font-size': string;
-        '--label-text-align': string;
-        '--label-height': string;
-        '--label-padding': string;
-        '--asterisk-color': string;
-        '--label-text-color': string;
-        '--feedback-padding': string;
-        '--feedback-font-size': string;
-        '--feedback-height': string;
-        '--feedback-text-color': string;
-        '--feedback-text-color-warning': string;
-        '--feedback-text-color-error': string;
+        '--n-bezier': string;
+        '--n-line-height': string;
+        '--n-blank-height': string;
+        '--n-label-font-size': string;
+        '--n-label-text-align': string;
+        '--n-label-height': string;
+        '--n-label-padding': string;
+        '--n-asterisk-color': string;
+        '--n-label-text-color': string;
+        '--n-feedback-padding': string;
+        '--n-feedback-font-size': string;
+        '--n-feedback-height': string;
+        '--n-feedback-text-color': string;
+        '--n-feedback-text-color-warning': string;
+        '--n-feedback-text-color-error': string;
     }>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;

package/lib/form/src/FormItem.js

@@ -243,21 +243,21 @@ exports.default = (0, vue_1.defineComponent)({
                         mergedLabelTextAlign === 'right' ? 'flex-end' : 'flex-start';
                 }
                 const cssVars = {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--line-height': lineHeight,
-                    '--blank-height': blankHeight,
-                    '--label-font-size': labelFontSize,
-                    '--label-text-align': mergedLabelTextAlign,
-                    '--label-height': labelHeight,
-                    '--label-padding': labelPadding,
-                    '--asterisk-color': asteriskColor,
-                    '--label-text-color': labelTextColor,
-                    '--feedback-padding': feedbackPadding,
-                    '--feedback-font-size': feedbackFontSize,
-                    '--feedback-height': feedbackHeight,
-                    '--feedback-text-color': feedbackTextColor,
-                    '--feedback-text-color-warning': feedbackTextColorWarning,
-                    '--feedback-text-color-error': feedbackTextColorError
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-line-height': lineHeight,
+                    '--n-blank-height': blankHeight,
+                    '--n-label-font-size': labelFontSize,
+                    '--n-label-text-align': mergedLabelTextAlign,
+                    '--n-label-height': labelHeight,
+                    '--n-label-padding': labelPadding,
+                    '--n-asterisk-color': asteriskColor,
+                    '--n-label-text-color': labelTextColor,
+                    '--n-feedback-padding': feedbackPadding,
+                    '--n-feedback-font-size': feedbackFontSize,
+                    '--n-feedback-height': feedbackHeight,
+                    '--n-feedback-text-color': feedbackTextColor,
+                    '--n-feedback-text-color-warning': feedbackTextColorWarning,
+                    '--n-feedback-text-color-error': feedbackTextColorError
                 };
                 return cssVars;
             }) });

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

@@ -277,6 +277,12 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: 0;
     };
 }, {
+    formItemInstRef: import("vue").Ref<{
+        validate: import("./interface").FormItemValidate;
+        restoreValidation: () => void;
+        path?: string | undefined;
+        internalValidate: import("./interface").FormItemInternalValidate;
+    } | null>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

package/lib/form/src/FormItemCol.js

@@ -44,6 +44,7 @@ exports.default = (0, vue_1.defineComponent)({
             }
         };
         return {
+            formItemInstRef,
             validate,
             restoreValidation
         };

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

@@ -277,6 +277,12 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: true;
     };
 }, {
+    formItemInstRef: import("vue").Ref<{
+        validate: import("./interface").FormItemValidate;
+        restoreValidation: () => void;
+        path?: string | undefined;
+        internalValidate: import("./interface").FormItemInternalValidate;
+    } | null>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

package/lib/form/src/FormItemGridItem.js

@@ -46,6 +46,7 @@ exports.default = (0, vue_1.defineComponent)({
             }
         };
         return {
+            formItemInstRef,
             validate,
             restoreValidation
         };

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

@@ -288,6 +288,12 @@ declare const _default: import("vue").DefineComponent<{
     alignItems: StringConstructor;
     justifyContent: StringConstructor;
 }, {
+    formItemColInstRef: import("vue").Ref<{
+        validate: import("./interface").FormItemValidate;
+        restoreValidation: () => void;
+        path?: string | undefined;
+        internalValidate: import("./interface").FormItemInternalValidate;
+    } | null>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

package/lib/form/src/FormItemRow.js

@@ -42,6 +42,7 @@ exports.default = (0, vue_1.defineComponent)({
             }
         };
         return {
+            formItemColInstRef,
             validate,
             restoreValidation
         };

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

@@ -13,52 +13,52 @@ Object.defineProperty(exports, "__esModule", {
 const cssr_1 = require("../../../_utils/cssr");
 
 const fade_down_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-down.cssr")); // vars:
-// --line-height
-// --blank-height
-// --feedback-padding
-// --feedback-font-size
-// --label-font-size-left
-// --label-font-size-top
-// --label-height
-// --label-padding
-// --asterisk-color
-// --label-text-color
-// --bezier
-// --feedback-text-color
-// --feedback-text-color-warning
-// --feedback-text-color-error
-// --label-text-align
-// --label-padding
+// --n-line-height
+// --n-blank-height
+// --n-feedback-padding
+// --n-feedback-font-size
+// --n-label-font-size-left
+// --n-label-font-size-top
+// --n-label-height
+// --n-label-padding
+// --n-asterisk-color
+// --n-label-text-color
+// --n-bezier
+// --n-feedback-text-color
+// --n-feedback-text-color-warning
+// --n-feedback-text-color-error
+// --n-label-text-align
+// --n-label-padding
 
 
 exports.default = (0, cssr_1.cB)('form-item', {
   display: 'grid',
-  lineHeight: 'var(--line-height)'
+  lineHeight: 'var(--n-line-height)'
 }, [(0, cssr_1.cB)('form-item-label', `
  grid-area: label;
  align-items: center;
  line-height: 1.25;
- text-align: var(--label-text-align);
- font-size: var(--label-font-size);
- height: var(--label-height);
- padding: var(--label-padding);
- color: var(--label-text-color);
- transition: color .3s var(--bezier);
+ text-align: var(--n-label-text-align);
+ font-size: var(--n-label-font-size);
+ 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', `
- color: var(--asterisk-color);
- transition: color .3s var(--bezier);
+ color: var(--n-asterisk-color);
+ transition: color .3s var(--n-bezier);
  `)]), (0, cssr_1.cB)('form-item-blank', {
   gridArea: 'blank',
-  minHeight: 'var(--blank-height)'
+  minHeight: 'var(--n-blank-height)'
 }), (0, cssr_1.cM)('left-labelled', `
  grid-template-areas:
  "label blank"
  "label feedback";
  grid-template-columns: auto minmax(0, 1fr);
  `, [(0, cssr_1.cB)('form-item-label', `
- height: var(--blank-height);
- line-height: var(--blank-height);
+ height: var(--n-blank-height);
+ line-height: var(--n-blank-height);
  box-sizing: border-box;
  white-space: nowrap;
  flex-shrink: 0;
@@ -68,7 +68,7 @@ exports.default = (0, cssr_1.cB)('form-item', {
  "label"
  "blank"
  "feedback";
- grid-template-rows: var(--label-height) 1fr;
+ grid-template-rows: var(--n-label-height) 1fr;
  grid-template-columns: minmax(0, 100%);
  `, [(0, cssr_1.cM)('no-label', `
  grid-template-areas:
@@ -78,7 +78,7 @@ exports.default = (0, cssr_1.cB)('form-item', {
  `), (0, cssr_1.cB)('form-item-label', {
   display: 'flex',
   alignItems: 'flex-end',
-  justifyContent: 'var(--label-text-align)'
+  justifyContent: 'var(--n-label-text-align)'
 })]), (0, cssr_1.cB)('form-item-blank', `
  box-sizing: border-box;
  display: flex;
@@ -87,18 +87,18 @@ exports.default = (0, cssr_1.cB)('form-item', {
  `), (0, cssr_1.cB)('form-item-feedback-wrapper', `
  grid-area: feedback;
  box-sizing: border-box;
- min-height: var(--feedback-height);
- font-size: var(--feedback-font-size);
- padding: var(--feedback-padding);
+ min-height: var(--n-feedback-height);
+ font-size: var(--n-feedback-font-size);
+ padding: var(--n-feedback-padding);
  line-height: 1.25;
  transform-origin: top left;
  `, [(0, cssr_1.cB)('form-item-feedback', {
-  transition: 'color .3s var(--bezier)',
-  color: 'var(--feedback-text-color)'
+  transition: 'color .3s var(--n-bezier)',
+  color: 'var(--n-feedback-text-color)'
 }, [(0, cssr_1.cM)('warning', {
-  color: 'var(--feedback-text-color-warning)'
+  color: 'var(--n-feedback-text-color-warning)'
 }), (0, cssr_1.cM)('error', {
-  color: 'var(--feedback-text-color-error)'
+  color: 'var(--n-feedback-text-color-error)'
 }), (0, fade_down_cssr_1.default)({
   fromOffset: '-3px',
   enterDuration: '.3s',

package/lib/gradient-text/src/GradientText.d.ts

@@ -115,11 +115,11 @@ declare const _default: import("vue").DefineComponent<{
     styleFontSize: import("vue").ComputedRef<string | number | undefined>;
     styleBgImage: import("vue").ComputedRef<string | undefined>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--rotate': string;
-        '--color-start': string;
-        '--color-end': string;
-        '--font-weight': string;
+        '--n-bezier': string;
+        '--n-rotate': string;
+        '--n-color-start': string;
+        '--n-color-end': string;
+        '--n-font-weight': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;

package/lib/gradient-text/src/GradientText.js

@@ -53,11 +53,11 @@ exports.default = (0, vue_1.defineComponent)({
                 const { value: type } = compatibleTypeRef;
                 const { common: { cubicBezierEaseInOut }, self: { rotate, [(0, _utils_1.createKey)('colorStart', type)]: colorStart, [(0, _utils_1.createKey)('colorEnd', type)]: colorEnd, fontWeight } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--rotate': rotate,
-                    '--color-start': colorStart,
-                    '--color-end': colorEnd,
-                    '--font-weight': fontWeight
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-rotate': rotate,
+                    '--n-color-start': colorStart,
+                    '--n-color-end': colorEnd,
+                    '--n-font-weight': fontWeight
                 };
             })
         };

package/lib/gradient-text/src/styles/index.cssr.js

@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars:
-// --font-weight
-// --rotate
-// --bezier
-// --color-start
-// --color-end
+// --n-font-weight
+// --n-rotate
+// --n-bezier
+// --n-color-start
+// --n-color-end
 
 
 exports.default = (0, cssr_1.cB)('gradient-text', `
  display: inline-block;
- font-weight: var(--font-weight);
+ font-weight: var(--n-font-weight);
  -webkit-background-clip: text;
  background-clip: text;
  color: #0000;
  white-space: nowrap;
- background-image: linear-gradient(var(--rotate), var(--color-start) 0%, var(--color-end) 100%);
+ background-image: linear-gradient(var(--n-rotate), var(--n-color-start) 0%, var(--n-color-end) 100%);
  transition:
- --color-start .3s var(--bezier),
- --color-end .3s var(--bezier);
+ --n-color-start .3s var(--n-bezier),
+ --n-color-end .3s var(--n-bezier);
 `);

package/lib/icon/src/Icon.d.ts

@@ -35,13 +35,13 @@ declare const _default: import("vue").DefineComponent<{
         color: string | undefined;
     }>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--color': string;
-        '--opacity': string;
+        '--n-bezier': string;
+        '--n-color': string;
+        '--n-opacity': string;
     } | {
-        '--bezier': string;
-        '--color'?: undefined;
-        '--opacity'?: undefined;
+        '--n-bezier': string;
+        '--n-color'?: undefined;
+        '--n-opacity'?: undefined;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     depth?: unknown;

package/lib/icon/src/Icon.js

@@ -31,13 +31,13 @@ exports.default = (0, vue_1.defineComponent)({
                 if (depth !== undefined) {
                     const { color, [`opacity${depth}Depth`]: opacity } = self;
                     return {
-                        '--bezier': cubicBezierEaseInOut,
-                        '--color': color,
-                        '--opacity': opacity
+                        '--n-bezier': cubicBezierEaseInOut,
+                        '--n-color': color,
+                        '--n-opacity': opacity
                     };
                 }
                 return {
-                    '--bezier': cubicBezierEaseInOut
+                    '--n-bezier': cubicBezierEaseInOut
                 };
             })
         };

package/lib/icon/src/styles/index.cssr.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars:
-// --bezier
-// --color
-// --opacity
+// --n-bezier
+// --n-color
+// --n-opacity
 
 
 exports.default = (0, cssr_1.cB)('icon', `
@@ -20,12 +20,12 @@ exports.default = (0, cssr_1.cB)('icon', `
  fill: currentColor;
  transform: translateZ(0);
 `, [(0, cssr_1.cM)('color-transition', {
-  transition: 'color .3s var(--bezier)'
+  transition: 'color .3s var(--n-bezier)'
 }), (0, cssr_1.cM)('depth', {
-  color: 'var(--color)'
+  color: 'var(--n-color)'
 }, [(0, cssr_1.c)('svg', {
-  opacity: 'var(--opacity)',
-  transition: 'opacity .3s var(--bezier)'
+  opacity: 'var(--n-opacity)',
+  transition: 'opacity .3s var(--n-bezier)'
 })]), (0, cssr_1.c)('svg', {
   height: '1em',
   width: '1em'

package/lib/image/src/ImagePreview.d.ts

@@ -14,8 +14,8 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--icon-color': string;
+        '--n-bezier': string;
+        '--n-icon-color': string;
     }>;
     setThumbnailEl: (e: HTMLImageElement | null) => void;
     setPreviewSrc: (src?: string | undefined) => void;

package/lib/image/src/ImagePreview.js

@@ -44,7 +44,7 @@ exports.default = (0, vue_1.defineComponent)({
             const ty = tbox.top + tbox.height / 2;
             style.transformOrigin = `${tx}px ${ty}px`;
         }
-        function handleKeyup(e) {
+        function handleKeydown(e) {
             var _a, _b;
             switch (e.code) {
                 case 'ArrowLeft':
@@ -58,14 +58,15 @@ exports.default = (0, vue_1.defineComponent)({
                     break;
             }
         }
-        if (props.onPrev) {
-            (0, vue_1.watch)(showRef, (value) => {
-                if (value)
-                    (0, evtd_1.on)('keyup', document, handleKeyup);
-                else
-                    (0, evtd_1.off)('keyup', document, handleKeyup);
-            });
-        }
+        (0, vue_1.watch)(showRef, (value) => {
+            if (value)
+                (0, evtd_1.on)('keydown', document, handleKeydown);
+            else
+                (0, evtd_1.off)('keydown', document, handleKeydown);
+        });
+        (0, vue_1.onBeforeUnmount)(() => {
+            (0, evtd_1.off)('keydown', document, handleKeydown);
+        });
         let startX = 0;
         let startY = 0;
         let offsetX = 0;
@@ -265,8 +266,8 @@ exports.default = (0, vue_1.defineComponent)({
             handleSwitchNext }, exposedMethods), { cssVars: (0, vue_1.computed)(() => {
                 const { common: { cubicBezierEaseInOut }, self: { iconColor } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--icon-color': iconColor
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-icon-color': iconColor
                 };
             }) });
     },

package/lib/image/src/styles/index.cssr.js

@@ -15,8 +15,8 @@ const cssr_1 = require("../../../_utils/cssr");
 const fade_in_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in.cssr"));
 
 const fade_in_scale_up_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in-scale-up.cssr")); // vars:
-// --icon-color
-// --bezier
+// --n-icon-color
+// --n-bezier
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.c)('body >', [(0, cssr_1.cB)('image-container', 'position: fixed;')]), (0, cssr_1.cB)('image-preview-container', `
@@ -44,8 +44,8 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('body >', [(0, cssr_1.cB)('image-
  bottom: 40px;
  padding: 0 12px;
  background: rgba(0, 0, 0, .35);
- color: var(--icon-color);
- transition: color .3s var(--bezier);
+ color: var(--n-icon-color);
+ transition: color .3s var(--n-bezier);
  display: flex;
  align-items: center;
  `, [(0, cssr_1.cB)('base-icon', `
@@ -66,7 +66,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('body >', [(0, cssr_1.cB)('image-
  margin: auto;
  max-height: 100vh;
  max-width: 100vw;
- transition: transform .3s var(--bezier);
+ transition: transform .3s var(--n-bezier);
  `), (0, cssr_1.cB)('image', `
  display: inline-flex;
  max-height: 100%;