<?php
/**
 * Vertical menu settings schema.
 *
 * See the wording note in the mobile menu schema: labels are written for
 * someone describing what they want, not for someone who already knows the
 * CSS term for it. `ui.advanced` collapses a property into "Fine tuning".
 *
 * @package MenuVerse
 */

defined( 'ABSPATH' ) || exit;

return array(
	'type'       => 'object',
	'properties' => array(
		'menu'             => array(
			'type'    => 'string',
			'default' => '',
			'pattern' => '^$|^[a-z][a-z0-9_]*:\d+$',
			'ui'      => array(
				'control' => 'menu-picker',
				'group'   => 'general',
				'label'   => __( 'Which menu to show', 'menuverse' ),
				'help'    => __( 'One of the menus you have already built.', 'menuverse' ),
			),
		),
		'auto_insert'      => array(
			'type'    => 'boolean',
			'default' => false,
			'ui'      => array(
				'control' => 'toggle',
				'group'   => 'general',
				'label'   => __( 'Show it on every page automatically', 'menuverse' ),
				'help'    => __( 'A sidebar usually belongs somewhere specific, so placing it yourself with the block normally works out better.', 'menuverse' ),
			),
		),
		'title'            => array(
			'type'      => 'string',
			'default'   => '',
			'maxLength' => 60,
			'ui'        => array(
				'control'     => 'text',
				'group'       => 'general',
				'label'       => __( 'Heading above the menu', 'menuverse' ),
				'help'        => __( 'Optional, but worth filling in: screen readers use it to tell this menu apart from the others on the page.', 'menuverse' ),
				'placeholder' => __( 'In this section', 'menuverse' ),
			),
		),
		'width'            => array(
			'type'    => 'string',
			'format'  => 'css-size',
			'default' => '260px',
			'ui'      => array(
				'control' => 'unit',
				'group'   => 'general',
				'label'   => __( 'How wide', 'menuverse' ),
				'token'   => '--menuverse-vertical-width',
			),
		),

		'submenu_mode'     => array(
			'type'    => 'string',
			'default' => 'accordion',
			'enum'    => array( 'accordion', 'flyout', 'expanded' ),
			'ui'      => array(
				'control' => 'segmented',
				'group'   => 'groups',
				'label'   => __( 'Menu items that have items under them', 'menuverse' ),
				'options' => array(
					'accordion' => __( 'Fold away', 'menuverse' ),
					'flyout'    => __( 'Slide out sideways', 'menuverse' ),
					'expanded'  => __( 'Always open', 'menuverse' ),
				),
			),
		),
		'expand_current'   => array(
			'type'    => 'boolean',
			'default' => true,
			'ui'      => array(
				'control' => 'toggle',
				'group'   => 'groups',
				'label'   => __( 'Open the section the visitor is currently in', 'menuverse' ),
				'help'    => __( 'Recommended. The right section is already open when the page appears, with no flicker.', 'menuverse' ),
			),
		),
		'single_open'      => array(
			'type'    => 'boolean',
			'default' => false,
			'ui'      => array(
				'control'  => 'toggle',
				'group'    => 'groups',
				'advanced' => true,
				'label'    => __( 'Close one section when another opens', 'menuverse' ),
			),
		),
		'indent'           => array(
			'type'    => 'string',
			'format'  => 'css-size',
			'default' => '14px',
			'ui'      => array(
				'control'  => 'unit',
				'group'    => 'groups',
				'advanced' => true,
				'label'    => __( 'How far to indent nested items', 'menuverse' ),
				'token'    => '--menuverse-vertical-indent',
			),
		),

		'sticky'           => array(
			'type'    => 'boolean',
			'default' => false,
			'ui'      => array(
				'control' => 'toggle',
				'group'   => 'sticky',
				'label'   => __( 'Keep it on screen while the page scrolls', 'menuverse' ),
				'help'    => __( 'If you turn this on and nothing sticks, the area of your theme holding the menu is almost certainly cutting it off.', 'menuverse' ),
			),
		),
		'sticky_offset'    => array(
			'type'    => 'string',
			'format'  => 'css-size',
			'default' => '24px',
			'ui'      => array(
				'control'  => 'unit',
				'group'    => 'sticky',
				'advanced' => true,
				'label'    => __( 'Gap above it once it sticks', 'menuverse' ),
				'help'     => __( 'Increase this if your theme has a header that stays at the top of the screen.', 'menuverse' ),
				'token'    => '--menuverse-vertical-offset',
			),
		),

		'active_indicator' => array(
			'type'    => 'string',
			'default' => 'bar',
			'enum'    => array( 'none', 'bar', 'background' ),
			'ui'      => array(
				'control' => 'segmented',
				'group'   => 'style',
				'label'   => __( 'How to mark the current page', 'menuverse' ),
				'options' => array(
					'none'       => __( 'Do not mark it', 'menuverse' ),
					'bar'        => __( 'Bar down the side', 'menuverse' ),
					'background' => __( 'Filled background', 'menuverse' ),
				),
			),
		),
		'link_color'       => array(
			'type'    => 'string',
			'format'  => 'color',
			'default' => '',
			'ui'      => array(
				'control' => 'color',
				'group'   => 'style',
				'label'   => __( 'Link colour', 'menuverse' ),
				'help'    => __( 'Leave empty to inherit your theme’s colours.', 'menuverse' ),
				'token'   => '--menuverse-vertical-color',
			),
		),
		'active_color'     => array(
			'type'    => 'string',
			'format'  => 'color',
			'default' => '',
			'ui'      => array(
				'control' => 'color',
				'group'   => 'style',
				'label'   => __( 'Colour for the current page', 'menuverse' ),
				'token'   => '--menuverse-vertical-active-color',
			),
		),
		'hover_background' => array(
			'type'    => 'string',
			'format'  => 'color',
			'default' => '',
			'ui'      => array(
				'control'  => 'color',
				'group'    => 'style',
				'advanced' => true,
				'label'    => __( 'Background when someone points at an item', 'menuverse' ),
				'token'    => '--menuverse-vertical-hover',
			),
		),
		'dividers'         => array(
			'type'    => 'boolean',
			'default' => false,
			'ui'      => array(
				'control'  => 'toggle',
				'group'    => 'style',
				'advanced' => true,
				'label'    => __( 'Thin line between items', 'menuverse' ),
			),
		),
	),
	'ui'         => array(
		'preview' => array(
			'viewport' => 768,
		),
		'presets' => array(
			array(
				'id'          => 'docs',
				'label'       => __( 'Documentation sidebar', 'menuverse' ),
				'description' => __( 'Folding sections that follow you down the page. Good for long, deep sites.', 'menuverse' ),
				'values'      => array(
					'submenu_mode'     => 'accordion',
					'expand_current'   => true,
					'single_open'      => true,
					'sticky'           => true,
					'active_indicator' => 'bar',
					'dividers'         => false,
					'width'            => '260px',
				),
			),
			array(
				'id'          => 'simple',
				'label'       => __( 'Plain list', 'menuverse' ),
				'description' => __( 'Everything visible at once, nothing to expand. Best for short menus.', 'menuverse' ),
				'values'      => array(
					'submenu_mode'     => 'expanded',
					'expand_current'   => true,
					'single_open'      => false,
					'sticky'           => false,
					'active_indicator' => 'background',
					'dividers'         => true,
					'width'            => '240px',
				),
			),
			array(
				'id'          => 'compact',
				'label'       => __( 'Slide-out sections', 'menuverse' ),
				'description' => __( 'Nested items appear beside the menu instead of pushing it taller.', 'menuverse' ),
				'values'      => array(
					'submenu_mode'     => 'flyout',
					'expand_current'   => false,
					'single_open'      => false,
					'sticky'           => true,
					'active_indicator' => 'background',
					'dividers'         => false,
					'width'            => '220px',
				),
			),
		),
		'groups'  => array(
			'general' => array(
				'label'       => __( 'The basics', 'menuverse' ),
				'description' => __( 'Which menu to show, and how much room it takes.', 'menuverse' ),
				'order'       => 10,
			),
			'groups'  => array(
				'label'       => __( 'Nested items', 'menuverse' ),
				'description' => __( 'Only relevant if your menu has items nested under other items.', 'menuverse' ),
				'order'       => 20,
			),
			'sticky'  => array(
				'label' => __( 'Following the page', 'menuverse' ),
				'order' => 30,
			),
			'style'   => array(
				'label' => __( 'How it looks', 'menuverse' ),
				'order' => 40,
			),
		),
	),
);
