(function($){
    "use strict";
    const { __, _x, sprintf } = wp.i18n;

    // counter
    $.pixeStyleSelectorOption['counter-settings'] = {
        'title': 'Counter Settings',
        'device-selector': true,
        'options': {
            'start-number': {
                'title': 'Start Number',
                'type': 'range-input',
                'min': 0,
                'max': 10000,
                'width': '1-2',
                'device-selector': false,
            },
            'end-number': {
                'title': 'End Number',
                'type': 'range-input',
                'min': 0,
                'max': 10000,
                'width': '1-2',
                'device-selector': false,
            },
            'thousand-separator': {
                'title': 'Thousand Sep',
                'type': 'text',
                'width': '1-2',
                'device-selector': false,
            },
            'decimal-separator': {
                'title': 'Decimal Sep',
                'type': 'text',
                'width': '1-2',
                'device-selector': false,
            },
            'prefix': {
                'title': 'Prefix',
                'type': 'text',
                'width': '1-2',
                'device-selector': false,
            },
            'suffix': {
                'title': 'Suffix',
                'type': 'text',
                'width': '1-2',
                'device-selector': false,
            },
            'alignment': {
                'title': 'Alignment',
                'type': 'radioicon',
                'options': 'alignment',
                'width': '1-2'
            },
            'gap': {
                'title': 'Pre/Suffix Spacing',
                'type': 'range-input',
                'range': 'margin',
                'width': '1-1',
            },
            'number-color': {
                'title': 'Number Color',
                'type': 'colordisplay',
                'color-type': 'inline-color',
                'width': '1-2'
            },
            'prefix-color': {
                'title': 'Prefix Color',
                'type': 'colordisplay',
                'color-type': 'inline-color',
                'width': '1-2'
            },
            'suffix-color': {
                'title': 'Suffix Color',
                'type': 'colordisplay',
                'color-type': 'inline-color',
                'width': '1-2'
            }
        }
    }

    // table of contents
    $.pixeStyleSelectorOption['toc-content-color'] = function(){
        return {
            'title': 'Text Color Settings',
            'type': 'tab',
            'options': [{
                slug: 'text-color-d',
                label: 'Number / Bullet',
            },
            {
                slug: 'link-text-color',
                label: 'Heading',
            }, ]
        }
    }
    $.pixeStyleSelectorOption['toc-layout'] = function(){
        return {
            'title': 'Table of Content Settings',
            'options': {
                'title': {
                    'title': 'Heading Text',
                    'type': 'text',
                    'width': '1-1'
                },
                'toggle': {
                    'title': 'Enable Toggle',
                    'type': 'checkbox',
                    'default': 'yes',
                    'width': '1-2'
                },
                'initial': {
                    'title': 'Initial State',
                    'type': 'combobox',
                    'options': {
                        '': 'Open',
                        'close': 'Close'
                    },
                    'width': '1-2',
                    'with-default': false,
                    'condition': { 'toggle': '' }
                }
            }
        };
    }
    $.pixeStyleSelectorOption['toc-content'] = function(){
        return {
            'title': 'Table of Content Settings',
            'options': {
                'style': {
                    'title': 'Style',
                    'type': 'combobox',
                    'options': {
                        '': 'Number',
                        'ul': 'Bullet',
                        'none': 'None',
                    },
                    'width': '1-1',
                    'with-default': false
                },
                'collapse': {
                    'title': 'Hide Sublevels',
                    'type': 'checkbox',
                    'default': 'no',
                    'width': '1-2'
                },
                'hierarchy': {
                    'title': 'Show Hierarchy',
                    'type': 'checkbox',
                    'default': 'yes',
                    'width': '1-2'
                },
                'hierarchy-indent': {
                    'title': 'Hierarchy Indent',
                    'type': 'range-input',
                    'range': 'gap',
                    'width': '1-2',
                },
                'line-spacing': {
                    'title': 'Line Spacing',
                    'type': 'range-input',
                    'range': 'gap',
                    'width': '1-2',
                },
                'tags': {
                    'title': 'Used Tags',
                    'type': 'multi-combobox',
                    'options': {
                        'h1': 'h1',
                        'h2': 'h2',
                        'h3': 'h3',
                        'h4': 'h4',
                        'h5': 'h5',
                        'h6': 'h6',
                    },
                    'width': '1-1',
                    'tip-text': 'Only select the content from "Heading Item"',
                },
            }
        };
    }

    // hamburger button
    $.pixeStyleSelectorOption['hamburger-button-background'] = {
        'title': 'Hamburger Button Style',
        'type': 'tab',
        'options': [{
            slug: 'color-ds',
            label: 'Line Color'
        }, {
            slug: 'bg-border',
            label: 'Outer Border'
        }]
    };
    $.pixeStyleSelectorOption['hamburger-button-settings'] = {
        'title': 'Hamburger Button Settings',
        'options': {
            'line-count': {
                'title': 'Line Count (1-6)',
                'type': 'range-input',
                'min': 1,
                'max': 6,
                'width': '1-2'
            },
            'alignment': {
                'title': 'Alignment',
                'type': 'radioicon',
                'options': 'alignment',
                'width': '1-2'
            },
            'button-width': {
                'title': 'Button Width',
                'type': 'range-input',
                'range': 'button-width',
                'width': '1-2',
            },
            'line-height': {
                'title': 'Line Height',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2',
            },
            'line-radius': {
                'title': 'Line Radius',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2',
            },
            'line-spacing': {
                'title': 'Line Spacing',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2',
            },
            'outer-spacing': {
                'title': 'Outer Spacing',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2',
            },
            'hover-animation': {
                'title': 'Hover Animation',
                'type': 'checkbox',
                'default': 'yes',
                'width': '1-2'
            },
            'x-morph': {
                'title': 'Morph to X',
                'type': 'checkbox',
                'default': 'yes',
                'width': '1-2'
            }
        }
    };

    // table
    $.pixeStyleSelectorOption['table-layout'] = {
        'title': 'Table Settings',
        'options': {
            'header': {
                'title': 'Enable Header',
                'type': 'checkbox',
                'default': 'yes',
                'width': '1-2'
            },
            'footer': {
                'title': 'Enable Footer',
                'type': 'checkbox',
                'default': 'yes',
                'width': '1-2'
            }
        }
    }
    $.pixeStyleSelectorOption['table-section-border'] = {
        'title': 'Table Border Settings',
        'type': 'tab',
        'options': ['table-v-border', 'table-h-border']
    }
    $.pixeStyleSelectorOption['table-v-border'] = {
        'title': 'Vertical Border',
        'device-selector': true,
        'options': {
            'v-width': {
                'title': 'Border Width',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2'
            },
            'v-color': {
                'title': 'Border Color',
                'type': 'colorpicker',
                'gradient': false
            }
        }
    }
    $.pixeStyleSelectorOption['table-h-border'] = {
        'title': 'Horizontal Border',
        'device-selector': true,
        'options': {
            'h-width': {
                'title': 'Border Width',
                'type': 'range-input',
                'range': 'border',
                'width': '1-2'
            },
            'h-color': {
                'title': 'Border Color',
                'type': 'colorpicker',
                'gradient': false
            }
        }
    }
    $.pixeStyleSelectorOption['table-border'] = {
        'title': 'Background Styling',
        'type': 'tab',
        'options': ['text-box-bg-border', 'text-box-bg-shadow']
    }
    $.pixeStyleSelectorOption['table-body-bg'] = {
        'title': 'Background Styling',
        'type': 'tab',
        'options': ['table-even-bg', 'table-odd-bg']
    }
    $.pixeStyleSelectorOption['table-even-bg'] = {
        'title': 'Even Row BG',
        'device-selector': true,
        'options': {
            'even-bg': {
                'type': 'colorpicker',
            }
        }
    }
    $.pixeStyleSelectorOption['table-odd-bg'] = {
        'title': 'Odd Row BG',
        'device-selector': true,
        'options': {
            'odd-bg': {
                'type': 'colorpicker',
            }
        }
    }
    $.pixeStyleSelectorOption['table-bg'] = {
        'title': 'Background',
        'device-selector': true,
        'options': {
            'bg': {
                'type': 'colorpicker',
            }
        }
    }

    // tab
    $.pixeStyleSelectorOption['tab-background'] = {
        'title': 'Text Color Settings',
        'options': {
            'tab': {
                'title': 'Tab BG Style',
                'type': 'colordisplay',
                'color-type': 'button-background',
                'width': '1-2'   
            },
            'container': {
                'title': 'Container BG Style',
                'type': 'colordisplay',
                'color-type': 'button-background',
                'width': '1-2'   
            }
        }
    }
    $.pixeStyleSelectorOption['tab-spacing'] = {
        'title': 'Spacing',
        'device-selector': true,
        'options': {
            'padding': {
                'title': 'Tab Padding',
                'type': 'padding'
            },
            'gap': {
                'title': 'Tab Gap',
                'type': 'range-input',
                'range': 'gap',
                'width': '1-2'
            },
            'container-padding': {
                'title': 'Container Padding',
                'type': 'padding'
            },
            'container-margin': {
                'title': 'Container Margin',
                'type': 'margin'
            },
        }
    }

    // accordion
    $.pixeStyleSelectorOption['accordion-color'] = {
        'title': 'Text Color Settings',
        'options': {
            'title': {
                'title': 'Text Color',
                'type': 'colordisplay',
                'color-type': 'button-text',
                'width': '1-2'   
            },
            'side-text': {
                'title': 'Side Text Color',
                'type': 'colordisplay',
                'color-type': 'button-text',
                'width': '1-2'   
            }
        }
    }
    $.pixeStyleSelectorOption['accordion-spacing'] = {
        'title': 'Spacing',
        'device-selector': true,
        'options': {
            'padding': {
                'title': 'Padding',
                'type': 'padding'
            },
            'margin': {
                'title': 'Margin',
                'type': 'margin'
            },
            'side-text-gap': {
                'title': 'Side Text Space',
                'type': 'range-input',
                'range': 'gap',
                'width': '1-2'
            },
            'side-text-offset': {
                'title': 'Side Text Offset',
                'type': 'range-input',
                'range': 'gap-minus',
                'width': '1-2'
            }
        }
    };
    $.pixeStyleSelectorOption['accordion-toggle'] = {
        'title': 'Toggle Settings',
        'options': {
            'open': {
                'title': 'Open by Default (Toggle Mode Only)',
                'type': 'checkbox',
                'default': 'no',
                'width': '1-1'
            },
            'side-text': {
                'title': 'Side Text',
                'type': 'textarea',
                'width': '1-1'
            },
            'side-text-position': {
                'title': 'Side Text Position',
                'type': 'combobox',
                'options': {
                    '': 'Left',
                    'right': 'Right'
                },
                'with-default': false,
                'width': '1-1'
            }
        }
    }
    $.pixeStyleSelectorOption['accordion-icon'] = {
        'title': 'Image / Icon',
        'pointer-state': 'active',
        'device-selector': true,
        'options': {
            'plus': {
                'title': 'Plus Icon',
                'type': 'icon',
                'pointer-state': false,
                'device-selector': false
            },
            'minus': {
                'title': 'Minus Icon',
                'type': 'icon',
                'pointer-state': false,
                'device-selector': false
            },
            'width': {
                'title': ' Icon Size',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            },
            'space': {
                'title': 'Space',
                'type': 'range-input',
                'range': 'gap',
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            },
            'bg-width': {
                'title': ' Icon Width',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            },
            'bg-height': {
                'title': ' Icon Height',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            },
            'v-offset': {
                'title': 'Vertical Offset',
                'type': 'range-input',
                'range': 'gap-minus',
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            },
            'spacing': {
                'title': 'Icon BG Spacing',
                'type': 'ssdisplay',
                'ss-type': 'spacing-nd',
                'ss-icon': 'pixe-svg-spaces',
                'width': '1-2',
                'pointer-state': false
            },
            'bg': {
                'title': 'Icon BG Style',
                'type': 'ssdisplay',
                'ss-type': 'inline-bg-style',
                'ss-icon': 'pixe-svg-color',
                'width': '1-2'
            },
            'color': {
                'title': 'Icon & Svg Color',
                'type': 'colordisplay',
                'width': '1-2',
                'color-type': 'plain-color'
            },
            'position': {
                'title': 'Icon Position',
                'type': 'combobox',
                'options': {
                    '': 'Left',
                    'right': 'Right'
                },
                'width': '1-2',
                'with-default': false,
                'pointer-state': false,
                'device-selector': false
            },
            'align': {
                'title': 'Header Alignment',
                'type': 'combobox',
                'options': { 
                    'flex-start': 'Flex Start',
                    'flex-end': 'Flex End',
                    'center': 'Center',
                    'space-between': 'Space Between',
                },
                'width': '1-2',
                'pointer-state': false,
                'device-selector': false
            }
        }
    };

    // paypal button
    // https://developer.paypal.com/api/nvp-soap/paypal-payments-standard/integration-guide/Appx-websitestandard-htmlvariables/
    $.pixeStyleSelectorOption['paypal-button-settings'] = {
        'title': 'Paypal Button Settings',
        'options': {
            'live': {
                'title': 'Live ( Disable For Test Mode)',
                'type': 'checkbox',
                'default': 'no',
                'width': '1-1'
            },
            'account': {
                'title': 'Paypal Account',
                'type': 'text',
                'width': '1-1'
            },
            'payment-type': {
                'title': 'Payment Type',
                'type': 'combobox',
                'options': {
                    '': 'Checkout',
                    'donation': 'Donation',
                    'subscription': 'Subscription'
                },
                'with-default': false,
                'width': '1-1'
            },
            'heading': {
                'heading': 'Item Details',
                'type': 'heading'
            },
            'name': {
                'title': 'Item Name',
                'type': 'text',
                'width': '1-1'
            },
            'sku': {
                'title': 'SKU',
                'type': 'text',
                'width': '1-1'
            },
            'billing-cycle': {
                'title': 'Billing Cycle',
                'type': 'combobox',
                'options': {
                    '': 'Monthly',
                    'D': 'Daily',
                    'W': 'Weekly',
                    'Y': 'Yearly'
                },
                'with-default': false,
                'width': '1-2',
                'condition': { 'payment-type': 'subscription' }
            },
            'cycle-duration': {
                'title': 'Cycle Duration',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': 'subscription' }
            },
            'price': {
                'title': 'Price',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': ['', 'subscription'] }
            },
            'shipping-price': {
                'title': 'Shipping Price',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': '' }
            },
            'quantity': {
                'title': 'Quantity',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': '' }
            },
            'donation': {
                'title': 'Donation Type',
                'type': 'combobox',
                'options': {
                    '': 'Fixed',
                    'any': 'Any Amount'
                },
                'with-default': false,
                'condition': { 'payment-type': 'donation' },
                'width': '1-2'
            },
            'amount': {
                'title': 'Amount',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': 'donation', 'donation': '' }
            },
            'currency': {
                'title': 'Currency',
                'type': 'combobox',
                'options': {
                    '': 'USD',
                    'AUD': 'AUD',
                    'BRL': 'BRL',
                    'CAD': 'CAD',
                    'CNY': 'CNY',
                    'CZK': 'CZK',
                    'DKK': 'DKK',
                    'EUR': 'EUR',
                    'HKD': 'HKD',
                    'HUF': 'HUF',
                    'ILS': 'ILS',
                    'JPY': 'JPY',
                    'MYR': 'MYR',
                    'MXN': 'MXN',
                    'NOK': 'NOK',
                    'NZD': 'NZD',
                    'PHP': 'PHP',
                    'PLN': 'PLN',
                    'GBP': 'GBP',
                    'RUB': 'RUB',
                    'SGD': 'SGD',
                    'SEK': 'SEK',
                    'CHF': 'CHF',
                    'TWD': 'TWD',
                    'THB': 'THB',
                },
                'width': '1-2',
                'with-default': false
            },
            'tax': {
                'title': 'Tax (%)',
                'type': 'text',
                'width': '1-2',
                'condition': { 'payment-type': '' }
            },
            'renewal': {
                'title': 'Renewal',
                'type': 'combobox',
                'options': {
                    '': 'None',
                    'auto': 'Auto Renewal',
                    'fixed': 'Fixed Renewal'
                },
                'with-default': false,
                'condition': { 'payment-type': 'subscription' },
                'width': '1-2'
            },
            'cycles': {
                'title': 'Recurring Cycle(s)',
                'type': 'range-input',
                'min': 2,
                'max': 52,
                'placeholder': '2-52',
                'width': '1-2',
                'condition': { 'payment-type': 'subscription', 'renewal': 'fixed' },
            },
        }
    }
    $.pixeStyleSelectorOption['paypal-button-link'] = {
        'title': 'Link Settings',
        'options': {
            'link-to': {
                'title': 'Redirect After Payment',
                'type': 'combobox',
                'width': '1-1',
                'options': 'siteLink'
            },
            'custom-url': {
                'title': 'URL',
                'type': 'text',
                'width': '1-1',
                'condition': { 'link-to': 'custom' }
            },
            'post-id': {
                'title': 'Select Post',
                'type': 'combobox',
                'width': '1-1',
                'condition': { 'link-to': 'pixe-callback' },
                'callback': 'post'
            }
        }
    }

    // google map
    $.pixeStyleSelectorOption['google-map-style'] = {
        'title': 'Google Map Style',
        'options': {
            'height': {
                'title': 'Height',
                'type': 'range-input',
                'min': 150,
                'max': 600,
                'width': '1-1'
            },
            'divider': {
                'type': 'divider'
            },
            'blur': {
                'title': 'Blur (px)',
                'type': 'range-input',
                'min': 0,
                'max': 50,
                'width': '1-2'
            },
            'brightness': {
                'title': 'Brightness (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
            'contrast': {
                'title': 'Contrast (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
            'grayscale': {
                'title': 'Grayscale (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
            'hue-rotate': {
                'title': 'Hue (deg)',
                'type': 'range-input',
                'min': 0,
                'max': 360,
                'width': '1-2'
            },
            'invert': {
                'title': 'Invert (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
            'saturate': {
                'title': 'Saturate (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
            'sepia': {
                'title': 'Sepia (%)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-2'
            },
        }
    }
    $.pixeStyleSelectorOption['google-map-settings'] = {
        'title': 'Google Map Settings',
        'options': {
            'map-mode': {
                'title': 'Map Mode',
                'type': 'combobox',
                'options': {
                    '': 'Place',
                    'view': 'View',
                    'directions': 'Directions',
                    'streetview': 'Streetview',
                    'search': 'Search',
                },
                'with-default': false,
                'width': '1-1'
            },
            'center': {
                'title': 'Center',
                'type': 'text',
                'width': '1-1',
                'placeholder': 'Latitude,Longtitude',
                'condition': { 'map-mode': ['view', 'streetview'] }
            },
            'origin': {
                'title': 'Origin',
                'type': 'text',
                'width': '1-1',
                'placeholder': 'Location name or use Plus Code',
                'condition': { 'map-mode': 'directions' }
            },
            'destination': {
                'title': 'Destination',
                'type': 'text',
                'width': '1-1',
                'placeholder': 'Location name or use Plus Code',
                'condition': { 'map-mode': ['', 'directions', 'search'] }
            },
            'map-type': {
                'title': 'Map Type',
                'type': 'combobox',
                'options': {
                    '': 'Roadmap',
                    'satellite': 'Satellite',
                },
                'with-default': false,
                'width': '1-1',
                'condition': { 'map-mode': ['', 'view', 'directions', 'search'] }
            },
            'heading': {
                'title': 'Heading (Deg)',
                'type': 'range-input',
                'min': '-180',
                'max': '360',
                'width': '1-2',
                'placeholder': '-180 to 360',
                'condition': { 'map-mode': 'streetview' }
            },
            'pitch': {
                'title': 'Pitch (Deg)',
                'type': 'range-input',
                'min': '-90',
                'max': '90',
                'width': '1-2',
                'placeholder': '-90 to 90',
                'condition': { 'map-mode': 'streetview' }
            },
            'fov': {
                'title': 'FOV (Deg)',
                'type': 'range-input',
                'min': '10',
                'max': '100',
                'width': '1-2',
                'placeholder': '10 to 100',
                'condition': { 'map-mode': 'streetview' }
            },
            'zoom': {
                'title': 'Zoom',
                'type': 'range-input',
                'min': 0,
                'max': 21,
                'placeholder': '0-21',
                'width': '1-1',
                'condition': { 'map-mode': ['', 'view','directions', 'search'] }
            }
        }
    }

    // video
    $.pixeStyleSelectorOption['video-background-settings'] = {
        'title': 'Background Style',
        'type': 'tab',
        'options': ['bg-border', 'bg-shadow', 'bg-mask']
    }
    $.pixeStyleSelectorOption['video-overlay-settings'] = {
        'title': 'Image Overlay Settings',
        'type': 'tab',
        'options': ['video-overlay-image', 'video-overlay-icon']
    }
    $.pixeStyleSelectorOption['video-overlay-image'] = {
        'title': 'Overlay Image',
        'group': 'image',
        'options': {
            'image': {
                'type': 'upload',
                'width': '1-1'
            },
            'position': {
                'title': 'Position',
                'type': 'combobox',
                'width': '1-1',
                'options': 'backgroundPosition',
                'reset-siblings': 2
            },
            'pos-x': {
                'title': 'Offset - X Axis',
                'type': 'range-input',
                'range': 'transform-offset',
                'width': '1-2'
            },
            'pos-y': {
                'title': 'Offset - Y Axis',
                'type': 'range-input',
                'range': 'transform-offset',
                'width': '1-2'
            },
            'repeat': {
                'title': 'Repeat',
                'type': 'combobox',
                'width': '1-2',
                'options': 'backgroundRepeat'
            },
            'size': {
                'title': 'Size',
                'type': 'combobox',
                'width': '1-1',
                'options': 'backgroundSize',
                'reset-siblings': 1
            },
            'scale': {
                'title': 'Scale',
                'type': 'range-input',
                'range': 'background-width',
                'width': 90,
                'hide-reset': true,
                'condition': { 'size': 'custom' }
            },
        }
    }
    $.pixeStyleSelectorOption['video-overlay-icon'] = {
        'title': 'Overlay Icon',
        'group': 'icon',
        'options': {
            'icon': {
                'title': 'Type',
                'type': 'icon',
                'with-none': false
            },
            'width': {
                'title': 'Width',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2'
            },
            'color': {
                'title': 'Icon & Svg Color',
                'type': 'colordisplay',
                'color-type': 'plain-color',
                'width': '1-2'
            },
        }
    }
    $.pixeStyleSelectorOption['video-settings'] = {
        'title': 'Video Settings',
        'options': {
            'type': {
                'title': 'Video Type',
                'type': 'combobox',
                'options': {
                    '': 'Video (Youtube/Vimeo/File URL)',
                    'self-hosted': 'Video (Self Hosted)'
                },
                'width': '1-1'  
            },
            'url': {
                'title': 'Youtube / Vimeo / File URL',
                'type': 'text',
                'width': '1-1',
                'placeholder': 'https://',
                'condition': {'type': ''}
            },
            'upload':{
                'title': 'Upload Video (MP4)',
                'type': 'upload',
                'condition': {'type': 'self-hosted'},
                'width': '1-1'
            },
            'start-time': {
                'title': 'Start Time (secs)',
                'type': 'range-input',
                'min': 0,
                'max': 600,
                'width': '1-2'
            },
            'end-time': {
                'title': 'End Time (secs)',
                'type': 'range-input',
                'min': 0,
                'max': 600,
                'width': '1-2'
            },
            'loop': {
                'title': 'Loop',
                'type': 'checkbox',
                'default': 'no',
                'width': '1-2'
            },
            'muted': {
                'title': 'Mute',
                'type': 'checkbox',
                'default': 'no',
                'width': '1-2'
            },
            'autoplay': {
                'title': 'Autoplay',
                'type': 'checkbox',
                'default': 'no',
                'width': '1-1',
                'description-top': '"Mute" is required for autoplay function.'
            },
        }
    }

    // icon
    $.pixeStyleSelectorOption['icon-item-settings'] = {
        'title': 'Icon Settings',
        'device-selector': true,
        'pointer-state': true,
        'options': {
            'icon': {
                'title': 'Type',
                'type': 'icon',
                'with-none': false,
                'device-selector': false,
                'pointer-state': false,
            },
            'width': {
                'title': 'Width',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'pointer-state': false,
            },
            'color': {
                'title': 'Icon & Svg Color',
                'type': 'colordisplay',
                'color-type': 'plain-color',
                'width': '1-2'
            },
        }
    }
    $.pixeStyleSelectorOption['icon-item-spaces'] = {
        'title': 'Background Spacing',
        'device-selector': true,
        'options': {
            'padding': {
                'title': 'Padding',
                'type': 'padding',
            }
        }
    }

    // spacer
    $.pixeStyleSelectorOption['spacer-settings'] = {
        'title': 'Spacer Settings',
        'device-selector': true,
        'options': {
            'height': {
                'title': 'Spacer Height',
                'type': 'range-input',
                'range': 'padding-px',
                'width': '1-1'
            }
        }
    }

    // progress bar
    $.pixeStyleSelectorOption['progress-bar-color'] = {
        'title': 'Bar Color Settings',
        'type': 'tab',
        'options': ['bar-color', 'bar-bg']
    }
    $.pixeStyleSelectorOption['progress-bar-text-color'] = {
        'title': 'Text Color Settings',
        'type': 'tab',
        'options': ['inline-title-color', 'inline-percent-color']
    }
    $.pixeStyleSelectorOption['progress-bar-settings'] = {
        'title': 'Progress Bar Settings',
        'device-selector': true,
        'options': {
            'type': {
                'title': 'Text Position',
                'type': 'combobox',
                'options': {
                    '': 'Outer',
                    'inner': 'Inner',
                },
                'with-default': false,
                'width': '1-1',
                'device-selector': false,
            },
            'percent': {
                'title': 'Progress Percentage (Fill 0-100)',
                'type': 'range-input',
                'min': 0,
                'max': 100,
                'width': '1-1',
                'device-selector': false,
            },
            'display-percent': {
                'title': 'Show Percentage',
                'type': 'checkbox',
                'default': 'yes',
                'width': '1-1',
                'device-selector': false,
            },
            'text': {
                'title': 'Progress Title Text',
                'type': 'text',
                'width': '1-1',
                'device-selector': false,
            },
            'gap': {
                'title': 'Text Bottom Margin',
                'type': 'range-input',
                'range': 'margin',
                'width': '1-2',
                'condition': { 'type': ['', 'ignore-device'] }
            },
            'height': {
                'title': 'Bar Height',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'condition': { 'type': ['', 'ignore-device'] }
            },
            'padding': {
                'title': 'Padding',
                'type': 'padding',
                'condition': { 'type': ['inner', 'ignore-device'] }
            }
        }
    };

    // divider
    $.pixeStyleSelectorOption['divider-settings'] = {
        'title': 'Divider Settings',
        'device-selector': true,
        'pointer-state': true,
        'options': {
            'style': {
                'title': 'Divider Style',
                'type': 'combobox',
                'options': {
                    'solid': 'Solid',
                    'dashed': 'Dashed',
                    'dotted': 'Dotted',
                    'double': 'Double',
                    'double-2': 'Double 2',
                    'slash': 'Slash',
                    'slash-2': 'Slash 2',
                    'fang': 'Fang',
                    'wave': 'Wave',
                    'wave-2': 'Wave 2',
                    'pulse': 'Pulse',
                    'sound-wave': 'Sound Wave',
                    'zigzag': 'Zigzag',
                    'ribbon': 'Ribbon',
                    'ribbon-2': 'Ribbon 2',
                    'star': 'Star',
                    'heart': 'Heart',
                    'tree': 'Tree',
                    'tree-2': 'Tree 2',
                    'tree-3': 'Tree 3',
                    'plus': 'Plus',
                    'x': 'X'
                },
                'width': '1-1',
                'device-selector': false,
                'pointer-state': false
            },
            'width': {
                'title': 'Width',
                'type': 'range-input',
                'range': 'width',
                'width': '1-2',
                'pointer-state': false
            },
            'height': {
                'title': 'Height',
                'type': 'range-input',
                'range': 'bar-height',
                'width': '1-2',
                'pointer-state': false
            },
            'radius': {
                'title': 'Border Radius',
                'type': 'range-input',
                'range': 'radius',
                'width': '1-2',
                'condition': { 'style': ['', 'solid'] },
                'pointer-state': false,
                'device-selector': false
            },
            'pattern-width': {
                'title': 'Pattern Width',
                'type': 'range-input',
                'range': 'bar-width',
                'width': '1-2',
                'condition': { 'style': ['double-2', 'slash', 'slash-2', 'fang', 'wave', 'wave-2', 'pulse', 'sound-wave', 'zigzag', 'ribbon', 'ribbon-2', 'star', 'heart', 'tree', 'tree-2', 'tree-3', 'plus', 'x'] },
                'pointer-state': false
            },
            'color': {
                'title': 'Divider Color',
                'type': 'colordisplay',
                'color-type': 'plain-color',
                'width': '1-2',
                'device-selector': false,
            },
            'alignment': {
                'title': 'Alignment',
                'type': 'radioicon',
                'options': 'alignment',
                'width': '1-2',
                'pointer-state': false
            },
        }
    }
    $.pixeStyleSelectorOption['divider-text'] = {
        'title': 'Text & Icon Settings',
        'pointer-state': true,
        'options': {
            'type': {
                'title': 'Type',
                'type': 'combobox',
                'options': {
                    '': 'None',
                    'text': 'Text',
                    'icon': 'Icon'
                },
                'width': '1-1',
                'with-default': false,
                'pointer-state': false,
            },
            'icon': {
                'title': 'Icon',
                'type': 'icon',
                'with-none': false,
                'pointer-state': false,
                'condition': {'type': 'icon'}
            },
            'text': {
                'title': 'Text',
                'type': 'text',
                'width': '1-1',
                'pointer-state': false,
                'condition': {'type': 'text'}
            },
            'typo': {
                'title': 'Typo Settings',
                'type': 'ssdisplay',
                'ss-icon': 'pixe-svg-typo',
                'ss-type': 'typography',
                'width': '1-2',
                'pointer-state': false,
                'condition': {'type': 'text'}
            },
            'icon-size': {
                'title': 'Icon Size',
                'type': 'range-input',
                'range': 'font-size',
                'width': '1-2',
                'pointer-state': false,
                'condition': { 'type': 'icon' }
            },
            'color': {
                'title': 'Icon / Text Color',
                'type': 'colordisplay',
                'width': '1-2',
                'condition': {'type': ['text', 'icon', 'ignore-state']}
            },
            'alignment': {
                'title': 'Alignment',
                'type': 'radioicon',
                'options': 'alignment',
                'width': '1-2',
                'pointer-state': false,
                'condition': {'type': ['text', 'icon']}
            },
            'gap': {
                'title': 'Space',
                'type': 'range-input',
                'range': 'margin',
                'width': '1-2',
                'pointer-state': false,
                'condition': {'type': ['text', 'icon']}
            },
        }
    }

    // author
    $.pixeStyleSelectorOption['author-link'] = {
        'title': 'Link Settings',
        'options': {
            'link-to': {
                'title': 'Link To',
                'type': 'combobox',
                'width': '1-1',
                'with-default': false,
                'options': {
                    '': 'None',
                    'author': 'Author Archive'
                },
            },
            'target': {
                'title': 'Target',
                'type': 'combobox',
                'width': '1-2',
                'options': 'linkTarget',
                'condition': { 'link-to': 'author' }
            },
            'rel': {
                'title': 'Rel',
                'type': 'text',
                'width': '1-2',
                'condition': { 'link-to': 'author' }
            }
        }
    };
    
    // comment number
    $.pixeStyleSelectorOption['comment-number'] = {
        'title': 'Comment Settings',
        'options': {
            'hide-text': {
                'title': 'Show Only Number',
                'type': 'checkbox',
                'width': '1-1',
                'default': 'no'
            }
        }
    };
     
})(jQuery);	