vue-cesium-jyt/lib/components/ui/fab/fab.js

Vue 3.x components for CesiumJS.

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var useModelToggle = require('../../../composables/private/use-model-toggle.js');
var render = require('../../../utils/private/render.js');
var config = require('../../../utils/config.js');
var useFab = require('./use-fab.js');
var index$1 = require('../btn/index.js');
var index = require('../icon/index.js');
var defaultProps = require('./defaultProps.js');

const fabProps = defaultProps["default"];
var Fab = vue.defineComponent({
  name: "VcFab",
  props: fabProps,
  emits: useModelToggle.useModelToggleEmits,
  setup(props, { slots }) {
    const triggerRef = vue.ref(null);
    const showing = vue.ref(props.modelValue === true);
    const { formClass, labelProps } = useFab["default"](props, showing);
    const hideOnRouteChange = vue.computed(() => props.persistent !== true);
    const { hide, toggle } = useModelToggle["default"]({
      showing,
      hideOnRouteChange
    });
    const classes = vue.computed(() => `vc-fab z-fab row inline justify-center vc-fab--align-${props.verticalActionsAlign} ${formClass.value}` + (showing.value === true ? " vc-fab--opened" : ""));
    const actionClass = vue.computed(() => `vc-fab__actions flex no-wrap inline vc-fab__actions--${props.direction}`);
    function getTriggerContent() {
      const child = [];
      props.hideIcon !== true && child.push(vue.h("div", { class: "vc-fab__icon-holder" }, [
        vue.h(index["default"], {
          class: "vc-fab__icon absolute-full",
          name: props.icon
        }),
        vue.h(index["default"], {
          class: "vc-fab__active-icon absolute-full",
          name: props.activeIcon
        })
      ]));
      props.label !== "" && child[labelProps.value.action](vue.h("div", labelProps.value.data, [props.label]));
      return render.hMergeSlot(slots.tooltip, child);
    }
    vue.provide(config.fabKey, {
      showing,
      onChildClick(evt) {
        props.hideActionOnClick && hide(evt);
        if (triggerRef.value !== null) {
          triggerRef.value.$el.focus();
        }
      }
    });
    return () => vue.h("div", {
      class: classes.value
    }, [
      vue.h(index$1["default"], {
        ref: triggerRef,
        class: formClass.value,
        ...props,
        noWrap: true,
        stack: props.stacked,
        align: void 0,
        icon: void 0,
        label: void 0,
        noCaps: true,
        fab: true,
        flat: props.flat,
        size: props.size,
        "aria-expanded": showing.value === true ? "true" : "false",
        "aria-haspopup": "true",
        onClick: toggle
      }, getTriggerContent),
      vue.h("div", { class: actionClass.value }, render.hSlot(slots.default))
    ]);
  }
});

exports["default"] = Fab;
exports.fabProps = fabProps;
//# sourceMappingURL=fab.js.map