@forsakringskassan/docs-generator 2.4.0 → 2.6.0

package/dist/runtime.js

@@ -32,6 +32,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // node_modules/dayjs/dayjs.min.js
 var require_dayjs_min = __commonJS({
@@ -133953,6 +133954,13 @@ var init_architectureDiagram_V6B76FHG = __esm({
   }
 });
 
+// src/runtime/index.ts
+var runtime_exports = {};
+__export(runtime_exports, {
+  onContentReady: () => onContentReady
+});
+module.exports = __toCommonJS(runtime_exports);
+
 // src/runtime/code-preview.ts
 function getElements(element3) {
   const root4 = element3.closest(".code-preview");
@@ -139384,6 +139392,137 @@ onContentReady(() => {
   }
 });
 
+// src/runtime/debounce.ts
+function debounce2(func, delay2, immediate = false) {
+  let timeout2 = null;
+  return function functionToExecute(...args) {
+    const timedOutFunction = () => {
+      timeout2 = null;
+      if (!immediate) {
+        func.apply(this, args);
+      }
+    };
+    const callNow = immediate && !timeout2;
+    if (timeout2 !== null) {
+      clearTimeout(timeout2);
+    }
+    timeout2 = setTimeout(timedOutFunction, delay2);
+    if (callNow) {
+      func.apply(this);
+    }
+  };
+}
+
+// src/runtime/topnav.ts
+function getElementsRefs() {
+  const nav = document.querySelector("#topnav");
+  if (!nav) {
+    return;
+  }
+  const menuItems = Array.from(
+    nav.querySelectorAll(".imenu__list__item")
+  );
+  const moreItem = menuItems.pop();
+  const moreButton = moreItem.querySelector("button");
+  const popoverContainer = moreItem.querySelector(".ipopupmenu");
+  const popover = popoverContainer.querySelector(".ipopupmenu__list");
+  const popoverItems = Array.from(
+    popover.querySelectorAll(".ipopupmenu__list__item")
+  );
+  const highlightIndex = menuItems.findIndex(
+    (it) => it.classList.contains("imenu__list__item--highlight")
+  );
+  const itemPairs = menuItems.map((menu, index2) => ({
+    menu,
+    popover: popoverItems[index2]
+  }));
+  return {
+    nav,
+    moreItem,
+    moreButton,
+    popoverContainer,
+    popover,
+    itemPairs,
+    highlightIndex
+  };
+}
+function setPopoverVisibility(visible, refs) {
+  refs.popover.style.visibility = visible ? "visible" : "hidden";
+  refs.moreButton.ariaExpanded = visible.toString();
+}
+function togglePopover(event3, refs) {
+  event3.stopPropagation();
+  setPopoverVisibility(refs.popover.style.visibility === "hidden", refs);
+}
+function closePopoverOnEsc(event3, refs) {
+  if (event3.key === "Escape") {
+    setPopoverVisibility(false, refs);
+    refs.moreButton.focus();
+  }
+}
+function onClickItem(event3) {
+  const clickable = event3.target.querySelector(
+    "a, button"
+  );
+  clickable.click();
+}
+function onClickPopover(event3) {
+  event3.stopPropagation();
+}
+function hasOverflow(container2, content) {
+  return content.offsetLeft + content.offsetWidth > container2.offsetLeft + container2.offsetWidth;
+}
+function setMenuItemVisibility(itemPair, visible) {
+  itemPair.menu.style.visibility = visible ? "visible" : "hidden";
+  itemPair.popover.style.display = visible ? "none" : "block";
+}
+function calculateVisibility(refs) {
+  refs.moreItem.style.left = "0";
+  const menuItems = refs.itemPairs.map((item) => item.menu);
+  let overflowIndex = menuItems.findIndex((it) => hasOverflow(refs.nav, it));
+  if (overflowIndex === -1) {
+    refs.itemPairs.forEach((it) => setMenuItemVisibility(it, true));
+    refs.moreItem.style.visibility = "hidden";
+    setPopoverVisibility(false, refs);
+    return;
+  }
+  if (hasOverflow(refs.nav, {
+    offsetLeft: menuItems[overflowIndex].offsetLeft,
+    offsetWidth: refs.moreItem.offsetWidth
+  })) {
+    overflowIndex--;
+  }
+  refs.itemPairs.forEach(
+    (it, index2) => setMenuItemVisibility(it, index2 < overflowIndex)
+  );
+  const classOperation = refs.highlightIndex >= overflowIndex ? "add" : "remove";
+  refs.moreItem.classList[classOperation]("imenu__list__item--highlight");
+  refs.moreItem.style.left = `${menuItems[overflowIndex].offsetLeft}px`;
+  refs.moreItem.style.visibility = "visible";
+  const popupTop = refs.moreItem.offsetHeight + 16;
+  refs.popover.style.top = `${popupTop}px`;
+}
+onContentReady(() => {
+  const refs = getElementsRefs();
+  if (!refs) {
+    return;
+  }
+  window.addEventListener(
+    "resize",
+    debounce2(() => calculateVisibility(refs), 100)
+  );
+  document.addEventListener("click", () => setPopoverVisibility(false, refs));
+  refs.itemPairs.forEach((pair) => {
+    pair.menu.addEventListener("click", onClickItem);
+    pair.popover.addEventListener("click", onClickItem);
+  });
+  refs.moreItem.addEventListener("click", (e6) => togglePopover(e6, refs));
+  refs.moreItem.addEventListener("keyup", (e6) => closePopoverOnEsc(e6, refs));
+  refs.popoverContainer.addEventListener("click", onClickPopover);
+  setPopoverVisibility(false, refs);
+  calculateVisibility(refs);
+});
+
 // src/runtime/index.ts
 window.toggleMarkup = toggleMarkup;
 /*! Bundled license information:

package/dist/style/core.css

@@ -133,6 +133,7 @@ pre code {
 
 header {
   grid-area: header;
+  min-width: 0;
 }
 
 #primary {
@@ -152,38 +153,44 @@ main {
 }
 
 .layout--content-with-menu #primary,
-.layout--pattern #primary,
-.layout--component #primary {
+.layout--article #primary,
+.layout--component #primary,
+.layout--pattern #primary {
   --sidenav-width: 350px;
   padding-right: 2rem;
   grid-template: "sidenav title" auto "sidenav aside" auto "sidenav content" 1fr/min-content 1fr;
 }
 @media screen and (width >= 1280px) {
   .layout--content-with-menu #primary,
-  .layout--pattern #primary,
-  .layout--component #primary {
+  .layout--article #primary,
+  .layout--component #primary,
+  .layout--pattern #primary {
     grid-template: "sidenav title aside" auto "sidenav content aside" 1fr/min-content minmax(10rem, 920px) auto;
   }
 }
 .layout--content-with-menu main,
-.layout--pattern main,
-.layout--component main {
+.layout--article main,
+.layout--component main,
+.layout--pattern main {
   display: contents;
   padding: 0;
   max-width: none;
 }
 .layout--content-with-menu #title,
 .layout--content-with-menu #content,
-.layout--pattern #title,
-.layout--pattern #content,
+.layout--article #title,
+.layout--article #content,
 .layout--component #title,
-.layout--component #content {
+.layout--component #content,
+.layout--pattern #title,
+.layout--pattern #content {
   padding-left: 1rem;
 }
 @media screen and (width < 1280px) {
   .layout--content-with-menu #aside,
-  .layout--pattern #aside,
-  .layout--component #aside {
+  .layout--article #aside,
+  .layout--component #aside,
+  .layout--pattern #aside {
     padding-left: 1rem;
   }
 }
@@ -207,6 +214,31 @@ main {
   overflow-x: auto;
 }
 
+.docs-messagebox {
+  border: 2px solid transparent;
+  border-left-width: 1rem;
+  padding: 1.5rem;
+  margin-bottom: 1rem;
+}
+.docs-messagebox :last-child {
+  margin-bottom: 0;
+}
+.docs-messagebox__title {
+  font-weight: bold;
+}
+.docs-messagebox--info {
+  border-color: var(--docs-messagebox-info-border);
+  background: var(--docs-messagebox-info-background);
+}
+.docs-messagebox--warning {
+  border-color: var(--docs-messagebox-warning-border);
+  background: var(--docs-messagebox-warning-background);
+}
+.docs-messagebox--danger {
+  border-color: var(--docs-messagebox-danger-border);
+  background: var(--docs-messagebox-danger-background);
+}
+
 #sidenav {
   --header-footer-visible-height: 4.5rem;
   overflow: auto;
@@ -435,6 +467,19 @@ main {
     transform: translateX(100%);
   }
 }
+.docs-tag {
+  border-radius: 4px;
+  border-style: solid;
+  border-width: 1px;
+  display: inline-block;
+  padding: 0 0.5rem;
+}
+.docs-tag--default {
+  background-color: var(--docs-tags-optional-background-color);
+  border-color: var(--docs-tags-optional-border-color);
+  color: var(--docs-tags-optional-text-color);
+}
+
 #version-banner {
   margin: 0;
 }
@@ -448,6 +493,11 @@ dialog[open] {
   display: block;
 }
 
+dd > dl {
+  border-left: 2px solid var(--docs-text-color-discrete);
+  padding-left: 1rem;
+}
+
 p:not(.code-preview p) {
   max-width: 680px;
 }
@@ -585,6 +635,7 @@ header .select-field {
 
 header .page-header__right {
   justify-content: space-between;
+  min-width: 0;
   max-width: 1260px;
   padding-top: 0;
   flex-wrap: wrap-reverse;
@@ -630,12 +681,15 @@ header .imenu {
   margin-left: -0.5rem;
 }
 
+header .imenu__list {
+  gap: 1rem;
+}
+
 header .imenu--horizontal .imenu__list__item {
   display: inline-flex;
   padding-top: 1.1rem;
   padding-left: 0;
   padding-right: 0;
-  margin: 0 0.5rem;
 }
 
 /* navigering vänster */

package/dist/style/index.css

@@ -133,6 +133,7 @@ pre code {
 
 header {
   grid-area: header;
+  min-width: 0;
 }
 
 #primary {
@@ -152,38 +153,44 @@ main {
 }
 
 .layout--content-with-menu #primary,
-.layout--pattern #primary,
-.layout--component #primary {
+.layout--article #primary,
+.layout--component #primary,
+.layout--pattern #primary {
   --sidenav-width: 350px;
   padding-right: 2rem;
   grid-template: "sidenav title" auto "sidenav aside" auto "sidenav content" 1fr/min-content 1fr;
 }
 @media screen and (width >= 1280px) {
   .layout--content-with-menu #primary,
-  .layout--pattern #primary,
-  .layout--component #primary {
+  .layout--article #primary,
+  .layout--component #primary,
+  .layout--pattern #primary {
     grid-template: "sidenav title aside" auto "sidenav content aside" 1fr/min-content minmax(10rem, 920px) auto;
   }
 }
 .layout--content-with-menu main,
