{
  "source": "https://nethesis.github.io/vue-components/",
  "package": "@nethesis/vue-components",
  "version": "3.16.0",
  "designSystem": "https://nethesis.github.io/nebula-design-system/llms.txt",
  "note": "The components of @nethesis/vue-components and the patterns, ready-made combinations of components for a whole interaction. Use a pattern when it covers the task, a component otherwise, and never a deprecated component: use its replacedBy. parts are components documented with the one that contains them. storiesSource is the code of the stories, with the usage of the component; componentSource is the code of the component. The Storybook is built from the main branch, which may have changes not released yet; version is the latest release. Check the props of the installed version in node_modules/@nethesis/vue-components/dist/components/<Name>.vue.d.ts. The rules for texts, icons and colors are in the Nebula Design System: designSystem lists its files, and descriptions link the sections of the writing guidelines that the texts follow.",
  "components": [
    {
      "name": "NeAvatar",
      "title": "Components/NeAvatar",
      "description": "The picture of a user or an account; without a picture, their initials or a user icon. `squared` makes it a square with rounded corners instead of a circle.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neavatar--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeAvatar.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeAvatar.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neavatar--default"
        },
        {
          "name": "Squared",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neavatar--squared"
        },
        {
          "name": "Image",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neavatar--image"
        },
        {
          "name": "Initials",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neavatar--initials"
        },
        {
          "name": "Placeholder Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neavatar--placeholder-slot"
        }
      ]
    },
    {
      "name": "NeBadge",
      "title": "Components/NeBadge [Deprecated]",
      "description": "Deprecated: use NeBadgeV2 instead. This component will be removed in a future release. To switch, move `text` and the icon into the default slot of NeBadgeV2, the icon as a `FontAwesomeIcon` before or after the text. The kinds become colors: `primary` stays, `secondary` becomes `gray`, `tertiary` `indigo`, `success` `green`, `warning` `amber`, `error` `rose` and `info` `blue`. `rounded` becomes `pill`, `customColorClasses` becomes `customKindClasses`, and an icon that removes the badge becomes `dismissable`, with the `dismiss` event. `label` has no replacement.",
      "deprecated": true,
      "replacedBy": "NeBadgeV2",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nebadge-deprecated--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeBadge.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeBadge.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--default"
        },
        {
          "name": "With Label",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--with-label"
        },
        {
          "name": "Kinds",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--kinds"
        },
        {
          "name": "Icons",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--icons"
        },
        {
          "name": "Icon Clickable",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--icon-clickable"
        },
        {
          "name": "Custom Color",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadge-deprecated--custom-color"
        }
      ]
    },
    {
      "name": "NeBadgeV2",
      "title": "Components/NeBadgeV2",
      "description": "A short label for a status or a category, such as Enabled, Expired or Admin, next to the object it describes. `dismissable` adds a button to remove it, for example to remove an active filter.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nebadgev2--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeBadgeV2.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeBadgeV2.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadgev2--default"
        },
        {
          "name": "Kind",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadgev2--kind"
        },
        {
          "name": "Custom Kind",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadgev2--custom-kind"
        },
        {
          "name": "With Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadgev2--with-icon"
        },
        {
          "name": "Dismissable",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebadgev2--dismissable"
        }
      ]
    },
    {
      "name": "NeButton",
      "title": "Components/NeButton",
      "description": "Starts an action. `primary` is the main action of a view or a dialog, and there is only one; `secondary` is for the other actions, `tertiary` for minor ones, `danger` to confirm a destructive action. Bind `loading` while the action runs. To go to another page, use `NeLink`. Its texts follow [Buttons and actions](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#buttons-and-actions) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nebutton--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeButton.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeButton.vue",
      "stories": [
        {
          "name": "Secondary",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--secondary"
        },
        {
          "name": "Primary",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--primary"
        },
        {
          "name": "Tertiary",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--tertiary"
        },
        {
          "name": "Danger",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--danger"
        },
        {
          "name": "Loading",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--loading"
        },
        {
          "name": "With Prefix",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--with-prefix"
        },
        {
          "name": "With Suffix",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--with-suffix"
        },
        {
          "name": "Icon Only",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--icon-only"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nebutton--disabled"
        }
      ]
    },
    {
      "name": "NeCard",
      "title": "Components/NeCard",
      "description": "A box that groups the content of a section, with an optional title, icon and menu of actions. It shows its own loading skeleton and error message, so each card of a dashboard can load on its own.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-necard--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeCard.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeCard.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--default"
        },
        {
          "name": "Title Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--title-slot"
        },
        {
          "name": "With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-description"
        },
        {
          "name": "With Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-icon"
        },
        {
          "name": "Loading",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--loading"
        },
        {
          "name": "Error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--error"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-tooltip"
        },
        {
          "name": "With Menu",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-menu"
        },
        {
          "name": "With Top Right Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-top-right-slot"
        },
        {
          "name": "With Menu And Top Right Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--with-menu-and-top-right-slot"
        },
        {
          "name": "Alternate Background",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--alternate-background"
        },
        {
          "name": "Without Title",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--without-title"
        },
        {
          "name": "Uppercase Title",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necard--uppercase-title"
        }
      ]
    },
    {
      "name": "NeCheckbox",
      "title": "Components/NeCheckbox",
      "description": "A single checkbox, with a label and an optional description. To choose several among a few options, use `NeCheckboxCards`; for a setting that is turned on or off, `NeToggle`. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-necheckbox--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeCheckbox.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeCheckbox.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--default"
        },
        {
          "name": "With Label Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--with-label-slot"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--disabled"
        },
        {
          "name": "With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--with-description"
        },
        {
          "name": "Disable Select On Label",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--disable-select-on-label"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--with-tooltip"
        },
        {
          "name": "Invalid Message",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckbox--invalid-message"
        }
      ]
    },
    {
      "name": "NeCheckboxCards",
      "title": "Components/NeCheckboxCards",
      "description": "A group of checkboxes shown as cards, each with a label and an optional description, icon or image, to choose several among a few options, all visible. For many options, use `NeMultiselectCombobox`; to choose only one, `NeRadioSelection` with `card`. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-necheckboxcards--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeCheckboxCards.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeCheckboxCards.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--default"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--disabled"
        },
        {
          "name": "With Icons",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--with-icons"
        },
        {
          "name": "With Images",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--with-images"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--with-tooltip"
        },
        {
          "name": "With Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--with-slot"
        },
        {
          "name": "Label Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--label-slot"
        },
        {
          "name": "Invalid Message",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necheckboxcards--invalid-message"
        }
      ]
    },
    {
      "name": "NeCombobox",
      "title": "Components/NeCombobox",
      "description": "A field to choose one option from a long list, typing to filter it. `acceptUserInput` also accepts a value that is not in the list. For a short list, use `NeListbox`. `multiple` is deprecated: to choose several options, use `NeMultiselectCombobox`. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-necombobox--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeCombobox.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeCombobox.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--default"
        },
        {
          "name": "Optional",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--optional"
        },
        {
          "name": "Many Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--many-options"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--helper-text"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--invalid"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--disabled"
        },
        {
          "name": "Multiple [Deprecated]",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--multiple"
        },
        {
          "name": "Multiple With Many Options [Deprecated]",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--multiple-with-many-options"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--options-with-description"
        },
        {
          "name": "Options With Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--options-with-icon"
        },
        {
          "name": "Options With Image",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--options-with-image"
        },
        {
          "name": "No Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--no-options"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--with-tooltip"
        },
        {
          "name": "Accept User Input",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--accept-user-input"
        },
        {
          "name": "Accept User Input Multiple [Deprecated]",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--accept-user-input-multiple"
        },
        {
          "name": "Custom Options Width",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--custom-options-width"
        },
        {
          "name": "External Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--external-filter"
        },
        {
          "name": "External Filter With Selected Option",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--external-filter-with-selected-option"
        },
        {
          "name": "External Filter With User Input",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--external-filter-with-user-input"
        },
        {
          "name": "Loading Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-necombobox--loading-options"
        }
      ]
    },
    {
      "name": "NeDropdown",
      "title": "Components/NeDropdown",
      "description": "A menu of actions opened by a button, by default three vertical dots: the actions of a table row, a card or a page. To filter a list, use `NeDropdownFilterV2`; to sort it, `NeSortDropdown`.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nedropdown--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeDropdown.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeDropdown.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdown--default"
        },
        {
          "name": "Align To Right",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdown--align-to-right"
        },
        {
          "name": "Button Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdown--button-slot"
        },
        {
          "name": "Menu Classes",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdown--menu-classes"
        },
        {
          "name": "Menu Header Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdown--menu-header-slot"
        }
      ]
    },
    {
      "name": "NeDropdownFilter",
      "title": "Components/NeDropdownFilter [Deprecated]",
      "description": "Deprecated: use NeDropdownFilterV2 instead. This component will be removed in a future release. NeDropdownFilterV2 has the same props and events, but its `v-model` holds the selected options, not their ids. The types `FilterOption` and `FilterOptionGroup` become `NeDropdownFilterV2Option` and `NeDropdownFilterV2OptionGroup`.",
      "deprecated": true,
      "replacedBy": "NeDropdownFilterV2",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nedropdownfilter-deprecated--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeDropdownFilter.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeDropdownFilter.vue",
      "stories": [
        {
          "name": "Checkbox Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--checkbox-options"
        },
        {
          "name": "Radio Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--radio-options"
        },
        {
          "name": "Radio With Selection Shown",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--radio-with-selection-shown"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--options-with-description"
        },
        {
          "name": "No Clear Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--no-clear-filter"
        },
        {
          "name": "Align To Right",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--align-to-right"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--disabled"
        },
        {
          "name": "Button Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--button-slot"
        },
        {
          "name": "No Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--no-options"
        },
        {
          "name": "Show Options Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--show-options-filter"
        },
        {
          "name": "Grouped Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--grouped-options"
        },
        {
          "name": "Many Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--many-options"
        },
        {
          "name": "External Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--external-filter"
        },
        {
          "name": "Loading Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--loading-options"
        },
        {
          "name": "Custom Action",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilter-deprecated--custom-action"
        }
      ]
    },
    {
      "name": "NeDropdownFilterV2",
      "title": "Components/NeDropdownFilterV2",
      "description": "A button that opens the values of a filter, in the toolbar above a table or a list. `kind` sets one value (`radio`) or several (`checkbox`). Options can be grouped. A search field appears with `showOptionsFilter`, or when there are more options than `maxOptionsShown`. With `checkbox`, the button shows how many values are selected. Its texts follow [Table filters](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#table-filters) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nedropdownfilterv2--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeDropdownFilterV2.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeDropdownFilterV2.vue",
      "stories": [
        {
          "name": "Checkbox Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--checkbox-options"
        },
        {
          "name": "Radio Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--radio-options"
        },
        {
          "name": "Radio With Selection Shown",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--radio-with-selection-shown"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--options-with-description"
        },
        {
          "name": "No Clear Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--no-clear-filter"
        },
        {
          "name": "Align To Right",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--align-to-right"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--disabled"
        },
        {
          "name": "Button Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--button-slot"
        },
        {
          "name": "No Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--no-options"
        },
        {
          "name": "Show Options Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--show-options-filter"
        },
        {
          "name": "Grouped Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--grouped-options"
        },
        {
          "name": "Many Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--many-options"
        },
        {
          "name": "External Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--external-filter"
        },
        {
          "name": "Loading Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--loading-options"
        },
        {
          "name": "Custom Action",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--custom-action"
        },
        {
          "name": "Custom Type Extension",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nedropdownfilterv2--custom-type-extension"
        }
      ]
    },
    {
      "name": "NeEmptyState",
      "title": "Components/NeEmptyState",
      "description": "Takes the place of a list, a table or a page with nothing to show: an icon, a title, a description and, when there is a next step, an action. Follow the Empty state pattern for its texts. Its texts follow [Empty states](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#empty-states) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neemptystate--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeEmptyState.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeEmptyState.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neemptystate--default"
        },
        {
          "name": "With Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neemptystate--with-icon"
        },
        {
          "name": "With Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neemptystate--with-slot"
        },
        {
          "name": "With Slot And Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neemptystate--with-slot-and-icon"
        }
      ]
    },
    {
      "name": "NeExpandable",
      "title": "Components/NeExpandable",
      "description": "A label that shows and hides the content below it, for advanced settings or details that would make a page too long.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neexpandable--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeExpandable.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeExpandable.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neexpandable--default"
        },
        {
          "name": "Full Width",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neexpandable--full-width"
        },
        {
          "name": "Custom Trigger",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neexpandable--custom-trigger"
        },
        {
          "name": "Custom Trigger Full Width",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neexpandable--custom-trigger-full-width"
        }
      ]
    },
    {
      "name": "NeFileInput",
      "title": "Components/NeFileInput",
      "description": "A field for one file: an area where the user drops the file or clicks to choose it, with an optional progress bar for the upload. `accept` filters the file picker only, not dropped files: check the type of the selected file. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nefileinput--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeFileInput.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeFileInput.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nefileinput--default"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nefileinput--invalid"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nefileinput--helper-text"
        },
        {
          "name": "Progress",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nefileinput--progress"
        },
        {
          "name": "Accept",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nefileinput--accept"
        }
      ]
    },
    {
      "name": "NeFormItemLabel",
      "title": "Components/NeFormItemLabel",
      "description": "The label of a form field built without the form components, which have their own `label` prop.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neformitemlabel--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeFormItemLabel.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeFormItemLabel.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neformitemlabel--default"
        }
      ]
    },
    {
      "name": "NeHeading",
      "title": "Components/NeHeading",
      "description": "A heading: `tag` sets the level, from `h1` to `h6`, and the matching text style. One `h1` per page, for its title.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neheading--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeHeading.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeHeading.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neheading--default"
        }
      ]
    },
    {
      "name": "NeInlineNotification",
      "title": "Components/NeInlineNotification",
      "description": "A message inside a page, a form or a dialog, that stays until the problem is solved or the user closes it: an error after an action, a warning, or information about the content around it. Buttons and `details` are optional. For the result of an action, shown for a few seconds, use `NeToastNotificationV2`. Its texts follow [Notifications](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#notifications) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neinlinenotification--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeInlineNotification.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeInlineNotification.vue",
      "stories": [
        {
          "name": "Info",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--info"
        },
        {
          "name": "Warning",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--warning"
        },
        {
          "name": "Error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--error"
        },
        {
          "name": "Success",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--success"
        },
        {
          "name": "With Close Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--with-close-icon"
        },
        {
          "name": "With Slots",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--with-slots"
        },
        {
          "name": "Buttons",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--buttons"
        },
        {
          "name": "Details",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neinlinenotification--details"
        }
      ]
    },
    {
      "name": "NeLink",
      "title": "Components/NeLink",
      "description": "A text link, to another page or to an external site, or for a minor action inside text. `invertedTheme` is for a background of the opposite theme, such as inside a tooltip.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nelink--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeLink.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeLink.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelink--default"
        },
        {
          "name": "Inverted Theme",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelink--inverted-theme"
        }
      ]
    },
    {
      "name": "NeListbox",
      "title": "Components/NeListbox",
      "description": "A field to choose one option from a short list, without typing: the equivalent of a select. For a long list that needs searching, use `NeCombobox`. To choose several options, use `NeCheckboxCards` for a few and `NeMultiselectCombobox` for many. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nelistbox--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeListbox.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeListbox.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--default"
        },
        {
          "name": "Optional",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--optional"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--helper-text"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--invalid"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--disabled"
        },
        {
          "name": "Multiple",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--multiple"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--options-with-description"
        },
        {
          "name": "No Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--no-options"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--with-tooltip"
        },
        {
          "name": "With Options Panel Style",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nelistbox--with-options-panel-style"
        }
      ]
    },
    {
      "name": "NeModal",
      "title": "Components/NeModal",
      "description": "A dialog over the page, for a confirmation, a short form or a message that needs an answer before going on. `kind` sets the icon; it has up to three buttons: primary, secondary and cancel. For a deletion, follow the Delete item modal pattern; for a long form or for details, use `NeSideDrawer`. Its texts follow [Modals](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#modals) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--neutral",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeModal.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeModal.vue",
      "stories": [
        {
          "name": "Neutral",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--neutral"
        },
        {
          "name": "Info",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--info"
        },
        {
          "name": "Warning",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--warning"
        },
        {
          "name": "Error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--error"
        },
        {
          "name": "Success",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--success"
        },
        {
          "name": "Single Button",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--single-button"
        },
        {
          "name": "Three Buttons",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--three-buttons"
        },
        {
          "name": "Primary Loading",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--primary-loading"
        },
        {
          "name": "Large",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemodal--large"
        }
      ]
    },
    {
      "name": "NeMultiselectCombobox",
      "title": "Components/NeMultiselectCombobox",
      "description": "A field to choose several options from a long list, typing to filter it. The chosen options are shown as badges. For a few options, use `NeCheckboxCards`; to choose only one, `NeCombobox`. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nemultiselectcombobox--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeMultiselectCombobox.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeMultiselectCombobox.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--default"
        },
        {
          "name": "With Selected Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--with-selected-options"
        },
        {
          "name": "Optional",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--optional"
        },
        {
          "name": "Many Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--many-options"
        },
        {
          "name": "Growing Input",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--growing-input"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--helper-text"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--invalid"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--disabled"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--options-with-description"
        },
        {
          "name": "Options With Icon",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--options-with-icon"
        },
        {
          "name": "Options With Image",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--options-with-image"
        },
        {
          "name": "No Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--no-options"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--with-tooltip"
        },
        {
          "name": "Accept User Input",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--accept-user-input"
        },
        {
          "name": "Custom Options Width",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--custom-options-width"
        },
        {
          "name": "External Filter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--external-filter"
        },
        {
          "name": "External Filter With User Input",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--external-filter-with-user-input"
        },
        {
          "name": "Loading Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--loading-options"
        },
        {
          "name": "Badge Kind Primary",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--badge-kind-primary"
        },
        {
          "name": "Badge Kind Custom",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--badge-kind-custom"
        },
        {
          "name": "Custom Type Extension",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nemultiselectcombobox--custom-type-extension"
        }
      ]
    },
    {
      "name": "NePaginator",
      "title": "Components/NePaginator",
      "description": "The page navigation of a table or a list, with the range of rows shown and the number of rows per page. It goes in the `paginator` slot of `NeTable`. In a narrow container the pages wrap below the range and the page size.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nepaginator--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NePaginator.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NePaginator.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepaginator--default"
        },
        {
          "name": "With Many Pages",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepaginator--with-many-pages"
        },
        {
          "name": "Custom Page Sizes",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepaginator--custom-page-sizes"
        },
        {
          "name": "In Narrow Container",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepaginator--in-narrow-container"
        }
      ]
    },
    {
      "name": "NePasswordRequirements",
      "title": "Components/NePasswordRequirements",
      "description": "The requirements of a new password, each marked as met or not while the user types. Use it with `usePasswordRequirements`, as in the New password form pattern.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nepasswordrequirements--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NePasswordRequirements.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NePasswordRequirements.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepasswordrequirements--default"
        },
        {
          "name": "All requirements met",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepasswordrequirements--all-requirements-met"
        },
        {
          "name": "With errors",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepasswordrequirements--with-errors"
        },
        {
          "name": "Custom requirements",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepasswordrequirements--custom-requirements"
        },
        {
          "name": "Custom Labels",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nepasswordrequirements--custom-labels"
        }
      ]
    },
    {
      "name": "NeProgressBar",
      "title": "Components/NeProgressBar",
      "description": "How far a task has gone, as a percentage, or `indeterminate` when that is unknown. For a short wait, use `NeSpinner`; while content loads, `NeSkeleton`.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neprogressbar--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeProgressBar.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeProgressBar.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--default"
        },
        {
          "name": "With Label",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--with-label"
        },
        {
          "name": "With Label And Progress",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--with-label-and-progress"
        },
        {
          "name": "Color",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--color"
        },
        {
          "name": "Custom Color",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--custom-color"
        },
        {
          "name": "Indeterminate",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neprogressbar--indeterminate"
        }
      ]
    },
    {
      "name": "NeRadioSelection",
      "title": "Components/NeRadioSelection",
      "description": "A group of radio buttons to choose one option among a few, all visible. With `card`, each option is a card with a description, an icon or an image. For many options, use `NeListbox`. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neradioselection--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeRadioSelection.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeRadioSelection.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--default"
        },
        {
          "name": "With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--with-description"
        },
        {
          "name": "Card Picker",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--card-picker"
        },
        {
          "name": "Card Picker With Images",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--card-picker-with-images"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--disabled"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--with-tooltip"
        },
        {
          "name": "With Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--with-slot"
        },
        {
          "name": "Options With Description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--options-with-description"
        },
        {
          "name": "Label Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--label-slot"
        },
        {
          "name": "Invalid Message",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neradioselection--invalid-message"
        }
      ]
    },
    {
      "name": "NeRoundedIcon",
      "title": "Components/NeRoundedIcon",
      "description": "An icon in a colored circle that shows the kind of a message: info, warning, error or success. Modals and notifications already include it.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neroundedicon--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeRoundedIcon.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeRoundedIcon.vue",
      "stories": [
        {
          "name": "Info",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--info"
        },
        {
          "name": "Warning",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--warning"
        },
        {
          "name": "Error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--error"
        },
        {
          "name": "Success",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--success"
        },
        {
          "name": "Gray",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--gray"
        },
        {
          "name": "Custom",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neroundedicon--custom"
        }
      ]
    },
    {
      "name": "NeSideDrawer",
      "title": "Components/NeSideDrawer",
      "description": "A modal panel that slides in from the right over the dimmed page, for a form or details too long for a modal. The page behind it cannot be used until it closes.",
      "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesidedrawer--default",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeSideDrawer.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeSideDrawer.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesidedrawer--default"
        },
        {
          "name": "No Title",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesidedrawer--no-title"
        },
        {
          "name": "Vertical Overflow",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesidedrawer--vertical-overflow"
        }
      ]
    },
    {
      "name": "NeSkeleton",
      "title": "Components/NeSkeleton",
      "description": "Gray lines in place of content while it loads. For a table, use the `loading` prop of `NeTable`.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-neskeleton--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeSkeleton.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeSkeleton.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-neskeleton--default"
        }
      ]
    },
    {
      "name": "NeSortDropdown",
      "title": "Components/NeSortDropdown",
      "description": "A button that opens the sort options of a list or a table: the field to sort by and the direction.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nesortdropdown--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeSortDropdown.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeSortDropdown.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesortdropdown--default"
        },
        {
          "name": "Align To Right",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesortdropdown--align-to-right"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesortdropdown--disabled"
        },
        {
          "name": "Button Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesortdropdown--button-slot"
        },
        {
          "name": "Many Options",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nesortdropdown--many-options"
        }
      ]
    },
    {
      "name": "NeSpinner",
      "title": "Components/NeSpinner",
      "description": "A small spinning indicator for a short wait. `NeButton` shows it with `loading`. While a page or a section loads, use `NeSkeleton`.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nespinner--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeSpinner.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeSpinner.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nespinner--default"
        }
      ]
    },
    {
      "name": "NeStepper",
      "title": "Components/NeStepper",
      "description": "The current step of a procedure with several steps, such as a wizard: a progress bar with the step number.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-nestepper--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeStepper.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeStepper.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-nestepper--default"
        }
      ]
    },
    {
      "name": "NeTable",
      "title": "Components/NeTable",
      "description": "A data table, built with `NeTableHead`, `NeTableHeadCell`, `NeTableBody`, `NeTableRow` and `NeTableCell`. Below `cardBreakpoint`, each row becomes a card. Sortable columns emit `sort`, and the product sorts the rows, for example with `useSort`; `useItemPagination` splits the rows into pages for a `NePaginator` in the `paginator` slot. `loading` shows a skeleton. For a whole page that lists objects, follow the Table page pattern.",
      "parts": [
        "NeTableHead",
        "NeTableHeadCell",
        "NeTableBody",
        "NeTableRow",
        "NeTableCell"
      ],
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netable--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeTable.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeTable.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--default"
        },
        {
          "name": "With Paginator",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--with-paginator"
        },
        {
          "name": "Loading",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--loading"
        },
        {
          "name": "No Items",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--no-items"
        },
        {
          "name": "Card Breakpoint XL",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--card-breakpoint-xl"
        },
        {
          "name": "Sortable",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netable--sortable"
        }
      ]
    },
    {
      "name": "NeTabs",
      "title": "Components/NeTabs",
      "description": "Tabs that switch between views of the same page or object.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netabs--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeTabs.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeTabs.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netabs--default"
        }
      ]
    },
    {
      "name": "NeTextArea",
      "title": "Components/NeTextArea",
      "description": "A text field of several lines, for descriptions, notes and other long text. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netextarea--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeTextArea.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeTextArea.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--default"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--helper-text"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--invalid"
        },
        {
          "name": "Optional",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--optional"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--disabled"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--with-tooltip"
        },
        {
          "name": "Readonly",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextarea--readonly"
        }
      ]
    },
    {
      "name": "NeTextInput",
      "title": "Components/NeTextInput",
      "description": "A text field of one line. `isSearch` makes it a search field with a button to clear it; `isPassword` hides the value, with a button to show it. The `prefix` and `suffix` slots add text or an icon inside the field. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netextinput--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeTextInput.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeTextInput.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--default"
        },
        {
          "name": "Helper Text",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--helper-text"
        },
        {
          "name": "Invalid",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--invalid"
        },
        {
          "name": "Optional",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--optional"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--disabled"
        },
        {
          "name": "Password",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--password"
        },
        {
          "name": "Type Number",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--type-number"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--with-tooltip"
        },
        {
          "name": "With Prefix",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--with-prefix"
        },
        {
          "name": "With Suffix",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--with-suffix"
        },
        {
          "name": "Search",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--search"
        },
        {
          "name": "Readonly",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netextinput--readonly"
        }
      ]
    },
    {
      "name": "NeToastNotification",
      "title": "Components/NeToastNotification [Deprecated]",
      "description": "Deprecated: use NeToastNotificationV2 instead. This component will be removed in a future release. To switch, make the notification a `NeNotificationV2`: `primaryLabel` and `secondaryLabel` become `firstButtonLabel` and `secondButtonLabel`. `primaryAction` and `secondaryAction` hold functions, while `firstButtonAction` and `secondButtonAction` hold names: the component emits the name with the `action` event, and the product runs the action. `primaryButtonRightAligned` becomes `firstActionOnRight`.",
      "deprecated": true,
      "replacedBy": "NeToastNotificationV2",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netoastnotification-deprecated--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeToastNotification.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeToastNotification.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotification-deprecated--default"
        },
        {
          "name": "Icon Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotification-deprecated--icon-slot"
        }
      ]
    },
    {
      "name": "NeToastNotificationV2",
      "title": "Components/NeToastNotificationV2",
      "description": "A notification about the result of an action the user should notice, such as an object created or deleted, with up to two actions. It is only the card: the product shows it in a fixed container at the edge of the screen, and removes it on `close` or after a few seconds. For an error the user has to act on, use `NeInlineNotification`. Follow the Success toast notification pattern. Its texts follow [Notifications](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#notifications) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netoastnotificationv2--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeToastNotificationV2.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeToastNotificationV2.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--default"
        },
        {
          "name": "Success",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--success"
        },
        {
          "name": "Warning",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--warning"
        },
        {
          "name": "Error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--error"
        },
        {
          "name": "With Close Button",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--with-close-button"
        },
        {
          "name": "With Timestamp",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--with-timestamp"
        },
        {
          "name": "Full Width",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--full-width"
        },
        {
          "name": "Icon Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoastnotificationv2--icon-slot"
        }
      ]
    },
    {
      "name": "NeToggle",
      "title": "Components/NeToggle",
      "description": "A switch that turns a setting or a feature on or off. Its label, helper text and validation messages follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netoggle--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeToggle.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeToggle.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--default"
        },
        {
          "name": "Disabled",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--disabled"
        },
        {
          "name": "With Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--with-tooltip"
        },
        {
          "name": "With Top Label",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--with-top-label"
        },
        {
          "name": "With Top Label And Tooltip",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--with-top-label-and-tooltip"
        },
        {
          "name": "Invalid Message",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netoggle--invalid-message"
        }
      ]
    },
    {
      "name": "NeTooltip",
      "title": "Components/NeTooltip",
      "description": "Extra information about an element, such as the help icon next to a label. It opens on click by default; `triggerEvent=\"mouseenter focus\"` opens it on hover and focus. Form components have a `tooltip` slot for it. Never put information the user needs only in a tooltip.",
      "link": "https://nethesis.github.io/vue-components/?path=/docs/components-netooltip--docs",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/NeTooltip.stories.ts",
      "componentSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/src/components/NeTooltip.vue",
      "stories": [
        {
          "name": "Default",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--default"
        },
        {
          "name": "With Trigger Slot",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--with-trigger-slot"
        },
        {
          "name": "Show On Mouse Enter",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--show-on-mouse-enter"
        },
        {
          "name": "Placement",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--placement"
        },
        {
          "name": "Contains Link",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--contains-link"
        },
        {
          "name": "Tippy Props",
          "link": "https://nethesis.github.io/vue-components/?path=/story/components-netooltip--tippy-props"
        }
      ]
    }
  ],
  "patterns": [
    {
      "name": "Create item drawer",
      "title": "Patterns/Create item drawer",
      "description": "The form to create an object, in an `NeSideDrawer` opened by the create button of the page: the fields, an `NeInlineNotification` when the save fails, and the footer with Cancel and the button that saves. The same drawer edits an object: then its title is Edit <object> and the button is Save. The first field gets the focus when the drawer opens, and Enter in a field saves. After saving, the drawer closes and the product shows the Success toast notification pattern. Its texts follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) and [Error messages](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#error-messages) in the writing guidelines.",
      "component": "NeSideDrawer",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--standard",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternCreateItemDrawer.stories.ts",
      "stories": [
        {
          "name": "Standard",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--standard"
        },
        {
          "name": "Validation errors",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--validation-errors"
        },
        {
          "name": "Saving",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--saving"
        },
        {
          "name": "Save error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--save-error"
        },
        {
          "name": "Edit item",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--edit-item"
        },
        {
          "name": "Standard (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--standard-italian"
        },
        {
          "name": "Validation errors (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--validation-errors-italian"
        },
        {
          "name": "Saving (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--saving-italian"
        },
        {
          "name": "Save error (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--save-error-italian"
        },
        {
          "name": "Edit item (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-create-item-drawer--edit-item-italian"
        }
      ]
    },
    {
      "name": "Delete item modal",
      "title": "Patterns/Delete item modal",
      "description": "The confirmation before deleting an object: an `NeModal` of kind warning with a danger button. The Type to confirm version asks the user to type the name of the object, for deletions that lose a lot of data. Its texts follow [Delete confirmation](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#delete-confirmation) in the writing guidelines.",
      "component": "NeModal",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-delete-item-modal--standard",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternDeleteItemModal.stories.ts",
      "stories": [
        {
          "name": "Standard",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-delete-item-modal--standard"
        },
        {
          "name": "Type to confirm",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-delete-item-modal--type-to-confirm"
        },
        {
          "name": "Standard (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-delete-item-modal--standard-italian"
        },
        {
          "name": "Type to confirm (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-delete-item-modal--type-to-confirm-italian"
        }
      ]
    },
    {
      "name": "Empty state",
      "title": "Patterns/Empty state",
      "description": "The empty states of a page or a list: no objects yet, no objects configured, no results for a search or a filter, and a page the user cannot access. Its texts follow [Empty states](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#empty-states) in the writing guidelines.",
      "component": "NeEmptyState",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternEmptyState.stories.ts",
      "stories": [
        {
          "name": "No items",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items"
        },
        {
          "name": "No items configured",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items-configured"
        },
        {
          "name": "No items found",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items-found"
        },
        {
          "name": "Restricted page",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--restricted-page"
        },
        {
          "name": "No items (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items-italian"
        },
        {
          "name": "No items configured (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items-configured-italian"
        },
        {
          "name": "No items found (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--no-items-found-italian"
        },
        {
          "name": "Restricted page (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-empty-state--restricted-page-italian"
        }
      ]
    },
    {
      "name": "Inline error notification",
      "title": "Patterns/Inline error notification",
      "description": "The error shown inside a page or a form when an action fails, such as saving: a network error or a generic one. Its texts follow [Error messages](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#error-messages) and [Inline notifications](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#inline-notifications) in the writing guidelines.",
      "component": "NeInlineNotification",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-inline-error-notification--network-error",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternInlineErrorNotification.stories.ts",
      "stories": [
        {
          "name": "Network error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-inline-error-notification--network-error"
        },
        {
          "name": "Generic error",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-inline-error-notification--generic-error"
        },
        {
          "name": "Network error (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-inline-error-notification--network-error-italian"
        },
        {
          "name": "Generic error (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-inline-error-notification--generic-error-italian"
        }
      ]
    },
    {
      "name": "New password form",
      "title": "Patterns/New password form",
      "description": "The form to set a new password: the password with its requirements, checked while the user types, and its confirmation. Its texts follow [Forms](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#forms) in the writing guidelines.",
      "component": "NePasswordRequirements",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--standard",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternNewPasswordForm.stories.ts",
      "stories": [
        {
          "name": "Standard",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--standard"
        },
        {
          "name": "Invalid submit",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--invalid-submit"
        },
        {
          "name": "Passwords do not match",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--passwords-do-not-match"
        },
        {
          "name": "Standard (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--standard-italian"
        },
        {
          "name": "Invalid submit (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--invalid-submit-italian"
        },
        {
          "name": "Passwords do not match (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-new-password-form--passwords-do-not-match-italian"
        }
      ]
    },
    {
      "name": "Success toast notification",
      "title": "Patterns/Success toast notification",
      "description": "The toast notification shown after an object is created, updated or deleted, with its texts. Its texts follow [Success notifications](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#success-notifications) in the writing guidelines.",
      "component": "NeToastNotificationV2",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-created",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternSuccessToastNotification.stories.ts",
      "stories": [
        {
          "name": "Item created",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-created"
        },
        {
          "name": "Item updated",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-updated"
        },
        {
          "name": "Item deleted",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-deleted"
        },
        {
          "name": "Item created (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-created-italian"
        },
        {
          "name": "Item updated (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-updated-italian"
        },
        {
          "name": "Item deleted (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-success-toast-notification--item-deleted-italian"
        }
      ]
    },
    {
      "name": "Table page",
      "title": "Patterns/Table page",
      "description": "A page that lists objects in a table: the description of the page with the create button, the toolbar with search, filters and sorting, the table with the actions of each row and the paginator, and the loading and empty states. Without a description, the create button goes on the right of the toolbar, or above it on small screens. With no objects yet, the create button is only in the empty state. Its texts follow [Page header](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#page-header), [Table filters](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#table-filters) and [Empty states](https://nethesis.github.io/nebula-design-system/?page=writing-guidelines#empty-states) in the writing guidelines.",
      "component": "NeTable",
      "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--standard",
      "storiesSource": "https://raw.githubusercontent.com/nethesis/vue-components/main/stories/PatternTablePage.stories.ts",
      "stories": [
        {
          "name": "Standard",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--standard"
        },
        {
          "name": "Loading",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--loading"
        },
        {
          "name": "No items configured",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--no-items-configured"
        },
        {
          "name": "No items found",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--no-items-found"
        },
        {
          "name": "Without description",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--without-description"
        },
        {
          "name": "Standard (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--standard-italian"
        },
        {
          "name": "Loading (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--loading-italian"
        },
        {
          "name": "No items configured (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--no-items-configured-italian"
        },
        {
          "name": "No items found (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--no-items-found-italian"
        },
        {
          "name": "Without description (Italian)",
          "link": "https://nethesis.github.io/vue-components/?path=/story/patterns-table-page--without-description-italian"
        }
      ]
    }
  ]
}