poe-svelte-ui-lib 1.1.14 → 1.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
<!-- $lib/ElementsUI/ButtonProps.svelte -->
|
|
2
2
|
<script lang="ts">
|
|
3
3
|
import { t } from '../locales/i18n'
|
|
4
|
-
import { type UIComponent,
|
|
4
|
+
import { type UIComponent, updateProperty } from '../types'
|
|
5
5
|
import * as UI from '..'
|
|
6
|
-
import { getContext } from 'svelte'
|
|
7
6
|
import { optionsStore } from '../options'
|
|
8
7
|
import type { IFileInputProps } from './FileAttach.svelte'
|
|
9
8
|
|
|
@@ -44,6 +43,11 @@
|
|
|
44
43
|
/>
|
|
45
44
|
</div>
|
|
46
45
|
<div class="flex w-1/3 flex-col px-2">
|
|
46
|
+
<UI.Input
|
|
47
|
+
label={{ name: $t('constructor.props.file.accept') }}
|
|
48
|
+
value={component.properties.accept}
|
|
49
|
+
onUpdate={(value) => updateProperty('accept', value as string, component, onPropertyChange)}
|
|
50
|
+
/>
|
|
47
51
|
<UI.Select
|
|
48
52
|
label={{ name: $t('constructor.props.type') }}
|
|
49
53
|
type="buttons"
|
|
@@ -51,11 +55,7 @@
|
|
|
51
55
|
options={$optionsStore.FILE_ATTACH_TYPE_OPTIONS}
|
|
52
56
|
onUpdate={(option) => updateProperty('type', option.value as string, component, onPropertyChange)}
|
|
53
57
|
/>
|
|
54
|
-
|
|
55
|
-
label={{ name: $t('constructor.props.file.accept') }}
|
|
56
|
-
value={component.properties.accept}
|
|
57
|
-
onUpdate={(value) => updateProperty('accept', value as string, component, onPropertyChange)}
|
|
58
|
-
/>
|
|
58
|
+
|
|
59
59
|
{#if component.properties.type === 'image'}
|
|
60
60
|
<div class="flex gap-4">
|
|
61
61
|
<UI.Input
|
|
@@ -87,12 +87,5 @@
|
|
|
87
87
|
</div>
|
|
88
88
|
{/if}
|
|
89
89
|
</div>
|
|
90
|
-
<div class="flex w-1/3 flex-col px-2">
|
|
91
|
-
<UI.Input
|
|
92
|
-
label={{ name: $t('constructor.props.currentImage') }}
|
|
93
|
-
value={component.properties.currentImage}
|
|
94
|
-
onUpdate={(value) => updateProperty('currentImage', value as string, component, onPropertyChange)}
|
|
95
|
-
/>
|
|
96
|
-
</div>
|
|
97
90
|
</div>
|
|
98
91
|
{/if}
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
import { t } from '../locales/i18n'
|
|
4
4
|
import { type UIComponent, type IGraphProps, updateProperty } from '../types'
|
|
5
5
|
import * as UI from '..'
|
|
6
|
+
import ButtonAdd from '../libIcons/ButtonAdd.svelte'
|
|
7
|
+
import ButtonDelete from '../libIcons/ButtonDelete.svelte'
|
|
6
8
|
|
|
7
9
|
const {
|
|
8
10
|
component,
|
|
@@ -14,11 +16,13 @@
|
|
|
14
16
|
forConstructor?: boolean
|
|
15
17
|
}>()
|
|
16
18
|
|
|
19
|
+
console.log(component.properties.streamingData)
|
|
20
|
+
|
|
17
21
|
const DeviceVariables = getContext<{ id: string; value: string; name: string }[]>('DeviceVariables')
|
|
18
22
|
let VARIABLE_OPTIONS = $derived(DeviceVariables && Array.isArray(DeviceVariables) ? DeviceVariables : [])
|
|
19
23
|
</script>
|
|
20
24
|
|
|
21
|
-
{#if
|
|
25
|
+
{#if forConstructor}
|
|
22
26
|
<div class="relative flex flex-row items-start justify-center">
|
|
23
27
|
<!-- Сообщение для отправки в ws по нажатию кнопки -->
|
|
24
28
|
<div class="flex w-1/3 flex-col items-center px-2">
|
|
@@ -35,4 +39,83 @@
|
|
|
35
39
|
<div class="flex w-1/3 flex-col px-2"></div>
|
|
36
40
|
<div class="flex w-1/3 flex-col px-2"></div>
|
|
37
41
|
</div>
|
|
42
|
+
{:else}
|
|
43
|
+
<div class="relative mb-2 flex flex-row items-start justify-center">
|
|
44
|
+
<!-- Сообщение для отправки в ws по нажатию кнопки -->
|
|
45
|
+
<div class="flex w-1/3 flex-col items-center px-2">
|
|
46
|
+
<UI.Input
|
|
47
|
+
label={{ name: $t('constructor.props.id') }}
|
|
48
|
+
value={component.properties.id}
|
|
49
|
+
onUpdate={(value) => updateProperty('id', value as string, component, onPropertyChange)}
|
|
50
|
+
/>
|
|
51
|
+
<UI.Input
|
|
52
|
+
label={{ name: $t('constructor.props.wrapperclass') }}
|
|
53
|
+
value={component.properties.wrapperClass}
|
|
54
|
+
onUpdate={(value) => updateProperty('wrapperClass', value as string, component, onPropertyChange)}
|
|
55
|
+
/>
|
|
56
|
+
</div>
|
|
57
|
+
<div class="flex w-1/3 flex-col px-2">
|
|
58
|
+
<UI.Input
|
|
59
|
+
label={{ name: $t('constructor.props.label') }}
|
|
60
|
+
value={component.properties.label.name}
|
|
61
|
+
onUpdate={(value) => updateProperty('label.name', value as string, component, onPropertyChange)}
|
|
62
|
+
/>
|
|
63
|
+
<UI.Input
|
|
64
|
+
label={{ name: $t('constructor.props.label.class') }}
|
|
65
|
+
value={component.properties.label.class}
|
|
66
|
+
onUpdate={(value) => updateProperty('label.class', value as string, component, onPropertyChange)}
|
|
67
|
+
/>
|
|
68
|
+
</div>
|
|
69
|
+
|
|
70
|
+
<div class="flex w-1/3 flex-col px-2">
|
|
71
|
+
<UI.Switch
|
|
72
|
+
wrapperClass="bg-blue"
|
|
73
|
+
label={{ name: $t('constructor.props.istest') }}
|
|
74
|
+
value={component.properties.isTest ? 2 : 1}
|
|
75
|
+
onChange={(value) => updateProperty('isTest', value === 2, component, onPropertyChange)}
|
|
76
|
+
/>
|
|
77
|
+
</div>
|
|
78
|
+
</div>
|
|
79
|
+
<!-- <hr class="border-gray-400" />
|
|
80
|
+
<div class="space-y-4">
|
|
81
|
+
<div class="m-0 flex items-center justify-center gap-2">
|
|
82
|
+
<h4>{$t('constructor.props.graphdata.title')}</h4>
|
|
83
|
+
<UI.Button wrapperClass="w-8" content={{ icon: ButtonAdd }} />
|
|
84
|
+
</div>
|
|
85
|
+
|
|
86
|
+
{#each component.properties.streamingData.data || [] as option, index (option.name)}
|
|
87
|
+
<div class="m-0 flex items-end justify-around gap-2 border-gray-400">
|
|
88
|
+
<UI.Input
|
|
89
|
+
label={{ name: $t('constructor.props.optionname') }}
|
|
90
|
+
wrapperClass="!w-3/10"
|
|
91
|
+
value={option.name}
|
|
92
|
+
onUpdate={(value) => {
|
|
93
|
+
const options = [...(component.properties?.streamingData.data || [])]
|
|
94
|
+
options[index]['name'] = value as string
|
|
95
|
+
updateProperty('streamingData.data', options, component, onPropertyChange)
|
|
96
|
+
}}
|
|
97
|
+
/>
|
|
98
|
+
<UI.Input
|
|
99
|
+
label={{ name: $t('constructor.props.optionvalue') }}
|
|
100
|
+
wrapperClass="!w-3/10"
|
|
101
|
+
type="number"
|
|
102
|
+
value={option.value}
|
|
103
|
+
onUpdate={(value) => {
|
|
104
|
+
const options = [...(component.properties?.streamingData.data || [])]
|
|
105
|
+
options[index]['value'] = value as number
|
|
106
|
+
updateProperty('streamingData.data', options, component, onPropertyChange)
|
|
107
|
+
}}
|
|
108
|
+
/>
|
|
109
|
+
<UI.Button
|
|
110
|
+
wrapperClass="w-8"
|
|
111
|
+
content={{ icon: ButtonDelete }}
|
|
112
|
+
onClick={() => {
|
|
113
|
+
const options = [...(component.properties?.streamingData.data || [])]
|
|
114
|
+
options.splice(index, 1)
|
|
115
|
+
updateProperty('streamingData.data', options, component, onPropertyChange)
|
|
116
|
+
}}
|
|
117
|
+
/>
|
|
118
|
+
</div>
|
|
119
|
+
{/each}
|
|
120
|
+
</div> -->
|
|
38
121
|
{/if}
|
package/dist/Modal.svelte
CHANGED
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
</script>
|
|
35
35
|
|
|
36
36
|
{#if isOpen}
|
|
37
|
-
<div class="fixed inset-0 z-
|
|
37
|
+
<div class="fixed inset-0 z-60 flex items-center justify-center bg-black/50" transition:fade={{ duration: 200 }}>
|
|
38
38
|
<div
|
|
39
39
|
class={twMerge(`flex w-300 flex-col overflow-hidden rounded-2xl bg-[var(--back-color)] text-center`, wrapperClass)}
|
|
40
40
|
transition:scale={{ duration: 250, start: 0.8 }}
|
package/dist/Table/Table.svelte
CHANGED
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
import type { ITableHeader, ITableProps } from '../types'
|
|
5
5
|
import { fly } from 'svelte/transition'
|
|
6
6
|
import { twMerge } from 'tailwind-merge'
|
|
7
|
-
import { Button, Modal } from '..'
|
|
8
|
-
import { t } from '../locales/i18n'
|
|
9
7
|
|
|
10
8
|
let {
|
|
11
9
|
id = crypto.randomUUID(),
|
|
@@ -17,11 +15,10 @@
|
|
|
17
15
|
cursor = null,
|
|
18
16
|
loader,
|
|
19
17
|
getData = () => {},
|
|
18
|
+
modalData = $bindable(),
|
|
20
19
|
onClick,
|
|
21
20
|
}: ITableProps<any> = $props()
|
|
22
21
|
|
|
23
|
-
let modalData = $state({ isOpen: false, rawData: '', formattedData: '' })
|
|
24
|
-
|
|
25
22
|
/* Сортировка */
|
|
26
23
|
let sortState: {
|
|
27
24
|
key: string | null
|
|
@@ -100,6 +97,7 @@
|
|
|
100
97
|
rawData: text,
|
|
101
98
|
formattedData: formatting ? formatting(text) : (text ?? ''),
|
|
102
99
|
}
|
|
100
|
+
// console.log(modalData)
|
|
103
101
|
}
|
|
104
102
|
|
|
105
103
|
const showTooltip = (event: MouseEvent, text: string, formatting?: (text: string) => string) => {
|
|
@@ -274,19 +272,3 @@
|
|
|
274
272
|
{/if}
|
|
275
273
|
</div>
|
|
276
274
|
</div>
|
|
277
|
-
|
|
278
|
-
<Modal isOpen={modalData.isOpen} title={$t('debug.baud_rate_data')}>
|
|
279
|
-
{#snippet main()}
|
|
280
|
-
{@html modalData.formattedData}
|
|
281
|
-
{/snippet}
|
|
282
|
-
{#snippet footer()}
|
|
283
|
-
<Button
|
|
284
|
-
content={{ name: 'Copy' }}
|
|
285
|
-
wrapperClass="w-20 bg-pink"
|
|
286
|
-
onClick={() => {
|
|
287
|
-
navigator.clipboard.writeText(modalData.rawData)
|
|
288
|
-
modalData.isOpen = false
|
|
289
|
-
}}
|
|
290
|
-
/>
|
|
291
|
-
{/snippet}
|
|
292
|
-
</Modal>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { ITableProps } from '../types';
|
|
2
|
-
declare const Table: import("svelte").Component<ITableProps<any>, {}, "">;
|
|
2
|
+
declare const Table: import("svelte").Component<ITableProps<any>, {}, "modalData">;
|
|
3
3
|
type Table = ReturnType<typeof Table>;
|
|
4
4
|
export default Table;
|
|
@@ -79,8 +79,10 @@ const translations = {
|
|
|
79
79
|
'constructor.props.info': 'Подсказка',
|
|
80
80
|
'constructor.props.disabled': 'Отключить',
|
|
81
81
|
'constructor.props.readonly': 'Только для чтения',
|
|
82
|
+
'constructor.props.istest': 'Тестовые данные',
|
|
82
83
|
'constructor.props.variable': 'Имя переменной',
|
|
83
84
|
'constructor.props.widthMode': 'Ширина кнопок',
|
|
85
|
+
'constructor.props.graphdata.title': 'Начальные данные',
|
|
84
86
|
'constructor.props.options.title': 'Опции компонента',
|
|
85
87
|
'constructor.props.valuetype': 'Тип значения',
|
|
86
88
|
'constructor.props.action': 'Действие при переключении',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "poe-svelte-ui-lib",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.15",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@sveltejs/adapter-static": "^3.0.10",
|
|
36
|
-
"@tailwindcss/vite": "^4.1.
|
|
36
|
+
"@tailwindcss/vite": "^4.1.15",
|
|
37
37
|
"prettier": "^3.6.2",
|
|
38
38
|
"prettier-plugin-svelte": "^3.4.0",
|
|
39
39
|
"prettier-plugin-tailwindcss": "^0.7.1",
|
|
40
40
|
"tailwind-merge": "^3.3.1",
|
|
41
|
-
"tailwindcss": "^4.1.
|
|
41
|
+
"tailwindcss": "^4.1.15",
|
|
42
42
|
"tsx": "^4.20.6",
|
|
43
43
|
"typescript": "^5.9.3"
|
|
44
44
|
},
|
|
@@ -46,9 +46,9 @@
|
|
|
46
46
|
"@sveltejs/kit": "^2.47.2",
|
|
47
47
|
"@sveltejs/package": "^2.5.4",
|
|
48
48
|
"@sveltejs/vite-plugin-svelte": "^6.2.1",
|
|
49
|
-
"@types/node": "^24.
|
|
50
|
-
"publint": "^0.3.
|
|
51
|
-
"svelte": "^5.41.
|
|
49
|
+
"@types/node": "^24.9.1",
|
|
50
|
+
"publint": "^0.3.15",
|
|
51
|
+
"svelte": "^5.41.1",
|
|
52
52
|
"svelte-preprocess": "^6.0.3",
|
|
53
53
|
"vite": "^7.1.11",
|
|
54
54
|
"vite-plugin-compression": "^0.5.1"
|