Variables select

commit_hash:4f4a5367321f43583dd739d98b36db9a96194ab6
This commit is contained in:
4eb0da
2024-11-18 12:26:48 +03:00
parent efe83b8aaa
commit 77ee6f82ab
8 changed files with 58 additions and 9 deletions
+1
View File
@@ -19291,6 +19291,7 @@
"visual-editor/src/lib/components/simple-props/TextStylesProp.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/TextStylesProp.svelte",
"visual-editor/src/lib/components/simple-props/UnknownProp.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/UnknownProp.svelte",
"visual-editor/src/lib/components/simple-props/UnknownPropWithLabel.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/UnknownPropWithLabel.svelte",
"visual-editor/src/lib/components/simple-props/VariableNameProp.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/VariableNameProp.svelte",
"visual-editor/src/lib/components/simple-props/VideoSourcesItem.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/VideoSourcesItem.svelte",
"visual-editor/src/lib/components/simple-props/VideoSourcesProp.svelte":"divkit/public/visual-editor/src/lib/components/simple-props/VideoSourcesProp.svelte",
"visual-editor/src/lib/ctx/appContext.ts":"divkit/public/visual-editor/src/lib/ctx/appContext.ts",
@@ -11,6 +11,7 @@
import { ChangeTimersCommand } from '../data/commands/changeTimers';
import Actions2Prop from './simple-props/Actions2Prop.svelte';
import { APP_CTX, type AppContext } from '../ctx/appContext';
import VariableNameProp from './simple-props/VariableNameProp.svelte';
const { l10nString } = getContext<LanguageContext>(LANGUAGE_CTX);
const { state } = getContext<AppContext>(APP_CTX);
@@ -150,9 +151,11 @@
<div class="timers__label">
{$l10nString('timersValueVariable')}
</div>
<Text
value={timer.value_variable}
disabled={$readOnly}
<VariableNameProp
item={{
type: 'variable-name'
}}
value={timer.value_variable || ''}
on:change={event => onValueVariableChange(index, event)}
/>
</label>
@@ -9,8 +9,8 @@
export let value: string;
export let item: ComponentProperty;
export let processedJson;
export let parentProcessedJson;
export let processedJson: unknown | undefined = undefined;
export let parentProcessedJson: unknown | undefined = undefined;
export let hasEmpty = true;
export let options: {
rawName?: string;
@@ -25,6 +25,7 @@
$: filteredOptions = options.filter(
it => it.show === undefined ||
processedJson && parentProcessedJson &&
evalCondition(processedJson, parentProcessedJson, it.show)
);
@@ -35,7 +35,8 @@
// todo
const enableSources = it.editor.type !== 'background2' &&
it.editor.type !== 'actions2' &&
it.editor.type !== 'video_sources';
it.editor.type !== 'video_sources' &&
it.editor.type !== 'variable-name';
return {
rawName: it.templatePropertyName,
@@ -15,6 +15,7 @@
import TextStylesProp from './TextStylesProp.svelte';
import Actions2Prop from './Actions2Prop.svelte';
import VideoSourcesProp from './VideoSourcesProp.svelte';
import VariableNameProp from './VariableNameProp.svelte';
export let item: ComponentProperty;
export let value;
@@ -155,4 +156,12 @@
{value}
on:change
/>
{:else if item.type === 'variable-name'}
<VariableNameProp
{item}
{value}
{processedJson}
{parentProcessedJson}
on:change
/>
{/if}
@@ -0,0 +1,30 @@
<script lang="ts">
import { getContext } from 'svelte';
import type { ComponentProperty } from '../../data/componentProps';
import { APP_CTX, type AppContext } from '../../ctx/appContext';
import SelectProp from './SelectProp.svelte';
export let value: string;
export let item: ComponentProperty;
export let processedJson: unknown | undefined = undefined;
export let parentProcessedJson: unknown | undefined = undefined;
const { state } = getContext<AppContext>(APP_CTX);
const { customVariables } = state;
$: options = $customVariables.map(it => {
return {
rawName: it.name,
value: it.name
};
});
</script>
<SelectProp
{value}
{item}
{processedJson}
{parentProcessedJson}
{options}
on:change
/>
+6 -3
View File
@@ -157,11 +157,15 @@ export interface SplitProperty {
list: [ComponentProperty, ComponentProperty];
}
export interface VariableNameProperty extends BaseProperty {
type: 'variable-name';
}
export type ComponentProperty = RadioProperty | IntegerProperty | BooleanProperty | SelectProperty |
PercentProperty | RotationProperty | StringProperty |
ColorProperty | FileProperty | GroupProperty | SplitProperty | AlignmentProperty |
MarginsPaddingsProperty | Background2Property | TextAlignProperty | TextStylesProperty |
Actions2Property | VideoSourcesProperty | NumberProperty;
Actions2Property | VideoSourcesProperty | NumberProperty | VariableNameProperty;
export type SiblingComponentProperty = ComponentProperty & {
related?: {
@@ -696,8 +700,7 @@ export const COMPONENT_PROPS: Record<string, ComponentProperty[]> = {
list: [{
name: 'props.text_variable',
prop: 'text_variable',
type: 'string',
enableSources: true
type: 'variable-name'
}, {
name: 'props.keyboard_type',
prop: 'keyboard_type',
+1
View File
@@ -47,6 +47,7 @@ const editors = new Map([
['common.json#/boolean_int', 'boolean'],
['common.json#/color', 'color'],
['common.json#/url', 'file'],
['div-variable-name.json', 'variable-name'],
['div-background.json', '__background-item'],
['div-action.json', '__action-item'],
['div-video-source.json', '__video-source-item']