@aarhus-university/au-lib-react-components 9.11.18 → 10.0.1

package/src/lib/{tracking.js → tracking.ts}

@@ -1,65 +1,69 @@
-/* eslint-disable func-names */
-/* eslint-env browser */
-/* eslint-disable no-sequences */
-/* eslint-disable prefer-destructuring */
-/* eslint-disable no-param-reassign */
-/* eslint-disable prefer-rest-params */
-/* eslint-disable no-unused-expressions */
-/* eslint-disable dot-notation */
-/* eslint-disable wrap-iife */
-/*
- * Title: TRACKING
- * Description: Google Analytics tracking
- */
-
-class AUTracking {
-  trackers = [
-    {
-      account: 'UA-2142081-1',
-      name: 'default',
-    },
-    {
-      account: 'UA-113308028-1',
-      name: 'search',
-    },
-  ];
-
-  constructor(trackers = []) {
-    trackers.forEach((tracker) => this.trackers.push(tracker));
-    this.init();
-
-    this.trackSingle = this.trackSingle.bind(this);
-  }
-
-  init() {
-    (function (i, s, o, g, r, a, m) {
-      i['GoogleAnalyticsObject'] = r;
-      i[r] = i[r] || function () {
-        (i[r].q = i[r].q || []).push(arguments);
-      }, i[r].l = 1 * new Date();
-      a = s.createElement(o),
-      m = s.getElementsByTagName(o)[0];
-      a.async = 1;
-      a.src = g;
-      m.parentNode.insertBefore(a, m);
-    })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
-
-    this.trackers.forEach((tracker) => {
-      window.ga('create', tracker.account, 'auto', tracker.name);
-      window.ga(`${tracker.name}.require`, 'displayfeatures');
-      window.ga(`${tracker.name}.require`, 'linkid', 'linkid.js');
-      window.ga(`${tracker.name}.require`, 'GTM-MGFPHKR');
-      window.ga(`${tracker.name}.set`, 'anonymizeIp', true);
-
-      window.ga(`${tracker.name}.send`, 'pageview');
-    });
-  }
-
-  trackSingle(trackerLink) {
-    if (typeof window.ga !== 'undefined') {
-      this.trackers.forEach((tracker) => window.ga(`${tracker.name}.send`, 'pageview', trackerLink));
-    }
-  }
-}
-
-export default AUTracking;
+/* eslint-disable func-names */
+/* eslint-env browser */
+/* eslint-disable no-sequences */
+/* eslint-disable prefer-destructuring */
+/* eslint-disable no-param-reassign */
+/* eslint-disable prefer-rest-params */
+/* eslint-disable no-unused-expressions */
+/* eslint-disable dot-notation */
+/* eslint-disable wrap-iife */
+/*
+ * Title: TRACKING
+ * Description: Google Analytics tracking
+ */
+
+class AUTracking {
+  trackers: ITrackers[] = [
+    {
+      account: 'UA-2142081-1',
+      name: 'default',
+    },
+    {
+      account: 'UA-113308028-1',
+      name: 'search',
+    },
+  ];
+
+  constructor(trackers = []) {
+    trackers.forEach((tracker) => this.trackers.push(tracker));
+    this.init();
+
+    this.trackSingle = this.trackSingle.bind(this);
+  }
+
+  init() {
+    let gaNewElem: any = {};
+    let gaElems: any = {};
+    const currdate: any = new Date();
+
+    ((i, s, o, g, r, a, m): void => {
+      i['GoogleAnalyticsObject'] = r;
+      i[r] = i[r] || function () {
+        (i[r].q = i[r].q || []).push(arguments);
+      }, i[r].l = 1 * currdate;
+      a = s.createElement(o),
+        m = s.getElementsByTagName(o)[0];
+      a.async = 1;
+      a.src = g;
+      m.parentNode.insertBefore(a, m);
+    })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga', gaNewElem, gaElems);
+
+    this.trackers.forEach((tracker) => {
+      window.ga('create', tracker.account, 'auto', tracker.name);
+      window.ga(`${tracker.name}.require`, 'displayfeatures');
+      window.ga(`${tracker.name}.require`, 'linkid', 'linkid.js');
+      window.ga(`${tracker.name}.require`, 'GTM-MGFPHKR');
+      window.ga(`${tracker.name}.set`, 'anonymizeIp', true);
+
+      window.ga(`${tracker.name}.send`, 'pageview');
+    });
+  }
+
+  trackSingle(trackerLink: string): void {
+    if (typeof window.ga !== 'undefined') {
+      this.trackers.forEach((tracker) => window.ga(`${tracker.name}.send`, 'pageview', trackerLink));
+    }
+  }
+}
+
+export default AUTracking;

