@humandialog/forms.svelte 0.4.44 → 0.5.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.
- package/components/Fab.svelte +60 -48
- package/components/Floating_container.svelte +5 -4
- package/components/Floating_container.svelte.d.ts +2 -2
- package/components/Grid.menu.svelte +13 -9
- package/components/Grid.menu.svelte.d.ts +2 -2
- package/components/button.svelte +4 -4
- package/components/checkbox.svelte +12 -10
- package/components/checkbox.svelte.d.ts +1 -0
- package/components/combo/combo.d.ts +1 -1
- package/components/combo/combo.js +1 -1
- package/components/combo/combo.source.svelte +2 -2
- package/components/combo/combo.source.svelte.d.ts +1 -1
- package/components/combo/combo.svelte +94 -62
- package/components/combo/combo.svelte.d.ts +7 -4
- package/components/contextmenu.svelte +20 -19
- package/components/contextmenu.svelte.d.ts +5 -5
- package/components/date.svelte +165 -25
- package/components/date.svelte.d.ts +3 -2
- package/components/delayed.spinner.svelte +2 -2
- package/components/document/internal/palette.row.svelte +3 -3
- package/components/document/internal/palette.svelte +2 -2
- package/components/document/internal/palette.svelte.d.ts +1 -1
- package/components/document/rich.edit.svelte +307 -35
- package/components/document/rich.edit.svelte.d.ts +9 -0
- package/components/edit.field.svelte +17 -15
- package/components/edit.field.svelte.d.ts +2 -1
- package/components/file.loader.svelte +6 -6
- package/components/file.loader.svelte.d.ts +10 -10
- package/components/icon.svelte +2 -2
- package/components/icon.svelte.d.ts +3 -3
- package/components/input.text.svelte +3 -3
- package/components/inputbox.ltop.svelte +19 -17
- package/components/inputbox.ltop.svelte.d.ts +4 -2
- package/components/kanban/Kanban.d.ts +23 -0
- package/components/kanban/Kanban.js +23 -0
- package/components/kanban/internal/kanban.card.svelte +158 -0
- package/components/kanban/internal/kanban.card.svelte.d.ts +35 -0
- package/components/kanban/internal/kanban.column.svelte +181 -0
- package/components/kanban/internal/kanban.column.svelte.d.ts +51 -0
- package/components/kanban/internal/kanban.inserter.svelte +24 -0
- package/components/kanban/internal/kanban.inserter.svelte.d.ts +18 -0
- package/components/kanban/internal/kanban.move.menu.svelte +146 -0
- package/components/kanban/internal/kanban.move.menu.svelte.d.ts +19 -0
- package/components/kanban/kanban.callbacks.svelte +15 -0
- package/components/kanban/kanban.callbacks.svelte.d.ts +21 -0
- package/components/kanban/kanban.column.svelte +20 -0
- package/components/kanban/kanban.column.svelte.d.ts +21 -0
- package/components/kanban/kanban.summary.svelte +5 -0
- package/components/kanban/kanban.summary.svelte.d.ts +16 -0
- package/components/kanban/kanban.svelte +156 -0
- package/components/kanban/kanban.svelte.d.ts +43 -0
- package/components/kanban/kanban.title.svelte +8 -0
- package/components/kanban/kanban.title.svelte.d.ts +17 -0
- package/components/list/List.d.ts +4 -2
- package/components/list/List.js +4 -2
- package/components/list/internal/list.element.props.svelte +134 -0
- package/components/list/internal/list.element.props.svelte.d.ts +21 -0
- package/components/list/internal/list.element.summary.svelte +40 -0
- package/components/list/internal/list.element.summary.svelte.d.ts +24 -0
- package/components/list/internal/list.element.svelte +100 -173
- package/components/list/internal/list.element.svelte.d.ts +4 -4
- package/components/list/internal/list.inserter.svelte +9 -6
- package/components/list/internal/list.inserter.svelte.d.ts +1 -1
- package/components/list/list.combo.svelte +2 -2
- package/components/list/list.combo.svelte.d.ts +1 -1
- package/components/list/list.date.svelte +3 -3
- package/components/list/list.date.svelte.d.ts +1 -1
- package/components/list/list.inserter.svelte +1 -1
- package/components/list/list.summary.svelte +2 -2
- package/components/list/list.summary.svelte.d.ts +1 -1
- package/components/list/list.svelte +175 -37
- package/components/list/list.svelte.d.ts +27 -10
- package/components/list/list.title.svelte +6 -2
- package/components/list/list.title.svelte.d.ts +3 -1
- package/components/menu.d.ts +4 -4
- package/components/menu.js +15 -13
- package/components/radio.svelte +12 -10
- package/components/radio.svelte.d.ts +1 -0
- package/components/sidebar/sidebar.group.svelte +1 -13
- package/components/sidebar/sidebar.group.svelte.d.ts +0 -4
- package/components/sidebar/sidebar.item.svelte +13 -13
- package/components/sidebar/sidebar.list.svelte +68 -0
- package/components/sidebar/sidebar.list.svelte.d.ts +33 -0
- package/components/sidebar/sidebar.svelte +1 -1
- package/components/simple.table.svelte +15 -15
- package/components/simple.table.svelte.d.ts +2 -2
- package/components/table/_template.table.svelte +17 -17
- package/components/table/_template.table.svelte.d.ts +2 -2
- package/components/table/table.svelte +31 -31
- package/components/table/table.svelte.d.ts +8 -8
- package/components/textarea.ltop.svelte +4 -4
- package/components/tile.title.svelte +6 -6
- package/desk.svelte +13 -13
- package/form.box.svelte +2 -2
- package/horizontal.toolbar.svelte +25 -16
- package/horizontal.toolbar.svelte.d.ts +2 -2
- package/index.d.ts +14 -5
- package/index.js +14 -5
- package/modal.svelte +17 -17
- package/modal.svelte.d.ts +4 -4
- package/operations.svelte +42 -27
- package/package.json +14 -1
- package/page.svelte +115 -124
- package/page.svelte.d.ts +4 -4
- package/stores.d.ts +9 -7
- package/stores.js +17 -9
- package/tenant.members.svelte +44 -44
- package/tenant.members.svelte.d.ts +10 -10
- package/tile.svelte +3 -3
- package/tiles.vertical.row.svelte +1 -1
- package/updates.d.ts +3 -3
- package/updates.js +35 -3
- package/utils.d.ts +22 -13
- package/utils.js +201 -51
- package/vertical.toolbar.svelte +22 -13
- package/vertical.toolbar.svelte.d.ts +2 -2
package/desk.svelte
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
tools_visible_store,
|
|
10
10
|
bottom_bar_visible_store,
|
|
11
11
|
auto_hide_sidebar,
|
|
12
|
-
|
|
12
|
+
hasSelectedItem,
|
|
13
13
|
dark_mode_store,
|
|
14
14
|
data_tick_store,
|
|
15
15
|
set_default_tools_visible,
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
sidebar_left_pos } from './stores.js'
|
|
18
18
|
|
|
19
19
|
import { AuthorizedView} from '@humandialog/auth.svelte'
|
|
20
|
-
import {
|
|
20
|
+
import { handleSelect, isDeviceSmallerThan } from './utils'
|
|
21
21
|
import { afterUpdate, onMount } from 'svelte';
|
|
22
22
|
|
|
23
23
|
export let layout;
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
const media_break_2xl = 1536; //px
|
|
54
54
|
let test = "ala\n ma\n\tkota"
|
|
55
55
|
|
|
56
|
-
$: is_small =
|
|
56
|
+
$: is_small = isDeviceSmallerThan("sm")
|
|
57
57
|
|
|
58
58
|
let main_side_panel_visibility = "hidden"
|
|
59
59
|
let lg_content_area_horizontal_dim = ""
|
|
@@ -107,7 +107,7 @@
|
|
|
107
107
|
bottom_bar_visible = $bottom_bar_visible_store
|
|
108
108
|
let dts = $data_tick_store;
|
|
109
109
|
|
|
110
|
-
if(!
|
|
110
|
+
if(!hasSelectedItem())
|
|
111
111
|
bottom_bar_visible = false;
|
|
112
112
|
|
|
113
113
|
if(tools_visible)
|
|
@@ -158,16 +158,16 @@
|
|
|
158
158
|
<AuthorizedView>
|
|
159
159
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
|
160
160
|
<div id="__hd_svelte_layout_root" class="{$dark_mode_store}"
|
|
161
|
-
on:click={
|
|
162
|
-
on:contextmenu={
|
|
161
|
+
on:click={handleSelect}
|
|
162
|
+
on:contextmenu={handleSelect}>
|
|
163
163
|
|
|
164
|
-
<div class="bg-white dark:bg-
|
|
164
|
+
<div class="bg-white dark:bg-stone-900 dark:text-white min-h-screen h-screen">
|
|
165
165
|
<!--###########################################################-->
|
|
166
166
|
<!--## HORIZONTAL TOOLBAR (FOR PHONES) ######################-->
|
|
167
167
|
<!--###########################################################-->
|
|
168
|
-
<header class="fixed sm:hidden w-screen top-0 h-[50px] sm:h-[40px] z-20 overflow-auto shadow shadow-
|
|
169
|
-
<div class=" flex flex-row justify-between h-full bg-
|
|
170
|
-
<HorizontalToolbar
|
|
168
|
+
<header class="fixed sm:hidden w-screen top-0 h-[50px] sm:h-[40px] z-20 overflow-auto shadow shadow-stone-900/5 dark:shadow-none" >
|
|
169
|
+
<div class=" flex flex-row justify-between h-full bg-stone-950 text-stone-100 ">
|
|
170
|
+
<HorizontalToolbar appConfig={layout}/>
|
|
171
171
|
<div>
|
|
172
172
|
</header>
|
|
173
173
|
|
|
@@ -177,8 +177,8 @@
|
|
|
177
177
|
<!--## VERTICAL TOOLBAR ##################-->
|
|
178
178
|
<!--#######################################################-->
|
|
179
179
|
<div class="hidden sm:block fixed left-0 top-0 w-[50px] sm:w-[40px] h-screen z-20 inset-0 overflow-hidden">
|
|
180
|
-
<div class="sticky top-0 flex h-full w-10 bg-
|
|
181
|
-
<VerticalToolbar
|
|
180
|
+
<div class="sticky top-0 flex h-full w-10 bg-stone-800 dark:bg-stone-950 flex-col items-center text-stone-100 shadow">
|
|
181
|
+
<VerticalToolbar appConfig={layout}/>
|
|
182
182
|
</div>
|
|
183
183
|
</div>
|
|
184
184
|
|
|
@@ -198,7 +198,7 @@
|
|
|
198
198
|
{sidebar_small_width} sm:w-[320px]
|
|
199
199
|
z-20 overflow-x-hidden">
|
|
200
200
|
|
|
201
|
-
<div class=" bg-
|
|
201
|
+
<div class=" bg-stone-50 w-full h-full dark:bg-stone-800 overflow-y-auto py-0 px-0">
|
|
202
202
|
<Configurable config={layout.sidebar[visible_sidebar]}>
|
|
203
203
|
<div slot='alt'></div>
|
|
204
204
|
</Configurable>
|
package/form.box.svelte
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script>
|
|
2
2
|
import { writable } from 'svelte/store';
|
|
3
|
-
import {data_tick_store,
|
|
3
|
+
import {data_tick_store, contextItemsStore} from './stores.js'
|
|
4
4
|
import { setContext } from 'svelte';
|
|
5
5
|
|
|
6
6
|
export let context = ""
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
{
|
|
15
15
|
setContext('ctx', context)
|
|
16
16
|
if(self != null)
|
|
17
|
-
|
|
17
|
+
contextItemsStore[context] = self
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
let in_tile_flex_behaviour = fit ? "flex-1" : "flex-none"
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
import FaBars from 'svelte-icons/fa/FaBars.svelte'
|
|
11
11
|
import FaToggleOn from 'svelte-icons/fa/FaToggleOn.svelte'
|
|
12
12
|
import FaToggleOff from 'svelte-icons/fa/FaToggleOff.svelte'
|
|
13
|
-
import {
|
|
13
|
+
import {showMenu} from './components/menu'
|
|
14
14
|
import {push} from 'svelte-spa-router'
|
|
15
15
|
//import Menu from './components/contextmenu.svelte'
|
|
16
16
|
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
import VerticalToolbar from './vertical.toolbar.svelte'
|
|
38
38
|
|
|
39
39
|
|
|
40
|
-
export let
|
|
40
|
+
export let appConfig;
|
|
41
41
|
|
|
42
42
|
let config = null;
|
|
43
43
|
let has_selection_details = false;
|
|
@@ -52,19 +52,19 @@
|
|
|
52
52
|
|
|
53
53
|
$:
|
|
54
54
|
{
|
|
55
|
-
config =
|
|
56
|
-
has_selection_details =
|
|
55
|
+
config = appConfig.mainToolbar;
|
|
56
|
+
has_selection_details = appConfig.selectionDetails;
|
|
57
57
|
is_logged_in = $session.is_active;
|
|
58
58
|
show_sign_in_out_icons = config.signin ? true : false;
|
|
59
59
|
sign_in_href = $signin_href;
|
|
60
60
|
sign_out_href = $signout_href;
|
|
61
61
|
|
|
62
|
-
tabs = Object.keys(
|
|
62
|
+
tabs = Object.keys(appConfig.sidebar);
|
|
63
63
|
if(tabs.length > 1)
|
|
64
64
|
icon = FaBars;
|
|
65
65
|
else
|
|
66
66
|
{
|
|
67
|
-
let first_tab =
|
|
67
|
+
let first_tab = appConfig.sidebar[tabs[0]];
|
|
68
68
|
icon = first_tab.icon;
|
|
69
69
|
}
|
|
70
70
|
}
|
|
@@ -96,7 +96,7 @@
|
|
|
96
96
|
if(sidebar == "*")
|
|
97
97
|
{
|
|
98
98
|
if((!previously_visible_sidebar) || previously_visible_sidebar === '*')
|
|
99
|
-
sidebar = Object.keys(
|
|
99
|
+
sidebar = Object.keys(appConfig.sidebar)[0];
|
|
100
100
|
else
|
|
101
101
|
sidebar = previously_visible_sidebar;
|
|
102
102
|
}
|
|
@@ -191,26 +191,26 @@
|
|
|
191
191
|
}
|
|
192
192
|
|
|
193
193
|
let pt = new DOMPoint(rect.left, rect.bottom)
|
|
194
|
-
|
|
194
|
+
showMenu(pt, options);
|
|
195
195
|
}
|
|
196
196
|
|
|
197
197
|
</script>
|
|
198
198
|
|
|
199
|
-
<div class="flex flex-row w-full">
|
|
199
|
+
<div class="print flex flex-row w-full">
|
|
200
200
|
<div class="flex-none left-0 flex h-12 sm:h-10">
|
|
201
|
-
<button class="w-12 sm:w-10 h-full flex justify-center items-center text-
|
|
201
|
+
<button class="w-12 sm:w-10 h-full flex justify-center items-center text-stone-300 hover:text-stone-100" on:click={toggle_navigator}>
|
|
202
202
|
<Icon class="w-8 sm:w-6 h-8 sm:h-6" component={icon}/>
|
|
203
203
|
</button>
|
|
204
204
|
</div>
|
|
205
205
|
|
|
206
206
|
<div class="grow">
|
|
207
207
|
|
|
208
|
-
<div class="block sm:hidden mt-3 uppercase text-sm text-center">{@html title}</div>
|
|
208
|
+
<div class="block sm:hidden mt-4 sm:mt-3 uppercase text-sm text-center">{@html title}</div>
|
|
209
209
|
</div>
|
|
210
210
|
|
|
211
211
|
<div class="flex-none ml-auto flex h-12 sm:h-10">
|
|
212
212
|
<button
|
|
213
|
-
class="h-full w-12 sm:w-10 px-0 flex justify-center items-center text-
|
|
213
|
+
class="h-full w-12 sm:w-10 px-0 flex justify-center items-center text-stone-300 hover:text-stone-100"
|
|
214
214
|
on:click={show_options}>
|
|
215
215
|
|
|
216
216
|
<Icon class="w-5 sm:w-4 h-5 sm:h-4" component={FaCog} />
|
|
@@ -220,11 +220,20 @@
|
|
|
220
220
|
</div>
|
|
221
221
|
|
|
222
222
|
{#if tabs.length > 1 && $main_sidebar_visible_store != "*"}
|
|
223
|
-
<div class="flex-none block fixed left-0 top-[40px] w-[40px] h-screen z-20 inset-0 overflow-hidden">
|
|
224
|
-
<div class="sticky top-0 flex h-full w-10 bg-
|
|
225
|
-
<VerticalToolbar {
|
|
223
|
+
<div class="print flex-none block fixed left-0 top-[40px] w-[40px] h-screen z-20 inset-0 overflow-hidden">
|
|
224
|
+
<div class="sticky top-0 flex h-full w-10 bg-stone-900 flex-col items-center text-stone-100 shadow">
|
|
225
|
+
<VerticalToolbar {appConfig} mobile={true}/>
|
|
226
226
|
</div>
|
|
227
227
|
</div>
|
|
228
228
|
{/if}
|
|
229
229
|
|
|
230
|
-
<!--Menu bind:this={menu}/-->
|
|
230
|
+
<!--Menu bind:this={menu}/-->
|
|
231
|
+
|
|
232
|
+
<style>
|
|
233
|
+
@media print
|
|
234
|
+
{
|
|
235
|
+
.no-print, .no-print *{
|
|
236
|
+
display: none !important;
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
</style>
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
/** @typedef {typeof __propDef.events} HorizontalEvents */
|
|
3
3
|
/** @typedef {typeof __propDef.slots} HorizontalSlots */
|
|
4
4
|
export default class Horizontal extends SvelteComponentTyped<{
|
|
5
|
-
|
|
5
|
+
appConfig: any;
|
|
6
6
|
}, {
|
|
7
7
|
[evt: string]: CustomEvent<any>;
|
|
8
8
|
}, {}> {
|
|
@@ -13,7 +13,7 @@ export type HorizontalSlots = typeof __propDef.slots;
|
|
|
13
13
|
import { SvelteComponentTyped } from "svelte";
|
|
14
14
|
declare const __propDef: {
|
|
15
15
|
props: {
|
|
16
|
-
|
|
16
|
+
appConfig: any;
|
|
17
17
|
};
|
|
18
18
|
events: {
|
|
19
19
|
[evt: string]: CustomEvent<any>;
|
package/index.d.ts
CHANGED
|
@@ -22,12 +22,13 @@ export { default as ComboSource } from './components/combo/combo.source.svelte';
|
|
|
22
22
|
export { default as ComboItem } from './components/combo/combo.item.svelte';
|
|
23
23
|
export { default as RichEdit } from './components/document/rich.edit.svelte';
|
|
24
24
|
export { default as Spinner } from './components/delayed.spinner.svelte';
|
|
25
|
-
export {
|
|
25
|
+
export { showMenu, showGridMenu, showFloatingToolbar } from './components/menu';
|
|
26
26
|
export { default as Fab } from './components/Fab.svelte';
|
|
27
27
|
export { default as Sidebar } from './components/sidebar/sidebar.svelte';
|
|
28
28
|
export { default as SidebarBrand } from './components/sidebar/sidebar.brand.svelte';
|
|
29
29
|
export { default as SidebarGroup } from './components/sidebar/sidebar.group.svelte';
|
|
30
30
|
export { default as SidebarItem } from './components/sidebar/sidebar.item.svelte';
|
|
31
|
+
export { default as SidebarList } from './components/sidebar/sidebar.list.svelte';
|
|
31
32
|
export { default as List } from './components/list/list.svelte';
|
|
32
33
|
export { default as ListTitle } from './components/list/list.title.svelte';
|
|
33
34
|
export { default as ListSummary } from './components/list/list.summary.svelte';
|
|
@@ -37,7 +38,15 @@ export { default as ListComboProperty } from './components/list/list.combo.svelt
|
|
|
37
38
|
export { default as ListStaticProperty } from './components/list/list.static.svelte';
|
|
38
39
|
export { default as Modal } from './modal.svelte';
|
|
39
40
|
export { default as MembersPage } from './tenant.members.svelte';
|
|
40
|
-
export {
|
|
41
|
-
export {
|
|
42
|
-
export {
|
|
43
|
-
export {
|
|
41
|
+
export { default as Kanban } from './components/kanban/kanban.svelte';
|
|
42
|
+
export { default as KanbanColumn } from './components/kanban/kanban.column.svelte';
|
|
43
|
+
export { default as KanbanTitle } from './components/kanban/kanban.title.svelte';
|
|
44
|
+
export { default as KanbanSummary } from './components/kanban/kanban.summary.svelte';
|
|
45
|
+
export { default as KanbanCallckacks } from './components/kanban/kanban.callbacks.svelte';
|
|
46
|
+
export { KanbanColumnTop, KanbanColumnBottom } from './components/kanban/Kanban';
|
|
47
|
+
export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, editable, startEditing, selectable, handleSelect } from './utils';
|
|
48
|
+
export { mainViewReloader, reloadMainView } from './stores.js';
|
|
49
|
+
export { data_tick_store, // tmp
|
|
50
|
+
hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
|
|
51
|
+
export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores';
|
|
52
|
+
export { informModification, informItem, pushChanges } from './updates';
|
package/index.js
CHANGED
|
@@ -28,12 +28,13 @@ export { default as ComboItem } from './components/combo/combo.item.svelte';
|
|
|
28
28
|
export { default as RichEdit } from './components/document/rich.edit.svelte';
|
|
29
29
|
export { default as Spinner } from './components/delayed.spinner.svelte';
|
|
30
30
|
//export { default as Menu } from './components/contextmenu.svelte'
|
|
31
|
-
export {
|
|
31
|
+
export { showMenu, showGridMenu, showFloatingToolbar } from './components/menu';
|
|
32
32
|
export { default as Fab } from './components/Fab.svelte';
|
|
33
33
|
export { default as Sidebar } from './components/sidebar/sidebar.svelte';
|
|
34
34
|
export { default as SidebarBrand } from './components/sidebar/sidebar.brand.svelte';
|
|
35
35
|
export { default as SidebarGroup } from './components/sidebar/sidebar.group.svelte';
|
|
36
36
|
export { default as SidebarItem } from './components/sidebar/sidebar.item.svelte';
|
|
37
|
+
export { default as SidebarList } from './components/sidebar/sidebar.list.svelte';
|
|
37
38
|
export { default as List } from './components/list/list.svelte';
|
|
38
39
|
export { default as ListTitle } from './components/list/list.title.svelte';
|
|
39
40
|
export { default as ListSummary } from './components/list/list.summary.svelte';
|
|
@@ -43,7 +44,15 @@ export { default as ListComboProperty } from './components/list/list.combo.svelt
|
|
|
43
44
|
export { default as ListStaticProperty } from './components/list/list.static.svelte';
|
|
44
45
|
export { default as Modal } from './modal.svelte';
|
|
45
46
|
export { default as MembersPage } from './tenant.members.svelte';
|
|
46
|
-
export {
|
|
47
|
-
export {
|
|
48
|
-
export {
|
|
49
|
-
export {
|
|
47
|
+
export { default as Kanban } from './components/kanban/kanban.svelte';
|
|
48
|
+
export { default as KanbanColumn } from './components/kanban/kanban.column.svelte';
|
|
49
|
+
export { default as KanbanTitle } from './components/kanban/kanban.title.svelte';
|
|
50
|
+
export { default as KanbanSummary } from './components/kanban/kanban.summary.svelte';
|
|
51
|
+
export { default as KanbanCallckacks } from './components/kanban/kanban.callbacks.svelte';
|
|
52
|
+
export { KanbanColumnTop, KanbanColumnBottom } from './components/kanban/Kanban';
|
|
53
|
+
export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, editable, startEditing, selectable, handleSelect } from './utils';
|
|
54
|
+
export { mainViewReloader, reloadMainView } from './stores.js';
|
|
55
|
+
export { data_tick_store, // tmp
|
|
56
|
+
hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
|
|
57
|
+
export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores'; // tmp
|
|
58
|
+
export { informModification, informItem, pushChanges } from './updates'; // tmp
|
package/modal.svelte
CHANGED
|
@@ -8,10 +8,10 @@ export const OK = 0;
|
|
|
8
8
|
export const OKCancel = 1;
|
|
9
9
|
export const Custom = 2;
|
|
10
10
|
export let mode = OKCancel;
|
|
11
|
-
export let
|
|
12
|
-
export let
|
|
13
|
-
export let
|
|
14
|
-
export let
|
|
11
|
+
export let okCaption = "OK";
|
|
12
|
+
export let cancelCaption = "Cancel";
|
|
13
|
+
export let onOkCallback = void 0;
|
|
14
|
+
export let onCancelCallback = void 0;
|
|
15
15
|
export function show(on_close_callback = void 0) {
|
|
16
16
|
open = true;
|
|
17
17
|
close_callback = on_close_callback;
|
|
@@ -30,15 +30,15 @@ afterUpdate(
|
|
|
30
30
|
);
|
|
31
31
|
let close_callback = void 0;
|
|
32
32
|
function on_ok(event) {
|
|
33
|
-
if (
|
|
34
|
-
|
|
33
|
+
if (onOkCallback)
|
|
34
|
+
onOkCallback();
|
|
35
35
|
if (close_callback)
|
|
36
36
|
close_callback("OK");
|
|
37
37
|
}
|
|
38
38
|
function on_cancel(event) {
|
|
39
39
|
open = false;
|
|
40
|
-
if (
|
|
41
|
-
|
|
40
|
+
if (onCancelCallback)
|
|
41
|
+
onCancelCallback();
|
|
42
42
|
if (close_callback)
|
|
43
43
|
close_callback("Cancel");
|
|
44
44
|
}
|
|
@@ -56,7 +56,7 @@ function on_cancel(event) {
|
|
|
56
56
|
From: "opacity-100"
|
|
57
57
|
To: "opacity-0"
|
|
58
58
|
-->
|
|
59
|
-
<div class="fixed w-screen h-screen inset-0 bg-
|
|
59
|
+
<div class="fixed w-screen h-screen inset-0 bg-stone-500 bg-opacity-75 transition-opacity"></div>
|
|
60
60
|
|
|
61
61
|
<div class="fixed z-20 inset-0 w-screen overflow-y-auto">
|
|
62
62
|
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
|
|
@@ -76,14 +76,14 @@ function on_cancel(event) {
|
|
|
76
76
|
<div class="sm:flex sm:items-start">
|
|
77
77
|
<div class="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
|
78
78
|
{#if icon}
|
|
79
|
-
<Icon component={icon} size={6} class="text-
|
|
79
|
+
<Icon component={icon} size={6} class="text-stone-700"/>
|
|
80
80
|
{/if}
|
|
81
81
|
</div>
|
|
82
82
|
<div class="grow mt-3 text-center sm:ml-4 sm:mt-0 sm:text-left">
|
|
83
|
-
<h3 class="text-base font-semibold leading-6 text-
|
|
83
|
+
<h3 class="text-base font-semibold leading-6 text-stone-900" id="modal-title">{title}</h3>
|
|
84
84
|
<div class="mt-2">
|
|
85
85
|
{#if content}
|
|
86
|
-
<p class="text-sm text-
|
|
86
|
+
<p class="text-sm text-stone-500">{content}</p>
|
|
87
87
|
{:else}
|
|
88
88
|
<slot/>
|
|
89
89
|
{/if}
|
|
@@ -91,18 +91,18 @@ function on_cancel(event) {
|
|
|
91
91
|
</div>
|
|
92
92
|
</div>
|
|
93
93
|
</div>
|
|
94
|
-
<div class="bg-
|
|
94
|
+
<div class="bg-stone-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
|
|
95
95
|
{#if mode == OK}
|
|
96
96
|
<button type="button" class="inline-flex w-full justify-center rounded-md bg-blue-700 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-800 sm:ml-3 sm:w-auto"
|
|
97
97
|
on:click={on_ok}>
|
|
98
|
-
{
|
|
98
|
+
{okCaption}</button>
|
|
99
99
|
{:else if mode == OKCancel}
|
|
100
100
|
<button type="button" class="inline-flex w-full justify-center rounded-md bg-blue-700 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-800 sm:ml-3 sm:w-auto"
|
|
101
101
|
on:click={on_ok}>
|
|
102
|
-
{
|
|
103
|
-
<button type="button" class="mt-3 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-
|
|
102
|
+
{okCaption}</button>
|
|
103
|
+
<button type="button" class="mt-3 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-stone-900 shadow-sm ring-1 ring-inset ring-stone-300 hover:bg-stone-50 sm:mt-0 sm:w-auto"
|
|
104
104
|
on:click={on_cancel}>
|
|
105
|
-
{
|
|
105
|
+
{cancelCaption}</button>
|
|
106
106
|
{:else if mode == Custom}
|
|
107
107
|
<slot name="footer"/>
|
|
108
108
|
{/if}
|
package/modal.svelte.d.ts
CHANGED
|
@@ -9,10 +9,10 @@ declare const __propDef: {
|
|
|
9
9
|
OKCancel?: 1 | undefined;
|
|
10
10
|
Custom?: 2 | undefined;
|
|
11
11
|
mode?: number | undefined;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
okCaption?: string | undefined;
|
|
13
|
+
cancelCaption?: string | undefined;
|
|
14
|
+
onOkCallback?: Function | undefined;
|
|
15
|
+
onCancelCallback?: Function | undefined;
|
|
16
16
|
show?: ((on_close_callback?: Function | undefined) => void) | undefined;
|
|
17
17
|
};
|
|
18
18
|
events: {
|
package/operations.svelte
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
<script>import {
|
|
2
|
-
import {
|
|
1
|
+
<script>import { showFloatingToolbar, showMenu, showGridMenu } from "./components/menu.js";
|
|
2
|
+
import { contextToolbarOperations, pageToolbarOperations, contextItemsStore } from "./stores.js";
|
|
3
3
|
export let mobile = false;
|
|
4
4
|
$:
|
|
5
|
-
update($
|
|
5
|
+
update($pageToolbarOperations, $contextToolbarOperations);
|
|
6
6
|
let operations = [];
|
|
7
7
|
function update(...args) {
|
|
8
|
-
if ($
|
|
9
|
-
operations = $
|
|
8
|
+
if ($contextToolbarOperations && $contextToolbarOperations.length > 0)
|
|
9
|
+
operations = $contextToolbarOperations;
|
|
10
10
|
else
|
|
11
|
-
operations = $
|
|
11
|
+
operations = $pageToolbarOperations;
|
|
12
12
|
}
|
|
13
13
|
function on_click(e, operation) {
|
|
14
14
|
if (!operation)
|
|
15
15
|
return;
|
|
16
16
|
if (operation.action) {
|
|
17
17
|
let focused_item = null;
|
|
18
|
-
if ($
|
|
19
|
-
focused_item = $
|
|
18
|
+
if ($contextItemsStore.focused)
|
|
19
|
+
focused_item = $contextItemsStore[$contextItemsStore.focused];
|
|
20
20
|
operation.action(focused_item);
|
|
21
21
|
return;
|
|
22
22
|
}
|
|
@@ -27,32 +27,47 @@ function on_click(e, operation) {
|
|
|
27
27
|
return;
|
|
28
28
|
let rect = owner.getBoundingClientRect();
|
|
29
29
|
if (operation.menu)
|
|
30
|
-
|
|
30
|
+
showMenu(rect, operation.menu);
|
|
31
31
|
else if (operation.toolbar)
|
|
32
|
-
|
|
32
|
+
showFloatingToolbar(rect, operation.toolbar, operation.props ?? {});
|
|
33
33
|
else if (operation.grid)
|
|
34
|
-
|
|
34
|
+
showGridMenu(rect, operation.grid);
|
|
35
|
+
}
|
|
36
|
+
function mousedown(e) {
|
|
37
|
+
e.preventDefault();
|
|
35
38
|
}
|
|
36
39
|
</script>
|
|
37
40
|
|
|
38
|
-
<div class="
|
|
41
|
+
<div class="no-print w-full h-10 bg-stone-600 dark:bg-stone-950 overflow-x-clip overflow-y-hidden py-0 text-xs flex flex-row"
|
|
39
42
|
class:flex-row-reverse={mobile}>
|
|
40
43
|
|
|
41
44
|
{#each operations as operation}
|
|
42
|
-
|
|
43
|
-
class="py-2.5 px-5
|
|
44
|
-
text-xs font-medium text-gray-900 dark:text-gray-400 dark:hover:text-white
|
|
45
|
-
bg-slate-100 hover:bg-slate-200 dark:bg-gray-800 dark:hover:bg-gray-700 active:bg-slate-300 dark:active:bg-gray-600
|
|
46
|
-
border-gray-200 focus:outline-none dark:border-gray-600
|
|
47
|
-
inline-flex items-center"
|
|
48
|
-
class:border-r={!mobile}
|
|
49
|
-
class:border-l={mobile}
|
|
50
|
-
on:click={(e) => {on_click(e, operation)}}>
|
|
51
|
-
<div class="w-3 h-3"><svelte:component this={operation.icon}/></div>
|
|
52
|
-
<span class="ml-1">{operation.caption}</span>
|
|
53
|
-
</button>
|
|
54
|
-
{/each}
|
|
45
|
+
{#if !operation.separator}
|
|
55
46
|
|
|
56
|
-
|
|
47
|
+
<button type="button"
|
|
48
|
+
class="py-2.5 px-5
|
|
49
|
+
text-xs font-medium text-stone-100 dark:text-stone-300 dark:hover:text-white
|
|
50
|
+
hover:bg-stone-700 dark:hover:bg-stone-800 active:bg-stone-300 dark:active:bg-stone-600
|
|
51
|
+
border-stone-200 focus:outline-none dark:border-stone-600
|
|
52
|
+
inline-flex items-center"
|
|
53
|
+
on:click={(e) => {on_click(e, operation)}}
|
|
54
|
+
on:mousedown={mousedown}>
|
|
55
|
+
{#if operation.icon}
|
|
56
|
+
<div class="w-3 h-3 mr-1"><svelte:component this={operation.icon}/></div>
|
|
57
|
+
{/if}
|
|
58
|
+
{#if operation.caption}
|
|
59
|
+
<span>{operation.caption}</span>
|
|
60
|
+
{/if}
|
|
61
|
+
</button>
|
|
62
|
+
{/if}
|
|
63
|
+
{/each}
|
|
64
|
+
</div>
|
|
57
65
|
|
|
58
|
-
|
|
66
|
+
<style>
|
|
67
|
+
@media print
|
|
68
|
+
{
|
|
69
|
+
.no-print, .no-print *{
|
|
70
|
+
display: none !important;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
</style>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@humandialog/forms.svelte",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.1",
|
|
4
4
|
"description": "Basic Svelte UI components for Object Reef applications",
|
|
5
5
|
"devDependencies": {
|
|
6
6
|
"@playwright/test": "^1.28.1",
|
|
@@ -74,7 +74,19 @@
|
|
|
74
74
|
"./components/icon.svelte": "./components/icon.svelte",
|
|
75
75
|
"./components/input.text.svelte": "./components/input.text.svelte",
|
|
76
76
|
"./components/inputbox.ltop.svelte": "./components/inputbox.ltop.svelte",
|
|
77
|
+
"./components/kanban/Kanban": "./components/kanban/Kanban.js",
|
|
78
|
+
"./components/kanban/internal/kanban.card.svelte": "./components/kanban/internal/kanban.card.svelte",
|
|
79
|
+
"./components/kanban/internal/kanban.column.svelte": "./components/kanban/internal/kanban.column.svelte",
|
|
80
|
+
"./components/kanban/internal/kanban.inserter.svelte": "./components/kanban/internal/kanban.inserter.svelte",
|
|
81
|
+
"./components/kanban/internal/kanban.move.menu.svelte": "./components/kanban/internal/kanban.move.menu.svelte",
|
|
82
|
+
"./components/kanban/kanban.callbacks.svelte": "./components/kanban/kanban.callbacks.svelte",
|
|
83
|
+
"./components/kanban/kanban.column.svelte": "./components/kanban/kanban.column.svelte",
|
|
84
|
+
"./components/kanban/kanban.summary.svelte": "./components/kanban/kanban.summary.svelte",
|
|
85
|
+
"./components/kanban/kanban.svelte": "./components/kanban/kanban.svelte",
|
|
86
|
+
"./components/kanban/kanban.title.svelte": "./components/kanban/kanban.title.svelte",
|
|
77
87
|
"./components/list/List": "./components/list/List.js",
|
|
88
|
+
"./components/list/internal/list.element.props.svelte": "./components/list/internal/list.element.props.svelte",
|
|
89
|
+
"./components/list/internal/list.element.summary.svelte": "./components/list/internal/list.element.summary.svelte",
|
|
78
90
|
"./components/list/internal/list.element.svelte": "./components/list/internal/list.element.svelte",
|
|
79
91
|
"./components/list/internal/list.inserter.svelte": "./components/list/internal/list.inserter.svelte",
|
|
80
92
|
"./components/list/list.combo.svelte": "./components/list/list.combo.svelte",
|
|
@@ -89,6 +101,7 @@
|
|
|
89
101
|
"./components/sidebar/sidebar.brand.svelte": "./components/sidebar/sidebar.brand.svelte",
|
|
90
102
|
"./components/sidebar/sidebar.group.svelte": "./components/sidebar/sidebar.group.svelte",
|
|
91
103
|
"./components/sidebar/sidebar.item.svelte": "./components/sidebar/sidebar.item.svelte",
|
|
104
|
+
"./components/sidebar/sidebar.list.svelte": "./components/sidebar/sidebar.list.svelte",
|
|
92
105
|
"./components/sidebar/sidebar.svelte": "./components/sidebar/sidebar.svelte",
|
|
93
106
|
"./components/simple.table.svelte": "./components/simple.table.svelte",
|
|
94
107
|
"./components/table/column.svelte": "./components/table/column.svelte",
|