@varlet/ui 2.2.1 → 2.3.0

package/lib/link/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = exports._LinkComponent = void 0;
+
+var _Link = _interopRequireDefault(require("./Link.js"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+_Link.default.install = function (app) {
+  app.component(_Link.default.name, _Link.default);
+};
+
+var _LinkComponent = _Link.default;
+exports._LinkComponent = _LinkComponent;
+var _default = _Link.default;
+exports.default = _default;

package/lib/link/link.css

@@ -0,0 +1 @@
+:root { --link-primary-color: var(--color-primary); --link-danger-color: var(--color-danger); --link-success-color: var(--color-success); --link-warning-color: var(--color-warning); --link-info-color: var(--color-info); --link-disabled-color: var(--color-text-disabled); --link-font-size: var(--font-size-md);}.var-link { position: relative; justify-content: center; align-items: center; outline: none; cursor: pointer; font-family: inherit; white-space: nowrap; color: inherit; text-decoration: none; font-size: var(--link-font-size);}.var-link--underline-always { text-decoration: underline;}.var-link--underline-hover:hover { text-decoration: underline;}.var-link--default { color: inherit;}.var-link--primary { color: var(--link-primary-color);}.var-link--info { color: var(--link-info-color);}.var-link--success { color: var(--link-success-color);}.var-link--warning { color: var(--link-warning-color);}.var-link--danger { color: var(--link-danger-color);}.var-link--disabled { color: var(--link-disabled-color); cursor: not-allowed;}

package/lib/link/props.js

@@ -0,0 +1,56 @@
+"use strict";
+
+exports.__esModule = true;
+exports.props = void 0;
+
+function typeValidator(type) {
+  return ['default', 'primary', 'info', 'success', 'warning', 'danger'].includes(type);
+}
+
+function underlineValidator(status) {
+  return ['always', 'hover', 'none'].includes(status);
+}
+
+var props = {
+  type: {
+    type: String,
+    default: 'default',
+    validator: typeValidator
+  },
+  href: {
+    type: String
+  },
+  target: {
+    type: String
+  },
+  to: {
+    type: [String, Object]
+  },
+  replace: {
+    type: Boolean,
+    default: false
+  },
+  underline: {
+    type: String,
+    default: 'always',
+    validator: underlineValidator
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  textSize: {
+    type: [String, Number]
+  },
+  textColor: {
+    type: String
+  },
+  defaultStyle: {
+    type: Boolean,
+    default: false
+  },
+  onClick: {
+    type: Function
+  }
+};
+exports.props = props;

package/lib/link/style/index.js

@@ -0,0 +1,3 @@
+require('../../styles/common.css')
+require('../link.css')
+require('../LinkSfc.css')

package/lib/list/List.js

@@ -39,7 +39,7 @@ function render(_ctx, _cache) {
   var _directive_ripple = (0, _vue.resolveDirective)("ripple");
 
   return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), 'var--box')),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), _ctx.n('$--box'))),
     ref: "listEl"
   }, [(0, _vue.renderSlot)(_ctx.$slots, "default"), _ctx.loading ? (0, _vue.renderSlot)(_ctx.$slots, "loading", {
     key: 0

package/lib/loading/Loading.js

@@ -47,7 +47,7 @@ function render(_ctx, _cache) {
   /* CLASS */
   )) : (0, _vue.createCommentVNode)("v-if", true), _ctx.isShow ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     key: 1,
-    class: (0, _vue.normalizeClass)(_ctx.classes('var--box', _ctx.n('body'), [_ctx.$slots.default, _ctx.n('inside')]))
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('$--box'), _ctx.n('body'), [_ctx.$slots.default, _ctx.n('inside')]))
   }, [_ctx.type === 'circle' ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     key: 0,
     class: (0, _vue.normalizeClass)(_ctx.n('circle'))

package/lib/menu/Menu.js

@@ -58,7 +58,7 @@ function render(_ctx, _cache) {
       style: (0, _vue.normalizeStyle)({
         zIndex: _ctx.zIndex
       }),
-      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('menu'), [_ctx.defaultStyle, _ctx.n('--menu-background-color') + " var-elevation--3"])),
+      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('menu'), [_ctx.defaultStyle, _ctx.n('--menu-background-color') + " " + _ctx.n('$-elevation--3')])),
       onClick: _cache[0] || (_cache[0] = (0, _vue.withModifiers)(() => {}, ["stop"])),
       onMouseenter: _cache[1] || (_cache[1] = function () {
         return _ctx.handleMenuMouseenter && _ctx.handleMenuMouseenter(...arguments);

package/lib/option/Option.js

@@ -29,7 +29,7 @@ function render(_ctx, _cache) {
   var _directive_ripple = (0, _vue.resolveDirective)("ripple");
 
   return (0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), 'var--box', [_ctx.optionSelected, _ctx.n('--selected-color')])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), _ctx.n('$--box'), [_ctx.optionSelected, _ctx.n('--selected-color')])),
     style: (0, _vue.normalizeStyle)({
       width: _ctx.wrapWidth,
       color: _ctx.optionSelected ? _ctx.focusColor : undefined
@@ -55,7 +55,7 @@ function render(_ctx, _cache) {
   }, null, 8
   /* PROPS */
   , ["checked-color", "modelValue", "onChange"])) : (0, _vue.createCommentVNode)("v-if", true), (0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('text'), 'var--ellipsis'))
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('text'), _ctx.n('$--ellipsis')))
   }, [(0, _vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(_ctx.label), 1
   /* TEXT */
   )])], 2

