@bexis2/bexis2-core-ui 0.2.23 → 0.2.25

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 (94) hide show
  1. package/README.md +6 -0
  2. package/dist/TableView.svelte +1 -1
  3. package/dist/components/CodeEditor/CodeEditor.svelte +24 -12
  4. package/dist/components/CodeEditor/CodeEditor.svelte.d.ts +6 -3
  5. package/dist/components/ListView.svelte +5 -5
  6. package/dist/components/Table/Table.svelte +11 -5
  7. package/dist/components/Table/TableFilter.svelte +2 -1
  8. package/dist/components/Table/TablePagination.svelte +6 -1
  9. package/dist/components/Table/TablePagination.svelte.d.ts +1 -0
  10. package/dist/components/file/FileIcon.svelte +45 -45
  11. package/dist/components/file/FileInfo.svelte +13 -13
  12. package/dist/components/file/FileUploader.svelte +3 -1
  13. package/dist/components/form/Checkbox.svelte +13 -13
  14. package/dist/components/form/CheckboxKvPList.svelte +16 -16
  15. package/dist/components/form/CheckboxList.svelte +10 -10
  16. package/dist/components/form/DateInput.svelte +13 -13
  17. package/dist/components/form/DropdownKvP.svelte +54 -54
  18. package/dist/components/form/InputContainer.svelte +1 -1
  19. package/dist/components/form/MultiSelect.svelte +178 -178
  20. package/dist/components/form/NumberInput.svelte +14 -14
  21. package/dist/components/form/TextArea.svelte +13 -13
  22. package/dist/components/form/TextInput.svelte +14 -14
  23. package/dist/components/page/Alert.svelte +28 -28
  24. package/dist/components/page/BackToTop.svelte +30 -30
  25. package/dist/components/page/Docs.svelte +22 -22
  26. package/dist/components/page/ErrorMessage.svelte +8 -8
  27. package/dist/components/page/Footer.svelte +5 -5
  28. package/dist/components/page/Header.svelte +5 -5
  29. package/dist/components/page/HelpPopUp.svelte +30 -30
  30. package/dist/components/page/PageCaller.js +19 -19
  31. package/dist/components/page/Spinner.svelte +14 -14
  32. package/dist/components/page/breadcrumb/Breadcrumb.svelte +19 -19
  33. package/dist/components/page/menu/MenuDataCaller.js +10 -10
  34. package/dist/css/core.ui.postcss +17 -17
  35. package/dist/css/themes/theme-bexis2.css +96 -96
  36. package/dist/css/themes/theme-crimson.css +101 -101
  37. package/dist/css/themes/theme-gold-nouveau.css +140 -140
  38. package/dist/css/themes/theme-hamlindigo.css +112 -112
  39. package/dist/css/themes/theme-modern.css +127 -127
  40. package/dist/css/themes/theme-rocket.css +119 -119
  41. package/dist/css/themes/theme-sahara.css +128 -128
  42. package/dist/css/themes/theme-seafoam.css +122 -122
  43. package/dist/css/themes/theme-seasonal.css +115 -115
  44. package/dist/css/themes/theme-skeleton.css +118 -118
  45. package/dist/css/themes/theme-vintage.css +125 -125
  46. package/dist/services/BaseCaller.js +16 -16
  47. package/package.json +3 -2
  48. package/src/lib/TableView.svelte +1 -1
  49. package/src/lib/components/CodeEditor/CodeEditor.svelte +25 -13
  50. package/src/lib/components/ListView.svelte +11 -11
  51. package/src/lib/components/Table/Table.svelte +11 -5
  52. package/src/lib/components/Table/TableFilter.svelte +2 -1
  53. package/src/lib/components/Table/TablePagination.svelte +6 -1
  54. package/src/lib/components/Table/filter.ts +141 -141
  55. package/src/lib/components/{File → file}/FileIcon.svelte +45 -45
  56. package/src/lib/components/{File → file}/FileInfo.svelte +13 -13
  57. package/src/lib/components/{File → file}/FileUploader.svelte +6 -1
  58. package/src/lib/components/form/Checkbox.svelte +24 -24
  59. package/src/lib/components/form/CheckboxKvPList.svelte +29 -29
  60. package/src/lib/components/form/CheckboxList.svelte +21 -21
  61. package/src/lib/components/form/DateInput.svelte +25 -25
  62. package/src/lib/components/form/DropdownKvP.svelte +54 -54
  63. package/src/lib/components/form/InputContainer.svelte +1 -1
  64. package/src/lib/components/form/MultiSelect.svelte +178 -178
  65. package/src/lib/components/form/NumberInput.svelte +28 -28
  66. package/src/lib/components/form/TextArea.svelte +26 -26
  67. package/src/lib/components/form/TextInput.svelte +26 -26
  68. package/src/lib/components/page/Alert.svelte +41 -41
  69. package/src/lib/components/page/BackToTop.svelte +30 -30
  70. package/src/lib/components/page/Docs.svelte +46 -46
  71. package/src/lib/components/page/ErrorMessage.svelte +10 -10
  72. package/src/lib/components/page/Footer.svelte +18 -18
  73. package/src/lib/components/page/Header.svelte +18 -18
  74. package/src/lib/components/page/HelpPopUp.svelte +72 -72
  75. package/src/lib/components/page/PageCaller.js +19 -19
  76. package/src/lib/components/page/Spinner.svelte +20 -20
  77. package/src/lib/components/page/breadcrumb/Breadcrumb.svelte +39 -39
  78. package/src/lib/components/page/menu/MenuDataCaller.js +10 -10
  79. package/src/lib/css/core.ui.postcss +17 -17
  80. package/src/lib/css/themes/theme-bexis2.css +96 -96
  81. package/src/lib/css/themes/theme-crimson.css +101 -101
  82. package/src/lib/css/themes/theme-gold-nouveau.css +140 -140
  83. package/src/lib/css/themes/theme-hamlindigo.css +112 -112
  84. package/src/lib/css/themes/theme-modern.css +127 -127
  85. package/src/lib/css/themes/theme-rocket.css +119 -119
  86. package/src/lib/css/themes/theme-sahara.css +128 -128
  87. package/src/lib/css/themes/theme-seafoam.css +122 -122
  88. package/src/lib/css/themes/theme-seasonal.css +115 -115
  89. package/src/lib/css/themes/theme-skeleton.css +118 -118
  90. package/src/lib/css/themes/theme-vintage.css +125 -125
  91. package/src/lib/models/Page.ts +40 -40
  92. package/src/lib/services/Api.ts +55 -55
  93. package/src/lib/services/BaseCaller.js +16 -16
  94. package/src/lib/stores/apiStores.ts +31 -31
