@developer_tribe/react-builder 1.0.2 → 1.0.4

package/src/build-components/patterns.generated.ts

@@ -2,6 +2,357 @@
 
 // Export resolved patterns (after extends resolution)
 export const patterns = [
+  {
+    schemaVersion: 1,
+    allowUnknownAttributes: false,
+    pattern: {
+      type: 'background-image',
+      children: 'never',
+      attributes: {
+        scrollable: 'boolean',
+        flexDirection: ['row', 'column'],
+        alignItems: ['flex-start', 'center', 'flex-end', 'stretch', 'baseline'],
+        justifyContent: [
+          'flex-start',
+          'center',
+          'flex-end',
+          'space-between',
+          'space-around',
+          'space-evenly',
+        ],
+        gap: 'size',
+        padding: 'size',
+        paddingHorizontal: 'size',
+        paddingVertical: 'size',
+        paddingTop: 'size',
+        paddingBottom: 'size',
+        paddingLeft: 'size',
+        paddingRight: 'size',
+        margin: 'size',
+        marginVertical: 'size',
+        marginTop: 'size',
+        marginBottom: 'size',
+        marginLeft: 'size',
+        marginRight: 'size',
+        backgroundColor: 'color',
+        borderRadius: 'size',
+        width: 'size',
+        height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
+        src: 'string',
+        resizeMode: ['cover', 'contain', 'stretch', 'center'],
+      },
+      defaults: {
+        resizeMode: 'cover',
+        width: '100%',
+        height: '100%',
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        zIndex: 0,
+      },
+    },
+    meta: {
+      desiredParent: ['all', 'background'],
+      label: 'Background Image',
+      description: 'Background image.',
+      specialCategories: {
+        padding: {
+          label: 'Padding',
+          description: 'Uniform padding on all sides.',
+          category: 'container',
+          sort: 1,
+        },
+        margin: {
+          label: 'Margin',
+          description: 'Uniform margin on all sides.',
+          category: 'container',
+          sort: 2,
+        },
+        size: {
+          label: 'Size',
+          description: 'Fixed dimensions.',
+          category: 'container',
+          sort: 3,
+        },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
+      },
+      attributes: {
+        scrollable: {
+          label: 'Scrollable',
+          description: 'Turns scroll interaction on.',
+          category: 'container',
+          specialCategory: null,
+          sort: -1,
+        },
+        flexDirection: {
+          label: 'Flex Direction',
+          description: 'Sets row or column layout.',
+          category: 'container',
+          specialCategory: null,
+          sort: 4,
+        },
+        alignItems: {
+          label: 'Align Items',
+          description: 'Controls cross-axis alignment.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        justifyContent: {
+          label: 'Justify Content',
+          description: 'Controls main-axis alignment.',
+          category: 'container',
+          specialCategory: null,
+          sort: 5,
+        },
+        gap: {
+          label: 'Gap',
+          description: 'Space between children.',
+          category: 'container',
+          specialCategory: null,
+          sort: 10,
+          preferedScale: 's',
+        },
+        padding: {
+          label: 'Padding',
+          description: 'Uniform padding on all sides.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 6,
+          preferedScale: 's',
+        },
+        paddingHorizontal: {
+          label: 'Padding Horizontal',
+          description: 'Left and right padding.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 7,
+          preferedScale: 's',
+        },
+        paddingVertical: {
+          label: 'Padding Vertical',
+          description: 'Top and bottom padding.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 8,
+          preferedScale: 'vs',
+        },
+        paddingTop: {
+          label: 'Padding Top',
+          description: 'Top padding only.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 9,
+          preferedScale: 'vs',
+        },
+        paddingBottom: {
+          label: 'Padding Bottom',
+          description: 'Bottom padding only.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 10,
+          preferedScale: 'vs',
+        },
+        paddingLeft: {
+          label: 'Padding Left',
+          description: 'Left padding only.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 11,
+          preferedScale: 's',
+        },
+        paddingRight: {
+          label: 'Padding Right',
+          description: 'Right padding only.',
+          category: 'container',
+          specialCategory: 'padding',
+          sort: 12,
+          preferedScale: 's',
+        },
+        margin: {
+          label: 'Margin',
+          description: 'Uniform margin on all sides.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 13,
+          preferedScale: 's',
+        },
+        marginHorizontal: {
+          label: 'Margin Horizontal',
+          description: 'Left and right margin.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 14,
+          preferedScale: 's',
+        },
+        marginVertical: {
+          label: 'Margin Vertical',
+          description: 'Top and bottom margin.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 15,
+          preferedScale: 'vs',
+        },
+        marginTop: {
+          label: 'Margin Top',
+          description: 'Top margin only.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 16,
+          preferedScale: 'vs',
+        },
+        marginBottom: {
+          label: 'Margin Bottom',
+          description: 'Bottom margin only.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 17,
+          preferedScale: 'vs',
+        },
+        marginLeft: {
+          label: 'Margin Left',
+          description: 'Left margin only.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 18,
+          preferedScale: 's',
+        },
+        marginRight: {
+          label: 'Margin Right',
+          description: 'Right margin only.',
+          category: 'container',
+          specialCategory: 'margin',
+          sort: 19,
+          preferedScale: 's',
+        },
+        backgroundColor: {
+          label: 'Background Color',
+          description: 'Background fill color.',
+          category: 'style',
+          specialCategory: null,
+          sort: 20,
+        },
+        borderRadius: {
+          label: 'Border Radius',
+          description: 'Corner rounding amount.',
+          category: 'style',
+          specialCategory: null,
+          sort: 21,
+          preferedScale: 's',
+        },
+        width: {
+          label: 'Width',
+          description: 'Fixed width value.',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 0,
+          preferedScale: 's',
+        },
+        height: {
+          label: 'Height',
+          description: 'Fixed height value.',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 1,
+          preferedScale: 'vs',
+        },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
+        src: {
+          label: 'Src',
+          description: 'Image source URL.',
+          category: 'other',
+          specialCategory: null,
+          sort: 1,
+        },
+        resizeMode: {
+          label: 'Resize Mode',
+          description: 'How the image fits its container.',
+          category: 'style',
+          specialCategory: null,
+          sort: 4,
+        },
+      },
+    },
+    types: {},
+    defaults: {
+      resizeMode: 'cover',
+      width: '100%',
+      height: '100%',
+      position: 'fixed',
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      zIndex: 0,
+      flexDirection: 'column',
+    },
+  },
   {
     schemaVersion: 1,
     allowUnknownAttributes: false,
@@ -38,6 +389,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         color: 'color',
         fontSize: 'size',
         fontWeight: [
@@ -79,6 +437,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -260,6 +624,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         color: {
           label: 'Color',
           description: 'Text color of the button.',
@@ -322,6 +739,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'row' },
     },
@@ -348,6 +772,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -529,6 +959,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
     },
     types: {},
@@ -570,6 +1053,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         buttonType: ['previous_button', 'next_button', 'skip_button'],
         skipNumber: 'number',
       },
