fixtures.test.ts.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`fixtures lint code blocks should work as expected: code-blocks.md 1`] = `
[
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Don’t use multiple top level headings (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Do not use headings with similar content per section (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-duplicate-headings-in-section",
    "severity": 1,
  },
  {
    "column": 8,
    "endColumn": 22,
    "endLine": 10,
    "line": 10,
    "message": "Unexpected var, use let or const instead.",
    "messageId": "unexpectedVar",
    "nodeType": "VariableDeclaration",
    "ruleId": "no-var",
    "severity": 2,
  },
  {
    "column": 18,
    "endColumn": 30,
    "endLine": 12,
    "fix": {
      "range": [
        140,
        152,
      ],
      "text": "[a].flat()",
    },
    "line": 12,
    "message": "Prefer \`Array#flat()\` over \`[].concat()\` to flatten an array.",
    "messageId": "prefer-array-flat",
    "nodeType": "CallExpression",
    "ruleId": "unicorn/prefer-array-flat",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 4,
    "endLine": 17,
    "line": 15,
    "message": "Missing code language flag",
    "nodeType": "Program",
    "ruleId": "remark-lint-fenced-code-flag",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 38,
    "line": 38,
    "message": "Don’t use multiple top level headings (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 38,
    "line": 38,
    "message": "Do not use headings with similar content per section (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-duplicate-headings-in-section",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 50,
    "line": 50,
    "message": "Don’t use multiple top level headings (5:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 50,
    "line": 50,
    "message": "Do not use headings with similar content per section (5:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-duplicate-headings-in-section",
    "severity": 1,
  },
]
`;

exports[`fixtures lint code blocks should work as expected: code-blocks.md 2`] = `
"# abc

# abc

<div>Hello World!</div>

<!-- eslint-disable unicorn/prefer-spread -->

\`\`\`JavaScript
export var a = 1 == 2

export const b = [a].flat()
\`\`\`

\`\`\`
export var a = 1 == 2
\`\`\`

\`\`\`log
This is not parsable as JavaScript!
\`\`\`

<!-- eslint-mdx -->

\`\`\`jsx
export const App = () => <div>2 > 1</div>
\`\`\`

<!-- eslint-skip -->

\`\`\`TypeScript
export type Value = 1 | 2 | 3 | 4 | 5
\`\`\`

\`\`\`MarkDown
# abc

# abc
\`\`\`

<!-- mdx -->

\`\`\`mdx
import React from 'react'

<header>Header</header>

# abc

# abc
\`\`\`
"
`;

exports[`fixtures lint code blocks should work as expected: code-blocks.mdx 1`] = `
[
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 2,
    "fix": {
      "range": [
        6,
        9,
      ],
      "text": "let",
    },
    "line": 2,
    "message": "Unexpected var, use let or const instead.",
    "messageId": "unexpectedVar",
    "nodeType": "VariableDeclaration",
    "ruleId": "no-var",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 6,
    "endLine": 4,
    "fix": {
      "range": [
        13,
        30,
      ],
      "text": "const b = [1, 2, 3]",
    },
    "line": 4,
    "message": "'b' is never reassigned. Use 'const' instead.",
    "messageId": "useConst",
    "nodeType": "Identifier",
    "ruleId": "prefer-const",
    "severity": 2,
  },
  {
    "column": 13,
    "endColumn": 25,
    "endLine": 6,
    "fix": {
      "range": [
        43,
        57,
      ],
      "text": ".at(-1)",
    },
    "line": 6,
    "message": "Prefer \`.at(…)\` over \`[….length - index]\`.",
    "messageId": "negative-index",
    "nodeType": "BinaryExpression",
    "ruleId": "unicorn/prefer-at",
    "severity": 2,
  },
]
`;

exports[`fixtures lint code blocks should work as expected: code-blocks.mdx 2`] = `
"\`\`\`js
let a

const b = [1, 2, 3]

const c = b.at(-1)

export { c }
\`\`\`
"
`;

exports[`fixtures should match all snapshots: 287.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: 292.mdx 1`] = `
[
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 5,
    "fix": {
      "range": [
        64,
        113,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 5,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 5,
    "line": 5,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 292.mdx 2`] = `
"# Header

paragraph <div className="abc">content</div>

- - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
"
`;

exports[`fixtures should match all snapshots: 334.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: 336.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: 367.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: 371.mdx 1`] = `
[
  {
    "column": 13,
    "endColumn": 14,
    "endLine": 7,
    "fix": {
      "range": [
        59,
        60,
      ],
      "text": "",
    },
    "line": 7,
    "message": "Delete \`;\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 371.mdx 2`] = `
"# Hello, World!

<div>

\`\`\`js
function foo() {
  return 123
}
\`\`\`

</div>
"
`;

