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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (115) hide show
  1. package/.claude/settings.local.json +12 -0
  2. package/.eslintrc.js +35 -35
  3. package/.storybook/main.js +34 -34
  4. package/.storybook/preview.js +17 -17
  5. package/.vscode/settings.json +22 -0
  6. package/README.md +19 -19
  7. package/__tests__/jest/AUButtonComponent.test.tsx +165 -165
  8. package/__tests__/jest/AUDynamicContentComponent.test.tsx +386 -0
  9. package/__tests__/jest/AUErrorComponent.test.tsx +142 -142
  10. package/__tests__/jest/AUModalComponent.test.tsx +186 -186
  11. package/__tests__/jest/AUNotificationComponent.test.tsx +115 -115
  12. package/__tests__/jest/AUSpinnerComponent.test.tsx +57 -57
  13. package/__tests__/jest/AUToolbarComponent.test.tsx +46 -46
  14. package/__tests__/jest/context.test.ts +25 -25
  15. package/__tests__/jest/helpers.test.ts +15 -15
  16. package/__tests__/jest/setupTests.ts +2 -2
  17. package/babel.config.js +8 -8
  18. package/build/umd/all.css +3 -2
  19. package/build/umd/all.css.map +1 -7
  20. package/build/umd/all.js +2 -45
  21. package/build/umd/all.js.map +1 -7
  22. package/build/umd/alphabox.js +2 -45
  23. package/build/umd/alphabox.js.map +1 -7
  24. package/build/umd/databox.js +2 -45
  25. package/build/umd/databox.js.map +1 -7
  26. package/build/umd/diagramme.js +2 -44
  27. package/build/umd/diagramme.js.map +1 -7
  28. package/build/umd/flowbox.js +2 -44
  29. package/build/umd/flowbox.js.map +1 -7
  30. package/build/umd/universe.js +1 -1
  31. package/build-storybook.log +386 -386
  32. package/esbuild.mjs +22 -22
  33. package/package.json +107 -105
  34. package/src/components/AUAlertComponent.tsx +128 -128
  35. package/src/components/AUAutoSuggestComponent.js +148 -148
  36. package/src/components/AUButtonComponent.tsx +99 -97
  37. package/src/components/AUCalendarComponent.tsx +497 -497
  38. package/src/components/AUCharacterCountComponent.tsx +56 -56
  39. package/src/components/AUComboBoxComponent.tsx +195 -195
  40. package/src/components/AUContentToggleComponent.tsx +50 -50
  41. package/src/components/AUDatepickerComponent.tsx +124 -124
  42. package/src/components/AUDialogModalComponent.tsx +124 -124
  43. package/src/components/AUDynamicContentComponent.tsx +137 -0
  44. package/src/components/AUEditorComponent.tsx +126 -117
  45. package/src/components/AUErrorComponent.tsx +73 -73
  46. package/src/components/AUMobilePrefixComponent.tsx +20 -20
  47. package/src/components/AUModalComponent.tsx +72 -72
  48. package/src/components/AUNotificationComponent.tsx +44 -44
  49. package/src/components/AUReceiptComponent.tsx +34 -34
  50. package/src/components/AUSpinnerComponent.tsx +40 -40
  51. package/src/components/AUStepComponent.tsx +75 -75
  52. package/src/components/AUSubNavComponent.tsx +57 -57
  53. package/src/components/AUSubmitButtonContainerComponent.tsx +38 -38
  54. package/src/components/AUTabbedContentComponent.tsx +154 -154
  55. package/src/components/AUTableComponent.tsx +29 -29
  56. package/src/components/AUToastComponent.tsx +104 -104
  57. package/src/components/AUToolbarComponent.tsx +108 -108
  58. package/src/components/AUTruncatorComponent.tsx +141 -141
  59. package/src/components/wrapping/AUEmbedComponent.js +47 -47
  60. package/src/layout-2016/components/alphabox/AlphaBoxComponent.js +142 -143
  61. package/src/layout-2016/components/alphabox/AlphaBoxContentComponent.js +136 -136
  62. package/src/layout-2016/components/common/AUCollapsibleComponent.js +152 -152
  63. package/src/layout-2016/components/common/AUSpinnerComponent.js +103 -103
  64. package/src/layout-2016/components/databox/DataBoxAlphabetComponent.js +144 -144
  65. package/src/layout-2016/components/databox/DataBoxAssociationComponent.js +122 -122
  66. package/src/layout-2016/components/databox/DataBoxButtonComponent.js +157 -157
  67. package/src/layout-2016/components/databox/DataBoxComponent.js +297 -297
  68. package/src/layout-2016/components/databox/DataBoxGroupingComponent.js +64 -64
  69. package/src/layout-2016/components/databox/DataBoxSearchResultComponent.js +36 -36
  70. package/src/layout-2016/components/databox/DataBoxStackedAssociationComponent.js +54 -54
  71. package/src/layout-2016/components/databox/DataBoxSuggestionComponent.js +39 -39
  72. package/src/layout-2016/components/diagramme/AUDiagrammeComponent.js +309 -309
  73. package/src/layout-2016/components/flowbox/FlowBoxComponent.js +126 -126
  74. package/src/layout-2016/components/flowbox/FlowBoxPhoneComponent.js +104 -104
  75. package/src/layout-2016/lib/all.js +3 -3
  76. package/src/layout-2016/lib/au-alphabox.js +99 -100
  77. package/src/layout-2016/lib/au-databox.js +399 -400
  78. package/src/layout-2016/lib/au-diagramme.js +85 -85
  79. package/src/layout-2016/lib/au-flowbox.js +119 -93
  80. package/src/lib/context.tsx +59 -59
  81. package/src/lib/dates.ts +52 -52
  82. package/src/lib/helpers.ts +208 -208
  83. package/src/lib/hooks.ts +157 -157
  84. package/src/lib/i18n.ts +600 -600
  85. package/src/lib/portals.tsx +150 -150
  86. package/src/lib/tinymce.ts +84 -84
  87. package/src/lib/wrapping.ts +21 -21
  88. package/src/styles/_settings.scss +10 -10
  89. package/src/styles/alphabox.scss +222 -222
  90. package/src/styles/app.scss +7 -7
  91. package/src/styles/autosuggest.scss +57 -57
  92. package/src/styles/databox.scss +563 -563
  93. package/src/styles/diagramme.scss +119 -119
  94. package/src/styles/flowbox.scss +72 -72
  95. package/src/styles/maps.scss +395 -395
  96. package/stories/AUAlertComponent.stories.tsx +133 -133
  97. package/stories/AUAutoSuggestComponent.stories.tsx +95 -95
  98. package/stories/AUButtonComponent.stories.tsx +139 -139
  99. package/stories/AUCharacterCountComponent.stories.tsx +121 -121
  100. package/stories/AUComboBoxComponent.stories.tsx +101 -101
  101. package/stories/AUContentToggleComponent.stories.tsx +87 -87
  102. package/stories/AUDialogModalComponent.stories.tsx +75 -75
  103. package/stories/AUDynamicContentComponent.stories.tsx +119 -0
  104. package/stories/AUEditorComponent.stories.tsx +66 -66
  105. package/stories/AUErrorComponent.stories.tsx +132 -132
  106. package/stories/AUModalComponent.stories.tsx +160 -160
  107. package/stories/AUNotificationComponent.stories.tsx +151 -151
  108. package/stories/AUSpinnerComponent.stories.tsx +44 -44
  109. package/stories/AUStepComponent.stories.tsx +91 -91
  110. package/stories/AUToolbarComponent.stories.tsx +389 -389
  111. package/stories/AUTruncatorComponent.stories.tsx +123 -123
  112. package/stories/lib/helpers.tsx +146 -146
  113. package/tsconfig.json +46 -46
  114. package/webpack.config.js +88 -88
  115. package/src/lib/tracking.ts +0 -69
