@aarhus-university/au-lib-react-components 12.5.1 → 12.6.1

package/src/lib/portals.tsx

@@ -1,150 +1,150 @@
-/* eslint-disable import/prefer-default-export */
-import React from 'react';
-import { replace } from './helpers';
-
-const impersonationLabels = {
-  IMPERSONATION_SELECT_OPTION_CPR: { da: 'CPR-nr.', en: 'CPR no.' },
-  IMPERSONATION_SELECT_OPTION_EMAIL: { da: 'E-mail', en: 'Email' },
-  IMPERSONATION_SELECT_OPTION_AUID: { da: 'AU-id', en: 'AU ID' },
-  IMPERSONATION_SELECT_OPTION_STUDENTNUMBER: { da: 'Studienummer', en: 'Student Number' },
-};
-
-declare global {
-  interface Window {
-    IMPERSONATE_AUID: string;
-    IMPERSONATE_VALUE: string;
-    IMPERSONATE_TYPE: string;
-    PHASE: number;
-    REAL_PHASE: number;
-    authenticated: boolean;
-    userContext: AU.IUserContext;
-    impersonateError: boolean;
-  }
-}
-
-const portals: (lang: string) => AU.IPortalContext[] = (lang: string) => [
-  {
-    name: 'mitstudie',
-    impersonationSetup: {
-      auid: window.IMPERSONATE_AUID,
-      value: window.IMPERSONATE_VALUE,
-      type: window.IMPERSONATE_TYPE,
-    },
-    impersonationOptions: [
-      {
-        value: 'auid',
-        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_AUID[lang],
-      },
-      {
-        value: 'studentnumber',
-        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_STUDENTNUMBER[lang],
-      },
-    ],
-    deactivateFormContent: (
-      activatedText: string,
-      replaceText: string[],
-      replaceWith: string[],
-      portal: AU.IPortalContext,
-    ) => (
-      <>
-        <div
-          className="content-container vertical-spacing-bottom typography-dense"
-          dangerouslySetInnerHTML={
-            // eslint-disable-next-line max-len
-            { __html: replace(activatedText, replaceText, replaceWith) }
-          }
-        />
-        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
-        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
-      </>
-    ),
-  },
-  {
-    name: 'minansoegning',
-    impersonationSetup: {
-      auid: window.IMPERSONATE_AUID,
-      value: window.IMPERSONATE_VALUE,
-      type: window.IMPERSONATE_TYPE,
-      phase: window.PHASE,
-      realPhase: window.REAL_PHASE,
-    },
-    impersonationOptions: [
-      {
-        value: 'auid',
-        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_AUID[lang],
-      },
-      {
-        value: 'cpr',
-        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_CPR[lang],
-      },
-      {
-        value: 'email',
-        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_EMAIL[lang],
-      },
-    ],
-    deactivateFormContent: (
-      activatedText: string,
-      replaceText: string[],
-      replaceWith: string[],
-      portal: AU.IPortalContext,
-    ) => (
-      <>
-        <div
-          className="content-container vertical-spacing-bottom typography-dense"
-          dangerouslySetInnerHTML={
-            // eslint-disable-next-line max-len
-            { __html: replace(activatedText, replaceText, replaceWith) }
-          }
-        />
-        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
-        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
-        <input type="hidden" name="phase" value={portal.impersonationSetup.phase} />
-      </>
-    ),
-  }, {
-    name: 'mitmedarbejdere',
-    impersonationSetup: {
-      auid: '',
-      value: '',
-      type: '',
-    },
-    impersonationOptions: [],
-    deactivateFormContent: (
-      activatedText: string,
-      replaceText: string[],
-      replaceWith: string[],
-      portal: AU.IPortalContext,
-    ) => (
-      <>
-        <div
-          className="content-container vertical-spacing-bottom typography-dense"
-          dangerouslySetInnerHTML={
-            // eslint-disable-next-line max-len
-            { __html: replace(activatedText, replaceText, replaceWith) }
-          }
-        />
-        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
-        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
-      </>
-    ),
-  },
-];
-
-export const getPortalByName = (
-  lang: string,
-  name: string,
-): AU.IPortalContext | null => portals(lang).find((portal) => portal.name === name) ?? null;
-
-export const impersonationPortalElement = document.querySelector('.page__pre-header');
-
-export const isImpersonating = (): boolean => {
-  if (window.userContext == null) {
-    return false;
-  }
-  if (window.userContext.impersonatedUser == null) {
-    return false;
-  }
-  return true;
-};
-
-export const impersonationHasErrored = (): boolean => window.impersonateError;
+/* eslint-disable import/prefer-default-export */
+import React from 'react';
+import { replace } from './helpers';
+
+const impersonationLabels = {
+  IMPERSONATION_SELECT_OPTION_CPR: { da: 'CPR-nr.', en: 'CPR no.' },
+  IMPERSONATION_SELECT_OPTION_EMAIL: { da: 'E-mail', en: 'Email' },
+  IMPERSONATION_SELECT_OPTION_AUID: { da: 'AU-id', en: 'AU ID' },
+  IMPERSONATION_SELECT_OPTION_STUDENTNUMBER: { da: 'Studienummer', en: 'Student Number' },
+};
+
+declare global {
+  interface Window {
+    IMPERSONATE_AUID: string;
+    IMPERSONATE_VALUE: string;
+    IMPERSONATE_TYPE: string;
+    PHASE: number;
+    REAL_PHASE: number;
+    authenticated: boolean;
+    userContext: AU.IUserContext;
+    impersonateError: boolean;
+  }
+}
+
+const portals: (lang: string) => AU.IPortalContext[] = (lang: string) => [
+  {
+    name: 'mitstudie',
+    impersonationSetup: {
+      auid: window.IMPERSONATE_AUID,
+      value: window.IMPERSONATE_VALUE,
+      type: window.IMPERSONATE_TYPE,
+    },
+    impersonationOptions: [
+      {
+        value: 'auid',
+        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_AUID[lang],
+      },
+      {
+        value: 'studentnumber',
+        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_STUDENTNUMBER[lang],
+      },
+    ],
+    deactivateFormContent: (
+      activatedText: string,
+      replaceText: string[],
+      replaceWith: string[],
+      portal: AU.IPortalContext,
+    ) => (
+      <>
+        <div
+          className="content-container vertical-spacing-bottom typography-dense"
+          dangerouslySetInnerHTML={
+            // eslint-disable-next-line max-len
+            { __html: replace(activatedText, replaceText, replaceWith) }
+          }
+        />
+        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
+        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
+      </>
+    ),
+  },
+  {
+    name: 'minansoegning',
+    impersonationSetup: {
+      auid: window.IMPERSONATE_AUID,
+      value: window.IMPERSONATE_VALUE,
+      type: window.IMPERSONATE_TYPE,
+      phase: window.PHASE,
+      realPhase: window.REAL_PHASE,
+    },
+    impersonationOptions: [
+      {
+        value: 'auid',
+        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_AUID[lang],
+      },
+      {
+        value: 'cpr',
+        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_CPR[lang],
+      },
+      {
+        value: 'email',
+        label: impersonationLabels.IMPERSONATION_SELECT_OPTION_EMAIL[lang],
+      },
+    ],
+    deactivateFormContent: (
+      activatedText: string,
+      replaceText: string[],
+      replaceWith: string[],
+      portal: AU.IPortalContext,
+    ) => (
+      <>
+        <div
+          className="content-container vertical-spacing-bottom typography-dense"
+          dangerouslySetInnerHTML={
+            // eslint-disable-next-line max-len
+            { __html: replace(activatedText, replaceText, replaceWith) }
+          }
+        />
+        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
+        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
+        <input type="hidden" name="phase" value={portal.impersonationSetup.phase} />
+      </>
+    ),
+  }, {
+    name: 'mitmedarbejdere',
+    impersonationSetup: {
+      auid: '',
+      value: '',
+      type: '',
+    },
+    impersonationOptions: [],
+    deactivateFormContent: (
+      activatedText: string,
+      replaceText: string[],
+      replaceWith: string[],
+      portal: AU.IPortalContext,
+    ) => (
+      <>
+        <div
+          className="content-container vertical-spacing-bottom typography-dense"
+          dangerouslySetInnerHTML={
+            // eslint-disable-next-line max-len
+            { __html: replace(activatedText, replaceText, replaceWith) }
+          }
+        />
+        <input type="hidden" name="type" value={portal.impersonationSetup.type} />
+        <input type="hidden" name="value" value={portal.impersonationSetup.value} />
+      </>
+    ),
+  },
+];
+
+export const getPortalByName = (
+  lang: string,
+  name: string,
+): AU.IPortalContext | null => portals(lang).find((portal) => portal.name === name) ?? null;
+
+export const impersonationPortalElement = document.querySelector('.page__pre-header');
+
+export const isImpersonating = (): boolean => {
+  if (window.userContext == null) {
+    return false;
+  }
+  if (window.userContext.impersonatedUser == null) {
+    return false;
+  }
+  return true;
+};
+
+export const impersonationHasErrored = (): boolean => window.impersonateError;

