buefy/dist/components/collapse/index.js

Lightweight UI components for Vue.js (v3) based on Bulma

/*! Buefy v3.0.2 | MIT License | github.com/buefy/buefy */
(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
    typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) :
    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Collapse = {}, global.Vue));
})(this, (function (exports, vue) { 'use strict';

    const COLLAPSE_POSITIONS = ["is-top", "is-bottom"];
    var _sfc_main = vue.defineComponent({
      name: "BCollapse",
      props: {
        modelValue: {
          type: Boolean,
          default: true
        },
        animation: {
          type: String,
          default: "fade"
        },
        ariaId: {
          type: String,
          default: ""
        },
        position: {
          type: String,
          default: "is-top",
          validator(value) {
            return COLLAPSE_POSITIONS.indexOf(value) > -1;
          }
        }
      },
      emits: {
        close: () => true,
        open: () => true,
        // eslint-disable-next-line @typescript-eslint/no-unused-vars
        "update:modelValue": (_value) => true
      },
      data() {
        return {
          isOpen: this.modelValue
        };
      },
      watch: {
        modelValue(value) {
          this.isOpen = value;
        }
      },
      methods: {
        /*
        * Toggle and emit events
        */
        toggle() {
          this.isOpen = !this.isOpen;
          this.$emit("update:modelValue", this.isOpen);
          this.isOpen ? this.$emit("open") : this.$emit("close");
        }
      },
      render() {
        const trigger = vue.h(
          "div",
          {
            class: "collapse-trigger",
            onClick: this.toggle
          },
          this.$slots.trigger ? this.$slots.trigger({ open: this.isOpen }) : void 0
        );
        const content = vue.withDirectives(
          vue.h(
            vue.Transition,
            { name: this.animation },
            () => [
              vue.h(
                "div",
                {
                  class: "collapse-content",
                  id: this.ariaId
                },
                this.$slots
              )
            ]
          ),
          [[vue.vShow, this.isOpen]]
        );
        return vue.h(
          "div",
          { class: "collapse" },
          this.position === "is-top" ? [trigger, content] : [content, trigger]
        );
      }
    });

    const registerComponent = (Vue, component, name) => {
      const componentName = component.name;
      if (componentName == null) {
        throw new Error("Buefy.registerComponent: missing component name");
      }
      Vue.component(componentName, component);
    };

    const Plugin = {
      install(Vue) {
        registerComponent(Vue, _sfc_main);
      }
    };

    exports.BCollapse = _sfc_main;
    exports.default = Plugin;

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

}));