@@ -1,178 +1,178 @@
1
- <script>
2
- import InputContainer from './InputContainer.svelte';
3
-
4
- import Select from 'svelte-select';
5
- import { onMount } from 'svelte';
6
-
7
- export let source;
8
- export let target;
9
- export let id;
10
- export let title;
11
- export let itemId = 'value';
12
- export let itemLabel = 'label';
13
- export let itemGroup = 'group';
14
- export let isMulti = true;
15
- export let complexSource = false;
16
- export let complexTarget = false;
17
- export let required = false;
18
- export let feedback = [''];
19
- export let placeholder = '-- Please select --';
20
- export let invalid = false;
21
- export let loading = false;
22
- export let help = false;
23
- export let clearable = true;
24
-
25
- let isLoaded = false;
26
-
27
- $: value = null;
28
- $: updateTarget(value);
29
- $: target, setValue(target);
30
-
31
- let groupBy;
32
- $: groupBy;
33
-
34
- function updateTarget(selection) {
35
- console.log("UPDATE target",selection);
36
- //different cases
37
- //a) source is complex model is simple return array
38
- if (complexSource && !complexTarget && isLoaded && isMulti) {
39
- //console.log('a) source is complex model is simple');
40
-
41
- target = [];
42
- for (let i in selection) {
43
- let item = selection[i];
44
- target.push(item[itemId]);
45
- }
46
- }
47
-
48
- if (!complexSource && !complexTarget && isLoaded && isMulti) {
49
- target = [];
50
-
51
- for (let i in selection) {
52
- target.push(selection[i].value);
53
- }
54
- }
55
-
56
- if (complexSource && complexTarget && isLoaded && isMulti) {
57
- //console.log("both complex",selection);
58
- target = selection;
59
- }
60
-
61
- if (complexSource && complexTarget && isLoaded && !isMulti) {
62
- target = selection;
63
- }
64
-
65
- if (!complexSource && !complexTarget && isLoaded && !isMulti) {
66
- target = selection.value;
67
- }
68
-
69
- if (complexSource && !complexTarget && isLoaded && !isMulti) {
70
- target = selection[itemLabel];
71
- console.log('selection', selection);
72
- }
73
-
74
- //console.log('selection ' + title, selection);
75
- //console.log('target ' + title, target);
76
- }
77
-
78
- onMount(async () => {
79
- console.log("OnMount", target)
80
- if(complexSource && complexTarget) // after on mount a setValue is needed when data is complex
81
- {
82
- setValue(target);
83
- }
84
- });
85
-
86
- function setValue(t) {
87
- console.log("Set Value",t);
88
- //a) source is complex model is simple
89
- if (complexSource && !complexTarget && isMulti) {
90
- let items = [];
91
- // event.detail will be null unless isMulti is true and user has removed a single item
92
- for (let i in t) {
93
- let t = target[i];
94
- items.push(source.find((item) => item[itemId] === t));
95
- }
96
-
97
- isLoaded = true;
98
- if (items.length > 0) {
99
- value = items;
100
- }
101
- ////console.log(value);
102
- groupBy = (item) => item[itemGroup];
103
- }
104
-
105
- if (complexSource && complexTarget && isMulti) {
106
- value = t;
107
- isLoaded = true;
108
- groupBy = (item) => item[itemGroup];
109
- }
110
-
111
- //b) simple liust and simple model
112
- if (!complexSource && !complexTarget && isMulti) {
113
- console.log('b) simple liust and simple model');
114
- //console.log('source', source);
115
- //console.log("target",t);
116
- isLoaded = true;
117
- //set target only if its nit empty
118
- if (t != null && t !== undefined && t != '') {
119
- //console.log('target', t);
120
- value = t;
121
- }
122
- }
123
-
124
- if (!isMulti) {
125
- //console.log("onmount",complexSource,complexTarget,value,target)
126
- if (!complexSource && !complexTarget) {
127
- value = {
128
- value: t,
129
- label: t
130
- };
131
- }
132
-
133
- if (complexSource && complexTarget) {
134
- value = t;
135
- groupBy = (item) => item[itemGroup];
136
- }
137
-
138
- if (complexSource && !complexTarget) {
139
- //value = target
140
- console.log(
141
- 'this case is currently not supported (complexSource,complexTarget,isMulti)',
142
- complexSource,
143
- complexTarget,
144
- isMulti
145
- );
146
- }
147
-
148
- isLoaded = true;
149
- }
150
-
151
- console.log(t,value)
152
- }
153
- </script>
154
-
155
- <InputContainer {id} label={title} {feedback} {required} {help}>
156
- <Select
157
- {id}
158
- items={source}
159
- {groupBy}
160
- {itemId}
161
- label={itemLabel}
162
- multiple={isMulti}
163
- bind:value
164
- {placeholder}
165
- hasError={invalid}
166
- {loading}
167
- {clearable}
168
- on:change
169
- on:input
170
- on:focus
171
- on:blur
172
- on:clear
173
- on:loaded
174
- on:error
175
- on:filter
176
- on:hoverItem
177
- />
178
- </InputContainer>
1
+ <script>
2
+ import InputContainer from './InputContainer.svelte';
3
+
4
+ import Select from 'svelte-select';
5
+ import { onMount } from 'svelte';
6
+
7
+ export let source;
8
+ export let target;
9
+ export let id;
10
+ export let title;
11
+ export let itemId = 'value';
12
+ export let itemLabel = 'label';
13
+ export let itemGroup = 'group';
14
+ export let isMulti = true;
15
+ export let complexSource = false;
16
+ export let complexTarget = false;
17
+ export let required = false;
18
+ export let feedback = [''];
19
+ export let placeholder = '-- Please select --';
20
+ export let invalid = false;
21
+ export let loading = false;
22
+ export let help = false;
23
+ export let clearable = true;
24
+
25
+ let isLoaded = false;
26
+
27
+ $: value = null;
28
+ $: updateTarget(value);
29
+ $: target, setValue(target);
30
+
31
+ let groupBy;
32
+ $: groupBy;
33
+
34
+ function updateTarget(selection) {
35
+ //console.log("UPDATE target",selection);
36
+ //different cases
37
+ //a) source is complex model is simple return array
38
+ if (complexSource && !complexTarget && isLoaded && isMulti) {
39
+ //console.log('a) source is complex model is simple');
40
+
41
+ target = [];
42
+ for (let i in selection) {
43
+ let item = selection[i];
44
+ target.push(item[itemId]);
45
+ }
46
+ }
47
+
48
+ if (!complexSource && !complexTarget && isLoaded && isMulti) {
49
+ target = [];
50
+
51
+ for (let i in selection) {
52
+ target.push(selection[i].value);
53
+ }
54
+ }
55
+
56
+ if (complexSource && complexTarget && isLoaded && isMulti) {
57
+ //console.log("both complex",selection);
58
+ target = selection;
59
+ }
60
+
61
+ if (complexSource && complexTarget && isLoaded && !isMulti) {
62
+ target = selection;
63
+ }
64
+
65
+ if (!complexSource && !complexTarget && isLoaded && !isMulti) {
66
+ target = selection.value;
67
+ }
68
+
69
+ if (complexSource && !complexTarget && isLoaded && !isMulti) {
70
+ target = selection[itemLabel];
71
+ //console.log('selection', selection);
72
+ }
73
+
74
+ //console.log('selection ' + title, selection);
75
+ //console.log('target ' + title, target);
76
+ }
77
+
78
+ onMount(async () => {
79
+ //console.log("OnMount", target)
80
+ if(complexSource && complexTarget) // after on mount a setValue is needed when data is complex
81
+ {
82
+ setValue(target);
83
+ }
84
+ });
85
+
86
+ function setValue(t) {
87
+ //console.log("Set Value",t);
88
+ //a) source is complex model is simple
89
+ if (complexSource && !complexTarget && isMulti) {
90
+ let items = [];
91
+ // event.detail will be null unless isMulti is true and user has removed a single item
92
+ for (let i in t) {
93
+ let t = target[i];
94
+ items.push(source.find((item) => item[itemId] === t));
95
+ }
96
+
97
+ isLoaded = true;
98
+ if (items.length > 0) {
99
+ value = items;
100
+ }
101
+ ////console.log(value);
102
+ groupBy = (item) => item[itemGroup];
103
+ }
104
+
105
+ if (complexSource && complexTarget && isMulti) {
106
+ value = t;
107
+ isLoaded = true;
108
+ groupBy = (item) => item[itemGroup];
109
+ }
110
+
111
+ //b) simple liust and simple model
112
+ if (!complexSource && !complexTarget && isMulti) {
113
+ //console.log('b) simple liust and simple model');
114
+ //console.log('source', source);
115
+ //console.log("target",t);
116
+ isLoaded = true;
117
+ //set target only if its nit empty
118
+ if (t != null && t !== undefined && t != '') {
119
+ //console.log('target', t);
120
+ value = t;
121
+ }
122
+ }
123
+
124
+ if (!isMulti) {
125
+ //console.log("onmount",complexSource,complexTarget,value,target)
126
+ if (!complexSource && !complexTarget) {
127
+ value = {
128
+ value: t,
129
+ label: t
130
+ };
131
+ }
132
+
133
+ if (complexSource && complexTarget) {
134
+ value = t;
135
+ groupBy = (item) => item[itemGroup];
136
+ }
137
+
138
+ if (complexSource && !complexTarget) {
139
+ //value = target
140
+ console.log(
141
+ 'this case is currently not supported (complexSource,complexTarget,isMulti)',
142
+ complexSource,
143
+ complexTarget,
144
+ isMulti
145
+ );
146
+ }
147
+
148
+ isLoaded = true;
149
+ }
150
+
151
+ //console.log(t,value)
152
+ }
153
+ </script>
154
+
155
+ <InputContainer {id} label={title} {feedback} {required} {help}>
156
+ <Select
157
+ {id}
158
+ items={source}
159
+ {groupBy}
160
+ {itemId}
161
+ label={itemLabel}
162
+ multiple={isMulti}
163
+ bind:value
164
+ {placeholder}
165
+ hasError={invalid}
166
+ {loading}
167
+ {clearable}
168
+ on:change
169
+ on:input
170
+ on:focus
171
+ on:blur
172
+ on:clear
173
+ on:loaded
174
+ on:error
175
+ on:filter
176
+ on:hoverItem
177
+ />
178
+ </InputContainer>
@@ -9,17 +9,17 @@ export let required = false;
9
9
  export let feedback = [""];
