@equinor/cpl-feature-flag-react 2.0.5 → 2.0.7

package/dist/index.js

@@ -140,6 +140,7 @@ function buildReducer(storage, storageKey) {
 // src/components/buildDevPanel.tsx
 var import_eds_core_react2 = require("@equinor/eds-core-react");
 var import_eds_icons = require("@equinor/eds-icons");
+var import_eds_tokens2 = require("@equinor/eds-tokens");
 var import_react3 = require("react");
 var import_styled_components2 = __toESM(require("styled-components"));
 
@@ -197,14 +198,13 @@ function DevPanelPure({
   }
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_eds_core_react2.EdsProvider, { density: "compact", children: [
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-      import_eds_core_react2.Button,
+      StyledButton,
       {
         "aria-haspopup": true,
         variant: "ghost",
         "aria-expanded": isOpen,
         ref: buttonRef,
         onClick: handleToggle,
-        style: { color: "#3d3d3d" },
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_eds_core_react2.Icon, { data: import_eds_icons.arrow_drop_down }),
           "DEV PANEL"
@@ -237,6 +237,17 @@ function DevPanelPure({
     ] }) })
   ] }) });
 }
+var StyledButton = (0, import_styled_components2.default)(import_eds_core_react2.Button)`
+  color: ${import_eds_tokens2.tokens.colors.text.static_icons__default.rgba};
+  font-size: 12px;
+  margin: -8px 0;
+  padding-left: 4px;
+  padding-right: 8px;
+
+  & > span {
+    gap: 0;
+  }
+`;
 var StyledPopoverContent = (0, import_styled_components2.default)(import_eds_core_react2.Popover.Content)`
   background-color: var(--cpl-ui-background-temporary-nav);
   display: flex;
@@ -261,10 +272,16 @@ function buildFeatureFlagModule({
   const useFeatureFlagValue = (featureFlagKey) => {
     const currentEnvironment = useCurrentEnvironment();
     const featureFlagConfig = useFeatureFlagConfig();
+    const configOverridesFromLocalStorage = getFeatureFlagConfigFromSessionStorage(
+      storage,
+      storageKey
+    );
     if (!isValidEnvironment(environments, currentEnvironment)) {
       return false;
     }
-    return Boolean(featureFlagConfig[featureFlagKey][currentEnvironment]);
+    return Boolean(
+      configOverridesFromLocalStorage?.[featureFlagKey] ?? featureFlagConfig[featureFlagKey][currentEnvironment]
+    );
   };
   function FeatureFlag({
     featureFlagKey,

package/dist/index.mjs

@@ -104,6 +104,7 @@ function buildReducer(storage, storageKey) {
 // src/components/buildDevPanel.tsx
 import { Button, EdsProvider, Icon, Popover } from "@equinor/eds-core-react";
 import { arrow_drop_down } from "@equinor/eds-icons";
+import { tokens as tokens2 } from "@equinor/eds-tokens";
 import { useCallback as useCallback2, useMemo, useRef, useState } from "react";
 import styled2 from "styled-components";
 
@@ -161,14 +162,13 @@ function DevPanelPure({
   }
   return /* @__PURE__ */ jsx3(Fragment, { children: /* @__PURE__ */ jsxs(EdsProvider, { density: "compact", children: [
     /* @__PURE__ */ jsxs(
-      Button,
+      StyledButton,
       {
         "aria-haspopup": true,
         variant: "ghost",
         "aria-expanded": isOpen,
         ref: buttonRef,
         onClick: handleToggle,
-        style: { color: "#3d3d3d" },
         children: [
           /* @__PURE__ */ jsx3(Icon, { data: arrow_drop_down }),
           "DEV PANEL"
@@ -201,6 +201,17 @@ function DevPanelPure({
     ] }) })
   ] }) });
 }
+var StyledButton = styled2(Button)`
+  color: ${tokens2.colors.text.static_icons__default.rgba};
+  font-size: 12px;
+  margin: -8px 0;
+  padding-left: 4px;
+  padding-right: 8px;
+
+  & > span {
+    gap: 0;
+  }
+`;
 var StyledPopoverContent = styled2(Popover.Content)`
   background-color: var(--cpl-ui-background-temporary-nav);
   display: flex;
@@ -225,10 +236,16 @@ function buildFeatureFlagModule({
   const useFeatureFlagValue = (featureFlagKey) => {
     const currentEnvironment = useCurrentEnvironment();
     const featureFlagConfig = useFeatureFlagConfig();
+    const configOverridesFromLocalStorage = getFeatureFlagConfigFromSessionStorage(
+      storage,
+      storageKey
+    );
     if (!isValidEnvironment(environments, currentEnvironment)) {
       return false;
     }
-    return Boolean(featureFlagConfig[featureFlagKey][currentEnvironment]);
+    return Boolean(
+      configOverridesFromLocalStorage?.[featureFlagKey] ?? featureFlagConfig[featureFlagKey][currentEnvironment]
+    );
   };
   function FeatureFlag({
     featureFlagKey,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/cpl-feature-flag-react",
-  "version": "2.0.5",
+  "version": "2.0.7",
   "license": "MIT",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -17,7 +17,7 @@
   ],
   "devDependencies": {
     "@equinor/eds-core-react": "2.3.5",
-    "@storybook/react-vite": "10.2.9",
+    "@storybook/react-vite": "10.2.10",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "@types/styled-components": "5.1.36",