exports[`fixtures should match all snapshots: 380.mdx 1`] = `
[
  {
    "column": 3,
    "endColumn": 13,
    "endLine": 21,
    "fix": {
      "range": [
        426,
        720,
      ],
      "text": "decorators={[
    moduleMetadata({
      imports: [
        ButtonModule,
        IconModule,
        FormsModule,
        FormModule,
        RadioModule,
        TabsModule,
        CardModule,
      ],
      declarations: [ActiveTestComponent, LazyTestComponent],
    }),
  ]}
  title="Tabs"",
    },
    "line": 21,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 46,
    "fix": {
      "range": [
        824,
        855,
      ],
      "text": "height="100px"
    name="Basic"",
    },
    "line": 46,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 83,
    "fix": {
      "range": [
        1499,
        1529,
      ],
      "text": "height="200px"
    name="Card"",
    },
    "line": 83,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 105,
    "fix": {
      "range": [
        1982,
        2012,
      ],
      "text": "height="200px"
    name="Size"",
    },
    "line": 105,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 139,
    "fix": {
      "range": [
        2920,
        2957,
      ],
      "text": "height="200px"
    name="CustomLabel"",
    },
    "line": 139,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 174,
    "fix": {
      "range": [
        3750,
        3784,
      ],
      "text": "height="100px"
    name="Editable"",
    },
    "line": 174,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 13,
    "endColumn": 16,
    "endLine": 200,
    "fix": {
      "range": [
        4442,
        4529,
      ],
      "text": "number_ = 1) {
          this.tabs = this.tabs.concat(
            Array.from({ length: number_",
    },
    "line": 200,
    "message": "The variable \`num\` should be named \`number_\`. A more descriptive name will do too.",
    "messageId": "replace",
    "nodeType": "Identifier",
    "ruleId": "unicorn/prevent-abbreviations",
    "severity": 2,
  },
  {
    "column": 33,
    "endColumn": 39,
    "endLine": 201,
    "line": 201,
    "message": "Prefer the spread operator over \`Array#concat(…)\`.",
    "messageId": "array-concat",
    "nodeType": "Identifier",
    "ruleId": "unicorn/prefer-spread",
    "severity": 2,
    "suggestions": [
      {
        "data": {},
        "desc": "First argument is an \`array\`.",
        "fix": {
          "range": [
            4475,
            4637,
          ],
          "text": "[...this.tabs, ...Array.from({ length: num })
              .fill()
              .map((_, i) => this.tabs[this.tabs.length - 1] + i + 1)]",
        },
        "messageId": "argument-is-spreadable",
      },
      {
        "data": {},
        "desc": "First argument is not an \`array\`.",
        "fix": {
          "range": [
            4475,
            4637,
          ],
          "text": "[...this.tabs, Array.from({ length: num })
              .fill()
              .map((_, i) => this.tabs[this.tabs.length - 1] + i + 1)]",
        },
        "messageId": "argument-is-not-spreadable",
      },
    ],
  },
  {
    "column": 24,
    "endColumn": 25,
    "endLine": 204,
    "fix": {
      "range": [
        4578,
        4619,
      ],
      "text": "index) => this.tabs[this.tabs.length - 1] + index",
    },
    "line": 204,
    "message": "The variable \`i\` should be named \`index\`. A more descriptive name will do too.",
    "messageId": "replace",
    "nodeType": "Identifier",
    "ruleId": "unicorn/prevent-abbreviations",
    "severity": 2,
  },
  {
    "column": 40,
    "endColumn": 60,
    "endLine": 204,
    "fix": {
      "range": [
        4593,
        4615,
      ],
      "text": ".at(-1)",
    },
    "line": 204,
    "message": "Prefer \`.at(…)\` over \`[….length - index]\`.",
    "messageId": "negative-index",
    "nodeType": "BinaryExpression",
    "ruleId": "unicorn/prefer-at",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 220,
    "fix": {
      "range": [
        4788,
        4822,
      ],
      "text": "height="100px"
    name="Disabled"",
    },
    "line": 220,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 253,
    "fix": {
      "range": [
        5581,
        5611,
      ],
      "text": "height="150px"
    name="Lazy"",
    },
    "line": 253,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 299,
    "fix": {
      "range": [
        6792,
        6822,
      ],
      "text": "height="100px"
    name="Nest"",
    },
    "line": 299,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 5,
    "endColumn": 11,
    "endLine": 348,
    "fix": {
      "range": [
        8233,
        8264,
      ],
      "text": "height="100px"
    name="Title"",
    },
    "line": 348,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 380.mdx 2`] = `
"import { FormsModule } from '@angular/forms'
import { Canvas, Meta, Story } from '@storybook/addon-docs'
import { moduleMetadata } from '@storybook/angular'

import { ActiveTestComponent } from './active-test.component'
import { LazyTestComponent } from './lazy-test.component'

import {
  ButtonModule,
  IconModule,
  FormModule,
  RadioModule,
  TabSize,
  TabType,
  TabsModule,
  CardModule,
} from '@alauda/ui'

<Meta
  decorators={[
    moduleMetadata({
      imports: [
        ButtonModule,
        IconModule,
        FormsModule,
        FormModule,
        RadioModule,
        TabsModule,
        CardModule,
      ],
      declarations: [ActiveTestComponent, LazyTestComponent],
    }),
  ]}
  title="Tabs"
/>

# Tabs

> 移植自 Angular Material, 增加了风格（卡片/线条）和尺寸（大/中/小）选项和 lazy 模式。

## 基础用法

<Canvas>
  <Story
    height="100px"
    name="Basic"
  >
    {{
      template: /* HTML */ \`
        <aui-tab-group [(tab)]="tab">
          <aui-tab
            name="a"
            label="Tab 0"
          >
            <aui-card> Content 1</aui-card>
          </aui-tab>
          <aui-tab
            name="b"
            label="Tab 1"
          >
            <aui-card> Content 2</aui-card>
          </aui-tab>
          <aui-tab
            name="c"
            label="Tab 2"
          >
            <aui-card> Content 3</aui-card>
          </aui-tab>
        </aui-tab-group>
      \`,
      props: {
        tab: 'a',
      },
    }}
  </Story>
</Canvas>

## Card

<Canvas>
  <Story
    height="200px"
    name="Card"
  >
    {{
      template: /* HTML */ \`
        <aui-tab-group [type]="type">
          <aui-tab label="Tab 0"><aui-card> Content 1 </aui-card></aui-tab>
          <aui-tab label="Tab 1"><aui-card> Content 2 </aui-card></aui-tab>
          <aui-tab label="Tab 2"><aui-card> Content 3 </aui-card></aui-tab>
        </aui-tab-group>
      \`,
      props: {
        type: TabType.Card,
      },
    }}
  </Story>
</Canvas>

## Size

<Canvas>
  <Story
    height="200px"
    name="Size"
  >
    {{
      template: /* HTML */ \`
        <aui-form-item>
          <label auiFormItemLabel>尺寸</label>
          <aui-radio-group
            auiFormItemControl
            [(ngModel)]="size"
            [plain]="false"
          >
            <aui-radio-button value="large">大</aui-radio-button>
            <aui-radio-button value="medium">中</aui-radio-button>
            <aui-radio-button value="small">小</aui-radio-button>
          </aui-radio-group>
        </aui-form-item>
        <aui-tab-group [size]="size">
          <aui-tab label="Tab 0"><aui-card> Content 1 </aui-card></aui-tab>
          <aui-tab label="Tab 1"><aui-card> Content 2 </aui-card></aui-tab>
          <aui-tab label="Tab 2"><aui-card> Content 3 </aui-card></aui-tab>
        </aui-tab-group>
      \`,
      props: {
        size: TabSize.Medium,
      },
    }}
  </Story>
</Canvas>

## 自定义 Label

<Canvas>
  <Story
    height="200px"
    name="CustomLabel"
  >
    {{
      template: /* HTML */ \`<aui-tab-group>
        <ng-container *auiTabTitle>aa2</ng-container>
        <aui-tab>
          <ng-container *auiTabLabel>
            <aui-icon icon="sun"></aui-icon>
            Custom Label
          </ng-container>
          <aui-card> Content 1 </aui-card>
        </aui-tab>
        <aui-tab label="Tab 1"><aui-card>Content 2</aui-card></aui-tab>
        <aui-tab>
          <ng-container *auiTabLabel>
            <aui-icon icon="moon"></aui-icon>
            Custom Label
          </ng-container>
          <aui-card> Content 3 </aui-card>
        </aui-tab>
      </aui-tab-group>\`,
      props: {
        tabs: Array.from({ length: 3 }).fill(),
      },
    }}
  </Story>
</Canvas>

## 添加删除

> 通过自定义 Group Header 实现

<Canvas>
  <Story
    height="100px"
    name="Editable"
  >
    {{
      template: /* HTML */ \`
        <aui-tab-group>
          <aui-tab
            *ngFor="let tab of tabs; index as i; count as len"
            [closeable]="len > 1"
            [label]="'tab' + tab"
            (close)="remove(i)"
          >
            <aui-card> content {{ i }} </aui-card>
          </aui-tab>
          <button
            *auiTabHeaderAddon
            aui-button="primary"
            (click)="add()"
            size="small"
            [square]="true"
          >
            <aui-icon icon="plus"></aui-icon>
          </button>
        </aui-tab-group>
      \`,
      props: {
        tabs: [1, 2, 3],
        add(number_ = 1) {
          this.tabs = this.tabs.concat(
            Array.from({ length: number_ })
              .fill()
              .map((_, index) => this.tabs.at(-1) + index + 1),
          )
        },
        remove(index) {
          this.tabs.splice(index, 1)
        },
      },
    }}
  </Story>
</Canvas>

## 禁用

<Canvas>
  <Story
    height="100px"
    name="Disabled"
  >
    {{
      template: /* HTML */ \`
        <aui-tab-group>
          <aui-tab label="Tab 0"> <aui-card> Content 1 </aui-card> </aui-tab>
          <aui-tab
            label="Tab 1"
            [disabled]="true"
            ><aui-card> Content 2 </aui-card></aui-tab
          >
          <aui-tab label="Tab 2"><aui-card> Content 3 </aui-card></aui-tab>
          <aui-tab
            label="Tab 3"
            [disabled]="true"
            ><aui-card> Content 4 </aui-card></aui-tab
          >
        </aui-tab-group>
      \`,
      props: {
        tabs: Array.from({ length: 10 }).fill(),
      },
    }}
  </Story>
</Canvas>

## Lazy 模式

> 依赖 \`*auiTabContent\`，与默认模式按需加载每次切换 Tab 都会销毁重新创建相比，lazy 启用时在按需加载组件的同时会缓存已加载的 Tab 内容。

<Canvas>
  <Story
    height="150px"
    name="Lazy"
  >
    {{
      template: /* HTML */ \`
        <aui-form-item>
          <label auiFormItemLabel>启用</label>
          <aui-radio-group
            auiFormItemControl
            [(ngModel)]="lazy"
            [plain]="false"
          >
            <aui-radio-button [value]="true">是</aui-radio-button>
            <aui-radio-button [value]="false">否</aui-radio-button>
          </aui-radio-group>
        </aui-form-item>
        <aui-tab-group [lazy]="lazy">
          <aui-tab label="Tab 1">
            <tabs-lazy-test *auiTabContent
              ><aui-card> Content 1 </aui-card></tabs-lazy-test
            >
          </aui-tab>
          <aui-tab label="Tab 2">
            <tabs-lazy-test *auiTabContent
              ><aui-card> Content 2 </aui-card></tabs-lazy-test
            >
          </aui-tab>
          <aui-tab label="Tab 3">
            <tabs-lazy-test *auiTabContent
              ><aui-card> Content 3 </aui-card></tabs-lazy-test
            >
          </aui-tab>
        </aui-tab-group>
      \`,
      props: {
        tabs: Array.from({ length: 10 }).fill(),
        lazy: true,
      },
    }}
  </Story>
</Canvas>

## Tab 嵌套

<Canvas>
  <Story
    height="100px"
    name="Nest"
  >
    {{
      template: /* HTML */ \` <aui-form-item>
          <label auiFormItemLabel>启用 Lazy</label>
          <aui-radio-group
            auiFormItemControl
            [(ngModel)]="lazy"
            [plain]="false"
          >
            <aui-radio-button [value]="true">是</aui-radio-button>
            <aui-radio-button [value]="false">否</aui-radio-button>
          </aui-radio-group>
        </aui-form-item>
        <aui-tab-group [lazy]="lazy">
          <aui-tab label="Tab 1">
            <tabs-active-test *auiTabContent
              ><aui-card>Content 1</aui-card></tabs-active-test
            >
          </aui-tab>
          <aui-tab label="Tab 2">
            <tabs-active-test *auiTabContent>
              <aui-tab-group [lazy]="true">
                <aui-tab label="Tab 2-1">
                  <tabs-active-test *auiTabContent>
                    <aui-card> Content 2-1 </aui-card>
                  </tabs-active-test>
                </aui-tab>
                <aui-tab label="Tab 2-2">
                  <tabs-active-test *auiTabContent>
                    <aui-card> Content 2-2 </aui-card>
                  </tabs-active-test>
                </aui-tab>
              </aui-tab-group>
            </tabs-active-test>
          </aui-tab>
        </aui-tab-group>\`,
      props: {
        lazy: true,
      },
    }}
  </Story>
</Canvas>

## 自定义 Title

<Canvas>
  <Story
    height="100px"
    name="Title"
  >
    {{
      template: /* HTML */ \`
        <aui-tab-group size="large">
          <ng-container *auiTabTitle>Title</ng-container>
          <aui-tab label="Tab 0"> <aui-card> Content 1 </aui-card> </aui-tab>
          <aui-tab label="Tab 1"><aui-card> Content 2 </aui-card></aui-tab>
          <aui-tab label="Tab 2"><aui-card> Content 3 </aui-card></aui-tab>
          <aui-tab label="Tab 3"><aui-card> Content 4 </aui-card></aui-tab>
        </aui-tab-group>
      \`,
    }}
  </Story>
</Canvas>

## TabGroupComponent Inputs

| 名称          | 类型    | 默认值         | 描述            |
| ------------- | ------- | -------------- | --------------- |
| type          | TabType | TabType.Line   | 样式主题        |
| size          | TabSize | TabSize.Medium | 尺寸            |
| tab           | string  | -              | 选中 Tab 的名称 |
| selectedIndex | number  | -              | 选中 Tab 的索引 |
| lazy          | boolean | false          | 懒加载模式      |

## TabGroupComponent Outputs

\`\`\`ts
interface TabChangeEvent {
  index: number
  tab: TabComponent
}
\`\`\`

| 名称                | 类型           | 描述                          |
| ------------------- | -------------- | ----------------------------- |
| tabChange           | string         | Tab 切换时发射 Tab 的名称     |
| selectedIndexChange | number         | Tab 切换时发射 Tab 的索引     |
| selectedTabChange   | TabChangeEvent | Tab 切换时发射 TabChangeEvent |
| focusChange         | TabChangeEvent | Tab \`focus\` 切换时发射        |

## TabComponent Inputs

| 名称      | 类型    | 默认值 | 说明             |
| --------- | ------- | ------ | ---------------- |
| name      | string  | -      | tab 的名称       |
| label     | string  | -      | 文字 label       |
| closeable | boolean | false  | 是否显示关闭按键 |
| disabled  | boolean | false  | 是否禁用此 tab   |

## TabComponent Outputs

| 名称  | 类型 | 描述                 |
| ----- | ---- | -------------------- |
| close | void | 关闭按键被点击时发射 |

## Directives

| 名称              | 作用范围          | 描述                        |
| ----------------- | ----------------- | --------------------------- |
| auiTabHeaderAddon | TabGroupComponent | 自定义 Group Header         |
| auiTabLabel       | TabComponent      | 自定义 Tab Label            |
| auiTabContent     | TabComponent      | Tab 内容区域，lazy 模式必用 |
"
`;

