@varlet/ui 2.9.0 → 2.9.1-alpha.1678875429822

package/es/style.mjs

@@ -29,6 +29,7 @@ import './fab/style/index.mjs'
 import './form/style/index.mjs'
 import './form-details/style/index.mjs'
 import './hover/style/index.mjs'
+import './hover-overlay/style/index.mjs'
 import './icon/style/index.mjs'
 import './image/style/index.mjs'
 import './image-preview/style/index.mjs'

package/es/switch/Switch.mjs

@@ -2,6 +2,8 @@ import { defineComponent, computed, nextTick } from 'vue';
 import { useValidation, createNamespace, call } from '../utils/components.mjs';
 import { multiplySizeUnit } from '../utils/elements.mjs';
 import { useForm } from '../form/provide.mjs';
+import VarHoverOverlay, { useHoverOverlay } from '../hover-overlay/index.mjs';
+import Hover from '../hover/index.mjs';
 import { props } from './props.mjs';
 import VarFormDetails from '../form-details/index.mjs';
 import VarLoading from '../loading/index.mjs';
@@ -10,16 +12,20 @@ var {
   n,
   classes
 } = createNamespace('switch');
-import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, resolveDirective as _resolveDirective, createElementBlock as _createElementBlock, withDirectives as _withDirectives, createVNode as _createVNode } from "vue";
+import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createVNode as _createVNode, resolveDirective as _resolveDirective, createElementBlock as _createElementBlock, withDirectives as _withDirectives } from "vue";
 
 function __render__(_ctx, _cache) {
   var _component_var_loading = _resolveComponent("var-loading");
 
+  var _component_var_hover_overlay = _resolveComponent("var-hover-overlay");
+
   var _component_var_form_details = _resolveComponent("var-form-details");
 
   var _directive_ripple = _resolveDirective("ripple");
 
-  return _openBlock(), _createElementBlock("div", {
+  var _directive_hover = _resolveDirective("hover");
+
+  return _withDirectives((_openBlock(), _createElementBlock("div", {
     class: _normalizeClass(_ctx.n())
   }, [_createElementVNode("div", {
     class: _normalizeClass(_ctx.classes(_ctx.n('block'), [_ctx.disabled || _ctx.formDisabled, _ctx.n('--disabled')])),
@@ -46,7 +52,11 @@ function __render__(_ctx, _cache) {
   /* PROPS */
   , ["radius"])) : _createCommentVNode("v-if", true)], 6
   /* CLASS, STYLE */
-  )], 6
+  ), _createVNode(_component_var_hover_overlay, {
+    hovering: _ctx.hovering
+  }, null, 8
+  /* PROPS */
+  , ["hovering"])], 6
   /* CLASS, STYLE */
   )), [[_directive_ripple, {
     disabled: !_ctx.ripple || _ctx.disabled || _ctx.loading || _ctx.formDisabled
@@ -58,17 +68,19 @@ function __render__(_ctx, _cache) {
   /* PROPS */
   , ["error-message"])], 2
   /* CLASS */
-  );
+  )), [[_directive_hover, _ctx.hover, "desktop"]]);
 }
 
 var __sfc__ = defineComponent({
   name: 'VarSwitch',
   components: {
     VarLoading,
-    VarFormDetails
+    VarFormDetails,
+    VarHoverOverlay
   },
   directives: {
-    Ripple
+    Ripple,
+    Hover
   },
   props,
 
@@ -83,6 +95,10 @@ var __sfc__ = defineComponent({
       validate: v,
       resetValidation
     } = useValidation();
+    var {
+      hovering,
+      handleHovering
+    } = useHoverOverlay();
 
     var validate = () => v(props.rules, props.modelValue);
 
@@ -150,6 +166,11 @@ var __sfc__ = defineComponent({
       validateWithTrigger();
     };
 
+    var hover = value => {
+      if (props.disabled || form != null && form.disabled.value) return;
+      handleHovering(value);
+    };
+
     var reset = () => {
       call(props['onUpdate:modelValue'], props.inactiveValue);
       resetValidation();
@@ -165,6 +186,8 @@ var __sfc__ = defineComponent({
       n,
       classes,
       switchActive,
+      hovering,
+      hover,
       radius,
       styleComputed,
       errorMessage,

package/es/switch/style/index.mjs

@@ -3,5 +3,6 @@ import '../../styles/elevation.css'
 import '../../ripple/ripple.css'
 import '../../loading/loading.css'
 import '../../form-details/formDetails.css'
+import '../../hover-overlay/hoverOverlay.css'
 import '../switch.css'
 import '../SwitchSfc.css'