@varlet/ui 2.7.5 → 2.8.0-alpha.1676455225773

package/es/ellipsis/Ellipsis.mjs

@@ -0,0 +1,106 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import VarTooltip from '../tooltip/index.mjs';
+import { computed, defineComponent, ref } from 'vue';
+import { createNamespace } from '../utils/components.mjs';
+import { props } from './props.mjs';
+var {
+  n,
+  classes
+} = createNamespace('ellipsis');
+import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveComponent as _resolveComponent, normalizeProps as _normalizeProps, guardReactiveProps as _guardReactiveProps, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+
+var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
+
+var _hoisted_1 = {
+  key: 0
+};
+
+function __render__(_ctx, _cache) {
+  var _component_var_tooltip = _resolveComponent("var-tooltip");
+
+  return _openBlock(), _createBlock(_component_var_tooltip, _normalizeProps(_guardReactiveProps(_ctx.tooltip)), {
+    content: _withCtx(() => [_renderSlot(_ctx.$slots, "tooltip-content", {}, () => {
+      var _ctx$tooltip;
+
+      return [(_ctx$tooltip = _ctx.tooltip) != null && _ctx$tooltip.content ? (_openBlock(), _createElementBlock("span", _hoisted_1, _toDisplayString(_ctx.tooltip.content), 1
+      /* TEXT */
+      )) : _renderSlot(_ctx.$slots, "default", {
+        key: 1
+      })];
+    })]),
+    default: _withCtx(() => [_createElementVNode("span", {
+      class: _normalizeClass(_ctx.classes(_ctx.n(), [_ctx.lineClamp, _ctx.n('--clamp'), _ctx.n('--line')], [_ctx.expandTrigger, _ctx.n('--cursor')], [_ctx.expanding, _ctx.n('--expand')])),
+      style: _normalizeStyle(_ctx.rootStyles),
+      onClick: _cache[0] || (_cache[0] = function () {
+        return _ctx.handleClick && _ctx.handleClick(...arguments);
+      })
+    }, [_renderSlot(_ctx.$slots, "default")], 6
+    /* CLASS, STYLE */
+    )]),
+    _: 3
+    /* FORWARDED */
+
+  }, 16
+  /* FULL_PROPS */
+  );
+}
+
+var __sfc__ = defineComponent({
+  name: 'VarEllipsis',
+  components: {
+    VarTooltip
+  },
+  props,
+
+  setup(props) {
+    var expanding = ref(false);
+    var rootStyles = computed(() => {
+      if (!props.lineClamp) {
+        return {};
+      }
+
+      return {
+        '-webkit-line-clamp': props.lineClamp
+      };
+    });
+    var tooltip = computed(() => {
+      if (props.tooltip === false) {
+        return {
+          disabled: true
+        };
+      }
+
+      if (props.tooltip === true) {
+        return {
+          sameWidth: true
+        };
+      }
+
+      return _extends({
+        sameWidth: true
+      }, props.tooltip);
+    });
+
+    var handleClick = () => {
+      if (!props.expandTrigger) {
+        return;
+      }
+
+      expanding.value = !expanding.value;
+    };
+
+    return {
+      n,
+      classes,
+      tooltip,
+      expanding,
+      rootStyles,
+      handleClick
+    };
+  }
+
+});
+
+__sfc__.render = __render__;
+export default __sfc__;

package/es/ellipsis/ellipsis.css

@@ -0,0 +1 @@
+.var-ellipsis { width: 100%; overflow: hidden; vertical-align: bottom;}.var-ellipsis--clamp { display: -webkit-inline-box; -webkit-box-orient: vertical;}.var-ellipsis--line { display: inline-block; white-space: nowrap; text-overflow: ellipsis;}.var-ellipsis--cursor { cursor: pointer;}.var-ellipsis--expand { display: inline-block; white-space: wrap; overflow: visible;}

package/es/ellipsis/index.mjs