exports[`fixtures should match all snapshots: 391.mdx 1`] = `
[
  {
    "column": 2,
    "endColumn": 5,
    "endLine": 7,
    "line": 7,
    "message": "'Foo' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 429.mdx 1`] = `
[
  {
    "column": 17,
    "endColumn": 17,
    "endLine": 3,
    "fix": {
      "range": [
        49,
        49,
      ],
      "text": " ",
    },
    "line": 3,
    "message": "Insert \`·\`",
    "messageId": "insert",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 429.mdx 2`] = `
"<button disabled>Hello</button>

<button disabled />
"
`;

exports[`fixtures should match all snapshots: 435.mdx 1`] = `
[
  {
    "column": 1,
    "endColumn": 2,
    "endLine": 2,
    "fix": {
      "range": [
        8,
        9,
      ],
      "text": "  ",
    },
    "line": 2,
    "message": "Replace \`↹\` with \`··\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 3,
    "fix": {
      "range": [
        18,
        20,
      ],
      "text": "    ",
    },
    "line": 3,
    "message": "Replace \`↹↹\` with \`····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 4,
    "fix": {
      "range": [
        39,
        41,
      ],
      "text": "    ",
    },
    "line": 4,
    "message": "Replace \`↹↹\` with \`····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 2,
    "endLine": 5,
    "fix": {
      "range": [
        66,
        67,
      ],
      "text": "  ",
    },
    "line": 5,
    "message": "Replace \`↹\` with \`··\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 2,
    "endLine": 7,
    "fix": {
      "range": [
        72,
        73,
      ],
      "text": "  ",
    },
    "line": 7,
    "message": "Replace \`↹\` with \`··\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 2,
    "endColumn": 4,
    "endLine": 10,
    "fix": {
      "range": [
        91,
        93,
      ],
      "text": "",
    },
    "line": 10,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 16,
    "endLine": 12,
    "fix": {
      "range": [
        102,
        115,
      ],
      "text": "<Components
   ",
    },
    "line": 12,
    "message": "Replace \`··<Components\` with \`<Components⏎···\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 6,
    "endColumn": 16,
    "endLine": 12,
    "line": 12,
    "message": "'Components' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 7,
    "endLine": 13,
    "fix": {
      "range": [
        124,
        130,
      ],
      "text": "\`}
 ",
    },
    "line": 13,
    "message": "Replace \`····\`}\` with \`\`}⏎·\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 435.mdx 2`] = `
"<button
  style={{
    background: 'red',
    border: '1px solid red',
  }}
>
  Hello
</button>

- list

  <Components
    data={\`
\`}
  />
"
`;

