@flagdeck/vue
Version:
Vue integration for Flagdeck feature flags
2 lines (1 loc) • 6.07 kB
JavaScript
(function(c,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@flagdeck/js")):typeof define=="function"&&define.amd?define(["exports","vue","@flagdeck/js"],t):(c=typeof globalThis<"u"?globalThis:c||self,t(c.FlagdeckVue={},c.Vue,c.Flagdeck))})(this,function(c,t,b){"use strict";const I=Symbol("Flagdeck");function F(){const r=t.inject(I);if(!r){const n=t.getCurrentInstance();if(n!=null&&n.appContext.config.globalProperties.$flagdeck)return{client:n.appContext.config.globalProperties.$flagdeck,isReady:!0,context:n.appContext.config.globalProperties.$flagdeckContext||{},setContext:e=>{n.appContext.config.globalProperties.$flagdeckContext=e}};throw new Error("useFlagdeck must be used within a component that has FlagdeckPlugin installed")}return r}function p(r,n=!1){const{client:e,context:i}=F(),l=t.ref(n),s=t.ref(!0),u=t.ref(void 0),d=t.ref(null),N=a=>{switch(a){case"FLAG_NOT_FOUND":return"notfound";case"FLAG_INACTIVE":return"inactive";case"INVALID_API_KEY":case"API_KEY_EXPIRED":case"ENVIRONMENT_MISMATCH":case"ENVIRONMENT_DISABLED":case"INVALID_ENVIRONMENT":return"configuration";default:return"other"}},f=async()=>{if(!e){s.value=!1;return}try{if(e.evaluateFlag){const a=await e.evaluateFlag(r,i);if(l.value=!!a.value,a.error){const o=N(a.error.code);u.value={code:a.error.code,message:a.error.message,type:o}}else u.value=void 0}else l.value=await e.isEnabled(r,i,n)}catch(a){console.error(`Error evaluating flag ${r}:`,a),l.value=n;const o=a;u.value={code:o.code||"UNKNOWN_ERROR",message:o.message||"Unknown error occurred",type:"other"}}finally{s.value=!1}};return t.onMounted(()=>{var a;f(),e!=null&&e.onFlagChange&&((a=e.areRealTimeUpdatesEnabled)!=null&&a.call(e))&&(d.value=e.onFlagChange(r,o=>{l.value=!!o,u.value&&(u.value=void 0)}))}),t.onUnmounted(()=>{d.value&&(d.value(),d.value=null)}),t.watch(()=>i,()=>{f()},{deep:!0}),{isEnabled:l,isLoading:s,error:u}}function _(r,n){const{client:e,context:i}=F(),l=t.ref(n),s=t.ref(!0),u=t.ref(void 0),d=t.ref(null),N=a=>{switch(a){case"FLAG_NOT_FOUND":return"notfound";case"FLAG_INACTIVE":return"inactive";case"INVALID_API_KEY":case"API_KEY_EXPIRED":case"ENVIRONMENT_MISMATCH":case"ENVIRONMENT_DISABLED":case"INVALID_ENVIRONMENT":return"configuration";default:return"other"}},f=async()=>{if(!e){s.value=!1;return}try{if(e.evaluateFlag){const a=await e.evaluateFlag(r,i);if(l.value=a.value,a.error){const o=N(a.error.code);u.value={code:a.error.code,message:a.error.message,type:o}}else u.value=void 0}else l.value=await e.getValue(r,i,n)}catch(a){console.error(`Error evaluating flag ${r}:`,a),l.value=n;const o=a;u.value={code:o.code||"UNKNOWN_ERROR",message:o.message||"Unknown error occurred",type:"other"}}finally{s.value=!1}};return t.onMounted(()=>{var a;f(),e!=null&&e.onFlagChange&&((a=e.areRealTimeUpdatesEnabled)!=null&&a.call(e))&&(d.value=e.onFlagChange(r,o=>{l.value=o,u.value&&(u.value=void 0)}))}),t.onUnmounted(()=>{d.value&&(d.value(),d.value=null)}),t.watch(()=>i,()=>{f()},{deep:!0}),{value:l,isLoading:s,error:u}}function h(r,n){const{client:e,context:i}=F(),l=t.ref(Object.fromEntries(r.map(a=>[a,n]))),s=t.ref(!0),u=t.ref({}),d=t.ref(new Map),N=a=>{switch(a){case"FLAG_NOT_FOUND":return"notfound";case"FLAG_INACTIVE":return"inactive";case"INVALID_API_KEY":case"API_KEY_EXPIRED":case"ENVIRONMENT_MISMATCH":case"ENVIRONMENT_DISABLED":case"INVALID_ENVIRONMENT":return"configuration";default:return"other"}},f=async()=>{if(!e||r.length===0){s.value=!1;return}try{if(e.evaluateBulk){const a=await e.evaluateBulk(r,i),o={},E={};Object.entries(a.results).forEach(([g,v])=>{if(o[g]=v.value,v.error){const y=N(v.error.code);E[g]={code:v.error.code,message:v.error.message,type:y}}}),l.value=o,u.value=E}else l.value=await e.getValues(r,i,n)}catch(a){console.error("Error evaluating flags:",a),l.value=Object.fromEntries(r.map(g=>[g,n]));const o=a,E={code:o.code||"UNKNOWN_ERROR",message:o.message||"Unknown error occurred",type:"other"};u.value=Object.fromEntries(r.map(g=>[g,E]))}finally{s.value=!1}};return t.onMounted(()=>{var a;f(),e!=null&&e.onFlagChange&&((a=e.areRealTimeUpdatesEnabled)!=null&&a.call(e))&&r.forEach(o=>{const E=e.onFlagChange(o,g=>{if(l.value={...l.value,[o]:g},u.value[o]){const v={...u.value};delete v[o],u.value=v}});d.value.set(o,E)})}),t.onUnmounted(()=>{d.value.forEach(a=>{typeof a=="function"&&a()}),d.value.clear()}),t.watch(()=>i,()=>{f()},{deep:!0}),{values:l,isLoading:s,errors:u}}const A=t.defineComponent({name:"FeatureFlag",props:{flagKey:{type:String,required:!0},defaultEnabled:{type:Boolean,default:!1},renderNull:{type:Boolean,default:!1}},emits:["error","not-found","inactive"],setup(r,{slots:n,emit:e}){const{isEnabled:i,isLoading:l,error:s}=p(r.flagKey,r.defaultEnabled);return s.value&&(e("error",s.value),s.value.type==="notfound"?e("not-found"):s.value.type==="inactive"&&e("inactive")),()=>l.value&&n.loading?n.loading():i.value?n.default?n.default():null:r.renderNull?null:n.fallback?n.fallback():null}}),O=t.defineComponent({name:"FlagValue",props:{flagKey:{type:String,required:!0},defaultValue:{type:null,required:!0}},setup(r,{slots:n}){const e=_(r.flagKey,r.defaultValue);return()=>n.default?n.default({value:e.value.value,isLoading:e.isLoading.value,error:e.error.value}):null}}),R=t.defineComponent({name:"WithFeature",props:{flagKey:{type:String,required:!0},defaultEnabled:{type:Boolean,default:!1}},setup(r,{slots:n}){const e=p(r.flagKey,r.defaultEnabled);return()=>n.default?n.default({isEnabled:e.isEnabled.value,isLoading:e.isLoading.value,error:e.error.value}):null}}),m=(r,n)=>{const e=new b.Flagdeck(n.clientOptions);r.provide(I,{client:e,isReady:!0,context:n.context||{},setContext:i=>{r.config.globalProperties.$flagdeckContext=i}}),r.config.globalProperties.$flagdeck=e,r.config.globalProperties.$flagdeckContext=n.context||{}},T={install:m};function C(r){return{install:n=>{m(n,r)}}}c.FeatureFlag=A,c.FlagValue=O,c.FlagdeckPlugin=T,c.WithFeature=R,c.createFlagdeckPlugin=C,c.useFlag=p,c.useFlagValue=_,c.useFlagdeck=F,c.useFlags=h,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});