package/src/lib/{wrapping.js → wrapping.ts}

@@ -1,16 +1,21 @@
-/* eslint-env browser */
-const getSourceForFrame = (serviceUrl, path, referrer, callback) => {
-  const getSource = async () => {
-    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';

package/src/styles/alphabox.scss

@@ -1,209 +1,223 @@
-.au_alphabox {
-  overflow: visible;
-  margin-bottom: 1rem;
-  position: relative;
-  >.au_alphabox {
-    margin-bottom: 0;
-  }
-  .dropdown-pane & {
-    margin-bottom: 0;
-  }
-  >div:not(.au_alphabox_content):not(.au_alphabox) { /* because of nested au_alphabox */
-    padding: 1rem 1rem 0 1rem;
-    overflow: auto;
-  }
-  ul.letters {
-    display: flex;
-    justify-content: flex-start;
-    flex-flow: row wrap;
-    font-size: 1.1rem;
-    margin-top: .15rem;
-    margin-bottom: .75rem;
-    margin-left: 0;
-    padding-bottom: .75rem;
-    border-bottom: 1px solid #ccc;
-    li {
-      padding: 0;
-      margin: 2px 2px;
-      background-color: #aaa;
-      text-align: center;
-      font-size: 1.2rem;
-      &.available {
-        button {
-          cursor: pointer;
-          color: #fff;
-        }
-      }
-      &.active {
-        font-weight: bold;
-      }
-      &:before {
-        content: '';
-      }
-      button {
-        font-family: $font-passata-regular;
-        color: #ccc;
-        text-transform: uppercase;
-        width: 20px;
-        line-height: inherit;
-      }
-    }
-  }
-  ul.items {
-    padding: 1rem;
-    margin: 0;
-    position: relative;
-  }
-  .student & {
-    background: $student-secondary-color;
-    .listNav {
-      .ln-letters {
-        a {
-          background-color: #8bad3f;
-          &.ln-selected {
-            color: #2a4a0f !important;
-          }
-          &.ln-disabled {
-            background-color: #8bad3f;
-          }
-        }
-      }
-    }
-    .alphabox_list_container {
-      border: 2px solid #2a4a0f;
-      h3 {
-        color: #8bad3f;
-        border-bottom: 2px solid #8bad3f;
-      }
-      ul li:before {
-        color: #8bad3f;
-      }
-    }
-    ul.quicklinks {
-      a {
-        background: #447400;
-      }
-    }
-  }
-  h2 {
-    color: #fff;
-    margin: 0;
-    border: 0;
-    a {
-      color: #fff !important;
-      border: none !important;
-      &:hover {
-        text-decoration: underline !important;
-      }
-    }
-  }
-  p {
-    color: #fff;
-    margin: 1rem 0 1rem 0 !important;
-    font-size: 1.25rem;
-  }
-  input[type=text] {
-    background: #afc3ce url($findicon) no-repeat right center;
-    border: 0;
-    float: none;
-    width: 100%;
-    margin-bottom: 1.45455rem !important;
-    &.active {
-      background-color: #afc3ce;
-    }
-  }
-  ::-webkit-input-placeholder {
-    color: #333;
-  }
-  ::-moz-placeholder {
-    color: #333;
-    opacity: 1;
-  }
-  :-ms-input-placeholder {
-    color: #333;
-  }
-  .listNav {
-    margin: 0 0 calc(.5rem - 2px) 0;
-    .ln-letters {
-      margin: 1rem 0;
-      a {
-        background-color: #006ca4;
-        border: none !important;
-        margin: 0 2px 2px 0;
-        color: #fff;
-        padding: 2px;
-        font-size: 1.25rem;
-        &.ln-selected {
-          background-color: #fff;
-          color: #006ca4 !important;
-        }
-        &.ln-disabled {
-          background-color: #006ca4;
-          color: #7c98a8 !important;
-        }
-      }
-      .all {
-        display: none;
-      }
-    }
-    font-family: "AUPassataBold";
-  }
-  .alphabox_list_container {
-    background: #fff;
-    border: 2px solid #006ca4;
-    padding: 0 1rem 0 1rem;
-    display: none;
-    overflow-y: scroll;
-    -webkit-overflow-scrolling: touch;
-    h3 {
-      color: #009ee0;
-      border-bottom: 2px solid $staff-color;
-    }
-    >ul {
-      max-height: 200px;
-      overflow: initial !important;
-      margin-bottom: 2em;
-      position: relative;
-      li {
-        a {
-          color: $staff-secondary-color;
-          border-bottom: 1px dotted;
-        }
-      }
-    }
-  }
-  ul.quicklinks {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    margin-left: 0;
-    li {
-      font: 1.25rem "AUPassataRegular";
-      text-transform: uppercase;
-      width: 48.9%;
-      padding: 0;
-      line-height: 1;
-      margin-bottom: 6px;
-      &:nth-child(odd) {
-        margin-right: .5em;
-      }
-      a {
-        display: block;
-        background: #006ca4;
-        color: #fff;
-        border: none !important;
-        padding: .5em;
-      }
-    }
-  }
-  .au_alphabox_content {
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-    clear: both;
-    >div {
-      background: #fff;
-      max-height: 300px;
-      overflow-y: scroll;
-    }
-  }
+.au_alphabox {
+  overflow: visible;
+  margin-bottom: 1rem;
+  position: relative;
+  >.au_alphabox {
+    margin-bottom: 0;
+  }
+  .dropdown-pane & {
+    margin-bottom: 0;
+  }
+  >div:not(.au_alphabox_content):not(.au_alphabox) { /* because of nested au_alphabox */
+    padding: 1rem 1rem 0 1rem;
+    overflow: auto;
+  }
+  p.no-results {
+    background-color: #fff;
+    color: #555;
+    padding: 1rem;
+  }
+  li.no-results a {
+    font-weight: bold;
+  }
+  ul.letters {
+    display: flex;
+    justify-content: flex-start;
+    flex-flow: row wrap;
+    font-size: 1.1rem;
+    margin-top: .15rem;
+    margin-bottom: .75rem;
+    margin-left: 0;
+    padding-bottom: .75rem;
+    li {
+      padding: 0;
+      margin: 2px 2px;
+      background-color: #aaa;
+      text-align: center;
+      font-size: 1.2rem;
+      &.available {
+        button {
+          cursor: pointer;
+          color: #fff;
+        }
+      }
+      &.active {
+        font-weight: bold;
+      }
+      &:before {
+        content: '';
+      }
+      button {
+        font-family: $font-passata-regular;
+        color: #ccc;
+        text-transform: uppercase;
+        width: 20px;
+        line-height: inherit;
+      }
+    }
+  }
+  ul.items {
+    padding: 1rem;
+    margin: 0;
+    position: relative;
+  }
+  .student & {
+    background: $student-secondary-color;
+    .listNav {
+      .ln-letters {
+        a {
+          background-color: #8bad3f;
+          &.ln-selected {
+            color: #2a4a0f !important;
+          }
+          &.ln-disabled {
+            background-color: #8bad3f;
+          }
+        }
+      }
+    }
+    .alphabox_list_container {
+      border: 2px solid #2a4a0f;
+      h3 {
+        color: #8bad3f;
+        border-bottom: 2px solid #8bad3f;
+      }
+      ul li:before {
+        color: #8bad3f;
+      }
+    }
+    ul.quicklinks {
+      a {
+        background: #447400;
+      }
+    }
+  }
+  h2 {
+    color: #fff;
+    margin: 0;
+    border: 0;
+    a {
+      color: #fff !important;
+      border: none !important;
+      &:hover {
+        text-decoration: underline !important;
+      }
+    }
+  }
+  h3 {
+    color: #fff;
+    margin: 0 0 1rem 0 !important;
+    padding-top: 1rem;
+    font-size: 1.25rem;
+    border-top: 1px solid #fff;
+  }
+  input[type=text] {
+    background: #afc3ce url($findicon) no-repeat right center;
+    border: 0;
+    float: none;
+    width: 100%;
+    margin-bottom: 1.45455rem !important;
+    &.active {
+      background-color: #afc3ce;
+    }
+  }
+  ::-webkit-input-placeholder {
+    color: #333;
+  }
+  ::-moz-placeholder {
+    color: #333;
+    opacity: 1;
+  }
+  :-ms-input-placeholder {
+    color: #333;
+  }
+  .listNav {
+    margin: 0 0 calc(.5rem - 2px) 0;
+    .ln-letters {
+      margin: 1rem 0;
+      a {
+        background-color: #006ca4;
+        border: none !important;
+        margin: 0 2px 2px 0;
+        color: #fff;
+        padding: 2px;
+        font-size: 1.25rem;
+        &.ln-selected {
+          background-color: #fff;
+          color: #006ca4 !important;
+        }
+        &.ln-disabled {
+          background-color: #006ca4;
+          color: #7c98a8 !important;
+        }
+      }
+      .all {
+        display: none;
+      }
+    }
+    font-family: "AUPassataBold";
+  }
+  .alphabox_list_container {
+    background: #fff;
+    border: 2px solid #006ca4;
+    padding: 0 1rem 0 1rem;
+    display: none;
+    overflow-y: scroll;
+    -webkit-overflow-scrolling: touch;
+    h3 {
+      color: #009ee0;
+      border-bottom: 2px solid $staff-color;
+    }
+    >ul {
+      max-height: 200px;
+      overflow: initial !important;
+      margin-bottom: 2em;
+      position: relative;
+      li {
+        a {
+          color: $staff-secondary-color;
+          border-bottom: 1px dotted;
+        }
+      }
+    }
+  }
+  ul.quicklinks {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    margin-left: 0;
+    li {
+      font: 1.25rem "AUPassataRegular";
+      text-transform: uppercase;
+      width: 48.9%;
+      padding: 0;
+      line-height: 1;
+      margin-bottom: 6px;
+      &:nth-child(odd) {
+        margin-right: .5em;
+      }
+      a {
+        display: block;
+        background: #006ca4;
+        color: #fff;
+        border: none !important;
+        padding: .5em;
+      }
+      @media (max-width: 400px) {
+        width: 100%;
+        margin-right: 0 !important;
+        font-size: 1.72727rem;
+      }
+    }
+  }
+  .au_alphabox_content {
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+    clear: both;
+    >div {
+      background: #fff;
+      max-height: 300px;
+      overflow-y: scroll;
+    }
+  }
 }

package/src/styles/app.scss

@@ -1,13 +1,7 @@
-@import "_settings";
-@import "alert";
-@import "alphabox";
-@import "autosuggest";
-@import "calendar";
-@import "databox";
-@import "diagramme";
-@import "flowbox";
-@import "modal";
-@import "spinner";
-@import "filtercheckbox";
-@import "pagination";
-@import "maps";
+@import "_settings";
+@import "alphabox";
+@import "autosuggest";
+@import "databox";
+@import "diagramme";
+@import "flowbox";
+@import "maps";