@bexis2/bexis2-core-ui 0.2.10 → 0.2.11

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 (14) hide show
  1. package/README.md +7 -0
  2. package/dist/components/page/ErrorMessage.svelte +9 -0
  3. package/dist/components/page/ErrorMessage.svelte.d.ts +16 -0
  4. package/dist/components/page/Page.svelte +1 -1
  5. package/dist/components/page/Spinner.svelte +4 -4
  6. package/dist/css/themes/theme-bexis2.css +11 -11
  7. package/dist/index.d.ts +2 -1
  8. package/dist/index.js +2 -1
  9. package/package.json +1 -1
  10. package/src/lib/components/page/ErrorMessage.svelte +12 -0
  11. package/src/lib/components/page/Page.svelte +2 -1
  12. package/src/lib/components/page/Spinner.svelte +4 -4
  13. package/src/lib/css/themes/theme-bexis2.css +11 -11
  14. package/src/lib/index.ts +2 -1
package/README.md CHANGED
@@ -1,4 +1,11 @@
1
1
  # bexis-core-ui
2
+ ## v0.2.11
3
+ - Error Message
4
+ - Spinner Update
5
+ - postion default is center
6
+ - Surface color changed
7
+ - Page: contentPageLayoutType
8
+
2
9
  ## v0.2.9
3
10
  - helpStore
4
11
  - helpStoreType
package/dist/components/page/ErrorMessage.svelte ADDED
@@ -0,0 +1,9 @@
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>
package/dist/components/page/ErrorMessage.svelte.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { SvelteComponentTyped } from "svelte";
2
+ declare const __propDef: {
3
+ props: {
4
+ error: Error;
5
+ };
6
+ events: {
7
+ [evt: string]: CustomEvent<any>;
8
+ };
9
+ slots: {};
10
+ };
11
+ export type ErrorMessageProps = typeof __propDef.props;
12
+ export type ErrorMessageEvents = typeof __propDef.events;
13
+ export type ErrorMessageSlots = typeof __propDef.slots;
14
+ export default class ErrorMessage extends SvelteComponentTyped<ErrorMessageProps, ErrorMessageEvents, ErrorMessageSlots> {
15
+ }
16
+ export {};
package/dist/components/page/Page.svelte CHANGED
@@ -1,6 +1,6 @@
1
1
  <script>import { onMount } from "svelte";
2
2
  import { pageContentLayoutType } from "../../models/Enums";
3
- import { AppShell, AppBar } from "@skeletonlabs/skeleton";
3
+ import { AppShell, AppBar, Modal } from "@skeletonlabs/skeleton";
4
4
  import Menu from "./menu/Menu.svelte";
5
5
  import Footer from "./Footer.svelte";
6
6
  import Header from "./Header.svelte";
package/dist/components/page/Spinner.svelte CHANGED
@@ -1,12 +1,12 @@
1
1
  <script>import { positionType } from "../../models/Enums";
2
- export let textCss = "text-secundary-500";
2
+ export let textCss = "text-surface-600";
3
3
  export let label = "";
4
- export let position = positionType.start;
4
+ export let position = positionType.center;
5
5
  </script>
6
6
 
7
- <div class="flex justify-{position} items-{position} h-full w-full gap-5 pt-2">
7
+ <div class="flex justify-{position} items-{position} h-full w-full gap-5 pt-2 {textCss}">
8
8
  <div
9
- class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] {textCss}"
9
+ class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] "
10
10
  role="status"
11
11
  >
12
12
  <span
package/dist/css/themes/theme-bexis2.css CHANGED
@@ -82,16 +82,16 @@
82
82
  --color-error-700: 191 0 0; /* ⬅ #bf0000 */
83
83
  --color-error-800: 153 0 0; /* ⬅ #990000 */
84
84
  --color-error-900: 125 0 0; /* ⬅ #7d0000 */
