poe-svelte-ui-lib 1.9.14 → 1.9.16

package/dist/Dragging.svelte

@@ -87,7 +87,6 @@
       array,
     }
 
-    // commandItems = Array.from(container[containerIndex ?? 0]?.querySelectorAll('[id^="item-"]') || [])
     commandItems = Array.from(container.querySelectorAll(`[id^="${elementsId}-"]`) || [])
 
     e.preventDefault()
@@ -160,11 +159,18 @@
 
 <div
   id={crypto.randomUUID()}
-  class={twMerge("cursor-move size-8 [&_svg]:h-full [&_svg]:max-h-full [&_svg]:w-full [&_svg]:max-w-full", wrapperClass)}
+  class={twMerge(
+    `size-8 [&_svg]:h-full [&_svg]:max-h-full [&_svg]:w-full [&_svg]:max-w-full ${array.length == 1 ? "opacity-50 cursor-not-allowed" : "cursor-move"} `,
+    wrapperClass,
+  )}
   role="button"
   tabindex={0}
   onkeydown={null}
-  onmousedown={(e) => startDrag(e)}
+  onmousedown={(e) => {
+    if (array.length !== 1) {
+      startDrag(e)
+    }
+  }}
 >
   <MoveVerticalIcon />
 </div>

package/dist/Input/Input.svelte

@@ -82,7 +82,7 @@
   {/if}
 
   <div class="relative flex w-full items-center {type === 'text-area' ? 'h-full' : ''}">