exports[`fixtures should match all snapshots: 437.mdx 1`] = `
[
  {
    "column": 2,
    "endColumn": 5,
    "endLine": 1,
    "line": 1,
    "message": "'App' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
  {
    "column": 11,
    "endColumn": 18,
    "endLine": 1,
    "fix": {
      "range": [
        10,
        17,
      ],
      "text": ""foo"",
    },
    "line": 1,
    "message": "Curly braces are unnecessary here.",
    "messageId": "unnecessaryCurly",
    "nodeType": "JSXExpressionContainer",
    "ruleId": "react/jsx-curly-brace-presence",
    "severity": 2,
  },
  {
    "column": 20,
    "line": 1,
    "message": "\`'\` can be escaped with \`&apos;\`, \`&lsquo;\`, \`&#39;\`, \`&rsquo;\`.",
    "messageId": "unescapedEntityAlts",
    "nodeType": "Literal",
    "ruleId": "react/no-unescaped-entities",
    "severity": 2,
  },
  {
    "column": 24,
    "line": 1,
    "message": "\`'\` can be escaped with \`&apos;\`, \`&lsquo;\`, \`&#39;\`, \`&rsquo;\`.",
    "messageId": "unescapedEntityAlts",
    "nodeType": "Literal",
    "ruleId": "react/no-unescaped-entities",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 437.mdx 2`] = `
"<App prop="foo">{'bar'}</App>
"
`;

