poe-svelte-ui-lib 1.5.1 → 1.5.3

package/dist/Select/Select.svelte

@@ -74,7 +74,7 @@
       })
       isDropdownOpen = filteredOptions.length > 0
 
-      const selectedFromList = options.some((option) => option.name?.toString() === searchValue)
+      const selectedFromList = options.find((option) => option.name?.toString() === searchValue)
 
       if (!selectedFromList) {
         const newOption: ISelectOption<T> = {
@@ -85,6 +85,9 @@
 
         value = newOption
         onUpdate?.(newOption)
+      } else {
+        value = selectedFromList
+        onUpdate?.(selectedFromList)
       }
     }
   }

package/dist/Table/Table.svelte

@@ -311,7 +311,12 @@
     </div>
 
     {#if body || dataBuffer}
-      {@const rows = type == 'logger' ? dataBuffer.filter((str) => logType.includes(str.type)).slice(-rowsAmmount) : stashData ? dataBuffer : body}
+      {@const rows =
+        type == 'logger'
+          ? dataBuffer.filter((str) => logType.includes(str.type)).slice(-rowsAmmount)
+          : stashData
+            ? dataBuffer.slice(-rowsAmmount)
+            : body}
       <!-- Table Body с прокруткой -->
       <div class="flex-1 overflow-y-auto bg-(--container-color)/50" bind:this={container} onscroll={handleScroll}>
         <div class="grid min-w-0" style={`grid-template-columns: ${header.map((c) => c.width || 'minmax(0, 1fr)').join(' ')};`}>

package/dist/Table/TableProps.svelte

@@ -57,14 +57,11 @@
   }
 
   const updateButtonProperty = (columnIndex: number, buttonIndex: number, field: string, value: any) => {
-    if (field === 'eventHandler') {
-    } else {
-      const headers = [...component.properties.header]
-      const buttons = [...headers[columnIndex].buttons]
-      buttons[buttonIndex] = { ...buttons[buttonIndex], [field]: value }
-      headers[columnIndex].buttons = buttons
-      updateProperty('header', headers, component, onPropertyChange)
-    }
+    const headers = [...component.properties.header]
+    const buttons = [...headers[columnIndex].buttons]
+    buttons[buttonIndex] = { ...buttons[buttonIndex], [field]: value }
+    headers[columnIndex].buttons = buttons
+    updateProperty('header', headers, component, onPropertyChange)
   }
 
   const removeButtonFromColumn = (columnIndex: number, buttonIndex: number) => {
@@ -143,12 +140,14 @@
         options={$optionsStore.TEXT_ALIGN_OPTIONS}
         onUpdate={(option) => updateProperty('label.class', twMerge(component.properties.label.class, option.value), component, onPropertyChange)}
       />
-      <UI.Input
-        label={{ name: $t('constructor.props.table.buffersize') }}
-        type="number"
-        value={component.properties.rowsAmmount}
-        onUpdate={(value) => updateProperty('rowsAmmount', value as string, component, onPropertyChange)}
-      />
+      {#if component.properties.stashData}
+        <UI.Input
+          label={{ name: $t('constructor.props.table.buffersize') }}
+          type="number"
+          value={component.properties.rowsAmmount}
+          onUpdate={(value) => updateProperty('rowsAmmount', value as string, component, onPropertyChange)}
+        />
+      {/if}
     </div>
   </div>
 
@@ -385,12 +384,14 @@
           updateProperty('stashData', value, component, onPropertyChange)
         }}
       />
-      <UI.Input
-        label={{ name: $t('constructor.props.table.buffersize') }}
-        type="number"
-        value={component.properties.rowsAmmount}
-        onUpdate={(value) => updateProperty('rowsAmmount', value as string, component, onPropertyChange)}
-      />
+      {#if component.properties.stashData}
+        <UI.Input
+          label={{ name: $t('constructor.props.table.buffersize') }}
+          type="number"
+          value={component.properties.rowsAmmount}
+          onUpdate={(value) => updateProperty('rowsAmmount', value as string, component, onPropertyChange)}
+        />
+      {/if}
     </div>
   </div>
 
@@ -606,6 +607,7 @@
                     onUpdate={(value) => {
                       const handler = { ...button.eventHandler }
                       handler.Variables = (value as string).trim().split(/\s+/)
+                      console.log(handler)
                       updateButtonProperty(columnIndex, buttonIndex, 'eventHandler', handler)
                     }}
                   />

package/dist/Tabs/Tabs.svelte

@@ -26,10 +26,10 @@
   let currentTabIndex: number = $derived(activeTab)
 </script>
 
-<div id={`${id}-${crypto.randomUUID().slice(0, 6)}`} class="w-full rounded-2xl bg-(--back-color)">
+<div id={`${id}-${crypto.randomUUID().slice(0, 6)}`} class="w-full h-full flex flex-col rounded-2xl bg-(--back-color) overflow-hidden">
   <!-- Вкладки -->
   <div
-    class="{twMerge('bg-blue sticky top-0 z-50 flex h-fit items-center overflow-x-auto rounded-t-2xl px-1', wrapperClass)} 
+    class="{twMerge('bg-blue z-50 flex h-fit items-center rounded-t-2xl overflow-x-auto px-1', wrapperClass)} 
      bg-(--bg-color)"
   >
     {#each items as item, index}
@@ -72,7 +72,7 @@
 
   <!-- Контент вкладки -->
   <div
-    class="grid w-full gap-2 rounded-2xl bg-(--back-color) p-4"
+    class="grid flex-1 overflow-y-scroll w-full gap-2 rounded-2xl bg-(--back-color) p-4"
     style="grid-template-columns: repeat({size.width || 1}, minmax(0, 1fr)); grid-template-rows: repeat({size.height || 1}, auto);"
   >
     {#if Components}
@@ -89,7 +89,7 @@
 
 <style>
   ::-webkit-scrollbar-track {
-    background: var(--back-color);
+    background: var(--red-color);
   }
   ::-webkit-scrollbar-thumb {
     background-color: color-mix(in srgb, var(--bg-color), var(--back-color) 20%);

package/dist/types.d.ts

@@ -20,7 +20,7 @@ export declare const updateComponent: (component: UIComponent, updates: Partial<
     eventHandler: IUIComponentHandler | undefined;
     id: string;
     type: "Button" | "Accordion" | "Input" | "Select" | "Switch" | "ColorPicker" | "Slider" | "TextField" | "Joystick" | "ProgressBar" | "Graph" | "Table" | "Tabs" | "FileAttach" | "Map";
-    position: Position;
+    position: Required<Position>;
     parentId: string;
 };
 export interface UIComponent {
@@ -29,7 +29,7 @@ export interface UIComponent {
     access?: 'full' | 'viewOnly' | 'hidden';
     type: 'Button' | 'Accordion' | 'Input' | 'Select' | 'Switch' | 'ColorPicker' | 'Slider' | 'TextField' | 'Joystick' | 'ProgressBar' | 'Graph' | 'Table' | 'Tabs' | 'FileAttach' | 'Map';
     properties: IAccordionProps | IButtonProps | IInputProps | ISelectProps | ISwitchProps | IColorPickerProps | ISliderProps | ITextFieldProps | IProgressBarProps | IGraphProps | ITableProps<object> | ITabsProps | IFileAttachProps | IJoystickProps | IMapProps;
-    position: Position;
+    position: Required<Position>;
     parentId: string;
     eventHandler?: IUIComponentHandler;
 }

package/package.json

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