add rtl and chromatic for testing

.storybook/main.ts

@@ -8,6 +8,7 @@ const config: StorybookConfig = {
     '@chromatic-com/storybook',
     '@storybook/addon-interactions',
     '@storybook/addon-a11y',
+    'storybook-addon-rtl',
   ],
   framework: {
     name: '@storybook/sveltekit',

chromatic.config.json

@@ -0,0 +1,6 @@
+{
+  "onlyChanged": true,
+  "projectId": "Project:64a5c42823795823edcb60f4",
+  "zip": true,
+  "buildScriptName": "build:docs"
+}

package.json

@@ -105,6 +105,7 @@
     "proper-url-join": "^2.1.2",
     "pym.js": "^1.3.2",
     "slugify": "^1.6.6",
+    "storybook-addon-rtl": "^1.1.0",
     "svelte-fa": "^4.0.3",
     "svelte-intersection-observer": "^1.0.0"
   },

pnpm-lock.yaml

@@ -38,6 +38,9 @@ importers:
       slugify:
         specifier: ^1.6.6
         version: 1.6.6
+      storybook-addon-rtl:
+        specifier: ^1.1.0
+        version: 1.1.0
       svelte-fa:
         specifier: ^4.0.3
         version: 4.0.3(svelte@5.28.1)
@@ -3539,6 +3542,9 @@ packages:
   sprintf-js@1.0.3:
     resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
 
+  storybook-addon-rtl@1.1.0:
+    resolution: {integrity: sha512-L8JljF1M+30rcSuM4JjeIi4ZRmg9WZi/1u4T/5/EQvpDKCMOAq7uHeOKj4YS1InC4Zksnz3DrggXmO3mISXKcQ==}
+
   storybook@8.6.12:
     resolution: {integrity: sha512-Z/nWYEHBTLK1ZBtAWdhxC0l5zf7ioJ7G4+zYqtTdYeb67gTnxNj80gehf8o8QY9L2zA2+eyMRGLC2V5fI7Z3Tw==}
     hasBin: true
@@ -8081,6 +8087,8 @@ snapshots:
 
   sprintf-js@1.0.3: {}
 
+  storybook-addon-rtl@1.1.0: {}
+
   storybook@8.6.12(prettier@3.5.3):
     dependencies:
       '@storybook/core': 8.6.12(prettier@3.5.3)(storybook@8.6.12(prettier@3.5.3))

src/components/Table/Table.svelte

@@ -323,6 +323,7 @@
       td {
         @include mixins.text-sm;
         @include mixins.font-regular;
+        font-variant-numeric: tabular-nums;
         vertical-align: top;
         border-bottom: 1px solid
           var(--theme-colour-brand-rules, var(--tr-muted-grey));