@ticatec/uniface-element 0.1.16 → 0.1.18

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.
@@ -20,6 +20,6 @@ export default interface ButtonAction {
20
20
  /**
21
21
  * click处理函数
22
22
  */
23
- handler: MouseClickHandler;
23
+ handler?: MouseClickHandler;
24
24
  }
25
25
  export type ButtonActions = Array<ButtonAction | null>;
@@ -18,8 +18,8 @@
18
18
  export let showActionIcon: boolean = false;
19
19
  export let clean: () => void;
20
20
 
21
- export let hasLeadingIcon: boolean = false;
22
- export let hasTrailingIcon: boolean = false;
21
+ export let hasLeadingIcon: boolean = $$slots['leading-icon'];
22
+ export let hasTrailingIcon: boolean = $$slots['trailing-icon'];
23
23
 
24
24
  let className: string = '';
25
25
 
@@ -2,18 +2,16 @@
2
2
 
3
3
  import {fade} from "svelte/transition";
4
4
  import type {DialogCloseConfirm} from "./DialogCloseConfirm";
5
- import ActionBar, {type ButtonActions} from "../action-bar";
5
+ import ActionBar, {type ButtonAction, type ButtonActions} from "../action-bar";
6
6
  import i18n from "@ticatec/i18n";
7
7
  import {onMount} from "svelte";
8
8
 
9
- export let title: string = null as unknown as string;
10
- export let actions: ButtonActions;
11
- export let closeConfirm: DialogCloseConfirm;
9
+ export let title: string;
10
+ export let actions: ButtonActions | null = null;
11
+ export let closeConfirm: DialogCloseConfirm | null = null;
12
12
  export let content$style: string = '';
13
13
  export let closeHandler: () => void;
14
-
15
-
16
- export let closeAction: any;
14
+ export let closeAction: ButtonAction | null = null;
17
15
 
18
16
  export const close = async () => {
19
17
  let confirm = closeConfirm ? await closeConfirm() : true;
@@ -50,10 +48,8 @@
50
48
  type: 'secondary'
51
49
  };
52
50
  closeAction.handler = close;
53
- dialogActions = actions ? [...actions, closeAction] : [closeAction];
54
51
  })
55
52
 
56
- $:console.log(closeAction)
57
53
  $: dialogActions = actions ? [...actions, closeAction] : [closeAction];
58
54
 
59
55
  </script>
@@ -1,5 +1,5 @@
1
1
  import type { DialogCloseConfirm } from "./DialogCloseConfirm";
2
- import { type ButtonActions } from "../action-bar";
2
+ import { type ButtonAction, type ButtonActions } from "../action-bar";
3
3
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
4
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
5
  $$bindings?: Bindings;
@@ -19,12 +19,12 @@ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
19
19
  children?: any;
20
20
  } : {});
21
21
  declare const Dialog: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
22
- title?: string;
23
- actions: ButtonActions;
24
- closeConfirm: DialogCloseConfirm;
22
+ title: string;
23
+ actions?: ButtonActions | null;
24
+ closeConfirm?: DialogCloseConfirm | null;
25
25
  content$style?: string;
26
26
  closeHandler: () => void;
27
- closeAction: any;
27
+ closeAction?: ButtonAction | null;
28
28
  close?: () => Promise<void>;