-    {#if type === "text" || type === "password" || type === "number"}
+    {#if type !== "text-area"}
       <input
         bind:value
         class={twMerge(
@@ -109,7 +109,7 @@
         step={number?.step}
         {readonly}
       />
-    {:else if type === "text-area"}
+    {:else}
       <textarea
         bind:value
         class={twMerge(
@@ -194,7 +194,7 @@
       </button>
     {/if}
 
-    {#if type === "number" && !readonly && !disabled}
+    {#if (type === "number" || type === "bitMode") && !readonly && !disabled}
       <div class="absolute right-0 flex h-full w-8 flex-col items-center justify-center rounded-r-2xl border-l border-(--border-color)">
         <button
           class="flex h-1/2 w-full items-center rounded-tr-2xl border-b border-(--border-color) pl-2 transition-colors duration-150 hover:bg-(--gray-color)/30 active:bg-(--gray-color)/10"

package/dist/Input/InputProps.svelte

@@ -133,11 +133,21 @@
 {#snippet InputType()}
   <UI.Select
     label={{ name: $t("constructor.props.type") }}
-    options={$optionsStore.INPUT_TYPE_OPTIONS.map((o) => (component.properties.bitMode && o.value != "number" ? { ...o, disabled: true } : o))}
+    options={$optionsStore.INPUT_TYPE_OPTIONS}
     type="buttons"
     value={$optionsStore.INPUT_TYPE_OPTIONS.find((opt) => opt.value === (component.properties.type || "text"))}
     onUpdate={(option) => {
       if ((option as IOption<string>).value == "password" && component.properties.help.copyButton) updateProperty("help.copyButton", false)
+      if ((option as IOption<string>).value === "bitMode") {
+        updateProperty("type", "number")
+        updateProperty("number.minNum", 0)
+        updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1)
+        updateProperty("number.step", 1)
+        updateProperty("help.info", `${$t("constructor.props.maxnum")}: ${component.properties.number.maxNum}`)
+      } else {
+        updateProperty("help.info", "")
+      }
+
       updateProperty("type", (option as UI.IOption).value as string)
     }}
   />
@@ -194,7 +204,7 @@
     {#if component.properties.type === "text" || component.properties.type === "text-area"}
       <UI.Select
         label={{ name: $t("constructor.props.align.content") }}
-        options={$optionsStore.TEXT_ALIGN_OPTIONS.map((o) => (component.properties.bitMode && o.value != "number" ? { ...o, disabled: true } : o))}
+        options={$optionsStore.TEXT_ALIGN_OPTIONS}
         type="buttons"
         value={$optionsStore.TEXT_ALIGN_OPTIONS.find(
           (opt) => opt.value === (component.properties.componentClass.split(" ").find((cl: string) => cl.startsWith("text-")) || "text-center"),
@@ -204,13 +214,12 @@
         }}
       />
     {/if}
-  {:else if !component.properties.bitMode && component.properties.type === "number" && !component.properties.readonly && !component.properties.disabled}
+  {:else if component.properties.type === "number" && !component.properties.readonly && !component.properties.disabled}
     <div class="flex">
       <UI.Input
         label={{ name: $t("constructor.props.min") }}
         value={component.properties.number.minNum as number}
         type="number"
-        readonly={component.properties.bitMode}
         onUpdate={(value) => {
           updateProperty("number.minNum", Number(value))
         }}
@@ -219,7 +228,6 @@
         label={{ name: $t("constructor.props.max") }}
         value={component.properties.number.maxNum as number}
         type="number"
-        readonly={component.properties.bitMode}
         onUpdate={(value) => {
           updateProperty("number.maxNum", Number(value))
         }}
@@ -228,10 +236,26 @@
         label={{ name: $t("constructor.props.step") }}
         value={component.properties.number.step as number}
         type="number"
-        readonly={component.properties.bitMode}
         onUpdate={(value) => updateProperty("number.step", Number(value))}
       />
     </div>
+  {:else if component.properties.type === "bitMode"}
+    <UI.Slider
+      label={{ name: $t("constructor.props.range") }}
+      type="range"
+      number={{ minNum: 0, maxNum: 31, step: 1 }}
+      value={[component.properties.range.start, component.properties.range.end]}
+      onUpdate={(value) => {
+        if (Array.isArray(value)) {
+          updateProperty("range.start", value[0] as number)
+          updateProperty("range.end", value[1] as number)
+          updateProperty("number.minNum", 0)
+          updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1)
+          updateProperty("number.step", 1)
+          updateProperty("help.info", `${$t("constructor.props.maxnum")}: ${component.properties.number.maxNum}`)
+        }
+      }}
+    />
   {/if}
 {/snippet}
 
@@ -252,46 +276,37 @@
 {/snippet}
 
 {#snippet InputSettings()}
-  <UI.Select
-    wrapperClass="mt-5"
-    options={$optionsStore.INPUT_SETTING_OPTIONS.map((o) => {
-      if (component.properties.type === "number" && o.value === "bitMode") return { ...o, disabled: false }
-      else if (component.properties.type === "password" && o.value == "help.copyButton") return { ...o, disabled: true }
-      else return o
-    })}
-    type="buttons"
-    multiSelect={true}
-    value={$optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => {
-      if (opt.value.split(".").reduce((o, key) => o?.[key], component.properties)) return opt
-    })}
-    onUpdate={(value) => {
-      const currentActiveValues = $optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => {
-        if (!opt?.value) return false
-        return opt.value.split(".").reduce((o, key) => o?.[key], component.properties)
-      }).map((opt) => opt.value)
-      if (Array.isArray(value)) {
-        value.forEach((opt) => {
-          updateProperty(opt.value ?? "", true)
-          if (opt.value === "bitMode") {
-            updateProperty("type", "number")
-            updateProperty("number.minNum", 0)
-            updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1)
-            updateProperty("number.step", 1)
-            updateProperty("help.info", `${$t("constructor.props.maxnum")}: ${component.properties.number.maxNum}`)
-          }
-        })
-
-        currentActiveValues.forEach((activeValue) => {
-          if (!value.some((opt) => opt?.value === activeValue)) {
-            updateProperty(activeValue, false)
-            if (activeValue === "bitMode") {
-              updateProperty("help.info", "")
+  {#if component.properties.type !== "bitMode"}
+    <UI.Select
+      wrapperClass="mt-5"
+      options={$optionsStore.INPUT_SETTING_OPTIONS.map((o) => {
+        if (component.properties.type === "password" && o.value == "help.copyButton") return { ...o, disabled: true }
+        else return o
+      })}
+      type="buttons"
+      multiSelect={true}
+      value={$optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => {
+        if (opt.value.split(".").reduce((o, key) => o?.[key], component.properties)) return opt
+      })}
+      onUpdate={(value) => {
+        const currentActiveValues = $optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => {
+          if (!opt?.value) return false
+          return opt.value.split(".").reduce((o, key) => o?.[key], component.properties)
+        }).map((opt) => opt.value)
+        if (Array.isArray(value)) {
+          value.forEach((opt) => {
+            updateProperty(opt.value ?? "", true)
+          })
+
+          currentActiveValues.forEach((activeValue) => {
+            if (!value.some((opt) => opt?.value === activeValue)) {
+              updateProperty(activeValue, false)
             }
-          }
-        })
-      }
-    }}
-  />
+          })
+        }
+      }}
+    />
+  {/if}
 {/snippet}
 
 {#snippet InputAutocomplete()}
@@ -355,27 +370,6 @@
   />
 {/snippet}
 
-{#snippet InputBitmode()}
-  {#if component.properties.bitMode}
-    <UI.Slider
-      label={{ name: $t("constructor.props.range") }}
-      type="range"
-      number={{ minNum: 0, maxNum: 31, step: 1 }}
-      value={[component.properties.range.start, component.properties.range.end]}
-      onUpdate={(value) => {
-        if (Array.isArray(value)) {
-          updateProperty("range.start", value[0] as number)
-          updateProperty("range.end", value[1] as number)
-          updateProperty("number.minNum", 0)
-          updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1)
-          updateProperty("number.step", 1)
-          updateProperty("help.info", `${$t("constructor.props.maxnum")}: ${component.properties.number.maxNum}`)
-        }
-      }}
-    />
-  {/if}
-{/snippet}
-
 {#if forConstructor}
   <div class="relative flex flex-row items-start justify-center">
     <div class="flex w-1/3 flex-col px-2">
@@ -387,7 +381,6 @@
       {@render InputPlaceholder()}
       {@render InputInfo()}
       {@render InputSettings()}
-      {@render InputBitmode()}
     </div>
     <div class="flex w-1/3 flex-col px-2">
       {@render InputLabel()}
@@ -416,10 +409,7 @@
       {@render InputInfo()}
       {@render InputAutocomplete()}
       {@render InputSettings()}
-      <div class="flex">
-        {@render InputDisabled()}
-        {@render InputBitmode()}
-      </div>
+      {@render InputDisabled()}
     </div>
   </div>
 {/if}

package/dist/Table/Table.svelte

@@ -447,18 +447,16 @@
                           >
                             {#if text?.modal}
                               <button
-                                class={twMerge("w-fit cursor-pointer text-left", text.class)}
+                                class="w-fit cursor-pointer text-left"
                                 onclick={(e) => {
                                   e.stopPropagation()
-                                  showModal(data, text?.formatting)
+                                  showModal(data.replace(/<[^>]*>/g, ""), text?.formatting)
                                 }}
                               >
-                                {data}
+                                {@html data}
                               </button>
                             {:else}
-                              <span class={text.class}>
-                                {data}
-                              </span>
+                              {@html data}
                             {/if}
                           </div>
 
@@ -467,7 +465,7 @@
                               class="mx-2 flex cursor-pointer border-none bg-transparent text-2xl"
                               onclick={(e) => {
                                 e.preventDefault()
-                                navigator.clipboard.writeText(row[text?.key ?? ""])
+                                navigator.clipboard.writeText(row[text?.key ?? ""].replace(/<[^>]*>/g, ""))
                                 copiedCell = { x: j, y: i }
                                 setTimeout(() => (copiedCell = null), 1000)
                               }}
@@ -514,7 +512,7 @@
         transition:fly={{ y: 10, duration: 200 }}
         role="tooltip"
       >
-        {@html tooltip.text}
+        {@html tooltip.text.replace(/<[^>]*>/g, "")}
       </div>
     {/if}
     <!-- Нижнее поле для сводной информации -->

package/dist/Widget/WidgetProps.svelte

@@ -60,7 +60,6 @@
     )}
     onUpdate={(option) => {
       updateProperty("icons.class", twMerge(component.properties.icons.class, (option as UI.IOption<string>).value), component, onPropertyChange)
-      console.log(component.properties)
     }}
   />
 {/snippet}

package/dist/locales/translations.js

@@ -31,6 +31,7 @@ const translations = {
         "constructor.props.type.password": "Пароль",
         "constructor.props.type.number": "Число",
         "constructor.props.type.textarea": "Область ",
+        "constructor.props.type.bitMode": "Битовый ",
         "constructor.props.type.single": "Простой",
         "constructor.props.type.range": "Диапазон",
         "constructor.props.type.small": "XS",

package/dist/options.d.ts

@@ -135,17 +135,11 @@ export declare const optionsStore: import("svelte/store").Readable<{
         value: string;
         name: string;
     }[];
-    INPUT_SETTING_OPTIONS: ({
+    INPUT_SETTING_OPTIONS: {
         id: string;
         value: string;
         name: string;
-        disabled?: undefined;
-    } | {
-        id: string;
-        value: string;
-        name: string;
-        disabled: boolean;
-    })[];
+    }[];
     BUFFER_SIZE_OPTIONS: {
         id: string;
         value: number;

package/dist/options.js

@@ -32,6 +32,7 @@ export const optionsStore = derived(t, ($t) => {
             { id: id(), value: "password", name: $t("constructor.props.type.password") },
             { id: id(), value: "number", name: $t("constructor.props.type.number") },
             { id: id(), value: "text-area", name: $t("constructor.props.type.textarea") },
+            { id: id(), value: "bitMode", name: $t("constructor.props.type.bitMode") },
         ],
         SELECT_TYPE_OPTIONS: [
             { id: id(), value: "select", name: $t("constructor.props.type.select") },
@@ -181,7 +182,6 @@ export const optionsStore = derived(t, ($t) => {
         INPUT_SETTING_OPTIONS: [
             { id: id(), value: "readonly", name: $t("constructor.props.readonly") },
             { id: id(), value: "help.copyButton", name: $t("constructor.props.copy") },
-            { id: id(), value: "bitMode", name: $t("constructor.props.bitMode"), disabled: true },
         ],
         BUFFER_SIZE_OPTIONS: [
             { id: id(), value: 10, name: "10" },

package/dist/types.d.ts

@@ -150,7 +150,7 @@ export interface IGraphProps {
 }
 export interface IInputProps {
     id?: string;
-    type?: "text" | "password" | "number" | "text-area";
+    type?: "text" | "password" | "number" | "text-area" | "bitMode";
     wrapperClass?: string;
     label?: {
         name?: string;
@@ -160,7 +160,6 @@ export interface IInputProps {
     disabled?: boolean;
     readonly?: boolean;
     value?: string | number;
-    bitMode?: boolean;
     range?: {
         start: number;
         end: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "poe-svelte-ui-lib",
-  "version": "1.9.14",
+  "version": "1.9.16",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -37,18 +37,18 @@
   },
   "devDependencies": {
     "@sveltejs/adapter-static": "^3.0.10",
-    "@sveltejs/kit": "^2.58.0",
+    "@sveltejs/kit": "^2.59.1",
     "@sveltejs/package": "^2.5.7",
-    "@sveltejs/vite-plugin-svelte": "^7.0.0",
+    "@sveltejs/vite-plugin-svelte": "^7.1.1",
     "@tailwindcss/vite": "^4.2.4",
     "@types/maplibre-gl": "^1.14.0",
     "@types/node": "^25.6.0",
-    "dompurify": "^3.4.1",
-    "marked": "^18.0.2",
+    "dompurify": "^3.4.2",
+    "marked": "^18.0.3",
     "prettier": "^3.8.3",
     "prettier-plugin-svelte": "^3.5.1",
     "prettier-plugin-tailwindcss": "^0.8.0",
-    "publint": "^0.3.18",
+    "publint": "^0.3.19",
     "svelte": "^5.55.5",
     "tailwindcss": "^4.2.4",
     "tsx": "^4.21.0",