@@ -0,0 +1,8 @@
+import Ellipsis from './Ellipsis.mjs';
+
+Ellipsis.install = function (app) {
+  app.component(Ellipsis.name, Ellipsis);
+};
+
+export var _EllipsisComponent = Ellipsis;
+export default Ellipsis;

package/es/ellipsis/props.mjs

@@ -0,0 +1,16 @@
+export function expandTriggerValidator(expandTrigger) {
+  return ['click'].includes(expandTrigger);
+}
+export var props = {
+  expandTrigger: {
+    type: String,
+    validator: expandTriggerValidator
+  },
+  lineClamp: {
+    type: [Number, String]
+  },
+  tooltip: {
+    type: [Object, Boolean],
+    default: true
+  }
+};

package/es/ellipsis/style/index.mjs

@@ -0,0 +1,4 @@
+import '../../styles/common.css'
+import '../../tooltip/tooltip.css'
+import '../ellipsis.css'
+import '../EllipsisSfc.css'

package/es/index.bundle.mjs

@@ -1,5 +1,7 @@
 import ActionSheet from './action-sheet/index.mjs'
 import AppBar from './app-bar/index.mjs'
+import Avatar from './avatar/index.mjs'
+import AvatarGroup from './avatar-group/index.mjs'
 import BackTop from './back-top/index.mjs'
 import Badge from './badge/index.mjs'
 import BottomNavigation from './bottom-navigation/index.mjs'
@@ -21,6 +23,7 @@ import Counter from './counter/index.mjs'
 import DatePicker from './date-picker/index.mjs'
 import Dialog from './dialog/index.mjs'
 import Divider from './divider/index.mjs'
+import Ellipsis from './ellipsis/index.mjs'
 import Form from './form/index.mjs'
 import FormDetails from './form-details/index.mjs'
 import Icon from './icon/index.mjs'
@@ -39,6 +42,7 @@ import Menu from './menu/index.mjs'
 import Option from './option/index.mjs'
 import Overlay from './overlay/index.mjs'
 import Pagination from './pagination/index.mjs'
+import Paper from './paper/index.mjs'
 import Picker from './picker/index.mjs'
 import Popup from './popup/index.mjs'
 import Progress from './progress/index.mjs'
@@ -73,6 +77,8 @@ import Uploader from './uploader/index.mjs'
 
 export * from './action-sheet/index.mjs'
 export * from './app-bar/index.mjs'
+export * from './avatar/index.mjs'
+export * from './avatar-group/index.mjs'
 export * from './back-top/index.mjs'
 export * from './badge/index.mjs'
 export * from './bottom-navigation/index.mjs'
@@ -94,6 +100,7 @@ export * from './counter/index.mjs'
 export * from './date-picker/index.mjs'
 export * from './dialog/index.mjs'
 export * from './divider/index.mjs'
+export * from './ellipsis/index.mjs'
 export * from './form/index.mjs'
 export * from './form-details/index.mjs'
 export * from './icon/index.mjs'
@@ -112,6 +119,7 @@ export * from './menu/index.mjs'
 export * from './option/index.mjs'
 export * from './overlay/index.mjs'
 export * from './pagination/index.mjs'
+export * from './paper/index.mjs'
 export * from './picker/index.mjs'
 export * from './popup/index.mjs'
 export * from './progress/index.mjs'
@@ -146,6 +154,8 @@ export * from './uploader/index.mjs'
 
 import './action-sheet/style/index.mjs'
 import './app-bar/style/index.mjs'
+import './avatar/style/index.mjs'
+import './avatar-group/style/index.mjs'
 import './back-top/style/index.mjs'
 import './badge/style/index.mjs'
 import './bottom-navigation/style/index.mjs'
@@ -167,6 +177,7 @@ import './counter/style/index.mjs'
 import './date-picker/style/index.mjs'
 import './dialog/style/index.mjs'
 import './divider/style/index.mjs'