@@ -598,6 +1088,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -779,6 +1275,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         buttonType: {
           label: 'Button Type',
           description: 'Which carousel button to show.',
@@ -834,6 +1383,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         dotType: [
           'expanding_dot',
           'normal_dot',
@@ -868,6 +1424,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -1049,6 +1611,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         dotType: {
           label: 'Dot Type',
           description: 'Style used for the dots.',
@@ -1097,6 +1712,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'column' },
     },
@@ -1123,6 +1745,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -1304,6 +1932,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
     },
     types: {},
@@ -1345,6 +2026,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'column' },
     },
@@ -1371,6 +2059,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -1552,6 +2246,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
     },
     types: {},
@@ -1593,6 +2340,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         src: 'string',
         resizeMode: ['cover', 'contain', 'stretch', 'center'],
       },
@@ -1621,6 +2375,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -1780,10 +2540,11 @@ export const patterns = [
         },
         borderRadius: {
           label: 'Border Radius',
-          description: 'Corner rounding.',
+          description: 'Corner rounding amount.',
           category: 'style',
           specialCategory: null,
-          sort: 5,
+          sort: 21,
+          preferedScale: 's',
         },
         width: {
           label: 'Width',
@@ -1799,6 +2560,59 @@ export const patterns = [
           specialCategory: null,
           sort: 3,
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         src: {
           label: 'Src',
           description: 'Image source URL.',
@@ -1854,6 +2668,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'row' },
     },
@@ -1880,6 +2701,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -2061,6 +2888,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
       desiredChildren: ['=OnboardItem'],
     },
@@ -2103,6 +2983,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         labelKey: 'string',
         button_text_color: 'color',
         animation: [
@@ -2114,7 +3001,6 @@ export const patterns = [
         ],
         animation_color: 'color',
         button_background_color: 'color',
-        flex: 'number',
         events: 'EventObject[]',
       },
       defaults: { flexDirection: 'column' },
