init component

node_modules/buetify/lib/composables/toggle/useToggle.js

@@ -0,0 +1,121 @@
+import { watch, computed, shallowRef, toRef } from 'vue';
+import { isEnterEvent } from '../../utils/eventHelpers';
+export function getUseTogglePropsDefinition(statusName, defaultStatus = false) {
+  return {
+    [statusName]: {
+      type: Boolean,
+      default: defaultStatus
+    },
+    [`onUpdate:${statusName}`]: {
+      type: Function,
+      required: false
+    },
+    hasPopup: {
+      type: Boolean,
+      default: false
+    },
+    onToggle: {
+      type: Function,
+      required: false
+    },
+    onSetOn: {
+      type: Function,
+      required: false
+    },
+    onSetOff: {
+      type: Function,
+      required: false
+    }
+  };
+}
+export function getToggleAttrs(status, hasPopup) {
+  return computed(() => ({
+    tabindex: 0,
+    role: 'button',
+    type: 'button',
+    'aria-pressed': status.value,
+    'aria-expanded': status.value,
+    ...(hasPopup.value ? {
+      'aria-haspopup': true
+    } : {})
+  }));
+}
+
+function getListeners(toggle) {
+  return {
+    onClick: toggle,
+    onKeydown: e => {
+      if (isEnterEvent(e)) {
+        e.preventDefault();
+        toggle();
+      }
+    }
+  };
+}
+
+export function useToggle(props, statusName) {
+  const internalStatus = shallowRef(props[statusName]);
+  const value = computed({
+    get() {
+      return internalStatus.value;
+    },
+
+    set(val) {
+      const cValue = internalStatus.value;
+
+      if (cValue !== val && props.onToggle) {
+        props.onToggle(val);
+      }
+
+      if (val && props.onSetOn) {
+        props.onSetOn();
+      }
+
+      if (!val && props.onSetOff) {
+        props.onSetOff();
+      }
+
+      internalStatus.value = val;
+      const updateModel = props[`onUpdate:${statusName}`]; //eslint-disable-line
+
+      if (updateModel) {
+        updateModel(val);
+      }
+    }
+
+  });
+  watch(() => props[statusName], status => {
+    internalStatus.value = status;
+  });
+
+  function setOn(e) {
+    e && e?.stopPropagation();
+    value.value = true;
+  }
+
+  function setOff(e) {
+    e && e?.stopPropagation();
+    value.value = false;
+  }
+
+  function toggle(e) {
+    e && e?.stopPropagation();
+    value.value = !value.value;
+  }
+
+  const attrs = getToggleAttrs(value, toRef(props, 'hasPopup'));
+  const listeners = getListeners(toggle);
+  return {
+    isOn: value,
+    isOff: computed(() => internalStatus.value === false),
+    attrs,
+    listeners,
+    props: computed(() => ({ ...attrs.value,
+      ...listeners
+    })),
+    setOn,
+    setOff,
+    toggle
+  };
+}
+//# sourceMappingURL=useToggle.js.map