+import './ellipsis/style/index.mjs'
 import './form/style/index.mjs'
 import './form-details/style/index.mjs'
 import './icon/style/index.mjs'
@@ -185,6 +196,7 @@ import './menu/style/index.mjs'
 import './option/style/index.mjs'
 import './overlay/style/index.mjs'
 import './pagination/style/index.mjs'
+import './paper/style/index.mjs'
 import './picker/style/index.mjs'
 import './popup/style/index.mjs'
 import './progress/style/index.mjs'
@@ -217,11 +229,13 @@ import './time-picker/style/index.mjs'
 import './tooltip/style/index.mjs'
 import './uploader/style/index.mjs'
 
-const version = '2.7.5'
+const version = '2.8.0-alpha.1676455225773'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)
   AppBar.install && app.use(AppBar)
+  Avatar.install && app.use(Avatar)
+  AvatarGroup.install && app.use(AvatarGroup)
   BackTop.install && app.use(BackTop)
   Badge.install && app.use(Badge)
   BottomNavigation.install && app.use(BottomNavigation)
@@ -243,6 +257,7 @@ function install(app) {
   DatePicker.install && app.use(DatePicker)
   Dialog.install && app.use(Dialog)
   Divider.install && app.use(Divider)
+  Ellipsis.install && app.use(Ellipsis)
   Form.install && app.use(Form)
   FormDetails.install && app.use(FormDetails)
   Icon.install && app.use(Icon)
@@ -261,6 +276,7 @@ function install(app) {
   Option.install && app.use(Option)
   Overlay.install && app.use(Overlay)
   Pagination.install && app.use(Pagination)
+  Paper.install && app.use(Paper)
   Picker.install && app.use(Picker)
   Popup.install && app.use(Popup)
   Progress.install && app.use(Progress)
@@ -299,6 +315,8 @@ export {
   install,
   ActionSheet,
   AppBar,
+  Avatar,
+  AvatarGroup,
   BackTop,
   Badge,
   BottomNavigation,
@@ -320,6 +338,7 @@ export {
   DatePicker,
   Dialog,
   Divider,
+  Ellipsis,
   Form,
   FormDetails,
   Icon,
@@ -338,6 +357,7 @@ export {
   Option,
   Overlay,
   Pagination,
+  Paper,
   Picker,
   Popup,
   Progress,
@@ -376,6 +396,8 @@ export default {
   install,
   ActionSheet,
   AppBar,
+  Avatar,
+  AvatarGroup,
   BackTop,
   Badge,
   BottomNavigation,
@@ -397,6 +419,7 @@ export default {
   DatePicker,
   Dialog,
   Divider,
+  Ellipsis,
   Form,
   FormDetails,
   Icon,
@@ -415,6 +438,7 @@ export default {
   Option,
   Overlay,
   Pagination,
+  Paper,
   Picker,
   Popup,
   Progress,

package/es/index.mjs

@@ -1,5 +1,7 @@
 import ActionSheet from './action-sheet/index.mjs'
 import AppBar from './app-bar/index.mjs'
+import Avatar from './avatar/index.mjs'
+import AvatarGroup from './avatar-group/index.mjs'
 import BackTop from './back-top/index.mjs'
 import Badge from './badge/index.mjs'
 import BottomNavigation from './bottom-navigation/index.mjs'
@@ -21,6 +23,7 @@ import Counter from './counter/index.mjs'
 import DatePicker from './date-picker/index.mjs'
 import Dialog from './dialog/index.mjs'
 import Divider from './divider/index.mjs'
+import Ellipsis from './ellipsis/index.mjs'
 import Form from './form/index.mjs'
 import FormDetails from './form-details/index.mjs'
 import Icon from './icon/index.mjs'
@@ -39,6 +42,7 @@ import Menu from './menu/index.mjs'
 import Option from './option/index.mjs'
 import Overlay from './overlay/index.mjs'
 import Pagination from './pagination/index.mjs'
+import Paper from './paper/index.mjs'
 import Picker from './picker/index.mjs'
 import Popup from './popup/index.mjs'
 import Progress from './progress/index.mjs'
@@ -73,6 +77,8 @@ import Uploader from './uploader/index.mjs'
 
 export * from './action-sheet/index.mjs'
 export * from './app-bar/index.mjs'
+export * from './avatar/index.mjs'
+export * from './avatar-group/index.mjs'
 export * from './back-top/index.mjs'
 export * from './badge/index.mjs'
 export * from './bottom-navigation/index.mjs'
@@ -94,6 +100,7 @@ export * from './counter/index.mjs'
 export * from './date-picker/index.mjs'
 export * from './dialog/index.mjs'
 export * from './divider/index.mjs'
+export * from './ellipsis/index.mjs'
 export * from './form/index.mjs'
 export * from './form-details/index.mjs'
 export * from './icon/index.mjs'
@@ -112,6 +119,7 @@ export * from './menu/index.mjs'
 export * from './option/index.mjs'
 export * from './overlay/index.mjs'
 export * from './pagination/index.mjs'
+export * from './paper/index.mjs'
 export * from './picker/index.mjs'
 export * from './popup/index.mjs'
 export * from './progress/index.mjs'
@@ -144,11 +152,13 @@ export * from './time-picker/index.mjs'
 export * from './tooltip/index.mjs'
 export * from './uploader/index.mjs'
 
-const version = '2.7.5'
+const version = '2.8.0-alpha.1676455225773'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)
   AppBar.install && app.use(AppBar)
+  Avatar.install && app.use(Avatar)
+  AvatarGroup.install && app.use(AvatarGroup)
   BackTop.install && app.use(BackTop)
   Badge.install && app.use(Badge)
   BottomNavigation.install && app.use(BottomNavigation)
@@ -170,6 +180,7 @@ function install(app) {
   DatePicker.install && app.use(DatePicker)
   Dialog.install && app.use(Dialog)
   Divider.install && app.use(Divider)
+  Ellipsis.install && app.use(Ellipsis)
   Form.install && app.use(Form)
   FormDetails.install && app.use(FormDetails)
   Icon.install && app.use(Icon)
@@ -188,6 +199,7 @@ function install(app) {
   Option.install && app.use(Option)
   Overlay.install && app.use(Overlay)
   Pagination.install && app.use(Pagination)
+  Paper.install && app.use(Paper)
   Picker.install && app.use(Picker)
   Popup.install && app.use(Popup)
   Progress.install && app.use(Progress)
@@ -226,6 +238,8 @@ export {
   install,
   ActionSheet,
   AppBar,
+  Avatar,
+  AvatarGroup,
   BackTop,
   Badge,
   BottomNavigation,
@@ -247,6 +261,7 @@ export {
   DatePicker,
   Dialog,
   Divider,
+  Ellipsis,
   Form,
   FormDetails,
   Icon,
@@ -265,6 +280,7 @@ export {
   Option,
   Overlay,
   Pagination,
+  Paper,
   Picker,
   Popup,
   Progress,
@@ -303,6 +319,8 @@ export default {
   install,
   ActionSheet,
   AppBar,
+  Avatar,
+  AvatarGroup,
   BackTop,
   Badge,
   BottomNavigation,
@@ -324,6 +342,7 @@ export default {
   DatePicker,
   Dialog,
   Divider,
+  Ellipsis,
   Form,
   FormDetails,
   Icon,
@@ -342,6 +361,7 @@ export default {
   Option,
   Overlay,
   Pagination,
+  Paper,
   Picker,
   Popup,
   Progress,

package/es/paper/Paper.mjs

@@ -0,0 +1,55 @@
+import Ripple from '../ripple/index.mjs';
+import { defineComponent } from 'vue';
+import { call, createNamespace } from '../utils/components.mjs';
+import { props } from './props.mjs';
+import { toSizeUnit } from '../utils/elements.mjs';
+var {
+  n,
+  classes
+} = createNamespace('paper');
+import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives } from "vue";
+
+function __render__(_ctx, _cache) {
+  var _directive_ripple = _resolveDirective("ripple");
+
+  return _withDirectives((_openBlock(), _createElementBlock("div", {
+    class: _normalizeClass(_ctx.classes(_ctx.n(), _ctx.n('$--box'), _ctx.n("$-elevation--" + _ctx.elevation), [_ctx.onClick, _ctx.n('--cursor')], [_ctx.round, _ctx.n('--round')], [_ctx.inline, _ctx.n('$--inline-flex')])),
+    style: _normalizeStyle({
+      width: _ctx.toSizeUnit(_ctx.width),
+      height: _ctx.toSizeUnit(_ctx.height),
+      'border-radius': _ctx.toSizeUnit(_ctx.radius)
+    }),
+    onClick: _cache[0] || (_cache[0] = function () {
+      return _ctx.handleClick && _ctx.handleClick(...arguments);
+    })
+  }, [_renderSlot(_ctx.$slots, "default")], 6
+  /* CLASS, STYLE */
+  )), [[_directive_ripple, {
+    disabled: !_ctx.ripple
+  }]]);
+}
+
+var __sfc__ = defineComponent({
+  name: 'VarPaper',
+  directives: {
+    Ripple
+  },
+  props,
+
+  setup(props) {
+    var handleClick = e => {
+      call(props.onClick, e);
+    };
+
+    return {
+      n,
+      classes,
+      toSizeUnit,
+      handleClick
+    };
+  }
+
+});
+
+__sfc__.render = __render__;
+export default __sfc__;

package/es/paper/index.mjs

@@ -0,0 +1,9 @@
+import Paper from './Paper.mjs';
+
+Paper.install = function (app) {
+  app.component(Paper.name, Paper);
+};
+
+export { props as paperProps } from './props.mjs';
+export var _PaperComponent = Paper;
+export default Paper;

package/es/paper/paper.css

@@ -0,0 +1 @@
+:root { --paper-background: #fff;}.var-paper { background: var(--paper-background); transition: background-color 0.25s; overflow: hidden;}.var-paper--round { border-radius: 50%;}.var-paper--cursor { cursor: pointer;}

package/es/paper/props.mjs

@@ -0,0 +1,28 @@
+import { defineListenerProp } from '../utils/components.mjs';
+export var props = {
+  elevation: {
+    type: [Number, String]
+  },
+  ripple: {
+    type: Boolean,
+    default: false
+  },
+  radius: {
+    type: [Number, String]
+  },
+  width: {
+    type: [Number, String]
+  },
+  height: {
+    type: [Number, String]
+  },
+  round: {
+    type: Boolean,
+    default: false
+  },
+  inline: {
+    type: Boolean,
+    default: false
+  },
+  onClick: defineListenerProp()
+};

package/es/paper/style/index.mjs

@@ -0,0 +1,4 @@
+import '../../styles/common.css'
+import '../../styles/elevation.css'
+import '../paper.css'
+import '../PaperSfc.css'

package/es/ripple/index.mjs

@@ -82,7 +82,7 @@ function createRipple(event) {
     }, 20);
   };
 
-  _ripple.tasker = window.setTimeout(task, 60);
+  _ripple.tasker = window.setTimeout(task, 30);
 }
 
 function removeRipple() {
@@ -107,7 +107,7 @@ function removeRipple() {
     }, delay);
   };
 
-  _ripple.tasker ? setTimeout(task, 60) : task();
+  _ripple.tasker ? setTimeout(task, 30) : task();
 }
 
 function forbidRippleTask() {

package/es/snackbar/style/index.mjs

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