-.layout--pattern main,
-.layout--component main {
+.layout--article main,
+.layout--component main,
+.layout--pattern main {
   display: contents;
   padding: 0;
   max-width: none;
 }
 .layout--content-with-menu #title,
 .layout--content-with-menu #content,
-.layout--pattern #title,
-.layout--pattern #content,
+.layout--article #title,
+.layout--article #content,
 .layout--component #title,
-.layout--component #content {
+.layout--component #content,
+.layout--pattern #title,
+.layout--pattern #content {
   padding-left: 1rem;
 }
 @media screen and (width < 1280px) {
   .layout--content-with-menu #aside,
-  .layout--pattern #aside,
-  .layout--component #aside {
+  .layout--article #aside,
+  .layout--component #aside,
+  .layout--pattern #aside {
     padding-left: 1rem;
   }
 }
@@ -207,6 +214,31 @@ main {
   overflow-x: auto;
 }
 
+.docs-messagebox {
+  border: 2px solid transparent;
+  border-left-width: 1rem;
+  padding: 1.5rem;
+  margin-bottom: 1rem;
+}
+.docs-messagebox :last-child {
+  margin-bottom: 0;
+}
+.docs-messagebox__title {
+  font-weight: bold;
+}
+.docs-messagebox--info {
+  border-color: var(--docs-messagebox-info-border);
+  background: var(--docs-messagebox-info-background);
+}
+.docs-messagebox--warning {
+  border-color: var(--docs-messagebox-warning-border);
+  background: var(--docs-messagebox-warning-background);
+}
+.docs-messagebox--danger {
+  border-color: var(--docs-messagebox-danger-border);
+  background: var(--docs-messagebox-danger-background);
+}
+
 #sidenav {
   --header-footer-visible-height: 4.5rem;
   overflow: auto;
