featurefly 0.1.0

package/dist/vue/index.js

@@ -0,0 +1,136 @@
+// ═══════════════════════════════════════════════════════════════════════════════
+// FeatureFly — Vue Composables
+// ═══════════════════════════════════════════════════════════════════════════════
+//
+// Thin wrapper providing Vue 3 composables for FeatureFly SDK.
+// Requires Vue 3.x (Composition API).
+//
+// Usage:
+//   import { FeatureFlyPlugin, useFeatureFlag, useAllFlags } from 'featurefly/vue';
+//
+// ═══════════════════════════════════════════════════════════════════════════════
+import { inject, ref, onMounted, onUnmounted, watch, } from 'vue';
+// ─── Plugin & Injection Key ─────────────────────────────────────────────────────
+const FEATUREFLY_KEY = Symbol('featurefly');
+/**
+ * Vue Plugin that provides the FeatureFlagsClient to the entire app.
+ *
+ * @example
+ * ```ts
+ * import { createApp } from 'vue';
+ * import { FeatureFlyPlugin } from 'featurefly/vue';
+ *
+ * const app = createApp(App);
+ * app.use(FeatureFlyPlugin, { client: featureFlyClient });
+ * ```
+ */
+export const FeatureFlyPlugin = {
+    install(app, options) {
+        app.provide(FEATUREFLY_KEY, options.client);
+    },
+};
+function useClient() {
+    const client = inject(FEATUREFLY_KEY);
+    if (!client) {
+        throw new Error('useFeatureFlag must be called inside a component where FeatureFlyPlugin is installed. ' +
+            'Use app.use(FeatureFlyPlugin, { client }) in your main.ts.');
+    }
+    return client;
+}
+// ─── useFeatureFlag ─────────────────────────────────────────────────────────────
+/**
+ * Vue composable for evaluating a single feature flag.
+ * Returns a reactive `Ref` that auto-updates on flag changes.
+ *
+ * @param slug Flag slug identifier
+ * @param defaultValue Default value while loading
+ * @param context Optional reactive evaluation context
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useFeatureFlag } from 'featurefly/vue';
+ *
+ * const darkMode = useFeatureFlag('dark-mode', false);
+ * </script>
+ *
+ * <template>
+ *   <div :class="{ dark: darkMode.value }">...</div>
+ * </template>
+ * ```
+ */
+export function useFeatureFlag(slug, defaultValue, context) {
+    const client = useClient();
+    const value = ref(defaultValue);
+    const unsubs = [];
+    const evaluate = async () => {
+        try {
+            const ctx = context && 'value' in context ? context.value : context;
+            const result = await client.evaluateFlag(slug, ctx);
+            value.value = result;
+        }
+        catch {
+            // Keep current value on error
+        }
+    };
+    onMounted(() => {
+        evaluate();
+        unsubs.push(client.on('flagsUpdated', () => evaluate()));
+        unsubs.push(client.on('flagChanged', (payload) => {
+            if (payload.slug === slug)
+                evaluate();
+        }));
+        // If context is reactive, re-evaluate when it changes
+        if (context && 'value' in context) {
+            watch(context, () => evaluate(), { deep: true });
+        }
+    });
+    onUnmounted(() => {
+        unsubs.forEach((u) => u());
+    });
+    return value;
+}
+// ─── useAllFlags ────────────────────────────────────────────────────────────────
+/**
+ * Vue composable for batch-evaluating all feature flags.
+ * Returns a reactive `Ref<Record<string, FlagValue>>` that auto-updates.
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useAllFlags } from 'featurefly/vue';
+ *
+ * const flags = useAllFlags({ workspaceId: 'ws-123' });
+ * </script>
+ *
+ * <template>
+ *   <NewFeature v-if="flags['new-feature']" />
+ * </template>
+ * ```
+ */
+export function useAllFlags(context) {
+    const client = useClient();
+    const flags = ref({});
+    const unsubs = [];
+    const evaluate = async () => {
+        try {
+            const ctx = context && 'value' in context ? context.value : context;
+            const result = await client.evaluateAllFlags(ctx);
+            flags.value = result;
+        }
+        catch {
+            // Keep current value on error
+        }
+    };
+    onMounted(() => {
+        evaluate();
+        unsubs.push(client.on('flagsUpdated', () => evaluate()));
+        if (context && 'value' in context) {
+            watch(context, () => evaluate(), { deep: true });
+        }
+    });
+    onUnmounted(() => {
+        unsubs.forEach((u) => u());
+    });
+    return flags;
+}

package/package.json

@@ -0,0 +1,97 @@
+{
+  "name": "featurefly",
+  "version": "0.1.0",
+  "description": "Lightweight, framework-agnostic Feature Flags SDK with built-in caching, retry, circuit breaker, targeting, A/B testing, and real-time streaming",
+  "main": "dist/index.js",
+  "module": "dist/index.esm.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsc && tsc --project tsconfig.esm.json",
+    "dev": "tsc --watch",
+    "test": "jest --coverage",
+    "test:watch": "jest --watch",
+    "lint": "eslint src --ext .ts",
+    "clean": "rm -rf dist",
+    "prepublishOnly": "npm run clean && npm run build && npm test"
+  },
+  "keywords": [
+    "feature-flags",
+    "feature-toggles",
+    "featurefly",
+    "sdk",
+    "typescript",
+    "framework-agnostic",
+    "feature-management",
+    "ab-testing",
+    "gradual-rollout",
+    "circuit-breaker",
+    "targeting",
+    "streaming",
+    "edge-evaluation",
+    "react-hooks",
+    "vue-composables"
+  ],
+  "author": "Arrua Platform Team",
+  "license": "MIT",
+  "homepage": "https://github.com/ArruaBrian/featurefly#readme",
+  "bugs": {
+    "url": "https://github.com/ArruaBrian/featurefly/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ArruaBrian/featurefly.git"
+  },
+  "dependencies": {
+    "axios": "^1.6.0"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.0.0",
+    "@types/node": "^20.0.0",
+    "@types/react": "^18.3.28",
+    "@typescript-eslint/eslint-plugin": "^6.21.0",
+    "@typescript-eslint/parser": "^6.21.0",
+    "eslint": "^8.57.1",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-prettier": "^5.5.5",
+    "jest": "^29.0.0",
+    "ts-jest": "^29.0.0",
+    "typescript": "^5.0.0",
+    "vue": "^3.5.29"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "vue": ">=3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    }
+  },
+  "exports": {
+    ".": {
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./react": {
+      "import": "./dist/react/index.js",
+      "require": "./dist/react/index.js",
+      "types": "./dist/react/index.d.ts"
+    },
+    "./vue": {
+      "import": "./dist/vue/index.js",
+      "require": "./dist/vue/index.js",
+      "types": "./dist/vue/index.d.ts"
+    }
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}