10
10
  export let placeholder = "";
11
11
  export let help = false;
12
- </script>
13
-
14
- <InputContainer {id} {label} {feedback} {required} {help}>
15
- <input
16
- {id}
17
- class="input variant-form-material"
18
- type="number"
19
- class:input-success={valid}
20
- class:input-error={invalid}
21
- bind:value
22
- on:input
23
- {placeholder}
24
- />
25
- </InputContainer>
12
+ </script>
13
+
14
+ <InputContainer {id} {label} {feedback} {required} {help}>
15
+ <input
16
+ {id}
17
+ class="input variant-form-material"
18
+ type="number"
19
+ class:input-success={valid}
20
+ class:input-error={invalid}
21
+ bind:value
22
+ on:input
23
+ {placeholder}
24
+ />
25
+ </InputContainer>
@@ -8,16 +8,16 @@ export let required = false;
8
8
  export let feedback = [""];
9
9
  export let placeholder = "";
10
10
  export let help = false;
11
- </script>
12
-
13
- <InputContainer {id} {label} {feedback} {required} {help}>
14
- <textarea
15
- {id}
16
- class="textarea variant-form-material"
17
- class:input-success={valid}
18
- class:input-error={invalid}
19
- bind:value
20
- on:input
21
- {placeholder}
22
- />
23
- </InputContainer>
11
+ </script>
12
+
13
+ <InputContainer {id} {label} {feedback} {required} {help}>
14
+ <textarea
15
+ {id}
16
+ class="textarea variant-form-material"
17
+ class:input-success={valid}
18
+ class:input-error={invalid}
19
+ bind:value
20
+ on:input
21
+ {placeholder}
22
+ />
23
+ </InputContainer>
@@ -8,17 +8,17 @@ export let required = false;
8
8
  export let feedback = [""];
