poe-svelte-ui-lib 1.2.12 → 1.2.14

package/dist/Table/Table.svelte

@@ -4,6 +4,7 @@
   import type { ITableHeader, ITableProps } from '../types'
   import { fly } from 'svelte/transition'
   import { twMerge } from 'tailwind-merge'
+  import { onMount } from 'svelte'
 
   let {
     id = crypto.randomUUID(),
@@ -15,6 +16,7 @@
     outline = false,
     cursor = null,
     loader,
+    autoscroll = false,
     getData = () => {},
     modalData = $bindable(),
     onClick,
@@ -29,6 +31,8 @@
     direction: null,
   }
 
+  let isAutoscroll = $state(false)
+
   /* Сортировка столбцов */
   const sortRows = (key: string) => {
     if (sortState.key === key) {
@@ -72,6 +76,23 @@
     }
   }
 
+  /* Обработчик автоскролла */
+  const handleAutoScroll = () => {
+    if (!container) return
+
+    isAutoscroll = !(container.scrollHeight - container.scrollTop <= container.clientHeight + 50)
+  }
+  const scrollToBottom = () => {
+    if (!isAutoscroll && container) {
+      container.scrollTop = container.scrollHeight
+    }
+  }
+  $effect(() => {
+    if (body.length > 0) {
+      scrollToBottom()
+    }
+  })
+
   function buttonClick(row: any, button: any) {
     if (button.onClick) button.onClick(row)
     else if (button.eventHandler && onClick) {
@@ -119,6 +140,19 @@
     const src = typeof column.image?.src === 'function' ? column.image.src(row) : column.image?.src
     return !!src
   }
+
+  onMount(() => {
+    if (autoscroll) {
+      container?.addEventListener('scroll', handleAutoScroll)
+      scrollToBottom()
+    }
+
+    return () => {
+      if (autoscroll) {
+        container?.removeEventListener('scroll', handleAutoScroll)
+      }
+    }
+  })
 </script>
 
 <div {id} class={twMerge(`bg-blue flex h-full w-full flex-col overflow-hidden`, wrapperClass)}>

package/dist/Table/TableProps.svelte

@@ -56,19 +56,6 @@
     updateProperty('body', newBody, component, onPropertyChange)
   }
 
-  const handleImageUpload = (columnIndex: number, event: Event) => {
-    const target = event.target as HTMLInputElement
-    const file = target.files?.[0]
-    if (!file) return
-
-    const reader = new FileReader()
-    reader.onload = () => {
-      const base64WithPrefix = reader.result as string
-      updateTableHeader(columnIndex, 'image', { ['src']: base64WithPrefix })
-    }
-    reader.readAsDataURL(file)
-  }
-
   const updateButtonProperty = (columnIndex: number, buttonIndex: number, field: string, value: any) => {
     const headers = [...component.properties.header]
     const buttons = [...headers[columnIndex].buttons]

package/dist/types.d.ts

@@ -248,6 +248,7 @@ export interface ITableProps<T extends object> {
     outline?: boolean;
     cursor?: string | null;
     loader?: Writable<boolean>;
+    autoscroll?: boolean;
     getData?: () => void;
     modalData?: {
         isOpen?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "poe-svelte-ui-lib",
-  "version": "1.2.12",
+  "version": "1.2.14",
   "license": "MIT",
   "type": "module",
   "scripts": {