@@ -2142,6 +3028,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -2323,6 +3215,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow value in layout.',
+          category: 'container',
+          specialCategory: null,
+          sort: 6,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         labelKey: {
           label: 'Label Key',
           description: 'Localization key for the button text.',
@@ -2358,13 +3303,6 @@ export const patterns = [
           specialCategory: null,
           sort: 5,
         },
-        flex: {
-          label: 'Flex',
-          description: 'Flex grow value in layout.',
-          category: 'container',
-          specialCategory: null,
-          sort: 6,
-        },
         events: {
           label: 'Events',
           description: 'List of events fired by the button.',
@@ -2420,6 +3358,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         buttonType: ['previous_button', 'next_button', 'skip_button'],
         skipNumber: 'number',
         buttons_direction: ['row', 'column'],
@@ -2453,6 +3398,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -2634,6 +3585,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         buttonType: {
           label: 'Button Type',
           description: 'Which onboard button to show.',
@@ -2693,7 +3697,7 @@ export const patterns = [
     allowUnknownAttributes: false,
     pattern: {
       type: 'OnboardDot',
-      children: 'node',
+      children: 'never',
       attributes: {
         scrollable: 'boolean',
         flexDirection: 'never',
@@ -2717,6 +3721,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         dotType: [
           'expanding_dot',
           'normal_dot',
@@ -2726,9 +3737,7 @@ export const patterns = [
           'liquid_like',
         ],
         inactive_dot_opacity: 'number',
-        expanding_dot_width: 'number',
-        dot_style: 'string',
-        container_style: 'string',
+        expanding_dot_width: 'size',
         active_dot_color: 'color',
       },
       defaults: { flexDirection: 'column' },
@@ -2756,6 +3765,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -2937,6 +3952,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         dotType: {
           label: 'Dot Type',
           description: 'Dot animation style.',
@@ -2958,26 +4026,12 @@ export const patterns = [
           specialCategory: null,
           sort: 3,
         },
-        dot_style: {
-          label: 'Dot Style',
-          description: 'Custom style for each dot.',
-          category: 'style',
-          specialCategory: null,
-          sort: 4,
-        },
-        container_style: {
-          label: 'Container Style',
-          description: 'Style for the dot wrapper.',
-          category: 'style',
-          specialCategory: null,
-          sort: 5,
-        },
         active_dot_color: {
           label: 'Active Dot Color',
           description: 'Color of the active dot.',
           category: 'style',
           specialCategory: null,
-          sort: 6,
+          sort: 4,
         },
       },
     },
@@ -3036,6 +4090,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         textLocalizationKey: 'string',
         linkedWordFirstLocalizationKey: 'string',
         linkedWordFirstColor: 'color',
@@ -3259,6 +4320,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         textLocalizationKey: {
           label: 'Text Localization Key',
           description: 'Localization key for the footer text.',
@@ -3328,6 +4442,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
     },
     defaults: { flexDirection: 'column', paddingHorizontal: '24@s' },
@@ -3344,7 +4464,6 @@ export const patterns = [
         width: 'size',
         height: 'size',
         resizeMode: ['cover', 'contain', 'stretch', 'center'],
-        borderRadius: 'size',
         scrollable: 'boolean',
         flexDirection: ['row', 'column'],
         alignItems: ['flex-start', 'center', 'flex-end', 'stretch', 'baseline'],
@@ -3371,6 +4490,14 @@ export const patterns = [
         marginLeft: 'size',
         marginRight: 'size',
         backgroundColor: 'color',
+        borderRadius: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         video_url: 'string',
         lottie: 'string',
       },
@@ -3411,14 +4538,6 @@ export const patterns = [
           specialCategory: null,
           sort: 4,
         },
-        borderRadius: {
-          label: 'Border Radius',
-          description: 'Corner rounding amount.',
-          category: 'style',
-          specialCategory: null,
-          sort: 21,
-          preferedScale: 's',
-        },
         scrollable: {
           label: 'Scrollable',
           description: 'Turns scroll interaction on.',
@@ -3574,6 +4693,67 @@ export const patterns = [
           specialCategory: null,
           sort: 20,
         },
+        borderRadius: {
+          label: 'Border Radius',
+          description: 'Corner rounding amount.',
+          category: 'style',
+          specialCategory: null,
+          sort: 21,
+          preferedScale: 's',
+        },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         video_url: {
           label: 'Video Url',
           description: 'URL for the onboarding video.',
@@ -3608,6 +4788,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
     },
     types: {},
@@ -3649,6 +4835,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         display: ['flex', 'block'],
       },
       defaults: { flexDirection: 'column' },
@@ -3676,6 +4869,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -3855,6 +5054,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         display: {
           label: 'Display',
           description: 'Controls layout display mode.',
@@ -3908,7 +5160,13 @@ export const patterns = [
         borderRadius: 'never',
         width: 'size',
         height: 'size',
-        theme: 'string',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         use_safe_area_inset: 'boolean',
       },
       defaults: { flexDirection: 'column' },
@@ -3936,6 +5194,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -4113,12 +5377,58 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
-        theme: {
-          label: 'Theme',
-          description: 'Theme key for onboarding screens.',
-          category: 'other',
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
           specialCategory: null,
-          sort: 1,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
         },
         use_safe_area_inset: {
           label: 'Use Safe Area Inset',
@@ -4143,7 +5453,7 @@ export const patterns = [
     allowUnknownAttributes: false,
     pattern: {
       type: 'OnboardSubtitle',
-      children: 'node',
+      children: 'string',
       attributes: {
         color: 'color',
         fontSize: 'size',
@@ -4190,6 +5500,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'column' },
     },
@@ -4406,6 +5723,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
       specialCategories: {
         padding: {
@@ -4426,6 +5796,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
     },
     defaults: { flexDirection: 'column', fontSize: '14@fs', fontWeight: '600' },
@@ -4436,7 +5812,7 @@ export const patterns = [
     allowUnknownAttributes: false,
     pattern: {
       type: 'OnboardTitle',
-      children: 'node',
+      children: 'string',
       attributes: {
         color: 'color',
         fontSize: 'size',
@@ -4483,6 +5859,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'column' },
     },
@@ -4699,6 +6082,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
       specialCategories: {
         padding: {
@@ -4719,6 +6155,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
     },
     defaults: {
@@ -4765,6 +6207,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
         color: 'color',
         fontSize: 'size',
         fontWeight: [
@@ -4807,6 +6256,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -4988,6 +6443,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
         color: {
           label: 'Color',
           description: 'Text color.',
@@ -5058,6 +6566,13 @@ export const patterns = [
         borderRadius: 'size',
         width: 'size',
         height: 'size',
+        flex: 'number',
+        position: ['relative', 'absolute'],
+        top: 'size',
+        bottom: 'size',
+        left: 'size',
+        right: 'size',
+        zIndex: 'number',
       },
       defaults: { flexDirection: 'column' },
     },
@@ -5084,6 +6599,12 @@ export const patterns = [
           category: 'container',
           sort: 3,
         },
+        offset: {
+          label: 'Offset',
+          description: 'Absolute positioning offsets.',
+          category: 'container',
+          sort: 4,
+        },
       },
       attributes: {
         scrollable: {
@@ -5265,6 +6786,59 @@ export const patterns = [
           sort: 1,
           preferedScale: 'vs',
         },
+        flex: {
+          label: 'Flex',
+          description: 'Flex grow factor (e.g. 1 fills available space).',
+          category: 'container',
+          specialCategory: 'size',
+          sort: 2,
+        },
+        position: {
+          label: 'Position',
+          description: 'Sets layout positioning mode.',
+          category: 'container',
+          specialCategory: null,
+          sort: 3,
+        },
+        top: {
+          label: 'Top',
+          description: 'Offset from the top edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 22,
+          preferedScale: 'vs',
+        },
+        bottom: {
+          label: 'Bottom',
+          description: 'Offset from the bottom edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 23,
+          preferedScale: 'vs',
+        },
+        left: {
+          label: 'Left',
+          description: 'Offset from the left edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 24,
+          preferedScale: 's',
+        },
+        right: {
+          label: 'Right',
+          description: 'Offset from the right edge.',
+          category: 'container',
+          specialCategory: 'offset',
+          sort: 25,
+          preferedScale: 's',
+        },
+        zIndex: {
+          label: 'Z-Index',
+          description: 'Controls stacking order.',
+          category: 'container',
+          specialCategory: null,
+          sort: 26,
+        },
       },
     },
     defaults: { flexDirection: 'column' },