9
9
  export let placeholder = "";
10
10
  export let help = false;
11
- </script>
12
-
13
- <InputContainer {id} {label} {feedback} {required} {help}>
14
- <input
15
- {id}
16
- class="input variant-form-material"
17
- type="text"
18
- class:input-success={valid}
19
- class:input-error={invalid}
20
- bind:value
21
- on:input
22
- {placeholder}
23
- />
24
- </InputContainer>
11
+ </script>
12
+
13
+ <InputContainer {id} {label} {feedback} {required} {help}>
14
+ <input
15
+ {id}
16
+ class="input variant-form-material"
17
+ type="text"
18
+ class:input-success={valid}
19
+ class:input-error={invalid}
20
+ bind:value
21
+ on:input
22
+ {placeholder}
23
+ />
24
+ </InputContainer>
@@ -7,31 +7,31 @@ export let cssClass = "";
7
7
  export let deleteBtn = true;
8
8
  $:
9
9
  show = true;
10
- </script>
11
-
12
- {#if show}
13
- <aside class="alert {cssClass}" transition:fade|local={{ duration: 100 }}>
14
- <!-- Icon -->
15
- <!-- <div>(icon)</div> -->
16
- <!-- Message -->
17
- <div class="alert-message">
18
- {#if title}
19
- <h3 class="h3">{title}</h3>
20
- {/if}
21
- <p>
22
- {message}
23
- <slot />
24
- </p>
25
- </div>
26
- <!-- Actions -->
27
- <div class="alert-actions">
28
- <slot name="actions" />
29
-
30
- {#if deleteBtn}
31
- <button class="btn hover:text-primary-100" on:click={() => (show = false)}>
32
- <Fa icon={faXmark} />
33
- </button>
34
- {/if}
35
- </div>
36
- </aside>
37
- {/if}
10
+ </script>
11
+
12
+ {#if show}
13
+ <aside class="alert {cssClass}" transition:fade|local={{ duration: 100 }}>
14
+ <!-- Icon -->
15
+ <!-- <div>(icon)</div> -->
16
+ <!-- Message -->
17
+ <div class="alert-message">
18
+ {#if title}
19
+ <h3 class="h3">{title}</h3>
20
+ {/if}
21
+ <p>
22
+ {message}
23
+ <slot />
24
+ </p>
25
+ </div>
26
+ <!-- Actions -->
27
+ <div class="alert-actions">
28
+ <slot name="actions" />
29
+
30
+ {#if deleteBtn}
31
+ <button class="btn hover:text-primary-100" on:click={() => (show = false)}>
32
+ <Fa icon={faXmark} />
33
+ </button>
34
+ {/if}
35
+ </div>
36
+ </aside>
37
+ {/if}
@@ -1,30 +1,30 @@
1
- <script>
2
- export let showOnPx = 150;
3
- let hidden = true;
4
-
5
- function goTop() {
6
- document.body.scrollIntoView();
7
- }
8
-
9
- function scrollContainer() {
10
- return document.documentElement || document.body;
11
- }
12
-
13
- function handleOnScroll() {
14
- if (!scrollContainer()) {
15
- return;
16
- }
17
-
18
- if (scrollContainer().scrollTop > showOnPx) {
19
- hidden = false;
20
- } else {
21
- hidden = true;
22
- }
23
- }
24
- </script>
25
-
26
- <svelte:window on:scroll={handleOnScroll} />
27
-
28
- <div class="w-full items-center">
29
- <button class="btn ring back-to-top" on:click={goTop} class:hidden>Back to top</button>
30
- </div>
1
+ <script>
2
+ export let showOnPx = 150;
3
+ let hidden = true;
4
+
5
+ function goTop() {
6
+ document.body.scrollIntoView();
7
+ }
8
+
9
+ function scrollContainer() {
10
+ return document.documentElement || document.body;
11
+ }
12
+
13
+ function handleOnScroll() {
14
+ if (!scrollContainer()) {
15
+ return;
16
+ }
17
+
18
+ if (scrollContainer().scrollTop > showOnPx) {
19
+ hidden = false;
20
+ } else {
21
+ hidden = true;
22
+ }
23
+ }
24
+ </script>
25
+
26
+ <svelte:window on:scroll={handleOnScroll} />
27
+
28
+ <div class="w-full items-center">
29
+ <button class="btn ring back-to-top" on:click={goTop} class:hidden>Back to top</button>
30
+ </div>
@@ -12,25 +12,25 @@ const noteSettings = {
12
12
  target: "noteTarget",
13
13
  placement: "bottom"
14
14
  };
15
- </script>
16
-
17
- <div class="text-right p-2">
18
- {#if note}
19
- <span class="chip variant-soft hover:variant-filled" use:popup={noteSettings}>
20
- <span><Fa icon={faQuestion} /></span>
21
- </span>
22
-
23
- <div
24
- class="card p-4 variant-filled-primary w-60 z-50 text-left shadow-md"
25
- data-popup="noteTarget"
26
- >
27
- {note}
28
- </div>
29
- {/if}
30
-
31
- {#each links as link}
32
- <span class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)}>
33
- <span>{link.label}</span>
34
- </span>
35
- {/each}
36
- </div>
15
+ </script>
16
+
17
+ <div class="text-right p-2">
18
+ {#if note}
19
+ <span class="chip variant-soft hover:variant-filled" use:popup={noteSettings}>
20
+ <span><Fa icon={faQuestion} /></span>
21
+ </span>
22
+
23
+ <div
24
+ class="card p-4 variant-filled-primary w-60 z-50 text-left shadow-md"
25
+ data-popup="noteTarget"
26
+ >
27
+ {note}
28
+ </div>
29
+ {/if}
30
+
31
+ {#each links as link}
32
+ <span class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)}>
33
+ <span>{link.label}</span>
34
+ </span>
35
+ {/each}
36
+ </div>
@@ -1,9 +1,9 @@
1
1
  <script>export let error;
2
- </script>
3
-
4
- <div class="card bg-error-300 border-solid border-2 border-error-500 shadow-md max-w-md">
5
- <div class="p-5 space-y-4">
6
- <h3 class="h3">{error.name}</h3>
7
- <p>{error.message}</p>
8
- </div>
9
- </div>
2
+ </script>
3
+
4
+ <div class="card bg-error-300 border-solid border-2 border-error-500 shadow-md max-w-md">
5
+ <div class="p-5 space-y-4">
6
+ <h3 class="h3">{error.name}</h3>
7
+ <p>{error.message}</p>
8
+ </div>
9
+ </div>
@@ -8,8 +8,8 @@ onMount(async () => {
8
8
  content = await getFooter();
9
9
  console.log(content);
10
10
  });
11
- </script>
12
-
13
- {#if content != undefined}
14
- {@html content}
15
- {/if}
11
+ </script>
12
+
13
+ {#if content != undefined}
14
+ {@html content}
15
+ {/if}
@@ -8,8 +8,8 @@ onMount(async () => {
8
8
  content = await getHeader();
9
9
  console.log(content);
10
10
  });
11
- </script>
12
-
13
- {#if content != undefined}
14
- {@html content}
15
- {/if}
11
+ </script>
12
+
13
+ {#if content != undefined}
14
+ {@html content}
15
+ {/if}