@bexis2/bexis2-core-ui 0.4.89 → 0.4.90

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 (15) hide show
  1. package/README.md +5 -0
  2. package/dist/components/form/Dropdown.svelte.d.ts +2 -2
  3. package/dist/components/form/DropdownKvP.svelte.d.ts +2 -2
  4. package/dist/components/form/InputContainer.svelte +14 -2
  5. package/dist/components/form/InputContainer.svelte.d.ts +4 -0
  6. package/dist/components/form/MultiSelect.svelte +1 -1
  7. package/dist/components/form/MultiSelect.svelte.d.ts +10 -6
  8. package/dist/components/page/menu/Menu.svelte +3 -2
  9. package/dist/index.d.ts +2 -1
  10. package/dist/index.js +2 -1
  11. package/package.json +1 -1
  12. package/src/lib/components/form/InputContainer.svelte +19 -2
  13. package/src/lib/components/form/MultiSelect.svelte +1 -1
  14. package/src/lib/components/page/menu/Menu.svelte +3 -2
  15. package/src/lib/index.ts +3 -0
package/README.md CHANGED
@@ -1,5 +1,10 @@
1
1
  # bexis-core-ui
2
2
 
3
+ ## 0.4.90
4
+ - Input
5
+ - Add DataPickerInput based on Svelty Picker
6
+ - reorder font size in menu (less layout shift with old header)
7
+ - trigger description event on mouse over / out
3
8
 
4
9
  ## 0.4.87
5
10
  - Input
