Typography fields didn't work if there are no other fields type or written at the very first line

[aprakasa]

Issue description:

The problem occurs if there are only typography field type (left image) or written on the very first line before other fields type (right image).

It works perfectly if there are other field types before typography.

Version used:

(Did you try using the develop branch from github? There's a chance your issue has already been adressed there) The last version of wp.org and development branch.

Using theme_mods or options?

theme_mods

Code to reproduce the issue (config + field(s))

Config, panel and section:

Kirki::add_config( 'kirki_demo', array(
    'capability'  => 'edit_theme_options',
    'option_type' => 'theme_mod',
) );

Kirki::add_panel( 'kirki_demo_panel', array(
    'priority'    => 10,
    'title'       => esc_attr__( 'Kirki Demo Panel', 'kirki' ),
    'description' => esc_attr__( 'Contains sections for all kirki controls.', 'kirki' ),
) );

Kirki::add_section( 'typography_section', array(
    'title'       => esc_attr__( 'Typography section', 'kirki' ),
    'panel'       => 'kirki_demo_panel',
) );

Kirki::add_section( 'color_section', array(
    'title'       => esc_attr__( 'Color Section', 'kirki' ),
    'panel'       => 'kirki_demo_panel',
) );

Only typography fields type (illustration 1):

Kirki::add_field( 'kirki_demo', array(
    'type'        => 'typography',
    'settings'    => 'typography_setting_0',
    'label'       => esc_attr__( 'Typography Control Label', 'kirki' ),
    'description' => esc_attr__( 'The full set of options.', 'kirki' ),
    'section'     => 'typography_section',
    'default'     => array(
        'font-family'    => 'Roboto',
        'variant'        => 'regular',
        'font-size'      => '14px',
        'line-height'    => '1.5',
        'letter-spacing' => '0',
        'subsets'        => array( 'latin-ext' ),
        'color'          => '#333333',
        'text-transform' => 'none',
        'text-align'     => 'left',
    ),
    'priority'    => 10,
) );

Written before any other field types (illustration 2):

Kirki::add_field( 'kirki_demo', array(
    'type'        => 'typography',
    'settings'    => 'typography_setting_0',
    'label'       => esc_attr__( 'Typography Control Label', 'kirki' ),
    'description' => esc_attr__( 'The full set of options.', 'kirki' ),
    'section'     => 'typography_section',
    'default'     => array(
        'font-family'    => 'Roboto',
        'variant'        => 'regular',
        'font-size'      => '14px',
        'line-height'    => '1.5',
        'letter-spacing' => '0',
        'subsets'        => array( 'latin-ext' ),
        'color'          => '#333333',
        'text-transform' => 'none',
        'text-align'     => 'left',
    ),
    'priority'    => 10,
) );

Kirki::add_field( 'kirki_demo', array(
    'type'        => 'color',
    'settings'    => 'color_setting_hex',
    'label'       => __( 'Color Control (hex-only)', 'kirki' ),
    'description' => esc_attr__( 'This is a color control - without alpha channel.', 'kirki' ),
    'section'     => 'color_section',
    'default'     => '#0088CC',
) );

This one below is working fine:

Kirki::add_field( 'kirki_demo', array(
    'type'        => 'color',
    'settings'    => 'color_setting_hex',
    'label'       => __( 'Color Control (hex-only)', 'kirki' ),
    'description' => esc_attr__( 'This is a color control - without alpha channel.', 'kirki' ),
    'section'     => 'color_section',
    'default'     => '#0088CC',
) );

Kirki::add_field( 'kirki_demo', array(
    'type'        => 'typography',
    'settings'    => 'typography_setting_0',
    'label'       => esc_attr__( 'Typography Control Label', 'kirki' ),
    'description' => esc_attr__( 'The full set of options.', 'kirki' ),
    'section'     => 'typography_section',
    'default'     => array(
        'font-family'    => 'Roboto',
        'variant'        => 'regular',
        'font-size'      => '14px',
        'line-height'    => '1.5',
        'letter-spacing' => '0',
        'subsets'        => array( 'latin-ext' ),
        'color'          => '#333333',
        'text-transform' => 'none',
        'text-align'     => 'left',
    ),
    'priority'    => 10,
) );

[rinkuyadav999]

Hi @aryaprakasa

Yes, i just test it and you are right. there is bug.

[aristath]

Fixed in the develop branch.

@aryaprakasa thank you for reporting this!