@lavalogic/scoria 0.40.28 → 0.40.30

package/dist/Components/Table/Body/Rows/ColumnHighlight.svelte

@@ -51,9 +51,9 @@ which reads either "Highlight row N" or "Unhighlight row N" depending on state.
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -68,7 +68,7 @@ which reads either "Highlight row N" or "Unhighlight row N" depending on state.
   height: 100%;
   min-height: var(--height, 3rem);
   box-sizing: border-box;
-  border-right: solid 1px #cbd4da;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
 }
 
@@ -76,8 +76,7 @@ div.wrapper {
   position: absolute;
   top: 0;
   bottom: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   display: flex;
   align-items: stretch;
   justify-content: stretch;

package/dist/Components/Table/Body/Rows/ColumnList.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, IdType extends Primitive"
->import { ColumnType } from "../../Types/Columns/ColumnType.js";
+>import { m as i18n } from "../../../../paraglide/messages.js";
+import { ColumnType } from "../../Types/Columns/ColumnType.js";
 import { TableContext } from "../../Types/Context/TableContext.svelte.js";
 import { getContext } from "svelte";
 import ColumnListRow from "./ColumnListRow.svelte";
@@ -35,7 +36,7 @@ function onDrop(e) {
 		<ColumnListRow {columnDef} />
 	{:else}
 		{#if searchValue.length > 0}
-			<li class="empty-state">No columns match &ldquo;{searchValue}&rdquo;</li>
+			<li class="empty-state">{i18n['scoria.text.no_columns_match']({ query: searchValue })}</li>
 		{/if}
 	{/each}
 </ul>

package/dist/Components/Table/Body/Rows/ColumnListRow.svelte

@@ -8,6 +8,7 @@ import Checkbox from "../../../Checkbox.svelte";
 import ThreeStateRadio from "../../../ThreeStateRadio.svelte";
 import { TableContext } from "../../Types/Context/TableContext.svelte.js";
 import { Size } from "../../../../Types/Internal/Size.js";
+import { m as i18n } from "../../../../paraglide/messages.js";
 import { Ternary } from "../../../../Types/Internal/Ternary.js";
 import { getContext } from "svelte";
 const tableContext = getContext(TableContext.identifier);
@@ -352,9 +353,9 @@ function onRowKeydown(e) {
 					<div class="pin-selector">
 						<ThreeStateRadio
 							value={pinSide}
-							noLabel="Pin to left"
-							neutralLabel="Unpinned"
-							yesLabel="Pin to right"
+							noLabel={i18n['scoria.action.pin_left']()}
+							neutralLabel={i18n['scoria.label.unpinned']()}
+							yesLabel={i18n['scoria.action.pin_right']()}
 							noIcon={{ name: 'pin-left', size: Size.MediumSmall }}
 							neutralIcon={{ name: 'circle-cross', size: Size.MediumSmall }}
 							yesIcon={{ name: 'pin-right', size: Size.MediumSmall }}
@@ -380,7 +381,7 @@ function onRowKeydown(e) {
 					icon={{ name: 'chevron-up', size: Size.Medium }}
 					size={Size.Medium}
 					paddingSize={Size.Small}
-					label="Move {reorderLabel} up"
+					label={i18n['scoria.action.move_column_up']({ name: reorderLabel })}
 					disabled={isAtTop}
 					onclick={moveUp}
 				/>
@@ -388,7 +389,7 @@ function onRowKeydown(e) {
 					icon={{ name: 'chevron-down', size: Size.Medium }}
 					size={Size.Medium}
 					paddingSize={Size.Small}
-					label="Move {reorderLabel} down"
+					label={i18n['scoria.action.move_column_down']({ name: reorderLabel })}
 					disabled={isAtBottom}
 					onclick={moveDown}
 				/>
@@ -491,7 +492,7 @@ li.single-column:not(.anchor):last-of-type {
   padding: 0;
 }
 .pin-selector :global(.radios > label:first-child) {
-  border-left: none;
+  border-inline-start: none;
 }
 
 .column-label {

package/dist/Components/Table/Body/Rows/Columns/ActionsCell.svelte

@@ -175,9 +175,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -225,8 +225,8 @@ $effect(() => {
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 .popup {
@@ -309,8 +309,7 @@ div.slot-wrapper {
   position: absolute;
   top: 0;
   bottom: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/Components/Table/Body/Rows/Columns/BubbleCell.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, FilterValueType, RowIdType extends Primitive"
->import Bubble from "../../../../Bubble.svelte";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import Bubble from "../../../../Bubble.svelte";
 import { BubbleDef } from "../../../Types/Columns/Definitions/Display/BubbleDef.svelte.js";
 import { TableContext } from "../../../Types/Context/TableContext.svelte.js";
 import "../../../Types/Context/TableInitOptions.js";
@@ -102,7 +103,7 @@ $effect(() => {
 				<span
 					class="bubble-overflow"
 					title={overflowTitle}
-				>+{overflowCount} more</span>
+				>{i18n['scoria.text.bubble_overflow']({ count: overflowCount })}</span>
 			{/if}
 		{/await}
 	</div>
@@ -120,9 +121,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -179,8 +180,8 @@ $effect(() => {
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 div.bubble-parent {

package/dist/Components/Table/Body/Rows/Columns/ExpandCell.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, R extends object,FilterValueType, IdType extends Primitive"
->import Action from "../../../../Action.svelte";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import Action from "../../../../Action.svelte";
 import { TableContext } from "../../../Types/Context/TableContext.svelte.js";
 import { devCatch, isValidityTuple } from "../../../../../Helpers/Helpers.svelte.js";
 import { ColourSet } from "../../../../../scss/colours.js";
@@ -104,7 +105,9 @@ $effect(() => {
 			style={focusDetails.outline}
 			disabled={!enabled}
 			border={false}
-			label={cell.column.columnDef.onActivate ? 'Open Related Table' : 'Expand Nested Table'}
+			label={cell.column.columnDef.onActivate
+				? i18n['scoria.action.open_related_table']()
+				: i18n['scoria.action.expand_nested_table']()}
 			size={Size.FillWidth}
 			icon={{
 				name:
@@ -146,9 +149,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -173,8 +176,8 @@ $effect(() => {
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 .focusable.info,
@@ -206,8 +209,7 @@ div.slot-wrapper {
   position: absolute;
   top: 0;
   bottom: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/Components/Table/Body/Rows/Columns/FocusableImmutableCell.svelte

@@ -150,7 +150,7 @@ $effect(() => {
 >
 	{#if hasValue}
 		{#await visibleValue}
-			{loadingText}
+			{loadingText()}
 		{:then v}
 			{(v instanceof Date
 				? v.toLocaleDateString()
@@ -202,9 +202,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -242,8 +242,8 @@ $effect(() => {
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 div.slot-wrapper.multifocus {
@@ -256,8 +256,7 @@ div.slot-wrapper {
   position: absolute;
   top: 0;
   bottom: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/Components/Table/Body/Rows/Columns/ProgressCell.svelte

@@ -92,9 +92,9 @@ const colours = $derived(cell.column.columnDef.getColour(cell.row.original, cell
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -151,8 +151,8 @@ const colours = $derived(cell.column.columnDef.getColour(cell.row.original, cell
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 div.bubble-parent {

package/dist/Components/Table/Body/Rows/Columns/TableAction.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	module
->import Button from "../../../../Button.svelte";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import Button from "../../../../Button.svelte";
 import { getErrorMessage } from "../../../../../Helpers/Helpers.svelte.js";
 import { ColourSet } from "../../../../../scss/colours.js";
 import { Size } from "../../../../../Types/Internal/Size.js";
@@ -47,6 +48,6 @@ const buttonStatePromise = $derived.by(() => {
 	{#if dev}
 		Error Loading Button: {getErrorMessage(e)}
 	{:else}
-		Error Loading Button
+		{i18n['scoria.text.error_loading_button']()}
 	{/if}
 {/await}

package/dist/Components/Table/Body/Rows/Columns/TableCheckbox.svelte

@@ -136,9 +136,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableColumn.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	module
->import { ExpandDef } from "../../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import { ExpandDef } from "../../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js";
 import { DisplayType } from "../../../Types/Columns/DisplayType.js";
 import ActionsCell from "./ActionsCell.svelte";
 import BubbleCell from "./BubbleCell.svelte";
@@ -89,7 +90,7 @@ function isSnippet(value) {
 				<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 				{@debug cell}
 			{/if}
-			Unknown Cell Type
+			{i18n['scoria.text.unknown_cell_type']()}
 		{/if}
 	{:else}
 		{@const valueOrComponentPromise =
@@ -117,14 +118,14 @@ function isSnippet(value) {
 					<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 					{@debug Value}
 				{/if}
-				Unknown Cell or value Type
+				{i18n['scoria.text.unknown_cell_value_type']()}
 			{/if}
 		{:catch e}
 			<FocusableImmutableCell {cell}>
 				{#if dev}
 					{getErrorMessage(e)}
 				{:else}
-					Error rendering cell
+					{i18n['scoria.text.error_rendering_cell']()}
 				{/if}
 			</FocusableImmutableCell>
 		{/await}

package/dist/Components/Table/Body/Rows/Columns/TableDatePicker.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, RowIdType extends Primitive"
->import { dev } from "$app/environment";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import { dev } from "$app/environment";
 import { TableContext } from "../../../Types/Context/TableContext.svelte.js";
 import "../../../Types/Context/TableInitOptions.js";
 import DateModal from "../../../../Touch/DateModal.svelte";
@@ -164,7 +165,9 @@ $effect(() => {
 >
 	{#if modalLock}
 		<DateModal
-			header="Edit {columnDef.header}"
+			header={i18n['scoria.label.edit_column']({
+					name: typeof columnDef.header === 'string' ? columnDef.header : columnDef.id,
+				})}
 			value={dateValue ?? null}
 			showTime={cell.column.columnDef.showTime}
 			cancelEditing={() => {
@@ -191,7 +194,7 @@ $effect(() => {
 	{:else if dev}
 		<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 		{@debug value}
-		Error reading value
+		{i18n['scoria.text.error_reading_value']()}
 	{:else}
 		-
 	{/if}
@@ -209,9 +212,9 @@ $effect(() => {
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableNumberInput.svelte

@@ -170,7 +170,7 @@ $effect(() => editable.attachEditListener(tdref));
 		}}
 	>
 		{#await visibleValue}
-			{loadingText}
+			{loadingText()}
 		{:then value}{value ?? '-'}{/await}
 	</div>
 {/if}
@@ -187,9 +187,9 @@ $effect(() => editable.attachEditListener(tdref));
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableQuerySelect.svelte

@@ -202,7 +202,7 @@ $effect(() => removeKeydownEvent);
 		}}
 	>
 		{#await visibleValue}
-			{loadingText}
+			{loadingText()}
 		{:then v}
 			{v}
 		{/await}
@@ -221,9 +221,9 @@ $effect(() => removeKeydownEvent);
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableRowSelectionCheckbox.svelte

@@ -151,9 +151,9 @@ let inputRef = $state();
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableSelect.svelte

@@ -4,6 +4,7 @@
 	lang="ts"
 	module
 >import { dev } from "$app/environment";
+import { m as i18n } from "../../../../../paraglide/messages.js";
 import SingleSelect from "../../../../SingleSelect.svelte";
 import { TableContext } from "../../../Types/Context/TableContext.svelte.js";
 import "../../../Types/Context/TableInitOptions.js";
@@ -85,11 +86,12 @@ $effect(() => removeKeydownEvent);
 		bind:this={tdref}
 	>
 		{#await Promise.all([optionsPromise, selectValue])}
-			{loadingText}
+			{loadingText()}
 		{:then [options, value]}
 			<SingleSelect
 				focusOnLoad
 				name="Item"
+				placeholder={i18n['scoria.label.select_item']()}
 				valueProp={'value' as never}
 				labelProp={'label' as never}
 				value={(value ?? null) as never}
@@ -130,7 +132,7 @@ $effect(() => removeKeydownEvent);
 				<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 				{@debug e}
 			{/if}
-			could not retrieve options
+			{i18n['scoria.text.options_not_retrieved']()}
 		{/await}
 	</div>
 {:else}
@@ -175,7 +177,7 @@ $effect(() => removeKeydownEvent);
 		}}
 	>
 		{#await visibleValue}
-			{loadingText}
+			{loadingText()}
 		{:then value}
 			{value ?? '-'}
 		{:catch e}
@@ -184,7 +186,7 @@ $effect(() => removeKeydownEvent);
 				<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 				{@debug e}
 			{/if}
-			Could not retrieve options
+			{i18n['scoria.text.options_not_retrieved']()}
 		{/await}
 	</div>
 {/if}
@@ -201,9 +203,9 @@ $effect(() => removeKeydownEvent);
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/TableTextInput.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, FilterValueType, RowIdType extends Primitive"
->import { dev } from "$app/environment";
+>import { m as i18n } from "../../../../../paraglide/messages.js";
+import { dev } from "$app/environment";
 import { TableContext } from "../../../Types/Context/TableContext.svelte.js";
 import "../../../Types/Context/TableInitOptions.js";
 import TextInput from "../../../../TextInput.svelte";
@@ -160,7 +161,7 @@ $effect(() => editable.attachEditListener(tdref));
 		}}
 	>
 		{#await visibleValue}
-			{loadingText}
+			{loadingText()}
 		{:then value}
 			{value}
 		{:catch error}
@@ -169,7 +170,7 @@ $effect(() => editable.attachEditListener(tdref));
 				<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 				{@debug error}
 			{/if}
-			Error getting value
+			{i18n['scoria.text.error_getting_value']()}
 		{/await}
 	</div>
 {/if}
@@ -186,9 +187,9 @@ $effect(() => editable.attachEditListener(tdref));
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;

package/dist/Components/Table/Body/Rows/Columns/ValidityCell.svelte

@@ -178,9 +178,9 @@ const icon = $derived(iconSets[validity]);
   overflow-x: var(--cell-overflow-x, clip);
   text-overflow: ellipsis;
   position: relative;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  border-right: solid 1px #cbd4da;
+  padding-inline-start: 0.75rem;
+  padding-inline-end: 0.75rem;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
   box-sizing: border-box;
   width: 100%;
@@ -205,8 +205,8 @@ const icon = $derived(iconSets[validity]);
   height: var(--height);
   box-sizing: border-box;
   overflow-x: clip;
-  --td-padding-left: 0;
-  --td-padding-right: 0;
+  --td-padding-inline-start: 0;
+  --td-padding-inline-end: 0;
 }
 
 div.slot-wrapper.multifocus {
@@ -219,8 +219,7 @@ div.slot-wrapper {
   position: absolute;
   top: 0;
   bottom: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/Components/Table/Body/Rows/TableRow.svelte

@@ -3,7 +3,8 @@
 <script
 	lang="ts"
 	generics="T extends object, RowIdType extends Primitive"
->import { dev } from "$app/environment";
+>import { m as i18n } from "../../../../paraglide/messages.js";
+import { dev } from "$app/environment";
 import { devCatch, generateWeakId } from "../../../../Helpers/Helpers.svelte.js";
 import { getContext, untrack } from "svelte";
 import NestedTable from "../../NestedTable.svelte";
@@ -209,7 +210,7 @@ function cellWrapStyle(cell) {
 			class="cell expand-cell"
 		>
 			{#await innerDataPromise}
-				loading&hellip;
+				{i18n['scoria.text.loading_inline']()}
 			{:then data}
 				{#if data && data.length}
 					{@const options = expandedColumnDef.innerTableOptions}
@@ -233,9 +234,9 @@ function cellWrapStyle(cell) {
 						/>
 					{/if}
 				{:else if !data}
-					Error Fetching data
+					{i18n['scoria.text.error_fetching_data']()}
 				{:else}
-					No Data
+					{i18n['scoria.text.no_data']()}
 				{/if}
 			{:catch e}
 				{#if dev}
@@ -243,7 +244,7 @@ function cellWrapStyle(cell) {
 					<!-- eslint-disable-next-line svelte/no-at-debug-tags -->
 					{@debug e}
 				{/if}
-				Error Fetching data
+				{i18n['scoria.text.error_fetching_data']()}
 			{/await}
 		</div>
 	</div>

package/dist/Components/Table/Body/TableBody.svelte

@@ -171,7 +171,7 @@ const bottomSpacerHeight = $derived(virtualisation.bottomSpacerHeight);
 }
 
 .datatable-row.quick-filter-row > .cell {
-  border-right: solid 1px #cbd4da;
+  border-inline-end: solid 1px #cbd4da;
   box-sizing: border-box;
 }
 
@@ -190,7 +190,7 @@ const bottomSpacerHeight = $derived(virtualisation.bottomSpacerHeight);
 }
 .datatable-row.quick-filter-row > .highlight-dud {
   background-color: #f4f7f9;
-  border-right: solid 1px #cbd4da;
+  border-inline-end: solid 1px #cbd4da;
   border-bottom: solid 1px #cbd4da;
 }