package/lib/pagination/Pagination.js

@@ -49,7 +49,7 @@ function render(_ctx, _cache) {
   return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("ul", {
     class: (0, _vue.normalizeClass)(_ctx.n())
   }, [(0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), _ctx.n('prev'), [_ctx.current <= 1 || _ctx.disabled, _ctx.n('item--disabled')], [_ctx.simple, _ctx.n('item--simple'), 'var-elevation--2'])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), _ctx.n('prev'), [_ctx.current <= 1 || _ctx.disabled, _ctx.n('item--disabled')], [_ctx.simple, _ctx.n('item--simple'), _ctx.n('$-elevation--2')])),
     onClick: _cache[0] || (_cache[0] = $event => _ctx.clickItem('prev'))
   }, [(0, _vue.renderSlot)(_ctx.$slots, "prev", {}, () => [(0, _vue.createVNode)(_component_var_icon, {
     name: "chevron-left"
@@ -83,7 +83,7 @@ function render(_ctx, _cache) {
     return (0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
       key: _ctx.toNumber(item) + index,
       "item-mode": _ctx.getMode(item, index),
-      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), 'var-elevation--2', [item === _ctx.current && !_ctx.disabled, _ctx.n('item--active')], [_ctx.isHideEllipsis(item, index), _ctx.n('item--hide')], [_ctx.disabled, _ctx.n('item--disabled')], [item === _ctx.current && _ctx.disabled, _ctx.n('item--disabled--active')])),
+      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), _ctx.n('$-elevation--2'), [item === _ctx.current && !_ctx.disabled, _ctx.n('item--active')], [_ctx.isHideEllipsis(item, index), _ctx.n('item--hide')], [_ctx.disabled, _ctx.n('item--disabled')], [item === _ctx.current && _ctx.disabled, _ctx.n('item--disabled--active')])),
       onClick: $event => _ctx.clickItem(item, index)
     }, [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(item), 1
     /* TEXT */
@@ -95,7 +95,7 @@ function render(_ctx, _cache) {
   }), 128
   /* KEYED_FRAGMENT */
   )), (0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), _ctx.n('next'), [_ctx.current >= _ctx.pageCount || _ctx.disabled, _ctx.n('item--disabled')], [_ctx.simple, _ctx.n('item--simple'), 'var-elevation--2'])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('item'), _ctx.n('next'), [_ctx.current >= _ctx.pageCount || _ctx.disabled, _ctx.n('item--disabled')], [_ctx.simple, _ctx.n('item--simple'), _ctx.n('$-elevation--2')])),
     onClick: _cache[4] || (_cache[4] = $event => _ctx.clickItem('next'))
   }, [(0, _vue.renderSlot)(_ctx.$slots, "next", {}, () => [(0, _vue.createVNode)(_component_var_icon, {
     name: "chevron-right"

package/lib/picker/Picker.js

@@ -40,7 +40,7 @@ var _hoisted_2 = ["onTransitionend"];
 function render(_ctx, _cache) {
   var _component_var_button = (0, _vue.resolveComponent)("var-button");
 
-  return (0, _vue.openBlock)(), (0, _vue.createBlock)((0, _vue.resolveDynamicComponent)(_ctx.dynamic ? 'var-popup' : _ctx.Transition), (0, _vue.mergeProps)(_ctx.dynamic ? {
+  return (0, _vue.openBlock)(), (0, _vue.createBlock)((0, _vue.resolveDynamicComponent)(_ctx.dynamic ? _ctx.n('$-popup') : _ctx.Transition), (0, _vue.mergeProps)(_ctx.dynamic ? {
     onOpen: _ctx.onOpen,
     onOpened: _ctx.onOpened,
     onClose: _ctx.onClose,

package/lib/popup/Popup.js

@@ -88,7 +88,7 @@ var _default = (0, _vue.defineComponent)({
 
     var renderContent = () => {
       return (0, _vue.createVNode)("div", (0, _vue.mergeProps)({
-        "class": classes(n('content'), 'var-elevation--3', n("--" + props.position)),
+        "class": classes(n('content'), n('$-elevation--3'), n("--" + props.position)),
         "style": {
           zIndex: zIndex.value
         }
@@ -105,17 +105,17 @@ var _default = (0, _vue.defineComponent)({
         position
       } = props;
       return (0, _vue.createVNode)(_vue.Transition, {
-        "name": "var-fade",
+        "name": n('$-fade'),
         "onAfterEnter": onOpened,
         "onAfterLeave": onClosed
       }, {
         default: () => [(0, _vue.withDirectives)((0, _vue.createVNode)("div", {
-          "class": classes('var--box', n()),
+          "class": classes(n('$--box'), n()),
           "style": {
             zIndex: zIndex.value - 2
           }
         }, [overlay && renderOverlay(), (0, _vue.createVNode)(_vue.Transition, {
-          "name": transition || "var-pop-" + position
+          "name": transition || n("$-pop-" + position)
         }, {
           default: () => [show && renderContent()]
         })]), [[_vue.vShow, show]])]

package/lib/pull-refresh/PullRefresh.js

@@ -49,7 +49,7 @@ function render(_ctx, _cache) {
       return _ctx.touchEnd && _ctx.touchEnd(...arguments);
     })
   }, [(0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('control'), 'var-elevation--2', [_ctx.isSuccess, _ctx.n('control-success')])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('control'), _ctx.n('$-elevation--2'), [_ctx.isSuccess, _ctx.n('control-success')])),
     style: (0, _vue.normalizeStyle)(_ctx.controlStyle)
   }, [(0, _vue.createVNode)(_component_var_icon, {
     name: _ctx.iconName,

package/lib/row/Row.js

@@ -21,7 +21,7 @@ var {
 
 function render(_ctx, _cache) {
   return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), 'var--box')),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), _ctx.n('$--box'))),
     style: (0, _vue.normalizeStyle)({
       justifyContent: _ctx.justify,
       alignItems: _ctx.align,

package/lib/select/Select.js

@@ -52,7 +52,7 @@ function render(_ctx, _cache) {
   var _component_var_form_details = (0, _vue.resolveComponent)("var-form-details");
 
   return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), 'var--box', [_ctx.formDisabled || _ctx.disabled, _ctx.n('--disabled')])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n(), _ctx.n('$--box'), [_ctx.formDisabled || _ctx.disabled, _ctx.n('--disabled')])),
     onClick: _cache[3] || (_cache[3] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
@@ -83,7 +83,7 @@ function render(_ctx, _cache) {
   }, {
     menu: (0, _vue.withCtx)(() => [(0, _vue.createElementVNode)("div", {
       ref: "menuEl",
-      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('scroller'), 'var-elevation--3'))
+      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('scroller'), _ctx.n('$-elevation--3')))
     }, [(0, _vue.renderSlot)(_ctx.$slots, "default")], 2
     /* CLASS */
     )]),
@@ -139,7 +139,7 @@ function render(_ctx, _cache) {
     , ["class"])])], 6
     /* CLASS, STYLE */
     ), (0, _vue.createElementVNode)("label", {
-      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('placeholder'), 'var--ellipsis', [_ctx.isFocus, _ctx.n('--focus')], [_ctx.errorMessage, _ctx.n('--error')], [_ctx.formDisabled || _ctx.disabled, _ctx.n('--disabled')], _ctx.computePlaceholderState(), [!_ctx.hint, _ctx.n('--placeholder-non-hint')])),
+      class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('placeholder'), _ctx.n('$--ellipsis'), [_ctx.isFocus, _ctx.n('--focus')], [_ctx.errorMessage, _ctx.n('--error')], [_ctx.formDisabled || _ctx.disabled, _ctx.n('--disabled')], _ctx.computePlaceholderState(), [!_ctx.hint, _ctx.n('--placeholder-non-hint')])),
       style: (0, _vue.normalizeStyle)({
         color: !_ctx.errorMessage ? _ctx.isFocus ? _ctx.focusColor : _ctx.blurColor : undefined
       })

package/lib/skeleton/Skeleton.js

@@ -21,7 +21,7 @@ var {
 
 function render(_ctx, _cache) {
   return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes('var--box', _ctx.n()))
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('$--box'), _ctx.n()))
   }, [!_ctx.loading ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     key: 0,
     class: (0, _vue.normalizeClass)(_ctx.n('data'))

package/lib/slider/Slider.js

@@ -306,7 +306,7 @@ var _default = (0, _vue.defineComponent)({
 
     var click = event => {
       if (isDisabled.value || isReadonly.value) return;
-      if (event.target.closest('.var-slider__thumb')) return;
+      if (event.target.closest("." + n('thumb'))) return;
       var offset = event.clientX - (0, _elements.getLeft)(event.currentTarget);
       var type = getType(offset);
       setPercent(offset, type);

package/lib/snackbar/core.js

@@ -46,7 +46,7 @@ function render(_ctx, _cache) {
       zIndex: _ctx.zIndex
     })
   }, [(0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('wrapper'), _ctx.n("wrapper-" + _ctx.position), 'var-elevation--4', [_ctx.vertical, _ctx.n('vertical')], [_ctx.type && _ctx.SNACKBAR_TYPE.includes(_ctx.type), _ctx.n("wrapper-" + _ctx.type)])),
+    class: (0, _vue.normalizeClass)(_ctx.classes(_ctx.n('wrapper'), _ctx.n("wrapper-" + _ctx.position), _ctx.n('$-elevation--4'), [_ctx.vertical, _ctx.n('vertical')], [_ctx.type && _ctx.SNACKBAR_TYPE.includes(_ctx.type), _ctx.n("wrapper-" + _ctx.type)])),
     style: (0, _vue.normalizeStyle)({
       zIndex: _ctx.zIndex
     })

package/lib/snackbar/style/index.js

@@ -1,8 +1,8 @@
 require('../../styles/common.css')
-require('../SnackbarSfc.css')
 require('../../styles/elevation.css')
 require('../../loading/loading.css')
 require('../../button/button.css')
 require('../../icon/icon.css')
 require('../snackbar.css')
 require('../coreSfc.css')
+require('../SnackbarSfc.css')

package/lib/space/Space.js

@@ -80,7 +80,6 @@ var _default = (0, _vue.defineComponent)({
       children = flatten(children);
       var lastIndex = children.length - 1;
       var spacers = children.map((child, index) => {
-        var width = direction === 'row' ? undefined : '100%';
         var margin = '0';
 
         if (direction === 'row') {
@@ -109,13 +108,12 @@ var _default = (0, _vue.defineComponent)({
 
         return (0, _vue.createVNode)("div", {
           "style": {
-            margin,
-            width
+            margin
           }
         }, [child]);
       });
       return (0, _vue.createVNode)("div", {
-        "class": classes(n(), 'var--box', [inline, n('--inline')]),
+        "class": classes(n(), n('$--box'), [inline, n('--inline')]),
         "style": {
           flexDirection: direction,
           justifyContent: padStartFlex(justify),