{
    "id": "button_bisel_builder",
    "mixin": "button_bisel",
    "module": "sisass_components/buttons",
    "selector": ".button_bisel_builder_button",
    "adapter": "button_bisel",
    "title": "Constructor de button_bisel",
    "description": "Ajusta los gradientes, el bisel interior, el borde y la tipografía del botón.",
    "option_sets": {
        "border_styles": ["none", "solid", "dashed", "dotted", "double"],
        "cursors": [
            "auto",
            "default",
            "none",
            "context-menu",
            "help",
            "pointer",
            "progress",
            "wait",
            "cell",
            "crosshair",
            "text",
            "vertical-text",
            "alias",
            "copy",
            "move",
            "no-drop",
            "not-allowed",
            "grab",
            "grabbing",
            "e-resize",
            "n-resize",
            "ne-resize",
            "nw-resize",
            "s-resize",
            "se-resize",
            "sw-resize",
            "w-resize",
            "ew-resize",
            "ns-resize",
            "nesw-resize",
            "nwse-resize",
            "col-resize",
            "row-resize",
            "all-scroll",
            "zoom-in",
            "zoom-out",
            "inherit",
            "initial",
            "revert",
            "revert-layer",
            "unset"
        ]
    },
    "groups": [
        { "id": "content", "label": "Contenido", "open": true },
        { "id": "dimensions", "label": "Dimensiones del bisel", "open": true },
        { "id": "colors", "label": "Gradientes y colores", "open": true },
        { "id": "borders", "label": "Borde exterior" },
        { "id": "typography", "label": "Tipografía", "description": "Las familias tipográficas de esta documentación solo están cargadas en la vista previa. Para reproducir el resultado, carga la fuente elegida en tu proyecto." },
        { "id": "behavior", "label": "Comportamiento" }
    ],
    "fields": [
        { "path": "label", "label": "Texto del botón", "group": "content", "control": "text", "default": "Explorar", "full": true, "output": false },
        { "path": "width", "key": "width", "aliases": ["w"], "label": "Width", "group": "dimensions", "control": "text", "default": "150px", "css_variable": "--builder-width" },
        { "path": "height", "key": "height", "aliases": ["h"], "label": "Height", "group": "dimensions", "control": "text", "default": "47px", "css_variable": "--builder-height" },
        { "path": "diff", "key": "diff", "aliases": ["dif"], "label": "Diferencia interior", "group": "dimensions", "control": "text", "default": "10px", "css_variable": "--builder-diff" },
        { "path": "aspect_inside", "key": "aspect_inside", "aliases": ["inside", "i"], "preferred_alias": "i", "label": "Aspect ratio interior", "group": "dimensions", "control": "text", "default": "3.7", "css_variable": "--builder-aspect-inside" },
        { "path": "bg1", "key": "bg1", "aliases": [], "label": "Primer color", "group": "colors", "control": "color", "default": "#ffffff", "allow_css_value": true, "css_variable": "--builder-bg1" },
        { "path": "bg2", "key": "bg2", "aliases": [], "label": "Segundo color", "group": "colors", "control": "color", "default": "#000000", "allow_css_value": true, "css_variable": "--builder-bg2" },
        { "path": "bg_opacity", "key": "bg_opacity", "aliases": ["bgo"], "label": "Opacidad del gradiente", "group": "colors", "control": "text", "default": "0.4", "css_variable": "--builder-bg-opacity" },
        { "path": "opacity_before", "key": "opacity_before", "aliases": [], "label": "Opacidad interior", "group": "colors", "control": "text", "default": "1", "css_variable": "--builder-opacity-before" },
        { "path": "color", "key": "color", "aliases": ["c"], "label": "Texto normal", "group": "colors", "control": "color", "default": "#000000", "allow_css_value": true, "css_variable": "--builder-color" },
        { "path": "color_hover", "key": "color_hover", "aliases": ["ch"], "label": "Texto hover", "group": "colors", "control": "color", "default": "#ffffff", "allow_css_value": true, "css_variable": "--builder-color-hover" },
        { "path": "border_contain", "key": "border_contain", "aliases": ["bdc"], "label": "Mostrar borde exterior", "group": "borders", "control": "boolean", "default": false, "full": true },
        { "path": "border", "key": "border", "aliases": ["bd"], "label": "Border", "group": "borders", "control": "border", "default": "1px solid #000000", "options_source": "border_styles", "full": true, "css_variable": "--builder-border" },
        { "path": "tf.align", "key": "align", "aliases": ["a"], "parent": "tf", "label": "Align", "group": "typography", "control": "select", "default": "left", "options": ["left", "center", "right", "justify"], "css_variable": "--builder-text-align" },
        { "path": "tf.transform", "key": "transform", "aliases": ["t"], "parent": "tf", "label": "Transform", "group": "typography", "control": "select", "default": "initial", "options": ["initial", "uppercase", "lowercase", "capitalize"], "css_variable": "--builder-text-transform" },
        { "path": "tf.decoration", "key": "decoration", "aliases": ["d"], "parent": "tf", "label": "Decoration", "group": "typography", "control": "select", "default": "initial", "options": ["initial", "none", "underline", "line-through"], "css_variable": "--builder-text-decoration" },
        { "path": "tf.wrap", "key": "wrap", "aliases": ["wr"], "parent": "tf", "label": "Wrap", "group": "typography", "control": "select", "default": "initial", "options": ["initial", "nowrap", "wrap", "balance"], "css_variable": "--builder-text-wrap" },
        { "path": "tf.size", "key": "size", "aliases": ["s"], "parent": "tf", "label": "Size", "group": "typography", "control": "text", "default": "1rem", "css_variable": "--builder-font-size" },
        { "path": "tf.family", "key": "family", "aliases": ["f"], "parent": "tf", "label": "Family", "group": "typography", "control": "select", "default": "sans-serif", "quote": true, "options": [{ "value": "sans-serif", "label": "sans-serif (predeterminada)" }, "Nunito Sans", "Fira Sans", "Montserrat", "Roboto"], "css_variable": "--builder-font-family" },
        { "path": "tf.weight", "key": "weight", "aliases": ["w"], "parent": "tf", "label": "Weight", "group": "typography", "control": "select", "default": "normal", "options": ["normal", "bold", "300", "500", "700", "900"], "css_variable": "--builder-font-weight" },
        { "path": "tf.style", "key": "style", "aliases": [], "parent": "tf", "label": "Style", "group": "typography", "control": "select", "default": "normal", "options": ["normal", "italic", "oblique"], "css_variable": "--builder-font-style" },
        { "path": "tf.line_height", "key": "line-height", "aliases": ["lh"], "parent": "tf", "label": "Line height", "group": "typography", "control": "text", "default": "none", "css_variable": "--builder-line-height" },
        { "path": "tf.variant", "key": "variant", "aliases": ["v"], "parent": "tf", "label": "Variant", "group": "typography", "control": "select", "default": "normal", "options": ["normal", "small-caps"], "css_variable": "--builder-font-variant" },
        { "path": "cursor", "key": "cursor", "aliases": ["cur"], "label": "Cursor", "group": "behavior", "control": "select", "default": "pointer", "options_source": "cursors", "css_variable": "--builder-cursor" }
    ],
    "presets": [
        { "id": "default", "label": "Por defecto", "values": {} },
        {
            "id": "soft",
            "label": "Bisel suave",
            "values": {
                "bg1": "#dbeafe",
                "bg2": "#1e3a8a",
                "bg_opacity": "0.65",
                "color": "#172554",
                "color_hover": "#ffffff",
                "tf": { "align": "center", "weight": "bold" }
            }
        },
        {
            "id": "warm",
            "label": "Bisel cálido",
            "values": {
                "bg1": "#fde68a",
                "bg2": "#9f1239",
                "bg_opacity": "0.8",
                "color": "#4c0519",
                "color_hover": "#ffffff",
                "tf": { "align": "center", "weight": "bold" }
            }
        },
        {
            "id": "bordered",
            "label": "Con borde",
            "values": {
                "border_contain": true,
                "border": "2px solid #334155",
                "bg1": "#f8fafc",
                "bg2": "#334155",
                "bg_opacity": "0.75",
                "color": "#0f172a",
                "color_hover": "#ffffff",
                "tf": { "align": "center", "weight": "bold" }
            }
        },
        { "id": "custom", "label": "Personalizado", "custom": true }
    ],
    "preview": {
        "default_background": "light",
        "default_state": "normal",
        "backgrounds": [{ "id": "light", "label": "Claro" }, { "id": "dark", "label": "Oscuro" }],
        "states": [{ "id": "normal", "label": "Normal" }, { "id": "hover", "label": "Hover" }]
    }
}