package/src/lib/tinymce.ts

@@ -1,84 +1,84 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-const blockNames = {
-  p: {
-    da: 'Afsnit',
-    en: 'Paragraph',
-  },
-  h1: {
-    da: 'Overskrift 1',
-    en: 'Header 1',
-  },
-  h2: {
-    da: 'Overskrift 2',
-    en: 'Header 2',
-  },
-  h3: {
-    da: 'Overskrift 3',
-    en: 'Header 3',
-  },
-  h4: {
-    da: 'Overskrift 4',
-    en: 'Header 4',
-  },
-};
-
-class AUTinyMCEBuilder {
-  #tinyBase = 'https://cdn.au.dk/vendor/tinymce/6.7.0/tinymce/js/tinymce/';
-
-  #tinySkin = 'au_delphinus';
-
-  tinyScriptSrc = `${this.#tinyBase}tinymce.min.js`;
-
-  #tinyContentCssSrc = `${this.#tinyBase}skins/content/${this.#tinySkin}/content.css`;
-
-  #lang = 'da';
-
-  #showCounter = false;
-
-  #onKeyUp: (editor: any) => void;
-
-  constructor(
-    lang: string,
-    showCounter: boolean,
-    onKeyUp: (editor: any) => void,
-  ) {
-    this.#lang = lang;
-    this.#showCounter = showCounter;
-    this.#onKeyUp = onKeyUp;
-  }
-
-  tinyGeneralConfig() {
-    return {
-      skin: this.#tinySkin,
-      content_css: this.#tinyContentCssSrc,
-      language: this.#lang,
-      menubar: false,
-      branding: false,
-      height: '280',
-      plugins: ['lists', 'link', 'visualblocks', 'visualchars', 'wordcount'],
-      toolbar: 'blocks | bold italic underline | bullist numlist | link | removeformat visualblocks visualchars',
-      // eslint-disable-next-line max-len
-      // block_formats: 'Afsnit=p;Overskrift 1=h1;Overskrift 2=h2;Overskrift 3=h3;Overskrift 4=h4;Overskrift 5=h5;Overskrift 6=h6',
-      block_formats: Object.keys(blockNames).map((key) => `${blockNames[key][this.#lang]}=${key}`).join(';'),
-      setup: (editor: any) => {
-        if (this.#showCounter) {
-          editor.on('keyup', () => {
-            this.#onKeyUp(editor);
-          });
-        }
-      },
-      init_instance_callback: (editor: any) => {
-        if (this.#showCounter) {
-          const container = editor.getContainer();
-
-          const button = container.querySelector('button.tox-statusbar__wordcount');
-          if (button) {
-            button.click();
-          }
-        }
-      },
-    };
-  }
-}
-
-export default AUTinyMCEBuilder;
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const blockNames = {
+  p: {
+    da: 'Afsnit',
+    en: 'Paragraph',
+  },
+  h1: {
+    da: 'Overskrift 1',
+    en: 'Header 1',
+  },
+  h2: {
+    da: 'Overskrift 2',
+    en: 'Header 2',
+  },
+  h3: {
+    da: 'Overskrift 3',
+    en: 'Header 3',
+  },
+  h4: {
+    da: 'Overskrift 4',
+    en: 'Header 4',
+  },
+};
+
+class AUTinyMCEBuilder {
+  #tinyBase = 'https://cdn.au.dk/vendor/tinymce/6.7.0/tinymce/js/tinymce/';
+
+  #tinySkin = 'au_delphinus';
+
+  tinyScriptSrc = `${this.#tinyBase}tinymce.min.js`;
+
+  #tinyContentCssSrc = `${this.#tinyBase}skins/content/${this.#tinySkin}/content.css`;
+
+  #lang = 'da';
+
+  #showCounter = false;
+
+  #onKeyUp: (editor: any) => void;
+
+  constructor(
+    lang: string,
+    showCounter: boolean,
+    onKeyUp: (editor: any) => void,
+  ) {
+    this.#lang = lang;
+    this.#showCounter = showCounter;
+    this.#onKeyUp = onKeyUp;
+  }
+
+  tinyGeneralConfig() {
+    return {
+      skin: this.#tinySkin,
+      content_css: this.#tinyContentCssSrc,
+      language: this.#lang,
+      menubar: false,
+      branding: false,
+      height: '280',
+      plugins: ['lists', 'link', 'visualblocks', 'visualchars', 'wordcount'],
+      toolbar: 'blocks | bold italic underline | bullist numlist | link | removeformat visualblocks visualchars',
+      // eslint-disable-next-line max-len
+      // block_formats: 'Afsnit=p;Overskrift 1=h1;Overskrift 2=h2;Overskrift 3=h3;Overskrift 4=h4;Overskrift 5=h5;Overskrift 6=h6',
+      block_formats: Object.keys(blockNames).map((key) => `${blockNames[key][this.#lang]}=${key}`).join(';'),
+      setup: (editor: any) => {
+        if (this.#showCounter) {
+          editor.on('keyup', () => {
+            this.#onKeyUp(editor);
+          });
+        }
+      },
+      init_instance_callback: (editor: any) => {
+        if (this.#showCounter) {
+          const container = editor.getContainer();
+
+          const button = container.querySelector('button.tox-statusbar__wordcount');
+          if (button) {
+            button.click();
+          }
+        }
+      },
+    };
+  }
+}
+
+export default AUTinyMCEBuilder;