85
- /* surface | #dddddd */
86
- --color-surface-50: 250 250 250; /* ⬅ #fafafa */
87
- --color-surface-100: 248 248 248; /* ⬅ #f8f8f8 */
88
- --color-surface-200: 247 247 247; /* ⬅ #f7f7f7 */
89
- --color-surface-300: 241 241 241; /* ⬅ #f1f1f1 */
90
- --color-surface-400: 231 231 231; /* ⬅ #e7e7e7 */
91
- --color-surface-500: 221 221 221; /* ⬅ #dddddd */
92
- --color-surface-600: 199 199 199; /* ⬅ #c7c7c7 */
93
- --color-surface-700: 166 166 166; /* ⬅ #a6a6a6 */
94
- --color-surface-800: 133 133 133; /* ⬅ #858585 */
95
- --color-surface-900: 80 80 80; /* ⬅ #6c6c6c */
85
+ /* surface | #c7c7c7 */
86
+ --color-surface-50: 247 247 247; /* ⬅ #f7f7f7 */
87
+ --color-surface-100: 244 244 244; /* ⬅ #f4f4f4 */
88
+ --color-surface-200: 241 241 241; /* ⬅ #f1f1f1 */
89
+ --color-surface-300: 233 233 233; /* ⬅ #e9e9e9 */
90
+ --color-surface-400: 216 216 216; /* ⬅ #d8d8d8 */
91
+ --color-surface-500: 199 199 199; /* ⬅ #c7c7c7 */
92
+ --color-surface-600: 179 179 179; /* ⬅ #b3b3b3 */
93
+ --color-surface-700: 149 149 149; /* ⬅ #959595 */
94
+ --color-surface-800: 119 119 119; /* ⬅ #777777 */
95
+ --color-surface-900: 98 98 98; /* ⬅ #626262 */
96
96
 
97
97
  }
package/dist/index.d.ts CHANGED
@@ -7,6 +7,7 @@ import Spinner from './components/page/Spinner.svelte';
7
7
  import Page from './components/page/Page.svelte';
8
8
  import Alert from './components/page/Alert.svelte';
9
9
  import Menu from './components/page/menu/Menu.svelte';
10
+ import ErrorMessage from './components/page/ErrorMessage.svelte';
10
11
  import Checkbox from './components/form/Checkbox.svelte';
11
12
  import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
12
13
  import CheckboxList from './components/form/CheckboxList.svelte';
@@ -22,7 +23,7 @@ import { columnFilter, searchFilter } from './components/Table/filter';
22
23
  import type { TableConfig, Columns, Column } from './models/Models';
23
24
  export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, MultiSelect, NumberInput, TextArea, TextInput };
24
25
  export { FileInfo, FileIcon, FileUploader };
25
- export { ListView, TableView, Spinner, Page, Alert, Menu };
26
+ export { ListView, TableView, Spinner, Page, Alert, Menu, ErrorMessage };
26
27
  export { Api } from './services/Api.js';
27
28
  export { host, username, password, setApiConfig } from './stores/apiStores.js';
28
29
  export type { userType, inputType, fileUploaderModel, linkType, listItemType, keyValuePairType } from './models/Models.js';
package/dist/index.js CHANGED
@@ -9,6 +9,7 @@ import Spinner from './components/page/Spinner.svelte';
9
9
  import Page from './components/page/Page.svelte';
10
10
  import Alert from './components/page/Alert.svelte';
11
11
  import Menu from './components/page/menu/Menu.svelte';
12
+ import ErrorMessage from './components/page/ErrorMessage.svelte';
12
13
  // input
13
14
  import Checkbox from './components/form/Checkbox.svelte';
14
15
  import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
@@ -28,7 +29,7 @@ export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, MultiS
28
29
  //File
29
30
  export { FileInfo, FileIcon, FileUploader };
30
31
  //others
31
- export { ListView, TableView, Spinner, Page, Alert, Menu };
32
+ export { ListView, TableView, Spinner, Page, Alert, Menu, ErrorMessage };
32
33
  //Api
33
34
  export { Api } from './services/Api.js';
34
35
  export { host, username, password, setApiConfig } from './stores/apiStores.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bexis2/bexis2-core-ui",
3
- "version": "0.2.10",
3
+ "version": "0.2.11",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vite dev",
package/src/lib/components/page/ErrorMessage.svelte ADDED
@@ -0,0 +1,12 @@
1
+ <script lang="ts">
2
+
3
+ export let error:Error;
4
+
5
+ </script>
6
+
7
+ <div class="card bg-error-300 border-solid border-2 border-error-500 shadow-md max-w-md">
8
+ <div class="p-5 space-y-4">
9
+ <h3 class="h3">{error.name}</h3>
10
+ <p>{error.message}</p>
11
+ </div>
12
+ </div>
package/src/lib/components/page/Page.svelte CHANGED
@@ -5,7 +5,7 @@
5
5
  import { pageContentLayoutType } from "$lib/models/Enums";
6
6
 
7
7
  // ui components
8
- import { AppShell, AppBar } from '@skeletonlabs/skeleton';
8
+ import { AppShell, AppBar, Modal } from '@skeletonlabs/skeleton';
9
9
  import Menu from './menu/Menu.svelte'
