bootstrap-vue/src/components/form-group/package.json

With more than 85 components, over 45 available plugins, several directives, and 1000+ icons, BootstrapVue provides one of the most comprehensive implementations of the Bootstrap v4 component and grid system available for Vue.js v2.6, complete with extens

{
  "name": "@bootstrap-vue/form-group",
  "version": "1.0.0",
  "meta": {
    "title": "Form Group",
    "description": "Easily add some structure to forms. Its purpose is to pair form controls with a legend or label, and to provide help text and invalid/valid feedback text, as well as visual (color) contextual state feedback.",
    "components": [
      {
        "component": "BFormGroup",
        "alias": [
          "BFormFieldset"
        ],
        "props": [
          {
            "prop": "disabled",
            "description": "Disabled the fieldset element, which in turn disables the form controls (on browsers that support disabled fieldsets). Has no effect if 'label-for' is set"
          },
          {
            "prop": "label",
            "description": "Text to place in the label/legend of the form group"
          },
          {
            "prop": "labelFor",
            "description": "Set to the ID of the singular form-control in the form-group. Do not set a value if there is more than one form control in the group."
          },
          {
            "prop": "labelSrOnly",
            "description": "Visually hides the label content, but makes it available to screen reader users"
          },
          {
            "prop": "description",
            "description": "Text to place in the help text area of the form group"
          },
          {
            "prop": "invalidFeedback",
            "description": "Text to show when the form group has an invalid state"
          },
          {
            "prop": "validFeedback",
            "description": "Text to show when the form group has a valid state"
          },
          {
            "prop": "feedbackAriaLive",
            "description": "Value to use for the 'aria-live' attribute on the feedback text"
          },
          {
            "prop": "labelCols",
            "description": "Number of columns for the label width xs screens and up"
          },
          {
            "prop": "labelColsSm",
            "description": "Number of columns for the label width sm screens and up"
          },
          {
            "prop": "labelColsMd",
            "description": "Number of columns for the label width md screens and up"
          },
          {
            "prop": "labelColsLg",
            "description": "Number of columns for the label width lg screens and up"
          },
          {
            "prop": "labelColsXl",
            "description": "Number of columns for the label width xl screens and up"
          },
          {
            "prop": "labelClass",
            "description": "CSS class (or classes) to add to the label/legend element"
          },
          {
            "prop": "labelAlign",
            "description": "Text alignment 'left', 'center', 'right' for the label xs screens and up"
          },
          {
            "prop": "labelAlignSm",
            "description": "Text alignment 'left', 'center', 'right' for the label sm screens and up"
          },
          {
            "prop": "labelAlignMd",
            "description": "Text alignment 'left', 'center', 'right' for the label md screens and up"
          },
          {
            "prop": "labelAlignLg",
            "description": "Text alignment 'left', 'center', 'right' for the label lg screens and up"
          },
          {
            "prop": "labelAlignXl",
            "description": "Text alignment 'left', 'center', 'right' for the label xl screens and up"
          },
          {
            "prop": "labelClass",
            "description": "CSS class (or classes) to add to the label/legend element"
          },
          {
            "prop": "labelSize",
            "description": "Sets the text size of the label: 'sm', 'md' (default) or 'lg'. Use this prop to have the label size match the form control size"
          },
          {
            "prop": "state",
            "description": "Controls the validation state of the feedback. 'true' force shows valid-feedback, 'false' force shows invalid feedback, 'null' does not force show the feedback"
          },
          {
            "prop": "tooltip",
            "description": "Renders the feedback text in a rudimentary tooltip style"
          },
          {
            "prop": "validated",
            "description": "When set, adds the Bootstrap validation trigger class 'was-validated' on the component"
          }
        ],
        "slots": [
          {
            "name": "label",
            "description": "Content to place inside the <label> element."
          },
          {
            "name": "description",
            "description": "Content to place in the description area."
          },
          {
            "name": "invalid-feedback",
            "description": "Content to place in the invalid feedback area"
          },
          {
            "name": "valid-feedback",
            "description": "Content to place in the valid feedback area"
          }
        ]
      }
    ]
  }
}