0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-23 21:53:55 -05:00
astro/examples/component/packages/my-component/README.md

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

38 lines
949 B
Markdown
Raw Normal View History

# Example `@example/my-component`
This is an example package, exported as `@example/my-component`. It consists of two Astro components, **Button** and **Heading**.
### Button
The **Button** component generates a `<button>` with a default **type** of **button**.
```astro
---
import * as Component from '@example/my-component'
---
<Component.Button>Plain Button</Component.Button>
```
```html
<!-- generated html -->
<button type="button">Plain Button</button>
```
### Heading
The **Heading** component generates an `<h>` tag with a default **role** of **heading** and a **level** attribute that gets written to **aria-level**.
```astro
---
import * as Component from '@example/my-component'
---
<Component.Heading>Heading</Component.Heading>
<Component.Heading level="2">Subheading</Component.Heading>
```
```html
<!-- generated html -->
<h role="heading" aria-level="1">Plain Button</h>
<h role="heading" aria-level="2">Subheading</h>
```