@varlet/ui 3.5.1 → 3.5.2

package/es/form/Form.mjs

@@ -0,0 +1,116 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { defineComponent, computed } from "vue";
+import { props } from "./props.mjs";
+import { useFormItems } from "./provide.mjs";
+import { createNamespace } from "../utils/components.mjs";
+import { find, preventDefault, call } from "@varlet/shared";
+import { getParentScroller, getTop, scrollTo, toPxNum } from "../utils/elements.mjs";
+import { linear } from "../utils/shared.mjs";
+const { name, n } = createNamespace("form");
+import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
+function __render__(_ctx, _cache) {
+  return _openBlock(), _createElementBlock(
+    "form",
+    {
+      class: _normalizeClass(_ctx.n()),
+      onSubmit: _cache[0] || (_cache[0] = (...args) => _ctx.handleSubmit && _ctx.handleSubmit(...args)),
+      onReset: _cache[1] || (_cache[1] = (...args) => _ctx.handleReset && _ctx.handleReset(...args))
+    },
+    [
+      _renderSlot(_ctx.$slots, "default")
+    ],
+    34
+    /* CLASS, NEED_HYDRATION */
+  );
+}
+const __sfc__ = defineComponent({
+  name,
+  props,
+  setup(props2) {
+    const disabled = computed(() => props2.disabled);
+    const readonly = computed(() => props2.readonly);
+    const { formItems, bindFormItems } = useFormItems();
+    const formProvider = {
+      disabled,
+      readonly
+    };
+    bindFormItems(formProvider);
+    function scroll(formItemElement) {
+      setTimeout(() => {
+        const scroller = getParentScroller(formItemElement);
+        const scrollerTop = scroller === window ? 0 : getTop(scroller);
+        const top = getTop(formItemElement) - scrollerTop - toPxNum(props2.scrollToErrorOffsetY);
+        scrollTo(scroller, {
+          top,
+          animation: linear
+        });
+      }, 300);
+    }
+    function handleSubmit(event) {
+      return __async(this, null, function* () {
+        preventDefault(event);
+        const valid = yield validate();
+        call(props2.onSubmit, valid);
+      });
+    }
+    function handleReset(event) {
+      preventDefault(event);
+      reset();
+      call(props2.onReset);
+    }
+    function validate() {
+      return __async(this, null, function* () {
+        var _a;
+        const res = yield Promise.all(formItems.map(({ validate: validate2 }) => validate2()));
+        if (props2.scrollToError) {
+          const [, errorIndex] = find(res, (r) => r === false, props2.scrollToError);
+          const hasError = errorIndex > -1;
+          if (hasError) {
+            const formItemElement = (_a = formItems[errorIndex].instance.proxy) == null ? void 0 : _a.$el;
+            scroll(formItemElement);
+          }
+          return !hasError;
+        }
+        return res.every((result) => result === true);
+      });
+    }
+    function reset() {
+      return formItems.forEach(({ reset: reset2 }) => reset2());
+    }
+    function resetValidation() {
+      return formItems.forEach(({ resetValidation: resetValidation2 }) => resetValidation2());
+    }
+    return {
+      n,
+      handleSubmit,
+      handleReset,
+      validate,
+      reset,
+      resetValidation
+    };
+  }
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};

package/es/form/index.mjs

@@ -0,0 +1,15 @@
+import Form from "./Form.mjs";
+import { useValidation, withInstall, withPropsDefaultsSetter } from "../utils/components.mjs";
+import { useForm } from "./provide.mjs";
+import { props as formProps } from "./props.mjs";
+Form.useValidation = useValidation;
+Form.useForm = useForm;
+withInstall(Form);
+withPropsDefaultsSetter(Form, formProps);
+const _FormComponent = Form;
+var stdin_default = Form;
+export {
+  _FormComponent,
+  stdin_default as default,
+  formProps
+};

package/es/form/props.mjs

@@ -0,0 +1,15 @@
+import { defineListenerProp } from "../utils/components.mjs";
+const props = {
+  disabled: Boolean,
+  readonly: Boolean,
+  scrollToError: String,
+  scrollToErrorOffsetY: {
+    type: [String, Number],
+    default: 0
+  },
+  onSubmit: defineListenerProp(),
+  onReset: defineListenerProp()
+};
+export {
+  props
+};

package/es/form/provide.mjs

@@ -0,0 +1,47 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { useChildren, useParent } from "@varlet/use";
+import { getCurrentInstance } from "vue";
+const FORM_BIND_FORM_ITEM_KEY = Symbol("FORM_BIND_FORM_ITEM_KEY");
+function useForm() {
+  const { parentProvider, index, bindParent } = useParent(FORM_BIND_FORM_ITEM_KEY);
+  const instance = getCurrentInstance();
+  const bindForm = bindParent ? (formItemProvider) => {
+    bindParent(__spreadProps(__spreadValues({}, formItemProvider), { instance }));
+  } : null;
+  return {
+    index,
+    form: parentProvider,
+    bindForm
+  };
+}
+function useFormItems() {
+  const { childProviders, length, bindChildren } = useChildren(FORM_BIND_FORM_ITEM_KEY);
+  return {
+    length,
+    formItems: childProviders,
+    bindFormItems: bindChildren
+  };
+}
+export {
+  FORM_BIND_FORM_ITEM_KEY,
+  useForm,
+  useFormItems
+};

package/es/form/style/index.mjs

@@ -0,0 +1,2 @@
+import '../../styles/common.css'
+import '../FormSfc.css'

package/es/form-details/FormDetails.mjs

@@ -0,0 +1,90 @@
+import { defineComponent } from "vue";
+import { createNamespace } from "../utils/components.mjs";
+import { props } from "./props.mjs";
+const { name, n } = createNamespace("form-details");
+import { toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, Transition as _Transition, withCtx as _withCtx, createVNode as _createVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, renderSlot as _renderSlot, createBlock as _createBlock } from "vue";
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = { key: 0 };
+function __render__(_ctx, _cache) {
+  return _openBlock(), _createBlock(_Transition, {
+    name: _ctx.n()
+  }, {
+    default: _withCtx(() => [
+      _ctx.errorMessage || _ctx.extraMessage || _ctx.$slots["extra-message"] ? (_openBlock(), _createElementBlock(
+        "div",
+        {
+          key: 0,
+          class: _normalizeClass(_ctx.n())
+        },
+        [
+          _createElementVNode(
+            "div",
+            {
+              class: _normalizeClass(_ctx.n("error-message"))
+            },
+            [
+              _createVNode(_Transition, {
+                name: _ctx.n("message")
+              }, {
+                default: _withCtx(() => [
+                  _ctx.errorMessage ? (_openBlock(), _createElementBlock(
+                    "div",
+                    _hoisted_1,
+                    _toDisplayString(_ctx.errorMessage),
+                    1
+                    /* TEXT */
+                  )) : _createCommentVNode("v-if", true)
+                ]),
+                _: 1
+                /* STABLE */
+              }, 8, ["name"])
+            ],
+            2
+            /* CLASS */
+          ),
+          _createElementVNode(
+            "div",
+            {
+              class: _normalizeClass(_ctx.n("extra-message"))
+            },
+            [
+              _createVNode(_Transition, {
+                name: _ctx.n("message")
+              }, {
+                default: _withCtx(() => [
+                  _renderSlot(_ctx.$slots, "extra-message", {}, () => [
+                    _ctx.extraMessage ? (_openBlock(), _createElementBlock(
+                      "div",
+                      _hoisted_2,
+                      _toDisplayString(_ctx.extraMessage),
+                      1
+                      /* TEXT */
+                    )) : _createCommentVNode("v-if", true)
+                  ])
+                ]),
+                _: 3
+                /* FORWARDED */
+              }, 8, ["name"])
+            ],
+            2
+            /* CLASS */
+          )
+        ],
+        2
+        /* CLASS */
+      )) : _createCommentVNode("v-if", true)
+    ]),
+    _: 3
+    /* FORWARDED */
+  }, 8, ["name"]);
+}
+const __sfc__ = defineComponent({
+  name,
+  props,
+  setup: () => ({ n })
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};

package/es/form-details/formDetails.css

@@ -0,0 +1 @@
+:root { --form-details-error-message-color: var(--color-danger); --form-details-extra-message-color: #888; --form-details-margin-top: 6px; --form-details-font-size: 12px; --form-details-message-margin-right: 4px;}.var-form-details { display: flex; justify-content: space-between; font-size: var(--form-details-font-size); margin-top: var(--form-details-margin-top);}.var-form-details-enter-from,.var-form-details-leave-to { opacity: 0; margin-top: 2px !important;}.var-form-details-enter-active,.var-form-details-leave-active { transition: 0.2s all var(--cubic-bezier);}.var-form-details__message-enter-from,.var-form-details__message-leave-to { opacity: 0;}.var-form-details__message-enter-active,.var-form-details__message-leave-active { transition: 0.2s all var(--cubic-bezier);}.var-form-details__error-message { flex-grow: 1; color: var(--form-details-error-message-color); margin-right: var(--form-details-message-margin-right); user-select: none; text-align: left;}.var-form-details__extra-message { flex-shrink: 0; color: var(--form-details-extra-message-color); user-select: none; text-align: right;}

package/es/form-details/index.mjs

@@ -0,0 +1,12 @@
+import FormDetails from "./FormDetails.mjs";
+import { withInstall, withPropsDefaultsSetter } from "../utils/components.mjs";
+import { props as formDetailsProps } from "./props.mjs";
+withInstall(FormDetails);
+withPropsDefaultsSetter(FormDetails, formDetailsProps);
+const _FormDetailsComponent = FormDetails;
+var stdin_default = FormDetails;
+export {
+  _FormDetailsComponent,
+  stdin_default as default,
+  formDetailsProps
+};

package/es/form-details/props.mjs

@@ -0,0 +1,13 @@
+const props = {
+  errorMessage: {
+    type: String,
+    default: ""
+  },
+  extraMessage: {
+    type: String,
+    default: ""
+  }
+};
+export {
+  props
+};

package/es/form-details/style/index.mjs

@@ -0,0 +1,3 @@
+import '../../styles/common.css'
+import '../formDetails.css'
+import '../FormDetailsSfc.css'

package/es/hover/index.mjs

@@ -0,0 +1,126 @@
+import { isFunction, camelize, inMobile } from "@varlet/shared";
+function shouldDisabled(arg) {
+  if (!arg) {
+    return false;
+  }
+  if (arg === "desktop" && inMobile()) {
+    return true;
+  }
+  if (arg === "mobile" && !inMobile()) {
+    return true;
+  }
+  return false;
+}
+function getStyle(element) {
+  const style = element.getAttribute("style");
+  if (!style) return {};
+  return style.split(";").filter(Boolean).reduce((style2, item) => {
+    const [key, value] = item.split(":").map((item2) => item2.trim());
+    style2[camelize(key)] = value;
+    return style2;
+  }, {});
+}
+function updateRawStyle(element) {
+  const { value } = element._hover;
+  const style = getStyle(element);
+  Object.keys(value).forEach((key) => {
+    const camelizedKey = camelize(key);
+    const styleValue = value[camelizedKey];
+    if (styleValue != null && style[camelizedKey]) {
+      element._hover.rawStyle[camelizedKey] = style[camelizedKey];
+    }
+  });
+}
+function updateStyle(element, styleValue) {
+  Object.keys(styleValue).forEach((key) => {
+    const value = styleValue[key];
+    if (value != null) {
+      element.style[key] = value;
+    }
+  });
+}
+function clearStyle(element) {
+  Object.keys(element._hover.value).forEach((key) => {
+    const value = element._hover.value[key];
+    if (value != null) {
+      element.style[key] = "";
+    }
+  });
+}
+function restoreStyle(element) {
+  if ((element == null ? void 0 : element._hover) == null) {
+    return;
+  }
+  clearStyle(element);
+  updateStyle(element, element._hover.rawStyle);
+}
+function createHover() {
+  const { value } = this._hover;
+  this._hover.hovering = true;
+  if (isFunction(value)) {
+    value(this._hover.hovering);
+    return;
+  }
+  updateStyle(this, value);
+}
+function removeHover() {
+  this._hover.hovering = false;
+  if (isFunction(this._hover.value)) {
+    this._hover.value(this._hover.hovering);
+    return;
+  }
+  restoreStyle(this);
+}
+function mounted(element, binding) {
+  var _a, _b;
+  const { arg, value } = binding;
+  if (shouldDisabled(arg)) {
+    return;
+  }
+  element._hover = {
+    value,
+    hovering: (_b = (_a = element._hover) == null ? void 0 : _a.hovering) != null ? _b : false,
+    rawStyle: {}
+  };
+  updateRawStyle(element);
+  element.addEventListener("mouseenter", createHover);
+  element.addEventListener("mouseleave", removeHover);
+}
+function unmounted(element, binding) {
+  if (shouldDisabled(binding.arg)) {
+    return;
+  }
+  restoreStyle(element);
+  element.removeEventListener("mouseenter", createHover);
+  element.removeEventListener("mouseleave", removeHover);
+}
+function beforeUpdate(element, binding) {
+  if (!element._hover) {
+    return;
+  }
+  unmounted(element, binding);
+}
+function shouldUpdateStyle(element, binding) {
+  return !isFunction(binding.value) && element._hover.hovering;
+}
+function updated(element, binding) {
+  mounted(element, binding);
+  if (shouldUpdateStyle(element, binding)) {
+    updateStyle(element, binding.value);
+  }
+}
+const Hover = {
+  mounted,
+  unmounted,
+  beforeUpdate,
+  updated,
+  install(app) {
+    app.directive("hover", this);
+  }
+};
+const _HoverComponent = Hover;
+var stdin_default = Hover;
+export {
+  _HoverComponent,
+  stdin_default as default
+};

package/es/hover-overlay/HoverOverlay.mjs

@@ -0,0 +1,31 @@
+import { defineComponent } from "vue";
+import { props } from "./props.mjs";
+import { createNamespace } from "../utils/components.mjs";
+import { inMobile } from "@varlet/shared";
+const { name, n, classes } = createNamespace("hover-overlay");
+import { normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
+function __render__(_ctx, _cache) {
+  return _openBlock(), _createElementBlock(
+    "div",
+    {
+      class: _normalizeClass(_ctx.classes(_ctx.n(), [_ctx.hovering, _ctx.n("--hovering")], [_ctx.focusing && !_ctx.inMobile(), _ctx.n("--focusing")]))
+    },
+    null,
+    2
+    /* CLASS */
+  );
+}
+const __sfc__ = defineComponent({
+  name,
+  props,
+  setup: () => ({
+    n,
+    classes,
+    inMobile
+  })
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};

package/es/hover-overlay/hoverOverlay.css

@@ -0,0 +1 @@
+:root { --hover-overlay-opacity: var(--opacity-hover); --hover-overlay-focusing-opacity: var(--opacity-focus);}.var-hover-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: inherit; background-color: currentColor; opacity: 0; transition: opacity 0.15s; will-change: opacity; pointer-events: none;}.var-hover-overlay--hovering { opacity: var(--hover-overlay-opacity);}.var-hover-overlay--focusing { opacity: var(--hover-overlay-focusing-opacity);}

package/es/hover-overlay/index.mjs

@@ -0,0 +1,24 @@
+import HoverOverlay from "./HoverOverlay.mjs";
+import { withInstall, withPropsDefaultsSetter } from "../utils/components.mjs";
+import { props as hoverOverlayProps } from "./props.mjs";
+import { ref } from "vue";
+withInstall(HoverOverlay);
+withPropsDefaultsSetter(HoverOverlay, hoverOverlayProps);
+function useHoverOverlay() {
+  const hovering = ref(false);
+  const handleHovering = (value) => {
+    hovering.value = value;
+  };
+  return {
+    hovering,
+    handleHovering
+  };
+}
+const _HoverOverlayComponent = HoverOverlay;
+var stdin_default = HoverOverlay;
+export {
+  _HoverOverlayComponent,
+  stdin_default as default,
+  hoverOverlayProps,
+  useHoverOverlay
+};

package/es/hover-overlay/props.mjs

@@ -0,0 +1,7 @@
+const props = {
+  hovering: Boolean,
+  focusing: Boolean
+};
+export {
+  props
+};

package/es/hover-overlay/style/index.mjs

@@ -0,0 +1,3 @@
+import '../../styles/common.css'
+import '../hoverOverlay.css'
+import '../HoverOverlaySfc.css'

package/es/icon/Icon.mjs

@@ -0,0 +1,89 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { defineComponent, watch, ref, nextTick } from "vue";
+import { isURL, toNumber } from "@varlet/shared";
+import { props } from "./props.mjs";
+import { toSizeUnit } from "../utils/elements.mjs";
+import { createNamespace } from "../utils/components.mjs";
+const { name, n, classes } = createNamespace("icon");
+import { resolveDynamicComponent as _resolveDynamicComponent, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+function __render__(_ctx, _cache) {
+  return _openBlock(), _createBlock(_resolveDynamicComponent(_ctx.isURL(_ctx.name) ? "img" : "i"), {
+    class: _normalizeClass(
+      _ctx.classes(
+        _ctx.n(),
+        [_ctx.namespace !== _ctx.n(), _ctx.namespace],
+        `${_ctx.namespace}--set`,
+        [_ctx.isURL(_ctx.name), _ctx.n("image"), `${_ctx.namespace}-${_ctx.nextName}`],
+        [_ctx.animateInProgress, _ctx.animationClass == null ? _ctx.n("--shrinking") : _ctx.animationClass]
+      )
+    ),
+    style: _normalizeStyle({
+      color: _ctx.color,
+      "transition-duration": `${_ctx.toNumber(_ctx.transition)}ms`,
+      width: _ctx.isURL(_ctx.name) ? _ctx.toSizeUnit(_ctx.size) : null,
+      height: _ctx.isURL(_ctx.name) ? _ctx.toSizeUnit(_ctx.size) : null,
+      fontSize: _ctx.toSizeUnit(_ctx.size)
+    }),
+    src: _ctx.isURL(_ctx.name) ? _ctx.nextName : null,
+    onClick: _ctx.onClick
+  }, null, 8, ["class", "style", "src", "onClick"]);
+}
+const __sfc__ = defineComponent({
+  name,
+  props,
+  setup(props2) {
+    const nextName = ref("");
+    const animateInProgress = ref(false);
+    watch(() => props2.name, handleNameChange, { immediate: true });
+    function handleNameChange(newName, oldName) {
+      return __async(this, null, function* () {
+        const { transition } = props2;
+        if (oldName == null || toNumber(transition) === 0) {
+          nextName.value = newName;
+          return;
+        }
+        animateInProgress.value = true;
+        yield nextTick();
+        setTimeout(() => {
+          if (oldName != null) {
+            nextName.value = newName;
+          }
+          animateInProgress.value = false;
+        }, toNumber(transition));
+      });
+    }
+    return {
+      nextName,
+      animateInProgress,
+      n,
+      classes,
+      isURL,
+      toNumber,
+      toSizeUnit
+    };
+  }
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};