10
10
  import Footer from './Footer.svelte'
11
11
  import Header from './Header.svelte'
@@ -17,6 +17,7 @@
17
17
  import { storePopup } from '@skeletonlabs/skeleton';
18
18
  import { breadcrumbStore } from '$store/pageStores';
19
19
 
20
+
20
21
  storePopup.set({ computePosition, autoUpdate, offset, shift, flip, arrow });
21
22
 
22
23
 
package/src/lib/components/page/Spinner.svelte CHANGED
@@ -1,15 +1,15 @@
1
1
  <script lang="ts">
2
2
  import { positionType } from "$lib/models/Enums";
3
3
 
4
- export let textCss = "text-secundary-500"
4
+ export let textCss = "text-surface-600"
5
5
  export let label = "";
6
- export let position:positionType = positionType.start;
6
+ export let position:positionType = positionType.center;
7
7
 
8
8
  </script>
9
9
 
10
- <div class="flex justify-{position} items-{position} h-full w-full gap-5 pt-2">
10
+ <div class="flex justify-{position} items-{position} h-full w-full gap-5 pt-2 {textCss}">
11
11
  <div
12
- class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] {textCss}"
12
+ class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] "
13
13
  role="status"
14
14
  >
15
15
  <span
package/src/lib/css/themes/theme-bexis2.css CHANGED
@@ -82,16 +82,16 @@
82
82
  --color-error-700: 191 0 0; /* ⬅ #bf0000 */
83
83
  --color-error-800: 153 0 0; /* ⬅ #990000 */
84
84
  --color-error-900: 125 0 0; /* ⬅ #7d0000 */
85
- /* surface | #dddddd */
86
- --color-surface-50: 250 250 250; /* ⬅ #fafafa */
87
- --color-surface-100: 248 248 248; /* ⬅ #f8f8f8 */
88
- --color-surface-200: 247 247 247; /* ⬅ #f7f7f7 */
89
- --color-surface-300: 241 241 241; /* ⬅ #f1f1f1 */
90
- --color-surface-400: 231 231 231; /* ⬅ #e7e7e7 */
91
- --color-surface-500: 221 221 221; /* ⬅ #dddddd */
92
- --color-surface-600: 199 199 199; /* ⬅ #c7c7c7 */
93
- --color-surface-700: 166 166 166; /* ⬅ #a6a6a6 */
94
- --color-surface-800: 133 133 133; /* ⬅ #858585 */
95
- --color-surface-900: 80 80 80; /* ⬅ #6c6c6c */
85
+ /* surface | #c7c7c7 */
86
+ --color-surface-50: 247 247 247; /* ⬅ #f7f7f7 */
87
+ --color-surface-100: 244 244 244; /* ⬅ #f4f4f4 */
88
+ --color-surface-200: 241 241 241; /* ⬅ #f1f1f1 */
89
+ --color-surface-300: 233 233 233; /* ⬅ #e9e9e9 */
90
+ --color-surface-400: 216 216 216; /* ⬅ #d8d8d8 */
91
+ --color-surface-500: 199 199 199; /* ⬅ #c7c7c7 */
92
+ --color-surface-600: 179 179 179; /* ⬅ #b3b3b3 */
93
+ --color-surface-700: 149 149 149; /* ⬅ #959595 */
94
+ --color-surface-800: 119 119 119; /* ⬅ #777777 */
95
+ --color-surface-900: 98 98 98; /* ⬅ #626262 */
96
96
 
97
97
  }
package/src/lib/index.ts CHANGED
@@ -11,6 +11,7 @@ import Spinner from './components/page/Spinner.svelte';
11
11
  import Page from './components/page/Page.svelte';
12
12
  import Alert from './components/page/Alert.svelte';
13
13
  import Menu from './components/page/menu/Menu.svelte';
14
+ import ErrorMessage from './components/page/ErrorMessage.svelte';
14
15
 
15
16
  // input
16
17
  import Checkbox from './components/form/Checkbox.svelte';
@@ -46,7 +47,7 @@ export {
46
47
  export { FileInfo, FileIcon, FileUploader };
47
48
 
48
49
  //others
49
- export { ListView, TableView, Spinner, Page, Alert, Menu };
50
+ export { ListView, TableView, Spinner, Page, Alert, Menu, ErrorMessage };
50
51
 
51
52
  //Api
52
53
  export { Api } from './services/Api.js';