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

package/tsconfig.json

@@ -0,0 +1,47 @@
+{
+  "compilerOptions": {
+    // Target latest version of ECMAScript.
+    "target": "esnext",
+    // path to output directory
+    "outDir": "../wwwroot/js",
+    // enable strict null checks as a best practice
+    "strictNullChecks": true,
+    // Search under node_modules for non-relative imports.
+    "moduleResolution": "node",
+    // Process & infer types from .js files.
+    "allowJs": true,
+    // Don't emit; allow Babel to transform files.
+    "noEmit": true,
+    // Enable strictest settings like strictNullChecks & noImplicitAny.
+    "strict": true,
+    // Import non-ES modules as default imports.
+    "esModuleInterop": true,
+    // use typescript to transpile jsx to js
+    "jsx": "react",
+    "baseUrl": "./src",
+    "lib": [
+      "es2015",
+      "dom.iterable",
+      "es2016.array.include",
+      "es2017.object",
+      "dom"
+    ],
+    "module": "es6",
+    "removeComments": true,
+    "alwaysStrict": true,
+    "allowUnreachableCode": false,
+    "noImplicitAny": false,
+    "noImplicitThis": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "forceConsistentCasingInFileNames": true,
+    "importHelpers": true,
+    "resolveJsonModule": true,
+    "typeRoots": [
+      "./node_modules/@types",
+      "./node_modules/@aarhus-university/au-designsystem-delphinus/types"
+    ]
+  },
+}

package/types/common/interfaces/gui.d.ts

@@ -0,0 +1,52 @@
+/* eslint-disable import/prefer-default-export */
+interface IAlertButton {
+  className: string,
+  text: string,
+  dataIcon: string |null,
+  onClick: () => void,
+}
+
+interface IToastMessage {
+  message: string,
+  type: string,
+}
+
+interface IModal {
+  modal: boolean,
+  sender: HTMLElement | null,
+}
+
+interface ICalendarState {
+  day: number,
+  month: number,
+  year: number,
+  hour: number,
+  minute: number,
+  selected: Date,
+}
+
+interface IProgressable {
+  onProgress: () => Promise<IProgressable>,
+  progressed: boolean,
+}
+
+interface IReceiptButton {
+  gotoLink: string,
+  gotoText: string,
+}
+
+interface ITrackers {
+  account: string,
+  name: string,
+}
+
+interface IProfileSettings {
+  type: string,
+  url: string,
+  classNames?: string,
+  icon?: string,
+  dataGtm: string,
+  text: string,
+  disabled?: boolean,
+  onClick?: (el: Element) => void,
+}

package/types/common/interfaces/model.d.ts

@@ -0,0 +1,29 @@
+declare namespace AU {
+  export interface IUserContext {
+    auId: number,
+    firstNames: string,
+    lastName: string,
+    name: string,
+    preferredLanguage: string,
+    userName: string,
+    memberOfGroups: IAdGroup[],
+    impersonatingUser: IUserContext | null,
+  }
+
+  export interface IAdGroup {
+    id: string,
+    name: string,
+  }
+
+  export interface ICountryCode {
+    da: string,
+    en: string,
+    code: number,
+    important?: boolean | undefined,
+  }
+
+  export interface IPhoneNumber {
+    prefix: string,
+    number: string,
+  }
+}

package/types/common/main.d.ts

@@ -0,0 +1,5 @@
+/* eslint-disable @typescript-eslint/triple-slash-reference */
+/// <reference path="./interfaces/gui.d.ts" />
+/// <reference path="./interfaces/model.d.ts" />
+/// <reference path="./payloads.d.ts" />
+/// <reference path="./props.d.ts" />

package/types/common/package.json

@@ -0,0 +1,5 @@
+{
+    "name": "common",
+    "version": "1.0.0",
+    "typings": "main.d.ts"
+  }

package/types/common/props.d.ts

