flagmint-vuejs-feature-flags/dist/vue2-feature.mjs

A Vue.js SDK for managing feature flags in Flagmint applications, supporting both Vue 2 and Vue 3.

import { defineComponent, ref, computed, renderSlot, createCommentVNode, inject } from 'vue';
import 'vue-demi';

// Injection symbols
const FLAGMINT_INIT = Symbol('FLAGMINT_INIT');
const FLAGMINT_READY = Symbol('FLAGMINT_READY');
const FLAGMINT_CLIENT = Symbol('FLAGMINT_CLIENT');
// Reactive references
ref(null);
ref(false);

function useFlagmint() {
    let client = null;
    let ready = null;
    let init = null;
    const resolve = () => {
        client = inject(FLAGMINT_CLIENT, null);
        ready = inject(FLAGMINT_READY, null);
        init = inject(FLAGMINT_INIT, null);
    };
    return {
        get client() {
            if (!client)
                resolve();
            return client;
        },
        get ready() {
            if (!ready)
                resolve();
            return ready;
        },
        get init() {
            if (!init)
                resolve();
            return init;
        }
    };
}

var script$1 = defineComponent({
    name: 'Feature',
    props: {
        featureKey: { type: String, required: true }
    },
    setup(props) {
        const { client, ready } = useFlagmint();
        if (!client) {
            console.warn('Feature component requires a client to be injected.');
            return { enabled: computed(() => false) };
        }
        const enabled = true;
        return { enabled };
    }
});

function render$1(_ctx, _cache, $props, $setup, $data, $options) {
  return (_ctx.enabled)
    ? renderSlot(_ctx.$slots, "default", { key: 0 })
    : createCommentVNode("v-if", true)
}

script$1.render = render$1;
script$1.__file = "sdk/vue3/component/Feature.vue";

var script = {
  name: 'App',
  components: { Feature: script$1 },
  setup() {
    const flagClient = inject('__flagmint__');

    function toggleFeature(key) {
      if (flagClient) {
        flagClient.flags[key] = !flagClient.flags[key];
      }
    }

    return {
      flagClient,
      toggleFeature
    };
  }
};

function render(_ctx, _cache, $props, $setup, $data, $options) {
  return (_ctx.enabled)
    ? renderSlot(_ctx.$slots, "default", { key: 0 })
    : createCommentVNode("v-if", true)
}

script.render = render;
script.__file = "sdk/vue2/component/Feature.vue";

export { script as default };