@forsakringskassan/devindex-menu 2.0.3 → 2.1.0

package/README.md

@@ -107,6 +107,18 @@ Inside the application, the mock is then sent directly to `devindexMenu`.
 
 ```json
 { title: String, href: String },
+```
+
+#### Scenario
+
+```typescript
+{
+    type: "scenario";
+    key: string;
+    title: string;
+    description?: string;
+    cookies: Record<string, string | undefined>;
+ },
 
 ```
 

package/dist/cjs/menu.js

@@ -20,6 +20,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/menu.ts
 var menu_exports = {};
 __export(menu_exports, {
+  ONE_MONTH_IN_SECONDS: () => ONE_MONTH_IN_SECONDS,
   default: () => menu_default
 });
 module.exports = __toCommonJS(menu_exports);
@@ -619,6 +620,9 @@ function setCookie(options) {
   const cookieString = `${name}=${encodeURIComponent(value)}; path=/; max-age=${String(timeout)};`;
   document.cookie = cookieString;
 }
+function deleteCookie(name) {
+  document.cookie = `${name}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT;`;
+}
 function findCookie(name) {
   if (!document?.cookie) {
     return void 0;
@@ -1111,8 +1115,47 @@ if (typeof document !== "undefined") {
   createScreenReaderWrapper({ assertive: false });
 }
 
-// src/settings/text.ts
+// src/settings/scenario.ts
 var template = `
+<template id="devindex-scenario">
+  <span><!-- title --></span>
+  <p><!-- description --></p>
+  <button type="button">Activate scenario</button>
+</template>
+`;
+function createElement(setting) {
+  const template3 = document.querySelector("#devindex-scenario");
+  const clone = document.importNode(template3.content, true);
+  const title = clone.querySelector("span");
+  const description = clone.querySelector("p");
+  const button = clone.querySelector("button");
+  title.textContent = setting.title;
+  if (setting.description) {
+    description.textContent = setting.description;
+  } else {
+    description.remove();
+  }
+  button.id = setting.key;
+  button.addEventListener("click", () => {
+    for (const [key, value] of Object.entries(setting.cookies)) {
+      if (value === void 0) {
+        deleteCookie(key);
+      } else {
+        setCookie({
+          name: key,
+          value,
+          timeLimitSeconds: ONE_MONTH_IN_SECONDS
+        });
+      }
+    }
+    location.reload();
+  });
+  return clone;
+}
+var scenario_default = { createElement, template };
+
+// src/settings/text.ts
+var template2 = `
 <template id="devindex-text">
     <span><!-- title --></span>
     <p><!-- description --></p>
@@ -1120,10 +1163,9 @@ var template = `
     <input type="text"></input>
 </template>
 `;
-var ONE_MONTH_IN_SECONDS = 2592e3;
-function createElement(setting) {
-  const template2 = document.querySelector("#devindex-text");
-  const clone = document.importNode(template2.content, true);
+function createElement2(setting) {
+  const template3 = document.querySelector("#devindex-text");
+  const clone = document.importNode(template3.content, true);
   const title = clone.querySelector("span");
   const description = clone.querySelector("p");
   const input = clone.querySelector("input");
@@ -1144,7 +1186,7 @@ function createElement(setting) {
   }
   return clone;
 }
-var text_default = { createElement, template };
+var text_default = { createElement: createElement2, template: template2 };
 
 // src/style.scss
 var style_default = `.secret-menu {
@@ -1232,6 +1274,7 @@ var style_default = `.secret-menu {
 }`;
 
 // src/menu.ts
+var ONE_MONTH_IN_SECONDS = 2592e3;
 var settingsNodes = [];
 function evaluateMock(mock) {
   if (typeof mock === "function") {
@@ -1271,6 +1314,9 @@ function generateOptionMarkup(setting) {
       return generateOptionMarkupForLink(setting);
     case "text":
       settingsNodes.push(text_default.createElement(setting));
+      break;
+    case "scenario":
+      settingsNodes.push(scenario_default.createElement(setting));
   }
   return "";
 }
@@ -1319,6 +1365,7 @@ var menu_default = (userSettingsAndMocks) => {
     "beforeend",
     `
         ${text_default.template}
+        ${scenario_default.template}
      `
   );
   let settingsMarkup = "";

package/dist/cjs/pageobjects.js

@@ -48,4 +48,7 @@ var DevindexPageObject = class {
   textField(name, value) {
     cy.get(`input[name="${name}"]`).clear().type(value);
   }
+  scenario(id) {
+    cy.get(`#${id}`).click();
+  }
 };

package/dist/esm/menu.js

@@ -593,6 +593,9 @@ function setCookie(options) {
   const cookieString = `${name}=${encodeURIComponent(value)}; path=/; max-age=${String(timeout)};`;
   document.cookie = cookieString;
 }
+function deleteCookie(name) {
+  document.cookie = `${name}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT;`;
+}
 function findCookie(name) {
   if (!document?.cookie) {
     return void 0;
@@ -1085,8 +1088,47 @@ if (typeof document !== "undefined") {
   createScreenReaderWrapper({ assertive: false });
 }
 
-// src/settings/text.ts
+// src/settings/scenario.ts
 var template = `
+<template id="devindex-scenario">
+  <span><!-- title --></span>
+  <p><!-- description --></p>
+  <button type="button">Activate scenario</button>
+</template>
+`;
+function createElement(setting) {
+  const template3 = document.querySelector("#devindex-scenario");
+  const clone = document.importNode(template3.content, true);
+  const title = clone.querySelector("span");
+  const description = clone.querySelector("p");
+  const button = clone.querySelector("button");
+  title.textContent = setting.title;
+  if (setting.description) {
+    description.textContent = setting.description;
+  } else {
+    description.remove();
+  }
+  button.id = setting.key;
+  button.addEventListener("click", () => {
+    for (const [key, value] of Object.entries(setting.cookies)) {
+      if (value === void 0) {
+        deleteCookie(key);
+      } else {
+        setCookie({
+          name: key,
+          value,
+          timeLimitSeconds: ONE_MONTH_IN_SECONDS
+        });
+      }
+    }
+    location.reload();
+  });
+  return clone;
+}
+var scenario_default = { createElement, template };
+
+// src/settings/text.ts
+var template2 = `
 <template id="devindex-text">
     <span><!-- title --></span>
     <p><!-- description --></p>
@@ -1094,10 +1136,9 @@ var template = `
     <input type="text"></input>
 </template>
 `;
-var ONE_MONTH_IN_SECONDS = 2592e3;
-function createElement(setting) {
-  const template2 = document.querySelector("#devindex-text");
-  const clone = document.importNode(template2.content, true);
+function createElement2(setting) {
+  const template3 = document.querySelector("#devindex-text");
+  const clone = document.importNode(template3.content, true);
   const title = clone.querySelector("span");
   const description = clone.querySelector("p");
   const input = clone.querySelector("input");
@@ -1118,7 +1159,7 @@ function createElement(setting) {
   }
   return clone;
 }
-var text_default = { createElement, template };
+var text_default = { createElement: createElement2, template: template2 };
 
 // src/style.scss
 var style_default = `.secret-menu {
@@ -1206,6 +1247,7 @@ var style_default = `.secret-menu {
 }`;
 
 // src/menu.ts
+var ONE_MONTH_IN_SECONDS = 2592e3;
 var settingsNodes = [];
 function evaluateMock(mock) {
   if (typeof mock === "function") {
@@ -1245,6 +1287,9 @@ function generateOptionMarkup(setting) {
       return generateOptionMarkupForLink(setting);
     case "text":
       settingsNodes.push(text_default.createElement(setting));
+      break;
+    case "scenario":
+      settingsNodes.push(scenario_default.createElement(setting));
   }
   return "";
 }
@@ -1293,6 +1338,7 @@ var menu_default = (userSettingsAndMocks) => {
     "beforeend",
     `
         ${text_default.template}
+        ${scenario_default.template}
      `
   );
   let settingsMarkup = "";
@@ -1328,5 +1374,6 @@ var menu_default = (userSettingsAndMocks) => {
   document.body.appendChild(script);
 };
 export {
+  ONE_MONTH_IN_SECONDS,
   menu_default as default
 };

package/dist/esm/pageobjects.js

@@ -24,6 +24,9 @@ var DevindexPageObject = class {
   textField(name, value) {
     cy.get(`input[name="${name}"]`).clear().type(value);
   }
+  scenario(id) {
+    cy.get(`#${id}`).click();
+  }
 };
 export {
   DevindexPageObject

package/dist/types/{index.d.ts → menu.d.ts}

@@ -7,7 +7,7 @@ export interface SelectOption {
 	value: unknown;
 }
 export interface SelectSettings {
-	type: "select";
+	type?: "select";
 	key: string;
 	title: string;
 	reloadOnChange?: boolean;
@@ -33,7 +33,15 @@ export interface TextSettings {
 	description?: string;
 	options: LinkOption[];
 }
-export type Settings = SelectSettings | LinkSettings | TextSettings;
+export interface ScenarioSetting {
+	type: "scenario";
+	key: string;
+	title: string;
+	description?: string;
+	cookies: Record<string, string | undefined>;
+}
+export type Settings = SelectSettings | LinkSettings | TextSettings | ScenarioSetting;
+export declare const ONE_MONTH_IN_SECONDS = 2592000;
 /**
  * @param userSettingsAndMocks - An array of user settings and/or mocks to generate the menu from.
  */

package/dist/types/pageobjects.d.ts

@@ -12,6 +12,7 @@ export declare class DevindexPageObject {
 	 * @param value - The text to input.
 	 */
 	textField(name: string, value: string): void;
+	scenario(id: string): void;
 }
 
 export {};

package/package.json

@@ -1,7 +1,11 @@
 {
   "name": "@forsakringskassan/devindex-menu",
-  "version": "2.0.3",
-  "description": "",
+  "version": "2.1.0",
+  "description": "Menu for local development",
+  "keywords": [
+    "development",
+    "menu"
+  ],
   "homepage": "https://github.com/Forsakringskassan/devindex-menu",
   "bugs": "https://github.com/Forsakringskassan/devindex-menu/issues",
   "repository": {
@@ -24,7 +28,7 @@
   },
   "main": "dist/cjs/menu.js",
   "module": "dist/esm/menu.js",
-  "types": "./menu.d.ts",
+  "types": "dist/types/menu.d.ts",
   "files": [
     "dist"
   ],
@@ -32,7 +36,7 @@
     "prebuild": "tsc",
     "build": "node ./scripts/generate.mjs",
     "postbuild": "npm run types:main && npm run types:pageobject",
-    "types:main": "dts-bundle-generator -o dist/types/index.d.ts temp/types/menu.d.ts",
+    "types:main": "dts-bundle-generator -o dist/types/menu.d.ts temp/types/menu.d.ts",
     "types:pageobject": "dts-bundle-generator -o dist/types/pageobjects.d.ts temp/types/pageobjects.d.ts",
     "eslint": "eslint --cache .",
     "prettier:check": "prettier --check .",
@@ -52,20 +56,21 @@
     "@babel/preset-env": "7.28.6",
     "@fkui/tsconfig": "6.33.0",
     "@forsakringskassan/apimock-express": "2.12.0",
-    "@forsakringskassan/commitlint-config": "3.3.2",
+    "@forsakringskassan/commitlint-config": "3.3.3",
     "@forsakringskassan/eslint-config": "13.2.10",
     "@forsakringskassan/eslint-config-cli": "13.2.0",
     "@forsakringskassan/eslint-config-cypress": "13.2.10",
     "@forsakringskassan/eslint-config-jest": "13.2.9",
-    "@forsakringskassan/eslint-config-typescript": "13.2.9",
-    "@forsakringskassan/eslint-config-typescript-typeinfo": "13.2.9",
+    "@forsakringskassan/eslint-config-typescript": "13.2.11",
+    "@forsakringskassan/eslint-config-typescript-typeinfo": "13.2.11",
     "@forsakringskassan/prettier-config": "3.3.2",
     "@tsconfig/node22": "22.0.5",
-    "@types/node": "22.19.5",
-    "cypress": "15.8.2",
+    "@types/node": "22.19.7",
+    "cypress": "15.9.0",
     "dts-bundle-generator": "9.5.1",
     "esbuild": "0.27.2",
     "esbuild-sass-plugin": "3.6.0",
+    "npm-pkg-lint": "4.3.2",
     "sass": "1.97.2",
     "typescript": "5.9.3"
   },