feat: complete Svelte 5 migration across entire application
All checks were successful
CI / update (push) Successful in 2m8s
All checks were successful
CI / update (push) Successful in 2m8s
Migrated all components and routes from Svelte 4 to Svelte 5 syntax:
- Converted export let → $props() with generic type syntax
- Replaced createEventDispatcher → callback props
- Migrated $: reactive statements → $derived() and $effect()
- Updated two-way bindings with $bindable()
- Fixed TypeScript syntax: added lang="ts" to script tags
- Converted inline type annotations to generic parameter syntax
- Updated deprecated event directives to Svelte 5 syntax:
- on:click → onclick
- on:submit → onsubmit
- on:change → onchange
- Converted deprecated <slot> elements → {@render children()}
- Updated slot props to Snippet types
- Fixed season/icon selector components with {#snippet} blocks
- Fixed non-reactive state by converting let → $state()
- Fixed infinite loop in EnhancedBalance by converting $effect → $derived
- Fixed Chart.js integration by converting $state proxies to plain arrays
- Updated cospend dashboard and payment pages with proper reactivity
- Migrated 20+ route files from export let data → $props()
- Fixed TypeScript type annotations in page components
- Updated reactive statements in error and cospend routes
- Removed invalid onchange attribute from Toggle component
- Fixed modal ID isolation in CreateIngredientList/CreateStepList
- Fixed dark mode button visibility in TranslationApproval
- Build now succeeds with zero deprecation warnings
All functionality tested and working. No breaking changes to user experience.
This commit is contained in:
88
src/lib/components/prayers/Angelus.svelte
Normal file
88
src/lib/components/prayers/Angelus.svelte
Normal file
@@ -0,0 +1,88 @@
|
||||
<script>
|
||||
import Prayer from './Prayer.svelte';
|
||||
import AveMaria from './AveMaria.svelte';
|
||||
</script>
|
||||
|
||||
<Prayer>
|
||||
<!-- First Versicle and Response -->
|
||||
<p>
|
||||
<v lang="la"><i>℣.</i> Angelus Domini nuntiavit Mariae.</v>
|
||||
<v lang="de"><i>℣.</i> Der Engel des Herrn brachte Maria die Botschaft</v>
|
||||
<v lang="en"><i>℣.</i> The Angel of the Lord declared unto Mary.</v>
|
||||
<v lang="la"><i>℟.</i> Et concepit de Spiritu Sancto.</v>
|
||||
<v lang="de"><i>℟.</i> und sie empfing vom Heiligen Geist.</v>
|
||||
<v lang="en"><i>℟.</i> And she conceived of the Holy Spirit.</v>
|
||||
</p>
|
||||
</Prayer>
|
||||
|
||||
<!-- First Hail Mary -->
|
||||
<AveMaria />
|
||||
|
||||
<Prayer>
|
||||
<!-- Second Versicle and Response -->
|
||||
<p>
|
||||
<v lang="la"><i>℣.</i> Ecce ancilla Domini,</v>
|
||||
<v lang="de"><i>℣.</i> Maria sprach: Siehe, ich bin die Magd des Herrn</v>
|
||||
<v lang="en"><i>℣.</i> Behold the handmaid of the Lord.</v>
|
||||
<v lang="la"><i>℟.</i> Fiat mihi secundum verbum tuum.</v>
|
||||
<v lang="de"><i>℟.</i> mir geschehe nach Deinem Wort.</v>
|
||||
<v lang="en"><i>℟.</i> Be it done unto me according to thy word.</v>
|
||||
</p>
|
||||
</Prayer>
|
||||
|
||||
<!-- Second Hail Mary -->
|
||||
<AveMaria />
|
||||
|
||||
<Prayer>
|
||||
<!-- Third Versicle and Response -->
|
||||
<p>
|
||||
<v lang="la"><i>℣.</i> Et Verbum caro factum est,</v>
|
||||
<v lang="de"><i>℣.</i> Und das Wort ist Fleisch geworden</v>
|
||||
<v lang="en"><i>℣.</i> And the Word was made flesh.</v>
|
||||
<v lang="la"><i>℟.</i> Et habitavit in nobis.</v>
|
||||
<v lang="de"><i>℟.</i> und hat unter uns gewohnt.</v>
|
||||
<v lang="en"><i>℟.</i> And dwelt among us.</v>
|
||||
</p>
|
||||
</Prayer>
|
||||
|
||||
<!-- Third Hail Mary -->
|
||||
<AveMaria />
|
||||
|
||||
<Prayer>
|
||||
<!-- Fourth Versicle and Response -->
|
||||
<p>
|
||||
<v lang="la"><i>℣.</i> Ora pro nobis, sancta Dei Genetrix,</v>
|
||||
<v lang="de"><i>℣.</i> Bitte für uns Heilige Gottesmutter</v>
|
||||
<v lang="en"><i>℣.</i> Pray for us, O holy Mother of God.</v>
|
||||
<v lang="la"><i>℟.</i> Ut digni efficiamur promissionibus Christi.</v>
|
||||
<v lang="de"><i>℟.</i> auf dass wir würdig werden der Verheißungen Christi.</v>
|
||||
<v lang="en"><i>℟.</i> That we may be made worthy of the promises of Christ.</v>
|
||||
</p>
|
||||
|
||||
<!-- Closing Prayer -->
|
||||
<p>
|
||||
<v lang="la"><i>℣.</i> Oremus.</v>
|
||||
<v lang="de"><i>℣.</i> Lasset uns beten.</v>
|
||||
<v lang="en"><i>℣.</i> Let us pray:</v>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<v lang="la">
|
||||
Gratiam tuam, quaesumus, Domine, mentibus nostris infunde; ut qui, Angelo nuntiante,
|
||||
Christi Filii tui incarnationem cognovimus, per passionem eius et crucem ad
|
||||
resurrectionis gloriam perducamur. Per eumdem Christum Dominum nostrum. Amen.
|
||||
</v>
|
||||
<v lang="de">
|
||||
Allmächtiger Gott, gieße deine Gnade in unsere Herzen ein. Durch die Botschaft des
|
||||
Engels haben wir die Menschwerdung Christi, deines Sohnes, erkannt. Lass uns durch
|
||||
sein Leiden und Kreuz zur Herrlichkeit der Auferstehung gelangen. Darum bitten wir
|
||||
durch Christus, unseren Herrn. Amen.
|
||||
</v>
|
||||
<v lang="en">
|
||||
Pour forth, we beseech Thee, O Lord, Thy grace into our hearts, that we to whom the
|
||||
Incarnation of Christ Thy Son was made known by the message of an angel, may by His
|
||||
Passion and Cross be brought to the glory of His Resurrection. Through the same Christ
|
||||
Our Lord. Amen.
|
||||
</v>
|
||||
</p>
|
||||
</Prayer>
|
||||
@@ -1,8 +1,7 @@
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import Prayer from './Prayer.svelte';
|
||||
|
||||
export let mystery = ""; // For rosary mysteries (German)
|
||||
export let mysteryLatin = ""; // For rosary mysteries (Latin)
|
||||
let { mystery = "", mysteryLatin = "" } = $props<{ mystery?: string, mysteryLatin?: string }>();
|
||||
</script>
|
||||
|
||||
<Prayer>
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import type { Snippet } from 'svelte';
|
||||
import { getLanguageContext } from '$lib/contexts/languageContext.js';
|
||||
|
||||
export let latinPrimary = true; // Controls which language is shown prominently
|
||||
let { latinPrimary = true, children } = $props<{ latinPrimary?: boolean, children?: Snippet }>();
|
||||
|
||||
// Get context if available (graceful fallback for standalone usage)
|
||||
let showLatinStore;
|
||||
@@ -12,7 +13,7 @@
|
||||
showLatinStore = null;
|
||||
}
|
||||
|
||||
$: showLatin = showLatinStore ? $showLatinStore : true;
|
||||
let showLatin = $derived(showLatinStore ? $showLatinStore : true);
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@@ -123,5 +124,5 @@
|
||||
</style>
|
||||
|
||||
<div class="prayer-wrapper" class:german-primary={!latinPrimary} class:monolingual={!showLatin}>
|
||||
<slot></slot>
|
||||
{@render children?.()}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user