@bliss-design-system/button/custom-elements.json

Button component, or an anchor element styled as a button.

{
  "version": "experimental",
  "tags": [
    {
      "name": "bliss-button",
      "path": "./dist/BlissButton.d.ts",
      "attributes": [
        {
          "name": "disabled",
          "description": "whether or not to disable the button",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "loading",
          "description": "whether or not to display loading spinner",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "icon",
          "description": "The name of the icon to display",
          "type": "String"
        },
        {
          "name": "icon-trailing",
          "description": "whether to display the icon after the label",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "icon-only",
          "description": "whether to display an icon only",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "full-width",
          "description": "whether to make the button full width of its container",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "variant",
          "description": "button variant",
          "type": "primary|secondary|ghost",
          "default": "\"primary\""
        },
        {
          "name": "theme",
          "description": "button theme",
          "type": "default|netural|critical",
          "default": "\"default\""
        },
        {
          "name": "size",
          "description": "button size",
          "type": "small|medium",
          "default": "\"medium\""
        },
        {
          "name": "transparent",
          "description": "whether the background color of the button is transparent or not",
          "type": "Boolean",
          "default": "false"
        }
      ],
      "properties": [
        {
          "name": "content",
          "type": "string | null"
        },
        {
          "name": "iconTrailing",
          "type": "boolean"
        },
        {
          "name": "iconOnly",
          "type": "boolean"
        },
        {
          "name": "disabled",
          "attribute": "disabled",
          "description": "whether or not to disable the button",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "loading",
          "attribute": "loading",
          "description": "whether or not to display loading spinner",
          "type": "Boolean",
          "default": "false"
        },
        {
          "name": "icon",
          "attribute": "icon",
          "description": "The name of the icon to display",
          "type": "String"
        },
        {
          "name": "type",
          "description": "input type, one of 'button', 'submit' or 'reset'",
          "type": "String",
          "default": "\"button\""
        },
        {
          "name": "href",
          "description": "converts button into an anchor tag",
          "type": "String"
        },
        {
          "name": "target",
          "description": "where to open the link, requires `href` attribute",
          "type": "String} {_blank|_parent|_self|_top"
        },
        {
          "name": "rel",
          "description": "sets the relationship between the link and the document, requires `href` attribute",
          "type": "String"
        },
        {
          "name": "download",
          "description": "download instead of navigate, requires `href` attribute",
          "type": "String"
        }
      ],
      "slots": [
        {
          "name": "",
          "description": "Default text slot"
        }
      ],
      "cssParts": [
        {
          "name": "button"
        }
      ]
    }
  ]
}