exports[`fixtures should match all snapshots: 445.mdx 1`] = `
[
  {
    "column": 1,
    "endColumn": 8,
    "endLine": 9,
    "fix": {
      "range": [
        178,
        187,
      ],
      "text": " />",
    },
    "line": 9,
    "message": "Empty components are self-closing",
    "messageId": "notSelfClosing",
    "nodeType": "JSXOpeningElement",
    "ruleId": "react/self-closing-comp",
    "severity": 2,
  },
  {
    "column": 2,
    "endColumn": 3,
    "endLine": 9,
    "line": 9,
    "message": "'A' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 445.mdx 2`] = `
"import { DefinitionList } from './DefinitionList'

<DefinitionList disabled>
  <DefinitionList.Title>Hello World !</DefinitionList.Title>
</DefinitionList>

<A:B ></A:B >

<A.B.C />
"
`;

exports[`fixtures should match all snapshots: 450.mdx 1`] = `
[
  {
    "column": 45,
    "endColumn": 46,
    "endLine": 1,
    "fix": {
      "range": [
        44,
        45,
      ],
      "text": "",
    },
    "line": 1,
    "message": "Delete \`;\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 6,
    "endLine": 11,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 11,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 16,
    "endLine": 13,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 13,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 15,
    "fix": {
      "range": [
        193,
        195,
      ],
      "text": "",
    },
    "line": 15,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 12,
    "endLine": 15,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 15,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 16,
    "fix": {
      "range": [
        216,
        218,
      ],
      "text": "",
    },
    "line": 16,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 17,
    "fix": {
      "range": [
        230,
        232,
      ],
      "text": "",
    },
    "line": 17,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 9,
    "endLine": 17,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 17,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 18,
    "fix": {
      "range": [
        245,
        247,
      ],
      "text": "",
    },
    "line": 18,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 10,
    "endLine": 18,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 18,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 19,
    "fix": {
      "range": [
        263,
        265,
      ],
      "text": "",
    },
    "line": 19,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 8,
    "endLine": 19,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 19,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 20,
    "fix": {
      "range": [
        294,
        296,
      ],
      "text": "",
    },
    "line": 20,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 9,
    "endLine": 20,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 20,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 21,
    "fix": {
      "range": [
        333,
        335,
      ],
      "text": "",
    },
    "line": 21,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 10,
    "endLine": 21,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 21,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 3,
    "endLine": 22,
    "fix": {
      "range": [
        374,
        376,
      ],
      "text": "",
    },
    "line": 22,
    "message": "Delete \`··\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 10,
    "endLine": 22,
    "fix": {
      "range": [
        114,
        414,
      ],
      "text": "alt=""
  aria-disabled
  className="my-image"
  height={250}

  loading="eager"
  onClick={() => console.log('onClick')}
  onError={() => console.log('onError')}
  onLoad={() => console.log('onLoad')}
  src="https://via.placeholder.com/250x250"
  style={{ display: 'block' }}
  title=""
  width={250}",
    },
    "line": 22,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 450.mdx 2`] = `
"import { Meta } from '@storybook/addon-docs'

<Meta title="Test" />

# Test

Lorem ipsum dolor sit amet.

<img
  alt=""
  aria-disabled
  className="my-image"
  height={250}

loading="eager"
onClick={() => console.log('onClick')}
onError={() => console.log('onError')}
onLoad={() => console.log('onLoad')}
src="https://via.placeholder.com/250x250"
style={{ display: 'block' }}
title=""
width={250}
/>
"
`;

