From 13397f4b7f99defb8b436ddcabaac97dd44fa977 Mon Sep 17 00:00:00 2001 From: Ingmar van Stipriaan Date: Tue, 31 Dec 2024 15:17:33 +0100 Subject: [PATCH 1/3] feat: add addChild option templates --- .../structures/ActionJSForm/children.ts | 10 ++--- src/prefabs/structures/Configuration.ts | 2 + src/prefabs/structures/PriceInput/index.ts | 15 ++++++- .../structures/PriceInput/options/addChild.ts | 41 +++++++++++++++++ .../structures/PriceInput/options/index.ts | 32 ++------------ src/prefabs/structures/SelectInput/index.ts | 14 +++++- .../SelectInput/options/addChild.ts | 44 +++++++++++++++++++ .../structures/SelectInput/options/index.ts | 31 +------------ .../structures/TextArea/options/index.ts | 33 ++------------ src/prefabs/structures/TextInput/index.ts | 17 ++++++- .../structures/TextInput/options/addChild.ts | 43 ++++++++++++++++++ .../structures/TextInput/options/index.ts | 33 ++------------ 12 files changed, 188 insertions(+), 127 deletions(-) create mode 100644 src/prefabs/structures/PriceInput/options/addChild.ts create mode 100644 src/prefabs/structures/SelectInput/options/addChild.ts create mode 100644 src/prefabs/structures/TextInput/options/addChild.ts diff --git a/src/prefabs/structures/ActionJSForm/children.ts b/src/prefabs/structures/ActionJSForm/children.ts index 83415e63f..69931a07e 100644 --- a/src/prefabs/structures/ActionJSForm/children.ts +++ b/src/prefabs/structures/ActionJSForm/children.ts @@ -20,20 +20,18 @@ import { dateTimePickerOptions, fileUploadOptions, multiAutocompleteOptions, - priceInputOptions, radioInputOptions, ratingInputOptions, richTextOptions, selectInputOptions, - textAreaOptions, textInputOptions, } from '..'; export const inputTypes = [ - TextInput({ label: 'Text field', options: { ...textInputOptions } }), - SelectInput({ label: 'Select', options: { ...selectInputOptions } }), - PriceInput({ label: 'Price', options: { ...priceInputOptions } }), - TextArea({ label: 'Textarea', options: { ...textAreaOptions } }), + TextInput({ label: 'Text field' }), + SelectInput({ label: 'Select' }), + PriceInput({ label: 'Price' }), + TextArea({ label: 'Textarea' }), ]; const defaultOptions = { diff --git a/src/prefabs/structures/Configuration.ts b/src/prefabs/structures/Configuration.ts index 40a60550f..07a766f77 100644 --- a/src/prefabs/structures/Configuration.ts +++ b/src/prefabs/structures/Configuration.ts @@ -1,11 +1,13 @@ import { OptionCategory, OptionProducer, + OptionTemplates, PrefabComponentStyle, } from '@betty-blocks/component-sdk'; export interface Configuration { options?: Record; + optionTemplates?: OptionTemplates; adornmentIcon?: string; label?: string; inputLabel?: string; diff --git a/src/prefabs/structures/PriceInput/index.ts b/src/prefabs/structures/PriceInput/index.ts index 41ed8832b..5917a3d5f 100644 --- a/src/prefabs/structures/PriceInput/index.ts +++ b/src/prefabs/structures/PriceInput/index.ts @@ -3,6 +3,7 @@ import { updateOption } from '../../../utils'; import { TextInput } from '../TextInput'; import { options } from './options'; import { Configuration } from '../Configuration'; +import { addChildOptions } from './options/addChild'; export const PriceInput = ( config: Configuration, @@ -13,5 +14,17 @@ export const PriceInput = ( value: 'start', }); - return TextInput({ ...config, options, label }, descendants); + return TextInput( + { + ...config, + options, + label, + optionTemplates: { + addChild: { + options: addChildOptions, + }, + }, + }, + descendants, + ); }; diff --git a/src/prefabs/structures/PriceInput/options/addChild.ts b/src/prefabs/structures/PriceInput/options/addChild.ts new file mode 100644 index 000000000..276129eda --- /dev/null +++ b/src/prefabs/structures/PriceInput/options/addChild.ts @@ -0,0 +1,41 @@ +import { + buttongroup, + CreateActionInputVariableKind, + option, + optionTemplateOptions, + property, + showIf, +} from '@betty-blocks/component-sdk'; + +export const addChildOptions = optionTemplateOptions({ + propertyBased: buttongroup( + 'Type', + [ + ['Property-based', 'true'], + ['Non-property-based', 'false'], + ], + { value: 'true' }, + ), + actionVariableId: option('ACTION_JS_VARIABLE', { + label: 'Action input variable', + value: '', + configuration: { + condition: showIf('propertyBased', 'EQ', 'false'), + createActionInputVariable: { + type: CreateActionInputVariableKind.NUMBER, + }, + }, + }), + + property: property('Property', { + value: '', + showInReconfigure: true, + configuration: { + allowedKinds: ['INTEGER', 'PRICE', 'PRICE_EXPRESSION'], + condition: showIf('propertyBased', 'EQ', 'true'), + createActionInputVariable: { + type: CreateActionInputVariableKind.NUMBER, + }, + }, + }), +}); diff --git a/src/prefabs/structures/PriceInput/options/index.ts b/src/prefabs/structures/PriceInput/options/index.ts index bef3b2d3f..87c8dd42d 100644 --- a/src/prefabs/structures/PriceInput/options/index.ts +++ b/src/prefabs/structures/PriceInput/options/index.ts @@ -1,6 +1,5 @@ import { - buttongroup, - CreateActionInputVariableKind, + hideIf, option, property, showIf, @@ -18,45 +17,20 @@ const styles = { ...defaultStyles }; delete (>styles).adornmentIcon; export const options = { - propertyBased: buttongroup( - 'Type', - [ - ['Property-based', 'true'], - ['Non-property-based', 'false'], - ], - { - value: 'true', - showInAddChild: true, - configuration: { - showOnDrop: true, - }, - }, - ), - actionVariableId: option('ACTION_JS_VARIABLE', { label: 'Action input variable', value: '', - showInAddChild: true, configuration: { - condition: showIf('propertyBased', 'EQ', 'false'), - showOnDrop: true, - createActionInputVariable: { - type: CreateActionInputVariableKind.NUMBER, - }, + condition: showIf('property', 'EQ', ''), }, }), property: property('Property', { value: '', - showInAddChild: true, configuration: { allowedKinds: ['INTEGER', 'PRICE', 'PRICE_EXPRESSION'], disabled: true, - condition: showIf('propertyBased', 'EQ', 'true'), - showOnDrop: true, - createActionInputVariable: { - type: CreateActionInputVariableKind.NUMBER, - }, + condition: hideIf('property', 'EQ', ''), }, }), diff --git a/src/prefabs/structures/SelectInput/index.ts b/src/prefabs/structures/SelectInput/index.ts index 7f0583ad8..2adf6ebce 100644 --- a/src/prefabs/structures/SelectInput/index.ts +++ b/src/prefabs/structures/SelectInput/index.ts @@ -2,6 +2,7 @@ import { component, PrefabReference } from '@betty-blocks/component-sdk'; import { Configuration } from '../Configuration'; import { options as defaults } from './options/index'; import { updateOption } from '../../../utils'; +import { addChildOptions } from './options/addChild'; export const SelectInput = ( config: Configuration, @@ -47,7 +48,18 @@ export const SelectInput = ( return component( 'SelectInput', - { options, style, ref, label, optionCategories: categories }, + { + options, + style, + ref, + label, + optionCategories: categories, + optionTemplates: { + addChild: { + options: addChildOptions, + }, + }, + }, children, ); }; diff --git a/src/prefabs/structures/SelectInput/options/addChild.ts b/src/prefabs/structures/SelectInput/options/addChild.ts new file mode 100644 index 000000000..28cfc5caa --- /dev/null +++ b/src/prefabs/structures/SelectInput/options/addChild.ts @@ -0,0 +1,44 @@ +import { + buttongroup, + CreateActionInputVariableKind, + option, + optionTemplateOptions, + property, + showIf, +} from '@betty-blocks/component-sdk'; + +export const addChildOptions = optionTemplateOptions({ + propertyBased: buttongroup( + 'Type', + [ + ['Property-based', 'true'], + ['Non-property-based', 'false'], + ], + { + value: 'true', + }, + ), + + actionVariableId: option('ACTION_JS_VARIABLE', { + label: 'Action input variable', + value: '', + configuration: { + condition: showIf('propertyBased', 'EQ', 'false'), + createActionInputVariable: { + type: CreateActionInputVariableKind.NUMBER, + }, + }, + }), + + property: property('Property', { + value: '', + configuration: { + allowedKinds: ['LIST', 'BELONGS_TO'], + allowRelations: true, + condition: showIf('propertyBased', 'EQ', 'true'), + createActionInputVariable: { + type: CreateActionInputVariableKind.NUMBER, + }, + }, + }), +}); diff --git a/src/prefabs/structures/SelectInput/options/index.ts b/src/prefabs/structures/SelectInput/options/index.ts index bf4e29652..17af529d1 100644 --- a/src/prefabs/structures/SelectInput/options/index.ts +++ b/src/prefabs/structures/SelectInput/options/index.ts @@ -1,6 +1,5 @@ import { buttongroup, - CreateActionInputVariableKind, filter, hideIf, modelAndRelation, @@ -15,47 +14,21 @@ import { validation } from './validation'; import { styles } from './styles'; export const options = { - propertyBased: buttongroup( - 'Type', - [ - ['Property-based', 'true'], - ['Non-property-based', 'false'], - ], - { - value: 'true', - showInAddChild: true, - configuration: { - showOnDrop: true, - }, - }, - ), - actionVariableId: option('ACTION_JS_VARIABLE', { label: 'Action input variable', value: '', - showInAddChild: true, configuration: { - condition: showIf('propertyBased', 'EQ', 'false'), - createActionInputVariable: { - type: CreateActionInputVariableKind.NUMBER, - }, - showOnDrop: true, + condition: showIf('property', 'EQ', ''), }, }), property: property('Property', { value: '', - showInReconfigure: true, - showInAddChild: true, configuration: { allowedKinds: ['LIST', 'BELONGS_TO'], allowRelations: true, disabled: true, - condition: showIf('propertyBased', 'EQ', 'true'), - showOnDrop: true, - createActionInputVariable: { - type: CreateActionInputVariableKind.NUMBER, - }, + condition: hideIf('property', 'EQ', ''), }, }), diff --git a/src/prefabs/structures/TextArea/options/index.ts b/src/prefabs/structures/TextArea/options/index.ts index 2cce65a4c..372552ed0 100644 --- a/src/prefabs/structures/TextArea/options/index.ts +++ b/src/prefabs/structures/TextArea/options/index.ts @@ -1,6 +1,5 @@ import { - buttongroup, - CreateActionInputVariableKind, + hideIf, option, property, showIf, @@ -13,46 +12,20 @@ import { styles } from '../../TextInput/options/styles'; import { validation } from '../../TextInput/options/validation'; export const options = { - propertyBased: buttongroup( - 'Type', - [ - ['Property-based', 'true'], - ['Non-property-based', 'false'], - ], - { - value: 'true', - showInAddChild: true, - configuration: { - showOnDrop: true, - }, - }, - ), - actionVariableId: option('ACTION_JS_VARIABLE', { label: 'Action input variable', value: '', - showInAddChild: true, configuration: { - condition: showIf('propertyBased', 'EQ', 'false'), - createActionInputVariable: { - type: CreateActionInputVariableKind.TEXT, - }, - showOnDrop: true, + condition: showIf('property', 'EQ', ''), }, }), property: property('Property', { value: '', - showInAddChild: true, - showInReconfigure: true, configuration: { allowedKinds: ['TEXT', 'URL', 'IBAN', 'STRING'], disabled: true, - condition: showIf('propertyBased', 'EQ', 'true'), - showOnDrop: true, - createActionInputVariable: { - type: CreateActionInputVariableKind.TEXT, - }, + condition: hideIf('property', 'EQ', ''), }, }), diff --git a/src/prefabs/structures/TextInput/index.ts b/src/prefabs/structures/TextInput/index.ts index 0f0147624..80d4e02a3 100644 --- a/src/prefabs/structures/TextInput/index.ts +++ b/src/prefabs/structures/TextInput/index.ts @@ -2,12 +2,17 @@ import { component, PrefabReference } from '@betty-blocks/component-sdk'; import { updateOption } from '../../../utils'; import { Configuration } from '../Configuration'; import { options as defaults } from './options/index'; +import { addChildOptions as defaultAddChildOptions } from './options/addChild'; export const TextInput = ( config: Configuration, children: PrefabReference[] = [], ) => { const options = { ...(config.options || defaults) }; + const addChildOptions = [ + ...(config.optionTemplates?.addChild?.options || defaultAddChildOptions), + ]; + const ref = config.ref ? { ...config.ref } : undefined; const categories = [ @@ -80,7 +85,17 @@ export const TextInput = ( return component( 'TextInput', - { label: config.label, options, ref, optionCategories: categories }, + { + label: config.label, + options, + ref, + optionCategories: categories, + optionTemplates: { + addChild: { + options: addChildOptions, + }, + }, + }, children, ); }; diff --git a/src/prefabs/structures/TextInput/options/addChild.ts b/src/prefabs/structures/TextInput/options/addChild.ts new file mode 100644 index 000000000..fe4aa9f8a --- /dev/null +++ b/src/prefabs/structures/TextInput/options/addChild.ts @@ -0,0 +1,43 @@ +import { + buttongroup, + CreateActionInputVariableKind, + option, + optionTemplateOptions, + property, + showIf, +} from '@betty-blocks/component-sdk'; + +export const addChildOptions = optionTemplateOptions({ + propertyBased: buttongroup( + 'Type', + [ + ['Property-based', 'true'], + ['Non-property-based', 'false'], + ], + { value: 'true' }, + ), + + actionVariableId: option('ACTION_JS_VARIABLE', { + label: 'Action input variable', + value: '', + configuration: { + condition: showIf('propertyBased', 'EQ', 'false'), + createActionInputVariable: { + type: CreateActionInputVariableKind.TEXT, + }, + }, + }), + + property: property('Property', { + value: '', + showInReconfigure: true, + configuration: { + allowedKinds: ['TEXT', 'URL', 'IBAN', 'STRING'], + disabled: true, + condition: showIf('propertyBased', 'EQ', 'true'), + createActionInputVariable: { + type: CreateActionInputVariableKind.TEXT, + }, + }, + }), +}); diff --git a/src/prefabs/structures/TextInput/options/index.ts b/src/prefabs/structures/TextInput/options/index.ts index 2d3d5a884..2e1048432 100644 --- a/src/prefabs/structures/TextInput/options/index.ts +++ b/src/prefabs/structures/TextInput/options/index.ts @@ -1,6 +1,5 @@ import { - buttongroup, - CreateActionInputVariableKind, + hideIf, option, property, showIf, @@ -11,46 +10,20 @@ import { styles } from './styles'; import { validation } from './validation'; export const options = { - propertyBased: buttongroup( - 'Type', - [ - ['Property-based', 'true'], - ['Non-property-based', 'false'], - ], - { - value: 'true', - showInAddChild: true, - configuration: { - showOnDrop: true, - }, - }, - ), - actionVariableId: option('ACTION_JS_VARIABLE', { label: 'Action input variable', value: '', - showInAddChild: true, configuration: { - condition: showIf('propertyBased', 'EQ', 'false'), - createActionInputVariable: { - type: CreateActionInputVariableKind.TEXT, - }, - showOnDrop: true, + condition: showIf('property', 'EQ', ''), }, }), property: property('Property', { value: '', - showInReconfigure: true, - showInAddChild: true, configuration: { allowedKinds: ['TEXT', 'URL', 'IBAN', 'STRING'], disabled: true, - condition: showIf('propertyBased', 'EQ', 'true'), - showOnDrop: true, - createActionInputVariable: { - type: CreateActionInputVariableKind.TEXT, - }, + condition: hideIf('property', 'EQ', ''), }, }), From c4c1f628230f7b952f2202e6624aa72cc400a4f1 Mon Sep 17 00:00:00 2001 From: Ingmar van Stipriaan Date: Thu, 2 Jan 2025 09:30:22 +0100 Subject: [PATCH 2/3] chore: update cli and sdk --- package.json | 4 ++-- yarn.lock | 16 ++++++++-------- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index a7327ac14..ad0f6970f 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "license": "UNLICENSED", "private": false, "devDependencies": { - "@betty-blocks/cli": "^25.100.0", + "@betty-blocks/cli": "^25.102.0", "@commitlint/cli": "^16.1.0", "@commitlint/config-angular": "^16.0.0", "@semantic-release/changelog": "^6.0.1", @@ -57,7 +57,7 @@ "dist" ], "dependencies": { - "@betty-blocks/component-sdk": "^1.86.0", + "@betty-blocks/component-sdk": "^1.86.1", "@date-io/date-fns": "^1.3.13", "@material-ui/core": "^4.9.11", "@material-ui/icons": "^4.11.2", diff --git a/yarn.lock b/yarn.lock index 78b5e3e97..61ab29f6a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -154,10 +154,10 @@ "@babel/helper-validator-identifier" "^7.22.5" to-fast-properties "^2.0.0" -"@betty-blocks/cli@^25.100.0": - version "25.100.0" - resolved "https://registry.yarnpkg.com/@betty-blocks/cli/-/cli-25.100.0.tgz#c037d28d512d6073f62ee3473573d17def99d477" - integrity sha512-hHTVX4NeLHYa5lHb3nFYUJcmfcX9hPh6oH/F+s5uhBnqOMnYdJYgVAln/qHlXrGK+Im6EKvENy++8/M61o3W6g== +"@betty-blocks/cli@^25.102.0": + version "25.102.0" + resolved "https://registry.yarnpkg.com/@betty-blocks/cli/-/cli-25.102.0.tgz#50a2746cfebe79aab97635138aef00b82bc70c79" + integrity sha512-WNDtYMxJG7QRR1lylIxdz1yS8jsaGpPrEq0KOGRD0uPbdV3+SL1siGcttsFvPszonuH/rMrt5CuKZzmTZ3+d3w== dependencies: "@azure/ms-rest-js" "^2.0.4" "@azure/storage-blob" "^10.3.0" @@ -196,10 +196,10 @@ optionalDependencies: isolated-vm "^4.0.0" -"@betty-blocks/component-sdk@^1.86.0": - version "1.86.0" - resolved "https://registry.yarnpkg.com/@betty-blocks/component-sdk/-/component-sdk-1.86.0.tgz#761da52567c01ea5285edb474596fae00ad840e0" - integrity sha512-2jZMjxSunK/n6/54aXz++bPgoZqKtyykcorli6DzkScnrrNmsPcKv2WBuhjfExO8y+s47qRHywwdpho3IOE7uw== +"@betty-blocks/component-sdk@^1.86.1": + version "1.86.1" + resolved "https://registry.yarnpkg.com/@betty-blocks/component-sdk/-/component-sdk-1.86.1.tgz#f6d3a8bfafa92e99145ad26fb8826eaa941867b0" + integrity sha512-ClXiRk4ihbocKOrr5pvBCD3qwW3jQkUmKLTYKM6FnVEwTHB3Sw1PoekIMdYTmHIhhG755ICTJJHELXdd4nLydw== "@colors/colors@1.5.0": version "1.5.0" From e2574165cf225e8dc2dc7e69a711ad5b7db02532 Mon Sep 17 00:00:00 2001 From: Ingmar van Stipriaan Date: Thu, 2 Jan 2025 16:26:07 +0100 Subject: [PATCH 3/3] chore: remove disabled from textinput addchild property --- src/prefabs/structures/TextInput/options/addChild.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/prefabs/structures/TextInput/options/addChild.ts b/src/prefabs/structures/TextInput/options/addChild.ts index fe4aa9f8a..99d1f84b5 100644 --- a/src/prefabs/structures/TextInput/options/addChild.ts +++ b/src/prefabs/structures/TextInput/options/addChild.ts @@ -30,10 +30,8 @@ export const addChildOptions = optionTemplateOptions({ property: property('Property', { value: '', - showInReconfigure: true, configuration: { allowedKinds: ['TEXT', 'URL', 'IBAN', 'STRING'], - disabled: true, condition: showIf('propertyBased', 'EQ', 'true'), createActionInputVariable: { type: CreateActionInputVariableKind.TEXT,