Core UI: UX improvements #BEXIS2/Core#2223

Author: geofranzi

README.md

@@ -1,4 +1,30 @@
 # bexis-core-ui
+## 0.4.59
+- Table
+  - remove static title "table"
+  - shorten upload text
+  - remove last comma allowed files list
+  - remove title about sorting, if not possible
+
+## 0.4.49 -> 0.4.53
+- Api
+  - remove __RequestVerificationToken from header
+  - change post request to 'application/x-www-form-urlencoded'
+  - add __RequestVerificationToken to data
+  
+## 0.4.48
+- Api
+  - add __RequestVerificationToken if exist
+
+## 0.4.47
+- Menu
+  - change hover over menu items
+  
+## 0.4.46
+- Menu
+  - Add hover to menu
+  - Fix Missing nowrap in menu
+
 ## 0.4.45
 - Menu
   - hide gear if settings array has no entry

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bexis2/bexis2-core-ui",
-  "version": "0.4.45",
+  "version": "0.4.59",
   "private": false,
   "scripts": {
     "dev": "vite dev",

src/lib/components/File/FileUploader.svelte

@@ -177,7 +177,7 @@
 			>
 				<b style="font-size:xx-large"><Fa icon={faFileUpload} /></b>
 				<span
-					><b>Drag 'n' drop some files here, or click to select files</b>
+					><b>Drag 'n' drop or click to select files</b>
 					<b>(max file size: {model.maxSize} mb)</b></span
 				>
 				<p>

src/lib/components/Table/TableContent.svelte

@@ -535,8 +535,8 @@
 					{...$tableAttrs}
 					class="table table-auto table-compact bg-tertiary-500/30 dark:bg-tertiary-900/10 overflow-clip"
 					id="{tableId}-table"
-					title="Table"
 				>
+					<!-- title="Table" removed from top, as this should be handled by the surrounding container for better accessibility -->
 					<!-- If table height is provided, making the top row sticky -->
 					<thead class={height != null && $pageRows.length > 0 ? `sticky top-0` : ''}>
 						<!-- {#if $data.length > 0} -->
@@ -583,11 +583,11 @@
 																class:cursor-pointer={!props.sort.disabled}
 																on:click={props.sort.toggle}
 																on:keydown={props.sort.toggle}
-																title={props.sort.order === 'asc'
+																title={props.sort.disabled ? undefined : (props.sort.order === 'asc'
 																	? `Sort by ${cell.label} column in descending order`
 																	: props.sort.order === 'desc'
 																	? `Remove sorting by ${cell.label} column`
-																	: `Sort by ${cell.label} column in ascending order`}
+																	: `Sort by ${cell.label} column in ascending order`)}
 															>
 																{cell.render().replaceAll("%%%", '.')}
 															</span>

src/lib/components/page/Docs.svelte

@@ -39,7 +39,7 @@
 	{/if}
 
 	{#each links as link}
-		<span role="button" tabindex="0" title="link" class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)} on:keypress={() => goTo(link.url, false)}>
+		<span role="button" tabindex="0" title={link.label} class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)} on:keypress={() => goTo(link.url, false)}>
 			<span>
 				{#if link.label.toLowerCase()=='manual'}
 					<Fa icon={faBook} />