exports[`fixtures should match all snapshots: 488.mdx 1`] = `
[
  {
    "column": 2,
    "endColumn": 7,
    "endLine": 1,
    "line": 1,
    "message": "'Image' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 9,
    "endLine": 5,
    "fix": {
      "range": [
        9,
        74,
      ],
      "text": "alt="alt"
  format="svg"
  height="100"
  src="src"
  width="315"",
    },
    "line": 5,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 9,
    "endLine": 6,
    "fix": {
      "range": [
        9,
        74,
      ],
      "text": "alt="alt"
  format="svg"
  height="100"
  src="src"
  width="315"",
    },
    "line": 6,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: 488.mdx 2`] = `
"<Image
  alt="alt"
  format="svg"
  height="100"
  src="src"
  width="315"
/>
"
`;

exports[`fixtures should match all snapshots: acorn.mdx 1`] = `
[
  {
    "column": 33,
    "fatal": true,
    "line": 9,
    "message": "Parsing error: Unexpected character \`\\\` (U+005C) in name, expected a name character such as letters, digits, \`$\`, or \`_\`; whitespace before attributes; or the end of the tag",
    "nodeType": null,
    "ruleId": null,
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: adjacent.mdx 1`] = `
[
  {
    "column": 14,
    "endColumn": 15,
    "endLine": 1,
    "fix": {
      "range": [
        13,
        14,
      ],
      "text": "",
    },
    "line": 1,
    "message": "Delete \`·\`",
    "messageId": "delete",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: adjacent.mdx 2`] = `
"import Basic from './basic'

<Basic /> <Basic />
"
`;

