mirror of
https://github.com/tabler/tabler.git
synced 2026-08-07 03:42:27 +04:00
codecalm
f27c70ad38
`Render Modal as real markup` (#2742) reformatted ~140 files back to tabs/semicolons, breaking the Prettier config added by the Astro quality gates (#2749). Re-run prettier --write to restore it, and fix the type errors it had been masking: HTMLElement casts and `this` typing in ChangePasswordModalContent/ConfirmDeleteModalContent scripts, plain-JS syntax in the inline-injected progress.astro script, narrowed prop unions in Button/Check/Spinner, nullable icon svg casts in Icons/Rating, and a duplicate firstLetters/invalid `placeholder` attribute in Select.astro. Also fix shared/vitest.config.mts's stale `astro/lib/**/*.test.ts` include glob left over from the shared source restructure, which made `pnpm test` report zero test files.
52 lines
1.8 KiB
Plaintext
52 lines
1.8 KiB
Plaintext
---
|
|
import Icon from './Icon.astro'
|
|
import Avatar from './Avatar.astro'
|
|
import people from '@data/people.json'
|
|
|
|
interface Props {
|
|
show?: boolean
|
|
}
|
|
|
|
const { show } = Astro.props
|
|
|
|
const peopleItems = (people as { id: number | string; full_name: string }[]).slice(0, 3)
|
|
---
|
|
|
|
<div class={`dropdown-menu${show ? ' dropdown-menu-demo' : ''}`}>
|
|
<h6 class="dropdown-header">Dropdown header</h6>
|
|
<a href="#" class="dropdown-item"><Icon name="activity" class="dropdown-item-icon" /> Item 1</a>
|
|
<a href="#" class="dropdown-item"><Icon name="edit" class="dropdown-item-icon" /> Item 2</a>
|
|
|
|
<div class="dropdown-item">
|
|
<a href="#" class="text-reset">My profile</a>
|
|
<label class="form-check m-0 ms-auto">
|
|
<input type="checkbox" class="form-check-input" />
|
|
Public
|
|
</label>
|
|
</div>
|
|
<label class="dropdown-item"><input class="form-check-input m-0 me-2" type="radio" /> Radio input</label>
|
|
<label class="dropdown-item"><input class="form-check-input m-0 me-2" type="checkbox" /> Checkbox input</label>
|
|
<label class="dropdown-item form-switch"><input class="form-check-input m-0 me-2" type="checkbox" /> Checkbox input</label>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a href="#" class="dropdown-item">Dropdown item 1</a>
|
|
<a href="#" class="dropdown-item">Dropdown item 2</a>
|
|
<a href="#" class="dropdown-item disabled">Dropdown disabled</a>
|
|
<a href="#" class="dropdown-item active">Dropdown active</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
{
|
|
peopleItems.map((person) => (
|
|
<a href="#" class="dropdown-item">
|
|
<Avatar personId={Number(person.id)} class="rounded me-2" size="xs" /> {person.full_name}
|
|
</a>
|
|
))
|
|
}
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a href="#" class="dropdown-item"><Icon name="logout" class="dropdown-item-icon" /> Logout</a>
|
|
</div>
|