@primer/view-components/static/arguments.json

ViewComponents for the Primer Design System

[
  {
    "component": "ActionBar",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionBar",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/default/",
    "parameters": [
      {
        "name": "size",
        "type": "Symbol",
        "default": "`:medium`",
        "description": "One of `:large`, `:medium`, or `:small`."
      },
      {
        "name": "overflow_menu",
        "type": "Boolean",
        "default": "`true`",
        "description": "Whether to render the overflow menu."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionBar::Divider",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionBarDivider",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/divider.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/divider/default/",
    "parameters": []
  },
  {
    "component": "ActionBar::Item",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionBarItem",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/item.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/item/default/",
    "parameters": [
      {
        "name": "item_content",
        "type": "String",
        "default": "N/A",
        "description": "The content to render inside the item."
      },
      {
        "name": "item_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionList",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "ActionList",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/default/",
    "parameters": [
      {
        "name": "id",
        "type": "String",
        "default": "`self.class.generate_id`",
        "description": "HTML ID value."
      },
      {
        "name": "role",
        "type": "Boolean",
        "default": "`nil`",
        "description": "ARIA role describing the function of the list. listbox and menu are a common values."
      },
      {
        "name": "item_classes",
        "type": "String",
        "default": "`nil`",
        "description": "Additional CSS classes to attach to items."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:full`",
        "description": "One of `:full` or `:inset`. `inset` children are offset (vertically and horizontally) from list edges. `full` (default) children are flush (vertically and horizontally) with list edges."
      },
      {
        "name": "show_dividers",
        "type": "Boolean",
        "default": "`false`",
        "description": "Display a divider above each item in the list when it does not follow a header or divider."
      },
      {
        "name": "select_variant",
        "type": "Symbol",
        "default": "`:none`",
        "description": "How items may be selected in the list. One of `:multiple`, `:multiple_checkbox`, `:none`, or `:single`."
      },
      {
        "name": "aria_selection_variant",
        "type": "Symbol",
        "default": "`:checked`",
        "description": "Specifies which aria selection to use. One of `:checked` or `:selected`."
      },
      {
        "name": "form_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "Allows an `ActionList` to act as a select list in multi- and single-select modes. Pass the `builder:` and `name:` options to this hash. `builder:` should be an instance of `ActionView::Helpers::FormBuilder`, which are created by the standard Rails `#form_with` and `#form_for` helpers. The `name:` option is the desired name of the field that will be included in the params sent to the server on form submission. *NOTE*: Consider using an [ActionMenu](/components/alpha/actionmenu) instead of using this feature directly."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionList::Divider",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionListDivider",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/divider.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/divider/default/",
    "parameters": [
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:subtle`",
        "description": "Display a background color if scheme is `filled`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionList::FormWrapper",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionListFormWrapper",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/form_wrapper.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/form_wrapper/default/",
    "parameters": []
  },
  {
    "component": "ActionList::Heading",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionListHeading",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/heading.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/heading/default/",
    "parameters": [
      {
        "name": "title",
        "type": "String",
        "default": "N/A",
        "description": "Sub list title."
      },
      {
        "name": "heading_level",
        "type": "Integer",
        "default": "`3`",
        "description": "Heading level. Level 2 results in an `<h2>` tag, level 3 an `<h3>` tag, etc."
      },
      {
        "name": "subtitle",
        "type": "String",
        "default": "`nil`",
        "description": "Optional sub list description."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:subtle`",
        "description": "Display a background color if scheme is `filled`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionList::Item",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionListItem",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/item.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/item/default/",
    "parameters": [
      {
        "name": "list",
        "type": "Primer::Alpha::ActionList",
        "default": "N/A",
        "description": "The list that contains this item. Used internally."
      },
      {
        "name": "parent",
        "type": "Primer::Alpha::ActionList::Item",
        "default": "`nil`",
        "description": "This item's parent item. `nil` if this item is at the root. Used internally."
      },
      {
        "name": "label",
        "type": "String",
        "default": "`nil`",
        "description": "Item label. If no label is provided, content is used."
      },
      {
        "name": "item_id",
        "type": "String",
        "default": "`nil`",
        "description": "An ID that will be attached to the item's `<li>` element as `data-item-id` for distinguishing between items, perhaps in JavaScript."
      },
      {
        "name": "label_classes",
        "type": "String",
        "default": "`nil`",
        "description": "CSS classes that will be added to the label."
      },
      {
        "name": "label_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "[System arguments](/system-arguments) used to construct the label."
      },
      {
        "name": "content_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "[System arguments](/system-arguments) used to construct the item's anchor or button tag."
      },
      {
        "name": "form_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "Allows the item to submit a form on click. The URL passed in the `href:` option will be used as the form action. Pass the `method:` option to this hash to control what kind of request is made, One of `:delete`, `:get`, `:head`, `:patch`, `:post`, or `:put`. The `name:` option is required and specifies the desired name of the field that will be included in the params sent to the server on form submission. Specify the `value:` option to send a custom value to the server; otherwise the value of `name:` is sent."
      },
      {
        "name": "truncate_label",
        "type": "Boolean | Symbol",
        "default": "`:none`",
        "description": "How the label should be truncated when the text does not fit inside the bounds of the list item. One of `false`, `:none`, `:show_tooltip`, `:truncate`, or `true`. Pass `false` or `:none` to wrap label text. Pass `true` or `:truncate` to truncate labels with ellipses. Pass `:show_tooltip` to show the entire label contents in a tooltip when the item is hovered."
      },
      {
        "name": "href",
        "type": "String",
        "default": "`nil`",
        "description": "Link URL."
      },
      {
        "name": "role",
        "type": "String",
        "default": "`nil`",
        "description": "ARIA role describing the function of the item."
      },
      {
        "name": "size",
        "type": "Symbol",
        "default": "`:medium`",
        "description": "Controls block sizing of the item."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:default`",
        "description": "Controls color/style based on behavior."
      },
      {
        "name": "disabled",
        "type": "Boolean",
        "default": "`false`",
        "description": "Disabled items are not clickable and visually dim."
      },
      {
        "name": "description_scheme",
        "type": "Symbol",
        "default": "`:block`",
        "description": "Display description inline with label, or block on the next line. One of `:block` or `:inline`."
      },
      {
        "name": "active",
        "type": "Boolean",
        "default": "`false`",
        "description": "If the parent list's `select_variant` is set to `:single` or `:multiple`, causes this item to render checked."
      },
      {
        "name": "on_click",
        "type": "String",
        "default": "`nil`",
        "description": "JavaScript to execute when the item is clicked."
      },
      {
        "name": "id",
        "type": "String",
        "default": "`self.class.generate_id`",
        "description": "Used internally."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionMenu",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionMenu",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_menu.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_menu/default/",
    "parameters": [
      {
        "name": "menu_id",
        "type": "String",
        "default": "`self.class.generate_id`",
        "description": "Id of the menu."
      },
      {
        "name": "anchor_align",
        "type": "Symbol",
        "default": "`:start`",
        "description": "One of `:center`, `:end`, or `:start`.."
      },
      {
        "name": "anchor_side",
        "type": "Symbol",
        "default": "`:outside_bottom`",
        "description": "One of `:inside_bottom`, `:inside_center`, `:inside_left`, `:inside_right`, `:inside_top`, `:outside_bottom`, `:outside_left`, `:outside_right`, or `:outside_top`.."
      },
      {
        "name": "anchor_when_narrow",
        "type": "Symbol",
        "default": "`:inherit`",
        "description": "One of `:bottom`, `:fullscreen`, `:inherit`, `:left`, or `:right`.."
      },
      {
        "name": "size",
        "type": "Symbol",
        "default": "`:auto`",
        "description": "One of `:auto`, `:large`, `:medium`, `:medium_portrait`, `:small`, or `:xlarge`.."
      },
      {
        "name": "src",
        "type": "String",
        "default": "`nil`",
        "description": "Used with an `include-fragment` element to load menu content from the given source URL."
      },
      {
        "name": "preload",
        "type": "Boolean",
        "default": "`false`",
        "description": "When true, and src is present, loads the `include-fragment` on trigger hover."
      },
      {
        "name": "dynamic_label",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether or not to display the text of the currently selected item in the show button."
      },
      {
        "name": "dynamic_label_prefix",
        "type": "String",
        "default": "`nil`",
        "description": "If provided, the prefix is prepended to the dynamic label and displayed in the show button."
      },
      {
        "name": "select_variant",
        "type": "Symbol",
        "default": "`:none`",
        "description": "One of `:multiple`, `:none`, or `:single`."
      },
      {
        "name": "form_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "Allows an `ActionMenu` to act as a select list in multi- and single-select modes. Pass the `builder:` and `name:` options to this hash. `builder:` should be an instance of `ActionView::Helpers::FormBuilder`, which are created by the standard Rails `#form_with` and `#form_for` helpers. The `name:` option is the desired name of the field that will be included in the params sent to the server on form submission."
      },
      {
        "name": "overlay_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "Arguments to pass to the underlying [Overlay](/components/alpha/overlay)"
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)."
      }
    ]
  },
  {
    "component": "ActionMenu::Group",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "ActionMenuGroup",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_menu/group.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_menu/group/default/",
    "parameters": [
      {
        "name": "id",
        "type": "String",
        "default": "`self.class.generate_id`",
        "description": "HTML ID value."
      },
      {
        "name": "role",
        "type": "Boolean",
        "default": "`nil`",
        "description": "ARIA role describing the function of the list. listbox and menu are a common values."
      },
      {
        "name": "item_classes",
        "type": "String",
        "default": "`nil`",
        "description": "Additional CSS classes to attach to items."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:full`",
        "description": "One of `:full` or `:inset`. `inset` children are offset (vertically and horizontally) from list edges. `full` (default) children are flush (vertically and horizontally) with list edges."
      },
      {
        "name": "show_dividers",
        "type": "Boolean",
        "default": "`false`",
        "description": "Display a divider above each item in the list when it does not follow a header or divider."
      },
      {
        "name": "select_variant",
        "type": "Symbol",
        "default": "`:none`",
        "description": "How items may be selected in the list. One of `:multiple`, `:multiple_checkbox`, `:none`, or `:single`."
      },
      {
        "name": "aria_selection_variant",
        "type": "Symbol",
        "default": "`:checked`",
        "description": "Specifies which aria selection to use. One of `:checked` or `:selected`."
      },
      {
        "name": "form_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "Allows an `ActionList` to act as a select list in multi- and single-select modes. Pass the `builder:` and `name:` options to this hash. `builder:` should be an instance of `ActionView::Helpers::FormBuilder`, which are created by the standard Rails `#form_with` and `#form_for` helpers. The `name:` option is the desired name of the field that will be included in the params sent to the server on form submission. *NOTE*: Consider using an [ActionMenu](/components/alpha/actionmenu) instead of using this feature directly."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ActionMenu::Heading",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionMenuHeading",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_menu/heading.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_menu/heading/default/",
    "parameters": []
  },
  {
    "component": "ActionMenu::List",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ActionMenuList",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_menu/list.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_menu/list/default/",
    "parameters": [
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "The arguments accepted by [ActionList](/components/alpha/actionlist)"
      }
    ]
  },
  {
    "component": "ActionMenu::ListWrapper",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "ActionMenuListWrapper",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_menu/list_wrapper.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_menu/list_wrapper/default/",
    "parameters": [
      {
        "name": "menu_id",
        "type": "String",
        "default": "N/A",
        "description": "ID of the parent menu."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "The arguments accepted by [ActionList](/components/alpha/actionlist)"
      }
    ]
  },
  {
    "component": "AutoComplete",
    "status": "deprecated",
    "a11y_reviewed": false,
    "short_name": "AutoComplete",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/auto_complete.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/auto_complete/default/",
    "parameters": [
      {
        "name": "label_text",
        "type": "String",
        "default": "N/A",
        "description": "The label of the input."
      },
      {
        "name": "src",
        "type": "String",
        "default": "N/A",
        "description": "The route to query."
      },
      {
        "name": "input_id",
        "type": "String",
        "default": "N/A",
        "description": "Id of the input element."
      },
      {
        "name": "input_name",
        "type": "String",
        "default": "`nil`",
        "description": "Optional name of the input element, defaults to `input_id` when not set."
      },
      {
        "name": "list_id",
        "type": "String",
        "default": "N/A",
        "description": "Id of the list element."
      },
      {
        "name": "with_icon",
        "type": "Boolean",
        "default": "`false`",
        "description": "Controls if a search icon is visible, defaults to `false`."
      },
      {
        "name": "is_label_visible",
        "type": "Boolean",
        "default": "`true`",
        "description": "Controls if the label is visible. If `false`, screen reader only text will be added."
      },
      {
        "name": "is_clearable",
        "type": "Boolean",
        "default": "`false`",
        "description": "Adds optional clear button."
      },
      {
        "name": "is_label_inline",
        "type": "Boolean",
        "default": "`false`",
        "description": "Controls if the label is inline. On smaller screens, label will always become stacked."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "AutoComplete::Item",
    "status": "deprecated",
    "a11y_reviewed": false,
    "short_name": "AutoCompleteItem",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/auto_complete/item.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/auto_complete/item/default/",
    "parameters": [
      {
        "name": "value",
        "type": "String",
        "default": "N/A",
        "description": "Value of the item."
      },
      {
        "name": "selected",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether the item is selected."
      },
      {
        "name": "disabled",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether the item is disabled."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Banner",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "Banner",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/banner.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/banner/default/",
    "parameters": [
      {
        "name": "tag",
        "type": "Symbol",
        "default": "`:div`",
        "description": "One of `:div` or `:section`."
      },
      {
        "name": "full",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether the component should take up the full width of the screen."
      },
      {
        "name": "full_when_narrow",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether the component should take up the full width of the screen when rendered inside smaller viewports."
      },
      {
        "name": "dismiss_scheme",
        "type": "Symbol",
        "default": "`:none`",
        "description": "Whether the component can be dismissed with an \"x\" button. One of `:hide`, `:none`, or `:remove`."
      },
      {
        "name": "dismiss_label",
        "type": "String",
        "default": "`Dismiss`",
        "description": "The aria-label text of the dismiss \"x\" button"
      },
      {
        "name": "description",
        "type": "String",
        "default": "`nil`",
        "description": "Description text rendered underneath the message."
      },
      {
        "name": "icon",
        "type": "Symbol",
        "default": "`nil`",
        "description": "The name of an [Octicon](https://primer.style/octicons/) icon to use. If no icon is provided, a default one will be chosen based on the scheme."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:default`",
        "description": "One of `:danger`, `:default`, `:success`, `:upsell`, or `:warning`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "ButtonMarketing",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "ButtonMarketing",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/button_marketing.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/button_marketing/default/",
    "parameters": [
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "`:default`",
        "description": "One of `:default`, `:outline`, `:primary`, or `:transparent`."
      },
      {
        "name": "variant",
        "type": "Symbol",
        "default": "`:default`",
        "description": "One of `:default` or `:large`."
      },
      {
        "name": "tag",
        "type": "Symbol",
        "default": "`:button`",
        "description": "One of `:a` or `:button`."
      },
      {
        "name": "type",
        "type": "Symbol",
        "default": "`:button`",
        "description": "One of `:button` or `:submit`."
      },
      {
        "name": "disabled",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether or not the button is disabled. If true, this option forces `tag:` to `:button`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "CheckBox",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "CheckBox",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/check_box.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/check_box/default/",
    "parameters": [
      {
        "name": "name",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML name attribute."
      },
      {
        "name": "id",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML id attribute."
      },
      {
        "name": "class",
        "type": "String",
        "default": "N/A",
        "description": "CSS classes to include in the input's HTML `class` attribute. Exists for compatibility with Rails form builders."
      },
      {
        "name": "classes",
        "type": "Array",
        "default": "N/A",
        "description": "CSS classes to include in the input's HTML `class` attribute. Combined with the `:class` argument. The list may contain strings, hashes, or `nil` values, and is automatically cleaned up by Primer's [`class_name` helper](https://github.com/primer/view_components/blob/c9cb95c98fee3e2e27f4a10683f555e22285e7f1/app/lib/primer/class_name_helper.rb) (`nils`, falsy entries, and blank strings are ignored)."
      },
      {
        "name": "caption",
        "type": "String",
        "default": "N/A",
        "description": "A string describing the field and what sorts of input it expects. Displayed below the input."
      },
      {
        "name": "label",
        "type": "String",
        "default": "N/A",
        "description": "Label text displayed above the input."
      },
      {
        "name": "visually_hide_label",
        "type": "Boolean",
        "default": "N/A",
        "description": "When set to `true`, hides the label. Although the label will be hidden visually, it will still be visible to screen readers."
      },
      {
        "name": "disabled",
        "type": "Boolean",
        "default": "N/A",
        "description": "When set to `true`, the input will not accept keyboard or mouse input."
      },
      {
        "name": "hidden",
        "type": "Boolean",
        "default": "N/A",
        "description": "When set to `true`, visually hides the field."
      },
      {
        "name": "invalid",
        "type": "Boolean",
        "default": "N/A",
        "description": "If set to `true`, the input will be rendered with a red border. Implied if `validation_message` is truthy. This option is set to `true` automatically if the model object associated with the form reports that the input is invalid via Rails validations. It is provided for cases where the form does not have an associated model. If the input is invalid as determined by Rails validations, setting `invalid` to `false` will have no effect."
      },
      {
        "name": "validation_message",
        "type": "String",
        "default": "N/A",
        "description": "A string displayed between the caption and the input indicating the input's contents are invalid. This option is, by default, set to the first Rails validation message for the input (assuming the form is associated with a model object). Use `validation_message` to override the default or to provide a validation message in case there is no associated model object."
      },
      {
        "name": "label_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "Attributes that will be passed to Rails' `builder.label` method. These can be HTML attributes or any of the other label options Rails supports. They will appear as HTML attributes on the `<label>` tag."
      },
      {
        "name": "scope_name_to_model",
        "type": "Boolean",
        "default": "N/A",
        "description": "Default `true`. When set to `false`, prevents the model name from prefixing the field name. For example, if the field name is `my_field`, Rails will normally emit an HTML name attribute of `model[my_field]`. Setting `scope_name_to_model` to `false` will cause Rails to emit `my_field` instead."
      },
      {
        "name": "scope_id_to_model",
        "type": "Boolean",
        "default": "N/A",
        "description": "Default `true`. When set to `false`, prevents the model name from prefixing the field ID. For example, if the field name is `my_field`, Rails will normally emit an HTML ID attribute of `model_my_field`. Setting `scope_id_to_model` to `false` will cause Rails to emit `my_field` instead."
      },
      {
        "name": "required",
        "type": "Boolean",
        "default": "N/A",
        "description": "Default `false`. When set to `true`, causes an asterisk (*) to appear next to the field's label indicating it is a required field. Note that this option explicitly does _not_ add a `required` HTML attribute. Doing so would enable native browser validations, which are inaccessible and inconsistent with the Primer design system."
      },
      {
        "name": "aria",
        "type": "Hash",
        "default": "N/A",
        "description": "Key/value pairs that represent Aria attributes and their values. Eg. `aria: { current: true }` becomes `aria-current=\"true\"`."
      },
      {
        "name": "data",
        "type": "Hash",
        "default": "N/A",
        "description": "Key/value pairs that represent data attributes and their values. Eg. `data: { foo: \"bar\" }` becomes `data-foo=\"bar\"`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details."
      },
      {
        "name": "name",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML name attribute."
      },
      {
        "name": "value",
        "type": "String",
        "default": "N/A",
        "description": "On form submission, this value will be sent to the server if the check box is checked. Defaults to \"1\"."
      },
      {
        "name": "unchecked_value",
        "type": "String",
        "default": "N/A",
        "description": "On form submission, this value will be sent to the server if the check box is _not_ checked. Defaults to \"0\"."
      },
      {
        "name": "scheme",
        "type": "Symbol",
        "default": "N/A",
        "description": "Controls how check box values are submitted to the server. One of `:array` or `:boolean`.."
      }
    ]
  },
  {
    "component": "CheckBoxGroup",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "CheckBoxGroup",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/check_box_group.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/check_box_group/default/",
    "parameters": [
      {
        "name": "name",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML name attribute. When provided, the check box values will be submitted in to the server in `:array` mode. See the [CheckBox](/components/alpha/checkbox) for more information."
      },
      {
        "name": "label",
        "type": "String",
        "default": "N/A",
        "description": "Label text displayed above the input."
      },
      {
        "name": "hidden",
        "type": "Boolean",
        "default": "N/A",
        "description": "When set to `true`, visually hides the group."
      },
      {
        "name": "caption",
        "type": "String",
        "default": "N/A",
        "description": "A string describing the field and what sorts of input it expects. Displayed below the group."
      },
      {
        "name": "invalid",
        "type": "Boolean",
        "default": "N/A",
        "description": "If set to `true`, the input will be marked as invalid. Implied if `validation_message` is truthy. This option is set to `true` automatically if the model object associated with the form reports that the input is invalid via Rails validations. It is provided for cases where the form does not have an associated model. If the input is invalid as determined by Rails validations, setting `invalid` to `false` will have no effect."
      },
      {
        "name": "validation_message",
        "type": "String",
        "default": "N/A",
        "description": "A string displayed between the caption and the input indicating the input's contents are invalid. This option is, by default, set to the first Rails validation message for the input (assuming the form is associated with a model object). Use `validation_message` to override the default or to provide a validation message in case there is no associated model object."
      },
      {
        "name": "label_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "Attributes that will be passed to Rails' `builder.label` method. These can be HTML attributes or any of the other label options Rails supports. They will appear as HTML attributes on the `<label>` tag."
      }
    ]
  },
  {
    "component": "Dialog",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "Dialog",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dialog.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dialog/default/",
    "parameters": [
      {
        "name": "id",
        "type": "String",
        "default": "`self.class.generate_id`",
        "description": "The id of the dialog."
      },
      {
        "name": "title",
        "type": "String",
        "default": "N/A",
        "description": "Describes the content of the dialog."
      },
      {
        "name": "subtitle",
        "type": "String",
        "default": "`nil`",
        "description": "Provides additional context for the dialog, also setting the `aria-describedby` attribute."
      },
      {
        "name": "size",
        "type": "Symbol",
        "default": "`:medium`",
        "description": "The size of the dialog. One of `:auto`, `:large`, `:medium`, `:medium_portrait`, `:small`, or `:xlarge`."
      },
      {
        "name": "position",
        "type": "Symbol",
        "default": "`:center`",
        "description": "The position of the dialog. One of `:center`, `:left`, or `:right`."
      },
      {
        "name": "position_narrow",
        "type": "Symbol",
        "default": "`:inherit`",
        "description": "The position of the dialog when narrow. One of `:bottom`, `:fullscreen`, `:inherit`, `:left`, or `:right`."
      },
      {
        "name": "visually_hide_title",
        "type": "Boolean",
        "default": "`false`",
        "description": "If true will hide the heading title, while still making it available to Screen Readers."
      },
      {
        "name": "disable_scroll",
        "type": "Boolean",
        "default": "`true`",
        "description": "When true, disables scrolling the page when the dialog is open."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dialog::Body",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "DialogBody",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dialog/body.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dialog/body/default/",
    "parameters": [
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dialog::Footer",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "DialogFooter",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dialog/footer.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dialog/footer/default/",
    "parameters": [
      {
        "name": "show_divider",
        "type": "Boolean",
        "default": "`false`",
        "description": "Show a divider between the footer and body."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dialog::Header",
    "status": "alpha",
    "a11y_reviewed": true,
    "short_name": "DialogHeader",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dialog/header.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dialog/header/default/",
    "parameters": [
      {
        "name": "id",
        "type": "String",
        "default": "N/A",
        "description": "The HTML element's ID value."
      },
      {
        "name": "title",
        "type": "String",
        "default": "N/A",
        "description": "Describes the content of the dialog."
      },
      {
        "name": "subtitle",
        "type": "String",
        "default": "`nil`",
        "description": "Provides additional context for the dialog, also setting the `aria-describedby` attribute."
      },
      {
        "name": "show_divider",
        "type": "Boolean",
        "default": "`false`",
        "description": "Show a divider between the header and body."
      },
      {
        "name": "visually_hide_title",
        "type": "Boolean",
        "default": "`false`",
        "description": "Visually hide the `title` while maintaining a label for assistive technologies."
      },
      {
        "name": "variant",
        "type": "Symbol",
        "default": "`:medium`",
        "description": "One of `:large` or `:medium`."
      },
      {
        "name": "close_label",
        "type": "String",
        "default": "`Close`",
        "description": "The aria-label text of the close \"x\" button."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dropdown",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "Dropdown",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dropdown.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dropdown/default/",
    "parameters": [
      {
        "name": "overlay",
        "type": "Symbol",
        "default": "`:default`",
        "description": "One of `:dark`, `:default`, or `:none`."
      },
      {
        "name": "with_caret",
        "type": "Boolean",
        "default": "`false`",
        "description": "Whether or not a caret should be rendered in the button."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dropdown::Menu",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "DropdownMenu",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dropdown/menu.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dropdown/menu/default/",
    "parameters": [
      {
        "name": "as",
        "type": "Symbol",
        "default": "`:default`",
        "description": "When `as` is `:list`, wraps the menu in a `<ul>` with a `<li>` for each item."
      },
      {
        "name": "direction",
        "type": "Symbol",
        "default": "`:se`",
        "description": "One of `:e`, `:ne`, `:s`, `:se`, `:sw`, or `:w`.."
      },
      {
        "name": "header",
        "type": "String",
        "default": "`nil`",
        "description": "Header to be displayed above the menu."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)"
      }
    ]
  },
  {
    "component": "Dropdown::Menu::Item",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "DropdownMenuItem",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dropdown/menu/item.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dropdown/menu/item/default/",
    "parameters": []
  },
  {
    "component": "FileTreeView",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "FileTreeView",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/file_tree_view.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/file_tree_view/default/",
    "parameters": [
      {
        "name": "node_variant",
        "type": "Symbol",
        "default": "`:div`",
        "description": "The variant to use for this node. One of `:anchor`, `:button`, or `:div`."
      },
      {
        "name": "form_arguments",
        "type": "Hash",
        "default": "`{}`",
        "description": "These arguments allow the selections made within a `TreeView` to be submitted to the server as part of a Rails form. Pass the `builder:` and `name:` options to this hash. `builder:` should be an instance of `ActionView::Helpers::FormBuilder`, which are created by the standard Rails `#form_with` and `#form_for` helpers. The `name:` option is the desired name of the field that will be included in the params sent to the server on form submission."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "[System arguments](/system-arguments)."
      }
    ]
  },
  {
    "component": "FileTreeView::DirectoryNode",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "FileTreeViewDirectoryNode",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/file_tree_view/directory_node.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/file_tree_view/directory_node/default/",
    "parameters": []
  },
  {
    "component": "FileTreeView::FileNode",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "FileTreeViewFileNode",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/file_tree_view/file_node.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/file_tree_view/file_node/default/",
    "parameters": []
  },
  {
    "component": "FormButton",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "FormButton",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/form_button.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/form_button/default/",
    "parameters": [
      {
        "name": "name",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML name attribute."
      },
      {
        "name": "id",
        "type": "String",
        "default": "N/A",
        "description": "Value for the HTML id attribute."
      },
      {
        "name": "class",
        "type": "String",
        "default": "N/A",
        "description": "CSS classes to include in the input's HTML `class` attribute. Exists for compatibility with Rails form builders."
      },
      {
        "name": "classes",
        "type": "Array",
        "default": "N/A",
        "description": "CSS classes to include in the input's HTML `class` attribute. Combined with the `:class` argument. The list may contain strings, hashes, or `nil` values, and is automatically cleaned up by Primer's [`class_name` helper](https://github.com/primer/view_components/blob/c9cb95c98fee3e2e27f4a10683f555e22285e7f1/app/lib/primer/class_name_helper.rb) (`nils`, falsy entries, and blank strings are ignored)."
      },
      {
        "name": "label",
        "type": "String",
        "default": "N/A",
        "description": "Label text displayed above the input."
      },
      {
        "name": "aria",
        "type": "Hash",
        "default": "N/A",
        "description": "Key/value pairs that represent Aria attributes and their values. Eg. `aria: { current: true }` becomes `aria-current=\"true\"`."
      },
      {
        "name": "data",
        "type": "Hash",
        "default": "N/A",
        "description": "Key/value pairs that represent data attributes and their values. Eg. `data: { foo: \"bar\" }` becomes `data-foo=\"bar\"`."
      },
      {
        "name": "system_arguments",
        "type": "Hash",
        "default": "N/A",
        "description": "A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details."
      }
    ]
  },
  {
    "component": "FormControl",
    "status": "alpha",
    "a11y_reviewed": false,
    "short_name": "FormControl",
    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/form_control.rb",
    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/form_control/default/",
    "parameters": [
      {
        "name": "label",
        "type": "String",
        "default": "N/A",
        "description": "Label text displayed above the input."
      },
      {
        "name": "caption",
        "type": "String",
        "default": "`nil`",
        "description": "Describes the field and what sort of input it expects. Displayed below the input. Note that the `caption` slot is also available and takes precedence over this argument when provided."
      },
      {
        "name": "validation_message",
        "type": "String",
        "default": "`nil`",
        "description": "A string displayed in red between the caption and the input indicating the input's contents are invalid."
      },
      {
        "name": "required",
        "type": "Boolean",
        "default": "`false`",
        "description": "Default `false`. When set to `true`, causes an asterisk (*) to appear next to the field's label indicating it is a required field. Note that this option explicitly does _not_ add a `required` HTML attribute. Doing so would enable native browser validations, which are inaccessible and inconsistent with the Primer design system."
      },
      {
        "name": "visually_hide_label",
        "type": "Boolean",
        "default": "`false`",
        "description": "When set to `true`, hides the label. Although the label will be hidden visually, it wi