@flipfeatureflag/vue 0.1.7 → 0.1.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flipfeatureflag/vue",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "flipFeatureFlag Vue SDK",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
@@ -20,7 +20,7 @@
     "vue": ">=3"
   },
   "dependencies": {
-    "@flipfeatureflag/core": "0.1.6",
-    "@flipfeatureflag/js": "0.1.7"
+    "@flipfeatureflag/core": "0.1.8",
+    "@flipfeatureflag/js": "0.1.9"
   }
 }

package/src/index.ts

@@ -52,12 +52,28 @@ export function useFlagsStatus(): FlagsStatus {
   return status;
 }
 
-export function useFlag(flagKey: string, defaultValue = false): Ref<boolean> {
+export interface FlagValueResult<T = SdkFlagEvaluation["value"]> {
+  value: T;
+  enabled: boolean;
+}
+
+function toFlagResult(evaluation: SdkFlagEvaluation, known: boolean): FlagValueResult {
+  const enabled = known && evaluation.reason !== "disabled";
+  return {
+    value: evaluation.value,
+    enabled,
+  };
+}
+
+export function useFlag(
+  flagKey: string,
+  defaultValue: SdkFlagEvaluation["value"] = false,
+): Ref<FlagValueResult> {
   const client = useFlipFlagClient();
-  const state = ref(client.isEnabled(flagKey, defaultValue));
+  const state = ref(toFlagResult(client.getVariant(flagKey, defaultValue), client.hasFlag(flagKey)));
 
   const update = () => {
-    state.value = client.isEnabled(flagKey, defaultValue);
+    state.value = toFlagResult(client.getVariant(flagKey, defaultValue), client.hasFlag(flagKey));
   };
 
   client.on("update", update);