package/dist/components/form/Dropdown.svelte.d.ts CHANGED
@@ -7,12 +7,12 @@ export default class Dropdown extends SvelteComponent<{
7
7
  title: any;
8
8
  source: any;
9
9
  description?: string | undefined;
10
+ showDescription?: boolean | undefined;
10
11
  invalid?: boolean | undefined;
11
12
  feedback?: string[] | undefined;
12
13
  required?: boolean | undefined;
13
14
  help?: boolean | undefined;
14
15
  valid?: boolean | undefined;
15
- showDescription?: boolean | undefined;
16
16
  }, {
17
17
  change: Event;
18
18
  select: Event;
@@ -31,12 +31,12 @@ declare const __propDef: {
31
31
  title: any;
32
32
  source: any;
33
33
  description?: string | undefined;
34
+ showDescription?: boolean | undefined;
34
35
  invalid?: boolean | undefined;
35
36
  feedback?: string[] | undefined;
36
37
  required?: boolean | undefined;
37
38
  help?: boolean | undefined;
38
39
  valid?: boolean | undefined;
39
- showDescription?: boolean | undefined;
40
40
  };
41
41
  events: {
42
42
  change: Event;
package/dist/components/form/DropdownKvP.svelte.d.ts CHANGED
@@ -7,13 +7,13 @@ export default class DropdownKvP extends SvelteComponent<{
7
7
  title: any;
8
8
  source: any;
9
9
  description?: string | undefined;
10
+ showDescription?: boolean | undefined;
10
11
  invalid?: boolean | undefined;
11
12
  feedback?: string[] | undefined;
12
13
  required?: boolean | undefined;
13
14
  help?: boolean | undefined;
14
15
  valid?: boolean | undefined;
15
16
  complexTarget?: boolean | undefined;
16
- showDescription?: boolean | undefined;
17
17
  }, {
18
18
  change: Event;
19
19
  select: Event;
@@ -32,13 +32,13 @@ declare const __propDef: {
32
32
  title: any;
33
33
  source: any;
34
34
  description?: string | undefined;
35
+ showDescription?: boolean | undefined;
35
36
  invalid?: boolean | undefined;
36
37
  feedback?: string[] | undefined;
37
38
  required?: boolean | undefined;
38
39
  help?: boolean | undefined;
39
40
  valid?: boolean | undefined;
40
41
  complexTarget?: boolean | undefined;
41
- showDescription?: boolean | undefined;
42
42
  };
43
43
  events: {
44
44
  change: Event;
package/dist/components/form/InputContainer.svelte CHANGED
@@ -1,4 +1,5 @@
1
- <script>import { helpStore } from "../../stores/pageStores";
1
+ <script>import { createEventDispatcher } from "svelte";
2
+ import { helpStore } from "../../stores/pageStores";
2
3
  import Fa from "svelte-fa";
3
4
  import { faQuestion } from "@fortawesome/free-solid-svg-icons";
4
5
  export let id = "";
@@ -8,12 +9,23 @@ export let feedback;
8
9
  export let help = false;
9
10
  export let description = "";
10
11
  export let showDescription = false;
12
+ export let showIcon = true;
13
+ const dispatch = createEventDispatcher();
11
14
  function onMouseOver() {
12
15
  if (help) {
13
16
  helpStore.show(id);
14
17
  }
18
+ if (description.length > 0) {
19
+ dispatch("showDescription", { id, description });
20
+ }
15
21
  }
16
22
  function onMouseOut() {
23
+ if (help) {
24
+ helpStore.hide(id);
25
+ }
26
+ if (description.length > 0) {
27
+ dispatch("hideDescription", { id });
28
+ }
17
29
  }
18
30
  </script>
19
31
 
@@ -30,7 +42,7 @@ function onMouseOut() {
30
42
  >{label}
31
43
  {#if required} <span class="text-xs text-red-600">*</span> {/if}
32
44
  </span>
33
- {#if description}
45
+ {#if description && showIcon}
34
46
  <button class="badge " on:click={()=>showDescription = !showDescription}><Fa icon={faQuestion} /></button>
35
47
  {/if}
36
48
  </label>
package/dist/components/form/InputContainer.svelte.d.ts CHANGED
@@ -8,8 +8,12 @@ declare const __propDef: {
8
8
  help?: boolean;
9
9
  description?: string;
10
10
  showDescription?: boolean;
11
+ showIcon?: boolean;
11
12
  };
12
13
  events: {
14
+ showDescription: CustomEvent<any>;
15
+ hideDescription: CustomEvent<any>;
16
+ } & {
13
17
  [evt: string]: CustomEvent<any>;
14
18
  };
15
19
  slots: {
package/dist/components/form/MultiSelect.svelte CHANGED
@@ -309,7 +309,7 @@
309
309
 
310
310
  </script>
311
311
 
312
- <InputContainer {id} label={title} {feedback} {required} {help} {description} {showDescription}>
312
+ <InputContainer {id} label={title} {feedback} {required} {help} {description} {showDescription} on:showDescription on:hideDescription>
313
313
  <Select
314
314
  {id}
315
315
  items={source}
package/dist/components/form/MultiSelect.svelte.d.ts CHANGED
@@ -7,23 +7,25 @@ export default class MultiSelect extends SvelteComponent<{
7
7
  title: any;
8
8
  source: any;
9
9
  description?: string | undefined;
10
+ showDescription?: boolean | undefined;
10
11
  invalid?: boolean | undefined;
11
12
  feedback?: string[] | undefined;
12
13
  required?: boolean | undefined;
13
14
  help?: boolean | undefined;
15
+ disabled?: boolean | undefined;
16
+ placeholder?: string | undefined;
14
17
  complexTarget?: boolean | undefined;
15
- showDescription?: boolean | undefined;
16
18
  itemId?: string | undefined;
17
19
  itemLabel?: string | undefined;
18
20
  itemGroup?: string | undefined;
19
21
  isMulti?: boolean | undefined;
20
22
  complexSource?: boolean | undefined;
21
- placeholder?: string | undefined;
22
23
  loading?: boolean | undefined;
23
24
  clearable?: boolean | undefined;
24
- disabled?: boolean | undefined;
25
25
  searchable?: boolean | undefined;
26
26
  }, {
27
+ showDescription: CustomEvent<any>;
28
+ hideDescription: CustomEvent<any>;
27
29
  change: CustomEvent<any>;
28
30
  input: CustomEvent<any>;
29
31
  focus: CustomEvent<any>;
@@ -48,24 +50,26 @@ declare const __propDef: {
48
50
  title: any;
49
51
  source: any;
50
52
  description?: string | undefined;
53
+ showDescription?: boolean | undefined;
51
54
  invalid?: boolean | undefined;
52
55
  feedback?: string[] | undefined;
53
56
  required?: boolean | undefined;
54
57
  help?: boolean | undefined;
58
+ disabled?: boolean | undefined;
59
+ placeholder?: string | undefined;
55
60
  complexTarget?: boolean | undefined;
56
- showDescription?: boolean | undefined;
57
61
  itemId?: string | undefined;
58
62
  itemLabel?: string | undefined;
59
63
  itemGroup?: string | undefined;
60
64
  isMulti?: boolean | undefined;
61
65
  complexSource?: boolean | undefined;
62
- placeholder?: string | undefined;
63
66
  loading?: boolean | undefined;
64
67
  clearable?: boolean | undefined;
65
- disabled?: boolean | undefined;
66
68
  searchable?: boolean | undefined;
67
69
  };
68
70
  events: {
71
+ showDescription: CustomEvent<any>;
72
+ hideDescription: CustomEvent<any>;
69
73
  change: CustomEvent<any>;
70
74
  input: CustomEvent<any>;
71
75
  focus: CustomEvent<any>;
package/dist/components/page/menu/Menu.svelte CHANGED
@@ -74,8 +74,7 @@ if (import.meta.env.DEV) {
74
74
  <Accordion>
75
75
  <div class="sm:flex w-full justify-between">
76
76
  <!-- <div class="sm:flex items-center sm:gap-5 px-1 text-lg justify-start gap-2 py-0"> -->
77
- <MenuBar menuBar={$menuStore.MenuBar} />
78
- <MenuBar menuBar={$menuStore.Extended} />
77
+
79
78
  <!-- </div> -->
80
79
  <!-- <div class="sm:flex items-center sm:gap-5 px-1 text-lg justify-end gap-2"> -->
81
80
  <div class="grid w-full sm:flex gap-2 justify-auto sm:justify-end">
@@ -146,6 +145,8 @@ if (import.meta.env.DEV) {
146
145
  {/if}
147
146
  {/if}
148
147
  </button>
148
+ <MenuBar menuBar={$menuStore.MenuBar} />
149
+ <MenuBar menuBar={$menuStore.Extended} />
149
150
  <SettingsBar menuBar={$menuStore.Settings} />
150
151
  <!-- </div> -->
151
152
 
package/dist/index.d.ts CHANGED
@@ -10,6 +10,7 @@ import Checkbox from './components/form/Checkbox.svelte';
10
10
  import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
11
11
  import CheckboxList from './components/form/CheckboxList.svelte';
12
12
  import DateInput from './components/form/DateInput.svelte';
13
+ import DatePickerInput from './components/form/DatePickerInput.svelte';
13
14
  import DropdownKVP from './components/form/DropdownKvP.svelte';
14
15
  import Dropdown from './components/form/Dropdown.svelte';
15
16
  import MultiSelect from './components/form/MultiSelect.svelte';
@@ -26,7 +27,7 @@ import CodeEditor from './components/CodeEditor/CodeEditor.svelte';
26
27
  import Notification from './components/page/Notification.svelte';
27
28
  import TablePlaceholder from './components/page/TablePlaceholder.svelte';
28
29
  import { bexis2theme } from './themes/theme-bexis2';
29
- export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, Dropdown, MultiSelect, NumberInput, TextArea, TextInput };
30
+ export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DatePickerInput, DropdownKVP, Dropdown, MultiSelect, NumberInput, TextArea, TextInput };
30
31
  export { FileInfo, FileIcon, FileUploader };
31
32
  export { Spinner, Page, Alert, Menu, ErrorMessage };
32
33
  export { Api } from './services/Api.js';
package/dist/index.js CHANGED
@@ -15,6 +15,7 @@ import Checkbox from './components/form/Checkbox.svelte';
15
15
  import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
16
16
  import CheckboxList from './components/form/CheckboxList.svelte';
17
17
  import DateInput from './components/form/DateInput.svelte';
18
+ import DatePickerInput from './components/form/DatePickerInput.svelte';
18
19
  import DropdownKVP from './components/form/DropdownKvP.svelte';
19
20
  import Dropdown from './components/form/Dropdown.svelte';
20
21
  import MultiSelect from './components/form/MultiSelect.svelte';
@@ -36,7 +37,7 @@ import TablePlaceholder from './components/page/TablePlaceholder.svelte';
36
37
  // theme
37
38
  import { bexis2theme } from './themes/theme-bexis2';
38
39
  //Form
39
- export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, Dropdown, MultiSelect, NumberInput, TextArea, TextInput };
40
+ export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DatePickerInput, DropdownKVP, Dropdown, MultiSelect, NumberInput, TextArea, TextInput };
40
41
  //File
41
42
  export { FileInfo, FileIcon, FileUploader };
42
43
  //others
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bexis2/bexis2-core-ui",
3
- "version": "0.4.89",
3
+ "version": "0.4.90",
4
4
  "private": false,
5
5
  "description": "Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).",
6
6
  "keywords": [
package/src/lib/components/form/InputContainer.svelte CHANGED
@@ -1,4 +1,5 @@
1
1
  <script lang="ts">
2
+ import { createEventDispatcher } from 'svelte';
2
3
  import { helpStore } from '$store/pageStores';
3
4
  import Fa from 'svelte-fa';
4
5
  import { faQuestion } from '@fortawesome/free-solid-svg-icons';
@@ -10,14 +11,30 @@
10
11
  export let help: boolean = false;
11
12
  export let description : string = '';
12
13
  export let showDescription: boolean = false;
14
+ export let showIcon: boolean = true;
15
+
16
+ const dispatch = createEventDispatcher();
13
17
 
14
18
  function onMouseOver() {
15
19
  if (help) {
16
20
  helpStore.show(id);
17
21
  }
22
+ if (description.length > 0) {
23
+ // dispatch an event to show the description
24
+ dispatch('showDescription', { id, description });
25
+ }
26
+
18
27
  }
19
28
 
20
- function onMouseOut() {}
29
+ function onMouseOut() {
30
+ if (help) {
31
+ helpStore.hide(id);
32
+ }
33
+ if (description.length > 0) {
34
+ // dispatch an event to hide the description
35
+ dispatch('hideDescription', { id });
36
+ }
37
+ }
21
38
  </script>
22
39
 
23
40
  <div
@@ -33,7 +50,7 @@
33
50
  >{label}
34
51
  {#if required} <span class="text-xs text-red-600">*</span> {/if}
35
52
  </span>
36
- {#if description}
53
+ {#if description && showIcon}
37
54
  <button class="badge " on:click={()=>showDescription = !showDescription}><Fa icon={faQuestion} /></button>
38
55
  {/if}
39
56
  </label>
package/src/lib/components/form/MultiSelect.svelte CHANGED
@@ -309,7 +309,7 @@
309
309
 
310
310
  </script>
311
311
 
312
- <InputContainer {id} label={title} {feedback} {required} {help} {description} {showDescription}>
312
+ <InputContainer {id} label={title} {feedback} {required} {help} {description} {showDescription} on:showDescription on:hideDescription>
313
313
  <Select
314
314
  {id}
315
315
  items={source}
package/src/lib/components/page/menu/Menu.svelte CHANGED
@@ -90,8 +90,7 @@
90
90
  <Accordion>
91
91
  <div class="sm:flex w-full justify-between">
92
92
  <!-- <div class="sm:flex items-center sm:gap-5 px-1 text-lg justify-start gap-2 py-0"> -->
93
- <MenuBar menuBar={$menuStore.MenuBar} />
94
- <MenuBar menuBar={$menuStore.Extended} />
93
+
95
94
  <!-- </div> -->
96
95
  <!-- <div class="sm:flex items-center sm:gap-5 px-1 text-lg justify-end gap-2"> -->
97
96
  <div class="grid w-full sm:flex gap-2 justify-auto sm:justify-end">
@@ -162,6 +161,8 @@
162
161
  {/if}
163
162
  {/if}
164
163
  </button>
164
+ <MenuBar menuBar={$menuStore.MenuBar} />
165
+ <MenuBar menuBar={$menuStore.Extended} />
165
166
  <SettingsBar menuBar={$menuStore.Settings} />
166
167
  <!-- </div> -->
167
168
 
package/src/lib/index.ts CHANGED
@@ -18,6 +18,7 @@ import Checkbox from './components/form/Checkbox.svelte';
18
18
  import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
19
19
  import CheckboxList from './components/form/CheckboxList.svelte';
20
20
  import DateInput from './components/form/DateInput.svelte';
21
+ import DatePickerInput from './components/form/DatePickerInput.svelte';
21
22
  import DropdownKVP from './components/form/DropdownKvP.svelte';
22
23
  import Dropdown from './components/form/Dropdown.svelte';
23
24
  import MultiSelect from './components/form/MultiSelect.svelte';
@@ -25,6 +26,7 @@ import NumberInput from './components/form/NumberInput.svelte';
25
26
  import TextInput from './components/form/TextInput.svelte';
26
27
  import TextArea from './components/form/TextArea.svelte';
27
28
 
29
+
28
30
  //table
29
31
  import Table from './components/Table/Table.svelte';
30
32
  import TableFilter from './components/Table/TableFilter.svelte';
@@ -53,6 +55,7 @@ export {
53
55
  CheckboxKVPList,
54
56
  CheckboxList,
55
57
  DateInput,
58
+ DatePickerInput,
56
59
  DropdownKVP,
57
60
  Dropdown,
58
61
  MultiSelect,