Fix Prettier formatting regression and Astro type-check errors

`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.
This commit is contained in:
codecalm
2026-08-03 01:26:19 +02:00
parent 5246f0b6fd
commit f27c70ad38
166 changed files with 9678 additions and 10612 deletions
+32 -44
View File
@@ -1,58 +1,46 @@
---
import site from '@data/site.json';
import CaptureScript from '../components/CaptureScript.astro';
import site from '@data/site.json'
import CaptureScript from '../components/CaptureScript.astro'
interface Props {
value?: string;
id?: string | number;
alpha?: boolean;
format?: string | false;
swatchesOnly?: boolean;
class?: string;
value?: string
id?: string | number
alpha?: boolean
format?: string | false
swatchesOnly?: boolean
class?: string
}
const {
value,
id = 'default',
alpha = false,
format = false,
swatchesOnly,
class: className,
} = Astro.props;
const { value, id = 'default', alpha = false, format = false, swatchesOnly, class: className } = Astro.props
const colors = site.colors as Record<string, { prop: string }>;
const swatchProps = Object.values(colors).map((color) => color.prop);
const colors = site.colors as Record<string, { prop: string }>
const swatchProps = Object.values(colors).map((color) => color.prop)
const colorpickerId = `colorpicker-${id}`;
const colorpickerSelector = `#colorpicker-${id}`;
const colorpickerId = `colorpicker-${id}`
const colorpickerSelector = `#colorpicker-${id}`
---
<input
type="text"
class={`form-control d-block${className ? ` ${className}` : ''}`}
id={colorpickerId}
value={value}
/>
<input type="text" class={`form-control d-block${className ? ` ${className}` : ''}`} id={colorpickerId} value={value} />
<CaptureScript>
<!-- BEGIN COLORPICKER -->
<script define:vars={{ colorpickerId, colorpickerSelector, alpha, format, swatchesOnly, swatchProps }}>
function initColorpicker() {
window.tabler_colorpicker ??= {};
<!-- BEGIN COLORPICKER -->
<script define:vars={{ colorpickerId, colorpickerSelector, alpha, format, swatchesOnly, swatchProps }}>
function initColorpicker() {
window.tabler_colorpicker ??= {}
const swatches = swatchProps.map((prop) => window.getComputedStyle(document.body).getPropertyValue(prop));
const swatches = swatchProps.map((prop) => window.getComputedStyle(document.body).getPropertyValue(prop))
window.Coloris &&
(window.tabler_colorpicker[colorpickerId] = Coloris({
el: colorpickerSelector,
selectInput: false,
alpha,
...(format ? { format } : {}),
...(swatchesOnly ? { swatchesOnly: true } : {}),
swatches,
}));
}
window.Coloris &&
(window.tabler_colorpicker[colorpickerId] = Coloris({
el: colorpickerSelector,
selectInput: false,
alpha,
...(format ? { format } : {}),
...(swatchesOnly ? { swatchesOnly: true } : {}),
swatches,
}))
}
document.readyState !== 'loading' ? initColorpicker() : document.addEventListener('DOMContentLoaded', initColorpicker, { once: true });
</script>
<!-- END COLORPICKER -->
document.readyState !== 'loading' ? initColorpicker() : document.addEventListener('DOMContentLoaded', initColorpicker, { once: true })
</script>
<!-- END COLORPICKER -->
</CaptureScript>