poe-svelte-ui-lib 1.1.12 → 1.1.14
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.
- package/dist/Accordion/AccordionProps.svelte +26 -21
- package/dist/Button/ButtonProps.svelte +11 -9
- package/dist/ColorPicker/ColorPickerProps.svelte +27 -11
- package/dist/ComponentExample.svelte +2 -1
- package/dist/{FileAttach.svelte → FileAttach/FileAttach.svelte} +2 -1
- package/dist/FileAttach/FileAttachProps.svelte +98 -0
- package/dist/FileAttach/FileAttachProps.svelte.d.ts +12 -0
- package/dist/Graph/GraphProps.svelte +1 -1
- package/dist/Input/InputProps.svelte +1 -1
- package/dist/ProgressBar/ProgressBarProps.svelte +1 -1
- package/dist/Select/SelectProps.svelte +1 -1
- package/dist/Slider/SliderProps.svelte +1 -1
- package/dist/Switch/SwitchProps.svelte +1 -1
- package/dist/Table/TableProps.svelte +1 -1
- package/dist/TextField/TextFieldProps.svelte +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/locales/translations.js +11 -0
- package/dist/options.d.ts +15 -0
- package/dist/options.js +12 -0
- package/dist/types.d.ts +4 -3
- package/package.json +5 -5
- /package/dist/{FileAttach.svelte.d.ts → FileAttach/FileAttach.svelte.d.ts} +0 -0
|
@@ -116,14 +116,16 @@
|
|
|
116
116
|
bind:currentImage
|
|
117
117
|
onChange={handleImageUpload}
|
|
118
118
|
/>
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
119
|
+
{#if currentImage}
|
|
120
|
+
<Button
|
|
121
|
+
wrapperClass="w-8.5 mt-6"
|
|
122
|
+
componentClass="p-0.5 bg-red"
|
|
123
|
+
content={{ icon: CrossIcon }}
|
|
124
|
+
onClick={() => {
|
|
125
|
+
updateProperty('image', '', component, onPropertyChange)
|
|
126
|
+
}}
|
|
127
|
+
/>
|
|
128
|
+
{/if}
|
|
127
129
|
</div>
|
|
128
130
|
</div>
|
|
129
131
|
</div>
|
|
@@ -166,6 +168,11 @@
|
|
|
166
168
|
/>
|
|
167
169
|
</div>
|
|
168
170
|
<div class="flex w-1/3 flex-col items-center px-2">
|
|
171
|
+
<UI.Input
|
|
172
|
+
label={{ name: $t('constructor.props.wrapperclass') }}
|
|
173
|
+
value={component.properties.wrapperClass}
|
|
174
|
+
onUpdate={(value) => updateProperty('wrapperClass', value as string, component, onPropertyChange)}
|
|
175
|
+
/>
|
|
169
176
|
<div class="relative mt-5 flex w-full gap-2">
|
|
170
177
|
<UI.Button content={{ name: 'Иконка заголовка' }} onClick={() => (showIconLib = true)} />
|
|
171
178
|
{#if showIconLib}
|
|
@@ -203,11 +210,7 @@
|
|
|
203
210
|
/>
|
|
204
211
|
{/if}
|
|
205
212
|
</div>
|
|
206
|
-
|
|
207
|
-
label={{ name: $t('constructor.props.wrapperclass') }}
|
|
208
|
-
value={component.properties.wrapperClass}
|
|
209
|
-
onUpdate={(value) => updateProperty('wrapperClass', value as string, component, onPropertyChange)}
|
|
210
|
-
/>
|
|
213
|
+
|
|
211
214
|
<UI.Input
|
|
212
215
|
label={{ name: $t('constructor.props.label') }}
|
|
213
216
|
value={component.properties.label.name}
|
|
@@ -228,14 +231,16 @@
|
|
|
228
231
|
bind:currentImage
|
|
229
232
|
onChange={handleImageUpload}
|
|
230
233
|
/>
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
234
|
+
{#if currentImage}
|
|
235
|
+
<Button
|
|
236
|
+
wrapperClass="w-8.5 mt-6"
|
|
237
|
+
componentClass="p-0.5 bg-red"
|
|
238
|
+
content={{ icon: CrossIcon }}
|
|
239
|
+
onClick={() => {
|
|
240
|
+
updateProperty('image', '', component, onPropertyChange)
|
|
241
|
+
}}
|
|
242
|
+
/>
|
|
243
|
+
{/if}
|
|
239
244
|
</div>
|
|
240
245
|
</div>
|
|
241
246
|
</div>
|
|
@@ -65,16 +65,18 @@
|
|
|
65
65
|
updateProperty('eventHandler.Argument', option.value as string, component, onPropertyChange)
|
|
66
66
|
}}
|
|
67
67
|
/>
|
|
68
|
-
|
|
69
|
-
<UI.Input
|
|
70
|
-
wrapperClass="{Header.value === 'SET' ? 'mt-1' : ''} "
|
|
71
|
-
value={component.properties.eventHandler.Argument}
|
|
72
|
-
maxlength={32}
|
|
73
|
-
disabled={component.properties.eventHandler.Argument == 'Save' || component.properties.eventHandler.Argument == 'NoSave'}
|
|
74
|
-
help={{ info: $t('constructor.props.argument.info'), autocomplete: 'on', regExp: /^[a-zA-Z0-9\-_]{0,32}$/ }}
|
|
75
|
-
onUpdate={(value) => updateProperty('eventHandler.Argument', value as string, component, onPropertyChange)}
|
|
76
|
-
/>
|
|
77
68
|
{/if}
|
|
69
|
+
<UI.Input
|
|
70
|
+
label={{ name: Header.value !== 'SET' ? $t('constructor.props.argument') : '' }}
|
|
71
|
+
wrapperClass="{Header.value === 'SET' ? 'mt-1' : ''} "
|
|
72
|
+
value={component.properties.eventHandler.Argument}
|
|
73
|
+
maxlength={32}
|
|
74
|
+
disabled={Header.value === 'SET' &&
|
|
75
|
+
(component.properties.eventHandler.Argument == 'Save' || component.properties.eventHandler.Argument == 'NoSave')}
|
|
76
|
+
help={{ info: $t('constructor.props.argument.info'), autocomplete: 'on', regExp: /^[a-zA-Z0-9\-_]{0,32}$/ }}
|
|
77
|
+
onUpdate={(value) => updateProperty('eventHandler.Argument', value as string, component, onPropertyChange)}
|
|
78
|
+
/>
|
|
79
|
+
|
|
78
80
|
{#if (component.properties.eventHandler.Argument !== 'Save' && component.properties.eventHandler.Argument !== 'NoSave') || Header.value !== 'SET'}
|
|
79
81
|
<UI.Input
|
|
80
82
|
label={{ name: $t('constructor.props.value') }}
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
options={VARIABLE_OPTIONS}
|
|
36
36
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
37
37
|
onUpdate={(value) => {
|
|
38
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
38
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
39
39
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
40
40
|
}}
|
|
41
41
|
/>
|
|
@@ -93,16 +93,32 @@
|
|
|
93
93
|
</div>
|
|
94
94
|
<div class="flex w-1/3 flex-col px-2">
|
|
95
95
|
<UI.TextField content={{ name: $t('constructor.props.defaultcolor'), class: 'font-bold' }} />
|
|
96
|
-
<
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
96
|
+
<div class="flex items-center gap-3">
|
|
97
|
+
<UI.TextField wrapperClass="w-4" content={{ name: 'R', class: 'font-bold' }} />
|
|
98
|
+
<UI.Input
|
|
99
|
+
value={component.properties.value[0]}
|
|
100
|
+
type="number"
|
|
101
|
+
number={{ minNum: 0, maxNum: 255, step: 1 }}
|
|
102
|
+
onUpdate={(value) =>
|
|
103
|
+
updateProperty('value', [value as number, component.properties.value[1], component.properties.value[2]], component, onPropertyChange)}
|
|
104
|
+
/>
|
|
105
|
+
<UI.TextField wrapperClass="w-4" content={{ name: 'G', class: 'font-bold' }} />
|
|
106
|
+
<UI.Input
|
|
107
|
+
value={component.properties.value[1]}
|
|
108
|
+
type="number"
|
|
109
|
+
number={{ minNum: 0, maxNum: 255, step: 1 }}
|
|
110
|
+
onUpdate={(value) =>
|
|
111
|
+
updateProperty('value', [component.properties.value[0], value as number, component.properties.value[2]], component, onPropertyChange)}
|
|
112
|
+
/>
|
|
113
|
+
<UI.TextField wrapperClass="w-4" content={{ name: 'B', class: 'font-bold' }} />
|
|
114
|
+
<UI.Input
|
|
115
|
+
value={component.properties.value[2]}
|
|
116
|
+
type="number"
|
|
117
|
+
number={{ minNum: 0, maxNum: 255, step: 1 }}
|
|
118
|
+
onUpdate={(value) =>
|
|
119
|
+
updateProperty('value', [component.properties.value[0], component.properties.value[1], value as number], component, onPropertyChange)}
|
|
120
|
+
/>
|
|
121
|
+
</div>
|
|
106
122
|
</div>
|
|
107
123
|
</div>
|
|
108
124
|
{/if}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import * as UI from './'
|
|
3
3
|
import type { Snippet } from 'svelte'
|
|
4
4
|
import CopyButton from './libIcons/CopyButton.svelte'
|
|
5
|
+
import { fade, fly, slide } from 'svelte/transition'
|
|
5
6
|
|
|
6
7
|
let { component, componentProps, codeText }: { component: Snippet; componentProps: Snippet; codeText: string } = $props()
|
|
7
8
|
|
|
@@ -13,7 +14,7 @@
|
|
|
13
14
|
{@render component()}
|
|
14
15
|
</div>
|
|
15
16
|
<div class=" border-t border-gray-500"></div>
|
|
16
|
-
<div class="h-fit">
|
|
17
|
+
<div class="h-fit" transition:fade={{ duration: 200 }}>
|
|
17
18
|
{@render componentProps()}
|
|
18
19
|
<div class="relative mt-3">
|
|
19
20
|
<UI.Button
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
accept = '*/*',
|
|
22
22
|
imageSize = { height: '10rem', width: '10rem', fitMode: 'cover', form: 'square' },
|
|
23
23
|
disabled = false,
|
|
24
|
-
currentImage = $bindable(
|
|
24
|
+
currentImage = $bindable(''),
|
|
25
25
|
onChange = () => {},
|
|
26
26
|
}: IFileInputProps = $props()
|
|
27
27
|
|
|
@@ -41,6 +41,7 @@
|
|
|
41
41
|
if (file.type.startsWith('image/')) previewUrl = URL.createObjectURL(file)
|
|
42
42
|
|
|
43
43
|
onChange(event, file)
|
|
44
|
+
// console.log('!!! curr:', currentImage, 'prev:', previewUrl)
|
|
44
45
|
}
|
|
45
46
|
|
|
46
47
|
const triggerFileInput = () => {
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
<!-- $lib/ElementsUI/ButtonProps.svelte -->
|
|
2
|
+
<script lang="ts">
|
|
3
|
+
import { t } from '../locales/i18n'
|
|
4
|
+
import { type UIComponent, type IColorPickerProps, updateProperty } from '../types'
|
|
5
|
+
import * as UI from '..'
|
|
6
|
+
import { getContext } from 'svelte'
|
|
7
|
+
import { optionsStore } from '../options'
|
|
8
|
+
import type { IFileInputProps } from './FileAttach.svelte'
|
|
9
|
+
|
|
10
|
+
const {
|
|
11
|
+
component,
|
|
12
|
+
onPropertyChange,
|
|
13
|
+
forConstructor = true,
|
|
14
|
+
} = $props<{
|
|
15
|
+
component: UIComponent & { properties: Partial<IFileInputProps> }
|
|
16
|
+
onPropertyChange: (value: string | object, name?: string) => void
|
|
17
|
+
forConstructor?: boolean
|
|
18
|
+
}>()
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
{#if !forConstructor}
|
|
22
|
+
<div class="relative flex flex-row items-start justify-center">
|
|
23
|
+
<!-- Сообщение для отправки в ws по нажатию кнопки -->
|
|
24
|
+
<div class="flex w-1/3 flex-col items-center px-2">
|
|
25
|
+
<UI.Input
|
|
26
|
+
label={{ name: $t('constructor.props.id') }}
|
|
27
|
+
value={component.properties.id}
|
|
28
|
+
onUpdate={(value) => updateProperty('id', value as string, component, onPropertyChange)}
|
|
29
|
+
/>
|
|
30
|
+
<UI.Input
|
|
31
|
+
label={{ name: $t('constructor.props.wrapperclass') }}
|
|
32
|
+
value={component.properties.wrapperClass}
|
|
33
|
+
onUpdate={(value) => updateProperty('wrapperClass', value as string, component, onPropertyChange)}
|
|
34
|
+
/>
|
|
35
|
+
<UI.Input
|
|
36
|
+
label={{ name: $t('constructor.props.label') }}
|
|
37
|
+
value={component.properties.label.name}
|
|
38
|
+
onUpdate={(value) => updateProperty('label.name', value as string, component, onPropertyChange)}
|
|
39
|
+
/>
|
|
40
|
+
<UI.Input
|
|
41
|
+
label={{ name: $t('constructor.props.label.class') }}
|
|
42
|
+
value={component.properties.label.class}
|
|
43
|
+
onUpdate={(value) => updateProperty('label.class', value as string, component, onPropertyChange)}
|
|
44
|
+
/>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="flex w-1/3 flex-col px-2">
|
|
47
|
+
<UI.Select
|
|
48
|
+
label={{ name: $t('constructor.props.type') }}
|
|
49
|
+
type="buttons"
|
|
50
|
+
value={$optionsStore.FILE_ATTACH_TYPE_OPTIONS.find((c) => (c.value as string).includes(component.properties.type))}
|
|
51
|
+
options={$optionsStore.FILE_ATTACH_TYPE_OPTIONS}
|
|
52
|
+
onUpdate={(option) => updateProperty('type', option.value as string, component, onPropertyChange)}
|
|
53
|
+
/>
|
|
54
|
+
<UI.Input
|
|
55
|
+
label={{ name: $t('constructor.props.file.accept') }}
|
|
56
|
+
value={component.properties.accept}
|
|
57
|
+
onUpdate={(value) => updateProperty('accept', value as string, component, onPropertyChange)}
|
|
58
|
+
/>
|
|
59
|
+
{#if component.properties.type === 'image'}
|
|
60
|
+
<div class="flex gap-4">
|
|
61
|
+
<UI.Input
|
|
62
|
+
label={{ name: $t('constructor.props.imageSize.height') }}
|
|
63
|
+
value={component.properties.imageSize.height}
|
|
64
|
+
onUpdate={(value) => updateProperty('imageSize.height', value as string, component, onPropertyChange)}
|
|
65
|
+
/>
|
|
66
|
+
<UI.Input
|
|
67
|
+
label={{ name: $t('constructor.props.imageSize.width') }}
|
|
68
|
+
value={component.properties.imageSize.width}
|
|
69
|
+
onUpdate={(value) => updateProperty('imageSize.width', value as string, component, onPropertyChange)}
|
|
70
|
+
/>
|
|
71
|
+
</div>
|
|
72
|
+
<div class="flex gap-4">
|
|
73
|
+
<UI.Select
|
|
74
|
+
label={{ name: $t('constructor.props.fitmode') }}
|
|
75
|
+
type="buttons"
|
|
76
|
+
value={$optionsStore.FITMODE_OPTIONS.find((c) => (c.value as string).includes(component.properties.imageSize.fitMode))}
|
|
77
|
+
options={$optionsStore.FITMODE_OPTIONS}
|
|
78
|
+
onUpdate={(option) => updateProperty('imageSize.fitMode', option.value as string, component, onPropertyChange)}
|
|
79
|
+
/>
|
|
80
|
+
<UI.Select
|
|
81
|
+
label={{ name: $t('constructor.props.form') }}
|
|
82
|
+
type="buttons"
|
|
83
|
+
value={$optionsStore.FORM_OPTIONS.find((c) => (c.value as string).includes(component.properties.imageSize.form))}
|
|
84
|
+
options={$optionsStore.FORM_OPTIONS}
|
|
85
|
+
onUpdate={(option) => updateProperty('imageSize.form', option.value as string, component, onPropertyChange)}
|
|
86
|
+
/>
|
|
87
|
+
</div>
|
|
88
|
+
{/if}
|
|
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
|
+
</div>
|
|
98
|
+
{/if}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { type UIComponent } from '../types';
|
|
2
|
+
import type { IFileInputProps } from './FileAttach.svelte';
|
|
3
|
+
type $$ComponentProps = {
|
|
4
|
+
component: UIComponent & {
|
|
5
|
+
properties: Partial<IFileInputProps>;
|
|
6
|
+
};
|
|
7
|
+
onPropertyChange: (value: string | object, name?: string) => void;
|
|
8
|
+
forConstructor?: boolean;
|
|
9
|
+
};
|
|
10
|
+
declare const FileAttachProps: import("svelte").Component<$$ComponentProps, {}, "">;
|
|
11
|
+
type FileAttachProps = ReturnType<typeof FileAttachProps>;
|
|
12
|
+
export default FileAttachProps;
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
options={VARIABLE_OPTIONS}
|
|
28
28
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
29
29
|
onUpdate={(value) => {
|
|
30
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
30
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
31
31
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
32
32
|
}}
|
|
33
33
|
/>
|
|
@@ -96,7 +96,7 @@
|
|
|
96
96
|
options={VARIABLE_OPTIONS}
|
|
97
97
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
98
98
|
onUpdate={(value) => {
|
|
99
|
-
updateProperty('id', value.value as string, value.name?.split('
|
|
99
|
+
updateProperty('id', value.value as string, value.name?.split('—')[1].trim())
|
|
100
100
|
updateProperty('eventHandler.Variables', value.value as string)
|
|
101
101
|
}}
|
|
102
102
|
/>
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
options={VARIABLE_OPTIONS}
|
|
41
41
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
42
42
|
onUpdate={(value) => {
|
|
43
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
43
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
44
44
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
45
45
|
}}
|
|
46
46
|
/>
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
options={VARIABLE_OPTIONS}
|
|
68
68
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
69
69
|
onUpdate={(value) => {
|
|
70
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
70
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
71
71
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
72
72
|
}}
|
|
73
73
|
/>
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
options={VARIABLE_OPTIONS}
|
|
41
41
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
42
42
|
onUpdate={(value) => {
|
|
43
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
43
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
44
44
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
45
45
|
}}
|
|
46
46
|
/>
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
options={VARIABLE_OPTIONS}
|
|
35
35
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
36
36
|
onUpdate={(value) => {
|
|
37
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
37
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
38
38
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
39
39
|
}}
|
|
40
40
|
/>
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
options={VARIABLE_OPTIONS}
|
|
76
76
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
77
77
|
onUpdate={(value) => {
|
|
78
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
78
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
79
79
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
80
80
|
}}
|
|
81
81
|
/>
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
options={VARIABLE_OPTIONS}
|
|
43
43
|
value={VARIABLE_OPTIONS.find((opt) => opt.value === component.properties.id)}
|
|
44
44
|
onUpdate={(value) => {
|
|
45
|
-
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('
|
|
45
|
+
updateProperty('id', value.value as string, component, onPropertyChange, value.name?.split('—')[1].trim())
|
|
46
46
|
updateProperty('eventHandler.Variables', value.value as string, component, onPropertyChange)
|
|
47
47
|
}}
|
|
48
48
|
/>
|
package/dist/index.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ export { default as Button } from './Button/Button.svelte';
|
|
|
4
4
|
export { default as ButtonProps } from './Button/ButtonProps.svelte';
|
|
5
5
|
export { default as ColorPicker } from './ColorPicker/ColorPicker.svelte';
|
|
6
6
|
export { default as ColorPickerProps } from './ColorPicker/ColorPickerProps.svelte';
|
|
7
|
-
export { default as FileAttach } from './FileAttach.svelte';
|
|
7
|
+
export { default as FileAttach } from './FileAttach/FileAttach.svelte';
|
|
8
8
|
export { default as Graph } from './Graph/Graph.svelte';
|
|
9
9
|
export { default as GraphProps } from './Graph/GraphProps.svelte';
|
|
10
10
|
export { default as Input } from './Input/Input.svelte';
|
package/dist/index.js
CHANGED
|
@@ -5,7 +5,7 @@ export { default as Button } from './Button/Button.svelte';
|
|
|
5
5
|
export { default as ButtonProps } from './Button/ButtonProps.svelte';
|
|
6
6
|
export { default as ColorPicker } from './ColorPicker/ColorPicker.svelte';
|
|
7
7
|
export { default as ColorPickerProps } from './ColorPicker/ColorPickerProps.svelte';
|
|
8
|
-
export { default as FileAttach } from './FileAttach.svelte';
|
|
8
|
+
export { default as FileAttach } from './FileAttach/FileAttach.svelte';
|
|
9
9
|
export { default as Graph } from './Graph/Graph.svelte';
|
|
10
10
|
export { default as GraphProps } from './Graph/GraphProps.svelte';
|
|
11
11
|
export { default as Input } from './Input/Input.svelte';
|
|
@@ -31,6 +31,12 @@ const translations = {
|
|
|
31
31
|
'constructor.props.type.selectput': 'Список+ввод',
|
|
32
32
|
'constructor.props.valuetype.text': 'Строка',
|
|
33
33
|
'constructor.props.valuetype.number': 'Число',
|
|
34
|
+
'constructor.props.type.file': 'Файл',
|
|
35
|
+
'constructor.props.type.image': 'Изображение',
|
|
36
|
+
'constructor.props.type.cover': 'Урезанный',
|
|
37
|
+
'constructor.props.type.contain': 'Полный',
|
|
38
|
+
'constructor.props.type.square': 'Квадрат',
|
|
39
|
+
'constructor.props.type.circle': 'Круг',
|
|
34
40
|
/* Общие для редактора свойств */
|
|
35
41
|
'constructor.props.id': 'Идентификатор',
|
|
36
42
|
'constructor.props.label': 'Текст надписи',
|
|
@@ -40,6 +46,11 @@ const translations = {
|
|
|
40
46
|
'constructor.props.svgicon': 'SVG-иконка (строка)',
|
|
41
47
|
'constructor.props.open': 'Разворачивание',
|
|
42
48
|
'constructor.props.defaultcolor': 'Первоначальный цвет',
|
|
49
|
+
'constructor.props.file.accept': 'Допустимые файлы',
|
|
50
|
+
'constructor.props.imageSize.height': 'Высота',
|
|
51
|
+
'constructor.props.imageSize.width': 'Ширина',
|
|
52
|
+
'constructor.props.fitmode': 'Вид',
|
|
53
|
+
'constructor.props.form': 'Форма',
|
|
43
54
|
'constructor.props.type': 'Тип',
|
|
44
55
|
'constructor.props.size': 'Размер',
|
|
45
56
|
'constructor.props.header': 'Заголовок пакета',
|
package/dist/options.d.ts
CHANGED
|
@@ -70,4 +70,19 @@ export declare const optionsStore: import("svelte/store").Readable<{
|
|
|
70
70
|
value: boolean;
|
|
71
71
|
name: string;
|
|
72
72
|
}[];
|
|
73
|
+
FILE_ATTACH_TYPE_OPTIONS: {
|
|
74
|
+
id: string;
|
|
75
|
+
value: string;
|
|
76
|
+
name: string;
|
|
77
|
+
}[];
|
|
78
|
+
FITMODE_OPTIONS: {
|
|
79
|
+
id: string;
|
|
80
|
+
value: string;
|
|
81
|
+
name: string;
|
|
82
|
+
}[];
|
|
83
|
+
FORM_OPTIONS: {
|
|
84
|
+
id: string;
|
|
85
|
+
value: string;
|
|
86
|
+
name: string;
|
|
87
|
+
}[];
|
|
73
88
|
}>;
|
package/dist/options.js
CHANGED
|
@@ -80,5 +80,17 @@ export const optionsStore = derived(t, ($t) => {
|
|
|
80
80
|
{ id: id(), value: false, name: $t('constructor.props.type.main') },
|
|
81
81
|
{ id: id(), value: true, name: $t('constructor.props.type.sub') },
|
|
82
82
|
],
|
|
83
|
+
FILE_ATTACH_TYPE_OPTIONS: [
|
|
84
|
+
{ id: id(), value: 'file', name: $t('constructor.props.type.file') },
|
|
85
|
+
{ id: id(), value: 'image', name: $t('constructor.props.type.image') },
|
|
86
|
+
],
|
|
87
|
+
FITMODE_OPTIONS: [
|
|
88
|
+
{ id: id(), value: 'cover', name: $t('constructor.props.type.cover') },
|
|
89
|
+
{ id: id(), value: 'contain', name: $t('constructor.props.type.contain') },
|
|
90
|
+
],
|
|
91
|
+
FORM_OPTIONS: [
|
|
92
|
+
{ id: id(), value: 'square', name: $t('constructor.props.type.square') },
|
|
93
|
+
{ id: id(), value: 'circle', name: $t('constructor.props.type.circle') },
|
|
94
|
+
],
|
|
83
95
|
};
|
|
84
96
|
});
|
package/dist/types.d.ts
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
import type { Component, Snippet } from 'svelte';
|
|
2
2
|
import type { Writable } from 'svelte/store';
|
|
3
|
+
import type { IFileInputProps } from './FileAttach/FileAttach.svelte';
|
|
3
4
|
export declare const updateProperty: (path: string, value: string | number | boolean | object | string[], component: UIComponent & {
|
|
4
5
|
properties: Partial<UIComponent["properties"]>;
|
|
5
6
|
}, onPropertyChange: (value: string | object, name?: string) => void, name?: string) => void;
|
|
6
7
|
export interface UIComponent {
|
|
7
8
|
id: string;
|
|
8
9
|
name?: string;
|
|
9
|
-
type: 'Button' | 'Accordion' | 'Input' | 'Select' | 'Switch' | 'ColorPicker' | 'Slider' | 'TextField' | 'ProgressBar' | 'Graph' | 'Table';
|
|
10
|
-
component: Component<IButtonProps> | Component<IInputProps> | Component<ISelectProps> | Component<ISwitchProps> | Component<IColorPickerProps> | Component<ISliderProps> | Component<ITextFieldProps> | Component<IProgressBarProps> | Component<IGraphProps> | Component<ITableProps<object>> | null;
|
|
11
|
-
properties: IAccordionProps | IButtonProps | IInputProps | ISelectProps | ISwitchProps | IColorPickerProps | ISliderProps | ITextFieldProps | IProgressBarProps | IGraphProps | ITableProps<object
|
|
10
|
+
type: 'Button' | 'Accordion' | 'Input' | 'Select' | 'Switch' | 'ColorPicker' | 'Slider' | 'TextField' | 'ProgressBar' | 'Graph' | 'Table' | 'FileAttach';
|
|
11
|
+
component: Component<IButtonProps> | Component<IInputProps> | Component<ISelectProps> | Component<ISwitchProps> | Component<IColorPickerProps> | Component<ISliderProps> | Component<ITextFieldProps> | Component<IProgressBarProps> | Component<IGraphProps> | Component<ITableProps<object>> | Component<IFileInputProps> | null;
|
|
12
|
+
properties: IAccordionProps | IButtonProps | IInputProps | ISelectProps | ISwitchProps | IColorPickerProps | ISliderProps | ITextFieldProps | IProgressBarProps | IGraphProps | ITableProps<object> | IFileInputProps;
|
|
12
13
|
position: Position;
|
|
13
14
|
parentId: string;
|
|
14
15
|
}
|
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.14",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -36,21 +36,21 @@
|
|
|
36
36
|
"@tailwindcss/vite": "^4.1.14",
|
|
37
37
|
"prettier": "^3.6.2",
|
|
38
38
|
"prettier-plugin-svelte": "^3.4.0",
|
|
39
|
-
"prettier-plugin-tailwindcss": "^0.7.
|
|
39
|
+
"prettier-plugin-tailwindcss": "^0.7.1",
|
|
40
40
|
"tailwind-merge": "^3.3.1",
|
|
41
41
|
"tailwindcss": "^4.1.14",
|
|
42
42
|
"tsx": "^4.20.6",
|
|
43
43
|
"typescript": "^5.9.3"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
|
-
"@sveltejs/kit": "^2.47.
|
|
46
|
+
"@sveltejs/kit": "^2.47.2",
|
|
47
47
|
"@sveltejs/package": "^2.5.4",
|
|
48
48
|
"@sveltejs/vite-plugin-svelte": "^6.2.1",
|
|
49
49
|
"@types/node": "^24.8.1",
|
|
50
50
|
"publint": "^0.3.14",
|
|
51
|
-
"svelte": "^5.
|
|
51
|
+
"svelte": "^5.41.0",
|
|
52
52
|
"svelte-preprocess": "^6.0.3",
|
|
53
|
-
"vite": "^7.1.
|
|
53
|
+
"vite": "^7.1.11",
|
|
54
54
|
"vite-plugin-compression": "^0.5.1"
|
|
55
55
|
}
|
|
56
56
|
}
|
|
File without changes
|