@stories-js/vue/dist/vetur/attributes.json

Vue 3 Stories renderer and wrapper for custom elements of Stories to be used as first-class Vue 3 components

{
  "stories-app/modules": {
    "type": "StoryModule[]",
    "description": "Story Modules",
    "options": []
  },
  "stories-app/store": {
    "type": "StoriesState & NotificationsState & LayoutState & AddonsState",
    "description": "Story Modules",
    "options": []
  },
  "stories-badge/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-button/button-type": {
    "type": "string",
    "description": "The type of button.",
    "options": []
  },
  "stories-button/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-button/disabled": {
    "type": "boolean",
    "description": "If `true`, the user cannot interact with the button.",
    "options": []
  },
  "stories-button/expand": {
    "type": "\"block\" | \"full\"",
    "description": "Set to `\"block\"` for a full-width button or to `\"full\"` for a full-width button\nwithout left and right borders.",
    "options": [
      "block",
      "full"
    ]
  },
  "stories-button/fill": {
    "type": "\"clear\" | \"default\" | \"outline\" | \"solid\"",
    "description": "Set to `\"clear\"` for a transparent button, to `\"outline\"` for a transparent\nbutton with a border, or to `\"solid\"`. The default style is `\"solid\"` except inside of\na toolbar, where the default is `\"clear\"`.",
    "options": [
      "clear",
      "default",
      "outline",
      "solid"
    ]
  },
  "stories-button/href": {
    "type": "string",
    "description": "Contains a URL or a URL fragment that the hyperlink points to.\nIf this property is set, an anchor tag will be rendered.",
    "options": []
  },
  "stories-button/router-direction": {
    "type": "\"back\" | \"forward\" | \"root\"",
    "description": "When using a router, it specifies the transition direction when navigating to\nanother page using `href`.",
    "options": [
      "back",
      "forward",
      "root"
    ]
  },
  "stories-button/shape": {
    "type": "\"round\"",
    "description": "The button shape.",
    "options": [
      "round"
    ]
  },
  "stories-button/size": {
    "type": "\"default\" | \"large\" | \"small\"",
    "description": "The button size.",
    "options": [
      "default",
      "large",
      "small"
    ]
  },
  "stories-button/strong": {
    "type": "boolean",
    "description": "If `true`, activates a button with a heavier font weight.",
    "options": []
  },
  "stories-button/target": {
    "type": "string",
    "description": "Specifies where to display the linked URL.\nOnly applies when an `href` is provided.\nSpecial keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.",
    "options": []
  },
  "stories-button/type": {
    "type": "\"button\" | \"reset\" | \"submit\"",
    "description": "The type of the button.",
    "options": [
      "button",
      "reset",
      "submit"
    ]
  },
  "stories-buttons/collapse": {
    "type": "boolean",
    "description": "If true, buttons will disappear when its\nparent toolbar has fully collapsed if the toolbar\nis not the first toolbar. If the toolbar is the\nfirst toolbar, the buttons will be hidden and will\nonly be shown once all toolbars have fully collapsed.",
    "options": []
  },
  "stories-checkbox/checked": {
    "type": "boolean",
    "description": "If `true`, the checkbox is selected.",
    "options": []
  },
  "stories-checkbox/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-checkbox/disabled": {
    "type": "boolean",
    "description": "If `true`, the user cannot interact with the checkbox.",
    "options": []
  },
  "stories-checkbox/indeterminate": {
    "type": "boolean",
    "description": "If `true`, the checkbox will visually appear as indeterminate.",
    "options": []
  },
  "stories-checkbox/name": {
    "type": "string",
    "description": "The name of the control, which is submitted with the form data.",
    "options": []
  },
  "stories-checkbox/value": {
    "type": "any",
    "description": "The value of the checkbox does not mean if it's checked or not, use the `checked`\nproperty for that.\n\nThe value of a checkbox is analogous to the value of an `<input type=\"checkbox\">`,\nit's only used when the checkbox participates in a native `<form>`.",
    "options": []
  },
  "stories-col/offset": {
    "type": "string",
    "description": "The amount to offset the column, in terms of how many columns it should shift to the end\nof the total available.",
    "options": []
  },
  "stories-col/offset-lg": {
    "type": "string",
    "description": "The amount to offset the column for lg screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/offset-md": {
    "type": "string",
    "description": "The amount to offset the column for md screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/offset-sm": {
    "type": "string",
    "description": "The amount to offset the column for sm screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/offset-xl": {
    "type": "string",
    "description": "The amount to offset the column for xl screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/offset-xs": {
    "type": "string",
    "description": "The amount to offset the column for xs screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/pull": {
    "type": "string",
    "description": "The amount to pull the column, in terms of how many columns it should shift to the start of\nthe total available.",
    "options": []
  },
  "stories-col/pull-lg": {
    "type": "string",
    "description": "The amount to pull the column for lg screens, in terms of how many columns it should shift\nto the start of the total available.",
    "options": []
  },
  "stories-col/pull-md": {
    "type": "string",
    "description": "The amount to pull the column for md screens, in terms of how many columns it should shift\nto the start of the total available.",
    "options": []
  },
  "stories-col/pull-sm": {
    "type": "string",
    "description": "The amount to pull the column for sm screens, in terms of how many columns it should shift\nto the start of the total available.",
    "options": []
  },
  "stories-col/pull-xl": {
    "type": "string",
    "description": "The amount to pull the column for xl screens, in terms of how many columns it should shift\nto the start of the total available.",
    "options": []
  },
  "stories-col/pull-xs": {
    "type": "string",
    "description": "The amount to pull the column for xs screens, in terms of how many columns it should shift\nto the start of the total available.",
    "options": []
  },
  "stories-col/push": {
    "type": "string",
    "description": "The amount to push the column, in terms of how many columns it should shift to the end\nof the total available.",
    "options": []
  },
  "stories-col/push-lg": {
    "type": "string",
    "description": "The amount to push the column for lg screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/push-md": {
    "type": "string",
    "description": "The amount to push the column for md screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/push-sm": {
    "type": "string",
    "description": "The amount to push the column for sm screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/push-xl": {
    "type": "string",
    "description": "The amount to push the column for xl screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/push-xs": {
    "type": "string",
    "description": "The amount to push the column for xs screens, in terms of how many columns it should shift\nto the end of the total available.",
    "options": []
  },
  "stories-col/size": {
    "type": "string",
    "description": "The size of the column, in terms of how many columns it should take up out of the total\navailable. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-col/size-lg": {
    "type": "string",
    "description": "The size of the column for lg screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-col/size-md": {
    "type": "string",
    "description": "The size of the column for md screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-col/size-sm": {
    "type": "string",
    "description": "The size of the column for sm screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-col/size-xl": {
    "type": "string",
    "description": "The size of the column for xl screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-col/size-xs": {
    "type": "string",
    "description": "The size of the column for xs screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content.",
    "options": []
  },
  "stories-grid/fixed": {
    "type": "boolean",
    "description": "If `true`, the grid will have a fixed width based on the screen size.",
    "options": []
  },
  "stories-icon/name": {
    "type": "string",
    "description": "Icon name",
    "options": []
  },
  "stories-input/autofocus": {
    "type": "boolean",
    "description": "This Boolean attribute lets you specify that a form control should have input focus when the page loads.",
    "options": []
  },
  "stories-input/clear-input": {
    "type": "boolean",
    "description": "If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.",
    "options": []
  },
  "stories-input/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-input/debounce": {
    "type": "number",
    "description": "Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.",
    "options": []
  },
  "stories-input/disabled": {
    "type": "boolean",
    "description": "If `true`, the user cannot interact with the input.",
    "options": []
  },
  "stories-input/inputmode": {
    "type": "\"decimal\" | \"email\" | \"none\" | \"numeric\" | \"search\" | \"tel\" | \"text\" | \"url\"",
    "description": "A hint to the browser for which keyboard to display.\nPossible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n`\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.",
    "options": [
      "decimal",
      "email",
      "none",
      "numeric",
      "search",
      "tel",
      "text",
      "url"
    ]
  },
  "stories-input/max": {
    "type": "string",
    "description": "The maximum value, which must not be less than its minimum (min attribute) value.",
    "options": []
  },
  "stories-input/maxlength": {
    "type": "number",
    "description": "If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter.",
    "options": []
  },
  "stories-input/min": {
    "type": "string",
    "description": "The minimum value, which must not be greater than its maximum (max attribute) value.",
    "options": []
  },
  "stories-input/minlength": {
    "type": "number",
    "description": "If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the minimum number of characters that the user can enter.",
    "options": []
  },
  "stories-input/name": {
    "type": "string",
    "description": "The name of the control, which is submitted with the form data.",
    "options": []
  },
  "stories-input/pattern": {
    "type": "string",
    "description": "A regular expression that the value is checked against. The pattern must match the entire value, not just some subset. Use the title attribute to describe the pattern to help the user. This attribute applies when the value of the type attribute is `\"text\"`, `\"search\"`, `\"tel\"`, `\"url\"`, `\"email\"`, `\"date\"`, or `\"password\"`, otherwise it is ignored. When the type attribute is `\"date\"`, `pattern` will only be used in browsers that do not support the `\"date\"` input type natively. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date for more information.",
    "options": []
  },
  "stories-input/placeholder": {
    "type": "string",
    "description": "Instructional text that shows before the input has a value.\nThis property applies only when the `type` property is set to `\"email\"`,\n`\"number\"`, `\"password\"`, `\"search\"`, `\"tel\"`, `\"text\"`, or `\"url\"`, otherwise it is ignored.",
    "options": []
  },
  "stories-input/readonly": {
    "type": "boolean",
    "description": "If `true`, the user cannot modify the value.",
    "options": []
  },
  "stories-input/required": {
    "type": "boolean",
    "description": "If `true`, the user must fill in a value before submitting a form.",
    "options": []
  },
  "stories-input/size": {
    "type": "number",
    "description": "The initial size of the control. This value is in pixels unless the value of the type attribute is `\"text\"` or `\"password\"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `\"text\"`, `\"search\"`, `\"tel\"`, `\"url\"`, `\"email\"`, or `\"password\"`, otherwise it is ignored.",
    "options": []
  },
  "stories-input/step": {
    "type": "string",
    "description": "Works with the min and max attributes to limit the increments at which a value can be set.\nPossible values are: `\"any\"` or a positive floating point number.",
    "options": []
  },
  "stories-input/type": {
    "type": "\"date\" | \"datetime-local\" | \"email\" | \"month\" | \"number\" | \"password\" | \"search\" | \"tel\" | \"text\" | \"time\" | \"url\" | \"week\"",
    "description": "The type of control to display. The default type is text.",
    "options": [
      "date",
      "datetime-local",
      "email",
      "month",
      "number",
      "password",
      "search",
      "tel",
      "text",
      "time",
      "url",
      "week"
    ]
  },
  "stories-input/value": {
    "type": "number | string",
    "description": "The value of the input.",
    "options": []
  },
  "stories-label/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-label/position": {
    "type": "\"fixed\" | \"floating\" | \"stacked\"",
    "description": "The position determines where and how the label behaves inside an item.",
    "options": [
      "fixed",
      "floating",
      "stacked"
    ]
  },
  "stories-searchbar/cancel-button-icon": {
    "type": "string",
    "description": "Set the cancel button icon. Only applies to `md` mode.\nDefaults to `\"arrow-back-sharp\"`.",
    "options": []
  },
  "stories-searchbar/clear-icon": {
    "type": "string",
    "description": "Set the clear icon. Defaults to `\"close-circle\"` for `ios` and `\"close-sharp\"` for `md`.",
    "options": []
  },
  "stories-searchbar/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-searchbar/debounce": {
    "type": "number",
    "description": "Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.",
    "options": []
  },
  "stories-searchbar/disabled": {
    "type": "boolean",
    "description": "If `true`, the user cannot interact with the input.",
    "options": []
  },
  "stories-searchbar/inputmode": {
    "type": "\"decimal\" | \"email\" | \"none\" | \"numeric\" | \"search\" | \"tel\" | \"text\" | \"url\"",
    "description": "A hint to the browser for which keyboard to display.\nPossible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n`\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.",
    "options": [
      "decimal",
      "email",
      "none",
      "numeric",
      "search",
      "tel",
      "text",
      "url"
    ]
  },
  "stories-searchbar/placeholder": {
    "type": "string",
    "description": "Set the input's placeholder.\n`placeholder` can accept either plaintext or HTML as a string.\nTo display characters normally reserved for HTML, they\nmust be escaped. For example `<Stories>` would become\n`&lt;Stories&gt;`",
    "options": []
  },
  "stories-searchbar/search-icon": {
    "type": "string",
    "description": "The icon to use as the search icon. Defaults to `\"search-outline\"` in\n`ios` mode and `\"search-sharp\"` in `md` mode.",
    "options": []
  },
  "stories-searchbar/show-cancel-button": {
    "type": "\"always\" | \"focus\" | \"never\"",
    "description": "Sets the behavior for the cancel button. Defaults to `\"never\"`.\nSetting to `\"focus\"` shows the cancel button on focus.\nSetting to `\"never\"` hides the cancel button.\nSetting to `\"always\"` shows the cancel button regardless\nof focus state.",
    "options": [
      "always",
      "focus",
      "never"
    ]
  },
  "stories-searchbar/show-clear-button": {
    "type": "\"always\" | \"focus\" | \"never\"",
    "description": "Sets the behavior for the clear button. Defaults to `\"focus\"`.\nSetting to `\"focus\"` shows the clear button on focus if the\ninput is not empty.\nSetting to `\"never\"` hides the clear button.\nSetting to `\"always\"` shows the clear button regardless\nof focus state, but only if the input is not empty.",
    "options": [
      "always",
      "focus",
      "never"
    ]
  },
  "stories-searchbar/type": {
    "type": "\"email\" | \"number\" | \"password\" | \"search\" | \"tel\" | \"text\" | \"url\"",
    "description": "Set the type of the input.",
    "options": [
      "email",
      "number",
      "password",
      "search",
      "tel",
      "text",
      "url"
    ]
  },
  "stories-searchbar/value": {
    "type": "string",
    "description": "the value of the searchbar.",
    "options": []
  },
  "stories-split-pane/default-size": {
    "type": "number",
    "description": "",
    "options": []
  },
  "stories-split-pane/is-resizing": {
    "type": "boolean",
    "description": "",
    "options": []
  },
  "stories-split-pane/min-size": {
    "type": "number",
    "description": "",
    "options": []
  },
  "stories-split-pane/split": {
    "type": "\"horizontal\" | \"vertical\"",
    "description": "",
    "options": [
      "horizontal",
      "vertical"
    ]
  },
  "stories-tab/tab": {
    "type": "string",
    "description": "A tab id must be provided for each `stories-tab`. It's used internally to reference\nthe selected tab or by the router to switch between them.",
    "options": []
  },
  "stories-tab-bar/color": {
    "type": "string",
    "description": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics).",
    "options": []
  },
  "stories-tab-bar/selected-tab": {
    "type": "string",
    "description": "The selected tab component",
    "options": []
  },
  "stories-tab-button/disabled": {
    "type": "boolean",
    "description": "If `true`, the user cannot interact with the tab button.",
    "options": []
  },
  "stories-tab-button/layout": {
    "type": "\"icon-bottom\" | \"icon-end\" | \"icon-hide\" | \"icon-start\" | \"icon-top\" | \"label-hide\"",
    "description": "Set the layout of the text and icon in the tab bar.\nIt defaults to `'icon-start'`.",
    "options": [
      "icon-bottom",
      "icon-end",
      "icon-hide",
      "icon-start",
      "icon-top",
      "label-hide"
    ]
  },
  "stories-tab-button/selected": {
    "type": "boolean",
    "description": "The selected tab component",
    "options": []
  },
  "stories-tab-button/tab": {
    "type": "string",
    "description": "A tab id must be provided for each `stories-tab`. It's used internally to reference\nthe selected tab or by the router to switch between them.",
    "options": []
  },
  "stories-tool-button/command": {
    "type": "\"zoomIn\" | \"zoomOut\" | \"zoomReset\"",
    "description": "command property",
    "options": [
      "zoomIn",
      "zoomOut",
      "zoomReset"
    ]
  },
  "stories-tool-button/disabled": {
    "type": "boolean",
    "description": "disabled property",
    "options": []
  },
  "stories-tool-button/icon": {
    "type": "string",
    "description": "icon property",
    "options": []
  },
  "stories-zoom/zoom": {
    "type": "number",
    "description": "",
    "options": []
  }
}