mirror of
https://github.com/tabler/tabler.git
synced 2026-10-15 10:46:23 +04:00
`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.
53 lines
1.5 KiB
Plaintext
53 lines
1.5 KiB
Plaintext
---
|
|
import { capitalize } from '@shared/lib/string-format'
|
|
|
|
interface Props {
|
|
type?: 'checkbox' | 'radio'
|
|
checked?: boolean
|
|
disabled?: boolean
|
|
/** Switch mode (prop name isSwitch; `switch` is reserved). */
|
|
switch?: boolean
|
|
title?: string | false
|
|
name?: string
|
|
inline?: boolean
|
|
size?: string
|
|
empty?: boolean
|
|
titleOn?: string
|
|
titleOff?: string
|
|
class?: string
|
|
}
|
|
|
|
const { type = 'checkbox', checked = false, disabled = false, switch: isSwitch = false, title: titleProp = false, name, inline, size, empty: isEmpty = false, titleOn, titleOff, class: className } = Astro.props
|
|
|
|
let title = titleProp
|
|
if (!title) {
|
|
let t = ''
|
|
if (disabled) t += ' disabled'
|
|
if (checked) t += ' checked'
|
|
if (isSwitch) t += ' switch'
|
|
t += ' ' + type
|
|
t += ' input'
|
|
t = t.replace(/^\s+/, '')
|
|
t = capitalize(t)
|
|
title = t
|
|
}
|
|
|
|
const labelClasses = ['form-check', inline && 'form-check-inline', isSwitch && 'form-switch', isSwitch && size && `form-switch-${size}`, className]
|
|
|
|
const inputClasses = ['form-check-input', isEmpty && 'position-static']
|
|
---
|
|
|
|
<label class:list={labelClasses}>
|
|
<input class:list={inputClasses} type={type} name={name || undefined} checked={checked} disabled={disabled} />
|
|
{
|
|
titleOn && titleOff ? (
|
|
<Fragment>
|
|
<span class="form-check-label form-check-label-on">{titleOn}</span>
|
|
<span class="form-check-label form-check-label-off">{titleOff}</span>
|
|
</Fragment>
|
|
) : (
|
|
!isEmpty && <span class="form-check-label">{title}</span>
|
|
)
|
|
}
|
|
</label>
|