From d0a310a5f4dd8331d3d6c2f729a62db3cceaf831 Mon Sep 17 00:00:00 2001
From: Glenruben <gle@ssb.no>
Date: Fri, 26 Jan 2024 16:42:31 +0100
Subject: [PATCH] [MIM-1711] Add anchor field to content-type, show in view if
 it exists. (#2477)

* Add anchor field to content-type

* Anchor should apply to target url

* Add regexp limitation and clarify tool tip
---
 .../site/content-types/menuBox/menuBox.xml    | 24 ++++++++++++-------
 .../resources/site/parts/menuBox/menuBox.ts   |  6 ++++-
 2 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/src/main/resources/site/content-types/menuBox/menuBox.xml b/src/main/resources/site/content-types/menuBox/menuBox.xml
index b2d68a80a..2d61b7f4f 100644
--- a/src/main/resources/site/content-types/menuBox/menuBox.xml
+++ b/src/main/resources/site/content-types/menuBox/menuBox.xml
@@ -4,20 +4,20 @@
   <super-type>base:structured</super-type>
   <form>
     <item-set name="menu">
-      <occurrences minimum="0" maximum="99"/>
+      <occurrences minimum="0" maximum="99" />
       <label>Kort</label>
       <items>
         <input type="TextLine" name="title">
           <label>Tittel</label>
-          <occurrences minimum="0" maximum="1"/>
+          <occurrences minimum="0" maximum="1" />
         </input>
         <input type="TextLine" name="subtitle">
           <label>Undertittel</label>
-          <occurrences minimum="0" maximum="1"/>
+          <occurrences minimum="0" maximum="1" />
         </input>
 
         <input name="image" type="imageSelector">
-          <occurrences minimum="0" maximum="1"/>
+          <occurrences minimum="0" maximum="1" />
           <label>Bilde</label>
           <config>
             <allowPath>${site}</allowPath>
@@ -27,7 +27,7 @@
         <option-set name="urlSrc">
           <label>Lenkemål</label>
           <expanded>true</expanded>
-          <occurrences minimum="1" maximum="1"/>
+          <occurrences minimum="1" maximum="1" />
           <options minimum="1" maximum="1">
             <option name="manual">
               <label>Url</label>
@@ -36,7 +36,7 @@
               <items>
                 <input name="url" type="TextLine">
                   <label>Kildelenke</label>
-                  <occurrences minimum="1" maximum="1"/>
+                  <occurrences minimum="1" maximum="1" />
                 </input>
               </items>
             </option>
@@ -46,8 +46,16 @@
               <items>
                 <input name="contentId" type="ContentSelector">
                   <label>Relatert innhold</label>
-                  <occurrences minimum="1" maximum="1"/>
-                  <config/>
+                  <occurrences minimum="1" maximum="1" />
+                  <config />
+                </input>
+                <input name="anchor" type="TextLine">
+                  <label>Anker som lenkekortet skal peke til. Ingen mellomrom, æøå eller spesialtegn.</label>
+                  <help-text>OBS: Kun bokstaver a-z, tall og bindestrek/underscore er tillatt!</help-text>
+                  <occurrences minimum="0" maximum="1" />
+                  <config>
+                    <regexp>[A-Za-z0-9_-]</regexp>
+                  </config>
                 </input>
               </items>
             </option>
diff --git a/src/main/resources/site/parts/menuBox/menuBox.ts b/src/main/resources/site/parts/menuBox/menuBox.ts
index d622e4827..7361bc1ee 100644
--- a/src/main/resources/site/parts/menuBox/menuBox.ts
+++ b/src/main/resources/site/parts/menuBox/menuBox.ts
@@ -91,9 +91,12 @@ function getHref(menuConfig: MenuConfig): string {
   if (menuConfig.urlSrc && menuConfig.urlSrc._selected === 'manual') {
     return menuConfig.urlSrc.manual.url
   } else if (menuConfig.urlSrc && menuConfig.urlSrc.content) {
-    return pageUrl({
+    const url = pageUrl({
       id: menuConfig.urlSrc.content.contentId,
     })
+    if (menuConfig.urlSrc.content.anchor) {
+      return url + '#' + menuConfig.urlSrc.content.anchor
+    } else return url
   }
   return ''
 }
@@ -133,6 +136,7 @@ interface hrefContent {
   _selected: 'content'
   content: {
     contentId: string
+    anchor: string
   }
 }