package/src/lib/wrapping.ts

@@ -1,21 +1,21 @@
-/* eslint-env browser */
-const getSourceForFrame = (
-  serviceUrl: string,
-  path: string,
-  referrer: string,
-  callback: (data: any) => void,
-) => {
-  const getSource = async (): Promise<void> => {
-    const url = `${serviceUrl}?path=${path}&referrer=${referrer}`;
-    const response = await fetch(url, {
-      credentials: 'include',
-    });
-
-    const json = await response.json();
-    callback(json);
-  };
-
-  getSource();
-};
-
-export default getSourceForFrame;
+/* eslint-env browser */
+const getSourceForFrame = (
+  serviceUrl: string,
+  path: string,
+  referrer: string,
+  callback: (data: any) => void,
+) => {
+  const getSource = async (): Promise<void> => {
+    const url = `${serviceUrl}?path=${path}&referrer=${referrer}`;
+    const response = await fetch(url, {
+      credentials: 'include',
+    });
+
+    const json = await response.json();
+    callback(json);
+  };
+
+  getSource();
+};
+
+export default getSourceForFrame;

package/src/styles/_settings.scss

@@ -1,11 +1,11 @@
-$font-passata-regular: "AUPassataRegular";
-$font-passata-bold: "AUPassataBold";
-$gray-color:#e4e4e4;
-$gray-secondary-color:darken($gray-color, 50%);
-$alert-confirm-color: #8bad3f;
-$alert-cancel-color: #687989;
-$student-color:#8bad3f;
-$student-secondary-color:#2a4a0f;
-$staff-color: #379fcb;
-$staff-secondary-color:#003e5c;
+$font-passata-regular: "AUPassataRegular";
+$font-passata-bold: "AUPassataBold";
+$gray-color:#e4e4e4;
+$gray-secondary-color:darken($gray-color, 50%);
+$alert-confirm-color: #8bad3f;
+$alert-cancel-color: #687989;
+$student-color:#8bad3f;
+$student-secondary-color:#2a4a0f;
+$staff-color: #379fcb;
+$staff-secondary-color:#003e5c;
 $findicon: 'https://cdn.au.dk/2016/assets/img/databox/find.png';