@@ -0,0 +1,165 @@
+interface AUAlertComponentProps {
+  message: string,
+  children: JSX.Element,
+  alert: boolean,
+  buttons?: IAlertButton[],
+}
+
+interface AUCalendarComponentProps {
+  lang?: string,
+  day: number,
+  month: number,
+  year: number,
+  hour: number,
+  minute: number,
+  selected?: Date,
+  onSelected: (selected: Date) => void,
+  highlightWeekend?: boolean,
+  highlightHolidays?: boolean,
+  yearSpanMinus?: number,
+  yearSpanPlus?: number,
+  minuteInterval?: number,
+  showTime?: boolean,
+  closeable?: boolean,
+  onClose?: () => void,
+  limitStart?: Date | null,
+  limitEnd?: Date | null,
+  controls: string,
+}
+
+interface AUContentToggleComponentProps {
+  toggled: boolean,
+  classNames?: string | undefined,
+  children: JSX.Element,
+}
+
+interface AUDatepickerComponentProps {
+  id: string;
+  lang?: string;
+  date?: Date;
+  onDateChange: (date: Date, formatted: string) => void;
+  onHide: (date: Date, dateFormatted: string) => void;
+  format?: string;
+  showTime?: boolean;
+  showLabel?: boolean;
+  labelInline?: boolean;
+  labelText?: string;
+  fullWidth?: boolean;
+  yearSpanMinus?: number;
+  yearSpanPlus?: number;
+  limitStart?: Date | null;
+  limitEnd?: Date | null;
+  disabled?: boolean;
+}
+
+interface AUModalComponentProps {
+  domId: string,
+  children?: JSX.Element,
+  onClose?: () => void,
+  closeButton?: boolean,
+  closeButtonDisabled?: boolean,
+  lang?: string,
+  sender: HTMLElement | null,
+  className?: string,
+}
+
+interface AUSpinnerComponentProps {
+  domID?: string,
+  className?: string,
+  children: JSX.Element,
+  visible?: boolean,
+  loaded: boolean,
+  loadingCondition: boolean,
+  height?: string,
+  init?: string,
+  onLoad: () => void,
+}
+
+interface AUSubNavComponentProps {
+  children: JSX.Element,
+  className: string,
+  dataIcon: string,
+  text: string,
+  ariaLabel: string,
+  id: string,
+}
+
+interface AUTableComponentProps {
+  children: JSX.Element,
+  className: string,
+}
+
+interface TabRoutesProps {
+  onRouteChange: (location: any) => void, // Noget react-router-dom halløj her der ikke spiller...
+  content: JSX.Element[],
+}
+
+interface AUTabbedContentComponentProps {
+  tabKey?: number,
+  tabs: ITabbedTab[],
+  tabContent?: ITabbedObject[] | null,
+  children?: JSX.Element | null,
+  focus?: boolean,
+  initial?: number,
+  lang?: string,
+  callback?: () => void,
+  withRouter?: boolean,
+  classNames?: string,
+}
+
+interface AUToastComponentProps {
+  message: IToastMessage,
+  dismiss?: () => void,
+  onOpen?: () => void,
+}
+
+interface AUToolbarComponentProps {
+  lang: string,
+  elements: JSX.Element[],
+}
+
+interface AUSubmitButtonContainerComponentProps {
+  lang: string,
+  disabled: boolean,
+  onSubmit: () => void,
+  onCancel: () => void,
+}
+
+interface AUMobilePrefixComponentProps {
+  countryCodes: AU.ICountryCode[],
+  important: boolean,
+}
+
+interface AUReceiptComponentProps {
+  receiptText: string,
+  helpText: JSX.Element | null,
+  showGoTo: boolean,
+  buttons: IReceiptButton[],
+}
+
+interface AUProfileWidgetComponentProps {
+  lang: string,
+  name: string,
+  auId: number,
+  studentNumber?: string,
+  settings: IProfileSettings[],
+  changeLanguageUri: string,
+  logoutUri: string,
+  profileLabels: any, // Noget med labels her?
+}
+
+interface AUProfileAvatarComponentProps {
+  user: AU.IUserContext,
+  settings: IProfileSettings[],
+  profileLabels: any, // Noget med labels her?
+  logoutUri: string,
+  changeLanguageUri?: string,
+  lang: string,
+}
+
+interface AUProfileLoginComponentProps {
+  loggedIn: boolean,
+  loginUri: string,
+  children: JSX.Element,
+  text: string,
+}

