@ticatec/uniface-element 0.3.3 → 0.3.5

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

@@ -1,4 +1,4 @@
-export type HrefBuilder = (item: any) => Array<HrefLink> | HrefLink;
+export type HrefBuilder = (item: any) => Array<HrefLink> | HrefLink | string;
 export type HrefAction = () => void;
 export default interface HrefLink {
     /**

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

@@ -5,7 +5,7 @@
     export let data;
     export let href: HrefBuilder;
 
-    let list: Array<HrefLink> = [];
+    let list: Array<HrefLink | string> = [];
 
 
     $: {
@@ -15,7 +15,11 @@
 </script>
 <div style="display: flex; flex-direction: row; gap: 8px; justify-content: center">
     {#each list as item, idx}
-        <button class="link-style" on:click|preventDefault={()=>item.action()}>{item.text}</button>
+        {#if typeof item == "string"}
+            <span>{item}</span>
+        {:else}
+            <button class="link-style" on:click|preventDefault={()=>item.action()}>{item.text}</button>
+        {/if}
     {/each}
 </div>
 
@@ -29,6 +33,7 @@
         font: inherit;
         padding: 0;
     }
+
     button.link-style:focus {
         outline: none;
     }

package/dist/group-box/group-check-box/GroupCheckBox.svelte

@@ -153,10 +153,10 @@
             {#if (hideOptions??[]).indexOf(op[keyField]) === -1}
                 <CheckBox {compact} {readonly} disabled={disabled || disabledOptions.indexOf(op[keyField]) > -1}
                       label={op[textField]} style={item$style} value={selectedList.indexOf(op[keyField]) > -1}
-                      onChange={handleCheckboxChange(op[keyField])} 
-                      onClick={handleFocus} 
-                      on:focus={handleFocus} 
-                      on:blur={handleContainerBlur}/>
+                      onchange={handleCheckboxChange(op[keyField])}
+                      onclick={handleFocus}
+                      onfocus={handleFocus}
+                      onblur={handleContainerBlur}/>
             {/if}
         {/each}
     </div>

package/dist/group-box/group-radio-box/GroupRadioBox.svelte

@@ -102,10 +102,10 @@
         {#each options as op}
             <RadioButton {readonly} {compact} disabled={disabled || disabledOptions.indexOf(op[keyField]) > -1}
                          bind:group={value} label={op[textField]} style={item$style} value={op[keyField]}
-                         on:click={handleRadioClick}
-                         on:change={handleRadioChange}
-                         on:focus={handleRadioFocus} 
-                         on:blur={handleContainerBlur}/>
+                         onclick={handleRadioClick}
+                         onchange={handleRadioChange}
+                         onfocus={handleRadioFocus}
+                         onblur={handleContainerBlur}/>
         {/each}
     </div>
 {/if}

package/dist/list-box/ListBox.svelte

@@ -184,7 +184,7 @@
             {#if readonly === false && (filter || lazyLoader)}
                 <div class="header-search">
                     <SearchBox bind:this={searchBox} compact variant="plain" disabled={isBusy} style="width: 100%" bind:value={filterText}
-                               onChange={handleCriteriaChange}/>
+                               onchange={handleCriteriaChange}/>
                 </div>
             {/if}
         </div>
@@ -195,7 +195,7 @@
                 {#if selectMode === "multiple"}
                     <div class="listview-item" style="display: flex; flex-direction: row; align-items: center; gap: 8px">
                         <CheckBox style="flex: 0 0 auto; margin-left: 8px" {readonly} value={selectedList.indexOf(item) > -1}
-                                  onChange={handleSelectionChanged(item)}/>
+                                  onchange={handleSelectionChanged(item)}/>
                         <div style="flex: 1 1 auto; cursor: pointer" aria-hidden="true" on:click={handleSelectionChanged(item)}>
                             <svelte:component this={itemRender} {readonly} {item} {...item$props}/>
                         </div>

package/dist/radio-button/RadioButton.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {onMount, createEventDispatcher} from "svelte";
+    import {onMount} from "svelte";
 
     export let value: any;
     export let label: string;
@@ -11,10 +11,10 @@
     export let onfocus: ((event: FocusEvent) => void) | null = null;
     export let onblur: ((event: FocusEvent) => void) | null = null;
     export let onchange: ((event: Event) => void) | null = null;
+    export let onclick: ((event: MouseEvent) => void) | null = null;
 
     let roProps: any = {};
     let inputElement: HTMLInputElement;
-    const dispatch = createEventDispatcher();
 
     export const setFocus = () => {
         setTimeout(() => {
@@ -22,7 +22,7 @@
         }, 50);
     }
 
-    onMount(()=>{
+    onMount(() => {
 
     })
 
@@ -30,23 +30,19 @@
         if (disabled || readonly) {
             e.stopPropagation();
             e.preventDefault();
-        } else {
-            dispatch('click', e);
+            onclick?.(e)
         }
     }
 
     const handleFocus = (e: FocusEvent) => {
-        dispatch('focus', e);
         onfocus?.(e);
     }
 
     const handleBlur = (e: FocusEvent) => {
-        dispatch('blur', e);
         onblur?.(e);
     }
 
     const handleChange = (e: Event) => {
-        dispatch('change', e);
         onchange?.(e);
     }
 

package/dist/radio-button/RadioButton.svelte.d.ts

@@ -22,13 +22,9 @@ declare const RadioButton: $$__sveltets_2_IsomorphicComponent<{
     onfocus?: ((event: FocusEvent) => void) | null;
     onblur?: ((event: FocusEvent) => void) | null;
     onchange?: ((event: Event) => void) | null;
+    onclick?: ((event: MouseEvent) => void) | null;
     setFocus?: () => void;
 }, {
-    click: CustomEvent<any>;
-    focus: CustomEvent<any>;
-    blur: CustomEvent<any>;
-    change: CustomEvent<any>;
-} & {
     [evt: string]: CustomEvent<any>;
 }, {}, {
     setFocus: () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ticatec/uniface-element",
-  "version": "0.3.3",
+  "version": "0.3.5",
   "description": "A comprehensive UI component library for Svelte applications with rich form controls, data tables, layouts and interactive elements",
   "keywords": [
     "svelte",