@ticatec/uniface-element 0.1.35 → 0.1.46

package/README.md

@@ -1,4 +1,4 @@
-# Uniface Web UI Components
+# Uniface Element
 
 ## Global Components
 

package/dist/app-layout/ClassicLayout.svelte

@@ -49,9 +49,11 @@
         <slot name="header"></slot>
     </div>
     <div style="height: 100%; flex: 1 1 auto; overflow: hidden; display: flex; flex-direction: row; position: relative">
-        <div bind:this={sidebar} style="width: 100%; flex: 0 0 auto; overflow: auto; width: {sidebarWidth}; {minWidth} {maxWidth}">
-            <slot name="sidebar"></slot>
-        </div>
+        {#if sidebar}
+            <div bind:this={sidebar} style="width: 100%; flex: 0 0 auto; overflow: auto; width: {sidebarWidth}; {minWidth} {maxWidth}">
+                <slot name="sidebar"></slot>
+            </div>
+        {/if}
         {#if sidebarResize}
             <Split direction="vertical" bindingPanel={sidebar}/>
         {/if}
@@ -62,7 +64,8 @@
             {#if sidebarResize}
                 <Split direction="vertical" bindingPanel={rightBar} reverse/>
             {/if}
-            <div bind:this={rightBar} style="width: 100%; flex: 0 0 auto; overflow: auto; width: {rightBarWidth}; {rightMinWidth} {rightMaxWidth}">
+            <div bind:this={rightBar}
+                 style="width: 100%; flex: 0 0 auto; overflow: auto; width: {rightBarWidth}; {rightMinWidth} {rightMaxWidth}">
                 <slot name="right-sidebar"></slot>
             </div>
         {/if}

package/dist/attachment-files/AttachmentFilesField.svelte

@@ -67,7 +67,7 @@
             </div>
             {#if !disabled && !readonly}
                 <div class="editor-action-icon">
-                    <i class="uniface-icon-upload" aria-hidden="true" on:click={showDialog}></i>
+                    <i class="icon_google_file_upload" aria-hidden="true" on:click={showDialog}></i>
                 </div>
             {/if}
         </div>

package/dist/attachment-files/FileRender.svelte

@@ -50,11 +50,11 @@
     <div class="file-icon">
         <img src={icon} width="64px" height="64px"/>
         <div class="action-icon" style="top: 15px;">
-            <i class="uniface-icon-download" ></i>
+            <i class="icon_google_file_download" ></i>
         </div>
         {#if !readonly}
             <div class="action-icon" style="top: 35px;">
-                <i class="uniface-icon-x" aria-hidden="true" on:click={removeFile}></i>
+                <i class="icon_google_clear" aria-hidden="true" on:click={removeFile}></i>
             </div>
     {/if}
     </div>

package/dist/attachment-files/FileUploadPanel.svelte

@@ -117,7 +117,7 @@
                 <input bind:this={fileInput} type="file" {accept} multiple={maxFiles > 1} on:change={handleFilePickup}/>
             </div>
             <div style="margin-bottom: 8px; flex: 0 0 auto; text-align: center">
-                <Button type="primary" disabled={files.length >= maxFiles} icon="uniface-icon-upload" label={btnPickup}
+                <Button type="primary" disabled={files.length >= maxFiles} icon="icon_google_file_upload" label={btnPickup}
                         onClick={showFileDialog}></Button>
             </div>
             <div style="flex: 1 1 auto; overflow: auto; padding: 0 24px">

package/dist/box/Box.svelte

@@ -9,7 +9,7 @@
 
     export {className as class};
 
-    let className: string | null = null;
+    let className: string = null as unknown as string;
 
 
 </script>

package/dist/box/Box.svelte.d.ts

@@ -23,7 +23,7 @@ declare const Box: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithCh
     content$style?: string | null;
     header$style?: string | null;
     footer$style?: string | null;
-    class?: null;
+    class?: string;
 }, {
     header: {};
     default: {};
@@ -35,7 +35,7 @@ declare const Box: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithCh
     default: {};
     footer: {};
 }, {
-    class: null;
+    class: string;
 }, string>;
 type Box = InstanceType<typeof Box>;
 export default Box;

package/dist/cascade-options-select/CascadeOptionSelect.svelte

@@ -112,7 +112,7 @@
 </script>
 
 
-<CommonPicker {displayMode} {variant} {style} {compact} className="multiple" dropDownIcon="uniface-icon-chevron-down"
+<CommonPicker {displayMode} {variant} {style} {compact} className="multiple" dropDownIcon="icon_google_keyboard_arrow_down"
               bind:showPopup canClean={!mandatory && text!=null} autoFit clean={cleanData} textValue={text??''} {readonly} {disabled}>
     <input style="width: 100%" bind:this={editor} on:click={openPopup} {placeholder}
            class="text-editor" bind:value={text} on:blur on:focus/>

package/dist/criteria-field/CriteriaField.svelte

@@ -4,14 +4,13 @@
     export let label: string = "Label"
     export let style: string = '';
     export let label$style: string = '';
-    export let arrangement: 'vertical' | 'horizontal' = 'vertical' ;
     export let size: '' | 'x15' | 'x20' | 'x25' | 'x30' | 'x35' | 'x40' = '';
     export let labelSuffix: string = ':';
 
     let className: string = '';
 
 </script>
-<div class="uniface-filter-field {size} {arrangement} {className}" {style} >
+<div class="uniface-filter-field {size} {className}" {style} >
     <div class="field-container">
         <div class="field-label" style={label$style}>
             <span>{label}{labelSuffix}</span>

package/dist/criteria-field/CriteriaField.svelte.d.ts

@@ -21,7 +21,6 @@ declare const CriteriaField: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_P
     label?: string;
     style?: string;
     label$style?: string;
-    arrangement?: "vertical" | "horizontal";
     size?: "" | "x15" | "x20" | "x25" | "x30" | "x35" | "x40";
     labelSuffix?: string;
 }, {

package/dist/data-table/lib/IndicatorColumn.d.ts

@@ -6,7 +6,7 @@ export default interface IndicatorColumn {
     /**
      *
      */
-    selectable: boolean;
+    selectable?: boolean;
     /**
      *
      */

package/dist/data-table/parts/FixedHeaderPanel.svelte

@@ -97,7 +97,7 @@
                 <span>{column.text}</span>
                 {#if column === orderColumn}
                     <i style="margin-left: 2px; font-size: 12px; position: absolute; top: 0; right: 4px"
-                       class={orderDirection===OrderDirection.Ascending ? 'uniface-icon-chevron-up' : 'uniface-icon-chevron-down'}></i>
+                       class={orderDirection===OrderDirection.Ascending ? 'icon_google_keyboard_arrow_up' : 'icon_google_keyboard_arrow_down'}></i>
                 {/if}
             </div>
 

package/dist/data-table/parts/FixedRow.svelte

@@ -46,7 +46,7 @@
 
             {#if expandable}
                 <div class="expand-icon" style="">
-                    <i class={row == expandRow ? 'uniface-icon-folder' : "uniface-icon-folder-plus"} aria-hidden="true" on:click={showInlineData}></i>
+                    <i class={row == expandRow ? 'icon_google_folder' : "icon_google_folder_open"} aria-hidden="true" on:click={showInlineData}></i>
                 </div>
             {/if}
             {#if indicatorColumn.displayNo}

package/dist/date-picker/ScrollBar.svelte

@@ -74,7 +74,7 @@
 <div class="scroll-bar" tabindex="1" on:wheel={handleMouseWheel}>
     <div class="action-bar">
         <div class="arrow-up" class:disabled={!enable}>
-            <i class="uniface-icon-chevron-up" on:click={decValue} on:dragstart={(e)=>{e.preventDefault()}}
+            <i class="icon_google_keyboard_arrow_up" on:click={decValue} on:dragstart={(e)=>{e.preventDefault()}}
                  on:mousedown={handleMouseDown(-1)} on:mouseup={handleMouseUp} on:mouseleave={handleMouseUp}></i>
         </div>
     </div>
@@ -83,7 +83,7 @@
     {/each}
     <div class="action-bar">
         <div class="arrow-down" class:disabled={!enable}>
-            <i class="uniface-icon-chevron-down" on:click={incValue} on:dragstart={(e)=>{e.preventDefault()}}
+            <i class="icon_google_keyboard_arrow_downn" on:click={incValue} on:dragstart={(e)=>{e.preventDefault()}}
                  on:mousedown={handleMouseDown(1)} on:mouseup={handleMouseUp} on:mouseleave={handleMouseUp}></i>
         </div>
     </div>

package/dist/dialog/Dialog.svelte

@@ -61,7 +61,7 @@
             <div class="title-bar" on:mousedown={handleMouseDown} on:mouseup={handleMouseUp} aria-hidden="true">
                 <div style="flex: 1 1 auto"><span>{title ?? 'New window'}</span></div>
                 <div style="flex: 0 0 auto; padding-left: 12px">
-                    <i class="uniface-icon-x dialog-action-button" aria-hidden="true" on:click={close}></i>
+                    <i class="icon_google_clear dialog-action-button" aria-hidden="true" on:click={close}></i>
                 </div>
             </div>
             <div class="dialog-content" style={content$style}>

package/dist/form-field/FormField.svelte

@@ -8,22 +8,22 @@
     export let label$style: string | null = null;
     export let required: boolean = false;
     export let error: string | null = null;
-    export let arrangement: 'vertical' | 'horizontal' = 'vertical';
     export let labelSuffix: string = ':';
-    export let label$alignment: 'center' | 'top' = 'center'
+    export let label$alignment: 'center' | 'top' = 'center';
+
 
     let className: string = '';
 
 </script>
-<div class="uniface-form-field {arrangement} {className}" {style}>
-    <div class="form-content" style="width: 100%">
-        <div class="field-label" style={label$style} class:vert-top={arrangement== 'horizontal' && label$alignment=='top'}>
+<div class="uniface-form-field {className}" {style}>
+    <div class="form-content" style="width: 100%;">
+        <div class="field-label" style={label$style} class:vert-top={label$alignment=='top'}>
             {#if required}
                 <span class="required-indicator">*</span>
             {/if}
             <span>{label}{labelSuffix}</span>
         </div>
-        <div class="field">
+        <div class="field" style="">
             <slot/>
         </div>
         {#if !utils.isEmpty(error)}

package/dist/form-field/FormField.svelte.d.ts

@@ -23,7 +23,6 @@ declare const FormField: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_Props
     label$style?: string | null;
     required?: boolean;
     error?: string | null;
-    arrangement?: "vertical" | "horizontal";
     labelSuffix?: string;
     label$alignment?: "center" | "top";
 }, {

package/dist/form-panel/flex-form/CellField.svelte

@@ -8,7 +8,6 @@
     export let label$style: string = '';
     export let required: boolean = false;
     export let error: string | null = null;
-    export let arrangement: 'vertical' | 'horizontal' = 'vertical' ;
     export let labelSuffix: string = ':';
 
     let cellCss: string = '';
@@ -25,6 +24,6 @@
     $: cellCss = generateCss(span);
 
 </script>
-<FormField class="cell-field" {label} {labelSuffix} style="{style}; {cellCss}" {label$style} {required} {error} {arrangement}>
+<FormField class="form-cell" {label} {labelSuffix} style="{style}; {cellCss}" {label$style} {required} {error}>
     <slot/>
 </FormField>

package/dist/form-panel/flex-form/CellField.svelte.d.ts

@@ -23,7 +23,6 @@ declare const CellField: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_Props
     label$style?: string;
     required?: boolean;
     error?: string | null;
-    arrangement?: "vertical" | "horizontal";
     labelSuffix?: string;
 }, {
     default: {};

package/dist/form-panel/flex-form/FlexForm.svelte

@@ -1,7 +1,9 @@
 <script lang="ts">
     export let style: string = '';
+    export let fieldLayout: 'vertical' | 'horizontal' = 'vertical';
+
 </script>
-<div class="flex-form" {style}>
+<div class="flex-form" class:field-layout-horizontal={fieldLayout=='horizontal'}  {style}>
     <div>
         <slot/>
     </div>

package/dist/form-panel/flex-form/FlexForm.svelte.d.ts

@@ -18,6 +18,7 @@ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
 } : {});
 declare const FlexForm: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
     style?: string;
+    fieldLayout?: "vertical" | "horizontal";
 }, {
     default: {};
 }>, {

package/dist/form-panel/flex-row-form/FormContainer.svelte

@@ -2,11 +2,12 @@
 
     export {className as class };
     export let style: string = '';
+    export let fieldLayout: 'vertical' | 'horizontal' = 'vertical';
 
     let className: string = "";
 
 </script>
-<div class="flex-row-form" {style}>
+<div class="flex-row-form" class:field-layout-horizontal={fieldLayout=='horizontal'} {style}>
     <div>
         <slot/>
     </div>

package/dist/form-panel/flex-row-form/FormContainer.svelte.d.ts

@@ -19,6 +19,7 @@ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
 declare const FormContainer: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
     class?: string;
     style?: string;
+    fieldLayout?: "vertical" | "horizontal";
 }, {
     default: {};
 }>, {

package/dist/form-panel/grid-form/GridField.svelte

@@ -4,12 +4,14 @@
     export let label: string = "Label:"
     export let label$style: string = '';
     export let required: boolean = false;
-    export let error: string = null;
+    export let error: string | null = null;
     export let arrangement: 'vertical' | 'horizontal' = 'vertical' ;
     export let rowSpan: number = 1;
     export let colSpan: number = 1;
-    export let row: number = null;
-    export let col: number = null;
+    export let row: number | null = null;
+    export let col: number | null = null;
+
+    export let height: string | undefined = undefined;
 
     export let labelSuffix: string = ':';
 
@@ -18,12 +20,12 @@
     $: {
         style = rowSpan > 1 ? `grid-row-end: span ${rowSpan};` : '';
         style += colSpan > 1 ? `grid-column-end: span ${colSpan};` : '';
-        style += row != null ? `grid-row-start: span ${row};` : '';
-        style += col != null ? `grid-column-start: span ${col};` : '';
+        style += row != null ? `grid-row-start: ${row};` : '';
+        style += col != null ? `grid-column-start: ${col};` : '';
     }
 
 
 </script>
-<FormField class="cell-field" {label$style} {labelSuffix} {style} {label} {required} {error} {arrangement}>
+<FormField class="form-cell" {label$style} {labelSuffix} {style} {label} {required} {error} {arrangement} {height}>
     <slot/>
 </FormField>

package/dist/form-panel/grid-form/GridField.svelte.d.ts

@@ -20,12 +20,13 @@ declare const GridField: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_Props
     label?: string;
     label$style?: string;
     required?: boolean;
-    error?: string;
+    error?: string | null;
     arrangement?: "vertical" | "horizontal";
     rowSpan?: number;
     colSpan?: number;
-    row?: number;
-    col?: number;
+    row?: number | null;
+    col?: number | null;
+    height?: string | undefined;
     labelSuffix?: string;
 }, {
     default: {};

package/dist/form-panel/grid-form/GridForm.svelte

@@ -1,8 +1,15 @@
 <script lang="ts">
+
     export let style: string = '';
+    export let columns: number = 6; //默认6列
+    export let fieldLayout: 'vertical' | 'horizontal' = 'vertical';
+
+
+    $: gridStyle = `grid-template-columns: repeat(${columns}, 1fr)`
+
 </script>
-<div class="grid-form" {style}>
-    <div>
+<div class="grid-form" class:field-layout-horizontal={fieldLayout=='horizontal'} {style}>
+    <div style="{gridStyle}">
         <slot/>
     </div>
 </div>

package/dist/form-panel/grid-form/GridForm.svelte.d.ts

@@ -18,6 +18,8 @@ type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
 } : {});
 declare const GridForm: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
     style?: string;
+    columns?: number;
+    fieldLayout?: "vertical" | "horizontal";
 }, {
     default: {};
 }>, {

package/dist/image-files/ImageFilesField.svelte

@@ -80,7 +80,7 @@
             </div>
             {#if !disabled && !readonly}
                 <div class="editor-action-icon ">
-                    <i class="uniface-icon-upload" aria-hidden="true" on:click={showDialog}></i>
+                    <i class="icon_google_file_upload" aria-hidden="true" on:click={showDialog}></i>
                 </div>
             {/if}
         </div>

package/dist/image-files/ImagePreview.svelte

@@ -89,9 +89,9 @@
                 </div>
                 <!-- 顶部工具栏 -->
                 <div class="toolbar" on:click|stopPropagation aria-hidden="true">
-                    <IconButton icon="uniface-icon-zoom-in" type="default" onClick={zoomIn}></IconButton>
-                    <IconButton icon="uniface-icon-zoom-out" type="default" onClick={zoomOut}></IconButton>
-                    <IconButton icon="uniface-icon-x" type="default" onClick={()=>{visible = false}}></IconButton>
+                    <IconButton icon="icon_google_zoom_in" type="default" onClick={zoomIn}></IconButton>
+                    <IconButton icon="icon_google_zoom_out" type="default" onClick={zoomOut}></IconButton>
+                    <IconButton icon="icon_google_cancel" type="default" onClick={()=>{visible = false}}></IconButton>
                 </div>
             </div>
         </div>

package/dist/image-files/ImageRender.svelte

@@ -21,11 +21,11 @@
         <div class="img-overlay">
             <div>
                 <div class="action-icon" style="top: 15px;">
-                    <i class="uniface-icon-eye" aria-hidden="true" on:click={()=>{onPreview?.(file)}}></i>
+                    <i class="icon_google_remove_red_eye" aria-hidden="true" on:click={()=>{onPreview?.(file)}}></i>
                 </div>
                 {#if !readonly}
                     <div class="action-icon" style="top: 35px;">
-                        <i class="uniface-icon-x" aria-hidden="true" on:click={removeFile}></i>
+                        <i class="icon_google_delete" aria-hidden="true" on:click={removeFile}></i>
                     </div>
                 {/if}
             </div>

package/dist/lib/TreeNodes.d.ts

@@ -0,0 +1,58 @@
+export declare function compareNumber(a: number, b: number): 0 | 1 | -1;
+export type TreeNode<T> = {
+    item: T;
+    expand: boolean;
+    children?: TreeNode<T>[];
+};
+export type CheckIsRoot<T> = (data: T) => boolean;
+export type CompareFun<T> = (o1: T, o2: T) => number | undefined;
+export type GetText<T> = (data: T) => string;
+export interface TreeNodeOptions<T> {
+    keyField?: keyof T;
+    textField?: keyof T | GetText<T>;
+    parentKeyField?: keyof T;
+    checkIsRoot: CheckIsRoot<T>;
+    compareFun: CompareFun<T>;
+    expendDeep?: number;
+}
+export default class TreeNodes<T> {
+    #private;
+    protected readonly checkIsRoot: CheckIsRoot<T>;
+    protected readonly keyField: keyof T;
+    protected readonly parentKeyField: keyof T;
+    protected readonly textField: keyof T | GetText<T>;
+    protected nodeMap: Map<any, TreeNode<T>>;
+    protected compareFun: any;
+    protected expendDeep: number;
+    constructor(options: TreeNodeOptions<T>);
+    setData(list: Array<T>): void;
+    private appendNode;
+    private collectExpandedNodes;
+    /**
+     * 获取展开的展示列表
+     */
+    getHierarchyList(): Array<TreeNode<T>>;
+    /**
+     * 获取节点
+     */
+    get nodes(): Array<TreeNode<T>>;
+    /**
+     * 增加一个新节点
+     * @param item
+     */
+    append(item: T): void;
+    /**
+     * 替换一个节点的数据
+     * @param item
+     */
+    replace(item: T): void;
+    remove(item: T): void;
+    /**
+     * 将一个节点移动到另外一个节点下
+     * @param item
+     * @param parentId
+     */
+    moveTo(item: T, parentId: string): void;
+    private extractChildrenDirectories;
+    extractDirectories(exclusiveValue: any): TreeNode<T>[];
+}