@ttoss/react-feature-flags 0.2.2 → 0.2.3

package/dist/esm/index.js

@@ -0,0 +1,66 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+
+// src/useFeatureFlag.ts
+import * as React2 from "react";
+
+// src/FeatureFlagsProvider.tsx
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var FeatureFlagsContext = React.createContext({
+  features: [],
+  setFeatures: () => {}
+});
+var FeatureFlagsProvider = ({
+  children,
+  loadFeatures
+}) => {
+  const [features, setFeatures] = React.useState([]);
+  React.useEffect(() => {
+    loadFeatures?.().then(features2 => {
+      return setFeatures(features2);
+    });
+  }, [loadFeatures]);
+  return /* @__PURE__ */jsx(FeatureFlagsContext.Provider, {
+    value: {
+      features,
+      setFeatures
+    },
+    children
+  });
+};
+
+// src/useFeatureFlag.ts
+var useFeatureFlag = name => {
+  const {
+    features
+  } = React2.useContext(FeatureFlagsContext);
+  return features.includes(name);
+};
+
+// src/FeatureFlag.tsx
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+var FeatureFlag = ({
+  name,
+  children,
+  fallback = null
+}) => {
+  const isEnabled = useFeatureFlag(name);
+  if (!isEnabled) {
+    return fallback;
+  }
+  return /* @__PURE__ */jsx2(Fragment, {
+    children
+  });
+};
+
+// src/useUpdateFeatures.ts
+import * as React3 from "react";
+var useUpdateFeatures = () => {
+  const {
+    setFeatures
+  } = React3.useContext(FeatureFlagsContext);
+  return {
+    updateFeatures: setFeatures
+  };
+};
+export { FeatureFlag, FeatureFlagsProvider, useFeatureFlag, useUpdateFeatures };

package/dist/index.d.ts

@@ -0,0 +1,26 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+interface FeatureFlagProps {
+    name: FeatureFlags;
+    children: React.ReactNode;
+    fallback?: React.ReactNode;
+}
+declare const FeatureFlag: ({ name, children, fallback, }: FeatureFlagProps) => string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element | null;
+
+declare const FeatureFlagsProvider: ({ children, loadFeatures, }: {
+    children: React.ReactNode;
+    loadFeatures?: () => Promise<FeatureFlags[]>;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const useFeatureFlag: (name: FeatureFlags) => boolean;
+
+/**
+ * If you want to update the feature flags on React environment
+ * (after the initial render and providers), you can use this hook.
+ */
+declare const useUpdateFeatures: () => {
+    updateFeatures: (features: FeatureFlags[]) => void;
+};
+
+export { FeatureFlag, FeatureFlagsProvider, useFeatureFlag, useUpdateFeatures };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/react-feature-flags",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "React Feature Flags",
   "author": "ttoss",
   "contributors": [
@@ -30,8 +30,8 @@
     "jest": "^29.7.0",
     "react": "^18.3.1",
     "tsup": "^8.3.0",
-    "@ttoss/config": "^1.33.0",
-    "@ttoss/test-utils": "^2.1.15"
+    "@ttoss/test-utils": "^2.1.16",
+    "@ttoss/config": "^1.34.0"
   },
   "keywords": [
     "feature-flags",