29
29
  }, {
30
30
  default: {};
@@ -3,16 +3,18 @@
3
3
 
4
4
  import {onDestroy, onMount} from "svelte";
5
5
  import {initialize} from "./IDialog";
6
- import DialogBox from "./DialogBox.svelte";
6
+
7
+ import {dialogs} from "./Dialogs";
7
8
 
8
9
  export const open = (component: any, params: any) => {
9
- let dialog = {component, params}
10
- params.closeHandler = remove(dialog);
11
- dialogs = [...dialogs, dialog];
10
+ let dialog = {id: (new Date().getTime()).toString(36) ,component, params};
11
+ params.closeHandler = () => {
12
+ dialogs.removeDialog(dialog.id);
13
+ }
14
+ dialogs.showDialog(dialog);
12
15
  }
13
16
 
14
- let dialogs:Array<any> = [];
15
- let board:any;
17
+ let board: any;
16
18
 
17
19
  onMount(() => {
18
20
  document.body.appendChild(board);
@@ -26,20 +28,11 @@
26
28
  board && board.remove();
27
29
  });
28
30
 
29
- const remove = (dialog:any) => () => {
30
- let pos = dialogs.indexOf(dialog);
31
- if (pos > -1) {
32
- dialogs.splice(pos, 1);
33
- dialogs = [...dialogs];
34
- }
35
- }
36
-
37
31
 
38
32
  </script>
39
33
 
40
- <div bind:this={board} class="uniface-dialog-board" style="display: {dialogs.length > 0 ? 'block' : 'none'}">
41
- {#each dialogs as dialog}
42
- <DialogBox closeHandler={remove(dialog)} dialog={dialog.component} params={dialog.params} >
43
- </DialogBox>
34
+ <div bind:this={board} class="uniface-dialog-board" style="display: {$dialogs.length > 0 ? 'block' : 'none'}">
35
+ {#each $dialogs as dialog}
36
+ <svelte:component this={dialog.component} {...dialog.params}></svelte:component>
44
37
  {/each}
45
38
  </div>
@@ -0,0 +1,6 @@
1
+ export declare const dialogs: {
2
+ subscribe: (this: void, run: import("svelte/store").Subscriber<any[]>, invalidate?: () => void) => import("svelte/store").Unsubscriber;
3
+ showDialog(dialog: any): void;
4
+ removeDialog(id: string): void;
5
+ clear(): void;
6
+ };
@@ -0,0 +1,21 @@
1
+ import { writable } from "svelte/store";
2
+ const initialDialogs = [];
3
+ function createDialogStore() {
4
+ const { subscribe, set, update } = writable(initialDialogs);
5
+ return {
6
+ subscribe,
7
+ showDialog(dialog) {
8
+ update(dialogs => {
9
+ const newDialog = { ...dialog };
10
+ return [...dialogs, newDialog];
11
+ });
12
+ },
13
+ removeDialog(id) {
14
+ update(dialogs => dialogs.filter(dialog => dialog.id !== id));
15
+ },
16
+ clear() {
17
+ set([]);
18
+ },
19
+ };
20
+ }
21
+ export const dialogs = createDialogStore();
@@ -6,9 +6,9 @@
6
6
  export let variant: '' | 'plain' | 'outlined' | 'filled' = '';
7
7
  export let compact: boolean = false;
8
8
  export let style: string = '';
9
- export let value: string = '';
9
+ export let value: string | null;
10
10
  export let disabled: boolean = false;
11
- export let onChange: OnChangeHandler<string> = null as unknown as OnChangeHandler<string>;
11
+ export let onChange: OnChangeHandler<string|null> = null as unknown as OnChangeHandler<string|null>;
12
12
 
13
13
  export let placeholder: string | null = null;
14
14
 
@@ -22,7 +22,7 @@
22
22
  let composing: boolean = false;
23
23
  let inputText: string;
24
24
 
25
- $: inputText = value;
25
+ $: inputText = value??'';
26
26
 
27
27
  const handleInput = () => {
28
28
  if (composing == false) {
@@ -16,9 +16,9 @@ declare const SearchBox: $$__sveltets_2_IsomorphicComponent<{
16
16
  variant?: "" | "plain" | "outlined" | "filled";
17
17
  compact?: boolean;
18
18
  style?: string;
19
- value?: string;
19
+ value: string | null;
20
20
  disabled?: boolean;
21
- onChange?: OnChangeHandler<string>;
21
+ onChange?: OnChangeHandler<string | null>;
22
22
  placeholder?: string | null;
23
23
  focus?: () => void;
24
24
  }, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ticatec/uniface-element",
3
- "version": "0.1.16",
3
+ "version": "0.1.18",
4
4
  "description": "uniface web elements",
5
5
  "scripts": {
6
6
  "dev": "vite dev",
@@ -1,25 +0,0 @@
1
- <script lang="ts">
2
-
3
- import Dialog from "./Dialog.svelte";
4
- import type {ButtonActions} from "../action-bar";
5
- import type {DialogCloseConfirm} from "..";
6
-
7
- export let dialog: any;
8
- export let params: any;
9
- export let closeHandler: () => void;
10
- let actions: ButtonActions = null as unknown as ButtonActions;
11
-
12
- let title: string;
13
-
14
- let instance: any;
15
-
16
- let closeConfirm: DialogCloseConfirm;
17
- let closeAction: any;
18
-
19
-
20
- </script>
21
-
22
- <Dialog bind:this={instance} {title} {closeHandler} {closeConfirm} {actions} {closeAction}>
23
- <svelte:component this={dialog} dialog={instance} bind:title bind:actions bind:closeConfirm bind:closeAction
24
- {...params}></svelte:component>
25
- </Dialog>
@@ -1,22 +0,0 @@
1
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
2
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
- $$bindings?: Bindings;
4
- } & Exports;
5
- (internal: unknown, props: Props & {
6
- $$events?: Events;
7
- $$slots?: Slots;
8
- }): Exports & {
9
- $set?: any;
10
- $on?: any;
11
- };
12
- z_$$bindings?: Bindings;
13
- }
14
- declare const DialogBox: $$__sveltets_2_IsomorphicComponent<{
15
- dialog: any;
16
- params: any;
17
- closeHandler: () => void;
18
- }, {
19
- [evt: string]: CustomEvent<any>;
20
- }, {}, {}, string>;
21
- type DialogBox = InstanceType<typeof DialogBox>;
22
- export default DialogBox;