diff --git a/demos/webpack-app/package.json b/demos/webpack-app/package.json index d7f9bde..2b3ba93 100644 --- a/demos/webpack-app/package.json +++ b/demos/webpack-app/package.json @@ -18,8 +18,8 @@ "sequential-workflow-model": "^0.2.0", "sequential-workflow-designer": "^0.21.2", "sequential-workflow-machine": "^0.4.0", - "sequential-workflow-editor-model": "^0.14.7", - "sequential-workflow-editor": "^0.14.7" + "sequential-workflow-editor-model": "^0.14.8", + "sequential-workflow-editor": "^0.14.8" }, "devDependencies": { "ts-loader": "^9.4.2", diff --git a/demos/webpack-app/src/i18n/app.ts b/demos/webpack-app/src/i18n/app.ts index 5da379f..4e5783b 100644 --- a/demos/webpack-app/src/i18n/app.ts +++ b/demos/webpack-app/src/i18n/app.ts @@ -63,7 +63,11 @@ const editorDict: Record> = { 'step.chown.name': 'Uprawnienia', 'step.chown.property:name': 'Nazwa', 'step.chown.property:properties/stringOrNumber': 'Tekst lub liczba', - 'step.chown.property:properties/users': 'Użytkownik' + 'step.chown.property:properties/users': 'Użytkownik', + 'step.chown.property:properties/mode': 'Tryb', + 'step.chown.property:properties/mode:choice:Read': 'Odczyt', + 'step.chown.property:properties/mode:choice:Write': 'Zapis', + 'step.chown.property:properties/mode:choice:Execute': 'Wykonanie' } }; diff --git a/demos/webpack-app/src/i18n/definition-model.ts b/demos/webpack-app/src/i18n/definition-model.ts index 709955d..b0b08f1 100644 --- a/demos/webpack-app/src/i18n/definition-model.ts +++ b/demos/webpack-app/src/i18n/definition-model.ts @@ -2,6 +2,7 @@ import { Dynamic, StringDictionary, createBooleanValueModel, + createChoiceValueModel, createDefinitionModel, createDynamicValueModel, createNumberValueModel, @@ -24,6 +25,7 @@ export interface ChownStep extends Step { properties: { stringOrNumber: Dynamic; users: StringDictionary; + mode: string; }; } @@ -64,6 +66,12 @@ export const definitionModel = createDefinitionModel(model => { uniqueKeys: true }) ); + step.property('mode').value( + createChoiceValueModel({ + choices: ['Read', 'Write', 'Execute'], + defaultValue: 'Read' + }) + ); }) ]); }); diff --git a/editor/package.json b/editor/package.json index ca83ae4..f6437ba 100644 --- a/editor/package.json +++ b/editor/package.json @@ -1,6 +1,6 @@ { "name": "sequential-workflow-editor", - "version": "0.14.7", + "version": "0.14.8", "type": "module", "main": "./lib/esm/index.js", "types": "./lib/index.d.ts", @@ -46,11 +46,11 @@ "prettier:fix": "prettier --write ./src ./css" }, "dependencies": { - "sequential-workflow-editor-model": "^0.14.7", + "sequential-workflow-editor-model": "^0.14.8", "sequential-workflow-model": "^0.2.0" }, "peerDependencies": { - "sequential-workflow-editor-model": "^0.14.7", + "sequential-workflow-editor-model": "^0.14.8", "sequential-workflow-model": "^0.2.0" }, "devDependencies": { diff --git a/editor/src/core/step-i18n-prefix.ts b/editor/src/core/step-i18n-prefix.ts new file mode 100644 index 0000000..e4842ff --- /dev/null +++ b/editor/src/core/step-i18n-prefix.ts @@ -0,0 +1,3 @@ +export function createStepI18nPrefix(stepType: string | null): string { + return stepType ? `step.${stepType}.property:` : 'root.property:'; +} diff --git a/editor/src/property-editor/property-editor.ts b/editor/src/property-editor/property-editor.ts index 373af2a..b3468a5 100644 --- a/editor/src/property-editor/property-editor.ts +++ b/editor/src/property-editor/property-editor.ts @@ -13,6 +13,7 @@ import { PropertyValidationErrorComponent, propertyValidationErrorComponent } fr import { Icons } from '../core/icons'; import { PropertyHintComponent, propertyHint } from './property-hint'; import { StackedSimpleEvent } from '../core'; +import { createStepI18nPrefix } from '../core/step-i18n-prefix'; export class PropertyEditor implements Component { public static create( @@ -45,7 +46,7 @@ export class PropertyEditor implements Component { const label = Html.element('h4', { class: 'swe-property-header-label' }); - const i18nPrefix = stepType ? `step.${stepType}.property:` : 'root.property:'; + const i18nPrefix = createStepI18nPrefix(stepType); label.innerText = editorServices.i18n(i18nPrefix + pathStr, propertyModel.label); header.appendChild(label); diff --git a/editor/src/value-editors/choice/choice-value-editor.ts b/editor/src/value-editors/choice/choice-value-editor.ts index f5a5a20..f4a6e3b 100644 --- a/editor/src/value-editors/choice/choice-value-editor.ts +++ b/editor/src/value-editors/choice/choice-value-editor.ts @@ -4,6 +4,7 @@ import { validationErrorComponent } from '../../components/validation-error-comp import { valueEditorContainerComponent } from '../../components/value-editor-container-component'; import { rowComponent } from '../../components/row-component'; import { selectComponent } from '../../components/select-component'; +import { createStepI18nPrefix } from '../../core/step-i18n-prefix'; export const choiceValueEditorId = 'choice'; @@ -13,7 +14,7 @@ export function choiceValueEditor(context: ValueContext): Valu } function onSelected(index: number) { - const value = context.model.configuration.choices[index]; + const value = choices[index]; context.setValue(value); validate(); } @@ -21,8 +22,19 @@ export function choiceValueEditor(context: ValueContext): Valu const select = selectComponent({ stretched: true }); - select.setValues(context.model.configuration.choices); - const startIndex = context.model.configuration.choices.indexOf(context.getValue()); + + const stepType = context.tryGetStepType(); + const i18nPrefix = createStepI18nPrefix(stepType); + + const choices = context.model.configuration.choices; + const translatedChoices = choices.map(choice => { + const pathStr = context.model.path.toString(); + const key = `${i18nPrefix}${pathStr}:choice:${choice}`; + return context.i18n(key, choice); + }); + + select.setValues(translatedChoices); + const startIndex = choices.indexOf(context.getValue()); select.selectIndex(startIndex); select.onSelected.subscribe(onSelected); diff --git a/model/package.json b/model/package.json index 97bd892..36965a7 100644 --- a/model/package.json +++ b/model/package.json @@ -1,6 +1,6 @@ { "name": "sequential-workflow-editor-model", - "version": "0.14.7", + "version": "0.14.8", "homepage": "https://nocode-js.com/", "author": { "name": "NoCode JS", diff --git a/model/src/context/property-context.ts b/model/src/context/property-context.ts index 1174f1e..a6f4427 100644 --- a/model/src/context/property-context.ts +++ b/model/src/context/property-context.ts @@ -1,4 +1,4 @@ -import { Properties } from 'sequential-workflow-model'; +import { Properties, Step } from 'sequential-workflow-model'; import { DefinitionModel, PropertyModel } from '../model'; import { ValueType } from '../types'; import { readPropertyValue } from './read-property-value'; @@ -18,6 +18,14 @@ export class PropertyContext { private readonly definitionModel: DefinitionModel ) {} + /** + * @returns the type of the step, or `null` if the object is root. + */ + public readonly tryGetStepType = (): string | null => { + const type = (this.object as Step).type; + return type ? type : null; + }; + /** * Get the value of a property by name. * @param name The name of the property. diff --git a/model/src/context/scoped-property-context.ts b/model/src/context/scoped-property-context.ts index 66ec37d..5f3c9ee 100644 --- a/model/src/context/scoped-property-context.ts +++ b/model/src/context/scoped-property-context.ts @@ -20,6 +20,7 @@ export class ScopedPropertyContext { private readonly parentsProvider: ParentsProvider ) {} + public readonly tryGetStepType = this.propertyContext.tryGetStepType; public readonly getPropertyValue = this.propertyContext.getPropertyValue; public readonly formatPropertyValue = this.propertyContext.formatPropertyValue; public readonly getValueTypes = this.propertyContext.getValueTypes; diff --git a/model/src/context/value-context.ts b/model/src/context/value-context.ts index 04f8a74..e386e20 100644 --- a/model/src/context/value-context.ts +++ b/model/src/context/value-context.ts @@ -25,6 +25,7 @@ export class ValueContext ) {} + public readonly tryGetStepType = this.scopedPropertyContext.tryGetStepType; public readonly getPropertyValue = this.scopedPropertyContext.getPropertyValue; public readonly formatPropertyValue = this.scopedPropertyContext.formatPropertyValue; public readonly getValueTypes = this.scopedPropertyContext.getValueTypes;