# Default element data

Guide to Default Data Structure in YayMail Elements

1. Basic Element Data Structure<br>

   ```php
   public static function get_data( $attributes = [] ) {    
       return [
           'id'        => uniqid(),
           'type'      => self::$type,
           'name'      => 'Element Name',
           'icon'      => self::$icon,
           'group'     => 'your_group',
           'available' => true,
           'position'  => 190,
           'data'      => [
               // Element specific data here
           ]
       ];
   }
   ```

2. Example Implementation<br>

   ```php
   <?php
   public static function get_data( $attributes = [] ) {
       return [
           'id'        => uniqid(),
           'type'      => self::$type,
           'name'      => 'New Element',
           'icon'      => self::$icon,
           'group'     => 'woocommerce',
           'available' => true,
           'position'  => 190,
           'data'      => [
               // Layout
               'padding' => [
                   'value_path'    => 'padding',
                   'component'     => 'Spacing',
                   'title'         => 'Padding',
                   'default_value' => [
                       'top'    => '15',
                       'right'  => '50',
                       'bottom' => '15',
                       'left'   => '50',
                   ],
               ],
               'align'            => [
                   'value_path'    => 'align',
                   'component'     => 'Align',
                   'title'         => 'Align',
                   'default_value' => 'center',
               ],
               'width'            => [
                   'value_path'    => 'width',
                   'component'     => 'Dimension',
                   'title'         => 'Width',
                   'default_value' => '100',
                   'extras_data'   => [
                       'min'  => 0,
                       'max'  => 100,
                       'unit' => '%',
                   ],
               ],
               'height'           => [
                   'value_path'    => 'height',
                   'component'     => 'Dimension',
                   'title'         => 'Height',
                   'default_value' => '6',
                   'extras_data'   => [
                       'min' => 1,
                       'max' => 30,
                   ],
               ],
               'border_width'            => [
                   'value_path'    => 'border_width',
                   'component'     => 'NumberInput',
                   'title'         => 'Border width',
                   'default_value' => '3',
                   'extras_data'   => [
                       'min' => 0,
                       'max' => 100,
                   ],
               ],
               'border_radius' => [
                   'component'     => 'Spacing',
                   'value_path'    => 'border_radius',
                   'title'         => 'Border radius',
                   'default_value' => [
                       'top_left'     => '5',
                       'top_right'    => '5',
                       'bottom_right' => '5',
                       'bottom_left'  => '5',
                   ],
               ],
              
               
               // Colors
               'text_color'           => [
                   'value_path'    => 'text_color',
                   'component'     => 'Color',
                   'title'         => 'Text color',
                   'default_value' => YAYMAIL_COLOR_TEXT_DEFAULT,
               ],
               'background_color' => [
                   'value_path'    => 'background_color',
                   'component'     => 'Color',
                   'title'         => 'Background color',
                   'default_value' => YAYMAIL_COLOR_BACKGROUND_DEFAULT,
               ],
               'background_image'       => [
                   'value_path'    => 'background_image',
                   'component'     => 'BackgroundImage',
                   'title'         => 'Background image',
                   'default_value' => [
                       'url'        => '',
                       'position'   => 'default',
                       'x_position' => 0,
                       'y_position' => 0,
                       'repeat'     => 'default',
                       'size'       => 'default',
                   ],
               ],
               'border_color'         => [
                   'value_path'    => 'border_color',
                   'component'     => 'Color',
                   'title'         => 'Border color',
                   'default_value' => YAYMAIL_COLOR_BORDER_DEFAULT,
               ],
               
               // Typography
               'font_family' => [
                   'value_path'    => 'font_family',
                   'component'     => 'FontFamilySelector',
                   'title'         => 'Font family',
                   'default_value' => YAYMAIL_DEFAULT_FAMILY,
               ],
               'border_style'            => [
                       'value_path'    => 'border_style',
                       'component'     => 'Selector',
                       'title'         => 'Border style',
                       'default_value' => 'solid',
                       'extras_data'   => [
                           'options' => [
                               [
                                   'label' => 'Solid',
                                   'value' => 'solid',
                               ],
                               [
                                   'label' => 'Double',
                                   'value' => 'double',
                               ],
                               [
                                   'label' => 'Dotted',
                                   'value' => 'dotted',
                               ],
                               [
                                   'label' => 'Dashed',
                                   'value' => 'dashed',
                               ],
                           ],
                       ],
                   ],
               
               // Title  
               'title' => [
                   'value_path'    => 'title',
                   'component'     => 'TextInput',
                   'title'         => 'Title',
                   'default_value' => 'Default Title',
               ],
               'title_color'          => [
                   'value_path'    => 'title_color',
                   'component'     => 'Color',
                   'title'         => 'Title color',
                   'default_value' => YAYMAIL_COLOR_WC_DEFAULT,
               ],
               
               // Content
               'url'              => [
                   'value_path'    => 'url',
                   'component'     => 'TextInput',
                   'title'         => 'URL',
                   'default_value' => '#',
               ],
               'content' => [
                   'value_path'    => 'content',
                   'component'     => 'RichTextEditor',
                   'title'         => 'Content',
                   'default_value' => '[your_shortcode]', // please folow created custom shortcode 
               ],
               'content_width'           => [
                   'value_path'    => 'content_width',
                   'component'     => 'Dimensions',
                   'title'         => 'Content width',
                   'default_value' => '60',
               ],
               
               // Divider
               'divider_color'    => [
                   'value_path'    => 'divider_color',
                   'component'     => 'Color',
                   'title'         => 'Line color',
                   'default_value' => '#333',
               ],
               'divider_type'     => [
                   'value_path'    => 'divider_type',
                   'component'     => 'DividerTypeSelector',
                   'title'         => 'Line type',
                   'default_value' => 'solid',
                   'extras_data'   => [
                       'options' => [
                           [
                               'label' => 'Solid',
                               'value' => 'solid',
                           ],
                           [
                               'label' => 'Double',
                               'value' => 'double',
                           ],
                           [
                               'label' => 'Dotted',
                               'value' => 'dotted',
                           ],
                           [
                               'label' => 'Dashed',
                               'value' => 'dashed',
                           ],
                       ],
                   ],
               ],
               
               // Button
               'button_text'             => [
                   'value_path'    => 'button_text',
                   'component'     => 'TextInput',
                   'title'         => 'Button text',
                   'default_value' => 'ORDER NOW',
               ],
               'button_url'              => [
                   'value_path'    => 'button_url',
                   'component'     => 'TextInput',
                   'title'         => 'Button URL',
                   'default_value' => '#',
               ],
               'button_background_color' => [
                   'value_path'    => 'button_background_color',
                   'component'     => 'Color',
                   'title'         => 'Button background color',
                   'default_value' => YAYMAIL_COLOR_BACKGROUND_DEFAULT,
               ],
               'button_text_color'       => [
                   'value_path'    => 'button_text_color',
                   'component'     => 'Color',
                   'title'         => 'Button text color',
                   'default_value' => '#fff',
               ],
               
               // Icon
               'width_icon'       => [
                   'value_path'    => 'width_icon',
                   'component'     => 'Dimension',
                   'title'         => 'Width',
                   'default_value' => '24',
                   'extras_data'   => [
                       'min' => 0,
                       'max' => 100,
                   ],
               ],
               'theme'            => [
                   'value_path'    => 'theme',
                   'component'     => 'SocialIconThemeSelector',
                   'title'         => 'Styles theme',
                   'default_value' => 'Colorful',
               ],
               'icon_list'        => [
                   'value_path'    => 'icon_list',
                   'component'     => 'SocialList',
                   'title'         => 'Socials',
                   'default_value' => [
                       [
                           'icon' => 'facebook',
                           'url'  => '#',
                       ],
                       [
                           'icon' => 'instagram',
                           'url'  => '#',
                       ],
                       [
                           'icon' => 'linkedin',
                           'url'  => '#',
                       ],
                   ],
               ],
               
               // Image Box
               'image_box'        => [
                   'component' => 'ImageBox',
                   'column_1'  => [
                       'padding' => [
                           'top'    => '10',
                           'right'  => '10',
                           'bottom' => '10',
                           'left'   => '50',
                       ],
                       'align'   => 'center',
                       'image'   => YAYMAIL_PLUGIN_URL . 'assets/images/default-photo.png' ,
                       'width'   => '242',
                       'url'     => '#',
                   ],
                   'column_2'  => [
                       'padding'     => [
                           'top'    => '10',
                           'right'  => '50',
                           'bottom' => '10',
                           'left'   => '10',
                       ],
                       'font_family' => YAYMAIL_DEFAULT_FAMILY,
                       'rich_text'   => '<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>',
                   ],
               ],
               
               // Image List
               'image_list'       => [
                   'value_path'    => 'image_list',
                   'component'     => 'ImageList',
                   'default_value' => [
                       'column_1' => [
                           'align'            => 'center',
                           'padding'          => [
                               'top'    => '10',
                               'right'  => '10',
                               'bottom' => '10',
                               'left'   => '50',
                           ],
                           'image'            => YAYMAIL_PLUGIN_URL . 'assets/images/default-photo.png',
                           'width'            => '100',
                           'background_color' => '#fff',
                           'url'              => '#',
                       ],
                       'column_2' => [
                           'align'            => 'center',
                           'padding'          => [
                               'top'    => '10',
                               'right'  => '10',
                               'bottom' => '10',
                               'left'   => '50',
                           ],
                           'image'            => YAYMAIL_PLUGIN_URL . 'assets/images/default-photo.png',
                           'width'            => '100',
                           'background_color' => '#fff',
                           'url'              => '#',
                       ],
                       'column_3' => [
                           'align'            => 'center',
                           'padding'          => [
                               'top'    => '10',
                               'right'  => '10',
                               'bottom' => '10',
                               'left'   => '50',
                           ],
                           'image'            => YAYMAIL_PLUGIN_URL . 'assets/images/default-photo.png',
                           'width'            => '100',
                           'background_color' => '#fff',
                           'url'              => '#',
                       ],
                   ],
               ],
           ],
       ];
   }
   ```