package/{src/config/webpack.umd.config.js → webpack.config.js}

@@ -1,28 +1,29 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+/* eslint-disable import/no-extraneous-dependencies */
 const ESLintPlugin = require('eslint-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 const path = require('path');
 
 // https://github.com/webpack/webpack/issues/4453
 
 const entries = {
-  all: './src/all',
-  alphabox: './src/lib/au-alphabox',
-  databox: './src/lib/au-databox',
-  diagramme: './src/lib/au-diagramme',
-  flowbox: './src/lib/au-flowbox',
-  news: './src/lib/au-news',
-  universe: './src/lib/universe',
-  auAuth: './src/lib/au-auth',
+  all: './src/layout-2016/lib/all',
+  alphabox: './src/layout-2016/lib/au-alphabox',
+  databox: './src/layout-2016/lib/au-databox',
+  diagramme: './src/layout-2016/lib/au-diagramme',
+  flowbox: './src/layout-2016/lib/au-flowbox',
+  universe: './src/layout-2016/lib/universe',
 };
 
-module.exports = Object.entries(entries).map(entry => ({
+module.exports = Object.entries(entries).map((entry) => ({
   mode: 'production',
   devtool: 'source-map',
   entry: {
     [entry[0]]: entry[1],
   },
   output: {
-    path: path.resolve(__dirname, '../../build/umd'),
+    path: path.resolve(__dirname, './build/umd'),
     filename: '[name].js',
     libraryTarget: 'umd', // https://webpack.js.org/configuration/output/#output-librarytarget
   },
@@ -34,26 +35,31 @@ module.exports = Object.entries(entries).map(entry => ({
       filename: 'all.css',
       chunkFilename: '[id].css',
     }),
+    new ForkTsCheckerWebpackPlugin(),
   ],
+  resolve: {
+    extensions: ['.ts', '.tsx', '.js', '.jsx'],
+  },
   module: {
     rules: [
       {
-        test: /\.js$/,
-        include: path.resolve(__dirname, '..'),
+        test: /\.(ts|js)x?$/,
+        include: path.resolve(__dirname, '.'),
+        exclude: /(node_modules)/,
         use: {
           loader: 'babel-loader',
         },
       },
       {
         test: /\.js$/,
-        include: path.resolve(__dirname, '../../node_modules/@aarhus-university/au-designsystem-delphinus/source'),
+        include: path.resolve(__dirname, './node_modules/@aarhus-university/au-designsystem-delphinus/source'),
         use: {
           loader: 'babel-loader',
         },
       },
       {
         test: /\.scss/,
-        include: path.resolve(__dirname, '..'),
+        include: path.resolve(__dirname, './src/styles'),
         sideEffects: true,
         use: [
           MiniCssExtractPlugin.loader,
@@ -64,7 +70,6 @@ module.exports = Object.entries(entries).map(entry => ({
     ],
   },
   externals: {
-    axios: 'axios',
     moment: 'moment',
     react: {
       root: 'React',
@@ -80,6 +85,5 @@ module.exports = Object.entries(entries).map(entry => ({
       amd: 'react-dom',
       umd: 'react-dom',
     },
-    DISQUS: 'DISQUS',
   },
 }));

package/.eslintrc

@@ -1,19 +0,0 @@
-{
-    "extends": "airbnb",
-    "plugins": [
-      "react"
-    ],
-    "parser": "babel-eslint",
-    "rules": {
-      "react/jsx-filename-extension": [0],
-      "react/no-did-mount-set-state": [0],
-      "import/no-cycle": [0],
-      "react/no-danger": [0]
-    },
-    "globals": {
-      "google": true,
-      "$": true,
-      "AU": true,
-      "Msal": true
-    }
-}