@@ -1,64 +1,64 @@
1
- /* eslint-env browser */
2
- import React from 'react';
3
- import PropTypes from 'prop-types';
4
- import DataBoxStackedAssociationComponent from './DataBoxStackedAssociationComponent';
5
- import DataBoxAssociationComponent from './DataBoxAssociationComponent';
6
-
7
- const DataBoxGroupingComponent = (props) => {
8
- const {
9
- stacked,
10
- grouping,
11
- expand,
12
- rememberState,
13
- boxID,
14
- } = props;
15
- let renderAssociations;
16
- if (stacked && grouping.associations.length === 1) {
17
- // eslint-disable-next-line react/destructuring-assignment
18
- renderAssociations = props.grouping.associations.map(
19
- (a) => <DataBoxStackedAssociationComponent key={a.id} assoc={a} />,
20
- );
21
- } else {
22
- // eslint-disable-next-line react/destructuring-assignment
23
- renderAssociations = props.grouping.associations.map((a, i) => {
24
- const open = expand
25
- || grouping.associations.length === 1
26
- || (rememberState && sessionStorage.getItem(`box-${boxID}-group-${grouping.id}-index-${i}`));
27
- return (
28
- <DataBoxAssociationComponent
29
- key={a.id}
30
- open={open}
31
- boxID={boxID}
32
- rememberState={rememberState}
33
- grouping={grouping.id}
34
- index={i}
35
- assoc={a}
36
- />
37
- );
38
- });
39
- }
40
-
41
- return (
42
- <div id={`box-${boxID}-grouping-${grouping.id}`}>
43
- {renderAssociations}
44
- </div>
45
- );
46
- };
47
-
48
- DataBoxGroupingComponent.defaultProps = {
49
-
50
- };
51
-
52
- DataBoxGroupingComponent.propTypes = {
53
- boxID: PropTypes.number.isRequired,
54
- stacked: PropTypes.bool.isRequired,
55
- expand: PropTypes.bool.isRequired,
56
- rememberState: PropTypes.bool.isRequired,
57
- grouping: PropTypes.shape({
58
- id: PropTypes.number.isRequired,
59
- associations: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
60
- }).isRequired,
61
- };
62
-
63
- DataBoxGroupingComponent.displayName = 'DataBoxGroupingComponent';
64
- export default DataBoxGroupingComponent;
1
+ /* eslint-env browser */
2
+ import React from 'react';
3
+ import PropTypes from 'prop-types';
4
+ import DataBoxStackedAssociationComponent from './DataBoxStackedAssociationComponent';
5
+ import DataBoxAssociationComponent from './DataBoxAssociationComponent';
6
+
7
+ const DataBoxGroupingComponent = (props) => {
8
+ const {
9
+ stacked,
10
+ grouping,
11
+ expand,
12
+ rememberState,
13
+ boxID,
14
+ } = props;
15
+ let renderAssociations;
16
+ if (stacked && grouping.associations.length === 1) {
17
+ // eslint-disable-next-line react/destructuring-assignment
18
+ renderAssociations = props.grouping.associations.map(
19
+ (a) => <DataBoxStackedAssociationComponent key={a.id} assoc={a} />,
20
+ );
21
+ } else {
22
+ // eslint-disable-next-line react/destructuring-assignment
23
+ renderAssociations = props.grouping.associations.map((a, i) => {
24
+ const open = expand
25
+ || grouping.associations.length === 1
26
+ || (rememberState && sessionStorage.getItem(`box-${boxID}-group-${grouping.id}-index-${i}`));
27
+ return (
28
+ <DataBoxAssociationComponent
29
+ key={a.id}
30
+ open={open}
31
+ boxID={boxID}
32
+ rememberState={rememberState}
33
+ grouping={grouping.id}
34
+ index={i}
35
+ assoc={a}
36
+ />
37
+ );
38
+ });
39
+ }
40
+
41
+ return (
42
+ <div id={`box-${boxID}-grouping-${grouping.id}`}>
43
+ {renderAssociations}
44
+ </div>
45
+ );
46
+ };
47
+
48
+ DataBoxGroupingComponent.defaultProps = {
49
+
50
+ };
51
+
52
+ DataBoxGroupingComponent.propTypes = {
53
+ boxID: PropTypes.number.isRequired,
54
+ stacked: PropTypes.bool.isRequired,
55
+ expand: PropTypes.bool.isRequired,
56
+ rememberState: PropTypes.bool.isRequired,
57
+ grouping: PropTypes.shape({
58
+ id: PropTypes.number.isRequired,
59
+ associations: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
60
+ }).isRequired,
61
+ };
62
+
63
+ DataBoxGroupingComponent.displayName = 'DataBoxGroupingComponent';
64
+ export default DataBoxGroupingComponent;
@@ -1,36 +1,36 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
- import { sortAlphaObj } from '../../../lib/helpers';
4
-
5
- const DataBoxSearchResultComponent = (props) => {
6
- const { items, searchValue } = props;
7
- const renderItems = items.sort(sortAlphaObj).filter(
8
- (x) => x.name.toLowerCase().indexOf(searchValue.toLowerCase()) > -1,
9
- ).map((item) => (
10
- <li key={item.id}>
11
- <a href={item.url}>
12
- {item.name}
13
- </a>
14
- </li>
15
- ));
16
-
17
- return (
18
- <div>
19
- <ul>
20
- {renderItems}
21
- </ul>
22
- </div>
23
- );
24
- };
25
-
26
- DataBoxSearchResultComponent.propTypes = {
27
- items: PropTypes.arrayOf(PropTypes.shape({
28
- id: PropTypes.number.isRequired,
29
- url: PropTypes.string.isRequired,
30
- name: PropTypes.string.isRequired,
31
- })).isRequired,
32
- searchValue: PropTypes.string.isRequired,
33
- };
34
-
35
- DataBoxSearchResultComponent.displayName = 'DataBoxSearchResultComponent';
36
- export default DataBoxSearchResultComponent;
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { sortAlphaObj } from '../../../lib/helpers';
4
+
5
+ const DataBoxSearchResultComponent = (props) => {
6
+ const { items, searchValue } = props;
7
+ const renderItems = items.sort(sortAlphaObj).filter(
8
+ (x) => x.name.toLowerCase().indexOf(searchValue.toLowerCase()) > -1,
9
+ ).map((item) => (
10
+ <li key={item.id}>
11
+ <a href={item.url}>
12
+ {item.name}
13
+ </a>
14
+ </li>
15
+ ));
16
+
17
+ return (
18
+ <div>
19
+ <ul>
20
+ {renderItems}
21
+ </ul>
22
+ </div>
23
+ );
24
+ };
25
+
26
+ DataBoxSearchResultComponent.propTypes = {
27
+ items: PropTypes.arrayOf(PropTypes.shape({
28
+ id: PropTypes.number.isRequired,
29
+ url: PropTypes.string.isRequired,
30
+ name: PropTypes.string.isRequired,
31
+ })).isRequired,
32
+ searchValue: PropTypes.string.isRequired,
33
+ };
34
+
35
+ DataBoxSearchResultComponent.displayName = 'DataBoxSearchResultComponent';
36
+ export default DataBoxSearchResultComponent;
@@ -1,54 +1,54 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
- import { sortAlphaObj } from '../../../lib/helpers';
4
-
5
- const DataBoxStackedAssociationComponent = (props) => {
6
- const { assoc } = props;
7
- const renderItems = assoc.items.sort(sortAlphaObj).map((item) => {
8
- if (item.children.length > 0) {
9
- const renderChildren = item.children.sort(sortAlphaObj).map((c) => (
10
- <li key={c.id}>
11
- <a href={c.url}>
12
- {c.name}
13
- </a>
14
- </li>
15
- ));
16
-
17
- return (
18
- <li key={item.id}>
19
- <a href={item.url}>
20
- {item.name}
21
- </a>
22
- <ul>
23
- {renderChildren}
24
- </ul>
25
- </li>
26
- );
27
- }
28
-
29
- return (
30
- <li key={item.id}>
31
- <a href={item.url}>
32
- {item.name}
33
- </a>
34
- </li>
35
- );
36
- });
37
-
38
- return (
39
- <div>
40
- <ul>
41
- {renderItems}
42
- </ul>
43
- </div>
44
- );
45
- };
46
-
47
- DataBoxStackedAssociationComponent.propTypes = {
48
- assoc: PropTypes.shape({
49
- items: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
50
- }).isRequired,
51
- };
52
-
53
- DataBoxStackedAssociationComponent.displayName = 'DataBoxStackedAssociationComponent';
54
- export default DataBoxStackedAssociationComponent;
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { sortAlphaObj } from '../../../lib/helpers';
4
+
5
+ const DataBoxStackedAssociationComponent = (props) => {
6
+ const { assoc } = props;
7
+ const renderItems = assoc.items.sort(sortAlphaObj).map((item) => {
8
+ if (item.children.length > 0) {
9
+ const renderChildren = item.children.sort(sortAlphaObj).map((c) => (
10
+ <li key={c.id}>
11
+ <a href={c.url}>
12
+ {c.name}
13
+ </a>
14
+ </li>
15
+ ));
16
+
17
+ return (
18
+ <li key={item.id}>
19
+ <a href={item.url}>
20
+ {item.name}
21
+ </a>
22
+ <ul>
23
+ {renderChildren}
24
+ </ul>
25
+ </li>
26
+ );
27
+ }
28
+
29
+ return (
30
+ <li key={item.id}>
31
+ <a href={item.url}>
32
+ {item.name}
33
+ </a>
34
+ </li>
35
+ );
36
+ });
37
+
38
+ return (
39
+ <div>
40
+ <ul>
41
+ {renderItems}
42
+ </ul>
43
+ </div>
44
+ );
45
+ };
46
+
47
+ DataBoxStackedAssociationComponent.propTypes = {
48
+ assoc: PropTypes.shape({
49
+ items: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
50
+ }).isRequired,
51
+ };
52
+
53
+ DataBoxStackedAssociationComponent.displayName = 'DataBoxStackedAssociationComponent';
54
+ export default DataBoxStackedAssociationComponent;
@@ -1,39 +1,39 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
-
4
- class DataBoxSuggestionComponent extends React.Component {
5
- constructor(props) {
6
- super(props);
7
-
8
- this.state = {
9
- item: props.item,
10
- };
11
- }
12
-
13
- static getDerivedStateFromProps(nextProps, prevState) {
14
- if (nextProps.item.id !== prevState.item.id) {
15
- return {
16
- item: nextProps.item,
17
- };
18
- }
19
-
20
- return null;
21
- }
22
-
23
- render() {
24
- const { item } = this.state;
25
- return (
26
- <span>
27
- {item.name}
28
- </span>
29
- );
30
- }
31
- }
32
-
33
- DataBoxSuggestionComponent.propTypes = {
34
- item: PropTypes.shape({
35
- id: PropTypes.number.isRequired,
36
- }).isRequired,
37
- };
38
- DataBoxSuggestionComponent.displayName = 'DataBoxSuggestionComponent';
39
- export default DataBoxSuggestionComponent;
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+
4
+ class DataBoxSuggestionComponent extends React.Component {
5
+ constructor(props) {
6
+ super(props);
7
+
8
+ this.state = {
9
+ item: props.item,
10
+ };
11
+ }
12
+
13
+ static getDerivedStateFromProps(nextProps, prevState) {
14
+ if (nextProps.item.id !== prevState.item.id) {
15
+ return {
16
+ item: nextProps.item,
17
+ };
18
+ }
19
+
20
+ return null;
21
+ }
22
+
23
+ render() {
24
+ const { item } = this.state;
25
+ return (
26
+ <span>
27
+ {item.name}
28
+ </span>
29
+ );
30
+ }
31
+ }
32
+
33
+ DataBoxSuggestionComponent.propTypes = {
34
+ item: PropTypes.shape({
35
+ id: PropTypes.number.isRequired,
36
+ }).isRequired,
37
+ };
38
+ DataBoxSuggestionComponent.displayName = 'DataBoxSuggestionComponent';
39
+ export default DataBoxSuggestionComponent;