@@ -435,6 +467,19 @@ main {
     transform: translateX(100%);
   }
 }
+.docs-tag {
+  border-radius: 4px;
+  border-style: solid;
+  border-width: 1px;
+  display: inline-block;
+  padding: 0 0.5rem;
+}
+.docs-tag--default {
+  background-color: var(--docs-tags-optional-background-color);
+  border-color: var(--docs-tags-optional-border-color);
+  color: var(--docs-tags-optional-text-color);
+}
+
 #version-banner {
   margin: 0;
 }
@@ -448,6 +493,11 @@ dialog[open] {
   display: block;
 }
 
+dd > dl {
+  border-left: 2px solid var(--docs-text-color-discrete);
+  padding-left: 1rem;
+}
+
 p:not(.code-preview p) {
   max-width: 680px;
 }
@@ -585,6 +635,7 @@ header .select-field {
 
 header .page-header__right {
   justify-content: space-between;
+  min-width: 0;
   max-width: 1260px;
   padding-top: 0;
   flex-wrap: wrap-reverse;
@@ -630,12 +681,15 @@ header .imenu {
   margin-left: -0.5rem;
 }
 
+header .imenu__list {
+  gap: 1rem;
+}
+
 header .imenu--horizontal .imenu__list__item {
   display: inline-flex;
   padding-top: 1.1rem;
   padding-left: 0;
   padding-right: 0;
-  margin: 0 0.5rem;
 }
 
 /* navigering vänster */
@@ -938,12 +992,27 @@ kbd {
   --docs-text-color-discrete: #5f6165;
   --docs-text-color-link: #4a52b6;
   --docs-text-color-link-hover: #1b1e23;
+  --docs-info-color: #4a52b6;
+  --docs-info-background: #f5f6fa;
+  --docs-warning-color: #ffbe10;
+  --docs-warning-background: #fffcf3;
+  --docs-error-color: #ca1515;
+  --docs-error-background: #fcf3f3;
   --docs-heading-font-family: var(--docs-font-family);
   --docs-heading-font-weight: var(--docs-font-weight);
   --docs-heading-line-height: 1.4;
   --docs-header-text-color-default: #1b1e23;
   --docs-header-text-color-discrete: #5f6165;
   --docs-menu-width-expanded: 230px;
+  --docs-messagebox-info-border: var(--docs-info-color);
+  --docs-messagebox-info-background: var(--docs-info-background);
+  --docs-messagebox-warning-border: var(--docs-warning-color);
+  --docs-messagebox-warning-background: var(--docs-warning-background);
+  --docs-messagebox-danger-border: var(--docs-error-color);
+  --docs-messagebox-danger-background: var(--docs-error-background);
+  --docs-tags-optional-background-color: transparent;
+  --docs-tags-optional-border-color: #5f6165;
+  --docs-tags-optional-text-color: var(--docs-text-color-discrete);
   --docs-version-text-color: var(--docs-text-color-discrete);
   --docs-version-link-color: var(--docs-text-color-discrete);
   --docs-version-hover-color: var(--docs-text-color-default);
@@ -992,7 +1061,7 @@ select:focus::-ms-value {
 
 ul,
 ol {
-  padding-left: 1rem;
+  padding-left: 1.5rem;
   margin-top: 0;
   margin-bottom: 1rem;
 }

package/dist/style/site.css

@@ -12,12 +12,27 @@
   --docs-text-color-discrete: #5f6165;
   --docs-text-color-link: #4a52b6;
   --docs-text-color-link-hover: #1b1e23;
+  --docs-info-color: #4a52b6;
+  --docs-info-background: #f5f6fa;
+  --docs-warning-color: #ffbe10;
+  --docs-warning-background: #fffcf3;
+  --docs-error-color: #ca1515;
+  --docs-error-background: #fcf3f3;
   --docs-heading-font-family: var(--docs-font-family);
   --docs-heading-font-weight: var(--docs-font-weight);
   --docs-heading-line-height: 1.4;
   --docs-header-text-color-default: #1b1e23;
   --docs-header-text-color-discrete: #5f6165;
   --docs-menu-width-expanded: 230px;
+  --docs-messagebox-info-border: var(--docs-info-color);
+  --docs-messagebox-info-background: var(--docs-info-background);
+  --docs-messagebox-warning-border: var(--docs-warning-color);
+  --docs-messagebox-warning-background: var(--docs-warning-background);
+  --docs-messagebox-danger-border: var(--docs-error-color);
+  --docs-messagebox-danger-background: var(--docs-error-background);
+  --docs-tags-optional-background-color: transparent;
+  --docs-tags-optional-border-color: #5f6165;
+  --docs-tags-optional-text-color: var(--docs-text-color-discrete);
   --docs-version-text-color: var(--docs-text-color-discrete);
   --docs-version-link-color: var(--docs-text-color-discrete);
   --docs-version-hover-color: var(--docs-text-color-default);
@@ -66,7 +81,7 @@ select:focus::-ms-value {
 
 ul,
 ol {
-  padding-left: 1rem;
+  padding-left: 1.5rem;
   margin-top: 0;
   margin-bottom: 1rem;
 }