@app-brew/brewery 1.0.0

package/src/types/src/blocks-definition/text-list.def.ts

@@ -0,0 +1,280 @@
+import { z } from 'zod'
+import {
+  baseIconStyleSchema,
+  baseStyleSchema,
+  baseTextStyleSchema,
+} from '../style'
+import { blockSchema } from '../common'
+import { BlockDefinition, BlockMicroContext } from './types'
+
+/**
+ * Text List Block Schema
+ */
+const zodSchema = blockSchema.extend({
+  source: z.object({
+    chips: z.array(
+      z.object({
+        text: z.string(),
+        link: z
+          .object({
+            kind: z.string(),
+            value: z.string(),
+          })
+          .optional(),
+        hidden: z.boolean().optional(),
+      })
+    ),
+  }),
+  style: z.object({
+    root: baseStyleSchema.optional(),
+    wrapper: baseStyleSchema.optional(),
+    chip: z
+      .object({
+        root: baseStyleSchema.optional(),
+        button: z
+          .object({
+            root: baseStyleSchema.optional(),
+            text: baseTextStyleSchema.optional(),
+            startIcon: z
+              .object({
+                root: baseStyleSchema.optional(),
+                icon: baseIconStyleSchema.optional(),
+              })
+              .optional(),
+          })
+          .optional(),
+        separator: z
+          .object({
+            width: z.number().optional(),
+          })
+          .optional(),
+      })
+      .optional(),
+  }),
+  options: z
+    .object({
+      itemsPerRow: z.number().optional(),
+      mode: z.string().optional(),
+      iconId: z.string().optional(),
+    })
+    .optional(),
+})
+
+/**
+ * Component hierarchy for AI understanding
+ */
+const codeJson = {
+  level: 0,
+  component: 'View',
+  stylePath: 'style.root',
+  description: 'Text list/chips container displaying text items as chips.',
+  children: [
+    {
+      level: 1,
+      component: 'View (Wrapper)',
+      stylePath: 'style.wrapper',
+      description: 'Wrapper container for chip items.',
+      children: [
+        {
+          level: 2,
+          component: 'FlatList/FlexWrap',
+          sourcePath: 'source.chips',
+          description: 'List of text chips.',
+          usage: {
+            itemsPerRow: 'options.itemsPerRow',
+            mode: 'options.mode',
+          },
+          children: [
+            {
+              level: 3,
+              component: 'View (Chip)',
+              stylePath: 'style.chip.root',
+              condition: 'item.hidden !== true',
+              description: 'Individual chip container.',
+              children: [
+                {
+                  level: 4,
+                  component: 'Pressable (Button)',
+                  stylePath: 'style.chip.button.root',
+                  description: 'Chip button.',
+                  usage: {
+                    onPress: 'Navigates to item.link when link exists',
+                  },
+                  children: [
+                    {
+                      level: 5,
+                      component: 'View (Start Icon)',
+                      condition: 'options.iconId exists',
+                      stylePath: 'style.chip.button.startIcon.root',
+                      children: [
+                        {
+                          level: 6,
+                          component: 'Icon',
+                          stylePath: 'style.chip.button.startIcon.icon',
+                          sourcePath: 'options.iconId',
+                          description: 'Start icon for chip.',
+                        },
+                      ],
+                    },
+                    {
+                      level: 5,
+                      component: 'Text',
+                      stylePath: 'style.chip.button.text',
+                      sourcePath: 'source.chips[].text',
+                      description: 'Chip text.',
+                    },
+                  ],
+                },
+                {
+                  level: 4,
+                  component: 'View (Separator)',
+                  stylePath: 'style.chip.separator',
+                  description: 'Separator between chips.',
+                  usage: {
+                    width: 'style.chip.separator.width',
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+  ],
+}
+
+/**
+ * Block micro contexts for detailed nested component properties
+ */
+const microContexts: Record<string, BlockMicroContext> = {
+  root: {
+    key: 'root',
+    title: 'Root Container',
+    description: 'Text list/chips container displaying text items as chips',
+    properties: [
+      {
+        path: 'style.root',
+        type: 'BaseStyle',
+        description:
+          'Root container style (padding, margin, backgroundColor, etc.)',
+        optional: true,
+      },
+      {
+        path: 'background',
+        type: 'BackgroundConfig',
+        description:
+          'Background configuration (color, image, gradient) for the block container',
+        optional: true,
+      },
+    ],
+    relatedKeys: ['wrapper', 'chip'],
+  },
+  wrapper: {
+    key: 'wrapper',
+    title: 'Wrapper Container',
+    description: 'Wrapper container for chip items',
+    properties: [
+      {
+        path: 'style.wrapper',
+        type: 'BaseStyle',
+        description: 'Wrapper container style',
+        optional: true,
+      },
+    ],
+    relatedKeys: ['root', 'chip'],
+  },
+  chip: {
+    key: 'chip',
+    title: 'Chip Item',
+    description: 'Individual chip container',
+    properties: [
+      {
+        path: 'source.chips',
+        type: 'Array<ChipItem>',
+        description: 'Array of chip items',
+        optional: false,
+      },
+      {
+        path: 'source.chips[].text',
+        type: 'string',
+        description: 'Chip text content',
+        optional: false,
+      },
+      {
+        path: 'source.chips[].link',
+        type: 'LinkConfig',
+        description: 'Chip link configuration',
+        optional: true,
+      },
+      {
+        path: 'source.chips[].hidden',
+        type: 'boolean',
+        description: 'Whether the chip is hidden (filtered out from display)',
+        optional: true,
+        defaultValue: false,
+      },
+      {
+        path: 'style.chip.root',
+        type: 'BaseStyle',
+        description: 'Chip container style',
+        optional: true,
+      },
+      {
+        path: 'style.chip.button.root',
+        type: 'BaseStyle',
+        description: 'Chip button container style',
+        optional: true,
+      },
+      {
+        path: 'style.chip.button.text',
+        type: 'BaseTextStyle',
+        description: 'Chip button text style',
+        optional: true,
+      },
+      {
+        path: 'style.chip.button.startIcon.root',
+        type: 'BaseStyle',
+        description: 'Start icon container style',
+        optional: true,
+      },
+      {
+        path: 'style.chip.button.startIcon.icon',
+        type: 'BaseIconStyle',
+        description: 'Start icon style',
+        optional: true,
+      },
+      {
+        path: 'style.chip.separator.width',
+        type: 'number',
+        description: 'Separator width between chips',
+        optional: true,
+      },
+      {
+        path: 'options.itemsPerRow',
+        type: 'number',
+        description: 'Number of items per row',
+        optional: true,
+      },
+      {
+        path: 'options.mode',
+        type: 'string',
+        description: 'Display mode',
+        optional: true,
+      },
+      {
+        path: 'options.iconId',
+        type: 'string',
+        description: 'Icon ID for chip start icon',
+        optional: true,
+      },
+    ],
+    relatedKeys: ['wrapper'],
+  },
+}
+
+export const textListDefinition: BlockDefinition = {
+  zodSchema,
+  codeJson,
+  microContexts,
+  microContextKeys: ['root', 'wrapper', 'chip'],
+}