exports[`fixtures should match all snapshots: basic.mdx 1`] = `
[
  {
    "column": 18,
    "endColumn": 19,
    "endLine": 3,
    "fix": {
      "range": [
        46,
        47,
      ],
      "text": " = ",
    },
    "line": 3,
    "message": "Replace \`=\` with \`·=·\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 8,
    "endLine": 19,
    "fix": {
      "range": [
        275,
        309,
      ],
      "text": " />",
    },
    "line": 19,
    "message": "Empty components are self-closing",
    "messageId": "notSelfClosing",
    "nodeType": "JSXOpeningElement",
    "ruleId": "react/self-closing-comp",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: basic.mdx 2`] = `
"import Basic from './basic'

export const meta = {
  title: 'Blog Post',
}

# Blog Post

Lorem ipsum dolor sit amet, consectetur adipiscing **elit**. Ut ac lobortis <b>velit</b>.

{/* This is a comment */}

\`\`\`css
@media (min-width: 400px) {
  border-color: #000;
}
\`\`\`

<Basic />

## Subtitle

Lorem ipsum dolor sit _amet_, consectetur adipiscing elit. Ut ac lobortis velit.
"
`;

exports[`fixtures should match all snapshots: basic.tsx 1`] = `[]`;

exports[`fixtures should match all snapshots: blank-lines.mdx 1`] = `
[
  {
    "column": 9,
    "endColumn": 12,
    "endLine": 1,
    "fix": {
      "range": [
        8,
        11,
      ],
      "text": " Box ",
    },
    "line": 1,
    "message": "Replace \`Box\` with \`·Box·\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 5,
    "endLine": 10,
    "fix": {
      "range": [
        163,
        250,
      ],
      "text": "bg='lightgray'
  p={3}
  style={{
    textAlign: 'center',
    fontWeight: 'bold',
  }}",
    },
    "line": 10,
    "message": "Props should be sorted alphabetically",
    "messageId": "sortPropsByAlpha",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-sort-props",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 16,
    "endLine": 27,
    "fix": {
      "range": [
        0,
        768,
      ],
      "text": "import {Box} from '@rebass/emotion'

# Getting Started

If you have an existing project you want to integrate MDX with, check out
the installation guides.

<Box
  p={3}
  bg="lightgray"
  style={{
    textAlign: 'center',
    fontWeight: 'bold',
  }}
>
  [Next.js](/getting-started/next) |
  [Gatsby](/getting-started/gatsby) |
  [Create React App](/getting-started/create-react-app) |
  [React Static](/getting-started/react-static) |
  [Webpack](/getting-started/webpack) |
  [Parcel](/getting-started/parcel) |
  [Zero](/getting-started/zero)
</Box>

# Hello, world!

Here's a Twitter shortcode:

<Tweet tweetId="1116723357410447360" />

<TextGradient>
  # Here's a text gradient shortcode!
</TextGradient>

Here's a YouTube shortcode:

<YouTube videoId="4fHw4GeW3EU" />
",
    },
    "line": 27,
    "message": "Don’t use multiple top level headings (3:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 2,
    "endColumn": 7,
    "endLine": 31,
    "line": 31,
    "message": "'Tweet' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
  {
    "column": 2,
    "endColumn": 14,
    "endLine": 33,
    "line": 33,
    "message": "'TextGradient' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
  {
    "column": 1,
    "endColumn": 36,
    "endLine": 35,
    "line": 35,
    "message": "Don’t use multiple top level headings (3:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 2,
    "endColumn": 9,
    "endLine": 41,
    "line": 41,
    "message": "'YouTube' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: blank-lines.mdx 2`] = `
"import { Box } from '@rebass/emotion'

# Getting Started

If you have an existing project you want to integrate MDX with, check out
the installation guides.

<Box
  bg="lightgray"
  p={3}
  style={{
    textAlign: 'center',
    fontWeight: 'bold',
  }}
>
  [Next.js](/getting-started/next) | [Gatsby](/getting-started/gatsby) | [Create
  React App](/getting-started/create-react-app) | [React
  Static](/getting-started/react-static) | [Webpack](/getting-started/webpack) |
  [Parcel](/getting-started/parcel) | [Zero](/getting-started/zero)
</Box>

# Hello, world!

Here's a Twitter shortcode:

<Tweet tweetId="1116723357410447360" />

<TextGradient># Here's a text gradient shortcode!</TextGradient>

Here's a YouTube shortcode:

<YouTube videoId="4fHw4GeW3EU" />
"
`;

exports[`fixtures should match all snapshots: code-blocks.md 1`] = `
[
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Don’t use multiple top level headings (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Do not use headings with similar content per section (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-duplicate-headings-in-section",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 4,
    "endLine": 17,
    "line": 15,
    "message": "Missing code language flag",
    "nodeType": "Program",
    "ruleId": "remark-lint-fenced-code-flag",
    "severity": 1,
  },
]
`;

