Oppdaterte pakker. Eslint og react ikke oppdatert, var konflikter der (…

…#369) * Oppdaterte pakker. Eslint og react ikke oppdatert, var konflikter der * Var også noe som ikke virket med custom-elements-manifest , så ikke oppgradert de heller --------- Co-authored-by: marcin <[email protected]>
NVE · Jan 22, 2025 · c20e761 · c20e761
1 parent f96218c
commit c20e761
Show file tree

Hide file tree

Showing 12 changed files with 2,546 additions and 1,347 deletions.
diff --git a/doc-site/.vitepress/theme/components/LinkButton.vue b/doc-site/.vitepress/theme/components/LinkButton.vue
@@ -13,10 +13,12 @@ type Props = {
   openInNewTab?: boolean;
 };
 
-const { text, openInNewTab, URL } = withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
   openInNewTab: false,
 });
 
+const { text, openInNewTab, URL } = props;
+
 const navigateTo = (route) => {
   // TODO improve this with maybe a router-link component to avoid hardcoding the base url
   window.location.href = route;

diff --git a/doc-site/.vitepress/theme/components/apidoc/ComponentEvents.vue b/doc-site/.vitepress/theme/components/apidoc/ComponentEvents.vue
@@ -9,19 +9,23 @@
       <a class="header-anchor" href="#hendelser" aria-label='Permalink to "Hendelser"'>&ZeroWidthSpace;</a>
     </h2>
     <table>
-      <tr>
-        <td>Navn</td>
-        <td>Arvet fra</td>
-        <td>Beskrivelse</td>
-      </tr>
-      <tr v-for="event in events" :key="event.name">
-        <td v-if="event.name">
-          {{ event.name }}
-        </td>
-        <td v-else>(standard)</td>
-        <td>{{ event.inheritedFrom?.name }}</td>
-        <td style="width: 60%">{{ event.description }}</td>
-      </tr>
+      <thead>
+        <tr>
+          <th>Navn</th>
+          <th>Arvet fra</th>
+          <th>Beskrivelse</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="event in events" :key="event.name">
+          <td v-if="event.name">
+            {{ event.name }}
+          </td>
+          <td v-else>(standard)</td>
+          <td>{{ event.inheritedFrom?.name }}</td>
+          <td style="width: 60%">{{ event.description }}</td>
+        </tr>
+      </tbody>
     </table>
   </template>
 </template>

diff --git a/doc-site/.vitepress/theme/components/apidoc/ComponentFields.vue b/doc-site/.vitepress/theme/components/apidoc/ComponentFields.vue
@@ -8,27 +8,31 @@
     <a class="header-anchor" href="#egenskaper" aria-label='Permalink to "Egenskaper"'>&ZeroWidthSpace;</a>
   </h2>
   <table>
-    <tr>
-      <td>Navn</td>
-      <td>Type</td>
-      <td>Arvet fra</td>
-      <td>Beskrivelse</td>
-      <td>
-        <a href="https://lit.dev/docs/components/properties/#reflected-attributes" target="_blank">A</a>
-      </td>
-    </tr>
-    <tr v-for="field in fields" :key="field.name">
-      <td>{{ field.name }}</td>
-      <td>
-        {{ field.type?.text }}
-        <span v-if="field.default"> = {{ field.default }}</span>
-      </td>
-      <td>{{ field.inheritedFrom?.name }}</td>
-      <td>{{ field.description }}</td>
-      <td>
-        <nve-icon v-if="field.reflects" name="Check" />
-      </td>
-    </tr>
+    <thead>
+      <tr>
+        <th>Navn</th>
+        <th>Type</th>
+        <th>Arvet fra</th>
+        <th>Beskrivelse</th>
+        <th>
+          <a href="https://lit.dev/docs/components/properties/#reflected-attributes" target="_blank">Reflected</a>
+        </th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="field in fields" :key="field.name">
+        <td>{{ field.name }}</td>
+        <td>
+          {{ field.type?.text }}
+          <span v-if="field.default"> = {{ field.default }}</span>
+        </td>
+        <td>{{ field.inheritedFrom?.name }}</td>
+        <td>{{ field.description }}</td>
+        <td>
+          <nve-icon v-if="field.reflects" name="Check" />
+        </td>
+      </tr>
+    </tbody>
   </table>
 </template>
 

diff --git a/doc-site/.vitepress/theme/components/apidoc/ComponentMethods.vue b/doc-site/.vitepress/theme/components/apidoc/ComponentMethods.vue
@@ -10,24 +10,28 @@
       <a class="header-anchor" href="#metoder" aria-label='Permalink to "Metoder"'>&ZeroWidthSpace;</a>
     </h2>
     <table>
-      <tr>
-        <td>Navn</td>
-        <td>Parametre</td>
-        <td>Returtype</td>
-        <td>Arvet fra</td>
-        <td>Beskrivelse</td>
-      </tr>
-      <tr v-for="method in methods" :key="method.name">
-        <td>{{ method.name }}</td>
-        <td>
-          <div v-for="parameter in method.parameters" :key="parameter.name">
-            {{ parameter.name }}: {{ parameter.type?.text }}
-          </div>
-        </td>
-        <td>{{ method.return?.type?.text }}</td>
-        <td>{{ method.inheritedFrom?.name }}</td>
-        <td>{{ method.description }}</td>
-      </tr>
+      <thead>
+        <tr>
+          <th>Navn</th>
+          <th>Parametre</th>
+          <th>Returtype</th>
+          <th>Arvet fra</th>
+          <th>Beskrivelse</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="method in methods" :key="method.name">
+          <td>{{ method.name }}</td>
+          <td>
+            <div v-for="parameter in method.parameters" :key="parameter.name">
+              {{ parameter.name }}: {{ parameter.type?.text }}
+            </div>
+          </td>
+          <td>{{ method.return?.type?.text }}</td>
+          <td>{{ method.inheritedFrom?.name }}</td>
+          <td>{{ method.description }}</td>
+        </tr>
+      </tbody>
     </table>
   </template>
 </template>

diff --git a/doc-site/.vitepress/theme/components/apidoc/ComponentParts.vue b/doc-site/.vitepress/theme/components/apidoc/ComponentParts.vue
@@ -9,14 +9,18 @@
       <a class="header-anchor" href="#deler" aria-label='Permalink to "Deler"'>&ZeroWidthSpace;</a>
     </h2>
     <table>
-      <tr>
-        <td>Navn</td>
-        <td>Beskrivelse</td>
-      </tr>
-      <tr v-for="part in parts" :key="part.name">
-        <td>{{ part.name }}</td>
-        <td style="width: 100%">{{ part.description }}</td>
-      </tr>
+      <thead>
+        <tr>
+          <th>Navn</th>
+          <th>Beskrivelse</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="part in parts" :key="part.name">
+          <td>{{ part.name }}</td>
+          <td style="width: 100%">{{ part.description }}</td>
+        </tr>
+      </tbody>
     </table>
   </template>
 </template>

diff --git a/doc-site/.vitepress/theme/components/apidoc/ComponentSlots.vue b/doc-site/.vitepress/theme/components/apidoc/ComponentSlots.vue
@@ -9,17 +9,21 @@
       <a class="header-anchor" href="#spor" aria-label='Permalink to "Spor"'>&ZeroWidthSpace;</a>
     </h2>
     <table>
-      <tr>
-        <td>Navn</td>
-        <td>Beskrivelse</td>
-      </tr>
-      <tr v-for="slot in slots" :key="slot.name">
-        <td v-if="slot.name">
-          {{ slot.name }}
-        </td>
-        <td v-else>(standard)</td>
-        <td style="width: 100%">{{ slot.description }}</td>
-      </tr>
+      <thead>
+        <tr>
+          <th>Navn</th>
+          <th>Beskrivelse</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="slot in slots" :key="slot.name">
+          <td v-if="slot.name">
+            {{ slot.name }}
+          </td>
+          <td v-else>(standard)</td>
+          <td style="width: 100%">{{ slot.description }}</td>
+        </tr>
+      </tbody>
     </table>
   </template>
 </template>

diff --git a/doc-site/.vitepress/theme/customElementsManifest.store.ts b/doc-site/.vitepress/theme/customElementsManifest.store.ts
@@ -100,17 +100,25 @@ const getComponentClassDeclaration = (componentName: string): CustomElementDecla
  * @returns en komponent med angitt navn eller undefined om komponenten ikke finnes
  */
 const getModuleByName = (name: string): Module | undefined => {
-  return modules.value.find((module) => getComponentName(module) === name);
+  const allModules = getAllModulesByName(name);
+  const module = allModules.at(0);
+  return module;
+};
+
+const getAllModulesByName = (name: string): Array<Module> => {
+  const allModules = modules.value.filter((module) => getComponentName(module) === name);
+  return allModules;
 };
 
 const getComponentName = (module: Module): string | undefined => {
-  return module.path.split('/').pop()?.replace('.js', '');
+  const name = module.path.split('/').pop()?.replace('.js', '')?.replace('.component.ts', '');
+  return name;
 };
 
 // Henter navn på alle komponentene ved oppstart
 modules.value.forEach((module) => {
   const name = getComponentName(module);
-  if (name) {
+  if (name && !componentNames.value.includes(name)) {
     componentNames.value.push(name);
   }
 });

diff --git a/doc-site/.vitepress/theme/index.ts b/doc-site/.vitepress/theme/index.ts
@@ -1,5 +1,5 @@
 // https://vitepress.dev/guide/custom-theme
-import { h } from 'vue';
+import { h, watch } from 'vue';
 import { useData } from 'vitepress';
 import DefaultTheme from 'vitepress/theme';
 import './style.css';
@@ -24,21 +24,30 @@ export default {
     const { currentTheme } = useCurrentTheme();
 
     // Hente rikig tema
-    if (currentTheme.value === Theme.NVE) {
-      document.documentElement.classList.remove('varsom');
-      document.documentElement.classList.remove('varsom_darkmode');
-      document.documentElement.classList.add('nve');
-    } else {
-      document.documentElement.classList.remove('nve');
-      document.documentElement.classList.remove('nve_darkmode');
-      document.documentElement.classList.add('varsom');
-    }
+    const applyTheme = () => {
+      if (currentTheme.value === Theme.NVE) {
+        document.documentElement.classList.remove('varsom');
+        document.documentElement.classList.remove('varsom_darkmode');
+        document.documentElement.classList.add('nve');
+      } else {
+        document.documentElement.classList.remove('nve');
+        document.documentElement.classList.remove('nve_darkmode');
+        document.documentElement.classList.add('varsom');
+      }
+
+      // Setter darkmode må sikkert trigge det en gang til når jeg bytter tema
+      if (isDark.value) {
+        document.documentElement.classList.add(`${currentTheme.value}_darkmode`);
+      } else {
+        document.documentElement.classList.remove(`${currentTheme.value}_darkmode`);
+      }
+    };
+    if (typeof window !== 'undefined' && typeof document !== 'undefined') {
+      applyTheme();
 
-    // Setter darkmode må sikkert trigge det en gang til når jeg bytter tema
-    if (isDark.value) {
-      document.documentElement.classList.add(`${currentTheme.value}_darkmode`);
-    } else {
-      document.documentElement.classList.remove(`${currentTheme.value}_darkmode`);
+      watch([isDark, currentTheme], () => {
+        applyTheme();
+      });
     }
     return h(DefaultTheme.Layout, null, {});
   },