@varlet/ui 1.20.0 → 1.22.0-alpha.10

package/es/time-picker/clock.js

@@ -1,13 +1,11 @@
 import { computed, defineComponent, ref, watch } from 'vue';
-import dayjs from 'dayjs';
+import dayjs from 'dayjs/esm';
 import { hoursAmpm, hours24, minSec } from './props';
 import { notConvert, convertHour, getIsDisableMinute, getIsDisableSecond, getNumberTime } from './utils';
 import { toNumber } from '../utils/shared';
-import { createVNode as _createVNode, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock, toDisplayString as _toDisplayString, createCommentVNode as _createCommentVNode, withScopeId as _withScopeId, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createCommentVNode as _createCommentVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
-var _withId = /*#__PURE__*/_withScopeId("");
-
-_pushScopeId("");
+var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
 var _hoisted_1 = {
   class: "var-time-picker-clock"
@@ -17,30 +15,27 @@ var _hoisted_2 = {
   class: "var-time-picker-clock__inner",
   ref: "inner"
 };
-
-_popScopeId();
-
-export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
-  return _openBlock(), _createBlock("div", _hoisted_1, [_createVNode("div", {
+export function render(_ctx, _cache) {
+  return _openBlock(), _createElementBlock("div", _hoisted_1, [_createElementVNode("div", {
     class: "var-time-picker-clock__hand",
-    style: _ctx.handStyle
+    style: _normalizeStyle(_ctx.handStyle)
   }, null, 4
   /* STYLE */
-  ), (_openBlock(true), _createBlock(_Fragment, null, _renderList(_ctx.timeScales, (timeScale, index) => {
-    return _openBlock(), _createBlock("div", {
-      class: ["var-time-picker-clock__item", [_ctx.isActive(index, false) ? 'var-time-picker-clock__item--active' : null, _ctx.isDisable(timeScale) ? 'var-time-picker-clock__item--disable' : null]],
+  ), (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.timeScales, (timeScale, index) => {
+    return _openBlock(), _createElementBlock("div", {
+      class: _normalizeClass(["var-time-picker-clock__item", [_ctx.isActive(index, false) ? 'var-time-picker-clock__item--active' : null, _ctx.isDisable(timeScale) ? 'var-time-picker-clock__item--disable' : null]]),
       key: timeScale,
-      style: _ctx.getStyle(index, timeScale, false)
+      style: _normalizeStyle(_ctx.getStyle(index, timeScale, false))
     }, _toDisplayString(timeScale), 7
     /* TEXT, CLASS, STYLE */
     );
   }), 128
   /* KEYED_FRAGMENT */
-  )), _ctx.format === '24hr' && _ctx.type === 'hour' ? (_openBlock(), _createBlock("div", _hoisted_2, [(_openBlock(true), _createBlock(_Fragment, null, _renderList(_ctx.hours24, (hour, index) => {
-    return _openBlock(), _createBlock("div", {
-      class: ["var-time-picker-clock__item", [_ctx.isActive(index, true) ? 'var-time-picker-clock__item--active' : null, _ctx.isDisable(hour) ? 'var-time-picker-clock__item--disable' : null]],
+  )), _ctx.format === '24hr' && _ctx.type === 'hour' ? (_openBlock(), _createElementBlock("div", _hoisted_2, [(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.hours24, (hour, index) => {
+    return _openBlock(), _createElementBlock("div", {
+      class: _normalizeClass(["var-time-picker-clock__item", [_ctx.isActive(index, true) ? 'var-time-picker-clock__item--active' : null, _ctx.isDisable(hour) ? 'var-time-picker-clock__item--disable' : null]]),
       key: hour,
-      style: _ctx.getStyle(index, hour, true)
+      style: _normalizeStyle(_ctx.getStyle(index, hour, true))
     }, _toDisplayString(hour), 7
     /* TEXT, CLASS, STYLE */
     );
@@ -49,7 +44,7 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
   ))], 512
   /* NEED_PATCH */
   )) : _createCommentVNode("v-if", true)]);
-});
+}
 export default defineComponent({
   render,
   name: 'Clock',

package/es/uploader/Uploader.js

@@ -12,11 +12,9 @@ import { props } from './props';
 import { isNumber, isHTMLSupportImage, isHTMLSupportVideo, toNumber, isString } from '../utils/shared';
 import { useValidation } from '../utils/components';
 import { useForm } from '../form/provide';
-import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock, toDisplayString as _toDisplayString, createVNode as _createVNode, resolveComponent as _resolveComponent, withModifiers as _withModifiers, createCommentVNode as _createCommentVNode, resolveDirective as _resolveDirective, withDirectives as _withDirectives, renderSlot as _renderSlot, withScopeId as _withScopeId, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, createVNode as _createVNode, withModifiers as _withModifiers, createCommentVNode as _createCommentVNode, normalizeStyle as _normalizeStyle, normalizeClass as _normalizeClass, resolveDirective as _resolveDirective, withDirectives as _withDirectives, renderSlot as _renderSlot, withCtx as _withCtx, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
-var _withId = /*#__PURE__*/_withScopeId("");
-
-_pushScopeId("");
+var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
 var _hoisted_1 = {
   class: "var-uploader var--box"
@@ -24,13 +22,15 @@ var _hoisted_1 = {
 var _hoisted_2 = {
   class: "var-uploader__file-list"
 };
-var _hoisted_3 = {
+var _hoisted_3 = ["onClick"];
+var _hoisted_4 = {
   class: "var-uploader__file-name"
 };
-
-_popScopeId();
-
-export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
+var _hoisted_5 = ["onClick"];
+var _hoisted_6 = ["src", "alt"];
+var _hoisted_7 = ["multiple", "accept", "capture", "disabled"];
+var _hoisted_8 = ["src"];
+export function render(_ctx, _cache) {
   var _component_var_icon = _resolveComponent("var-icon");
 
   var _component_var_form_details = _resolveComponent("var-form-details");
@@ -39,14 +39,14 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
 
   var _directive_ripple = _resolveDirective("ripple");
 
-  return _openBlock(), _createBlock("div", _hoisted_1, [_createVNode("div", _hoisted_2, [(_openBlock(true), _createBlock(_Fragment, null, _renderList(_ctx.modelValue, f => {
-    return _withDirectives((_openBlock(), _createBlock("div", {
-      class: ["var-uploader__file var-elevation--2", [f.state === 'loading' ? 'var-uploader--loading' : null]],
+  return _openBlock(), _createElementBlock("div", _hoisted_1, [_createElementVNode("div", _hoisted_2, [(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.modelValue, f => {
+    return _withDirectives((_openBlock(), _createElementBlock("div", {
+      class: _normalizeClass(["var-uploader__file var-elevation--2", [f.state === 'loading' ? 'var-uploader--loading' : null]]),
       key: f,
       onClick: $event => _ctx.preview(f)
-    }, [_createVNode("div", _hoisted_3, _toDisplayString(f.name || f.url), 1
+    }, [_createElementVNode("div", _hoisted_4, _toDisplayString(f.name || f.url), 1
     /* TEXT */
-    ), _ctx.removable ? (_openBlock(), _createBlock("div", {
+    ), _ctx.removable ? (_openBlock(), _createElementBlock("div", {
       key: 0,
       class: "var-uploader__file-close",
       onClick: _withModifiers($event => _ctx.handleRemove(f), ["stop"])
@@ -56,41 +56,41 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
       name: "delete"
     })], 8
     /* PROPS */
-    , ["onClick"])) : _createCommentVNode("v-if", true), f.cover ? (_openBlock(), _createBlock("img", {
+    , _hoisted_5)) : _createCommentVNode("v-if", true), f.cover ? (_openBlock(), _createElementBlock("img", {
       key: 1,
       class: "var-uploader__file-cover",
-      style: {
+      style: _normalizeStyle({
         objectFit: f.fit
-      },
+      }),
       src: f.cover,
       alt: f.name
     }, null, 12
     /* STYLE, PROPS */
-    , ["src", "alt"])) : _createCommentVNode("v-if", true), _createVNode("div", {
-      class: ["var-uploader__file-indicator", [f.state === 'success' ? 'var-uploader--success' : null, f.state === 'error' ? 'var-uploader--error' : null]]
+    , _hoisted_6)) : _createCommentVNode("v-if", true), _createElementVNode("div", {
+      class: _normalizeClass(["var-uploader__file-indicator", [f.state === 'success' ? 'var-uploader--success' : null, f.state === 'error' ? 'var-uploader--error' : null]])
     }, null, 2
     /* CLASS */
     )], 10
     /* CLASS, PROPS */
-    , ["onClick"])), [[_directive_ripple, {
+    , _hoisted_3)), [[_directive_ripple, {
       disabled: _ctx.disabled || _ctx.formDisabled || _ctx.readonly || _ctx.formReadonly || !_ctx.ripple
     }]]);
   }), 128
   /* KEYED_FRAGMENT */
-  )), !_ctx.maxlength || _ctx.modelValue.length < _ctx.maxlength ? _withDirectives((_openBlock(), _createBlock("div", {
+  )), !_ctx.maxlength || _ctx.modelValue.length < _ctx.maxlength ? _withDirectives((_openBlock(), _createElementBlock("div", {
     key: 0,
-    class: ["var--relative", [!_ctx.$slots.default ? 'var-uploader__action var-elevation--2' : null, _ctx.disabled || _ctx.formDisabled ? 'var-uploader--disabled' : null]]
-  }, [_createVNode("input", {
+    class: _normalizeClass(["var--relative", [!_ctx.$slots.default ? 'var-uploader__action var-elevation--2' : null, _ctx.disabled || _ctx.formDisabled ? 'var-uploader--disabled' : null]])
+  }, [_createElementVNode("input", {
     class: "var-uploader__action-input",
     type: "file",
     multiple: _ctx.multiple,
     accept: _ctx.accept,
     capture: _ctx.capture,
     disabled: _ctx.disabled || _ctx.formDisabled || _ctx.readonly || _ctx.formReadonly,
-    onChange: _cache[1] || (_cache[1] = (...args) => _ctx.handleChange && _ctx.handleChange(...args))
+    onChange: _cache[0] || (_cache[0] = (...args) => _ctx.handleChange && _ctx.handleChange(...args))
   }, null, 40
   /* PROPS, HYDRATE_EVENTS */
-  , ["multiple", "accept", "capture", "disabled"]), _renderSlot(_ctx.$slots, "default", {}, () => [_createVNode(_component_var_icon, {
+  , _hoisted_7), _renderSlot(_ctx.$slots, "default", {}, () => [_createVNode(_component_var_icon, {
     class: "var-uploader__action-icon",
     "var-uploader-cover": "",
     name: "plus"
@@ -108,13 +108,13 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
     "var-uploader-cover": "",
     position: "center",
     show: _ctx.showPreview,
-    "onUpdate:show": _cache[2] || (_cache[2] = $event => _ctx.showPreview = $event),
-    onClosed: _cache[3] || (_cache[3] = $event => _ctx.currentPreview = null)
+    "onUpdate:show": _cache[1] || (_cache[1] = $event => _ctx.showPreview = $event),
+    onClosed: _cache[2] || (_cache[2] = $event => _ctx.currentPreview = null)
   }, {
-    default: _withId(() => {
+    default: _withCtx(() => {
       var _ctx$currentPreview, _ctx$currentPreview2;
 
-      return [_ctx.currentPreview && _ctx.isHTMLSupportVideo((_ctx$currentPreview = _ctx.currentPreview) == null ? void 0 : _ctx$currentPreview.url) ? (_openBlock(), _createBlock("video", {
+      return [_ctx.currentPreview && _ctx.isHTMLSupportVideo((_ctx$currentPreview = _ctx.currentPreview) == null ? void 0 : _ctx$currentPreview.url) ? (_openBlock(), _createElementBlock("video", {
         key: 0,
         class: "var-uploader__preview-video",
         playsinline: "true",
@@ -126,7 +126,7 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
         src: (_ctx$currentPreview2 = _ctx.currentPreview) == null ? void 0 : _ctx$currentPreview2.url
       }, null, 8
       /* PROPS */
-      , ["src"])) : _createCommentVNode("v-if", true)];
+      , _hoisted_8)) : _createCommentVNode("v-if", true)];
     }),
     _: 1
     /* STABLE */
@@ -134,7 +134,7 @@ export var render = /*#__PURE__*/_withId((_ctx, _cache) => {
   }, 8
   /* PROPS */
   , ["show"])]);
-});
+}
 export default defineComponent({
   render,
   name: 'VarUploader',

package/highlight/attributes.json

@@ -711,6 +711,10 @@
     "type": "boolean",
     "description": "是否隐藏锚点列表 默认值：false"
   },
+  "var-index-bar/css-mode": {
+    "type": "boolean",
+    "description": "开启原生`css sticky`模式 默认值：false"
+  },
   "var-index-bar/z-index": {
     "type": "number | string",
     "description": "z-index 层级 默认值：1"
@@ -1359,6 +1363,14 @@
     "type": "string | number",
     "description": "吸顶时的层级 默认值：0"
   },
+  "var-sticky/css-mode": {
+    "type": "boolean",
+    "description": "开启原生`css sticky`模式 默认值：false"
+  },
+  "var-sticky/disabled": {
+    "type": "boolean",
+    "description": "禁用吸顶, 设置为`true`时, 元素会回到文档流中 默认值：false"
+  },
   "var-style-provider/style-vars": {
     "type": "Record<string, string>",
     "description": "css变量 默认值：{}"

package/highlight/tags.json

@@ -274,6 +274,7 @@
       "sticky",
       "sticky-offset-top",
       "hide-list",
+      "css-mode",
       "z-index",
       "highlight-color",
       "duration"
@@ -524,7 +525,9 @@
   "var-sticky": {
     "attributes": [
       "offset-top",
-      "z-index"
+      "z-index",
+      "css-mode",
+      "disabled"
     ]
   },
   "var-style-provider": {

package/highlight/web-types.json

@@ -2150,6 +2150,15 @@
                 "kind": "expression"
               }
             },
+            {
+              "name": "css-mode",
+              "description": "开启原生`css sticky`模式",
+              "default": "false",
+              "value": {
+                "type": "boolean",
+                "kind": "expression"
+              }
+            },
             {
               "name": "z-index",
               "description": "z-index 层级",
@@ -4078,6 +4087,24 @@
                 "type": "string | number",
                 "kind": "expression"
               }
+            },
+            {
+              "name": "css-mode",
+              "description": "开启原生`css sticky`模式",
+              "default": "false",
+              "value": {
+                "type": "boolean",
+                "kind": "expression"
+              }
+            },
+            {
+              "name": "disabled",
+              "description": "禁用吸顶, 设置为`true`时, 元素会回到文档流中",
+              "default": "false",
+              "value": {
+                "type": "boolean",
+                "kind": "expression"
+              }
             }
           ],
           "events": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "1.20.0",
+  "version": "1.22.0-alpha.10+6b74530c",
   "description": "A material like components library",
   "module": "es/index.js",
   "typings": "types/index.d.ts",
@@ -43,11 +43,11 @@
     "test:watch": "varlet-cli jest -w"
   },
   "peerDependencies": {
-    "vue": "^3.0.0"
+    "vue": "^3.2.0"
   },
-  "gitHead": "ec0aa70ef11d945d8dfb7cf88879e1447b3de9d9",
+  "gitHead": "6b74530cf52ce08997a311d1a63402585c23be18",
   "devDependencies": {
-    "@varlet/cli": "^1.20.0"
+    "@varlet/cli": "^1.22.0-alpha.10+6b74530c"
   },
   "dependencies": {
     "dayjs": "^1.10.4",

package/types/indexBar.d.ts

@@ -4,6 +4,7 @@ export interface IndexBarProps {
   sticky?: boolean
   stickyOffsetTop?: number
   hideList?: boolean
+  cssMode?: boolean
   zIndex?: number | string
   highlightColor?: string
   duration?: number | string

package/types/sticky.d.ts

@@ -3,6 +3,8 @@ import { VarComponent } from './varComponent'
 export interface StickyProps {
   offsetTop?: string | number
   zIndex?: string | number
+  cssMode?: boolean
+  disabled?: boolean
   onScroll?: (offsetTop: number, isFixed: boolean) => void
 }