exports[`fixtures should match all snapshots: code-blocks.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: comments.mdx 1`] = `
[
  {
    "column": 2,
    "fatal": true,
    "line": 2,
    "message": "Parsing error: Unexpected character \`!\` (U+0021) before name, expected a character that can start a name, such as a letter, \`$\`, or \`_\` (note: to create a comment in MDX, use \`{/* text */}\`)",
    "nodeType": null,
    "ruleId": null,
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: details.mdx 1`] = `
[
  {
    "column": 1,
    "fatal": true,
    "line": 1,
    "message": "Parsing error: Expected a closing tag for \`</summary>\` (1:1-1:10) before the end of \`paragraph\`",
    "nodeType": null,
    "ruleId": null,
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: jsx-in-list.mdx 1`] = `
[
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 1,
    "fix": {
      "range": [
        8,
        57,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 1,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 1,
    "line": 1,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 5,
    "fix": {
      "range": [
        143,
        192,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 5,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 5,
    "line": 5,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 9,
    "fix": {
      "range": [
        278,
        327,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 9,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 9,
    "line": 9,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 13,
    "fix": {
      "range": [
        413,
        462,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 13,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 13,
    "line": 13,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 17,
    "fix": {
      "range": [
        548,
        597,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 17,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 17,
    "line": 17,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
  {
    "column": 9,
    "endColumn": 58,
    "endLine": 21,
    "fix": {
      "range": [
        683,
        732,
      ],
      "text": "
      kind="docs-packages-vuetify-preset"
      story="page"
    ",
    },
    "line": 21,
    "message": "Replace \`·kind="docs-packages-vuetify-preset"·story="page"\` with \`⏎······kind="docs-packages-vuetify-preset"⏎······story="page"⏎····\`",
    "messageId": "replace",
    "nodeType": null,
    "ruleId": "prettier/prettier",
    "severity": 2,
  },
  {
    "column": 46,
    "endColumn": 58,
    "endLine": 21,
    "line": 21,
    "message": "Unknown property 'story' found",
    "messageId": "unknownProp",
    "nodeType": "JSXAttribute",
    "ruleId": "react/no-unknown-property",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: jsx-in-list.mdx 2`] = `
"- - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
  - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
  - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
- - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
  - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
  - <div
      kind="docs-packages-vuetify-preset"
      story="page"
    >
      Vuetify preset
    </div>
    : some extra text describing the preset
"
`;

exports[`fixtures should match all snapshots: leading-spaces.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: markdown.md 1`] = `[]`;

exports[`fixtures should match all snapshots: nested.md 1`] = `[]`;

exports[`fixtures should match all snapshots: no-unescaped-entities.mdx 1`] = `
[
  {
    "column": 8,
    "line": 2,
    "message": "\`>\` can be escaped with \`&gt;\`.",
    "messageId": "unescapedEntityAlts",
    "nodeType": "JSXText",
    "ruleId": "react/no-unescaped-entities",
    "severity": 2,
  },
  {
    "column": 13,
    "line": 5,
    "message": "\`>\` can be escaped with \`&gt;\`.",
    "messageId": "unescapedEntityAlts",
    "nodeType": "JSXText",
    "ruleId": "react/no-unescaped-entities",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: no-unused-expressions.mdx 1`] = `
[
  {
    "column": 2,
    "endColumn": 7,
    "endLine": 1,
    "line": 1,
    "message": "'Story' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: processor.mdx 1`] = `
[
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Don’t use multiple top level headings (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-multiple-toplevel-headings",
    "severity": 1,
  },
  {
    "column": 1,
    "endColumn": 6,
    "endLine": 3,
    "line": 3,
    "message": "Do not use headings with similar content per section (1:1)",
    "nodeType": "Program",
    "ruleId": "remark-lint-no-duplicate-headings-in-section",
    "severity": 1,
  },
]
`;

exports[`fixtures should match all snapshots: remark.md 1`] = `[]`;

exports[`fixtures should match all snapshots: remark.mdx 1`] = `[]`;

exports[`fixtures should match all snapshots: test.md 1`] = `
[
  {
    "column": 1,
    "endColumn": 15,
    "endLine": 1,
    "line": 1,
    "message": "Link to unknown file: \`test\`",
    "nodeType": "Program",
    "ruleId": "remark-validate-links-missing-file",
    "severity": 1,
  },
]
`;

exports[`fixtures should match all snapshots: test.md 2`] = `
[
  {
    "column": 1,
    "endColumn": 15,
    "endLine": 1,
    "line": 1,
    "message": "Link to unknown file: \`test\`",
    "nodeType": "Program",
    "ruleId": "remark-validate-links-missing-file",
    "severity": 1,
  },
]
`;

exports[`fixtures should match all snapshots: unicorn.jsx 1`] = `
[
  {
    "column": 2,
    "endColumn": 9,
    "endLine": 1,
    "line": 1,
    "message": "'React' must be in scope when using JSX",
    "messageId": "notInScope",
    "nodeType": "JSXOpeningElement",
    "ruleId": "react/react-in-jsx-scope",
    "severity": 2,
  },
  {
    "column": 3,
    "endColumn": 8,
    "endLine": 1,
    "line": 1,
    "message": "'Story' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;

exports[`fixtures should match all snapshots: unicorn.mdx 1`] = `
[
  {
    "column": 2,
    "endColumn": 7,
    "endLine": 1,
    "line": 1,
    "message": "'Story' is not defined.",
    "messageId": "undefined",
    "nodeType": "JSXIdentifier",
    "ruleId": "react/jsx-no-undef",
    "severity": 2,
  },
]
`;