chore: example of optionTemplates

bettyblocks · Dec 16, 2024 · eb56b2f · eb56b2f
1 parent df3fd78
commit eb56b2f
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 2 deletions.
diff --git a/src/prefabs/structures/Configuration.ts b/src/prefabs/structures/Configuration.ts
@@ -2,10 +2,12 @@ import {
   OptionCategory,
   OptionProducer,
   PrefabComponentStyle,
+  OptionTemplates,
 } from '@betty-blocks/component-sdk';
 
 export interface Configuration {
   options?: Record<string, OptionProducer>;
+  optionTemplates?: OptionTemplates;
   adornmentIcon?: string;
   label?: string;
   inputLabel?: string;

diff --git a/src/prefabs/structures/TextInput/index.ts b/src/prefabs/structures/TextInput/index.ts
@@ -1,13 +1,19 @@
 import { component, PrefabReference } from '@betty-blocks/component-sdk';
 import { updateOption } from '../../../utils';
 import { Configuration } from '../Configuration';
-import { options as defaults } from './options/index';
+import {
+  options as defaults,
+  optionTemplates as optionTemplatesdefault,
+} from './options/index';
 
 export const TextInput = (
   config: Configuration,
   children: PrefabReference[] = [],
 ) => {
   const options = { ...(config.options || defaults) };
+  const optionTemplates = {
+    ...(config.optionTemplates || optionTemplatesdefault),
+  };
   const ref = config.ref ? { ...config.ref } : undefined;
 
   const categories = [
@@ -80,7 +86,13 @@ export const TextInput = (
 
   return component(
     'TextInput',
-    { label: config.label, options, ref, optionCategories: categories },
+    {
+      label: config.label,
+      options,
+      optionTemplates,
+      ref,
+      optionCategories: categories,
+    },
     children,
   );
 };
diff --git a/src/prefabs/structures/TextInput/options/index.ts b/src/prefabs/structures/TextInput/options/index.ts
@@ -1,6 +1,7 @@
 import {
   hideIf,
   option,
+  optionTemplateOptions,
   property,
   showIf,
   variable,
@@ -39,3 +40,20 @@ export const options = {
   ...styles,
   ...advanced,
 };
+
+export const optionTemplates = {
+  addChild: {
+    options: optionTemplateOptions({
+      property: property('Property', {
+        value: '',
+        showInReconfigure: true,
+        configuration: {
+          allowedKinds: ['TEXT', 'URL', 'IBAN', 'STRING'],
+          disabled: true,
+          condition: hideIf('property', 'EQ', ''),
+          showOnDrop: true,
+        },
+      }),
+    }),
+  },
+};